/* Ollo landing. Tokens: design-v2 §4 (Suno 9844e7bf base). Type: Inter for display/body (light display weight per Mercury
   95fd135a, tight tracking per Warp 40a9c295) + system mono as the machine's voice (Midjourney 1e85631f, Depot 707c2922).
   No serif accent word, no gradient text, no purple (anti-ai-slop.md, board §0c). Motion: transform/opacity/canvas only. */
@font-face{font-family:Inter;src:url(/assets/fonts/inter-var.woff2) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}
:root{
  --bg:#0d0d0f;--bg2:#121214;--card:#17171a;--hair:rgba(255,255,255,.08);--hair2:rgba(255,255,255,.14);
  --tx:#f7f4ef;--mut:#a3a3a3;--dim:#6f6f73;
  --pink:#fd429c;--yel:#f5d907;--face:#ffd56a;--grad:linear-gradient(90deg,#fd429c,#f5d907);
  --up:#02d95c;--dn:#ff5a5f;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,Menlo,"JetBrains Mono",Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1);--gut:40px;--maxw:1320px;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--bg);color:var(--tx);font:400 16px/1.55 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip;min-height:100vh}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img,video{display:block;max-width:100%}
[hidden]{display:none!important}
:focus-visible{outline:2px solid rgba(245,217,7,.75);outline-offset:3px;border-radius:4px}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.02em}
.mut{color:var(--mut)}.small{font-size:12px}
.num{font-variant-numeric:tabular-nums}
.up{color:var(--up)}.dn{color:var(--dn)}
.sp{flex:1}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
i.live{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--up);box-shadow:0 0 0 3px rgba(2,217,92,.15);flex:none}

#field{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none}
.grain{position:fixed;inset:0;z-index:1;opacity:.12;mix-blend-mode:overlay;pointer-events:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
main,footer{position:relative;z-index:2}

/* ---------- type ---------- */
h1,h2{font-weight:400;letter-spacing:-.035em;line-height:1}
h2{font-size:clamp(34px,4.2vw,60px);max-width:20ch}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:11.5px;color:var(--mut);margin-bottom:18px}
.lead{font-size:clamp(16px,1.25vw,19px);font-weight:300;color:var(--mut);max-width:44ch;margin-top:20px;line-height:1.55}

/* ---------- buttons (Krea 3a63b3fa pills; gradient only on primary, Suno 9844e7bf) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 22px;border-radius:999px;font-size:15px;font-weight:500;white-space:nowrap;transition:transform .2s var(--ease),background-color .2s,border-color .2s}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--grad);color:#141016}
.btn-primary:hover{transform:translateY(-1px)}
.btn-ghost{border:1px solid var(--hair2);color:var(--tx);background:rgba(255,255,255,.02)}
.btn-ghost:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.05)}
.btn-sm{height:36px;padding:0 16px;font-size:13.5px}
.btn-lg{height:56px;padding:0 30px;font-size:16px}

/* ---------- nav ---------- */
.nav{position:fixed;z-index:20;top:0;left:0;right:0;height:64px;display:flex;align-items:center;gap:18px;padding:0 var(--gut);transition:background-color .3s,border-color .3s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(13,13,15,.72);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:var(--hair)}
.brand{display:flex;align-items:center;height:40px}
.wm{display:inline-flex;align-items:center;font-weight:500;font-size:22px;letter-spacing:-.02em;color:var(--tx)}
.wm svg{height:22px;width:auto}
.wm .wm-p{fill:var(--face)}
.chain-tag{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px;border:1px solid var(--hair);border-radius:999px;font:12px var(--mono);color:var(--mut)}
.links{display:flex;gap:26px;margin-left:auto;font-size:14px;color:var(--mut)}
.links a:hover{color:var(--tx)}
.nav .btn{margin-left:10px}

