/* =====================================================================
   MERIDIAN — Tri-Country Tax (NRI Assist)
   Cartographic-precision system, extended to three jurisdictions.
   Bone paper + navy ink. Country-coded accents:
     India = saffron · US = cobalt · Canada = maple · Cross-border = teal
   Newsreader (display) + Archivo (UI) + IBM Plex Mono (figures).
   The triangulation motif (IN·US·CA) replaces the single 49°N line.
   ===================================================================== */

:root {
  --paper:    #F4F1E9;
  --paper-2:  #ECE7DB;
  --card:     #FCFAF4;
  --card-2:   #F2EEE3;
  --ink:      #16243B;
  --ink-2:    #4A5A72;
  --ink-3:    #8A93A1;
  --rule:     #D8D1C0;
  --rule-2:   #C6BEA9;

  /* primary action */
  --accent:   #1F46E0;
  --accent-2: #1736B4;
  --accent-soft: #E4E8FB;

  /* jurisdiction palette */
  --in:       #C9781A;   /* India — saffron/marigold */
  --in-soft:  #F6E9D4;
  --us:       #1F46E0;   /* United States — cobalt */
  --us-soft:  #E4E8FB;
  --ca:       #C1392B;   /* Canada — maple red */
  --ca-soft:  #F7E2DE;
  --xb:       #1E6E72;   /* cross-border / DTAA — teal */
  --xb-soft:  #DCEAEA;

  --claret:   #B6362B;
  --claret-soft: #F6E4E1;
  --amber:    #B07A12;
  --sage:     #3E7A4E;

  --maxw: 1120px;
  --maxw-narrow: 760px;
  --r-s: 7px;
  --r-m: 11px;
  --r-l: 18px;
  --pad: 26px;

  --font-display: "Newsreader", Georgia, serif;
  --font-ui: "Archivo", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", monospace;

  --shadow-card: 0 1px 0 var(--rule), 0 14px 34px -26px rgba(22,36,59,.34);
  --dur: .26s;
  --ease: cubic-bezier(.22,.61,.36,1);
  color-scheme: light;
}

[data-theme="ink"] {
  --paper:    #0E1726; --paper-2:#0A111D; --card:#16233A; --card-2:#1C2C46;
  --ink:#EDEBE2; --ink-2:#A8B4C6; --ink-3:#6E7C92; --rule:#29395A; --rule-2:#34466B;
  --accent:#6F8CFF; --accent-2:#93A8FF; --accent-soft:#1B2C4E;
  --in:#E0A24E; --in-soft:#352918; --us:#6F8CFF; --us-soft:#1B2C4E;
  --ca:#E68476; --ca-soft:#37211D; --xb:#6FC2C6; --xb-soft:#14302F;
  --claret:#E98A7F; --claret-soft:#3A2220; --amber:#E0B45A; --sage:#79C089;
  --shadow-card: 0 1px 0 rgba(255,255,255,.03), 0 20px 44px -28px rgba(0,0,0,.7);
  color-scheme: dark;
}

[data-theme="slate"] {
  --paper:#EEF1F4; --paper-2:#E3E8ED; --card:#FFFFFF; --card-2:#F1F4F7;
  --ink:#18222E; --ink-2:#4D5A68; --ink-3:#8A95A1; --rule:#DCE2E8; --rule-2:#C7D0D8;
  --in:#B96E16; --in-soft:#F3E7D6; --xb:#1E6E72;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0; font-family: var(--font-ui); background: var(--paper); color: var(--ink);
  font-size: 16px; line-height: 1.5; -webkit-font-smoothing: antialiased;
  background-image: linear-gradient(var(--rule) 1px, transparent 1px);
  background-size: 100% 88px; background-position: 0 -1px; background-attachment: fixed;
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.density-compact { --pad: 18px; }
.density-comfy   { --pad: 34px; }
::selection { background: var(--accent); color: #fff; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.wrap-narrow { max-width: var(--maxw-narrow); margin: 0 auto; padding: 0 24px; }

/* ---------- top bar ---------- */
.top {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in srgb, var(--paper) 86%, transparent);
  backdrop-filter: saturate(1.2) blur(10px); border-bottom: 1px solid var(--rule);
}
.top .wrap { display: flex; align-items: center; justify-content: space-between; height: 62px; }
.brand { display: flex; align-items: baseline; gap: 12px; letter-spacing: -.01em; flex-shrink: 0; }
.brand .mark {
  font-family: var(--font-mono); font-size: 11px; font-weight: 600; color: var(--accent);
  border: 1px solid var(--accent); padding: 2px 6px; border-radius: 4px; letter-spacing: .02em;
  position: relative; top: -2px; white-space: nowrap;
}
.brand .name { font-family: var(--font-display); font-size: 23px; font-weight: 560; }
.brand .sub { font-size: 12px; color: var(--ink-3); letter-spacing: .02em; white-space: nowrap;
  padding-left: 12px; border-left: 1px solid var(--rule-2); }
@media (max-width: 560px) { .brand .sub { display: none; } }
.top-meta { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); letter-spacing: .03em;
  display: flex; align-items: center; gap: 12px; }
