@font-face{font-family:"Press Start 2P";src:url(/fonts/press-start-2p.woff2)format("woff2");font-display:swap}:root{--color-bg:#f6f1e8;--color-surface:#fffaf1;--color-raised:#efe6d8;--color-text:#1f1a16;--color-muted:#5d5348;--color-amber:#8f5300;--color-on-amber:#fffaf1;--color-led:#946900;--color-led-off:#d8cdbd;--color-edge:#7d8592;--color-ok:#1f6f43;--color-problem:#a12c2c;--color-cursor:#c4122a;--color-on-cursor:#fff;--metal:linear-gradient(180deg, #e4e7eb 0%, #c3c8cf 48%, #b3b9c1 52%, #d5d9de 100%);--metal-text:#1f1a16;--metal-muted:#3f3a35;--glow:#8f53001a;--stripe:#1f1a1606;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--radius:.5rem;--pixel:"Press Start 2P", ui-monospace, "Courier New", monospace;--font-body:Verdana, Tahoma, "Segoe UI", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--color-bg:#14110f;--color-surface:#221c18;--color-raised:#2d2520;--color-text:#f4ede2;--color-muted:#b8ab99;--color-amber:#ffb547;--color-on-amber:#14110f;--color-led:#ffc20e;--color-led-off:#4a3f37;--color-edge:#8a8f98;--color-ok:#6fd39b;--color-problem:#ff8a80;--color-cursor:#ff4057;--color-on-cursor:#14110f;--glow:#ffb5471f;--stripe:#ffffff05;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*,:before,:after{box-sizing:border-box}html{scrollbar-gutter:stable;background:var(--color-bg)}body{min-height:100vh;color:var(--color-text);font-family:var(--font-body);background:radial-gradient(ellipse 60rem 22rem at 50% -6rem, var(--glow), transparent 70%), repeating-linear-gradient(45deg, var(--stripe) 0 2px, transparent 2px 5px), var(--color-bg);flex-direction:column;margin:0;font-size:15px;line-height:1.55;display:flex}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:focus-visible{outline:3px solid var(--color-led);outline-offset:2px}.masthead{padding:var(--space-8) var(--space-4) var(--space-4);text-align:center;position:relative}.masthead__hub{top:var(--space-4);left:var(--space-4);color:var(--color-muted);font-family:var(--pixel);font-size:.6rem;text-decoration:none;position:absolute}.masthead__hub:before{content:"< "}.masthead__hub:hover{color:var(--color-amber)}.logo{margin:var(--space-4) 0 var(--space-2);color:var(--color-amber);font-family:var(--pixel);letter-spacing:.08em;text-transform:uppercase;text-shadow:0 0 18px var(--glow);font-size:clamp(1.6rem,6vw,2.6rem);font-weight:400}.tagline{max-width:34rem;color:var(--color-muted);margin:0 auto}.page{width:100%;max-width:64rem;padding:var(--space-4);flex:1;margin:0 auto}.step{max-width:44rem;padding:var(--space-6);background:var(--color-surface);border:2px solid var(--color-edge);border-radius:var(--radius);margin:0 auto;box-shadow:inset 0 1px #ffffff14,0 10px 30px #0000002e}.step--wide{max-width:none}.step--dragging{border-style:dashed;border-color:var(--color-amber)}.step__title{margin:0 0 var(--space-3);color:var(--color-amber);font-family:var(--pixel);font-size:clamp(.8rem,2.6vw,1rem);font-weight:400;line-height:1.7}.step__title:focus{outline:none}.step__lede{margin:0 0 var(--space-4)}.step__hint{margin:var(--space-3) 0 0;color:var(--color-muted);font-size:.9rem}.notice{margin:0 0 var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-raised);border-left:4px solid var(--color-muted);border-radius:var(--radius)}.notice>p{margin:0 0 var(--space-3)}.notice--problem{border-left-color:var(--color-problem)}.actions{justify-content:flex-end;gap:var(--space-3);margin-top:var(--space-6);flex-wrap:wrap;display:flex}.button{min-height:2.75rem;padding:var(--space-2) var(--space-4);color:var(--color-text);background:var(--color-raised);border:2px solid var(--color-edge);border-radius:var(--radius);font-family:var(--pixel);cursor:pointer;font-size:.65rem;line-height:1.6}.button:hover{border-color:var(--color-amber)}.button--primary{color:var(--color-on-amber);background:var(--color-amber);border-color:var(--color-amber)}.button--primary:hover{filter:brightness(1.08)}.sources{gap:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin:0;padding:0;list-style:none;display:grid}.sources>li{display:flex}.source{gap:var(--space-2);min-height:6rem;padding:var(--space-4);color:var(--color-text);background:var(--color-raised);border:2px solid var(--color-edge);border-radius:var(--radius);font:inherit;text-align:left;cursor:pointer;flex-direction:column;flex:1;display:flex}.source:hover,.source:focus-within{border-color:var(--color-amber)}.source:has(input:focus-visible){outline:3px solid var(--color-led);outline-offset:2px}.source:disabled{cursor:not-allowed;opacity:.6}.source:disabled:hover{border-color:var(--color-edge)}.source__name{color:var(--color-amber);font-family:var(--pixel);font-size:.7rem;line-height:1.6}.source__hint{color:var(--color-muted);font-size:.85rem}.timer{align-items:center;gap:var(--space-3);margin:var(--space-4) 0;font-family:var(--pixel);font-size:1.4rem;display:flex}.timer__led{background:var(--color-cursor);width:.9rem;height:.9rem;box-shadow:0 0 10px var(--color-cursor);border-radius:50%;animation:1s steps(2,start) infinite blink}.meter{width:100%;height:.75rem;accent-color:var(--color-amber)}.track{margin:0 0 var(--space-2);overflow-wrap:anywhere}.track__name{font-weight:700}.track__time{color:var(--color-muted)}.waveform{background:var(--color-raised);border:2px solid var(--color-edge);border-radius:var(--radius);width:100%;height:7rem;display:block}.waveform__region{fill:var(--color-amber);fill-opacity:.14}.waveform__bars{fill:var(--color-muted);fill-opacity:.55}.waveform__bars--lit{fill:var(--color-amber);fill-opacity:1}.region__readout{margin:var(--space-2) 0 var(--space-4);font-family:var(--pixel);font-size:.65rem}.region__controls{gap:var(--space-4);grid-template-columns:2fr 1fr;display:grid}.field{gap:var(--space-2);flex-direction:column;display:flex}.field__label{font-family:var(--pixel);color:var(--color-muted);font-size:.6rem}.field input[type=range]{width:100%;min-height:2.75rem;accent-color:var(--color-amber)}.field select{min-height:2.75rem;padding:0 var(--space-2);color:var(--color-text);background:var(--color-raised);border:2px solid var(--color-edge);border-radius:var(--radius);font:inherit}.tiles{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(7.5rem,1fr));margin:0;padding:0;list-style:none;display:grid}.tiles>li{display:flex}.tile{align-items:center;gap:var(--space-2);width:100%;padding:var(--space-4) var(--space-2);color:var(--color-text);background:var(--color-raised);border:3px solid var(--color-edge);border-radius:var(--radius);box-shadow:inset 0 0 0 2px var(--color-surface);cursor:pointer;flex-direction:column;display:flex;position:relative}.tile__sprite{width:4rem;height:4rem}.tile__name{font-family:var(--pixel);font-size:.65rem}.tile:not(:disabled):hover,.tile:not(:disabled):focus-visible{border-color:var(--color-cursor);box-shadow:inset 0 0 0 2px var(--color-led), 0 0 14px var(--glow);outline:none}.tile:not(:disabled):hover:after,.tile:not(:disabled):focus-visible:after{content:"1P";color:var(--color-on-cursor);background:var(--color-cursor);border:2px solid var(--color-led);font-family:var(--pixel);padding:.2rem .3rem;font-size:.55rem;animation:1.2s steps(2,start) infinite blink;position:absolute;top:-.7rem;left:-.5rem}.tile--locked{cursor:not-allowed}.tile--locked .tile__sprite path{fill:var(--color-muted);fill-opacity:.35}.tile--locked .tile__name{color:var(--color-muted)}.tile__lock{color:var(--color-muted);font-family:var(--pixel);font-size:.5rem}.tile__lock:before{content:"🔒 "}.sprite__b{fill:var(--color-amber)}.sprite--bass .sprite__b{fill:#4f86c6}.sprite__n{fill:#b7793f}.sprite__h{fill:#6b4a2f}.sprite__w{fill:#f4ede2}.sprite__k{fill:#2a221d}.chain{align-items:center;gap:var(--space-4);margin:var(--space-4) 0;padding:0;list-style:none;display:flex}.chain__block{align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-2);color:var(--metal-text);background:var(--metal);border-radius:var(--radius);flex-direction:column;flex:1;display:flex}.chain__name{font-family:var(--pixel);font-size:.6rem}.chain__led{background:var(--color-led-off);border-radius:50%;width:.8rem;height:.8rem}.chain__block--done .chain__led{background:var(--color-led);box-shadow:0 0 8px var(--color-led)}.chain__block--on .chain__led{background:var(--color-cursor);box-shadow:0 0 10px var(--color-cursor);animation:.8s steps(2,start) infinite blink}.chain__block--off{opacity:.6}.chip{font-family:var(--pixel);white-space:nowrap;border:2px solid;border-radius:999px;margin:0;padding:.3rem .5rem;font-size:.5rem}.chip--high{color:var(--color-ok)}.chip--medium{color:var(--color-amber)}.chip--rough{color:var(--color-muted)}.tone-card{padding:var(--space-4);color:var(--metal-text);background:var(--metal);border-radius:var(--radius);box-shadow:inset 0 0 0 1px #00000040}.tone-card .chip--high,.tone-card .chip--medium,.tone-card .chip--rough{color:var(--metal-text)}.tone-card__header,.route__header{justify-content:space-between;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.tone-card__title,.route__title,.routes__title{font-family:var(--pixel);margin:0;font-size:.75rem;font-weight:400;line-height:1.7}.traits{gap:var(--space-2) var(--space-6);margin:var(--space-4) 0;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));display:grid}.trait{align-items:baseline;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:1px solid #00000026;display:flex}.trait__label{align-items:center;gap:var(--space-2);font-family:var(--pixel);flex:0 0 7.5rem;font-size:.55rem;display:flex}.trait__led{background:#8c857c;border-radius:50%;flex:none;width:.6rem;height:.6rem}.trait--heard .trait__led{background:radial-gradient(circle at 35% 35%,#fff4b8,#e0a400 60%,#9a6a00);box-shadow:0 0 6px #e0a400}.trait__value{margin:0;font-weight:700}.trait__detail{color:var(--metal-muted);font-size:.85rem;font-weight:400;display:block}.tone-card__note{color:var(--metal-muted);margin:0;font-size:.85rem}.routes__title{margin:var(--space-8) 0 var(--space-4);color:var(--color-amber)}.routes{gap:var(--space-6);display:grid}.route{padding:var(--space-4);background:var(--color-raised);border:2px solid var(--color-edge);border-radius:var(--radius)}.route__why{margin:var(--space-2) 0 var(--space-4);color:var(--color-muted)}.board{gap:var(--space-3);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.board>li{flex:10rem;max-width:14rem;display:flex}.pedal{padding:var(--space-6) var(--space-3) var(--space-3);color:var(--metal-text);background:var(--metal);border-radius:.4rem;flex:1;position:relative;box-shadow:inset 0 0 0 1px #0000004d,0 4px #00000040}.pedal--optional{opacity:.85;box-shadow:inset 0 0 0 2px #00000059,0 4px #00000040}.pedal__led{top:var(--space-2);background:radial-gradient(circle at 35% 35%,#ffd0d0,#e8182c 60%,#8a0d1a);border-radius:50%;width:.7rem;height:.7rem;position:absolute;left:50%;translate:-50%;box-shadow:0 0 8px #e8182c}.pedal__kind{color:var(--metal-muted);font-family:var(--pixel);margin:0;font-size:.5rem;line-height:1.7}.pedal__name{margin:var(--space-1) 0 var(--space-2);font-size:.95rem}.pedal__settings{margin:0;padding:0;font-size:.85rem;list-style:none}.tryout{margin-top:var(--space-6);padding:var(--space-4);background:var(--color-raised);border:2px solid var(--color-edge);border-radius:var(--radius)}.tryout .routes__title{margin-top:0}.tryout__sources{gap:var(--space-2) var(--space-4);margin:var(--space-4) 0;border:0;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));padding:0;display:grid}.tryout__sources legend{margin-bottom:var(--space-2);padding:0}.tryout__source{column-gap:var(--space-2);cursor:pointer;grid-template-columns:auto 1fr;display:grid}.tryout__source input{accent-color:var(--color-amber);grid-row:span 2;margin-top:.3rem}.tryout__source-name{font-weight:700}.tryout__source-hint{color:var(--color-muted);grid-column:2;font-size:.85rem}.deck{gap:var(--space-2);flex-wrap:wrap;display:flex}.deck__button{min-height:2.75rem;padding:var(--space-2) var(--space-3);color:var(--color-text);background:var(--color-surface);border:2px solid var(--color-edge);border-radius:var(--radius);font-family:var(--pixel);cursor:pointer;font-size:.6rem;line-height:1.6}.deck__button:hover{border-color:var(--color-amber)}.deck__button[aria-pressed=true]{color:var(--color-on-amber);background:var(--color-amber);border-color:var(--color-amber)}.deck__button[aria-pressed=true]:before{content:"> "}.tryout__status{margin:var(--space-3) 0;color:var(--color-muted);font-size:.9rem}.footswitches{gap:var(--space-3);flex-wrap:wrap;display:flex}.footswitch{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-2);color:var(--metal-text);background:var(--metal);font:inherit;cursor:pointer;border:0;border-radius:.4rem;flex-direction:column;flex:0 8.5rem;display:flex;box-shadow:inset 0 0 0 1px #0000004d,0 4px #00000040}.footswitch:active{translate:0 2px;box-shadow:inset 0 0 0 1px #0000004d,0 2px #00000040}.footswitch__led{background:#6d6660;border-radius:50%;width:.7rem;height:.7rem}.footswitch--on .footswitch__led{background:radial-gradient(circle at 35% 35%,#ffd0d0,#e8182c 60%,#8a0d1a);box-shadow:0 0 8px #e8182c}.footswitch__cap{background:radial-gradient(circle at 40% 35%,#fff,#a9b0b9 55%,#5f6670);border-radius:50%;width:2.2rem;height:2.2rem;box-shadow:0 2px #0006}.footswitch__label{text-align:center;font-size:.8rem;font-weight:700}.footswitches__missing{padding:var(--space-3) var(--space-2);color:var(--color-muted);border:2px dashed var(--color-edge);text-align:center;border-radius:.4rem;flex:0 8.5rem;margin:0;font-size:.8rem}.footer{padding:var(--space-6) var(--space-4) var(--space-8);color:var(--color-muted);text-align:center;font-size:.85rem}.footer p{margin:0 0 var(--space-2)}.health{padding:var(--space-1) var(--space-3);border-radius:var(--radius);border:1px solid;display:inline-block}.health--ok{color:var(--color-ok)}.health--problem{color:var(--color-problem)}@media (width<=40rem){.step{padding:var(--space-4)}.region__controls{grid-template-columns:1fr}.tiles{grid-template-columns:repeat(3,1fr)}.tile__sprite{width:3rem;height:3rem}.chain{gap:var(--space-2)}.board>li{flex-basis:calc(50% - var(--space-3));max-width:none}.actions .button{flex:auto}}@keyframes blink{to{visibility:hidden}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
