/* ---- design tokens: clean, sober, fintech (Kite/Screener-inspired) ---- */
:root{
  --bg:#ffffff; --surface:#ffffff; --surface-2:#f7f8fa;
  --border:#e9ecef; --border-2:#dfe3e8;
  --ink:#1a1a17; --muted:#6b7480; --faint:#9aa3ad;
  --green:#1a8a4a; --green-bg:#e6f4ec;
  --red:#d2392f; --red-bg:#fbeae8;
  --accent:#1a8a4a; --accent-ink:#156e3b;
  --banana:#FFC926; --banana-soft:#fff3cf; --banana-ink:#8a6500;
  --shadow:0 1px 2px rgba(20,30,40,.04),0 1px 3px rgba(20,30,40,.06);
  --radius:12px; --maxw:1280px;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;
}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.pos{color:var(--green)} .neg{color:var(--red)}
a{color:var(--accent);text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}

/* ---- top nav ---- */
header.nav{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.985);
  backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--border)}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:0 20px;height:66px;
  display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink)}
.brand .logo{display:block;flex:0 0 auto}
.brand .wordmark{font-family:"Space Grotesk",-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:700;font-size:18px;letter-spacing:-.02em;line-height:1}
.brand .wordmark b{color:#1a8a4a;font-weight:700}
.brand .brandtext{display:flex;flex-direction:column;gap:2px}
.brand .tagline{font-size:11px;font-weight:500;color:var(--muted);letter-spacing:0;line-height:1}
@media (max-width:560px){ .brand .wordmark{font-size:17px} .brand .logo{width:36px;height:36px}
  .brand .tagline{font-size:10px} }
.tabs{display:flex;gap:4px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:8px;
  color:var(--muted);font-weight:500;font-size:14px;cursor:pointer;white-space:nowrap;border:none;background:none}
.tab:hover{background:var(--surface-2);color:var(--ink)}
.tab.active{color:var(--accent-ink);background:var(--banana-soft);font-weight:600}

/* ---- sections ---- */
main.wrap{padding:30px 20px 80px}
.view{display:none;animation:fade .2s ease}
.view.active{display:block}
#view-live{position:relative}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);margin:0 0 8px}
h1{font-size:30px;line-height:1.15;letter-spacing:-.02em;margin:0 0 6px;font-weight:700}
h2{font-size:21px;letter-spacing:-.01em;margin:34px 0 14px;font-weight:650}
.sub{color:var(--muted);margin:0 0 22px;max-width:620px}

/* ---- hero headline number ---- */
.hero{background:linear-gradient(180deg,#fbfcfd,#fff);border:1px solid var(--border);
  border-radius:16px;padding:28px;box-shadow:var(--shadow);margin-bottom:18px}
.bignum{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.bignum .from{font-size:20px;color:var(--muted);font-weight:600}
.bignum .arrow{color:var(--faint);font-size:22px}
.bignum .to{font-size:40px;font-weight:750;letter-spacing:-.03em}
.bignum .mult{font-size:15px;font-weight:700;color:var(--green);background:var(--green-bg);
  padding:3px 9px;border-radius:999px}
.hero .period{color:var(--muted);font-size:13.5px;margin-top:8px}

/* ---- stat cards ---- */
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:16px 0}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px 15px}
.card .k{font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);margin-bottom:6px}
.card .v{font-size:22px;font-weight:700;letter-spacing:-.01em}
.card .v small{font-size:13px;color:var(--muted);font-weight:500}

/* ---- charts ---- */
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:16px 18px;box-shadow:var(--shadow)}
.panel h3{margin:0 0 2px;font-size:15px;font-weight:650}
.panel .note{color:var(--muted);font-size:12.5px;margin:0 0 10px}
svg.chart{display:block;width:100%;height:auto;overflow:visible}
.axis{fill:var(--faint);font-size:11px}
@media (max-width:560px){.axis{font-size:14px}}
.gridline{stroke:var(--border);stroke-width:1}

/* ---- disclaimer banner ---- */
.disclaimer{display:flex;gap:10px;align-items:flex-start;background:#fff9ec;
  border:1px solid #f0e2c0;color:#6b5a2e;border-radius:10px;padding:11px 14px;
  font-size:12.5px;line-height:1.45;margin:14px 0}
