/* ============================================================================
   IGNITION — design system
   Institutional fintech: deep navy-ink, a single refined gold accent, emerald
   reserved for gains. True glassmorphism. Built for trust, not hype.
   Vanilla CSS, no build step. Rebrand by editing the tokens below + markup.
   ========================================================================== */

/* ----------------------------------------------------------------- tokens -- */
:root {
  /* base surfaces — cool navy-ink with a consistent cool tint between layers */
  --bg:           #05080e;
  --bg-2:         #0a1018;
  --surface:      #0b111b;
  --surface-2:    #0e1522;
  --surface-3:    #121a2a;
  --line:         rgba(139, 163, 196, 0.14);
  --line-strong:  rgba(139, 163, 196, 0.28);

  /* text — cool neutral, single gray family */
  --text:         #e9eef5;
  --text-soft:    #c3cedd;
  --muted:        #8fa2ba;
  /* WCAG AA floor: fineprint, table dates, footer risk line and chart axis text
     all render in --faint on --bg #090c15 — the old #525c73 was ~2.9:1, i.e. the
     exact text a skeptic needs (risk copy) was the hardest to read. */
  --faint:        #7e8ca0;

  /* ONE accent — a desaturated honey-gold. Premium + credible, not alarm-red. */
  --accent:       #e8a13c;   /* gold */
  --accent-2:     #c8862e;   /* deep amber (for gradient depth, no red) */
  --accent-3:     #f2b95a;   /* light gold / spark */
  --accent-soft:  rgba(232, 161, 60, 0.12);
  --accent-line:  rgba(232, 161, 60, 0.42);
  --flame:        linear-gradient(135deg, var(--accent-3) 0%, var(--accent) 55%, var(--accent-2) 100%);
  --flame-soft:   linear-gradient(135deg, rgba(240,205,124,.16), rgba(200,132,44,.14));

  /* market semantics — emerald is the "your money went up" color: trust + reward */
  --up:           #39d98a;
  --up-bright:    #55e8a4;
  --up-soft:      rgba(46, 224, 143, 0.14);
  --up-line:      rgba(46, 224, 143, 0.40);
  --up-glow:      0 0 22px rgba(46, 224, 143, 0.32);
  --success:      linear-gradient(135deg, #5cf2b0 0%, #1fbd7c 100%);
  --down:         #ff5d6b;

  /* glass — translucent fill + edge highlight (used with backdrop blur) */
  --glass:        linear-gradient(180deg, rgba(18,26,42,.92), rgba(11,17,27,.92));
  --glass-strong: linear-gradient(180deg, rgba(22,31,48,.96), rgba(13,20,32,.96));
  --glass-edge:   inset 0 0 0 1px rgba(139,163,196,.10), inset 0 0 40px rgba(0,0,0,.28);
  --blur:         none;

  /* type */
  --font-display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;
  --font-body:    "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono:    "JetBrains Mono", "SFMono-Regular", ui-monospace, monospace;

  --text-hero:    clamp(2.6rem, 1.1rem + 6.4vw, 6.6rem);
  --text-h2:      clamp(2rem, 1.2rem + 3vw, 3.6rem);
  --text-h3:      clamp(1.3rem, 1rem + 1vw, 1.8rem);
  --text-lead:    clamp(1.05rem, 0.98rem + 0.5vw, 1.3rem);

  /* spacing / shape */
  --space-section: clamp(5rem, 3rem + 9vw, 10rem);
  --radius:        10px;
  --radius-lg:     14px;
  --radius-pill:   999px;
  --maxw:          1200px;
  /* navy-tinted shadows, not pure black — single light source from above */
  --shadow:        14px 18px 44px -20px rgba(0, 0, 0, 0.72);
  --shadow-glow:   0 0 0 1px var(--line), 16px 24px 64px -36px rgba(232, 161, 60, 0.22);

  /* z-index scale */
  --z-nav: 100; --z-overlay: 200; --z-skip: 300;

  /* motion */
  --ease:         cubic-bezier(0.22, 1, 0.36, 1);
  --snap:         cubic-bezier(0.7, 0, 0.3, 1);
  --ice:          #9cc3e6;
  --t-slow:       1.1s;
  --drift:        22s;
  --dur:          .6s;
}

/* reusable true-glass surface */
.glass {
  background: var(--glass);
  -webkit-backdrop-filter: var(--blur);
  backdrop-filter: var(--blur);
  border: 1px solid var(--line);
  box-shadow: var(--glass-edge), var(--shadow);
}

/* visible keyboard focus everywhere (accessibility) */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}
:focus:not(:focus-visible) { outline: none; }

/* skip link for keyboard users */
.skip-link {
  position: absolute; left: 12px; top: -60px; z-index: var(--z-skip);
  background: var(--accent); color: #14110a; padding: .7rem 1.1rem;
  border-radius: 10px; font-weight: 600; transition: top .2s var(--ease);
}
.skip-link:focus { top: 12px; }

/* ------------------------------------------------------------------ reset -- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}
body {
  margin: 0;
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
h1, h2, h3, h4 { font-family: var(--font-display); line-height: 1.04; letter-spacing: -0.02em; margin: 0; font-weight: 600; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
/* tabular figures everywhere numbers matter */
.mono, table, .num, .money-num, .stat, .gain-pill, .price, .tape-item { font-variant-numeric: tabular-nums; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
button { font-family: inherit; cursor: pointer; }
ul { margin: 0; padding: 0; list-style: none; }

/* atmospheric body backdrop — restrained navy depth + a single subtle gold cast */
body::before {
  content: "";
  position: fixed; inset: 0; z-index: -2;
  background:
    radial-gradient(1000px 680px at 82% -12%, rgba(224, 164, 60, 0.10), transparent 62%),
    radial-gradient(820px 720px at 6% 4%, rgba(64, 96, 170, 0.10), transparent 58%),
    var(--bg);
}
body::after {
  content: "";
  position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* -------------------------------------------------------------- utilities -- */
.wrap { width: min(100% - 2.4rem, var(--maxw)); margin-inline: auto; }
.wrap-wide { width: min(100% - 2.4rem, 1340px); margin-inline: auto; }
.section { padding-block: var(--space-section); position: relative; }
.eyebrow {
  display: inline-flex; align-items: center; gap: .55rem;
  font-family: var(--font-mono); font-size: .74rem; letter-spacing: .26em;
  text-transform: uppercase; color: var(--accent); font-weight: 500;
}
.eyebrow::before { content: ""; width: 22px; height: 1px; background: var(--accent); opacity: .7; }
.gradient-text {
  background: var(--flame); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.lead { font-size: var(--text-lead); color: var(--text-soft); max-width: 52ch; }
.mono { font-family: var(--font-mono); }
.center { text-align: center; }
.center .lead, .center .eyebrow { margin-inline: auto; }

/* -------------------------------------------------------------- buttons --- */
.btn {
  --pad: .92rem 1.5rem;
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  padding: var(--pad); border-radius: var(--radius-pill); font-weight: 600;
  font-size: .98rem; border: 1px solid transparent; position: relative;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background .25s, color .25s;
  white-space: nowrap;
}
.btn:active { transform: translateY(1px) scale(.99); }
.btn-primary {
  background: var(--flame); color: #1a0b02;
  box-shadow: 0 10px 30px -12px rgba(224, 164, 60, 0.5);
}
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 18px 44px -14px rgba(224, 164, 60, 0.62); }
.btn-ghost { background: rgba(255,255,255,.03); color: var(--text); border-color: var(--line-strong); }
.btn-ghost:hover { background: rgba(255,255,255,.07); border-color: var(--accent); transform: translateY(-2px); }
.btn-lg { --pad: 1.1rem 2rem; font-size: 1.05rem; }
.btn-block { width: 100%; }

/* ------------------------------------------------------------------- nav -- */
.nav {
  position: sticky; top: 0; z-index: 100;
  /* HEAT: solid night-steel bar, no blur (glass banned site-wide) */
  background: color-mix(in srgb, var(--bg) 96%, transparent);
  border-bottom: 1px solid transparent; transition: border-color .3s, background .3s;
}
.nav.scrolled { border-bottom-color: var(--line); background: color-mix(in srgb, var(--bg) 88%, transparent); }
.nav-inner { display: flex; align-items: center; gap: 1.5rem; height: 72px; }
.brand { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--font-display); font-weight: 700; font-size: 1.18rem; letter-spacing: -.01em; }
.brand .spark { width: 28px; height: 28px; flex: none; }
.brand b { font-weight: 700; color: var(--accent); }
.brand .spark + span { white-space: nowrap; }
.nav-links { display: flex; gap: .35rem; margin-left: auto; }
.nav-links a {
  padding: .5rem .85rem; border-radius: var(--radius-pill); font-size: .94rem;
  color: var(--text-soft); transition: color .2s, background .2s;
}
.nav-links a:hover, .nav-links a.active { color: var(--text); background: rgba(255,255,255,.06); }
.nav-cta { display: flex; align-items: center; gap: .6rem; margin-left: .4rem; }
.nav-toggle { display: none; background: none; border: 0; color: var(--text); padding: .4rem; }
@media (max-width: 920px) {
  .nav-links { display: none; }
  .nav-toggle { display: inline-flex; margin-left: auto; }
  .nav-cta .btn-ghost { display: none; }
  .nav-cta { margin-left: 0; }
  .nav.open .nav-links {
    display: flex; position: absolute; inset: 72px 0 auto 0; flex-direction: column;
    gap: 0; padding: .6rem 1.2rem 1.2rem; background: var(--bg-2); border-bottom: 1px solid var(--line);
  }
  .nav.open .nav-links a { padding: .9rem 1rem; }
}
@media (max-width: 480px) {
  .nav-inner { gap: .8rem; }
  .brand { font-size: 1.02rem; gap: .45rem; }
  .brand .spark { width: 24px; height: 24px; }
}

/* ------------------------------------------------------------------ hero -- */
.hero { position: relative; padding-block: clamp(3.5rem, 2rem + 7vw, 7rem) clamp(3rem, 2rem + 4vw, 5rem); overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 4vw, 4rem); align-items: center; }
@media (max-width: 980px) { .hero-grid { grid-template-columns: 1fr; } }
.hero-badge {
  display: inline-flex; align-items: center; gap: .55rem; padding: .4rem .4rem .4rem .85rem;
  border: 1px solid var(--line); border-radius: var(--radius-pill); background: rgba(255,255,255,.02);
  font-size: .82rem; color: var(--text-soft); margin-bottom: 1.6rem;
}
.hero-badge .tag { background: var(--accent-soft); color: var(--accent-3); padding: .2rem .6rem; border-radius: var(--radius-pill); font-family: var(--font-mono); font-size: .72rem; }
.hero h1 { font-size: var(--text-hero); font-weight: 700; }
.hero h1 .line { display: block; }
.hero p.lead { margin-top: 1.5rem; }
.hero-cta { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2.2rem; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 1.4rem 2rem; margin-top: 2.4rem; color: var(--muted); font-size: .9rem; }
.hero-trust b { color: var(--text); font-family: var(--font-display); }
.hero-trust .dot { color: var(--accent); }

