/* ==========================================================================
   Passive Alpha — dark quant design system (v3)
   Citadel mood + Two Sigma restraint. Vanilla CSS, no framework.
   ========================================================================== */
:root{
  --bg:#0a0e16; --bg-2:#0c1119; --panel:#0f1522; --panel-2:#121a2a;
  --line:#1c2433; --line-2:#273349;
  --text:#e7ecf3; --muted:#8b97a8; --muted-2:#5d6779;
  --accent:#3b82f6; --accent-2:#38bdf8;
  --green:#22c55e; --red:#ef4444; --amber:#f5a623;
  --maxw:1180px; --r:10px;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono","JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%;}
hr{border:0; border-top:1px solid var(--line); margin:0;}
h1,h2,h3,h4{color:var(--text); font-weight:700; letter-spacing:-0.02em; line-height:1.12; margin:0 0 0.5rem;}

.wrap{max-width:var(--maxw); margin:0 auto; padding:0 1.5rem;}
.mono{font-family:var(--mono);}
.tnum{font-variant-numeric:tabular-nums;}
.muted{color:var(--muted);}
.green{color:var(--green);} .amber{color:var(--amber);}
.center{text-align:center;}

/* ---- type helpers ------------------------------------------------------- */
.eyebrow{
  display:inline-block; font-family:var(--mono); font-size:0.72rem;
  letter-spacing:0.22em; text-transform:uppercase; color:var(--accent-2); margin:0 0 1rem;
}
.tagline-hero{
  font-family:var(--mono); font-size:0.8rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--accent-2); margin-bottom:0.9rem;
}
.kicker{
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--accent-2);
}
.h-sec{font-size:clamp(1.6rem,3.2vw,2.3rem); margin:0.5rem 0 0;}
.lead{font-size:1.18rem; color:var(--muted); max-width:62ch;}

/* ---- nav ---------------------------------------------------------------- */
.nav{position:sticky; top:0; z-index:50; background:rgba(10,14,22,0.82);
     backdrop-filter:blur(10px); border-bottom:1px solid var(--line);}
