/* =========================================================
   LIQUIDATION ATLAS — "Observatory" design system
   ========================================================= */
:root{
  --bg:#04070b; --bg2:#070c13; --bg3:#0a121c; --panel:rgba(14,23,35,.62); --panel2:rgba(20,32,48,.72);
  --line:rgba(148,163,184,.13); --line2:rgba(148,163,184,.24);
  --ink:#eef3f8; --muted:#8c9cb1; --dim:#5a6b80;
  --long:#FF667A; --short:#36D6B0; --accent:#57D9FF; --alert:#FF9F43; --danger:#FF4D4F;
  --sans:Geist,"Geist Fallback",ui-sans-serif,system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --serif:"Instrument Serif","Songti SC","Noto Serif SC","Times New Roman",serif;
  --ease:cubic-bezier(.2,.8,.2,1); --ease2:cubic-bezier(.7,0,.2,1);
  --gut:clamp(16px,4vw,56px); --top:64px; --r:22px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto;background:var(--bg)}
html.lock,html.lock body{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100vh}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
h1,h2,h3,p,ol,ul,dl,dd{margin:0}
ol,ul{list-style:none;padding:0}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
::selection{background:rgba(87,217,255,.3)}
.wrap{width:100%;max-width:1320px;margin:0 auto;padding-inline:var(--gut)}
.serif{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)} .small{font-size:12.5px} .tl{color:var(--long)} .ts{color:var(--short)} .ta{color:var(--alert)}
.money{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.ico{flex:none;display:inline-block;vertical-align:middle} .ico.flip{transform:scaleX(-1)} [dir=rtl] .ico.flip{transform:none}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--accent);color:#03121a;padding:8px 14px;border-radius:99px;font-weight:600}
.skip:focus{top:12px}
.empty{color:var(--muted);padding:22px 0}
.empty.big{display:grid;place-items:center;min-height:260px;text-align:center;font-size:17px}
.err,.warn{margin:14px 0;padding:12px 16px;border-radius:14px;font-size:14px}
.err{background:rgba(255,77,79,.1);border:1px solid rgba(255,77,79,.35);color:#ffb3b4}
.warn{background:rgba(255,159,67,.08);border:1px solid rgba(255,159,67,.3);color:#ffd2a6}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.display{font-size:clamp(44px,8vw,112px);line-height:.92;letter-spacing:-.045em;font-weight:600}

/* grain + vignette + progress */
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-4%)}60%{transform:translate(-4%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:120;background:linear-gradient(90deg,var(--accent),var(--short),var(--long));transform-origin:0 50%;transform:scaleX(0);pointer-events:none}
.cursor{position:fixed;left:-200px;top:-200px;width:400px;height:400px;margin:0;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(87,217,255,.07),transparent 60%)}

/* chips */
.chip{display:inline-flex;align-items:center;gap:7px;min-height:26px;padding:0 11px;border-radius:99px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line2);background:rgba(8,13,20,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);white-space:nowrap}
.chip.fresh,.chip.band{color:var(--c);border-color:color-mix(in srgb,var(--c) 45%,transparent);background:color-mix(in srgb,var(--c) 9%,rgba(8,13,20,.6))}
.chip.band b{font-family:var(--mono);font-size:12px}
.chip.demo{background:var(--alert);color:#1a0d00;border-color:transparent;box-shadow:0 0 22px -4px rgba(255,159,67,.8)}
.chip.ghost{color:var(--muted);text-transform:none;letter-spacing:0;font-weight:500}
.live-dot,.dot{width:7px;height:7px;border-radius:50%;background:var(--c,currentColor);display:inline-block;flex:none;color:var(--c,currentColor)}
.live-dot{box-shadow:0 0 0 0 currentColor;animation:ping 1.8s var(--ease) infinite}
.chip.fresh .live-dot,.chip.fresh .dot{background:currentColor}
@keyframes ping{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 70%,transparent)}100%{box-shadow:0 0 0 9px transparent}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border-radius:99px;border:1px solid var(--line2);background:rgba(14,23,35,.7);font-size:13.5px;font-weight:500;white-space:nowrap;transition:border-color .3s,background .3s,transform .3s var(--ease),color .3s}
.btn:hover{border-color:rgba(87,217,255,.55);transform:translateY(-1px)}
.btn:disabled{opacity:.35;pointer-events:none}
.btn.primary{background:var(--accent);color:#031118;border-color:transparent;font-weight:600;box-shadow:0 0 30px -8px rgba(87,217,255,.9)}
.btn.primary:hover{filter:brightness(1.1)}
.btn.ok{border-color:var(--short);color:var(--short)}
.btn.wide{width:100%;margin-top:18px}
.btn .xg{font-size:15px;line-height:1}
.rbtn{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);background:rgba(14,23,35,.6);color:var(--muted);transition:color .25s,border-color .25s}
.rbtn:hover{color:var(--accent);border-color:rgba(87,217,255,.5)}

