:root{--bg:#faf9f7;--panel:#fff;--ink:#16161a;--dim:#5d6470;--line:#e2e0db;--accent:#1a56b8;--ok:#0d7a4f;--warn:#b02a1e;--warnbg:#fdeceb;--okbg:#e9f6f0;--rulebg:#eef3fc;--grid:#e3e1dc;--curve:#1a56b8;--mid:#b02a1e;--gold:#8a5a00;--goldbg:#fbf3df;--mono:ui-monospace,"SF Mono",Menlo,monospace;--ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#14151a;--panel:#1c1e25;--ink:#e8e8ea;--dim:#9aa2b1;--line:#2d3039;--accent:#78a9ff;--ok:#4ec99a;--warn:#ff8a7d;--warnbg:#3a1f1c;--okbg:#14312a;--rulebg:#1c2635;--grid:#2a2d36;--curve:#78a9ff;--mid:#ff8a7d;--gold:#e9bd62;--goldbg:#33290f}}
:root[data-theme="dark"]{--bg:#14151a;--panel:#1c1e25;--ink:#e8e8ea;--dim:#9aa2b1;--line:#2d3039;--accent:#78a9ff;--ok:#4ec99a;--warn:#ff8a7d;--warnbg:#3a1f1c;--okbg:#14312a;--rulebg:#1c2635;--grid:#2a2d36;--curve:#78a9ff;--mid:#ff8a7d;--gold:#e9bd62;--goldbg:#33290f}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:64px}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.62 Charter,"Iowan Old Style",Georgia,"Times New Roman",serif}
.bar{position:sticky;top:0;z-index:40;display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:9px 16px;background:var(--panel);border-bottom:1px solid var(--line);font:500 13px/1.3 var(--ui)}
.bar .t{font-weight:700}.bar .prog{color:var(--dim);font-variant-numeric:tabular-nums}.bar .sp{flex:1}
.bar button{font:inherit;padding:6px 11px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);cursor:pointer}
.bar button:hover{border-color:var(--accent);color:var(--accent)}.bar button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
:root[data-theme="dark"] .bar button.on{color:#10131a}
.lay{display:grid;grid-template-columns:minmax(0,1fr);gap:0;max-width:1220px;margin:0 auto;padding:0 16px 120px}
@media(min-width:1040px){.lay{grid-template-columns:240px minmax(0,1fr);gap:34px}}
.toc{font:500 13.5px/1.35 var(--ui);padding-top:22px}
@media(min-width:1040px){.toc{position:sticky;top:52px;align-self:start;max-height:calc(100vh - 60px);overflow:auto;padding-bottom:30px}}
.toc h5{margin:0 0 8px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim)}
.toc a{display:flex;gap:8px;align-items:baseline;padding:5px 8px;border-radius:7px;color:var(--ink);text-decoration:none;border-left:2px solid transparent}
.toc a:hover{background:var(--rulebg)}.toc a.cur{border-left-color:var(--accent);background:var(--rulebg)}
.toc a .n{font-family:var(--mono);font-size:12px;color:var(--dim);min-width:26px}.toc a.ok .n{color:var(--ok)}.toc a.ok .n::after{content:" ✓"}
.toc .grp{margin:16px 0 6px}
main{min-width:0;padding-top:26px}
h1{font-size:33px;line-height:1.15;margin:0 0 6px}.sub1{color:var(--dim);margin:0 0 20px;font-size:16px}
.urgent{background:var(--warnbg);border-left:4px solid var(--warn);padding:14px 18px;border-radius:0 8px 8px 0;margin:0 0 22px;font-size:16px}.urgent b{color:var(--warn)}
.how{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:14px 18px;margin:0 0 26px;font-size:15.5px}.how b{color:var(--accent)}
.sec{margin:0 0 54px;padding-top:6px}
h2{font-size:26px;line-height:1.2;margin:40px 0 10px;padding-bottom:9px;border-bottom:2px solid var(--line);display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
h2 .num{font:700 15px var(--mono);color:var(--accent);background:var(--rulebg);padding:3px 8px;border-radius:6px}
h2 .done{margin-left:auto;font:500 12.5px var(--ui);color:var(--dim);display:inline-flex;gap:6px;align-items:center;cursor:pointer}h2 .done input{accent-color:var(--ok);width:16px;height:16px}
.src{font:13px var(--ui);color:var(--dim);margin:-2px 0 12px}
.big{background:var(--rulebg);border-radius:10px;padding:14px 18px;margin:12px 0 16px;font-size:17.5px}.big>b:first-child{display:block;font:700 11.5px var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
h3.sub{font:700 13px var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--dim);margin:30px 0 12px;display:flex;align-items:center;gap:10px}h3.sub::after{content:"";flex:1;height:1px;background:var(--line)}
h3.sub .cnt{font-weight:500;text-transform:none;letter-spacing:0;order:2;white-space:nowrap}
.pre{border:1px dashed var(--line);border-radius:10px;padding:10px 16px;margin:0 0 14px;background:var(--panel)}.pre summary{cursor:pointer;font:600 14px var(--ui);color:var(--gold)}
.prq{margin:14px 0 18px;font-size:16px;padding-top:12px;border-top:1px dashed var(--line)}.prq:first-of-type{border-top:0;padding-top:4px}.prq>b:first-child{display:block;font:700 14px var(--ui);color:var(--gold);margin-bottom:5px}.prq p{margin:6px 0}.prq ol{margin:8px 0;padding-left:24px}.prq ol li{margin:9px 0;padding-left:3px}.prq .sk{background:var(--goldbg);border-radius:7px;padding:8px 12px;margin:8px 0}.prq .try{color:var(--dim);font-size:15px}.prq .fig{max-width:460px}
.vocab{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin:0}
.v{background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:10px 13px;cursor:default}.v .vis{display:block;margin:-2px -4px 6px;border-bottom:1px dashed var(--line);padding-bottom:4px}.v .vis svg{display:block;width:100%;height:auto;max-height:200px}.v .vis{cursor:zoom-in}.zoom{position:fixed;inset:0;z-index:90;background:rgba(10,12,16,.72);display:flex;align-items:center;justify-content:center;padding:18px}.zoom .zc{background:var(--panel);color:var(--ink);border-radius:14px;max-width:760px;width:100%;max-height:92vh;overflow:auto;padding:18px 22px;border:1px solid var(--line)}.zoom .zc svg{display:block;width:100%;height:auto;max-height:56vh}.zoom .zt{font:700 22px var(--ui);color:var(--accent);margin:10px 0 4px}.zoom .zb{font-size:18px}.zoom .zx{float:right;font:600 13px var(--ui);padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);cursor:pointer}.zoom .eg,.zoom .like{display:block;margin-top:6px}.zoom .like{color:var(--gold)}.zoom .eg{color:var(--dim)}
.v .sayrow{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin:1px 0 5px}.v .say{font:13px var(--ui);color:var(--dim)}.v .say i{color:var(--gold);font-style:normal;font-weight:600}.v .hear{font:600 11.5px var(--ui);padding:2px 9px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--accent);cursor:pointer}.v .hear:hover{border-color:var(--accent)}.v .hear.on{background:var(--accent);color:#fff}.v dt{font-size:17px}
.v dt{font:700 15px var(--ui);color:var(--accent);margin:0 0 3px}.v dd{margin:0;font-size:15px;line-height:1.5}
.v .eg{display:block;margin-top:5px;color:var(--dim);font-size:14px}
body.quiz .v dd,body.quiz .v .vis{filter:blur(7px);cursor:pointer;user-select:none;transition:filter .15s}body.quiz .v.show .vis{filter:none}body.quiz .v.show dd{filter:none}body.quiz .v{cursor:pointer}
.th{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:15px 19px;margin:0 0 12px}
.th h4{margin:0 0 7px;font-size:18px;display:flex;gap:10px;align-items:baseline}.th h4 span{font:700 12px var(--mono);color:#fff;background:var(--accent);border-radius:999px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;flex:none;position:relative;top:-2px}
:root[data-theme="dark"] .th h4 span{color:#10131a}
.th p{margin:7px 0}.th ul,.th ol{margin:7px 0;padding-left:22px}.th li{margin:4px 0}
.key{background:var(--rulebg);border-radius:8px;padding:10px 14px;margin:9px 0;font-size:17px}.key b.k{display:block;font:700 11px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:3px}
.why{border-left:3px solid var(--gold);background:var(--goldbg);padding:8px 13px;border-radius:0 7px 7px 0;margin:9px 0;font-size:15.5px}.why b{color:var(--gold)}
table{border-collapse:collapse;width:100%;margin:10px 0;font-size:15px}th,td{border:1px solid var(--line);padding:6px 9px;text-align:center}th{background:var(--rulebg);font:700 13px var(--ui)}td:first-child,th:first-child{font-weight:700}
table.l td,table.l th{text-align:left}table.l td:first-child{white-space:nowrap}
.tw{overflow-x:auto;max-width:100%}
.ex{border:1px solid var(--line);border-left:4px solid var(--accent);background:var(--panel);border-radius:0 10px 10px 0;padding:14px 18px;margin:0 0 14px}
.exh{font:700 12px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}.exh span{margin-left:9px;color:var(--dim);font-weight:500;text-transform:none;letter-spacing:0;font-size:13px}
.ex .q{font-size:17.5px;margin:6px 0 8px;font-weight:600}
ol.steps{margin:6px 0;padding-left:22px}ol.steps>li{margin:7px 0;padding-left:2px}
ol.steps .s{display:block}ol.steps .r{display:inline-block;margin-top:2px;font:500 12.5px var(--ui);color:var(--gold);background:var(--goldbg);padding:1px 8px;border-radius:5px}
.ans{background:var(--panel);border:2px solid var(--ok);border-left-width:7px;padding:12px 16px 10px;border-radius:10px;margin:14px 0 0;font-size:18px;font-weight:600;box-shadow:0 0 0 4px var(--okbg)}.ans b.lbl{display:inline-block;background:var(--ok);color:var(--bg);padding:3px 11px;border-radius:999px;font:800 11.5px var(--ui);letter-spacing:.07em;text-transform:uppercase;margin-bottom:8px}.ans .aone{line-height:1.5}.alist{list-style:none;margin:0;padding:0}.alist li{padding:6px 0 6px 18px;border-bottom:1px dashed var(--line);position:relative}.alist li:last-child{border-bottom:0}.alist li::before{content:'▸';position:absolute;left:0;color:var(--ok)}
.chk{color:var(--dim);font-size:14.5px;margin-top:7px}.chk>b:first-child{font:700 11.5px var(--ui);text-transform:uppercase;letter-spacing:.05em}
ul.traps{list-style:none;padding:0;margin:0}ul.traps li{background:var(--warnbg);border-left:3px solid var(--warn);padding:8px 13px;border-radius:0 7px 7px 0;margin:0 0 7px;font-size:15.5px}
.quick details{border:1px solid var(--line);background:var(--panel);border-radius:9px;padding:9px 14px;margin:0 0 7px}.quick summary{cursor:pointer;font-weight:600}.quick .qa{margin-top:7px;padding-top:7px;border-top:1px dashed var(--line);color:var(--ink)}
.f{display:inline-flex;flex-direction:column;align-items:stretch;vertical-align:middle;text-align:center;margin:0 .2em;font-size:.9em;line-height:1.18;white-space:nowrap}.f>b{border-bottom:1.4px solid currentColor;padding:0 .32em .08em;font-weight:inherit}.f>i{padding:.06em .32em 0;font-style:normal}.f .f{font-size:.9em}
.sq{display:inline-block;position:relative;padding-left:.62em;white-space:nowrap}.sg{position:absolute;left:0;top:0;width:.68em;height:100%;overflow:visible}.sg path{fill:none;stroke:currentColor;stroke-width:1.4;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}.rad{display:inline-block;border-top:1.4px solid currentColor;padding:.07em .14em 0 .08em;line-height:1.18}.vh{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0}
code,.m{font-family:var(--mono);font-size:.92em}
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:10px 0}
.fig{margin:10px 0;background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:8px 10px}.figs .fig{margin:0}
.fig figcaption{font:13px var(--ui);color:var(--dim);text-align:center;margin-top:3px}
svg.plot{display:block;width:100%;height:auto;overflow:visible}svg .dom{stroke:var(--accent);stroke-width:8;stroke-opacity:.35;stroke-linecap:round}svg .rng{stroke:var(--gold);stroke-width:8;stroke-opacity:.5;stroke-linecap:round}svg .lbdom{font:700 11.5px var(--ui);fill:var(--accent)}svg .lbrng{font:700 11.5px var(--ui);fill:var(--gold)}.fig svg{max-height:380px}svg .ax{stroke:var(--dim);stroke-width:1.3}svg .grid{stroke:var(--grid);stroke-width:1}svg .asym{stroke:var(--mid);stroke-width:1.2;stroke-dasharray:5 4}
svg .c1{stroke:var(--curve);stroke-width:2.4;fill:none;stroke-linejoin:round;stroke-linecap:round}svg .c2{stroke:var(--mid);stroke-width:2.2;fill:none}svg .c3{stroke:var(--dim);stroke-width:1.5;fill:none;stroke-dasharray:4 4}
svg .hl{stroke:var(--gold);stroke-width:1.4;stroke-dasharray:6 4}
svg .tk{font:11px var(--ui);fill:var(--dim)}svg .lb{font:600 12px var(--ui);fill:var(--ink)}svg .lbd{font:12px var(--ui);fill:var(--dim)}svg .lba{font:700 12.5px var(--ui);fill:var(--accent)}svg .lbw{font:700 12.5px var(--ui);fill:var(--mid)}
svg .pt{fill:var(--mid)}svg .dotc{fill:var(--curve);stroke:var(--curve);stroke-width:2}svg .doto{fill:var(--panel);stroke:var(--curve);stroke-width:2}
svg .arc{stroke:var(--gold);stroke-width:2;fill:none}svg .ah{fill:var(--gold)}svg .wd{fill:var(--rulebg);stroke:var(--line);stroke-width:1}svg .wdo{fill:var(--accent);fill-opacity:.28;stroke:var(--accent);stroke-width:1.2}svg .wdx{fill:var(--mid);fill-opacity:.3;stroke:var(--mid);stroke-width:1.2}svg .dim{stroke:var(--dim);stroke-width:1.2;fill:none;stroke-dasharray:3 3}svg .vx{fill:var(--ink)}svg .lbs{font:600 10.5px var(--ui);fill:var(--ink)}svg .lbsa{font:700 10.5px var(--ui);fill:var(--accent)}svg .lbsw{font:700 10.5px var(--ui);fill:var(--mid)}svg .lbsd{font:10.5px var(--ui);fill:var(--dim)}svg .lbsg{font:700 10.5px var(--ui);fill:var(--gold)}
svg .sh{fill:var(--rulebg);stroke:var(--accent);stroke-width:1.6}svg .ln{stroke:var(--ink);stroke-width:1.8;fill:none}svg .lna{stroke:var(--accent);stroke-width:2.2;fill:none}svg .lnw{stroke:var(--mid);stroke-width:2.2;fill:none}
.lab{background:var(--panel);border:2px solid var(--accent);border-radius:12px;padding:16px 18px;margin:16px 0}.lab h4{margin:0 0 3px;color:var(--accent);font-size:19px}.lab .ls{color:var(--dim);font-size:14.5px;margin:0 0 12px}
.ctrls{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px 14px;margin:10px 0}.ctrl label{display:block;font:12.5px var(--mono);color:var(--dim);margin-bottom:2px}.ctrl input[type=range]{width:100%;accent-color:var(--accent)}.ctrl select{width:100%;font:14px var(--ui);padding:6px;border-radius:7px;border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.ro{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin:12px 0 0}.ro div{background:var(--rulebg);border-radius:8px;padding:8px 10px;text-align:center}.ro span{display:block;font:11px var(--ui);color:var(--dim);text-transform:uppercase;letter-spacing:.05em}.ro b{font:700 16px var(--mono);color:var(--accent)}
canvas.cv{display:block;width:100%;height:280px;border:1px solid var(--line);border-radius:9px;background:var(--bg)}
.eqn{font:600 19px var(--mono);text-align:center;margin:8px 0;color:var(--ink)}
.ucw{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:16px;align-items:center}@media(max-width:700px){.ucw{grid-template-columns:1fr}}
#uc circle.a{fill:var(--panel);stroke:var(--accent);stroke-width:2;cursor:pointer}#uc circle.a:hover,#uc circle.a.on{fill:var(--accent)}
.gl input{width:100%;font:15px var(--ui);padding:9px 12px;border-radius:9px;border:1px solid var(--line);background:var(--panel);color:var(--ink);margin:0 0 12px}
.gl dl{margin:0;columns:2 320px;column-gap:26px}.gl .g{break-inside:avoid;margin:0 0 9px;font-size:15px}.gl dt{display:inline;font:700 14.5px var(--ui);color:var(--accent)}.gl dd{display:inline;margin:0}.gl dd a{font:12px var(--mono);color:var(--dim);text-decoration:none;margin-left:5px}
.fs{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}.fs .key{margin:0}
.nlrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:10px 0}.nlrow>div{background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:8px 10px;text-align:center;font-size:15px}.nlrow code{font-size:15px}
@media(max-width:1039px){.toc{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-top:14px;background:var(--panel)}}
@media(max-width:600px){body{font-size:16px}h1{font-size:27px}h2{font-size:22px}.lay{padding:0 12px 100px}.th,.ex{padding:12px 14px}}
@media print{.bar,.toc,.lab{display:none!important}.lay{display:block}body{background:#fff;color:#000;font-size:11pt}.quick details{break-inside:avoid}.ex,.th,.v{break-inside:avoid}}

.lesson{padding:18px 20px}.lesson h4{font-size:20px;margin-bottom:12px}
.lg{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,340px);gap:18px;align-items:start}.lg.nofig{grid-template-columns:minmax(0,1fr)}.lg .fig{margin:0}
@media(max-width:820px){.lg{grid-template-columns:minmax(0,1fr)}}
.plain{font-size:17.5px}.plain p{margin:0 0 9px}.tagl{display:block;font:700 11px var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--dim);margin-bottom:5px}
.how2{margin:12px 0 4px}.how2 ol{margin:4px 0;padding-left:24px}.how2 li{margin:5px 0}
.trap1{background:var(--warnbg);border-left:3px solid var(--warn);padding:8px 13px;border-radius:0 7px 7px 0;margin:12px 0 0;font-size:15.5px}.trap1 b{color:var(--warn)}
.lesson .ex{margin:12px 0 0;border-left-color:var(--ok)}.lesson .exh{color:var(--ok)}
.exh .tag{float:right;font:500 11.5px var(--ui);font-style:normal;text-transform:none;letter-spacing:0;color:var(--dim);border:1px solid var(--line);border-radius:999px;padding:1px 8px}
ol.steps.s2 .r{display:block;background:none;border-left:2px solid var(--gold);border-radius:0;padding:0 0 0 9px;margin-top:3px;font-size:13.5px;line-height:1.4}
.v .like{display:block;margin-top:5px;color:var(--gold);font-size:14.5px}
.tagl.e5{color:var(--gold)}.lesson.keystone{border:2px solid var(--gold);box-shadow:0 0 0 4px var(--goldbg)}.ks{font:800 11px var(--ui);font-style:normal;letter-spacing:.07em;text-transform:uppercase;background:var(--gold);color:var(--bg);padding:3px 9px;border-radius:999px;margin-left:10px;white-space:nowrap}
.ways{margin:12px 0}.wgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.way{border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:9px;padding:10px 13px;background:var(--bg);font-size:15.5px}.way p{margin:5px 0}.wl{display:inline-block;font:700 11.5px var(--ui);letter-spacing:.05em;text-transform:uppercase;color:var(--gold);margin-bottom:3px}
.parts{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin:12px 0}.part{border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:0 10px 10px 0;padding:12px 15px;background:var(--bg)}.part h5{margin:0 0 6px;font-size:17px;display:flex;gap:9px;align-items:baseline}.part h5 span{font:700 12px var(--mono);color:var(--accent)}.facts{margin:6px 0;padding-left:20px;font-size:15.5px}
.ladder{margin:14px 0;padding:12px 14px;border:1px dashed var(--accent);border-radius:10px}.ladder .ex{margin-top:10px}
.pi details summary{cursor:pointer;list-style:none;padding:2px 4px;border-radius:6px}.pi details summary::-webkit-details-marker{display:none}.pi details summary:hover{background:var(--rulebg)}.pmore{display:inline-block;margin-left:8px;font:700 10.5px var(--ui);letter-spacing:.05em;text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);border-radius:999px;padding:0 7px;vertical-align:1px}.pi details[open] .pmore{background:var(--accent);color:var(--bg)}.pib{margin:8px 0 12px;padding:10px 12px;border-left:3px solid var(--accent);background:var(--bg);border-radius:0 8px 8px 0}.pib .ex{margin:10px 0}.phint{font:13px var(--ui);color:var(--dim);margin:6px 0 0}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}.rule2{border:1px solid var(--line);border-radius:10px;padding:12px 15px;background:var(--panel)}.rule2 h4{margin:0 0 6px;font-size:17px;display:flex;gap:9px}.rule2 h4 span{font:700 12px var(--mono);color:var(--accent)}.bg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.bg>div{border-radius:8px;padding:8px 10px;font-size:15px}.bg b{display:block;font:700 11px var(--ui);letter-spacing:.06em;text-transform:uppercase;margin-bottom:3px}.bad{background:var(--warnbg)}.bad b{color:var(--warn)}.good{background:var(--okbg)}.good b{color:var(--ok)}
.paper{border:1px solid var(--line);border-left:4px solid var(--mid);border-radius:8px;background:var(--panel);padding:4px 14px 8px;margin:8px 0}.phead{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,36%);gap:14px;font:700 11px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);padding:6px 0;border-bottom:1px solid var(--line)}.pl{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,36%);gap:14px;padding:7px 0;border-bottom:1px dashed var(--line)}.pw{font-size:18px}.pn{font:13.5px/1.4 var(--ui);color:var(--gold)}.pts{font-size:15px;margin:8px 0 0}
@media(max-width:700px){.pl,.phead{grid-template-columns:1fr}.bg{grid-template-columns:1fr}}
.tkgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}.tk{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--panel)}.tk h4{margin:0 0 4px;font-size:18px;display:flex;gap:9px;align-items:baseline}.tk h4 span{font:700 12px var(--mono);color:#fff;background:var(--accent);border-radius:999px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center}.tkf{font:600 22px var(--mono);text-align:center;margin:4px 0}.tke{font-size:15.5px}.tk table{font-size:14px}
.symt td.sym{font:700 20px var(--mono);text-align:center;white-space:nowrap}
.big p{margin:0 0 7px}.big p:last-child{margin:0}
details.try{margin:7px 0;border:1px solid var(--line);border-radius:8px;padding:7px 12px;background:var(--bg);font-size:15px}details.try summary{cursor:pointer}details.try .qa{margin-top:6px;padding-top:6px;border-top:1px dashed var(--line)}
.prq .why{margin:8px 0}.prq .fig{max-width:340px}.prq .fig svg{max-height:200px}
svg .ftc{fill:var(--panel);stroke:var(--line);stroke-width:1.2}svg .fte{fill:color-mix(in srgb,var(--accent) 16%,var(--panel));stroke:var(--accent);stroke-width:2}svg .fts{fill:color-mix(in srgb,var(--gold) 20%,var(--panel));stroke:var(--gold);stroke-width:2}
svg .fta{stroke:var(--accent);stroke-width:2.2}svg .ftah{fill:var(--accent)}svg .ftw{stroke:var(--gold);stroke-width:2.2}svg .ftwh{fill:var(--gold)}svg .ftdot{fill:var(--accent)}svg .ftdotw{fill:var(--gold)}svg .mir{stroke:var(--dim);stroke-dasharray:4 4;stroke-width:1.2}
svg .nlseg{stroke:var(--accent);stroke-width:5;stroke-linecap:round}svg .nlhead{fill:var(--accent)}svg .nlc{fill:var(--accent);stroke:var(--accent);stroke-width:2}svg .nlo{fill:var(--bg);stroke:var(--accent);stroke-width:2.5}
svg .nst0{fill:none;stroke:var(--line);stroke-width:1.5}svg .nst1,svg .nst2,svg .nst3,svg .nst4{fill:color-mix(in srgb,var(--accent) 7%,transparent);stroke:var(--accent);stroke-width:1.3}svg .nsti{fill:color-mix(in srgb,var(--gold) 12%,transparent);stroke:var(--gold);stroke-width:1.3}
body{padding-bottom:156px}
.wbar{position:sticky;top:0;z-index:40;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:9px 16px;background:var(--panel);border-bottom:1px solid var(--line);font:500 13.5px/1.3 var(--ui)}
.wbar .wt{font-weight:800;font-size:15px}.wbar .sp{flex:1}.wsel{display:flex;gap:6px;align-items:center;color:var(--dim)}
.wbar select,.wbar button{font:600 13.5px/1.2 var(--ui);padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink);max-width:62vw}
.wbar button{cursor:pointer}#wmenu{display:none}
.wlay{display:grid;grid-template-columns:330px minmax(0,1fr);gap:26px;max-width:1240px;margin:0 auto;padding:0 16px}
.wside{position:sticky;top:54px;align-self:start;max-height:calc(100vh - 190px);overflow:auto;padding:16px 0 20px;font:500 13.5px/1.35 var(--ui)}
.wsh{color:var(--dim);margin:0 0 10px}.wsh b{color:var(--ink)}
.wclips{list-style:none;margin:0;padding:0}.wclips .lh{margin:12px 0 4px;font:800 11.5px/1.3 var(--ui);letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.wclips .lh.fo{color:var(--gold)}
.wclips button{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:6px;width:100%;text-align:left;padding:7px 8px;border:0;border-left:3px solid transparent;border-radius:0 8px 8px 0;background:none;color:var(--ink);font:inherit;cursor:pointer}
.wclips button:hover{background:var(--rulebg)}.wclips button.cur{background:var(--rulebg);border-left-color:var(--accent);font-weight:700}
.wclips .n{color:var(--dim);font-variant-numeric:tabular-nums}.wclips .t{color:var(--dim);font-variant-numeric:tabular-nums}
.wclips button.seen .n{color:var(--ok)}.wclips button.sub .tt{padding-left:10px}
.wvid{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}.wvid h5{margin:0 0 6px;font:800 11.5px var(--ui);letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}
.wvid a{display:block;padding:5px 0;color:var(--accent);text-decoration:none}.wvid a span{color:var(--dim)}
.wstage{min-width:0;padding:22px 0 30px;max-width:780px}
.wk{font:800 12px/1.4 var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}.wk .fo{color:var(--gold)}
.wstage h2{font-size:27px;line-height:1.2;margin:4px 0 2px}.wstage h3{font-size:19px;margin:2px 0 0;color:var(--accent)}
.wex{font:600 14px var(--ui);color:var(--dim);margin:6px 0 14px}.wex em{font-style:normal;border:1px solid var(--line);border-radius:999px;padding:1px 8px;margin-left:8px;font-weight:500;font-size:12px}
.beat{display:none;margin:12px 0;padding:12px 16px;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:0 12px 12px 0;background:var(--panel)}
.beat.on{display:block;animation:wrise .45s ease}.beat.now{border-left-color:var(--accent);box-shadow:0 0 0 3px var(--rulebg)}
.beat .tagl{display:block;font:800 11px var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
.beat.idea{border-left-color:var(--gold);background:var(--goldbg)}.beat.idea .tagl{color:var(--gold)}
.beat.q{font-size:19px}.beat.q .figs{margin-top:10px}
.beat.step{display:none;grid-template-columns:34px minmax(0,1fr);gap:4px 10px}.beat.step.on{display:grid}
.beat.step .k{grid-row:1 / span 2;width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--bg);font:800 15px/30px var(--ui);text-align:center}
.beat.step .wd{font-size:19.5px;line-height:1.55}.beat.step.now .wd{animation:wwipe .9s ease-out}
.beat.step .wr{grid-column:2;font-size:15.5px;color:var(--dim);border-left:2px solid var(--gold);padding-left:9px}.beat.step .wr>b:first-child{font:800 11px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--gold);margin-right:6px}.beat.step .wr b:not(:first-child){color:var(--accent)}
.beat.ans{border-left-color:var(--ok);background:var(--okbg);font-size:20px}.beat.ans .tagl{color:var(--ok)}.beat.ans.now{animation:wpop .5s ease}
.beat.ans ul{margin:0;padding-left:22px}.beat.chk{font-size:16px}.beat.trap{border-left-color:var(--warn);background:var(--warnbg);font-size:16px}.beat.trap .tagl{color:var(--warn)}
.wdone{margin:26px 0;padding:18px 20px;border:2px solid var(--ok);border-radius:14px;background:var(--okbg);font:600 17px/1.5 var(--ui)}
.wdone button{font:700 15px var(--ui);margin:10px 8px 0 0;padding:10px 14px;border-radius:10px;border:1px solid var(--ok);background:var(--panel);color:var(--ink);cursor:pointer}
.wctl{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--panel);border-top:1px solid var(--line);padding:0 12px 10px;font:600 14px/1.3 var(--ui)}
.wprog{height:5px;background:var(--line);margin:0 -12px 9px}.wprog i{display:block;height:100%;width:0;background:var(--accent);transition:width .35s}
.wdots{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin:0 0 8px}
.wdots button{width:24px;height:10px;border-radius:5px;border:0;padding:0;background:var(--line);cursor:pointer}.wdots button.x{width:13px}
.wdots button.done{background:color-mix(in srgb,var(--accent) 45%,var(--line))}.wdots button.cur{background:var(--accent)}.wdots button:hover{outline:2px solid var(--accent)}
.wbtns{display:flex;gap:8px;justify-content:center;align-items:center}.wbtns button.sm{font-size:13px;padding:12px 10px;color:var(--dim)}
.wbtns button{font:700 15px/1 var(--ui);padding:12px 14px;border-radius:11px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer}
.wbtns button.big{min-width:150px;background:var(--accent);border-color:var(--accent);color:var(--bg);font-size:17px}
.wstat{text-align:center;color:var(--dim);margin-top:7px;font-variant-numeric:tabular-nums}
.wstart{position:fixed;inset:0;z-index:90;background:rgba(10,14,24,.78);display:flex;align-items:center;justify-content:center;padding:20px}
.wstart[hidden]{display:none}.wsc{max-width:560px;background:var(--panel);border-radius:18px;padding:26px 28px;text-align:center}
.wsc h1{font-size:26px;margin:0 0 8px}.wsc p{margin:0 0 14px;color:var(--dim);font:500 16px/1.5 var(--ui)}
#wgo{font:800 26px/1.2 var(--ui);padding:20px 44px;border-radius:16px;border:0;background:var(--accent);color:var(--bg);cursor:pointer}.wkeys{margin-top:16px!important;font-size:13.5px!important}
.ptab{width:auto;min-width:240px;margin:2px auto 6px;border-collapse:collapse;font:600 15px/1.3 var(--ui)}
.ptab th,.ptab td{padding:6px 13px;border-bottom:1px solid var(--line);text-align:center}
.ptab th{font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--dim)}.ptab tr.hit td{background:var(--okbg);color:var(--ok);font-weight:800}
.wtool{margin:18px 0;padding:12px 16px;border:1px dashed var(--accent);border-radius:12px;background:var(--panel)}
.wtool .tagl{display:block;font:800 11px var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.wtr{font:700 19px/1.6 var(--ui)}.wtool input{width:78px;font:700 17px var(--ui);padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);text-align:center}
.wth{font:500 13px/1.4 var(--ui);color:var(--dim);margin:6px 0 8px}#fout p{margin:6px 0;font:500 16px/1.5 var(--ui)}#fout .ptab{margin:6px 0}
.beat.ans.why{font-size:17px;background:var(--rulebg);border-left-color:var(--accent)}.beat.ans.why .tagl{color:var(--accent)}
.beat.idea{font-size:17.5px}.tryl{margin:2px 0;padding-left:22px}.tryl li{margin:6px 0}.tra{margin-top:3px;padding-left:9px;border-left:2px solid var(--ok);color:var(--ink)}
.tra b,.trw b{font:800 11px var(--ui);letter-spacing:.06em;text-transform:uppercase;margin-right:7px}.tra b{color:var(--ok)}.trw{margin:4px 0}.trw b{color:var(--warn)}.trw b:last-of-type{color:var(--ok)}
.wtk{border-radius:3px;transition:background-color .15s linear,box-shadow .15s linear}
.wtk.rd{background:none}
.wtk.cur{background:color-mix(in srgb,var(--accent) 12%,transparent);box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--accent) 50%,transparent)}
.beat.step .k .wtk{background:none!important;color:inherit!important}.beat.step.now .k{animation:wpop .5s ease}
.beat.now .figs{animation:wglow 1.6s ease-in-out 1;border-radius:10px}
.beat.step .wf{grid-column:2;margin:4px 0 2px}.beat.step .wf .fig{margin:0;max-width:360px}.beat.step .wf .figs{margin:0}
.beat .wd b,.beat.idea b:not(.tagl),.beat.q b:not(.tagl),.beat.ans b:not(.tagl){color:var(--accent)}
.beat.now .hwplot .cv,.beat.now svg .c1{stroke-dasharray:3000;stroke-dashoffset:3000;animation:wdraw 1.8s ease-out .15s forwards}
.beat.now .ptab tr{animation:wrise .5s ease both}.beat.now .ptab tr:nth-child(2){animation-delay:.15s}.beat.now .ptab tr:nth-child(3){animation-delay:.3s}.beat.now .ptab tr:nth-child(4){animation-delay:.45s}.beat.now .ptab tr:nth-child(5){animation-delay:.6s}.beat.now .ptab tr:nth-child(n+6){animation-delay:.75s}
@keyframes wdraw{to{stroke-dashoffset:0}}
@keyframes wglow{0%,100%{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 0 6px var(--goldbg)}}
@keyframes wrise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes wwipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes wpop{0%{transform:scale(.96)}60%{transform:scale(1.02)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.beat.on,.beat.step.now .wd,.beat.ans.now,.beat.now .ptab tr{animation:none}.beat.now .hwplot .cv,.beat.now svg .c1{animation:none;stroke-dasharray:none;stroke-dashoffset:0}}
@media(max-width:900px){.wlay{grid-template-columns:minmax(0,1fr)}#wmenu{display:inline-block}
 .wside{display:none;position:fixed;left:0;right:0;top:var(--wtop,124px);bottom:var(--wbot,122px);align-self:auto;justify-self:auto;height:auto;max-height:none;overflow:auto;z-index:45;background:var(--bg);padding:14px 16px}.wside.open{display:block}
 .wstage h2{font-size:22px}.beat.q,.beat.step .wd{font-size:17.5px}.wbtns button{padding:12px 9px}.wbtns button.big{min-width:104px}.wbtns .lbl{display:none}}

.w-full{width:100%}.mt-14{margin-top:14px}