/* ============================================================
   Blakey Trades — community app prototype
   Premium dark + gold. "Living market" direction.
   ============================================================ */

/* Design tokens are the single source of truth in tokens.css (loaded first).
   Family: premium-dark · Exemplars: Revolut + Apple (see tokens.css header). */

*{box-sizing:border-box;margin: 0;padding: 0}
html,body{height:100%}
body{
  font-family:var(--body);font-weight:500;
  background:var(--ink);
  color:var(--text);
  letter-spacing:var(--tracking-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow:hidden;
}
img{display:block;max-width:100%}
button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer}
a{color:inherit;text-decoration:none}
::selection{background:rgba(var(--gold-rgb),0.3)}

/* ---------- Desktop stage + device frame ---------- */
.stage{
  position:fixed;inset:0;
  display:grid;place-items:center;
  background:
    radial-gradient(120% 80% at 50% -10%,rgba(var(--gold-rgb),0.10),transparent 55%),
    radial-gradient(80% 60% at 50% 120%,rgba(var(--gold-rgb),0.06),transparent 60%),
    #08080b;
  padding: 28px;
}
.stage::after{ /* faint grain */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.stage-meta{position:fixed;left:0;right:0;bottom:26px;text-align:center;z-index:5}
.stage-meta b{font-family:var(--display);font-weight:700;letter-spacing:.04em;color:var(--gold)}
.stage-meta span{display:block;font-size: var(--fs-small);color:var(--faint);margin-top: var(--s1);letter-spacing:.02em}

.device{
  position:relative;
  width:calc(var(--app-w) + 24px);
  height:calc(var(--app-h) + 24px);
  background:linear-gradient(160deg,#26262b,#0c0c0f 60%);
  border-radius:60px;
  padding: var(--s3);
  box-shadow:
    0 0 0 2px #303036,
    0 0 0 8px #141417,
    0 50px 120px -40px rgba(0,0,0,0.9),
    0 0 80px -30px rgba(var(--gold-rgb),0.25);
  transform:scale(var(--fit,1));transform-origin:top center;
}
/* real phones: true fullscreen, no bezel, no scale */
@media (max-width:480px){
  .stage{padding: 0}
  .stage::after,.stage-meta{display:none}
  .device{width:100vw;height:100dvh;border-radius:0;padding: 0;box-shadow:none;transform:none}
  .device::before{display:none}
  .app{width:100vw;height:100dvh;border-radius:0}
}
.device::before{ /* side buttons */
  content:"";position:absolute;left:-3px;top:170px;width:3px;height:64px;border-radius:3px;
  background:#2a2a30;box-shadow:0 92px 0 #2a2a30,0 168px 0 #2a2a30;
}

/* ---------- App shell ---------- */
.app{
  position:relative;
  width:var(--app-w);height:var(--app-h);
  background:var(--ink); /* CLEAN DARK: flat OLED black — the warm radial read as haze next to light mode */
  border-radius:48px;
  overflow:hidden;
  display:flex;flex-direction:column;
  isolation:isolate;
}
/* CLEAN DARK: no vignette on black — it was pure murk; light mode keeps its own subtle one below */
.app::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit}
.statusbar{
  position:relative;z-index:30;
  height:50px;flex:none;
  display:flex;align-items:center;justify-content:space-between;
  padding: 0 28px 0 var(--s7);
  font-family:var(--mono);font-size: var(--fs-body);font-weight:600;letter-spacing:.02em;
  color:var(--text);
}
.statusbar .island{
  position:absolute;left:50%;top:11px;transform:translateX(-50%);
  width:108px;height:30px;background:#000;border-radius:999px;
}
.statusbar .glyphs{display:flex;gap: var(--s2);align-items:center}
.statusbar .glyphs svg{display:block}

.screen-scroll{
  position:relative;z-index:10;
  flex:1 1 0%;min-height:0;overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  scrollbar-width:none;
  contain:layout paint;
}
.screen-scroll::-webkit-scrollbar{display:none}
.screen{padding: 0 var(--gutter) calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 36px);}
.screen.noscroll{padding-bottom: 0}

/* button reset for card-shaped controls — sits EARLY so component classes (.card, .vcard…) override it */
.as-btn{appearance:none;-webkit-appearance:none;background:none;border:0;padding: 0;margin: 0;font:inherit;color:inherit;text-align:inherit;width:100%;cursor:pointer;display:block}

/* screen transition */
.screen-enter{animation:screenIn var(--dur-screen,.22s) var(--ease-out,cubic-bezier(.16,1,.3,1)) both}
@keyframes screenIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .screen-enter{animation:none}
  .modal{transition:none}
  .sheet{transition:none}
  .toast{transition:none}
}

/* ---------- Tab bar ---------- */
/* Liquid-glass floating tab bar (Revolut / iOS-26 material) */
.tabbar{
  position:absolute;left:14px;right:14px;bottom:calc(env(safe-area-inset-bottom) + 12px);z-index:90;
  height:66px;
  display:flex;align-items:center;justify-content:space-around;
  padding: 0 var(--s1);
  border-radius:28px;
  background:rgba(18,18,23,0.50);
  backdrop-filter:blur(34px) saturate(190%);-webkit-backdrop-filter:blur(34px) saturate(190%);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.18),inset 0 -1px 0 rgba(0,0,0,0.35),0 20px 46px -14px rgba(0,0,0,0.72);
}
/* top sheen — the "liquid" highlight */
.tabbar:empty{display:none} /* hidden during splash/login until renderTabbar populates it */
.tabbar::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,0.06),rgba(255,255,255,0) 42%)}
.tab{
  flex:1;display:flex;flex-direction:column;align-items:center;gap: var(--s1);
  color:var(--faint);font-size: var(--fs-tiny);font-weight:600;letter-spacing:.01em;white-space:nowrap;
  transition:color .15s;position:relative;z-index:1;
  /* A flex item defaults to min-width:auto, which refuses to shrink below its
     content width. With nowrap labels ("Traders", "Journal") that made the tab
     bar overflow its own pill once text was scaled up — measured +3px at 1.35x
     and +38px at 1.75x, i.e. the bottom nav visibly broke for anyone using
     larger text. min-width:0 lets the tabs shrink; overflow:hidden keeps a long
     label inside its own tab instead of pushing the bar wider. */
  min-width:0;
  overflow:hidden;
}
.tab svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.7;
  transition:transform .16s var(--ease-spring)}
.tab.active{color:var(--gold)}
.tab .tab-cluster{position:relative;display:grid;place-items:center;width:50px;height:30px}
/* gold liquid-glass pill behind the active tab */
.tab .tab-cluster::before{content:"";position:absolute;inset:0;border-radius:var(--r-full);
  border:1px solid transparent;transition:background .16s var(--ease-out),border-color .16s,box-shadow .16s}
.tab.active .tab-cluster::before{background:rgba(var(--gold-rgb),.16);border-color:rgba(var(--gold-rgb),.32);
  box-shadow:inset 0 1px 0 rgba(246,227,172,.12)}
.tab.live-tab .dot{position:absolute;right:8px;top:0;width:6px;height:6px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(255,77,77,.6);animation:pulse 1.8s infinite}

/* ---------- Type utilities ---------- */
/* Semantic section labels use the same Sora family as the Journal title and tabs. */
.eyebrow{font-family:var(--display);font-size: var(--fs-tiny);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.eyebrow.muted{color:var(--muted)}
.h1{font-family:var(--display);font-weight:800;font-size:34px;line-height:1.02;letter-spacing:var(--tracking-mega)}
.h2{font-family:var(--display);font-weight:800;font-size:21px;line-height:1.12;letter-spacing:var(--tracking)}
.h3{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:-.01em}
.sub{color:var(--muted);font-size: var(--fs-h4);line-height:1.55}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1,"zero" 0;letter-spacing:-.015em;font-weight:600}
.up{color:var(--up)} .down{color:var(--down)}
/* base inline icon — context rules (.stat .ic, .pill .ic, .tab svg…) override */
.ic{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;vertical-align:middle}

.section-head{display:flex;align-items:center;justify-content:space-between;gap: var(--s3);margin: var(--s7) var(--s1) var(--s4)}
.section-head-snug{margin-top: var(--s2)}
.section-head .more{font-size: var(--fs-small);color:var(--muted);font-weight:600}
.section-head .more.as-btn{width:auto;display:inline-flex;align-items:center;flex:none;text-align:right}
.tc-unread-pill{flex:none;margin-left:auto}
.gloss-cta{display:inline-flex;align-items:center;gap: var(--s1);flex:none;flex-shrink:0;margin-left: auto;padding: var(--s2) var(--s3);border-radius:999px;border:1px solid var(--gold-line);background:rgba(var(--gold-rgb),.12);color:var(--gold);font-family:var(--sans);font-size: var(--fs-small);font-weight:700;letter-spacing:.01em;cursor:pointer;line-height:1;box-shadow:inset 0 1px 0 rgba(255,255,255,.12);white-space:nowrap}
.gloss-cta .ic{width:13px;height:13px;flex:none}
.gloss-cta:active{transform:scale(.97);background:rgba(var(--gold-rgb),.2)}
.gloss-cta:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
html[data-theme="light"] .gloss-cta{background:rgba(var(--gold-rgb),.14);color:var(--gold-hi)}
@media (max-width: 390px) {
  .section-head:has(.gloss-cta) .h2 {
    font-size: 18px;
    line-height: 1.15;
  }
}



/* gold text */
.gold-text{background:var(--gold-foil);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Buttons ---------- */
.btn[hidden]{display:none}
.btn{display:inline-flex;align-items:center;justify-content:center;gap: var(--s2);
  height:54px;padding: 0 var(--s6);border-radius:var(--r-full);
  font-family:var(--display);font-weight:600;font-size: var(--fs-h3);letter-spacing:-.005em;
  transition:transform .2s var(--ease-spring),box-shadow .25s,filter .25s,opacity .25s;
  -webkit-tap-highlight-color:transparent;user-select:none}
.btn:active{transform:scale(.97)}
.btn-gold{background:var(--gold-button-gradient);
  color:var(--gold-button-text);font-weight:700;letter-spacing:-.01em;
  box-shadow:0 10px 26px -8px rgba(var(--gold-rgb),.45),0 2px 6px -2px rgba(var(--gold-rgb),.32),inset 0 1px 0 rgba(255,252,235,.72),inset 0 -1px 0 rgba(0,0,0,.3)}
.btn-gold:hover{filter:brightness(1.05) saturate(1.05)}
.btn-gold:active{transform:scale(.985);filter:brightness(.98)}
/* premium tactile press feedback — every tap responds */
.icon-btn,.chip,.tab,.hub-row,.lb-row,.react-btn,.took-btn,.vcard,.idea,.settings-row.tap,.qs-card{transition:transform .14s var(--ease-spring)}
.icon-btn:active,.chip:active,.hub-row:active,.lb-row:active,.react-btn:active,.took-btn:active,.vcard:active,.settings-row.tap:active{transform:scale(.95)}
.idea:active{transform:scale(.985)}
.tab:active{transform:scale(.96)}
.btn-ghost{background:var(--surface-2);color:var(--text);border:1px solid var(--line-2)}
.btn-block{display:flex;width:100%}
.btn-sm{height:40px;font-size: var(--fs-small);padding: 0 var(--s4)}
.btn svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8}

/* pills / chips */
.pill{display:inline-flex;align-items:center;gap: var(--s1);height:28px;padding: 0 var(--s3);border-radius:var(--r-full);
  font-size: var(--fs-tiny);font-weight:600;letter-spacing:.02em;background:var(--surface-3);color:var(--muted);border:1px solid var(--line)}
.pill .ic{width:13px;height:13px}
.pill-live{background:rgba(255,77,77,.14);color:#ff7b7b;border-color:rgba(255,77,77,.35)}
.pill-up{background:rgba(63,191,127,.13);color:var(--up);border-color:rgba(63,191,127,.3)}
.pill-down{background:rgba(240,86,91,.12);color:var(--down);border-color:rgba(240,86,91,.3)}
.pill-gold{background:rgba(var(--gold-rgb),.13);color:var(--gold);border-color:rgba(var(--gold-rgb),.32)}

.dot-live{width:7px;height:7px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(255,77,77,.7);animation:pulse 1.6s infinite}
.pill-preview{background:rgba(var(--gold-rgb),.16);color:var(--gold-hi);border-color:var(--gold-line)}
.dot-prev{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(var(--gold-rgb),.6);animation:pulse-gold 1.8s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(255,77,77,0)}100%{box-shadow:0 0 0 0 rgba(255,77,77,0)}}

/* ---------- Cards ---------- */
.card{background-color:var(--surface-2);background-image:var(--grain);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);border-radius:var(--r-lg);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(0,0,0,.30),0 24px 50px -24px rgba(7,5,2,.84)}
.card-pad{padding: var(--s4)}
.reveal{opacity:0;transform:translateY(10px);animation:reveal .34s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes reveal{to{opacity:1;transform:none}}

/* avatars */
.av{border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-weight:700;color:var(--on-accent);flex:none;
  width:36px;height:36px;aspect-ratio:1;font-size: var(--fs-small);background:var(--gold-foil);background-size:160% auto}
.av.ring{box-shadow:0 0 0 2px var(--ink),0 0 0 3.4px var(--gold)}
.av-quiet{background:var(--surface-3);color:var(--gold);border:1px solid var(--line-2);font-weight:600}
.av-28{width:28px;height:28px;font-size: var(--fs-tiny)}
.av-30{width:30px;height:30px;font-size: var(--fs-tiny)}
.av-36{width:36px;height:36px;font-size: var(--fs-small)}
.av-38{width:38px;height:38px;font-size: var(--fs-h4)}
.av-40{width:40px;height:40px;font-size: var(--fs-body)}
.av-44{width:44px;height:44px;font-size: var(--fs-h3)}
.av-48{width:48px;height:48px;font-size:16px}
.av-64{width:64px;height:64px;font-size: var(--fs-h1)}
.av-72{width:72px;height:72px;font-size:24px;flex:none}
.av-pic{background:#0a0a0a;background-size:cover;background-position:center;background-repeat:no-repeat;color:transparent;overflow:hidden}
.av-pic img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}
.av-crest{background:#0a0a0a}
.av-crest img{object-fit:contain}

/* =========================================================
   SPLASH / LOGIN
   ========================================================= */
/* ambient canvas MUST be sized like every other chart canvas (width/height 100%).
   Without this a <canvas> is a replaced element, so inset:0 won't stretch it — it
   falls back to its width attribute, and fit() then doubles it every frame until it
   blows past the max canvas size and renders as a broken-image glyph. */
.market-bg{display:block;width:100%;height:100%}
#screen-splash{position:absolute;inset:0;z-index:60;background:#060607;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap: 0;padding: var(--s8)}
/* Instant exit — fading a dark splash over light Home looked like a broken overlay. */
#screen-splash.splash-out{opacity:0;visibility:hidden;pointer-events:none}
#screen-splash.splash-out .splash-loader,
#screen-splash.splash-out .splash-crest{opacity:0}
#screen-splash .market-bg{position:absolute;inset:0;z-index:0;opacity:.55;mask-image:linear-gradient(to bottom,transparent,#000 28%,#000 72%,transparent)}
#screen-splash .coin{width:96px;height:96px;z-index:2;filter:drop-shadow(0 12px 30px rgba(var(--gold-rgb),.45))}
/* minimal loader — tracked wordmark + a single gold hairline sweep */
#screen-splash .splash-loader{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:0;
  animation:splashIn .7s cubic-bezier(.2,.8,.2,1) .05s both}
#screen-splash .splash-crest{width:96px;height:96px;border-radius:0;object-fit:contain;display:block;
  background:transparent;box-shadow:none;filter:drop-shadow(0 10px 28px rgba(224,178,60,.18))}
/* Light theme: keep crest readable on dark splash plate. */
@keyframes splashIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
#screen-splash .splash-word{font-family:var(--mono);font-size: var(--fs-small);font-weight:600;letter-spacing:.46em;text-indent:.46em;
  text-transform:uppercase;color:var(--gold)}
#screen-splash .splash-track{width:96px;height:2px;border-radius:2px;background:rgba(var(--gold-rgb),.16);overflow:hidden}
#screen-splash .splash-track span{display:block;width:44%;height:100%;border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  animation:splashSweep 1.15s cubic-bezier(.45,0,.55,1) infinite}
@keyframes splashSweep{from{transform:translateX(-110%)}to{transform:translateX(320%)}}

.login{position:absolute;inset:0;z-index:61;display:flex;flex-direction:column;background:var(--ink);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.login .market-bg{position:absolute;inset:0;opacity:.42;mask-image:linear-gradient(to bottom,#000,transparent 62%);pointer-events:none}
.login-top{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;padding: var(--s5) var(--s6) var(--s2);position:relative;z-index:2;text-align:center}
.login .coin{width:60px;height:60px;margin-bottom: var(--s5)}
.login-wordmark{height:88px;width:88px;max-width:88px;margin: 0 auto var(--s2);object-fit:contain;display:block;filter:drop-shadow(0 10px 28px rgba(0,0,0,.28))}
.login-bottom{position:relative;z-index:2;flex:0 0 auto;padding: var(--s3) var(--s6) 0;display:flex;flex-direction:column;gap: var(--s3)}
.login-cta-bar{position:sticky;bottom:0;z-index:4;margin: var(--s4) -var(--s6) 0;padding: var(--s3) var(--s6) calc(14px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--ink) 70%,transparent);border-top:1px solid var(--line)}
.login-cta-bar .btn-gold{min-height:54px;font-size: var(--fs-h3);font-weight:700}
.login-field{height:54px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);display:flex;align-items:center;gap: var(--s3);padding: 0 var(--s4);color:var(--muted);font-size: var(--fs-body)}
.login-or{display:flex;align-items:center;gap: var(--s3);color:var(--faint);font-size: var(--fs-tiny);letter-spacing:.1em;margin: var(--s1) 0}
.login-or::before,.login-or::after{content:"";height:1px;flex:1;background:var(--line)}
.login-consent{display:flex;align-items:flex-start;gap:12px;margin:var(--s3) 0 var(--s2);padding:12px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--surface-2);text-align:left;cursor:pointer}
.login-consent input{appearance:none;-webkit-appearance:none;display:grid;place-items:center;flex:none;width:28px;height:28px;margin:0;border:2px solid var(--gold);border-radius:7px;background:var(--surface);cursor:pointer}
.login-consent input:checked{background:var(--gold)}
.login-consent input:checked::after{content:"";width:7px;height:12px;border:solid var(--ink);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.login-consent input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.login-consent span{font-size:var(--fs-small);color:var(--text);line-height:1.5}
.login-consent a{color:var(--gold);text-decoration:none}
.acct-delete-zone{margin-top: 28px;padding-top: var(--s4);border-top:1px solid var(--line);text-align:center}
.acct-delete-hint{font-size: var(--fs-tiny);color:var(--faint);margin: 0 0 var(--s2);line-height:1.45}
.acct-delete-link{display:inline-block;padding: var(--s1) var(--s2);font-size: var(--fs-small);font-family:inherit;color:var(--faint);background:transparent;border:none;text-decoration:underline;cursor:pointer}
.acct-delete-link:hover{color:var(--down)}
.acct-delete-link:active{opacity:.85}
.login-social-stack{display:flex;flex-direction:column;gap: var(--s2);margin-bottom: var(--s1)}
.login-social-full{
  position:relative;
  width:100%;
  height:48px;
  padding: 0 var(--s4);
  border-radius:var(--r-md);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--sans);
  font-size: var(--fs-body);
  font-weight:600;
  letter-spacing:-.01em;
  border:1px solid var(--line-2);
  cursor:pointer;
  background:var(--surface-2);
  color:var(--text);
  transition:transform .14s var(--ease-spring),opacity .14s ease;
}
.login-social-full:active:not(:disabled){transform:scale(.985)}
/* Soft warm fill — pure #fff reads cold / blown-out on the cream login */
.login-social-full.apple{
  background:#EFECE4;
  border-color:rgba(22,20,14,.12);
  color:#15151A;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
html:not([data-theme="light"]) .login-social-full.apple{
  background:#F0EEE8;
  border-color:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.login-social-full:disabled{opacity:.55;cursor:wait}
.login-social-icon{
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  width:18px;
  height:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}
.login-social-icon svg{width:18px!important;height:18px!important;display:block;flex-shrink:0}
.login-social-label{pointer-events:none;text-align:center;line-height:1.2;padding: 0 28px}
.login-social-full.apple .login-social-icon{color:#15151A}
.login-demo{margin-top: var(--s3)}
.login-mode{display:flex;gap: var(--s2);margin: var(--s3) 0 var(--s3);padding: var(--s1);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line)}
.login-mode-tab{flex:1;border:none;background:transparent;color:var(--faint);font-family:var(--sans);font-size: var(--fs-h4);font-weight:600;padding: var(--s2);border-radius:var(--r-sm);cursor:pointer}
.login-mode-tab.on{background:var(--ink);color:var(--text);border:1px solid var(--line-2)}
.hidden{display:none!important}
.social-row{display:flex;gap: var(--s3)}
.social-btn{flex:1;height:50px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);display:grid;place-items:center;color:var(--text)}
.social-btn svg{width:22px;height:22px}

.login-staff{margin-top: var(--s4);padding-top: var(--s4);border-top:1px solid var(--line)}
.login-staff-toggle{background:transparent;border:none;color:var(--faint);font-family:var(--mono);font-size: var(--fs-tiny);letter-spacing:.12em;text-transform:uppercase;width:100%;padding: var(--s2);cursor:pointer}
.login-staff-panel{margin-top: var(--s3);text-align:left}
.login-staff-hint{font-size: var(--fs-small);color:var(--muted);line-height:1.45;margin: 0 0 var(--s2)}
.login-member-err{font-size: var(--fs-small);color:var(--down);margin-top: var(--s2);min-height:1.2em}
.login-foot{text-align:center;font-size: var(--fs-tiny);color:var(--faint);margin-top: var(--s1);line-height:1.6}

/* =========================================================
   APP HEADER (in-screen)
   ========================================================= */
.app-topbar{display:flex;align-items:center;gap: var(--s2);padding: var(--s2) 2px var(--s3)}
.tb-actions{display:flex;align-items:center;gap: var(--s2);margin-left: auto;flex:none}
.brand-word{height:40px;width:40px;opacity:1;object-fit:contain;flex:none;display:block;border-radius:0;background:transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.story-top-btn{background:transparent;border:0;padding: 0;overflow:visible}
.story-top-btn .story-ring-sm{width:34px;height:34px;padding: 2px}
.story-top-btn .story-dot svg{width:15px;height:15px}
.story-top-btn .story-ring-sm:not(.seen){box-shadow:0 0 0 0 rgba(var(--gold-rgb),.45);animation:storyPulse 2.4s ease infinite}
@keyframes storyPulse{70%{box-shadow:0 0 0 6px rgba(var(--gold-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--gold-rgb),0)}}
.app-head{display:grid;grid-template-columns:minmax(0,1fr);row-gap:8px;align-items:center;padding: 2px 0 4px}
.app-head .who{display:flex;align-items:center;gap: var(--s3)}
.who-profile{appearance:none;-webkit-appearance:none;background:none;border:0;padding: 0;margin: 0;cursor:pointer;text-align:left;color:inherit;min-height:44px;max-width:100%}
.who-profile:active .who-name-row b{opacity:.82}
.who-copy{display:flex;flex-direction:column;gap: 2px;min-width:0}
.app-head .who small{display:block;font-size: var(--fs-small);color:var(--muted);font-weight:500;letter-spacing:.01em}
.app-head .who b{font-family:var(--display);font-size:23px;font-weight:800;letter-spacing:-.025em;line-height:1.08}
.who-name-row{display:inline-flex;align-items:center;gap: var(--s1);max-width:100%}
.who-chev{width:14px;height:14px;color:var(--gold);opacity:.72;flex:none;margin-top: 1px;fill:none;stroke:currentColor;stroke-width:2}
html:not([data-theme="light"]) .who-chev{color:var(--text)}
.who-go{margin-left: auto;display:inline-flex;align-items:center;gap: 2px;font-size: var(--fs-tiny);font-weight:700;color:var(--gold);background:var(--gold-soft,rgba(var(--gold-rgb),.12));border:1px solid var(--gold-line);border-radius:999px;padding: var(--s1) var(--s2) var(--s1) var(--s3);white-space:nowrap}
.who-go .ic{width:13px;height:13px}
/* Home head actions — Leaderboard + Ask Support beside profile */
.app-head-actions{
  display:inline-flex;align-items:center;justify-self:end;gap:8px;
  flex:none;margin:0;min-width:0;
}
.app-head-actions .ask-pill{margin-left:0}
/* Ask Aria — gold capsule beside profile (same language, easier to spot) */
.ask-pill{
  flex:none;display:inline-flex;align-items:center;justify-content:center;gap: var(--s2);
  min-height:44px;height:44px;padding: 0 var(--s3);border-radius:var(--r-full);
  border:1.5px solid rgba(var(--gold-rgb),.55);background:rgba(var(--gold-rgb),.16);
  color:var(--gold);font-size: var(--fs-small);font-weight:750;letter-spacing:.01em;
  cursor:pointer;align-self:center;margin-left: var(--s2);white-space:nowrap;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 2px rgba(var(--gold-rgb),.12);
  transition:transform .15s ease,background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
/* Leaderboard — always icon-only circle (never the wide “Leaderboard” pill) */
.ask-pill-board{
  width:44px;min-width:44px;padding:0;gap:0;border-radius:50%;
}
.ask-pill-ic{
  width:15px;height:15px;flex:none;opacity:.95;
  fill:none;stroke:currentColor;stroke-width:1.85;
}
.ask-pill:active{transform:scale(.96);background:rgba(var(--gold-rgb),.24)}
.ask-pill:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
html[data-theme="light"] .ask-pill{
  background:rgba(var(--gold-rgb),.14);
  border-color:rgba(var(--gold-rgb),.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 1px 3px rgba(var(--gold-rgb),.14);
}
.app-head .who-profile{min-width:0;max-width:none}
.app-head .who-name-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
@media (min-width: 540px) {
  .app-head{grid-template-columns:minmax(0,1fr) auto;column-gap:14px;row-gap:0;padding-bottom:2px}
  .app-head-actions{justify-self:end}
}
@media (max-width: 390px) {
  .app-head-actions{gap:7px}
  .ask-pill:not(.ask-pill-board){padding: 0 var(--s2);font-size:var(--fs-tiny);gap: var(--s1)}
}
.icon-btn{width:44px;height:44px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;position:relative}
.icon-btn svg{width:20px;height:20px;stroke:var(--text);fill:none;stroke-width:1.7}
.icon-btn .badge{position:absolute;top:7px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 2px var(--surface-2)}

/* =========================================================
   HOME
   ========================================================= */
.live-banner{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:var(--s3) var(--s3) var(--s3);margin-top:var(--s3);
  background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 22px 48px -24px rgba(0,0,0,.8)}
.live-banner .market-bg{position:absolute;inset:0;opacity:.1}
.live-banner .lb-inner{position:relative;z-index:2}
.live-banner .lb-row{display:flex;align-items:center;justify-content:space-between}
.live-banner h3{font-family:var(--display);font-weight:800;font-size:var(--fs-h2);letter-spacing:-.02em;line-height:1.12;margin:var(--s2) 0 0}
.live-banner .lb-host{font-size:var(--fs-tiny)!important;margin-top:2px}
.live-banner .countdown{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:stretch;gap:6px;margin-top:var(--s2)}
.live-banner .cd-cell{flex:1 1 0;min-width:0;padding:6px 4px;border-radius:10px}
.live-banner .cd-cell b{font-size:17px}
.live-banner .cd-cell span{font-size:8px;letter-spacing:.1em;margin-top:2px}
.live-banner .lb-actions{display:flex;gap:var(--s2);margin-top:var(--s2)}
.live-banner .lb-actions .btn{height:40px;min-height:40px;padding:0 var(--s3);font-size:var(--fs-small)}
.live-banner .lb-primary{flex:1;min-width:0}
.live-banner .lb-remind{flex:0 0 auto;min-width:96px}
.cd-wrap{font-size: var(--fs-small);color:var(--muted);padding: var(--s3) 2px 2px;line-height:1.5}
.lobby-cd .cd-wrap{text-align:center;padding-bottom: var(--s3)}
/* (dead dark-only .cd-cell removed — the canonical theme-safe rule lives in the lobby section) */
.cd-cell b{font-family:var(--mono);font-size:21px;font-weight:700;display:block;line-height:1}
.cd-cell span{font-size:9px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase}

/* Home v2 — dev-only Cash balance hierarchy + Expedia-style destination grid. */
.home-v2{max-width:760px;margin:0 auto}
.hv2-setup-banner{display:grid;grid-template-columns:34px minmax(0,1fr) auto 14px;align-items:center;gap:10px;width:100%;margin:10px 0;padding:9px 11px;border:1px solid var(--gold-line);border-radius:14px;background:rgba(var(--gold-rgb),.06);text-align:left}
.hv2-setup-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:var(--gold-soft);color:var(--gold)}
.hv2-setup-icon .ic{width:17px;height:17px}
.hv2-setup-copy{min-width:0}.hv2-setup-copy b,.hv2-setup-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hv2-setup-copy b{font-size:var(--fs-small)}.hv2-setup-copy small{margin-top:1px;color:var(--muted);font-size:10px}
.hv2-setup-progress{padding:5px 8px;border-radius:999px;background:var(--surface-3);color:var(--gold);font-family:var(--mono);font-size:9px;font-weight:700}
.hv2-setup-banner>.ic{width:13px;height:13px;color:var(--faint)}
.hv2-push-banner{
  display:flex;align-items:center;gap:10px;width:calc(100% - 32px);max-width:420px;margin:2px auto 0;
  padding:7px 7px 7px 8px;border-radius:999px;border:1px solid var(--gold-line);
  background:var(--surface-2);color:var(--text);text-align:left;-webkit-tap-highlight-color:transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 14px 28px -22px rgba(0,0,0,.85);
}
.hv2-push-banner:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:3px}
.hv2-push-banner:active{transform:scale(.985)}
.hv2-push-banner-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;flex:none;background:var(--gold-foil);background-size:160% auto;color:var(--on-accent)}
.hv2-push-banner-icon .ic{width:15px;height:15px}
.hv2-push-banner-copy{min-width:0;flex:1}
.hv2-push-banner-copy b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--display);font-size:14px;font-weight:750;letter-spacing:-.02em}
.hv2-push-banner-go{flex:none;padding:7px 12px;border-radius:999px;background:rgba(var(--gold-rgb),.14);color:var(--gold);font-family:var(--display);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.hv2-balance-card{position:relative;overflow:hidden;padding:20px;border:1px solid var(--line-2);border-radius:26px;background:linear-gradient(135deg,rgba(var(--gold-rgb),.09),transparent 42%),var(--surface-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 26px 56px -36px rgba(0,0,0,.9)}
.hv2-balance-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.hv2-balance-top>span{font-family:var(--display);font-size:16px;font-weight:800}
.hv2-balance-top button{display:inline-flex;align-items:center;gap:4px;color:var(--muted);font-size:var(--fs-small);font-weight:600}
.hv2-balance-top .ic{width:13px;height:13px;color:var(--faint)}
.hv2-balance-value{position:relative;z-index:1;display:block;max-width:82%;margin-top:28px;font-family:var(--display);font-size:44px;font-weight:800;letter-spacing:-.055em;line-height:.98}
.hv2-balance-card h1{position:relative;z-index:1;max-width:82%;margin:12px 0 0;font-family:var(--display);font-size:18px;font-weight:750;letter-spacing:-.025em;line-height:1.25}
.hv2-balance-card p{position:relative;z-index:1;margin:5px 0 0;color:var(--muted);font-size:var(--fs-small);line-height:1.4}
.hv2-balance-actions{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:28px}
.hv2-balance-action{display:flex;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:50px;padding:0 12px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface-3);color:var(--text);font-size:var(--fs-small);font-weight:800}
.hv2-balance-action.is-primary{border-color:var(--gold-line);background:var(--gold-foil);background-size:160% auto;color:var(--on-accent);box-shadow:0 8px 18px -10px rgba(var(--gold-rgb),.52)}
.hv2-balance-action .ic{width:16px;height:16px;flex:none}
.hv2-balance-action span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hv2-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s3);margin:24px 2px 10px}
.hv2-section-head h2{font-family:var(--display);font-size:18px;letter-spacing:-.025em}
.hv2-section-head button,.hv2-section-head span{color:var(--muted);font-size:var(--fs-tiny);font-weight:650}
.hv2-section-head button{color:var(--gold)}
.hv2-destination-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.hv2-destination{position:relative;display:flex;aspect-ratio:1;min-width:0;flex-direction:column;align-items:center;justify-content:center;gap:11px;padding:10px 6px;border:1px solid var(--line);border-radius:18px;background:var(--surface-2);box-shadow:var(--sh-1);text-align:center}
.hv2-destination>.ic{width:28px;height:28px;color:var(--gold);filter:drop-shadow(0 5px 12px rgba(var(--gold-rgb),.14))}
.hv2-destination b{font-family:var(--display);font-size:13px;letter-spacing:-.01em}
.hv2-live-destination{gap:5px}.hv2-live-destination>.ic{margin-bottom:3px}.hv2-live-destination small{color:var(--gold);font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.04em}
.hv2-trader-card{display:grid;grid-template-columns:54px minmax(0,1fr) 36px;align-items:center;gap:12px;padding:14px;border-radius:18px;background:radial-gradient(110% 120% at 0% 0%,rgba(var(--gold-rgb),.11),transparent 62%),var(--surface-2);border:1px solid var(--line-2);box-shadow:var(--sh-1)}
.hv2-trader-avatar,.hv2-trader-empty{width:54px;height:54px;display:grid;place-items:center}
.hv2-trader-avatar .av{width:54px;height:54px;border-radius:15px;border:1px solid var(--gold-line)}
.hv2-trader-empty{border-radius:15px;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold)}
.hv2-trader-empty .ic{width:23px;height:23px}
.hv2-trader-copy{min-width:0;text-align:left}
.hv2-trader-copy small{display:block;color:var(--gold);font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.hv2-trader-copy b{display:block;margin-top:3px;overflow:hidden;font-family:var(--display);font-size:16px;text-overflow:ellipsis;white-space:nowrap}
.hv2-trader-copy em{display:block;margin-top:3px;overflow:hidden;color:var(--muted);font-size:var(--fs-tiny);font-style:normal;text-overflow:ellipsis;white-space:nowrap}
.hv2-card-go{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--surface-3);border:1px solid var(--line-2);color:var(--gold)}
.hv2-card-go .ic{width:15px;height:15px}
.hv2-team-update{display:grid;grid-template-columns:34px minmax(0,1fr) 18px;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(var(--gold-rgb),.07);border:1px solid var(--gold-line)}
.hv2-team-update>.ic:first-child{width:18px;height:18px;color:var(--gold);justify-self:center}
.hv2-team-update>.ic:last-child{width:14px;height:14px;color:var(--faint)}
.hv2-team-update span{text-align:left}.hv2-team-update small{display:block;color:var(--muted);font-size:9px}.hv2-team-update b{display:block;margin-top:1px;font-size:var(--fs-small)}
.hv2-setup-banner:focus-visible,.hv2-balance-action:focus-visible,.hv2-balance-top button:focus-visible,.hv2-destination:focus-visible,.hv2-trader-card:focus-visible,.hv2-team-update:focus-visible{outline:2px solid rgba(var(--gold-rgb),.58);outline-offset:2px}
.hv2-setup-banner:active,.hv2-balance-action:active,.hv2-destination:active,.hv2-trader-card:active,.hv2-team-update:active{transform:scale(.98)}
@media (max-width:360px){
  .hv2-setup-banner{grid-template-columns:30px minmax(0,1fr) auto 12px;padding-inline:9px}.hv2-setup-icon{width:30px;height:30px}
  .hv2-balance-card{padding:18px}.hv2-balance-value{font-size:39px}.hv2-balance-card h1{max-width:88%;font-size:17px}.hv2-balance-actions{gap:8px}.hv2-balance-action{padding-inline:9px;font-size:11px}
  .hv2-destination-grid{gap:7px}.hv2-destination{border-radius:16px}.hv2-destination>.ic{width:25px;height:25px}.hv2-destination b{font-size:12px}
}
@media (prefers-reduced-motion:reduce){.hv2-balance-card{transition:none}}

/* Home v2 — screenshot-led luxury: exact crest, generated atmosphere, quiet UI. */
.app.home-v2-active{background-color:#030303}
html:not([data-theme="light"]) .app.home-v2-active{background-image:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.3) 68%,rgba(0,0,0,.56)),url("assets/home/gold-atmosphere-v2.webp");background-position:center;background-size:cover}
html:not([data-theme="light"]) .app.home-v2-active::before{background:radial-gradient(72% 48% at 50% 34%,rgba(var(--gold-rgb),.08),transparent 72%);box-shadow:inset 0 -110px 100px -74px rgba(0,0,0,.9)}
[data-theme="light"] .app.home-v2-active{background-image:linear-gradient(180deg,rgba(255,253,248,.08),rgba(255,253,248,.2) 68%,rgba(239,229,210,.36)),url("assets/home/light-gold-atmosphere-v2.webp");background-position:center;background-size:cover}
[data-theme="light"] .app.home-v2-active::before{box-shadow:inset 0 -90px 130px -70px rgba(77,54,13,.12)}
.screen.home-v2-screen{min-height:100%}
.home-v2-stage{position:relative;display:flex;flex-direction:column;min-height:100%;max-width:760px;margin:0 auto}
.app.home-v2-active .screen-scroll{overflow:hidden;overscroll-behavior:none}
.app.home-v2-active .screen{height:100%;min-height:0;padding:0 14px calc(var(--tabbar-h) + 18px);overflow:hidden}
.app.home-v2-active .home-v2-stage{height:100%;min-height:0}
.hv2-home-stack{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0;width:100%;padding-bottom:2%;text-align:center}
.hv2-hero-toolbar{display:flex;align-items:center;justify-content:flex-end;width:100%;flex:none;padding-top:calc(env(safe-area-inset-top,0px) + 8px);min-height:calc(46px + env(safe-area-inset-top,0px) + 8px)}
.hv2-hero-actions{display:flex;align-items:center;gap:7px}
.hv2-theme-btn,.hv2-menu-btn{width:44px;height:44px;display:grid;place-items:center;color:var(--gold-hi);cursor:pointer;filter:drop-shadow(0 3px 8px rgba(var(--gold-rgb),.2));transition:transform .16s var(--ease-spring),background .2s,border-color .2s}
.hv2-theme-btn{border:1px solid rgba(var(--gold-rgb),.3);border-radius:50%;background:rgba(4,4,4,.32);box-shadow:inset 0 1px 0 rgba(255,242,192,.08)}
.hv2-menu-btn{border:0;border-radius:0;background:transparent}
.hv2-theme-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
.hv2-menu-btn .ic{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.65}
.hv2-theme-btn:focus-visible,.hv2-menu-btn:focus-visible{outline:2px solid rgba(var(--gold-rgb),.68);outline-offset:2px}
.hv2-theme-btn:active,.hv2-menu-btn:active{transform:scale(.92)}
.hv2-brand-lockup{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;margin-top:0}
.hv2-brand-lockup::before{content:"";position:absolute;z-index:-1;top:4px;left:50%;width:min(92vw,380px);height:min(92vw,380px);transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(var(--gold-rgb),.15),rgba(var(--gold-rgb),.04) 44%,transparent 70%);filter:blur(10px);pointer-events:none}
.hv2-brand-composite{position:relative;z-index:1;display:block;width:min(70vw,clamp(204px,30.5dvh,274px));height:auto;aspect-ratio:803/1030;object-fit:contain;filter:drop-shadow(0 9px 8px rgba(0,0,0,.42)) drop-shadow(0 24px 34px rgba(var(--gold-rgb),.2));transform:translateZ(0)}
.hv2-brand-composite-light{display:none}
.hv2-welcome{margin:18px 0 0;color:var(--gold-hi);font-size:17px;line-height:1.25;letter-spacing:-.015em;text-shadow:0 3px 12px rgba(0,0,0,.58)}
.hv2-welcome-profile{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:0;border:0;background:transparent;font:inherit;color:inherit;cursor:pointer}
.hv2-welcome strong{font-weight:700}
.hv2-welcome-profile:active strong{opacity:.78}
.hv2-welcome-profile:focus-visible{outline:2px solid rgba(var(--gold-rgb),.58);outline-offset:5px;border-radius:6px}
.hv2-welcome-chev{width:13px;height:13px;color:currentColor;opacity:.72;fill:none;stroke:currentColor;stroke-width:1.8}
.hv2-welcome-rule{display:block;width:56px;height:3px;margin:14px auto 0;border-radius:999px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-hi));box-shadow:0 0 12px rgba(var(--gold-rgb),.28)}
.home-v2{flex:none;width:100%;max-width:760px;margin:0 auto}
.hv2-start-card{width:100%;padding:28px 0 0;border:0;background:transparent;box-shadow:none;text-align:center}
.hv2-start-card::before{display:none}
.hv2-start-title{max-width:none!important;margin:0!important;font-family:var(--display);font-size:clamp(42px,10.6vw,54px)!important;font-weight:800!important;letter-spacing:-.06em!important;line-height:.98!important;text-shadow:0 7px 22px rgba(0,0,0,.42)}
.hv2-start-accent{background:linear-gradient(105deg,#a47420 0%,#ffe48c 42%,#b47a20 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.hv2-start-card p{max-width:360px;margin:12px auto 0;color:var(--text-2);font-size:15px;line-height:1.45;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.hv2-start-card .hv2-balance-actions{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:26px}
.hv2-start-card .hv2-balance-action{height:58px;min-height:58px;padding:0 18px;border-radius:999px;border-width:1px;border-style:solid;font-size:15px;font-weight:800;letter-spacing:-.01em;transition:transform .16s var(--ease-spring),filter .2s,box-shadow .2s}
.hv2-start-card.hv2-balance-card{overflow:visible}
/* ============================================================
   Open Office primary CTA (`.hv2-office-btn`) — luxury metallic gold
   + AAA motion. Reusable look: scoped to the class so adopting it on
   other gold buttons is a one-class swap. All motion is transform /
   opacity only. Dark below, light override further down.
   ============================================================ */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn{
  position:relative;
  isolation:isolate;
  overflow:hidden;                 /* clamp gloss + shine sweep to the pill */
  border:1px solid rgba(252,242,179,.55);
  color:#0B0701;
  background:linear-gradient(180deg,
    #F2D278 0%,#E0B95F 18%,#CC9E44 40%,#AB8135 64%,#996F26 84%,#7F5A1C 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,252,235,.4),          /* 1px top sheen */
    inset 0 -2px 4px rgba(103,70,16,.65),       /* darker inner edge */
    0 1px 1px rgba(0,0,0,.24),                  /* dark lift */
    0 10px 24px -8px rgba(204,158,68,.4);      /* warm gold glow */
  transition:transform .3s var(--ease-spring),box-shadow .3s cubic-bezier(.2,.8,.2,1),filter .3s;
}
/* crisp top sheen (never a band across the label) */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn::before{
  content:"";position:absolute;top:0;left:0;right:0;height:46%;border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0));pointer-events:none;
}
/* race-shine sweep — loops every 4s (a narrow, quiet highlight, then idle) */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn::after{
  content:"";position:absolute;top:-40%;bottom:-40%;left:-60%;width:34%;
  background:linear-gradient(105deg,transparent,rgba(255,252,235,.22),transparent);
  transform:skewX(-20deg);pointer-events:none;
  animation:lux-shine 4s ease-in-out 1.2s infinite;
}
@keyframes lux-shine{
  0%,18%{left:-60%;opacity:0}          /* idle until cycle start */
  25%{opacity:.72}                     /* restrained highlight enters */
  48%{left:140%;opacity:0}             /* sweep exits */
  100%{left:140%;opacity:0}            /* remain idle until next cycle */
}
/* idle ambient glow pulse — slow & faint */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn.is-glow{animation:lux-pulse 4.5s ease-in-out 1.8s infinite}
@keyframes lux-pulse{
  0%,100%{box-shadow:
    inset 0 1px 0 rgba(255,252,235,.4),
    inset 0 -2px 4px rgba(103,70,16,.65),
    0 1px 1px rgba(0,0,0,.24),
    0 10px 24px -8px rgba(204,158,68,.3)}
  50%{box-shadow:
    inset 0 1px 0 rgba(255,252,235,.44),
    inset 0 -2px 4px rgba(103,70,16,.65),
    0 2px 2px rgba(0,0,0,.28),
    0 16px 34px -10px rgba(204,158,68,.5)}
}
/* keep label + icon above gloss layers */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn .ic,
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn > span{position:relative;z-index:2}
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn .ic{color:#0B0701}
/* hover: lift + glow intensify */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:hover{filter:brightness(1.05) saturate(1.02);transform:translateY(-1px)}
/* press: compress, shadow tightens, gloss dims */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:active:not(:disabled){
  transform:scale(.965) translateY(0);
  box-shadow:inset 0 2px 4px rgba(103,70,16,.72),0 2px 8px -1px rgba(204,158,68,.4);
  filter:brightness(.98);
}
/* disabled + focus */
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:focus-visible{outline:2px solid rgba(var(--gold-rgb),.62);outline-offset:2px}
.hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:disabled{opacity:.5;cursor:not-allowed;filter:saturate(.4);animation:none}
/* shared press scale for the whole start-card action row (journal, etc.) */
.hv2-start-card .hv2-balance-action:active{transform:scale(.975)}
.gold-primary:hover{filter:brightness(1.04) saturate(1.04)}
.gold-primary:active:not(:disabled){transform:scale(.975);filter:brightness(.98)}
.gold-primary:disabled{opacity:.55;cursor:not-allowed;filter:saturate(.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.24)}
html:not([data-theme="light"]) .hv2-start-card .hv2-balance-action:not(.is-primary){background:rgba(2,2,2,.42);border:1px solid rgba(var(--gold-rgb),.5);color:#f7f4ec;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
[data-theme="light"] .hv2-brand-lockup::before{background:radial-gradient(circle,rgba(var(--gold-rgb),.18),transparent 70%)}
[data-theme="light"] .hv2-theme-btn{border-color:rgba(124,82,14,.25);background:rgba(255,255,255,.52);color:#7b5215;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 15px -12px rgba(75,49,8,.38)}
[data-theme="light"] .hv2-menu-btn{color:#805716;filter:drop-shadow(0 2px 5px rgba(92,61,10,.12))}
[data-theme="light"] .hv2-brand-composite-dark{visibility:hidden}
[data-theme="light"] .hv2-brand-composite-light{position:absolute;inset:0;display:block;width:100%;height:100%;filter:drop-shadow(0 2px 1px rgba(86,57,9,.16)) drop-shadow(0 15px 24px rgba(var(--gold-rgb),.18))}
[data-theme="light"] .hv2-start-accent{background:linear-gradient(105deg,#765017 0%,#c58e2b 44%,#815615 100%);-webkit-background-clip:text;background-clip:text}
[data-theme="light"] .hv2-welcome,[data-theme="light"] .hv2-start-card p{text-shadow:none}
[data-theme="light"] .hv2-start-title{text-shadow:0 6px 20px rgba(54,38,8,.1)}
/* Light-mode Open Office CTA — luxury metallic gold on a bright surface. Same
   shape/motion, brighter gold, crisper edges so it stays the obvious primary
   CTA without blending into the light screen. */
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn{
  border:1px solid rgba(154,109,34,.5);         /* thin polished gold border */
  color:#43290A;                                /* deep gold / warm brown text+icon */
  background:linear-gradient(180deg,
    #EFD38F 0%,#D8AE4A 40%,#BF8E2F 72%,#9A6D22 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,244,200,.5),          /* 1px top-edge highlight */
    inset 0 -2px 4px rgba(122,82,16,.35),       /* deeper gold bottom edge */
    0 2px 4px rgba(118,88,22,.18),              /* soft warm-neutral shadow */
    0 8px 20px -12px rgba(191,142,47,.28);     /* subtle golden ambient glow */
}
/* light sheen — thinner, no cream-on-cream blotch */
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn::before{
  content:"";position:absolute;top:0;left:0;right:0;height:38%;border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0));pointer-events:none;
}
/* keep the shine sweep (crisp on a bright button) */
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn::after{
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.18),transparent);
}
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn .ic{color:#43290A}
/* idle pulse — light variant */
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn.is-glow{animation:lux-pulse-light 4.5s ease-in-out 1.8s infinite}
@keyframes lux-pulse-light{
  0%,100%{box-shadow:
    inset 0 1px 0 rgba(255,244,200,.5),
    inset 0 -2px 4px rgba(122,82,16,.35),
    0 2px 4px rgba(118,88,22,.16),
    0 8px 20px -12px rgba(191,142,47,.2)}
  50%{box-shadow:
    inset 0 1px 0 rgba(255,244,200,.62),
    inset 0 -2px 4px rgba(122,82,16,.35),
    0 3px 6px rgba(118,88,22,.2),
    0 14px 30px -12px rgba(191,142,47,.34)}
}
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:hover{filter:brightness(1.02) saturate(1.02);transform:translateY(-1px)}
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:active:not(:disabled){
  transform:scale(.965) translateY(0);
  box-shadow:inset 0 2px 5px rgba(122,82,16,.45),0 2px 5px -2px rgba(154,109,34,.35);
  filter:brightness(.97);
}
[data-theme="light"] .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn:disabled{animation:none}
[data-theme="light"] .hv2-start-card .hv2-balance-action:not(.is-primary){background:rgba(255,255,255,.58);border-color:rgba(var(--gold-rgb),.44);box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
@media (prefers-reduced-motion: reduce){
  .hv2-start-card .hv2-balance-action.is-primary.btn-gold.hv2-office-btn::after{animation:none}
}
html:not([data-theme="light"]) .app.home-v2-active .tabbar{background:rgba(4,4,5,.74);border-color:rgba(var(--gold-rgb),.22);box-shadow:inset 0 1px 0 rgba(255,238,184,.1),0 22px 46px -17px rgba(0,0,0,.9),0 0 28px -20px rgba(var(--gold-rgb),.7)}
.app.home-v2-active .tab.active .tab-cluster::before{background:linear-gradient(135deg,rgba(var(--gold-rgb),.24),rgba(var(--gold-rgb),.07));border-color:rgba(var(--gold-rgb),.5);box-shadow:inset 0 1px 0 rgba(255,240,190,.22),0 0 17px -10px rgba(var(--gold-rgb),.9)}

/* Hamburger menu only — dark luxury screen. Does not restyle the app tab bar. */
.modal.modal-menu{
  z-index:100;
  background:#050505;
  justify-content:stretch;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  isolation:isolate;
  contain:paint;
  transition:none;
}
.modal.modal-menu .sheet{transition:none}
/* Menu is full-screen with no dock. Hide the app tab bar while it is open. */
#app:has(> #modal.modal.open.modal-menu) > #tabbar{
  visibility:hidden;
  pointer-events:none;
}
#app:has(> #modal.modal.open.modal-menu) .hv2-theme-btn,
#app:has(> #modal.modal.open.modal-menu) .hv2-hero-toolbar{
  pointer-events:none;
}
.hv2-menu-dock{display:none!important}
.modal-menu .sheet{
  max-height:none;
  height:100%;
  display:flex;
  flex-direction:column;
  border:0;
  border-radius:0;
  background:#050505!important;
  box-shadow:none;
  transform:none;
  padding:0;
  overflow:hidden;
  isolation:isolate;
}
.modal-menu.open .sheet{transform:none}
.modal-menu .sheet-grab{display:none}
/* Hub sheets sit on top of the still-mounted menu so Back is an instant reveal. */
.modal.modal-menu.has-hub-sheet{
  justify-content:flex-end;
  transition:none;
}
.modal.modal-menu.has-hub-sheet.modal-feed{justify-content:stretch}
.modal-menu.has-hub-sheet .sheet-menu-parked{
  visibility:hidden;
  pointer-events:none;
  position:absolute;
  inset:0;
  z-index:0;
}
.modal-menu.has-hub-sheet .sheet-hub{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:2;
  max-height:90%;
  height:auto;
  display:flex;
  flex-direction:column;
  border:0;
  border-top:1px solid var(--line-2);
  border-radius:26px 26px 0 0;
  background:var(--surface)!important;
  box-shadow:0 -18px 48px rgba(0,0,0,.45);
  padding:var(--s2) var(--s4) calc(98px + env(safe-area-inset-bottom));
  overflow-y:auto;
  transform:translate3d(0,100%,0);
  transition:transform .18s cubic-bezier(.22,.82,.2,1);
}
.modal-menu.has-hub-sheet .sheet-hub.is-in{transform:translate3d(0,0,0)}
.modal-menu.has-hub-sheet.modal-feed .sheet-hub,
.modal-menu.has-hub-sheet .sheet-hub.sheet-feed,
.modal-menu.has-hub-sheet .sheet-hub.sheet-locked{
  max-height:none;
  height:100%;
  border:0;
  border-radius:0;
  padding:0;
  box-shadow:none;
}
@media (prefers-reduced-motion:reduce){
  .modal-menu.has-hub-sheet .sheet-hub{
    transition:none;
    transform:none;
  }
}
.hv2-menu-page{
  position:relative;
  display:flex;
  flex-direction:column;
  height:100%;
  color:#F3EEE2;
  background:#050505!important;
  isolation:isolate;
}
.hv2-menu-close{
  position:absolute;
  z-index:6;
  top:calc(env(safe-area-inset-top, 0px) + 10px);
  right:16px;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(224,178,60,.38);
  border-radius:50%;
  background:rgba(8,8,8,.48);
  color:#EAB843;
  box-shadow:inset 0 1px 0 rgba(255,242,192,.1),0 6px 16px -10px rgba(0,0,0,.8);
  -webkit-tap-highlight-color:transparent;
}
.hv2-menu-close .ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.hv2-menu-close:active{transform:scale(.92)}
.hv2-menu-close:focus-visible{outline:2px solid rgba(224,178,60,.7);outline-offset:2px}
.hv2-menu-scroll{
  flex:1;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:calc(env(safe-area-inset-top,0px) + 8px) 24px calc(env(safe-area-inset-bottom,0px) + 28px);
  background:#050505;
  overscroll-behavior:contain;
}
.hv2-menu-hero{
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  min-height:150px;
  margin:0 -24px 2px;
  padding:22px 24px 35px;
  overflow:hidden;
  background:#050505;
  isolation:isolate;
}
.hv2-menu-hero-wave{
  position:absolute;z-index:0;inset:0;
  pointer-events:none;
  background:#050505 url("assets/home/menu-header-lockup-v2.webp") center 30% / 112% auto no-repeat;
}
.hv2-menu-body{position:relative;width:min(100%,430px);margin:0 auto;padding:2px 0 8px;background:#050505}
.hv2-menu-intro{margin:0 2px}
.hv2-menu-title{
  margin:0;
  font-family:ui-serif,"New York","Iowan Old Style",Georgia,serif;
  font-size:34px;
  font-weight:500;
  letter-spacing:-.035em;
  line-height:.98;
  color:#F6F1E6;
  text-shadow:0 2px 14px rgba(0,0,0,.7);
}
.hv2-menu-title::after{
  content:"";display:block;width:34px;height:1.5px;margin-top:7px;
  background:linear-gradient(90deg,#A8751D,#FFE89A 58%,#9B6716);
  border-radius:2px;
  box-shadow:0 0 7px rgba(224,178,60,.46);
}
.hv2-menu-sub{margin:7px 0 0;color:#AAA49A;font-size:13px;line-height:1.35}
.hv2-menu-label{
  display:flex;align-items:center;gap:8px;
  margin:14px 2px 7px;
  color:#E1AE3A;
  font-family:var(--display);
  font-size:10.5px;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.hv2-menu-label::before{
  content:"";width:8px;height:8px;flex:none;border-radius:50%;
  border:1.5px solid #E7B444;
  box-shadow:0 0 0 3px rgba(214,163,59,.1),0 0 8px rgba(224,178,60,.32);
}
.hv2-menu-label::after{
  content:"";flex:1;height:1px;
  background:linear-gradient(90deg,rgba(214,163,59,.66),rgba(214,163,59,.12));
}
.hv2-menu-list{display:flex;flex-direction:column;gap:5px;border:0}
.hv2-menu-row{
  position:relative;
  display:flex;align-items:center;gap:13px;width:100%;
  min-height:56px;padding:5px 11px;
  border:1px solid rgba(224,178,60,.5);
  border-radius:14px;
  background-color:#090a0a;
  background-image:linear-gradient(115deg,rgba(255,255,255,.045),transparent 30%,rgba(255,224,150,.018) 78%,rgba(255,236,184,.055)),var(--grain),linear-gradient(180deg,#141414 0%,#080909 100%);
  background-size:auto,120px 120px,auto;
  color:#F3EEE2;text-align:left;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,234,179,.18),inset 0 -1px 0 rgba(0,0,0,.8),0 10px 22px -18px rgba(0,0,0,.95),0 0 12px -10px rgba(224,178,60,.58);
  transition:transform .18s var(--ease-out),border-color .18s,filter .18s;
}
.hv2-menu-row::before{
  content:"";position:absolute;left:63px;top:8px;bottom:8px;width:1px;
  background:linear-gradient(180deg,transparent,rgba(224,178,60,.18) 18%,rgba(224,178,60,.18) 82%,transparent);
  pointer-events:none;
}
.hv2-menu-row::after{
  content:"";position:absolute;top:-1px;right:11%;width:68px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,239,193,.78),transparent);
  box-shadow:0 0 8px rgba(224,178,60,.32);
  pointer-events:none;
}
.hv2-menu-row:active{opacity:1;transform:scale(.98);filter:brightness(1.08);border-color:rgba(224,178,60,.62)}
.hv2-menu-row:focus-visible{outline:2px solid rgba(224,178,60,.7);outline-offset:2px}
.hv2-menu-icon{
  position:relative;
  width:42px;height:42px;flex:none;display:grid;place-items:center;
  border-radius:11px;
  background:linear-gradient(145deg,#161615,#060707 72%);
  border:1px solid rgba(235,193,77,.7);
  box-shadow:inset 0 1px 0 rgba(255,239,193,.2),inset 0 -1px 0 rgba(0,0,0,.72),0 5px 10px -7px rgba(0,0,0,.9),0 0 9px -7px rgba(224,178,60,.7);
}
.hv2-menu-icon .ic{width:21px;height:21px;color:#EAB843;fill:none;stroke:currentColor;stroke-width:1.7;filter:drop-shadow(0 0 4px rgba(224,178,60,.2))}
.hv2-menu-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
.hv2-menu-row b{font-size:15px;font-weight:650;letter-spacing:-.012em;color:#F8F4EA;line-height:1.15}
.hv2-menu-row small{overflow:visible;color:#AAA49A;font-size:10.5px;line-height:1.22;letter-spacing:-.01em;white-space:normal;text-overflow:unset}
.hv2-menu-trail{flex:none;display:grid;place-items:center;color:#D6A33B}
.hv2-menu-trail .ic{width:17px;height:17px;color:#E6AE31;fill:none;stroke:currentColor;stroke-width:1.8}
.hv2-menu-row .hv2-menu-value{flex:none;color:#E0B23C;font-size:11px;font-weight:700}
.hv2-menu-badge{
  display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;
  border-radius:999px;background:linear-gradient(180deg,#F0C75A,#C9922A);
  color:#1A1206;font-size:11px;font-weight:800;letter-spacing:-.02em;line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,239,193,.55),0 4px 10px -6px rgba(0,0,0,.75);
}

/* Light menu — same layout, ivory/champagne field. Dock stays removed. */
html[data-theme="light"] .modal.modal-menu{
  background:#F6F1E6;
}
html[data-theme="light"] .modal-menu .sheet,
html[data-theme="light"] .hv2-menu-page{
  background:#F6F1E6!important;
  color:#15151A;
}
html[data-theme="light"] .hv2-menu-close{
  border-color:rgba(124,82,14,.25);
  background:rgba(255,255,255,.62);
  color:#7b5215;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 15px -12px rgba(75,49,8,.38);
}
html[data-theme="light"] .hv2-menu-scroll,
html[data-theme="light"] .hv2-menu-hero{
  background:#F6F1E6;
}
/* Keep the hero on the same safe-area baseline in both themes. The previous
   zeroed inset pulled the light lockup up on notched phones. */
html[data-theme="light"] .hv2-menu-scroll{
  padding-top:calc(env(safe-area-inset-top,0px) + 8px);
}
html[data-theme="light"] .hv2-menu-hero{
  overflow:visible;
}
html[data-theme="light"] .hv2-menu-body{
  background:transparent;
}
.hv2-menu-lockup,.hv2-menu-filaments{display:none}
html[data-theme="light"] .hv2-menu-hero-wave{
  top:0;right:0;left:0;bottom:-36px;
  background:#F6F1E6 url("assets/home/menu-header-lockup-v10-light.webp") center calc(36% - 8px) / 112% auto no-repeat;
}
html[data-theme="light"] .hv2-menu-hero-wave::before{
  content:"";
  position:absolute;
  top:0;right:0;left:0;
  height:44px;
  background:linear-gradient(180deg,#F6F1E6 0%,rgba(246,241,230,.82) 42%,rgba(246,241,230,0) 100%);
  pointer-events:none;
}
html[data-theme="light"] .hv2-menu-hero-wave::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:30px;
  background:linear-gradient(180deg,rgba(246,241,230,0) 0%,rgba(246,241,230,.45) 55%,#F6F1E6);
  pointer-events:none;
}
html[data-theme="light"] .hv2-menu-hero::after{
  display:none;
}
html[data-theme="light"] .hv2-menu-intro{
  position:relative;
  z-index:2;
  margin-top:0;
  background:transparent;
}
html[data-theme="light"] .hv2-menu-title{
  color:#1A140C;
  text-shadow:none;
}
html[data-theme="light"] .hv2-menu-title::after{
  background:linear-gradient(90deg,#8A6620,#E0B23C 42%,#F3D277 58%,#A87C22);
  box-shadow:0 0 8px rgba(200,150,56,.28);
}
html[data-theme="light"] .hv2-menu-sub{color:#6B6458}
html[data-theme="light"] .hv2-menu-label{color:#8A6620}
html[data-theme="light"] .hv2-menu-label::before{
  border-color:#C89638;
  box-shadow:0 0 0 3px rgba(200,150,56,.12),0 0 8px rgba(200,150,56,.22);
}
html[data-theme="light"] .hv2-menu-label::after{
  background:linear-gradient(90deg,rgba(200,150,56,.55),rgba(200,150,56,.08));
}
html[data-theme="light"] .hv2-menu-row{
  border-color:rgba(168,124,34,.36);
  background-color:#FFFDF8;
  background-image:
    linear-gradient(115deg,rgba(255,255,255,.82),transparent 30%,rgba(232,200,120,.08) 78%,rgba(255,244,214,.38)),
    var(--grain),
    linear-gradient(180deg,#FFFDF8 0%,#F7F0E2 100%);
  background-size:auto,120px 120px,auto;
  color:#1A140C;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -1px 0 rgba(138,102,32,.06),
    0 8px 18px -16px rgba(86,57,9,.28),
    0 0 12px -10px rgba(200,150,56,.26);
}
html[data-theme="light"] .hv2-menu-row::before{
  background:linear-gradient(180deg,transparent,rgba(168,124,34,.16) 18%,rgba(168,124,34,.16) 82%,transparent);
}
html[data-theme="light"] .hv2-menu-row::after{
  background:linear-gradient(90deg,transparent,rgba(243,210,119,.88),transparent);
  box-shadow:0 0 7px rgba(200,150,56,.22);
}
html[data-theme="light"] .hv2-menu-row:active{
  filter:brightness(1.02);
  border-color:rgba(168,124,34,.52);
}
html[data-theme="light"] .hv2-menu-row:focus-visible{outline-color:rgba(168,124,34,.7)}
html[data-theme="light"] .hv2-menu-icon{
  background:linear-gradient(145deg,#FFFCF4,#F3E6C4 78%);
  border-color:rgba(184,137,42,.62);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.94),
    inset 0 -1px 0 rgba(138,102,32,.10),
    0 4px 10px -7px rgba(86,57,9,.24),
    0 0 8px -6px rgba(200,150,56,.28);
}
html[data-theme="light"] .hv2-menu-icon .ic{
  color:#8A6620;
  filter:drop-shadow(0 0 2px rgba(200,150,56,.16));
}
html[data-theme="light"] .hv2-menu-row b{color:#1A140C}
html[data-theme="light"] .hv2-menu-row small{color:#6B6458}
html[data-theme="light"] .hv2-menu-trail,
html[data-theme="light"] .hv2-menu-trail .ic{color:#B8892A}
html[data-theme="light"] .hv2-menu-row .hv2-menu-value{color:#A87C22}
html[data-theme="light"] .hv2-menu-badge{
  background:linear-gradient(180deg,#E8C056,#B8892A);
  color:#1A1206;
}

/* Refined menu: keep the original lockup, quieten navigation, improve scanning. */
.hv2-menu-page{
  --menu-bg:#050505;
  --menu-surface:#121212;
  --menu-text:#F6F1E6;
  --menu-muted:#B2AA9D;
  --menu-subtle:#B8AB94;
  --menu-gold:#E0B23C;
  --menu-line:#292721;
  --menu-press:#262116;
  color:var(--menu-text);
  background:var(--menu-bg)!important;
}
html[data-theme="light"] .hv2-menu-page{
  --menu-bg:#F6F1E6;
  --menu-surface:#FFFDF8;
  --menu-text:#211A10;
  --menu-muted:#736857;
  --menu-subtle:#81735E;
  --menu-gold:#89631B;
  --menu-line:#E7DFCF;
  --menu-press:#F0E6D3;
}
.hv2-menu-scroll{
  padding-right:22px;
  padding-bottom:calc(env(safe-area-inset-bottom,0px) + 34px);
  padding-left:22px;
  background:var(--menu-bg);
}
.hv2-menu-scroll-chrome{
  position:absolute;
  z-index:5;
  top:0;
  right:0;
  left:0;
  height:calc(env(safe-area-inset-top,0px) + 76px);
  border-bottom:1px solid var(--menu-line);
  background:var(--menu-bg);
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease;
}
.hv2-menu-scroll-chrome span{
  position:absolute;
  bottom:14px;
  left:22px;
  color:var(--menu-text);
  font-family:ui-serif,"New York","Iowan Old Style",Georgia,serif;
  font-size:24px;
  font-weight:500;
  letter-spacing:-.027em;
}
.hv2-menu-page.is-scrolled .hv2-menu-scroll-chrome{opacity:1}
.hv2-menu-page.is-scrolled .hv2-menu-close{
  border-color:var(--menu-line);
  background:var(--menu-bg);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.hv2-menu-hero{
  min-height:202px;
  margin-right:-22px;
  margin-bottom:0;
  margin-left:-22px;
  padding-right:22px;
  padding-bottom:30px;
  padding-left:22px;
  background:var(--menu-bg);
}
.hv2-menu-body{
  width:min(100%,430px);
  padding:0 0 8px;
  background:var(--menu-bg);
}
.hv2-menu-intro{
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:-2px 0 0;
}
.hv2-menu-title{
  color:var(--menu-text);
  font-size:34px;
  line-height:1.1;
  letter-spacing:-.038em;
  text-shadow:none;
}
.hv2-menu-title::after{content:none}
.hv2-menu-sub{
  margin-top:6px;
  color:var(--menu-muted);
  font-size:13px;
  line-height:1.5;
  letter-spacing:-.01em;
}
.hv2-menu-appearance{
  width:44px;
  height:44px;
  flex:none;
  display:grid;
  place-items:center;
  border:1px solid var(--menu-line);
  border-radius:50%;
  background:var(--menu-surface);
  color:var(--menu-gold);
  -webkit-tap-highlight-color:transparent;
}
.hv2-menu-appearance .ic{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7}
.hv2-menu-appearance:active{transform:scale(.94);background:var(--menu-press)}
.hv2-menu-appearance:focus-visible{outline:2px solid var(--menu-gold);outline-offset:3px}
.hv2-menu-search{
  height:46px;
  display:flex;
  align-items:center;
  gap:10px;
  margin:19px 0 22px;
  padding:0 14px;
  border:1px solid var(--menu-line);
  border-radius:13px;
  background:color-mix(in srgb,var(--menu-surface) 70%,var(--menu-bg));
  color:var(--menu-subtle);
}
.hv2-menu-search:focus-within{
  border-color:var(--menu-gold);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--menu-gold) 10%,transparent);
}
.hv2-menu-search>.ic{width:18px;height:18px;flex:none;fill:none;stroke:currentColor}
.hv2-menu-search input{
  width:100%;
  min-width:0;
  height:44px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--menu-text);
  font-family:var(--body);
  font-size:16px;
  line-height:1.5;
}
.hv2-menu-search input::placeholder{color:var(--menu-muted);font-size:14px;opacity:1}
.hv2-menu-search input::-webkit-search-cancel-button{display:none}
.hv2-menu-search-clear{
  width:44px;
  height:44px;
  flex:none;
  display:grid;
  place-items:center;
  margin-right:-13px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--menu-muted);
}
.hv2-menu-search-clear .ic{width:16px;height:16px;fill:none;stroke:currentColor}
.hv2-menu-search-clear[hidden],
.hv2-menu-search-summary[hidden],
.hv2-menu-section[hidden],
.hv2-menu-row[hidden],
.hv2-menu-empty[hidden]{display:none!important}
.hv2-menu-search-summary{
  margin:-10px 3px 17px;
  color:var(--menu-muted);
  font-size:11px;
}
.hv2-menu-section{margin-top:23px}
.hv2-menu-section:first-of-type{margin-top:0}
.hv2-menu-label{
  margin:0 3px 10px;
  color:var(--menu-muted);
  font-family:var(--display);
  font-size:12px;
  font-weight:650;
  line-height:1.5;
  letter-spacing:.007em;
  text-transform:none;
}
.hv2-menu-label::before,.hv2-menu-label::after{content:none}
.hv2-menu-list{
  gap:0;
  overflow:hidden;
  border:1px solid var(--menu-line);
  border-radius:17px;
  background:var(--menu-surface);
  box-shadow:none;
}
.hv2-menu-row{
  min-height:72px;
  gap:13px;
  padding:13px 14px;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--menu-text);
  box-shadow:none;
  transition:background-color .14s ease,transform .14s ease;
}
.hv2-menu-row::before,.hv2-menu-row::after{content:none}
.hv2-menu-row+.hv2-menu-row::before{
  content:"";
  position:absolute;
  top:0;
  right:14px;
  bottom:auto;
  left:52px;
  width:auto;
  height:1px;
  background:var(--menu-line);
}
.hv2-menu-row:active{
  transform:scale(.993);
  border-color:transparent;
  background:var(--menu-press);
  filter:none;
}
.hv2-menu-row:focus-visible{outline:2px solid var(--menu-gold);outline-offset:-3px}
.hv2-menu-icon{
  width:25px;
  height:auto;
  flex:none;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.hv2-menu-icon .ic{
  width:22px;
  height:22px;
  color:var(--menu-gold);
  filter:none;
}
.hv2-menu-copy{gap:4px}
.hv2-menu-row b{
  color:var(--menu-text);
  font-size:16px;
  font-weight:600;
  line-height:1.25;
  letter-spacing:-.019em;
}
.hv2-menu-row small{
  color:var(--menu-muted);
  font-size:13px;
  line-height:1.4;
  letter-spacing:-.012em;
}
.hv2-menu-trail,.hv2-menu-trail .ic{color:var(--menu-subtle)}
.hv2-menu-trail .ic{width:15px;height:15px;stroke-width:1.6}
.hv2-menu-row .hv2-menu-value{color:var(--menu-subtle);font-size:10px}
.hv2-menu-badge{
  min-width:20px;height:20px;padding:0 5px;
  background:linear-gradient(180deg,var(--gold-hi,#F3D277),var(--gold,#E0B23C));
  color:var(--color-bg,#040406);font-size:10px;
}
.hv2-menu-section:last-of-type .hv2-menu-row{min-height:66px}
.hv2-menu-empty{
  padding:30px 12px 45px;
  color:var(--menu-muted);
  font-size:13px;
  line-height:1.6;
  text-align:center;
}
.hv2-menu-empty b{display:block;margin-bottom:7px;color:var(--menu-text);font-size:16px;font-weight:600}
.hv2-menu-empty span{display:block}
.hv2-menu-footer{margin:26px 0 6px;color:var(--menu-muted);font-size:10px;line-height:1.6;text-align:center}
html[data-theme="light"] .hv2-menu-scroll,
html[data-theme="light"] .hv2-menu-hero,
html[data-theme="light"] .hv2-menu-body{background:var(--menu-bg)}
html[data-theme="light"] .hv2-menu-title,
html[data-theme="light"] .hv2-menu-row b{color:var(--menu-text)}
html[data-theme="light"] .hv2-menu-sub,
html[data-theme="light"] .hv2-menu-row small,
html[data-theme="light"] .hv2-menu-label{color:var(--menu-muted)}
html[data-theme="light"] .hv2-menu-row{
  border:0;
  background:transparent;
  color:var(--menu-text);
  box-shadow:none;
}
html[data-theme="light"] .hv2-menu-row::after{content:none}
html[data-theme="light"] .hv2-menu-row+.hv2-menu-row::before{background:var(--menu-line)}
html[data-theme="light"] .hv2-menu-row:active{border-color:transparent;background:var(--menu-press);filter:none}
html[data-theme="light"] .hv2-menu-icon{
  border:0;
  background:transparent;
  box-shadow:none;
}
html[data-theme="light"] .hv2-menu-icon .ic{color:var(--menu-gold);filter:none}
html[data-theme="light"] .hv2-menu-trail,
html[data-theme="light"] .hv2-menu-trail .ic,
html[data-theme="light"] .hv2-menu-row .hv2-menu-value{color:var(--menu-subtle)}
@media (max-width:350px){
  .hv2-menu-scroll{padding-right:17px;padding-left:17px}
  .hv2-menu-hero{min-height:192px;margin-right:-17px;margin-left:-17px;padding-right:17px;padding-left:17px}
  .hv2-menu-intro{gap:10px}
  .hv2-menu-title{font-size:31px}
  .hv2-menu-sub{font-size:12px}
  .hv2-menu-row{min-height:70px;gap:10px;padding:13px 11px}
  .hv2-menu-row+.hv2-menu-row::before{right:12px;left:47px}
  .hv2-menu-scroll-chrome span{left:17px}
}
@media (prefers-reduced-motion:reduce){
  .hv2-menu-scroll-chrome,.hv2-menu-row,.hv2-menu-appearance{transition:none}
}

.hv2-menu-dock{
  position:relative;
  flex:none;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)) clamp(48px,14vw,60px) repeat(3,minmax(0,1fr));
  align-items:end;
  width:min(100%,430px);
  height:calc(86px + env(safe-area-inset-bottom,0px));
  margin:0 auto;
  padding:0 2px env(safe-area-inset-bottom,0px);
  background:#050505;
}
.hv2-menu-dock-frame{
  position:absolute;
  left:0;right:0;bottom:env(safe-area-inset-bottom,0px);
  width:100%;height:86px;
  overflow:visible;
  filter:drop-shadow(0 -2px 8px rgba(224,178,60,.08)) drop-shadow(0 12px 20px rgba(0,0,0,.76));
  pointer-events:none;
}
.hv2-menu-dock-frame path{fill:#080909;stroke:rgba(236,192,72,.76);stroke-width:1;vector-effect:non-scaling-stroke}
.hv2-menu-dock-btn{
  position:relative;z-index:1;
  align-self:end;
  width:100%;height:64px;min-width:0;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;
  color:#DFA832;
  padding:5px 0 5px;
}
.hv2-menu-dock-icon{position:relative;display:grid;place-items:center;width:28px;height:28px;flex:none}
.hv2-menu-dock-btn .ic{width:26px;height:26px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;filter:drop-shadow(0 0 5px rgba(224,178,60,.16))}
.hv2-menu-dock-label{font-family:var(--display);font-size:clamp(8.5px,2.35vw,10px);font-weight:650;line-height:1;letter-spacing:.01em;color:#C99A30;white-space:nowrap}
.hv2-menu-dock-dot{position:absolute;right:-1px;top:-1px;width:5px;height:5px;border-radius:50%;background:var(--live);box-shadow:0 0 6px rgba(255,77,77,.72)}
.hv2-menu-dock-btn:focus-visible{outline:2px solid rgba(224,178,60,.7);outline-offset:3px;border-radius:14px}
.hv2-menu-dock-mark{
  position:relative;z-index:2;
  width:100%;height:86px;
  display:grid;place-items:center;
  align-self:end;
  padding-bottom:9px;
}
.hv2-menu-dock-mark img{
  width:clamp(48px,13vw,56px);height:clamp(48px,13vw,56px);object-fit:contain;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.8)) drop-shadow(0 0 9px rgba(224,178,60,.34));
}
.tabbar.tabbar-crest{
  left:0;right:0;bottom:0;
  width:min(100%,430px);
  height:calc(86px + env(safe-area-inset-bottom,0px));
  margin:0 auto;
  padding:0 2px env(safe-area-inset-bottom,0px);
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr)) clamp(48px,14vw,60px) repeat(3,minmax(0,1fr));
  align-items:end;
  border:0;border-radius:0;
  background:#050505;
  backdrop-filter:none;-webkit-backdrop-filter:none;
  box-shadow:none;
  overflow:visible;
}
.tabbar.tabbar-crest::before{display:none}
.tabbar-crest .hv2-menu-dock-btn.active{color:#F2C650}
.tabbar-crest .hv2-menu-dock-btn.active .hv2-menu-dock-label{color:#F2C650;text-shadow:0 0 8px rgba(224,178,60,.28)}
/* Native previews become full-bleed on tablets/desktops. Let the premium dock
   use the same readable measure as the standard desktop tab bar instead of
   leaving a phone-width strip floating at half the available width. */
@media (min-width:768px){
  html[data-native="1"] .hv2-menu-dock,
  html[data-native="1"] .tabbar.tabbar-crest{
    width:min(640px,calc(100% - 48px));
  }
}
@media (min-width:1024px){
  html[data-native="1"] .hv2-menu-dock,
  html[data-native="1"] .tabbar.tabbar-crest{
    width:min(700px,calc(100% - 64px));
  }
}
@media (prefers-reduced-motion:reduce){
  .hv2-menu-row{transition:none}
  .hv2-menu-row:active{transform:none}
}
@media (max-width:360px){
  .hv2-brand-composite{width:min(76vw,252px)}.hv2-brand-lockup{margin-top:0}.hv2-brand-lockup::before{width:280px;height:280px}.hv2-welcome{margin-top:16px}
  .hv2-start-card{padding-top:22px}.hv2-start-card .hv2-balance-actions{gap:14px;margin-top:20px}.hv2-start-card .hv2-balance-action{min-height:54px;height:54px;padding-inline:14px;font-size:14px}
  .hv2-menu-hero{min-height:138px;padding-bottom:31px}
  .hv2-menu-title{font-size:32px}
  .hv2-menu-row{min-height:56px;padding:5px 9px;gap:11px}
  .hv2-menu-row::before{left:59px}
  .hv2-menu-icon{width:40px;height:40px}
  .hv2-menu-row b{font-size:14px}
  .hv2-menu-row small{font-size:10px}
}

/* Android native WebView: the iPhone hero is deliberately preserved, but
   shorter Android viewports must be allowed to scroll instead of clipping the
   action row behind the bottom navigation. */
html[data-native-platform="android"] .app.home-v2-active .screen-scroll{
  overflow-y:auto;
  overflow-x:hidden;
  max-height:100dvh;
}
html[data-native-platform="android"] .app.home-v2-active .screen{
  height:auto;
  min-height:100%;
  overflow:visible;
  padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px) + 24px);
}
html[data-native-platform="android"] .app.home-v2-active .home-v2-stage{
  height:auto;
  min-height:100%;
  min-height:100dvh;
  padding-bottom:16px;
}
html[data-native-platform="android"] .app.home-v2-active,
html[data-native-platform="android"] .app.home-v2-active .screen-scroll{
  min-height:100%;
  min-height:100dvh;
}
@media (max-height:720px){
  .hv2-brand-composite{width:min(68vw,clamp(180px,26dvh,236px))}
  .hv2-welcome{margin-top:14px;font-size:15px}
  .hv2-start-title{font-size:clamp(36px,9vw,46px)!important}
  .hv2-start-card{padding-top:22px}
  .hv2-start-card .hv2-balance-actions{gap:14px;margin-top:20px}
  .hv2-start-card .hv2-balance-action{min-height:54px;height:54px}
}
@media (max-height:760px){
  html[data-native-platform="android"] .hv2-brand-lockup{margin-top:2px}
  html[data-native-platform="android"] .hv2-brand-composite{width:min(70vw,clamp(190px,27dvh,250px))}
  html[data-native-platform="android"] .hv2-welcome{margin-top:14px;font-size:14px}
  html[data-native-platform="android"] .hv2-welcome-rule{margin-top:10px}
  html[data-native-platform="android"] .hv2-start-card{padding-top:14px}
  html[data-native-platform="android"] .hv2-start-title{font-size:clamp(38px,10vw,46px)!important}
  html[data-native-platform="android"] .hv2-start-card p{margin-top:8px;font-size:13px}
  html[data-native-platform="android"] .hv2-start-card .hv2-balance-actions{gap:10px;margin-top:16px}
  html[data-native-platform="android"] .hv2-start-card .hv2-balance-action{min-height:52px;padding-inline:10px;font-size:13px}
}

/* live-call schedule timetable */
.sched{margin-top: var(--s3);padding: var(--s1) var(--s1) var(--s2)}
.sch-head{display:flex;align-items:center;justify-content:space-between;padding: var(--s3) var(--s2) var(--s2)}
.sch-count{font-size: var(--fs-tiny);color:var(--muted);font-weight:700}
.sch-row{display:flex;align-items:center;gap: var(--s2);padding: var(--s3) var(--s2);border-top:1px solid var(--line)}
.sch-row.next{background:rgba(var(--gold-rgb),.07);border-radius:12px;border-top-color:transparent}
.sch-day{width:82px;flex:none;font-family:var(--display);font-size: var(--fs-small);font-weight:700;letter-spacing:-.01em}
.sch-time{width:60px;flex:none;font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;color:var(--gold)}
.sch-sess{flex:1;min-width:0}
.sch-sess b{display:block;font-size: var(--fs-small);font-weight:600;line-height:1.2}
.sch-sess small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: 1px}
.sch-tag{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.12em;color:var(--gold);background:rgba(var(--gold-rgb),.14);border:1px solid rgba(var(--gold-rgb),.32);padding: var(--s1) var(--s2);border-radius:999px;flex:none}
.sch-row.off{opacity:.5}
.sch-row.off .sch-time{color:var(--faint)}

.stat-row{display:flex;gap: var(--s2);margin-top: var(--s3)}
.stat{flex:1;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);padding: var(--s3) var(--s3) var(--s3)}
.stat b{font-family:var(--mono);font-size:20px;font-weight:700;display:block}
.stat small{font-size: var(--fs-tiny);color:var(--muted);display:block;margin-top: 2px;letter-spacing:.02em}
.stat .ic{width:18px;height:18px;color:var(--gold);margin-bottom: var(--s2)}

/* live market bar (XAU/USD price + session clock) */
.marketbar{display:flex;align-items:center;overflow:hidden;white-space:nowrap;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);height:42px;margin-top: var(--s3);margin-bottom: var(--s3);padding:0 14px;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 16px),transparent 100%)}
.mb-track{display:inline-flex;align-items:center;flex:none;animation:ticker 26s linear infinite;will-change:transform;padding-left:4px}
.mb-a11y{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.marketbar:hover .mb-track{animation-play-state:paused}
.mb-seg{display:inline-flex;align-items:center;gap: var(--s2);padding: 0 var(--s4)}
.mb-sep{color:var(--faint);font-size:9px}
.mb-sess{font-size: var(--fs-tiny);color:var(--muted);font-weight:600}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.mb-track{animation:none}}
.mb-item{display:flex;align-items:center;gap: var(--s2);min-width:0}
.mb-sym{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;color:var(--muted);letter-spacing:.04em}
.mb-price{font-family:var(--mono);font-size: var(--fs-body);font-weight:700;color:var(--gold)}
.mb-chg{font-size: var(--fs-tiny);font-weight:700}
.mb-session{font-size: var(--fs-tiny);color:var(--muted);font-weight:600;overflow:hidden;white-space:nowrap}
.mb-next{color:var(--faint);font-size: var(--fs-tiny)}
.mb-dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--up);box-shadow:0 0 0 0 rgba(63,191,127,.6);animation:pulse-g 2.2s infinite}
.mb-live{width:6px;height:6px;border-radius:50%;flex:none;background:var(--gold);box-shadow:0 0 0 0 rgba(var(--gold-rgb),.6);animation:pulse-gold 2.2s infinite}
@keyframes pulse-gold{0%{box-shadow:0 0 0 0 rgba(var(--gold-rgb),.55)}70%{box-shadow:0 0 0 6px rgba(var(--gold-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--gold-rgb),0)}}
@keyframes pulse-g{70%{box-shadow:0 0 0 6px rgba(63,191,127,0)}100%{box-shadow:0 0 0 0 rgba(63,191,127,0)}}

/* morning brief — compact 3-page swipe (height locked to the tallest page) */
.brief{padding: var(--s4);margin-top: var(--s3);overflow:hidden}
.brief-head{display:flex;align-items:center;justify-content:space-between;margin-bottom: var(--s2)}
.brief-time{font-size: var(--fs-tiny);color:var(--muted)}
.brief-bias{display:none}
.brief-rail{
  display:flex;align-items:flex-start;gap:0;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  margin:0;padding:0;scrollbar-width:none;
}
.brief-rail::-webkit-scrollbar{display:none}
.brief-slide{
  flex:0 0 100%;min-width:100%;max-width:100%;width:100%;
  scroll-snap-align:start;scroll-snap-stop:always;
  box-sizing:border-box;
  overflow:hidden; /* never bleed words into the next/prev page */
}
.brief-pane-label{
  font-family:var(--mono);font-size:var(--fs-tiny);font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold);margin:0 0 6px;
}
.brief-h{
  font-family:var(--display);font-weight:700;font-size:15px;line-height:1.3;
  margin:0 0 var(--s2);letter-spacing:-.01em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.brief-points{display:flex;flex-direction:column;gap:10px}
.brief-pt{display:flex;gap: var(--s3);align-items:flex-start;position:relative}
button.brief-pt{width:100%;min-height:44px;text-align:left;padding:4px 0;border-radius:8px;cursor:pointer}
.brief-pt[data-act]::after{content:"›";position:absolute;right:0;top:3px;color:var(--faint);font-weight:700;font-size:12px}
.brief-pt[data-act] .bp-tx{padding-right:14px}
.brief-pt[data-act]:active{transform:scale(.985);opacity:.85}
.brief-pt[data-act]:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.bp-ic{width:16px;height:16px;flex:none;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7;margin-top: 1px}
.bp-tx{font-size:12.5px;line-height:1.35;min-width:0}
.bp-tx b{display:block;font-family:var(--display);font-weight:600;font-size:11px;color:var(--gold);margin-bottom:1px;letter-spacing:.01em}
.bp-tx span{
  color:var(--text-2);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.brief-edu{margin:8px 0 0;font-size:10px;color:var(--faint);line-height:1.35}
.brief-pager{
  display:flex;align-items:center;gap:7px;margin-top:10px;min-height:16px;
}
.brief-dot{
  width:6px;height:6px;border-radius:999px;background:var(--line-2);border:0;padding:0;cursor:pointer;
  transition:transform .18s var(--ease-out),background .18s,width .18s;
}
.brief-dot.on{width:14px;background:var(--gold)}
.brief-swipe-hint{
  margin-left:auto;font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.01em;
  transition:opacity .2s ease;white-space:nowrap;
}
.brief-swipe-hint:not(.is-hidden)::after{content:" ›";color:var(--gold)}
.brief-swipe-hint.is-hidden{opacity:0;pointer-events:none}

/* hamburger → Morning brief: a focused gold-desk read, separate from the legacy swipe card */
.morning-brief-sheet{padding-bottom:var(--s2)}
.morning-brief-body{display:flex;flex-direction:column;gap:var(--s3)}
.morning-brief-hero{padding:var(--s4);border:1px solid var(--line-2);border-radius:var(--r-lg);background:linear-gradient(145deg,rgba(var(--gold-rgb),.14),var(--surface-2) 56%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 18px 34px -26px rgba(7,5,2,.8)}
.morning-brief-kicker,.morning-brief-title-row,.morning-brief-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3)}
.morning-brief-kicker{align-items:center;margin-bottom:var(--s3)}
.morning-brief-kicker .eyebrow{display:inline-flex;align-items:center;gap:6px;margin:0;color:var(--gold)}
.morning-brief-kicker .ic{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8}
.morning-brief-date,.morning-brief-source{font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:var(--muted);white-space:nowrap}
.morning-brief-title-row{align-items:flex-start}
.morning-brief-title-row h3{font-family:var(--display);font-size:22px;line-height:1.16;letter-spacing:-.025em;margin:0;max-width:78%}
.morning-brief-status,.morning-brief-impact{display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(var(--gold-rgb),.3);border-radius:999px;padding:4px 8px;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.morning-brief-status.status-firm{color:var(--up);border-color:rgba(63,191,127,.28);background:rgba(63,191,127,.1)}
.morning-brief-status.status-soft{color:var(--down);border-color:rgba(240,86,91,.28);background:rgba(240,86,91,.1)}
.morning-brief-status.status-balanced,.morning-brief-status.status-loading{color:var(--gold);background:rgba(var(--gold-rgb),.1)}
.morning-brief-read{color:var(--text-2);font-size:12.5px;line-height:1.48;margin:var(--s3) 0 0;max-width:58ch}
.morning-brief-snapshot{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:var(--s4)}
.morning-brief-stat{display:flex;flex-direction:column;min-width:0;padding:12px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-3)}
.morning-brief-stat>span{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.morning-brief-stat strong{overflow:hidden;margin-top:5px;font-family:var(--display);font-size:17px;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}
.morning-brief-stat small{overflow:hidden;margin-top:4px;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.morning-brief-section{padding:var(--s4);border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--surface-2)}
.morning-brief-section-head{align-items:flex-end;margin-bottom:var(--s3)}
.morning-brief-overline{display:block;margin-bottom:3px;color:var(--gold);font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.morning-brief-section h4{font-family:var(--display);font-size:16px;line-height:1.2;margin:0;letter-spacing:-.01em}
.morning-brief-events{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.morning-brief-event{display:grid;grid-template-columns:70px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.morning-brief-event-time{display:flex;flex-direction:column;gap:2px}
.morning-brief-event-time b{font-size:11px;font-weight:650}
.morning-brief-event-time span,.morning-brief-event-copy span{font-family:var(--mono);font-size:9px;color:var(--muted)}
.morning-brief-event-copy{display:flex;min-width:0;flex-direction:column;gap:3px}
.morning-brief-event-copy b{overflow:hidden;font-size:12px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.morning-brief-impact{padding:3px 6px;font-size:8px;color:var(--muted);border-color:var(--line-2);background:var(--surface-3)}
.morning-brief-impact.impact-high{color:var(--gold);border-color:rgba(var(--gold-rgb),.32);background:rgba(var(--gold-rgb),.1)}
.morning-brief-empty{padding:13px 0;color:var(--muted);font-size:12px;line-height:1.45}
.morning-brief-link{display:inline-flex;align-items:center;gap:6px;margin-top:12px;padding:0;border:0;background:transparent;color:var(--gold);font-size:11px;font-weight:700;cursor:pointer}
.morning-brief-link .ic{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8}
.morning-brief-link:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:4px;border-radius:4px}
.morning-brief-checks{display:flex;flex-direction:column;gap:12px}
.morning-brief-checks>div{display:flex;align-items:flex-start;gap:10px}
.morning-brief-checks>.ic,.morning-brief-checks>div>.ic{width:17px;height:17px;flex:none;margin-top:1px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7}
.morning-brief-checks p{display:flex;min-width:0;flex-direction:column;gap:2px;margin:0}
.morning-brief-checks b{font-size:12px;font-weight:650}
.morning-brief-checks span{color:var(--muted);font-size:11px;line-height:1.4}
.morning-brief-disclaimer,.morning-brief-updated{color:var(--faint);font-size:10px;line-height:1.4;text-align:center}
.morning-brief-disclaimer{margin:0}
.morning-brief-updated{margin:var(--s3) 0 0}
@media (max-width:360px){
  .morning-brief-hero,.morning-brief-section{padding:var(--s3)}
  .morning-brief-title-row h3{font-size:20px}
  .morning-brief-event{grid-template-columns:62px minmax(0,1fr) auto;gap:7px}
  .morning-brief-source{font-size:9px}
}
@media (prefers-reduced-motion:reduce){
  .morning-brief-link:active{transform:none}
}

/* idea card (broker ticket) */
.idea{padding: var(--s4) var(--s4) var(--s3)}
.idea-top{display:flex;align-items:center;justify-content:space-between;margin-bottom: var(--s3)}
.idea-pair{display:flex;align-items:center;gap: var(--s2)}
.idea-pair .sym{font-family:var(--display);font-weight:800;font-size: var(--fs-h2)}
.idea-dir{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;padding: var(--s1) var(--s2);border-radius:6px;letter-spacing:.06em}
.idea-dir.long{background:rgba(63,191,127,.15);color:var(--up)}
.idea-dir.short{background:rgba(240,86,91,.15);color:var(--down)}
.ticket{display:grid;grid-template-columns:repeat(3,1fr);gap: 1px;background:var(--line);border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.ticket .cell{background:var(--surface-3);padding: var(--s2) var(--s3)}
.ticket .cell small{font-size: var(--fs-tiny);color:var(--muted);letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom: var(--s1)}
.ticket .cell b{font-family:var(--mono);font-size: var(--fs-h3);font-weight:600}
.ticket .cell.tp b{color:var(--up)} .ticket .cell.sl b{color:var(--down)}
/* authentic BT VIP signal post (Telegram "Personal Trade Idea" format) */
.sigpost{margin-top: var(--s4);background-color:var(--surface-2);background-image:var(--grain);border:1px solid var(--line-2);border-radius:var(--r-lg);padding: var(--s4);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(0,0,0,.28)}
.sp-top{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-bottom: var(--s2);flex-wrap:wrap}
.sp-head{font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:-.01em;display:inline-flex;align-items:center;gap: var(--s1)}
.sp-head.buy{color:var(--up)}
.sp-head.sell{color:var(--down)}
.sp-gold{color:var(--muted);font-weight:600;font-size: var(--fs-small)}
.sp-sub{font-size: var(--fs-small);color:var(--muted);font-style:italic;margin-bottom: var(--s3);line-height:1.45}
.sp-grid{display:flex;gap: var(--s2);margin-bottom: var(--s3)}
.sp-row{flex:1;min-width:0;background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:12px;padding: var(--s2) var(--s3);display:flex;flex-direction:column;gap: var(--s1)}
.sp-row>span{font-size: var(--fs-tiny);text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}
.sp-row b{font-family:var(--mono);font-size: var(--fs-h2);font-weight:700}
.sp-row b.sl{color:var(--down)}
.sp-tps{background:rgba(0,0,0,.28);border:1px solid var(--line);border-radius:14px;padding: var(--s3) var(--s3) var(--s1)}
.sp-tps-h{font-weight:700;font-size: var(--fs-small);margin-bottom: var(--s1);color:var(--gold-hi);letter-spacing:-.01em}
.sp-tp{display:flex;align-items:center;justify-content:space-between;padding: var(--s2) 0;border-bottom:1px solid var(--line)}
.sp-tp:last-child{border-bottom:0}
.sp-tp>span{font-size: var(--fs-small);color:var(--muted);font-weight:600}
.sp-tp b{font-family:var(--mono);font-size: var(--fs-body);font-weight:700}
.sp-tp.be{border-bottom:1px dashed var(--gold-line)}
.sp-tp.be>span,.sp-tp.be b{color:var(--gold)}
.sp-updates{margin-top: var(--s3);border-top:1px solid var(--line);padding-top: var(--s3)}
.sp-up-h{font-size: var(--fs-tiny);text-transform:uppercase;letter-spacing:.09em;color:var(--muted);display:flex;align-items:center;gap: var(--s1);margin-bottom: var(--s2)}
.sp-up{font-size: var(--fs-small);color:var(--text);padding: var(--s2) var(--s3);background:rgba(var(--gold-rgb),.08);border:1px solid var(--gold-line);border-radius:10px;margin-bottom: var(--s2);width:fit-content;max-width:100%}
.sp-up:last-child{margin-bottom: 0}
.idea-foot{display:flex;align-items:center;justify-content:space-between;margin-top: var(--s3)}
.rr{font-family:var(--mono);font-size: var(--fs-small);color:var(--muted)}
.rr b{color:var(--gold)}

/* trader of week mini */
.totw{position:relative;overflow:hidden;display:flex;gap: var(--s3);align-items:center;padding: var(--s4);
  background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--line-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 14px 36px -22px rgba(0,0,0,.7)}
.totw .trophy{display:grid;place-items:center;filter:drop-shadow(0 3px 9px rgba(var(--gold-rgb),.3))}
.totw .trophy svg{width:25px;height:25px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.5}
.totw .meta small{display:block;font-size: var(--fs-tiny)}
.totw .meta b{font-family:var(--display);font-size:16px}


.totw-winner-chip{display:inline-block;margin-top:4px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.totw-has-graphic{display:block;padding:0;overflow:hidden}
.totw-graphic{display:block;width:100%;aspect-ratio:1/1;max-height:min(72vw,340px);background:var(--surface-3);overflow:hidden}
.totw-graphic img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.totw.totw-img-failed .totw-graphic{display:none}
.totw-graphic-meta{padding:var(--s3) var(--s4) var(--s4)}
.totw-graphic-meta .eyebrow{display:block}
.totw-graphic-meta b.gold-text{display:block;font-family:var(--display);font-size:16px;margin-top:2px}
.totw-blurb{font-size:12px;margin-top:6px;line-height:1.45}
.totw-big-graphic .totw-big-graphic-wrap{
  position:relative;margin:var(--s3) auto var(--s3);width:100%;max-width:340px;border-radius:var(--r-lg);
  overflow:hidden;border:1px solid var(--gold-line);aspect-ratio:1/1;background:var(--surface-3);
  cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.totw-big-graphic .totw-big-graphic-wrap:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.totw-big-graphic .totw-big-graphic-wrap .tc-media-view-label{z-index:1}
.totw-big-graphic-img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;pointer-events:none}
.totw-big-graphic .av{display:none}

.totw-reasons{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px;text-align:left}
.totw-reasons li{display:flex;gap:10px;align-items:flex-start}
.totw-reasons .totw-r-ic,.totw-reasons svg{width:18px;height:18px;flex:none;color:var(--gold);margin-top:2px}
.totw-reasons b{display:block;font-family:var(--display);font-size:13px;color:var(--gold);font-weight:700}
.totw-reasons small{display:block;margin-top:2px;font-size:12px;line-height:1.45;color:var(--muted)}
.totw .totw-reasons{margin-top:8px}
.totw .totw-reasons li{gap:8px}
.totw .totw-reasons b{font-size:12px}
.totw .totw-reasons small{font-size:11px}
.totw-big .totw-reasons{margin:16px auto 0;max-width:340px}
.totw-team-msg{margin:16px 12px 0;font-family:var(--display);font-weight:700;font-size:14px;line-height:1.45;color:var(--text);font-style:normal}
.totw-slogan{margin:14px 0 0;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}

/* horizontal rail */
.rail{display:flex;gap: var(--s3);overflow-x:auto;scrollbar-width:none;padding: 2px var(--gutter) 2px 0;margin: 0 calc(var(--gutter)*-1);scroll-snap-type:x mandatory}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start;flex:none}
.rail-pad{padding-left: var(--s4)}

/* =========================================================
   LIVE
   ========================================================= */
#live-stage{position:relative;background:#000;border-radius:18px;overflow:hidden;margin: 0 -2px;height:236px}
#live-canvas{position:absolute;inset:0;width:100%;height:100%}
/* live lobby (between calls) */
#live-lobby{position:relative;margin: 0 calc(var(--gutter)*-1);border-radius:0 0 26px 26px;overflow:hidden;min-height:340px;display:grid;place-items:center;background:radial-gradient(120% 90% at 50% 0,#14161d,#0a0b0f);border-bottom:1px solid var(--line-2)}
#live-lobby .market-bg{position:absolute;inset:0;width:100%;height:100%;opacity:.45;-webkit-mask-image:linear-gradient(to bottom,#000 34%,transparent 88%);mask-image:linear-gradient(to bottom,#000 34%,transparent 88%)}
.lobby-inner{position:relative;z-index:1;text-align:center;padding: var(--s6) var(--s5)}
.lobby-title{font-family:var(--display);font-weight:800;font-size:25px;margin: var(--s3) 0 var(--s1)}
.lobby-host{font-size: var(--fs-small);color:var(--muted);margin-bottom: var(--s4)}
.lobby-cd{display:flex;justify-content:center;gap: var(--s2);margin-bottom: var(--s5)}
/* countdown digits sit in RECESSED wells (Apple-timer feel): dark inner shadow + bottom edge-light */
.cd-cell{background:var(--surface-2);background-image:var(--grain);border:1px solid var(--line);border-radius:13px;padding: var(--s2) var(--s3);min-width:56px;text-align:center;box-shadow:inset 0 2px 7px rgba(0,0,0,.42),inset 0 -1px 0 rgba(255,255,255,.07)}
[data-theme="light"] .cd-cell{box-shadow:inset 0 2px 6px rgba(22,20,14,.14),inset 0 -1px 0 rgba(255,255,255,.8)}
.cd-cell b{font-family:var(--mono);font-size:23px;font-weight:700;display:block;line-height:1;color:var(--gold)}
.cd-cell small{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-top: var(--s1);display:block}
.lobby-actions{display:flex;flex-wrap:wrap;gap: var(--s2)}
.lobby-actions .btn{flex:1 1 calc(50% - 5px);min-width:0;height:46px;padding: 0 var(--s3);font-size: var(--fs-small);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lobby-actions .btn[data-act="remind-call"]{flex-basis:100%}
.lobby-actions .live-join-btn{flex:1 1 100%}

/* Reusable Live Zoom join CTAs (templates by call type) */
.live-join-btn{
  display:flex;align-items:center;gap:var(--s3);
  width:100%;min-height:52px;padding:10px 14px;
  border-radius:14px;border:1px solid var(--gold-line);
  background:
    radial-gradient(120% 140% at 0% 0%,rgba(var(--gold-rgb),.28),transparent 55%),
    linear-gradient(135deg,rgba(var(--gold-rgb),.18),rgba(var(--gold-rgb),.06));
  color:var(--text);text-align:left;cursor:pointer;
  box-shadow:0 8px 22px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .14s var(--ease-spring,cubic-bezier(.2,.7,.2,1)),filter .14s ease;
}
.live-join-btn:hover{filter:brightness(1.06)}
.live-join-btn:active{transform:scale(.985)}
.live-join-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.live-join-ico{
  width:36px;height:36px;border-radius:11px;flex:none;
  display:grid;place-items:center;
  background:rgba(var(--gold-rgb),.18);border:1px solid var(--gold-line);color:var(--gold);
}
.live-join-ico svg{width:18px;height:18px}
.live-join-copy{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.live-join-copy b{
  font-family:var(--display);font-size:var(--fs-h4);font-weight:800;letter-spacing:-.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.live-join-copy small{font-size:var(--fs-tiny);color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
.live-join-go{flex:none;opacity:.7;color:var(--gold)}
.live-join-go svg{width:16px;height:16px}
.live-join-sm{min-height:44px;padding:8px 12px;border-radius:12px}
.live-join-sm .live-join-ico{width:30px;height:30px;border-radius:9px}
.live-join-compact .live-join-copy small{display:none}
.live-join-education,.live-join-default{/* gold default */}
.live-join-training{
  border-color:rgba(var(--gold-rgb),.45);
  background:radial-gradient(120% 140% at 100% 0%,rgba(var(--gold-rgb),.22),transparent 50%),linear-gradient(135deg,rgba(var(--gold-rgb),.2),rgba(0,0,0,.08));
}
.live-join-onboarding{
  border-color:rgba(99,162,255,.4);
  background:radial-gradient(120% 140% at 0% 0%,rgba(99,162,255,.22),transparent 55%),linear-gradient(135deg,rgba(99,162,255,.14),rgba(var(--gold-rgb),.06));
}
.live-join-onboarding .live-join-ico{background:rgba(99,162,255,.16);border-color:rgba(99,162,255,.35);color:#8eb7ff}
.live-join-onboarding .live-join-go{color:#8eb7ff}
.live-join-chart-analysis{
  border-color:var(--line-2);
  background:radial-gradient(120% 140% at 0% 0%,rgba(255,255,255,.08),transparent 55%),var(--surface-3);
}
.live-join-mindset{
  border-color:rgba(240,86,91,.35);
  background:radial-gradient(120% 140% at 0% 0%,rgba(240,86,91,.18),transparent 55%),linear-gradient(135deg,rgba(240,86,91,.1),rgba(var(--gold-rgb),.05));
}
.live-join-mindset .live-join-ico{background:rgba(240,86,91,.12);border-color:rgba(240,86,91,.32);color:var(--down)}
.live-join-mindset .live-join-go{color:var(--down)}
.live-join-live-trading{
  border-color:rgba(63,191,127,.4);
  background:radial-gradient(120% 140% at 0% 0%,rgba(63,191,127,.18),transparent 55%),linear-gradient(135deg,rgba(63,191,127,.1),rgba(var(--gold-rgb),.06));
}
.cr-join{
  width:36px;height:36px;flex:none;border-radius:10px;border:1px solid var(--gold-line);
  background:rgba(var(--gold-rgb),.12);color:var(--gold);
  display:grid;place-items:center;cursor:pointer;
  transition:transform .12s var(--ease-spring,cubic-bezier(.2,.7,.2,1));
}
.cr-join svg{width:16px;height:16px}
.cr-join:active{transform:scale(.92)}
.cr-join:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
[data-theme="light"] .live-join-btn{box-shadow:0 6px 16px rgba(22,20,14,.1),inset 0 1px 0 rgba(255,255,255,.7)}

.live-exit{position:absolute;top:14px;right:14px;z-index:4;background:rgba(0,0,0,.55);border:1px solid var(--line-2);color:#fff;font-size: var(--fs-tiny);font-weight:600;border-radius:999px;padding: var(--s1) var(--s3);backdrop-filter:blur(8px)}
.live-grad{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 22%,transparent 55%,rgba(4,4,6,.92))}
.live-hud{position:absolute;left:14px;right:14px;top:14px;display:flex;align-items:center;justify-content:space-between;z-index:3}
.live-watchers{display:flex;align-items:center;gap: var(--s2);background:rgba(0,0,0,.5);backdrop-filter:blur(8px);padding: var(--s1) var(--s3);border-radius:var(--r-full);border:1px solid var(--line);font-family:var(--mono);font-size: var(--fs-small);font-weight:600}
.live-host{position:absolute;left:14px;top:52px;z-index:3;display:flex;align-items:center;gap: var(--s2);background:rgba(0,0,0,.42);backdrop-filter:blur(10px);padding: var(--s2) var(--s3) var(--s2) var(--s2);border-radius:var(--r-full);border:1px solid var(--line)}
.live-host b{font-family:var(--display);font-size: var(--fs-h4);font-weight:700}
.live-host small{display:block;font-size: var(--fs-tiny);color:var(--gold)}
.live-levels{position:absolute;right:14px;top:60px;z-index:3;display:flex;flex-direction:column;gap: var(--s1);align-items:flex-end}
.lvl{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:600;padding: var(--s1) var(--s2);border-radius:7px;background:rgba(0,0,0,.5);backdrop-filter:blur(6px);border:1px solid var(--line)}
.lvl.tp{color:var(--up);border-color:rgba(63,191,127,.4)} .lvl.sl{color:var(--down);border-color:rgba(240,86,91,.4)} .lvl.e{color:var(--gold);border-color:rgba(var(--gold-rgb),.4)}
.mark-chip{position:absolute;left:14px;bottom:12px;z-index:4;display:flex;align-items:center;gap: var(--s2);background:rgba(0,0,0,.55);backdrop-filter:blur(12px);border:1px solid rgba(var(--gold-rgb),.35);border-radius:var(--r-full);padding: var(--s2) var(--s3);font-size: var(--fs-tiny);color:#EDEDE8;opacity:0;transform:translateY(8px) scale(.94);transition:opacity .3s ease,transform .34s cubic-bezier(.34,1.4,.44,1);pointer-events:none;max-width:calc(100% - 28px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mark-chip .ic{width:13px;height:13px;color:var(--gold);flex:none}
.mark-chip b{color:var(--gold-hi);font-weight:600}
.mark-chip.show{opacity:1;transform:none}

/* chat */
.live-chat{position:absolute;left:0;right:0;bottom:74px;z-index:3;height:208px;
  -webkit-mask-image:linear-gradient(to top,#000 72%,transparent);mask-image:linear-gradient(to top,#000 72%,transparent);
  overflow:hidden;padding: 0 var(--s3)}
.live-chat-inner{position:absolute;bottom:0;left:14px;right:14px;display:flex;flex-direction:column;gap: var(--s2)}
.chat-msg{display:flex;gap: var(--s2);align-items:flex-start;animation:chatIn .4s cubic-bezier(.2,.8,.2,1) both}
@keyframes chatIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.chat-msg .ct{font-size: var(--fs-small);line-height:1.35;color:var(--text-2)}
.chat-msg .ct b{font-weight:700;color:var(--gold);margin-right: var(--s1);font-size: var(--fs-tiny)}
.chat-msg.host .ct b{color:var(--gold-hi)}
.chat-msg.host{background:rgba(var(--gold-rgb),.08);border:1px solid rgba(var(--gold-rgb),.18);padding: var(--s2) var(--s2);border-radius:12px}

.live-compose{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;gap: var(--s2);align-items:center;
  padding: var(--s3) var(--s3) calc(14px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--ink) 70%,transparent)}
.live-input{flex:1;height:44px;border-radius:var(--r-full);background:var(--surface-2);border:1px solid var(--line-2);padding: 0 var(--s4);display:flex;align-items:center;color:var(--muted);font-size: var(--fs-h4)}
.react-btn{width:44px;height:44px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line-2);display:grid;place-items:center;font-size:19px}
/* live chat panel — below the chart, no overlap (kills the flicker) */
.live-chatbox{margin-top: var(--s3)}
.live-chat2{max-height:230px;overflow-y:auto;scrollbar-width:none;display:flex;flex-direction:column;gap: var(--s2);padding: 2px 2px 0}
.live-chat2::-webkit-scrollbar{display:none}
.live-chat2 .chat-msg{display:flex;gap: var(--s2);align-items:flex-start;animation:chatIn .35s cubic-bezier(.2,.8,.2,1) both}
.live-chat2 .chat-msg .ct{background:var(--surface-2);border:1px solid var(--line);border-radius:4px 13px 13px 13px;padding: var(--s2) var(--s3);font-size: var(--fs-small);line-height:1.4;color:var(--text-2)}
.live-chat2 .chat-msg .ct b{display:block;font-size: var(--fs-tiny);color:var(--muted);margin: 0 0 2px}
.live-chat2 .chat-msg.host .ct{background:rgba(var(--gold-rgb),.1);border-color:var(--gold-line)}
.live-chat2 .chat-msg.host .ct b{color:var(--gold)}
.live-compose2{display:flex;gap: var(--s2);align-items:center;margin-top: var(--s3)}
.react-fly{position:absolute;z-index:6;font-size:24px;pointer-events:none;animation:fly 2.4s ease-out forwards}
@keyframes fly{0%{opacity:0;transform:translateY(0) scale(.6)}12%{opacity:1}80%{opacity:.9}100%{opacity:0;transform:translateY(-180px) scale(1.25) rotate(var(--rot,8deg))}}

/* =========================================================
   LEARN
   ========================================================= */
.learn-hero{position:relative;height:204px;border-radius:var(--r-xl);overflow:hidden;margin-top: var(--s3);border:1px solid var(--line)}
.learn-hero .thumb{position:absolute;inset:0}
.learn-hero .g{position:absolute;inset:0;background:linear-gradient(to top,rgba(4,4,6,.97),rgba(4,4,6,.55) 42%,rgba(4,4,6,.12) 68%,rgba(0,0,0,.3))}
.learn-hero .body{position:absolute;left:16px;right:16px;bottom:15px;z-index:2;color:#F3F3F1}
.learn-hero .body .h2{color:#F5F5F2;text-shadow:0 2px 12px rgba(0,0,0,.6)}
.learn-hero .body .sub,.learn-hero .vmeta{color:rgba(243,243,241,.78)}
/* Frosted liquid-glass play — corner chip so thumb titles stay readable */
.learn-hero .play{
  position:absolute;left:12px;bottom:12px;width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;z-index:2;
  background:linear-gradient(155deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.08) 42%,rgba(255,255,255,.04) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(1.8);
  backdrop-filter:blur(18px) saturate(1.8);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(255,255,255,.08),
    0 4px 14px rgba(0,0,0,.28);
}
.learn-hero .play svg{width:11px;height:11px;fill:rgba(255,255,255,.95);margin-left: 1px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}

.chips{display:flex;gap: var(--s2);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;margin:calc(var(--s4) - 5px) calc(var(--gutter)*-1) calc(var(--s1) - 5px);padding:5px var(--gutter);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 18px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 18px),transparent 100%)}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;min-height:44px;height:44px;padding: 0 var(--s4);border-radius:var(--r-full);background:var(--surface-2);border:1px solid var(--line);font-size: var(--fs-small);font-weight:600;color:var(--muted);display:flex;align-items:center}
.chip.active{background:rgba(var(--gold-rgb),.16);color:var(--gold);border:1px solid rgba(var(--gold-rgb),.32);font-weight:700;box-shadow:inset 0 1px 0 rgba(246,227,172,.12)}

.vcard{width:230px}
.vcard .thumb{position:relative;height:130px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line)}
.vcard .thumb canvas,.vcard .thumb .pic{position:absolute;inset:0;width:100%;height:100%}
/* real video thumbnails (image instead of canvas chart) */
.thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:var(--surface-3)}
.thumb-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.5),transparent 52%);pointer-events:none}
.learn-hero .hero-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--surface-3)}
.vcard .dur{position:absolute;right:8px;bottom:8px;font-family:var(--mono);font-size: var(--fs-tiny);background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding: var(--s1) var(--s2);border-radius:6px;z-index:2;border:1px solid rgba(255,255,255,.12)}
.vcard .prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.15);z-index:2}
.vcard .prog i{display:block;height:100%;background:var(--gold)}
/* Liquid-glass play chip — bottom-left, not centred over title art */
.vcard .play-mini{
  position:absolute;left:8px;bottom:8px;right:auto;top:auto;width:auto;height:auto;
  display:grid;place-items:center;z-index:2;pointer-events:none;
}
.vcard .play-mini span{
  width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(155deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.08) 42%,rgba(255,255,255,.04) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(1.8);
  backdrop-filter:blur(18px) saturate(1.8);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(255,255,255,.08),
    0 4px 12px rgba(0,0,0,.28);
}
.vcard .play-mini svg{width:11px;height:11px;fill:rgba(255,255,255,.95);margin-left: 1px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
.vcard h4{font-family:var(--display);font-size: var(--fs-body);font-weight:600;margin: var(--s2) 0 var(--s1);line-height:1.25}
.vcard .vmeta{font-size: var(--fs-tiny);color:var(--muted);display:flex;gap: var(--s2);align-items:center;flex-wrap:wrap}
.vcard-tag{font-size: var(--fs-tiny);font-weight:600;color:var(--faint);letter-spacing:.02em}
.vcard-soon{position:absolute;left:8px;top:8px;font-size: var(--fs-tiny);font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:rgba(0,0,0,.72);color:var(--gold);padding: var(--s1) var(--s2);border-radius:6px;z-index:3}
.vcard-listed{position:absolute;right:8px;top:8px;font-size: var(--fs-tiny);font-weight:700;color:var(--gold);text-shadow:0 1px 6px rgba(0,0,0,.85);z-index:3;pointer-events:none}
.vcard-pending .play-mini{opacity:.55}
.learn-row{margin-bottom: var(--s1)}
.learn-lib-head{margin-top: var(--s1)}
.office-ann{padding: var(--s1) var(--s4) 12px!important}
.office-ann-row{display:flex;gap: var(--s3);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.office-ann-row:last-child{border-bottom:none;padding-bottom: var(--s1)}
.office-ann-av{flex:none}
.office-ann-body{flex:1;min-width:0}
.office-ann-body p{margin: 0}

.vrow{display:flex;gap: var(--s3);align-items:center;padding:12px 0;border-bottom:1px solid var(--line);background:transparent}
.vrow .thumb{width:108px;height:64px;border-radius:10px;overflow:hidden;position:relative;flex:none;border:1px solid var(--line)}
.vrow .info{flex:1;min-width:0}
.vrow h4{font-family:var(--display);font-size: var(--fs-h4);font-weight:600;line-height:1.3;margin-bottom: var(--s1)}
.vrow .vmeta{font-size: var(--fs-tiny);color:var(--muted)}

/* player modal */
.modal-cinema{background:rgba(0,0,0,.92);backdrop-filter:blur(10px);justify-content:center}
.modal-cinema .sheet{border-radius:20px;max-height:96%;padding-bottom: calc(24px + env(safe-area-inset-bottom));margin: var(--s3);max-width:720px;width:calc(100% - 24px);align-self:center}
html[data-native="1"] .modal-cinema .sheet,html[data-native="1"] .modal-video .sheet{
  max-height:min(92dvh,calc(100% - 24px));
  padding-bottom: calc(18px + env(safe-area-inset-bottom,0px));
  margin-bottom: max(8px,env(safe-area-inset-bottom,0px));
}
html[data-native="1"] .modal-cinema .edu-actions,html[data-native="1"] .modal-video .edu-actions{
  margin: var(--s2) 0 var(--s1);
}
html[data-native="1"] .modal-cinema .edu-hint,html[data-native="1"] .modal-video .edu-hint{display:none}
html[data-native="1"] .modal-cinema .sheet .sub[style*="font-size: var(--fs-tiny)"],html[data-native="1"] .modal-video .sheet .sub[style*="font-size: var(--fs-tiny)"]{display:none}
.sheet-cinema{padding-top: var(--s3)}
.edu-stage{position:relative;border-radius:var(--r-md);overflow:hidden;height:min(80vw,384px);background:#000;border:1px solid var(--line);touch-action:manipulation}
/* BTPlayer v2: 16:9 frame — fixed 384px height stacked centre transport on the seek bar */
.edu-stage.vp-stage{height:auto;width:100%;aspect-ratio:16/9;max-height:min(68vh,460px)}
.edu-stage:fullscreen,.edu-stage:-webkit-full-screen{height:100%;width:100%;border-radius:0;border:none;max-height:none}
.edu-stage:fullscreen .player-video,.edu-stage:-webkit-full-screen .player-video{object-fit:contain}
.edu-resume{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap: var(--s3);padding: var(--s5);text-align:center;background:rgba(4,4,6,.78);backdrop-filter:blur(8px)}
.edu-resume[hidden]{display:none!important}
.edu-resume-actions{display:flex;gap: var(--s2);flex-wrap:wrap;justify-content:center}
.edu-big-play-center{position:absolute;inset:0;display:grid;place-items:center;z-index:2;pointer-events:none}
.edu-big-play-center span{pointer-events:auto;width:64px;height:64px;border-radius:50%;background:rgba(var(--gold-rgb),.92);display:grid;place-items:center;box-shadow:var(--glow-gold)}
.edu-big-play-center svg{width:26px;height:26px;fill:var(--on-accent);margin-left: var(--s1)}
.edu-stage.edu-show-controls .edu-controls{opacity:1;transform:none;pointer-events:auto}
.edu-stage:not(.edu-show-controls) .edu-controls{opacity:0;transform:translateY(6px);pointer-events:none}
.edu-controls{position:absolute;left:0;right:0;bottom:0;z-index:3;padding: var(--s2) var(--s3) var(--s3);background:linear-gradient(to top,rgba(0,0,0,.88),transparent);transition:opacity .22s ease,transform .22s ease}
.edu-scrub{position:relative;height:20px;display:flex;align-items:center;margin-bottom: var(--s1)}
.edu-buffer,.edu-played{position:absolute;left:0;top:50%;transform:translateY(-50%);height:4px;border-radius:3px;pointer-events:none}
.edu-buffer{width:0;background:rgba(255,255,255,.25)}
.edu-played{width:100%;right:0}
.edu-played i{display:block;height:100%;width:0;background:var(--gold);border-radius:3px}
.edu-seek{position:relative;width:100%;margin: 0;height:20px;opacity:0;cursor:pointer;z-index:2}
.edu-row{display:flex;align-items:center;gap: var(--s2);flex-wrap:wrap;font-family:var(--mono);font-size: var(--fs-tiny);color:var(--text)}
.edu-icon{width:36px;height:36px;border:none;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;color:var(--text);flex:none}
.edu-icon svg{width:18px;height:18px;fill:currentColor}
.edu-skip{border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.35);color:var(--text);font-size: var(--fs-tiny);font-weight:700;padding: var(--s1) var(--s2);border-radius:8px;flex:none}
.edu-pill{border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.4);color:var(--text);font-size: var(--fs-tiny);font-weight:600;padding: var(--s1) var(--s2);border-radius:999px;flex:none}
.edu-time{font-variant-numeric:tabular-nums;min-width:88px}
.edu-time-sep{opacity:.45;margin: 0 var(--s1)}
.edu-spacer{flex:1;min-width:4px}
.edu-hint{font-size: var(--fs-tiny);text-align:center;color:var(--faint);margin-top: var(--s2);letter-spacing:.02em}
@media (hover:none),(pointer:coarse){.edu-hint{display:none}}
.vcard .thumb-img{object-fit:cover}
.modal{position:absolute;inset:0;z-index:80;background:rgba(2,2,4,.7);backdrop-filter:blur(6px);display:flex;flex-direction:column;justify-content:flex-end;
  opacity:0;pointer-events:none;transition:opacity var(--dur-fade,.16s) var(--ease-out,cubic-bezier(.16,1,.3,1))}
.modal.open{opacity:1;pointer-events:auto}
/* Cinema / lesson sheets must sit above the tab bar (z-index 90) so actions aren't trapped under Home/Learn */
.modal.open.modal-cinema,.modal.open.modal-video{z-index:100}
.sheet{background:var(--surface);border-radius:26px 26px 0 0;border-top:1px solid var(--line-2);padding: var(--s2) var(--s4) calc(98px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform var(--dur-sheet,.26s) var(--ease-out,cubic-bezier(.16,1,.3,1));max-height:90%;overflow-y:auto;scrollbar-width:none}
.sheet::-webkit-scrollbar{display:none}
.modal.open .sheet{transform:none}
.sheet-grab{display:block;width:100%;height:30px;border:none;background:none;cursor:pointer;position:relative;margin-bottom: var(--s1)}
.sheet-grab::before{content:"";position:absolute;top:11px;left:50%;transform:translateX(-50%);width:40px;height:4px;border-radius:4px;background:var(--line-2);transition:background .2s}
.sheet-grab:active::before{background:var(--gold)}

/* ===== added features ===== */
.sheet-title{font-family:var(--display);font-size:20px;font-weight:700;letter-spacing:-.02em;margin: 2px 0 var(--s1)}
.sheet-sub{font-size: var(--fs-small);color:var(--muted);margin-bottom: var(--s3);line-height:1.5}
/* toggle switch */
.tgl{width:46px;height:28px;border-radius:999px;background:var(--surface-3);border:1px solid var(--line-2);position:relative;flex:none;transition:background .25s,border-color .25s}
.tgl>span{display:none}
.tgl::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#e6e6ea;transition:transform .25s var(--ease-spring)}
.tgl.on{background:rgba(var(--gold-rgb),.45);border-color:var(--gold)}
.tgl.on::after{transform:translateX(18px);background:#fff}
/* home tools row */
.tools-row{display:flex;gap: var(--s2);margin-top: var(--s4)}
.tool-tile{flex:1;display:flex;flex-direction:column;align-items:center;gap: var(--s2);padding: var(--s3) var(--s1);border-radius:var(--r-md);background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.1);transition:transform .15s}
.tool-tile svg{width:22px;height:22px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7}
.tool-tile span{font-size: var(--fs-tiny);font-weight:600;color:var(--muted)}
.tool-tile:active{transform:scale(.95)}
/* calculator */
.calc-2{display:flex;gap: var(--s2)}.calc-2>div{flex:1}
.calc-card{margin-top: var(--s4);background:var(--surface-2);border:1px solid var(--line-2);border-radius:var(--r-md);padding: var(--s1) var(--s3)}
.cc-row{display:flex;align-items:center;justify-content:space-between;padding: var(--s3) 0;border-bottom:1px solid var(--line);font-size: var(--fs-small);color:var(--muted)}
.cc-row:last-child{border-bottom:none}.cc-row b{font-size: var(--fs-h3);color:var(--text)}.cc-row.big b{font-size:21px}
.calc-note{display:flex;align-items:center;gap: var(--s2);font-size: var(--fs-tiny);color:var(--faint);margin-top: var(--s3)}.calc-note .ic{width:14px;height:14px;color:var(--gold)}
/* economic calendar */
.cal-day{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin: var(--s3) 2px var(--s2)}
.cal-row{display:flex;align-items:center;gap: var(--s2);padding: var(--s3) var(--s3);border-radius:12px;background:var(--surface-2);border:1px solid var(--line);margin-bottom: var(--s2)}
.cal-time{font-size: var(--fs-small);font-weight:700;width:42px;flex:none}
.cal-cur{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;color:var(--muted);width:30px;flex:none}
.cal-ev{flex:1;font-size: var(--fs-small);min-width:0}
.cal-imp{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding: var(--s1) var(--s2);border-radius:6px;flex:none}
.cal-imp.imp-high{background:rgba(240,86,91,.16);color:var(--down)}
.cal-imp.imp-med{background:rgba(var(--gold-rgb),.16);color:var(--gold)}
.cal-imp.imp-low{background:var(--surface-3);color:var(--muted)}
.cal-fp{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: var(--s1);letter-spacing:.02em}
.cal-live{color:var(--up);font-weight:700}

/* News sheets — a calmer reading face for event names, with mono reserved for
   times and currency codes so the hierarchy stays scannable on small screens. */
.news-sheet{font-family:var(--body);letter-spacing:0}
.news-sheet .sheet-title{font-family:var(--display);font-size:22px;font-weight:700;letter-spacing:-.03em;line-height:1.15}
.news-sheet .sheet-sub{font-family:var(--body);font-size:13px;line-height:1.45;letter-spacing:-.005em}
.news-note{margin:0 0 12px;color:var(--muted);font-family:var(--body);font-size:12.5px;line-height:1.45;letter-spacing:-.005em}
.news-sheet .cal-day{font-family:var(--display);font-size:11px;letter-spacing:.12em;line-height:1.2}
.news-sheet .cal-row{align-items:flex-start;gap:10px;padding:14px 12px;border-radius:14px;content-visibility:auto;contain-intrinsic-size:auto 72px}
.news-sheet .cal-time{font-family:var(--mono);font-size:12px;line-height:1.35;letter-spacing:-.02em}
.news-sheet .cal-cur{font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.04em;line-height:1.35}
.news-sheet .cal-ev{font-family:var(--body);font-size:13px;font-weight:600;line-height:1.35;letter-spacing:-.006em}
.news-sheet .cal-fp{font-family:var(--body);font-size:11px;line-height:1.35;letter-spacing:0}
.news-sheet .cal-imp{font-family:var(--body);font-size:10px;font-weight:700;letter-spacing:.07em;line-height:1.2}
.news-sheet .cal-ccy-chip{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.01em}

/* News calendar — filter by currency */
.cal-ccy-filters{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:2px 0 12px;margin:0 0 2px;scrollbar-width:none}
.cal-ccy-filters::-webkit-scrollbar{display:none}
.cal-ccy-chip{flex:none;min-height:36px;padding:0 14px;border-radius:999px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);transition:color .18s,background .18s,border-color .18s,transform .12s}
.cal-ccy-chip:active{transform:scale(.97)}
.cal-ccy-chip.on{color:var(--gold);background:rgba(var(--gold-rgb),.14);border-color:rgba(var(--gold-rgb),.38)}
.cal-ccy-chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* alerts */
.alert-row{display:flex;align-items:center;gap: var(--s2);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.alert-body{flex:1}.alert-body b{font-size: var(--fs-body);display:block}.alert-body small{font-size: var(--fs-tiny);color:var(--muted)}
/* watchlist */
.wl-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.wl-spark{width:54px;height:30px;flex:none;opacity:.9}
.wl-body{flex:1}.wl-body b{font-size: var(--fs-body);display:block}.wl-body small{font-size: var(--fs-tiny);color:var(--muted)}
.wl-px{text-align:right}.wl-px b{font-size: var(--fs-body);display:block}.wl-px small{font-size: var(--fs-tiny);font-weight:700}
/* gold price panel */
.gp-hero{background:var(--surface-2);background-image:var(--grain);backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);border-radius:16px;padding: var(--s4) var(--s4) var(--s3);text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(0,0,0,.28),0 18px 42px -24px rgba(7,5,2,.78)}
.gp-spark{display:block;width:100%;height:42px;opacity:.65;margin-bottom: var(--s2)}
.gp-px{font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--gold)}
.gp-chg{display:inline-block;font-size: var(--fs-small);font-weight:700;margin-top: var(--s2)}
.gp-chg.up{color:var(--up)}.gp-chg.down{color:var(--down)}
.gp-unit{font-size: var(--fs-tiny);color:var(--muted);margin-top: var(--s1);letter-spacing:.03em}
.gp-ccy-h{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin: var(--s4) 2px var(--s2)}
.gp-ccy{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) 2px;border-bottom:1px solid var(--line)}
.gp-flag{font-size: var(--fs-h1);flex:none;line-height:1}
.gp-cbody{flex:1;min-width:0}.gp-cbody b{font-size: var(--fs-body);display:block}.gp-cbody small{font-size: var(--fs-tiny);color:var(--muted)}
.gp-cpx{font-size: var(--fs-h3);font-weight:700;text-align:right}
/* glossary */
.gloss-row{padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.gloss-row b{display:block;font-size: var(--fs-body);color:var(--gold);margin-bottom: var(--s1)}.gloss-row span{font-size: var(--fs-small);color:var(--muted);line-height:1.5}
/* invite a friend */
.invite{text-align:center;padding: var(--s2) 0 var(--s1);max-width:420px;margin:0 auto}
.invite-hero{position:relative;width:88px;height:88px;margin:0 auto var(--s3);display:grid;place-items:center}
.invite-hero-glow{position:absolute;inset:8px;border-radius:50%;background:radial-gradient(circle,rgba(var(--gold-rgb),.28) 0%,rgba(var(--gold-rgb),0) 70%);pointer-events:none}
.invite-ic{position:relative;z-index:1;width:64px;height:64px;border-radius:50%;background:linear-gradient(160deg,rgba(var(--gold-rgb),.22),rgba(var(--gold-rgb),.08));border:1px solid var(--gold-line);box-shadow:0 10px 28px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08);display:grid;place-items:center}
.invite-ic svg{width:28px;height:28px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7}
.invite-eyebrow{margin:0 0 6px;font-size:var(--fs-tiny);font-weight:700;letter-spacing:.14em;color:var(--gold);opacity:.9}
.invite-title{margin:0 0 8px;text-align:center}
.invite-sub{margin:0 auto 18px;max-width:34ch;text-align:center;line-height:1.55}
.invite-msg{text-align:left;background:var(--surface-2);border:1px solid var(--line);border-radius:16px;padding: var(--s3) var(--s4);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.invite-msg-label{display:block;font-size:var(--fs-tiny);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom: var(--s2)}
.invite-msg-body{margin:0;font-size:var(--fs-body);font-weight:600;line-height:1.55;color:var(--text);letter-spacing:-0.01em}
.invite-acts{display:flex;flex-direction:column;gap: var(--s2);margin-top:16px}
.invite-acts .btn{min-height:48px}
.invite-code{display:flex;align-items:center;justify-content:space-between;background:var(--surface-2);border:1px dashed var(--gold-line);border-radius:14px;padding: var(--s3) var(--s4);margin-top: var(--s1)}
.invite-code span{font-size:18px;font-weight:700;letter-spacing:.1em;color:var(--gold)}
.invite-copy{font-size: var(--fs-small);font-weight:700;color:var(--gold);background:rgba(var(--gold-rgb),.14);border:1px solid var(--gold-line);padding: var(--s2) var(--s3);border-radius:999px}
.invite-stat{font-size: var(--fs-small);color:var(--muted);margin-top: var(--s3)}
/* settings */
.set-row{display:flex;align-items:center;justify-content:space-between;padding: var(--s3) 0;border-bottom:1px solid var(--line);font-size: var(--fs-body)}
/* announcements */
.ann-row{display:flex;gap: var(--s3);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.ann-top{display:flex;align-items:center;gap: var(--s1);margin-bottom: var(--s1)}.ann-top b{font-size: var(--fs-h4);font-weight:700}
.ann-time{font-size: var(--fs-tiny);color:var(--faint);margin-left: auto}
.ann-row p{font-size: var(--fs-small);color:var(--text-2);line-height:1.5}
.ann-title{font-size: var(--fs-body);font-weight:700;color:var(--text);margin-bottom: var(--s1);letter-spacing:-0.01em}
.ann-pin{display:inline-flex;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);font-weight:700;color:var(--gold);background:rgba(224,178,60,.12);border:1px solid rgba(224,178,60,.2);border-radius:9999px;padding: 2px var(--s2);margin-left: 2px}
.ann-pin .ic{width:9px;height:9px}
.ann-pinned{border-left:2px solid var(--gold);padding-left: var(--s3)}
.ann-link{color:var(--gold);text-decoration:underline;text-underline-offset:2px;word-break:break-all}
.ann-link:active{opacity:.7}
.office-ann-body .ann-title{font-size: var(--fs-h4)}

/* team channel (one-way desk messages) */
.team-inbox{display:flex;flex-direction:column;gap: var(--s3)}
.team-inbox-preview{gap: var(--s2);padding: var(--s3) var(--s3) 14px!important}
.team-inbox-hint{font-size: var(--fs-tiny);text-align:center;margin: var(--s2) var(--s1) 0;color:var(--faint)}
.team-msg{display:flex;flex-direction:column;gap: var(--s1);margin-bottom: var(--s3)}
.team-msg-compact{margin-bottom: var(--s2)}
.team-msg-compact:last-child{margin-bottom: 0}
.team-msg-meta{display:flex;flex-wrap:wrap;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);color:var(--faint)}
.team-msg-from{font-family:var(--display);font-size: var(--fs-small);font-weight:700;color:var(--text);letter-spacing:-.01em}
.team-msg-verified{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);padding: 2px var(--s1);border-radius:999px}
.team-msg-time{margin-left: auto;font-variant-numeric:tabular-nums}
.team-msg-bubble{
  background:var(--surface-2);border:1px solid var(--line-2);border-radius:14px 14px 14px 4px;
  padding: var(--s3) var(--s3);font-size: var(--fs-h4);line-height:1.55;color:var(--text-2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.team-msg-pinned .team-msg-bubble{border-color:var(--gold-line);background:linear-gradient(145deg,rgba(var(--gold-rgb),.1),rgba(var(--gold-rgb),.03))}
.team-msg-title{display:block;font-size: var(--fs-body);font-weight:700;color:var(--text);margin-bottom: var(--s1);letter-spacing:-.02em}
.team-msg-text{display:block;white-space:pre-wrap;word-break:break-word}
.feed-scroll-team .team-inbox{max-width:520px;margin: 0 auto}
.feed-shell-team .feed-head-team{border-bottom-color:var(--line-2)}
.staff-row-actions{display:flex;gap: var(--s2);margin-top: var(--s2);flex-wrap:wrap}
.staff-row-delete{font-family:var(--body);font-size: var(--fs-tiny);font-weight:600;color:var(--down);background:transparent;border:1px solid rgba(232,93,93,.35);border-radius:999px;padding: var(--s1) var(--s3);cursor:pointer}
.staff-row-delete:active{opacity:.85}

/* community feed (Your office → Announcements) */
.modal.open.modal-feed{z-index:100}
.modal-feed{background:rgba(2,2,4,.88);backdrop-filter:blur(12px);justify-content:flex-end}
.modal-feed .sheet.sheet-feed{
  max-height:min(94dvh,100%);
  height:min(94dvh,calc(100% - 8px));
  display:flex;flex-direction:column;padding: 0 0 env(safe-area-inset-bottom,0px);overflow:hidden;
  border-radius:22px 22px 0 0;margin: 0;width:100%;max-width:none;
}
html[data-native="1"] .modal-feed .sheet.sheet-feed{
  max-height:calc(100dvh - env(safe-area-inset-top,0px) - 10px);
  height:calc(100dvh - env(safe-area-inset-top,0px) - 10px);
}
.modal-feed .sheet-grab,.sheet-locked > .sheet-grab{display:none!important}
.modal-feed .sheet.sheet-feed,.sheet-locked{touch-action:pan-y;overscroll-behavior:none}
.modal-feed .tc-scroll,.sheet-feed .tc-scroll{
  overscroll-behavior:contain;
  overscroll-behavior-y:contain;
  touch-action:pan-y;
  -webkit-overflow-scrolling:touch;
}
.feed-shell{display:flex;flex-direction:column;flex:1;min-height:0}
.feed-head{
  flex-shrink:0;padding: var(--s1) var(--s4) var(--s3);border-bottom:1px solid var(--line);
  display:flex;align-items:flex-start;justify-content:space-between;gap: var(--s3);
}
.feed-head-copy{flex:1;min-width:0}
.feed-head-title{font-family:var(--display);font-size: var(--fs-h1);font-weight:700;letter-spacing:-.03em;margin: var(--s1) 0 var(--s1);line-height:1.15}
.feed-head-sub{font-size: var(--fs-small);color:var(--muted);line-height:1.45;margin: 0}
.feed-head-post{flex:none;margin-top: var(--s2);height:40px;padding: 0 var(--s3);font-size: var(--fs-small);font-weight:700;border-radius:999px}
.feed-scroll{
  flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  padding: var(--s3) var(--s4) var(--s2);scrollbar-width:none;
}
.feed-scroll::-webkit-scrollbar{display:none}
.feed-post{display:flex;gap: var(--s2);margin-bottom: var(--s4);align-items:flex-start}
.feed-post-av{flex:none}
.feed-post-bubble{
  flex:1;min-width:0;background:var(--surface-2);border:1px solid var(--line-2);
  border-radius:4px 16px 16px 16px;padding: var(--s3) var(--s3) var(--s3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  position:relative;
}
.staff-row-edit-feed{margin-top: var(--s2);margin-left: 0;align-self:flex-start}
.feed-post-pinned .feed-post-bubble{
  border-color:var(--gold-line);background:linear-gradient(145deg,rgba(var(--gold-rgb),.12),rgba(var(--gold-rgb),.04));
}
.feed-post-meta{display:flex;flex-wrap:wrap;align-items:center;gap: var(--s1);margin-bottom: var(--s1)}
.feed-post-meta b{font-size: var(--fs-small);font-weight:700}
.feed-post-time{font-size: var(--fs-tiny);color:var(--faint);margin-left: auto;font-variant-numeric:tabular-nums}
.feed-post-title{font-size: var(--fs-h3);font-weight:700;margin: 0 0 var(--s1);letter-spacing:-.02em;line-height:1.25}
.feed-post-body{font-size: var(--fs-h4);color:var(--text-2);line-height:1.55;white-space:pre-wrap;word-break:break-word}
.feed-foot{
  flex-shrink:0;padding: var(--s2) var(--s4) var(--s3);border-top:1px solid var(--line);
  font-size: var(--fs-tiny);color:var(--faint);display:flex;align-items:center;gap: var(--s1);line-height:1.35;
}
.feed-foot .ic{width:14px;height:14px;color:var(--gold);flex:none}
.feed-empty{text-align:center;padding: 48px var(--s5) var(--s7);color:var(--muted)}
.feed-empty .ic{width:36px;height:36px;color:var(--gold);margin: 0 auto var(--s3);display:block;opacity:.85}
.feed-empty b{display:block;font-size:16px;color:var(--text);margin-bottom: var(--s2)}
.feed-empty p{font-size: var(--fs-small);line-height:1.5;margin: 0}
/* challenge */
.chal{text-align:center;padding: var(--s1) 0}
.chal-ic{width:56px;height:56px;border-radius:50%;background:rgba(var(--gold-rgb),.14);border:1px solid var(--gold-line);display:grid;place-items:center;margin: 2px auto var(--s3)}
.chal-ic svg{width:24px;height:24px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7}
.chal-name{font-family:var(--display);font-size: var(--fs-h2);font-weight:700}
.chal-desc{font-size: var(--fs-small);color:var(--muted);margin: var(--s1) 0 var(--s4);line-height:1.5}
.chal-bar{height:8px;border-radius:999px;background:var(--surface-3);overflow:hidden}.chal-bar i{display:block;height:100%;background:var(--gold-foil)}
.chal-meta{font-size: var(--fs-small);color:var(--muted);margin-top: var(--s2)}
.chal-reward{display:inline-flex;align-items:center;gap: var(--s2);font-size: var(--fs-small);color:var(--gold);background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);padding: var(--s2) var(--s3);border-radius:999px;margin-top: var(--s3)}.chal-reward .ic{width:14px;height:14px}

/* ---- monthly challenge: server-scored screen ---- */
.chal-skel{display:grid;gap: var(--s2)}
.chal-skel i{display:block;height:12px;border-radius:6px;background:var(--surface-3)}
.chal-skel i:nth-child(1){width:60%}.chal-skel i:nth-child(2){width:40%}.chal-skel i:nth-child(3){width:80%}
#chal-popup-root .chal-q{box-shadow:none;border:1px solid var(--line);overflow:visible;background:var(--surface)}
#chal-popup-root .chal-prompt{font-size: var(--fs-h2);line-height:1.5;margin: var(--s2) 2px var(--s4)}
.chal-hero .chal-reward{margin-top: 2px}
.chal-prompt{
  font-family:var(--display);
  font-size: var(--fs-h2);
  font-weight:650;
  line-height:1.45;
  margin: var(--s2) 2px var(--s3);
  color:var(--text);
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  word-break:normal;
  overflow-wrap:anywhere;
  max-height:none;
}
.chal-meta{display:flex;gap: var(--s2);align-items:center;margin: 0 2px var(--s1);flex-wrap:wrap}
.chal-meta .pill{font-size: var(--fs-tiny);letter-spacing:.04em;text-transform:uppercase;opacity:.9}
.chal-progress{margin-top: var(--s3);padding-top: var(--s3);border-top:1px solid var(--line)}
.chal-progress-row{display:flex;justify-content:space-between;align-items:baseline;gap: var(--s2);font-size: var(--fs-small);color:var(--muted)}
.chal-progress-row b{color:var(--text);font-weight:650}
.chal-progress-pct{opacity:.85}
.chal-progress-track{height:6px;border-radius:999px;background:var(--surface-3);overflow:hidden;margin-top: var(--s2)}
.chal-progress-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--gold),color-mix(in srgb,var(--gold) 70%,#fff));transition:width .35s cubic-bezier(.2,.8,.3,1)}
.chal-choices{display:grid;gap: var(--s2)}
.chal-choice{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);color:var(--text);font-size: var(--fs-h4);line-height:1.4;transition:transform .18s cubic-bezier(.2,.8,.3,1),background .18s,border-color .18s}
.chal-choices:not(.is-done) .chal-choice:hover{background:var(--surface-3);border-color:var(--line-2)}
.chal-choices:not(.is-done) .chal-choice:active{transform:scale(.985)}
.chal-choice:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.chal-choice[disabled]{opacity:.55}
.chal-choice.is-picked{border-color:var(--gold-line);background:var(--gold-soft);opacity:1}
.chal-dot{flex:0 0 18px;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line-2);display:grid;place-items:center}
.chal-dot .ic{width:12px;height:12px}
.chal-choice.is-right{border-color:rgba(63,191,127,.45);background:rgba(63,191,127,.10)}
.chal-choice.is-right .chal-dot{border-color:var(--up);color:var(--up)}
.chal-choice.is-wrong{border-color:rgba(240,86,91,.42);background:rgba(240,86,91,.09)}
.chal-choice.is-wrong .chal-dot{border-color:var(--down)}
.chal-why{font-size: var(--fs-small);color:var(--muted);line-height:1.6;margin: var(--s3) 2px 0;padding-top: var(--s3);border-top:1px solid var(--line)}
.chal-pts{display:grid;gap: var(--s2);margin-top: var(--s1)}
.chal-pts > div{display:flex;align-items:baseline;gap: var(--s3)}
.chal-pts b{font-family:var(--mono);font-size: var(--fs-body);color:var(--gold);min-width:34px}
.chal-pts small{font-size: var(--fs-small);color:var(--muted)}
.chal-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s2) var(--s1);border-bottom:1px solid var(--line)}
.chal-row:last-of-type{border-bottom:0}
.chal-rank{flex:0 0 28px;font-size: var(--fs-small);color:var(--faint)}
.chal-who{flex:1;font-size: var(--fs-h4);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chal-who small{font-size: var(--fs-tiny);color:var(--gold);margin-left: var(--s1)}
.chal-pts-cell{font-size: var(--fs-h4);color:var(--text-2)}
.chal-row.is-me{background:var(--gold-soft);border-radius:var(--r-sm);padding-left: var(--s2);padding-right: var(--s2)}
.chal-row.is-me .chal-rank,.chal-row.is-me .chal-pts-cell{color:var(--gold)}
.chal-gap{text-align:center;color:var(--faint);letter-spacing:.3em;padding: var(--s1) 0}
/* members */
.mem-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.mem-body{flex:1}.mem-body b{font-size: var(--fs-body);display:block}.mem-body small{font-size: var(--fs-tiny);color:var(--muted)}
/* community chat */
.cchat{max-height:48vh;overflow-y:auto;scrollbar-width:none;margin: 0 -2px 2px}
.cmsg{display:flex;gap: var(--s2);margin-bottom: var(--s3)}
.cmsg .ct{background:var(--surface-2);border:1px solid var(--line);border-radius:4px 14px 14px 14px;padding: var(--s2) var(--s3);font-size: var(--fs-small);line-height:1.45}
.cmsg .ct b{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-bottom: 2px}
.cmsg.host .ct{background:rgba(var(--gold-rgb),.1);border-color:var(--gold-line)}.cmsg.host .ct b{color:var(--gold)}
.cchat-in{display:flex;gap: var(--s2);margin-top: var(--s1)}.cchat-in .finput{flex:1}
/* profile hub rows */
.hub-row{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.hub-row.last{border-bottom:none}
.hub-row>.ic:first-child{width:20px;height:20px;color:var(--gold)}
.hub-row .hr-body{flex:1}.hub-row .hr-body b{display:block;font-size: var(--fs-body);font-weight:600}.hub-row .hr-body small{font-size: var(--fs-tiny);color:var(--muted)}
.hub-row>.ic:last-child{width:18px;height:18px;color:var(--faint)}
/* academy paths */
.paths{display:flex;flex-direction:column;gap: var(--s2)}
.path{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);border-radius:var(--r-lg);background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.1);transition:transform .15s}
.path:active{transform:scale(.99)}
.path-ring{width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;position:relative}
.path-ring::after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--surface)}
.path-ring span{position:relative;z-index:1;font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700}
.path-body{flex:1;min-width:0}
.path-top{display:flex;align-items:center;gap: var(--s2)}
.path-top b{font-family:var(--display);font-size: var(--fs-body);font-weight:700}
.path-lvl{font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--surface-3);padding: 2px var(--s2);border-radius:6px}
.path-desc{font-size: var(--fs-tiny);color:var(--muted);margin: var(--s1) 0 var(--s1);line-height:1.35}
.path-meta{font-size: var(--fs-tiny);color:var(--faint);font-weight:600}
.path-next{font-size: var(--fs-tiny);color:var(--gold);margin-top: var(--s1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Blakey Trades Academy — Learn tile + hub + module player */
.academy-tiles{display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s2)}
.academy-tiles .pg-tile{margin-bottom:0}
.pg-tile{position:relative;display:block;width:100%;text-align:left;height:168px;border-radius:var(--r-xl);overflow:hidden;margin-bottom: var(--s1);border:1px solid var(--gold-line);box-shadow:0 10px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08)}
.pg-tile:active{transform:scale(.985)}
.pg-tile-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pg-tile-scrim{position:absolute;inset:0;background:linear-gradient(105deg,rgba(4,4,6,.92) 0%,rgba(4,4,6,.72) 42%,rgba(4,4,6,.28) 78%,rgba(4,4,6,.45) 100%)}
.pg-tile-body{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:space-between;padding: var(--s4) var(--s4)}
.pg-tile-brand{display:flex;align-items:center;gap: var(--s3)}
.pg-tile-logo{width:42px;height:42px;object-fit:contain;flex:none;filter:drop-shadow(0 2px 8px rgba(0,0,0,.45))}
.pg-tile-name{display:block;font-family:var(--display);font-size: var(--fs-small);font-weight:800;letter-spacing:.12em;color:#F5E6C8;line-height:1.1}
.pg-tile-tag{display:block;font-size: var(--fs-tiny);letter-spacing:.08em;text-transform:uppercase;color:rgba(245,230,200,.72);margin-top: var(--s1)}
.pg-tile-cta .eyebrow{color:rgba(245,230,200,.85)}
.pg-tile-cta b{display:block;font-family:var(--display);font-size: var(--fs-h2);color:#F5F5F2;margin: var(--s1) 0 2px;letter-spacing:-.01em}
.pg-tile-cta small{display:block;font-size: var(--fs-tiny);color:rgba(243,243,241,.7)}
.pg-tile-go{position:absolute;right:14px;bottom:16px;z-index:3;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--gold-rgb),.18);border:1px solid var(--gold-line);color:var(--gold)}
.pg-tile-go .ic,.pg-tile-go svg{width:14px;height:14px}
.pg-hub-hero{position:relative;height:210px;border-radius:var(--r-xl);overflow:hidden;margin: var(--s3) 0 var(--s4);border:1px solid var(--gold-line)}
.pg-hub-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pg-hub-hero-scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(4,4,6,.96),rgba(4,4,6,.55) 45%,rgba(4,4,6,.25))}
.pg-hub-hero-body{position:absolute;left:16px;right:16px;bottom:16px;z-index:2}
.pg-hub-prog{height:5px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden;margin: var(--s3) 0 var(--s1)}
.pg-hub-prog i{display:block;height:100%;background:var(--gold-foil);background-size:200% auto;border-radius:3px}
.pg-mod-list{display:flex;flex-direction:column;gap: var(--s2)}
.pg-mod{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);border-radius:var(--r-lg);background:var(--surface-2);border:1px solid var(--line-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.pg-mod:active:not(:disabled){transform:scale(.99)}
.pg-mod.is-soon{opacity:.62}
.pg-mod-n{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-size: var(--fs-small);font-weight:700;background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);color:var(--gold)}
.pg-mod-body{flex:1;min-width:0}
.pg-mod-body b{display:block;font-family:var(--display);font-size: var(--fs-body);font-weight:700}
.pg-mod-body small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: var(--s1);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-mod-audio{display:flex;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);flex:none}
.pg-mod-audio .ic{width:12px;height:12px}
.pg-mod-soon{font-size: var(--fs-tiny);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);background:var(--surface-3);padding: var(--s1) var(--s2);border-radius:6px}
.pg-mod-check{color:var(--up)}.pg-mod-check .ic{width:16px;height:16px}
.pg-mod>.ic{width:16px;height:16px;color:var(--faint);flex:none}
.pg-mod.is-done{border-color:rgba(62,203,134,.28)}

/* Phantom academy module sheet (View module lightbox) */
.pg-view-sheet{display:flex;align-items:center;justify-content:center;gap:8px}
.pg-view-sheet .ic{width:16px;height:16px}
.pg-sheet-frame{margin-top:8px;border-radius:var(--r-lg);overflow:auto;-webkit-overflow-scrolling:touch;max-height:min(72vh,780px);background:#0B0B0F;border:1px solid var(--gold-line)}
.pg-sheet-img{display:block;width:100%;height:auto;vertical-align:top}

.pg-intro{font-size: var(--fs-h4);line-height:1.7;color:var(--muted);margin: var(--s1) 2px var(--s3)}
.pg-player{display:flex;align-items:center;gap: var(--s3);padding: var(--s3);margin-bottom: var(--s4);border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(var(--gold-rgb),.14),rgba(var(--gold-rgb),.04));border:1px solid var(--gold-line)}
.pg-player.is-pending{opacity:.72}
.pg-play{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--gold-foil);background-size:200% auto;border:none;color:#1a1408;box-shadow:0 6px 18px rgba(var(--gold-rgb),.35)}
.pg-play:disabled{opacity:.5}
.pg-play svg,.pg-play .ic{width:16px;height:16px}
.pg-player-body{flex:1;min-width:0}
.pg-player-body b{display:block;font-family:var(--display);font-size: var(--fs-body)}
.pg-player-body small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin: 2px 0 var(--s2)}
.pg-scrub{
  -webkit-appearance:none;appearance:none;width:100%;height:28px;margin:4px 0 0;
  background:transparent;cursor:pointer;touch-action:none;accent-color:var(--gold);
}
.pg-scrub::-webkit-slider-runnable-track{height:4px;border-radius:99px;background:color-mix(in srgb,var(--line) 85%,transparent)}
.pg-scrub::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--gold);margin-top:-6px;box-shadow:0 0 0 3px rgba(var(--gold-rgb),.22)}
.pg-scrub::-moz-range-track{height:4px;border-radius:99px;background:color-mix(in srgb,var(--line) 85%,transparent);border:0}
.pg-scrub::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--gold);border:0}
html[data-theme="light"] .pg-scrub::-webkit-slider-runnable-track{background:rgba(22,20,14,.14)}
html[data-theme="light"] .pg-scrub::-moz-range-track{background:rgba(22,20,14,.14)}
.pg-times{display:flex;justify-content:space-between;font-size: var(--fs-tiny);color:var(--faint);margin-top: var(--s1)}
.pg-lesson{padding: var(--s4) 0;border-bottom:1px solid var(--line)}
.pg-lesson:last-child{border-bottom:none}
.pg-lesson-head{display:flex;justify-content:space-between;align-items:center;margin-bottom: var(--s1)}
.pg-lesson-title{font-family:var(--display);font-size: var(--fs-h2);font-weight:700;letter-spacing:-.015em;margin: 0 0 var(--s2)}
.pg-takes-wrap{margin-top: var(--s2);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2)}
.pg-takes-wrap b{display:block;font-size: var(--fs-tiny);letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-bottom: var(--s2)}
.pg-takes{margin: 0;padding-left: var(--s4)}
.pg-takes li{font-size: var(--fs-small);line-height:1.45;color:var(--text);margin: 0 0 var(--s1)}
.pg-takes li:last-child{margin-bottom: 0}
/* continue-reading hero row — surfaces the written curriculum without tapping into a path */
.read-next{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3) var(--s4);margin-bottom: var(--s3);border-radius:var(--r-lg);
  background:linear-gradient(135deg,rgba(var(--gold-rgb),.13),rgba(var(--gold-rgb),.04));border:1px solid var(--gold-line);
  cursor:pointer;transition:transform .15s var(--ease-spring)}
.read-next:active{transform:scale(.985)}
.rn-ic{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold)}
.rn-ic .ic{width:19px;height:19px}
.rn-body{flex:1;min-width:0}
.rn-body b{display:block;font-family:var(--display);font-size: var(--fs-body);margin-top: var(--s1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rn-body small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: var(--s1)}
.rn-go{display:flex;align-items:center;gap: 1px;color:var(--gold);font-weight:700;font-size: var(--fs-small);white-space:nowrap}
.rn-go svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
/* Play All — podcast-mode tile (gold wash from the old continue-reading card) */
.ap-tile{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3) var(--s4);margin-bottom: var(--s3);border-radius:var(--r-lg);
  background:linear-gradient(135deg,rgba(var(--gold-rgb),.13),rgba(var(--gold-rgb),.04));border:1px solid var(--gold-line);
  cursor:pointer;transition:transform .15s var(--ease-spring)}
.ap-tile:active{transform:scale(.985)}
.ap-tile-play{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--gold-foil);background-size:200% auto;color:#1a1408;box-shadow:0 6px 16px rgba(var(--gold-rgb),.28)}
.ap-tile-play .ic,.ap-tile-play svg{width:15px;height:15px}
.ap-tile-body{flex:1;min-width:0}
.ap-tile-body b{display:block;font-family:var(--display);font-size: var(--fs-body);margin-top: 2px}
.ap-tile-body small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: var(--s1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-tile-bar{display:block;height:3px;margin-top: var(--s2);border-radius:99px;background:rgba(var(--gold-rgb),.12);overflow:hidden}
.ap-tile-bar>i{display:block;height:100%;width:0;border-radius:inherit;background:var(--gold);transition:width .25s ease}
.ap-tile-rem{flex:none;font-size: var(--fs-small);color:var(--gold);font-weight:700}
.ap-tile-phantom{margin: var(--s3) 0 var(--s1)}
/* Floating podcast player — compact; play between −10 / +10; theme-aware chrome */
.ap-bar{position:absolute;left:10px;right:10px;bottom:calc(64px + env(safe-area-inset-bottom,0px));z-index:40;
  display:none;flex-direction:column;gap: var(--s1);padding: var(--s2) var(--s2) var(--s2);border-radius:14px;color:#F3F3F1;
  background:rgba(18,18,18,.96);border:1px solid var(--gold-line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 28px rgba(0,0,0,.42)}
.ap-bar.is-on{display:flex}
.ap-bar-prog{position:absolute;left:12px;right:12px;top:0;height:2px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.ap-bar-prog>i{display:block;height:100%;width:0;background:var(--gold)}
.ap-bar-top{display:flex;align-items:center;gap: var(--s2)}
.ap-bar-btn{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:transparent;border:0;color:inherit;cursor:pointer}
.ap-bar-btn .ic,.ap-bar-btn svg{width:15px;height:15px}
.ap-bar-prev{transform:scaleX(-1)}
.ap-bar-play{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--gold-foil);background-size:200% auto;border:0;color:#1a1408;cursor:pointer}
.ap-bar-play .ic,.ap-bar-play svg{width:14px;height:14px}
.ap-bar-body{flex:1;min-width:0}
.ap-bar-queue{display:block;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom: 1px}
.ap-bar-body b{display:block;font-size: var(--fs-small);font-weight:700;color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ap-bar-body small:not(.ap-bar-queue){display:block;font-size: var(--fs-tiny);color:rgba(243,243,241,.62);margin-top: 1px}
.ap-bar-close{color:rgba(243,243,241,.55)}
.ap-bar-rate{flex:none;min-width:40px;height:28px;padding: 0 var(--s2);border-radius:999px;border:1px solid var(--gold-line);
  background:rgba(var(--gold-rgb),.12);color:var(--gold);font-family:var(--mono);font-size: var(--fs-tiny);font-weight:800;cursor:pointer}
.ap-bar-rate:active{transform:scale(.96)}
/* Flash-only overlays — never capture hits (was blocking half the tile) */
.ap-bar-dtap{position:absolute;inset:0;display:flex;pointer-events:none;z-index:2}
.ap-bar-dtap-zone{flex:1;display:grid;place-items:center;pointer-events:none;opacity:0;transition:opacity .2s ease}
.ap-bar-dtap-zone span{font-family:var(--mono);font-size:16px;font-weight:800;color:var(--gold);text-shadow:0 2px 12px rgba(0,0,0,.6)}
.ap-bar-dtap-zone.is-flash{opacity:1;background:rgba(var(--gold-rgb),.12)}
.ap-bar-top,.ap-bar-scrub-row,.ap-bar-controls{position:relative;z-index:1}
.ap-bar-scrub-row{padding: 0 2px}
.ap-bar-scrub{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;margin: 0;cursor:pointer;touch-action:none}
.ap-bar-scrub::-webkit-slider-runnable-track{height:3px;border-radius:99px;background:rgba(255,255,255,.12)}
.ap-bar-scrub::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--gold);margin-top: -5.5px;box-shadow:0 0 0 3px rgba(var(--gold-rgb),.25)}
.ap-bar-scrub::-moz-range-track{height:3px;border-radius:99px;background:rgba(255,255,255,.12);border:0}
.ap-bar-scrub::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--gold);border:0}
.ap-bar-controls{display:flex;align-items:center;justify-content:center;gap: var(--s2)}
.ap-bar-skip{min-width:40px;height:28px;padding: 0 var(--s2);border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:inherit;font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;cursor:pointer}
.ap-bar-skip:active{transform:scale(.96)}
/* Light mode — elevated cream chrome, same hierarchy as dark */
html[data-theme="light"] .ap-bar{
  color:#15151A;
  background:rgba(255,254,250,.94);
  border-color:var(--gold-line);
  box-shadow:0 14px 36px -16px rgba(22,20,14,.28),0 2px 8px -4px rgba(22,20,14,.12),inset 0 1px 0 rgba(255,255,255,.85)}
html[data-theme="light"] .ap-bar-prog{background:rgba(22,20,14,.08)}
html[data-theme="light"] .ap-bar-body small:not(.ap-bar-queue){color:var(--muted)}
html[data-theme="light"] .ap-bar-close{color:var(--muted)}
html[data-theme="light"] .ap-bar-rate{background:rgba(var(--gold-rgb),.14);color:var(--gold-hi)}
html[data-theme="light"] .ap-bar-scrub::-webkit-slider-runnable-track{background:rgba(22,20,14,.12)}
html[data-theme="light"] .ap-bar-scrub::-moz-range-track{background:rgba(22,20,14,.12)}
html[data-theme="light"] .ap-bar-skip{border-color:var(--line-2);background:var(--surface-3);color:var(--text)}
html[data-theme="light"] .ap-bar-dtap-zone span{text-shadow:0 1px 8px rgba(255,255,255,.7)}
.path>.ic{width:18px;height:18px;color:var(--faint);flex:none}
/* lessons */
.lessons{display:flex;flex-direction:column;gap:4px}
.lesson{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) 2px;border-bottom:1px solid var(--line);font-size: var(--fs-h4);width:100%;text-align:left;cursor:pointer}
.lesson .les-n{width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;font-family:var(--mono);font-size: var(--fs-small);background:var(--surface-3);color:var(--muted)}
.lesson.done{opacity:.55;border-bottom-color:transparent}
.lesson.done .les-n{background:rgba(62,203,134,.16)}
.lesson.next .les-n{background:rgba(var(--gold-rgb),.14);color:var(--gold);border:1px solid var(--gold-line)}
.lesson .les-n .ic{width:14px;height:14px;color:var(--up)}
.les-t{flex:1;min-width:0}.lesson.done .les-t{color:var(--muted)}
.les-t small.les-m{display:block;font-size: var(--fs-tiny);color:var(--faint);margin-top: 2px}
.path-quiz-row{margin-top: var(--s1);border-top:1px solid var(--line-2);border-bottom:none;padding-top: var(--s3)}
.path-quiz-row .les-n{color:var(--gold);background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line)}
.path-quiz-row .les-n .ic{color:var(--gold);width:14px;height:14px}
.lesson>.ic{width:16px;height:16px;color:var(--gold);flex:none}
/* the lesson reader */
.lesson-body{margin-top: var(--s2)}
.lesson-body p{font-size: var(--fs-h4);line-height:1.75;color:var(--text);margin: 0 0 var(--s3)}
.lesson-done-tag{display:flex;align-items:center;justify-content:center;gap: var(--s2);margin-top: var(--s4);padding: var(--s3);border-radius:var(--r-md);background:rgba(62,203,134,.10);border:1px solid rgba(62,203,134,.25);color:var(--up);font-weight:700;font-size: var(--fs-small)}
.lesson-done-tag .ic{width:15px;height:15px}
/* quiz */
.quiz-q{margin-bottom: var(--s4)}
.quiz-q b{display:block;font-size: var(--fs-body);margin-bottom: var(--s2);line-height:1.35}
.quiz-opt{display:block;width:100%;text-align:left;padding: var(--s3) var(--s3);border-radius:12px;background:var(--surface-2);border:1px solid var(--line-2);color:var(--text);font-size: var(--fs-h4);margin-bottom: var(--s2);transition:background .2s,border-color .2s}
.quiz-opt.right{background:rgba(62,203,134,.16);border-color:rgba(62,203,134,.5);color:var(--up)}
.quiz-opt.wrong{background:rgba(240,86,91,.14);border-color:rgba(240,86,91,.5);color:var(--down)}
.quiz-prog{display:block;font-size: var(--fs-tiny);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom: var(--s1)}
.quiz-why{max-height:0;overflow:hidden;opacity:0;font-size: var(--fs-small);line-height:1.5;color:var(--muted);border-left:2px solid var(--gold-line);transition:max-height .3s ease,opacity .3s ease,padding .3s ease,margin .3s ease}
.quiz-why.show{max-height:200px;opacity:1;padding: 2px 0 2px var(--s3);margin-top: var(--s2)}
/* quiz v2 — one-at-a-time flow + results ring */
.quiz-head{margin: 2px 0 var(--s4)}
.quiz-bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.quiz-bar i{display:block;height:100%;background:var(--gold-foil);background-size:200% auto;border-radius:3px;transition:width .45s var(--ease-spring)}
.quiz-meta{display:flex;justify-content:space-between;margin-top: var(--s2);font-size: var(--fs-tiny);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.quiz-question{display:block;font-family:var(--display);font-weight:700;font-size:18px;line-height:1.32;letter-spacing:-.01em;margin-bottom: var(--s4)}
.quiz-opts{display:flex;flex-direction:column;gap: var(--s2)}
.quiz-opts .quiz-opt{margin-bottom: 0}
.quiz-opt:not(:disabled){transition:transform .12s var(--ease-spring),background .2s,border-color .2s}
.quiz-opt:not(:disabled):active{transform:scale(.985)}
.quiz-opt:disabled{cursor:default}
.quiz-next{margin-top: var(--s4)}
.quiz-next[hidden]{display:none}
.quiz-result{text-align:center;padding: var(--s3) 0 var(--s1)}
.qr-ring{width:118px;height:118px;border-radius:50%;margin: var(--s1) auto var(--s4);display:grid;place-items:center;transition:background .7s ease}
.qr-ring-in{width:98px;height:98px;border-radius:50%;background:var(--surface);display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.qr-ring-in svg{width:38px;height:38px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.6}
.quiz-result.fail .qr-ring-in svg{color:var(--down)}
.qr-score{font-family:var(--display);font-weight:800;font-size:42px;line-height:1;letter-spacing:-.02em}
.qr-score span{font-size:20px;color:var(--muted);font-weight:600;margin-left: var(--s1);-webkit-text-fill-color:var(--muted)}
.qr-verdict{font-family:var(--display);font-weight:700;font-size: var(--fs-h2);margin-top: var(--s2);color:var(--up)}
.quiz-result.fail .qr-verdict{color:var(--down)}
.qr-sub{font-size: var(--fs-small);color:var(--muted);line-height:1.5;margin: var(--s2) auto 0;max-width:290px}
.qs-card{display:flex;align-items:center;gap: var(--s2);justify-content:center;background:var(--surface-2);border:1px solid var(--gold-line);border-radius:14px;padding: var(--s3);font-size: var(--fs-body);margin-top: var(--s1)}
.qs-card .ic{width:18px;height:18px;color:var(--gold);flex:none}
.qs-card.pass{border-color:rgba(62,203,134,.5)}.qs-card.pass .ic{color:var(--up)}
.qs-card.fail{border-color:rgba(240,86,91,.45)}.qs-card.fail .ic{color:var(--down)}
/* track record */
.track{padding: var(--s1) var(--s3) var(--s3)}
.track-stats{display:flex;gap: var(--s2);text-align:center;margin-top: var(--s1)}
.track-stats>div{flex:1;background:var(--surface-2);background-image:var(--grain);border:1px solid var(--line);border-radius:12px;padding: var(--s3) var(--s1)}
.track-stats b{font-family:var(--mono);font-size:19px;font-weight:700;display:block}
.track-stats small{font-size: var(--fs-tiny);color:var(--muted);display:block;margin-top: 2px}
.track-note{display:flex;align-items:center;gap: var(--s2);font-size: var(--fs-tiny);color:var(--faint);margin-top: var(--s3);padding: 0 2px}
.track-note .ic{width:13px;height:13px;color:var(--up)}
/* community quick actions */
.comm-actions{display:flex;gap: var(--s2);margin-top: var(--s3)}
.comm-act{flex:1;display:flex;align-items:center;gap: var(--s2);padding: var(--s3);border-radius:var(--r-md);background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);text-align:left;transition:transform .15s}
.comm-act svg{width:20px;height:20px;flex:none;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7}
.comm-act b{display:block;font-size: var(--fs-small);font-weight:700}.comm-act small{font-size: var(--fs-tiny);color:var(--muted)}
.comm-act:active{transform:scale(.97)}
/* home "on the floor" chat card */
.floor-card{cursor:pointer;padding: var(--s4);transition:transform .16s var(--ease-spring)}
.floor-card:active{transform:scale(.985)}
.floor-head{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-bottom: var(--s3)}
.floor-online{font-size: var(--fs-small);color:var(--muted);white-space:nowrap}
.floor-msg{display:flex;gap: var(--s2);align-items:flex-start}
.floor-bubble{flex:1;min-width:0;background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);border-radius:4px 14px 14px 14px;padding: var(--s2) var(--s3);font-size: var(--fs-small);line-height:1.45;color:var(--text)}
.floor-bubble b{display:flex;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);color:var(--gold);margin-bottom: var(--s1)}
.floor-foot{display:flex;align-items:center;justify-content:space-between;gap: var(--s3);margin-top: var(--s3)}
.floor-stack{display:flex;align-items:center;min-width:0}
.floor-stack .fs-av{position:relative;display:inline-flex}
.floor-stack .fs-av .av{border:2px solid #16161d;background:#23232c;color:#EDEDF2;font-weight:700}
.fs-more{margin-left: var(--s2);font-size: var(--fs-tiny);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.floor-cta{flex:none;display:flex;align-items:center;gap: var(--s1);font-size: var(--fs-small);font-weight:700;color:var(--gold);white-space:nowrap}
.floor-cta svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8}
[data-theme="light"] .floor-stack .fs-av .av{border-color:#fff;background:#E7E4DA;color:#55545C}

/* ===== the book card — P&L cast in bullion: dark metal in dark mode, ivory plate in light ===== */
.book-card{display:block;width:100%;text-align:left;position:relative;overflow:hidden;margin-top: var(--s3);padding: 0;border-radius:20px;
  background-image:var(--grain),linear-gradient(160deg,#1c1608,#0c0d12);
  border:1px solid rgba(224,178,60,.30);
  box-shadow:inset 0 1px 0 rgba(255,252,235,.13),0 22px 52px -26px rgba(7,5,2,.85);
  transition:transform .15s var(--ease-spring);cursor:pointer}
.book-card:active{transform:scale(.985)}
.book-card .eyebrow{color:#E0B23C}
.book-card .streak-chip{color:#E0B23C;background:rgba(224,178,60,.10);border-color:rgba(224,178,60,.28)}
.book-card .num.up{color:#3FBF7F}
.book-card .num.down{color:#F0565B}
/* light mode: the same object in polished ivory metal */
[data-theme="light"] .book-card{
  background-image:var(--grain),linear-gradient(160deg,#f9f3e2,#ffffff 58%,#f4efe3);
  border-color:rgba(154,123,46,.36);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 22px 48px -26px rgba(122,95,28,.38)}
[data-theme="light"] .book-card .eyebrow{color:#9A7B2E}
[data-theme="light"] .book-card .streak-chip{color:#9A7B2E;background:rgba(154,123,46,.09);border-color:rgba(154,123,46,.30)}
[data-theme="light"] .book-card .num.up{color:#0B7C49}
[data-theme="light"] .book-card .num.down{color:#D23A3F}
[data-theme="light"] .book-sub{color:#6d6779}
[data-theme="light"] .book-foot{color:#8a8494}
[data-theme="light"] .book-go{color:#9A7B2E}
[data-theme="light"] .book-sheen{background:linear-gradient(115deg,transparent 32%,rgba(154,123,46,.10) 46%,rgba(154,123,46,.02) 53%,transparent 66%)}
[data-theme="light"] .book-eq{opacity:.45}
.book-eq{position:absolute;left:0;right:0;bottom:0;display:block;width:100%;height:58px;opacity:.5;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 55%);mask-image:linear-gradient(180deg,transparent,#000 55%)}
.book-in{position:relative;z-index:2;padding: var(--s4) var(--s4) var(--s3)}
.book-top{display:flex;align-items:center;justify-content:space-between;gap: var(--s2)}
.book-chips{display:flex;align-items:center;gap: var(--s2)}
.book-net{margin-top: var(--s3)}
.book-net b{font-size:42px;font-weight:700;letter-spacing:-.02em;line-height:1}
.book-sub{margin-top: var(--s2);font-size: var(--fs-small);color:#938e99}
.book-foot{display:flex;align-items:center;justify-content:space-between;margin-top: var(--s4);font-size: var(--fs-tiny);color:#767181}
.book-go{display:flex;align-items:center;gap: 2px;color:#E0B23C;font-weight:700;font-size: var(--fs-small)}
.book-go svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
/* one-time foil sweep across the metal on entry */
.book-sheen{position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(115deg,transparent 32%,rgba(255,244,214,.10) 46%,rgba(255,244,214,.02) 53%,transparent 66%);
  transform:translateX(-130%);animation:bookSheen 1.5s .55s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes bookSheen{to{transform:translateX(130%)}}
@media (prefers-reduced-motion: reduce){.book-sheen{animation:none;opacity:0}}

/* ===== money story: membership / paywall / founder desk / push / tg-sync ===== */
.up-card{display:flex;align-items:center;gap: var(--s3);width:100%;margin-top: var(--s3);padding: var(--s3);border-radius:var(--r-lg);
  background:linear-gradient(135deg,rgba(var(--gold-rgb),.16),rgba(var(--gold-rgb),.045));border:1px solid var(--gold-line);
  box-shadow:inset 0 1px 0 rgba(255,252,235,.14);transition:transform .15s var(--ease-spring);cursor:pointer}
.up-card:active{transform:scale(.985)}
.up-ic{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold)}
.up-ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
.up-body{flex:1;min-width:0;text-align:left}.up-body b{display:block;font-family:var(--display);font-size: var(--fs-body)}.up-body small{font-size: var(--fs-tiny);color:var(--muted)}
.up-cta{display:flex;align-items:center;gap: 1px;font-size: var(--fs-small);font-weight:700;color:var(--gold);white-space:nowrap}
.up-cta svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2}

.tiers{display:flex;flex-direction:column;gap: var(--s3);margin: var(--s1) 0 2px}
.tier{padding: var(--s4);border-radius:var(--r-lg);background:var(--surface-2);border:1px solid var(--line-2)}
.tier-gold{background:linear-gradient(135deg,rgba(var(--gold-rgb),.14),rgba(var(--gold-rgb),.04));border-color:var(--gold-line);box-shadow:var(--glow-gold)}
.tier-top{display:flex;align-items:flex-start;justify-content:space-between;gap: var(--s2)}
.tier-name{font-family:var(--display);font-size: var(--fs-h2);font-weight:700}
.tier-tag{font-size: var(--fs-tiny);color:var(--muted);margin-top: 1px}
.tier-price{font-family:var(--display);font-size:21px;font-weight:800;color:var(--gold);white-space:nowrap}.tier-price small{font-size: var(--fs-small);color:var(--muted);font-weight:600}
.tier-feats{list-style:none;margin: var(--s3) 0 var(--s3);display:flex;flex-direction:column;gap: var(--s2)}
.tier-feats li{display:flex;gap: var(--s2);align-items:flex-start;font-size: var(--fs-small);line-height:1.4;color:var(--text)}
.tier-feats li svg{width:15px;height:15px;flex:none;margin-top: 1px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:2}
.tier-cta{height:46px;font-size: var(--fs-body)}
.tier-cta[disabled]{opacity:.55}

.sig-locked{position:relative;overflow:hidden}
.sl-blur{filter:blur(5px) saturate(.7);opacity:.5;pointer-events:none;padding: 2px}
.sl-lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap: var(--s1);text-align:center;padding: var(--s4);
  background:radial-gradient(120% 90% at 50% 42%,rgba(10,10,13,.6),rgba(10,10,13,.9))}
.sl-lock-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold);margin-bottom: 2px}
.sl-lock-ic svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7}
.sl-lock b{font-family:var(--display);font-size: var(--fs-h3);color:#fff}
.sl-lock small{font-size: var(--fs-tiny);color:rgba(255,255,255,.72);max-width:230px;line-height:1.4}
.sl-cta{margin-top: var(--s2);height:38px;padding: 0 var(--s4)}

.fd-head{text-align:center}
.fd-stats{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2);margin: var(--s1) 0 var(--s3)}
.fd-stat{padding: var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);text-align:center}
.fd-stat b{display:block;font-family:var(--mono);font-size:21px;font-weight:700}
.fd-stat small{font-size: var(--fs-tiny);color:var(--muted);letter-spacing:.04em}
.fd-funnel{padding: var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);margin-bottom: var(--s3);display:flex;flex-direction:column;gap: var(--s2)}
.fd-fn{display:flex;align-items:center;gap: var(--s2);font-size: var(--fs-small)}
.fd-fn>span{width:80px;color:var(--muted)}
.fd-fn>b{width:44px;text-align:right;font-family:var(--mono)}
.fd-fbar{flex:1;height:7px;border-radius:4px;background:var(--surface-4);overflow:hidden}
.fd-fbar i{display:block;height:100%;border-radius:4px;background:var(--gold-foil)}

.push-banner{
  position:absolute;top:max(10px, env(safe-area-inset-top, 0px));left:10px;right:10px;z-index:140;
  display:flex;gap: var(--s3);align-items:flex-start;padding: var(--s3) var(--s3) var(--s3);
  border-radius:22px;
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);
  border:0.5px solid rgba(255,255,255,.55);
  box-shadow:
    0 1px 0 rgba(255,255,255,.65) inset,
    0 18px 48px -12px rgba(0,0,0,.38),
    0 4px 14px rgba(0,0,0,.12);
  transform:translateY(calc(-100% - 24px)) scale(.96);opacity:0;
  transition:transform .32s var(--ease-out,cubic-bezier(.16,1,.3,1)),opacity .22s ease;
  color:#0b0b0d;cursor:pointer;-webkit-tap-highlight-color:transparent
}
html:not([data-theme="light"]) .push-banner{
  background:rgba(38,38,40,.82);
  border-color:rgba(255,255,255,.12);
  box-shadow:
    0 1px 0 rgba(255,255,255,.08) inset,
    0 22px 50px -14px rgba(0,0,0,.7),
    0 4px 16px rgba(0,0,0,.35);
  color:#f5f5f7
}
.push-banner.show{transform:translateY(0) scale(1);opacity:1}
.pb-ic{
  flex:none;width:42px;height:42px;border-radius:10px;overflow:hidden;
  background:linear-gradient(145deg,#1a1a1c,#0a0a0b);
  border:0.5px solid rgba(224,178,60,.35);
  box-shadow:0 1px 2px rgba(0,0,0,.25);
  display:grid;place-items:center
}
.pb-ic img{width:100%;height:100%;object-fit:contain;display:block}
.pb-ic svg{width:22px;height:22px;stroke:var(--gold,#E0B23C);fill:none}
.pb-body{flex:1;min-width:0;padding-top: 1px}
.pb-top{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-bottom: 2px}
.pb-app{
  font-family:var(--mono,-apple-system,system-ui);font-size: var(--fs-tiny);font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:rgba(60,60,67,.72)
}
html:not([data-theme="light"]) .pb-app{color:rgba(235,235,245,.55)}
.pb-when{font-size: var(--fs-small);font-weight:400;color:rgba(60,60,67,.55);flex:none}
html:not([data-theme="light"]) .pb-when{color:rgba(235,235,245,.45)}
.pb-title{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;
  font-size: var(--fs-h3);font-weight:600;letter-spacing:-.01em;line-height:1.25;
  color:#000;margin: 0}
html:not([data-theme="light"]) .pb-title{color:#fff}
.pb-text{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;
  font-size: var(--fs-body);font-weight:400;line-height:1.3;margin-top: 1px;
  color:rgba(60,60,67,.85);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
html:not([data-theme="light"]) .pb-text{color:rgba(235,235,245,.78)}

.tg-sync{display:flex;gap: var(--s2);align-items:flex-start;padding: var(--s3) var(--s3);margin: 0 2px var(--s2);border-radius:var(--r-md);
  background:linear-gradient(135deg,rgba(34,158,217,.12),rgba(34,158,217,.03));border:1px solid rgba(34,158,217,.28)}
.tg-syncdot{flex:none;width:8px;height:8px;margin-top: var(--s1);border-radius:50%;background:#229ED9;box-shadow:0 0 0 0 rgba(34,158,217,.6);animation:pulse-tg 1.8s infinite}
@keyframes pulse-tg{70%{box-shadow:0 0 0 7px rgba(34,158,217,0)}100%{box-shadow:0 0 0 0 rgba(34,158,217,0)}}
.tg-sync-tx b{display:block;font-size: var(--fs-small);font-weight:700}
.tg-sync-tx small{font-size: var(--fs-tiny);color:var(--muted);line-height:1.4}
.tg-onboard{margin: 0 2px var(--s3);padding: var(--s3);border-radius:var(--r-lg);background:var(--surface-2);border:1px solid var(--line-2);box-shadow:var(--elev-1)}
.tg-onboard-compact{margin-top: 0;padding: var(--s3)}
.tg-onboard-top{display:flex;gap: var(--s3);align-items:flex-start;margin-bottom: var(--s3)}
.tg-onboard-ic{width:22px;height:22px;flex:none;color:#5ab6e8;fill:currentColor;stroke:none;margin-top: 2px}
.tg-onboard-tx b{display:block;font-family:var(--display);font-size: var(--fs-body);font-weight:800;letter-spacing:-.02em;margin-bottom: var(--s1)}
.tg-onboard-tx small{display:block;font-size: var(--fs-tiny);color:var(--muted);line-height:1.45}
.tg-onboard-cta{display:flex;align-items:center;justify-content:center;gap: var(--s2)}
.tg-onboard-cta svg{width:16px;height:16px;fill:currentColor;stroke:none}
.tg-coach-card{position:relative;overflow:hidden;border-color:rgba(210,168,70,.34);background:linear-gradient(145deg,rgba(210,168,70,.11),var(--surface-2) 58%)}
.tg-coach-card::before{content:"";position:absolute;inset:0 12% auto;height:1px;background:linear-gradient(90deg,transparent,rgba(210,168,70,.72),transparent)}
.tg-coach-card .tg-onboard-ic{color:var(--gold)}
.tg-coach-card .tg-onboard-tx b{font-size:calc(var(--fs-body) + 1px)}
.tg-coach-card .tg-onboard-cta{min-height:46px}
.coach-fb{margin: var(--s2) 2px var(--s3);padding: var(--s4)}
.coach-fb .coach-fb-q{margin: var(--s2) 0 var(--s2)}
.coach-fb [data-coach-fb-status]{margin: 0 0 var(--s4)}
.player{position:relative;border-radius:var(--r-md);overflow:hidden;height:200px;background:#000;border:1px solid var(--line)}
.tv-chart{position:relative;height:248px;border-radius:14px;overflow:hidden;border:1px solid var(--line-2);background:#0b0c11}
.tv-chart iframe{border:0;display:block}
.tv-load{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap: var(--s2);font-size: var(--fs-small);color:var(--muted)}
.tv-load .ic{width:15px;height:15px;color:var(--gold);opacity:.7}
.player canvas{position:absolute;inset:0;width:100%;height:100%}
.player-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
.player-real{height:min(80vw,384px)}
.edu-stage.vp-stage.player-real{height:auto;max-height:min(68vh,460px)}
.player .controls{position:absolute;left:0;right:0;bottom:0;padding: var(--s3) var(--s3);background:linear-gradient(to top,rgba(0,0,0,.85),transparent);z-index:2}
.player .bar{height:4px;border-radius:3px;background:rgba(255,255,255,.2);overflow:hidden;margin-bottom: var(--s2)}
.player .bar i{display:block;height:100%;width:34%;background:var(--gold)}
.player .crow{display:flex;align-items:center;gap: var(--s3);font-family:var(--mono);font-size: var(--fs-tiny)}
.player .crow svg{width:18px;height:18px;fill:var(--text)}
.player .big-play{position:absolute;inset:0;display:grid;place-items:center;z-index:1}
.player .big-play span{
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(155deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,.08) 42%,rgba(255,255,255,.04) 100%);
  -webkit-backdrop-filter:blur(20px) saturate(1.8);
  backdrop-filter:blur(20px) saturate(1.8);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(255,255,255,.08),
    0 8px 24px rgba(0,0,0,.28);
}
.player .big-play svg{width:18px;height:18px;fill:rgba(255,255,255,.95);margin-left: 2px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.4))}
.chapter{display:flex;gap: var(--s3);align-items:center;padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.chapter .t{font-family:var(--mono);font-size: var(--fs-tiny);color:var(--gold);width:42px}
.chapter .c{flex:1;font-size: var(--fs-small)}

/* =========================================================
   COMMUNITY
   ========================================================= */
.totw-big{position:relative;overflow:hidden;border-radius:var(--r-xl);padding: var(--s5) var(--s5);margin-top: var(--s3);
  background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--line-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 22px 48px -24px rgba(0,0,0,.8);text-align:center}
.totw-big .shine{position:absolute;top:-40%;left:-30%;width:80%;height:180%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);transform:rotate(18deg);animation:shine 5s ease-in-out infinite}
@keyframes shine{0%,100%{left:-40%}50%{left:90%}}
.totw-big .crown{display:grid;place-items:center}
.totw-big .crown svg{width:30px;height:30px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.5}
.totw-big .av{margin: var(--s1) auto var(--s3)}
.totw-big .name{font-family:var(--display);font-weight:800;font-size: var(--fs-h1)}
.totw-big .handle{font-family:var(--mono);font-size: var(--fs-small);color:var(--gold);margin-top: 2px}
.totw-big .stats{display:flex;justify-content:center;gap: var(--s6);margin-top: var(--s4)}
.totw-big .stats div b{font-family:var(--mono);font-size:18px;display:block}
.totw-big .stats div small{font-size: var(--fs-tiny);color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

.lb-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);margin-bottom: var(--s2)}
.lb-row .rank{font-family:var(--mono);font-weight:700;font-size: var(--fs-h3);width:24px;text-align:center;color:var(--muted)}
.lb-row.top .rank{color:var(--gold)}
.lb-row .rank.m1{color:#F3D277}
.lb-row .rank.m2{color:#CBD0D8}
.lb-row .rank.m3{color:#CC9359}
.lb-row .nm{flex:1;min-width:0}
.lb-row .nm b{font-family:var(--display);font-size: var(--fs-body);font-weight:600;display:block}
.lb-row .nm small{font-size: var(--fs-tiny);color:var(--muted)}
.lb-row .pts{font-family:var(--mono);font-weight:700;font-size: var(--fs-body);color:var(--gold)}
.lb-row .delta{font-family:var(--mono);font-size: var(--fs-tiny);width:38px;text-align:right}

.post{padding: var(--s4);margin-bottom: var(--s3)}
.post-head{display:flex;align-items:center;gap: var(--s3);margin-bottom: var(--s3)}
.post-head .nm b{font-family:var(--display);font-size: var(--fs-body);font-weight:600;display:block}
.post-head .nm small{font-size: var(--fs-tiny);color:var(--muted)}
.post-body{font-size: var(--fs-h4);line-height:1.55;color:var(--text-2);margin-bottom: var(--s3)}
.post-actions{display:flex;gap: var(--s5);color:var(--muted);font-size: var(--fs-small);font-weight:600;align-items:center}
.post-actions .a{display:flex;gap: var(--s1);align-items:center}
.post-actions svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8}
.post-actions .a.liked{color:var(--gold)}.post-actions .a.liked svg{fill:var(--gold);stroke:var(--gold)}

.badges{display:flex;gap: var(--s2);overflow-x:auto;scrollbar-width:none;margin: 0 calc(var(--gutter)*-1);padding: var(--s1) var(--gutter)}
.badges::-webkit-scrollbar{display:none}
.badge-it{flex:none;width:78px;text-align:center}
.badge-it .ring2{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:26px;margin: 0 auto var(--s2);background:var(--surface-2);border:1px solid var(--line-2)}
.badge-it.on .ring2{background:linear-gradient(145deg,rgba(var(--gold-rgb),.25),rgba(var(--gold-rgb),.05));border-color:var(--gold);box-shadow:var(--glow-gold)}
.badge-it.off{opacity:.4;filter:grayscale(1)}
.badge-it .ring2 .bdg-ic{width:27px;height:27px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.6}
.badge-it small{font-size: var(--fs-tiny);color:var(--muted);line-height:1.2;display:block}

/* =========================================================
   HUBS
   ========================================================= */
.swipe-rail{display:flex;gap:var(--s3);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;margin:0 calc(var(--gutter)*-1);padding:2px var(--gutter) var(--s2)}
.swipe-rail::-webkit-scrollbar{display:none}
.swipe-rail>*{scroll-snap-align:start;flex:none}
.event-mini-list{margin-top:2px}
.hub-mini{display:flex;align-items:center;gap:var(--s3);padding:var(--s3);overflow:hidden;cursor:pointer}
/* Photo hubs: no glass blur — iOS WebKit blanks overlay text while the swipe-rail scrolls. */
.hub-mini-photo{position:relative;flex:0 0 min(78vw,286px);height:168px;padding:0;text-align:left;color:#F5F5F2;border-color:rgba(255,255,255,.18);isolation:isolate;box-shadow:var(--sh-2);-webkit-tap-highlight-color:transparent;overflow:hidden;background:var(--surface-3);background-image:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.hub-mini-photo:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.hub-mini-photo-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;background:var(--surface-3);z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;transform:translateZ(0)}
.hub-mini-photo-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,8,11,.26) 0%,rgba(7,8,11,.02) 36%,rgba(7,8,11,.88) 100%);z-index:1;pointer-events:none}
.hub-mini-photo-top{position:absolute;left:12px;right:12px;top:12px;display:flex;align-items:center;justify-content:space-between;gap:var(--s2);z-index:3;-webkit-transform:translateZ(0);transform:translateZ(0)}
.hub-mini-photo-pill{display:inline-flex;align-items:center;min-height:27px;padding:0 var(--s2);border-radius:var(--r-full);background:rgba(7,8,11,.72);border:1px solid rgba(255,255,255,.25);font-size:var(--fs-tiny);font-weight:650;color:#fff;white-space:nowrap}
.hub-mini-photo-arrow{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:rgba(7,8,11,.62);border:1px solid rgba(255,255,255,.24);color:#fff}
.hub-mini-photo-arrow .ic{width:16px;height:16px}
.hub-mini-photo-copy{position:absolute;left:14px;right:14px;bottom:13px;z-index:3;min-width:0;text-shadow:0 2px 12px rgba(0,0,0,.72);-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;pointer-events:none}
.hub-mini-photo-copy b{display:block;font-family:var(--display);font-size:var(--fs-h2);font-weight:800;line-height:1.1;letter-spacing:-.02em;color:#F5F5F2}
.hub-mini-photo-copy small{display:block;margin-top:var(--s1);font-size:var(--fs-tiny);color:rgba(255,255,255,.88);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover) and (pointer:fine){
  .hub-mini-photo-img{transition:transform .5s var(--ease-out),filter .5s ease}
  .hub-mini-photo:hover .hub-mini-photo-img,.hub-mini-photo:focus-visible .hub-mini-photo-img{transform:scale(1.04) translateZ(0);filter:saturate(1.06)}
}
.hub-mini-ic{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold)}
.hub-mini-ic .ic,.hub-mini-ic svg{width:18px;height:18px}
.hub-mini-date{text-align:center;font-family:var(--mono);flex:none;min-width:40px}
.hub-mini-date b{font-size:19px;color:var(--gold);display:block;line-height:1}
.hub-mini-date small{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.hub-mini-tx{flex:1;min-width:0}
.hub-mini-tx b{font-family:var(--display);font-size:14px;display:block}
.hub-mini-tx small{font-size:11.5px;color:var(--muted)}
.hub-mini > .ic:last-child{flex:none;width:18px;height:18px;color:var(--faint)}
.hub{position:relative;overflow:hidden;border-radius:var(--r-xl);margin-bottom: var(--s3);border:1px solid var(--line);background:var(--surface-2);box-shadow:var(--sh-2)}
.hub-img{position:relative;height:152px;background-size:cover;background-position:center}
.hub-img-g{position:absolute;inset:0;background:linear-gradient(to top,#0b0c11 0%,rgba(8,8,11,.9) 9%,rgba(8,8,11,.55) 30%,rgba(8,8,11,.05) 58%,rgba(8,8,11,.2) 100%)}
.hub .next{position:absolute;top:12px;right:12px;z-index:2}
.hub .next .pill{background:rgba(8,8,11,.6);backdrop-filter:blur(8px);border-color:rgba(var(--gold-rgb),.45);color:var(--gold-hi)}
.hub-cap{position:absolute;left:16px;right:16px;bottom:9px;z-index:2}
.hub-cap h3{font-family:var(--display);font-weight:800;font-size: var(--fs-h1);color:#F5F5F2;display:flex;align-items:center;gap: var(--s2);text-shadow:0 2px 14px rgba(0,0,0,.75)}
.hub-flag{font-size:24px;line-height:1;flex:none}
.hub-cap .loc{font-size: var(--fs-small);color:#e4e4e6;margin-top: 2px;display:flex;align-items:center;gap: var(--s1);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.hub-cap .loc .ic{color:var(--gold)}
.hub-body{padding: var(--s3) var(--s4) var(--s4)}
.hub .event{background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r-md);padding: var(--s3) var(--s3);display:flex;align-items:center;gap: var(--s3)}
.hub .event .date{text-align:center;font-family:var(--mono);flex:none}
.hub .event .date b{font-size:19px;font-weight:700;display:block;color:var(--gold);line-height:1}
.hub .event .date small{font-size: var(--fs-tiny);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.hub .event .ev-info{flex:1;min-width:0}
.hub .event .ev-info b{font-size: var(--fs-h4);font-family:var(--display);font-weight:600;display:block}
.hub .event .ev-info small{font-size: var(--fs-tiny);color:var(--muted)}
.going{display:flex;align-items:center;gap: var(--s2);margin-top: var(--s3)}
.going .faces{display:flex}
.going .faces .av{margin-left: -var(--s2);box-shadow:0 0 0 2px var(--surface-2)}
.going .faces .av:first-child{margin-left: 0}
.going small{font-size: var(--fs-tiny);color:var(--muted)}
.rsvp{margin-left: auto}

/* =========================================================
   PROFILE
   ========================================================= */
.profile-head{text-align:center;padding: var(--s4) 0 var(--s1)}
.profile-head .av{margin: 0 auto var(--s3)}
.av-ring{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;margin: 0 auto var(--s3);position:relative}
.av-ring::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--ink)}
.av-ring .av{margin: 0;position:relative;z-index:1}
.office-head .av-ring{margin: 0;flex:none}
/* profile — your numbers + next up */
.num-grid{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2)}
.num-cell{background:var(--surface-2);background-image:var(--grain);border:1px solid var(--line);border-radius:12px;padding: var(--s3) var(--s3)}
.num-cell b{font-size:18px;display:block}
.num-cell small{font-size: var(--fs-tiny);color:var(--muted)}
.sess-block{margin-top: var(--s4)}
.sess-h{font-size: var(--fs-tiny);color:var(--muted);margin-bottom: var(--s2);letter-spacing:.02em}
.sess-row{display:flex;align-items:center;gap: var(--s2);margin-bottom: var(--s2)}
.sess-row:last-child{margin-bottom: 0}
.sess-name{font-size: var(--fs-small);width:66px;flex:none}
.sess-bar{flex:1;height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.sess-bar i{display:block;height:100%;background:var(--gold);border-radius:3px}
.sess-pct{font-size: var(--fs-small);font-weight:700;width:34px;text-align:right;flex:none}
.nu-row{margin-bottom: var(--s3)}
.nu-row:last-child{margin-bottom: 0}
.nu-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom: var(--s1)}
.nu-label{font-size: var(--fs-small);font-weight:600}
.nu-val{font-size: var(--fs-tiny);color:var(--muted)}
.nu-bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.nu-bar i{display:block;height:100%;background:var(--gold);border-radius:3px}
.ph-actions{display:flex;gap: var(--s2);justify-content:center;margin-top: var(--s3)}
.modal-share-card{position:fixed;inset:0;height:100vh;height:100dvh;min-height:100vh;overflow:hidden}
.modal-share-card .sheet{max-height:min(90vh,90dvh);overscroll-behavior:contain}
.modal-menu{z-index:100}
.tcard-share-sheet{padding-bottom:var(--s2)}
.tcard-share-head{text-align:center;margin:2px auto var(--s4);max-width:320px}
.tcard-share-kicker{margin:0;color:var(--gold);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase}
.tcard-share-title{margin:4px 0 0;font-family:var(--display);font-size:25px;font-weight:800;letter-spacing:var(--tracking);line-height:1.08}
.tcard-share-sub{margin:7px 0 0;color:var(--muted);font-size:var(--fs-small);line-height:1.45}
.tcard{isolation:isolate;position:relative;overflow:hidden;aspect-ratio:1.586/1;padding:17px 18px 14px;border:1px solid rgba(var(--gold-rgb),.58);border-radius:22px;color:#F8F3E5;background-color:#080909;background-image:url("assets/share/trader-card-obsidian-gold-v2.webp");background-position:center;background-size:cover;box-shadow:inset 0 1px 0 rgba(255,246,211,.22),inset 0 -1px 0 rgba(0,0,0,.58),0 28px 58px -27px rgba(2,2,2,.92),0 10px 24px -18px rgba(var(--gold-rgb),.7)}
.tcard::before{content:"";position:absolute;z-index:-1;inset:0;background:rgba(0,0,0,.08);pointer-events:none}
.tcard-topline{display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}
.tcard-brand{display:flex;align-items:center;gap:7px;min-width:0}
.tcard-logo{width:31px;height:31px;flex:none;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.46))}
.tcard-brand-copy{display:flex;min-width:0;flex-direction:column;line-height:1;color:var(--gold-hi)}
.tcard-brand-copy b{font-family:var(--display);font-size:12px;font-weight:800;letter-spacing:.14em}
.tcard-brand-copy small{margin-top:2px;font-family:var(--mono);font-size:6px;font-weight:700;letter-spacing:.42em}
.tcard-pass{padding:5px 7px;border:1px solid rgba(var(--gold-rgb),.3);border-radius:999px;color:rgba(248,241,218,.68);background:rgba(4,4,5,.42);font-family:var(--mono);font-size:7px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap}
.tcard-member{display:flex;align-items:center;gap:11px;margin-top:15px;text-align:left}
.tcard-chip{display:grid;width:42px;height:32px;flex:none;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);overflow:hidden;border:1px solid rgba(255,237,177,.68);border-radius:8px;background:rgba(184,126,29,.82);box-shadow:inset 0 1px 0 rgba(255,248,214,.55),inset 0 -4px 9px rgba(80,48,5,.28),0 7px 15px rgba(0,0,0,.28)}
.tcard-chip i{border-right:1px solid rgba(81,48,4,.34);border-bottom:1px solid rgba(81,48,4,.34)}
.tcard-member-copy{min-width:0;flex:1}
.tcard-eyebrow{display:block;color:rgba(248,241,218,.56);font-family:var(--display);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.tcard-name{overflow:hidden;font-family:var(--display);font-size:21px;font-weight:800;line-height:1.04;letter-spacing:var(--tracking);text-overflow:ellipsis;white-space:nowrap;text-shadow:0 2px 10px rgba(0,0,0,.6)}
.tcard-lvl{display:flex;align-items:center;gap:5px;margin-top:4px;color:var(--gold-hi);font-size:11px;font-weight:650}
.tcard-card-avatar{flex:none}
.tcard-card-avatar .av{width:46px;height:46px;margin:0;font-size:14px;box-shadow:0 0 0 1px rgba(4,4,5,.9),0 0 0 2px rgba(var(--gold-rgb),.65),0 9px 18px rgba(0,0,0,.36)}
.tcard-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:14px 0 0;padding:10px 0 9px;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.1);background:rgba(4,4,5,.18)}
.tcard-stat{position:relative;min-width:0;padding:0 var(--s1);text-align:center}
.tcard-stat + .tcard-stat::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:1px;background:rgba(255,255,255,.12)}
.tcard-stats b{display:block;overflow:hidden;font-size:18px;line-height:1.08;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 2px 8px rgba(0,0,0,.55)}
.tcard-stats small{display:block;margin-top:3px;color:rgba(248,241,218,.56);font-size:7px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
.tcard-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;color:rgba(248,241,218,.62);font-family:var(--mono);font-size:8px;letter-spacing:.055em;text-transform:uppercase}
.tcard-footer>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tcard-footer-mark{width:3px;height:3px;overflow:visible!important;border-radius:50%;background:var(--gold)}
.tcard-poster-wrap{
  position:relative;width:min(100%,280px);margin:0 auto;
  aspect-ratio:1080/1350;border-radius:18px;overflow:hidden;
  background:#080909;border:1px solid rgba(var(--gold-rgb),.42);
  box-shadow:0 22px 48px -24px rgba(0,0,0,.85),0 0 0 1px rgba(255,246,211,.08);
}
.tcard-poster{display:block;width:100%;height:100%;object-fit:cover}
.tcard-poster-skel{
  position:absolute;inset:0;display:grid;place-items:center;
  padding:24px;color:rgba(248,241,218,.62);font-size:13px;text-align:center;
  background:linear-gradient(180deg,#14110c,#080909);
}
.tcard-poster[hidden],.tcard-poster-skel[hidden]{display:none}
.tcard-share-actions{display:grid;grid-template-columns:minmax(0,1fr) 108px;gap:var(--s2);margin-top:var(--s3)}
.tcard-share-actions-2{grid-template-columns:1fr 1fr}
.tcard-share-actions .btn{width:100%;min-width:0;padding:0 var(--s3)}
.tcard-caption{
  display:block;width:100%;margin-top:10px;border:0;background:none;
  color:var(--gold);font:inherit;font-size:13px;font-weight:700;cursor:pointer;
}
.tcard-caption:active{opacity:.7}
.tcard-share-primary{box-shadow:inset 0 1px 0 rgba(255,248,215,.82),inset 0 -1px 0 rgba(0,0,0,.28),0 12px 28px -12px rgba(var(--gold-rgb),.72)}
.tcard-copy{border:1px solid var(--line-2);background:var(--surface-2);color:var(--text);font-family:var(--body);font-size:var(--fs-small);font-weight:700;box-shadow:var(--elev-1)}
.tcard-copy:active:not(:disabled){transform:scale(.975);background:var(--surface-3)}
.tcard-copy:focus-visible,.tcard-share-primary:focus-visible{outline:2px solid rgba(var(--gold-rgb),.64);outline-offset:3px}
.tcard-copy:disabled{opacity:.55;cursor:not-allowed}
.tcard-share-privacy{display:flex;align-items:flex-start;justify-content:center;gap:6px;margin:var(--s3) auto 0;max-width:320px;color:var(--faint);font-size:var(--fs-tiny);line-height:1.42;text-align:center}
.tcard-share-privacy .ic{width:13px;height:13px;flex:none;margin-top:1px;color:var(--gold)}
[data-theme="light"] .tcard .up{color:#3FBF7F}[data-theme="light"] .tcard .down{color:#F56B6E}
@media (max-width:360px){.tcard{padding:14px 14px 11px;border-radius:19px}.tcard-logo{width:27px;height:27px}.tcard-brand-copy b{font-size:10px}.tcard-pass{font-size:6px}.tcard-member{gap:8px;margin-top:11px}.tcard-chip{width:36px;height:28px}.tcard-name{font-size:18px}.tcard-card-avatar .av{width:40px;height:40px}.tcard-stats{margin-top:10px;padding:7px 0}.tcard-stats b{font-size:16px}.tcard-footer{margin-top:6px;font-size:7px}.tcard-share-actions{grid-template-columns:minmax(0,1fr) 96px}.tcard-share-actions .btn{font-size:12px;padding-inline:var(--s2)}}
.profile-head .name{font-family:var(--display);font-weight:800;font-size:23px}
.profile-head .handle{font-family:var(--mono);font-size: var(--fs-small);color:var(--gold);margin-top: var(--s1)}
.level{margin-top: var(--s4);padding: var(--s4)}
.level-bar{height:8px;border-radius:5px;background:var(--surface-3);overflow:hidden;margin: var(--s3) 0 var(--s2)}
.level-bar i{display:block;height:100%;background:var(--gold-foil)}
.kv{display:flex;justify-content:space-between;font-size: var(--fs-small);color:var(--muted)}
.kv b{font-family:var(--mono);color:var(--text)}
.settings-row{display:flex;align-items:center;gap: var(--s3);width:100%;box-sizing:border-box;padding: var(--s4) var(--s3);border-bottom:1px solid var(--line);text-align:left}
button.settings-row{width:100%;appearance:none;-webkit-appearance:none}
.settings-row svg,.settings-row > .ic{width:20px;height:20px;flex:none;stroke:var(--gold);fill:none;stroke-width:1.7}
.settings-row .lbl{flex:1;min-width:0;font-size: var(--fs-body);font-weight:500}
.settings-row .val{font-size: var(--fs-small);color:var(--muted);white-space:nowrap;flex:none}
.settings-row .row-chev,.settings-row > svg:last-child,.settings-row > .ic:last-child{margin-left:auto;width:18px;height:18px;stroke:var(--faint);color:var(--faint)}
.settings-row.tap{cursor:pointer}
.settings-row.tap:active{opacity:.7}
.toggle{width:46px;height:28px;padding: 0;border-radius:999px;background:var(--surface-3);border:1px solid var(--line-2);position:relative;transition:background .25s;cursor:pointer;flex:none}
.toggle.on{background:var(--gold)}
.toggle i{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.toggle.on i{transform:translateX(18px)}

.journal{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.journal .res{font-family:var(--mono);font-weight:700;font-size: var(--fs-body);width:64px;text-align:right}
.journal .jp{flex:1}
.journal .jp b{font-family:var(--display);font-size: var(--fs-h4);font-weight:600;display:block}
.journal .jp small{font-size: var(--fs-tiny);color:var(--muted)}

/* toast */
.toast{position:absolute;left:50%;bottom:calc(var(--tabbar-h) + 16px);transform:translateX(-50%) translateY(10px) scale(.97);z-index:90;
  background:var(--surface-3);border:1px solid var(--line-2);color:var(--text);padding: var(--s3) var(--s4);border-radius:var(--r-full);
  font-size: var(--fs-small);font-weight:600;display:flex;align-items:center;gap: var(--s2);box-shadow:var(--sh-2);opacity:0;pointer-events:none;transition:transform var(--dur-sheet,.26s) var(--ease-out,cubic-bezier(.16,1,.3,1)),opacity var(--dur-fade,.16s) ease;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
.toast svg{width:17px;height:17px;color:var(--gold)}

.spacer{height:calc(16px + env(safe-area-inset-bottom, 0px))}

/* notifications */
.notif{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);margin-bottom: var(--s2);cursor:pointer;transition:transform .15s;content-visibility:auto;contain-intrinsic-size:auto 64px}
.notif:active{transform:scale(.99)}
.notif.unread{background:rgba(var(--gold-rgb),.06);border-left:3px solid var(--gold)}
.notif .nicon{width:18px;height:18px;flex:none;color:var(--muted);fill:none;stroke:currentColor;stroke-width:1.7;margin-top: 1px}
.notif.unread .nicon{color:var(--gold)}
.notif .ntext{flex:1;font-size: var(--fs-h4);line-height:1.4}
.notif .ntime{font-size: var(--fs-tiny);color:var(--muted);flex:none}
.notif-jump{
  position:absolute;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%);
  z-index:6;margin:0;padding:8px 14px;border-radius:999px;border:1px solid var(--gold-line);
  background:var(--surface-2);color:var(--gold);font-family:var(--display);font-size:12px;font-weight:750;
  letter-spacing:-.01em;box-shadow:0 10px 24px -16px rgba(0,0,0,.8);
}
.notif-jump[hidden]{display:none}
.notif-jump:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:3px}
.notif-jump:active{transform:translateX(-50%) scale(.98)}
.back-btn svg{transform:rotate(180deg)}

/* progress fills — animateFills() drives width 0 → data-fill */
.level-bar i,.sess-bar i,.nu-bar i,.chal-bar i,.player .bar i{
  width:0;will-change:width
}

/* signals — telegram channels */
.chan{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);border-radius:var(--r-lg);background:var(--surface-2);border:1px solid var(--line);margin-bottom: var(--s3);box-shadow:var(--sh-1);transition:transform .15s;cursor:pointer}
.chan:active{transform:scale(.99)}
/* frost the standalone glass surfaces (Liquid Glass redesign) */
.marketbar,.stat,.lb-row,.notif,.chan{background-image:var(--grain);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-color:var(--line-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(0,0,0,.28),0 16px 40px -22px rgba(7,5,2,.76)}
.chan-mark{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size: var(--fs-h3);flex:none;color:var(--on-accent);background:var(--gold-foil);background-size:160% auto}
.chan-mark.quiet{background:var(--surface-3);color:var(--gold);border:1px solid var(--line-2)}
.chan-mark.bot{background:linear-gradient(145deg,#1d2733,#0f1620);border:1px solid rgba(127,208,255,.25);font-size: var(--fs-h1)}
.chan-mark.big{width:58px;height:58px;border-radius:17px;font-size:20px}
/* real channel profile pictures */
.chan-mark.has-img{background:#000;padding: 0;overflow:hidden;border:1px solid var(--line-2)}
.chan-mark.has-img img{width:100%;height:100%;object-fit:cover;display:block}
.chan-body{flex:1;min-width:0}
.chan-top{display:flex;align-items:center;gap: var(--s2)}
.chan-top b{font-family:var(--display);font-size: var(--fs-h3);font-weight:700}
.tg-badge{display:inline-flex;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);font-weight:600;color:#5ab6e8;background:rgba(90,182,232,.12);border:1px solid rgba(90,182,232,.25);padding: 2px var(--s2);border-radius:999px;flex:none}
.tg-badge svg{width:11px;height:11px;fill:currentColor;stroke:none}
.chan-desc{font-size: var(--fs-small);color:var(--muted);margin: var(--s1) 0 var(--s1);line-height:1.4}
.chan-meta{font-size: var(--fs-tiny);color:var(--faint);display:flex;align-items:center;gap: var(--s1);flex-wrap:wrap}
.chan-meta .num{color:var(--muted)}
.chan-head{display:flex;align-items:center;gap: var(--s3);padding: var(--s1) 2px}
.chan-title{font-family:var(--display);font-weight:800;font-size:21px;display:flex;align-items:center;gap: var(--s2)}
.chan-handle{font-size: var(--fs-small);color:var(--gold);margin-top: 2px}
.chan-stats{display:flex;gap: var(--s2);margin-top: var(--s3)}
.chan-stats>div{flex:1;background:var(--surface-2);background-image:var(--grain);border:1px solid var(--line);border-radius:var(--r-md);padding: var(--s3);text-align:center}
.chan-stats b{font-size:18px;display:block}
.chan-stats small{font-size: var(--fs-tiny);color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-top: var(--s1);display:block}

/* took-it / didn't-take toggle on each signal */
.took{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-top: var(--s3);padding-top: var(--s3);border-top:1px solid var(--line)}
.took-q{font-size: var(--fs-small);color:var(--muted);font-weight:500}
.took-btns{display:flex;gap: var(--s2)}
.took-btn{display:inline-flex;align-items:center;gap: var(--s1);height:34px;padding: 0 var(--s3);border-radius:var(--r-full);background:var(--surface-3);border:1px solid var(--line-2);color:var(--muted);font-family:var(--mono);font-size: var(--fs-small);font-weight:700;transition:transform .15s,background .2s,border-color .2s,color .2s}
.took-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.took-btn:active{transform:scale(.93)}
.took-btn.up.on{background:rgba(63,191,127,.16);border-color:rgba(63,191,127,.45);color:var(--up)}
.took-btn.down.on{background:rgba(240,86,91,.14);border-color:rgba(240,86,91,.4);color:var(--down)}

/* circle: segmented control */
.seg{display:flex;gap: var(--s1);background:var(--surface-2);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--line-2);border-radius:var(--r-full);padding: var(--s1);margin: var(--s1) 0 var(--s4)}
.seg-btn{flex:1;min-height:44px;height:44px;border-radius:var(--r-full);font-family:var(--display);font-weight:600;font-size: var(--fs-small);color:var(--muted);border:1px solid transparent;transition:color .2s,background .2s,border-color .2s}
.seg-btn.on{background:rgba(var(--gold-rgb),.16);color:var(--gold);border:1px solid rgba(var(--gold-rgb),.32);font-weight:700;box-shadow:inset 0 1px 0 rgba(246,227,172,.12)}

/* Journal Mindset — the four destinations stay discoverable as a calm 2×2 control. */
#circle-body #jseg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s1);row-gap:var(--s3);border-radius:var(--r-lg);}
#circle-body #jseg .seg-btn{width:100%;min-width:0;}
html.jtour-intro #circle-body #jseg .seg-btn.on{background:transparent;color:var(--muted);border-color:transparent;font-weight:600;box-shadow:none}
.mindset-form{display:flex;flex-direction:column;gap:var(--s3)}
.mindset-hero{border-color:var(--gold-line);background:linear-gradient(135deg,var(--surface-2),rgba(var(--gold-rgb),.07));}
.mindset-hero h2{margin:var(--s2) 0 var(--s2);max-width:460px;font-size:clamp(24px,6vw,32px);line-height:1.08;letter-spacing:-.035em}
.mindset-hero-row{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3)}
.mindset-date{display:block;margin-top:var(--s3);font-size:var(--fs-small);color:var(--muted)}
.mindset-status,.mindset-history-state{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:30px;padding:0 var(--s3);border:1px solid var(--gold-line);border-radius:var(--r-full);font-size:var(--fs-tiny);font-weight:800;letter-spacing:.03em;color:var(--gold)}
.mindset-status.is-complete,.mindset-history-state.is-complete{color:var(--up);border-color:color-mix(in srgb,var(--up) 42%,transparent);background:color-mix(in srgb,var(--up) 10%,transparent)}
.mindset-section{border-color:var(--line);background:var(--surface-2)}
.mindset-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3);margin-bottom:var(--s2)}
.mindset-section-head h3{margin:4px 0 0;font-size:var(--fs-h3);line-height:1.25}
.mindset-creed{margin:0 0 var(--s3);max-width:34em}
.mindset-creed p{margin:0 0 .5em;font-size:var(--fs-small);line-height:1.55;color:var(--text-2)}
.mindset-creed p:last-child{margin-bottom:0;font-family:var(--display);font-weight:800;letter-spacing:-.02em;color:var(--text)}
.mindset-creed b{font-family:var(--display);font-weight:800;letter-spacing:-.02em;text-transform:uppercase;color:var(--text)}
.mindset-step{flex:none;color:var(--faint);font-size:var(--fs-tiny);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.mindset-prompt{display:flex;flex-direction:column;gap:6px;margin-top:var(--s3);padding:var(--s3);border-left:3px solid var(--gold);border-radius:0 var(--r-md) var(--r-md) 0;background:var(--surface-3)}
.mindset-prompt span,.mindset-helper{color:var(--muted);font-size:var(--fs-tiny);line-height:1.45}
.mindset-prompt b{font-family:var(--display);font-size:var(--fs-body);line-height:1.4;color:var(--text)}
.mindset-inline-actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
.mindset-textarea{height:auto;min-height:76px;padding-top:16px;padding-bottom:16px;resize:vertical;line-height:1.45}
.mindset-affirmation-input{min-height:92px}
.mindset-helper{display:block;margin-top:var(--s2)}
.mindset-commitments{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s3)}
.mindset-commitment{display:flex;align-items:flex-start;gap:var(--s2)}
.mindset-number{display:grid;place-items:center;flex:none;width:30px;height:30px;margin-top:10px;border:1px solid var(--gold-line);border-radius:50%;color:var(--gold);font-family:var(--mono);font-size:var(--fs-small);font-weight:800}
.mindset-commitment-fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--s2)}
.mindset-commitment-text{height:auto;min-height:76px;padding-top:16px;padding-bottom:16px;resize:none;line-height:1.4}
.mindset-category{height:42px;font-size:var(--fs-small)}
.mindset-save-row{display:flex;flex-direction:column;gap:var(--s2);margin:var(--s1) 0 var(--s3)}
.mindset-trigger-fields{display:flex;flex-direction:column;gap:var(--s2);margin-top:var(--s3)}
.mindset-draft-status{min-height:18px;text-align:center;color:var(--muted);font-size:var(--fs-tiny)}
.mindset-tabs{display:flex;gap:var(--s2);margin:0 0 var(--s3)}
.mindset-tab{min-height:40px;padding:0 var(--s3);border:1px solid var(--line-2);border-radius:var(--r-full);background:var(--surface-2);color:var(--muted);font-size:var(--fs-small);font-weight:700;cursor:pointer}
.mindset-tab.is-on{border-color:var(--gold-line);background:rgba(var(--gold-rgb),.12);color:var(--gold)}
.mindset-choice-group{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--line)}
.mindset-question{display:block;margin-bottom:var(--s2);font-size:var(--fs-small);font-weight:700;color:var(--text)}
.mindset-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}
.mindset-choice{min-height:44px;padding:0 6px;border:1px solid var(--line-2);border-radius:var(--r-md);background:var(--surface-3);color:var(--muted);font-size:var(--fs-tiny);font-weight:800;cursor:pointer}
.mindset-choice.is-selected.is-kept{border-color:color-mix(in srgb,var(--up) 52%,transparent);background:color-mix(in srgb,var(--up) 12%,transparent);color:var(--up)}
.mindset-choice.is-selected.is-partial{border-color:var(--gold-line);background:rgba(var(--gold-rgb),.14);color:var(--gold)}
.mindset-choice.is-selected.is-missed{border-color:color-mix(in srgb,var(--down) 52%,transparent);background:color-mix(in srgb,var(--down) 12%,transparent);color:var(--down)}
.mindset-review-list{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s3)}
.mindset-review-row{padding-top:var(--s3);border-top:1px solid var(--line)}
.mindset-review-row:first-child{padding-top:0;border-top:0}
.mindset-review-title{display:flex;align-items:flex-start;gap:var(--s2);line-height:1.4}
.mindset-review-title .mindset-number{margin-top:0}
.mindset-review-title b{padding-top:5px;font-size:var(--fs-body)}
.mindset-review-row .mindset-choices{margin-top:var(--s2)}
.mindset-review-row .mindset-textarea{margin-top:var(--s2);min-height:62px}
.mindset-locked-list{display:flex;flex-direction:column;gap:var(--s2);margin-top:var(--s3)}
.mindset-locked-row{display:flex;align-items:flex-start;gap:var(--s2);padding:var(--s2) 0;border-bottom:1px solid var(--line)}
.mindset-locked-row:last-child{border-bottom:0}
.mindset-locked-row .mindset-number{margin-top:0}
.mindset-locked-row b{display:block;font-size:var(--fs-body);line-height:1.4}
.mindset-locked-row small,.mindset-history-row small{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-tiny);line-height:1.4}
.mindset-result.is-kept{color:var(--up)}
.mindset-result.is-partial{color:var(--gold)}
.mindset-result.is-missed{color:var(--down)}
.mindset-affirmation-display{margin:var(--s3) 0 0;font-family:var(--display);font-size:var(--fs-h3);font-weight:700;line-height:1.35;color:var(--text)}
.mindset-promise-display{margin:var(--s3) 0 0;font-size:var(--fs-h3);line-height:1.35}
.mindset-score{display:flex;align-items:baseline;gap:var(--s2);margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line)}
.mindset-score span{color:var(--muted);font-size:var(--fs-small)}
.mindset-score b{font-family:var(--mono);font-size:28px;color:var(--gold)}
.mindset-score small{width:100%;color:var(--muted);font-size:var(--fs-tiny)}
.mindset-reflection p{margin:var(--s2) 0 0;line-height:1.55}
.mindset-reflection small{display:block;margin-top:var(--s3);color:var(--muted);line-height:1.5}
.mindset-history-list{display:flex;flex-direction:column;gap:var(--s2)}
.mindset-history-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);padding:var(--s3);border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2);cursor:pointer;transition:border-color .18s,background .18s,transform .18s}
.mindset-history-row:hover{border-color:var(--gold-line);background:var(--surface-3)}
.mindset-history-row:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px;border-color:var(--gold-line)}
.mindset-history-copy{flex:1;min-width:0}
.mindset-history-row b{display:block;margin-top:4px;font-size:var(--fs-body);line-height:1.35}
.mindset-history-state{width:30px;height:30px;padding:0;border-color:var(--line-2);color:var(--faint);font-size:18px}
.mindset-history-arrow{flex:none;color:var(--gold);font-family:var(--display);font-size:22px;line-height:1}
.mindset-history-delete{flex:none;min-height:32px;padding:0 8px;border:1px solid color-mix(in srgb,var(--down) 42%,transparent);border-radius:var(--r-full);background:color-mix(in srgb,var(--down) 8%,transparent);color:var(--down);font-size:10px;font-weight:700;cursor:pointer}
.mindset-history-delete:hover{background:color-mix(in srgb,var(--down) 14%,transparent);border-color:color-mix(in srgb,var(--down) 60%,transparent)}
.mindset-history-delete:focus-visible{outline:2px solid color-mix(in srgb,var(--down) 65%,transparent);outline-offset:2px}
.mindset-history-actions{display:flex;flex-direction:column;gap:var(--s2);margin:var(--s1) 0 var(--s3)}
.mindset-history-delete-action{color:var(--down);border-color:color-mix(in srgb,var(--down) 42%,transparent)}
.mindset-history-label{margin:var(--s3) 0 0;color:var(--muted);font-size:var(--fs-tiny);font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.mindset-history-copy-text{margin-top:var(--s1)}
.mindset-history-evidence{display:block;margin-top:var(--s2);color:var(--muted);line-height:1.5}
.mindset-history-detail{display:flex;flex-direction:column;gap:var(--s3)}
.mindset-history-detail .mindset-history-actions{margin:0}
.mindset-history-detail .mindset-privacy{margin:0}
.mindset-empty{text-align:center;padding:var(--s5) var(--s4)}
.mindset-empty h3{margin:var(--s2) 0 var(--s4);font-size:var(--fs-h3);line-height:1.3}
.mindset-privacy{margin:var(--s3) 0 var(--s5);color:var(--faint);font-size:var(--fs-tiny);text-align:center}
@media (max-width:380px){
  #circle-body #jseg .seg-btn{font-size:12px}
  .mindset-hero h2{font-size:24px}
  .mindset-section-head h3{font-size:16px}
  .mindset-choice{font-size:11px}
}
@media (prefers-reduced-motion:reduce){
  .mindset-choice,.mindset-tab{transition:none}
}

/* journal stats + equity */
.jstats{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2)}
.jstat{background:var(--surface-2);background-image:var(--grain);border:1px solid var(--line);border-radius:var(--r-md);padding: var(--s3) var(--s3)}
.jstat b{font-family:var(--mono);font-size:21px;font-weight:700;display:block;line-height:1.1}
.jstat small{font-size: var(--fs-tiny);color:var(--muted);letter-spacing:.04em;margin-top: var(--s1);display:block}
.journal-bal{margin-bottom: var(--s3)}
.journal-bal-row{display:flex;align-items:flex-end;justify-content:space-between;gap: var(--s3)}
.journal-bal-amt{display:block;font-family:var(--display);font-size:26px;font-weight:700;letter-spacing:-.03em;margin-top: var(--s1)}
.journal-bal-edit{border:1px solid var(--line-2);background:var(--surface-2);color:var(--text-2);font-size: var(--fs-tiny);font-weight:700;padding: var(--s2) var(--s3);border-radius:999px;cursor:pointer;flex:none}
.journal-bal-edit:active{opacity:.85}
.equity-card{margin-top: var(--s3)}
.eq-head{display:flex;align-items:center;justify-content:space-between;margin-bottom: var(--s2)}
#equity-cv{width:100%;height:96px;display:block}

/* journal entry cards */
.jcard{padding: var(--s4);margin-bottom: var(--s3);cursor:pointer;transition:transform .15s}
.jcard:active{transform:scale(.99)}
.jc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom: var(--s2)}
.jc-pair{display:flex;align-items:center;gap: var(--s2)}
.jc-pair b{font-family:var(--display);font-weight:800;font-size:16px}
.jc-meta{font-family:var(--mono);font-size: var(--fs-tiny);color:var(--gold);margin-bottom: var(--s2)}
.jc-note{font-size: var(--fs-small);line-height:1.5;color:var(--text-2);margin-bottom: var(--s3)}
.jc-tags{display:flex;flex-wrap:wrap;gap: var(--s1)}
.jtag{font-size: var(--fs-tiny);font-weight:600;padding: var(--s1) var(--s2);border-radius:var(--r-full);background:var(--surface-3);border:1px solid var(--line);color:var(--muted)}
.jtag.good{color:var(--up);background:rgba(63,191,127,.1);border-color:rgba(63,191,127,.25)}
.jtag.bad{color:var(--down);background:rgba(240,86,91,.1);border-color:rgba(240,86,91,.25)}

/* log-trade form */
.flabel{display:block;font-size: var(--fs-tiny);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin: var(--s3) 2px var(--s2)}
.finput{width:100%;height:50px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);padding: 0 var(--s4);color:var(--text);font-family:var(--body);font-size:16px;-webkit-appearance:none}
.finput:focus{outline:none;border-color:var(--gold)}
.finput.num{font-family:var(--mono)}
/* Mindset textareas need their own vertical rhythm after the shared input reset. */
.mindset-textarea{padding-top:16px;padding-bottom:16px}
.mindset-commitment-text{padding-top:16px;padding-bottom:16px}
.ftext{height:90px;padding: var(--s3) var(--s4);line-height:1.5;resize:none}
.f-weighted{margin: var(--s2) 2px 0;font-family:var(--mono);font-size: var(--fs-small);color:var(--muted)}
.f-weighted b{font-size: var(--fs-body);margin-left: 2px}
.f-weighted.up b{color:var(--up)} .f-weighted.down b{color:var(--down)}
.fchips{display:flex;gap: var(--s2)}
.fchip{flex:1;height:44px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);color:var(--muted);font-weight:600;font-size: var(--fs-small);transition:background .2s,border-color .2s,color .2s}
.fchip.on{background:rgba(var(--gold-rgb),.14);border-color:var(--gold);color:var(--gold)}
.jb-currency{margin:var(--s1) 0 var(--s3)}
.jb-currency .fchip{height:48px;padding:0 var(--s2)}
/* country dropdown (onboarding "where are you based?") */
.fselect-wrap{position:relative}
.fselect-wrap::after{content:"";position:absolute;right:17px;top:50%;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:translateY(-68%) rotate(45deg);pointer-events:none}
.fselect{width:100%;height:50px;border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);padding: 0 var(--s8) 0 var(--s4);color:var(--text);font-family:var(--body);font-size:16px;-webkit-appearance:none;appearance:none}
.fselect:focus{outline:none;border-color:var(--gold)}
.fselect option{background:var(--surface-2);color:var(--text)}
/* Mindset category picker — a native select with the same deliberate chrome as
   the surrounding commitment fields. The OS still owns the opened menu on iOS,
   but color-scheme + themed options keep that menu in the right family. */
.fselect.mindset-category{
  height:52px;
  padding:0 44px 0 var(--s4);
  border-color:var(--line-2);
  border-radius:var(--r-md);
  background-color:var(--surface-2);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2.5 4.25 3.5 3.5 3.5-3.5' fill='none' stroke='%23E0B23C' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 72%);
  background-repeat:no-repeat;
  background-position:right 15px center,0 0;
  background-size:12px 12px,100% 100%;
  color:var(--text);
  font-size:var(--fs-body);
  font-weight:650;
  letter-spacing:var(--tracking-body);
  color-scheme:dark;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
  transition:border-color .18s var(--ease-out),background-color .18s var(--ease-out),box-shadow .18s var(--ease-out),transform .14s var(--ease-spring);
}
.fselect.mindset-category:hover{border-color:var(--gold-line)}
.fselect.mindset-category:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(var(--gold-rgb),.16),inset 0 1px 0 rgba(255,255,255,.07)}
.fselect.mindset-category:active{transform:scale(.992)}
.fselect.mindset-category option{background:var(--surface);color:var(--text);font-weight:550}
[data-theme="light"] .fselect.mindset-category{
  color-scheme:light;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2.5 4.25 3.5 3.5 3.5-3.5' fill='none' stroke='%236F5818' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,0) 72%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}
[data-theme="light"] .fselect.mindset-category option{background:#fff;color:var(--text)}
.you-tag{font-family:var(--mono);font-size:9px;font-weight:700;color:var(--on-accent);background:var(--gold);padding: 1px var(--s1);border-radius:999px;margin-left: var(--s1);vertical-align:middle}

/* signal card chart + source label + verified badge + risk banner */
.sig-chart{position:relative;height:102px;border-radius:12px;overflow:hidden;border:1px solid var(--line-2);margin: var(--s3) 0;background:linear-gradient(180deg,#12141a 0%,#0a0a0e 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,0.04)}
.sig-chart canvas{position:absolute;inset:0;width:100%;height:100%}
.sig-src{position:absolute;top:7px;left:8px;font-size: var(--fs-tiny);font-weight:600;color:var(--text);background:rgba(8,8,11,.62);backdrop-filter:blur(6px);border:1px solid var(--line);padding: 2px var(--s2);border-radius:999px;display:inline-flex;align-items:center;gap: var(--s1);z-index:2}
.sig-src.bot{color:#8fd0ff;border-color:rgba(127,208,255,.32)}
.sig-live{position:absolute;top:7px;right:8px;font-size: var(--fs-tiny);font-weight:700;color:var(--gold);background:rgba(8,8,11,.62);backdrop-filter:blur(6px);border:1px solid var(--gold-line);padding: 2px var(--s2);border-radius:999px;display:inline-flex;align-items:center;gap: var(--s1);z-index:2}
.sig-live .ic{width:12px;height:12px}
.vchk{display:inline-grid;place-items:center;width:13px;height:13px;border-radius:50%;background:var(--gold);color:var(--on-accent);font-size: var(--fs-tiny);font-weight:800;flex:none}
.tg-link{display:flex;align-items:center;justify-content:center;gap: var(--s2);width:100%;margin-top: var(--s3);color:#5ab6e8;font-size: var(--fs-small);font-weight:600;padding: var(--s2);background:none}
.tg-link svg{width:14px;height:14px;fill:currentColor;stroke:none}
.nfa{display:flex;align-items:center;gap: var(--s2);font-size: var(--fs-tiny);font-weight:500;color:#d8b46a;background:rgba(var(--gold-rgb),.08);border:1px solid rgba(var(--gold-rgb),.2);border-radius:var(--r-sm);padding: var(--s2) var(--s3);margin: 2px 0 var(--s3)}
.nfa-snug{margin-bottom: var(--s1)}

/* ── glossary (categorized + search) ── */
.gloss-search{margin: 2px 0 var(--s3);height:46px}
.gloss-cat{font-size: var(--fs-tiny);text-transform:uppercase;letter-spacing:.1em;color:var(--gold);font-weight:700;margin: var(--s5) 2px var(--s2)}
.gloss-cat:first-child{margin-top: var(--s1)}
.gloss-empty{text-align:center;color:var(--muted);font-size: var(--fs-small);padding: var(--s6) 0}

/* ── account & security ── */
.acct-card{background-color:var(--surface-2);background-image:var(--grain);border:1px solid var(--line-2);border-radius:var(--r-lg);padding: var(--s4);margin: var(--s1) 0 var(--s1);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.acct-id{display:flex;align-items:center;gap: var(--s3)}
.acct-meta b{font-family:var(--display);font-weight:700;font-size: var(--fs-h2);display:block;letter-spacing:-.01em}
.acct-meta small{font-size: var(--fs-small);color:var(--muted)}
.acct-tags{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-top: var(--s3);flex-wrap:wrap}
.acct-free{font-size: var(--fs-tiny);color:var(--muted);font-family:var(--mono)}
.acct-h{font-size: var(--fs-tiny);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700;margin: var(--s4) 2px var(--s2)}
.settings-disclosure{color:var(--text)}
.settings-disclosure[aria-expanded="false"]{border-bottom-color:transparent}
.settings-disclosure .disclosure-chev{transition:transform .2s var(--ease-spring)}
.settings-disclosure[aria-expanded="true"] .disclosure-chev{transform:rotate(90deg)}
.settings-disclosure:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:var(--r-sm)}

/* ── training hub: real venue + weekly schedule ── */
.hub-tag{font-style:italic;color:var(--muted);font-size: var(--fs-small);line-height:1.45;margin-bottom: var(--s3)}
.hub-facts{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding: 2px var(--s3);margin-bottom: var(--s3)}
.hf{display:flex;align-items:flex-start;gap: var(--s3);padding: var(--s2) 0;border-bottom:1px solid var(--line)}
.hf:last-child{border-bottom:none}
.hf svg{width:18px;height:18px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.7;flex:none;margin-top: 1px}
.hf b{display:block;font-size: var(--fs-small);font-weight:600}
.hf small{font-size: var(--fs-small);color:var(--muted);line-height:1.4}
.hub-cta-row{display:flex;gap: var(--s2)}
.hub-cta-row .btn{flex:1}
.hsc-day{padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.hsc-day:last-child{border-bottom:none}
.hsc-day.closed{opacity:.6}
.hsc-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom: var(--s2)}
.hsc-head b{font-family:var(--display);font-weight:700;font-size: var(--fs-body)}
.hsc-head span{font-family:var(--mono);font-size: var(--fs-tiny);color:var(--gold);font-weight:600}
.hsc-items{list-style:none;margin: 0;padding: 0;display:flex;flex-direction:column;gap: var(--s1)}
.hsc-items li{font-size: var(--fs-small);color:var(--muted);line-height:1.4;padding-left: var(--s4);position:relative}
.hsc-items li::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:var(--gold);opacity:.75}

/* ── light-mode targeted overrides (hardcoded-dark chrome) ── */
[data-theme="light"] .tabbar{background:rgba(255,255,255,0.64);border-color:rgba(22,20,14,0.12);box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),inset 0 -1px 0 rgba(22,20,14,0.08),0 18px 42px -16px rgba(22,20,14,0.22)}
[data-theme="light"] .tv-chart{background:#fff}
[data-theme="light"] .nfa{color:var(--gold-deep)}
[data-theme="light"] .sig-src{background:rgba(255,255,255,0.82);color:#15151A}
[data-theme="light"] .sig-live{background:rgba(255,255,255,0.82)}
[data-theme="light"] .sp-row,[data-theme="light"] .sp-tps{background:rgba(22,20,14,0.05)}
[data-theme="light"] .app{background:radial-gradient(125% 85% at 50% -10%,#FFFFFF 0%,#F4F3EE 50%,#ECEAE3 100%)}
[data-theme="light"] .app::before{box-shadow:inset 0 -70px 130px -50px rgba(22,20,14,0.10),inset 0 0 150px 30px rgba(22,20,14,0.04)}
[data-theme="light"] .device{background:linear-gradient(160deg,#E6E6E9,#D6D6DB 60%)}
[data-theme="light"] .statusbar .island{background:#1a1a1f}
[data-theme="light"] .brand-word{filter:drop-shadow(0 1px 2px rgba(120,88,20,.22)) drop-shadow(0 3px 8px rgba(22,20,14,.14));opacity:1;height:42px;width:42px;border-radius:0;box-shadow:none;-webkit-backface-visibility:hidden;transform:translateZ(0)}
[data-theme="light"] .login-wordmark,
[data-theme="light"] .ob-wordmark{filter:drop-shadow(0 10px 28px rgba(22,20,14,.18))}
[data-theme="light"] .bp-tx span,
[data-theme="light"] .ann-row p,
[data-theme="light"] .post-body,
[data-theme="light"] .jc-note,
[data-theme="light"] .live-chat2 .chat-msg .ct{color:#2A2A30}
.nfa svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;color:var(--gold)}

/* onboarding (first-run) */
#app:has(.onboard) #screen,#app:has(.onboard) #tabbar,#app:has(.onboard) .statusbar{visibility:hidden;pointer-events:none}
.onboard{position:absolute;inset:0;z-index:62;background:var(--ink);display:flex;flex-direction:column;padding: calc(28px + env(safe-area-inset-top)) var(--s6) calc(26px + env(safe-area-inset-bottom))}
.ob-dots{display:flex;gap: var(--s1);justify-content:center;margin-bottom: var(--s1);flex:none}
.ob-dot{flex:1;max-width:28px;height:4px;border-radius:3px;background:var(--surface-3);transition:background .3s}
.ob-dot.on{background:var(--gold)}
.ob-dot.done{background:var(--gold-deep)}
.ob-body{flex:1;display:flex;flex-direction:column;min-height:0;padding-top: var(--s3)}
.ob-center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.ob-coin{width:84px;height:84px;filter:drop-shadow(0 12px 30px rgba(var(--gold-rgb),.45))}
.ob-wordmark{height:96px;width:96px;max-width:96px;object-fit:contain;filter:drop-shadow(0 8px 26px rgba(var(--gold-rgb),.32));border-radius:0}
[data-theme="light"] .ob-wordmark{height:96px;width:96px;border-radius:0}
.login-wordmark{border-radius:0}
[data-theme="light"] .login-wordmark{border-radius:0;image-rendering:-webkit-optimize-contrast}
.ob-top{margin-bottom: var(--s1)}
.ob-levels{display:flex;flex-direction:column;gap: var(--s2);margin-top: var(--s2)}
.ob-level{text-align:left;padding: var(--s4);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);transition:background .2s,border-color .2s}
.ob-level b{font-family:var(--display);font-size: var(--fs-h3);font-weight:600;display:block}
.ob-level span{font-size: var(--fs-small);color:var(--muted);margin-top: 2px;display:block}
.ob-level.on{background:rgba(var(--gold-rgb),.1);border-color:var(--gold)}
.ob-call{padding: var(--s4);margin-top: var(--s2)}
.ob-call-row{display:flex;align-items:center;justify-content:space-between}
.ob-scroll{flex:1;overflow:auto;min-height:0;-webkit-overflow-scrolling:touch;padding-bottom: var(--s2)}
.ob-pillars{display:flex;flex-wrap:wrap;gap: var(--s2);justify-content:center;margin: var(--s4) 0 var(--s2);max-width:320px}
.ob-pillar{font-size: var(--fs-tiny);font-weight:600;letter-spacing:.02em;padding: var(--s2) var(--s2);border-radius:999px;background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);color:var(--gold-hi)}
.ob-disclaimer{font-size: var(--fs-tiny);color:var(--muted);max-width:300px;line-height:1.45;margin-top: var(--s2)}
.ob-disclaimer b{color:var(--ink-2);font-weight:600}
.ob-groups{display:flex;flex-direction:column;gap: var(--s2);margin-top: var(--s2)}
.ob-group{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2)}
.ob-group b{font-size: var(--fs-h4);font-weight:600}
.ob-group-hero{align-items:flex-start;padding: var(--s3) var(--s4)}
.ob-group-hero small{color:var(--muted)}
.ob-gate{flex:none;font-size: var(--fs-tiny);font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding: var(--s1) var(--s2);border-radius:999px;background:rgba(var(--gold-rgb),.12);color:var(--gold-hi);border:1px solid var(--gold-line)}
.ob-zoom{display:flex;flex-direction:column;gap: var(--s2);margin-top: var(--s2)}
.ob-zoom-row{display:grid;grid-template-columns:52px 1fr;gap: var(--s2);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2)}
.ob-zoom-row .day{font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;color:var(--gold);letter-spacing:.04em;padding-top: 2px}
.ob-zoom-row b{font-size: var(--fs-small);font-weight:600;display:block}
.ob-zoom-row small{font-size: var(--fs-tiny);color:var(--muted);display:block;margin-top: 2px;line-height:1.35}
.ob-notif-list{display:flex;flex-direction:column;gap: var(--s2);margin-top: var(--s3)}
.ob-notif-row{display:flex;align-items:flex-start;gap: var(--s2);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2)}
.ob-notif-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);margin-top: var(--s2);flex:none}
.ob-notif-row span{font-size: var(--fs-small);color:var(--muted);line-height:1.45}
.ob-footnote{font-size: var(--fs-tiny);color:var(--faint);line-height:1.45;margin-top: var(--s3);text-align:center}
.ob-push-actions{display:flex;flex-direction:column;align-items:stretch;gap: var(--s2);margin-top: auto;padding-top: var(--s3);flex:none}
.ob-push-skip{appearance:none;background:transparent;border:0;padding: var(--s2) var(--s3);margin: 0 auto;font-family:var(--sans);font-size: var(--fs-small);font-weight:500;color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer;line-height:1.3}
.ob-push-skip:hover,.ob-push-skip:focus-visible{color:var(--ink-2)}
.ob-push-skip:active{opacity:.75}
.onboard .btn:disabled,.onboard .ob-push-skip:disabled{opacity:.55;cursor:wait}


.chan-gate{display:inline-flex;align-items:center;margin-left: var(--s1);font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding: 2px var(--s1);border-radius:999px;background:rgba(var(--gold-rgb),.12);color:var(--gold-hi);border:1px solid var(--gold-line);vertical-align:middle}
.tcard-logo{height:28px;width:28px;opacity:.92;object-fit:contain}

/* =========================================================
   RESPONSIVE — real phone = fullscreen, no frame
   ========================================================= */
@media (max-width:520px),(display-mode:standalone){
  .stage{padding: 0;background:var(--ink);display:block}      /* drop grid: avoids width:100% feedback loop */
  .stage-meta{display:none}
  .stage::after{display:none}
  .device{width:100vw;height:100dvh;border-radius:0;padding: 0;background:var(--ink);box-shadow:none}
  .device::before{display:none}
  .app{width:100vw;height:100dvh;border-radius:0}
  .statusbar{padding-top: env(safe-area-inset-top)}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .reveal{opacity:1;transform:none}
  .reveal-wait{opacity:1 !important;transform:none !important}
}

/* ===== Elevation pass (Fable-5 batch 1): a11y + motion utilities ===== */
/* keyboard focus — invisible before; token-driven so it reskins + holds in both themes */
:where(button,a,[role="button"],[role="switch"],[tabindex]):focus-visible{outline:2px solid rgba(var(--gold-rgb),.9);outline-offset:2px}
.finput:focus-visible,.fselect:focus-visible,.gloss-search:focus-visible{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(var(--gold-rgb),.18)}
.sr-only{position:absolute;width:1px;height:1px;padding: 0;margin: -1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
/* reset class so click-only card divs can become real <button> without restyle */
/* .as-btn moved near the top of the file — must lose to component classes in the cascade */
/* countdown digit roll (per-second heartbeat) */
@keyframes cdRoll{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.cd-cell b{will-change:transform}
.cd-tick{animation:cdRoll .38s var(--ease-spring)}
/* live-ticker micro tick-pop on price change */
@keyframes mbPop{0%{transform:translateY(0)}40%{transform:translateY(-1.6px)}100%{transform:translateY(0)}}
.mb-price{display:inline-block;will-change:transform}
.mb-pop{animation:mbPop .3s var(--ease-out)}
/* scroll-reveal gate: below-fold .reveal elements hold (paused at frame 0 = invisible) until scrolled into view */
.reveal-wait{animation-play-state:paused}
/* live open-P&L chip on running signals */
.pl-chip{display:inline-flex;align-items:center;gap: var(--s1);padding: 2px var(--s2);border-radius:var(--r-full);font-family:var(--mono);font-size: var(--fs-tiny);font-weight:600;background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);transition:opacity .2s,transform .2s}
.pl-chip.up{color:var(--up)}.pl-chip.down{color:var(--down)}
.sp-tp.hit b{color:var(--up)}.sp-tp.hit::after{content:" ✓";color:var(--up)}
/* light-theme parity: signal mini-chart well was navy on white */
[data-theme="light"] .sig-chart{background:linear-gradient(180deg,#FFFFFF 0%,#F4F3EE 100%)}
/* 3-tier elevation: inline rows lose the hero drop; cards keep the warm signature */
.stat,.lb-row,.notif,.marketbar,.cd-cell,.track-stats>div,.jstat,.num-cell,.fd-stat{box-shadow:var(--elev-1)}
.card,.chan,.live-banner,.totw,.path,.hub,.tier,.up-card{box-shadow:var(--elev-2)}
.tabbar,.sheet,.push-banner{box-shadow:var(--elev-3)}
/* tab-bar icon spring on activation */
@keyframes tabPop{0%{transform:scale(1)}45%{transform:translateY(-2px) scale(1.14)}100%{transform:scale(1)}}
.tab.active .tab-cluster svg{animation:tabPop .4s var(--ease-spring)}
.idea-top-r{display:flex;flex-direction:column;align-items:flex-end;gap: var(--s1)}
.pl-chip:empty{display:none}
/* VIP locked card live meta */
.sl-meta{margin-top: var(--s2);font-family:var(--mono);font-size: var(--fs-tiny);color:var(--muted)}
.sl-meta .dot-live{margin-right: var(--s1)}
/* founder revenue slider */
.fd-price{margin: 2px 0 var(--s3);padding: var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line)}
.fd-price-top{display:flex;align-items:baseline;justify-content:space-between;margin-bottom: var(--s2)}
.fd-mrr{font-family:var(--mono);font-size:26px;font-weight:700;color:var(--gold)}
.fd-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:4px;outline:none;background:var(--surface-4)}
.fd-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--gold-foil);box-shadow:var(--glow-gold);cursor:pointer;border:2px solid var(--surface)}
.fd-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--gold);border:2px solid var(--surface);cursor:pointer}
.fd-proj{margin-top: var(--s2);font-size: var(--fs-small);color:var(--muted);line-height:1.5}
.fd-proj b{color:var(--text);font-family:var(--mono)}
/* broker (IB) verification — partner-funded VIP */
.fd-ib{display:flex;gap: var(--s3);align-items:flex-start;margin: 2px 0 var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:rgba(var(--gold-rgb),.07);border:1px solid var(--gold-line)}
.fd-ib .ic{width:16px;height:16px;color:var(--gold);flex:none;margin-top: 2px}
.fd-ib b{display:block;font-size: var(--fs-small);margin-bottom: var(--s1)}
.fd-ib small{font-size: var(--fs-tiny);color:var(--muted);line-height:1.5}
.vb-how{margin: var(--s1) 0 var(--s1);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);display:flex;flex-direction:column;gap: var(--s3)}
.vb-step{display:flex;gap: var(--s3);align-items:flex-start;font-size: var(--fs-small);color:var(--muted);line-height:1.5}
.vb-step .vb-n{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size: var(--fs-tiny);font-weight:700;color:var(--gold);background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line)}
/* "Your desk" — personalised daily briefing */
.desk,.jny{margin-top: var(--s3)}
.streak-chip{display:flex;align-items:center;gap: var(--s1);font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;color:var(--gold);background:rgba(var(--gold-rgb),.09);border:1px solid var(--gold-line);border-radius:var(--r-full);padding: var(--s1) var(--s3)}
.streak-chip .ic{width:12px;height:12px}
.desk-row{display:flex;align-items:center;gap: var(--s3);width:100%;padding: var(--s3) 2px;border-bottom:1px solid var(--line);text-align:left}
.desk-row:last-child{border-bottom:none;padding-bottom: 2px}
.desk-row>.ic{width:16px;height:16px;color:var(--gold);flex:none}
.dr-label{font-size: var(--fs-h4);color:var(--text);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dr-val{font-size: var(--fs-small);font-weight:600;color:var(--muted)}
.dr-val.up{color:var(--up)} .dr-val.down{color:var(--down)} .dr-val.gold-tx{color:var(--gold)}
.dr-chev{width:13px;height:13px;color:var(--faint);flex:none}
/* "Your journey" — milestone tracker */
.jny-bar{height:6px;border-radius:4px;background:var(--surface-4);margin: var(--s1) 0 var(--s3);overflow:hidden}
.jny-bar i{display:block;height:100%;border-radius:4px;background:var(--gold-foil);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.jny-row{display:flex;align-items:center;gap: var(--s3);width:100%;padding: var(--s2) 2px;text-align:left;position:relative}
.jny-row::before{content:"";position:absolute;left:14px;top:-9px;width:2px;height:18px;background:var(--line)}
.jny-row:first-of-type::before{display:none}
.jny-row.is-done::before{background:rgba(var(--gold-rgb),.4)}
.jny-node{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;position:relative;z-index:1;background:var(--surface-3);border:1px solid var(--line-2);color:var(--muted);font-size: var(--fs-tiny);font-weight:700}
.jny-row.is-done .jny-node{background:rgba(var(--gold-rgb),.14);border-color:var(--gold-line);color:var(--gold)}
.jny-row.is-done .jny-node .ic{width:13px;height:13px}
.jny-row.is-next .jny-node{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 3px rgba(var(--gold-rgb),.14)}
.jny-row.is-next .jny-node .ic{width:13px;height:13px}
.jny-label{flex:1;min-width:0;font-size: var(--fs-h4);color:var(--text)}
.jny-row:not(.is-done):not(.is-next) .jny-label{color:var(--muted)}
.jny-row.is-done .jny-label{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(var(--gold-rgb),.45);text-decoration-thickness:1px}
.jny-next{flex:none;font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);border-radius:var(--r-full);padding: var(--s1) var(--s2)}
.jny-xp{flex:none;font-size: var(--fs-tiny);font-weight:700;color:var(--faint)}
.jny-dest{font-size: var(--fs-tiny);color:var(--muted);line-height:1.5;margin: 0 0 var(--s1)}
.jny-dest b{color:var(--gold)}
.jny-stage{display:flex;align-items:center;gap: var(--s2);margin: var(--s3) 0 var(--s1);padding-top: var(--s3);border-top:1px solid var(--line)}
.jny-stage .jny-st-n{flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size: var(--fs-tiny);font-weight:700;color:var(--muted);background:var(--surface-3);border:1px solid var(--line-2)}
.jny-stage.is-done .jny-st-n{color:var(--gold);background:rgba(var(--gold-rgb),.12);border-color:var(--gold-line)}
.jny-st-name{flex:1;font-size: var(--fs-tiny);font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.jny-pace{font-style:normal;font-size: var(--fs-tiny);font-weight:600;letter-spacing:.04em;text-transform:none;color:var(--faint);margin-left: var(--s2)}
.jny-stage.is-done .jny-st-name{color:var(--gold)}
.jny-stage .ic{width:13px;height:13px;color:var(--gold)}
.jny-st-count{font-size: var(--fs-tiny);font-weight:700;color:var(--faint)}
.jny-stage + .jny-row::before{display:none}
.jny-summit{display:flex;align-items:center;gap: var(--s3);margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:rgba(var(--gold-rgb),.06);border:1px dashed var(--gold-line)}
.jny-summit .jny-node{background:rgba(var(--gold-rgb),.14);border-color:var(--gold-line);color:var(--gold)}
.jny-summit .jny-node .ic{width:14px;height:14px}
.jny-summit b{display:block;font-size: var(--fs-h4);margin-bottom: 2px}
.jny-summit small{font-size: var(--fs-tiny);color:var(--muted);line-height:1.45}
.jny-summit.is-done{border-style:solid;background:rgba(var(--gold-rgb),.12)}
.jny:not(.is-open) .jny-more{display:none}
.jny-toggle{display:block;width:100%;min-height:44px;margin-top: var(--s2);border-radius:var(--r-md);color:var(--gold);font-weight:600;font-size: var(--fs-small)}
.jny-toggle:hover{background:rgba(var(--gold-rgb),.06)}
.jny-toggle:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.jny-toggle:active{transform:scale(.98)}
.of-task{margin-top:14px;padding: var(--s4)}
.of-task .of-task-title{margin: var(--s2) 0}
.of-task .of-task-why{margin: 0 0 var(--s4)}
.of-task-skip{display:block;width:100%;min-height:44px;margin-top: var(--s1);border-radius:var(--r-md);color:var(--muted);font-size: var(--fs-small);font-weight:600}
.of-task-skip:hover{color:var(--text)}
.of-task-skip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.of-task-skip:active{transform:scale(.98)}
.of-task-loading{min-height:172px}
.of-task-clear{display:flex;align-items:center;gap: var(--s3)}
.of-task-clear > .ic{width:22px;height:22px;flex:none;color:var(--gold)}
.of-task-clear b{display:block;font-size: var(--fs-h4)}
.of-task-clear small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: 2px}
/* weekly review — the Friday debrief */
.wr{display:block;width:100%;text-align:left;margin-top: var(--s3)}
.wr-locked{cursor:default}
.wr-locked .wr-hook{color:var(--muted)}
.wr-hook{font-size: var(--fs-small);color:var(--text);line-height:1.5;margin: 2px 0 0}
.wr-last{font-size: var(--fs-tiny);color:var(--muted);margin-top: var(--s2)}
.wr-done{display:flex;align-items:center;gap: var(--s3)}
.wr-done small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: 2px}
.wr-band{font-family:var(--display);font-size:16px;font-weight:700}
.ws-ring{flex:none;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;position:relative}
.ws-ring::after{content:"";position:absolute;inset:5px;border-radius:50%;background:var(--ink)}
.ws-ring b{position:relative;z-index:1;font-size:19px}
.ws-ring-lg{width:96px;height:96px;margin: 0 auto}
.ws-ring-lg b{font-size:30px}
.wr-result{text-align:center;padding: var(--s1) 0 var(--s3)}
.wr-result .wr-band{display:block;margin-top: var(--s2)}
.wr-result small{font-size: var(--fs-tiny);color:var(--muted)}
.ws-row{margin-top: var(--s3)}
.ws-top{display:flex;align-items:baseline;justify-content:space-between;gap: var(--s2);margin-bottom: var(--s2)}
.ws-top label{font-size: var(--fs-small);color:var(--text)}
.ws-top b{font-size: var(--fs-h3);color:var(--gold)}
.ws-dim{display:flex;align-items:center;gap: var(--s2);padding: var(--s2) 0;border-bottom:1px solid var(--line)}
.ws-dim:last-of-type{border-bottom:none}
.ws-dim span{flex:1;min-width:0;font-size: var(--fs-small);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ws-dim b{flex:none;font-size: var(--fs-small);width:20px;text-align:right}
.ws-dimbar{flex:none;width:86px;height:5px;border-radius:4px;background:var(--surface-4);overflow:hidden}
.ws-dimbar i{display:block;height:100%;border-radius:4px;background:var(--gold)}
.wr-note{display:flex;gap: var(--s3);align-items:flex-start;margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:rgba(var(--gold-rgb),.07);border:1px solid var(--gold-line)}
.pg-player + .wr-note,
#pg-audio + .wr-note{margin-top: 0;margin-bottom: var(--s3)}
.wr-note .ic{width:14px;height:14px;color:var(--gold);flex:none;margin-top: 2px}
.wr-note b{display:block;font-size: var(--fs-small);margin-bottom: 2px}
.wr-note small{font-size: var(--fs-small);color:var(--muted);line-height:1.5}
.wr-coach{margin-top: var(--s3);display:flex;flex-direction:column;gap: var(--s2)}
.wr-coach-row{padding: var(--s2) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line)}
.wr-coach-row b{display:block;font-size: var(--fs-tiny);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom: var(--s1)}
.wr-coach-row small{font-size: var(--fs-small);color:var(--text);line-height:1.45}
.wr-coach-row.is-focus{background:rgba(var(--gold-rgb),.07);border-color:var(--gold-line)}
.wr-focusline{display:flex;gap: var(--s2);align-items:flex-start;margin: var(--s3) 0 0;font-size: var(--fs-small);color:var(--muted);line-height:1.45}
.wr-focusline .ic{width:13px;height:13px;color:var(--gold);flex:none;margin-top: 2px}

/* daily check-in — the 5-second pulse that feeds the weekly Trader Score */
.dci-list{margin-top: var(--s1)}
.dci-row{display:flex;align-items:center;justify-content:space-between;gap: var(--s3);padding: var(--s3) 0;border-bottom:1px solid var(--line)}
.dci-row:last-child{border-bottom:none}
.dci-q{flex:1;min-width:0;font-size: var(--fs-h4);color:var(--text)}
.dci-btns{flex:none;display:flex;gap: var(--s2)}
.dci-btn{display:flex;align-items:center;gap: var(--s1);padding: var(--s2) var(--s3);border-radius:var(--r-full);border:1px solid var(--line-2);background:var(--surface-3);color:var(--muted);font-size: var(--fs-small);font-weight:700;transition:transform .15s var(--ease-spring)}
.dci-btn:active{transform:scale(.94)}
.dci-btn .ic{width:13px;height:13px;stroke-width:2.4}
.dci-btn.yes.on{background:rgba(52,199,89,.16);border-color:rgba(52,199,89,.4);color:#34c759}
.dci-btn.no.on{background:rgba(255,69,58,.14);border-color:rgba(255,69,58,.35);color:#ff453a}
/* the office — personal HQ */
.office-head{display:flex;align-items:center;gap: var(--s3);margin: var(--s1) 0 var(--s4)}
.of-id{flex:1;min-width:0}
.of-hi{font-size: var(--fs-small);color:var(--muted)}
.of-name{font-family:var(--display);font-size: var(--fs-h1);font-weight:800;letter-spacing:-.02em}
.of-id .pill{display:inline-flex}
.of-goalnote{font-size: var(--fs-tiny);color:var(--faint);margin-top: var(--s2);text-align:center}
.office-account-card{position:relative;overflow:hidden;margin-bottom:var(--s3);border-color:var(--gold-line)}
.office-account-card.is-warning{background:rgba(var(--gold-rgb),.065)}
.office-account-card.is-loading{min-height:64px;display:flex;align-items:center}
.office-account-kicker{display:flex;align-items:center;gap:var(--s2);font-family:var(--mono);font-size:var(--fs-tiny);font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.office-account-kicker .ic{width:14px;height:14px;stroke-width:2.5}
.office-account-card h2{font-family:var(--display);font-size:var(--fs-h2);line-height:1.12;letter-spacing:-.025em;margin:var(--s2) 0 var(--s1)}
.office-account-card > p{font-size:var(--fs-small);line-height:1.5;color:var(--muted);margin:0}
.office-account-list{display:grid;gap:var(--s2);margin-top:var(--s3)}
.office-account-row{display:flex;align-items:center;gap:var(--s2);padding:10px 11px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2)}
.office-account-row > span:nth-child(2){display:flex;flex:1;min-width:0;flex-direction:column}
.office-account-row b{font-size:var(--fs-small)}
.office-account-row small{font-size:var(--fs-tiny);color:var(--muted);margin-top:1px}
.office-account-mark{display:grid;place-items:center;width:26px;height:26px;border-radius:var(--r-full);background:rgba(var(--gold-rgb),.12);color:var(--gold);flex:none}
.office-account-mark .ic{width:14px;height:14px;stroke-width:2.6}
.office-account-row.is-linked .office-account-mark{background:rgba(52,199,89,.13);color:#34c759}
.office-account-state{font-family:var(--mono);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.office-account-row.is-linked .office-account-state{color:#34c759}
.office-account-cta{margin-top:var(--s3)}
.office-account-privacy{display:flex;align-items:flex-start;gap:var(--s1);margin-top:var(--s2);font-size:10.5px;line-height:1.4;color:var(--faint)}
.office-account-privacy .ic{width:12px;height:12px;flex:none;margin-top:1px}
[data-theme="light"] .office-account-card.is-warning{background:rgba(var(--gold-rgb),.1)}
/* Legacy inline unread badge (other CTAs) — keep text-matched, no circle */
.dm-badge{
  display:inline;margin-left: var(--s2);padding: 0;min-width:0;height:auto;
  border-radius:0;background:transparent;border:0;
  color:inherit;font-family:var(--mono);font-size: var(--fs-small);font-weight:800;
  letter-spacing:-.02em;vertical-align:baseline;
}
.btn-gold .dm-badge{color:var(--on-accent)}

/* Hero CTA — Enter your office */
.desk .btn-office{margin-top: var(--s3)}
.btn-office{
  height:auto;min-height:64px;padding: var(--s3) var(--s4) var(--s3) var(--s4);gap: var(--s3);
  justify-content:space-between;text-align:left;
  box-shadow:
    0 14px 36px -10px rgba(var(--gold-rgb),.55),
    0 4px 10px -3px rgba(var(--gold-rgb),.35),
    inset 0 1px 0 rgba(255,252,235,.78),
    inset 0 -1px 0 rgba(0,0,0,.28);
}
.btn-office-lead{display:flex;align-items:center;gap: var(--s3);min-width:0;flex:1}
.btn-office-lead > svg{width:22px;height:22px;flex:none;stroke-width:2}
.btn-office-copy{display:flex;flex-direction:column;align-items:flex-start;gap: 2px;min-width:0}
.btn-office-copy b{
  font-family:var(--display);font-size:16.5px;font-weight:800;
  letter-spacing:-.02em;line-height:1.15;color:inherit;
}
.btn-office-copy small{
  font-family:var(--body);font-size: var(--fs-small);font-weight:600;
  letter-spacing:.01em;line-height:1.25;color:inherit;opacity:.72;
}
.btn-office-go{display:flex;align-items:center;gap: var(--s2);flex:none;color:inherit}
.btn-office-go > svg{width:18px;height:18px;opacity:.85;stroke-width:2.2}
.btn-office-count{
  font-family:var(--mono);font-size: var(--fs-h3);font-weight:800;
  letter-spacing:-.03em;color:inherit;line-height:1;
  font-feature-settings:"tnum" 1,"lnum" 1;
}
[data-theme="light"] .btn-office-copy small{opacity:.68}

.dm-row{display:flex;align-items:center;gap: var(--s3);width:100%;padding: var(--s2) 2px;border-bottom:1px solid var(--line);text-align:left}
.dm-row:last-child{border-bottom:none;padding-bottom: 2px}
.dm-body{flex:1;min-width:0}
.dm-top{display:flex;align-items:baseline;gap: var(--s2)}
.dm-top b{font-size: var(--fs-body)}
.dm-time{margin-left: auto;font-size: var(--fs-tiny);color:var(--faint);flex:none}
.dm-prev{display:block;font-size: var(--fs-small);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top: 2px}
.dm-un{flex:none;display:grid;place-items:center;min-width:21px;height:21px;padding: 0 var(--s1);border-radius:var(--r-full);background:var(--gold);color:var(--on-accent,#1A1206);font-size: var(--fs-tiny);font-weight:700}
.dm-head{display:flex;align-items:center;gap: var(--s3);padding-bottom: var(--s3);border-bottom:1px solid var(--line)}
.dm-head b{font-size: var(--fs-h3)}
.dm-head small{display:block;font-size: var(--fs-tiny);color:var(--gold);margin-top: 1px}
.dm-thread{max-height:44vh;min-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap: var(--s2);padding: var(--s3) 2px;scrollbar-width:none}
.dm-thread::-webkit-scrollbar{display:none}
.dm-msg{position:relative;max-width:82%;align-self:flex-start;background:var(--surface-3);border:1px solid var(--line-2);border-radius:16px 16px 16px 5px;padding: var(--s2) var(--s3) var(--s2);font-size: var(--fs-h4);line-height:1.45}
.dm-msg.me{align-self:flex-end;background:rgba(var(--gold-rgb),.13);border-color:var(--gold-line);border-radius:16px 16px 5px 16px}
.dm-t{display:block;font-size:9px;color:var(--faint);margin-top: var(--s1);text-align:right}
.dm-typing{display:flex;gap: var(--s1);align-items:center;padding: var(--s3) var(--s3)}
.dm-typing i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:dmty 1.1s ease-in-out infinite}
.dm-typing i:nth-child(2){animation-delay:.18s}.dm-typing i:nth-child(3){animation-delay:.36s}
@keyframes dmty{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.dm-compose{display:flex;gap: var(--s2);padding-top: var(--s3);border-top:1px solid var(--line)}
.dm-compose .finput{flex:1}
.dm-send{flex:none;width:50px;padding: 0}
@media (prefers-reduced-motion:reduce){.dm-typing i{animation:none;opacity:.6}}
/* ===== batch 3: signal replay + paper-trade pill ===== */
.rp-bar{margin-top: var(--s2)}
.rp-tag{position:absolute;top:8px;left:10px;z-index:2;font-family:var(--mono);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);padding: 2px var(--s2);border-radius:var(--r-full)}
.sp-up{transition:opacity .35s var(--ease-out),transform .35s var(--ease-out)}
.sp-up.rp-dim{opacity:.13;transform:translateY(4px)}
.sl-tx{color:var(--down)}
.paper-pill{position:absolute;left:50%;bottom:calc(var(--tabbar-h) + 14px);z-index:90;transform:translate(-50%,80px);opacity:0;
  display:flex;align-items:center;gap: var(--s2);padding: var(--s2) var(--s4);border-radius:var(--r-full);white-space:nowrap;
  background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--gold-line);box-shadow:var(--elev-3);font-size: var(--fs-small);color:var(--text);cursor:pointer;
  transition:transform .45s var(--ease-spring),opacity .45s}
.paper-pill.show{transform:translate(-50%,0);opacity:1}
.paper-pill svg{width:15px;height:15px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.8}
.paper-pill b{font-weight:700}
/* "Your edge" journal analytics */
.edge-card{margin-top: var(--s3)}
.edge-sess{display:flex;flex-direction:column;gap: var(--s2);margin: var(--s3) 0 var(--s1)}
.edge-row{display:flex;align-items:center;gap: var(--s2);font-size: var(--fs-small)}
.edge-n{width:64px;color:var(--muted)}
.edge-bar{flex:1;height:7px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.edge-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--gold-deep),var(--gold));transform-origin:left;transition:transform .7s var(--ease-out)}
.edge-row b{width:38px;text-align:right;font-family:var(--mono);font-size: var(--fs-small)}
.edge-row small{width:44px;color:var(--faint);font-size: var(--fs-tiny);font-family:var(--mono)}
.edge-setups{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2);margin: var(--s3) 0 2px}
.edge-set{padding: var(--s3);border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line)}
.edge-set span{display:flex;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.edge-set span svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2}
.edge-set b{display:block;font-size: var(--fs-small);margin: var(--s1) 0 2px}
.edge-set small{font-size: var(--fs-tiny);font-family:var(--mono);color:var(--muted)}
.edge-histo{display:flex;align-items:flex-end;gap: var(--s1);height:64px;margin: var(--s4) 2px 2px}
.eh-col{flex:1;display:flex;flex-direction:column;align-items:center;gap: var(--s1);height:100%;min-width:0}
.eh-n{font-size: var(--fs-tiny);font-weight:700;color:var(--muted);min-height:12px;line-height:1}
.eh-col i{display:block;width:100%;flex:1;border-radius:4px 4px 2px 2px;background:var(--surface-4);transform-origin:bottom;transition:transform .7s var(--ease-out)}
.eh-col i.pos{background:rgba(62,203,134,.55)}
.eh-col i.neg{background:rgba(240,86,91,.5)}
.eh-col small{font-size: var(--fs-tiny);font-family:var(--mono);color:var(--faint);white-space:nowrap}
.edge-insight{margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-sm);font-size: var(--fs-small);line-height:1.55;color:var(--text-2);background:rgba(var(--gold-rgb),.07);border:1px solid var(--gold-line)}
/* "Today on the floor" stories */
.story-strip{display:flex;align-items:center;gap: var(--s3);width:100%;margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);
  background:var(--surface-2);border:1px solid var(--line-2);box-shadow:var(--elev-1);cursor:pointer;text-align:left;
  transition:transform .15s var(--ease-spring);color:var(--text)}
.story-strip:active{transform:scale(.985)}
.story-ring{flex:none;width:44px;height:44px;border-radius:50%;padding: 2.5px;background:var(--gold-foil)}
.story-ring.seen{background:var(--line-2)}
.story-dot{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--ink);color:var(--gold)}
.story-dot svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.story-tx{flex:1;min-width:0}
.story-tx b{display:block;font-family:var(--display);font-size: var(--fs-h4)}
.story-tx small{font-size: var(--fs-tiny);color:var(--muted)}
.story-strip>svg{width:16px;height:16px;color:var(--faint);fill:none;stroke:currentColor;stroke-width:2}
#story{position:absolute;inset:0;z-index:120;display:flex;flex-direction:column;background:var(--ink);opacity:0;transform:scale(1.03);transition:opacity .35s var(--ease-out),transform .35s var(--ease-out)}
#story.show{opacity:1;transform:none}
.st-bars{display:flex;gap: var(--s1);padding: calc(env(safe-area-inset-top, 0px) + 12px) var(--s2) 0;position:relative;z-index:3;flex:none}
.st-bar{flex:1;height:2.5px;border-radius:2px;background:rgba(255,255,255,.28);overflow:hidden}
.st-bar i{display:block;height:100%;background:#fff;transform:scaleX(0);transform-origin:left}
.st-close{position:absolute;top:calc(env(safe-area-inset-top, 0px) + 28px);right:12px;z-index:4;width:36px;height:36px;border-radius:50%;background:var(--surface-3);color:var(--text);font-size: var(--fs-h3);display:grid;place-items:center;cursor:pointer}
/* Demo phone chrome already sits under the fake status bar — don't double-pad */
html:not([data-native="1"]) .st-bars{padding-top: var(--s3)}
html:not([data-native="1"]) .st-close{top:26px}
html[data-native="1"] .st-bars{padding-top: calc(env(safe-area-inset-top, 0px) + 14px)}
html[data-native="1"] .st-close{top:calc(env(safe-area-inset-top, 0px) + 32px)}
.st-card{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding: 0 var(--s7);position:relative;z-index:2;animation:stIn .4s var(--ease-out)}
@keyframes stIn{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
.st-card h2{font-family:var(--display);font-size:27px;letter-spacing:var(--tracking);margin: var(--s3) 0 var(--s4);max-width:300px}
.st-body p{font-size: var(--fs-body);color:var(--text-2);line-height:1.6;margin-top: var(--s1);max-width:290px}
.st-big{font-family:var(--mono);font-size:44px;font-weight:700;margin: var(--s2) 0 var(--s1)}
.st-avatar{margin-bottom: var(--s3);display:flex;justify-content:center}
.st-sigs{display:flex;flex-direction:column;gap: var(--s2);min-width:250px}
.st-sig{display:flex;justify-content:space-between;gap: var(--s4);padding: var(--s3) var(--s4);border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line);font-size: var(--fs-h4)}
.st-nav{position:absolute;inset:0;display:flex;z-index:2}
.st-zone{flex:1;background:none;border:0;cursor:pointer}
.st-card{pointer-events:none;z-index:3}
.st-card .btn{pointer-events:auto}
.st-body-media{pointer-events:auto;max-width:100%}
.st-media{display:block;max-width:min(100%,280px);max-height:min(52vh,360px);margin: var(--s3) auto var(--s2);border-radius:var(--r-md);object-fit:cover}
.st-video{width:100%;object-fit:contain;background:#000}
/* tappable glossary terms + definition popover */
.gterm{appearance:none;background:none;border:0;padding: 0;margin: 0;font:inherit;color:inherit;cursor:pointer;
  border-bottom:1px dotted rgba(var(--gold-rgb),.65)}
#gloss-pop{position:absolute;left:14px;right:14px;bottom:calc(var(--tabbar-h) + 16px);z-index:130;
  padding: var(--s3) var(--s4);border-radius:var(--r-md);background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--gold-line);box-shadow:var(--elev-3);
  transform:translateY(16px);opacity:0;transition:transform .3s var(--ease-spring),opacity .3s}
#gloss-pop.show{transform:none;opacity:1}
#gloss-pop b{display:block;font-family:var(--display);font-size: var(--fs-h3);margin: var(--s1) 0 var(--s1)}
#gloss-pop p{font-size: var(--fs-small);line-height:1.55;color:var(--text-2)}
#gloss-pop small{display:block;margin-top: var(--s2);font-size: var(--fs-tiny);color:var(--faint)}
/* onboarding step transition (mirrors screenIn) */
.ob-enter .ob-body{animation:screenIn .38s cubic-bezier(.2,.7,.2,1) both}
/* async skeleton shimmer */
.skel{position:relative;overflow:hidden;border-radius:10px;background:var(--surface-3);min-height:16px}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);animation:skelSweep 1.4s ease infinite}
@keyframes skelSweep{to{transform:translateX(100%)}}
/* ===== final visual-craft pass ===== */
/* glass recipe unified — matte grain on the remaining flat-glass tiles */
.tool-tile,.path,.comm-act,.tier{background-image:var(--grain)}
/* stat trios: quieter labels, prouder numbers, gold-tinted neutral count in the track record */
.stat small,.jstat small,.track-stats>div small,.fd-stat small{letter-spacing:.09em;text-transform:uppercase;font-size: var(--fs-tiny);opacity:.85}
.track-stats>div:nth-child(2) b{color:var(--gold)}

/* ===== batch 2: sticky glass chrome + news pill + compositor pulses + login choreography ===== */
.app-topbar{position:sticky;top:0;z-index:60;margin: 0 calc(var(--gutter)*-1);padding: var(--s2) var(--gutter) var(--s3);transition:background .3s,box-shadow .3s}
.app-topbar.scrolled{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);box-shadow:inset 0 -1px 0 var(--hairline)}
.mb-news{display:inline-flex;align-items:center;gap: var(--s1);margin-right: var(--s3);padding: var(--s1) var(--s2);border-radius:var(--r-full);border:1px solid var(--gold-line);background:rgba(var(--gold-rgb),.08);font-family:var(--mono);font-size: var(--fs-tiny);font-weight:600;color:var(--gold);cursor:pointer;white-space:nowrap}
.mb-news.soon{border-color:rgba(240,86,91,.45);background:rgba(240,86,91,.10);color:var(--down)}
.mb-news[hidden]{display:none}
/* box-shadow pulse loops repaint every frame — replace with transform/opacity rings (compositor-only) */
.dot-live,.mb-live,.mb-dot,.tg-syncdot,.tab .dot{animation:none;position:relative}
.dot-live::after,.mb-live::after,.mb-dot::after,.tg-syncdot::after,.tab .dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;opacity:.55;animation:ringPulse 1.8s ease-out infinite}
@keyframes ringPulse{from{transform:scale(1);opacity:.5}to{transform:scale(2.4);opacity:0}}
/* login entrance choreography (mirrors the splash) + tactile socials + input focus ring */
.login-wordmark{animation:spUp .6s var(--ease-out) both}
.login .h1{animation:spUp .6s var(--ease-out) .08s both}
.login .sub{animation:spUp .6s var(--ease-out) .16s both}
.login-bottom{animation:spUp .6s var(--ease-out) .26s both}
.social-btn{transition:transform .14s var(--ease-spring)}
.social-btn:active{transform:scale(.94)}
/* pinch-zoom re-enabled (WCAG); double-tap zoom suppressed on the app surface instead */
.app{touch-action:manipulation}
.finput:focus,.fselect:focus,.gloss-search:focus{box-shadow:0 0 0 3px rgba(var(--gold-rgb),.14)}

/* ===== CLEAN DARK (2026-07-12): crisp OLED pass — dark theme only, light overrides untouched.
   Film grain now lives ONLY on the metal objects (.book-card, .tcard); everything else is a clean
   solid graphite panel. Glass blur stays on the tab bar + top bar (the liked liquid-glass), but
   ordinary cards no longer stack texture + translucency + blur into murk. ===== */
html:not([data-theme="light"]) .card,
html:not([data-theme="light"]) .sigpost,
html:not([data-theme="light"]) .cd-cell,
html:not([data-theme="light"]) .gp-hero,
html:not([data-theme="light"]) .track-stats>div,
html:not([data-theme="light"]) .num-cell,
html:not([data-theme="light"]) .marketbar,
html:not([data-theme="light"]) .stat,
html:not([data-theme="light"]) .lb-row,
html:not([data-theme="light"]) .notif,
html:not([data-theme="light"]) .chan{background-image:none}

/* ===== Native shell (?native=1) — NEVER show fake iPhone chrome on App Store / TestFlight ===== */
html[data-native="1"] .statusbar,
html[data-native="1"] .stage-meta{
  display:none!important;height:0!important;max-height:0!important;min-height:0!important;
  overflow:hidden!important;visibility:hidden!important;opacity:0!important;
  pointer-events:none!important;padding: 0!important;margin: 0!important;border:0!important;
  position:absolute!important;left:-9999px!important;width:0!important;
}
html[data-native="1"] .stage{padding: 0!important;min-height:100%!important}
html[data-native="1"] .device{
  width:100%!important;height:100%!important;max-width:none!important;
  border-radius:0!important;padding: 0!important;box-shadow:none!important;transform:none!important;background:var(--ink)!important
}
html[data-native="1"] .device::before,
html[data-native="1"] .stage::after{display:none!important;content:none!important}
html[data-native="1"] .app{width:100%!important;height:100%!important;border-radius:0!important;padding-top: 0!important}
html[data-native="1"] .tabbar{bottom:env(safe-area-inset-bottom,0px)!important}
html[data-native="1"] .screen-scroll{padding-top: 0!important}

.book-net .num,.book-net b{font-weight:700;font-feature-settings:"tnum" 1,"lnum" 1,"zero" 0}

.phantom-rooms{display:flex;flex-direction:column;gap: var(--s2);margin: var(--s1) 0 var(--s1)}
.phantom-room{padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line-2);text-align:left}
.phantom-room .pr-top{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-bottom: var(--s1)}
.phantom-room b{font-family:var(--display);font-weight:700;font-size: var(--fs-body)}
.phantom-room p{font-size: var(--fs-small);color:var(--muted);line-height:1.45;margin: 0}

.section-head .h2,.section-head .h3{min-width:0;flex:1 1 auto;font-weight:800;letter-spacing:-.02em}
.book-net .num{font-size:34px;font-weight:700;letter-spacing:-.03em}
.desk .eyebrow,.sch-head .eyebrow{font-weight:700}
.desk > .sch-head .eyebrow{font-size: var(--fs-small);letter-spacing:.16em}
.btn-gold{font-weight:800}

/* ============================================================
   STATES — empty / loading / error / celebration (2026-07-18)
   Reusable primitives consumed by app.js helpers (emptyState(),
   skelRows(), celebrateSheet()). Token-driven; no local hex.
   ============================================================ */

/* ---- empty state: icon medallion + title + one line + one CTA ---- */
.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding: var(--s7) var(--s6) var(--s7)}
.state-icon{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold)}
.state-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}
.state-icon.ok{background:var(--ok-soft);border-color:rgba(63,191,127,.3);color:var(--up)}
.state-icon.warn{background:var(--warn-soft);border-color:rgba(var(--warn-rgb),.3);color:var(--warn)}
.state-icon.info{background:var(--info-soft);border-color:rgba(var(--info-rgb),.3);color:var(--info)}
.empty-state b{font-family:var(--display);font-size:var(--fs-h2);font-weight:700;letter-spacing:var(--tracking);margin-top: var(--s3)}
.empty-state p{color:var(--muted);font-size:var(--fs-small);line-height:1.55;max-width:260px;margin-top: var(--s1)}
.empty-state .btn{margin-top: var(--s4)}

/* ---- loading skeletons (extends .skel) ---- */
.skel::after{background:linear-gradient(90deg,transparent,var(--skel-sweep),transparent)}
.skel-card{border-radius:var(--r-md);min-height:88px;border:1px solid var(--line)}
.skel-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) 2px}
.skel-row .skel{flex:1}
.skel-av{width:40px;height:40px;border-radius:50%;flex:none}
.skel-text{height:13px}
@media (prefers-reduced-motion:reduce){.skel::after{animation:none}}

/* ---- inline error / offline note (fail loud, never silent) ---- */
.state-note{display:flex;align-items:center;gap: var(--s2);padding: var(--s3) var(--s3);border-radius:var(--r-md);
  background:var(--warn-soft);border:1px solid rgba(var(--warn-rgb),.32);color:var(--warn);
  font-size:var(--fs-small);font-weight:600;line-height:1.4}
.state-note svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8}
.state-note.info{background:var(--info-soft);border-color:rgba(var(--info-rgb),.32);color:var(--info)}

/* ---- celebration sheet (level-up / streak) — gold ring sweep, NO confetti ---- */
.celebrate{display:flex;flex-direction:column;align-items:center;text-align:center;padding: var(--s6) var(--s5) var(--s2)}
.celeb-ring{position:relative;width:104px;height:104px;display:grid;place-items:center;margin-bottom: var(--s4)}
.celeb-ring::before{content:"";position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from 0deg,transparent 0%,var(--gold) 18%,var(--gold-hi) 32%,transparent 46%);
  animation:celebSweep 2.6s linear infinite}
.celeb-ring::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--surface)}
.celeb-core{position:relative;z-index:1;width:76px;height:76px;border-radius:50%;display:grid;place-items:center;
  background:var(--gold-soft);border:1px solid var(--gold-line);
  font-family:var(--display);font-weight:800;font-size:26px;letter-spacing:-.02em;color:var(--gold);
  animation:celebPop .5s var(--ease-spring) both .15s}
.celeb-core svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8}
@keyframes celebSweep{to{transform:rotate(360deg)}}
@keyframes celebPop{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
.celebrate h3{font-family:var(--display);font-size:var(--fs-display);font-weight:800;letter-spacing:var(--tracking-mega)}
.celebrate .celeb-sub{color:var(--muted);font-size:var(--fs-body);margin-top: var(--s1);line-height:1.5;max-width:280px}
.celeb-unlock{display:flex;align-items:center;gap: var(--s2);margin-top: var(--s4);padding: var(--s3) var(--s4);border-radius:var(--r-md);
  background:var(--gold-soft);border:1px solid var(--gold-line);color:var(--gold);
  font-size:var(--fs-small);font-weight:700}
.celeb-unlock svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.celebrate .btn-block{margin-top: var(--s5)}
@media (prefers-reduced-motion:reduce){.celeb-ring::before{animation:none}.celeb-core{animation:none}}

/* ---- risk framing line on signal detail (Phase 4) ---- */
.risk-line{display:flex;align-items:center;gap: var(--s2);margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);
  background:var(--surface-2);border:1px solid var(--line-2);font-size:var(--fs-small);color:var(--muted);line-height:1.45}
.risk-line svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--gold);stroke-width:1.8}
.risk-line b{color:var(--text)}

/* light-mode dark islands: re-anchor inherited color INSIDE the lobby/stage —
   children inherit body's computed color otherwise and stay dark-on-dark */
[data-theme="light"] #live-lobby .lobby-inner,
[data-theme="light"] #live-stage{color:var(--text)}

/* ===== MT5 screenshot import ===== */
.mt5-head{margin-bottom: var(--s4)}
.mt5-track{display:flex;align-items:center;justify-content:center;gap: 0;margin: 0 0 var(--s3)}
.mt5-dot{width:8px;height:8px;border-radius:50%;background:var(--line-2);flex:none}
.mt5-dot.on{background:var(--gold);box-shadow:0 0 0 4px rgba(var(--gold-rgb),.14)}
.mt5-dot.done{background:var(--gold)}
.mt5-line{width:40px;height:2px;background:var(--line-2);flex:none;margin: 0 2px}
.mt5-line.done{background:rgba(var(--gold-rgb),.42)}
.mt5-upload{display:flex;flex-direction:column;align-items:center;justify-content:center;gap: var(--s1);padding: var(--s5) var(--s4);text-align:center;border:1.5px dashed var(--gold-line);border-radius:var(--r-lg);background:linear-gradient(180deg,rgba(var(--gold-rgb),.07),rgba(var(--gold-rgb),.02));cursor:pointer;transition:border-color .2s ease,background .2s ease}
.mt5-upload:hover,.mt5-upload:focus-visible{border-color:var(--gold);background:rgba(var(--gold-rgb),.1);outline:none;box-shadow:0 0 0 3px rgba(var(--gold-rgb),.14)}
.mt5-upload-ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);color:var(--gold);margin-bottom: var(--s1)}
.mt5-upload-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
.mt5-upload b{font-family:var(--display);font-size: var(--fs-h3);font-weight:700;letter-spacing:-.01em;color:var(--text)}
.mt5-upload small{font-size: var(--fs-small);color:var(--muted);line-height:1.45;max-width:260px}
.mt5-gallery{margin-top: var(--s3)}
.mt5-gallery-head{display:flex;align-items:center;justify-content:space-between;margin-bottom: var(--s2)}
.mt5-gallery-head span{font-size: var(--fs-tiny);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mt5-gallery-head b{font-size: var(--fs-small);color:var(--gold)}
.mt5-thumbs{display:flex;flex-wrap:wrap;gap: var(--s2)}
.mt5-thumb{position:relative;width:78px;height:78px;border-radius:12px;overflow:hidden;border:1px solid var(--line-2);box-shadow:var(--elev-1)}
.mt5-thumb img{width:100%;height:100%;object-fit:cover}
.mt5-thumb button{position:absolute;top:5px;right:5px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(4,4,6,.72);color:#fff;font-size: var(--fs-h3);line-height:1;cursor:pointer;display:grid;place-items:center}
.mt5-tip{display:flex;align-items:flex-start;gap: var(--s2);margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);font-size: var(--fs-tiny);color:var(--muted);line-height:1.45}
.mt5-tip svg{width:15px;height:15px;flex:none;margin-top: 1px;fill:none;stroke:var(--gold);stroke-width:1.8}
.mt5-status{margin-top: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);font-size: var(--fs-small);line-height:1.45}
.mt5-status-wait{background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);color:var(--text)}
.mt5-status-err{background:rgba(255,90,90,.1);border:1px solid rgba(255,90,90,.35);color:#ffb4b4}
.mt5-stats{display:grid;grid-template-columns:repeat(3,1fr);gap: var(--s2);margin: 0 0 var(--s3)}
.mt5-stat{padding: var(--s2) var(--s2);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);text-align:center}
.mt5-stat b{display:block;font-size: var(--fs-h2);line-height:1.1}
.mt5-stat small{display:block;margin-top: var(--s1);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.mt5-list{display:flex;flex-direction:column;gap: var(--s2);max-height:min(44vh,360px);overflow:auto;padding: 2px 0;-webkit-overflow-scrolling:touch}
.mt5-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s3) var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line)}
.mt5-row.is-skip{opacity:.42}
.mt5-row.is-dup{border-style:dashed}
.mt5-check{flex:none;display:grid;place-items:center}
.mt5-check input{width:18px;height:18px;accent-color:var(--gold);margin: 0}
.mt5-main{flex:1;min-width:0}
.mt5-top{display:flex;align-items:center;gap: var(--s2);flex-wrap:wrap;margin-bottom: var(--s1)}
.mt5-top b{font-size: var(--fs-body);letter-spacing:.02em}
.mt5-main small{display:block;font-size: var(--fs-tiny);color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mt5-pl{flex:none;font-family:var(--mono);font-size: var(--fs-small);font-weight:700;min-width:52px;text-align:right}
.mt5-tag{flex:none;font-size:9px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding: var(--s1) var(--s2);border-radius:var(--r-full);border:1px solid var(--line-2);color:var(--muted);white-space:nowrap}
.mt5-tag.new{color:var(--gold);border-color:var(--gold-line);background:rgba(var(--gold-rgb),.08)}
.mt5-tag.dup{color:var(--faint)}
.mt5-tag.maybe{color:var(--down);border-color:rgba(220,80,80,.35);background:rgba(220,80,80,.06)}
.mt5-foot{display:flex;gap: var(--s2);margin-top: var(--s4)}
.mt5-foot .btn{flex:1;margin: 0}
.mt5-foot .btn-ghost{flex:.85}
.journal-actions{display:flex;flex-direction:column;gap: var(--s2);margin: var(--s3) 0 2px}
.journal-actions .btn{margin: 0!important}
.journal-actions .btn-ghost{font-size: var(--fs-h4);height:46px;border-style:dashed}
.reflect-banner{display:flex;align-items:flex-start;gap: var(--s3);padding: var(--s3) var(--s3);margin: 0 0 var(--s3);border-radius:var(--r-md);background:rgba(var(--gold-rgb),.08);border:1px solid var(--gold-line)}
.reflect-banner svg{width:18px;height:18px;flex:none;margin-top: 2px;fill:none;stroke:var(--gold);stroke-width:1.8}
.reflect-banner b{display:block;font-size: var(--fs-h4);margin-bottom: var(--s1)}
.reflect-banner small{display:block;font-size: var(--fs-tiny);color:var(--muted);line-height:1.45;margin-bottom: var(--s2)}
.reflect-banner .btn{height:40px;padding: 0 var(--s3);font-size: var(--fs-small)}
.jcard.is-pending{border-color:rgba(var(--gold-rgb),.35);box-shadow:0 0 0 1px rgba(var(--gold-rgb),.12)}
.jc-pending{display:inline-flex;align-items:center;gap: var(--s1);font-size: var(--fs-tiny);font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);margin-top: var(--s1)}
.jc-pending::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(var(--gold-rgb),.18)}
.reflect-feel{margin: var(--s3) 0 var(--s1)}
.reflect-feel .fchips{margin-bottom: var(--s2)}

/* ===== Elevation pass: smooth press-and-release on every tappable (scales existed but snapped) ===== */
.icon-btn,.chip,.tab,.idea,.jcard,.vcard,.hub-row,.lb-row,.react-btn,.took-btn,.settings-row.tap,.tool-tile,.path,.read-next,.quiz-opt,.comm-act,.floor-card,.book-card,.up-card,.notif,.chan,.dci-btn,.story-strip,.social-btn,.btn-office{transition:transform .12s var(--ease-spring,cubic-bezier(.2,.7,.2,1)),filter .12s ease,opacity .12s ease}

/* ============ Announcements — one-way team channel ============ */
.tc-shell{display:flex;flex-direction:column;flex:1;min-height:0;background:var(--bg)}
.tc-bar{
  flex:none;display:flex;align-items:center;gap: var(--s3);
  padding: var(--s1) var(--s3) var(--s3);border-bottom:1px solid var(--line);
}
.tc-bar-av{
  flex:none;width:40px;height:40px;border-radius:14px;
  display:grid;place-items:center;overflow:hidden;
  background:#0a0a0a;border:1px solid var(--gold-line);
}
.tc-bar-av .tc-brand-logo{display:block;width:100%;height:100%;object-fit:contain;padding:4px;box-sizing:border-box}

.tc-bar-id{flex:1;min-width:0;display:flex;flex-direction:column;gap: 1px}
.tc-bar-title{font-family:var(--display);font-size: var(--fs-h2);font-weight:700;letter-spacing:-.02em;line-height:1.2}
.tc-bar-sub{font-size: var(--fs-tiny);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-bar-x{
  flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);
  background:var(--surface-2);color:var(--muted);display:grid;place-items:center;cursor:pointer;
}
.tc-bar-x .ic{width:17px;height:17px;transform:rotate(45deg)}
.tc-bar-x:active{transform:scale(.94)}

.tc-pinstrip{
  flex:none;display:flex;align-items:center;gap: var(--s2);width:100%;
  padding: var(--s2) var(--s3);border:none;border-bottom:1px solid var(--line);cursor:pointer;text-align:left;
  background:linear-gradient(90deg,rgba(var(--gold-rgb),.13),rgba(var(--gold-rgb),.03));
}
.tc-pinstrip > .ic{width:15px;height:15px;color:var(--gold);flex:none}
.tc-pinstrip .ic:last-child{width:14px;height:14px;color:var(--faint);margin-left: auto}
.tc-pinstrip-tx{min-width:0;display:flex;flex-direction:column;gap: 1px}
.tc-pinstrip-tx b{font-size: var(--fs-tiny);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.tc-pinstrip-tx small{font-size: var(--fs-small);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.tc-scroll{
  flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;touch-action:pan-y;
  padding: var(--s2) var(--s3) var(--s3);scrollbar-width:none;
}
.tc-scroll::-webkit-scrollbar{display:none}
.tc-thread{display:flex;flex-direction:column;max-width:560px;margin: 0 auto}

.tc-day{display:flex;align-items:center;gap: var(--s2);margin: var(--s3) 2px var(--s3)}
.tc-day::before,.tc-day::after{content:"";flex:1;height:1px;background:var(--line)}
.tc-day span{
  font-size: var(--fs-tiny);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);
  white-space:nowrap;
}
.tc-newmark{display:flex;align-items:center;gap: var(--s2);margin: var(--s3) 2px var(--s2)}
.tc-newmark::before,.tc-newmark::after{content:"";flex:1;height:1px;background:var(--gold-line)}
.tc-newmark span{
  font-size: var(--fs-tiny);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);
  background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);
  padding: var(--s1) var(--s2);border-radius:999px;white-space:nowrap;
}

.tc-msg{display:grid;grid-template-columns:34px minmax(0,1fr);gap: var(--s2);margin-bottom: var(--s3);align-items:flex-start}
.tc-msg-grouped{margin-top: -var(--s1)}
.tc-msg-av{
  width:34px;height:34px;border-radius:12px;flex:none;
  display:grid;place-items:center;overflow:hidden;
  background:#0a0a0a;border:1px solid var(--gold-line);
}
.tc-msg-av .tc-brand-logo{display:block;width:100%;height:100%;object-fit:contain;padding:3px;box-sizing:border-box}

.tc-msg-grouped .tc-msg-av{background:none;border-color:transparent}
.tc-msg-col{min-width:0;display:flex;flex-direction:column;gap: var(--s1)}
.tc-msg-who{display:flex;align-items:center;gap: var(--s2);padding-left: 2px;min-width:0}
.tc-msg-name{font-family:var(--display);font-size: var(--fs-small);font-weight:700;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-badge{
  flex:none;display:inline-flex;align-items:center;gap: var(--s1);
  font-size: var(--fs-tiny);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);
  background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);
  padding: 2px var(--s2);border-radius:999px;
}
.tc-badge .ic{width:10px;height:10px}
.tc-msg-bubble{
  position:relative;min-width:0;
  background:var(--surface-2);border:1px solid var(--line-2);
  border-radius:4px 16px 16px 16px;padding: var(--s3) var(--s3) var(--s2);
  box-shadow:0 2px 10px -6px rgba(0,0,0,.45);
}
.tc-msg-grouped .tc-msg-bubble{border-radius:16px}
.tc-msg-pinned .tc-msg-bubble{
  border-color:var(--gold-line);
  background:linear-gradient(150deg,rgba(var(--gold-rgb),.11),var(--surface-2) 65%);
}
.tc-flag{
  display:inline-flex;align-items:center;gap: var(--s1);margin-bottom: var(--s2);
  font-size: var(--fs-tiny);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);
}
.tc-flag .ic{width:11px;height:11px}
.tc-msg-title{font-family:var(--display);font-size: var(--fs-h3);font-weight:700;letter-spacing:-.02em;line-height:1.3;margin-bottom: var(--s1)}
.tc-msg-text{font-size: var(--fs-h4);line-height:1.55;color:var(--text-2);white-space:pre-wrap;overflow-wrap:anywhere}
.tc-inline-link{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.tc-links{display:flex;flex-direction:column;gap: var(--s2);margin-top: var(--s2)}
.tc-link{
  display:flex;align-items:center;gap: var(--s2);width:100%;cursor:pointer;text-align:left;
  padding: var(--s2) var(--s3);border-radius:12px;
  background:var(--surface-3);border:1px solid var(--line-2);
  font-family:var(--body);font-size: var(--fs-small);font-weight:600;color:var(--text);
}
.tc-link .ic{width:15px;height:15px;flex:none;color:var(--muted)}
.tc-link span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tc-link .tc-link-go{width:13px;height:13px;color:var(--faint);margin-left: auto}
.tc-link:active{transform:scale(.99)}
.tc-link-gold{
  background:linear-gradient(150deg,rgba(var(--gold-rgb),.2),rgba(var(--gold-rgb),.07));
  border-color:var(--gold-line);color:var(--text);
}
.tc-link-gold .ic{color:var(--gold)}
.tc-msg-foot{display:flex;align-items:center;justify-content:flex-end;margin-top: var(--s1)}
.tc-msg-time{font-size: var(--fs-tiny);color:var(--faint);font-variant-numeric:tabular-nums;white-space:nowrap}
.tc-actions:empty{display:none}
.tc-actions{margin-top: var(--s2)}
.tc-react{display:flex;flex-wrap:wrap;gap: var(--s1);align-items:center}
.tc-react-btn{
  appearance:none;margin: 0;cursor:pointer;
  display:inline-flex;align-items:center;gap: var(--s1);
  min-height:44px;min-width:44px;padding: var(--s1) var(--s2) var(--s1) var(--s2);
  border-radius:999px;
  border:1px solid var(--line-2);
  background:var(--surface-3);
  color:var(--text);
  font-family:var(--sans);font-size: var(--fs-small);font-weight:600;line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
  transition:transform .18s cubic-bezier(.34,1.4,.44,1),background .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.tc-react-btn .tc-react-emoji{font-size: var(--fs-h3);line-height:1;display:inline-block;transform-origin:center bottom}
.tc-react-btn .tc-react-n{font-size: var(--fs-tiny);color:var(--muted);min-width:.6em}
.tc-react-btn .tc-react-n:empty{display:none}
.tc-react-btn.has-n .tc-react-n{display:inline}
.tc-react-btn:hover{border-color:var(--gold-line);background:rgba(var(--gold-rgb),.08)}
.tc-react-btn:active{transform:scale(.92)}
.tc-react-btn.is-busy{opacity:.65;pointer-events:none}
.tc-react-btn.is-on{
  border-color:var(--gold);
  background:linear-gradient(145deg,rgba(var(--gold-rgb),.22),rgba(var(--gold-rgb),.08));
  box-shadow:0 0 0 1px rgba(var(--gold-rgb),.18),inset 0 1px 0 rgba(255,255,255,.14);
}
.tc-react-btn.is-on .tc-react-n{color:var(--gold-hi)}
.tc-react-btn:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.tc-react-emoji.is-pop{animation:reactPop .48s cubic-bezier(.34,1.45,.44,1) both}
.tc-react-n.is-bump{animation:reactBump .42s cubic-bezier(.22,.9,.3,1) both}
@keyframes reactPop{
  0%{transform:scale(.72) translateY(4px);opacity:.5}
  45%{transform:scale(1.28) translateY(-3px);opacity:1}
  100%{transform:scale(1) translateY(0);opacity:1}
}
@keyframes reactBump{
  0%{transform:translateY(3px);opacity:.4}
  55%{transform:translateY(-2px);opacity:1}
  100%{transform:translateY(0);opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .tc-react-btn{transition:none}
  .tc-react-emoji.is-pop,.tc-react-n.is-bump{animation:none}
}
html[data-theme="light"] .tc-react-btn{background:var(--surface-2)}
html[data-theme="light"] .tc-react-btn.is-on{background:linear-gradient(145deg,rgba(var(--gold-rgb),.18),rgba(var(--gold-rgb),.06))}


.tc-empty{text-align:center;padding: var(--s9) var(--s5) var(--s8);color:var(--muted);max-width:340px;margin: 0 auto}
.tc-empty-ic{
  width:52px;height:52px;border-radius:18px;margin: 0 auto var(--s3);display:grid;place-items:center;
  background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);
}
.tc-empty-ic .ic{width:24px;height:24px;color:var(--gold)}
.tc-empty b{display:block;font-family:var(--display);font-size:16px;color:var(--text);margin-bottom: var(--s2)}
.tc-empty p{font-size: var(--fs-small);line-height:1.55;margin: 0}

.tc-foot{
  flex:none;padding: var(--s2) var(--s3) calc(12px + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--line);background:var(--bg);
}
.tc-compose-btn{display:flex;align-items:center;justify-content:center;gap: var(--s2)}
.tc-compose-btn .ic{width:16px;height:16px}
.tc-readonly{
  display:flex;align-items:center;justify-content:center;gap: var(--s2);
  padding: var(--s2) var(--s3);border-radius:12px;
  background:var(--surface-2);border:1px solid var(--line);
  font-size: var(--fs-tiny);color:var(--muted);text-align:center;line-height:1.35;
}
.tc-readonly .ic{width:14px;height:14px;color:var(--gold);flex:none}
.tc-archive-btn{width:100%;min-height:44px;display:flex;align-items:center;justify-content:center;gap:var(--s1);margin-bottom:var(--s2);border:1px solid var(--line-2);border-radius:12px;background:var(--surface-2);color:var(--gold);font-size:var(--fs-small);font-weight:700;cursor:pointer}
.tc-archive-btn .ic{width:14px;height:14px}
.tc-archive-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tc-archive-note{flex:none;padding:var(--s2) var(--s3);border-bottom:1px solid var(--line);font-size:var(--fs-tiny);line-height:1.4;color:var(--muted);text-align:center;background:rgba(var(--gold-rgb),.06)}

/* office preview card */
.tc-preview{padding: var(--s2) var(--s3) var(--s1)}
.tc-preview .tc-msg{margin-bottom: var(--s2)}
.tc-preview .tc-msg-bubble{padding: var(--s2) var(--s3) var(--s2)}
.tc-preview .tc-msg-title{font-size: var(--fs-body)}
.tc-preview .tc-msg-text{font-size: var(--fs-small);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tc-preview .tc-links{display:none}
.tc-preview-open{
  width:100%;display:flex;align-items:center;justify-content:center;gap: var(--s1);
  padding: var(--s2) 0 var(--s2);border-top:1px solid var(--line);
  font-size: var(--fs-small);font-weight:700;color:var(--gold);cursor:pointer;
}
.tc-preview-open .ic{width:13px;height:13px}
.tc-head-row{width:100%;margin-top: var(--s4);gap: var(--s3)}
.tc-head-row .more{flex:none;white-space:nowrap}
.office-announcements{margin-top:14px}
.office-announcements .tc-head-row{margin-top:0}
.office-ann-empty{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s2) var(--s4);color:var(--muted)}
.office-ann-empty-icon{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:11px;background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);color:var(--gold)}
.office-ann-empty-icon .ic{width:17px;height:17px}
.office-ann-empty b,.office-ann-empty small{display:block}
.office-ann-empty b{font-size:var(--fs-small);color:var(--text);font-weight:700}
.office-ann-empty small{margin-top:3px;font-size:var(--fs-tiny);line-height:1.4}

/* Announcement media — metadata reserves a compact frame; tap to expand the original */
.tc-media{display:flex;flex-direction:column;gap: var(--s2);margin: 0 0 var(--s2)}
.tc-media-photo-wrap{
  position:relative;display:grid;place-items:center;width:100%;padding:0;margin:0;border:1px solid var(--line);border-radius:12px;
  overflow:hidden;background:linear-gradient(145deg,var(--surface-3),var(--surface-2));cursor:zoom-in;line-height:0;
  -webkit-user-select:none;user-select:none;appearance:none;-webkit-appearance:none;font:inherit;color:inherit;text-align:left;
}
.tc-media-photo-wrap:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tc-media-photo-wrap:active{opacity:.92}
.tc-media-photo-wrap.is-tall{background:linear-gradient(145deg,rgba(var(--gold-rgb),.08),var(--surface-3))}
.tc-media-photo-wrap.is-wide{background:var(--surface-3)}
.tc-media:not(.tc-media-gallery) > .tc-media-photo-wrap{max-height:min(360px,48vh)}
.tc-media-photo{
  display:block;width:100%;height:100%;max-width:100%;object-fit:contain;background:transparent;
}
.tc-media-view-label{position:absolute;left:50%;bottom:var(--s2);transform:translateX(-50%);padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.68);color:#fff;font-size:var(--fs-tiny);font-weight:700;line-height:1;white-space:nowrap;pointer-events:none}
.tc-media-photo-wrap.is-loading .tc-media-view-label,.tc-media-photo-wrap.is-error .tc-media-view-label{display:none}
.tc-media-photo-wrap.is-error{cursor:default}
.tc-media-photo-wrap.is-error .tc-media-photo{display:none}
.tc-media-photo-wrap.is-loading .tc-media-error,.tc-media-photo-wrap.is-loaded .tc-media-error{display:none}
.tc-media-photo-wrap.is-error .tc-media-error{display:flex}
.tc-media-photo-wrap.is-retrying .tc-media-error{display:flex}
.tc-media-error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:var(--s2);padding:var(--s3);background:linear-gradient(145deg,rgba(var(--gold-rgb),.09),var(--surface-3));line-height:1.25}
.tc-media-error-icon{width:36px;height:36px;display:grid;place-items:center;flex:none;border-radius:12px;background:rgba(var(--gold-rgb),.12);border:1px solid var(--gold-line);color:var(--gold)}
.tc-media-error-icon .ic{width:17px;height:17px}
.tc-media-error-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.tc-media-error-copy b{font-size:var(--fs-small);color:var(--text)}
.tc-media-error-copy small{font-size:var(--fs-tiny);color:var(--muted);white-space:normal}
.tc-media-retry{flex:none;min-height:44px;padding:0 var(--s2);border:1px solid var(--gold-line);border-radius:999px;background:rgba(var(--gold-rgb),.12);color:var(--gold);font-size:var(--fs-tiny);font-weight:700;cursor:pointer}
.tc-media-retry:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tc-media-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
.tc-media-gallery .tc-media-photo-wrap{aspect-ratio:1!important}
.tc-media-gallery-3 .tc-media-photo-wrap:first-child{grid-row:span 2;aspect-ratio:1/2.02!important}
.tc-media-gallery-3 .tc-media-photo-wrap:first-child .tc-media-photo{object-fit:cover}
.tc-media-gallery-3 .tc-media-photo-wrap:not(:first-child) .tc-media-photo,.tc-media-gallery-4 .tc-media-photo{object-fit:cover}
.tc-media-gallery .tc-media-error{padding:var(--s2);gap:var(--s1);flex-direction:column;text-align:center}
.tc-media-gallery .tc-media-error-copy small{display:none}
.tc-media-gallery .tc-media-error-icon{width:30px;height:30px}
.tc-media-gallery .tc-media-retry{min-height:36px;padding:0 var(--s2)}
.tc-media-video{width:100%;max-height:320px;border-radius:12px;background:#000;border:1px solid var(--line)}
.tc-media-voice{
  display:flex;flex-direction:column;gap: var(--s2);padding: var(--s2) var(--s3);border-radius:12px;
  background:rgba(var(--gold-rgb),.08);border:1px solid var(--gold-line);
}
.tc-media-voice-label{display:inline-flex;align-items:center;gap: var(--s1);font-size: var(--fs-small);font-weight:700;color:var(--gold)}
.tc-media-voice-label .ic{width:14px;height:14px}
.tc-media-audio{width:100%;height:36px}
.tc-media-chip{
  display:inline-flex;align-items:center;gap: var(--s1);align-self:flex-start;
  padding: var(--s1) var(--s2);border-radius:999px;font-size: var(--fs-tiny);font-weight:600;color:var(--muted);
  background:var(--surface-3);border:1px solid var(--line);
}
.tc-media-chip .ic{width:13px;height:13px;color:var(--gold)}
.tc-preview .tc-media-photo,.tc-preview .tc-media-video,.tc-preview .tc-media-voice{display:none}
/* In-sheet photo expand — does not replace the locked announcements modal */
.tc-photo-lb{
  position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
  background:rgba(0,0,0,.82);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.tc-photo-lb img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:12px}
.tc-photo-lb-figure{display:flex;flex-direction:column;align-items:center;gap:var(--s2);max-width:100%;max-height:100%;margin:0}
.tc-photo-lb-figure figcaption{font-size:var(--fs-tiny);color:rgba(255,255,255,.72);font-variant-numeric:tabular-nums}
.tc-photo-lb-x{
  position:absolute;top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));
  width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.18);
  background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;cursor:pointer;
}
.tc-photo-lb-x .ic{width:18px;height:18px;transform:rotate(45deg)}
.tc-photo-lb-x:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tc-photo-lb-nav{position:absolute;top:50%;z-index:1;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;cursor:pointer;transform:translateY(-50%)}
.tc-photo-lb-prev{left:max(12px,env(safe-area-inset-left));transform:translateY(-50%) rotate(180deg)}
.tc-photo-lb-next{right:max(12px,env(safe-area-inset-right))}
.tc-photo-lb-nav:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.tc-photo-lb-nav .ic{width:18px;height:18px}

/* ==========================================================================
   TEAM REQUEST BUILD (2026-07-31) — traders, calendar, recordings, events,
   results, what's new, support centre, new-member checklist.
   Token-only: no hardcoded hex, so every surface follows the theme.
   Plan: docs/TEAM_REQUEST_PLAN.md
   ========================================================================== */

/* ---- shared: segmented control on the Live tab ---- */
.seg-live{margin: var(--s1) 0 var(--s3)}
/* Live hub seg must clear the notch when no topbar is present (native shell). */
html[data-native="1"] #screen > .seg-live:first-child{
  margin-top: max(var(--s3), calc(env(safe-area-inset-top, 0px) + 10px));
}
html[data-native="1"] .app-topbar + .seg-live{margin-top: var(--s2)}

/* ---- traders ---- */
.trader-card{
  display:block;width:100%;text-align:left;padding: var(--s4);margin-bottom: var(--s3);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);
}
.trader-card.mine{border-color:var(--gold-line);box-shadow:var(--sh-1),0 0 0 1px var(--gold-line) inset}
.tc-top{display:flex;align-items:center;gap: var(--s3)}
.tc-id{flex:1;min-width:0}
.tc-id b{display:flex;align-items:center;gap: var(--s1);font-family:var(--display);font-size:15.5px;letter-spacing:var(--tracking)}
.tc-id small{display:block;color:var(--muted);font-size: var(--fs-small);margin-top: 2px}
/* sprite icons are stroke-outlines — a bare ic() with no .ic class needs these or it fills solid */
.tc-tick{width:13px;height:13px;color:var(--gold);flex:none;fill:none;stroke:currentColor;stroke-width:2.4}
.tc-pill{flex:none}
.tc-chev{width:16px;height:16px;color:var(--faint);flex:none}
.tc-tag{margin: var(--s3) 0 0;font-size:var(--fs-small);line-height:1.55;color:var(--text-2)}
.tc-meta{display:flex;flex-wrap:wrap;gap: var(--s4);margin-top: var(--s3);font-size:var(--fs-tiny);color:var(--muted)}
.tc-meta span{display:inline-flex;align-items:center;gap: var(--s1)}
.tc-meta .ic{width:13px;height:13px;color:var(--gold)}

.trader-hero{display:flex;align-items:center;gap: var(--s3);margin: var(--s1) 0 0}
.th-id b{display:flex;align-items:center;gap: var(--s1);font-family:var(--display);font-size: var(--fs-h1);letter-spacing:var(--tracking)}
.th-id small{display:block;color:var(--gold);font-size: var(--fs-small);font-weight:600;margin-top: var(--s1)}
.th-tag{margin: var(--s3) 2px 0;line-height:1.6}
.th-focus{display:flex;flex-wrap:wrap;gap: var(--s2);margin: var(--s3) 2px 0}
.th-pending{display:flex;align-items:flex-start;gap: var(--s3)}
.th-pending .ic{width:19px;height:19px;color:var(--gold);flex:none;margin-top: 2px}
.th-pending b{display:block;font-family:var(--display);font-size: var(--fs-body)}
.th-pending small{display:block;color:var(--muted);font-size: var(--fs-small);line-height:1.55;margin-top: var(--s1)}
.th-bio{border-color:var(--gold-line);background:var(--surface-2)}
.th-bio-copy{margin:0;line-height:1.7;color:var(--text-2)}
.th-chan-top{display:flex;align-items:center;gap: var(--s3)}
.th-chan-top b{display:block;font-family:var(--display);font-size: var(--fs-body)}
.th-chan-top small{display:block;color:var(--muted);font-size: var(--fs-small)}
.th-mark{font-size:24px;line-height:1}

/* ---- weekly calendar ---- */
.wk-hero{margin:2px 0 var(--s3);border-color:var(--gold-line);background:
  radial-gradient(120% 80% at 0% 0%,rgba(var(--gold-rgb),.14),transparent 55%),
  var(--surface-2)}
.wk-hero .eyebrow{display:inline-flex;align-items:center;gap:6px}
.wk-hero-title{display:block;font-family:var(--display);font-size:var(--fs-h3);margin-top:var(--s2);letter-spacing:-.02em}
.wk-hero-sub{display:block;color:var(--muted);font-size:var(--fs-small);margin-top:var(--s1);line-height:1.45}
.wk-board{display:flex;flex-direction:column;gap:var(--s3);margin-top:var(--s2)}
.wk-day{
  padding:var(--s3);border-radius:var(--r-lg);border:1px solid var(--line);
  background:var(--surface-2);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.wk-day.is-today{border-color:var(--gold-line);background:
  linear-gradient(180deg,rgba(var(--gold-rgb),.08),transparent 42%),var(--surface-2)}
.wk-day-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);margin-bottom:var(--s2)}
.wk-day-name{font-family:var(--mono);font-size:var(--fs-tiny);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.wk-day-count{font-size:var(--fs-tiny);color:var(--muted)}
.wk-day-slots{display:flex;flex-direction:column;gap:var(--s2)}
.wk-day-slots .cr-time .cr-day{font-family:var(--display);font-size:var(--fs-small);font-weight:700;letter-spacing:-.01em;color:var(--text);line-height:1.15}
.cr-time small.num{font-family:var(--mono);font-weight:700;color:var(--gold)}
.call-row .cr-time{width:64px}
.call-row{margin-bottom:0}
.wk-footer{display:flex;align-items:flex-start;gap:var(--s3);margin-top:var(--s4);border-color:var(--gold-line)}
.wk-footer .ic{width:19px;height:19px;color:var(--gold);flex:none;margin-top:2px}
.wk-footer b{display:block;font-family:var(--display);font-size:var(--fs-body)}
.wk-footer small{display:block;color:var(--muted);font-size:var(--fs-small);line-height:1.55;margin-top:var(--s1)}
.cr-icon{
  flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:var(--r-md);
  background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);color:var(--gold);
}
.cr-icon .ic{width:16px;height:16px;color:inherit;stroke:currentColor}
.call-row[data-calltype="training"] .cr-icon,
.call-row[data-calltype="onboarding"] .cr-icon,
.call-row[data-calltype="education"] .cr-icon{background:rgba(var(--gold-rgb),.12);border-color:var(--gold-line);color:var(--gold)}
.call-row[data-calltype="mindset"] .cr-icon{background:rgba(240,86,91,.1);border-color:rgba(240,86,91,.28);color:var(--down)}
.call-row[data-calltype="chart-analysis"] .cr-icon{background:var(--surface-4);color:var(--text)}
/* Light mode: pale blues/greys vanish on cream — force high-contrast ink */
html[data-theme="light"] .cr-icon{
  background:rgba(154,123,46,.12);
  border-color:rgba(154,123,46,.38);
  color:#8A6B24;
}
html[data-theme="light"] .call-row[data-calltype="training"] .cr-icon,
html[data-theme="light"] .call-row[data-calltype="onboarding"] .cr-icon,
html[data-theme="light"] .call-row[data-calltype="education"] .cr-icon{
  background:rgba(var(--gold-rgb),.12);
  border-color:var(--gold-line);
  color:var(--gold);
}
html[data-theme="light"] .call-row[data-calltype="mindset"] .cr-icon{
  background:rgba(178,42,48,.1);
  border-color:rgba(178,42,48,.36);
  color:#B22A30;
}
html[data-theme="light"] .call-row[data-calltype="chart-analysis"] .cr-icon{
  background:rgba(22,20,14,.06);
  border-color:rgba(22,20,14,.2);
  color:#2A2A30;
}
html[data-theme="light"] .call-row[data-calltype="live-trading"] .cr-icon{
  background:rgba(154,123,46,.12);
  border-color:rgba(154,123,46,.38);
  color:#8A6B24;
}
.cal-day{
  display:flex;align-items:center;gap: var(--s2);margin: var(--s4) 2px var(--s2);
  font-size: var(--fs-tiny);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
}
.cal-day::after{content:"";flex:1;height:1px;background:var(--line)}
.cal-mine{
  display:flex;align-items:center;gap: var(--s2);padding: var(--s2) var(--s3);margin: 2px 0 var(--s1);
  border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);
  font-size: var(--fs-small);color:var(--muted);
}
.cal-mine .ic{width:15px;height:15px;color:var(--gold);flex:none}
.cal-onboard{display:flex;flex-wrap:wrap;align-items:flex-start;gap: var(--s3);margin-top: var(--s4)}
.cal-onboard .ic{width:19px;height:19px;color:var(--gold);flex:none;margin-top: 2px}
.cal-onboard b{display:block;font-family:var(--display);font-size: var(--fs-body)}
.cal-onboard small{display:block;color:var(--muted);font-size: var(--fs-small);line-height:1.55;margin-top: var(--s1)}
.cal-onboard > div{flex:1;min-width:0}
.cal-onboard .btn{flex-basis:100%}

.call-row{
  display:flex;align-items:center;gap: var(--s3);padding: var(--s3) var(--s3);margin-bottom: var(--s2);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);
}
.call-row.next{border-color:var(--gold-line);background:var(--surface-3)}
.cr-time{flex:none;width:58px;text-align:center}
.cr-time b{display:block;font-size: var(--fs-small);letter-spacing:var(--tracking-num)}
.cr-time small{display:block;font-size: var(--fs-tiny);color:var(--muted);margin-top: 1px}
.cr-body{flex:1;min-width:0;text-align:left;padding: 0}
.cr-body b{display:flex;align-items:center;gap: var(--s1);font-size: var(--fs-h4);font-weight:650}
.cr-body small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s1)}
.cr-star{display:inline-flex;flex:none}
.cr-star .ic{width:12px;height:12px;color:var(--gold)}
.cr-bell{
  flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:var(--r-full);
  background:var(--surface-3);border:1px solid var(--line);color:var(--muted);cursor:pointer;
  transition:transform .18s var(--ease-out),color .18s,border-color .18s;
}
.cr-bell svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;}
.cr-bell:active{transform:scale(.92)}
.cr-bell.on{color:var(--gold);border-color:var(--gold-line);background:rgba(var(--gold-rgb),.1)}
.cd-host{display:flex;align-items:center;gap: var(--s3);margin: var(--s3) 0 var(--s1)}
.cd-host b{display:block;font-family:var(--display);font-size: var(--fs-h3)}
.cd-host small{display:block;color:var(--muted);font-size: var(--fs-small);margin-top: 2px}
.cd-host > div{flex:1;min-width:0}
/* the avatar is also a bare <div> — stop the flex:1 above stretching it into an ellipse */
.cd-host .av{flex:none}

/* ---- recordings ---- */
.rec-filters{display:flex;gap: var(--s2);margin: 2px 0 var(--s1)}
.rec-sel{flex:1;min-width:0;display:block}
.rec-sel span{display:block;font-size: var(--fs-tiny);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom: var(--s1)}
.rec-sel select{
  width:100%;padding: var(--s2) var(--s2);font:inherit;font-size: var(--fs-small);color:var(--text);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);
  appearance:none;-webkit-appearance:none;
}
.rec-row{
  display:flex;align-items:flex-start;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);margin-bottom: var(--s2);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);
}
.rec-thumb{
  flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:var(--r-md);
  background:var(--surface-4);border:1px solid var(--line);color:var(--gold);
}
.rec-thumb svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;}
.rec-thumb.pending{color:var(--faint)}   /* not uploaded yet — dimmed play mark */
.rec-body{flex:1;min-width:0}
.rec-body b{display:block;font-size: var(--fs-h4);font-weight:650;line-height:1.35}
.rec-body small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s1)}
.rec-tags{display:flex;flex-wrap:wrap;gap: var(--s1);margin-top: var(--s2)}
.rec-tags .pill{font-size: var(--fs-tiny);padding: var(--s1) var(--s2)}
.rec-pending{display:flex;align-items:flex-start;gap: var(--s3);padding: var(--s3);margin: var(--s3) 0;border-radius:var(--r-md);background:var(--surface-3);border:1px solid var(--line)}
.rec-pending .ic{width:19px;height:19px;color:var(--gold);flex:none;margin-top: 2px}
.rec-pending b{display:block;font-family:var(--display);font-size: var(--fs-body)}
.rec-pending small{display:block;color:var(--muted);font-size: var(--fs-small);line-height:1.55;margin-top: var(--s1)}
.rec-facts{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2)}
.rec-facts > div{padding: var(--s3);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line)}
.rec-facts small{display:block;font-size: var(--fs-tiny);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rec-facts b{display:block;font-size: var(--fs-h4);margin-top: var(--s1)}

/* ---- events (native app card language — mirrors trader-mini / trader-card) ---- */
.event-card{
  display:block;width:100%;text-align:left;padding: var(--s4);margin-bottom: var(--s3);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);
  position:relative;overflow:hidden;isolation:isolate;
}
.event-card:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.event-card:active{transform:scale(.985)}
.event-card:disabled{cursor:default;opacity:.6}
.event-card > *{position:relative;z-index:1}

.event-card .ev-top{display:flex;align-items:center;gap: var(--s3)}
.ev-id{flex:1;min-width:0}
.ev-id b{display:flex;align-items:center;gap: var(--s1);font-family:var(--display);font-size:15.5px;line-height:1.3;letter-spacing:var(--tracking)}
.ev-id small{display:block;color:var(--muted);font-size: var(--fs-small);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ev-pill{flex:none;display:inline-flex;align-items:center;min-height:22px;padding:3px 10px;border-radius:var(--r-full);font-size:var(--fs-tiny);line-height:1;letter-spacing:.02em;color:var(--text-2);background:var(--surface-3);border:1px solid var(--line);white-space:nowrap}
.ev-pill.gold{color:var(--gold-hi);background:rgba(var(--gold-rgb),.12);border-color:var(--gold-line)}
.ev-pill-live{color:#7ee8ae;border-color:rgba(86,220,154,.42);background:rgba(86,220,154,.10)}

.event-card .ev-detail{display:flex;align-items:baseline;gap: var(--s2);min-width:0;padding-top:var(--s2);margin-top:var(--s3);border-top:1px solid var(--line)}
.ev-detail-label{flex:none;color:var(--gold);font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.ev-detail-value{min-width:0;overflow:hidden;color:var(--text);font-size:var(--fs-small);text-overflow:ellipsis;white-space:nowrap}
.ev-tag{margin: var(--s3) 0 0;font-size:var(--fs-small);line-height:1.55;color:var(--text-2)}
.ev-meta{display:flex;flex-wrap:wrap;align-items:center;gap: var(--s4);margin-top: var(--s3);font-size:var(--fs-tiny);color:var(--muted)}
.ev-meta span{display:inline-flex;align-items:center;gap: var(--s1)}
.ev-meta .ic{width:13px;height:13px;color:var(--gold)}
.ev-meta-arrow{margin-left:auto;display:inline-flex!important;align-items:center;justify-content:center;line-height:0}
.ev-meta .ev-arrow{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--surface-3);border:1px solid var(--line-2);color:var(--gold);line-height:0}
.ev-arrow .ic{width:16px;height:16px}

/* life-state accent */
.event-life-live{border-color:rgba(86,220,154,.42);box-shadow:var(--sh-1),0 0 0 1px rgba(86,220,154,.14)}
.event-life-soon{border-color:var(--gold-line);box-shadow:var(--sh-1),0 0 0 1px var(--gold-line) inset}
.event-life-ended{opacity:.82}
/* Cover lives in its own band so poster faces aren’t crushed under card copy. */
.event-has-cover{padding:0}
.event-has-cover .ev-cover-band{
  position:relative;z-index:0;flex:none;height:172px;width:100%;
  background-color:#0a0a0a;
  background-image:var(--event-cover);
  background-size:cover;
  background-position:var(--event-cover-pos, center 18%);
  background-repeat:no-repeat;
  filter:saturate(.96);
}
.event-has-cover .ev-cover-band::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,8,11,.08),rgba(7,8,11,.22) 55%,rgba(7,8,11,.55));
}
.event-has-cover .ev-body{position:relative;z-index:1;padding:var(--s4);background:var(--surface-2)}
.event-card.event-mini.event-has-cover .ev-cover-band{height:132px}
.event-card.event-mini.event-has-cover .ev-body{padding:var(--s3) var(--s4) var(--s4)}

/* Home swipe-rail mini card — same structure as trader-mini */
.event-card.event-mini{
  flex:0 0 min(80vw,300px);margin-bottom:0;padding:var(--s4);
}
.event-mini-profile{display:grid;grid-template-columns:52px minmax(0,1fr) 34px;align-items:center;gap:var(--s2);min-width:0}
.ev-mini-date{flex:none;width:52px;text-align:center;padding: var(--s2) 0;border-radius:var(--r-md);background:var(--surface-4);border:1px solid var(--gold-line);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.ev-mini-date b{display:block;font-family:var(--display);font-size:21px;color:var(--gold);line-height:1;letter-spacing:-.01em}
.ev-mini-date small{display:block;font-size:var(--fs-tiny);text-transform:uppercase;letter-spacing:.1em;color:var(--faint);margin-top: var(--s1);font-weight:600}
.ev-mini-copy{min-width:0}
.ev-mini-copy b{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-family:var(--display);font-size:var(--fs-h3);line-height:1.16;letter-spacing:-.02em}
.ev-mini-copy small{display:block;margin-top:var(--s1);color:var(--muted);font-size:var(--fs-small);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev-mini-detail{display:flex;align-items:baseline;gap:var(--s2);min-width:0;padding-top:var(--s2);margin-top:var(--s3);border-top:1px solid var(--line)}
.ev-mini-detail-label{flex:none;color:var(--gold);font-family:var(--display);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.ev-mini-detail-value{min-width:0;overflow:hidden;color:var(--text);font-size:var(--fs-small);text-overflow:ellipsis;white-space:nowrap}
.ev-mini-bottom{display:flex;align-items:center;gap:var(--s2);min-width:0;margin-top:var(--s3)}
.ev-mini-focus{min-width:0;overflow:hidden;color:var(--muted);font-size:var(--fs-small);text-overflow:ellipsis;white-space:nowrap}
.event-mini .pill{flex:none;margin:0 0 0 auto}

.ev-hero{position:relative;min-height:200px;margin:-8px -8px 16px;border-radius:var(--r-lg);background-size:cover;background-position:var(--event-cover-pos, center 18%);display:flex;align-items:flex-end;padding:var(--s3);overflow:hidden}
.ev-hero-life,.ev-detail-badge{position:relative;display:inline-flex;color:var(--gold-hi);background:rgba(6,7,10,.72);border:1px solid var(--gold-line);backdrop-filter:blur(10px);border-radius:var(--r-full);padding:6px 10px;font-family:var(--display);font-size:var(--fs-tiny);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.ev-detail-badge{margin-bottom:var(--s3)}
[data-theme="light"] .ev-detail-badge{color:var(--gold-hi);background:var(--gold-soft);border-color:var(--gold-line);backdrop-filter:none}
.ev-detail-hype{font-family:var(--display);font-size:var(--fs-h3);line-height:1.35;color:var(--gold-hi);margin:0 0 var(--s3)}
/* event detail sheet */
.ev-facts{display:flex;flex-direction:column;gap: var(--s2);margin: var(--s1) 0 var(--s1)}
.ev-facts-secondary{margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--line)}
.ev-description{margin:var(--s3) 0 0;color:var(--text-2);font-size:var(--fs-small);line-height:1.6}
.ev-description summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);padding:var(--s2) 0;color:var(--text);font-family:var(--display);font-size:var(--fs-small);font-weight:650;cursor:pointer;list-style:none}
.ev-description summary::-webkit-details-marker{display:none}
.ev-description summary::after{content:"+";color:var(--gold);font-family:var(--mono);font-size:16px;font-weight:400}
.ev-description[open] summary::after{content:"−"}
.ev-description-body{padding:var(--s2) 0 0;border-top:1px solid var(--line)}
.ev-description p{margin:0 0 var(--s2)}
.ev-description p:last-child{margin-bottom:0}
.ev-good-to-know{margin:var(--s3) 0 0}
.ev-highlight-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin-top:var(--s2)}
.ev-highlight{display:flex;align-items:center;gap:var(--s2);min-width:0;padding:var(--s2);border-radius:var(--r-md);background:var(--surface-2);border:1px solid var(--line);color:var(--text-2);font-size:var(--fs-tiny);line-height:1.35}
.ev-highlight .ic{flex:none;width:14px;height:14px;color:var(--gold)}
.ev-refund{display:block;margin-top:var(--s2);color:var(--muted);font-size:var(--fs-tiny)}
.eventbrite-link{display:flex;align-items:center;gap:var(--s3);width:100%;margin-top:var(--s4);padding:var(--s3);text-align:left;color:var(--text);background:linear-gradient(135deg,rgba(var(--gold-rgb),.16),var(--surface-2));border:1px solid var(--gold-line);border-radius:var(--r-md);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);cursor:pointer}
.eventbrite-link:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.eventbrite-link:active{transform:scale(.985)}
.eventbrite-link-mark{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:var(--r-full);color:var(--gold-hi);background:rgba(var(--gold-rgb),.16);border:1px solid var(--gold-line)}
.eventbrite-link-mark .ic{width:17px;height:17px}
.eventbrite-link-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.eventbrite-link-copy b{font-family:var(--display);font-size:var(--fs-body);line-height:1.2}
.eventbrite-link-copy small{color:var(--muted);font-size:var(--fs-tiny)}
.eventbrite-link-arrow{flex:none;margin-left:auto;width:17px;height:17px;color:var(--gold)}
.ev-ag{display:flex;gap: var(--s3);padding: var(--s2) 0;border-bottom:1px solid var(--line);font-size: var(--fs-small)}
.ev-ag .num{flex:none;width:56px;color:var(--gold);font-weight:650}
.ev-speakers{display:flex;flex-direction:column;gap: var(--s2)}
.ev-sp{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s2);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.ev-sp b{display:block;font-size: var(--fs-h4)}
.ev-sp small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: 2px}

/* ---- results centre ---- */
.res-warn{
  display:flex;align-items:flex-start;gap: var(--s2);padding: var(--s3) var(--s3);margin: 2px 0 var(--s3);
  border-radius:var(--r-md);background:var(--warn-soft);border:1px solid var(--line);
  font-size: var(--fs-small);line-height:1.55;color:var(--text-2);
}
.res-warn .ic{width:17px;height:17px;color:var(--warn);flex:none;margin-top: 1px}
.res-list{margin-top: var(--s3)}

/* ---- client feedback gallery (Feedback → Client feedback) ---- */
.cf-gallery{display:flex;flex-direction:column;gap:var(--s3);margin:2px 0 var(--s3)}
.cf-shot{
  position:relative;display:block;width:100%;padding:0;margin:0;border:1px solid var(--line);
  border-radius:var(--r-md);overflow:hidden;background:var(--surface-2);cursor:pointer;
  text-align:left;-webkit-tap-highlight-color:transparent;
}
.cf-shot:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.cf-shot:active{transform:scale(.992)}
.cf-shot img{display:block;width:100%;height:auto;vertical-align:top}
.cf-shot .tc-media-view-label{z-index:1}
.res-row{display:flex;align-items:center;gap: var(--s3);padding: var(--s3);margin-bottom: var(--s2);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
/* Home teaser sits inside .card — no nested grey plate */
.res-row.is-bare{padding:0;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.rr-id{flex:1;min-width:0}
.rr-id b{display:block;font-size: var(--fs-h4);font-weight:650}
.rr-id small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s1)}
.rr-val{flex:none;font-size: var(--fs-h3);font-weight:700;letter-spacing:var(--tracking-num)}
.res-trader{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);margin-bottom: var(--s2);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.rt-id{flex:1;min-width:0}
.rt-id b{display:block;font-size: var(--fs-h4)}
.rt-id small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s1)}

/* ---- what's new ---- */
.wn-card{display:block;width:100%;text-align:left;padding: var(--s4);margin-bottom: var(--s3);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg)}
.wn-card.pinned{border-color:var(--gold-line)}
.wn-top{display:flex;align-items:center;gap: var(--s3)}
.wn-ic{flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:var(--r-full);background:var(--surface-4);border:1px solid var(--line);color:var(--gold)}
.wn-ic svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;}
.wn-id{flex:1;min-width:0}
.wn-id b{display:block;font-family:var(--display);font-size:var(--fs-body);line-height:1.35}
.wn-id small{display:block;color:var(--muted);font-size:var(--fs-tiny);margin-top: var(--s1)}
.wn-body{margin: var(--s3) 0 0;font-size:var(--fs-small);line-height:1.6;color:var(--text-2)}
.wn-strip{display:flex;flex-direction:column;gap: var(--s2)}
.wn-mini{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.wn-mini-tx{flex:1;min-width:0}
.wn-mini-tx b{display:block;font-size:var(--fs-small);font-weight:650;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wn-mini-tx small{display:block;color:var(--muted);font-size:var(--fs-tiny);margin-top: var(--s1)}
.wn-mini .ic{width:15px;height:15px;color:var(--faint);flex:none}
.wn-thumb{flex:none;width:44px;height:44px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--line);background:var(--surface-4)}
.wn-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.wn-media-hint{display:inline-flex;align-items:center;gap:4px;margin-top:2px;color:var(--gold)!important}
.wn-media-hint .ic{width:12px;height:12px;color:var(--gold)}

/* ---- help & support ---- */
.sup-quick{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2);margin: 2px 0 var(--s3)}
.sup-q{padding: var(--s3) var(--s3);text-align:left;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);cursor:pointer}
.sup-q svg{width:19px;height:19px;color:var(--gold);fill:none;stroke:currentColor;stroke-width:1.8;}
.sup-q b{display:block;font-family:var(--display);font-size: var(--fs-h4);margin-top: var(--s2)}
.sup-q small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s1)}
.faq-list{margin-top: var(--s4)}
.faq{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom: var(--s2);overflow:hidden}
.faq-q{
  display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3) var(--s3);
  background:none;border:0;color:var(--text);font:inherit;font-size: var(--fs-h4);font-weight:650;line-height:1.45;cursor:pointer;
}
.faq-chev{width:15px;height:15px;color:var(--faint);flex:none;margin-left: auto;transform:rotate(90deg);transition:transform .22s var(--ease-out)}
.faq.open .faq-chev{transform:rotate(-90deg);color:var(--gold)}
/* max-height (not grid 0fr→1fr — that collapsed the answer to a single line here) */
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s var(--ease-out)}
.faq.open .faq-a{max-height:520px}
.faq-a > p{margin: 0;padding: 0 var(--s3) var(--s4);font-size: var(--fs-small);line-height:1.65;color:var(--text-2)}

/* Help & support — FAQs | Contact */
.sup-still{margin-top: var(--s4);text-align:center}
.sup-still b{font-family:var(--display);display:block}
.sup-still .sub{display:block;margin: var(--s1) 0 var(--s3)}
.sup-contact{display:flex;flex-direction:column;gap: var(--s3);margin: var(--s2) 0 var(--s4)}
.sup-contact-card{
  display:flex;align-items:flex-start;gap: var(--s3);width:100%;text-align:left;
  padding: var(--s4);background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r-lg);cursor:pointer;color:inherit;
}
.sup-contact-card:active{transform:scale(.985)}
.sup-contact-card:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.sup-contact-card > .ic{flex-shrink:0;color:var(--gold);margin-top: 2px}
.sup-contact-card > .ic:last-child{margin-left: auto;margin-top: 4px;opacity:.55}
.sup-contact-body{flex:1;min-width:0;padding-top: 1px}
.sup-contact-body b{display:block;font-family:var(--display);font-size: var(--fs-body);line-height:1.25}
.sup-contact-body small{display:block;color:var(--muted);font-size: var(--fs-small);line-height:1.55;margin-top: var(--s2)}
.sup-contact + .card{margin-top: var(--s1)}
.sup-hours + .card{margin-top: var(--s3)}
.sup-hours b,.sup-tips + .btn{margin-top: var(--s2)}
.sup-hours b{font-family:var(--display);display:block;margin-bottom: var(--s2)}
.sup-hours .sub{display:block;line-height:1.55;margin-top: 0}
.sup-tips{margin: var(--s3) 0 var(--s4);padding-left: var(--s4);color:var(--text-2);font-size: var(--fs-small);line-height:1.55}
.sup-tips li{margin: 0 0 var(--s3)}
.sup-tips li:last-child{margin-bottom: 0}
#sup-seg{margin: 0 0 var(--s4)}
.sup-lead{margin: var(--s1) 0 var(--s4);font-size: var(--fs-small);line-height:1.55}


/* ---- new member checklist ---- */
.cl-card{display:block;width:100%;text-align:left;padding: var(--s4);margin: var(--s1) 0 var(--s4);background:var(--surface-2);border:1px solid var(--gold-line);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.clc-top{display:flex;align-items:center;justify-content:space-between;gap: var(--s2);margin-bottom: var(--s3)}
.cl-card > b{display:block;font-family:var(--display);font-size: var(--fs-h2);letter-spacing:var(--tracking)}
.cl-card small{display:block;color:var(--muted);font-size: var(--fs-small);margin-top: var(--s2)}
.cl-bar{height:6px;border-radius:var(--r-full);background:var(--surface-4);overflow:hidden;margin-top: var(--s3)}
.cl-bar span{display:block;height:100%;border-radius:var(--r-full);background:var(--gold);transition:width .5s var(--ease-out)}
.cl-prog{margin: 2px 0 var(--s4)}
.cl-prog small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s2);text-align:right}
.cl-step{display:flex;gap: var(--s3);padding: var(--s3);margin-bottom: var(--s2);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg)}
.cl-step.next{border-color:var(--gold-line);background:var(--surface-3)}
.cl-step.done{opacity:.72}
.cl-n{
  flex:none;width:30px;height:30px;display:grid;place-items:center;border-radius:var(--r-full);
  background:var(--surface-4);border:1px solid var(--line);color:var(--muted);
  font-family:var(--display);font-size: var(--fs-body);font-weight:700;
}
.cl-step.next .cl-n{background:var(--gold);border-color:var(--gold);color:var(--on-accent)}
.cl-step.done .cl-n{color:var(--gold);border-color:var(--gold-line)}
.cl-step.done .cl-n svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;}
.cl-body{flex:1;min-width:0}
.cl-body b{display:block;font-family:var(--display);font-size: var(--fs-h3);letter-spacing:var(--tracking)}
.cl-step.done .cl-body b{text-decoration:line-through;text-decoration-color:var(--muted);text-decoration-thickness:1.5px;color:var(--muted)}
.cl-body small{display:block;color:var(--muted);font-size: var(--fs-small);line-height:1.55;margin-top: var(--s1)}
.cl-row{display:flex;align-items:center;gap: var(--s2);flex-wrap:wrap;margin-top: var(--s3)}
.cl-tick{
  background:none;border:0;padding: 0;font:inherit;font-size: var(--fs-small);font-weight:650;
  color:var(--muted);cursor:pointer;
}
.cl-tick.on{color:var(--gold)}
.cl-yn{gap:var(--s2)}
.cl-yn .btn{min-width:88px}
.cl-vip-ans{display:inline-block;margin-top:var(--s3);font-size:var(--fs-small);font-weight:600;color:var(--gold)}
.cl-tutorial{position:relative;display:flex;width:100%;min-height:152px;margin:var(--s3) 0 var(--s4);overflow:hidden;align-items:flex-end;text-align:left;border:1px solid var(--gold-line);border-radius:var(--r-xl);background:#090a0b;box-shadow:var(--sh-1)}
.cl-tutorial-bg,.cl-tutorial-scrim{position:absolute;inset:0;width:100%;height:100%}
.cl-tutorial-bg{object-fit:cover;opacity:.62}
.cl-tutorial-scrim{background:linear-gradient(95deg,rgba(3,4,5,.96),rgba(3,4,5,.72) 62%,rgba(3,4,5,.38))}
.cl-tutorial-copy{position:relative;z-index:1;display:block;max-width:78%;padding:var(--s4)}
.cl-tutorial-kicker{display:block;margin-bottom:var(--s2);color:var(--gold);font-size:var(--fs-tiny);font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.cl-tutorial-copy b{display:block;color:var(--text);font-family:var(--display);font-size:var(--fs-h2);line-height:1.12}
.cl-tutorial-copy small{display:block;margin-top:var(--s2);color:var(--muted);font-size:var(--fs-small);line-height:1.45}
.cl-tutorial:active{transform:scale(.985)}

/* ---- my trader (home) ---- */
.mt-card{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-1)}
.mt-empty{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3)}
.mt-empty .ic{width:20px;height:20px;color:var(--gold);flex:none}
.mt-empty > div{flex:1;min-width:0}
.mt-empty b{display:block;font-family:var(--display);font-size: var(--fs-h3)}
.mt-empty small{display:block;color:var(--muted);font-size: var(--fs-small);line-height:1.5;margin-top: var(--s1)}
.mt-head{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3)}
.mt-id{flex:1;min-width:0}
.mt-id b{display:flex;align-items:center;gap: var(--s1);font-family:var(--display);font-size:15.5px}
.mt-id small{display:block;color:var(--muted);font-size: var(--fs-small);margin-top: 2px}
.mt-head .ic{width:16px;height:16px;color:var(--faint);flex:none}
.mt-next{display:flex;align-items:center;gap: var(--s2);padding: var(--s3) var(--s3);border-top:1px solid var(--line);font-size: var(--fs-small);color:var(--muted)}
.mt-next .ic{width:14px;height:14px;color:var(--gold);flex:none}
.mt-rec{display:flex;align-items:center;gap: var(--s2);width:100%;text-align:left;padding: var(--s3) var(--s3);border-top:1px solid var(--line);font-size: var(--fs-small);color:var(--muted)}
.mt-rec .ic{width:14px;height:14px;color:var(--gold);flex:none}
.mt-rec .ic:last-child{color:var(--faint);margin-left: auto}
.trader-mini-list{margin-top:2px}
.trader-mini{
  position:relative;width:min(78vw,286px);flex:0 0 min(78vw,286px);min-height:0;padding:var(--s3);
  display:flex;flex-direction:column;justify-content:flex-start;gap:var(--s2);
  text-align:left;color:var(--text);border-color:var(--line);
  background:radial-gradient(120% 100% at 0% 0%,rgba(var(--gold-rgb),.12),transparent 64%),var(--surface-2);
  transition:border-color .2s var(--ease-out),transform .2s var(--ease-out),box-shadow .2s var(--ease-out);
}
.trader-mini.is-primary{border-color:var(--gold-line);box-shadow:var(--sh-1),0 0 0 1px var(--gold-line) inset}
.trader-mini:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.trader-mini:hover,.trader-mini:focus-visible{transform:translateY(-2px)}
.trader-mini-profile{display:grid;grid-template-columns:56px minmax(0,1fr) 34px;align-items:center;gap:var(--s2);min-width:0}
.trader-mini-logo{width:56px;height:56px;display:grid;place-items:center}
.trader-mini-logo .av{width:56px;height:56px;border-radius:16px;border:1px solid var(--gold-line);box-shadow:0 7px 16px rgba(0,0,0,.18)}
.trader-mini-logo .av-pic{background-color:#0a0a0a;background-size:cover;background-position:center}
.trader-mini-arrow{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--surface-3);border:1px solid var(--line-2);color:var(--gold)}
.trader-mini-arrow .ic{width:16px;height:16px}
.trader-mini-copy{min-width:0}
.trader-mini-copy b{display:flex;align-items:center;gap:var(--s1);font-family:var(--display);font-size:var(--fs-h3);line-height:1.16;letter-spacing:-.02em}
.trader-mini-copy small{display:block;margin-top:var(--s1);color:var(--muted);font-size:var(--fs-small);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trader-mini-detail{display:flex;align-items:baseline;gap:var(--s2);min-width:0;padding-top:var(--s2);border-top:1px solid var(--line)}
.trader-mini-detail-label{flex:none;color:var(--gold);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.trader-mini-detail-value{min-width:0;overflow:hidden;color:var(--text);font-size:var(--fs-small);text-overflow:ellipsis;white-space:nowrap}
.trader-mini-bottom{display:flex;align-items:center;gap:var(--s2);min-width:0}
.trader-mini-focus{min-width:0;overflow:hidden;color:var(--muted);font-size:var(--fs-small);text-overflow:ellipsis;white-space:nowrap}
.trader-mini-status{display:inline-flex;flex:none;margin:0 0 0 auto}

/* ---- dashboard ---- */
.dash-bal{display:flex;align-items:center;gap: var(--s2);padding: var(--s3) var(--s3);margin-top: var(--s2);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);font-size: var(--fs-small);color:var(--muted)}
.dash-bal .ic{width:16px;height:16px;color:var(--gold);flex:none}
.dash-bal-currency{width:16px;flex:none;color:var(--gold);font-size:17px;font-weight:800;line-height:1;text-align:center}
.dash-bal b{margin-left: auto;font-size: var(--fs-h3);color:var(--text);letter-spacing:var(--tracking-num)}
.dash-trader{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);margin-bottom: var(--s2);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.dt-id{flex:1;min-width:0}
.dt-id b{display:block;font-size: var(--fs-h4)}
.dt-id small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top: var(--s1)}
.dash-trader .num{flex:none;font-size: var(--fs-body);font-weight:700;letter-spacing:var(--tracking-num)}
.dash-sess{display:flex;align-items:center;gap: var(--s3);padding: var(--s2) 2px;font-size: var(--fs-small)}
.dash-sess > span:first-child{flex:none;width:76px;color:var(--muted)}
.ds-bar{flex:1;height:7px;border-radius:var(--r-full);background:var(--surface-4);overflow:hidden}
.ds-bar span{display:block;height:100%;border-radius:var(--r-full);background:var(--gold)}
.dash-sess b{flex:none;width:42px;text-align:right;letter-spacing:var(--tracking-num)}
.dash-disc{display:grid;grid-template-columns:repeat(3,1fr);gap: var(--s2)}
.dash-disc > div{padding: var(--s3) var(--s2);text-align:center;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.dash-disc small{display:block;font-size: var(--fs-tiny);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dash-disc b{display:block;font-family:var(--display);font-size:21px;margin-top: var(--s1);letter-spacing:var(--tracking-num)}

/* ---- journal: new fields ---- */
.f-two{display:grid;grid-template-columns:1fr 1fr;gap: var(--s2)}
.flabel-opt{font-weight:500;text-transform:none;letter-spacing:0;color:var(--faint)}

/* journal form sections + list cues */
.f-sec{margin: var(--s4) 0 var(--s2);padding-top: var(--s3);border-top:1px solid var(--line)}
.f-sec:first-of-type{margin-top: var(--s2);padding-top:0;border-top:0}
.f-sec-t{font-family:var(--display);font-size: var(--fs-small);font-weight:700;letter-spacing:-.01em;color:var(--text)}
.log-lead{font-size:12.5px;line-height:1.5;margin:0 0 12px;color:var(--text-2)}
.log-hint{font-size:11px;line-height:1.45;margin:6px 2px 0;color:var(--muted)}
.log-details{margin:12px 2px 0;border-radius:12px;border:1px solid color-mix(in srgb,var(--line) 85%,transparent);background:color-mix(in srgb,var(--ink) 3.5%,transparent);padding:0 12px}
.log-details > summary{list-style:none;cursor:pointer;padding:12px 0;font-size:12.5px;font-weight:650;color:var(--text);display:flex;align-items:center;gap:8px}
.log-details > summary::-webkit-details-marker{display:none}
.log-details > summary::before{content:"";width:6px;height:6px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(-45deg);transition:transform .18s ease;flex:none}
.log-details[open] > summary::before{transform:rotate(45deg)}
.log-details[open]{padding-bottom:12px}
html[data-theme="light"] .log-details{background:rgba(22,20,14,.035);border-color:rgba(22,20,14,.08)}

.jc-cues{display:flex;flex-wrap:wrap;gap: var(--s1);margin-top: var(--s2)}
.jc-cue{display:inline-flex;align-items:center;gap: 2px;font-size: var(--fs-tiny);font-weight:650;color:var(--gold);background:rgba(var(--gold-rgb),.1);border:1px solid var(--gold-line);padding: 2px var(--s2);border-radius:999px}
.jc-cue .ic{width:10px;height:10px}
.jc-meta-px{margin-top: 2px !important;font-family:var(--mono);font-size: var(--fs-tiny);color:var(--muted)}

.f-shot{margin-top: var(--s1)}
.f-shot-prev{position:relative;margin-top: var(--s2)}
.f-shot-prev img{display:block;width:100%;border-radius:var(--r-md);border:1px solid var(--line);aspect-ratio:1;object-fit:cover;background:var(--surface-2)}
.f-shot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap: var(--s2)}
.f-shot-cell{position:relative}
.f-shot-x{
  position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:var(--r-full);
  background:var(--ink);border:1px solid var(--line);color:var(--text);font-size: var(--fs-small);cursor:pointer;
  display:grid;place-items:center;
}
.f-shot-x:hover,.f-shot-x:focus-visible{border-color:var(--gold);color:var(--gold)}
.jc-trader{display:flex;align-items:center;gap: var(--s2);width:100%;text-align:left;padding: var(--s2) var(--s3);margin: var(--s3) 0 0;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);font-size: var(--fs-small);color:var(--muted)}
.jc-trader .ic{width:15px;height:15px;color:var(--faint);margin-left: auto;flex:none}
.jc-trader b{color:var(--text)}
.jc-px{display:grid;grid-template-columns:repeat(3,1fr);gap: var(--s2);margin-top: var(--s3)}
.jc-px > div{padding: var(--s2);text-align:center;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.jc-px small{display:block;font-size: var(--fs-tiny);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.jc-px b{display:block;font-size: var(--fs-body);margin-top: var(--s1);letter-spacing:var(--tracking-num)}
.jc-shots{display:flex;flex-direction:column;gap: var(--s2);margin-top: var(--s1)}
.jc-shot{display:block;width:100%;margin:0;border-radius:var(--r-md);border:1px solid var(--line)}

/* ---- home tools row: 6 tiles now, scroll instead of squash ---- */
.tools-scroll{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tools-scroll::-webkit-scrollbar{display:none}
.tools-scroll .tool-tile{flex:0 0 auto;min-width:84px}


/* Trader areas + Results Centre */
.tr-section-head{margin-top: var(--s1)}
.tr-stats-period{font-size:10px;font-family:var(--mono);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:10px 0 6px}
.tr-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap: var(--s2);margin: var(--s2) 0 var(--s1)}
.tr-stats-inline{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  margin:10px 0 2px;
  padding:9px 2px;
  border-radius:12px;
  background:color-mix(in srgb,var(--ink) 5.5%,transparent);
  border:1px solid color-mix(in srgb,var(--line) 85%,transparent);
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent);
}
.tr-stats-inline.tr-stats-n1{grid-template-columns:1fr}
.tr-stats-inline.tr-stats-n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tr-stat-period{
  display:block;
  font-size:12px;
  font-weight:650;
  letter-spacing:-.01em;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.tc-poster{
  width:56px;height:42px;flex:none;object-fit:cover;
  border-radius:10px;border:1px solid var(--line);background:var(--surface-3);
}
.trader-card.has-poster .tc-chev{display:none}
.tr-stats-inline .tr-stat{
  background:transparent;
  border:none;
  border-radius:0;
  padding:2px 8px;
  box-shadow:none;
}
.tr-stats-inline .tr-stat + .tr-stat{
  border-left:1px solid color-mix(in srgb,var(--line) 90%,transparent);
}
.tr-stat{text-align:center;padding: var(--s2) 4px;border-radius:10px;background:color-mix(in srgb,var(--surface-3) 92%,transparent);border:1px solid color-mix(in srgb,var(--line) 70%,transparent);min-width:0}
.tr-stat b{display:block;font-size:clamp(13px, 3.8vw, 17px);font-weight:700;letter-spacing:var(--tracking-num);line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.tr-stat small{display:block;margin-top:3px;font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-family:var(--mono);font-weight:600}
.tr-stat .up{color:var(--up, #3dba7a)}
.tr-stat .down{color:var(--down, #e25555)}
html[data-theme="light"] .tr-stats-inline{
  background:rgba(22,20,14,.045);
  border-color:rgba(22,20,14,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
html[data-theme="light"] .tr-stats-inline .tr-stat + .tr-stat{
  border-left-color:rgba(22,20,14,.1);
}
html[data-theme="light"] .tr-stat .up{color:#0B7C49}
html[data-theme="light"] .tr-stat .down{color:#D23A3F}
html:not([data-theme="light"]) .tr-stats-inline{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
html:not([data-theme="light"]) .tr-stats-inline .tr-stat + .tr-stat{
  border-left-color:rgba(255,255,255,.1);
}
@media (max-width:380px){
  .tabbar .tab{font-size: var(--fs-tiny)}
  .tabbar .tab .ic{width:18px;height:18px}
}


.trader-card.has-photo .av-pic{
  border:1.5px solid color-mix(in srgb,var(--gold) 55%,transparent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 12%,transparent);
  background-color:#0a0a0a;
}
.trader-card.has-photo .tc-top{gap: var(--s4);align-items:center}
.trader-hero .av-pic{
  border:1.5px solid color-mix(in srgb,var(--gold) 55%,transparent);
  background-color:#0a0a0a;
}

/* ============================================================
   Touch targets — hit-area expansion to 44px (Apple HIG minimum)
   These controls are real <button>s but render under 44px tall:
   .toggle 28 · .chip 34 · .seg-btn 38 · .btn-sm 40.
   The ::after box is transparent, absolutely positioned and vertically
   centred, so the TAP region grows to 44px while the control's visible
   size, layout and spacing are all completely unchanged.
   (.pill is NOT included — it renders as a <span> status label, never a
   button, so it has no hit area to fix.)

   2026-08-01 — five more added after MEASURING the live DOM rather than
   reading this stylesheet. These were missed the first time because their
   height is computed from padding or line-height, not declared:
     .more      16px at 320px (worst in the app — a text-only "see all" button)
     .gloss-cta 31px at 320px (padding-derived)
     .cr-bell   36px (declared 36)
     .ask-pill  39-40px (declared 40)
     .icon-btn  43px — declares 44 but box-sizing:border-box plus the 1px
                border rounds it down a pixel at some densities
   Lesson: parsing declared heights misses anything sized indirectly. Measure.
   ============================================================ */
.toggle,.chip,.seg-btn,.btn-sm,
.more,.gloss-cta,.cr-bell,.ask-pill,.icon-btn,.mb-news,.desk-row{position:relative}
.toggle::after,.chip::after,.seg-btn::after,.btn-sm::after,
.more::after,.gloss-cta::after,.cr-bell::after,.ask-pill::after,.icon-btn::after,.mb-news::after,.desk-row::after{
  content:"";position:absolute;left:0;right:0;top:50%;
  transform:translateY(-50%);
  height:44px;
  /* never shrink the region on controls that are already ≥44px */
  min-height:100%;
  /* purely a hit area — must never paint or intercept layout */
  pointer-events:auto;
}
/* .more sits inline in a flex section-head; widen the tap region a little so a
   short label like "See all" is not a sliver, without shifting the text. */
.more::after{left:-6px;right:-6px}

/* Spacing pass — home header density at narrow widths */
@media (max-width:360px){
  .who{gap: var(--s2)}
  .who .ask-pill,.who .ask-support,.ask-pill{padding-left: var(--s3);padding-right: var(--s3);font-size:var(--fs-tiny)}
  .ticker,.px-ticker{font-size:var(--fs-tiny)}
}

/* Journal dashboard — daily featured (lessons + call recordings) */
.dash-feat{display:flex;gap: var(--s3);align-items:stretch;width:100%;text-align:left;padding: var(--s3);margin-bottom: var(--s4);background:var(--surface-2);border:1px solid var(--gold-line);border-radius:var(--r-lg);color:inherit;cursor:pointer}
.dash-feat:active{transform:scale(.985)}
.dash-feat-media{position:relative;flex:none;width:96px;height:72px;border-radius:var(--r-md);overflow:hidden;background:var(--surface-4)}
.dash-feat-media img{width:100%;height:100%;object-fit:cover;display:block}
.dash-feat-ph{display:grid;place-items:center;width:100%;height:100%;color:var(--gold)}
.dash-feat-play{position:absolute;inset:auto 6px 6px auto;width:26px;height:26px;border-radius:50%;background:rgba(0,0,0,.55);display:grid;place-items:center;color:#fff}
.dash-feat-play svg{width:12px;height:12px}
.dash-feat-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap: 4px}
.dash-feat-body b{font-family:var(--display);font-size: var(--fs-body);line-height:1.25;letter-spacing:var(--tracking)}
.dash-feat-body small{color:var(--muted);font-size: var(--fs-small);line-height:1.4}


/* trader profile — AAA day results ledger */
.tr-res-hero{text-align:left;margin-bottom: var(--s2)}
.tr-res-photo-btn{display:block;width:100%;padding:0;border:0;background:transparent;border-radius:var(--r-md);cursor:pointer;margin:0 0 var(--s3)}
.tr-res-photo-btn:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.tr-res-photo{display:block;width:100%;max-height:280px;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface-3)}
.tr-res-history-photo{width:42px;height:42px;flex:none;object-fit:cover;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface-3)}
.tr-res-eyebrow{display:block;font-size: var(--fs-tiny);color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-family:var(--display);font-weight:600;margin-bottom: var(--s2)}
.tr-res-pips{display:block;font-family:var(--display);font-size: clamp(32px, 9vw, 42px);font-weight:700;letter-spacing:-.03em;line-height:1.05}
.tr-res-pips-lbl{display:block;font-size: var(--fs-tiny);color:var(--muted);margin: 2px 0 var(--s3);text-transform:lowercase}
.tr-res-chips{display:flex;flex-wrap:wrap;gap: var(--s2)}
.tr-res-chip{display:inline-flex;align-items:baseline;gap: 4px;padding: 6px 10px;border-radius:var(--r-md);background:var(--surface-3);border:1px solid var(--line);font-size: var(--fs-tiny);color:var(--muted)}
.tr-res-chip b{font-family:var(--mono);font-size: var(--fs-small);color:var(--text);font-weight:650}
.tr-res-board{margin: var(--s3) 0 0;font-size:11px;color:var(--faint)}
.tr-res-hero-note,.tr-res-sheet-note{margin: var(--s3) 0 0;line-height:1.55}
.tr-res-wl{display:flex;height:6px;border-radius:999px;overflow:hidden;background:var(--surface-3);border:1px solid var(--line);margin:0 0 var(--s3)}
.tr-res-wl.is-empty{opacity:.35}
.tr-res-wl-win{display:block;height:100%;background:color-mix(in srgb, var(--up, #3dba7a) 85%, transparent);flex:none}
.tr-res-wl-loss{display:block;height:100%;background:color-mix(in srgb, var(--down, #e25555) 70%, transparent);flex:none}
.tr-res-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap: var(--s2);margin:0 0 2px}
.tr-res-tile{text-align:center;padding: var(--s2) 4px;border-radius:var(--r-md);background:var(--surface-3);border:1px solid var(--line)}
.tr-res-tile b{display:block;font-family:var(--mono);font-size: var(--fs-h4);font-weight:700;letter-spacing:var(--tracking-num);line-height:1.2;color:var(--text)}
.tr-res-tile small{display:block;margin-top:3px;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.tr-res-seg{margin:0 0 var(--s3)}
.tr-res-derived-note{margin:0 2px 10px;font-size: var(--fs-tiny);color:var(--muted);line-height:1.45}
.tr-res-month{margin:0 0 var(--s3)}
.tr-res-month-h{font-size:11px;font-family:var(--mono);font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 var(--s2);padding:0 2px}
.tr-res-archive{margin:0 0 var(--s3)}
.tr-res-month-nav{display:flex;align-items:center;gap:var(--s2);margin:0 0 var(--s3);padding:var(--s2) var(--s2);border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2)}
.tr-res-month-dir{flex:none;width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-3);color:var(--text);font-size:22px;line-height:1;cursor:pointer}
.tr-res-month-dir:hover:not(:disabled){border-color:color-mix(in srgb,var(--gold) 35%, var(--line))}
.tr-res-month-dir:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.tr-res-month-dir:active:not(:disabled){transform:scale(.96)}
.tr-res-month-dir:disabled{opacity:.35;cursor:default}
.tr-res-month-now{flex:1;min-width:0;text-align:center}
.tr-res-month-now b{display:block;font-family:var(--display);font-size:var(--fs-h4);font-weight:650;letter-spacing:-.02em;line-height:1.2}
.tr-res-month-now small{display:block;margin-top:3px;font-size:var(--fs-tiny);color:var(--muted)}
.tr-res-weeks{display:flex;flex-direction:column;gap:var(--s2)}
.tr-res-week{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface-2);overflow:hidden}
.tr-res-week.is-open{border-color:color-mix(in srgb,var(--gold) 28%, var(--line))}
.tr-res-week-h{display:flex;align-items:center;gap:var(--s3);width:100%;text-align:left;padding:var(--s3);background:transparent;border:0;cursor:pointer;min-height:56px;color:inherit}
.tr-res-week-h:hover{background:color-mix(in srgb,var(--gold) 6%, transparent)}
.tr-res-week-h:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:-2px}
.tr-res-week-h:active{opacity:.92}
.tr-res-week-text{flex:1;min-width:0}
.tr-res-week-text b{display:block;font-size:var(--fs-h4);font-weight:650;line-height:1.25}
.tr-res-week-text small{display:block;margin-top:2px;font-size:var(--fs-tiny);color:var(--muted)}
.tr-res-week-pips{flex:none;font-size:var(--fs-h3);font-weight:700;letter-spacing:var(--tracking-num)}
.tr-res-week-chev{flex:none;width:18px;text-align:center;color:var(--muted);font-size:14px;line-height:1;opacity:.85;transition:transform .18s cubic-bezier(.22,1,.36,1)}
.tr-res-week.is-open .tr-res-week-chev{transform:rotate(0deg)}
.tr-res-week-days{display:flex;flex-direction:column;gap:var(--s2);padding:0 var(--s3) var(--s3);border-top:1px solid var(--line);background:var(--surface-3)}
.tr-res-week-days .tr-res-day{background:var(--surface-2)}

.tr-res-days,.tr-res-ledger{display:flex;flex-direction:column;gap: var(--s2);margin-top:2px}
.tr-res-day{display:flex;align-items:center;gap: var(--s3);width:100%;text-align:left;padding: var(--s3);background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer;min-height:64px}
.tr-res-day:hover{border-color:color-mix(in srgb,var(--gold) 35%, var(--line))}
.tr-res-day:active{transform:scale(.985);opacity:.9}
.tr-res-day:focus-visible{outline:2px solid rgba(var(--gold-rgb),.55);outline-offset:2px}
.tr-res-day-photo{width:56px;height:56px;flex:none;object-fit:cover;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface-3)}
.tr-res-day-ph{width:56px;height:56px;flex:none;display:grid;place-items:center;border-radius:var(--r-md);border:1px solid var(--line);background:color-mix(in srgb,var(--gold) 12%, var(--surface-3));color:var(--gold)}
.tr-res-day-ph .ic{width:20px;height:20px}
.tr-res-day-body{flex:1;min-width:0}
.tr-res-day-body b{display:block;font-size: var(--fs-h4);font-weight:650;line-height:1.25}
.tr-res-day-body small{display:block;color:var(--muted);font-size: var(--fs-tiny);margin-top:2px}
.tr-res-day-note{display:block;color:var(--text-2);font-size: var(--fs-tiny);margin-top:4px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-res-day-pips{flex:none;font-size: var(--fs-h3);font-weight:700;letter-spacing:var(--tracking-num)}
.tr-res-sheet-photo-btn{display:block;width:100%;padding:0;border:0;background:transparent;border-radius:var(--r-md);cursor:pointer}
.tr-res-sheet-photo{display:block;width:100%;max-height:320px;object-fit:cover;border-radius:var(--r-md);border:1px solid var(--line);background:var(--surface-3)}
.tr-res-lightbox{margin-top:4px}
.tr-res-lightbox img{display:block;width:100%;max-height:70vh;object-fit:contain;border-radius:var(--r-md);background:var(--surface-3)}
@media (max-width:380px){
  .tr-res-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tr-res-day-photo,.tr-res-day-ph{width:48px;height:48px}
}


/* ---- journal dashboard polish ---- */
.dash-feat-wrap{margin-bottom: var(--s4)}
.dash-feat-wrap .section-head{margin-bottom: var(--s2)}
.dash-feat{margin-bottom: 0}
.dash-invite{
  display:flex;flex-direction:column;gap: var(--s3);
  margin-bottom: var(--s4);
  border-color: var(--gold-line);
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(var(--gold-rgb),.12), transparent 55%),
    var(--surface-2);
}
.dash-invite-copy b{display:block;font-family:var(--display);font-size: var(--fs-h3);letter-spacing:var(--tracking);margin-bottom: var(--s1)}
.dash-invite-copy .sub{display:block;line-height:1.55}
.dash-invite-acts{display:flex;flex-wrap:wrap;gap: var(--s2)}
.dash-stats{margin-bottom: var(--s3);gap: var(--s3)}
.dash-stats .num-cell{padding: var(--s4) var(--s3);border-radius:var(--r-lg);transition:transform .22s var(--ease-spring), opacity .22s ease}
.dash-stats .num-cell b{font-family:var(--display);font-size: clamp(18px, 5.2vw, 22px);letter-spacing:var(--tracking-num);font-weight:700}
.dash-stats .num-cell small{margin-top: var(--s1);display:block}
.dash-bal{margin-top: 0;margin-bottom: var(--s4);padding: var(--s3) var(--s4);border-radius:var(--r-lg)}
.dash-bal-cta{width:100%;cursor:pointer;text-align:left;color:inherit}
.dash-bal-cta:active{transform:scale(.985)}
.dash-bal-cta .more{margin-left:auto;font-size: var(--fs-small);color:var(--gold);font-weight:650}
.dash-eq-card{margin-bottom: var(--s2);min-height:140px;display:flex;align-items:center}
.dash-eq-card.is-empty{min-height:148px}
.dash-eq-empty{width:100%;text-align:center;padding: var(--s4) var(--s3);position:relative}
.dash-eq-empty b{display:block;font-family:var(--display);font-size: var(--fs-h4);margin: var(--s3) 0 var(--s1)}
.dash-eq-empty .sub{display:block;max-width:26ch;margin:0 auto;line-height:1.5}
.dash-eq-wave{
  display:block;height:36px;margin:0 auto;width:min(220px,70%);
  background:
    linear-gradient(90deg, transparent, rgba(var(--gold-rgb),.45), transparent);
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 36' preserveAspectRatio='none'><path fill='none' stroke='black' stroke-width='2.5' d='M0 22 C 30 6, 50 30, 80 18 S 140 4, 170 20 210 28, 220 14'/></svg>") center / 100% 100% no-repeat;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 36' preserveAspectRatio='none'><path fill='none' stroke='black' stroke-width='2.5' d='M0 22 C 30 6, 50 30, 80 18 S 140 4, 170 20 210 28, 220 14'/></svg>") center / 100% 100% no-repeat;
  animation: dashWave 2.4s var(--ease-out) infinite alternate;
  opacity:.85;
}
@keyframes dashWave{from{opacity:.35;transform:translateX(-4px)}to{opacity:.9;transform:translateX(4px)}}
.dash-placeholder{display:flex;gap: var(--s3);align-items:center;margin-bottom: var(--s2)}
.dash-ph-rows{display:flex;flex-direction:column;gap: 6px;flex:none;width:42px}
.dash-ph-rows i{display:block;height:8px;border-radius:var(--r-full);background:var(--surface-4);opacity:.85}
.dash-ph-rows i:nth-child(1){width:100%}
.dash-ph-rows i:nth-child(2){width:78%}
.dash-ph-rows i:nth-child(3){width:56%}
.dash-ph-copy{flex:1;min-width:0}
.dash-ph-copy b{display:block;font-size: var(--fs-body);font-weight:650;margin-bottom: 2px}
.dash-ph-copy small{display:block;color:var(--muted);font-size: var(--fs-tiny);line-height:1.45}
.dash-sess-list{display:flex;flex-direction:column;gap: var(--s2);margin-bottom: var(--s2)}
.dash-sess{padding: var(--s2) var(--s1)}
.ds-bar span{
  display:block;height:100%;border-radius:inherit;background:var(--gold-foil);
  transform-origin:left center;transform:scaleX(0);
  animation: dashBarIn .7s cubic-bezier(.2,.7,.2,1) forwards;
  animation-delay: calc(var(--i, 0) * 70ms + 180ms);
}
@keyframes dashBarIn{to{transform:scaleX(1)}}
.dash-disc{margin-bottom: var(--s3);gap: var(--s3)}
.dash-disc > div{padding: var(--s4) var(--s2);border-radius:var(--r-lg);transition:transform .2s var(--ease-spring)}
.dash-score-btn{margin-top: var(--s2);margin-bottom: var(--s2)}
#circle-body .section-head{margin-top: var(--s5);margin-bottom: var(--s3)}
#circle-body .section-head:first-child{margin-top: var(--s2)}
#circle-body .journal-segs,
#circle-body .seg{margin-bottom: var(--s4)}
@media (prefers-reduced-motion: reduce){
  .dash-eq-wave,.ds-bar span{animation:none}
  .ds-bar span{transform:none}
}

/* Trader how-trades-work guide (Phantom desk sheets) */
.tg-card{border-color:var(--gold-line);background:var(--surface-2)}
.tg-headline{margin:0 0 var(--s3);font-family:var(--display);font-size:var(--fs-small);font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--gold);line-height:1.35}
.tg-suited{margin:0 0 var(--s3);padding:12px 14px;border-radius:var(--r-md);border:1px solid var(--gold-line);background:var(--surface-3)}
.tg-suited-advanced{border-color:var(--gold-line);background:var(--surface-3)}
.tg-suited small{display:block;font-size:var(--fs-tiny);color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}
.tg-suited b{display:block;font-family:var(--display);font-size:var(--fs-h3);letter-spacing:-.02em;line-height:1.15;color:var(--text)}
.tg-suited-advanced b{color:var(--text)}
.tg-stars{display:block;margin:6px 0 8px;color:var(--gold);letter-spacing:.08em;font-size:13px}
.tg-suited-advanced .tg-stars{color:var(--gold)}
.tg-suited .sub{margin:0;line-height:1.55}
.tg-approach{margin:0 0 var(--s3);line-height:1.6}
.tg-points{margin:0;padding:0 0 0 1.1em;display:flex;flex-direction:column;gap:8px}
.tg-points li{font-size:var(--fs-small);color:var(--text-2);line-height:1.5}
.tg-plan{margin-top:var(--s3);display:flex;flex-direction:column;gap:8px}
.tg-plan-row{display:flex;justify-content:space-between;gap:12px;align-items:baseline;padding:8px 10px;border-radius:10px;background:var(--surface-3);border:1px solid var(--line)}
.tg-plan-row b{font-size:var(--fs-tiny);text-transform:uppercase;letter-spacing:.03em;color:var(--gold);flex:none}
.tg-plan-row span{font-size:var(--fs-small);color:var(--text-2);text-align:right;line-height:1.4}
.tg-data-head{margin:var(--s3) 0 8px;font-family:var(--display);font-size:var(--fs-tiny);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.tg-steps{display:flex;flex-direction:column;gap:10px}
.tg-step{display:flex;gap:12px;align-items:flex-start}
.tg-step-n{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:700;color:#0a0a0e;background:var(--gold)}
.tg-step b{display:block;font-size:var(--fs-small);margin-bottom:2px}
.tg-step small{display:block;color:var(--muted);line-height:1.45}
.tg-footer{margin:14px 0 0;text-align:center;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);font-weight:650}
.tg-guide-sheet{margin-top:8px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--gold-line);background:#000}
.tg-guide-sheet img{display:block;width:100%;height:auto}


/* Trader desk — About / Results split */
.trader-area-seg{margin: var(--s3) 0 var(--s4)}
.trader-area-pane{min-height: 120px}


/* ---- fatal catch-all (no stack traces) ---- */
#bt-fatal-overlay{
  position:fixed;inset:0;z-index:99999;display:grid;place-items:center;
  padding:var(--s5);background:rgba(6,7,10,.82);backdrop-filter:blur(8px);
}
#bt-fatal-overlay .bt-fatal-card{
  width:min(360px,100%);padding:var(--s5);border-radius:var(--r-lg);
  background:var(--surface-2);border:1px solid var(--line-2);text-align:center;
  box-shadow:0 24px 60px -28px rgba(0,0,0,.75);
}
#bt-fatal-overlay .bt-fatal-card b{display:block;font-family:var(--display);font-size:var(--fs-h3);margin-bottom:var(--s2)}
#bt-fatal-overlay .bt-fatal-card p{margin:0 0 var(--s4);color:var(--muted);font-size:var(--fs-small);line-height:1.55}
#bt-fatal-continue,#bt-fatal-reload{
  min-width:160px;min-height:48px;width:100%;
  -webkit-tap-highlight-color:transparent;
}
#bt-fatal-reload{margin-top:10px}
#bt-fatal-continue:disabled,#bt-fatal-reload:disabled{opacity:.7}


/* ---- offline banner (QA) ---- */
.bt-offline-banner{position:sticky;top:0;z-index:80;display:none;align-items:center;justify-content:center;gap:8px;padding:8px 12px;background:rgba(195,45,50,.92);color:#fff;font-size:var(--fs-small);font-weight:700;text-align:center}
.bt-offline-banner.is-on{display:flex}
html[data-theme="light"] .bt-offline-banner{background:#C32D32}
.bt-offline-banner button{appearance:none;border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.12);color:#fff;border-radius:999px;padding:4px 10px;font:inherit;font-weight:700;cursor:pointer;min-height:32px}

.equity-card.is-empty{min-height:148px;display:flex;flex-direction:column}
.equity-card.is-empty .dash-eq-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}


/* ---- QA selection recipe (one language) ---- */
.chip.active,
.seg-btn.on{
  background:rgba(var(--gold-rgb),.16);
  color:var(--gold);
  border:1px solid rgba(var(--gold-rgb),.32);
  font-weight:700;
  box-shadow:inset 0 1px 0 rgba(246,227,172,.12);
}
.seg-btn{flex:1;min-height:44px;height:44px;border-radius:var(--r-full);font-family:var(--display);font-weight:600;font-size: var(--fs-small);color:var(--muted);border:1px solid transparent;transition:color .2s,background .2s,border-color .2s}
.tab.active{color:var(--gold)}
.tab.active .tab-cluster::before{
  background:rgba(var(--gold-rgb),.16);
  border-color:rgba(var(--gold-rgb),.32);
  box-shadow:inset 0 1px 0 rgba(246,227,172,.12);
}

/* Results loading skeleton */
.tr-res-skel .skel-line,.tr-res-skel-list .skel-row{
  display:block;border-radius:8px;background:linear-gradient(90deg,var(--surface-3),var(--surface-4),var(--surface-3));
  background-size:200% 100%;animation:skel-shine 1.2s ease-in-out infinite;
}
.tr-res-skel-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.tr-res-skel-list .skel-row{height:64px;width:100%}
@keyframes skel-shine{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media (prefers-reduced-motion:reduce){.tr-res-skel .skel-line,.tr-res-skel-list .skel-row{animation:none}}

/* Narrow tab bar — keep labels visible, tighten spacing only */
@media (max-width:360px){
  .tabbar{left:10px;right:10px;padding:0}
  .tab .tab-label{font-size:9px;letter-spacing:-.01em}
  .tab{gap:2px}
}

}

/* Landscape — Live/Learn breathe */
@media (orientation:landscape) and (max-height:500px){
  .tabbar{height:56px;bottom:calc(env(safe-area-inset-bottom) + 6px)}
  .lobby-stage,.learn-hero,.live-stage{max-height:min(58vh,420px)}
  .screen{padding-bottom:calc(var(--tabbar-h) + 18px)}
  .brief{padding: var(--s3)}
}

/* Feel-faster: skip layout work for offscreen Home blocks until scrolled near */
.wn-strip,.hub-mini-list,.event-mini-list,.rail.rail-pad,.tg-onboard{
  content-visibility:auto;
  contain-intrinsic-size:auto 180px;
}
/* .totw excluded — content-visibility was blanking the weekly graphic image in WKWebView */


/* tablet / iPad floor — phone shell centered, but content uses the width like a real tablet app */
@media (min-width: 768px) {
  :root {
    --gutter: 28px;
    --fs-h1: 30px;
    --fs-h2: 22px;
    --fs-h3: 18px;
    --fs-body: 16px;
  }
  html, body {
    background:
      radial-gradient(1200px 700px at 50% -10%, rgba(var(--gold-rgb), .07), transparent 55%),
      var(--bg, #060607);
  }
  #app, .app-shell, .screen, main.app {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
  }
  .app-head { padding-left: var(--gutter); padding-right: var(--gutter); }
  .tabbar {
    max-width: 640px;
    left: 50%;
    right: auto;
    width: min(640px, calc(100% - 48px));
    transform: translateX(-50%);
    height: 62px;
    padding: 0 10px;
  }
  .tab { gap: 4px; }
  .tab .tab-label { font-size: 11px; letter-spacing: .01em; }
  .tab .tab-cluster { width: 54px; height: 32px; }
  .tab svg { width: 22px; height: 22px; }
  .rail .vcard, .rail .idea, .rail .book-card, .rail .up-card { width: 220px; }
  .fd-stats, .jstats, .num-grid, .edge-setups { gap: var(--s3); }
  /* hubs/events: 2-up grid on iPad (not a skinny phone rail) */
  .swipe-rail.hub-mini-list, .swipe-rail.event-mini-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--s3);
    overflow: visible;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    scroll-snap-type: none;
  }
  .swipe-rail.hub-mini-list > *, .swipe-rail.event-mini-list > * {
    width: auto !important;
    min-width: 0;
    max-width: none;
  }
  .ticket { border-radius: 14px; }
  .floor-card, .wn-strip .wn-card, .tg-onboard { border-radius: 16px; }
  .modal-cinema .sheet { max-width: 720px; }
  .feed-scroll-team .team-inbox { max-width: 640px; }
  /* Keep readable measure on long copy */
  .st-body p, .qr-sub { max-width: 420px; }
}

@media (min-width: 1024px) {
  :root { --gutter: 32px; }
  #app, .app-shell, .screen, main.app { max-width: 1120px; }
  .tabbar { max-width: 700px; width: min(700px, calc(100% - 64px)); }
  .rail .vcard, .rail .idea, .rail .book-card, .rail .up-card { width: 240px; }
}

/* Onboarding / login measure on iPad — avoid ultra-wide option cards */
@media (min-width: 768px) {
  .ob-card, .ob-choice, .login-card, .login-sheet, .auth-card, .st-card {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
  }
  .ob-pillars { max-width: 480px; }
  /* Keep primary column readable even when shell is full-bleed */
  .screen > .pad, .screen .content, main.app > .pad {
    max-width: 1120px;
    margin-left: auto;
    margin-right: auto;
  }
}

/* iPad landscape still portrait-locked in native; this helps browser QA only */
@media (min-width: 768px) and (orientation: landscape) {
  #app, .app-shell, .screen, main.app { max-width: 920px; }
}


/* iPad onboarding — fill height, keep a readable column */
@media (min-width: 768px) {
  .ob-body, .onboard, #onboard, .ob-sheet {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    min-height: min(720px, calc(100dvh - 80px));
    display: flex;
    flex-direction: column;
  }
  .ob-push-actions, .ob-body > .btn, .ob-body > [data-next] {
    margin-top: auto;
  }
  .ob-notif-list, .ob-zoom, .ob-group {
    max-width: 520px;
  }
}


/* Hubs stay as the original full-width vertical stack at every viewport size. */
@media (min-width: 768px) {
  .hub-grid {
    display: block;
    margin: var(--s2) 0 var(--s3);
  }
}


/* Journal coach-mark tour — tokens only, opacity/transform */
html.is-jtour .tabbar{pointer-events:none}
html.is-jtour .jtour-replay{visibility:hidden}
.jtour{
  position:fixed;inset:auto;z-index:120;overflow:hidden;
  pointer-events:auto;opacity:0;
  transition:opacity 180ms ease;
}
.jtour.is-on{opacity:1}
.jtour.is-out{opacity:0;pointer-events:none}
[data-journal-tour]{scroll-margin-top:210px;scroll-margin-bottom:120px}
html[data-native="1"] .jtour-hole{transition:none}
.jtour-hole{
  position:absolute;left:0;top:0;z-index:1;
  box-sizing:border-box;
  border-radius:var(--r-lg);
  pointer-events:auto;
  background:transparent;
  transform:none;
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.42),
    0 0 0 3px rgba(0,0,0,.22),
    0 22px 48px -16px rgba(0,0,0,.72),
    0 0 0 9999px rgba(2,2,4,.66);
  will-change:left,top,width,height;
  transition:left 180ms var(--ease-spring),top 180ms var(--ease-spring),width 180ms var(--ease-spring),height 180ms var(--ease-spring),border-radius 180ms var(--ease-spring);
}
.jtour-hole.is-soft{
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.55),
    0 0 0 3px rgba(0,0,0,.22),
    0 22px 48px -16px rgba(0,0,0,.72),
    0 0 0 9999px rgba(2,2,4,.66);
}
.jtour-hole.is-line{
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.4),
    0 0 0 3px rgba(0,0,0,.22),
    0 22px 48px -16px rgba(0,0,0,.7),
    0 0 0 9999px rgba(2,2,4,.66);
}
html[data-theme="light"] .jtour-hole,
html[data-theme="light"] .jtour-hole.is-soft,
html[data-theme="light"] .jtour-hole.is-line{
  box-shadow:
    0 0 0 1.5px rgba(22,20,14,.42),
    0 0 0 3px rgba(22,20,14,.12),
    0 18px 40px -18px rgba(22,20,14,.22),
    0 0 0 9999px rgba(22,20,14,.5);
}
html[data-theme="light"] .jtour-card{
  background:var(--surface);
  border:1px solid var(--line-2);
  box-shadow:var(--sh-2),0 0 0 1px rgba(255,255,255,.9);
  color:var(--text);
}
html[data-theme="light"] .jtour-caret{
  background:var(--surface);
  border-right-color:var(--line-2);
  border-bottom-color:var(--line-2);
}
html[data-theme="light"] .jtour-title{color:var(--text)}
html[data-theme="light"] .jtour-copy{color:var(--muted)}
html[data-theme="light"] .jtour-skip{color:var(--faint)}
html[data-theme="light"] .jtour-skip:hover,
html[data-theme="light"] .jtour-skip:focus-visible{color:var(--text)}
.jtour-card{
  position:absolute;left:0;top:0;z-index:3;
  max-width:300px;
  background:var(--surface-2);
  border:1px solid var(--line-2);
  border-radius:var(--r-lg);
  padding:var(--s4);
  box-shadow:var(--elev-2);
  pointer-events:none;
  opacity:0;
  translate:0 8px;
  transition:transform 220ms var(--ease-spring),opacity 180ms ease,translate 180ms var(--ease-spring);
}
.jtour.is-on .jtour-card{opacity:1;pointer-events:auto;translate:0 0}
.jtour.is-out .jtour-card{opacity:0;translate:0 6px}
.jtour-caret{
  position:absolute;width:11px;height:11px;margin-left:-5.5px;
  background:var(--surface-2);border-right:1px solid var(--line-2);border-bottom:1px solid var(--line-2);
}
.jtour-card.is-above .jtour-caret{bottom:-6px;transform:rotate(45deg)}
.jtour-card.is-below .jtour-caret{top:-6px;transform:rotate(-135deg)}
.jtour-kicker{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);margin-bottom:var(--s2)}
.jtour-progress{
  font-family:var(--mono);font-size:var(--fs-small);font-weight:700;
  color:var(--gold);letter-spacing:.04em;
}
.jtour-skip{
  appearance:none;background:transparent;border:0;margin:0;cursor:pointer;
  min-height:44px;padding:0 var(--s2);
  font-family:var(--sans);font-size:var(--fs-small);font-weight:500;
  color:var(--muted);text-decoration:underline;text-underline-offset:3px;line-height:1.3;
}
.jtour-skip:hover,.jtour-skip:focus-visible{color:var(--ink-2)}
.jtour-skip:active{opacity:.75}
.jtour-title{
  margin:0 0 var(--s2);
  font-family:var(--display);font-size:var(--fs-h4);font-weight:800;
  letter-spacing:-.03em;line-height:1.15;color:var(--text);
}
.jtour-copy{
  margin:0 0 var(--s3);
  font-size:var(--fs-small);line-height:1.6;color:var(--muted);
}
.jtour-actions{display:flex;align-items:center;gap:var(--s2)}
.jtour-actions .btn{min-height:44px;flex:1}
.jtour-back:disabled{opacity:.4;cursor:default}
.app-head-journal{grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:center}
.jtour-replay{
  appearance:none;background:transparent;border:0;cursor:pointer;
  min-height:44px;padding:0 2px;
  font-family:var(--sans);font-size:var(--fs-small);font-weight:650;
  color:var(--gold);letter-spacing:.01em;white-space:nowrap;justify-self:end;
}
.jtour-replay:hover,.jtour-replay:focus-visible{color:var(--gold-hi,var(--gold));text-decoration:underline;text-underline-offset:3px}
.jtour-replay:active{transform:translateY(1px)}
@media (prefers-reduced-motion:reduce){
  .jtour,.jtour-hole,.jtour-card{transition:none}
  .jtour-card{translate:0}
}
.jtour.is-reduce,.jtour.is-reduce .jtour-hole,.jtour.is-reduce .jtour-card{transition:none}

/* Two-line "Hubs & Events" tab: icons pinned to one height so a two-line label never lifts its icon */
.tabbar .tab{align-self:stretch;justify-content:flex-start;padding-top:6px;gap:0}
.tab .tab-label{font-size:10px;line-height:1.1;margin-top:1px}
.tab .tab-label-2{text-align:center;line-height:1.05}
/* Outfit's ampersand has no upper loop and reads as half a glyph at tab size */
.tab .tab-amp{font-family:-apple-system,"SF Pro Text",system-ui,sans-serif}
@media (max-width:360px){.tab .tab-label{font-size:9px}}
@media (min-width:768px),(orientation:landscape) and (max-height:500px){
  .tabbar .tab{align-self:auto;justify-content:center;padding-top:0;gap:var(--s1)}
  .tab .tab-label{font-size:11px;line-height:normal;margin-top:0}
  .tab .tab-label-2 br{display:none}
}