@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700;9..144,900&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --ink:#132B22;
  --ink-light:#1E3D30;
  --ink-soft:#2A4D3C;
  --paper:#EFEAD8;
  --paper-dark:#E3DCC3;
  --paper-darker:#D8CFAE;
  --brass:#B08D3E;
  --brass-light:#C9A648;
  --income:#3E7A5B;
  --expense:#A8452F;
  --line:#C9BFA0;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',ui-sans-serif,system-ui,sans-serif;
  background-color:var(--paper);
  color:var(--ink);
}
.font-display{font-family:'Fraunces',serif; font-optical-sizing:auto;}
.font-mono{font-family:'IBM Plex Mono',ui-monospace,monospace;}

/* Paper grain texture */
.paper-texture{
  background-image:
    radial-gradient(circle at 1px 1px, rgba(19,43,34,0.055) 1px, transparent 0);
  background-size: 18px 18px;
}

.ink-texture{
  background-image:
    radial-gradient(circle at 1px 1px, rgba(239,234,216,0.045) 1px, transparent 0);
  background-size: 16px 16px;
}

/* Ledger rule lines */
.ledger-rules{
  background-image: repeating-linear-gradient(
    to bottom,
    transparent, transparent 43px,
    var(--line) 43px, var(--line) 44px
  );
}

/* Dot leader between label and value, like an old ledger line-item */
.dot-leader{
  flex:1;
  border-bottom:2px dotted var(--paper-darker);
  margin:0 .6em;
  transform:translateY(-4px);
  min-width:16px;
}
.dot-leader.on-ink{ border-bottom-color: rgba(239,234,216,0.28); }

/* Ledger tab (used in sidebar / section switches) */
.ledger-tab{
  position:relative;
  transition: all .18s ease;
}
.ledger-tab::before{
  content:"";
  position:absolute; left:0; top:8px; bottom:8px; width:3px;
  background:var(--brass);
  border-radius:0 2px 2px 0;
  transform:scaleY(0);
  transition:transform .18s ease;
  transform-origin:center;
}
.ledger-tab.active::before{ transform:scaleY(1); }
.ledger-tab.active{ background:rgba(176,141,62,0.10); color:var(--brass-light); }

/* Custom scrollbar */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--paper-darker);border-radius:8px}
.ink-scroll::-webkit-scrollbar-thumb{background:#2A4D3C}

/* Focus ring */
:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }

/* Stamp badge */
.stamp{
  border:2px solid currentColor;
  border-radius:999px;
  transform:rotate(-6deg);
}

/* Card lift */
.card-lift{ transition: transform .15s ease, box-shadow .15s ease; }
.card-lift:hover{ transform:translateY(-2px); box-shadow: 0 10px 24px -12px rgba(19,43,34,0.35); }

/* Counting number animation container */
.tabular{ font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior:auto !important; }
}

/* Simple fade/slide utility for JS-toggled sections */
.gc-enter{ animation: gcEnter .28s ease both; }
@keyframes gcEnter{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);} }

/* Modal backdrop */
.gc-backdrop{ backdrop-filter: blur(2px); background: rgba(19,43,34,0.45); }

/* Toast */
.gc-toast{ animation: gcToastIn .25s ease both; }
@keyframes gcToastIn{ from{opacity:0; transform:translateY(8px) scale(.98);} to{opacity:1; transform:translateY(0) scale(1);} }