:root{--bg: #090b10;--bg2: #0e1118;--panel: #121621;--panel2: #171c29;--fg: #eef0f6;--text: #c9cfdc;--dim: #8f98ab;--faint: #5d6679;--line: rgba(255, 255, 255, .085);--line2: rgba(255, 255, 255, .16);--gold: #f2c46d;--gold2: #ffdf9e;--sea: #5fd4e8;--violet: #b59cff;--pink: #ff7ab8;--green: #8be0a4;--red: #ff8a7a;--deeper: var(--sea);--nerd: var(--violet);--serif: Fraunces, Georgia, serif;--sans: Inter, system-ui, -apple-system, sans-serif;--mono: "JetBrains Mono", ui-monospace, Menlo, monospace;--measure: 680px;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}body{margin:0;background:var(--bg);color:var(--text);font:400 17.5px/1.72 var(--sans);overflow-x:hidden}a{color:var(--gold2);text-decoration-color:#ffdf9e59;text-underline-offset:3px}a:hover{text-decoration-color:currentColor}::selection{background:#f2c46d59;color:#fff}code,kbd{font-family:var(--mono);font-size:.86em}:not(pre)>code{background:#ffffff0f;border:1px solid var(--line);border-radius:5px;padding:.08em .36em;color:#e6e9f2}strong{color:var(--fg);font-weight:600}em{color:var(--fg)}.bar{position:fixed;inset:0 0 auto;z-index:50;height:54px;display:flex;align-items:center;gap:14px;padding:0 18px;background:linear-gradient(to bottom,#090b10eb,#090b10b8);-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);border-bottom:1px solid transparent;transition:border-color .3s}.bar.scrolled{border-bottom-color:var(--line)}.bar a.back{display:inline-flex;align-items:center;gap:7px;color:var(--fg);text-decoration:none;font:600 13px var(--sans);padding:7px 12px 7px 10px;border:1px solid var(--line2);border-radius:999px;white-space:nowrap}.bar a.back:hover{background:#ffffff0f}.bar a.back svg{width:14px;height:14px}.bar .title{font:600 15px var(--serif);color:var(--fg);letter-spacing:.01em;opacity:0;transform:translateY(4px);transition:opacity .3s,transform .3s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bar.scrolled .title{opacity:1;transform:none}.bar .grow{flex:1}.bar .gh{color:var(--dim);display:inline-flex;padding:6px;border-radius:8px}.bar .gh:hover{color:var(--fg);background:#ffffff0f}.bar .gh svg{width:20px;height:20px}.progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--sea),var(--gold) 60%,var(--pink))}.depth{display:inline-flex;padding:3px;border:1px solid var(--line2);border-radius:999px;background:#ffffff08}.depth button{all:unset;cursor:pointer;font:600 12px var(--sans);padding:5px 11px;border-radius:999px;color:var(--dim);white-space:nowrap}.depth button:hover{color:var(--fg)}.depth button[aria-pressed=true]{background:var(--fg);color:#0b0d12}.depth button:focus-visible{outline:2px solid var(--gold);outline-offset:1px}.depth-label{font:600 11px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}@media(max-width:720px){.bar .title,.depth-label{display:none}.depth button{padding:5px 8px}.bar{gap:8px;padding:0 10px}}@media(max-width:420px){.bar a.back span{display:none}}.hero{position:relative;min-height:100svh;display:grid;place-items:center;overflow:hidden;isolation:isolate}.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}.hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 70% 55% at 50% 48%,#090b10c7,#090b1040 70%,#090b101a),linear-gradient(to bottom,transparent 70%,var(--bg))}.hero-inner{max-width:880px;padding:110px 24px 80px;text-align:center}.kicker{font:600 12px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}.hero h1{font:600 clamp(56px,11vw,132px)/.95 var(--serif);letter-spacing:-.02em;color:var(--fg);margin:18px 0 22px;font-variation-settings:"opsz" 144}.hero h1 .amp{font-style:italic;font-weight:400;color:var(--gold);padding:0 .06em}.hero p.lede{font:400 clamp(18px,2.2vw,22px)/1.55 var(--sans);color:#d8dde8;max-width:640px;margin:0 auto}.hero .meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:28px;font:500 13.5px var(--sans);color:var(--dim)}.hero .meta span{display:inline-flex;align-items:center;gap:7px}.hero .pkgs{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 10px;margin-top:18px;font:500 13px var(--sans);color:var(--dim)}.hero .pkgs a{font:500 12.5px var(--mono);color:var(--text);text-decoration:none;padding:4px 11px;border-radius:999px;border:1px solid var(--line2);background:#090b1080}.hero .pkgs a:hover{color:var(--gold2);border-color:#f2c46d80}.legend{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}.legend .chip{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;border:1px solid var(--line2);background:#090b1080;font:500 13px var(--sans);color:var(--text)}.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}.dot.all{background:var(--gold)}.dot.deeper{background:var(--deeper)}.dot.nerd{background:var(--nerd)}.scrollcue{position:absolute;bottom:26px;left:50%;transform:translate(-50%);color:var(--dim);font:500 12px var(--sans);letter-spacing:.15em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px}.scrollcue i{width:1px;height:36px;background:linear-gradient(var(--dim),transparent);animation:cue 2.2s ease-in-out infinite}@keyframes cue{0%,to{transform:scaleY(.4);transform-origin:top;opacity:.4}50%{transform:scaleY(1);opacity:1}}main{position:relative}.chapter{padding:90px 22px 40px}.chapter>*{max-width:var(--measure);margin-left:auto;margin-right:auto}.chapter>.wide{max-width:1080px}.chapter>.full{max-width:none}.chnum{display:flex;align-items:center;gap:14px;font:600 12px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}.chnum:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(242,196,109,.4),transparent)}h2{font:600 clamp(34px,5.4vw,58px)/1.04 var(--serif);letter-spacing:-.015em;color:var(--fg);margin:0 0 22px;font-variation-settings:"opsz" 120}h3{font:600 clamp(22px,2.8vw,28px)/1.2 var(--serif);color:var(--fg);margin:46px 0 12px}h4{font:600 15px var(--sans);color:var(--fg);margin:26px 0 6px;letter-spacing:.01em}p{margin:0 0 1.05em}.lead{font-size:20.5px;line-height:1.62;color:#dfe3ec}ul,ol{padding-left:1.25em;margin:0 0 1.1em}li{margin:.32em 0}li::marker{color:var(--faint)}hr.thread{border:0;height:1px;max-width:220px;margin:70px auto;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.5}blockquote{margin:28px auto;padding:4px 0 4px 22px;border-left:2px solid var(--gold);font:400 21px/1.55 var(--serif);color:var(--fg);font-style:italic}.pull{font:500 clamp(24px,3.4vw,34px)/1.3 var(--serif);color:var(--fg);text-align:center;margin:56px auto;max-width:820px}.pull em{color:var(--gold);font-style:italic}.note{font-size:14.5px;color:var(--dim)}.fig{margin:34px auto}figcaption,.caption{font:400 14px/1.55 var(--sans);color:var(--dim);margin-top:10px}figcaption b{color:var(--text);font-weight:600}.fig img{width:100%;display:block;border-radius:12px;border:1px solid var(--line)}pre{background:#0c0f16;border:1px solid var(--line);border-radius:12px;padding:16px 18px;overflow-x:auto;font:400 13.2px/1.62 var(--mono);color:#d6dbe6;margin:20px 0;tab-size:2}pre .k{color:#ff9ac8}pre .s{color:#a5e3a0}pre .c{color:#6b7590;font-style:italic}pre .n{color:#ffcf86}pre .t{color:#8fd8ff}pre .f{color:#c7b5ff}pre.small{font-size:12.4px}details.deep{margin:26px 0;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#5fd4e80b,#5fd4e804);overflow:hidden;transition:border-color .25s,background .25s}details.deep.nerd{background:linear-gradient(180deg,#b59cff0f,#b59cff04)}details.deep[open]{border-color:#5fd4e859}details.deep.nerd[open]{border-color:#b59cff66}details.deep>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 18px;user-select:none}details.deep>summary::-webkit-details-marker{display:none}details.deep>summary:focus-visible{outline:2px solid var(--deeper);outline-offset:-2px;border-radius:14px}details.deep>summary .tag{flex:none;font:700 10.5px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--deeper);padding:4px 8px;border-radius:6px;background:#5fd4e81f}details.deep.nerd>summary .tag{color:var(--nerd);background:#b59cff24}details.deep>summary .st{flex:1;font:600 15.5px/1.35 var(--sans);color:var(--fg)}details.deep>summary .chev{flex:none;width:22px;height:22px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;transition:transform .3s;color:var(--dim)}details.deep[open]>summary .chev{transform:rotate(45deg);color:var(--fg)}details.deep>.body{padding:2px 20px 16px;font-size:16px;line-height:1.7}details.deep>.body>*:first-child{margin-top:4px}details.deep .body pre{font-size:12.6px}details.deep details.deep{margin:18px 0 8px}.eq{font:400 17px/1.5 var(--serif);font-style:italic;color:var(--fg);text-align:center;margin:18px 0;padding:12px;background:#ffffff06;border-radius:10px;overflow-x:auto}.eq sub,.eq sup{font-size:.7em}.widget{margin:34px auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}.chapter>.widget{max-width:920px}.widget .wh{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font:600 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}.widget .wh .live{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse 2s infinite}@keyframes pulse{50%{opacity:.35}}.widget .wh .sp{flex:1}.widget canvas{display:block;width:100%;touch-action:none}.widget .wb{padding:16px}.widget .wf{padding:12px 16px 14px;border-top:1px solid var(--line);font:400 14px/1.55 var(--sans);color:var(--dim)}.widget .wf b{color:var(--text)}.controls{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;padding:14px 16px;border-top:1px solid var(--line);background:#00000026}.ctl{display:flex;align-items:center;gap:10px;font:500 13px var(--sans);color:var(--text);min-width:0}.ctl label{white-space:nowrap}.ctl output{font:500 12.5px var(--mono);color:var(--gold2);min-width:4.2em}input[type=range]{-webkit-appearance:none;appearance:none;width:150px;height:22px;background:transparent;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:#ffffff24}input[type=range]::-moz-range-track{height:4px;border-radius:4px;background:#ffffff24}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6px;border-radius:50%;background:var(--gold);border:2px solid #1a1406;box-shadow:0 0 0 3px #f2c46d2e}input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--gold);border:2px solid #1a1406}input[type=range]:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}.seg{display:inline-flex;padding:3px;border:1px solid var(--line2);border-radius:10px;gap:2px;flex-wrap:wrap}.seg button{all:unset;cursor:pointer;font:600 12.5px var(--sans);padding:6px 11px;border-radius:7px;color:var(--dim)}.seg button:hover{color:var(--fg);background:#ffffff0d}.seg button[aria-pressed=true]{background:#f2c46d29;color:var(--gold2)}.seg button:focus-visible{outline:2px solid var(--gold)}.btn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font:600 13px var(--sans);color:#1a1406;background:var(--gold);padding:8px 14px;border-radius:9px}.btn:hover{background:var(--gold2)}.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line2)}.btn.ghost:hover{color:var(--fg);background:#ffffff0d}.btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font:500 13px var(--sans);color:var(--text);user-select:none}.check input{accent-color:var(--gold);width:15px;height:15px}.stat{font:500 12.5px var(--mono);color:var(--dim)}.stat b{color:var(--fg);font-weight:500}.legend-row{display:flex;flex-wrap:wrap;gap:6px 16px;font:500 12.5px var(--sans);color:var(--dim)}.legend-row span{display:inline-flex;align-items:center;gap:6px}.sw{width:12px;height:3px;border-radius:2px;display:inline-block}.scrolly{position:relative;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:40px;max-width:1240px!important}.scrolly .stage{position:sticky;top:74px;height:calc(100vh - 100px);display:flex;flex-direction:column;justify-content:center;gap:14px}.scrolly .shots{position:relative;aspect-ratio:16 / 9;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#000;box-shadow:0 30px 80px #00000080}.scrolly .shots img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}.scrolly .shots img.on{opacity:1}.scrolly .shots .badge{position:absolute;left:12px;top:12px;font:600 12px var(--sans);color:#fff;background:#0000008c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:6px 10px;border-radius:8px}.passstrip{display:grid;grid-template-columns:repeat(55,1fr);gap:2px;height:34px}.passstrip i{border-radius:2px;background:#ffffff12;transition:background .4s,transform .4s;transform-origin:bottom}.passstrip i.on{transform:scaleY(1)}.passstrip i.lit{box-shadow:0 0 10px currentColor}.passlegend{display:flex;flex-wrap:wrap;gap:4px 14px;font:500 12px var(--sans);color:var(--dim)}.passlegend span{display:inline-flex;gap:6px;align-items:center;transition:color .3s,opacity .3s;opacity:.45}.passlegend span.on{opacity:1;color:var(--text)}.passname{font:500 12px var(--mono);color:var(--dim);min-height:1.6em}.scrolly .steps{padding:26vh 0 30vh}.scrolly .step{min-height:72vh;display:flex;flex-direction:column;justify-content:center;opacity:.3;transition:opacity .5s}.scrolly .step.on{opacity:1}.scrolly .step .n{font:600 12px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}.scrolly .step h3{margin-top:0}.scrolly .step p{font-size:16.5px}@media(max-width:900px){.scrolly{grid-template-columns:1fr;gap:0}.scrolly .stage{top:54px;height:auto;padding:10px 0;background:var(--bg);z-index:2}.scrolly .steps{padding:4vh 0 10vh}.scrolly .step{min-height:62vh}.passlegend{display:none}}.ba{position:relative;aspect-ratio:16 / 9;overflow:hidden;border-radius:14px;border:1px solid var(--line);cursor:ew-resize;user-select:none;touch-action:pan-y;background:#000}.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.ba .after{clip-path:inset(0 0 0 var(--x, 50%))}.ba .handle{position:absolute;top:0;bottom:0;left:var(--x, 50%);width:2px;background:#fff;box-shadow:0 0 12px #0009;transform:translate(-1px)}.ba .handle:after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;font:600 15px var(--sans)}.ba .lab{position:absolute;top:10px;font:600 12px var(--sans);color:#fff;background:#0000008c;padding:5px 9px;border-radius:7px}.ba .lab.l{left:10px}.ba .lab.r{right:10px}.compare{width:100%;border-collapse:collapse;font-size:15px;margin:22px 0}.compare th,.compare td{text-align:left;vertical-align:top;padding:11px 12px;border-bottom:1px solid var(--line)}.compare th{font:600 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}.compare td:first-child{color:var(--fg);font-weight:600;width:28%}.compare .yes{color:var(--green)}.compare .no{color:var(--red)}.compare .mid{color:var(--gold2)}.tablewrap{overflow-x:auto}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:14px;margin:26px auto}.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 18px 16px}.card h4{margin:0 0 6px;font-size:16px}.card p{margin:0;font-size:14.5px;line-height:1.6;color:var(--text)}.card .ic{font-size:20px;margin-bottom:8px;display:block}.card.pro{border-top:2px solid var(--green)}.card.con{border-top:2px solid var(--red)}.games{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:14px;margin:30px auto}.games a{display:block;position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16 / 10;text-decoration:none;color:#fff;background:#1a1e28 center / cover no-repeat;transition:transform .25s,border-color .25s}.games a:hover{transform:translateY(-3px);border-color:var(--line2)}.games a:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.78),transparent 60%)}.games a span{position:absolute;left:14px;bottom:12px;right:14px;z-index:1;font:600 16px var(--sans)}.games a small{display:block;font:400 12.5px var(--sans);color:#c9cfdc;margin-top:2px}.install{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}.links{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}.refs{font-size:14.5px;color:var(--dim);columns:2 300px;column-gap:34px}.refs li{break-inside:avoid}.refs a{color:var(--text)}footer{padding:50px 22px 70px;text-align:center;color:var(--faint);font-size:13.5px;border-top:1px solid var(--line);margin-top:60px}.spectrum{position:relative;padding:22px 16px 8px}.spectrum .track{position:relative;height:6px;border-radius:6px;background:linear-gradient(90deg,#ff8a7a,var(--gold) 35%,var(--sea) 70%,var(--violet));margin:30px 10px 14px}.spectrum .stop{position:absolute;top:50%;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;background:var(--bg);border:3px solid var(--fg);cursor:pointer;padding:0}.spectrum .stop[aria-pressed=true]{background:var(--gold);border-color:#fff;box-shadow:0 0 0 6px #f2c46d33}.spectrum .stop:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.spectrum .names{position:relative;height:40px;margin:0 10px}.spectrum .names>span{position:absolute;transform:translate(-50%);font:600 12.5px var(--sans);color:var(--dim);text-align:center;white-space:nowrap;cursor:pointer}.spectrum .names>span.on{color:var(--fg)}.spectrum .detail{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:6px 4px}.spectrum .detail div{background:#ffffff08;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:14.5px;line-height:1.55}.spectrum .detail h5{margin:0 0 6px;font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}.spectrum .detail pre{margin:8px 0 0;font-size:11.8px;padding:10px 12px}.spectrum .names .short{display:none}@media(max-width:640px){.spectrum .detail{grid-template-columns:1fr}.spectrum .names .long{display:none}.spectrum .names .short{display:inline}.widget .wh .note{display:none}}.chooser{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0}.chooser .qs{padding:16px;display:flex;flex-direction:column;gap:10px;border-right:1px solid var(--line)}.chooser .q{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;line-height:1.45;cursor:pointer;padding:8px 10px;border-radius:10px}.chooser .q:hover{background:#ffffff08}.chooser .q input{margin-top:3px;accent-color:var(--gold);width:16px;height:16px;flex:none}.chooser .out{padding:20px 18px;display:flex;flex-direction:column;gap:14px;justify-content:center}.meter{position:relative;height:12px;border-radius:12px;background:linear-gradient(90deg,#f0a35e,#3a3f4f 50%,var(--sea))}.meter i{position:absolute;top:50%;width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid var(--bg);transform:translate(-50%,-50%);transition:left .5s cubic-bezier(.3,1.4,.5,1);box-shadow:0 2px 10px #00000080}.meter-ends{display:flex;justify-content:space-between;font:600 12.5px var(--sans);color:var(--dim)}.verdict{font:600 19px/1.35 var(--serif);color:var(--fg);min-height:2.7em}.why{font-size:14px;color:var(--dim);line-height:1.55;min-height:4.6em}@media(max-width:720px){.chooser{grid-template-columns:1fr}.chooser .qs{border-right:0;border-bottom:1px solid var(--line)}}.models{display:grid;grid-template-columns:1fr 1fr}.models>div{padding:14px 16px 18px;min-width:0}.models>div+div{border-left:1px solid var(--line)}.models h5{margin:0 0 4px;font:700 11px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}.models svg{width:100%;height:auto;display:block}@media(max-width:720px){.models{grid-template-columns:1fr}.models>div+div{border-left:0;border-top:1px solid var(--line)}}.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.layout>div{padding:14px 16px;min-width:0}.layout>div+div{border-left:1px solid var(--line)}.layout pre{margin:0;font-size:12.8px}.layout .row{display:flex;align-items:center;gap:8px;padding:3px 6px;border-radius:6px;font:400 13px var(--mono);cursor:default}.layout .row.hl{background:#ffffff12}.layout .row select{font:400 12.5px var(--mono);background:var(--panel2);color:var(--fg);border:1px solid var(--line2);border-radius:6px;padding:2px 4px}.layout .row .nm{color:var(--fg);min-width:6.5em}.layout .row .rm{margin-left:auto;color:var(--faint);cursor:pointer;background:none;border:0;font-size:15px}.bytes{display:grid;grid-template-columns:repeat(16,1fr);gap:2px;margin-top:8px}.bytes i{aspect-ratio:1;border-radius:3px;background:#ffffff0a;position:relative;font:500 8.5px var(--mono);color:#0000008c;display:grid;place-items:center;font-style:normal}.bytes i.pad{background:repeating-linear-gradient(45deg,rgba(255,138,122,.22) 0 3px,transparent 3px 6px)}.bytes i.hl{outline:2px solid #fff;z-index:1}.ts-out{margin-top:10px}@media(max-width:760px){.layout{grid-template-columns:1fr}.layout>div+div{border-left:0;border-top:1px solid var(--line)}}.livebox{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}.livebox .view{position:relative;min-height:340px;background:#05070a}.livebox .view canvas{position:absolute;inset:0;width:100%;height:100%}.livebox .view .fallback{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;color:var(--dim);font-size:14.5px}.livebox .view .hint{position:absolute;right:10px;bottom:8px;font:500 11.5px var(--mono);color:#dce6f0b3;pointer-events:none}.livebox .code{border-left:1px solid var(--line);max-height:440px;overflow:auto}.livebox .code pre{margin:0;border:0;border-radius:0;font-size:11.8px;background:transparent}@media(max-width:860px){.livebox{grid-template-columns:1fr}.livebox .view{min-height:260px;aspect-ratio:16 / 10}.livebox .code{border-left:0;border-top:1px solid var(--line)}}.rv{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .8s ease}.rv.in{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}.toc{position:fixed;left:18px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;gap:4px;opacity:0;pointer-events:none;transition:opacity .4s}.toc.show{opacity:1;pointer-events:auto}.toc a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--faint);font:500 12px var(--sans);padding:3px 0}.toc a i{width:14px;height:2px;background:currentColor;border-radius:2px;transition:width .3s,background .3s}.toc a span{opacity:0;transform:translate(-4px);transition:opacity .25s,transform .25s;white-space:nowrap;background:#090b10cc;padding:2px 6px;border-radius:5px}.toc:hover a span{opacity:1;transform:none}.toc a.on{color:var(--gold)}.toc a.on i{width:26px}@media(max-width:1300px){.toc{display:none}}