/* hero scanner visual */
.scanner {
  position: relative; aspect-ratio: 1 / 1; width: 100%; max-width: 460px; margin-inline: auto;
  border-radius: var(--radius-lg); background:
    radial-gradient(circle at 50% 50%, rgba(224,164,60,.12), transparent 62%),
    var(--surface);
  border: 1px solid var(--line); box-shadow: var(--shadow-glow); overflow: hidden;
}
.scanner .ring { position: absolute; inset: 0; margin: auto; border-radius: 50%; border: 1px solid var(--line); }
.scanner .ring.r1 { width: 86%; height: 86%; }
.scanner .ring.r2 { width: 60%; height: 60%; }
.scanner .ring.r3 { width: 34%; height: 34%; }
.scanner .sweep {
  position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0deg, rgba(224,164,60,.0) 250deg, rgba(224,164,60,.32) 340deg, rgba(240,205,124,.55) 360deg);
  mask: radial-gradient(circle, transparent 30%, #000 31%);
  -webkit-mask: radial-gradient(circle, transparent 30%, #000 31%);
  animation: sweep 4.2s linear infinite;
}
@keyframes sweep { to { transform: rotate(360deg); } }
.scanner .core {
  position: absolute; inset: 0; margin: auto; width: 30%; height: 30%; border-radius: 50%;
  background: var(--flame); box-shadow: 0 0 48px rgba(224,164,60,.55);
  display: grid; place-items: center; animation: pulse 2.6s var(--ease) infinite;
}
.scanner .core span { font-family: var(--font-display); font-weight: 700; color: #1a0b02; font-size: clamp(1rem,3vw,1.5rem); }
@keyframes pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.07); } }
.scanner .blip {
  position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--up);
  box-shadow: 0 0 12px var(--up); opacity: 0; animation: blip 4.2s var(--ease) infinite;
}
.scanner .blip.b1 { top: 24%; left: 70%; animation-delay: .8s; }
.scanner .blip.b2 { top: 64%; left: 30%; animation-delay: 2.1s; }
.scanner .blip.b3 { top: 72%; left: 66%; animation-delay: 3.2s; }
@keyframes blip { 0%,70%,100% { opacity: 0; transform: scale(.4); } 78% { opacity: 1; transform: scale(1.3); } 90% { opacity: .6; } }
.scanner-tag {
  position: absolute; left: 12px; bottom: 12px; right: 12px; display: flex; justify-content: space-between;
  font-family: var(--font-mono); font-size: .72rem; color: var(--muted);
}
.scanner-tag .live { color: var(--up); display: inline-flex; align-items: center; gap: .4rem; }
.scanner-tag .live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--up); box-shadow: 0 0 8px var(--up); animation: pulse 1.6s infinite; }

/* ----------------------------------------------------------- ticker tape -- */
.tape { border-block: 1px solid var(--line); background: var(--bg-2); overflow: hidden; padding-block: .85rem; }
.tape-track { display: flex; gap: 2.6rem; width: max-content; animation: marquee 38s linear infinite; }
.tape:hover .tape-track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
.tape-item { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--font-mono); font-size: .9rem; color: var(--text-soft); }
.tape-item .tk { color: var(--text); font-weight: 600; }
.tape-item .gain { color: var(--up); font-weight: 600; }

/* --------------------------------------------------------------- section heads */
.section-head { max-width: 60ch; margin-bottom: clamp(2.2rem, 4vw, 3.4rem); }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head h2 { font-size: var(--text-h2); margin-top: 1rem; }
.section-head p { margin-top: 1.1rem; color: var(--text-soft); font-size: var(--text-lead); }

/* ------------------------------------------------------------------ stats - */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
@media (max-width: 760px) { .stats { grid-template-columns: repeat(2, 1fr); } }
.stat { background: var(--surface); padding: clamp(1.4rem, 3vw, 2.4rem); }
.stat .num { font-family: var(--font-display); font-weight: 700; font-size: clamp(2rem, 1rem + 4vw, 3.4rem); line-height: 1; }
.stat .sub { font-family: var(--font-mono); font-size: .82rem; color: var(--up); margin-top: .4rem; }
.stat .lbl { color: var(--muted); margin-top: .6rem; font-size: .92rem; }

/* -------------------------------------------------------------- step cards */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
@media (max-width: 860px) { .steps { grid-template-columns: 1fr; } }
.step {
  position: relative; padding: 2rem 1.8rem; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); overflow: hidden; transition: transform .35s var(--ease), border-color .3s;
}
.step:hover { transform: translateY(-4px); border-color: var(--line-strong); }
.step .n { font-family: var(--font-mono); color: var(--accent); font-size: .82rem; letter-spacing: .2em; }
.step h3 { font-size: var(--text-h3); margin: 1rem 0 .7rem; }
.step p { color: var(--text-soft); }
.step .icon { width: 46px; height: 46px; border-radius: 12px; background: var(--accent-soft); display: grid; place-items: center; margin-bottom: 1.2rem; color: var(--accent-3); }

/* --------------------------------------------------------- feature grid --- */
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
@media (max-width: 900px) { .features { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .features { grid-template-columns: 1fr; } }
.feature { padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(180deg, var(--surface), var(--bg-2)); transition: border-color .3s, transform .3s; }
.feature:hover { border-color: var(--line-strong); transform: translateY(-3px); }
.feature .fi { color: var(--accent); margin-bottom: .9rem; }
.feature h3 { font-size: 1.12rem; margin-bottom: .5rem; }
.feature p { color: var(--muted); font-size: .95rem; }

/* the 8-condition "formula" chips */
.formula { display: grid; grid-template-columns: repeat(4, 1fr); gap: .9rem; }
@media (max-width: 900px) { .formula { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .formula { grid-template-columns: 1fr; } }
.cond { padding: 1.2rem 1.3rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.cond .c { font-family: var(--font-mono); font-size: .72rem; color: var(--accent); letter-spacing: .15em; }
.cond .t { margin-top: .5rem; font-weight: 600; color: var(--text); }
.cond .d { margin-top: .3rem; color: var(--muted); font-size: .86rem; }

/* --------------------------------------------------------- track / table -- */
.tr-table-wrap { border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; background: var(--surface); }
.tr-toolbar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; padding: 1rem 1.2rem; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.tr-toolbar .filter { display: flex; gap: .4rem; flex-wrap: wrap; }
.chip {
  padding: .45rem .9rem; border-radius: var(--radius-pill); border: 1px solid var(--line);
  background: transparent; color: var(--text-soft); font-size: .85rem; transition: all .2s;
}
.chip:hover { border-color: var(--line-strong); color: var(--text); }
.chip.active { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-3); }
.tr-toolbar .count { margin-left: auto; font-family: var(--font-mono); font-size: .82rem; color: var(--muted); }
/* Long tables scroll inside a bounded box with the header row FROZEN, so the column
   meanings stay visible however far you scroll. Solid header bg (the card is glass). */
.tr-scroll { max-height: min(72vh, 860px); overflow: auto; overscroll-behavior: contain; }
.tr-scroll table.tr thead th {
  position: sticky; top: 0; z-index: 3;
  background: var(--surface);
  box-shadow: 0 1px 0 var(--line-strong);
}
/* ticker search (dashboard positions) */
.pos-search {
  width: clamp(140px, 24vw, 230px); padding: .45rem .85rem;
  background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-pill);
  color: var(--text); font-family: var(--font-mono); font-size: .82rem; letter-spacing: .04em;
  transition: border-color .15s, background .15s;
}
.pos-search::placeholder { color: var(--faint); text-transform: none; letter-spacing: 0; }
.pos-search:focus { outline: none; border-color: var(--accent-line); background: var(--surface); }
table.tr { width: 100%; border-collapse: collapse; font-size: .95rem; }
table.tr th, table.tr td { padding: .95rem 1.2rem; text-align: left; }
table.tr thead th {
  font-family: var(--font-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted); font-weight: 500; border-bottom: 1px solid var(--line); cursor: pointer; user-select: none; white-space: nowrap;
}
table.tr thead th:hover { color: var(--text); }
table.tr thead th .arrow { opacity: .4; font-size: .7rem; }
table.tr thead th.sorted .arrow { opacity: 1; color: var(--accent); }
table.tr tbody tr { border-bottom: 1px solid var(--line); transition: background .2s; }
table.tr tbody tr:hover { background: rgba(255,255,255,.025); }
table.tr tbody tr:last-child { border-bottom: 0; }
/* free-tier locked positions: blurred, inert teaser rows + an unlock CTA row */
table.tr tbody tr.locked { filter: blur(4.5px); opacity: .5; pointer-events: none; user-select: none; }
table.tr tbody tr.pos-unlock-row,
table.tr tbody tr.pos-unlock-row:hover { filter: none; opacity: 1; background: transparent; }
table.tr tbody tr.pos-unlock-row td { text-align: center; padding-top: 1.2rem; font-size: .85rem; color: var(--muted); }
table.tr tbody tr.pos-unlock-row b { color: var(--text-soft); }
.tk-cell { display: flex; align-items: center; gap: .7rem; }
.tk-cell .sym { font-family: var(--font-display); font-weight: 700; font-size: 1.02rem; letter-spacing: -.01em; }
.tk-cell .flag { font-size: .72rem; color: var(--muted); }
td.price { font-family: var(--font-mono); color: var(--text-soft); }
td.peak { font-family: var(--font-mono); color: var(--text); }
.gain-pill { display: inline-flex; align-items: center; gap: .35rem; font-family: var(--font-mono); font-weight: 600; padding: .3rem .7rem; border-radius: var(--radius-pill); background: var(--up-soft); color: var(--up); white-space: nowrap; }
.gain-pill.big { background: var(--accent-soft); color: var(--accent-3); }
.gain-pill.huge { background: var(--flame); color: #1a0b02; }
.split-mark { color: var(--muted); font-size: .72em; cursor: help; }
.status-sold, .status-open { display: inline-flex; align-items: center; gap: .3rem; font-family: var(--font-mono); font-weight: 600; font-size: .8rem; padding: .26rem .6rem; border-radius: var(--radius-pill); white-space: nowrap; }
.status-sold { background: var(--up-soft); color: var(--up); }
.status-exp { background: rgba(136,147,168,.12); color: var(--muted); }
.status-stop { background: rgba(255,107,107,.12); color: #ff6b6b; }
.status-open { background: rgba(224, 164, 60, .12); color: var(--accent-3); }
.note-cell { color: var(--muted); font-size: .88rem; max-width: 30ch; }
@media (max-width: 760px) {
  table.tr thead { display: none; }
  .sort-hint { display: none; } /* no headers on mobile → no sorting to explain */
  table.tr, table.tr tbody, table.tr tr, table.tr td { display: block; width: 100%; }
  table.tr tr { padding: 1rem 1.2rem; }
  table.tr td { padding: .25rem 0; }
  table.tr td.note-cell { max-width: none; }
  table.tr td::before { content: attr(data-l); font-family: var(--font-mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--faint); margin-right: .6rem; }
  .tk-cell { padding-bottom: .4rem; }
}

/* featured win cards (landing) */
.wins { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
@media (max-width: 900px) { .wins { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .wins { grid-template-columns: 1fr; } }
.win {
  position: relative; padding: 1.6rem; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--surface); overflow: hidden; transition: transform .35s var(--ease), border-color .3s;
}
.win:hover { transform: translateY(-4px); border-color: var(--accent); }
.win::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--flame); transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.win:hover::after { transform: scaleX(1); }
.win-top { display: flex; justify-content: space-between; align-items: flex-start; }
.win .sym { font-family: var(--font-display); font-weight: 700; font-size: 1.45rem; }
.win .date { font-family: var(--font-mono); font-size: .76rem; color: var(--faint); margin-top: .2rem; }
.win .big-gain { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.8rem, 1rem + 3vw, 2.6rem); margin: 1rem 0 .2rem; }
.win .arrow-row { display: flex; align-items: center; gap: .6rem; font-family: var(--font-mono); font-size: .9rem; color: var(--text-soft); margin-top: .9rem; }
.win .arrow-row .a { color: var(--muted); }
.win .arrow-row .p { color: var(--up); }
.win .blurb { color: var(--muted); font-size: .9rem; margin-top: .9rem; }

/* --------------------------------------------------------------- pricing -- */
.pricing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; align-items: stretch; }
.pricing.two { grid-template-columns: repeat(2, 1fr); max-width: 800px; margin-inline: auto; }
@media (max-width: 900px) { .pricing, .pricing.two { grid-template-columns: 1fr; max-width: 460px; margin-inline: auto; } }
.plan {
  display: flex; flex-direction: column; padding: 2rem 1.8rem; border: 1px solid var(--line);
  border-radius: var(--radius-lg); background: var(--surface); position: relative; transition: transform .35s var(--ease), border-color .3s;
}
.plan:hover { transform: translateY(-4px); }
.plan.featured { border-color: var(--accent); background: linear-gradient(180deg, rgba(255,122,24,.08), var(--surface) 40%); box-shadow: var(--shadow-glow); }
.plan .badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--flame); color: #1a0b02; font-size: .72rem; font-weight: 700; padding: .3rem .9rem; border-radius: var(--radius-pill); font-family: var(--font-mono); letter-spacing: .08em; }
.plan h3 { font-size: 1.3rem; }
.plan .price { margin: 1.2rem 0 .3rem; display: flex; align-items: baseline; gap: .3rem; }
.plan .price .amt { font-family: var(--font-display); font-weight: 700; font-size: 3rem; line-height: 1; }
.plan .price .per { color: var(--muted); font-size: .95rem; }
.plan .sub { color: var(--muted); font-size: .9rem; min-height: 1.4em; }
.plan ul { margin: 1.6rem 0; display: grid; gap: .8rem; }
.plan li { display: flex; gap: .65rem; color: var(--text-soft); font-size: .94rem; }
.plan li svg { flex: none; color: var(--accent); margin-top: .15rem; }
.plan li.off { color: var(--faint); }
.plan li.off svg { color: var(--faint); }
.plan .btn { margin-top: auto; }
.bill-toggle { display: inline-flex; gap: .3rem; padding: .3rem; border: 1px solid var(--line); border-radius: var(--radius-pill); margin: 0 auto 2.4rem; }
.bill-toggle button { border: 0; background: none; color: var(--text-soft); padding: .5rem 1.1rem; border-radius: var(--radius-pill); font-size: .9rem; transition: all .2s; }
.bill-toggle button.active { background: var(--accent-soft); color: var(--accent-3); }
.bill-toggle .save { font-family: var(--font-mono); font-size: .68rem; color: var(--up); }

