:root{--ink: #0d0d0d;--concrete: #161616;--line: #333;--text: #e8e6e1;--dim: #8a8a8a;--hot: #d9ff00;--paper: #f4f1ea}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--ink);color:var(--text);font:13px/1.6 ui-monospace,SF Mono,Menlo,Consolas,monospace;letter-spacing:.01em;-webkit-font-smoothing:antialiased}.page{max-width:920px;margin:0 auto;padding:44px 22px 90px}header h1{font-size:24px;font-weight:800;letter-spacing:.22em}header .sub{margin-top:8px;color:var(--dim);letter-spacing:.06em;max-width:60ch}header nav{display:flex;gap:14px;flex-wrap:wrap;color:var(--dim);margin-top:4px}header nav a{color:inherit;text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:1px}header nav a:hover{color:var(--text);border-bottom-color:var(--hot)}.rule{height:3px;margin:18px 0 10px;background:var(--hot);clip-path:polygon(0 30%,12% 0,34% 55%,61% 8%,83% 62%,100% 22%,100% 78%,78% 100%,52% 44%,26% 96%,8% 40%,0 82%)}#rail{position:fixed;left:22px;top:50%;transform:translateY(-50%);z-index:2;display:flex;flex-direction:column;gap:9px;font-size:10px}#rail a{color:var(--dim);text-decoration:none;opacity:.45;letter-spacing:.1em}#rail a.on{color:var(--hot);opacity:1;font-weight:800}#rail a:hover{opacity:1}@media(max-width:1220px){#rail{display:none}}.step{padding-top:56px}.step .hd{display:flex;align-items:baseline;gap:12px}.step i{font-style:normal;font-size:11px;color:var(--hot);letter-spacing:.14em}.step h2{font-size:16px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.step p{margin:10px 0 16px;max-width:62ch;color:#c9c6c0}.step p b{font-weight:400;color:var(--text);border-bottom:1px solid var(--line)}.tech{margin:0 0 16px;font-size:12px;line-height:1.75;color:var(--dim);border-left:2px solid var(--line);padding-left:14px}.tech code{color:var(--text);background:var(--concrete);padding:0 4px}.tech em{font-style:normal;color:var(--hot);opacity:.85}.demo{border:2px solid var(--line);background:var(--paper);padding:0;overflow:hidden}canvas.cv{display:block;width:100%}pre.code{margin-top:12px;padding:10px 12px;overflow-x:auto;background:var(--concrete);border:1px solid var(--line);font-size:11.5px;line-height:1.6;color:#b9b6b0}pre.code b{display:block;font-weight:400;color:var(--dim);font-size:10px;letter-spacing:.1em;margin-bottom:6px}pre.code i{font-style:normal;color:var(--hot);opacity:.75}.cta{margin-top:26px;display:inline-block;text-decoration:none;background:var(--hot);color:#0d0d0d;font-weight:800;letter-spacing:.16em;padding:12px 20px;border:2px solid var(--hot)}.cta:hover{background:transparent;color:var(--hot)}footer{margin-top:64px;padding-top:18px;border-top:1px solid var(--line);color:var(--dim);font-size:11px}footer a{color:inherit}@media(max-width:620px){.page{padding:28px 14px 70px}header h1{font-size:18px;letter-spacing:.14em}.step{padding-top:40px}.step p{font-size:12.5px}}