:root{
  --paper:#f1efe6;
  --panel:#fbfaf5;
  --panel-2:#eae6d8;
  --line:#d9d3bf;
  --ink:#182219;
  --ink-soft:#4d5a4f;
  --brand:#1f4d3a;
  --brand-strong:#123326;
  --brand-tint:#e3ece5;
  --navy:#28345c;
  --gold:#96690f;
  --gold-tint:#f3e6cd;
  --rust:#9c4327;
  --rust-tint:#f4e1d8;
  --good:#276a45;
  --shadow: 0 1px 0 rgba(24,34,25,.04);
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#111813;
    --panel:#161f18;
    --panel-2:#1d271e;
    --line:#2b3a2c;
    --ink:#e9ecdf;
    --ink-soft:#aab3a2;
    --brand:#5fa87e;
    --brand-strong:#7fc39a;
    --brand-tint:#1a2b21;
    --navy:#8b9bd6;
    --gold:#d9a63f;
    --gold-tint:#2b2415;
    --rust:#e08862;
    --rust-tint:#2e1d16;
    --good:#6cbf8f;
    color-scheme: dark;
  }
}
:root[data-theme="dark"]{
  --paper:#111813;
  --panel:#161f18;
  --panel-2:#1d271e;
  --line:#2b3a2c;
  --ink:#e9ecdf;
  --ink-soft:#aab3a2;
  --brand:#5fa87e;
  --brand-strong:#7fc39a;
  --brand-tint:#1a2b21;
  --navy:#8b9bd6;
  --gold:#d9a63f;
  --gold-tint:#2b2415;
  --rust:#e08862;
  --rust-tint:#2e1d16;
  --good:#6cbf8f;
  color-scheme: dark;
}

*{ box-sizing:border-box; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing:antialiased;
  padding-inline:16px;
  padding-block:28px 60px;
}
h1,h2,h3{ font-family:"Newsreader", Georgia, serif; text-wrap:balance; margin:0; }
.num{ font-family:"IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; }

.shell{ max-width:920px; margin:0 auto; display:flex; flex-direction:column; gap:22px; }

/* header */
.masthead{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; border-bottom:1px solid var(--line); padding-bottom:16px; }
.brand{ display:flex; align-items:baseline; gap:10px; }
.brand .mark{ font-size:1.9rem; font-weight:600; letter-spacing:-0.01em; }
.brand .mark em{ font-style:normal; color:var(--brand); }
.tagline{ color:var(--ink-soft); font-size:.86rem; max-width:30ch; }
.masthead-meta{ text-align:right; font-size:.78rem; color:var(--ink-soft); line-height:1.5; }

/* tabs */
.tabbar{ display:flex; gap:6px; flex-wrap:wrap; }
.tabbar button{
  font:inherit; font-size:.86rem; font-weight:500; color:var(--ink-soft);
  background:var(--panel-2); border:1px solid var(--line); border-bottom-width:3px;
  padding:9px 14px; border-radius:8px 8px 4px 4px; cursor:pointer;
}
.tabbar button[aria-selected="true"]{
  color:var(--brand-strong); background:var(--brand-tint); border-color:var(--brand);
  border-bottom-color:var(--brand);
}
.tabbar button:focus-visible{ outline:2px solid var(--navy); outline-offset:2px; }

.tool{ display:flex; flex-direction:column; gap:16px; }
.tool-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.tool-head h2{ font-size:1.3rem; font-weight:500; }
.tool-head p{ margin:2px 0 0; color:var(--ink-soft); font-size:.85rem; max-width:52ch; }

.grid{ display:grid; grid-template-columns: minmax(240px,320px) 1fr; gap:16px; align-items:start; }
@media (max-width:700px){ .grid{ grid-template-columns:1fr; } }

.card{ background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:18px; box-shadow:var(--shadow); }
.card h3{ font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); margin-bottom:14px; font-family:"IBM Plex Sans"; }