.flag-dots { display: inline-flex; gap: 5px; }
.flag-dots i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.flag-dots .d-in { background: var(--in); }
.flag-dots .d-us { background: var(--us); }
.flag-dots .d-ca { background: var(--ca); }

/* ---------- buttons ---------- */
.btn {
  font-family: var(--font-ui); font-size: 15px; font-weight: 600; border: 1px solid transparent;
  border-radius: var(--r-m); padding: 13px 20px; cursor: pointer; transition: all var(--dur) var(--ease);
  display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px;
}
.btn.primary { background: var(--accent); color: #fff; box-shadow: 0 1px 0 var(--accent-2); }
.btn.primary:hover { background: var(--accent-2); transform: translateY(-1px); }
.btn.ghost { background: transparent; color: var(--ink-2); border-color: var(--rule-2); }
.btn.ghost:hover { color: var(--ink); border-color: var(--ink-3); }
.btn.cta { background: var(--accent); color: #fff; width: 100%; font-size: 16px;
  box-shadow: 0 2px 0 var(--accent-2), 0 18px 30px -18px var(--accent); }
.btn.cta:hover { background: var(--accent-2); transform: translateY(-1px); }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }

.card { background: var(--card); border: 1px solid var(--rule); border-radius: var(--r-l);
  padding: var(--pad); box-shadow: var(--shadow-card); }

/* ---------- hero ---------- */
.hero { padding: 56px 0 26px; position: relative; }
.eyebrow {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 20px; display: flex; align-items: center; gap: 14px;
}
.eyebrow .coords { color: var(--ink-3); display: inline-flex; gap: 12px; }
.eyebrow .coords b { font-weight: 500; }
.eyebrow .coords .c-in { color: var(--in); }
.eyebrow .coords .c-us { color: var(--us); }
.eyebrow .coords .c-ca { color: var(--ca); }
.eyebrow .line { flex: 1; height: 1px;
  background-image: repeating-linear-gradient(90deg, var(--rule-2) 0 6px, transparent 6px 12px); }

.hero h1 {
  font-family: var(--font-display); font-weight: 420; font-size: clamp(34px, 5.6vw, 58px);
  line-height: 1.04; letter-spacing: -.02em; margin: 0 0 18px; max-width: 18ch; text-wrap: balance;
}
.hero h1 em { font-style: italic; color: var(--accent); }
.hero .lede { font-size: 19px; color: var(--ink-2); max-width: 56ch; margin: 0 0 26px; line-height: 1.55; }
.trust { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-bottom: 28px; }
.trust span { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-2);
  display: inline-flex; align-items: center; gap: 8px; }
.trust span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--xb); }
.hero-cta { max-width: 400px; }
.hero-foot { margin-top: 14px; font-size: 13px; color: var(--ink-3); }

/* feature strip */
.feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--rule);
  border: 1px solid var(--rule); border-radius: var(--r-l); overflow: hidden; margin-top: 40px; }
@media (max-width: 760px) { .feats { grid-template-columns: 1fr; } }
.feat { background: var(--card); padding: 24px; position: relative; }
.feat .n { font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; }
.feat.f-in .n { color: var(--in); } .feat.f-us .n { color: var(--us); } .feat.f-ca .n { color: var(--xb); }
.feat h3 { font-family: var(--font-display); font-weight: 500; font-size: 20px; margin: 12px 0 8px; }
.feat p { font-size: 14px; color: var(--ink-2); margin: 0; line-height: 1.55; }

/* country legend chip row */
.legend { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.jchip { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .04em; padding: 5px 11px;
  border-radius: 30px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--rule-2); color: var(--ink-2); }
.jchip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; }
.jchip.j-in::before { background: var(--in); } .jchip.j-us::before { background: var(--us); }
.jchip.j-ca::before { background: var(--ca); } .jchip.j-xb::before { background: var(--xb); }