/* ----------------------------------------------------------------- faq ---- */
.faq { max-width: 800px; margin-inline: auto; }
.qa { border-bottom: 1px solid var(--line); }
.qa summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.4rem .2rem; cursor: pointer; list-style: none; font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; }
.qa summary::-webkit-details-marker { display: none; }
.qa summary .pm { flex: none; width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--line-strong); display: grid; place-items: center; transition: .3s; color: var(--accent); }
.qa[open] summary .pm { transform: rotate(45deg); background: var(--accent-soft); border-color: var(--accent); }
.qa .ans { padding: 0 .2rem 1.4rem; color: var(--text-soft); max-width: 68ch; }

/* Testimonial styles removed on purpose: this site earns trust with checkable
   receipts, never quotes/stars — don't resurrect them. */

/* ------------------------------------------------------------- cta band --- */
.cta-band { position: relative; border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(2.5rem, 5vw, 4.5rem); text-align: center; overflow: hidden; background: var(--surface); }
.cta-band::before { content: ""; position: absolute; inset: 0; background: radial-gradient(600px 300px at 50% -20%, rgba(224,164,60,.18), transparent 70%); }
.cta-band > * { position: relative; }
.cta-band h2 { font-size: var(--text-h2); }
.cta-band p { color: var(--text-soft); font-size: var(--text-lead); margin: 1.1rem auto 2rem; max-width: 50ch; }
.cta-band .hero-cta { justify-content: center; }

/* ------------------------------------------------------------- disclaimer - */
.disclaimer { border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg-2); padding: 1.4rem 1.6rem; }
.disclaimer p { color: var(--muted); font-size: .82rem; line-height: 1.7; }
.disclaimer b { color: var(--text-soft); }

/* ----------------------------------------------------------------- footer - */
.footer { border-top: 1px solid var(--line); padding-block: 3.5rem 2.5rem; margin-top: var(--space-section); }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; }
@media (max-width: 760px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1rem; } }
.footer h4 { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-bottom: 1rem; font-weight: 500; }
.footer a { color: var(--text-soft); font-size: .92rem; display: block; padding: .3rem 0; transition: color .2s; }
.footer a:hover { color: var(--accent); }
.footer .brand { margin-bottom: 1rem; }
.footer .tag { color: var(--muted); font-size: .9rem; max-width: 34ch; }
.footer-bottom { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; margin-top: 3rem; padding-top: 1.6rem; border-top: 1px solid var(--line); color: var(--faint); font-size: .82rem; }

/* --------------------------------------------------------------- modal ---- */
.modal-overlay { position: fixed; inset: 0; z-index: 200; background: rgba(4,5,8,.74); backdrop-filter: blur(6px); display: grid; place-items: center; padding: 1.2rem; opacity: 0; pointer-events: none; transition: opacity .3s; }
.modal-overlay.open { opacity: 1; pointer-events: auto; }
.modal { width: min(440px, calc(100vw - 2.4rem)); background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); padding: 2.2rem; box-shadow: var(--shadow); transform: translateY(14px) scale(.98); transition: transform .3s var(--ease); }
.modal-overlay.open .modal { transform: none; }
.modal h3 { font-size: 1.5rem; }
.modal p { color: var(--text-soft); margin-top: .6rem; font-size: .95rem; }
.modal form { margin-top: 1.4rem; display: grid; gap: .8rem; }
.modal input { width: 100%; padding: .95rem 1.1rem; border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: var(--bg); color: var(--text); font-size: 1rem; }
.modal input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.modal .close { position: absolute; top: 1rem; right: 1rem; background: none; border: 0; color: var(--muted); font-size: 1.4rem; line-height: 1; }
.modal-wrap { position: relative; }
.modal .ok { display: none; text-align: center; }
.modal.done .ok { display: block; }
.modal.done form, .modal.done > p, .modal.done > h3 { display: none; }
.modal .ok .check { width: 54px; height: 54px; margin: 0 auto 1rem; border-radius: 50%; background: var(--up-soft); color: var(--up); display: grid; place-items: center; }
.fineprint { color: var(--faint); font-size: .82rem; text-align: center; margin-top: .4rem; }

/* ------------------------------------------------------------- reveal ----- */
[data-reveal] { opacity: 0; transition: opacity .9s var(--ease); }  /* HEAT: quiet dissolve; distinct moves live on [data-cam] */
[data-reveal].in { opacity: 1; transform: none; }
[data-reveal][data-delay="1"] { transition-delay: .08s; }
[data-reveal][data-delay="2"] { transition-delay: .16s; }
[data-reveal][data-delay="3"] { transition-delay: .24s; }

/* --------------------------------------------------- performance page ---- */
.money-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(2rem,4vw,3.5rem); align-items: center; }
@media (max-width: 940px) { .money-hero { grid-template-columns: 1fr; } }
.money-num { font-family: var(--font-display); font-weight: 700; font-size: clamp(3rem, 1.5rem + 7vw, 6.5rem); line-height: 1; letter-spacing: -.03em; }
.money-sub { display: flex; gap: .5rem; align-items: baseline; margin-top: .8rem; color: var(--text-soft); font-size: 1.05rem; }
.money-sub .from { color: var(--muted); }
.money-sub .delta { color: var(--up); font-family: var(--font-display); font-weight: 600; }
.dual-stat { display: flex; align-items: stretch; gap: 1.4rem; margin-top: 1.5rem; }
.dual-stat > span { display: flex; flex-direction: column; gap: .25rem; }
.dual-stat i { font-style: normal; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.dual-stat b { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.3rem, 1rem + 1.4vw, 1.9rem); color: var(--text); }
.dual-stat b.dgreen { color: var(--up); text-shadow: var(--up-glow); }
.dual-stat .dsep { width: 1px; background: var(--line); align-self: stretch; }
@media (max-width: 520px) { .dual-stat { gap: 1rem; } .dual-stat .dsep { display: none; } }

.perf-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; }
@media (max-width: 760px) { .perf-stats { grid-template-columns: 1fr 1fr; } }
.perf-stats .stat .num { font-size: clamp(1.6rem, 1rem + 2.4vw, 2.4rem); }
.perf-stats .stat .num.up { color: var(--up); }