.nav .wrap{display:flex; align-items:center; gap:1rem; height:64px;}
.brand{display:flex; align-items:center; gap:0.6rem; color:var(--text); margin-right:auto;}
.brand .glyph{
  width:28px; height:28px; flex:none; border-radius:7px;
  background:linear-gradient(135deg,var(--accent),#1e40af); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-weight:600; font-size:0.82rem;
}
.brand .wordmark{font-weight:700; letter-spacing:-0.01em; font-size:1.02rem;}
.navlinks{display:flex; gap:1.5rem; align-items:center;}
.navlinks a{color:var(--muted); font-size:0.9rem; font-weight:500; transition:color .15s;}
.navlinks a:hover{color:var(--text);}
.navlinks a.active{color:var(--text); border-bottom:2px solid var(--accent); padding-bottom:2px;}
.navtoggle{display:none; background:none; border:0; color:var(--text); font-size:1.4rem; cursor:pointer; line-height:1;}

.btn{display:inline-flex; align-items:center; gap:0.5rem; font-family:var(--mono);
  font-size:0.85rem; letter-spacing:0.04em; padding:0.7rem 1.3rem; border-radius:7px;
  cursor:pointer; border:1px solid transparent; transition:all .15s ease;}
.btn-amber,.btn-primary{background:var(--accent); color:#061020; font-weight:600;}
.btn-amber:hover,.btn-primary:hover{background:var(--accent-2); color:#061020;}
.btn-ghost{border-color:var(--line-2); color:var(--text);}
.btn-ghost:hover{border-color:var(--accent); background:rgba(59,130,246,0.08);}

/* ---- hero --------------------------------------------------------------- */
.hero{position:relative; padding:7rem 0 5.5rem; overflow:hidden; border-bottom:1px solid var(--line);}
#particle-canvas{position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:0.55;}
.hero .wrap{position:relative; z-index:1;}
.hero h1{font-size:clamp(2.2rem,5vw,3.6rem); max-width:18ch; margin:0 0 0.4rem;}
.hero .sub{font-size:1.2rem; color:#c3cddc; max-width:62ch; margin:1.25rem 0 0;}
.cta-row{display:flex; gap:0.9rem; flex-wrap:wrap; margin-top:2rem;}

/* ---- ticker tape -------------------------------------------------------- */
.ticker-tape{overflow:hidden; border-bottom:1px solid var(--line); background:var(--bg-2); white-space:nowrap;}
.tt-track{display:inline-block; white-space:nowrap; padding:0.55rem 0; animation:ttscroll 48s linear infinite; will-change:transform;}
@keyframes ttscroll{from{transform:translateX(0);} to{transform:translateX(-50%);}}
.tt-item{display:inline-block; margin-right:2.5rem; font-family:var(--mono); font-size:0.8rem; color:var(--muted);}
.tt-sym{color:var(--accent-2); font-weight:600;}
.tt-up{color:var(--green);}
.tt-down{color:var(--red);}
.tt-px{color:var(--muted-2);}
@media (prefers-reduced-motion:reduce){.tt-track{animation:none;}}

/* ---- bands -------------------------------------------------------------- */
.band{padding:5rem 0; border-bottom:1px solid var(--line);}
.band.tight{padding:3.25rem 0;}
.band.panel{background:var(--bg-2);}

/* ---- stats -------------------------------------------------------------- */
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line);
  border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.stats .cell{background:var(--panel); padding:1.5rem 1.4rem;}
.stats .n{font-family:var(--mono); font-size:1.7rem; font-weight:600; color:var(--text); font-variant-numeric:tabular-nums; letter-spacing:-0.01em;}
.stats .n .small{font-size:1rem; color:var(--muted);}
.stats .l{font-family:var(--mono); font-size:0.74rem; letter-spacing:0.06em; color:var(--muted); margin-top:0.35rem;}
.stats .foot{font-size:0.74rem; color:var(--muted-2); margin-top:0.3rem;}

/* ---- pillars / panels --------------------------------------------------- */
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:2.4rem; align-items:start;}
.panel-card{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.6rem;
  transition:border-color .15s, transform .15s;}
.panel-card:hover{border-color:var(--line-2); transform:translateY(-2px);}
.panel-card .pc-no{font-family:var(--mono); font-size:0.72rem; color:var(--accent-2); letter-spacing:0.1em;}
.panel-card h3{margin:0.6rem 0 0.5rem; font-size:1.2rem; color:var(--text);}
.panel-card p{margin:0; color:var(--muted); font-size:0.95rem;}

/* ---- the 500 reframe ---------------------------------------------------- */
.reframe{display:grid; grid-template-columns:auto 1fr; gap:2.4rem; align-items:center;}
.reframe .big{font-family:var(--mono); font-size:clamp(5rem,14vw,9rem); line-height:0.9; color:var(--text); letter-spacing:-0.04em; font-weight:600;}
.reframe .big span{color:var(--accent-2);}

/* ---- recommendation block (locked) — terminal style --------------------- */
.rec-block{background:#060a12; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; max-width:560px;}
.rec-block .bar{display:flex; align-items:center; gap:0.5rem; padding:0.6rem 1rem; border-bottom:1px solid var(--line);
  font-family:var(--mono); font-size:0.72rem; letter-spacing:0.08em; color:var(--muted); background:var(--bg-2);}
.rec-block .bar .dot{width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); animation:pulse 1.6s infinite;}
@keyframes pulse{0%,100%{opacity:1;} 50%{opacity:0.35;}}
.rec-block .body{padding:1.5rem; font-family:var(--mono); font-size:0.92rem;}
.rec-block .hl{color:var(--accent-2); font-size:0.72rem; letter-spacing:0.16em; text-transform:uppercase;}
.rec-block .head{color:var(--text); font-size:1.45rem; font-weight:600; margin:0.5rem 0 1.1rem;}
.rec-block table{width:100%; border-collapse:collapse;}
.rec-block td{padding:0.42rem 0; border-top:1px solid var(--line); vertical-align:baseline;}
.rec-block td.k{color:var(--muted); width:46%;}
.rec-block td.v{color:var(--text); text-align:right;}
.hinge{font-size:1.1rem; color:#c3cddc; max-width:64ch; margin:0 0 1.6rem; font-style:italic;}

/* ---- tables ------------------------------------------------------------- */
.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r);}
table.data{width:100%; border-collapse:collapse; font-size:0.88rem;}
table.data th{text-align:left; font-family:var(--mono); font-size:0.68rem; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--muted); padding:0.8rem 1rem; background:var(--bg-2);
  border-bottom:1px solid var(--line); white-space:nowrap;}