/* segmented */
.seg{display:inline-flex;gap:2px;padding:4px;border-radius:99px;background:rgba(5,9,14,.7);border:1px solid var(--line);overflow-x:auto;scrollbar-width:none;max-width:100%}
.seg::-webkit-scrollbar{display:none}
.seg button{min-height:32px;padding:0 13px;border-radius:99px;font-size:13px;font-weight:500;color:var(--muted);white-space:nowrap;transition:color .25s,background .35s var(--ease),box-shadow .35s}
.seg button:hover{color:var(--ink)}
.seg button[aria-pressed=true]{background:var(--accent);color:#031118;box-shadow:0 0 22px -6px rgba(87,217,255,.9)}
.seg-ink button[aria-pressed=true]{background:var(--ink);color:#05080d;box-shadow:none}

/* split bar */
.split{display:flex;height:var(--h);border-radius:99px;overflow:hidden;background:rgba(148,163,184,.12);gap:2px}
.split .l{background:linear-gradient(90deg,#c9405a,var(--long));box-shadow:0 0 14px -2px rgba(255,102,122,.6)}
.split .s{background:linear-gradient(90deg,var(--short),#2aa98b);box-shadow:0 0 14px -2px rgba(54,214,176,.5)}
.split span{transition:width 1s var(--ease)}

/* gauge */
.gauge{position:relative;width:var(--size);height:var(--size);flex:none}
.gauge svg{display:block;overflow:visible}
.g-arc{filter:drop-shadow(0 0 10px color-mix(in srgb,var(--c) 70%,transparent));animation:arc 1.4s var(--ease) both}
@keyframes arc{from{stroke-dasharray:0 var(--circ)}}
.g-wait{animation:spin 12s linear infinite;transform-origin:center}
@keyframes spin{to{transform:rotate(495deg)}}
.g-in{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.g-in b{font-family:var(--mono);font-size:calc(var(--size)*.26);font-weight:500;line-height:1;letter-spacing:-.05em}
.g-in em{font-style:normal;font-size:calc(var(--size)*.075 + 3px);color:var(--c);font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-top:6px}
.gauge.big::before{content:"";position:absolute;inset:14%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%);filter:blur(10px)}

/* section heads */
.shead{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:clamp(22px,4vw,44px)}
.snum{font-family:var(--serif);font-style:italic;font-size:clamp(46px,6vw,84px);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(87,217,255,.5)}
.stitle{flex:1;min-width:220px;display:grid;gap:8px}
.stitle h1,.stitle h2{font-size:clamp(26px,3.6vw,48px);line-height:1.02;letter-spacing:-.035em;font-weight:600}
.saction{display:flex;gap:10px;align-items:center;max-width:100%}

/* drawers */
.drawer{margin-top:18px;border:1px solid var(--line);border-radius:18px;background:rgba(10,16,25,.55);overflow:hidden}
.drawer summary{display:flex;align-items:center;gap:10px;padding:15px 18px;cursor:pointer;list-style:none;font-size:14px;color:var(--muted);transition:color .25s}
.drawer summary::-webkit-details-marker{display:none}
.drawer summary:hover{color:var(--ink)}
.drawer summary span{flex:1}
.drawer .chev{transition:transform .35s var(--ease)}
.drawer[open] .chev{transform:rotate(180deg)}
.drawer-b{padding:0 18px 18px;display:grid;gap:10px;color:var(--muted);font-size:14px;line-height:1.65}
.drawer[open] .drawer-b{animation:drop .45s var(--ease)}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}}

/* reveal */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
[data-reveal].in{opacity:1;transform:none}

/* avatars */
.av{position:relative;display:inline-grid;place-items:center;width:var(--s);height:var(--s);flex:none;border-radius:50%;overflow:hidden}
.av-f{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;font-family:var(--mono);font-weight:700;font-size:max(9px,calc(var(--s)*.27));color:#fff;background:radial-gradient(circle at 30% 25%,var(--c),color-mix(in srgb,var(--c) 60%,transparent) 60%,color-mix(in srgb,var(--c) 33%,transparent));box-shadow:0 0 18px -6px var(--c)}
.av img{position:relative;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s;border-radius:50%}
.av img.ok{opacity:1}

/* =================== HEADER =================== */
.top{position:fixed;inset:0 0 auto 0;z-index:60;transition:background .5s,border-color .5s,backdrop-filter .5s}
.top-in{display:flex;align-items:center;gap:20px;height:var(--top);padding-inline:var(--gut);max-width:1600px;margin:0 auto}
html.scrolled .top,body:not([data-route=home]) .top{background:rgba(4,7,11,.72);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:11px;min-width:0}
.brand span{display:grid;line-height:1.1;min-width:0}
.brand b{font-size:15.5px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.brand small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.logo{flex:none;filter:drop-shadow(0 0 14px rgba(87,217,255,.35))}
.pnav{position:relative;display:flex;gap:2px;margin-inline:auto;padding:4px;border-radius:99px;border:1px solid var(--line);background:rgba(8,13,20,.5)}
.pnav a{position:relative;z-index:1;padding:7px 15px;border-radius:99px;font-size:13.5px;color:var(--muted);transition:color .3s}
.pnav a:hover,.pnav a[aria-current=page]{color:#031118}
.pnav a:not([aria-current=page]):hover{color:var(--ink)}
.pnav-ink{position:absolute;left:0;top:4px;bottom:4px;border-radius:99px;background:var(--accent);box-shadow:0 0 24px -6px rgba(87,217,255,.9);transition:transform .55s var(--ease),width .55s var(--ease),opacity .3s}
[dir=rtl] .pnav-ink{left:auto;right:0}
.top-act{display:flex;align-items:center;gap:8px;margin-inline-start:auto}
.pnav+.top-act{margin-inline-start:0}
.lang{position:relative}
.lang-btn{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px;border-radius:99px;border:1px solid var(--line2);background:rgba(14,23,35,.6);font-size:13px;color:var(--muted);transition:color .25s,border-color .25s}
.lang-btn:hover{color:var(--ink);border-color:rgba(87,217,255,.45)}
.lang-btn span{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lang-pop{position:absolute;inset-inline-end:0;top:calc(100% + 10px);width:290px;max-height:min(440px,70vh);display:flex;flex-direction:column;border-radius:20px;border:1px solid var(--line2);background:rgba(9,15,23,.96);backdrop-filter:blur(22px);box-shadow:0 30px 80px -20px #000;overflow:hidden;animation:pop .35s var(--ease);z-index:70}
@keyframes pop{from{opacity:0;transform:translateY(-8px) scale(.98)}}
.lang-s{display:flex;align-items:center;gap:8px;margin:10px;padding:0 12px;height:40px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--muted)}
.lang-s input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--ink);font-size:14px}
.lang-pop ul{overflow:auto;padding:0 6px 8px}
.lang-pop li button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 12px;border-radius:10px;text-align:start;font-size:14px}
.lang-pop li button:hover{background:rgba(87,217,255,.08)}
.lang-pop li button[aria-selected=true]{color:var(--accent)}
.lang-pop li button span{display:grid}
.lang-pop small{color:var(--dim);font-size:11.5px}
.menu-btn{display:grid;place-content:center;gap:6px;width:44px;height:40px;border-radius:99px;border:1px solid var(--line2);background:rgba(14,23,35,.6)}
.menu-btn span{display:block;width:18px;height:1.5px;background:var(--ink);transition:transform .45s var(--ease)}
.menu-btn[aria-expanded=true] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.menu-btn[aria-expanded=true] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.bell-help{padding:8px var(--gut);font-size:12.5px;color:var(--muted);background:rgba(87,217,255,.06);border-top:1px solid var(--line)}

/* live strip */
.live{border-top:1px solid var(--line);background:rgba(4,7,11,.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.live-in{display:flex;align-items:center;gap:14px;height:38px;padding-inline:var(--gut);max-width:1600px;margin:0 auto;font-size:12.5px;overflow:hidden;white-space:nowrap}
.srcs-in{display:flex;gap:12px;color:var(--muted)}
.src{display:inline-flex;align-items:center;gap:6px}
.src i{width:6px;height:6px;border-radius:50%}
.pm{color:var(--muted)} .pm b{font-family:var(--mono);color:var(--ink)}
.live-msg{color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.live-msg.warnc{color:#ffc58f}
.live-last{display:inline-flex;align-items:center;gap:8px;min-width:0;overflow:hidden;padding:3px 10px;border-radius:99px;transition:background .3s}
.live-last:hover{background:rgba(255,255,255,.05)}
.live-last b{font-weight:600}
.live-last.ping{animation:lping 1.2s var(--ease)}
@keyframes lping{0%{background:rgba(87,217,255,.25)}100%{background:transparent}}

/* menu overlay */
.menu{position:fixed;inset:0;z-index:55;display:grid;grid-template-columns:1fr 1fr;background:rgba(3,5,8,.97);clip-path:circle(0 at calc(100% - 50px) 32px);transition:clip-path .9s var(--ease2);visibility:hidden}
.menu.on{clip-path:circle(150% at calc(100% - 50px) 32px);visibility:visible}
[dir=rtl] .menu{clip-path:circle(0 at 50px 32px)} [dir=rtl] .menu.on{clip-path:circle(150% at 50px 32px)}
.menu-img{background:url() center/cover;opacity:.55;transition:background-image .5s;mask-image:linear-gradient(90deg,#000 40%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 40%,transparent)}
.menu-in{display:flex;flex-direction:column;justify-content:center;padding:calc(var(--top) + 60px) var(--gut) 40px;gap:40px;overflow:auto}
.menu-list li{opacity:0;transform:translateY(30px);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.menu.on .menu-list li{opacity:1;transform:none;transition-delay:calc(.25s + var(--i)*.04s)}
.menu-list a{display:flex;align-items:baseline;gap:18px;padding:6px 0;border-bottom:1px solid var(--line);font-size:clamp(26px,3.6vw,46px);font-weight:500;letter-spacing:-.035em;color:var(--muted);transition:color .3s,padding .4s var(--ease)}
.menu-list a:hover,.menu-list a[aria-current=page]{color:var(--ink);padding-inline-start:14px}
.menu-list a[aria-current=page] .mi-n{color:var(--accent)}
.mi-n{font-family:var(--mono);font-size:12px;color:var(--dim);letter-spacing:.1em}
.mi-t{flex:1}
.mi-i{opacity:0;transition:opacity .3s;color:var(--accent)}
.menu-list a:hover .mi-i{opacity:1}
.menu-foot .serif{font-size:24px;color:var(--accent)}

/* dock (mobile) */
.dock{display:none}
/* rail (desktop chapters) */
.rail{position:fixed;inset-inline-end:18px;top:50%;transform:translateY(-50%);z-index:40;display:none;flex-direction:column;gap:4px}
.rail a{display:flex;align-items:center;justify-content:flex-end;gap:10px;height:22px;color:var(--dim);font-family:var(--mono);font-size:10.5px}
.rail a span{width:26px;text-align:end;transition:color .3s}
.rail a::after{content:"";width:14px;height:1px;background:currentColor;transition:width .4s var(--ease),background .3s}
.rail a em{font-style:normal;font-family:var(--sans);font-size:12px;opacity:0;transform:translateX(8px);transition:.35s var(--ease);white-space:nowrap;color:var(--ink);order:-1;background:rgba(5,9,14,.85);padding:2px 8px;border-radius:6px}
.rail a:hover em{opacity:1;transform:none}
.rail a.on{color:var(--accent)} .rail a.on::after{width:30px}
@media (min-width:1280px){body[data-route=home] .rail.on{display:flex}}

/* page transition */
.stage{display:block;min-height:100vh;outline:0}
.wipe{position:fixed;inset:0;z-index:150;pointer-events:none}
.wipe i{position:absolute;inset:0;background:linear-gradient(120deg,#04070b 0%,#0b1824 50%,#04070b 100%);animation:wipeIn .45s var(--ease2) forwards,wipeOut .55s .5s var(--ease2) forwards}
.wipe i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 24px var(--accent)}
@keyframes wipeIn{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes wipeOut{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(100% 0 0 0)}}
.page{padding-bottom:40px}
body:not([data-route=home]) .page{padding-top:calc(var(--top) + 38px)}

/* =================== HOME · HERO =================== */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;--p:0}
.hero-mini{min-height:78svh}
.hero-bg{position:absolute;inset:0;z-index:-1;background:radial-gradient(90% 70% at 72% 45%,#0c1d2c 0%,#05090e 55%,#030508 100%)}
.hero-globe{position:absolute;right:-6vw;top:50%;width:min(76vw,1100px);aspect-ratio:4/3;transform:translate3d(calc(var(--mx,0)*-26px),calc(-50% + var(--my,0)*-18px + var(--p)*120px),0) scale(calc(1 + var(--p)*.25));transition:transform .8s var(--ease)}
[dir=rtl] .hero-globe{right:auto;left:-6vw}
.hero-globe div{position:absolute;inset:0;background-size:cover;background-position:center;mask-image:radial-gradient(closest-side,#000 62%,transparent);-webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent);animation:breathe 14s ease-in-out infinite;opacity:calc(1 - var(--p)*.6)}
@keyframes breathe{50%{transform:scale(1.05) rotate(1.2deg)}}
.hero-cv{position:absolute;inset:0;width:100%;height:100%}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(148,163,184,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.05) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 70%,transparent);transform:perspective(600px) rotateX(58deg) translateY(30%);transform-origin:50% 100%;opacity:.55}
.hero-vig{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,7,11,.92) 0%,rgba(4,7,11,.55) 40%,transparent 70%),linear-gradient(0deg,var(--bg) 0%,transparent 30%)}
[dir=rtl] .hero-vig{background:linear-gradient(-90deg,rgba(4,7,11,.92) 0%,rgba(4,7,11,.55) 40%,transparent 70%),linear-gradient(0deg,var(--bg) 0%,transparent 30%)}
.hero-in{position:relative;padding-top:calc(var(--top) + 80px);padding-bottom:clamp(48px,8vh,96px);display:grid;gap:clamp(22px,4vh,40px);transform:translateY(calc(var(--p)*-60px));opacity:calc(1 - var(--p)*1.1)}
.hero-badges{display:flex;flex-wrap:wrap;gap:8px;min-height:26px}
.hero-title{display:grid;gap:6px;max-width:16ch;font-weight:600}
.h1a{font-size:clamp(46px,8.2vw,128px);line-height:.9;letter-spacing:-.055em}
.h1a .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em}
.h1a .w span{display:inline-block;transform:translateY(105%);animation:rise 1.2s var(--ease) forwards;animation-delay:calc(.15s + var(--i)*.09s)}
html.filming .h1a .w span,html.filming .h1b,html.filming .instr{animation-play-state:paused}
@keyframes rise{to{transform:none}}
.h1b{font-size:clamp(28px,4.2vw,64px);line-height:1;background:linear-gradient(90deg,var(--accent),var(--short) 45%,var(--long));-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;animation:fadein 1.4s .7s var(--ease) forwards;padding-bottom:.08em}
@keyframes fadein{from{opacity:0;transform:translateY(16px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
.hero-lead{max-width:44ch;color:var(--muted);font-size:17px}
.instr{width:min(560px,100%);display:grid;gap:12px;padding:22px 24px;border-radius:24px;border:1px solid var(--line2);background:linear-gradient(160deg,rgba(18,30,45,.66),rgba(6,10,16,.5));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 40px 80px -40px #000,inset 0 1px 0 rgba(255,255,255,.06);opacity:0;animation:fadein 1.2s 1s var(--ease) forwards}
.instr-h{display:flex;align-items:center;justify-content:space-between}
.instr-h h2{font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:500}
.win{font-family:var(--mono);font-size:12px;padding:3px 10px;border-radius:99px;background:rgba(87,217,255,.12);color:var(--accent)}
.instr-v{font-family:var(--mono);font-size:clamp(48px,7vw,92px);line-height:.95;letter-spacing:-.06em;font-weight:500;background:linear-gradient(180deg,#fff,#a9c4dc);-webkit-background-clip:text;background-clip:text;color:transparent}
.instr-ls{display:flex;justify-content:space-between;font-size:13px}
.instr-ls i{display:inline-block;width:8px;height:8px;border-radius:2px;background:currentColor;margin-inline-end:7px}
.instr-ls b{font-family:var(--mono);font-weight:500;margin-inline-start:4px}
.instr-u{font-size:12px;color:var(--dim)}
.scroll-cue{position:absolute;inset-inline-end:var(--gut);bottom:clamp(36px,7vh,80px);width:112px;height:112px;display:grid;place-items:center;color:var(--accent)}
.scroll-cue svg{position:absolute;inset:0;animation:spin2 18s linear infinite}
.scroll-cue text{font-family:var(--mono);font-size:8.6px;letter-spacing:.24em;fill:var(--muted)}
.scroll-cue>.ico{animation:bob 2s ease-in-out infinite}
@keyframes spin2{to{transform:rotate(360deg)}}
@keyframes bob{50%{transform:translateY(5px)}}

/* sticky control dock */
.ctrl{position:sticky;top:var(--top);z-index:30;background:linear-gradient(180deg,rgba(4,7,11,.92),rgba(4,7,11,.78));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-block:1px solid var(--line)}
.ctrl-in{display:flex;align-items:center;gap:12px;padding-block:10px}
.ctrl-f{flex:1;min-width:0}
.ctrl-b{display:flex;gap:8px;flex:none}
.filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;max-width:100%}
.chips::-webkit-scrollbar{display:none}
.achip{min-height:34px;padding:0 14px;border-radius:99px;border:1px solid var(--line2);background:rgba(14,23,35,.5);font-size:13px;white-space:nowrap;transition:.3s var(--ease)}
.achip:hover{border-color:rgba(87,217,255,.45)}
.achip[aria-pressed=true]{background:var(--ink);color:#05080d;border-color:var(--ink);font-weight:600}
.fmore{display:flex;gap:8px;flex-wrap:wrap}
.fsel{position:relative;display:flex;align-items:center;gap:8px;height:36px;padding:0 10px 0 13px;border-radius:12px;border:1px solid var(--line2);background:rgba(5,9,14,.6);font-size:12.5px;color:var(--muted)}
.fsel select,.fsel input{appearance:none;-webkit-appearance:none;background:none;border:0;outline:0;color:var(--ink);font-size:13px;padding-inline-end:18px;max-width:150px;cursor:pointer}
.fsel select option{background:#0b1320}
.fsel>span{white-space:nowrap}
.fsel .ico{position:absolute;inset-inline-end:8px;pointer-events:none}
.fmin input{width:84px;padding-inline-end:0;cursor:text}
.ctrl .fmore{display:none}
.ctrl .filters{flex-wrap:nowrap}
@media (min-width:1500px){.ctrl .fmore{display:flex;flex-wrap:nowrap}.ctrl-more{display:none}}
.inline-f{margin:0 0 30px;padding:14px;border-radius:20px;border:1px solid var(--line);background:rgba(10,16,25,.5)}
.sharebar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sheet-filters .filters{flex-direction:column;align-items:stretch}
.sheet-filters .fmore{display:grid;grid-template-columns:1fr 1fr}
.sheet-filters .fsel select,.sheet-filters .fsel input{max-width:none;width:100%}
.sheet-filters .chips{flex-wrap:wrap}

/* 02 dial */
.dial{padding:clamp(80px,12vw,160px) 0 clamp(60px,8vw,110px);background:linear-gradient(180deg,var(--bg),#060b12)}
.dial-row{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(8px,1.4vw,18px);align-items:end;height:min(46vh,420px);border-bottom:1px solid var(--line2);position:relative}
.dial-row::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 calc(25% - 1px),rgba(148,163,184,.07) calc(25% - 1px) 25%);pointer-events:none}
.dcol{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;text-align:start;gap:6px;padding-bottom:10px}
.dcol-bar{position:relative;flex:1;display:flex;align-items:flex-end}
.dcol-bar i{display:block;width:100%;height:var(--h);border-radius:14px 14px 4px 4px;background:linear-gradient(180deg,rgba(87,217,255,.55),rgba(87,217,255,.04));border:1px solid rgba(87,217,255,.28);border-bottom:0;transform-origin:bottom;animation:grow 1.2s var(--ease) both;animation-delay:calc(var(--i)*.08s);transition:background .4s,box-shadow .4s,height .9s var(--ease)}
@keyframes grow{from{transform:scaleY(0)}}
.dcol:hover .dcol-bar i{background:linear-gradient(180deg,rgba(87,217,255,.8),rgba(87,217,255,.08))}
.dcol[aria-pressed=true] .dcol-bar i{background:linear-gradient(180deg,#9ff0ff,var(--accent) 30%,rgba(87,217,255,.1));box-shadow:0 0 50px -10px var(--accent)}
.dcol-w{font-family:var(--mono);font-size:clamp(18px,2.2vw,30px);font-weight:500;letter-spacing:-.03em}
.dcol[aria-pressed=true] .dcol-w{color:var(--accent)}
.dcol-v{font-size:clamp(12px,1.2vw,15px)}
.dcol-e{font-size:11.5px;color:var(--dim)}

/* 03 duel */
.duel{padding-bottom:clamp(60px,8vw,110px);background:#060b12}
.duel-stage{position:relative;display:flex;min-height:min(78vh,720px);overflow:hidden}
.side{position:relative;display:flex;align-items:flex-end;padding:clamp(28px,5vw,72px);overflow:hidden;transition:flex-basis 1.4s var(--ease)}
.side-l{flex:0 0 var(--w);background:radial-gradient(120% 90% at 0% 100%,rgba(255,102,122,.55),rgba(120,20,40,.35) 45%,#12070b 100%)}
.side-s{flex:1;justify-content:flex-end;text-align:end;background:radial-gradient(120% 90% at 100% 100%,rgba(54,214,176,.5),rgba(10,80,66,.35) 45%,#04110e 100%)}
.side::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 7px);mix-blend-mode:overlay}
.side{container-type:inline-size}
.side-in{position:relative;display:grid;gap:10px;max-width:520px;min-width:0}
.side h3{font-family:var(--mono);font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;opacity:.85}
.side-v{font-family:var(--mono);font-size:clamp(30px,19cqi,120px);line-height:.9;letter-spacing:-.06em;font-weight:500}
.side-p{font-family:var(--serif);font-style:italic;font-size:clamp(24px,9cqi,48px);line-height:1}
.side-l .side-p{color:#ffc0c9} .side-s .side-p{color:#b5f5e3}
.side-h{font-size:14px;opacity:.75;max-width:34ch}
.side-s .side-h{margin-inline-start:auto}
.seam{position:absolute;top:0;bottom:0;left:var(--w);width:2px;transform:translateX(-1px);background:linear-gradient(180deg,transparent,#fff 20%,#fff 80%,transparent);box-shadow:0 0 30px 6px rgba(255,255,255,.35);transition:left 1.4s var(--ease);z-index:2}
[dir=rtl] .seam{left:auto;right:var(--w);transform:translateX(1px)}
.seam span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:8px 14px;border-radius:99px;background:#fff;color:#05080d;font-family:var(--mono);font-size:13px;font-weight:600;white-space:nowrap;box-shadow:0 0 40px rgba(255,255,255,.5)}
.duel-foot{margin-top:clamp(28px,4vw,44px)}
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stat,.tri,.tile,.rule{position:relative;padding:20px 22px;border-radius:20px;border:1px solid var(--line);background:rgba(12,20,31,.55);overflow:hidden}
.stat::before,.tri::before,.tile::before,.rule::before,.mtile::before,.xrow::before,.alert::before,.chap::before,.print-card::before,.rrow::before,.sr::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(300px circle at var(--mx,-999px) var(--my,-999px),rgba(87,217,255,.1),transparent 60%);opacity:0;transition:opacity .4s}
.stat:hover::before,.tri:hover::before,.tile:hover::before,.rule:hover::before,.mtile:hover::before,.xrow:hover::before,.alert:hover::before,.chap:hover::before,.print-card:hover::before,.rrow:hover::before,.sr:hover::before{opacity:1}
.stat p,.tri p,.tile p,.rule p{font-size:12.5px;color:var(--muted)}
.stat b,.tri b,.tile b,.rule b{display:block;margin-top:6px;font-family:var(--mono);font-size:clamp(22px,2.6vw,34px);font-weight:500;letter-spacing:-.04em}
.srcs{display:grid;gap:10px}
.srcs li{display:flex;align-items:flex-start;gap:12px}
.srcs i{width:8px;height:8px;border-radius:50%;margin-top:7px;flex:none}
.srcs span{flex:1;display:grid;font-size:13px}
.srcs b{color:var(--ink);font-weight:500}
.srcs em{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--dim)}

/* 04 storm */
.stormx{position:relative;padding:clamp(80px,12vw,160px) 0;background:radial-gradient(70% 60% at 30% 40%,#0c2030 0%,#050a10 60%,var(--bg) 100%);overflow:hidden}
.stormx-grid{display:grid;grid-template-columns:minmax(300px,.8fr) 1.4fr;gap:clamp(20px,4vw,56px);align-items:center}
.stormx-g{display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.sg-meta{display:grid;gap:10px}
.sg-score{font-family:var(--mono);font-size:clamp(34px,4vw,56px);line-height:1;letter-spacing:-.05em}
.kv{display:grid;grid-template-columns:auto auto;gap:6px 18px;font-size:13.5px}
.kv dt{color:var(--muted)} .kv dd{font-family:var(--mono);text-align:end}
.stormx-f,.sfield-wrap{position:relative;border-radius:28px;overflow:hidden;border:1px solid rgba(87,217,255,.18);background:radial-gradient(circle at 50% 50%,#132235,#070d15 70%);min-height:320px;height:min(60vh,520px);box-shadow:0 60px 120px -60px rgba(87,217,255,.35),inset 0 0 80px rgba(0,0,0,.6)}
.stormx-f canvas,.sfield-wrap canvas{display:block;width:100%;height:100%;cursor:crosshair}
.sf-label{position:absolute;left:16px;top:16px;padding:5px 12px;border-radius:99px;border:1px solid rgba(87,217,255,.3);background:rgba(5,9,14,.7);font-size:11.5px;color:var(--accent);font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase}
.sf-legend{position:absolute;right:16px;top:16px;display:flex;gap:12px;font-size:11.5px;color:var(--muted)}
.sf-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-inline-end:6px}
.sf-legend i.l{background:var(--long);box-shadow:0 0 8px var(--long)} .sf-legend i.s{background:var(--short);box-shadow:0 0 8px var(--short)}
.sf-tip{position:absolute;left:14px;right:14px;bottom:14px;display:grid;gap:3px;padding:12px 14px;border-radius:16px;border:1px solid var(--line2);background:rgba(8,13,20,.88);backdrop-filter:blur(12px);font-size:13px;animation:fadein .4s var(--ease)}
.sf-tip[hidden]{display:none}
.sf-tip small{color:var(--dim);font-family:var(--mono)}

/* 05 flow */
.flow{padding:clamp(70px,10vw,130px) 0;background:linear-gradient(180deg,var(--bg),#03060a)}
.flow-chart,.lschart{position:relative;height:clamp(260px,40vh,420px);margin-bottom:24px}
.lschart svg{display:block;overflow:visible;touch-action:pan-y}
.lschart .gl{stroke:rgba(148,163,184,.12);stroke-dasharray:3 6}
.lschart .gt{fill:var(--dim);font-size:10.5px;font-family:var(--mono)}
.lschart .ln{fill:none;stroke-width:2;stroke-dasharray:3000;stroke-dashoffset:3000;animation:draw 2.2s var(--ease) forwards;filter:drop-shadow(0 0 6px currentColor)}
.lschart .ar{opacity:0;animation:fadeA 1.2s .6s forwards}
@keyframes draw{to{stroke-dashoffset:0}} @keyframes fadeA{to{opacity:1}}
.lschart .xh{stroke:rgba(238,243,248,.35);stroke-dasharray:2 4;transition:opacity .2s}
.lschart circle{transition:opacity .2s;stroke:#05080d;stroke-width:2}
.lschart .tip{position:absolute;left:0;top:0;pointer-events:none;padding:10px 12px;border-radius:12px;border:1px solid var(--line2);background:rgba(10,16,25,.94);font-size:12px;display:grid;gap:2px;transition:opacity .2s;white-space:nowrap}
.lschart .tip p:first-child{color:var(--muted);font-family:var(--mono)}

/* 06 tape */
.tape{padding:clamp(70px,10vw,130px) 0;background:#03060a;border-top:1px solid var(--line)}
.tape-grid{display:grid;grid-template-columns:minmax(260px,.7fr) 1.6fr;gap:clamp(24px,5vw,72px);align-items:start}
.tape-side{position:sticky;top:calc(var(--top) + 90px)}
.tape-side .shead{margin-bottom:18px}
.tape-count{font-family:var(--mono);font-size:clamp(64px,10vw,150px);line-height:.85;letter-spacing:-.07em;font-weight:400;color:transparent;-webkit-text-stroke:1px rgba(238,243,248,.5)}
.tape-list{display:grid;border-top:1px solid var(--line)}
.frow{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:14px 12px 14px 18px;border-bottom:1px solid var(--line);text-align:start;transition:background .3s}
.frow:hover{background:rgba(255,255,255,.03)}
.frow-bar{position:absolute;inset-inline-start:0;top:12px;bottom:12px;width:3px;border-radius:3px;background:var(--short)}
.frow.is-l .frow-bar{background:var(--long);box-shadow:0 0 12px var(--long)} .frow.is-s .frow-bar{box-shadow:0 0 12px var(--short)}
.frow-m{display:grid;gap:2px;min-width:0}
.frow-t{display:flex;align-items:center;gap:10px}
.frow-t b{font-size:15px}
.fside{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:99px;font-size:11.5px;font-weight:500}
.frow.is-l .fside{color:var(--long);background:rgba(255,102,122,.1)} .frow.is-s .fside{color:var(--short);background:rgba(54,214,176,.1)}
.frow-s,.frow-time{font-size:12px;color:var(--dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frow-v{font-size:clamp(16px,1.7vw,22px)}
.frow.is-l .frow-v .money{color:#ffd1d7} .frow.is-s .frow-v .money{color:#c4f7ea}
.frow.fresh{animation:flash 1.6s var(--ease)}
@keyframes flash{0%{background:rgba(87,217,255,.18);transform:translateX(-14px);opacity:0}30%{opacity:1;transform:none}100%{background:transparent}}
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;font-size:13.5px;color:var(--muted)}
.pager b{color:var(--ink)}

/* 07 rank */
.rank{position:relative;padding:clamp(80px,12vw,160px) 0;background:radial-gradient(60% 50% at 80% 10%,rgba(255,159,67,.08),transparent 70%),var(--bg);overflow:hidden}
.rank-list{display:grid;gap:10px}
.rrow{position:relative;display:grid;grid-template-columns:56px minmax(140px,1fr) auto;grid-template-areas:"n id v" "n meta meta" "n bar bar" "n ls ls";column-gap:20px;row-gap:10px;padding:20px 24px;border-radius:22px;border:1px solid var(--line);background:rgba(12,20,31,.5);overflow:hidden;transition:border-color .4s,transform .5s var(--ease)}
.rrow:hover{border-color:color-mix(in srgb,var(--c) 50%,transparent);transform:translateX(6px)}
[dir=rtl] .rrow:hover{transform:translateX(-6px)}
.rr-n{grid-area:n;font-family:var(--serif);font-style:italic;font-size:44px;line-height:1;color:var(--dim)}
.rr-id{grid-area:id;display:flex;align-items:center;gap:12px}
.rr-id b{font-size:20px;letter-spacing:-.02em}
.rr-v{grid-area:v;font-size:clamp(20px,2.4vw,30px);text-align:end;align-self:center}
.rr-meta{grid-area:meta;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;font-size:12.5px;color:var(--muted)}
.rr-meta b{font-family:var(--mono);color:var(--ink);font-weight:500}
.rr-meta .new{color:var(--accent)}
.rr-bar{grid-area:bar;height:3px;border-radius:3px;background:rgba(148,163,184,.1);overflow:hidden}
.rr-bar i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 30%,transparent));transition:width 1.2s var(--ease)}
.rr-ls{grid-area:ls;display:grid;grid-template-columns:1fr auto auto auto;gap:14px;align-items:center;font-size:12px}
.rrow.top{padding:34px 28px;background:linear-gradient(120deg,color-mix(in srgb,var(--c) 18%,rgba(12,20,31,.6)),rgba(8,13,20,.6) 60%);border-color:color-mix(in srgb,var(--c) 35%,transparent)}
.rrow.top .rr-n{font-size:72px;color:var(--c)}
.rrow.top .rr-id b{font-size:clamp(30px,4vw,52px)}
.rrow.top .rr-v{font-size:clamp(30px,4vw,56px)}
.rr-ghost{position:absolute;inset-inline-end:-2%;top:50%;transform:translateY(-50%);font-size:clamp(120px,18vw,260px);font-weight:700;letter-spacing:-.08em;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--c) 30%,transparent);pointer-events:none;line-height:1;opacity:.8}

/* 08 risk */
.riskx{position:relative;padding:clamp(80px,12vw,160px) 0;background:radial-gradient(55% 55% at 35% 45%,rgba(87,217,255,.07),transparent 70%),#05090e;overflow:hidden;border-top:1px solid var(--line)}
.riskx::before{content:"";position:absolute;left:35%;top:45%;width:1400px;height:1400px;transform:translate(-50%,-50%);border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 79px,rgba(148,163,184,.05) 79px 80px);pointer-events:none}
.riskx-grid{position:relative;display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(20px,4vw,48px);align-items:center}
.radar{width:100%;max-height:560px;overflow:visible}
.radar .rr{fill:none;stroke:rgba(148,163,184,.14)}
.radar .ra{stroke:rgba(148,163,184,.14)}
.radar .rp{fill:color-mix(in srgb,var(--c) 22%,transparent);stroke:var(--c);stroke-width:2;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--c) 60%,transparent));transform-origin:180px 180px;animation:radarIn 1.4s var(--ease) both}
@keyframes radarIn{from{transform:scale(0);opacity:0}}
.radar .rl{fill:var(--muted);font-size:11px;transition:fill .25s}
.radar .rl.miss{fill:var(--dim);font-style:italic}
.radar .rl.hl{fill:var(--accent)} .radar circle.hl{r:7}
.riskx-score{display:grid;justify-items:start;gap:14px}
.rs-only{color:var(--muted);font-size:14.5px;max-width:30ch}
.rs-conf{font-size:13px;color:var(--muted)} .rs-conf b{font-family:var(--mono);color:var(--ink);font-size:18px;margin-inline-start:6px}
.metrics{position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;margin-top:clamp(28px,4vw,48px)}
.metric{border-radius:18px;border:1px solid var(--line);background:rgba(12,20,31,.55);overflow:hidden;transition:border-color .3s}
.metric:hover{border-color:rgba(87,217,255,.4)}
.metric summary{display:grid;grid-template-columns:1fr auto;gap:10px 12px;padding:16px 18px;cursor:pointer;list-style:none}
.metric summary::-webkit-details-marker{display:none}
.m-n{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.m-n h3{font-size:14px;font-weight:500}
.m-n em{font-style:normal;font-size:10.5px;padding:2px 8px;border-radius:99px;background:rgba(255,159,67,.12);color:var(--alert)}
.m-v{font-family:var(--mono);font-size:15px;text-align:end}
.m-v .na{color:var(--dim)} .m-v small{color:var(--dim)}
.m-bar{grid-column:1/-1;height:4px;border-radius:4px;background:rgba(148,163,184,.1);overflow:hidden}
.m-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--short),var(--alert) 60%,var(--long));transition:width 1.2s var(--ease)}
.m-b{padding:0 18px 16px;display:grid;gap:5px;font-size:12.5px;color:var(--muted)}

/* 09 zones */
.zones{position:relative;padding:clamp(100px,14vw,200px) 0;overflow:hidden;isolation:isolate}
.zones-img{position:absolute;inset:-10% 0;z-index:-2;background-size:cover;background-position:center 60%}
.zones-fade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#05090e 0%,rgba(4,7,11,.45) 35%,rgba(4,7,11,.55) 65%,var(--bg) 100%)}
.zones-list{display:grid;gap:14px;max-width:760px;padding:24px;border-radius:26px;border:1px solid var(--line2);background:rgba(5,9,14,.62);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.zrow{display:grid;gap:8px}
.zrow-h,.zrow-f{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--muted)}
.zrow-h .mono{color:var(--ink)}

/* 10 prints */
.prints{padding:clamp(70px,10vw,130px) 0 clamp(60px,8vw,100px)}
.prints-track{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);padding:10px var(--gut) 30px;scrollbar-width:thin;scrollbar-color:rgba(87,217,255,.3) transparent}
.prints-ol{display:flex;gap:18px;position:relative;width:max-content;padding-top:34px}
.prints-ol::before{content:"";position:absolute;left:0;right:0;top:8px;height:1px;background:linear-gradient(90deg,var(--accent),rgba(87,217,255,.1))}
.print{position:relative;scroll-snap-align:start}
.print-dot{position:absolute;top:-31px;left:22px;width:12px;height:12px;border-radius:50%;border:2px solid var(--bg);background:var(--short);box-shadow:0 0 14px var(--short)}
.print.is-l .print-dot{background:var(--long);box-shadow:0 0 14px var(--long)}
.print-card{position:relative;display:grid;gap:10px;width:min(300px,78vw);padding:22px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(170deg,rgba(18,28,42,.75),rgba(8,13,20,.6));overflow:hidden;transition:transform .5s var(--ease),border-color .4s}
.print-card:hover{transform:translateY(-6px);border-color:rgba(87,217,255,.4)}
.print-top{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.print-top b{color:var(--ink);font-size:15px}
.print-top em{font-style:normal;font-family:var(--mono);font-size:10.5px;color:var(--dim)}
.print-v{font-size:clamp(28px,3vw,40px)}
.print-s{font-size:12px;color:var(--muted)}
.print-t{font-size:12px;color:var(--dim);font-family:var(--mono)}

/* =================== SUB-PAGE HERO =================== */
.phero{position:relative;min-height:clamp(380px,62vh,620px);display:flex;align-items:flex-end;overflow:hidden;margin-top:calc(-1 * (var(--top) + 38px));isolation:isolate}
.phero-img,.mhero-img{position:absolute;inset:-12% 0;z-index:-2;background-size:cover;background-position:center 40%;transform:scale(1.12);animation:kenburns 26s ease-in-out infinite alternate}
@keyframes kenburns{to{background-position:center 55%}}
.phero-fade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,7,11,.9),rgba(4,7,11,.25) 70%),linear-gradient(0deg,var(--bg) 2%,transparent 55%),linear-gradient(180deg,rgba(4,7,11,.7),transparent 30%)}
[dir=rtl] .phero-fade{background:linear-gradient(-90deg,rgba(4,7,11,.9),rgba(4,7,11,.25) 70%),linear-gradient(0deg,var(--bg) 2%,transparent 55%),linear-gradient(180deg,rgba(4,7,11,.7),transparent 30%)}
.phero-red .phero-img{filter:hue-rotate(150deg) saturate(1.3)}
.phero-in{position:relative;padding-top:calc(var(--top) + 120px);padding-bottom:clamp(40px,6vw,72px);display:grid;gap:18px}
.phero-t{display:flex;align-items:center;gap:18px;font-size:clamp(44px,8vw,120px);line-height:.92;letter-spacing:-.05em;font-weight:600;max-width:14ch}
.phero-ico{display:grid;place-items:center;width:clamp(44px,5vw,64px);height:clamp(44px,5vw,64px);flex:none;border-radius:18px;border:1px solid rgba(87,217,255,.35);background:rgba(87,217,255,.08);color:var(--accent)}
.phero-chips{display:flex;gap:8px;flex-wrap:wrap}
.phero-scan{position:absolute;left:0;right:0;height:1px;bottom:0;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.6}
.page-body{display:grid;gap:clamp(34px,5vw,64px);padding-top:clamp(26px,4vw,48px)}
.page-body>*{min-width:0}
.sblock .shead{margin-bottom:22px}
.notice{display:flex;gap:10px;align-items:flex-start;padding:14px 18px;border-radius:16px;border:1px solid var(--line);background:rgba(87,217,255,.05);color:var(--muted);font-size:14px}
.notice .ico{color:var(--accent);margin-top:2px}

/* storm page */
.sstage{position:relative;min-height:100svh;display:grid;place-items:center;text-align:center;overflow:hidden;margin-top:calc(-1 * (var(--top) + 38px));isolation:isolate}
.sstage-bg{position:absolute;inset:0;z-index:-2;transition:background 1s}
.sstage-rings{position:absolute;inset:0;z-index:-1;display:grid;place-items:center}
.sstage-rings i{position:absolute;width:min(90vmin,900px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(87,217,255,.12);animation:ripple 6s linear infinite}
.sstage-rings i:nth-child(2){animation-delay:-1.5s} .sstage-rings i:nth-child(3){animation-delay:-3s} .sstage-rings i:nth-child(4){animation-delay:-4.5s}
@keyframes ripple{from{transform:scale(.2);opacity:1}to{transform:scale(1.4);opacity:0}}
.sstage-in{display:grid;justify-items:center;gap:20px;padding-top:calc(var(--top) + 80px);padding-bottom:60px}
.sstage-band{font-family:var(--mono);font-size:clamp(18px,2vw,24px);text-transform:uppercase;letter-spacing:.1em}
.sstage-kv{display:flex;gap:clamp(20px,5vw,64px);flex-wrap:wrap;justify-content:center}
.sstage-kv p{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.14em}
.sstage-kv b{font-family:var(--mono);font-size:clamp(22px,2.6vw,34px);font-weight:500}
.spectrum{display:grid;gap:16px}
.spec-bar{display:flex;height:16px;border-radius:99px;overflow:hidden;gap:2px;background:rgba(148,163,184,.08)}
.spec-bar i{transition:flex 1s var(--ease)}
.spec-l{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.spec-l div{display:grid;gap:2px}
.spec-l b{font-family:var(--mono);font-size:clamp(26px,3vw,40px);font-weight:500;line-height:1}
.spec-l span{font-size:12.5px;color:var(--muted)} .spec-l small{font-family:var(--mono);color:var(--dim);font-size:11px}
.comps{display:grid;gap:14px;padding:24px;border-radius:22px;border:1px solid var(--line);background:rgba(10,16,25,.5)}
.comp{display:grid;grid-template-columns:minmax(120px,200px) 1fr 44px;gap:16px;align-items:center;font-size:13.5px;color:var(--muted)}
.comp b{font-family:var(--mono);text-align:end;color:var(--ink);font-weight:500}
.comp-bar{height:8px;border-radius:8px;background:rgba(148,163,184,.1);overflow:hidden}
.comp-bar i{display:block;height:100%;border-radius:8px;box-shadow:0 0 14px currentColor;transition:width 1.2s var(--ease)}
.srank{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.sr{position:relative;display:grid;gap:12px;padding:18px 20px;border-radius:20px;border:1px solid var(--line);background:rgba(12,20,31,.55);overflow:hidden;transition:border-color .3s,transform .4s var(--ease)}
.sr:hover{border-color:color-mix(in srgb,var(--c) 55%,transparent);transform:translateY(-3px)}
.sr-id{display:flex;align-items:center;gap:12px}
.sr-id span{display:grid}
.sr-id small{font-size:12px;color:var(--muted)}
.sr-s{position:absolute;inset-inline-end:20px;top:18px;display:grid;justify-items:end;color:var(--c)}
.sr-s b{font-family:var(--mono);font-size:28px;font-weight:500;line-height:1}
.sr-s small{font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.sr-ls,.lsrow{display:flex;justify-content:space-between;gap:10px;font-size:12px}

/* markets */
.mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.mtile{position:relative;display:grid;gap:10px;align-content:end;min-height:250px;padding:24px;border-radius:26px;border:1px solid var(--line);background:linear-gradient(160deg,color-mix(in srgb,var(--c) 12%,rgba(12,20,31,.7)),rgba(6,10,16,.7) 70%);overflow:hidden;transform-style:preserve-3d;transition:transform .5s var(--ease),border-color .4s;will-change:transform}
.mtile:hover{border-color:color-mix(in srgb,var(--c) 55%,transparent)}
.mtile.feat{grid-column:span 2;grid-row:span 2;min-height:520px;padding:34px}
.mt-glow{position:absolute;width:70%;aspect-ratio:1;inset-inline-end:-20%;top:-25%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 45%,transparent),transparent 70%);filter:blur(20px);pointer-events:none}
.mt-ghost{position:absolute;inset-inline-end:-6%;bottom:-8%;font-size:clamp(80px,9vw,140px);font-weight:700;letter-spacing:-.08em;line-height:1;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--c) 30%,transparent);pointer-events:none}
.mtile.feat .mt-ghost{font-size:clamp(140px,18vw,300px)}
.mt-top{position:absolute;top:22px;inset-inline:22px;display:flex;justify-content:space-between;align-items:flex-start;transform:translateZ(40px)}
.mt-arrow{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);color:var(--muted);transition:.4s var(--ease)}
.mtile:hover .mt-arrow{background:var(--ink);color:#05080d;transform:rotate(45deg)}
.mt-sym{font-size:clamp(28px,3vw,40px);font-weight:600;letter-spacing:-.04em;line-height:1;transform:translateZ(30px)}
.mtile.feat .mt-sym{font-size:clamp(60px,8vw,120px)}
.mt-price{font-size:13px;color:var(--muted)}
.mt-v{font-size:clamp(20px,2vw,28px);transform:translateZ(20px)}
.mtile.feat .mt-v{font-size:clamp(34px,4vw,56px)}
.mt-storm{display:grid;gap:6px;font-size:12px;color:var(--b)}
.mt-meter{height:4px;border-radius:4px;background:rgba(148,163,184,.12);overflow:hidden}
.mt-meter i{display:block;height:100%;background:var(--b);box-shadow:0 0 12px var(--b);transition:width 1.2s var(--ease)}

/* market detail */
.mhero{position:relative;min-height:clamp(380px,58vh,560px);display:flex;align-items:flex-end;overflow:hidden;margin-top:calc(-1 * (var(--top) + 38px));isolation:isolate}
.mhero-in{display:grid;gap:12px;padding-top:calc(var(--top) + 110px);padding-bottom:clamp(30px,5vw,60px)}
.back{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);width:max-content}
.back:hover{color:var(--accent)}
.mhero-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.mhero-price{font-size:clamp(40px,7vw,96px);letter-spacing:-.06em;line-height:1;background:linear-gradient(180deg,#fff,#9fb7cc);-webkit-background-clip:text;background-clip:text;color:transparent}
.triple,.tiles3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mstorm{display:flex;align-items:center;gap:28px;padding:26px;border-radius:24px;border:1px solid var(--line);background:rgba(12,20,31,.55)}
.mstorm-r{flex:1;display:grid;gap:12px}
.mfeed{display:grid;border-top:1px solid var(--line)}
.mrow,.hi{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 4px 14px 16px;border-bottom:1px solid var(--line)}
.mrow::before,.hi::before{content:"";position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:3px;border-radius:3px;background:var(--short)}
.mrow.is-l::before,.hi.is-l::before{background:var(--long)}

/* heat */
.heat{display:grid;gap:16px}
.heat .shead{margin-bottom:0}
.zoom{display:flex;gap:8px}
.heat-ref{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.heat-ref b{font-family:var(--mono);color:var(--ink)}
.heat-vp{position:relative;overflow:hidden;border-radius:22px;border:1px solid var(--line);background:linear-gradient(90deg,rgba(54,214,176,.03),rgba(255,102,122,.04)),rgba(6,10,16,.7);padding:16px;cursor:grab;touch-action:pan-y;min-height:160px}
.heat-vp.grab{cursor:grabbing}
.heat-rows{display:grid;gap:8px;transform-origin:left center;transition:transform .15s}
[dir=rtl] .heat-rows{transform-origin:right center}
.hrow{display:grid;grid-template-columns:minmax(150px,220px) 1fr auto;gap:14px;align-items:center;padding:8px 10px;border-radius:12px;animation:fadein .7s var(--ease) both;animation-delay:calc(var(--i)*.03s)}
.hrow.cur{background:rgba(87,217,255,.07);outline:1px solid rgba(87,217,255,.3)}
.hp{font-family:var(--mono);font-size:12px;color:var(--muted);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hp em{font-style:normal;font-family:var(--sans);font-size:10.5px;padding:2px 7px;border-radius:99px;background:var(--accent);color:#031118}
.hb{height:14px;border-radius:7px;background:rgba(148,163,184,.08);overflow:hidden}
.hb span{display:block;height:100%;width:var(--d);border-radius:7px;background:linear-gradient(90deg,#36D6B0,#57D9FF);transition:width 1s var(--ease)}
.hb span.hot{background:linear-gradient(90deg,#FF9F43,#FF667A);box-shadow:0 0 14px -2px #FF9F43}
.hv{display:flex;gap:12px;font-size:11.5px;white-space:nowrap}
.est{padding:24px;border-radius:22px;border:1px dashed var(--line2);background:rgba(10,16,25,.4);display:grid;gap:14px}
.est h2{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600}
.est-meta{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.ladder{display:grid;gap:4px}
.lz{font-size:11px;text-transform:uppercase;letter-spacing:.14em;margin:8px 0 4px}
.lrow{display:grid;grid-template-columns:110px 1fr auto;gap:12px;align-items:center;font-size:12px;font-family:var(--mono)}
.lb{height:10px;border-radius:5px;background:rgba(148,163,184,.07);overflow:hidden}
.lb span{display:block;height:100%;width:var(--d);opacity:var(--o);border-radius:5px;background:linear-gradient(90deg,#FF9F43,#FF667A)}
.lrow.s .lb span{background:linear-gradient(90deg,#36D6B0,#57D9FF)}
.lcur{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin:8px 0;font-size:12px;color:var(--accent)}
.lcur span{height:1px;background:linear-gradient(90deg,transparent,var(--accent))} .lcur span:last-child{background:linear-gradient(90deg,var(--accent),transparent)}

/* cascade */
.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.rule b{font-size:clamp(34px,4.5vw,64px)}
.rule small{font-family:var(--mono);color:var(--dim)}
.alerts{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.alert{position:relative;display:grid;gap:16px;padding:22px;border-radius:24px;border:1px solid color-mix(in srgb,var(--c) 45%,transparent);background:linear-gradient(160deg,color-mix(in srgb,var(--c) 12%,rgba(12,20,31,.6)),rgba(6,10,16,.7));overflow:hidden;animation:fadein .8s var(--ease) both;animation-delay:calc(var(--i)*.08s)}
.alert.sev{animation:fadein .8s var(--ease) both,alarm 2.4s 1s ease-in-out infinite}
@keyframes alarm{50%{box-shadow:0 0 0 1px var(--c),0 0 60px -10px var(--c)}}
.alert-h{display:flex;align-items:center;gap:14px}
.alert-h>div{flex:1}
.alert-a{font-size:22px;font-weight:600}
.alert-s{padding:6px 12px;border-radius:99px;font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.1em;color:var(--c);background:color-mix(in srgb,var(--c) 12%,transparent);box-shadow:0 0 18px -6px var(--c)}
.alert-d{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:13px;padding:14px;border-radius:16px;background:rgba(4,7,11,.5)}
.alert-d dt{color:var(--muted)} .alert-d dd{text-align:end} .alert-d small{color:var(--dim)}
.calm{display:grid;justify-items:center;gap:14px;padding:70px 20px;border-radius:26px;border:1px dashed var(--line2);color:var(--muted);text-align:center}
.calm .ico{color:var(--short)}

/* exchanges */
.xlist{display:grid;gap:14px}
.xrow{position:relative;display:grid;gap:14px;padding:24px 26px 22px 90px;border-radius:24px;border:1px solid var(--line);background:rgba(12,20,31,.55);overflow:hidden}
.x-rank{position:absolute;inset-inline-start:24px;top:20px;font-family:var(--serif);font-style:italic;font-size:48px;line-height:1;color:var(--dim)}
.x-head{display:flex;align-items:center;gap:14px}
.x-head>div{flex:1}
.x-head h2{font-size:24px;letter-spacing:-.03em}
.x-badge{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(140deg,var(--accent),#1b6f8a);color:#031118;font-weight:700;font-size:20px}
.x-total{font-size:clamp(22px,3vw,40px)}
.x-track{height:6px;border-radius:6px;background:rgba(148,163,184,.08);overflow:hidden}
.x-track span{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,var(--accent),rgba(87,217,255,.25));box-shadow:0 0 16px var(--accent);border-radius:6px;animation:growX 1.4s var(--ease) both}
@keyframes growX{from{width:0}}
.x-kv{display:flex;gap:28px;flex-wrap:wrap}
.x-kv span{display:grid}
.x-kv small{font-size:11.5px;color:var(--muted)}
.x-kv b{font-family:var(--mono);font-weight:500;font-size:18px}

/* history */
.hmajor{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.hm{position:relative;display:grid;gap:6px;padding:16px;border-radius:18px;border:1px solid var(--line);background:rgba(12,20,31,.55);text-align:start;transition:border-color .3s,transform .4s var(--ease)}
.hm:hover{transform:translateY(-3px);border-color:var(--line2)}
.hm.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 20px 40px -20px var(--accent)}
.hm .money{font-size:22px}
.hm.is-l .money{color:#ffc0c9} .hm.is-s .money{color:#b5f5e3}
.hm-id{display:flex;align-items:center;gap:8px}
.ctx{padding:24px;border-radius:24px;border:1px solid rgba(87,217,255,.35);background:linear-gradient(140deg,rgba(87,217,255,.08),rgba(8,13,20,.6))}
.ctx-h{font-size:14px;color:var(--muted);margin-bottom:16px}
.ctx-h b{color:var(--ink);font-size:18px;margin-inline-end:8px}
.ctx-g{display:grid;grid-template-columns:1fr auto 1fr 1fr;gap:16px;align-items:center}
.ctx-g span{display:grid;gap:4px}
.ctx-g small{font-size:12px;color:var(--muted)}
.ctx-g .money,.ctx-g b{font-size:26px;font-family:var(--mono);font-weight:500}
.ctx-mid{color:var(--accent)}
.hitems{display:grid;border-top:1px solid var(--line)}
.hi>div:nth-child(2){flex:1;min-width:0}
.hi-v{text-align:end}
.hi-v .money{font-size:18px}

/* about / privacy */
.lead-xl{font-size:clamp(22px,2.8vw,38px);line-height:1.3;letter-spacing:-.02em;max-width:30ch;font-weight:400}
.story{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.chap{position:relative;display:grid;gap:14px;align-content:start;padding:32px;border-radius:28px;border:1px solid var(--line);background:linear-gradient(160deg,color-mix(in srgb,var(--c) 9%,rgba(12,20,31,.65)),rgba(6,10,16,.7));overflow:hidden}
.chap:nth-child(1){grid-column:1/8}
.chap:nth-child(2){grid-column:8/13;margin-top:80px}
.chap:nth-child(3){grid-column:3/11}
.chap-n{position:absolute;inset-inline-end:24px;top:10px;font-family:var(--serif);font-style:italic;font-size:110px;line-height:1;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--c) 40%,transparent)}
.chap-i{display:grid;place-items:center;width:48px;height:48px;border-radius:16px;color:var(--c);border:1px solid color-mix(in srgb,var(--c) 40%,transparent);background:color-mix(in srgb,var(--c) 10%,transparent)}
.chap h2{font-size:26px;letter-spacing:-.03em}
.chap p{color:var(--muted);line-height:1.7}
.statuses{display:flex;flex-wrap:wrap;gap:8px}
.pledges{display:grid;gap:0;border-top:1px solid var(--line)}
.pledges li{display:grid;grid-template-columns:80px 56px 1fr;gap:18px;align-items:center;padding:clamp(22px,3vw,36px) 0;border-bottom:1px solid var(--line);transition-delay:calc(var(--i)*.06s)}
.pl-n{font-family:var(--serif);font-style:italic;font-size:48px;color:var(--dim);line-height:1}
.pl-i{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;color:var(--c);border:1px solid color-mix(in srgb,var(--c) 40%,transparent);background:color-mix(in srgb,var(--c) 10%,transparent)}
.pledges p{font-size:clamp(17px,1.8vw,24px);line-height:1.45;letter-spacing:-.01em}
.nf{min-height:70vh;display:grid;align-content:center;gap:18px;padding-top:calc(var(--top) + 60px)}
.nf-code{font-family:var(--serif);font-style:italic;font-size:clamp(120px,20vw,260px);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(87,217,255,.5)}
.nf .btn{width:max-content}

/* footer */
.foot{position:relative;padding:clamp(80px,10vw,140px) 0 calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#020406;overflow:hidden}
.foot-mark{font-size:clamp(48px,10.2vw,190px);font-weight:700;letter-spacing:-.07em;line-height:.85;color:transparent;-webkit-text-stroke:1px rgba(148,163,184,.18);white-space:nowrap;margin-bottom:clamp(40px,6vw,80px);background:linear-gradient(90deg,rgba(87,217,255,.25),rgba(54,214,176,.15),rgba(255,102,122,.25));-webkit-background-clip:text;background-clip:text}
.foot-grid{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:40px}
.foot-b{display:flex;gap:12px;align-items:flex-start}
.foot-b p{display:flex;align-items:center;gap:6px;margin-top:4px}
.foot-d{font-size:13px;line-height:1.7;color:var(--muted)}
.foot-n{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;font-size:13.5px;color:var(--muted);align-content:start}
.foot-n a:hover{color:var(--accent)}
.foot-tag{margin-top:60px;font-size:13px;color:var(--dim)} .foot-tag .serif{color:var(--accent);font-size:16px}

/* sheets */
.sheet-wrap{position:fixed;inset:0;z-index:110;display:grid;place-items:center;padding:20px}
.sheet-bg{position:absolute;inset:0;background:rgba(2,4,7,.7);backdrop-filter:blur(6px);opacity:0;transition:opacity .35s}
.sheet{position:relative;width:min(480px,100%);max-height:86vh;overflow:auto;padding:26px;border-radius:28px;border:1px solid var(--line2);background:linear-gradient(170deg,#0f1a28,#070c13);box-shadow:0 50px 120px -30px #000;outline:0;transform:translateY(30px) scale(.97);opacity:0;transition:transform .45s var(--ease),opacity .35s}
.sheet-wrap.on .sheet-bg{opacity:1} .sheet-wrap.on .sheet{transform:none;opacity:1}
.sheet-x{position:absolute;inset-inline-end:16px;top:16px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);color:var(--muted)}
.sheet-h{display:flex;align-items:center;gap:14px;margin-bottom:18px;padding-inline-end:40px}
.sheet-h h3,.sheet-title{font-size:20px;font-weight:600}
.sheet-title{margin-bottom:18px}
.sheet-h p{font-size:13px;color:var(--muted)}
.sheet-big{font-family:var(--mono);font-size:48px;letter-spacing:-.05em;line-height:1;margin-bottom:18px}
.dl{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;font-size:13.5px;padding:16px;border-radius:18px;background:rgba(4,7,11,.6)}
.dl dt{color:var(--muted)} .dl dd{text-align:end;font-family:var(--mono);font-size:12.5px;word-break:break-all}

/* =================== FILM =================== */
#film{position:fixed;inset:0;z-index:300;background:#020407;--r:0px}
#film:empty,#film.done{display:none}
#film canvas{position:absolute;inset:0}
#film.reveal{-webkit-mask-image:radial-gradient(circle at 50% 46%,transparent var(--r),#000 calc(var(--r) + 1px));mask-image:radial-gradient(circle at 50% 46%,transparent var(--r),#000 calc(var(--r) + 1px));animation:iris .75s var(--ease2) forwards}
@property --r{syntax:"<length>";inherits:false;initial-value:0px}
@keyframes iris{to{--r:150vmax}}
#film.gone{animation:iris .75s var(--ease2) forwards,filmout .8s .1s forwards;pointer-events:none}
@keyframes filmout{to{opacity:0}}
.film-bars i{position:absolute;left:0;right:0;height:11vh;background:#000;z-index:2;transition:transform 1s var(--ease2)}
.film-bars i:first-child{top:0} .film-bars i:last-child{bottom:0}
#film.reveal .film-bars i:first-child{transform:translateY(-100%)} #film.reveal .film-bars i:last-child{transform:translateY(100%)}
.film-ui{position:absolute;inset:0;z-index:3;pointer-events:none}
.film-c{position:absolute;font-size:10.5px;letter-spacing:.24em;color:rgba(200,220,240,.55);display:flex;align-items:center;gap:8px}
.film-c.tl{left:var(--gut);top:calc(11vh + 18px)} .film-c.tr{right:var(--gut);top:calc(11vh + 18px);letter-spacing:.1em} .film-c.bl{left:var(--gut);bottom:calc(11vh + 18px)}
.film-rec{width:7px;height:7px;border-radius:50%;background:var(--long);box-shadow:0 0 10px var(--long);animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.film-skip{pointer-events:auto;position:absolute;right:var(--gut);bottom:calc(11vh + 12px);display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:99px;border:1px solid rgba(200,220,240,.25);background:rgba(2,4,7,.5);color:rgba(230,240,250,.85);font-size:12px;backdrop-filter:blur(8px);transition:border-color .3s}
.film-skip:hover{border-color:var(--accent);color:var(--accent)}
.film-text{position:absolute;left:0;right:0;bottom:calc(11vh + 70px);display:grid;justify-items:center;gap:10px;text-align:center;padding:0 var(--gut)}
.film-l1{font-size:clamp(26px,4.6vw,64px);font-weight:600;letter-spacing:-.04em;line-height:1}
.film-l2{font-size:clamp(22px,3.4vw,46px);line-height:1;background:linear-gradient(90deg,var(--accent),var(--short),var(--long));-webkit-background-clip:text;background-clip:text;color:transparent}
.fw{display:inline-block;opacity:0;filter:blur(14px);transform:translateY(18px) scale(1.06);animation:fw .9s var(--ease) forwards}
.film-l1 .fw{animation-delay:calc(1.25s + var(--i)*.12s)}
.film-l2 .fw{animation-delay:calc(2.35s + var(--i)*.1s)}
@keyframes fw{to{opacity:1;filter:none;transform:none}}
.film-text{animation:textout .6s 3.55s var(--ease) forwards}
@keyframes textout{to{opacity:0;transform:translateY(-20px);filter:blur(8px)}}
.film-mark{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:16px;opacity:0;animation:mark 1s 3.6s var(--ease) forwards}
.film-mark b{font-size:clamp(20px,3vw,34px);letter-spacing:.42em;text-transform:uppercase;font-weight:500;padding-inline-start:.42em;text-shadow:0 0 30px rgba(87,217,255,.6)}
@keyframes mark{from{opacity:0;letter-spacing:.9em;filter:blur(10px)}to{opacity:1;filter:none}}
.film-prog{position:absolute;left:0;right:0;bottom:11vh;height:2px;background:rgba(255,255,255,.06);z-index:4}
.film-prog i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--short),var(--long));transform-origin:0 50%;transform:scaleX(0)}
#film.still .fw,#film.still .film-mark{animation:none;opacity:1;filter:none;transform:none}
#film.still .film-mark{transform:translate(-50%,-50%);top:30%}
#film.still .film-text{animation:none}

/* =================== RESPONSIVE =================== */
@media (max-width:1180px){
  .pnav{display:none}
  .pnav+.top-act{margin-inline-start:auto}
  .mgrid{grid-template-columns:repeat(2,1fr)}
  .stormx-grid,.riskx-grid{grid-template-columns:1fr}
  .stormx-g{flex-direction:row;align-items:center;flex-wrap:wrap}
  .riskx-score{justify-items:center;text-align:center;order:-1}
  .riskx-radar{max-width:640px;margin:0 auto;width:100%}
  .foot-grid{grid-template-columns:1fr 1fr} .foot-d{grid-column:1/-1;order:3}
}
@media (max-width:900px){
  .tape-grid{grid-template-columns:1fr}
  .tape-side{position:static;display:flex;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;gap:10px}
  .tape-side .shead{flex:1 1 100%}
  .tape-count{font-size:64px}
  .story{grid-template-columns:1fr}
  .chap:nth-child(n){grid-column:auto;margin-top:0}
}
@media (max-width:759px){
  :root{--top:58px;--r:18px}
  body{font-size:14.5px;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .top-in{padding-inline-end:max(8px, env(safe-area-inset-right))}
  .brand small{display:none}
  .brand b{font-size:14.5px}
  .lang-btn span{display:none}
  .lang-btn{width:40px;padding:0;justify-content:center}
  .top-act .rbtn{width:38px;height:38px}
  .live-in{height:34px;gap:10px;font-size:12px}
  .srcs-in{display:none}
  .lang-pop{position:fixed;left:12px;right:12px;width:auto;top:calc(var(--top) + 8px)}
  .grain{opacity:.05}
  .cursor{display:none}
  /* dock */
  .dock{display:block;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:50;border-radius:24px;border:1px solid var(--line2);background:rgba(7,12,19,.86);backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);box-shadow:0 20px 50px -10px #000}
  .dock ul{display:grid;grid-template-columns:repeat(5,1fr);padding:6px}
  .dock a{display:grid;justify-items:center;gap:3px;padding:6px 2px;font-size:10.5px;color:var(--muted);border-radius:18px;transition:color .3s}
  .dock-i{display:grid;place-items:center;width:34px;height:28px;border-radius:99px;transition:background .4s var(--ease),color .3s,box-shadow .4s}
  .dock a[aria-current=page]{color:var(--ink)}
  .dock a[aria-current=page] .dock-i{background:var(--accent);color:#031118;box-shadow:0 0 18px -4px var(--accent)}
  .dock a span:last-child{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .menu{grid-template-columns:1fr}
  .menu-img{position:absolute;inset:0;opacity:.18;mask-image:none;-webkit-mask-image:none}
  .menu-in{position:relative;justify-content:flex-start;padding-top:calc(var(--top) + 30px);padding-bottom:110px}
  .menu-list a{font-size:28px}
  /* hero — re-composed for portrait */
  .hero{align-items:stretch;min-height:auto}
  .hero-globe{right:50%;top:calc(var(--top) + 12px);width:130vw;transform:translate3d(50%,calc(var(--p)*80px),0) scale(calc(1 + var(--p)*.2))}
  [dir=rtl] .hero-globe{left:auto;right:50%}
  .hero-vig,[dir=rtl] .hero-vig{background:linear-gradient(180deg,transparent 25%,rgba(4,7,11,.7) 52%,var(--bg) 78%)}
  .hero-in{padding-top:calc(var(--top) + 34px + 70vw);padding-bottom:40px;gap:20px}
  .hero-mini .hero-in{padding-top:calc(var(--top) + 34px + 62vw)}
  .h1a{font-size:clamp(40px,12.4vw,62px)}
  .h1b{font-size:clamp(24px,7.4vw,36px)}
  .instr{padding:18px;border-radius:20px}
  .instr-v{font-size:clamp(44px,15vw,64px)}
  .scroll-cue{display:none}
  .grid,.hero-grid{display:none}
  /* control dock */
  .ctrl-in{gap:8px;padding-block:8px}
  .ctrl .filters{gap:8px;overflow-x:auto;scrollbar-width:none}
  .ctrl .filters::-webkit-scrollbar{display:none}
  .ctrl .seg,.ctrl .chips{flex:none}
  .ctrl .chips{max-width:none}
  .ctrl-b .btn span{display:none}
  .ctrl-b .btn{width:40px;padding:0}
  .inline-f .filters{flex-direction:column;align-items:stretch}
  .inline-f .fmore{display:grid;grid-template-columns:1fr 1fr}
  .inline-f .fsel select,.inline-f .fsel input{max-width:none;width:100%}
  /* dial becomes a horizontal scale */
  .dial-row{grid-template-columns:repeat(3,1fr);height:auto;row-gap:24px;border-bottom:0}
  .dial-row::before{display:none}
  .dcol{height:150px}
  /* duel: stacked tug-of-war */
  .duel-stage{flex-direction:column;min-height:auto}
  .side{padding:34px 22px;min-height:min(34vh,280px)}
  .side-l{flex:0 0 auto;min-height:calc(var(--w)*5.2)}
  .side-s{text-align:start;justify-content:flex-start}
  .side-s .side-h{margin-inline-start:0}
  .seam{display:none}
  .trio{grid-template-columns:repeat(3,1fr);gap:8px}
  .stat{padding:14px}
  .stat p{font-size:11px}
  .stat b{font-size:20px}
  .stormx-g{justify-content:center;text-align:center}
  .stormx-g .sg-meta{justify-items:center}
  .stormx-f,.sfield-wrap{height:340px;border-radius:22px}
  .rrow{grid-template-columns:40px 1fr auto;column-gap:12px;padding:16px}
  .rr-n{font-size:30px}
  .rrow.top{padding:22px 18px}
  .rrow.top .rr-n{font-size:44px}
  .rr-ls{grid-template-columns:1fr 1fr;row-gap:6px}
  .rr-ls .split{grid-column:1/-1}
  .rr-ls .muted{display:none}
  .metrics{grid-template-columns:1fr}
  .radar .rl{font-size:13px}
  .zones-list{padding:16px}
  .phero,.mhero{min-height:62svh}
  .phero-t{font-size:clamp(40px,12vw,64px)}
  .mgrid{grid-template-columns:1fr 1fr;gap:10px}
  .mtile{min-height:200px;padding:16px;border-radius:20px}
  .mtile.feat{min-height:340px;padding:22px}
  .mt-top{top:14px;inset-inline:14px}
  .triple,.tiles3,.rules{grid-template-columns:repeat(3,1fr);gap:8px}
  .tri,.tile,.rule{padding:14px}
  .tri b,.tile b{font-size:17px;word-break:break-all}
  .rule b{font-size:30px}
  .mstorm{flex-direction:column;align-items:stretch;text-align:center}
  .mstorm .gauge{margin:0 auto}
  .hrow{grid-template-columns:1fr;gap:6px}
  .hv{justify-content:space-between}
  .lrow{grid-template-columns:86px 1fr auto}
  .alerts{grid-template-columns:1fr}
  .xrow{padding:20px 18px}
  .x-rank{position:static;font-size:32px}
  .x-head h2{font-size:20px}
  .ctx-g{grid-template-columns:1fr 1fr}
  .ctx-mid{display:none}
  .spec-l{grid-template-columns:repeat(3,1fr);row-gap:16px}
  .comp{grid-template-columns:1fr 40px;gap:6px 12px}
  .comp-bar{grid-column:1/-1;order:3}
  .pledges li{grid-template-columns:44px 1fr;gap:12px}
  .pl-n{font-size:30px}
  .pl-i{display:none}
  .foot-grid{grid-template-columns:1fr}
  .foot-mark{font-size:11.6vw}
  .sheet-wrap{place-items:end center;padding:0}
  .sheet{width:100%;border-radius:28px 28px 0 0;max-height:88vh;padding-bottom:calc(26px + env(safe-area-inset-bottom));transform:translateY(100%)}
  .sheet::before{content:"";display:block;width:44px;height:4px;border-radius:4px;background:var(--line2);margin:-10px auto 16px}
  .film-c.bl{display:none}
  .film-text{bottom:calc(11vh + 64px)}
  .print-card{width:76vw}
  .rail{display:none!important}
}
@media (max-width:420px){
  .trio .stat b{font-size:17px}
  .dcol-w{font-size:16px}
  .sheet-filters .fmore,.inline-f .fmore{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  [data-reveal]{opacity:1;transform:none}
  .h1a .w span,.h1b,.instr{transform:none;opacity:1}
}

/* =================== SAFARI HANDOFF =================== */
.safari-lock{position:fixed;inset:0;z-index:400;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(32px,env(safe-area-inset-top)) 24px max(34px,env(safe-area-inset-bottom));overflow:hidden;background:#04070b;isolation:isolate}
html.safari-hold,html.safari-hold body{overflow:hidden}
html.safari-hold #app,html.safari-hold #film,html.safari-hold .progress,html.safari-hold .grain,html.safari-hold .gate{display:none!important}
.safari-wall{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.safari-sky{position:absolute;inset:0;background:radial-gradient(100% 70% at 50% -12%,rgba(87,217,255,.28),transparent 58%),radial-gradient(80% 60% at 88% 112%,rgba(255,102,122,.22),transparent 60%),radial-gradient(76% 58% at 6% 104%,rgba(54,214,176,.2),transparent 62%),radial-gradient(120% 90% at 50% 50%,transparent 40%,rgba(2,4,7,.65)),linear-gradient(180deg,#071019,#05090f 46%,#03060a 100%)}
.safari-aurora{position:absolute;left:-20%;right:-20%;top:-30%;height:90%;background:conic-gradient(from 210deg at 50% 50%,rgba(87,217,255,.0),rgba(87,217,255,.22),rgba(54,214,176,.18),rgba(255,102,122,.16),rgba(87,217,255,0));filter:blur(70px);opacity:.55;mix-blend-mode:screen;animation:safDrift 18s ease-in-out infinite}
@keyframes safDrift{0%,100%{transform:translate3d(-3%,0,0) rotate(0deg)}50%{transform:translate3d(4%,2%,0) rotate(8deg)}}
.safari-rings{position:absolute;left:50%;top:40%;width:min(132vw,1040px);aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-radial-gradient(circle at center,transparent 0 56px,rgba(87,217,255,.055) 57px 58px);-webkit-mask:radial-gradient(circle,#000 0 34%,transparent 72%);mask:radial-gradient(circle,#000 0 34%,transparent 72%);opacity:.6}
.safari-sweep{position:absolute;left:50%;top:40%;width:min(132vw,1040px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:conic-gradient(from 0deg,rgba(87,217,255,.26),rgba(87,217,255,.04) 20%,transparent 34%);-webkit-mask:radial-gradient(circle,transparent 0 9%,#000 13% 52%,transparent 72%);mask:radial-gradient(circle,transparent 0 9%,#000 13% 52%,transparent 72%);mix-blend-mode:screen;opacity:.75;animation:safSpin 13s linear infinite}
@keyframes safSpin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.safari-grid{position:absolute;inset:-2px;background:linear-gradient(90deg,rgba(148,163,184,.1) 1px,transparent 1px) 0 0/clamp(44px,9vw,82px) 100%,linear-gradient(0deg,rgba(148,163,184,.05) 1px,transparent 1px) 0 0/100% clamp(44px,9vw,82px);-webkit-mask:radial-gradient(130% 96% at 50% 36%,#000 30%,transparent 84%);mask:radial-gradient(130% 96% at 50% 36%,#000 30%,transparent 84%);opacity:.8}
.safari-heat{position:absolute;left:0;right:0;bottom:0;height:48vh;display:flex;align-items:flex-end;gap:2px;padding:0 6px;-webkit-mask:linear-gradient(180deg,transparent 2%,#000 62%);mask:linear-gradient(180deg,transparent 2%,#000 62%);opacity:.92}
.safari-heat i{flex:1;height:var(--h);border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 10%,transparent) 88%);box-shadow:0 0 16px -3px var(--c),0 0 48px -10px var(--c);opacity:.5;transform-origin:bottom;transform:scaleY(.86);animation:safHeat 5s ease-in-out infinite;animation-delay:var(--d)}
@keyframes safHeat{0%,100%{transform:scaleY(.82);opacity:.38}50%{transform:scaleY(1.06);opacity:.82}}
.safari-scan{position:absolute;left:0;right:0;height:40vh;top:-44vh;background:linear-gradient(180deg,transparent,rgba(87,217,255,.12) 48%,rgba(126,227,255,.6) 50%,rgba(87,217,255,.12) 52%,transparent);filter:blur(1px);mix-blend-mode:screen;animation:safScan 6.8s cubic-bezier(.7,0,.2,1) infinite}
@keyframes safScan{0%{transform:translateY(0)}64%{transform:translateY(172vh)}100%{transform:translateY(172vh)}}
.safari-orb{position:absolute;border-radius:50%;filter:blur(66px);opacity:.5;mix-blend-mode:screen;animation:safFloat 12s ease-in-out infinite}
.safari-orb-a{width:48vmin;height:48vmin;left:-12vmin;top:8vmin;background:radial-gradient(circle,rgba(255,102,122,.6),transparent 70%)}
.safari-orb-b{width:56vmin;height:56vmin;right:-18vmin;bottom:2vmin;background:radial-gradient(circle,rgba(54,214,176,.55),transparent 70%);animation-delay:-4s}
@keyframes safFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-28px,0)}}
.safari-grain{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.045;mix-blend-mode:overlay}
@media(prefers-reduced-motion:reduce){.safari-scan{display:none}.safari-orb,.safari-mark i,.so-dot,.safari-heat i,.safari-sweep,.safari-aurora{animation:none}}
.safari-card{position:relative;z-index:1;width:min(30rem,100%);display:flex;flex-direction:column;align-items:center;text-align:center;padding:0;background:none;border:0;box-shadow:none}
.safari-card::after{content:none}
.safari-mark{position:relative;width:104px;height:104px;margin:0 auto 22px;display:grid;place-items:center}
.safari-mark .logo{position:relative;filter:drop-shadow(0 0 26px rgba(87,217,255,.7))}
.safari-mark i{position:absolute;inset:-6px;border-radius:50%;border:1px solid rgba(87,217,255,.3);animation:safPulse 3.4s ease-in-out infinite}
.safari-mark i:last-of-type{inset:-16px;border-color:rgba(255,102,122,.22);animation-delay:-1.7s}
@keyframes safPulse{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.06);opacity:.95}}
.safari-brand{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--accent);opacity:.92}
.safari-lead{margin-top:14px;font-size:clamp(30px,8vw,46px);font-weight:600;line-height:1.08;letter-spacing:-.035em;color:var(--ink);text-shadow:0 2px 40px rgba(0,0,0,.6)}
.safari-note{margin-top:14px;font-family:var(--serif);font-style:italic;font-size:clamp(21px,5.4vw,30px);line-height:1.25;background:linear-gradient(90deg,var(--accent),var(--short) 48%,var(--long));-webkit-background-clip:text;background-clip:text;color:transparent}
.safari-open{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;margin-top:34px;padding:0 30px;border-radius:999px;background:linear-gradient(90deg,var(--accent),#7ee3ff);color:#031118;font-size:15.5px;font-weight:700;text-decoration:none;box-shadow:0 0 42px -6px rgba(87,217,255,.9),0 18px 50px -24px #000;transition:transform .2s var(--ease),filter .2s var(--ease)}
.safari-open:hover{filter:brightness(1.07);transform:translateY(-1px)}
.safari-open:active{transform:translateY(0) scale(.99)}
.so-dot{width:8px;height:8px;border-radius:50%;background:#031118;animation:safDot 1.6s ease-in-out infinite}
@keyframes safDot{0%,100%{opacity:.4}50%{opacity:1}}

/* =================== ENTRY POPUP =================== */
.gate{position:fixed;inset:0;z-index:250;display:grid;place-items:center;padding:20px;perspective:1200px}
.gate-bg{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 45%,rgba(14,40,58,.55),rgba(3,5,8,.86) 70%);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);opacity:0;transition:opacity .7s var(--ease)}
.gate.on .gate-bg{opacity:1}
.gate.out .gate-bg{opacity:0;transition-duration:.8s}
.gate-card{--rx:0deg;--ry:0deg;position:relative;width:min(400px,100%);display:grid;justify-items:center;text-align:center;padding:36px 30px 28px;border-radius:30px;background:linear-gradient(165deg,rgba(20,34,50,.92),rgba(7,12,19,.94) 60%);box-shadow:0 60px 140px -30px rgba(0,0,0,.9),0 0 90px -30px rgba(87,217,255,.45),inset 0 1px 0 rgba(255,255,255,.08);outline:0;overflow:hidden;transform:rotateX(var(--rx)) rotateY(var(--ry)) translateY(40px) scale(.92);opacity:0;filter:blur(8px);transition:transform 1s var(--ease),opacity .7s var(--ease),filter .8s var(--ease)}
.gate.on .gate-card{transform:rotateX(var(--rx)) rotateY(var(--ry));opacity:1;filter:none}
.gate.out .gate-card{transform:translateY(-30px) scale(1.04);opacity:0;filter:blur(10px);transition-duration:.7s}
.gate-border{position:absolute;inset:0;border-radius:inherit;padding:1px;background:conic-gradient(from var(--ga,0deg),rgba(87,217,255,.9),rgba(54,214,176,.2),rgba(255,102,122,.85),rgba(87,217,255,.15),rgba(87,217,255,.9));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:gspin 6s linear infinite;pointer-events:none}
@property --ga{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes gspin{to{--ga:360deg}}
.gate-sheen{position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,0%),rgba(87,217,255,.14),transparent 65%)}
.gate-orb{position:relative;display:grid;place-items:center;width:96px;height:96px;margin-bottom:6px}
.gate-orb i{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(87,217,255,.35);animation:orb 3s var(--ease) infinite}
.gate-orb i:nth-child(2){animation-delay:1s;border-color:rgba(54,214,176,.35)} .gate-orb i:nth-child(3){animation-delay:2s;border-color:rgba(255,102,122,.35)}
@keyframes orb{from{transform:scale(.45);opacity:1}to{transform:scale(1.25);opacity:0}}
.gate-orb .logo{position:relative;filter:drop-shadow(0 0 22px rgba(87,217,255,.7));animation:float 4s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-4px)}}
.gate-eye{font-family:var(--mono);font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent);margin-top:6px;padding-inline-start:.32em}
.gate-t{margin-top:12px;font-size:clamp(26px,6.6vw,32px);line-height:1.08;letter-spacing:-.035em;font-weight:600}
.gw{display:inline-block;opacity:0;transform:translateY(14px);filter:blur(6px)}
.gate.on .gw{animation:fw .8s var(--ease) forwards;animation-delay:calc(.35s + var(--i)*.07s)}
.gate-t2{margin-top:8px;font-size:clamp(20px,5vw,24px);line-height:1.1;background:linear-gradient(90deg,var(--accent),var(--short) 50%,var(--long));-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0}
.gate.on .gate-t2{animation:fadein 1s .85s var(--ease) forwards}
.gate-live{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 16px;width:100%;margin-top:20px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:rgba(4,7,11,.55);font-size:12px;color:var(--muted);min-height:54px;opacity:0}
.gate.on .gate-live{animation:fadein .9s 1.05s var(--ease) forwards}
.gl-st{display:inline-flex;align-items:center;gap:7px;color:var(--c);font-weight:600;font-size:11px;letter-spacing:.1em}
.gl-dot{width:7px;height:7px;border-radius:50%;background:var(--c,#57D9FF);color:var(--c,#57D9FF);animation:ping 1.8s var(--ease) infinite}
.gl-k{display:grid;line-height:1.2;text-align:start}
.gl-k small{font-size:10.5px;color:var(--dim)}
.gl-k b{color:var(--ink);font-size:14px;font-weight:500}
.gate-count{position:relative;display:grid;place-items:center;width:108px;height:108px;margin-top:22px}
.gate-count svg{position:absolute;inset:0;filter:drop-shadow(0 0 10px rgba(87,217,255,.45))}
.gate-num{font-size:36px;font-weight:500;letter-spacing:-.04em}
.gate-num.tick{animation:tick .5s var(--ease)}
@keyframes tick{from{transform:scale(1.35);opacity:.2;filter:blur(4px)}}
.gate-bar{width:100%;height:4px;margin-top:24px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}
.gate-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--short),var(--long));transform-origin:0 50%;transform:scaleX(0);box-shadow:0 0 14px rgba(87,217,255,.6)}
[dir=rtl] .gate-bar i{transform-origin:100% 50%}
@media (prefers-reduced-motion:reduce){.gw,.gate-t2,.gate-live{opacity:1;transform:none;filter:none}}
