
:root{--bg:#05070D;--fg:#EDF2FA;--mu:#8794AA;--ln:rgba(255,255,255,.09);--cd:rgba(255,255,255,.03);--a:#22D3EE;--b:#3B82F6;--g:#34D399;--o:#FB923C;--sf:#0A0F1A;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
:root[data-theme="light"]{--bg:#F6F8FC;--fg:#0A1220;--mu:#56657D;--ln:rgba(10,18,32,.12);--cd:rgba(10,18,32,.03);--sf:#fff}
*{box-sizing:border-box;margin:0}html{scroll-padding-top:80px}
body{background:var(--bg);color:var(--fg);font:400 16px/1.65 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden;display:flex;flex-direction:column}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(var(--ln) 1px,transparent 1px) 0 0/72px 72px,linear-gradient(90deg,var(--ln) 1px,transparent 1px) 0 0/72px 72px;mask:radial-gradient(ellipse 70% 55% at 50% 0,#000,transparent);-webkit-mask:radial-gradient(ellipse 70% 55% at 50% 0,#000,transparent);opacity:.7}
.mono{font-family:var(--mono)}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--ln)}
.nv{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:6px}
.lg{display:flex;align-items:center;gap:9px;font-weight:800;letter-spacing:-.01em;font-size:18px;background:none;border:0;color:var(--fg);cursor:pointer;margin-right:18px}.lg img{height:26px}
.tab{background:none;border:0;color:var(--mu);font:500 14px Inter,system-ui,sans-serif;padding:7px 12px;border-radius:8px;cursor:pointer}.tab:hover{color:var(--fg)}.tab.on{color:var(--fg);background:var(--cd);box-shadow:inset 0 0 0 1px var(--ln)}
.sp{flex:1}
.bt{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ln);background:var(--cd);color:var(--fg);padding:8px 14px;border-radius:10px;font:500 14px Inter,system-ui,sans-serif;cursor:pointer;text-decoration:none;transition:.2s}.bt:hover{border-color:var(--a)}
.bt.p{background:linear-gradient(180deg,#fff,#cfe9f5);color:#04101a;border:0;font-weight:600}.bt.p:hover{box-shadow:0 0 30px rgba(34,211,238,.45)}
kbd{font:500 11px var(--mono);border:1px solid var(--ln);border-radius:5px;padding:1px 6px;color:var(--mu)}
main{max-width:1180px;width:100%;margin:0 auto;padding:0 24px 80px;flex:1 0 auto;display:flex;flex-direction:column}

.rv{opacity:0;transform:translateY(16px);transition:opacity .6s,transform .6s}.rv.in{opacity:1;transform:none}
.pill{display:inline-flex;gap:8px;align-items:center;border:1px solid var(--ln);border-radius:99px;padding:5px 12px;font:500 12px var(--mono);color:var(--mu);background:var(--cd)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--g);box-shadow:0 0 10px var(--g);animation:pl 2s infinite}@keyframes pl{50%{opacity:.35}}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center;padding:84px 0 40px}
h1{font-weight:800;font-size:clamp(40px,6.4vw,78px);line-height:1.02;letter-spacing:-.04em;margin:22px 0 20px}
.gr{background:linear-gradient(90deg,var(--a),var(--b) 60%,#8B5CF6);-webkit-background-clip:text;background-clip:text;color:transparent}
.ld{color:var(--mu);font-size:18px;max-width:540px;margin-bottom:28px}
.row{display:flex;gap:10px;flex-wrap:wrap}
.vis{position:relative;min-height:380px;display:grid;place-items:center}
.halo{position:absolute;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(34,211,238,.28),rgba(59,130,246,.12) 45%,transparent 70%);filter:blur(10px)}
.mas{position:relative;width:260px;animation:fl 5s ease-in-out infinite;}@keyframes fl{50%{transform:translateY(-10px)}}
.term{position:absolute;left:-10%;bottom:-36px;width:270px;background:color-mix(in srgb,var(--sf) 92%,transparent);border:1px solid var(--ln);border-radius:12px;box-shadow:0 24px 60px rgba(0,0,0,.45);font:12px/1.7 var(--mono);overflow:hidden}
.th{display:flex;gap:6px;align-items:center;padding:8px 12px;border-bottom:1px solid var(--ln);color:var(--mu)}.th i{width:8px;height:8px;border-radius:50%;background:var(--ln)}.th span{margin-left:6px}
.term pre{padding:10px 14px;min-height:130px;font:inherit;color:var(--mu);white-space:pre-wrap}.term b{color:var(--g);font-weight:500}.term u{color:var(--a);text-decoration:none}
.mq{overflow:hidden;border-block:1px solid var(--ln);margin:34px 0;mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.mq div{display:flex;gap:44px;width:max-content;padding:14px 0;animation:mq 34s linear infinite;font:500 13px var(--mono);color:var(--mu)}@keyframes mq{to{transform:translateX(-50%)}}
.bn{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.cd{grid-column:span 6;position:relative;border:1px solid var(--ln);background:var(--cd);border-radius:18px;padding:26px;overflow:hidden;transition:border-color .25s}
.cd::before{content:"";position:absolute;inset:0;background:radial-gradient(380px circle at var(--x,50%) var(--y,0),rgba(34,211,238,.13),transparent 60%);opacity:0;transition:.3s;pointer-events:none}.cd:hover::before{opacity:1}.cd:hover{border-color:rgba(34,211,238,.4)}
.s7{grid-column:span 7}.s5{grid-column:span 5}.s4{grid-column:span 4}.s12{grid-column:span 12}.s3{grid-column:span 3}
.lb{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--a);margin-bottom:12px;display:flex;gap:8px;align-items:center}
.lb em{font-style:normal;color:var(--o)}
h2{font-size:clamp(28px,4vw,44px);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:70px 0 10px}h3{font-size:22px;font-weight:600;letter-spacing:-.02em;margin-bottom:8px}
.sb{color:var(--mu);margin-bottom:26px;max-width:620px}
.cd p{color:var(--mu);font-size:15px;margin-bottom:12px}.cd p b{color:var(--fg);font-weight:500}
.tg{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.tg span{font:500 12px var(--mono);color:var(--mu);border:1px solid var(--ln);border-radius:7px;padding:4px 9px}
.st{display:grid;grid-template-columns:1fr 1fr;gap:12px;height:100%}.st div{border:1px solid var(--ln);border-radius:14px;padding:18px;display:flex;flex-direction:column;justify-content:center}.st b{font-size:34px;letter-spacing:-.03em;font-weight:800}.st small{color:var(--mu);font-size:13px}
.tl{border-left:1px solid var(--ln);margin-left:6px}.tl div{position:relative;padding:0 0 26px 28px}.tl div::before{content:"";position:absolute;left:-5px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--a);box-shadow:0 0 14px var(--a)}.tl small{font:500 12px var(--mono);color:var(--g)}.tl h3{font-size:18px;margin:2px 0 4px}.tl p{color:var(--mu);font-size:15px}
.cta{display:grid;grid-template-columns:130px 1fr;gap:26px;align-items:center;margin-top:60px;background:linear-gradient(135deg,rgba(34,211,238,.09),rgba(59,130,246,.05))}.cta img{width:100%;}
.sim{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:20px;align-items:stretch}
.scr{min-height:230px;border:1px solid var(--ln);border-radius:14px;background:radial-gradient(circle at 50% 50%,rgba(34,211,238,.12),transparent 65%),var(--sf);display:grid;place-items:center;position:relative}
.cur{width:0;height:0;border-left:15px solid var(--fg);border-top:9px solid transparent;border-bottom:9px solid transparent;transform:rotate(-28deg);margin-left:6px}
.ring{position:absolute;left:calc(50% - 15px);top:calc(50% - 22px);width:30px;height:30px;border:2px solid var(--a);border-radius:50%;opacity:0}.ring.go{animation:rg .35s ease-out}@keyframes rg{from{opacity:1;transform:scale(.4)}to{opacity:0;transform:scale(2.8)}}
.rd{font:800 44px Inter,system-ui,sans-serif;letter-spacing:-.04em}.rd small{font:400 13px var(--mono);color:var(--mu);margin-left:8px;letter-spacing:0}
input[type=range]{width:100%;accent-color:var(--a);margin:14px 0}
.seg{display:inline-flex;border:1px solid var(--ln);border-radius:10px;overflow:hidden}.seg button{border:0;background:none;color:var(--mu);padding:9px 14px;font:500 13px var(--mono);cursor:pointer}.seg button.on{background:var(--cd);color:var(--a)}
.wv{display:flex;gap:3px;align-items:flex-end;height:36px;margin:6px 0 14px}.wv i{width:4px;background:var(--g);border-radius:2px;animation:w 1.1s ease-in-out infinite}@keyframes w{50%{height:18%}}
.hide{display:none!important}
#pal,#lgm{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);z-index:70;display:none;align-items:flex-start;justify-content:center;padding:14vh 16px 0}#pal.on,#lgm.on{display:flex}.fi{display:block;margin-bottom:10px;border:1px solid var(--ln)!important;border-radius:10px;background:var(--cd)!important}
.pb{width:100%;max-width:560px;background:var(--sf);border:1px solid var(--ln);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden}
.pb input{width:100%;background:none;border:0;border-bottom:1px solid var(--ln);color:var(--fg);padding:16px 18px;font:16px Inter,system-ui,sans-serif;outline:0}
.pi{display:flex;justify-content:space-between;padding:11px 18px;cursor:pointer;font-size:14px}.pi small{font:12px var(--mono);color:var(--mu)}.pi.on{background:var(--cd);color:var(--a)}
.tt{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--sf);border:1px solid var(--g);color:var(--g);padding:11px 16px;border-radius:10px;font:13px var(--mono);transform:translateY(150%);transition:.3s;z-index:80;max-width:88vw}.tt.on{transform:none}
footer{border-top:1px solid var(--ln);text-align:center;color:var(--mu);font:12px var(--mono);padding:26px;margin-top:auto}
.pg{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.pg .cd{grid-column:auto}#spots{grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr))}.pc{padding:0;cursor:pointer}.pc .bd{padding:22px}.pc:hover .cv .bs{transform:translateY(-6px) scale(1.03)}
.cv{position:relative;aspect-ratio:16/9;overflow:hidden;display:flex;align-items:center;padding:0 26px;border-bottom:1px solid var(--ln);background:radial-gradient(ellipse at 72% 45%,hsla(var(--h,190),90%,55%,.32),transparent 62%),linear-gradient(160deg,var(--sf),var(--bg))}
.cv .pv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2}.cv .bg{position:relative;font:800 clamp(30px,5vw,50px)/1 Inter,system-ui,sans-serif;letter-spacing:-.04em;max-width:60%}
.cv .bs{position:absolute;right:3%;bottom:-3%;height:94%;transition:.4s;}.cv .ch{position:absolute;left:26px;bottom:14px;font:500 11px var(--mono);color:var(--mu)}
.cv.lg{aspect-ratio:21/8;border:1px solid var(--ln);border-radius:20px;margin-top:22px}.cv.lg .bg{font-size:clamp(40px,8vw,84px)}
.dt{display:grid;grid-template-columns:1fr 320px;gap:36px;margin-top:34px;align-items:start}.sd{position:sticky;top:84px;display:grid;gap:14px}
.ar h3{font-size:24px;margin:36px 0 12px}.ar h3:first-child{margin-top:0}.ar .tl h3{margin:2px 0 4px}.ar p{color:var(--mu);margin-bottom:12px}
.ck{list-style:none;padding:0;display:grid;gap:9px}.ck li{color:var(--mu);font-size:15px}.ck li::before{content:"✓";color:var(--g);margin-right:10px;font-weight:600}
.ol{padding-left:22px;color:var(--mu);display:grid;gap:8px}.ol li::marker{color:var(--a);font-family:var(--mono)}
.fc{display:grid}.fc div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--ln);font-size:14px}.fc div:last-child{border:0}.fc span{color:var(--mu)}.fc b{font-weight:500;text-align:right}
details{border:1px solid var(--ln);border-radius:12px;padding:13px 16px;margin-bottom:8px;background:var(--cd)}summary{cursor:pointer;font-weight:500}details p{margin:10px 0 0}
.dc{position:absolute;z-index:1}.cu{width:46px;fill:#fff;stroke:var(--a);stroke-width:1.2;filter:drop-shadow(0 0 12px var(--a));left:45%;top:44%}
.r1,.r2{left:calc(45% - 6px);top:calc(44% - 4px);width:30px;height:30px;border:2px solid var(--a);border-radius:50%;animation:rg2 2.2s infinite;opacity:0}.r2{animation-delay:1.1s}@keyframes rg2{from{opacity:.9;transform:scale(.3)}to{opacity:0;transform:scale(3.2)}}
.ch2{font:500 11px var(--mono);padding:4px 9px;border:1px solid var(--ln);border-radius:8px;background:color-mix(in srgb,var(--sf) 82%,transparent);color:var(--a);backdrop-filter:blur(4px);white-space:nowrap}
@media(max-width:860px){.dt{grid-template-columns:1fr}.sd{position:static}.cv.lg{aspect-ratio:16/9}}
@media(max-width:860px){.hero,.sim,.cta{grid-template-columns:1fr}.hero{padding-top:44px}.vis{min-height:320px}.cd,.s7,.s5,.s4,.s3{grid-column:span 12}.tab{padding:7px 8px}.hd{display:none}.cta img{max-width:120px}.term{left:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}

a.tab{text-decoration:none;display:inline-block}a.lg{text-decoration:none}.lg{color:var(--fg)}
.lgp{max-width:440px;width:100%;margin:auto;padding:32px 28px}
.lgp .fi{width:100%;padding:14px 16px;font:16px Inter,system-ui,sans-serif;color:var(--fg);outline:0;border:1px solid var(--ln);background:var(--sf);border-radius:10px;margin-bottom:14px;transition:border-color .2s,box-shadow .2s}
.lgp .fi:focus{border-color:var(--a);box-shadow:0 0 16px rgba(34,211,238,.25)}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-box-shadow:0 0 0 1000px #0A0F1A inset!important;-webkit-text-fill-color:var(--fg)!important;caret-color:var(--fg)!important;transition:background-color 5000s ease-in-out 0s}
.dls{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.pc{color:inherit;text-decoration:none;display:block}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
