:root{--bg:#1c1917;--bg2:#262322;--bg3:#332f2d;--line:#44403c;--fg:#fafaf9;--mut:#a8a29e;--dim:#78716c;--acc:#ff6b35;--acc-d:#c9410f;--ok:#8ec07c;--bad:#f2777a;--warn:#e6b450;--mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--fg);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;line-height:1.7;overflow-x:hidden}a{color:var(--acc);text-decoration:none}a:hover{text-decoration:underline}.wrap{max-width:1080px;margin:0 auto;padding:0 22px}.mono{font-family:var(--mono)}nav{z-index:50;backdrop-filter:blur(12px);border-bottom:1px solid var(--line);background:#1c1917db;position:sticky;top:0}nav .wrap{justify-content:space-between;align-items:center;gap:16px;height:56px;display:flex}.brand{font-family:var(--mono);letter-spacing:-.02em;white-space:nowrap;font-size:15px;font-weight:700}.brand i{color:var(--acc);font-style:normal}.navlinks{scrollbar-width:none;gap:20px;font-size:13px;display:flex;overflow-x:auto}.navlinks::-webkit-scrollbar{display:none}.navlinks a{color:var(--mut);white-space:nowrap}.navlinks a:hover{color:var(--fg);text-decoration:none}section{border-bottom:1px solid var(--line);padding:76px 0}.kick{font-family:var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--acc);margin:0 0 14px;font-size:11px;font-weight:700}h2{letter-spacing:-.02em;margin:0 0 14px;font-size:clamp(26px,4.4vw,38px);font-weight:800;line-height:1.22}.lede{color:var(--mut);max-width:62ch;margin:0 0 34px;font-size:16px}h3{margin:0 0 8px;font-size:17px;font-weight:700}.hero{border-bottom:1px solid var(--line);padding:64px 0 72px}.hero .wrap{grid-template-columns:1fr 300px;align-items:center;gap:52px;display:grid}.hero h1{letter-spacing:-.035em;margin:0 0 20px;font-size:clamp(34px,6.2vw,60px);font-weight:800;line-height:1.08}.hero h1 em{color:var(--acc);font-style:normal}.hero p{color:var(--mut);max-width:52ch;margin:0 0 12px;font-size:17px}.hero .tags{flex-wrap:wrap;gap:8px;margin:26px 0 0;display:flex}.tag{font-family:var(--mono);border:1px solid var(--line);color:var(--mut);border-radius:999px;padding:5px 10px;font-size:11px}.phone{border:1px solid var(--line);background:#000;border-radius:20px;position:relative;overflow:hidden;box-shadow:0 26px 60px #0009}.phone video{width:100%;height:auto;display:block}.phone .cap{font-family:var(--mono);color:var(--mut);background:linear-gradient(#0000,#000000e6);padding:9px 12px;font-size:10px;position:absolute;bottom:0;left:0;right:0}.flow{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px;display:grid}.step{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:20px}.step .n{font-family:var(--mono);color:var(--acc);margin-bottom:10px;font-size:11px;font-weight:700}.step p{color:var(--mut);margin:0;font-size:14px}.step code{font-family:var(--mono);color:var(--fg);background:var(--bg3);border-radius:4px;padding:1px 5px;font-size:12px}.panel{background:var(--bg2);border:1px solid var(--line);border-radius:12px;overflow:hidden}.panel .bar{background:var(--bg3);border-bottom:1px solid var(--line);font-family:var(--mono);color:var(--mut);align-items:center;gap:8px;padding:9px 14px;font-size:11px;display:flex}.dots{gap:5px;margin-right:4px;display:flex}.dots i{border-radius:50%;width:9px;height:9px;display:block}.dots i:first-child{background:#f2777a}.dots i:nth-child(2){background:#e6b450}.dots i:nth-child(3){background:#8ec07c}.sandbox{grid-template-columns:1fr 380px;gap:18px;display:grid}.beat{border-bottom:1px solid var(--line);padding:16px 16px 18px}.beat:last-child{border-bottom:none}.beat-h{align-items:baseline;gap:10px;margin-bottom:11px;display:flex}.beat-h b{font-family:var(--mono);letter-spacing:.14em;color:var(--acc);font-size:11px}.beat-h span{color:var(--dim);font-size:12px}.take{border:1px solid var(--line);cursor:pointer;background:var(--bg);border-radius:9px;gap:11px;margin-bottom:7px;padding:10px 12px;transition:border-color .13s,background .13s;display:flex}.take:hover{border-color:var(--dim)}.take.on{border-color:var(--acc);background:#ff6b3512}.take .id{font-family:var(--mono);color:var(--dim);flex-shrink:0;width:96px;padding-top:2px;font-size:11px}.take.on .id{color:var(--acc)}.take .txt{flex:1;min-width:0;font-size:14px}.take .txt .flag{font-family:var(--mono);white-space:nowrap;vertical-align:1px;border-radius:4px;margin-left:7px;padding:1px 6px;font-size:10px;display:inline-block}.flag.clean{color:var(--ok);background:#8ec07c29}.flag.filler{color:var(--warn);background:#e6b45029}.flag.slip{color:var(--bad);background:#f2777a29}.flag.thin{color:var(--mut);background:#78716c33}mark{color:#ffc9cb;background:#f2777a3d;border-radius:3px;padding:0 2px}.out{align-self:start;position:sticky;top:74px}.out pre{font-family:var(--mono);color:#d6d3d1;max-height:330px;margin:0;padding:14px;font-size:11.5px;line-height:1.62;overflow:auto}.out pre .k{color:#8ec07c}.out pre .s{color:var(--acc)}.out pre .n{color:#83a598}.sum{border-top:1px solid var(--line);grid-template-columns:1fr 1fr;display:grid}.sum div{padding:12px 14px}.sum div+div{border-left:1px solid var(--line)}.sum b{font-family:var(--mono);color:var(--fg);font-size:21px;line-height:1.2;display:block}.sum span{color:var(--dim);font-size:11px}.script{border-top:1px solid var(--line);color:var(--mut);max-height:150px;padding:13px 14px;font-size:13px;overflow-y:auto}.script b{font-family:var(--mono);letter-spacing:.14em;color:var(--dim);text-transform:uppercase;margin-bottom:7px;font-size:10px;display:block}.warnbox{border-top:1px solid var(--line);color:var(--warn);background:#e6b45012;padding:11px 14px;font-size:12.5px;display:none}.warnbox.show{display:block}.btnrow{flex-wrap:wrap;gap:9px;margin-top:16px;display:flex}button{font-family:var(--sans);cursor:pointer;border:1px solid var(--line);background:var(--bg2);color:var(--fg);border-radius:8px;padding:9px 15px;font-size:13px;transition:all .13s}button:hover{border-color:var(--dim)}button.pri{background:var(--acc);border-color:var(--acc);color:#1c1917;font-weight:700}button.pri:hover{background:#ff8154;border-color:#ff8154}.ab{grid-template-columns:1fr 1fr;gap:16px;display:grid}.abcard{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:18px}.abcard.good{border-color:#8ec07c66}.abcard.bad{border-color:#f2777a66}.abcard h3{align-items:center;gap:8px;display:flex}.abcard h3 .pill{font-family:var(--mono);border-radius:4px;padding:2px 7px;font-size:10px}.bad .pill{color:var(--bad);background:#f2777a29}.good .pill{color:var(--ok);background:#8ec07c29}.abcard p{color:var(--mut);margin:0 0 14px;font-size:13px}canvas{background:var(--bg);border:1px solid var(--line);border-radius:8px;width:100%;height:96px;margin-bottom:13px;display:block}.hint{color:var(--dim);font-size:12px;font-family:var(--mono);margin-top:14px}.ease{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:22px}.track{height:46px;margin-bottom:6px;position:relative}.track .lbl{font-family:var(--mono);color:var(--dim);width:130px;font-size:11px;position:absolute;top:14px;left:0}.rail{background:var(--bg3);border-radius:2px;height:2px;position:absolute;top:22px;left:140px;right:12px}.ball{border-radius:6px;width:22px;height:22px;position:absolute;top:12px;left:140px}.ball.lin{background:var(--dim)}.ball.cub{background:var(--acc)}.easenote{color:var(--mut);margin:16px 0 0;font-size:13px}.rules{grid-template-columns:1fr 1fr;gap:10px;display:grid}.rule{background:var(--bg2);border:1px solid var(--line);cursor:pointer;user-select:none;border-radius:10px;gap:12px;padding:13px 15px;transition:all .13s;display:flex}.rule:hover{border-color:var(--dim)}.rule.done{background:#8ec07c0f;border-color:#8ec07c73}.rule .box{border:1.5px solid var(--dim);color:#0000;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;width:17px;height:17px;margin-top:3px;font-size:11px;transition:all .13s;display:flex}.rule.done .box{background:var(--ok);border-color:var(--ok);color:#1c1917}.rule .c b{margin-bottom:3px;font-size:13.5px;display:block}.rule .c span{color:var(--dim);font-size:12.5px;line-height:1.55}.progress{font-family:var(--mono);color:var(--dim);margin-top:18px;font-size:12px}.progress .bar{background:var(--bg3);border-radius:2px;height:4px;margin-top:8px;overflow:hidden}.progress .bar i{background:var(--acc);width:0;height:100%;transition:width .25s;display:block}.code{background:var(--bg2);border:1px solid var(--line);border-radius:10px;margin-bottom:14px;overflow:hidden}.code .h{background:var(--bg3);border-bottom:1px solid var(--line);font-family:var(--mono);color:var(--mut);justify-content:space-between;align-items:center;gap:10px;padding:8px 14px;font-size:11px;display:flex}.code .h button{font-size:11px;font-family:var(--mono);padding:3px 9px}.code pre{font-family:var(--mono);color:#d6d3d1;margin:0;padding:14px;font-size:12.5px;line-height:1.75;overflow-x:auto}.code pre .cm{color:var(--dim)}.pit{background:#e6b45012;border:1px solid #e6b4504d;border-radius:10px;margin-top:16px;padding:16px 18px}.pit b{color:var(--warn);font-size:13.5px;font-family:var(--mono);margin-bottom:6px;display:block}.pit p{color:var(--mut);margin:0;font-size:13.5px}.pit code{font-family:var(--mono);background:var(--bg3);color:var(--fg);word-break:break-all;border-radius:4px;padding:1px 5px;font-size:12.5px}footer{color:var(--dim);padding:44px 0 60px;font-size:13px}footer .row{flex-wrap:wrap;justify-content:space-between;gap:20px;display:flex}footer b{color:var(--mut);font-weight:600}@media (width<=900px){.hero .wrap{grid-template-columns:1fr;gap:36px}.phone{max-width:250px;margin:0 auto}.sandbox{grid-template-columns:1fr}.out{position:static}.flow,.ab,.rules{grid-template-columns:1fr}section{padding:56px 0}.take{flex-direction:column;gap:5px}.take .id{width:auto}.rail,.ball{left:110px}.track .lbl{width:100px}}