/* ---------- progress ---------- */
.progress { position: sticky; top: 62px; z-index: 30; background: var(--paper);
  border-bottom: 1px solid var(--rule); padding: 14px 0; margin-bottom: 26px; }
.progress .wrap-narrow { display: flex; align-items: center; gap: 16px; }
.steps { display: flex; gap: 7px; flex: 1; }
.steps .dot { flex: 1; height: 5px; border-radius: 3px; background: var(--rule-2); transition: background var(--dur) var(--ease); }
.steps .dot.on { background: var(--accent); }
.progress .lbl { font-family: var(--font-mono); font-size: 12px; color: var(--ink-2); white-space: nowrap; letter-spacing: .03em; }

/* ---------- form ---------- */
.steplabel { font-family: var(--font-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; }
.steplabel .jtag { font-size: 10px; }
.step h2 { font-family: var(--font-display); font-weight: 460; font-size: 30px; letter-spacing: -.01em; margin: 0 0 6px; }
.step .sub { color: var(--ink-2); font-size: 15px; margin: 0 0 24px; }

.field { margin-bottom: 22px; }
.field > label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 9px; letter-spacing: -.005em; }
.field .hint { font-size: 12.5px; color: var(--ink-3); margin-top: 7px; line-height: 1.45; }
.field .cur { font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); }

.row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
@media (max-width: 620px) { .row, .row3 { grid-template-columns: 1fr; } }

input[type="number"], input[type="text"], select, textarea {
  width: 100%; font-family: var(--font-ui); font-size: 15.5px; color: var(--ink); background: var(--paper);
  border: 1px solid var(--rule-2); border-radius: var(--r-s); padding: 12px 13px;
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
input[type="number"] { font-family: var(--font-mono); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
input::placeholder, textarea::placeholder { color: var(--ink-3); }
select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238A93A1' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 13px center; padding-right: 34px; }

.subfield label { font-weight: 500; font-size: 13.5px; display: flex; align-items: center; gap: 8px; margin-bottom: 7px; }
.subfield input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--accent); flex-shrink: 0; }

