:root{--bg:#f5f3ec;--surface:#fffefb;--sunken:#ece9df;--ink:#1b2422;--muted:#5f6b67;--line:#d9d5c8;--accent:#155e4b;--accent-ink:#fff;--accent-soft:#dcebe4;--gold:#f4d35e;--lv-J:#1f8a70;--lv-S:#2f62a8;--lv-N:#a83a6b;--act:#f59e0b;--act-bg:#fdebc8;--cmp:#2f6fde;--cmp-bg:#dbe7fd;--ok:#1f9d63;--ok-bg:#d3f0e0;--bad:#d9363e;--bad-bg:#fbdadb;--alt:#7c4ddb;--alt-bg:#e7defb;--vis:#3e9c95;--vis-bg:#d5edea;--code-bg:#1d2623;--code-ink:#dfe6e1;--code-line:#33453f;--mono:ui-monospace, "Cascadia Code", "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--sans:system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;--r:12px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--bg:#111618;--surface:#1a2124;--sunken:#141a1c;--ink:#e7ebe6;--muted:#9aa7a2;--line:#2c373a;--accent:#58c9a3;--accent-ink:#0c1a15;--accent-soft:#1d3a31;--lv-J:#4fc5a6;--lv-S:#78a6ee;--lv-N:#e582ad;--act-bg:#4a3608;--cmp-bg:#172f5e;--ok-bg:#0f3d27;--bad-bg:#4d1518;--alt-bg:#2f1f5c;--vis-bg:#153b38;--act:#fbbf4d;--cmp:#6ea0ff;--ok:#4fd093;--bad:#ff6b72;--alt:#ac8cf5;--vis:#62c4bc;--code-bg:#0c1011;--code-line:#24332e;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font:16px/1.6 var(--sans);margin:0}a{color:var(--accent)}h1,h2,h3{text-wrap:balance;margin:0 0 .5em;line-height:1.2}h1{letter-spacing:-.02em;font-size:clamp(1.9rem,4.5vw,3rem);font-weight:800}h2{margin-top:2rem;font-size:1.3rem}h3{font-size:1rem}p{margin:0 0 1em}code,pre,textarea{font-family:var(--mono)}main{max-width:1840px;min-height:70vh;margin:0 auto;padding:20px clamp(16px,2.2vw,40px) 64px}.muted{color:var(--muted)}.small{font-size:.85rem}.bad{color:var(--bad)}.lede{color:var(--muted);max-width:62ch;font-size:1.1rem}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.grow{flex:1}.empty{text-align:center;color:var(--muted);padding:48px 0}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button,.btn{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:6px 12px;font-size:.9rem;text-decoration:none;transition:background .15s,border-color .15s,transform .1s;display:inline-flex}button:hover:not(:disabled),.btn:hover{border-color:var(--accent)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}button.primary,.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}button.on{background:var(--accent-soft);border-color:var(--accent)}button.ghost{background:0 0;border-color:#0000}button.danger{color:var(--bad)}button.link{color:var(--accent);font-family:var(--mono);background:0 0;border:0;padding:2px 6px;text-decoration:underline}.btn.big{border-radius:10px;padding:10px 18px;font-size:1rem}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}.chip{background:var(--sunken);color:var(--muted);border-radius:99px;padding:3px 10px;font-size:.82rem}.chip code{color:var(--ink)}.seg{border:1px solid var(--line);border-radius:8px;flex-wrap:wrap;display:inline-flex;overflow:hidden}.seg button{border:0;border-right:1px solid var(--line);border-radius:0}.seg button:last-child{border-right:0}.seg.big button{flex-direction:column;align-items:flex-start;gap:0;padding:10px 16px;font-weight:600}.seg.big small{color:var(--muted);font-weight:400}.seg.big button.on{box-shadow:inset 0 -3px 0 var(--lv)}.check{align-items:center;gap:6px;font-size:.9rem;display:inline-flex}input[type=search],input:not([type]),textarea,select{font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 12px}select{padding:4px 6px}.lv-J{--lv:var(--lv-J)}.lv-S{--lv:var(--lv-S)}.lv-N{--lv:var(--lv-N)}.badge{letter-spacing:.04em;color:var(--lv);border:1.5px solid var(--lv);white-space:nowrap;border-radius:5px;padding:1px 7px;font-size:.72rem;font-weight:700}.diff{font-family:var(--mono);color:var(--muted);white-space:nowrap;font-size:.82rem}.meter{background:var(--sunken);border-radius:99px;height:6px;display:block;overflow:hidden}.meter i{background:var(--lv,var(--accent));border-radius:99px;height:100%;transition:width .4s;display:block}.top{z-index:10;background:color-mix(in srgb, var(--bg) 88%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);align-items:center;gap:20px;padding:10px 20px;display:flex;position:sticky;top:0}.brand{color:var(--ink);letter-spacing:-.01em;align-items:center;gap:10px;font-size:1.1rem;font-weight:800;text-decoration:none;display:flex}.logo-bg{fill:var(--accent)}.logo-edge{stroke:var(--gold)}.top nav{flex:1;gap:4px;display:flex}.top nav a{color:var(--muted);border-radius:8px;padding:6px 12px;font-size:.95rem;font-weight:600;text-decoration:none}.top nav a.on{color:var(--ink);background:var(--sunken)}.tools{gap:2px;display:flex}.foot{text-align:center;color:var(--muted);border-top:1px solid var(--line);padding:24px;font-size:.85rem}.hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:32px;max-width:1400px;margin:0 auto;padding:28px 0 36px;display:grid}.stats{color:var(--muted);flex-wrap:wrap;gap:24px;margin-top:22px;font-size:.9rem;display:flex}.stats b{font-family:var(--mono);color:var(--ink);margin-right:4px;font-size:1.5rem}.hero-demo{color:var(--ink);min-height:250px;box-shadow:6px 6px 0 var(--accent-soft);text-decoration:none;display:block}.hero-demo-title{color:var(--muted);justify-content:space-between;font-size:.9rem;font-weight:700;display:flex}.hero-demo-msg{color:var(--muted);min-height:3em;font-size:.88rem}.levels{grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:24px;display:grid}.level-card{text-align:left;border-radius:var(--r);border-top:4px solid var(--lv);flex-direction:column;align-items:stretch;gap:6px;padding:16px}.level-card.on{background:var(--accent-soft)}.level-name{color:var(--lv);font-size:1.25rem;font-weight:800}.level-contest,.level-count{color:var(--muted);font-size:.82rem}.filters{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:18px;display:flex}.filters input{flex:220px;max-width:320px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chips button{border-radius:99px;padding:4px 12px;font-size:.85rem}.lesson-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;display:grid}.lesson-card{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--lv);border-radius:var(--r);color:var(--ink);flex-direction:column;gap:6px;padding:14px 16px;text-decoration:none;transition:transform .15s,box-shadow .15s;display:flex}.lesson-card:hover{transform:translateY(-2px);box-shadow:0 6px 18px #00000014}.lesson-card h3{margin:4px 0 0;font-size:1.05rem}.lesson-card p{color:var(--muted);flex:1;margin:0;font-size:.88rem}.lc-top{color:var(--muted);align-items:center;gap:8px;font-size:.78rem;display:flex}.lc-cat{flex:1}.lc-check{color:var(--ok);font-weight:800}.lc-star{color:var(--act)}.lc-foot code{color:var(--muted);font-size:.8rem}.lesson-card.done{background:color-mix(in srgb, var(--ok-bg) 35%, var(--surface))}.crumbs{color:var(--muted);margin-bottom:8px;font-size:.85rem}.crumbs a{color:inherit}.lesson-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 32px;display:flex}.lesson-head h1{border-left:6px solid var(--lv);margin-bottom:.25em;padding-left:14px;font-size:clamp(1.6rem,2.6vw,2.2rem)}.lesson-head .lede{max-width:90ch;margin:0;font-size:1rem}.lesson-head .actions{flex:none}.crumbs .badge,.crumbs .diff{margin-left:8px}.done-btn.on{background:var(--ok-bg);border-color:var(--ok);color:var(--ink)}.tabs{box-shadow:inset 0 -2px 0 var(--line);gap:2px;margin:16px 0 18px;display:flex;overflow:auto hidden}.tabs a{color:var(--muted);white-space:nowrap;border-bottom:3px solid #0000;align-items:center;gap:8px;padding:9px 18px 9px 12px;font-weight:600;text-decoration:none;display:flex}.tabs a span{font:700 .72rem var(--mono);background:var(--sunken);width:1.7em;height:1.7em;color:var(--muted);border-radius:50%;place-items:center;display:grid}.tabs a.on span{background:var(--lv);color:var(--surface)}.tabs a.on{color:var(--ink);border-bottom-color:var(--lv)}.player{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start;gap:16px;display:grid}.player-main{flex-direction:column;gap:16px;min-width:0;display:flex}.two-col{grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);align-items:start;gap:24px 48px;display:grid}.prose{max-width:84ch}.prose h3,.two-col aside h3{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 .6em;font-size:.8rem}.prose h3:not(:first-child),.two-col aside h3.gap{margin-top:2em}.statement{font-size:1.25rem;line-height:1.6}.why{font-size:1.06rem;line-height:1.85}.samples{flex-direction:column;gap:18px;display:flex}.samples .out{max-height:320px;font-size:.92rem}.pitfalls{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.pitfalls li{border-left:4px solid var(--bad);background:var(--bad-bg);border-radius:0 8px 8px 0;padding:9px 12px;font-size:.95rem}.next-tab{margin:28px 0 0}.stage-card{min-width:0}.msg{background:var(--accent-soft);border-radius:8px;align-items:baseline;gap:10px;min-height:3.2em;padding:10px 12px;font-size:.97rem;display:flex}.msg-no{font-family:var(--mono);background:var(--accent);color:var(--accent-ink);border-radius:5px;flex:none;padding:1px 6px;font-size:.75rem}.error{background:var(--bad-bg);border-radius:8px;padding:12px}.stage{flex-direction:column;gap:12px;min-height:200px;padding:14px 0;display:flex}.controls{border-top:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:6px;padding-top:12px;display:flex}.controls .icon{padding:6px 9px}.controls .play{justify-content:center;min-width:96px}.scrub{accent-color:var(--accent);flex:120px}.count{font-family:var(--mono);color:var(--muted);text-align:right;min-width:70px;font-size:.82rem}.speed{color:var(--muted);align-items:center;gap:4px;font-size:.82rem;display:flex}.hint{color:var(--muted);margin-top:6px;font-size:.75rem}.io{grid-template-columns:1fr 1fr;gap:16px;display:grid}.io textarea{resize:vertical;width:100%;margin-bottom:8px;font-size:.85rem}.out-label{color:var(--muted);font-size:.8rem}.out{background:var(--sunken);white-space:pre-wrap;word-break:break-all;border-radius:8px;min-height:2.6em;max-height:170px;margin:4px 0 0;padding:8px 12px;font-size:.85rem;overflow:auto}.input-card h3{margin:0}.input-card .muted{margin:8px 0;font-size:.88rem}.view-name{font-family:var(--mono);color:var(--muted);margin-bottom:3px;font-size:.75rem}.arr-scroll{padding-bottom:2px;overflow-x:auto}.arr-cells{height:40px;position:relative}.arr-cells.bars{height:132px}.cell{flex-direction:column;justify-content:flex-end;align-items:stretch;height:100%;padding:0 2px;transition:transform .35s cubic-bezier(.3,.7,.3,1);display:flex;position:absolute;top:0;left:0}.box{border:1.5px solid var(--tc,var(--line));background:var(--tb,var(--surface));height:38px;font-family:var(--mono);white-space:nowrap;border-radius:7px;place-items:center;font-size:.9rem;font-weight:600;transition:background .25s,border-color .25s;display:grid}.bar{background:var(--tc,var(--muted));opacity:var(--to,.45);border-radius:5px 5px 0 0;transition:background .25s,height .3s;display:block}.bar-num{font-family:var(--mono);text-align:center;font-size:.75rem}.arr-idx,.arr-ptr{font-family:var(--mono);color:var(--muted);font-size:.68rem;display:flex}.arr-idx span,.arr-ptr span{text-align:center;flex:none}.arr-ptr{color:var(--accent);min-height:2.3em;font-size:.75rem;font-weight:700}.arr-ptr i{font-size:.55rem;font-style:normal;line-height:1;display:block}.t-act{--tc:var(--act);--tb:var(--act-bg);--to:1}.t-cmp{--tc:var(--cmp);--tb:var(--cmp-bg);--to:1}.t-ok{--tc:var(--ok);--tb:var(--ok-bg);--to:1}.t-bad{--tc:var(--bad);--tb:var(--bad-bg);--to:1}.t-alt{--tc:var(--alt);--tb:var(--alt-bg);--to:1}.t-vis{--tc:var(--vis);--tb:var(--vis-bg);--to:.8}.t-dim{opacity:.35}svg.graph{width:100%;height:auto;max-height:420px;display:block}.node circle{fill:var(--tb,var(--surface));stroke:var(--tc,var(--muted));stroke-width:2.2px;transition:fill .25s,stroke .25s}.node-label{font:600 13px var(--mono);fill:var(--ink);text-anchor:middle;dominant-baseline:central}.node-sub{font:700 13.5px var(--mono);fill:var(--tc,var(--accent));paint-order:stroke;stroke:var(--surface);stroke-width:4px}.edge line{stroke:var(--tc,var(--muted));stroke-width:1.6px;opacity:.75;transition:stroke .25s}.edge:not(.t-none) line{stroke-width:3.2px;opacity:1}.edge.t-dim line{opacity:.5;stroke-width:1.2px}.edge-w{font:600 12px var(--mono);fill:var(--tc,var(--ink));text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:var(--surface);stroke-width:4px}table.grid{border-collapse:separate;border-spacing:3px;font-family:var(--mono);font-size:.85rem}table.grid td{text-align:center;border:1.5px solid var(--tc,var(--line));background:var(--tb,var(--surface));white-space:nowrap;border-radius:6px;min-width:34px;height:32px;padding:0 6px;font-weight:600;transition:background .25s,border-color .25s}table.grid th{color:var(--muted);white-space:nowrap;padding:0 6px;font-size:.72rem;font-weight:400}table.grid.sq td{width:34px;min-width:34px;height:34px;padding:0}.vars{flex-wrap:wrap;gap:6px;display:flex}.var{font-family:var(--mono);background:var(--sunken);border-radius:6px;padding:2px 8px;font-size:.82rem}.var b{color:var(--muted);margin-right:6px;font-weight:400}.var b:after{content:" ="}.code-card{background:var(--code-bg);border-color:var(--code-bg);padding:0;position:sticky;top:68px;overflow:hidden}.code-card.tall{position:relative;top:0}.code{color:var(--code-ink);font:.82rem/1.65 var(--mono);tab-size:4;max-height:calc(100vh - 92px);padding:12px 0;position:relative;overflow:auto}.code-card.tall .code{max-height:none}.ln{border-left:3px solid #0000;padding-right:14px;display:flex}.ln code{white-space:pre}.ln .no{text-align:right;color:#6d7f79;-webkit-user-select:none;user-select:none;flex:none;width:3.2em;padding-right:1em}.ln .no b{background:var(--gold);color:#1b2422;border-radius:99px;padding:0 6px;font-size:.72rem}.ln.on{background:var(--code-line);border-left-color:var(--gold)}.ln.hov{background:var(--code-line)}.c-com{color:#7f9189;font-style:italic}.c-str{color:#e6c07b}.c-pre{color:#c594c5}.c-num{color:#f99157}.c-kw{color:#6fc3df}.c-ty{color:#8fd694}.copy{z-index:1;font-size:.78rem;position:absolute;top:10px;right:10px}.code-tab{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start;gap:24px;display:grid}.notes{flex-direction:column;gap:8px;margin:0 0 24px;padding:0;list-style:none;display:flex}.notes li{border:1px solid var(--line);background:var(--surface);border-radius:10px;gap:12px;padding:10px 12px;display:flex}.notes li:hover,.notes li:focus{border-color:var(--accent)}.notes li>b{background:var(--gold);color:#1b2422;width:1.6em;height:1.6em;font-size:.8rem;font-family:var(--mono);border-radius:99px;flex:none;place-items:center;display:grid}.notes p{margin:4px 0 0;font-size:.92rem}.note-line{color:var(--muted);word-break:break-all;font-size:.78rem}.ideas{counter-reset:n;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.ideas li{counter-increment:n;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px 14px 58px;font-size:1.02rem;position:relative}.ideas li:before{content:counter(n);font:800 1.5rem var(--mono);color:var(--lv);position:absolute;top:12px;left:16px}dl{grid-template-columns:auto 1fr;gap:6px 16px;margin:0 0 16px;display:grid}dt{color:var(--muted)}dd{margin:0}.lab-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start;gap:24px;margin-top:16px;display:grid}.lab-table{border-collapse:collapse;width:100%;font-size:.9rem}.lab-table th{text-align:right;color:var(--muted);border-bottom:2px solid var(--line);white-space:nowrap;padding:6px 10px;font-size:.78rem;font-weight:600}.lab-table td{text-align:right;border-bottom:1px solid var(--line);font-family:var(--mono);white-space:nowrap;padding:7px 10px}.lab-table td[colspan]{text-align:left;font-family:var(--sans);white-space:normal}figure{margin:0}svg.chart{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);width:100%;height:auto}.chart text{font:11px var(--mono);fill:var(--muted)}.chart .gridline{stroke:var(--line);stroke-width:1px}.chart .series{fill:none;stroke:var(--accent);stroke-width:2.5px;stroke-linejoin:round}.chart .dot{fill:var(--surface);stroke:var(--accent);stroke-width:2.5px}.pager{border-top:1px solid var(--line);justify-content:space-between;gap:16px;margin-top:40px;padding-top:18px;display:flex}.pager a{flex-direction:column;font-weight:700;text-decoration:none;display:flex}.pager a.right{text-align:right}.pager small{color:var(--muted);font-weight:400}.syl-section h2{border-bottom:2px solid var(--lv);align-items:baseline;gap:10px;padding-bottom:6px;display:flex}.syl-section h2 span{font-family:var(--mono);color:var(--lv);font-size:1rem}.syl-groups{columns:2 380px;column-gap:32px}.syl-group{break-inside:avoid;margin-bottom:18px}.syl-group h3{margin:0 0 4px;font-size:.95rem}.syl-group ul{margin:0;padding:0;list-style:none}.syl-group li{border-bottom:1px dashed var(--line);flex-wrap:wrap;align-items:baseline;gap:6px;padding:4px 0;font-size:.92rem;display:flex}.syl-group li:not(.has) .syl-name{color:var(--muted)}.syl-name{flex:200px}.syl-name small{color:var(--muted);font-size:.78rem;display:block}.syl-links{flex-wrap:wrap;gap:6px;display:flex}.syl-links a{background:var(--accent-soft);white-space:nowrap;border-radius:99px;padding:1px 10px;font-size:.8rem;font-weight:600;text-decoration:none}.syl-links a.done{background:var(--ok-bg);color:var(--ink)}.profile-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));align-items:start;gap:16px;display:grid}.prog{grid-template-columns:9em 1fr 3.5em;align-items:center;gap:10px;padding:5px 0;font-size:.88rem;display:grid}.prog .num{font-family:var(--mono);text-align:right;color:var(--muted)}.ring{--pct:0;text-align:center;background:radial-gradient(closest-side, var(--surface) 78%, transparent 80%), conic-gradient(var(--accent) calc(var(--pct) * 1%), var(--sunken) 0);border-radius:50%;place-content:center;width:120px;height:120px;margin:4px auto 14px;display:grid}.ring b{font:800 1.5rem var(--mono)}.ring span{color:var(--muted);font-size:.78rem}.settings{flex-direction:column;gap:14px;display:flex}.settings label{color:var(--muted);flex-direction:column;align-items:flex-start;gap:4px;font-size:.85rem;display:flex}.settings input{width:100%}@media (width<=900px){.hero,.player,.code-tab,.two-col,.lab-grid,.io{grid-template-columns:minmax(0,1fr)}.code-card{position:relative;top:0}.code{max-height:340px}.levels{grid-template-columns:1fr}.top{gap:8px;padding:8px 12px}.brand span{display:none}main{padding:16px 14px 48px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.split,.player{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:20px 32px;display:grid}.split>aside h3,.split>.prose h3,.side h3{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 .6em;font-size:.8rem}.split>.prose h3:not(:first-child){margin-top:2em}.side{flex-direction:column;gap:20px;display:flex;position:sticky;top:68px}.lab-grid{margin-top:16px}.side-panel{flex-direction:column;gap:8px;min-width:0;display:flex;position:sticky;top:68px}.side-panel .code-card{position:relative;top:0}.side-panel .code{max-height:calc(100vh - 140px)}.panel-switch{align-self:flex-start}.flow-card{max-height:calc(100vh - 140px);overflow:auto}mark{background:linear-gradient(transparent 55%, color-mix(in srgb, var(--gold) 75%, transparent) 55%);color:inherit;padding:0 2px;font-weight:600}.beat u,.pitfalls u{-webkit-text-decoration:underline wavy var(--lv,var(--accent));text-decoration:underline wavy var(--lv,var(--accent));text-underline-offset:4px;text-decoration-thickness:1.5px}.beat strong{color:var(--kc)}.beat code,.pitfalls code{background:var(--sunken);white-space:nowrap;border-radius:5px;padding:1px 6px;font-size:.9em}.story{flex-direction:column;gap:18px;margin:0;padding:0;list-style:none;display:flex;position:relative}.story:before{content:"";background:var(--line);width:2px;position:absolute;top:20px;bottom:20px;left:19px}.beat{grid-template-columns:40px minmax(0,1fr);gap:14px;display:grid;position:relative}.k-naive{--kc:var(--bad);--kb:var(--bad-bg)}.k-insight{--kc:#b7791f;--kb:color-mix(in srgb, var(--gold) 28%, var(--surface))}.k-how{--kc:var(--cmp);--kb:var(--cmp-bg)}.k-result{--kc:var(--ok);--kb:var(--ok-bg)}:root[data-theme=dark] .k-insight{--kc:var(--gold);--kb:#3d3410}.beat-no{background:var(--kc);color:#fff;width:40px;height:40px;font:800 1.05rem var(--mono);z-index:1;box-shadow:0 0 0 5px var(--bg);border-radius:50%;place-items:center;display:grid}.beat-body{background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--kc);border-radius:var(--r);min-width:0;padding:14px 18px 16px}.beat-kind{letter-spacing:.08em;text-transform:uppercase;color:var(--kc);background:var(--kb);border-radius:99px;padding:2px 10px;font-size:.7rem;font-weight:700;display:inline-block}.beat h3{letter-spacing:-.01em;margin:8px 0 6px;font-size:1.22rem}.beat p{margin:6px 0 0;font-size:1.03rem;line-height:1.75}.beat-fig{background:var(--bg);border-radius:10px;margin-top:12px;padding:10px 12px 2px;overflow:hidden}.beat-fig .stage{gap:8px;min-height:0;padding:0 0 8px}.k-insight .beat-body{background:color-mix(in srgb, var(--kb) 45%, var(--surface))}.naive{--vc:var(--bad)}.best{--vc:var(--ok)}.variant{color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;display:flex}.variant button{border-radius:99px;gap:8px;padding:6px 14px 6px 6px}.variant button b{background:var(--sunken);width:1.7em;height:1.7em;font:700 .78rem var(--mono);border-radius:50%;place-items:center;display:grid}.variant button code{color:var(--muted);font-size:.82rem}.variant button.on{border-color:var(--vc);background:color-mix(in srgb, var(--vc) 12%, var(--surface));font-weight:600}.variant button.on b{background:var(--vc);color:#fff}.chip.naive,.chip.best{border:1px solid var(--vc);background:0 0}.cx{border-collapse:collapse;width:100%;margin-bottom:14px}.cx th{text-align:left;color:var(--muted);padding:6px 8px 6px 0;font-size:.85rem;font-weight:400}.cx thead th{font-size:.75rem}.cx td{padding:6px 8px 6px 0}.cx tr.naive code{color:var(--bad)}.cx tr.best code{color:var(--ok);font-weight:700}.lab-table th.naive,.lab-table th.best{color:var(--vc)}.lab-table td.best{font-weight:700}.chart .series-naive .series,.chart .series-naive .dot{stroke:var(--bad)}.chart .series-best .series,.chart .series-best .dot{stroke:var(--ok)}.chart .series-name{font:700 11px var(--sans)}.chart .series-naive .series-name{fill:var(--bad)}.chart .series-best .series-name{fill:var(--ok)}svg.flow{width:100%;height:auto;margin:4px auto 8px;display:block}.flow-node rect,.flow-node polygon{fill:var(--surface);stroke:var(--muted);stroke-width:1.6px;transition:fill .2s,stroke .2s}.flow-node.k-test polygon{fill:color-mix(in srgb, var(--gold) 22%, var(--surface));stroke:#b7791f}.flow-node.k-start rect,.flow-node.k-end rect{fill:var(--accent-soft);stroke:var(--accent)}.flow-node.on rect,.flow-node.on polygon{fill:var(--act-bg);stroke:var(--act);stroke-width:3px}.flow-text{text-align:center;height:100%;font:600 13px/1.4 var(--sans);color:var(--ink);justify-content:center;align-items:center;display:flex}.flow-edge{fill:none;stroke:var(--muted);stroke-width:1.5px}.flow-head{fill:var(--muted)}.flow-label{font:700 11px var(--sans);fill:var(--muted)}@media (width<=900px){.split,.player{grid-template-columns:minmax(0,1fr)}.side,.side-panel{position:static}}.real{border-radius:var(--r);border-left:4px solid var(--gold);background:color-mix(in srgb, var(--gold) 12%, var(--surface));margin:18px 0;padding:14px 18px}.real h3{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 6px;font-size:.8rem}.real p{margin:0;line-height:1.7}.code-tools{z-index:1;color:var(--code-ink);align-items:center;gap:12px;font-size:.78rem;display:flex;position:absolute;top:8px;right:10px}.code-tools label{cursor:pointer;align-items:center;gap:5px;display:flex}.code-tools button{font-size:.78rem}.code-card.tall .code{padding-top:40px}.ln.note{margin-top:6px}.ln.note code{white-space:pre-wrap;font-style:italic;font-family:var(--sans,inherit);color:#8fd3a8;font-size:.86rem}.recap{flex-direction:column;gap:10px;padding-left:1.3em;line-height:1.65;display:flex}