/* equity chart card */
.chart-card { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); padding: clamp(1.2rem, 2.5vw, 2rem); }
.chart-head { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: flex-end; margin-bottom: 1.2rem; }
.chart-head h3 { font-size: var(--text-h3); }
.chart-legend { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; font-size: .88rem; }
.chart-legend span { display: inline-flex; align-items: center; gap: .5rem; color: var(--text-soft); }
.chart-legend .sw { width: 22px; height: 3px; border-radius: 2px; }
.chart-legend .sw.port { background: var(--flame); }
.chart-legend .sw.sp { background: var(--muted); }
.chart-controls { display: flex; flex-wrap: wrap; gap: .8rem; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.seg { display: inline-flex; gap: .25rem; padding: .28rem; border: 1px solid var(--line); border-radius: var(--radius-pill); background: var(--bg-2); }
.seg button { border: 0; background: none; color: var(--text-soft); padding: .48rem 1rem; border-radius: var(--radius-pill); font-size: .88rem; font-weight: 500; transition: all .2s; white-space: nowrap; }
.seg button:hover { color: var(--text); }
.seg button.active { background: var(--accent-soft); color: var(--accent-3); }
#range-seg button { font-family: var(--font-mono); }
.peak-note { display: flex; gap: .5rem; align-items: baseline; padding: .85rem 1.1rem; margin-bottom: 1rem; border: 1px solid var(--accent-line); background: var(--accent-soft); border-radius: 12px; color: var(--text-soft); font-size: .88rem; }
.peak-note b { color: var(--accent-3); font-weight: 600; }
/* compact chart legend (replaces the bulky descriptive paragraph) */
.peak-legend { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.4rem; padding: .7rem .95rem; margin: 0 0 1rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); font-size: .8rem; color: var(--muted); }
.peak-legend li { display: inline-flex; align-items: center; gap: .45rem; }
.peak-legend b { color: var(--text-soft); font-weight: 600; }
.peak-legend .lg-sw { width: 18px; height: 3px; border-radius: 2px; flex: none; }
.peak-legend .lg-sw.gold { background: #e0a43c; }
.peak-legend .lg-sw.green { background: #2ee08f; }
.peak-legend .lg-sw.sp { background: var(--muted); height: 0; border-top: 2px dashed var(--muted); }
.peak-legend .lg-base { margin-left: auto; color: var(--text-soft); }
@media (max-width: 620px) { .peak-legend .lg-base { margin-left: 0; flex-basis: 100%; padding-top: .4rem; border-top: 1px solid var(--line); } }
/* dashboard legend sits in a narrower column than the performance page — stack it
   vertically, one series per row, with the dollar values aligned in a right column. */
#d-chart-legend { flex-direction: column; align-items: stretch; gap: .5rem; line-height: 1.4; }
#d-chart-legend li { display: flex; align-items: baseline; gap: .5rem; width: 100%; }
#d-chart-legend li .lg-sw { align-self: center; }
#d-chart-legend li b.mono { margin-left: auto; white-space: nowrap; color: var(--text); }
#d-chart-legend .lg-base { margin-left: 0; display: block; padding-top: .55rem; margin-top: .1rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .76rem; }
#equity-chart { width: 100%; height: auto; display: block; }
.ec-grid { stroke: var(--line); stroke-width: 1; }
.ec-ylbl { fill: var(--faint); font-family: var(--font-mono); font-size: 13px; text-anchor: end; }
.ec-xlbl { fill: var(--faint); font-family: var(--font-mono); font-size: 13px; text-anchor: middle; }
.ec-port { stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.ec-sp { stroke: var(--muted); stroke-width: 2; stroke-dasharray: 5 5; opacity: .8; }
.ec-dot { fill: var(--accent); stroke: var(--bg); stroke-width: 2; }
.ec-dot-sp { fill: var(--muted); stroke: var(--bg); stroke-width: 2; }
.ec-endlbl { font-family: var(--font-display); font-weight: 700; font-size: 16px; }
.ec-endlbl-port { fill: var(--accent-3); }
.ec-endlbl-sp { fill: var(--muted); font-size: 14px; font-weight: 500; }

/* draw-in animation for the portfolio line */
.ec-port { stroke-dasharray: 2600; stroke-dashoffset: 2600; animation: draw 2.2s var(--ease) forwards; }
@keyframes draw { to { stroke-dashoffset: 0; } }

.status { font-family: var(--font-mono); font-size: .8rem; }
.status.st-real { color: var(--up); }
.status.st-open { color: var(--muted); }

.method { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (max-width: 700px) { .method { grid-template-columns: 1fr; } }
.method .m { padding: 1.2rem 1.4rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.method .m h4 { font-family: var(--font-display); font-size: 1.02rem; margin-bottom: .4rem; display: flex; gap: .5rem; align-items: center; }
.method .m h4 span { color: var(--accent); font-family: var(--font-mono); font-size: .8rem; }
.method .m p { color: var(--muted); font-size: .9rem; }

/* page hero (sub pages) */
.page-hero { padding-block: clamp(3rem, 2rem + 5vw, 6rem) clamp(2rem, 4vw, 3.5rem); }
.page-hero h1 { font-size: clamp(2.4rem, 1.4rem + 4vw, 4.4rem); }
.page-hero p { margin-top: 1.2rem; }
.breadcrumb { font-family: var(--font-mono); font-size: .78rem; color: var(--muted); margin-bottom: 1.2rem; }
.breadcrumb a:hover { color: var(--accent); }

/* ============================================================================
   GLASSMORPHISM PASS — unify floating cards as true glass (translucent fill +
   backdrop blur + 1px inner edge highlight). Data tiles (.stat) stay solid
   navy panels for an institutional, dashboard feel.
   ========================================================================== */
.step, .feature, .win, .plan, .cond, .quote, .trust-card,
.chart-card, .cta-band, .method .m, .tr-table-wrap, .scanner,
.disclaimer, .qa-wrap {
  background: var(--glass);
  -webkit-backdrop-filter: var(--blur);
  backdrop-filter: var(--blur);
  box-shadow: var(--glass-edge), 0 18px 50px -34px rgba(4, 8, 20, 0.85);
}
.plan.featured {
  background: linear-gradient(180deg, rgba(224, 164, 60, 0.12), rgba(255, 255, 255, 0.02));
  box-shadow: var(--glass-edge), var(--shadow-glow);
}
.modal {
  background: linear-gradient(180deg, rgba(28, 36, 56, 0.92), rgba(18, 24, 40, 0.92));
  -webkit-backdrop-filter: var(--blur);
  backdrop-filter: var(--blur);
}
/* the feature card had a 2-stop gradient — keep a hint of it under the glass */
.feature { background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.015)); }

/* trust pillar cards (replaces fabricated testimonials) */
.trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
@media (max-width: 900px) { .trust-grid { grid-template-columns: 1fr; } }
.trust-card { padding: 1.8rem; border: 1px solid var(--line); border-radius: var(--radius); transition: border-color .3s, transform .3s; }
.trust-card:hover { transform: translateY(-3px); border-color: var(--accent-line); }
.trust-card .ti { width: 44px; height: 44px; border-radius: 12px; background: var(--accent-soft); display: grid; place-items: center; color: var(--accent-3); margin-bottom: 1.1rem; }
.trust-card h3 { font-size: 1.12rem; margin-bottom: .55rem; }
.trust-card p { color: var(--text-soft); font-size: .95rem; }
.trust-card .verify { margin-top: 1rem; font-family: var(--font-mono); font-size: .76rem; color: var(--accent); display: inline-flex; align-items: center; gap: .4rem; }

/* provenance strip */
.provenance { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .8rem 1.6rem; padding: 1.1rem 1.4rem; border: 1px solid var(--line); border-radius: var(--radius-pill); margin-inline: auto; max-width: max-content; }
.provenance span { display: inline-flex; align-items: center; gap: .55rem; color: var(--text-soft); font-size: .88rem; }
.provenance svg { color: var(--accent); flex: none; }
@media (max-width: 620px) { .provenance { border-radius: var(--radius); } }

/* legal / long-form pages */
.legal { max-width: 800px; margin-inline: auto; }
.legal h2 { font-size: 1.5rem; margin: 2.4rem 0 .8rem; scroll-margin-top: 90px; }
.legal h2:first-of-type { margin-top: 0; }
.legal p, .legal li { color: var(--text-soft); font-size: .96rem; line-height: 1.75; margin-bottom: .9rem; }
.legal ul { padding-left: 1.2rem; list-style: disc; }
.legal .updated { color: var(--faint); font-family: var(--font-mono); font-size: .8rem; }

/* 404 */
.notfound { min-height: 60vh; display: grid; place-items: center; text-align: center; }
.notfound .code { font-family: var(--font-display); font-weight: 700; font-size: clamp(5rem, 18vw, 11rem); line-height: 1; }

/* ============================================================================
   DELIGHT LAYER — earned dopamine. Green-glowing gains, satisfying count-ups,
   spotlight hover, a tasteful confetti burst on signup. Tasteful, not casino.
   ========================================================================== */

/* gains glow green — the reward signal */
.gain-pill { box-shadow: var(--up-glow); }
.gain-pill.big, .gain-pill.huge { box-shadow: 0 0 24px rgba(224, 164, 60, .30); }
.win .big-gain, .money-num, .stat .num.up, .money-sub .delta { text-shadow: 0 0 30px rgba(46, 224, 143, .18); }
.tape-item .gain { text-shadow: var(--up-glow); }

/* count-ups flash bright on landing, then settle */
@keyframes countLand { 0% { filter: brightness(1.9); } 100% { filter: brightness(1); } }
.count-land { animation: countLand .7s var(--ease); }

/* upward pulse on the live win chip */
.live-win { display: inline-flex; align-items: center; gap: .55rem; padding: .4rem .8rem; border-radius: var(--radius-pill); border: 1px solid var(--up-line); background: var(--up-soft); color: var(--up); font-family: var(--font-mono); font-size: .8rem; font-weight: 500; }
.live-win .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--up); box-shadow: var(--up-glow); animation: pulse 1.6s var(--ease) infinite; }
.live-win .arw { animation: floatUp 1.8s var(--ease) infinite; }
@keyframes floatUp { 0%,100% { transform: translateY(0); opacity: .8; } 50% { transform: translateY(-3px); opacity: 1; } }

/* SPOTLIGHT hover — cursor-following glow border on cards (premium delight) */
.spotlight { position: relative; isolation: isolate; }
.spotlight::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px;
  background: radial-gradient(180px circle at var(--mx, 50%) var(--my, 0%), var(--accent-line), transparent 60%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .3s var(--ease); pointer-events: none; z-index: 2;
}
.spotlight:hover::before { opacity: 1; }
.spotlight::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1;
  background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 0%), rgba(255,255,255,.05), transparent 55%);
  opacity: 0; transition: opacity .3s var(--ease);
}
.spotlight:hover::after { opacity: 1; }
.win.spotlight:hover, .trust-card.spotlight:hover { border-color: var(--up-line); }

/* primary button shine sweep on hover */
.btn-primary { overflow: hidden; }
.btn-primary::after {
  content: ""; position: absolute; top: 0; left: -120%; width: 60%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform: skewX(-18deg); transition: none;
}
.btn-primary:hover::after { left: 140%; transition: left .7s var(--ease); }

/* confetti canvas overlay */
#confetti { position: fixed; inset: 0; z-index: 250; pointer-events: none; }

/* waitlist success — celebratory bounce-in */
@keyframes popIn { 0% { transform: scale(.6); opacity: 0; } 60% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }
.modal.done .ok .check { animation: popIn .55s var(--ease) both; box-shadow: var(--up-glow); }
.modal.done .ok h3 { animation: popIn .5s var(--ease) .1s both; }

/* live shimmer sweep across the hero headline */
.hero h1 .gradient-text, .page-hero h1 .gradient-text, .money-num {
  background-size: 220% auto; animation: shimmer 7s linear infinite;
}
@keyframes shimmer { to { background-position: 220% center; } }

/* rotating live-win chip — fades as it cycles real wins */
.live-win b { transition: opacity .35s var(--ease); }
.live-win.swap b { opacity: 0; }

/* magnetic buttons get a smooth spring back */
.btn-lg { transition: transform .3s var(--ease), box-shadow .25s var(--ease), background .25s, color .25s; }

/* inline form error (no window.alert, ever) */
.form-error { color: var(--down); font-size: .85rem; margin-top: -.2rem; min-height: 1.1em; }

@media (prefers-reduced-motion: reduce) {
  .live-win .dot, .live-win .arw, .btn-primary::after, .count-land,
  .hero h1 .gradient-text, .page-hero h1 .gradient-text, .money-num { animation: none; }
  #confetti { display: none; }
}

/* ============================================================================
   ACCOUNTS — login + member dashboard (customer interface)
   ========================================================================== */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.btn-text { background: none; border: 0; color: var(--muted); font-size: .88rem; padding: .8rem; width: 100%; margin-top: .4rem; transition: color .2s; }
.btn-text:hover { color: var(--text); }

/* tier chip */
.tier-chip { font-family: var(--font-mono); font-size: .66rem; font-weight: 600; letter-spacing: .08em; padding: .22rem .5rem; border-radius: var(--radius-pill); vertical-align: middle; margin-left: .3rem; }
.tier-chip.free { background: rgba(173,190,230,.12); color: var(--text-soft); }
.tier-chip.pro { background: var(--flame); color: #1a1206; }

/* login */
.auth-wrap { min-height: 72vh; display: grid; place-items: center; padding-block: clamp(2rem,5vw,4rem); }
.auth-card { width: min(440px, 100%); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.8rem, 4vw, 2.6rem); text-align: center; }
.auth-spark { width: 64px; height: 64px; margin: 0 auto 1.2rem; border-radius: 16px; background: var(--accent-soft); display: grid; place-items: center; }
.auth-card h1 { font-size: 1.9rem; }
.auth-sub { color: var(--text-soft); margin-top: .6rem; }
.auth-card form { margin-top: 1.6rem; display: grid; gap: .7rem; text-align: left; }
.auth-card input { width: 100%; padding: .95rem 1.1rem; border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: var(--bg); color: var(--text); font-size: 1rem; }
.auth-card input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.auth-fine { color: var(--faint); font-size: .78rem; margin-top: 1.2rem; }
.auth-fine a { color: var(--muted); } .auth-fine a:hover { color: var(--accent); }
.auth-success { margin-top: 1.6rem; text-align: center; animation: fade-in .4s ease; }
.auth-success-title { font-size: 1.3rem; font-weight: 600; color: var(--up, #2ee08f); margin-bottom: .6rem; }
.auth-success-body { color: var(--text-soft); margin-bottom: .8rem; }
.auth-success-body strong { color: var(--text); }
@keyframes fade-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* dashboard layout */
.dash-head { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: flex-end; margin-bottom: 1.4rem; }
.dash-hi { color: var(--muted); font-size: .9rem; }
.dash-head h1 { font-size: clamp(1.8rem, 1rem + 3vw, 2.8rem); margin-top: .2rem; }
.dash-email { color: var(--faint); font-size: .85rem; margin-top: .3rem; }
.dash-head-right { display: flex; align-items: center; gap: .9rem; }
.dash-head-right .tier-chip { font-size: .76rem; padding: .35rem .7rem; }

.dash-live { display: flex; align-items: center; gap: .7rem; padding: .9rem 1.2rem; border: 1px solid var(--up-line); border-radius: var(--radius); font-size: .92rem; color: var(--text-soft); margin-bottom: 1.6rem; }
.dash-live.idle { border-color: var(--line); }
.ls-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--up); box-shadow: var(--up-glow); animation: pulse 1.6s var(--ease) infinite; flex: none; }
.dash-live.idle .ls-dot { background: var(--faint); box-shadow: none; animation: none; }