.toggle { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.toggle button { font-family: var(--font-ui); font-size: 14px; font-weight: 550; color: var(--ink-2);
  background: var(--card-2); border: 1px solid var(--rule-2); border-radius: var(--r-s);
  padding: 10px 15px; cursor: pointer; transition: all var(--dur) var(--ease); min-height: 44px; }
.toggle button:hover { border-color: var(--ink-3); color: var(--ink); }
.toggle button.sel { background: var(--accent); color: #fff; border-color: var(--accent); }

.collapse { overflow: hidden; transition: grid-template-rows var(--dur) var(--ease); display: grid; grid-template-rows: 0fr; }
.collapse.open { grid-template-rows: 1fr; }
.collapse > .inner { min-height: 0; }
.collapse.open > .inner { padding-top: 4px; }
.inset { background: var(--card-2); border: 1px solid var(--rule); border-radius: var(--r-m); padding: 16px 18px; margin-top: 8px; }
.inset.j-in { border-left: 3px solid var(--in); }
.inset.j-re { border-left: 3px solid var(--in); }

/* grouped account block */
.acctblock { border: 1px solid var(--rule); border-radius: var(--r-m); padding: 16px 18px; margin-bottom: 14px; background: var(--card); }
.acctblock .ah { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.acctblock .ah .nm { font-weight: 650; font-size: 14.5px; display: flex; align-items: center; gap: 9px; }
.acctblock .ah .tag { font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 20px; background: var(--in-soft); color: var(--in); }
.acctblock .ah .tag.exempt { background: var(--xb-soft); color: var(--xb); }
.acctblock .body { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 620px) { .acctblock .body { grid-template-columns: 1fr; } }
.acctblock.off .body { display: none; }
.acctblock.off { opacity: .62; }
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.switch input { width: 17px; height: 17px; accent-color: var(--in); }

.btnrow { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 30px; }

/* ===================================================================
   RESULTS — two-column (numbers | checklist)
   =================================================================== */
.results-head { margin: 6px 0 6px; }
.results-head h2 { font-family: var(--font-display); font-weight: 440; font-size: 33px;
  letter-spacing: -.01em; margin: 4px 0 12px; line-height: 1.08; }
.profile-chip { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.profile-chip .pc { font-family: var(--font-mono); font-size: 12px; color: var(--ink-2);
  background: var(--card-2); border: 1px solid var(--rule); border-radius: 30px; padding: 6px 13px; }

.results-grid { display: grid; grid-template-columns: 1.02fr 0.98fr; gap: 28px; align-items: start; margin-top: 22px; }
@media (max-width: 940px) { .results-grid { grid-template-columns: 1fr; gap: 8px; } }
.col-sticky { position: sticky; top: 86px; }
@media (max-width: 940px) { .col-sticky { position: static; } }

.colhead { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-3); margin: 0 0 14px; display: flex; align-items: center; gap: 10px; }
.colhead .line { flex: 1; height: 1px; background: var(--rule); }

/* headline combined number */
.headline { background: var(--card); border: 1px solid var(--rule); border-radius: var(--r-l);
  padding: 22px 24px; box-shadow: var(--shadow-card); margin-bottom: 14px; }
.headline .k { font-size: 13px; color: var(--ink-2); font-weight: 600; }
.headline .big { font-family: var(--font-mono); font-size: 40px; font-weight: 500; letter-spacing: -.025em;
  margin: 8px 0 4px; line-height: 1; }
.headline .eff { font-size: 12.5px; color: var(--ink-3); }
.headline .bar { display: flex; height: 9px; border-radius: 6px; overflow: hidden; margin: 16px 0 10px; background: var(--paper-2); }
.headline .bar i { display: block; height: 100%; }
.headline .bar i.s-in { background: var(--in); } .headline .bar i.s-us { background: var(--us); }
.headline .bar i.s-ca { background: var(--ca); } .headline .bar i.s-xb { background: var(--xb); }
.headline .barkey { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.headline .barkey span { font-size: 11.5px; color: var(--ink-2); display: inline-flex; align-items: center; gap: 6px; }
.headline .barkey i { width: 9px; height: 9px; border-radius: 2px; }
.barkey i.s-in { background: var(--in); } .barkey i.s-us { background: var(--us); }
.barkey i.s-ca { background: var(--ca); } .barkey i.s-xb { background: var(--xb); }

/* per-country metric cards */
.metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--rule);
  border: 1px solid var(--rule); border-radius: var(--r-l); overflow: hidden; margin-bottom: 14px; }
.metric { background: var(--card); padding: 18px 18px; position: relative; }
.metric .tick { position: absolute; top: 0; left: 0; width: 3px; height: 100%; }
.metric.j-in .tick { background: var(--in); } .metric.j-us .tick { background: var(--us); }
.metric.j-ca .tick { background: var(--ca); } .metric.j-xb .tick { background: var(--xb); }
.metric .lab { font-size: 12.5px; color: var(--ink-2); font-weight: 600; display: flex; align-items: center; gap: 8px; }
.metric .val { font-family: var(--font-mono); font-size: 24px; font-weight: 500; letter-spacing: -.02em; margin: 9px 0 4px; }
.metric .ctx { font-size: 11.5px; color: var(--ink-3); line-height: 1.4; }
.metric.refund .val { color: var(--sage); }
.metric.due .val { color: var(--claret); }

/* calc breakdown (per country, collapsible) */
.calc { margin-bottom: 12px; border: 1px solid var(--rule); border-radius: var(--r-m); background: var(--card); overflow: hidden; }
.calc summary { cursor: pointer; padding: 14px 16px; font-weight: 600; font-size: 13.5px; list-style: none;
  display: flex; align-items: center; gap: 10px; }
.calc summary::-webkit-details-marker { display: none; }
.calc summary .jdot { width: 9px; height: 9px; border-radius: 50%; }
.calc summary .jdot.j-in { background: var(--in); } .calc summary .jdot.j-us { background: var(--us); }
.calc summary .jdot.j-ca { background: var(--ca); }
.calc summary .ar { margin-left: auto; font-family: var(--font-mono); color: var(--ink-3); font-size: 17px; }
.calc[open] summary .ar::after { content: "–"; } .calc summary .ar::after { content: "+"; }
.calc-body { padding: 2px 16px 16px; }
.calcline { display: flex; justify-content: space-between; align-items: center; gap: 14px;
  padding: 8px 0; border-bottom: 1px dotted var(--rule); font-size: 13.5px; }
.calcline:last-child { border-bottom: none; }
.calcline .lbl { color: var(--ink-2); }
.calcline .amt { font-family: var(--font-mono); font-size: 13.5px; color: var(--ink); white-space: nowrap; }
.calcline.tot { font-weight: 600; } .calcline.tot .lbl { color: var(--ink); }
.calcline .editamt { width: 116px; text-align: right; font-family: var(--font-mono); font-size: 13px; padding: 6px 9px; border-radius: 6px; }
.calcline .editamt.changed { border-color: var(--accent); background: var(--accent-soft); }
.calc .note { font-size: 12px; color: var(--ink-3); margin-top: 10px; line-height: 1.5; }

/* DTAA explainer */
.dtaa { background: var(--xb-soft); border: 1px solid var(--xb); border-radius: var(--r-m);
  padding: 16px 18px; margin-bottom: 12px; }
.dtaa .h { font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--xb); margin-bottom: 8px; }
.dtaa p { margin: 0; font-size: 13.5px; color: var(--ink); line-height: 1.55; }
.dtaa .flow { display: flex; align-items: center; gap: 10px; margin-top: 12px; flex-wrap: wrap; font-family: var(--font-mono); font-size: 12px; }
.dtaa .flow .node { padding: 6px 11px; border-radius: 7px; background: var(--card); border: 1px solid var(--rule-2); }
.dtaa .flow .arr { color: var(--ink-3); }

/* migration — one-time move event */
.migration { background: var(--card); border: 1px solid var(--rule); border-left: 3px solid var(--ca);
  border-radius: 0 var(--r-m) var(--r-m) 0; padding: 18px 20px; margin-bottom: 12px; }
.migration .mh { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.migration .mh .t { font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ca);
  display: flex; align-items: center; gap: 9px; }
.migration .mh .badge1x { font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 20px; background: var(--ca-soft); color: var(--ca); }
.migration .big { font-family: var(--font-mono); font-size: 26px; font-weight: 500; letter-spacing: -.02em; margin: 4px 0 6px; }
.migration .big.none { font-size: 17px; color: var(--sage); }
.migration p { margin: 8px 0 0; font-size: 13px; color: var(--ink-2); line-height: 1.55; }
.migration .mlines { margin-top: 12px; border-top: 1px solid var(--rule); padding-top: 6px; }
.migration .mlines .calcline { font-size: 13px; }
.migration.dir-us { border-left-color: var(--us); }
.migration.dir-us .mh .t { color: var(--us); }
.migration.dir-us .mh .badge1x { background: var(--us-soft); color: var(--us); }

/* advisor */
.advisor { background: var(--card); border: 1px solid var(--rule); border-left: 3px solid var(--accent);
  border-radius: 0 var(--r-m) var(--r-m) 0; padding: 20px 22px; margin-bottom: 14px; }
.advisor .who { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 10px; display: flex; align-items: center; gap: 10px; }
.advisor p { margin: 0 0 10px; font-size: 15px; line-height: 1.6; color: var(--ink); }
.advisor p:last-child { margin-bottom: 0; }
.advisor .recommend { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--rule); display: flex; gap: 20px; flex-wrap: wrap; }
.advisor .recommend .k { font-size: 12px; color: var(--ink-3); }
.advisor .recommend .v { font-weight: 600; font-size: 13.5px; }
.advisor .recommend .pill { font-family: var(--font-mono); font-size: 12px; padding: 3px 10px; border-radius: 20px; background: var(--accent-soft); color: var(--accent-2); }

