:root{--bg:#f3f2ec;--ink:#0d0d0d;--mut:#5f5f59;--lime:#dff25a;--mint:#a8d8b9;--blue:#3347e6;--card:#f8f7f2}
[data-theme=dark]{--bg:#0e0e0d;--ink:#f3f2ec;--mut:#a0a09a;--blue:#5a6bff;--card:#171716}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:500 17px/1.55 'Plus Jakarta Sans',system-ui,sans-serif;transition:background .4s,color .4s;animation:in .5s;overflow-x:hidden}
body.out{opacity:0;transition:opacity .25s}
@keyframes in{from{opacity:0}}
::selection{background:var(--lime);color:#0d0d0d}
a{color:inherit;text-decoration:none}
.mono{font-family:'JetBrains Mono',monospace}
header{position:fixed;inset:0 0 auto;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:16px 40px;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.04em}.brand strong{font-size:18px;white-space:nowrap}.logo{display:block;width:44px;height:44px;line-height:0;border-radius:8px;overflow:hidden}.logo img{width:100%;height:100%;display:block;object-fit:cover}
.nv{display:flex;gap:30px;font-size:16px}.nv a{padding:4px 0;border-bottom:3px solid transparent;transition:.2s}.nv a:hover,.nv a.on{border-color:var(--lime)}
.r{display:flex;align-items:center;gap:18px}
.sw{width:48px;height:27px;border-radius:20px;background:#0d0d0d;border:0;padding:4px;cursor:pointer;display:flex;align-items:center}
.sw u{width:19px;height:19px;border-radius:50%;background:radial-gradient(#0d0d0d 27%,var(--lime) 30%);transition:transform .35s cubic-bezier(.6,-.4,.3,1.4)}
[data-theme=dark] .sw{background:var(--lime)}[data-theme=dark] .sw u{transform:translateX(21px);background:radial-gradient(var(--lime) 27%,#0d0d0d 30%)}
.btn{display:inline-block;padding:14px 26px;border-radius:6px;font:700 16px 'Plus Jakarta Sans',sans-serif;border:0;cursor:pointer;transition:.2s}
.btn:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--lime)}
.k{background:#0d0d0d;color:#f3f2ec}[data-theme=dark] .k{background:var(--ink);color:#0d0d0d}
.bl{background:var(--blue);color:#fff}.bl:hover{box-shadow:5px 5px 0 var(--ink)}
.pg{max-width:1280px;margin:auto;padding:0 40px}
section{padding:140px 0 20px}section+section{padding-top:70px}
.eb{font:600 13px 'JetBrains Mono';display:flex;gap:10px;align-items:center;margin-bottom:18px}.eb:before{content:'';width:10px;height:10px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 2px var(--ink)}
h1,h2{font-weight:800;letter-spacing:-.055em;line-height:.95}
h1{font-size:clamp(44px,8.4vw,118px)}h2{font-size:clamp(32px,5vw,62px);margin-bottom:26px}
.hl{color:#0d0d0d;background:linear-gradient(transparent 60%,var(--lime) 60% 90%,transparent 0)}
.lead{font-size:20px;max-width:560px;margin:22px 0}.mut{color:var(--mut)}
.hero{display:grid;grid-template-columns:1fr 1fr;gap:10px 50px;min-height:100vh;align-items:start}
.hero .rt{text-align:right}.hero .rt h1{margin-top:20px}
.art{overflow:visible;width:100%;max-width:640px;display:block}
.tube path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s cubic-bezier(.6,0,.3,1)}
.on .tube path{stroke-dashoffset:0}.tube{transform:translate(calc(var(--px,0)*14px),calc(var(--py,0)*14px));transition:transform .4s}
.lc{border:2px solid var(--ink);border-radius:36px;padding:24px;background:var(--bg)}
.bar{display:block;height:22px;border:2px solid var(--ink);border-radius:22px;margin:10px 0}
.dz{position:relative;height:330px;margin-top:20px}.dz svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.fc{position:absolute;display:flex;align-items:center;gap:12px;padding:15px 20px;border-radius:16px;font-weight:700;font-size:15px;color:#0d0d0d;cursor:grab;user-select:none;touch-action:none}
.fc:after{content:'';width:34px;height:14px;border:2px solid currentColor;border-radius:14px}
.L{background:var(--lime)}.M{background:var(--mint)}.U{background:var(--blue);color:#fff}
.stats{display:flex;gap:44px;flex-wrap:wrap;margin:30px 0}.stats b{display:block;font-size:48px;font-weight:800;letter-spacing:-.05em;line-height:1}.stats span{font-size:14px;color:var(--mut)}
.gr{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.card{border:2px solid var(--ink);border-radius:30px;padding:28px;background:var(--card);transition:background .25s,color .25s,transform .15s;display:block;position:relative}
a.card:hover,.card.h:hover{background:var(--lime);color:#0d0d0d}
.card h3{font-size:26px;letter-spacing:-.04em;line-height:1.1;margin:8px 0}.card p{font-size:15.5px;color:var(--mut)}a.card:hover p,.card.h:hover p{color:#333}
.card .n{font:600 12px 'JetBrains Mono'}.card .ar{position:absolute;right:24px;top:22px;font-size:24px;transition:.2s}a.card:hover .ar{transform:translate(4px,-4px)}
.ch{display:inline-block;padding:6px 15px;border:2px solid var(--ink);border-radius:30px;font:600 13px 'JetBrains Mono';margin:4px 6px 4px 0;background:none;color:inherit;cursor:pointer;transition:.2s}
.ch:hover,.ch.on{background:var(--lime);color:#0d0d0d}.ch.s{padding:3px 11px;font-size:12px;cursor:default}
.lk a{font:700 14px 'JetBrains Mono';margin-right:18px;border-bottom:2px solid var(--blue)}.lk a:hover{background:var(--lime);color:#0d0d0d}
details{margin:12px 0}summary{cursor:pointer;font:600 13px 'JetBrains Mono'}details ul{margin:10px 0 0 18px;font-size:15px;color:var(--mut)}
.tl{border-left:2px solid var(--ink);padding-left:28px;margin-left:8px}.tl div{position:relative;margin-bottom:34px}.tl div:before{content:'';position:absolute;left:-39px;top:6px;width:18px;height:18px;border-radius:50%;border:2px solid var(--ink);background:var(--lime)}
.tl small{font:600 12px 'JetBrains Mono'}.tl h3{font-size:24px;letter-spacing:-.04em}.tl p,.tl li{color:var(--mut);font-size:15px}.tl ul{margin-left:18px}
.fl{perspective:900px;height:190px;cursor:pointer}.fl>div{position:relative;height:100%;transition:transform .6s;transform-style:preserve-3d}.fl.f>div{transform:rotateY(180deg)}
.fl p{position:absolute;inset:0;backface-visibility:hidden;border:2px solid var(--ink);border-radius:30px;display:grid;place-items:center;text-align:center;padding:20px;font-size:28px;font-weight:800;letter-spacing:-.04em;color:var(--ink)}.fl p+p{transform:rotateY(180deg);background:var(--lime);color:#0d0d0d;font-size:19px}
.big{font:800 clamp(56px,9vw,120px)/1 'Plus Jakarta Sans';letter-spacing:-.06em}
.roll{min-height:150px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:6px}.roll .fc{position:static;cursor:default;animation:pop .45s backwards}
@keyframes pop{from{transform:scale(.4) rotate(-8deg);opacity:0}}
.term{background:#0d0d0d;color:#e9e9e2;border:2px solid var(--ink);border-radius:28px;font:14px/1.55 'JetBrains Mono',monospace;overflow:hidden}
.th{display:flex;gap:7px;align-items:center;padding:12px 18px;border-bottom:1px solid #2a2a28;color:#8d8d86;font-size:12px}.th i{width:11px;height:11px;border-radius:50%;background:#ff5f57}.th i+i{background:#febc2e}.th i+i+i{background:#28c840}.th span{margin-left:10px}
#out{height:470px;overflow:auto;padding:16px 20px}#out .l{white-space:pre-wrap;word-break:break-word;min-height:1.5em}
.p{color:var(--lime)}.e{color:#ff7b7b}.ok{color:#7ee8a2}.d{color:#8d8d86}#out b{color:#fff}#out a{color:var(--lime);text-decoration:underline}
.inp{display:flex;gap:8px;padding:12px 20px;border-top:1px solid #2a2a28}.inp input{flex:1;background:none;border:0;outline:0;color:#fff;font:inherit;caret-color:var(--lime)}
input,textarea{width:100%;background:none;border:2px solid var(--ink);border-radius:18px;padding:14px 18px;color:var(--ink);font:500 16px 'Plus Jakarta Sans';margin-bottom:14px;outline:0}input:focus,textarea:focus{background:var(--card);box-shadow:5px 5px 0 var(--lime)}
.two{display:grid;grid-template-columns:1.1fr .9fr;gap:50px}
.ft{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:34px 40px;border-top:2px solid var(--ink);margin-top:120px;font:500 13px 'JetBrains Mono'}
.b{opacity:0;transform:translateY(18px) scale(.98);filter:blur(6px);transition:opacity .6s,transform .6s,filter .6s,background .25s,color .25s}.b.on{opacity:1;transform:none;filter:none}
@media(max-width:820px){.hero,.two{grid-template-columns:1fr}.hero .rt{text-align:left}.nv{display:none}.pg{padding:0 22px}header{padding:14px 22px}.brand strong{font-size:16px}.ft{padding:26px 22px}}

/* ---- signature cursor ---- */
.mc,.mr{position:fixed;left:0;top:0;z-index:200;pointer-events:none;translate:-50% -50%;opacity:0;transition:opacity .25s}
.mc{width:12px;height:12px;border-radius:50%;background:var(--lime);border:2px solid #0d0d0d;box-shadow:0 0 0 1px #f3f2ec80;transition:opacity .25s,scale .25s}
.mr{width:38px;height:38px;border-radius:50%;border:2px solid var(--ink);display:grid;place-items:center;transition:opacity .25s,width .3s cubic-bezier(.3,1.5,.5,1),height .3s cubic-bezier(.3,1.5,.5,1),background .25s,border-color .25s,scale .2s}
.mr span{font:700 11px 'JetBrains Mono',monospace;color:var(--lime);opacity:0;transition:opacity .2s;white-space:nowrap}
.mc-live .mc,.mc-live .mr{opacity:1}
.mc-hide .mc,.mc-hide .mr{opacity:0}
.mc-hov .mc{scale:0}.mc-hov .mr{width:76px;height:76px;background:#0d0d0d;border-color:var(--lime)}.mc-hov .mr span{opacity:1}
.mc-dn .mr{scale:.82}.mc-dn .mc{scale:1.5}
.mc-on,.mc-on *{cursor:none!important}.mc-on input,.mc-on textarea{cursor:text!important}
@media(hover:none),(pointer:coarse){.mc,.mr{display:none}}
/* ---- dock magnification ---- */
.dk.dk{transition-property:opacity,transform,filter,background,background-color,color,border-color,box-shadow}
.dw{display:inline-block;white-space:nowrap}.dc{display:inline-block}
.ch,.lk a,summary,.ft a{position:relative}.lk a,.ft a{display:inline-block}
/* ---- project visuals ---- */
.vis{position:relative;height:190px;border:2px solid var(--ink);border-radius:20px;overflow:hidden;margin:-4px 0 20px;color:#0d0d0d;font-family:'JetBrains Mono',monospace}
.cr{display:inline-block;width:7px;height:13px;background:var(--lime);vertical-align:-2px;animation:bk 1s steps(1) infinite}
@keyframes bk{50%{opacity:0}}
.v1{background:#0d0d0d;color:#e9e9e2;font-size:11.5px;line-height:1.65}
.v1 .vt{display:flex;gap:6px;align-items:center;padding:9px 14px;border-bottom:1px solid #2a2a28;color:#8d8d86;font-size:10.5px}.v1 .vt i{width:9px;height:9px;border-radius:50%;background:#ff5f57}.v1 .vt i+i{background:#febc2e}.v1 .vt i+i+i{background:#28c840}.v1 .vt span{margin-left:8px}
.v1 pre{font:inherit;padding:10px 14px;white-space:pre;overflow:hidden}.v1 .g{color:#7ee8a2}.v1 .y{color:var(--lime)}.v1 .rd{color:#ff7b7b}
.v1 .vm{position:absolute;left:14px;bottom:12px;display:flex;gap:6px}.v1 em{font-style:normal;font-size:10px;font-weight:700;padding:2px 9px;border:1.5px solid #5a5a55;border-radius:20px;color:#e9e9e2}.v1 em:first-child{background:var(--lime);color:#0d0d0d;border-color:var(--lime)}
.v2{background:#a8d8b9;padding:16px;display:flex;flex-direction:column;gap:12px}
.v2 .vg{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;flex:1}
.v2 .tile{background:#f8f7f2;border:2px solid #0d0d0d;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:9.5px;font-weight:700}
.v2 u{text-decoration:none;width:34px;height:34px;border-radius:50%;background:#0d0d0d;color:#f3f2ec;display:grid;place-items:center;font:800 13px 'Plus Jakarta Sans'}
.v2 u.ai{background:var(--lime);color:#0d0d0d;border:2px solid #0d0d0d}.v2 u.m{background:#3347e6;color:#fff;border-color:#0d0d0d}
.v2 .sp u{animation:sp 1.6s ease-out infinite}@keyframes sp{0%{box-shadow:0 0 0 0 #0d0d0d99}100%{box-shadow:0 0 0 12px #0d0d0d00}}
.v2 .vs{background:#0d0d0d;color:#e9e9e2;border-radius:20px;padding:6px 14px;font-size:10.5px;font-weight:600;display:flex;align-items:center;gap:8px}.v2 .vs b{width:8px;height:8px;border-radius:50%;background:#7ee8a2}
.v3{background:#3347e6;display:flex;gap:18px;align-items:flex-end;justify-content:center;padding:16px 16px 0}
.v3 .pgm{width:130px;height:100%;background:#fff;border:2px solid #0d0d0d;border-bottom:0;border-radius:12px 12px 0 0;padding:12px;display:flex;flex-direction:column;gap:7px;animation:up .8s both}@keyframes up{from{transform:translateY(30px)}}
.v3 .pgm b{display:block;height:11px;width:62%;background:#0d0d0d;border-radius:4px}.v3 .pgm s{display:block;height:6px;width:40%;background:var(--lime);border-radius:4px;margin-top:-2px}
.v3 .cols{display:flex;gap:9px;flex:1}.v3 .sd{width:30%;display:flex;flex-direction:column;gap:6px}.v3 .mn{flex:1;display:flex;flex-direction:column;gap:6px}
.v3 i{display:block;height:5px;background:#d5d4cc;border-radius:3px}.v3 .sd i{background:#c7d0ff}.v3 .mn i:nth-child(3n+1){width:70%}
.v3 .side{display:flex;flex-direction:column;gap:8px;padding-bottom:20px}.v3 .side span{font-size:10.5px;font-weight:700;padding:4px 12px;border-radius:20px;border:1.5px solid #fff;color:#fff;text-align:center}.v3 .side .on{background:var(--lime);color:#0d0d0d;border-color:var(--lime)}
.v4{background:#e8ff4a;display:grid;place-items:center}
.v4 .sl{position:relative;width:68%;height:70%;background:#fff;border:2px solid #0d0d0d;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;box-shadow:5px 5px 0 #0d0d0d}
.v4 .sl b{height:11px;width:55%;background:#0d0d0d;border-radius:4px}.v4 .sl i{height:6px;width:80%;background:#d5d4cc;border-radius:3px}.v4 .sl i+i{width:60%}
.v4 svg{position:absolute;inset:0;width:100%;height:100%}.v4 .an{fill:none;stroke:#f43f5e;stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:dr 3.6s ease-in-out infinite}
@keyframes dr{0%{stroke-dashoffset:1}55%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:-1}}
.v4 .pt{position:absolute;width:14px;height:14px;border-radius:50%;background:#3347e6;border:2px solid #0d0d0d;left:22%;top:58%;animation:pt 3.6s ease-in-out infinite}
@keyframes pt{0%{transform:translate(0,0)}25%{transform:translate(70px,-34px)}55%{transform:translate(150px,-8px)}100%{transform:translate(0,0)}}
.v4 .ar{position:absolute;top:50%;translate:0 -50%;font:800 26px 'Plus Jakarta Sans';opacity:.55}.v4 .l{left:8px}.v4 .r{right:8px}
.v5{background:#f4b6c2;padding:16px;display:flex;flex-direction:column;gap:9px;font-size:12px}
.v5 .in{display:flex;align-items:center;justify-content:space-between;background:#fff;border:2px solid #0d0d0d;border-radius:22px;padding:6px 8px 6px 16px;font-size:13px;font-weight:700}.v5 .in em{font-style:normal;background:#0d0d0d;color:var(--lime);width:24px;height:24px;border-radius:50%;display:grid;place-items:center}
.v5 .tr{display:flex;align-items:center;gap:8px;background:#f8f7f2;border:2px solid #0d0d0d;border-radius:14px;padding:5px 12px;font-weight:600}.v5 .tr span:nth-child(2){margin-left:auto;font-size:10px;background:var(--lime);border-radius:12px;padding:1px 9px;border:1.5px solid #0d0d0d}.v5 .tr b{min-width:52px;text-align:right}
.v5 .tr+.tr{animation:rs 4s ease-out infinite}@keyframes rs{0%{opacity:0;transform:translateY(12px)}20%,90%{opacity:1;transform:none}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.vis *{animation:none!important}.v4 .an{stroke-dashoffset:0}}
/* ---- intro cursors (restored) ---- */
.cur{position:fixed;left:0;top:0;z-index:99;pointer-events:none;transition:transform .9s cubic-bezier(.65,0,.35,1),opacity .4s}.cur svg{width:18px;height:18px;filter:drop-shadow(0 2px 4px #0006)}
.cur b{position:absolute;left:13px;top:15px;font:600 10px 'JetBrains Mono';padding:2px 6px;border-radius:4px;color:#000;white-space:nowrap}
.sel{position:fixed;z-index:98;pointer-events:none;border:1.5px solid #3b82f6;background:#3b82f61a;animation:si .25s}
.sel:before,.sel:after{content:'';position:absolute;width:7px;height:7px;background:#fff;border:1px solid #3b82f6}.sel:before{left:-4px;top:-4px}.sel:after{right:-4px;bottom:-4px}
.sel i{position:absolute;left:-1px;top:-21px;font:10px 'JetBrains Mono';background:#3b82f6;color:#fff;padding:1px 7px;font-style:normal;white-space:nowrap}
@keyframes si{from{opacity:0;transform:scale(.97)}}
#skip{position:fixed;right:18px;bottom:18px;z-index:120;background:var(--bg);color:var(--ink);border:2px solid var(--ink);border-radius:20px;font:12px 'JetBrains Mono';padding:6px 14px;cursor:pointer}
.mc-on #skip{cursor:none!important}
@media(prefers-reduced-motion:reduce){.cur{display:none}}