/* ---------- 1 · hero ---------- */
.hero{position:relative;min-height:100svh;height:100svh;max-height:1100px;display:flex;flex-direction:column;padding-top:64px;overflow:hidden}
@media (min-height:1100px){.hero{height:1100px}}
.hero-stage{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center}
.face-anchor{width:min(38vh,32vw,440px);aspect-ratio:1/1}
.readouts{position:absolute;inset:0;list-style:none;pointer-events:none}
.ro{position:absolute;display:flex;flex-direction:column;gap:4px;padding-left:12px;border-left:1px solid var(--hair2);opacity:0;animation:fadeUp .9s var(--ease) forwards}
.ro span{color:var(--dim);text-transform:uppercase;letter-spacing:.14em;font-size:10.5px}
.ro b{font-weight:400;color:var(--tx);font-size:13px;font-variant-numeric:tabular-nums}
.ro-1{left:9%;top:24%;animation-delay:1.5s}.ro-2{left:13%;bottom:18%;animation-delay:1.65s}
.ro-3{right:11%;top:28%;animation-delay:1.8s}.ro-4{right:9%;bottom:22%;animation-delay:1.95s}
.hero-copy{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;align-items:end;padding-bottom:92px}
.hero h1{font-size:clamp(48px,5.4vw,96px);font-weight:400;letter-spacing:-.045em;line-height:.94}
.kinetic>span{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.kinetic>span>span{display:inline-block;transform:translateY(105%);animation:rise 1s var(--ease) forwards;animation-delay:calc(var(--i) * 70ms + 900ms)}
@keyframes rise{to{transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hc-right{padding-bottom:8px;opacity:0;animation:fadeUp .9s var(--ease) 1.4s forwards}
.hc-left .eyebrow{opacity:0;animation:fadeUp .8s var(--ease) .7s forwards}
.sub{font-size:17px;font-weight:300;color:var(--mut);max-width:46ch}
.ctas{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.note{display:flex;align-items:center;gap:10px;margin-top:20px;color:var(--mut)}
.note b{font-weight:400;color:var(--tx)}
/* Ramp 0eba5a60: the brand gradient as one horizon under the product, rises after load */
.horizon{position:absolute;left:50%;bottom:-36vh;width:140vw;height:52vh;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(253,66,156,.32),rgba(253,138,92,.16) 45%,rgba(245,217,7,0) 75%);opacity:0;animation:horizon 1.6s var(--ease) .6s forwards;pointer-events:none;z-index:-1}
@keyframes horizon{to{opacity:1}}
/* Kraken 0bfeff29 ticker strip */
.ticker{position:absolute;left:0;right:0;bottom:0;height:46px;border-top:1px solid var(--hair);overflow:hidden;background:rgba(13,13,15,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ticker-track{display:flex;width:max-content;height:100%;align-items:center;animation:marquee 60s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.tk{display:flex;align-items:center;gap:8px;padding:0 22px;height:100%;border-right:1px solid var(--hair);font:12.5px var(--mono);white-space:nowrap}
.tk b{font-weight:500;color:var(--tx)}
.tk .px{color:var(--mut)}
.slogo{width:20px;height:20px;border-radius:50%;background:#26262a;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;font:600 7px var(--sans);color:var(--mut);flex:none}
.slogo img{width:20px;height:20px;object-fit:cover}

/* ---------- pinned scenes ---------- */
.pin{position:relative}
.pin-in{position:sticky;top:0;height:100svh;overflow:hidden}

/* ---------- 2 · demo (North Kingdom 9896f4f8 mask expand) ---------- */
.demo{height:190vh}
.demo .pin-in{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding-top:64px}
.demo-head{display:flex;justify-content:space-between;align-items:end;gap:32px;transform:translateY(calc((1 - var(--p,0)) * 12px));opacity:calc(.35 + var(--p,0) * .65)}
.demo-head .cap{max-width:42ch;color:var(--mut);text-align:right}
.vframe{position:relative;width:min(calc(100vw - 2 * var(--gut)),calc((100svh - 220px) * 16 / 9),1320px);aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#0a0a0b;border:1px solid var(--hair2);transform:scale(calc(.62 + var(--p,0) * .38));transform-origin:50% 40%;box-shadow:0 40px 120px -40px rgba(253,66,156,.25),0 30px 80px -30px rgba(0,0,0,.8)}
.vframe img,.vframe video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0}
.vframe video{opacity:0;transition:opacity .6s}
.vframe video.ready{opacity:1}
.vbtn{position:absolute;right:18px;bottom:18px;width:44px;height:44px;border-radius:50%;background:rgba(13,13,15,.7);border:1px solid var(--hair2);display:grid;place-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:transform .2s var(--ease)}
.vbtn:hover{transform:scale(1.08)}
.vbtn svg{width:20px;height:20px}
.vchip{position:absolute;left:18px;bottom:18px;height:26px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;background:rgba(13,13,15,.72);border:1px solid var(--hair2);color:var(--mut);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}

/* ---------- 3 · terminal (Warp 40a9c295 pinned tilt) ---------- */
.term{height:420vh}
.term .pin-in{display:grid;grid-template-columns:minmax(300px,.8fr) 1.6fr;gap:56px;align-items:center;padding-top:64px}
.steps{list-style:none;margin-top:36px;border-top:1px solid var(--hair)}
.steps li{display:flex;flex-direction:column;gap:6px;padding:18px 0 18px 0;border-bottom:1px solid var(--hair);color:var(--dim);transition:color .4s}
.steps li b{font-weight:500;font-size:17px;color:inherit;transition:color .4s}
.steps li span{font-size:14.5px;font-weight:300;line-height:1.5;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s var(--ease),opacity .4s}
.steps li.on{color:var(--tx)}
.steps li.on span{max-height:80px;opacity:1;color:var(--mut)}
.tstage{perspective:1600px;display:flex;flex-direction:column;gap:14px}
.tframe{position:relative;border-radius:14px;overflow:hidden;background:#0b0b0c;border:1px solid var(--hair2);transform:rotateX(calc((1 - var(--t,0)) * 18deg)) scale(calc(.88 + var(--t,0) * .12));transform-origin:50% 100%;box-shadow:0 50px 120px -50px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.02)}
.chrome{height:36px;display:flex;align-items:center;gap:7px;padding:0 14px;border-bottom:1px solid var(--hair);color:var(--dim);background:#111113}
.chrome i{width:10px;height:10px;border-radius:50%;background:#2a2a2e}
.chrome span{margin:0 auto;padding-right:40px}
.screens{position:relative;aspect-ratio:16/10}
.scr{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;opacity:0;transition:opacity .6s var(--ease)}
.scr.on{opacity:1}
.tcap{color:var(--dim);text-align:right}

/* ---------- 4 · ask ---------- */
.ask{padding:160px 0 140px}
.ask-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:64px;align-items:start}
.face-sm{width:min(300px,70%);margin-top:56px}
.chat{border:1px solid var(--hair2);border-radius:16px;background:rgba(18,18,20,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow:hidden}
.chat-top{display:flex;align-items:center;gap:10px;height:48px;padding:0 18px;border-bottom:1px solid var(--hair);color:var(--tx)}
.chat-top .blk{color:var(--dim)}.chat-top .blk b{font-weight:400;color:var(--mut)}
.pipbox{width:22px;height:22px;display:inline-block}
.pipbox svg{width:22px;height:22px}
.chat-body{height:430px;padding:24px 22px;display:flex;flex-direction:column;gap:16px;overflow:hidden}
.q{align-self:flex-end;max-width:85%;background:rgba(255,255,255,.07);border-radius:14px 14px 4px 14px;padding:11px 15px;font-size:15px;min-height:44px}
.q:empty{visibility:hidden}
.think{display:flex;align-items:center;gap:10px;color:var(--mut)}
.think b{font-weight:400}
.dots{display:inline-flex;gap:4px}
.dots i{width:5px;height:5px;border-radius:50%;background:var(--face);animation:dot 1s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,100%{opacity:.25}50%{opacity:1}}
.a{font-size:15.5px;font-weight:300;line-height:1.6;color:var(--tx);max-width:60ch}
.a b{font-weight:500}
.chips-data{display:flex;flex-wrap:wrap;gap:8px}
.dc{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--hair2);font:12px var(--mono);color:var(--mut);opacity:0;transform:translateY(4px);transition:opacity .4s,transform .4s var(--ease)}
.dc.in{opacity:1;transform:none}
.dc b{font-weight:500;color:var(--tx)}
.dc img{width:18px;height:18px;border-radius:50%;object-fit:cover;background:#26262a}
.curve{width:64px;height:4px;border-radius:2px;background:rgba(255,255,255,.1);overflow:hidden;display:inline-block}
.curve i{display:block;height:100%;background:var(--grad)}
.chat-qs{display:flex;gap:8px;padding:14px 18px;border-top:1px solid var(--hair);overflow-x:auto;scrollbar-width:none}
.chat-qs::-webkit-scrollbar{display:none}
.cq{flex:none;height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--hair);font-size:13px;color:var(--mut);transition:color .2s,border-color .2s,background-color .2s}
.cq:hover{color:var(--tx);border-color:var(--hair2)}
.cq[aria-selected=true]{background:var(--tx);color:#141016;border-color:var(--tx)}
.chat-note{padding:0 18px 16px;color:var(--tx)}
.chat-note b{font-weight:400}

/* ---------- 5 · live ---------- */
.livesec{padding:120px 0}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.counters{display:grid;grid-template-columns:repeat(4,1fr);margin-top:56px;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.ctr{padding:28px 24px 30px 0;display:flex;flex-direction:column;gap:14px}
.ctr+.ctr{padding-left:24px;border-left:1px solid var(--hair)}
.ctr span{color:var(--mut);text-transform:uppercase;letter-spacing:.12em;font-size:11px}
.ctr b{font-weight:300;font-size:clamp(40px,5vw,76px);letter-spacing:-.04em;line-height:1}
.bars-wrap{margin-top:72px}
.bars-head{display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--mut);text-transform:uppercase;letter-spacing:.12em;font-size:11px}
.link{color:var(--tx);text-transform:none;letter-spacing:.02em;border-bottom:1px solid var(--hair2);padding-bottom:2px}
.link:hover{border-color:var(--tx)}
.bars-anchor{height:220px;margin-top:20px}
.bars-labels{list-style:none;display:grid;grid-template-columns:repeat(10,1fr);border-top:1px solid var(--hair);padding-top:12px}
.bars-labels li{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;min-width:0}
.bars-labels img{width:22px;height:22px;border-radius:50%;object-fit:cover;background:#26262a}
.bars-labels b{font:500 12px var(--mono);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bars-labels span{font:11px var(--mono);color:var(--mut)}
.stocks{margin-top:72px}
.stock-row{display:grid;grid-template-columns:repeat(6,1fr);margin-top:16px;border-top:1px solid var(--hair)}
.st{display:flex;align-items:center;gap:10px;padding:16px 12px 16px 0;border-bottom:1px solid var(--hair);min-width:0}
.st .slogo{width:28px;height:28px}.st .slogo img{width:28px;height:28px}
.st div{display:flex;flex-direction:column;min-width:0}
.st b{font:500 13px var(--mono)}
.st span{font:12px var(--mono);color:var(--mut);white-space:nowrap}
.live-err{margin-top:24px}

/* ---------- 6 · how ---------- */
.how{padding:120px 0}
.how-row{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:56px;border-top:1px solid var(--hair2)}
.how-row li{padding-top:26px;display:flex;flex-direction:column;gap:12px}
.how-row .n{color:var(--face);font-size:12px}
.how-row b{font-weight:500;font-size:22px;letter-spacing:-.02em}
.how-row p{font-weight:300;color:var(--mut);max-width:34ch}

/* ---------- 7 · token (Reown 15d0d886, Sandclock 100771a2, Hyperliquid 54511793) ---------- */
.token{padding:120px 0}
.token-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.ring-box{position:relative;aspect-ratio:1/1;max-width:520px;width:100%;justify-self:center}
.ring-anchor{position:absolute;inset:0}
.ring-mid{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.ring-mid b{font-weight:400;font-size:clamp(30px,3.2vw,44px);letter-spacing:-.03em}
.alloc{list-style:none;margin-top:36px;border-top:1px solid var(--hair)}
.alloc li{display:grid;grid-template-columns:92px 1fr;gap:4px 18px;padding:16px 0;border-bottom:1px solid var(--hair);align-items:baseline}
.alloc .pct{grid-row:span 2;font-weight:300;font-size:40px;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.alloc .lb{display:flex;align-items:center;gap:10px;font-weight:500}
.alloc .lb i{width:8px;height:8px;border-radius:50%}
.alloc p{font-weight:300;color:var(--mut);font-size:14.5px}
.ca{display:flex;align-items:center;gap:12px;margin:26px 0 14px;flex-wrap:wrap}
.ca code{font:13px var(--mono);color:var(--tx);padding:7px 12px;border:1px solid var(--hair);border-radius:8px;word-break:break-all}
.copy{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--hair2);font:12px var(--mono)}
.token-copy .small{margin-top:8px;max-width:56ch}

/* ---------- 8 · cta ---------- */
.cta{padding:80px 0 140px}
.cta-in{display:flex;flex-direction:column;align-items:center;text-align:center}
.face-cta{width:min(280px,60vw);margin-bottom:40px}
.cta h2{max-width:none;font-size:clamp(40px,5.4vw,84px)}
.cta .lead{margin:20px auto 34px}
.cta .small{margin-top:16px}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--hair);padding:56px 0 64px;background:rgba(13,13,15,.9)}
.foot-top{display:flex;align-items:flex-start;gap:32px;flex-wrap:wrap}
.foot-top>div{display:flex;flex-direction:column;gap:10px}
.foot-links{display:flex;gap:22px;margin-left:auto;font-size:13px;color:var(--mut)}
.foot-links a:hover{color:var(--tx)}
.foot-legal{margin-top:40px;display:flex;flex-direction:column;gap:8px;color:var(--dim);max-width:92ch;line-height:1.6}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .links{display:none}
  .nav .btn{margin-left:auto}
  .term .pin-in{grid-template-columns:1fr;gap:28px;align-content:center}
  .term-copy h2{font-size:clamp(28px,4.4vw,44px)}
  .steps{margin-top:18px}
  .steps li{display:none;border:0;padding:0}
  .steps li.on{display:flex}
  .steps{border:0}
}
@media (max-width:900px){
  :root{--gut:20px}
  .hero-copy{grid-template-columns:1fr;gap:22px;padding-bottom:70px}
  .ask-grid,.token-grid{grid-template-columns:1fr;gap:40px}
  .face-sm{display:none}
  .counters{grid-template-columns:1fr 1fr}
  .ctr:nth-child(3){padding-left:0;border-left:0}
  .ctr:nth-child(n+3){border-top:1px solid var(--hair)}
  .stock-row{grid-template-columns:repeat(3,1fr)}
  .how-row{grid-template-columns:1fr;gap:0}
  .how-row li{padding:22px 0;border-bottom:1px solid var(--hair)}
  .demo-head{flex-direction:column;align-items:flex-start;gap:10px}
  .demo-head .cap{text-align:left}
}
@media (max-width:640px){
  :root{--gut:16px}
  .nav{gap:10px;height:56px}
  .chain-tag{display:none}
  .nav .chain-tag{display:none}
  .nav .btn{margin-left:auto}
  .hero{padding-top:56px;max-height:none}
  .face-anchor{width:min(64vw,36vh)}
  .ro-2,.ro-4{display:none}
  .ro-1{left:16px;top:10%}.ro-3{right:16px;top:10%;left:auto;text-align:right}
  .hero h1{font-size:clamp(40px,11.5vw,56px)}
  .sub{font-size:15.5px}
  .ctas .btn{flex:1}
  .hero-copy{padding-bottom:62px}
  .demo{height:160vh}
  .vframe{aspect-ratio:1/1;width:calc(100vw - 32px);border-radius:14px;transform:scale(calc(.78 + var(--p,0) * .22))}
  .term{height:380vh}
  .tframe{border-radius:10px}
  .chrome{height:28px}
  .ask{padding:100px 0 80px}
  .chat-body{height:400px;padding:18px 16px}
  .livesec,.how,.token{padding:84px 0}
  .bars-anchor{height:160px}
  .bars-labels{grid-template-columns:repeat(5,1fr);row-gap:14px}
  .bars-labels li:nth-child(n+6){display:none}
  .stock-row{grid-template-columns:repeat(2,1fr)}
  .alloc li{grid-template-columns:72px 1fr}
  .alloc .pct{font-size:32px}
  .foot-links{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}
  .ticker-track{animation:none}
  .kinetic>span>span{transform:none}
}
.ctr b[data-count=trades1h]{font-size:clamp(30px,3.3vw,52px);white-space:nowrap;padding-top:.25em}
/* terminal steps: one full capture, a warm frame moves to the panel each step talks about (no cropped words) */
.hl{position:absolute;border:1.5px solid rgba(245,217,7,.85);border-radius:10px;box-shadow:0 0 0 9999px rgba(8,8,10,.42),0 0 24px rgba(245,217,7,.25);opacity:0;transition:opacity .5s var(--ease);pointer-events:none}
.hl.on{opacity:1}
.hl:nth-of-type(1){left:38.3%;top:.6%;width:37.1%;height:5.4%}
.hl:nth-of-type(2){left:.6%;top:7.6%;width:23%;height:91.4%}
.hl:nth-of-type(3){left:23.9%;top:8.6%;width:46.8%;height:90.4%}
.hl:nth-of-type(4){left:71.1%;top:7.6%;width:28.6%;height:91.4%}
/* steps: fixed geometry (no height animation → no layout shift); only colour/opacity change */
.steps li span{max-height:none!important;opacity:.45;transition:opacity .4s,color .4s}
.steps li.on span{opacity:1}
@media (max-width:1100px){
  .steps{display:grid}
  .steps li,.steps li.on{display:flex;grid-area:1/1;opacity:0;transition:opacity .4s}
  .steps li.on{opacity:1}
  .steps li span{opacity:1}
}
/* reserve space for data filled in after load */
.stock-row{min-height:122px}
.bars-labels{min-height:62px}
.chat-qs{min-height:61px}
.ctr b[data-count=trades1h] i{font-style:normal}
@media (max-width:900px){.stock-row{min-height:244px}}
@media (max-width:640px){
  .stock-row{min-height:366px}
  .ctr b[data-count=trades1h]{font-size:clamp(30px,9vw,40px);white-space:normal;padding-top:0}
  .ctr b[data-count=trades1h] i{display:block}
}
@media (max-width:640px){
  .demo{height:auto}
  .demo .pin-in{position:static;height:auto;padding:96px 0 40px;gap:20px}
  .vframe{transform:none}
  .v-standin{transform:scale(2.1);transform-origin:46% 0}
}
.alloc-title{margin-top:34px;color:var(--mut);text-transform:uppercase;letter-spacing:.12em;font-size:11px}
.alloc-title+.alloc{margin-top:14px}
.alloc li.nopct{grid-template-columns:1fr}
.alloc li.nopct .lb{font-size:17px}
.dc .slogo{width:18px;height:18px}.dc .slogo img{width:18px;height:18px}
/* re-audit Н2: the buys/sells pair must fit its cell at every width (columns never grow) */
.counters{grid-template-columns:repeat(4,minmax(0,1fr))}
.ctr b[data-count=trades1h]{font-size:clamp(24px,2.1vw,32px);padding-top:.5em}
@media (max-width:900px){.counters{grid-template-columns:repeat(2,minmax(0,1fr))}.ctr b[data-count=trades1h]{font-size:34px}}
@media (max-width:640px){.ctr b[data-count=trades1h]{font-size:clamp(28px,8.5vw,36px);padding-top:0}}
/* ---------- Plans (Jace AI 070d8cf6 dark two-card with featured Pro · Shuttle 40379d1d Free vs Pro ·
   Pop 69813a38 larger highlighted Pro card · Fey 08ae8676 luxury terminal tone). The single pink→yellow accent
   = the Pro card's edge; particles trace that edge (scene "frame"). Free is a plain hairline panel. ---------- */
.plans{padding:120px 0}
.plans .sec-head{align-items:end}
.plans .sec-head .lead{margin-top:0}
.plan-grid{display:grid;grid-template-columns:1fr 1.18fr;gap:24px;margin-top:56px;align-items:stretch}
.plan{position:relative;border-radius:18px;padding:34px 34px 30px;display:flex;flex-direction:column}
.plan-free{border:1px solid var(--hair2);background:rgba(18,18,20,.55)}
.plan-pro{background:linear-gradient(#141416,#141416) padding-box,var(--grad) border-box;border:1.5px solid transparent;box-shadow:0 40px 120px -50px rgba(253,66,156,.45)}
.plan-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.plan-name{text-transform:uppercase;letter-spacing:.16em;color:var(--tx);font-size:12px}
.plan-tag{height:26px;display:inline-flex;align-items:center;padding:0 11px;border-radius:999px;border:1px solid rgba(245,217,7,.4);color:var(--face)}
.plan-price{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:26px}
.plan-price b{font-weight:300;font-size:clamp(56px,6vw,88px);letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.plan-list{list-style:none;margin-top:28px;border-top:1px solid var(--hair);flex:1}
.plan-list li{padding:14px 0 14px 26px;border-bottom:1px solid var(--hair);font-weight:300;color:var(--mut);position:relative}
.plan-list li::before{content:"";position:absolute;left:2px;top:22px;width:10px;height:5px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg)}
.plan-pro .plan-list li{color:var(--tx)}
.plan-pro .plan-list li::before{color:var(--face)}
.plan-act{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:28px;min-height:48px}
.plan-soon{height:48px;display:inline-flex;align-items:center;gap:10px;padding:0 18px;border-radius:999px;background:rgba(245,217,7,.08);color:var(--face)}
.plan-soon i{width:6px;height:6px;border-radius:50%;background:var(--face);box-shadow:0 0 0 3px rgba(245,217,7,.15)}
.plan-link{color:var(--mut);border-bottom:1px solid var(--hair2);padding-bottom:2px}
.plan-link:hover{color:var(--tx)}
/* $OLLO leads with utility; same gradient edge as the Pro card ties the two sections */
.utility{margin-top:30px;padding:22px 24px;border-radius:14px;background:linear-gradient(#141416,#141416) padding-box,var(--grad) border-box;border:1.5px solid transparent}
.u-k{color:var(--face);text-transform:uppercase;letter-spacing:.16em;font-size:11px}
.u-h{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.03em;margin-top:8px;line-height:1.1}
.u-t{color:var(--mut);font-weight:300;margin-top:8px}
@media (max-width:1100px){.links{display:none}}
@media (max-width:900px){
  .plan-grid{grid-template-columns:1fr}
  .plan-pro{order:-1}
  .plans .sec-head{flex-direction:column;align-items:flex-start;gap:16px}
}
@media (max-width:640px){
  .plans{padding:84px 0}
  .plan{padding:26px 22px 24px}
}
.plans .sec-head h2{max-width:none}
.plan-tag-free{border-color:var(--hair2);color:var(--mut)}
.btn-soon{border:1px solid rgba(245,217,7,.35);background:rgba(245,217,7,.07);color:var(--face);cursor:not-allowed}
.plans-how{margin-top:24px;text-align:center}
.plans-how a{border-bottom:1px solid var(--hair2);padding-bottom:2px}
.plans-how a:hover{color:var(--tx)}
.utility .u-h{margin-top:0}