:root{color-scheme:light dark;--bg:#f6f5f2;--surface:#fff;--surface-2:#efede8;--text:#1d1c1a;--muted:#5d5952;--line:#dcd8d0;--accent:#c23f22;--accent-soft:#fbe2da;--accent-ink:#fff;--hold:#2563c9;--hold-soft:#dce8fb;--ok:#17693a;--ok-soft:#dcf2e4;--panel:#e8e6e1;--panel-line:#8f8a82;--pad:#fbfaf7;--shift:#e58d74;--screen:#121212;--screen-ink:#f1f1f1;--radius:14px;--shadow:0 1px 2px #0000000f, 0 4px 16px #0000000d;--font:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;--max:72rem;--gutter:16px}@media (prefers-color-scheme:dark){:root{--bg:#141312;--surface:#1e1d1b;--surface-2:#272522;--text:#f1efeb;--muted:#aba59c;--line:#36332f;--accent:#ff7657;--accent-soft:#4b2219;--accent-ink:#1a0b07;--hold:#74a6ff;--hold-soft:#1c2d4d;--ok:#52c585;--ok-soft:#173826;--panel:#2b2926;--panel-line:#77726a;--pad:#383531;--shift:#d77d63;--shadow:0 1px 2px #0006, 0 4px 16px #0000004d}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);overflow-wrap:anywhere;margin:0;font-size:1.0625rem;line-height:1.6}img,svg{max-width:100%}a{color:var(--accent);text-underline-offset:.15em}a:hover{text-decoration-thickness:2px}:focus-visible{outline:3px solid var(--hold);outline-offset:2px;border-radius:4px}h1,h2,h3{letter-spacing:-.01em;line-height:1.2}h1{margin:.2em 0 .3em;font-size:clamp(1.8rem,4vw + 1rem,2.8rem)}h2{margin:2rem 0 .6rem;font-size:1.45rem}h3{font-size:1.15rem}code,kbd{font-family:var(--mono);font-size:.92em}kbd{border:1px solid var(--line);background:var(--surface);border-bottom-width:2px;border-radius:6px;padding:.05em .4em}.wrap{max-width:var(--max);padding:0 var(--gutter);margin:0 auto}.site-header{border-bottom:1px solid var(--line);background:var(--surface)}.site-header .wrap{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1.25rem;padding-top:.7rem;padding-bottom:.7rem;display:flex}.brand{color:var(--text);align-items:center;gap:.55rem;font-size:1.15rem;font-weight:750;text-decoration:none;display:inline-flex}.brand svg{width:28px;height:28px}.site-nav{flex-wrap:wrap;gap:.25rem 1rem;display:flex}.site-nav a{color:var(--muted);padding:.2rem 0;font-weight:600;text-decoration:none}.site-nav a:hover,.site-nav a[aria-current=page]{color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}main{padding:1.5rem 0 3rem;display:block}.site-footer{border-top:1px solid var(--line);color:var(--muted);padding:1.5rem 0 2.5rem;font-size:.9rem}.site-footer p{margin:.3rem 0}.button{border:2px solid var(--accent);background:var(--accent);min-height:44px;color:var(--accent-ink);font:inherit;cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:.4rem;padding:.55rem 1.1rem;font-weight:700;text-decoration:none;display:inline-flex}.button:hover{filter:brightness(1.05)}.button.secondary{color:var(--text);border-color:var(--line);background:0 0}.button:disabled{opacity:.45;cursor:not-allowed}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.1rem 1.2rem}.muted{color:var(--muted)}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}.move-diagram{width:100%;height:auto;color:var(--text);user-select:none;-webkit-tap-highlight-color:transparent;display:block}.move-diagram .panel{fill:var(--panel);stroke:var(--panel-line);stroke-width:2px}.move-diagram .bump{fill:var(--surface-2);stroke:var(--panel-line);stroke-width:2px}.move-diagram .led{fill:var(--panel-line);opacity:.6}.move-diagram .step-mark{fill:none;stroke:var(--panel-line);stroke-width:1.6px}.ctl .shape{fill:var(--surface);stroke:var(--panel-line);stroke-width:2px;transition:fill .15s,stroke .15s}.ctl-pad .shape{fill:var(--pad)}.ctl-screen .shape{fill:var(--screen);stroke:var(--panel-line)}.move-diagram .screen-line{stroke:var(--screen-ink);stroke-width:2px;opacity:.35}.ctl[data-control=shift] .shape{fill:var(--shift)}.ctl[data-control=power] .shape{fill:#f2b233}.ctl[data-control=mic] .shape{fill:var(--panel-line)}.ctl .glyph{fill:none;stroke:currentColor;stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.ctl .glyph.thin{stroke-width:1.4px;opacity:.5}.ctl .glyph.fill{fill:currentColor;stroke:none}.ctl .glyph-text{fill:currentColor;font:700 22px var(--font);text-anchor:middle;dominant-baseline:central;pointer-events:none}.ctl .port-label{fill:var(--muted);font:600 24px var(--font);text-anchor:middle}.ctl .halo{fill:none;stroke:var(--accent);stroke-width:5px;opacity:0;pointer-events:none}.ctl[data-active] .shape{fill:var(--accent-soft);stroke:var(--accent);stroke-width:4px}.ctl[data-active] .halo{opacity:1;animation:1.4s ease-in-out infinite halo-pulse}.ctl[data-held] .shape{fill:var(--hold-soft);stroke:var(--hold)}.ctl[data-held] .halo{stroke:var(--hold)}@keyframes halo-pulse{0%,to{opacity:1;stroke-width:5px}50%{opacity:.25;stroke-width:11px}}.move-diagram.is-interactive .ctl{cursor:pointer}.move-diagram.is-interactive .ctl:hover .shape{stroke:var(--accent)}.move-diagram .ctl:focus{outline:none}.move-diagram .ctl:focus-visible .halo{opacity:1;stroke:var(--hold)}.badge rect{fill:var(--accent);stroke:var(--surface);stroke-width:3px;vector-effect:non-scaling-stroke}.badge text{fill:var(--accent-ink);font-family:var(--font);text-anchor:middle;dominant-baseline:central;font-weight:800}.diagram-legend{color:var(--muted);flex-wrap:wrap;gap:.3rem 1rem;margin:.4rem 0 0;padding:0;font-size:.85rem;list-style:none;display:flex}.diagram-legend li:before{content:"";vertical-align:-.05em;border:2px solid var(--accent);background:var(--accent-soft);border-radius:50%;width:.8em;height:.8em;margin-right:.35em;display:inline-block}.diagram-legend li.hold:before{border-color:var(--hold);background:var(--hold-soft)}.lede{color:var(--muted);max-width:44rem;font-size:1.1rem}.controls-layout{gap:1rem 2rem;display:grid}.controls-figure{z-index:2;background:var(--bg);padding:.5rem 0;position:sticky;top:0}.controls-figure .back-panel{margin-top:.4rem}.figure-caption{margin:.3rem 0 0;font-size:.85rem}.controls-list h2:first-child{margin-top:.5rem}.control-entry{margin:0 0 .8rem;scroll-margin:45vw 0 1rem;transition:border-color .2s,box-shadow .2s}.control-entry h3{margin:0 0 .3rem}.control-entry p{margin:.3rem 0}.control-entry.is-current{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft), var(--shadow)}.shift-chip{background:var(--shift);color:#1a0b07;border-radius:999px;padding:0 .5em;font-size:.8em;font-weight:700;display:inline-block}.shortcut-table{border-collapse:collapse;width:100%;font-size:.95rem}.shortcut-table th,.shortcut-table td{text-align:left;border-bottom:1px solid var(--line);vertical-align:top;padding:.35rem .5rem}.shortcut-table td:first-child{white-space:nowrap;font-weight:600}@media (width>=900px){.controls-layout{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);align-items:start}.controls-figure{top:1rem}.control-entry{scroll-margin:1rem}}.crumbs{color:var(--muted);font-size:.9rem}.crumbs a{color:var(--muted)}.kicker{color:var(--accent);text-transform:uppercase;letter-spacing:.06em;margin:.8rem 0 0;font-size:.8rem;font-weight:700}.lesson-header .lede{margin-top:0}.needs{border-left:4px solid var(--hold);background:var(--hold-soft);border-radius:0 10px 10px 0;margin:.3rem 0 .5rem;padding:.6rem .9rem;display:inline-block}.needs ul{margin:.2rem 0 0;padding-left:1.2rem}.lesson-content>:not(.steps),.lesson-video,.lesson-footer{max-width:46rem}.lesson-content>.steps{margin:1.5rem 0 2rem}.steps{align-items:start;gap:.8rem 1.75rem;display:grid}.steps-figure{background:var(--bg);padding:.5rem 0 .4rem}.steps.is-enhanced .steps-figure{z-index:2;position:sticky;top:0}.steps-figure .back-panel{margin-top:.35rem}.step-list{margin:0;padding-left:1.4rem}.step{margin:0 0 1rem;padding:.2rem 0 .2rem .3rem}.step:focus{outline:none}.steps .step,.steps .steps-done{scroll-margin-top:calc(var(--figure-h,0px) + 12px)}.step-text>:first-child{margin-top:0}.expect{background:var(--ok-soft);color:var(--text);border-radius:10px;margin:.5rem 0;padding:.45rem .7rem}.expect strong{color:var(--ok)}.steps.is-enhanced .step-list{padding:0;list-style:none}.steps.is-enhanced .step{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);margin:0;padding:1rem 1.1rem;font-size:1.1rem}.step-nav{justify-content:space-between;align-items:center;gap:.6rem;margin-top:.9rem;display:flex}.step-nav[hidden]{display:none}.step-counter{color:var(--muted);text-align:center;font-size:.9rem}.steps-done{border-color:var(--ok);background:var(--ok-soft);margin-top:1rem}.steps-done p{margin-top:0}.steps-done:focus{outline:3px solid var(--ok)}.tip{margin:.6rem 0 0;font-size:.95rem}.tip summary{cursor:pointer;color:var(--muted);font-weight:600}.tip-body{border-left:3px solid var(--line);margin-top:.3rem;padding:.3rem 0 0 1rem}.tip-body>:first-child{margin-top:0}.note{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;margin:1.2rem 0;padding:.8rem 1rem}.note-title{margin:0 0 .25rem;font-weight:750}.note p:last-child{margin-bottom:0}.note-newer{border-color:var(--hold);background:var(--hold-soft)}.note-tip{border-color:var(--ok);background:var(--ok-soft)}.screen-mock{margin:.6rem 0}.screen-glass{background:var(--screen);min-width:12rem;color:var(--screen-ink);font-family:var(--mono);border-radius:8px;padding:.6rem .9rem;font-size:.95rem;line-height:1.45;display:inline-block;box-shadow:inset 0 0 0 3px #2c2c2c}.video-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);width:100%;color:var(--text);font:inherit;text-align:left;cursor:pointer;box-shadow:var(--shadow);align-items:center;gap:.9rem;padding:1rem 1.1rem;display:flex}.video-card:hover{border-color:var(--accent)}.video-play{background:var(--accent);width:3rem;height:3rem;color:var(--accent-ink);border-radius:50%;flex:none;place-items:center;font-size:1.1rem;display:grid}.video-note{color:var(--muted);font-size:.85rem;display:block}.video iframe{aspect-ratio:16/9;border-radius:var(--radius);border:0;width:100%;display:block}.video-link{margin:.4rem 0 0;font-size:.9rem}.lesson-footer{border-top:1px solid var(--line);margin-top:2.5rem;padding-top:1rem}.sources{font-size:.88rem}.pager{flex-wrap:wrap;justify-content:space-between;gap:.5rem 1rem;font-weight:650;display:flex}.pager-next{margin-left:auto}.concept{margin:1.2rem 0}.concept figcaption{color:var(--muted);margin-top:.5rem;font-size:.93rem}.step-grid-row{grid-template-columns:repeat(4,1fr);gap:.5rem;display:grid}.step-grid-cells{grid-template-columns:repeat(4,1fr);gap:3px;display:grid}.step-cell{aspect-ratio:1;border:2px solid var(--line);background:var(--surface);color:var(--muted);border-radius:50%;place-items:center;font-size:.7rem;display:grid}.step-cell.first{border-color:var(--panel-line)}.step-cell.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}.step-cell.accent{border-color:var(--hold);border-width:3px}.step-grid-label{text-align:center;color:var(--muted);margin-top:.3rem;font-size:.8rem;font-weight:650;display:block}.step-grid-bar{border-top:2px solid var(--panel-line);text-align:center;color:var(--muted);margin-top:.35rem;font-size:.8rem}.pad-notes-grid{grid-template-columns:repeat(8,1fr);gap:4px;max-width:30rem;display:grid}.pad-note{aspect-ratio:1.3;border:1px solid var(--line);background:var(--pad);border-radius:6px;place-items:center;font-size:.85rem;font-weight:650;display:grid}.pad-note.root{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.set-map-box{border:2px solid var(--panel-line);border-radius:var(--radius);background:var(--surface);padding:.7rem .9rem;display:inline-block}.set-map-title{margin:0 0 .4rem;font-weight:750}.set-map-track{align-items:center;gap:.6rem;margin:.25rem 0;display:flex}.set-map-name{width:4.2rem;font-size:.85rem;font-weight:650}.set-map-slots{gap:4px;display:flex}.set-map-slot{border:1.5px dashed var(--panel-line);border-radius:4px;width:1.4rem;height:1.1rem}.set-map-slot.filled{border:1.5px solid var(--accent);background:var(--accent-soft)}@media (width<=639px),(width<=959px) and (height>=521px){.steps.is-enhanced .steps-figure .move-diagram{max-height:32vh}.steps.is-enhanced .steps-figure .back-panel{max-height:9vh}}@media (width>=960px),(width>=640px) and (height<=520px){.steps{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}.steps.is-enhanced .steps-figure{top:1rem}.steps .step,.steps .steps-done{scroll-margin-top:1rem}}.hero{align-items:center;gap:1.5rem 2.5rem;padding:.5rem 0 1rem;display:grid}.hero h1{margin-top:.2rem}.hero-actions{flex-wrap:wrap;gap:.6rem;margin-top:1.2rem;display:flex}.how-list{counter-reset:how;gap:.8rem;margin:0;padding:0;list-style:none;display:grid}.how-list li{counter-increment:how;align-content:start;gap:.2rem;display:grid}.how-list li:before{content:counter(how);background:var(--accent);width:2rem;height:2rem;color:var(--accent-ink);border-radius:50%;place-items:center;margin-bottom:.3rem;font-weight:800;display:grid}.how-list span{color:var(--muted)}.part-grid{gap:.8rem;display:grid}.part-card{color:var(--text);gap:.2rem;text-decoration:none;display:grid}.part-card:hover{border-color:var(--accent)}.part-num{color:var(--accent);text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;font-weight:750}.part-count{margin-top:.3rem;font-size:.85rem;font-weight:650}.need ul{padding-left:1.2rem}@media (width>=720px){.how-list{grid-template-columns:repeat(3,1fr)}.part-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=960px){.hero{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}.part-grid{grid-template-columns:repeat(3,1fr)}}.course-part{margin-bottom:1.5rem}.course-part h2{flex-wrap:wrap;align-items:baseline;gap:.2rem .6rem;margin-bottom:.2rem;display:flex}.lesson-list{gap:.6rem;margin:.8rem 0 0;padding:0;list-style:none;display:grid}.lesson-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--text);box-shadow:var(--shadow);grid-template-columns:auto 1fr auto;align-items:center;gap:.9rem;padding:.8rem 1rem;text-decoration:none;display:grid}.lesson-card:hover{border-color:var(--accent)}.lesson-num{background:var(--surface-2);border-radius:50%;place-items:center;width:2.2rem;height:2.2rem;font-weight:800;display:grid}.lesson-card-text{gap:.1rem;display:grid}.lesson-card-text .muted{font-size:.93rem}.lesson-state{border:2px solid var(--line);border-radius:50%;width:1.6rem;height:1.6rem}.lesson-card[data-started] .lesson-state{border-color:var(--hold);background:linear-gradient(90deg, var(--hold-soft) 50%, transparent 50%)}.lesson-card[data-done] .lesson-state{border-color:var(--ok);background:var(--ok);position:relative}.lesson-card[data-done] .lesson-state:after{content:"✓";color:#fff;place-items:center;font-size:.9rem;font-weight:900;display:grid;position:absolute;inset:0}.lesson-card[data-done] .lesson-num{background:var(--ok-soft);color:var(--ok)}.lesson-card:not([data-done]) .done-label{display:none}.coming-soon{border:1px dashed var(--line);border-radius:var(--radius);color:var(--muted);padding:.7rem 1rem}.reset-row{margin-top:2rem}.glossary-index{flex-wrap:wrap;gap:.3rem .9rem;margin:1rem 0 1.5rem;font-size:.95rem;display:flex}.glossary{max-width:46rem;margin:0}.glossary-entry{border-bottom:1px solid var(--line);padding:.8rem 0;scroll-margin-top:1rem}.glossary-entry:target{background:var(--accent-soft);border-radius:8px;padding-inline:.6rem}.glossary dt{font-size:1.1rem;font-weight:750}.glossary dd{margin:.2rem 0 0}.glossary-lesson{color:var(--muted)}.prose{max-width:46rem}
