.destination{max-width:440px}
.destination video{height:min(38svh,320px);margin-bottom:28px}
.demo{margin-bottom:24px}
.demo h2{font:400 clamp(28px,5vw,36px)/1.08 Anton,Impact,sans-serif;margin:0 0 7px;text-wrap:balance}
.demo-desc{margin:0 0 15px;color:#514740;font-size:16px;line-height:1.45}
.tool{--font-stencil:"Arial Narrow",Inter,sans-serif;--font-mono:ui-monospace,monospace;color:var(--ink);color-scheme:dark;overflow:hidden;background:radial-gradient(ellipse at top left,#342033,transparent 48%),var(--case);border:4px solid #262629;border-radius:26px;padding:19px 14px 22px;font:400 15px/1.4 Inter,system-ui,sans-serif}
.screen-title{font-size:25px;line-height:1.2;font-weight:700;margin:0 0 15px}
.app-panel{padding:14px 12px}
.app-panel h3{margin:0 0 12px;font:700 18px/1.3 Inter,system-ui,sans-serif;color:var(--ink)}
.instrument *{box-sizing:border-box}.instrument button{font-family:inherit;cursor:pointer}.instrument button:disabled{cursor:default}
.tool button:focus-visible,.tempo input:focus-visible{outline:3px solid var(--blue);outline-offset:-2px}
.chord-view{display:flex;gap:6px;align-items:center}
.diagram{position:relative;flex:1;min-width:0}.diagram svg{display:block;width:100%;height:auto}
.hit-strings{position:absolute;inset:0 .55% 0 11.8%;display:grid;grid-template-columns:repeat(6,1fr)}
.hit-strings button{border:0;background:none;padding:0;border-radius:4px}.hit-strings button.selected{box-shadow:inset 0 0 0 2px var(--amber);background:rgb(255 176 32 / .12)}
.tones{display:grid;gap:9px;max-width:42%}.tone-row{display:flex;align-items:center;gap:6px;color:var(--ink-2);font-size:12px}
.tone-row b{border-radius:50%;display:grid;place-items:center;width:25px;height:25px;flex:none;color:var(--orange-ink)}
.tool-actions{margin-top:14px}.tool-actions .play{width:100%;border:0;cursor:pointer}
.feedback{margin:12px 0 0;min-height:1.5em;font-size:13px;color:var(--ink-2)}
.tempo{display:grid;gap:0;margin:0 0 8px;font-size:14px;color:var(--ink-2)}.tempo output{font-weight:650;color:var(--ink)}.tempo input{width:100%;height:32px;accent-color:var(--amber)}
.neck-window{padding:6px 0;background:#0b0b0c;border-radius:10px;overflow:hidden}.neck-window svg{display:block;height:clamp(180px,32vh,255px);width:100%}.member-player>[role=img]{margin-top:10px;border-style:solid}.member-player svg{font-family:Inter,system-ui,sans-serif}.member-player [role=button][tabindex="-1"]{pointer-events:none}.member-player [role=button]:focus-visible{outline:2px solid var(--blue)}
@media(max-width:380px){main{padding-inline:13px}.tool{padding-inline:10px}.app-panel{padding-inline:8px}.tone-row{font-size:11px}}

main{grid-template-columns:minmax(0,1fr)}.destination{min-width:0}