/* checklist */
.checklist { display: grid; gap: 12px; }
.filterbar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.filterbar button { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: .03em; padding: 6px 12px;
  border-radius: 30px; border: 1px solid var(--rule-2); background: var(--card); color: var(--ink-2); cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px; transition: all var(--dur) var(--ease); }
.filterbar button .d { width: 8px; height: 8px; border-radius: 50%; }
.filterbar button.on { color: var(--ink); border-color: var(--ink-3); background: var(--card-2); }
.filterbar .d-in { background: var(--in); } .filterbar .d-us { background: var(--us); }
.filterbar .d-ca { background: var(--ca); } .filterbar .d-xb { background: var(--xb); }

.chk { background: var(--card); border: 1px solid var(--rule); border-radius: var(--r-m);
  padding: 17px 19px; position: relative; transition: opacity var(--dur) var(--ease); border-left: 3px solid var(--rule-2); }
.chk.j-in { border-left-color: var(--in); } .chk.j-us { border-left-color: var(--us); }
.chk.j-ca { border-left-color: var(--ca); } .chk.j-xb { border-left-color: var(--xb); }
.chk.done { opacity: .5; }
.chk-top { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; flex-wrap: wrap; }
.badge { font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: .07em; color: #fff;
  padding: 4px 8px; border-radius: 5px; text-transform: uppercase; }