.dash-grid { display: grid; grid-template-columns: 1.9fr 1fr; gap: 1.4rem; align-items: stretch; }
@media (max-width: 980px) { .dash-grid { grid-template-columns: 1fr; } }
/* explainer card above the three alert columns */
.dash-explainer { padding: clamp(1.4rem, 2.5vw, 2rem); margin-bottom: 1.4rem; }
.dash-explainer .dx-head h2 { font-size: 1.25rem; margin-bottom: .5rem; }
.dash-explainer .dx-head p { color: var(--muted); font-size: .92rem; line-height: 1.6; max-width: 78ch; }
.dash-explainer .dx-head b { color: var(--text-soft); }
.sig-grid { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: .9rem; margin: 1.3rem 0; padding: 0; }
@media (max-width: 1040px) { .sig-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .sig-grid { grid-template-columns: 1fr; } }
.sig-grid li { display: flex; gap: .65rem; align-items: flex-start; }
.sig-n { flex: none; width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; font-family: var(--font-mono); font-size: .72rem; font-weight: 700; color: var(--accent-3, #e0a43c); background: var(--accent-soft); border: 1px solid var(--accent-line); margin-top: .1rem; }
.sig-grid li div { display: flex; flex-direction: column; gap: .15rem; }
.sig-grid li b { font-size: .86rem; color: var(--text); }
.sig-grid li span { font-size: .8rem; color: var(--muted); line-height: 1.45; }
.cs-split { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.1rem; }
@media (max-width: 720px) { .cs-split { grid-template-columns: 1fr; } }
.cs-card { padding: 1rem 1.15rem; border-radius: 12px; border: 1px solid var(--line); background: rgba(255,255,255,.02); }
.cs-card.coiled { border-color: rgba(224,164,60,.35); background: rgba(224,164,60,.05); }
.cs-card.spec { border-color: rgba(106,166,255,.3); background: rgba(106,166,255,.05); }
.cs-card h3 { font-size: 1rem; display: flex; align-items: center; gap: .4rem; margin-bottom: .4rem; }
.cs-card p { font-size: .85rem; color: var(--text-soft); line-height: 1.55; }
.cs-card b { color: var(--text); }
.dx-foot { margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .85rem; color: var(--muted); }
.dx-foot b { color: var(--text-soft); }
/* top row: three equal-height columns (coiled · speculative · account) */
.dash-top3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.4rem; align-items: stretch; }
@media (max-width: 1040px) { .dash-top3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 720px) { .dash-top3 { grid-template-columns: 1fr; } }
.dash-col-sub { font-size: .82rem; color: var(--muted); margin: -.5rem 0 1.1rem; line-height: 1.45; }
.al-dot { display: inline-block; width: .56rem; height: .56rem; border-radius: 50%; vertical-align: middle; margin-right: .15rem; }
.al-dot.coiled { background: var(--accent, #e0a43c); box-shadow: 0 0 8px rgba(224,164,60,.6); }
.al-dot.spec { background: #6aa6ff; box-shadow: 0 0 8px rgba(106,166,255,.5); }
.al-why { display: block; font-size: .78rem; color: var(--text-soft); margin-top: .25rem; }
.al-when { display: block; font-family: var(--font-mono); font-size: .72rem; color: var(--muted); margin-top: .2rem; }
.al-freshness { font-family: var(--font-mono); font-size: .68rem; letter-spacing: .02em; margin: -.15rem 0 .6rem; opacity: .85; }
.al-stamps { display: block; }
.al-stamps .al-when { margin-top: .15rem; }
.al-expand { display: block; width: 100%; margin-top: .7rem; padding: .5rem; background: rgba(255,255,255,.03); border: 1px solid var(--line); border-radius: 8px; color: var(--accent-3, #e0a43c); font-family: var(--font-mono); font-size: .76rem; font-weight: 600; letter-spacing: .03em; cursor: pointer; transition: background .15s, border-color .15s; }
.al-expand:hover { background: var(--accent-soft); border-color: var(--accent-line); }
.al-quality { font-family: var(--font-mono); font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; padding: .15rem .4rem; border-radius: var(--radius-pill); margin-left: .45rem; }
.al-quality.prime { background: rgba(224,164,60,.16); color: var(--accent-3, #e0a43c); }
.al-quality.strong { background: rgba(106,166,255,.14); color: #6aa6ff; }
.al-quality.near { background: rgba(46,224,143,.14); color: var(--up, #2ee08f); }
.al-quality.illiq { background: rgba(255,107,107,.14); color: #ff6b6b; }
.al-quality.base { background: rgba(255,255,255,.06); color: var(--muted); }
.al-quality.held { background: rgba(148,163,184,.18); color: #cbd5e1; }
.al-quality.ev, .ev-mark { background: rgba(168,120,255,.16); color: #b794ff; font-family: var(--font-mono); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; padding: .15rem .4rem; border-radius: var(--radius-pill); margin-left: .45rem; white-space: nowrap; }
/* status-tag legend (dashboard explainer + positions note) */
.tag-key { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.tag-key h3 { font-size: 1.02rem; margin: 0 0 .5rem; }
.tag-key-lead { color: var(--text-soft); margin: 0 0 .7rem; }
.tag-key-plan { background: rgba(224,164,60,.10); border: 1px solid rgba(224,164,60,.28); border-radius: 10px; padding: .7rem .9rem; margin: 0 0 1rem; font-size: .92rem; color: var(--text); }
.tag-key-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.tag-key-list li { display: flex; align-items: flex-start; gap: .7rem; font-size: .9rem; color: var(--text-soft); }
.tag-key-list li > span:first-child { flex: 0 0 auto; margin-top: .12rem; white-space: nowrap; }
.tag-key-list li > span:last-child { flex: 1; }
.tag-key-odds { margin: 1rem 0 0; padding-top: .9rem; border-top: 1px dashed var(--line); font-size: .9rem; color: var(--text-soft); line-height: 1.6; }
.tag-key-odds .al-odds { margin-right: .35rem; }
.pos-tag-note { font-size: .82rem; color: var(--muted); margin: -.3rem 0 .9rem; line-height: 1.9; }
.pos-tag-note .pos-setup { margin: 0 .12rem; }
/* alert-column sort control */
.alert-sort { display: flex; align-items: center; gap: .4rem; margin: 1.4rem 0 .7rem; flex-wrap: wrap; }
.alert-sort .as-label { font-size: .82rem; color: var(--muted); margin-right: .2rem; }
.as-btn { font-family: var(--font-mono); font-size: .78rem; padding: .3rem .75rem; border-radius: var(--radius-pill); border: 1px solid var(--line); background: rgba(255,255,255,.03); color: var(--text-soft); cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.as-btn:hover { border-color: var(--accent, #e0a43c); color: var(--text); }
.as-btn.active { background: rgba(224,164,60,.16); border-color: var(--accent, #e0a43c); color: var(--accent, #e0a43c); font-weight: 700; }
.as-dir { font-size: .8rem; color: var(--muted); user-select: none; margin-left: .1rem; }
.al-locked-note { font-size: .8rem; color: var(--muted); margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--line); }
.al-locked-note b { color: var(--text-soft); }
.al-unlock-link { color: var(--accent-3, #e0a43c); cursor: pointer; text-decoration: underline; font-weight: 600; }
/* Member dashboard runs wider than the marketing pages so the portfolio chart +
   table get room to breathe (left column ≈ the track-record table width). */
.dash.wrap { width: min(100% - 2.4rem, 1460px); }
#d-equity-chart { max-height: 340px; }
.dash-main, .dash-side { display: grid; gap: 1.4rem; }
.dash-card { border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(1.3rem, 2.5vw, 1.8rem); }
.dash-card-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 1.1rem; }
.dash-card-head h2 { font-size: 1.2rem; }
.dash-muted { color: var(--muted); font-size: .9rem; }
a.dash-muted:hover { color: var(--accent); }

/* alert rows */
.alert-row { display: flex; justify-content: space-between; align-items: flex-start; padding: .85rem 0; border-bottom: 1px solid var(--line); }
.alert-row:last-child { border-bottom: 0; }
.al-left { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
/* rank + explosion-odds + the four numbers + plain-English why bullets */
.al-rank { font-family: var(--font-mono); font-weight: 700; font-size: .8rem; color: var(--muted); margin-right: .45rem; }
.al-odds { font-family: var(--font-mono); font-size: .64rem; font-weight: 700; letter-spacing: .04em; padding: .16rem .45rem; border-radius: var(--radius-pill); margin-left: .5rem; }
.al-odds.hi { background: rgba(74,222,128,.16); color: #4ade80; }
.al-odds.mid { background: rgba(224,164,60,.16); color: var(--accent, #e0a43c); }
.al-odds.lo { background: rgba(136,147,168,.14); color: var(--muted); }
.odds-trend { font-family: var(--font-mono); font-size: .6rem; font-weight: 700; letter-spacing: .03em; margin-left: .3rem; white-space: nowrap; }
.odds-trend.down { color: #f87171; }
.odds-trend.up { color: #4ade80; }
.odds-trend.flat { color: var(--muted); }
.al-nums { display: flex; flex-wrap: wrap; gap: .3rem .9rem; font-family: var(--font-mono); font-size: .74rem; color: var(--text-soft); margin: .1rem 0 .05rem; }
.al-nums b { color: var(--text); font-weight: 700; }
.al-nums b.up { color: #4ade80; } .al-nums b.down { color: #f87171; }
.al-why-list { list-style: none; margin: .2rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .22rem; }
.al-why-list li { position: relative; padding-left: .95rem; font-size: .8rem; line-height: 1.35; color: var(--text-soft); }
.al-why-list li::before { content: "•"; position: absolute; left: .1rem; color: var(--accent, #e0a43c); }
/* holdings: setup-status badge + why sub-line + alert time */
.pos-tk-wrap { display: flex; flex-direction: column; gap: .22rem; }
.pos-badges { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; }
.pos-setup { font-family: var(--font-mono); font-size: .6rem; font-weight: 700; letter-spacing: .03em; padding: .12rem .4rem; border-radius: var(--radius-pill); }
.pos-setup.coiled { background: rgba(224,164,60,.16); color: var(--accent, #e0a43c); }
.pos-setup.igniting { background: rgba(74,222,128,.16); color: #4ade80; }
.pos-setup.broke { background: rgba(248,113,113,.15); color: #f87171; }
.pos-setup.extended { background: rgba(74,222,128,.14); color: #4ade80; }
.pos-setup.basing { background: rgba(148,163,184,.16); color: #94a3b8; }
.pos-setup.cooled { background: rgba(251,191,36,.15); color: #fbbf24; }
.pos-why { font-size: .74rem; line-height: 1.3; color: var(--text-soft); max-width: 30ch; }
.pos-time { display: block; font-size: .68rem; color: var(--muted); margin-top: .1rem; }
.al-tk { font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; }
/* wrap badges to a new line as WHOLE units (never split a badge's text across two lines);
   row-gap keeps wrapped lines tidy; works the same on desktop + mobile. */
.al-row-top { display: flex; flex-wrap: wrap; align-items: center; row-gap: .35rem; }
.al-odds, .pos-setup, .al-quality, .odds-trend { white-space: nowrap; flex: 0 0 auto; }
.al-tag { display: inline-block; font-size: .6rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: .12rem .45rem; border-radius: 999px; margin-left: .5rem; vertical-align: middle; }
.al-tag.coiled { background: rgba(224,164,60,.14); color: var(--accent); border: 1px solid rgba(224,164,60,.35); }
.al-tag.spec { background: rgba(136,147,168,.12); color: var(--muted); border: 1px solid rgba(136,147,168,.28); }
.al-right { display: flex; align-items: center; gap: .7rem; }
.al-score { font-family: var(--font-mono); font-size: .8rem; color: var(--accent-3); }
.al-follow { background: none; border: 0; color: var(--muted); font-size: 1.2rem; line-height: 1; transition: color .2s, transform .2s; }
.al-follow:hover { transform: scale(1.2); color: var(--accent); }
.al-follow.on { color: var(--accent); }
.locked-stack { position: relative; margin-top: .4rem; filter: blur(5px); opacity: .5; pointer-events: none; user-select: none; -webkit-mask: linear-gradient(#000, transparent); mask: linear-gradient(#000, transparent); }
.unlock { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between; margin-top: -2.2rem; position: relative; padding: 1.2rem; border: 1px solid var(--accent-line); border-radius: var(--radius); background: var(--accent-soft); }
.unlock p { font-size: .86rem; margin-top: .2rem; max-width: 40ch; }

/* portfolio mini */
.dash-port { display: flex; gap: 1.2rem; align-items: stretch; }
.dash-port > div { display: flex; flex-direction: column; gap: .25rem; }
.dash-port i { font-style: normal; font-family: var(--font-mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.dash-port b { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.4rem, 1rem + 1.6vw, 2rem); }
.dash-port b.dgreen { color: var(--up); text-shadow: var(--up-glow); }
.dash-port .dsep { width: 1px; background: var(--line); }
.dash-following { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid var(--line); }

/* plan card */
.plan-card .plan-top { display: flex; justify-content: space-between; align-items: center; }
.plan-card .plan-top h2 { font-size: 1.2rem; }
.plan-price { display: flex; align-items: baseline; gap: .3rem; margin: .8rem 0 .3rem; }
.plan-price b { font-family: var(--font-display); font-weight: 700; font-size: 2.6rem; line-height: 1; }
.plan-price span { color: var(--muted); font-size: .9rem; }
.plan-have { display: grid; gap: .6rem; margin: 1.2rem 0; }
.plan-have li { display: flex; gap: .55rem; align-items: flex-start; color: var(--text-soft); font-size: .9rem; }
.plan-have li.off { color: var(--faint); }
.plan-have svg { flex: none; margin-top: .15rem; }
.plan-upsell { padding: 1rem; border: 1px solid var(--accent-line); border-radius: 12px; background: var(--accent-soft); margin-bottom: 1rem; }
.plan-upsell b { color: var(--accent-3); }
.plan-upsell p { font-size: .84rem; margin-top: .2rem; }

/* settings rows + switch */
.dash-row { display: flex; justify-content: space-between; align-items: center; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.dash-row:last-of-type { border-bottom: 0; }
.switch { appearance: none; -webkit-appearance: none; width: 42px; height: 24px; border-radius: 999px; background: var(--surface-3); position: relative; cursor: pointer; transition: background .25s; flex: none; }
.switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .25s var(--ease); }
.switch:checked { background: var(--up); }
.switch:checked::after { transform: translateX(18px); }

/* Scanner countdown chip (anticipation) — gold variant of .live-win */
.scan-count { margin-top: .9rem; color: var(--accent); border-color: var(--accent-line); background: var(--accent-soft); }
.scan-count .dot { background: var(--accent); box-shadow: 0 0 10px var(--accent); }

/* ==========================================================================
   HEAT LAYER — cinematic system (design/cinematic/compiled-spec.md)
   Steel-blue night · sodium lamps · stillness → decisive action
   ========================================================================== */

/* dossier micro-label voice */
.k-label{font-family:var(--font-mono);font-weight:600;font-size:.68rem;line-height:1;
  letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}

/* corner-tick surveillance frame (visual-elements) */
.panel-ticks{position:relative}
.panel-ticks::before,.panel-ticks::after{content:"";position:absolute;width:12px;height:12px;opacity:.5;pointer-events:none}
.panel-ticks::before{top:-1px;left:-1px;border-top:2px solid var(--ice);border-left:2px solid var(--ice)}
.panel-ticks::after{bottom:-1px;right:-1px;border-bottom:2px solid var(--ice);border-right:2px solid var(--ice)}

/* tabular data discipline */
table,.mono,.al-nums,.gain-pill,[data-stat],.stat .num{font-variant-numeric:tabular-nums}

/* ---------------------------------------------------- camera entrances -- */
[data-cam]{will-change:transform,opacity}
[data-cam="fade"]{opacity:0;transition:opacity var(--t-slow) var(--ease)}
[data-cam="crane"]{opacity:0;transform:translateY(-42px);transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease)}
[data-cam="curtain"]{clip-path:inset(0 100% 0 0);transition:clip-path .8s var(--snap)}
[data-cam="steadicam"]{opacity:0;transform:translateY(26px) scale(.985);transition:opacity 1.6s var(--ease),transform 1.6s var(--ease)}
[data-cam="rack"]{opacity:0;filter:blur(14px);transform:scale(1.04);transition:opacity 1s var(--ease),filter 1s var(--ease),transform 1s var(--ease)}
[data-cam="dolly"]{opacity:0;transform:scale(.9);transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease)}
[data-cam="burst"]{opacity:0;transform:scale(1.6);transition:opacity .55s var(--snap),transform .55s var(--snap)}
[data-cam].in{opacity:1;transform:none;clip-path:inset(0 0 0 0);filter:none}
[data-cam="stagger"]>*{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-cam="stagger"].in>*{opacity:1;transform:none}
[data-cam="stagger"].in>*:nth-child(1){transition-delay:0ms}
[data-cam="stagger"].in>*:nth-child(2){transition-delay:60ms}
[data-cam="stagger"].in>*:nth-child(3){transition-delay:120ms}
[data-cam="stagger"].in>*:nth-child(4){transition-delay:180ms}
[data-cam="stagger"].in>*:nth-child(5){transition-delay:240ms}
[data-cam="stagger"].in>*:nth-child(6){transition-delay:300ms}
[data-cam="stagger"].in>*:nth-child(7){transition-delay:360ms}
[data-cam="stagger"].in>*:nth-child(n+8){transition-delay:420ms}
@media (prefers-reduced-motion:reduce){
  [data-cam],[data-cam]>*{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important;transition:none!important}}

/* -------------------------------------------- homepage: the Overlook ----- */
.hero-night{position:relative;overflow:hidden;
  border-top:2px solid var(--line-strong);border-bottom:2px solid var(--line-strong)} /* letterbox #73 */
.hero-night .pool-a,.hero-night .pool-b,.hero-night .lights,.hero-night .ghost{position:absolute;pointer-events:none}
.hero-night .pool-a{inset:-20% -10% auto;height:80%;
  background:radial-gradient(60% 50% at 70% 20%,rgba(63,96,138,.28),transparent 70%)}
.hero-night .pool-b{bottom:-30%;left:-10%;width:70%;height:70%;
  background:radial-gradient(50% 45% at 30% 80%,rgba(232,161,60,.10),transparent 70%)}
.hero-night .lights{inset:0;background-image:
  radial-gradient(1.5px 1.5px at 12% 34%,rgba(156,195,230,.55),transparent 100%),
  radial-gradient(1px 1px at 28% 62%,rgba(156,195,230,.35),transparent 100%),
  radial-gradient(1.5px 1.5px at 41% 22%,rgba(156,195,230,.45),transparent 100%),
  radial-gradient(1px 1px at 57% 48%,rgba(156,195,230,.30),transparent 100%),
  radial-gradient(1.5px 1.5px at 66% 71%,rgba(156,195,230,.5),transparent 100%),
  radial-gradient(1px 1px at 79% 30%,rgba(156,195,230,.35),transparent 100%),
  radial-gradient(1.5px 1.5px at 88% 58%,rgba(156,195,230,.45),transparent 100%),
  radial-gradient(1px 1px at 8% 76%,rgba(156,195,230,.3),transparent 100%),
  radial-gradient(1px 1px at 48% 84%,rgba(156,195,230,.34),transparent 100%),
  radial-gradient(2px 2px at 22% 81%,rgba(232,161,60,.85),transparent 100%),
  radial-gradient(2px 2px at 63% 26%,rgba(232,161,60,.8),transparent 100%),
  radial-gradient(2px 2px at 84% 76%,rgba(232,161,60,.75),transparent 100%);
  background-size:210% 210%;animation:cityDrift var(--drift) linear infinite alternate}
@keyframes cityDrift{from{background-position:0% 0%}to{background-position:8% 6%}}
.hero-night .ghost{right:1%;bottom:4%;font:700 clamp(7rem,20vw,17rem)/1 var(--font-mono);
  color:rgba(139,163,196,.055);letter-spacing:-.05em;user-select:none;z-index:0}
.hero-night .hero-grid{position:relative;z-index:1}
.hero-night h1{font-weight:300}
.hero-night h1 b,.hero-night h1 .gradient-text{font-weight:700}
@media (prefers-reduced-motion:reduce){.hero-night .lights{animation:none}}

/* noir shadow-crawl (interaction #6 — marketing cards only) */
.card-noir{transition:box-shadow .45s var(--ease),border-color .45s var(--ease)}
.card-noir:hover{box-shadow:10px 12px 0 rgba(0,0,0,.55);border-color:var(--accent-line)}

/* --------------------------------------------- performance: the Ledger -- */
.page-hero{border-bottom:1px solid var(--line)}
.money-hero .dual-stat b{font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.tr thead th{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.tr tbody tr{border-bottom:1px solid var(--line)}
.tr tbody tr:hover{background:#111b2a}                      /* slate lift, no glow */

/* ------------------------------------------- dashboard: the Command Post -- */
#d-live{border-left:3px solid var(--accent);position:relative;overflow:hidden}
#d-live::after{content:"";position:absolute;top:0;bottom:0;width:34%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(156,195,230,.05),transparent);
  animation:sweep 7s var(--ease) infinite}
@keyframes sweep{from{left:-40%}to{left:110%}}
@media (prefers-reduced-motion:reduce){#d-live::after{animation:none}}
@media (min-width:1041px){.dash-top3{grid-template-columns:1.15fr 1fr .85fr}} /* unequal dossier rails */
.alert-row{border-left:3px solid var(--line-strong);padding-left:.8rem;margin-bottom:2px;
  border-bottom:1px solid var(--line)}
.alert-row:has(.al-quality.prime){border-left-color:var(--accent)}   /* fresh lamp rail */
.dash-card{border-radius:var(--radius-lg)}

/* --------------------------------------------------- blog: the Case Files -- */
.file-list{list-style:none;margin:0;padding:0}
.file-list li{display:grid;grid-template-columns:110px 1fr;gap:1.2rem;padding:1rem 0;
  border-bottom:1px solid var(--line);align-items:baseline}
.file-list time{font-family:var(--font-mono);font-size:.78rem;color:var(--faint)}
blockquote,.pull{border-left:3px solid var(--accent-2);padding:.4rem 0 .4rem 1.2rem;
  font-weight:300;font-style:italic;color:var(--text-soft)}

/* ==========================================================================
   HEAT LAYER 2 — the spectacle pass (canvas city, skyline, monumental title)
   ========================================================================== */

/* living city canvas — fades up like a projector warming */
#city-lights{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
  opacity:0;animation:projector 2.4s var(--ease) .2s forwards}
@keyframes projector{to{opacity:1}}
@media (prefers-reduced-motion:reduce){#city-lights{animation:none;opacity:1}}

/* skyline silhouettes on the horizon — two depth planes */
.hero-night .sky-far,.hero-night .sky-near{position:absolute;left:0;right:0;bottom:0;pointer-events:none}
.hero-night .sky-far{height:120px;background:#070c15;opacity:.9;
  clip-path:polygon(0 62%,4% 62%,4% 38%,9% 38%,9% 55%,14% 55%,14% 24%,16% 24%,16% 55%,22% 55%,22% 44%,27% 44%,27% 60%,33% 60%,33% 30%,35% 30%,35% 14%,37% 14%,37% 30%,39% 30%,39% 60%,46% 60%,46% 40%,52% 40%,52% 56%,58% 56%,58% 20%,60% 20%,60% 56%,66% 56%,66% 46%,72% 46%,72% 62%,78% 62%,78% 34%,80% 34%,80% 62%,86% 62%,86% 50%,92% 50%,92% 28%,94% 28%,94% 58%,100% 58%,100% 100%,0 100%)}
.hero-night .sky-near{height:74px;background:#05080e;
  clip-path:polygon(0 70%,6% 70%,6% 42%,11% 42%,11% 66%,19% 66%,19% 52%,26% 52%,26% 72%,34% 72%,34% 36%,36% 36%,36% 72%,45% 72%,45% 58%,54% 58%,54% 74%,62% 74%,62% 44%,64% 44%,64% 26%,66% 26%,66% 44%,68% 44%,68% 74%,77% 74%,77% 60%,85% 60%,85% 40%,87% 40%,87% 70%,95% 70%,95% 54%,100% 54%,100% 100%,0 100%)}
.hero-night .sky-near::before{content:"";position:absolute;inset:-2px 0 auto;height:1px;
  background:linear-gradient(90deg,transparent,rgba(156,195,230,.25),transparent)} /* horizon glow */

/* monumental staged title — the title card */
.hero-night .hero-grid{min-height:min(78vh,860px);align-items:end;padding-bottom:clamp(4rem,8vh,7rem)}
.hero-night h1{font-size:clamp(2.9rem,6.8vw,6rem);line-height:1.02;letter-spacing:-.03em;font-weight:200}
.hero-night h1 b,.hero-night h1 .gradient-text{font-weight:800}
.hero-night p.lead{max-width:56ch}
.hero-eyebrow{display:flex;align-items:center;gap:.7rem;margin:0 0 1.1rem;color:var(--ice)}
.hero-eyebrow .hx-tick{width:26px;height:1px;background:var(--accent);box-shadow:0 0 12px rgba(232,161,60,.8);flex:0 0 auto}

/* the signal word shimmers — sodium light passing across */
.gradient-text{background-size:220% 100%;animation:sodium 9s var(--ease) infinite}
@keyframes sodium{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@media (prefers-reduced-motion:reduce){.gradient-text{animation:none}}

/* ticker tape — the data crawl: edge-faded, amber separators */
.tape{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  background:var(--bg);border-block:1px solid var(--line-strong)}
.tape-item .tk{color:var(--ice);font-weight:700}
.tape-item .gain{color:var(--up)}

/* stats as monuments — huge tabular numerals, lamp underline on arrival */
.stats .num{font-family:var(--font-mono);font-size:clamp(2.4rem,4.6vw,3.8rem);
  letter-spacing:-.045em;line-height:1}
.stats .stat{position:relative;padding-bottom:1rem}
.stats .stat::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--accent),transparent);transition:width 1.2s var(--snap) .4s}
[data-cam="stagger"].in .stat::after{width:64%}

/* scene numerals on the how-section formula — case-file indexing */
#how .formula{counter-reset:scene}
#how .cond{counter-increment:scene;position:relative;overflow:hidden}
#how .cond::before{content:"0" counter(scene);position:absolute;right:.4rem;top:-.6rem;
  font:700 3.4rem/1 var(--font-mono);color:rgba(139,163,196,.08);letter-spacing:-.05em;pointer-events:none}

/* evidence wins — dossier cards with the noir crawl + amber file rail */
.win{border-left:3px solid var(--line-strong);transition:box-shadow .45s var(--ease),border-color .45s var(--ease),transform .45s var(--ease)}
.win:hover{box-shadow:12px 14px 0 rgba(0,0,0,.5);border-left-color:var(--accent);transform:translateY(-3px)}

/* pricing — a single pool of light on the pro card, static (no motion) */
#pricing .pricing{position:relative}
#pricing .pricing::before{content:"";position:absolute;inset:-12% -6%;pointer-events:none;
  background:radial-gradient(42% 55% at 66% 40%,rgba(232,161,60,.07),transparent 70%)}

/* mobile: keep the vista composed */
@media (max-width:720px){
  .hero-night .hero-grid{min-height:72vh;padding-bottom:3.2rem}
  .hero-night .ghost{font-size:clamp(5rem,26vw,8rem);bottom:8%}
  .hero-night .sky-far{height:80px}.hero-night .sky-near{height:52px}
}

/* ==========================================================================
   HEAT LAYER 3 — max pass: the film opens, the title rises, the lamp breathes
   ========================================================================== */

/* cinema bars — one-time opening, pure overlay, never blocks input */
.cine-bar{position:fixed;left:0;right:0;height:9vh;background:#000;z-index:9998;
  pointer-events:none;animation:cineOpen 1.5s var(--snap) .55s forwards}
.cine-top{top:0;transform-origin:top}
.cine-bot{bottom:0;transform-origin:bottom}
@keyframes cineOpen{to{transform:scaleY(0)}}

/* title-card line rise — each headline line lifts in sequence */
.hero-night h1 .line{display:block;opacity:0;transform:translateY(38px);
  transition:opacity .9s var(--snap),transform .9s var(--snap)}
.hero-night [data-cam].in h1 .line:nth-child(1){opacity:1;transform:none;transition-delay:.15s}
.hero-night [data-cam].in h1 .line:nth-child(2){opacity:1;transform:none;transition-delay:.32s}
@media (prefers-reduced-motion:reduce){.hero-night h1 .line{opacity:1!important;transform:none!important;transition:none!important}}

/* the lamp breathes — hero CTA only, slow sodium pulse */
.hero-night .btn-primary{animation:lampBreath 4.5s var(--ease) infinite}
@keyframes lampBreath{
  0%,100%{box-shadow:0 0 0 1px var(--accent-line),0 8px 34px -10px rgba(232,161,60,.35)}
  50%{box-shadow:0 0 0 1px var(--accent-line),0 10px 52px -8px rgba(232,161,60,.62)}}
@media (prefers-reduced-motion:reduce){.hero-night .btn-primary{animation:none}}

/* parallax layers move on transform — keep them composited */
.hero-night #city-lights,.hero-night .sky-far,.hero-night .ghost{will-change:transform}

/* ==========================================================================
   HEAT LAYER 4 — the Command Deck (dashboard rebuild) + interior atmosphere
   Discipline: one gap token drives ALL dashboard rhythm; hairline panels;
   the member's first screen is LIVE DATA, never a lecture.
   ========================================================================== */

:root{--dgap:clamp(1.05rem,1.6vw,1.5rem)}

/* ---- atmosphere behind every interior page hero + the dashboard ---------- */
.page-hero{position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;inset:-30% -10% auto;height:130%;pointer-events:none;
  background:radial-gradient(55% 45% at 75% 12%,rgba(63,96,138,.22),transparent 70%),
             radial-gradient(40% 40% at 12% 85%,rgba(232,161,60,.06),transparent 70%)}
.page-hero>*{position:relative}
.dash{position:relative}
.dash::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:radial-gradient(48% 38% at 82% 0%,rgba(63,96,138,.16),transparent 70%),
             radial-gradient(36% 34% at 4% 100%,rgba(232,161,60,.05),transparent 70%)}

/* ---- rhythm: ONE vertical beat for the whole deck ------------------------ */
.dash>*+*{margin-top:var(--dgap)}
.dash .dash-grid,.dash .dash-top3{gap:var(--dgap)}

/* ---- command header ------------------------------------------------------ */
.dash-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.4rem;
  padding-bottom:1.3rem;border-bottom:1px solid var(--line)}
.dash-hi{display:flex;align-items:center;gap:.7rem;color:var(--ice);margin:0 0 .55rem}
.dash-head h1{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:600;letter-spacing:-.02em;line-height:1.05}
.dash-email{margin-top:.35rem;color:var(--faint);font-size:.82rem}
.dash-head-right{display:flex;align-items:center;gap:.8rem;padding-bottom:.3rem}
.tier-chip{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;
  padding:.42rem .8rem;border-radius:var(--radius);border:1px solid var(--accent-line);
  color:var(--accent-3);background:var(--accent-soft)}

/* ---- live status spine --------------------------------------------------- */
.dash-live{display:flex;align-items:center;gap:.85rem;padding:1rem 1.3rem;
  font-family:var(--font-mono);font-size:.85rem;line-height:1.55}
.dash-live .ls-dot{width:9px;height:9px;border-radius:50%;background:var(--up);flex:0 0 auto;
  box-shadow:0 0 10px rgba(57,217,138,.8);animation:lsPulse 2.4s var(--ease) infinite}
@keyframes lsPulse{0%,100%{opacity:1}50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.dash-live .ls-dot{animation:none}}

/* ---- alert board bar ----------------------------------------------------- */
.board-bar{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  margin-bottom:calc(var(--dgap) * -.35)}
.board-title{font-size:1.15rem;font-weight:600;letter-spacing:-.01em}
.board-title::after{content:"";display:inline-block;width:38px;height:2px;margin:0 0 .22rem .7rem;
  vertical-align:middle;background:linear-gradient(90deg,var(--accent),transparent)}
.alert-sort{display:flex;align-items:center;gap:.45rem;margin:0}
.as-label{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.as-btn{font-family:var(--font-mono);font-size:.74rem;padding:.42rem .85rem;border-radius:var(--radius);
  background:var(--surface);border:1px solid var(--line);color:var(--muted);cursor:pointer;
  transition:color .25s,border-color .25s,background .25s}
.as-btn:hover{color:var(--text);border-color:var(--line-strong)}
.as-btn.active{color:var(--accent-3);border-color:var(--accent-line);background:var(--accent-soft)}
.as-dir{color:var(--accent-3);cursor:pointer;padding:.2rem .4rem}

/* ---- panels: one surface doctrine, real padding -------------------------- */
.dash-card{padding:clamp(1.25rem,2vw,1.6rem)}
.dash-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  margin:0 0 .95rem;padding-bottom:.85rem;border-bottom:1px solid var(--line)}
.dash-card-head h2{font-size:1.06rem;font-weight:600;letter-spacing:-.01em;display:flex;align-items:center;gap:.55rem}
.dash-col-sub{font-size:.84rem;color:var(--muted);line-height:1.55;margin:0 0 1.05rem}

/* ---- alert tiles: dossier cards, aligned numbers, breathing room --------- */
.alert-row{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);
  padding:.9rem 1rem .95rem 1.05rem;margin:0 0 .7rem;
  transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease)}
.alert-row:hover{border-color:var(--line-strong);transform:translateY(-2px);
  box-shadow:8px 10px 24px -14px rgba(0,0,0,.7)}
.alert-row:last-child{margin-bottom:0}
.al-row-top{gap:.4rem .45rem;margin-bottom:.45rem}
.al-tk{font-family:var(--font-mono);font-weight:700;font-size:1.02rem;letter-spacing:.01em}
.al-rank{font-family:var(--font-mono);font-size:.66rem;color:var(--faint);margin-right:.15rem}
.al-nums{background:rgba(5,8,14,.55);border:1px solid var(--line);border-radius:calc(var(--radius) - 4px);
  padding:.5rem .7rem;margin:.5rem 0 .4rem;gap:.25rem 1.1rem}
.al-nums b{color:var(--text)}
.al-why-list{margin:.55rem 0 .2rem;padding-left:1.05rem;display:grid;gap:.34rem}
.al-why-list li{font-size:.82rem;line-height:1.5;color:var(--text-soft)}
.al-why-list li::marker{color:var(--accent)}
.al-stamps{display:flex;flex-wrap:wrap;gap:.15rem 1.1rem;margin-top:.45rem}
.al-freshness{margin:.1rem 0 .85rem}

/* ---- chart panel ---------------------------------------------------------- */
.peak-legend{display:grid;gap:.4rem;font-size:.8rem}
#d-equity-chart{margin-top:.4rem;border-top:1px solid var(--line);padding-top:.9rem}

/* ---- positions table ------------------------------------------------------ */
.pos-search{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius);
  color:var(--text);font-family:var(--font-mono);font-size:.82rem;padding:.5rem .85rem;min-width:180px}
.pos-search:focus{outline:none;border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}
.tr tbody td{padding-block:.85rem}
.tr tbody tr{transition:background .2s}
.pos-tag-note{font-size:.78rem;line-height:1.9;color:var(--faint);margin:0 0 1rem}

/* ---- the field guide: collapsed reference, not a lecture ------------------ */
details.dash-explainer{padding:0;overflow:hidden}
details.dash-explainer summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:1rem;
  padding:1.15rem 1.5rem;user-select:none;transition:background .25s}
details.dash-explainer summary::-webkit-details-marker{display:none}
details.dash-explainer summary:hover{background:var(--surface-2)}
details.dash-explainer .dx-sum{font-weight:600;font-size:1rem;display:flex;align-items:center;gap:.6rem}
details.dash-explainer .dx-arrow{color:var(--accent-3);transition:transform .3s var(--ease);font-style:normal}
details.dash-explainer[open] .dx-arrow{transform:rotate(180deg)}
details.dash-explainer>*:not(summary){padding-inline:clamp(1.25rem,2vw,1.6rem)}
details.dash-explainer[open]{padding-bottom:1.4rem}
.sig-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.9rem;margin:1.1rem 0;padding:0;list-style:none}
.sig-grid li{display:flex;gap:.8rem;align-items:flex-start;background:var(--surface-2);
  border:1px solid var(--line);border-radius:var(--radius);padding:.85rem .95rem}
.sig-grid .sig-n{font-family:var(--font-mono);font-weight:700;color:var(--accent-3);
  border:1px solid var(--accent-line);border-radius:50%;width:26px;height:26px;flex:0 0 auto;
  display:grid;place-items:center;font-size:.74rem}
.sig-grid b{display:block;margin-bottom:.2rem}
.sig-grid span:not(.sig-n){font-size:.8rem;color:var(--muted);line-height:1.5}

/* ---- responsive discipline ------------------------------------------------ */
@media (max-width:720px){
  .dash-head{flex-direction:column;align-items:flex-start}
  .dash-head-right{padding-bottom:0}
  .board-bar{margin-bottom:0}
}

/* ==========================================================================
   DAY TERMINAL — light corporate foundation, cinematic accents (scoped)
   Bloomberg in daylight. Frosted panels float over a slow ambient mesh.
   Data leads, motion serves. Applied via body.theme-day (dashboard + record).
   ========================================================================== */

body.theme-day{
  --bg:#f5f7fb; --bg-2:#edf1f7; --bg-3:#e4eaf3;
  --surface:#ffffff; --surface-2:#f4f7fb; --surface-3:#e9eef6;
  --line:rgba(14,34,66,.10); --line-strong:rgba(14,34,66,.20);
  --text:#0d1c34; --text-soft:#2e405c; --muted:#5b6e88; --faint:#7f92aa;
  --ice:#1f6fff; --navy:#0c2a5c;
  --accent:#b7791f; --accent-2:#9a6414; --accent-3:#8f5f14;
  --accent-soft:rgba(232,161,60,.16); --accent-line:rgba(183,121,31,.45);
  --flame:linear-gradient(135deg,#e8a13c 0%,#c07f1e 55%,#9a6414 100%);
  --up:#0f9d63; --up-bright:#0bbf74; --up-soft:rgba(15,157,99,.12);
  --up-line:rgba(15,157,99,.40); --up-glow:0 0 18px rgba(15,157,99,.25);
  --down:#d3364a;
  --glass:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.60));
  --glass-strong:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.72));
  --glass-edge:inset 0 1px 0 rgba(255,255,255,.85),inset 0 0 0 1px rgba(255,255,255,.45);
  --blur:saturate(170%) blur(16px);
  --shadow:0 1px 2px rgba(12,27,51,.05),0 18px 44px -22px rgba(12,27,51,.25);
  --shadow-glow:0 0 0 1px var(--line),0 20px 48px -24px rgba(31,111,255,.28);
  color-scheme:light;
}

/* ---- ambient layer: a slow living mesh with a fine engineering grid ------- */
body.theme-day::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(52% 44% at 82% -6%,rgba(31,111,255,.10),transparent 70%),
    radial-gradient(44% 40% at -8% 32%,rgba(232,161,60,.09),transparent 70%),
    radial-gradient(40% 44% at 60% 110%,rgba(15,157,99,.07),transparent 70%),
    radial-gradient(1px 1px at 50% 50%,rgba(12,42,92,.055) 1px,transparent 1px);
  background-size:100% 100%,100% 100%,100% 100%,26px 26px;
  animation:dayMesh 38s var(--ease) infinite alternate}
@keyframes dayMesh{from{background-position:0% 0%,0% 0%,0% 0%,0 0}
  to{background-position:6% 4%,-5% 6%,4% -5%,0 0}}
body.theme-day::after{opacity:.018}
@media (prefers-reduced-motion:reduce){body.theme-day::before{animation:none}}

/* ---- frosted chrome -------------------------------------------------------- */
body.theme-day .nav{background:rgba(255,255,255,.72);
  backdrop-filter:saturate(170%) blur(16px);-webkit-backdrop-filter:saturate(170%) blur(16px);
  border-bottom:1px solid var(--line)}
body.theme-day .glass,body.theme-day .dash-card{
  background:var(--glass);backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);
  border:1px solid rgba(14,34,66,.08);box-shadow:var(--glass-edge),var(--shadow)}
body.theme-day .panel-ticks::before,body.theme-day .panel-ticks::after{border-color:var(--ice);opacity:.4}
body.theme-day .dash::before{background:none}

/* ---- typography authority --------------------------------------------------- */
body.theme-day .dash-head h1{color:var(--navy);font-weight:700}
body.theme-day .dash-hi{color:var(--ice)}
body.theme-day .dash-hi .hx-tick{background:var(--ice);box-shadow:0 0 10px rgba(31,111,255,.6)}
body.theme-day .board-title{color:var(--navy)}
body.theme-day .board-title::after{background:linear-gradient(90deg,var(--ice),transparent)}
body.theme-day .k-label{color:var(--muted)}

/* ---- buttons: electric primary, satisfying press ---------------------------- */
body.theme-day .btn-primary{background:linear-gradient(135deg,#1f6fff,#0c2a5c);color:#fff;
  border:none;box-shadow:0 8px 24px -10px rgba(31,111,255,.55);
  transition:transform .22s var(--ease),box-shadow .22s var(--ease)}
body.theme-day .btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 32px -12px rgba(31,111,255,.65)}
body.theme-day .btn-primary:active{transform:translateY(0)}
body.theme-day .btn-ghost{background:rgba(255,255,255,.7);color:var(--navy);border:1px solid var(--line-strong)}
body.theme-day .btn-ghost:hover{border-color:var(--ice);color:var(--ice)}

/* ---- live status: the heartbeat --------------------------------------------- */
body.theme-day #d-live{border-left:3px solid var(--ice);color:var(--text-soft)}
body.theme-day #d-live::after{background:linear-gradient(90deg,transparent,rgba(31,111,255,.06),transparent)}
body.theme-day .dash-live .ls-dot{background:var(--up);box-shadow:0 0 10px rgba(15,157,99,.7)}

/* ---- alert tiles: signals feel like events ----------------------------------- */
body.theme-day .alert-row{background:rgba(255,255,255,.85);border:1px solid var(--line);
  border-left:3px solid var(--line-strong)}
body.theme-day .alert-row:hover{border-color:rgba(31,111,255,.45);border-left-color:var(--ice);
  box-shadow:0 14px 34px -18px rgba(12,27,51,.35);transform:translateY(-2px)}
body.theme-day .alert-row:has(.al-quality.prime){border-left-color:#e8a13c;
  animation:signalArrive 1.4s var(--snap)}
@keyframes signalArrive{
  0%{box-shadow:0 0 0 0 rgba(232,161,60,.45)}
  55%{box-shadow:0 0 0 16px rgba(232,161,60,0)}
  100%{box-shadow:0 0 0 0 rgba(232,161,60,0)}}
body.theme-day .al-nums{background:var(--surface-2);border-color:var(--line)}
body.theme-day .al-dot{position:relative}
body.theme-day .al-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;
  border:1px solid currentColor;opacity:0;animation:dotRing 3.2s var(--ease) infinite}
@keyframes dotRing{0%{transform:scale(.5);opacity:.7}70%{transform:scale(1.25);opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  body.theme-day .alert-row:has(.al-quality.prime),body.theme-day .al-dot::after{animation:none}}

/* ---- price motion: gains pulse warm, losses pulse cool ----------------------- */
@keyframes flashUp{0%{background:rgba(15,157,99,.28)}100%{background:transparent}}
@keyframes flashDown{0%{background:rgba(31,111,255,.22)}100%{background:transparent}}
.val-flash-up{animation:flashUp 1.1s var(--ease);border-radius:4px}
.val-flash-down{animation:flashDown 1.1s var(--ease);border-radius:4px}

/* ---- charts: draw themselves, glow where it matters --------------------------- */
#d-equity-chart path[fill="none"],#equity-chart path[fill="none"]{
  stroke-dasharray:2800;stroke-dashoffset:2800;animation:ecDraw 1.9s var(--ease) forwards}
#d-equity-chart path[fill^="url"],#equity-chart path[fill^="url"]{
  opacity:0;animation:ecArea 1.2s var(--ease) .9s forwards}
@keyframes ecDraw{to{stroke-dashoffset:0}}
@keyframes ecArea{to{opacity:1}}
#d-equity-chart circle,#equity-chart circle{filter:drop-shadow(0 0 6px rgba(15,157,99,.8))}
@media (prefers-reduced-motion:reduce){
  #d-equity-chart path,#equity-chart path{animation:none;stroke-dashoffset:0;opacity:1}}
body.theme-day .ec-sp{stroke:#93a7c4 !important}
body.theme-day .ec-endlbl{fill:var(--text-soft) !important}
body.theme-day .ec-axis,body.theme-day .ec-grid{stroke:rgba(14,34,66,.12) !important}
body.theme-day .ec-ax{fill:var(--faint) !important}

/* ---- table: the ledger in daylight -------------------------------------------- */
body.theme-day .tr thead th{color:var(--muted);background:rgba(255,255,255,.9)}
body.theme-day .tr tbody tr{border-bottom:1px solid var(--line)}
body.theme-day .tr tbody tr:hover{background:#eef4ff}
body.theme-day .gain-pill{background:var(--up-soft);color:var(--up);border:1px solid var(--up-line)}
body.theme-day .pos-search{background:#fff;border-color:var(--line-strong);color:var(--text)}
body.theme-day .pos-search:focus{border-color:var(--ice);box-shadow:0 0 0 3px rgba(31,111,255,.15)}

/* ---- status chips: one legible light system ------------------------------------ */
body.theme-day .pos-setup.coiled{background:rgba(31,111,255,.10);color:#1554c4}
body.theme-day .pos-setup.igniting{background:rgba(232,120,32,.13);color:#b35309}
body.theme-day .pos-setup.extended{background:var(--up-soft);color:var(--up)}
body.theme-day .pos-setup.basing{background:rgba(14,34,66,.07);color:var(--text-soft)}
body.theme-day .pos-setup.cooled{background:rgba(211,54,74,.10);color:#b02a3c}
body.theme-day .al-quality.held{background:rgba(14,34,66,.08);color:var(--text-soft)}
body.theme-day .al-quality.prime{background:var(--accent-soft);color:var(--accent-3)}
body.theme-day .al-quality.strong{background:rgba(31,111,255,.10);color:#1554c4}
body.theme-day .al-quality.ev,body.theme-day .ev-mark{background:rgba(124,58,237,.10);color:#6d28d9}
body.theme-day .al-odds.hi{background:var(--up-soft);color:var(--up)}
body.theme-day .al-odds.mid{background:var(--accent-soft);color:var(--accent-3)}
body.theme-day .al-odds.lo{background:rgba(14,34,66,.07);color:var(--muted)}
body.theme-day .status-sold{color:var(--up)}
body.theme-day .status-stop{color:var(--down)}
body.theme-day .status-exp{color:var(--muted)}
body.theme-day .status-open{color:#1554c4}
body.theme-day .odds-trend.down{color:#b02a3c}
body.theme-day .odds-trend.up{color:var(--up)}
body.theme-day .odds-trend.flat{color:var(--muted)}

/* ---- field guide + interior hero in daylight ------------------------------------ */
body.theme-day details.dash-explainer summary:hover{background:rgba(31,111,255,.05)}
body.theme-day .sig-grid li{background:rgba(255,255,255,.8)}
body.theme-day .sig-grid .sig-n{color:var(--accent-3)}
body.theme-day .page-hero::before{background:
  radial-gradient(55% 45% at 78% 0%,rgba(31,111,255,.10),transparent 70%),
  radial-gradient(42% 40% at 8% 90%,rgba(232,161,60,.08),transparent 70%)}
body.theme-day .tape{background:rgba(255,255,255,.75);border-color:var(--line-strong)}
body.theme-day .tape-item .tk{color:#1554c4}

/* ---- generous, consistent breathing room everywhere ------------------------------ */
body.theme-day .dash-card{padding:clamp(1.35rem,2.1vw,1.75rem)}
body.theme-day .al-nums{padding:.6rem .8rem;gap:.3rem 1.2rem}
body.theme-day .tr tbody td{padding-block:.95rem}

/* DARK signal arrival — the ripple survives the light-theme revert (owner kept dark) */
.alert-row:has(.al-quality.prime){animation:signalArrive 1.4s var(--snap)}
@media (prefers-reduced-motion:reduce){.alert-row:has(.al-quality.prime){animation:none}}

/* numbers provenance — the printed reason a headline figure moved */
.prov-note{font-family:var(--font-mono);font-size:.72rem;line-height:1.7;color:var(--faint);
  max-width:62ch;margin:.8rem auto 0;letter-spacing:.02em}