.field{ display:flex; flex-direction:column; gap:5px; margin-bottom:14px; }
.field:last-child{ margin-bottom:0; }
.field label{ font-size:.8rem; color:var(--ink-soft); display:flex; justify-content:space-between; gap:8px; }
.field input[type="number"], .field select{
  font:inherit; font-size:.95rem; color:var(--ink); background:var(--panel-2);
  border:1px solid var(--line); border-radius:6px; padding:8px 10px; width:100%;
}
.field input[type="range"]{ width:100%; accent-color:var(--brand); }
.field .hint{ font-size:.72rem; color:var(--ink-soft); }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.segmented{ display:flex; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.segmented button{ flex:1; font:inherit; font-size:.82rem; padding:7px 6px; background:var(--panel-2); border:none; color:var(--ink-soft); cursor:pointer; }
.segmented button.active{ background:var(--brand); color:#fff; }
.toggle{ display:flex; align-items:center; gap:8px; font-size:.85rem; }
.toggle input{ accent-color:var(--brand); width:15px; height:15px; }

.stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
.stat{ background:var(--panel); padding:14px 16px; display:flex; flex-direction:column; gap:4px; }
.stat .label{ font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); }
.stat .value{ font-size:1.4rem; font-weight:600; }
.stat .value.brand{ color:var(--brand-strong); }
.stat .value.gold{ color:var(--gold); }
.stat .sub{ font-size:.74rem; color:var(--ink-soft); }

.note{ font-size:.78rem; padding:10px 12px; border-radius:8px; border:1px solid var(--line); background:var(--panel-2); color:var(--ink-soft); }
.note.rust{ border-color:var(--rust); background:var(--rust-tint); color:var(--rust); }
.note.good{ border-color:var(--good); background:var(--brand-tint); color:var(--good); }

table{ width:100%; border-collapse:collapse; font-size:.82rem; }
th,td{ text-align:right; padding:6px 8px; border-bottom:1px solid var(--line); }
th:first-child, td:first-child{ text-align:left; }
thead th{ color:var(--ink-soft); font-weight:500; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; }
.table-wrap{ max-height:260px; overflow:auto; border:1px solid var(--line); border-radius:8px; }
.table-wrap table{ font-family:"IBM Plex Mono"; }
.table-wrap thead{ position:sticky; top:0; background:var(--panel-2); font-family:"IBM Plex Sans"; }

.ltv-scale{ display:flex; border-radius:8px; overflow:hidden; border:1px solid var(--line); height:34px; }
.ltv-scale div{ flex:1; display:flex; align-items:center; justify-content:center; font-size:.68rem; color:var(--ink-soft); border-right:1px solid var(--line); position:relative; }
.ltv-scale div:last-child{ border-right:none; }
.ltv-scale div.hit{ background:var(--brand-tint); color:var(--brand-strong); font-weight:600; }

footer{ border-top:1px solid var(--line); padding-top:14px; font-size:.74rem; color:var(--ink-soft); display:flex; flex-direction:column; gap:4px; }
footer a{ color:var(--navy); }
footer .legal-links{ display:flex; gap:14px; flex-wrap:wrap; }
footer .legal-links a{ color:var(--ink-soft); text-decoration:underline; }

[hidden]{ display:none !important; }

@media (prefers-reduced-motion:no-preference){
  .tool{ animation: fade .25s ease; }
}
@keyframes fade{ from{opacity:0; transform:translateY(3px);} to{opacity:1; transform:none;} }

/* simple content pages (privacy, terms) */
.doc{ display:flex; flex-direction:column; gap:16px; }
.doc h1{ font-size:1.7rem; font-weight:500; }
.doc h2{ font-size:1.05rem; font-weight:600; font-family:"IBM Plex Sans"; margin-top:8px; }
.doc p, .doc li{ font-size:.92rem; line-height:1.6; color:var(--ink-soft); max-width:65ch; }
.doc strong{ color:var(--ink); }
.doc .updated{ font-size:.78rem; color:var(--ink-soft); }
.back-link{ font-size:.85rem; }
.back-link a{ color:var(--navy); }