.b-URGENT { background: var(--claret); } .b-SOON { background: var(--amber); }
.b-IMPORTANT { background: var(--xb); } .b-ONGOING { background: var(--ink-3); }
.jurtag { font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: .06em; padding: 4px 8px;
  border-radius: 5px; text-transform: uppercase; }
.jurtag.j-in { background: var(--in-soft); color: var(--in); } .jurtag.j-us { background: var(--us-soft); color: var(--us); }
.jurtag.j-ca { background: var(--ca-soft); color: var(--ca); } .jurtag.j-xb { background: var(--xb-soft); color: var(--xb); }
.chk .chk-check { margin-left: auto; width: 22px; height: 22px; border: 1.5px solid var(--rule-2); border-radius: 6px;
  cursor: pointer; display: grid; place-items: center; background: var(--paper); transition: all var(--dur) var(--ease); flex-shrink: 0; color: transparent; }
.chk.done .chk-check { background: var(--sage); border-color: var(--sage); color: #fff; }
.chk h3 { font-size: 16px; font-weight: 650; margin: 0 0 9px; letter-spacing: -.01em; line-height: 1.3; }
.chk.done h3 { text-decoration: line-through; text-decoration-color: var(--ink-3); }
.chk-meta { display: grid; gap: 8px; margin-bottom: 11px; }
.chk-meta .m { display: grid; grid-template-columns: 74px 1fr; gap: 12px; align-items: baseline; }
.chk-meta .m .k { font-family: var(--font-mono); font-size: 10px; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); padding-top: 2px; }
.chk-meta .m .v { font-size: 12.5px; line-height: 1.45; }
.chk-meta .dl .v { font-weight: 600; } .chk-meta .dl.soon .v { color: var(--claret); }
.chk-meta .pen .v { color: var(--claret); }
.chk .act { font-size: 13.5px; color: var(--ink-2); line-height: 1.55; margin: 0 0 8px; }
.chk .res { font-size: 12.5px; color: var(--accent); font-weight: 600; text-decoration: none; }
.chk .res:hover { text-decoration: underline; }

.streaming { display: flex; align-items: center; gap: 12px; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-2);
  padding: 16px 18px; background: var(--card); border: 1px dashed var(--rule-2); border-radius: var(--r-m); }
.streaming .pulse { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); animation: pulse 1.1s var(--ease) infinite; }
@keyframes pulse { 0%,100% { opacity: .25; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.25); } }
.ai-tag { font-family: var(--font-mono); font-size: 11px; padding: 2px 8px; border-radius: 20px; border: 1px solid var(--rule-2); color: var(--ink-3); white-space: nowrap; }
.ai-tag.live { color: var(--sage); border-color: var(--sage); }

/* disclaimers */
.disc { border-radius: var(--r-m); padding: 14px 18px; font-size: 12.5px; line-height: 1.55; margin-top: 14px; }
.disc.advisor-warn { background: var(--claret-soft); border: 1px solid var(--claret); color: var(--ink); }
.disc.advisor-warn b { color: var(--claret); }
.disc.ai-warn { background: var(--card-2); border: 1px solid var(--rule); border-left: 3px solid var(--amber); color: var(--ink-2); }
.disc.method { background: var(--card-2); border: 1px solid var(--rule); border-left: 3px solid var(--ink-3); color: var(--ink-2); }

.timestamp { text-align: center; font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); letter-spacing: .05em; margin-top: 16px; }
.foot { text-align: center; color: var(--ink-3); font-size: 12.5px; padding: 40px 0 64px; font-family: var(--font-mono); letter-spacing: .03em; }
.foot .line { width: 40px; height: 1px; background: var(--rule-2); margin: 0 auto 16px; }

.hidden { display: none !important; }
.fade { animation: fade .4s var(--ease); }
@keyframes fade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* single-scroll flow variation */
body.flow-scroll .progress { display: none; }
body.flow-scroll .step { display: block !important; margin-bottom: 20px; }
body.flow-scroll .step .btnrow { display: none; }
body.flow-scroll #scrollSubmit { display: block; }
#scrollSubmit { display: none; }

@media print {
  .top, .progress, .btnrow, #hero, .tweaks-host, .filterbar { display: none !important; }
  body { background: #fff; } .col-sticky { position: static; }
  .results-grid { grid-template-columns: 1fr; } .card, .metric, .chk, .headline { box-shadow: none; }
}