table.data td{padding:0.7rem 1rem; border-bottom:1px solid var(--line); color:#cdd6e4;}
table.data tr:last-child td{border-bottom:0;}
table.data tbody tr:hover td{background:rgba(59,130,246,0.04);}
table.data td.num, table.data th.num{text-align:right; font-family:var(--mono); font-variant-numeric:tabular-nums;}
table.data tfoot td{background:var(--bg-2); color:var(--text); font-weight:600; border-top:1px solid var(--line-2); font-family:var(--mono);}
.caption{font-size:0.82rem; color:var(--muted); margin-top:0.8rem; line-height:1.7;}

/* ---- research list ------------------------------------------------------ */
.note-list{border-top:1px solid var(--line);}
.note-item{display:block; padding:1.6rem 0; border-bottom:1px solid var(--line); transition:padding-left .15s;}
.note-item:hover{padding-left:0.6rem;}
.note-item .meta{font-family:var(--mono); font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted);}
.note-item h3{margin:0.5rem 0 0.4rem; font-size:1.3rem; color:var(--text);}
.note-item p{margin:0; color:var(--muted); max-width:70ch;}
.note-item .arrow{color:var(--accent-2);}

/* ---- article (note pages) ----------------------------------------------- */
.article{max-width:760px;}
.article p{margin:0 0 1.2rem; font-size:1.05rem; line-height:1.75; color:#cdd6e4;}
.article h2{font-size:1.4rem; margin:2.5rem 0 0.9rem;}
.article .figure{border:1px solid var(--line); border-radius:var(--r); background:var(--panel); padding:1.2rem; margin:1.8rem 0;}
.article .byline{font-family:var(--mono); font-size:0.78rem; letter-spacing:0.06em; color:var(--muted);}
.artmeta{display:flex; gap:1rem; flex-wrap:wrap; align-items:center; font-family:var(--mono); font-size:0.76rem; color:var(--muted); border-bottom:1px solid var(--line); padding-bottom:1.2rem; margin:0 0 1.9rem;}
.artmeta .sep{color:var(--muted-2);}
.artmeta .conv{margin-left:auto; color:var(--accent-2); display:inline-flex; align-items:center; gap:0.45rem;}
.artmeta .dots{letter-spacing:2px;}
.lead-quote{font-size:1.28rem; line-height:1.5; color:#dbe3ee; border-left:3px solid var(--accent); padding-left:1.1rem; margin:0 0 1.9rem; font-style:normal;}
.article .cat{color:var(--accent-2);}

/* ---- footer ------------------------------------------------------------- */
footer.site{background:var(--bg-2); border-top:1px solid var(--line); padding:3rem 0 2.5rem;}
footer.site .cols{display:grid; grid-template-columns:2fr 1fr 1fr; gap:2rem;}
footer.site h4{font-family:var(--mono); font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin:0 0 0.9rem;}
footer.site a{display:block; color:var(--muted); font-size:0.88rem; padding:0.2rem 0;}
footer.site a:hover{color:var(--text);}
footer.site .legal{display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid var(--line);
  font-family:var(--mono); font-size:0.74rem; color:var(--muted-2);}

/* ---- responsive --------------------------------------------------------- */
@media (max-width:860px){
  .navtoggle{display:block;}
  .navlinks{position:absolute; top:64px; left:0; right:0; flex-direction:column; align-items:flex-start;
    gap:0; background:var(--bg-2); border-bottom:1px solid var(--line); display:none;}
  .navlinks.open{display:flex;}
  .navlinks a{width:100%; padding:0.85rem 1.5rem; border-bottom:1px solid var(--line);}
  .navlinks a.active{border-bottom:1px solid var(--line);}
  .navlinks .btn{margin:0.6rem 1.5rem;}
  .stats{grid-template-columns:repeat(2,1fr);}
  .grid-3,.grid-2{grid-template-columns:1fr;}
  .reframe{grid-template-columns:1fr; gap:1rem;}
  footer.site .cols{grid-template-columns:1fr 1fr;}
}
@media (max-width:480px){
  .stats{grid-template-columns:1fr;}
  footer.site .cols{grid-template-columns:1fr;}
}

/* ==========================================================================
   Components for Performance + Allocation tool + chatbot
   ========================================================================== */
.pos{color:var(--green);} .neg{color:var(--red);}
.tick{font-family:var(--mono); color:var(--accent-2); font-weight:600;}
.footnote{font-size:0.78rem; color:var(--muted-2); margin-top:1rem; font-family:var(--mono);}

/* ---- card --------------------------------------------------------------- */
.card{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.6rem;}
.card h3{color:var(--text);}
.card .kicker{margin-bottom:0.6rem;}

/* ---- metric grid -------------------------------------------------------- */
.metrics{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.metrics .m{background:var(--panel); padding:1.25rem;}
.metrics .m .v{font-family:var(--mono); font-size:1.45rem; font-weight:600; font-variant-numeric:tabular-nums;}
.metrics .m .l{font-size:0.74rem; color:var(--muted); margin-top:0.25rem;}
@media (max-width:860px){.metrics{grid-template-columns:repeat(2,1fr);}}

/* ---- equity chart ------------------------------------------------------- */
.chart-card{background:var(--panel); border:1px solid var(--line); border-radius:var(--r); padding:1.5rem;}
.chart-legend{display:flex; gap:1.25rem; font-family:var(--mono); font-size:0.78rem; color:var(--muted); margin-top:0.75rem; flex-wrap:wrap;}
.chart-legend .swatch{display:inline-block; width:18px; height:3px; vertical-align:middle; margin-right:6px;}

/* ---- terminal / blotter ------------------------------------------------- */
.terminal{background:#060a12; border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.terminal-bar{display:flex; align-items:center; gap:0.5rem; padding:0.6rem 1rem; background:var(--bg-2); border-bottom:1px solid var(--line); font-family:var(--mono); font-size:0.72rem; color:var(--muted); letter-spacing:0.08em;}
.terminal-bar .dot{width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green); animation:pulse 1.6s infinite;}
.blotter{height:360px; overflow:hidden; font-family:var(--mono); font-size:0.8rem; padding:0.5rem 0;}
.blotter .row{display:grid; grid-template-columns:92px 92px 56px 1fr 90px 96px; gap:0.5rem; padding:0.22rem 1rem; white-space:nowrap; color:#aab6c8;}
.blotter .row .b{color:var(--green);} .blotter .row .s{color:var(--red);} .blotter .row .r{color:var(--amber);}
.blotter .row .tk{color:var(--accent-2); font-weight:600;}
.blotter .row.new{animation:flash 0.6s ease;}
@keyframes flash{from{background:rgba(59,130,246,0.14);} to{background:transparent;}}
@media (max-width:560px){
  .blotter .row{grid-template-columns:64px 1fr 60px 72px; font-size:0.72rem; gap:0.4rem; padding:0.22rem 0.7rem;}
  .blotter .row span:nth-child(1){display:none;}
  .blotter .row span:nth-child(2){display:none;}
}

/* ---- conviction (allocation result) ------------------------------------- */
.conviction{background:linear-gradient(180deg,var(--panel-2),var(--panel)); border:1px solid var(--line-2); border-radius:var(--r); padding:1.5rem; margin:0;}
.conviction .kicker{color:var(--accent-2);}
.conviction .call{font-family:var(--mono); font-size:1.5rem; font-weight:600; margin-top:0.4rem; color:var(--text);}

/* ---- forms -------------------------------------------------------------- */
label{display:block; font-size:0.8rem; color:var(--muted); margin:1rem 0 0.35rem; letter-spacing:0.02em;}
input,textarea,select{width:100%; background:var(--bg-2); border:1px solid var(--line-2); border-radius:7px; color:var(--text); padding:0.7rem 0.85rem; font-family:var(--sans); font-size:0.95rem;}
input:focus,textarea:focus,select:focus{outline:none; border-color:var(--accent);}
.calc-working{color:var(--accent-2); font-size:0.9rem; padding:1rem 0; font-family:var(--mono);}

/* ---- chatbot ------------------------------------------------------------ */
.chat-bubble{position:fixed; right:18px; bottom:18px; z-index:150; display:flex; align-items:center; gap:0.5rem; font-family:var(--mono); font-size:0.8rem; font-weight:600; background:var(--accent); color:#061020; border:0; padding:0.7rem 1rem; border-radius:30px; cursor:pointer; box-shadow:0 6px 24px rgba(0,0,0,0.4);}
.chat-bubble:hover{background:var(--accent-2);}
.chat-panel{position:fixed; right:18px; bottom:74px; z-index:150; width:330px; max-width:calc(100vw - 36px); background:var(--panel); border:1px solid var(--line-2); border-radius:12px; overflow:hidden; display:none; flex-direction:column; box-shadow:0 12px 40px rgba(0,0,0,0.5);}
.chat-panel.open{display:flex;}
.chat-head{display:flex; align-items:center; gap:0.5rem; padding:0.7rem 1rem; background:var(--bg-2); border-bottom:1px solid var(--line); font-family:var(--mono); font-size:0.74rem; color:var(--muted);}
.chat-head .dot{width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 8px var(--green);}
.chat-log{padding:1rem; height:300px; overflow-y:auto; display:flex; flex-direction:column; gap:0.6rem;}
.chat-msg{font-size:0.86rem; padding:0.55rem 0.8rem; border-radius:10px; max-width:85%; line-height:1.45;}
.chat-msg.bot{background:var(--panel-2); color:#cdd6e4; align-self:flex-start; border-bottom-left-radius:3px;}
.chat-msg.user{background:var(--accent); color:#061020; align-self:flex-end; border-bottom-right-radius:3px;}
.chat-msg.typing{display:flex; gap:4px; align-items:center;}
.chat-msg.typing span{width:6px; height:6px; border-radius:50%; background:var(--muted); animation:blink 1.2s infinite;}
.chat-msg.typing span:nth-child(2){animation-delay:0.2s;}
.chat-msg.typing span:nth-child(3){animation-delay:0.4s;}
@keyframes blink{0%,100%{opacity:0.3;} 50%{opacity:1;}}
.chat-input{display:flex; gap:0.5rem; padding:0.7rem; border-top:1px solid var(--line);}
.chat-input input{flex:1; padding:0.5rem 0.7rem;}
.chat-input .btn{padding:0.5rem 0.9rem;}
/* suggested-prompt chips */
.chat-chips{display:flex; flex-wrap:wrap; gap:0.4rem; align-self:flex-start; max-width:95%;}
.chat-chips .chip{font-family:var(--mono); font-size:0.72rem; color:var(--accent); background:transparent; border:1px solid var(--line-2); border-radius:14px; padding:0.32rem 0.6rem; cursor:pointer; transition:background .15s, border-color .15s;}
.chat-chips .chip:hover{background:var(--panel-2); border-color:var(--accent);}
/* the "grind" theater — a cold work line shown while the model thinks */
.chat-msg.bot.working{color:var(--muted); font-family:var(--mono); font-size:0.78rem;}
.chat-step::after{content:'▍'; margin-left:2px; animation:blink 1.1s steps(1) infinite;}
.chat-response{display:block;}
.chat-continuing{display:flex; align-items:center; gap:0.4rem; margin-top:0.45rem; padding-top:0.4rem; border-top:1px solid var(--line); color:var(--muted); font-family:var(--mono); font-size:0.68rem; letter-spacing:0.02em;}
.chat-continuing-pulse{width:6px; height:6px; flex:none; border-radius:50%; background:var(--accent-2); box-shadow:0 0 0 0 rgba(56,189,248,0.38); animation:chat-pulse 1.5s ease-out infinite;}
@keyframes chat-pulse{0%{box-shadow:0 0 0 0 rgba(56,189,248,0.38);} 70%,100%{box-shadow:0 0 0 5px rgba(56,189,248,0);}}
@media (prefers-reduced-motion:reduce){.chat-continuing-pulse{animation:none;}}
/* "second opinion" — same verdict, escalating title */
.chat-redo{align-self:flex-start; font-family:var(--mono); font-size:0.72rem; color:var(--muted); background:transparent; border:1px dashed var(--line-2); border-radius:8px; padding:0.32rem 0.6rem; margin-top:-0.2rem; cursor:pointer; transition:color .15s, border-color .15s;}
.chat-redo:hover{color:var(--accent); border-color:var(--accent);}