.disclaimer b{color:#5a4c26}

/* ---- monthly heatmap ---- */
.heat{display:grid;grid-template-columns:48px repeat(12,1fr);gap:3px;font-size:11px}
.heat .hh{color:var(--muted);text-align:center;padding:3px 0;font-weight:600}
.heat .yl{color:var(--muted);font-weight:700;display:flex;align-items:center}
.cell{height:30px;border-radius:5px;display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:600;font-size:10.5px;background:var(--surface-2);color:var(--faint)}

/* ---- year stat strip ---- */
.strip{display:flex;flex-wrap:wrap;gap:22px;padding:14px 18px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--radius);margin-bottom:14px}
.strip .s .k{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.strip .s .v{font-size:19px;font-weight:700}

/* ---- trade table ---- */
table{width:100%;border-collapse:collapse;font-size:13.5px}
thead th{text-align:right;color:var(--muted);font-weight:600;font-size:11.5px;
  text-transform:uppercase;letter-spacing:.03em;padding:9px 10px;border-bottom:1px solid var(--border-2)}
thead th:first-child,tbody td:first-child{text-align:left}
tbody td{padding:10px;border-bottom:1px solid var(--border);text-align:right}
tbody tr{cursor:pointer}
tbody tr:hover{background:var(--surface-2)}
.sym{font-weight:650;color:var(--ink)}
.sym .isin{display:block;font-size:10.5px;color:var(--faint);font-weight:400}
.tag{display:inline-block;font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;
  text-transform:capitalize}
.tag.stop{background:var(--red-bg);color:var(--red)}
.tag.ma50,.tag.ma30wk{background:var(--green-bg);color:var(--green)}
.tag.rotate{background:#eef0f2;color:var(--muted)}
.chevron{color:var(--faint)}
/* mobile: each trade row becomes a card (no horizontal scroll) */
@media (max-width:560px){
  .tablewrap table,.tablewrap thead,.tablewrap tbody,.tablewrap tr,.tablewrap td{display:block}
  .tablewrap thead{display:none}
  .tablewrap tr{border:1px solid var(--border);border-radius:12px;padding:10px 13px;margin-bottom:10px;background:var(--surface)}
  .tablewrap tbody td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
    padding:5px 0;border:0;text-align:right}
  .tablewrap tbody td::before{content:attr(data-l);color:var(--muted);font-weight:600;font-size:12px;text-align:left}
  .tablewrap tbody td:first-child{padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid var(--border)}
  .tablewrap tbody td:first-child::before{display:none}
  .tablewrap td.chevron{display:none}
  .sym .isin{display:inline;margin-left:6px}
}

/* ---- method: funnel + figures ---- */
.panel-head{display:flex;justify-content:space-between;align-items:baseline}
.panel .snap{font-size:11.5px;color:var(--faint);font-variant-numeric:tabular-nums}
svg.anatomy{width:100%;height:auto;margin-top:6px}
.lifeflow{display:flex;gap:10px;margin-top:14px}
.lstep{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.lstep:not(:last-child)::after{content:"";position:absolute;top:17px;left:50%;width:100%;height:2px;background:var(--border-2);z-index:0}
.lnum{width:34px;height:34px;border-radius:50%;color:#fff;display:flex;align-items:center;
  justify-content:center;font-weight:700;font-size:14px;position:relative;z-index:1}
.ltxt b{display:block;font-size:13.5px;margin-top:11px;color:var(--ink)}
.ltxt span{font-size:12px;color:var(--muted)}
@media (max-width:560px){
  .lifeflow{flex-direction:column;gap:0}
  .lstep{flex-direction:row;align-items:flex-start;text-align:left;gap:13px;padding:9px 0}
  .lstep:not(:last-child)::after{top:34px;left:17px;width:2px;height:calc(100% - 18px)}
  .ltxt b{margin-top:6px}
}
#funnel{margin-top:14px}
.frow{padding:13px 0;border-top:1px solid var(--border)}
.frow:first-child{border-top:none}
.ftop{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;gap:12px}
.fname{font-size:15px;font-weight:600;color:var(--ink)}
.fct{font-size:17px;font-weight:700;color:var(--ink);white-space:nowrap}
.ftrack{height:16px;background:var(--surface-2);border-radius:8px;overflow:hidden}
.fbar{height:100%;border-radius:8px;transition:width .6s ease}
.fnote{font-size:13px;color:var(--muted);margin-top:8px}

/* ---- method cards ---- */
.method{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.mcard{border:1px solid var(--border);border-radius:var(--radius);padding:18px;background:var(--surface)}
.mcard .step{font-size:11px;font-weight:700;color:var(--accent);letter-spacing:.05em}
.mcard h4{margin:10px 0 6px;font-size:16px;font-weight:650}
.mcard p{margin:0;color:var(--muted);font-size:13.5px}
.mcard svg{display:block;margin:4px 0 6px}

/* ---- live gate ---- */
.gate{position:relative;border:1px solid var(--border);border-radius:16px;overflow:hidden;
  min-height:340px;background:linear-gradient(180deg,#fbfcfd,#fff)}
.gate .blur{filter:blur(7px);opacity:.5;pointer-events:none;padding:18px}
.gate .lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;padding:24px;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.7),rgba(255,255,255,.94))}
.lock .ic{width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px}
.lock h3{margin:0 0 6px;font-size:22px;letter-spacing:-.01em}
.lock p{margin:0 0 18px;color:var(--muted);max-width:430px}
.form{display:flex;gap:8px;width:100%;max-width:430px}
.form input{flex:1;padding:12px 14px;border:1px solid var(--border-2);border-radius:10px;
  font-size:15px;font-family:inherit}
.form input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(26,138,74,.12)}
.form button,.btn{padding:12px 18px;background:var(--accent);color:#fff;border:none;
  border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;white-space:nowrap}
.form button:hover,.btn:hover{background:var(--accent-ink)}
.lock .tiny{font-size:11.5px;color:var(--faint);margin-top:12px}

/* ---- live positions ---- */
.poscard{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:14px 0}
.holding{border:1px solid var(--border);border-radius:var(--radius);padding:15px;background:var(--surface);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.holding:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.holding .viewlink{font-size:11.5px;color:var(--accent);font-weight:600;margin-top:10px;display:block}
.chart-cap{font-size:14px;font-weight:600;color:var(--ink);margin:2px 0 12px;line-height:1.4}
.chart-cap .r{font-weight:700}
#tvchart{height:380px;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.holding .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.holding .name{font-weight:700;font-size:16px;color:var(--ink)}
.holding .kind{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);
  border:1px solid var(--border-2);border-radius:6px;padding:2px 7px}
.holding .livedot{font-size:11px;font-weight:600;color:var(--green);letter-spacing:.02em}
.livedot{color:var(--green)}
.badge-n{display:inline-block;font-size:13px;font-weight:700;color:var(--muted);background:var(--surface-2);
  border-radius:999px;padding:1px 9px;margin-left:6px;vertical-align:middle}
.asof{font-size:12px;font-weight:400;color:var(--faint);margin-left:8px;vertical-align:middle}

/* ---- live pipeline (Now tab) ---- */
.regime{font-size:12.5px;color:var(--muted);margin:2px 0 16px}
.regime b{color:var(--ink)}
.flow{display:flex;align-items:stretch;gap:8px;margin:4px 0 6px}
.fstage{flex:1;min-width:96px;border:1px solid var(--border);border-radius:12px;
  padding:13px 10px;text-align:center;background:var(--surface)}
.fstage .fc{font-size:25px;font-weight:750;line-height:1}
.fstage .fl{font-size:13px;font-weight:650;margin-top:7px;color:var(--ink)}
.fstage .fs{font-size:11px;color:var(--muted);margin-top:3px;line-height:1.25}
.farrow{display:flex;align-items:center;color:var(--faint);font-size:17px}
.fstage.k-watch .fc{color:#6b7480}
.fstage.k-trig .fc{color:var(--banana-ink)}
.fstage.k-hold .fc{color:var(--green)}
.fstage.k-exit .fc{color:#9aa3ad}
.dotk{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle;margin-right:3px}
.dotk.k-watch{background:#6b7480}
.dotk.k-trig{background:var(--banana)}
.dotk.k-hold{background:var(--green)}
.dotk.k-exit{background:#cfd6dd}
.tag.rotate{background:#eef0f2;color:var(--muted)}
.tag.skip{background:#eef0f2;color:var(--muted)}
.tag.wait{background:var(--banana-soft);color:var(--banana-ink)}
.why-inline{font-size:11.5px;color:var(--muted);margin-left:9px;vertical-align:middle}
.liveperf{background:linear-gradient(180deg,#fbfcfd,#fff);border:1px solid var(--border);
  border-radius:14px;padding:16px 20px;box-shadow:var(--shadow);margin-bottom:6px}
.liveperf .lp-l{font-size:11.5px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.liveperf .lp-n{display:flex;align-items:baseline;gap:11px;margin-top:4px}
.lp-from{font-size:17px;color:var(--muted);font-weight:600}
.lp-a{color:var(--faint);font-size:18px}
.lp-to{font-size:28px;font-weight:750;letter-spacing:-.02em}
.lp-m{font-size:13px;font-weight:700;color:var(--green);background:var(--green-bg);padding:2px 9px;border-radius:999px}
.liveperf .lp-meta{font-size:12.5px;color:var(--muted);margin-top:7px}
.holding .livedot.dw{color:var(--muted)}
.pl-why{margin-top:9px;padding-top:9px;border-top:1px solid var(--border);
  font-size:12px;color:var(--muted);line-height:1.4}

/* educational live page */
/* ---- live: nav-tab blinker + subtle freshness line ---- */
.navdot{width:7px;height:7px;border-radius:50%;background:var(--green);position:relative;flex:none}
.navdot::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--green);
  animation:lpulse 1.9s cubic-bezier(.2,.6,.3,1) infinite}
.liveupd{position:absolute;top:2px;right:0;display:flex;flex-direction:column;align-items:flex-end;gap:1px;z-index:2}
.liveupd .lu1{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink)}
.liveupd .lu2{font-size:11.5px;color:var(--faint)}
@media (max-width:620px){
  .liveupd{position:static;align-items:flex-start;margin:0 0 14px}
}
.lpulse{position:relative;width:9px;height:9px;border-radius:50%;background:var(--green);flex:none}
.lpulse.sm{width:8px;height:8px}
.lpulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--green);
  animation:lpulse 1.9s cubic-bezier(.2,.6,.3,1) infinite}
@keyframes lpulse{0%{transform:scale(1);opacity:.6}80%,100%{transform:scale(3);opacity:0}}
@media (prefers-reduced-motion:reduce){.lpulse::after,.navdot::after{animation:none}}

.eduwarn{background:#fff9ec;border:1px solid #f0e2c0;color:#6b5a2e;border-radius:12px;
  padding:13px 16px;font-size:12.5px;line-height:1.55;margin-bottom:16px}
.eduwarn b{color:#5a4c26}
.trstats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ts{background:var(--surface-2);border-radius:var(--radius);padding:12px 15px}
.ts .tk{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.ts .tv{font-size:22px;font-weight:700;margin-top:3px}
.trlabel{font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent);margin-bottom:9px}
.trlabel span{font-weight:400;text-transform:none;letter-spacing:0;color:var(--muted)}
.trnote{font-size:12.5px;color:var(--muted);margin-top:9px}
.holding.edu{display:flex;flex-direction:column}
.crit{list-style:none;margin:11px 0 6px;padding:0}
.crit li{font-size:12.5px;color:#41484f;line-height:1.45;padding:6px 0 6px 19px;position:relative;
  border-top:1px solid var(--border)}
.crit li:first-child{border-top:none}
.crit li::before{content:"✓";position:absolute;left:0;top:6px;color:var(--accent);font-weight:700;font-size:11px}
.crit li b{color:var(--ink);font-weight:600}

/* ---- chart-led live setups ---- */
.livesec{margin-top:28px}
.secsub{font-size:13px;color:var(--muted);line-height:1.55;margin:-2px 0 14px;max-width:700px}
.setnote{margin:11px 0 2px}
.setups{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:4px 0}   /* two charts side by side */
.funhd{font-size:14.5px;color:var(--muted);font-weight:600;margin:20px 0 12px}
/* card stacks: name → big full-width chart → the "why" criteria */
.setup{display:flex;flex-direction:column;
  border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);
  padding:13px 15px;transition:border-color .15s,box-shadow .15s}
.setup:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.setup-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:4px}
.setup-head .name{font-weight:700;font-size:17px;color:var(--ink)}
.setup-head .livedot{font-size:11px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.setup-chart{min-width:0;margin:2px 0 2px}
.setup-chart .chart{width:100%;height:auto;display:block}
.csk{display:flex;align-items:center;justify-content:center;height:170px;color:var(--faint);font-size:12.5px}
.setup .crit{margin:6px 0 2px;columns:2;column-gap:26px}
.setup .crit li{break-inside:avoid}
.setup .viewlink{font-size:11.5px;color:var(--accent);font-weight:600;margin-top:8px;
  display:inline-block;cursor:pointer}
.setup .viewlink:hover{text-decoration:underline}
.livedot.dr{color:var(--green);font-weight:700}

/* ---- "already running": compact, chart-less ---- */
.runlist{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0}
.runrow{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);
  padding:11px 13px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.runrow:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.runtop{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.runtop .name{font-weight:700;font-size:15.5px;color:var(--ink)}
.rungain{font-weight:700;font-size:14.5px}
.runmeta{font-size:11.5px;color:var(--muted);margin:3px 0 2px}
.runmeta b{color:var(--ink);font-weight:600}
.crit.tight{margin:5px 0 2px}
.crit.tight li{font-size:12px;padding:4px 0 4px 18px}
.runrow .viewlink{font-size:11px;color:var(--accent);font-weight:600;margin-top:5px;display:inline-block}

/* ---- live dashboard: four categories, two columns ---- */
.livegrid{display:block;margin-top:6px}        /* stages are tabbed now — one panel at a time */
.catpanel{min-width:0;display:none}
.catpanel.show{display:block}
.catpanel .livesec{margin-top:22px}
.livegrid .tablewrap{margin-top:4px}
@media (max-width:980px){.livegrid{grid-template-columns:1fr;gap:0 0}}
@media (max-width:620px){.setup .crit{columns:1}}   /* setups + runlist stay 2-up on mobile (denser) */
@media (max-width:560px){.trstats{grid-template-columns:repeat(2,1fr)}}

/* ---- backtest year sub-nav ---- */
.ynav{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 20px}
.ypill{padding:8px 18px;border:1px solid var(--border);border-radius:999px;background:var(--surface);
  color:var(--muted);font-weight:600;font-size:14px;cursor:pointer;transition:all .14s}
.ypill:hover{border-color:var(--accent);color:var(--accent-ink)}
.ypill.on{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---- backtest playground controls ---- */
.pgctrls{border:1px solid var(--border);border-radius:14px;background:var(--surface-2);
  padding:16px 18px;margin:6px 0 22px}
.pgrow{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px;margin-bottom:14px}
.pgrow-foot{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:0;gap:14px}
.pgapply{border:0;background:var(--accent);color:#fff;font-weight:700;font-size:14px;padding:11px 24px;
  border-radius:10px;cursor:pointer;transition:filter .15s;white-space:nowrap}
.pgapply:hover{filter:brightness(1.06)}
.pgapply:disabled{opacity:.7;cursor:default}
.pgapply.ready{animation:pgpulse 1.4s infinite}
@keyframes pgpulse{0%{box-shadow:0 0 0 0 rgba(26,138,74,.45)}70%{box-shadow:0 0 0 11px rgba(26,138,74,0)}100%{box-shadow:0 0 0 0 rgba(26,138,74,0)}}
.pgscan{display:flex;align-items:center;gap:11px;justify-content:center;background:var(--surface-2);
  border:1px solid var(--border);border-radius:12px;padding:16px;font-size:13.5px;font-weight:600;color:var(--muted);margin:0 0 18px}
.pgspin{display:inline-block;width:14px;height:14px;border:2.3px solid rgba(255,255,255,.4);border-top-color:#fff;
  border-radius:50%;animation:pgspin .7s linear infinite;vertical-align:-2px;margin-right:4px}
@keyframes pgspin{to{transform:rotate(360deg)}}
#pgresults.stale{opacity:.38;filter:grayscale(.4);transition:opacity .2s;pointer-events:none}
@media (prefers-reduced-motion:reduce){.pgapply.ready{animation:none}.pgspin{animation-duration:1.6s}}
.ctl{min-width:0}
.ctl-l{font-size:12px;font-weight:700;color:var(--ink);margin-bottom:7px;display:flex;gap:8px;align-items:baseline}
.ctl-l span{font-weight:400;color:var(--faint);font-size:11px}
.segs{display:inline-flex;flex-wrap:wrap;gap:6px;background:var(--surface);border:1px solid var(--border);
  border-radius:10px;padding:4px}
.segs button{border:0;background:transparent;color:var(--muted);font-weight:600;font-size:13px;
  padding:6px 13px;border-radius:7px;cursor:pointer;transition:all .12s;white-space:nowrap}
.segs button:hover{color:var(--accent-ink)}
.segs button.on{background:var(--accent);color:#fff}
.capwrap{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:10px;
  background:var(--surface);padding:6px 12px;font-weight:600;color:var(--ink)}
.capwrap input{border:0;outline:0;font:inherit;color:var(--ink);width:120px;background:transparent}
.benchtog{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer}
.benchtog input{width:15px;height:15px;accent-color:var(--accent)}
.advtoggle{border:1px solid var(--border);background:var(--surface);color:var(--muted);font-weight:600;
  font-size:12.5px;padding:7px 14px;border-radius:8px;cursor:pointer}
.advtoggle.on,.advtoggle:hover{border-color:var(--accent);color:var(--accent-ink)}
.pgdefs-hint{font-size:12.5px;color:var(--faint);font-style:italic}
.pgdefs{display:grid;grid-template-columns:1fr 1fr;gap:8px 26px;margin:-8px 0 22px}
.pgdef{font-size:12.5px;color:#41484f;line-height:1.5;padding-left:14px;position:relative}
.pgdef::before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:var(--banana)}
.pgdef b{color:var(--ink)}
@media (max-width:720px){.pgdefs{grid-template-columns:1fr}}
.advbox{margin-top:14px;padding-top:14px;border-top:1px dashed var(--border)}
.advnote{font-size:12px;color:var(--muted);margin:9px 0 0;line-height:1.5}
.pghero{background:linear-gradient(180deg,#fbfcfd,#fff);border:1px solid var(--border);
  border-radius:14px;padding:22px 24px;margin-bottom:14px}
.pghero .period{color:var(--muted);font-size:13.5px;margin-top:8px}
.rulebox{margin-top:22px}
.ruleslist{margin:6px 0 0;padding-left:0;list-style:none}
.ruleslist li{font-size:13.5px;color:#41484f;line-height:1.55;padding:8px 0 8px 22px;position:relative;
  border-top:1px solid var(--border)}
.ruleslist li:first-child{border-top:0}
.ruleslist li::before{content:"→";position:absolute;left:0;top:8px;color:var(--accent);font-weight:700}
.ruleslist b{color:var(--ink)}
@media (max-width:720px){.pgrow{grid-template-columns:1fr}}
@media (max-width:560px){
  /* compact filters: drop the inline hints, full-width segmented controls, tighter spacing */
  .pgctrls{padding:14px 13px}
  .pgrow{gap:10px;margin-bottom:10px}
  .ctl-l{font-size:12.5px;margin-bottom:5px}
  .ctl-l span{display:none}
  .segs{width:100%}
  .segs button{flex:1;font-size:12.5px;padding:9px 4px}
  .segs[data-seg="period"]{flex-wrap:wrap}
  .pgrow-foot{flex-direction:column;align-items:stretch;gap:10px}
  .pgapply{width:100%}
  .capwrap{width:100%}.capwrap input{width:100%}
  /* headline: drop the redundant "₹10L →" (it's in the sentence below) so the result + multiple sit together */
  .bignum{gap:10px}
  .bignum .from,.bignum .arrow{display:none}
  .bignum .to{font-size:31px}
  .bignum .mult{font-size:14px}
}

/* ---- Search tab ---- */
.uhealth{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:12px;margin:6px 0 22px}
.secq{width:100%;max-width:440px;padding:10px 14px;border:1px solid var(--border);border-radius:10px;
  font:inherit;margin:0 0 14px;background:var(--surface)}
.secq:focus{outline:none;border-color:var(--accent)}
.sech{font-size:13px;font-weight:700;color:var(--ink);margin:18px 0 10px;text-transform:uppercase;letter-spacing:.04em}
.sech.weak{color:var(--muted)}
.sech:first-child{margin-top:4px}
/* the 4-box lifecycle strip (Live page) */
.lifehd{font-size:13px;color:var(--muted);margin:0 0 10px}
.lifehd b{color:var(--ink)}
.lifestrip{display:flex;align-items:stretch;gap:8px;margin:0 0 22px}
.lifebox{flex:1;min-width:0;border:1px solid var(--border);border-radius:13px;background:var(--surface);
  padding:13px 15px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.lifebox:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.lifebox.active{border-color:var(--accent);background:var(--green-bg);box-shadow:0 0 0 1px var(--accent)}
.lifetop{display:flex;align-items:center;gap:7px}
.lifen{font-size:26px;font-weight:750;letter-spacing:-.02em;color:var(--ink);line-height:1}
.lifel{font-size:13.5px;font-weight:700;color:var(--ink);margin-top:7px}
.lifesub{font-size:11.5px;color:var(--faint);margin-top:2px}
.lifear{display:flex;align-items:center;color:var(--faint);font-size:20px;font-weight:700;flex:0 0 auto}
@media (max-width:720px){.lifestrip{flex-wrap:wrap}.lifear{display:none}.lifebox{flex:1 1 44%}}

/* the lifecycle ladder explainer */
.ladder{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:12px;color:var(--muted);
  background:var(--surface-2);border:1px solid var(--border);border-radius:11px;padding:11px 14px;margin:0 0 16px;line-height:1.5}
.ladder b{color:var(--ink)}
.ladder>span{display:inline-flex;align-items:center;gap:5px}
.ladder em{color:var(--ink);font-weight:600;font-style:normal}
.uh{background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:13px 15px}
.uh.uhclick{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.uh.uhclick:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.uhk{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.uhv{font-size:24px;font-weight:750;margin-top:3px;letter-spacing:-.02em}
.uhv.pos{color:var(--green)}.uhv.neg{color:var(--neg,#d2392f)}
.searchwrap{position:relative;max-width:640px;margin:4px 0 0}
.searchwrap.big{max-width:760px;margin:14px 0 22px}
.searchwrap.big .qinput{padding:18px 20px 18px 50px;font-size:17px;border-radius:14px;box-shadow:var(--shadow)}
.qico{position:absolute;left:18px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--muted);pointer-events:none;z-index:1}
/* universe funnel */
.ufunnel{display:flex;align-items:center;flex-wrap:wrap;gap:6px 4px;margin:0 0 14px}
.ufstage{flex:1;min-width:120px;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:13px 15px}
.ufstage.clk{cursor:pointer;border-color:#bfe6cd;background:#eafaf0}
.ufstage.clk:hover{box-shadow:var(--shadow)}
.ufn{font-size:23px;font-weight:750;letter-spacing:-.02em;color:var(--ink)}
.ufl{font-size:12.5px;color:var(--muted);font-weight:600;margin-top:1px}
.ufsub{font-size:11px;color:var(--faint);margin-top:2px}
.ufar{color:var(--faint);font-size:20px;font-weight:700;flex:0 0 auto}
@media (max-width:640px){.ufunnel{flex-direction:column;align-items:stretch}.ufar{display:none}}
.qinput{width:100%;border:1.5px solid var(--border);border-radius:12px;padding:14px 18px;font-size:15px;
  font-family:inherit;color:var(--ink);outline:none;transition:border-color .15s;background:var(--surface)}
.qinput:focus{border-color:var(--accent)}
.qdrop{display:none;position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:20;background:var(--surface);
  border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;max-height:360px;overflow-y:auto}
.qdrop.on{display:block}
.qitem{display:flex;align-items:center;gap:10px;padding:10px 15px;cursor:pointer;border-bottom:1px solid var(--border)}
.qitem:last-child{border-bottom:none}
.qitem:hover{background:var(--surface-2)}
.qitem.qnone{color:var(--muted);cursor:default}
.qsym{font-weight:700;color:var(--ink);min-width:84px}
.qname{color:var(--muted);font-size:13px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qverd{font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap}
.v-break{background:#e6f7ed;color:#15803d}.v-watch{background:var(--banana-soft);color:var(--banana-ink)}
.v-run{background:#e7f3ff;color:#1d6fb8}
.v-exit{background:#fdecea;color:#b4493c}
.v-lead{background:#eef2f7;color:#51606e}.v-out{background:#f3f4f6;color:#8a939c}

/* structured stock report */
.rep{border:1px solid var(--border);border-radius:16px;background:var(--surface);padding:20px 22px;margin-top:18px}
.rep-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.rep-sym{font-weight:800;font-size:22px;color:var(--ink);letter-spacing:-.01em}
.rep-name{color:var(--muted);font-size:14px;margin-left:9px}
.rep-sec{font-size:12.5px;color:var(--faint);margin-top:3px}
.verdict{font-size:12.5px;font-weight:700;padding:6px 13px;border-radius:22px;white-space:nowrap;flex:none}
.rep-stats{display:flex;flex-wrap:wrap;gap:7px 16px;margin:12px 0 4px;font-size:13.5px;color:var(--ink);font-weight:600}
.rep-stats span{color:var(--muted)}.rep-stats span:first-child{color:var(--ink);font-weight:700}
.rep-chart{margin:10px 0 4px;min-height:60px}
.rep-chart .chart{width:100%;height:auto;display:block}
.whybox{border-radius:11px;padding:12px 15px;font-size:13.5px;line-height:1.5;margin:12px 0}
.whybox.ok{background:#eafaf0;border:1px solid #bfe6cd;color:#1f6b40}
.whybox.no{background:#fdf3f2;border:1px solid #f3cfca;color:#9a3b30}
.whybox b{font-weight:700}
.repdis{font-size:11.5px;color:var(--faint);margin:14px 0 0;font-style:italic}

/* factual level rows (the read-out — no pass/fail) */
.levels{margin:14px 0 2px}
.lvlna{color:var(--faint);font-weight:600;font-size:13px}
.lvl{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:10px 2px;border-top:1px solid var(--border)}
.lvl:first-child{border-top:none}
.lvlk{font-size:13.5px;font-weight:600;color:var(--ink);display:flex;flex-direction:column;gap:1px}
.lvlk span{font-weight:400;font-size:11.5px;color:var(--faint)}
.lvlv{font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap;text-align:right}
.lvlv .pos{color:var(--green)}.lvlv .neg{color:#d2392f}
.lvlmax{font-weight:500;color:var(--faint);font-size:12px}

/* gated stock list (sector / health-box drill-down) */
.listhead{margin-bottom:6px}
.srlist{display:flex;flex-direction:column}
.lrow{display:flex;align-items:center;gap:12px;padding:11px 4px;border-top:1px solid var(--border);cursor:pointer}
.lrow:first-child{border-top:none}.lrow:hover{background:var(--surface-2)}
.lsym{font-weight:700;color:var(--ink);font-size:14px;flex:1;min-width:0}
.lname{font-weight:400;color:var(--muted);font-size:12.5px;margin-left:8px}
.lrs{font-size:12.5px;color:var(--muted);font-weight:600;white-space:nowrap}

/* unified stock view inside the drawer (borderless) */
.rep.rep-bare{border:0;border-radius:0;padding:0;margin:0}
/* industry-group side panel — tiles grouped by tag */
.sgrp{margin-bottom:18px}
.sgrph{font-size:13px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:7px;margin:0 0 9px}
.stiles{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.stile{display:flex;flex-direction:column;gap:7px;border:1px solid var(--border);
  border-radius:11px;padding:11px 12px;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.stile:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.stsym{font-weight:700;font-size:14px;color:var(--ink)}
.stbot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.stile .verdict{font-size:10px;padding:3px 8px;font-weight:700}
.strs{font-size:11.5px;color:var(--muted);font-weight:600;white-space:nowrap}
.dback{background:none;border:0;color:var(--muted);font-weight:600;font-size:13px;cursor:pointer;padding:2px 0}
.dback:hover{color:var(--accent-ink)}
.legrow{display:flex;flex-wrap:wrap;gap:7px;margin:0 -20px 14px;padding:14px 20px 12px;
  position:sticky;top:0;z-index:5;background:var(--surface);border-bottom:1px solid var(--border)}
.legbtn{border:1px solid var(--border);background:var(--surface);color:var(--muted);font-weight:600;
  font-size:12px;padding:6px 12px;border-radius:999px;cursor:pointer;transition:all .12s}
.legbtn span{color:var(--faint);font-weight:700}
.legbtn:hover{border-color:var(--accent);color:var(--accent-ink)}
.legbtn.on{background:var(--accent);border-color:var(--accent);color:#fff}
.legbtn.on span{color:#fff}

/* inline email lock (Search) */
.lockinline{text-align:center;padding:26px 18px}
.lockinline .ic{font-size:26px}
.lockinline h3{margin:6px 0 6px;font-size:18px}
.lockinline p{color:var(--muted);font-size:13.5px;max-width:430px;margin:0 auto 16px;line-height:1.5}
.lockinline .form{display:flex;gap:8px;max-width:420px;margin:0 auto}
.lockinline .form input{flex:1;padding:11px 13px;border:1px solid var(--border);border-radius:9px;font:inherit}
.lockinline .form button{padding:11px 18px;border:0;border-radius:9px;background:var(--accent);color:#fff;font-weight:700;cursor:pointer}
.lockinline .tiny{font-size:11px;color:var(--faint);margin-top:9px}

/* ---- unified gate popup (modal) ---- */
.gatemodal{position:fixed;inset:0;z-index:200;background:rgba(20,28,38,.45);
  display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px)}
.gatebox{position:relative;background:var(--surface);border-radius:16px;box-shadow:0 20px 60px rgba(20,30,40,.25);
  max-width:460px;width:100%}
.gatebox .x{position:absolute;top:10px;right:12px;border:0;background:none;font-size:24px;color:var(--faint);cursor:pointer;z-index:1}
.gatebox .lockinline{padding:30px 22px 26px}

/* ---- login modal ---- */
.gatebox .loginbox{padding:30px 24px 24px;text-align:center}
.loginbox .ic{width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:22px;margin:0 auto 12px}
.loginbox h3{margin:0 0 6px;font-size:20px}
.loginbox p{margin:0 0 18px;color:var(--muted);font-size:14px;line-height:1.5}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px;border:1px solid var(--border-2);
  border-radius:10px;background:#fff;color:var(--ink);font-weight:600;font-size:14.5px;cursor:pointer;text-decoration:none}
.gbtn:hover{border-color:var(--muted);box-shadow:var(--shadow)}
.ordiv{display:flex;align-items:center;gap:10px;color:var(--faint);font-size:12px;margin:14px 0}
.ordiv::before,.ordiv::after{content:"";flex:1;height:1px;background:var(--border)}
.form.col{display:flex;flex-direction:column;gap:9px;max-width:none}
.form.col input{width:100%}
.btn.wide{width:100%;justify-content:center;text-align:center}
.loginmsg{font-size:13.5px;color:var(--ink);margin-top:8px;line-height:1.5}
.loginmsg a{color:var(--accent);font-weight:600}

/* ---- account menu (header) ---- */
.account{display:flex;align-items:center}
.acctbtn{border:1px solid var(--border-2);background:var(--surface);color:var(--muted);font-weight:600;font-size:13px;padding:7px 14px;border-radius:9px;cursor:pointer}
.acctbtn.signin{background:var(--accent);border-color:var(--accent);color:#fff}
.acctbtn:hover{border-color:var(--accent)}
.acctmenu{position:relative}
.acctchip{display:flex;align-items:center;gap:8px;border:1px solid var(--border-2);background:var(--surface);border-radius:22px;padding:4px 11px 4px 4px;cursor:pointer;font:inherit}
.acctchip:hover{border-color:var(--accent)}
.acctav{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.acctlbl{font-size:13px;font-weight:600;color:var(--ink);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acctchip .chev{font-size:10px;color:var(--muted)}
.acctdrop{position:absolute;top:calc(100% + 8px);right:0;min-width:210px;background:var(--surface);border:1px solid var(--border);
  border-radius:12px;box-shadow:0 12px 36px rgba(20,30,40,.16);padding:6px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.15s;z-index:60}
.acctdrop.open{opacity:1;visibility:visible;transform:translateY(0)}
.acctwho{padding:10px 12px 12px}
.acctwho b{display:block;font-size:14px}
.acctwho span{display:block;font-size:12px;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis}
.acctitem{display:block;width:100%;text-align:left;border:0;background:none;padding:10px 12px;border-top:1px solid var(--border);
  font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer}
.acctitem:hover{background:var(--surface-2)}
.acctitem.logout{border-radius:0 0 8px 8px}
.acctitem.logout:hover{color:var(--red)}
/* ---- global header search ---- */
.hsearch{width:36px;height:36px;border-radius:50%;border:1px solid var(--border-2);background:var(--surface);
  color:var(--muted);font-size:18px;cursor:pointer;display:grid;place-items:center;flex:none}
.hsearch:hover{border-color:var(--accent);color:var(--accent)}
.searchmodal{position:fixed;inset:0;z-index:210;background:rgba(20,28,38,.42);backdrop-filter:blur(2px);
  display:flex;justify-content:center;align-items:flex-start;padding:78px 16px 16px}
.searchpanel{width:100%;max-width:560px;background:var(--surface);border-radius:14px;box-shadow:0 20px 60px rgba(20,30,40,.25);overflow:hidden}
.gsbar{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border)}
.gsbar .qico{font-size:20px;color:var(--faint)}
.gsbar input{flex:1;border:0;outline:none;font-size:16px;font-family:inherit;background:none;color:var(--ink)}
.gsbar .x{border:0;background:none;font-size:24px;color:var(--faint);cursor:pointer;line-height:1}
.searchpanel .qdrop{position:static;box-shadow:none;border:0;border-radius:0;max-height:60vh;overflow-y:auto;opacity:1;visibility:visible;transform:none}
@media (max-width:560px){.searchmodal{padding:62px 10px 10px}.hsearch{width:34px;height:34px;font-size:17px}}

/* ---- profile modal ---- */
.pfbox{text-align:left}
.pfbox h3{text-align:center}
.pflabel{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:12px 0 5px}
.pfbox input{width:100%;padding:11px 13px;border:1px solid var(--border-2);border-radius:10px;font-size:15px;font-family:inherit}
.pfbox input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(26,138,74,.12)}
.pfdisabled{background:var(--surface-2);color:var(--muted)}
.pfnote{margin:6px 0 16px}
.pfbox .btn.wide{margin-top:4px}

/* ---- admin dashboard ---- */
.admincards{grid-template-columns:repeat(4,1fr)}
.card .acsub{font-size:11.5px;color:var(--faint);margin-top:4px}
.achart{display:flex;align-items:flex-end;gap:6px;height:150px;padding:8px 2px 0}
.abar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:5px}
.abarfill{width:100%;max-width:32px;background:var(--accent);border-radius:4px 4px 0 0}
.abar span{font-size:9px;color:var(--faint);white-space:nowrap}
.admingrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:6px}
.atable{width:100%;border-collapse:collapse}
.atable td{padding:8px 4px;border-top:1px solid var(--border);font-size:13px}
.atable td:first-child{color:var(--ink);overflow:hidden;text-overflow:ellipsis;max-width:170px}
.atable td.num{text-align:right;font-weight:700;color:var(--muted);width:52px}
.atable tr:first-child td{border-top:none}
@media (max-width:820px){.admincards{grid-template-columns:repeat(2,1fr)}.admingrid{grid-template-columns:1fr}}
@media (max-width:560px){.account{margin-left:auto}.acctlbl{display:none}}

/* ---- toast ---- */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);opacity:0;
  background:var(--ink);color:#fff;padding:11px 20px;border-radius:10px;font-size:13.5px;font-weight:500;z-index:300;
  box-shadow:0 8px 30px rgba(20,30,40,.3);transition:opacity .25s,transform .25s;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media (max-width:560px){.account{margin-left:auto}.acctname{max-width:84px}.toast{bottom:80px}}

/* ---- a verdict tag, blurred behind a lock until unlocked ---- */
.taglock{position:relative;display:inline-flex;cursor:pointer}
.taglock .verdict{filter:blur(5px);user-select:none}
.taglock .tlk{position:absolute;inset:0;display:grid;place-items:center;font-size:13px}

/* ---- locked teaser strip (live page: running / closed / +more) ---- */
.gatetease{display:flex;align-items:center;gap:13px;padding:16px 18px;border:1px dashed var(--border-2);
  border-radius:var(--radius);background:var(--surface-2);cursor:pointer;transition:border-color .15s}
.gatetease:hover{border-color:var(--accent)}
.gatetease .ic{font-size:20px;flex:none}
.gatetease .gtt{flex:1;display:flex;flex-direction:column}
.gatetease .gtt b{font-size:14.5px}
.gatetease .gtt span{color:var(--muted);font-size:12.5px;margin-top:1px}
.gatetease .gatecta{flex:none;color:var(--accent);font-weight:600;font-size:13px}

/* ---- blurred stock name (live cards keep the chart, hide the identity) ---- */
.namelock{filter:blur(5px);user-select:none;-webkit-user-select:none;cursor:pointer}
.setup.locked,.runrow.locked,tr.locked{cursor:pointer}
.setup.locked:hover,.runrow.locked:hover{border-color:var(--accent)}
.setup.locked .viewlink,.runrow.locked .viewlink{color:var(--accent)}
/* ---- inline gate (search read-out: blur the chart + metrics, keep the name) ---- */
.gate-inline{min-height:320px;margin:14px 0 4px}
.gate-inline .blur{padding:6px 2px}
.gate-inline .lock h3{font-size:18px}
.gate-inline .lock p{font-size:13.5px}

/* ---- mobile: keep the Live page short & scannable ---- */
/* each stage shows the first 4, with a "Show all N" tap — on every screen size */
.setups.collapsed > .setup:nth-child(n+5),
.runlist.collapsed > .runrow:nth-child(n+5){display:none}
.showmore{display:block;width:100%;margin-top:12px;padding:11px;border:1px solid var(--border-2);
  border-radius:10px;background:var(--surface);color:var(--accent);font-weight:600;font-size:13.5px;cursor:pointer}
.showmore:hover{border-color:var(--accent)}
.setup-head .livedot.up{color:var(--green);font-weight:700}
@media (max-width:560px){
  .setups{grid-template-columns:1fr}              /* one chart per row on mobile (not two) */
  .setup .crit,.runrow .crit{display:none}        /* criteria move to the tap-through detail */
  .eduwarn{font-size:12px;padding:11px 13px;line-height:1.45}
  .secsub{font-size:12.5px}
  .sectorgrid.collapsed > .seccard:nth-child(n+6){display:none}   /* show 5 sectors per column */
  .sub{font-size:13.5px;line-height:1.5}                          /* tighten the long intro paragraphs */
  h1{font-size:22px;line-height:1.18}
}

/* top sectors */
.sectorgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.seccols{display:grid;grid-template-columns:1fr 1fr;gap:8px 26px;align-items:start}
.seccol{min-width:0}
.sectorgrid.two{grid-template-columns:1fr 1fr}
@media (max-width:860px){.seccols{grid-template-columns:1fr}}
.seccard{border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:14px 15px;
  cursor:pointer;transition:border-color .15s,box-shadow .15s}
.seccard:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.secname{font-weight:700;color:var(--ink);font-size:14px;min-height:2.7em;display:flex;align-items:flex-start;line-height:1.3}
.secstats{font-size:12.5px;color:var(--muted);margin:4px 0 8px}
.secstats b{color:var(--green);font-size:14px}
.secbar{height:5px;background:var(--surface-2);border-radius:3px;overflow:hidden}
.secfill{height:100%;background:var(--accent);border-radius:3px}
.secmeta{font-size:11px;color:var(--faint);margin-top:7px}
.sectoggle{display:inline-flex;border:1px solid var(--border-2);border-radius:10px;overflow:hidden;margin:6px 0 14px}
.segbtn{border:0;background:var(--surface);color:var(--muted);font-weight:600;font-size:13px;padding:9px 18px;cursor:pointer}
.segbtn.on{background:var(--accent);color:#fff}
.segbtn + .segbtn{border-left:1px solid var(--border-2)}
@media (max-width:560px){
  .sectoggle{display:flex;width:100%}.segbtn{flex:1;text-align:center}
  .seccard{padding:11px 12px}.secname{font-size:13px}.secstats{font-size:12px}.secmeta{font-size:10px}
}
@media (max-width:820px){.uhealth{grid-template-columns:repeat(3,1fr)}.sectorgrid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.uhealth{grid-template-columns:repeat(2,1fr)}.sectorgrid{grid-template-columns:1fr}.sectorgrid.two{grid-template-columns:1fr 1fr;gap:8px}
  .rep-head{flex-direction:column}}

@media (max-width:560px){
  .flow{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .fstage{min-width:108px}.farrow{font-size:14px}
}
.holding .row{display:flex;justify-content:space-between;font-size:13px;padding:3px 0;color:var(--ink)}
.holding .row .l{color:var(--muted)}
.holding .pl{margin-top:8px;padding-top:8px;border-top:1px solid var(--border);
  display:flex;justify-content:space-between;font-weight:700;color:var(--ink)}

/* ---- drawer (trade detail) ---- */
.scrim{position:fixed;inset:0;background:rgba(15,20,25,.34);z-index:60;opacity:0;
  pointer-events:none;transition:opacity .18s}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(560px,94vw);background:#fff;
  z-index:61;transform:translateX(100%);transition:transform .22s ease;
  box-shadow:-8px 0 30px rgba(15,20,25,.12);overflow-y:auto}
.drawer.open{transform:none}
.drawer .dh{display:flex;justify-content:space-between;align-items:flex-start;padding:20px;
  border-bottom:1px solid var(--border);position:sticky;top:0;background:#fff}
.drawer .dh .x{cursor:pointer;color:var(--muted);font-size:22px;line-height:1;border:none;background:none}
.dbody{padding:20px}
.dstats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}
.dstats .d .k{font-size:10.5px;text-transform:uppercase;color:var(--muted);letter-spacing:.03em}
.dstats .d .v{font-size:17px;font-weight:700}
.why{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;
  padding:12px 14px;font-size:13px;color:#41484f;margin-top:8px}
.legend{display:flex;gap:16px;font-size:12px;color:var(--muted);margin:8px 0 0}
.legend span{display:inline-flex;align-items:center;gap:5px}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block}

footer{border-top:1px solid var(--border);color:var(--muted);font-size:12.5px;
  padding:26px 0 50px;line-height:1.6}
footer .wrap{max-width:var(--maxw)}
.foot-in{display:block}
.foot-left{max-width:900px}
.foot-meta{margin-top:10px;color:var(--faint)}
.foot-links{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px 20px;
  margin-top:18px;padding-top:16px;border-top:1px solid var(--border)}
.foot-links a{color:var(--muted);font-size:13px}
.foot-links a:hover{color:var(--accent)}
.foot-copy{color:var(--faint);font-size:12px;margin-left:auto}

/* ---- About landing: intro panels + guide cards ---- */
.aboutgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0 8px}
.aboutgrid .panel{margin:0}
.guidegrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:14px 0 0}
.guidecard{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid var(--border);
  border-radius:var(--radius);background:var(--surface);color:var(--ink);box-shadow:var(--shadow);
  transition:border-color .15s,transform .15s}
.guidecard:hover{border-color:var(--accent);transform:translateY(-1px)}
.guidecard .gnum{flex:none;width:30px;height:30px;border-radius:50%;background:var(--green-bg);
  color:var(--accent-ink);font-weight:700;font-size:14px;display:grid;place-items:center}
.guidecard .gtxt{flex:1;display:flex;flex-direction:column;min-width:0}
.guidecard .gtxt b{font-size:15px}
.guidecard .gtxt span{color:var(--muted);font-size:13px;margin-top:2px}
.guidecard .garrow{flex:none;color:var(--accent);font-size:20px}

/* ---- Legal pages (footer-linked) ---- */
.legal-upd{color:var(--faint);font-size:13px;margin:-4px 0 22px}
.legal-body{max-width:760px}
.legal-body h3{font-size:16px;margin:24px 0 6px}
.legal-body p{color:var(--muted);line-height:1.66;font-size:14.5px;margin:0 0 4px}
.legal-body a{color:var(--accent)}

/* tables + heatmap scroll on small screens */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -2px}
.heatwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

@media (max-width:780px){
  .cards{grid-template-columns:repeat(2,1fr)}
  .bignum .to{font-size:32px}
  .dstats{grid-template-columns:repeat(2,1fr)}
  h1{font-size:25px}
}

/* ---- phones (iOS + Android) ---- */
@media (max-width:560px){
  body{font-size:14.5px}
  .wrap,.nav-in{padding-left:14px;padding-right:14px}
  .nav-in{height:54px;gap:12px}
  .brand{font-size:15px}
  /* the header's backdrop-filter would make it the containing block for fixed children —
     turn it off on mobile so the bottom tab bar anchors to the viewport, not the header */
  header.nav{backdrop-filter:none}
  /* tabs become a fixed bottom bar — the native mobile pattern */
  .tabs{position:fixed;left:0;right:0;bottom:0;margin:0;gap:0;justify-content:space-around;overflow:visible;
    background:rgba(255,255,255,.98);backdrop-filter:saturate(1.6) blur(8px);
    border-top:1px solid var(--border);padding:9px 2px calc(11px + env(safe-area-inset-bottom));z-index:55}
  .tab{flex:1;justify-content:center;padding:10px 1px;font-size:11.5px;border-radius:9px;gap:3px;text-align:center;white-space:nowrap}
  .aboutgrid{grid-template-columns:1fr;gap:12px}
  .guidegrid{grid-template-columns:1fr}
  .foot-in{flex-direction:column;gap:18px}
  .foot-left{max-width:none}
  .foot-links{flex-direction:row;flex-wrap:wrap;text-align:left;gap:14px;align-items:center}
  .foot-copy{margin-top:0;width:100%}
  main.wrap{padding:26px 14px 90px}
  h1{font-size:23px}
  h2{font-size:18px;margin-top:26px}
  .sub{font-size:14.5px}

  .hero{padding:18px 16px;border-radius:13px}
  .bignum{gap:8px}
  .bignum .from{font-size:16px}
  .bignum .to{font-size:27px}
  .bignum .mult{font-size:12.5px;padding:2px 7px}
  .cards{grid-template-columns:repeat(2,1fr);gap:9px}
  .card{padding:12px}
  .card .v{font-size:19px}

  .panel{padding:14px 13px}
  .panel-head{flex-direction:column;gap:2px}

  /* funnel: keep label + count on one line, bar full width */
  .fname{font-size:13.5px}.fct{font-size:15px}.fnote{font-size:12px}

  /* tables render as cards (see the .tablewrap card rules above) — no min-width */
  table{font-size:13px}
  .sym .isin{font-size:9.5px}

  /* heatmap scrolls; keep cells legible */
  .heat{min-width:540px}
  .heat .yl{font-size:10px}.cell{height:26px;font-size:9.5px}

  /* year strip wraps cleanly */
  .strip{gap:14px 18px;padding:13px 14px}
  .strip .s .v{font-size:17px}

  /* live position cards stack 1-up */
  .poscard{grid-template-columns:1fr}

  /* method figures already scale via viewBox */
  svg.lifecycle{min-width:0}

  /* drawer near-fullscreen */
  .drawer{width:100vw}
  .dstats{grid-template-columns:repeat(2,1fr)}

  .disclaimer{font-size:12px}
  footer{font-size:12px}
}