/* AlphaRexX Design V2 — "Obsidian / Daylight" system.
   Shared by prototypes (assets/proto/*.html) and deck pages (deck/*.html).
   Rule: tokens only. Never hardcode a hex in a page if a token exists. */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700;800&family=Geist+Mono:wght@400;500;600&family=Instrument+Serif:ital@0;1&display=swap');

:root{
  /* ── Obsidian (dark engine-room surfaces, neutral-cool, NOT navy) ── */
  --ink-0:#040507;   /* void, deepest hero floor */
  --ink-1:#08090C;   /* page */
  --ink-2:#0D0F13;   /* raised section band */
  --ink-3:#121419;   /* card */
  --ink-4:#181B22;   /* card-2, input, hover */
  --ink-5:#20242D;   /* pressed / strong fill */
  --hair:rgba(255,255,255,.06); --hair-2:rgba(255,255,255,.10); --hair-3:rgba(255,255,255,.16);
  --tx:#F3F5F8; --tx-2:#A9B0BC; --tx-3:#6E7686; --tx-4:#474E5C;

  /* ── Daylight (evidence/proof sections + light theme) ── */
  --day-0:#F3F4F1; --day-1:#FFFFFF; --day-2:#E9EBE6; --day-line:#DADDD6; --day-line-2:#C9CDC4;
  --dtx:#0A0C0F; --dtx-2:#454B55; --dtx-3:#7B818B;

  /* ── Dusk bridge (dark → daylight section transition) ── */
  --dusk:linear-gradient(180deg,#08090C 0%,#0E1117 22%,#1C212B 44%,#5A616D 66%,#C7CBC6 86%,#F3F4F1 100%);
  --dawn:linear-gradient(180deg,#F3F4F1 0%,#C7CBC6 14%,#5A616D 34%,#1C212B 56%,#0E1117 78%,#08090C 100%);

  /* ── Ion (brand, derived from the electric bull + cyan arrow in the logo) ── */
  --ion:#2F7BFF; --ion-600:#1E63E6; --ion-400:#5C98FF; --ion-300:#9DC0FF; --ion-bg:rgba(47,123,255,.12);
  --thread:#35D7F5;              /* the Evidence Thread: 1 signature line, focus rings, live states */
  --thread-bg:rgba(53,215,245,.12);
  --grad-ion:linear-gradient(100deg,#2F7BFF 0%,#35D7F5 100%);   /* primary CTA + thread ONLY */

  /* ── Semantic (data only — never decoration) ── */
  --gain:#2BD38A; --gain-bg:rgba(43,211,138,.12); --gain-d:#0E8F57;   /* -d = on daylight */
  --loss:#FF5C6A; --loss-bg:rgba(255,92,106,.12); --loss-d:#D22E42;
  --warn:#F5B546; --warn-bg:rgba(245,181,70,.13); --warn-d:#A86B00;
  --regime:#F0873C; --noise:#8C93A3;

  /* ── Plan identities (chrome only, never inside charts/data) ── */
  --p-free:#8A93A6;  --p-free-2:#B9C0CD;
  --p-starter:#2F7BFF; --p-starter-2:#9DC0FF;
  --p-pro:#D5DAE1;   --p-pro-2:#F4F6F9; --grad-pro:linear-gradient(118deg,#FFFFFF 0%,#D5DAE1 30%,#8C95A3 58%,#E9ECF0 78%,#AEB6C2 100%);  /* Platinum (brushed metal) — NOT gold: gold/VIP reads as signal-group scam in PK/IN */
  --p-agent:#A597FF; --p-agent-2:#D3CCFF; --grad-agent:linear-gradient(120deg,#D3CCFF 0%,#A597FF 50%,#6D5FD6 100%);

  /* ── Type ── */
  --f-ui:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-num:'Geist Mono',ui-monospace,monospace;
  --f-ed:'Instrument Serif',Georgia,serif;          /* editorial accent word only, italic, max 1 per headline */
  /* scale (desktop marketing) */
  --t-hero:600 84px/0.98 var(--f-ui); --t-h1:600 56px/1.02 var(--f-ui); --t-h2:600 40px/1.08 var(--f-ui);
  --t-h3:600 24px/1.2 var(--f-ui); --t-body:400 17px/1.6 var(--f-ui); --t-small:400 14px/1.5 var(--f-ui);
  --t-eyebrow:500 12px/1 var(--f-num);

  /* ── Space (4px base) / radius / elevation ── */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;--s16:64px;--s20:80px;--s24:96px;--s32:128px;
  --r-xs:6px;--r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:22px;--r-2xl:28px;
  --e1:0 1px 0 rgba(255,255,255,.04) inset,0 1px 2px rgba(0,0,0,.4);
  --e2:0 1px 0 rgba(255,255,255,.05) inset,0 12px 32px -8px rgba(0,0,0,.6);
  --e3:0 1px 0 rgba(255,255,255,.07) inset,0 40px 80px -24px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.06);
  --e-day:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -18px rgba(20,24,30,.22),0 0 0 1px rgba(10,12,15,.06);

  /* ── Motion tokens ── */
  --ease-out:cubic-bezier(.2,.8,.2,1); --ease-io:cubic-bezier(.6,0,.2,1); --ease-spring:cubic-bezier(.3,1.3,.5,1);
  --d-fast:120ms; --d-base:200ms; --d-slow:360ms; --d-stage:640ms;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--ink-1);color:var(--tx);font-family:var(--f-ui);-webkit-font-smoothing:antialiased;-webkit-print-color-adjust:exact;print-color-adjust:exact}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.num,.mono{font-family:var(--f-num);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.ed{font-family:var(--f-ed);font-style:italic;font-weight:400;letter-spacing:-.01em}
.eyebrow{font:var(--t-eyebrow);letter-spacing:.16em;text-transform:uppercase;color:var(--tx-3)}
.eyebrow.ion{color:var(--thread)}
.muted{color:var(--tx-2)} .dim{color:var(--tx-3)} .gain{color:var(--gain)} .loss{color:var(--loss)} .warn{color:var(--warn)}
.grad-tx{background:var(--grad-ion);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ───────────── Components ───────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:999px;font:500 15px var(--f-ui);border:0;white-space:nowrap;cursor:pointer;letter-spacing:-.005em}
.btn.sm{height:34px;padding:0 14px;font-size:13px}
.btn.lg{height:52px;padding:0 26px;font-size:16px}
.btn.primary{background:var(--tx);color:var(--ink-1)}                          /* default primary = porcelain pill (restraint) */
.btn.ion{background:var(--grad-ion);color:#03121C;box-shadow:0 10px 30px -8px rgba(53,215,245,.45)}  /* ONE hero CTA per viewport */
.btn.ghost{background:transparent;color:var(--tx);box-shadow:inset 0 0 0 1px var(--hair-3)}
.btn.quiet{background:var(--ink-4);color:var(--tx);box-shadow:inset 0 0 0 1px var(--hair)}
.btn.day{background:var(--dtx);color:var(--day-1)}
.btn.day-ghost{background:transparent;color:var(--dtx);box-shadow:inset 0 0 0 1px var(--day-line-2)}

.chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font:500 11.5px var(--f-ui);background:var(--ink-4);color:var(--tx-2);box-shadow:inset 0 0 0 1px var(--hair)}
.chip.gain{background:var(--gain-bg);color:var(--gain);box-shadow:none}
.chip.loss{background:var(--loss-bg);color:var(--loss);box-shadow:none}
.chip.warn{background:var(--warn-bg);color:var(--warn);box-shadow:none}
.chip.ion{background:var(--ion-bg);color:var(--ion-300);box-shadow:none}
.chip.thread{background:var(--thread-bg);color:var(--thread);box-shadow:none}
.chip.day{background:var(--day-2);color:var(--dtx-2);box-shadow:inset 0 0 0 1px var(--day-line)}
.chip .d{width:6px;height:6px;border-radius:50%;background:currentColor}
.tag{font:600 10px/1 var(--f-num);letter-spacing:.14em;text-transform:uppercase}

.card{background:var(--ink-3);border-radius:var(--r-lg);box-shadow:var(--e2);position:relative}
.card.pad{padding:var(--s5)}
.card.flat{box-shadow:inset 0 0 0 1px var(--hair)}
.card.day{background:var(--day-1);color:var(--dtx);box-shadow:var(--e-day)}

/* Plate = the signature layered surface (journey, hero stack). Translucent glass with a top light edge. */
.plate{border-radius:var(--r-xl);background:linear-gradient(180deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.025) 38%,rgba(255,255,255,.015) 100%),rgba(13,15,19,.78);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 0 1px rgba(255,255,255,.07),0 40px 80px -30px rgba(0,0,0,.9);backdrop-filter:blur(18px)}
.plate.lit{box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 0 0 1px rgba(53,215,245,.28),0 0 0 1px rgba(53,215,245,.08),0 40px 90px -30px rgba(0,0,0,.9),0 0 60px -20px rgba(53,215,245,.35)}

/* Verdict seal — deterministic engine output, never decorative */
.seal{display:inline-flex;align-items:center;gap:10px;height:34px;padding:0 14px 0 10px;border-radius:10px;font:600 12.5px var(--f-num);letter-spacing:.08em}
.seal i{width:18px;height:18px;border-radius:5px;display:grid;place-items:center;font-style:normal}
.seal.tradeable{background:var(--gain-bg);color:var(--gain);box-shadow:inset 0 0 0 1px rgba(43,211,138,.35)}
.seal.overfit{background:var(--loss-bg);color:var(--loss);box-shadow:inset 0 0 0 1px rgba(255,92,106,.35)}
.seal.cost{background:var(--warn-bg);color:var(--warn);box-shadow:inset 0 0 0 1px rgba(245,181,70,.35)}
.seal.regime{background:rgba(240,135,60,.12);color:var(--regime);box-shadow:inset 0 0 0 1px rgba(240,135,60,.35)}
.seal.noise{background:rgba(140,147,163,.12);color:var(--noise);box-shadow:inset 0 0 0 1px rgba(140,147,163,.35)}
.seal.insufficient{background:transparent;color:var(--tx-2);box-shadow:inset 0 0 0 1px var(--hair-3)}

.kpi .l{font:500 11px var(--f-num);letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3)}
.kpi .v{font:500 30px/1.05 var(--f-num);letter-spacing:-.03em;margin-top:8px}
.kpi .s{font:400 12px var(--f-num);color:var(--tx-3);margin-top:6px}
.input{height:44px;border-radius:12px;background:var(--ink-4);box-shadow:inset 0 0 0 1px var(--hair-2);padding:0 14px;display:flex;align-items:center;gap:8px;color:var(--tx-2);font-size:14px}
.input.focus{box-shadow:inset 0 0 0 1px var(--thread),0 0 0 4px rgba(53,215,245,.12)}
.seg{display:inline-flex;padding:3px;border-radius:999px;background:var(--ink-4);box-shadow:inset 0 0 0 1px var(--hair)}
.seg b{font:500 12.5px var(--f-ui);padding:6px 12px;border-radius:999px;color:var(--tx-3)}
.seg b.on{background:var(--ink-1);color:var(--tx);box-shadow:0 1px 2px rgba(0,0,0,.5),inset 0 0 0 1px var(--hair-2)}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{font:500 10.5px var(--f-num);letter-spacing:.1em;text-transform:uppercase;color:var(--tx-3);text-align:left;padding:10px 12px;border-bottom:1px solid var(--hair-2)}
.tbl td{padding:10px 12px;border-bottom:1px solid var(--hair);color:var(--tx)}
.tbl td.r,.tbl th.r{text-align:right}
.tbl tr.sel td{background:rgba(53,215,245,.06)}
.bar{height:6px;border-radius:99px;background:var(--ink-5);overflow:hidden}.bar>i{display:block;height:100%;border-radius:99px;background:var(--ion)}
.ico{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.row{display:flex;gap:var(--s4);align-items:center}.col{display:flex;flex-direction:column;gap:var(--s4)}.between{justify-content:space-between}.grid{display:grid;gap:var(--s4)}
.thread-line{height:1px;background:linear-gradient(90deg,transparent,var(--thread) 20%,var(--thread) 80%,transparent);opacity:.7}
.anno{position:absolute;font:500 10.5px/1.35 var(--f-num);color:var(--thread);letter-spacing:.04em;padding:5px 8px;border:1px dashed rgba(53,215,245,.55);border-radius:6px;background:rgba(4,5,7,.75);z-index:50;max-width:260px}
.anno.day{color:#0A6F86;border-color:rgba(10,111,134,.5);background:rgba(255,255,255,.85)}

/* ───────────── App shell + plan identity ─────────────
   <body data-plan="free|starter|pro|agent">. Same components; the SHELL carries the tier. */
[data-plan]{--plan:var(--p-starter);--plan-2:var(--p-starter-2);--plan-grad:var(--grad-ion)}
[data-plan=free]{--plan:var(--p-free);--plan-2:var(--p-free-2);--plan-grad:linear-gradient(120deg,#B9C0CD,#8A93A6)}
[data-plan=starter]{--plan:var(--p-starter);--plan-2:var(--p-starter-2);--plan-grad:linear-gradient(120deg,#9DC0FF,#2F7BFF)}
[data-plan=pro]{--plan:var(--p-pro);--plan-2:var(--p-pro-2);--plan-grad:var(--grad-pro)}
[data-plan=agent]{--plan:var(--p-agent);--plan-2:var(--p-agent-2);--plan-grad:var(--grad-agent)}

/* ───────────── Deck frame (PDF pages 1600×1000) ───────────── */
@page{size:1600px 1000px;margin:0}
.page{width:1600px;height:1000px;position:relative;overflow:hidden;background:var(--ink-1);page-break-after:always;break-after:page;padding:56px 64px 52px}
.page.day{background:var(--day-0);color:var(--dtx)}
.page.flush{padding:0}
.page h1{font:600 46px/1.05 var(--f-ui);letter-spacing:-.03em;margin:12px 0 10px}
.page h2{font:600 30px/1.12 var(--f-ui);letter-spacing:-.02em}
.page h3{font:600 17px/1.3 var(--f-ui);letter-spacing:-.01em}
.page .lede{font:400 17px/1.55 var(--f-ui);color:var(--tx-2);max-width:980px}
.page.day .lede{color:var(--dtx-2)}
.page .foot{position:absolute;left:64px;right:64px;bottom:22px;display:flex;justify-content:space-between;font:500 10.5px var(--f-num);color:var(--tx-4);letter-spacing:.12em;text-transform:uppercase}
.page.day .foot{color:var(--dtx-3)}
/* WHAT → WHY → EFFECT rationale block */
.why{display:grid;grid-template-columns:1fr;gap:10px;font:400 13px/1.5 var(--f-ui);color:var(--tx-2)}
.why>div{padding:12px 14px;border-radius:12px;background:var(--ink-3);box-shadow:inset 0 0 0 1px var(--hair)}
.why b{display:block;font:500 10px/1 var(--f-num);letter-spacing:.14em;text-transform:uppercase;color:var(--thread);margin-bottom:6px}
.page.day .why{color:var(--dtx-2)} .page.day .why>div{background:var(--day-1);box-shadow:inset 0 0 0 1px var(--day-line)} .page.day .why b{color:#0A6F86}
.shot{border-radius:14px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.8),0 0 0 1px var(--hair-2)}
.page.day .shot{box-shadow:0 30px 60px -30px rgba(10,12,15,.35),0 0 0 1px var(--day-line)}
.browser{background:var(--ink-2);border-radius:14px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.85),0 0 0 1px var(--hair-2)}
.browser .bar{height:30px;display:flex;align-items:center;gap:6px;padding:0 12px;background:#0B0C10;border-bottom:1px solid var(--hair)}
.browser .bar i{width:9px;height:9px;border-radius:50%;background:#262A33}
.browser .bar .url{margin-left:12px;height:18px;padding:0 10px;border-radius:6px;background:#15171D;font:500 10.5px/18px var(--f-num);color:var(--tx-3)}
.phone{width:360px;border-radius:46px;padding:9px;background:#0A0B0E;box-shadow:0 0 0 1px #2A2E38,0 40px 80px -24px rgba(0,0,0,.8)}
.phone .screen{border-radius:38px;overflow:hidden;position:relative;background:var(--ink-1)}