:root{--primary:#c8553d;--primary-strong:#a8402b;--on-primary:#fff;--accent:#f2b134;--on-accent:#2b1d10;--bg:#fbf4e8;--surface:#fffdf8;--surface-2:#f3e8d6;--text:#2b1d10;--muted:#5e4f43;--border:#dccfba;--danger:#a32117;--ok:#1d6b3a;--focus:#1a5fd0;--shadow:0 1px 2px #3c230a14, 0 6px 18px #3c230a12;--wood:#5a3a26;--wood-2:#4a2f1e;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--primary:#e8836b;--primary-strong:#e8836b;--on-primary:#1f1510;--accent:#f2b134;--bg:#1c1511;--surface:#271d17;--surface-2:#33261d;--text:#f7ecdd;--muted:#d0bfab;--border:#4a3a2e;--danger:#ff9d90;--ok:#7fd9a0;--focus:#8cb8ff;--shadow:0 1px 2px #0006, 0 6px 18px #0000004d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--primary:#e8836b;--primary-strong:#e8836b;--on-primary:#1f1510;--accent:#f2b134;--bg:#1c1511;--surface:#271d17;--surface-2:#33261d;--text:#f7ecdd;--muted:#d0bfab;--border:#4a3a2e;--danger:#ff9d90;--ok:#7fd9a0;--focus:#8cb8ff;--shadow:0 1px 2px #0006, 0 6px 18px #0000004d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);margin:0;font-family:Avenir Next,Segoe UI,system-ui,-apple-system,Roboto,Helvetica Neue,sans-serif;font-size:16px;line-height:1.5}h1,h2,h3{margin:0 0 .5rem;font-family:Iowan Old Style,Palatino Linotype,Georgia,serif;line-height:1.2}h1{font-size:clamp(1.6rem,4vw,2.2rem)}h2{font-size:1.25rem}h3{margin-top:1.1rem;font-size:1.05rem}p{margin:0 0 .8rem}a{color:var(--primary-strong);text-underline-offset:2px}:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:4px}kbd{text-align:center;background:var(--surface-2);border:1px solid var(--border);min-width:1.6em;color:var(--text);border-bottom-width:2px;border-radius:6px;margin:0 .1em;padding:.05em .45em;font:600 .85em ui-monospace,Menlo,Consolas,monospace;display:inline-block}kbd small{opacity:.7;font-weight:400}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.skip{background:var(--surface);z-index:100;padding:.5rem 1rem;position:absolute;top:0;left:-999px}.skip:focus{top:.5rem;left:.5rem}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important}}.loading{min-height:100vh;color:var(--muted);place-items:center;font-size:1.2rem;display:grid}.shell{grid-template-rows:auto auto 1fr;grid-template-columns:1fr;min-height:100vh;display:grid}.topbar{background:var(--surface);border-bottom:1px solid var(--border);z-index:20;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem 1rem;display:flex;position:sticky;top:0}.brand{color:var(--text);align-items:center;gap:.6rem;font:700 1.35rem Iowan Old Style,Georgia,serif;text-decoration:none;display:flex}.logo{border-radius:8px;display:block}.topbar-actions{gap:.4rem;display:flex}.sidenav{background:var(--surface);border-bottom:1px solid var(--border);flex-direction:column;padding:.5rem;display:none}.sidenav.open{display:flex}.sidenav a{color:var(--text);border-radius:10px;padding:.65rem .9rem;font-weight:600;text-decoration:none}.sidenav a:hover{background:var(--surface-2)}.sidenav a.active{background:var(--primary-strong);color:var(--on-primary)}.content{outline:none;width:100%;max-width:1100px;margin:0 auto;padding:1rem}@media (width>=900px){.shell{grid-template-rows:auto 1fr;grid-template-columns:230px 1fr}.topbar{grid-column:1/-1}.menu-btn{display:none}.sidenav{border-bottom:none;border-right:1px solid var(--border);align-self:start;height:calc(100vh - 58px);display:flex;position:sticky;top:58px}.content{padding:1.5rem 2rem 3rem}}.page{flex-direction:column;gap:1rem;display:flex}.page.narrow{max-width:720px}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;display:flex}.sub{color:var(--muted);margin:0}.muted{color:var(--muted)}.small-text{font-size:.85rem}.block{display:block}.card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:16px;padding:1rem 1.1rem}.two-col{grid-template-columns:1fr;gap:1rem;display:grid}@media (width>=900px){.two-col{grid-template-columns:1fr 1fr}}.grid2{grid-template-columns:1fr;gap:.8rem 1.5rem;display:grid}@media (width>=640px){.grid2{grid-template-columns:1fr 1fr}}.row{align-items:center;gap:.5rem;margin:.4rem 0;display:flex}.row.wrap{flex-wrap:wrap}.row.gap{gap:.6rem}.row.between{justify-content:space-between}.row.end{justify-content:flex-end}.row.center{align-items:center}.row.end-align{align-items:flex-end}.grow{flex:200px;min-width:0}.empty{border:1px dashed var(--border);color:var(--muted);background:var(--surface-2);border-radius:12px;padding:1rem}.error{color:var(--danger);font-weight:600}.ok{color:var(--ok);font-weight:600}.error-list{color:var(--danger);margin:.5rem 0;padding-left:1.2rem}.danger-text{color:var(--danger)!important}hr{border:none;border-top:1px solid var(--border);margin:1.2rem 0}.badge{background:var(--accent);color:var(--on-accent);border-radius:99px;margin-left:.5rem;padding:.05rem .6rem;font-size:.78rem;font-weight:700;display:inline-block}.btn{appearance:none;cursor:pointer;border:2px solid #0000;border-radius:12px;justify-content:center;align-items:center;gap:.4rem;min-height:44px;padding:.55rem 1rem;font:700 .95rem inherit;text-decoration:none;display:inline-flex}.btn.small{min-height:36px;padding:.3rem .75rem;font-size:.85rem}.btn.big{min-height:56px;padding:.6rem 1.6rem;font-size:1.1rem}.btn.primary{background:var(--primary-strong);color:var(--on-primary)}.btn.primary:hover{filter:brightness(1.08)}.btn.ghost{color:var(--text);border-color:var(--border);background:0 0}.btn.ghost:hover{background:var(--surface-2)}.btn.danger{background:var(--danger);color:#fff}:root[data-theme=dark] .btn.danger{color:#1c1511}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .btn.danger{color:#1c1511}}.btn:disabled,.btn.disabled{opacity:.5;cursor:not-allowed}.link-btn{color:var(--primary-strong);cursor:pointer;font:inherit;background:0 0;border:none;padding:.4rem 0;text-decoration:underline}.file-btn{position:relative;overflow:hidden}.file-btn input{opacity:0;cursor:pointer;position:absolute;inset:0}.file-btn:focus-within{outline:3px solid var(--focus);outline-offset:2px}.field{flex-direction:column;gap:.25rem;margin:.5rem 0;font-size:.92rem;font-weight:600;display:flex}.field.inline{margin:0}.field>label,.field>span{justify-content:space-between;gap:.5rem;display:flex}.field output{color:var(--muted);font-weight:500}input[type=text],input[type=number],select,textarea{font:inherit;color:var(--text);background:var(--surface);border:2px solid var(--border);border-radius:10px;max-width:100%;min-height:42px;padding:.45rem .6rem;font-weight:400}textarea{width:100%;font-family:ui-monospace,Menlo,Consolas,monospace}input[type=number]{width:6rem}input[type=range]{width:100%;accent-color:var(--primary-strong);min-height:32px}.check-inline{align-items:center;gap:.4rem;min-height:36px;display:inline-flex}input[type=checkbox],input[type=radio]{width:20px;height:20px;accent-color:var(--primary-strong)}.radios{border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:.4rem;margin:.8rem 0;display:flex}.radios label{align-items:center;gap:.5rem;display:flex}.switch{cursor:pointer;align-items:flex-start;gap:.75rem;padding:.5rem 0;display:flex;position:relative}.switch input{opacity:0;cursor:pointer;width:44px;height:26px;margin:0;position:absolute}.switch-track{background:var(--muted);border-radius:99px;flex:none;width:44px;height:26px;margin-top:2px;transition:background .15s;position:relative}.switch-thumb{background:var(--surface);border-radius:50%;width:20px;height:20px;transition:transform .15s;position:absolute;top:3px;left:3px}.switch input:checked+.switch-track{background:var(--primary-strong)}.switch input:checked+.switch-track .switch-thumb{transform:translate(18px)}.switch input:focus-visible+.switch-track{outline:3px solid var(--focus);outline-offset:2px}.switch-text{flex-direction:column;display:flex}.switch-label{font-weight:700}.switch-hint{color:var(--muted);font-size:.85rem}.switches{grid-template-columns:1fr;gap:0 2rem;display:grid}@media (width>=700px){.switches{grid-template-columns:1fr 1fr}}.seg{border:2px solid var(--border);background:var(--surface);border-radius:12px;flex-wrap:wrap;display:inline-flex;overflow:hidden}.seg button{color:var(--text);cursor:pointer;background:0 0;border:none;min-height:40px;padding:.5rem .9rem;font:700 .9rem inherit}.seg button.on{background:var(--primary-strong);color:var(--on-primary)}.seg button:hover:not(.on){background:var(--surface-2)}.chips{flex-wrap:wrap;gap:.4rem;margin:.4rem 0;display:flex}.chip{border:2px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:99px;min-height:36px;padding:.25rem .85rem;font:700 .9rem inherit}.chip.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.chip.static{cursor:default;min-height:0;padding:.1rem .6rem}.keysel{flex-wrap:wrap;gap:.4rem;margin-bottom:.8rem;display:flex}.tabs{border-bottom:2px solid var(--border);gap:.3rem;display:flex;overflow-x:auto}.tabs button{color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-bottom:4px solid #0000;margin-bottom:-2px;padding:.7rem 1rem;font:700 .95rem inherit}.tabs button.on{color:var(--text);border-bottom-color:var(--primary-strong)}.toolbar{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.list{margin:0;padding:0;list-style:none}.list>li{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem;padding:.55rem 0;display:flex}.list>li:last-child{border-bottom:none}.list.stack>li{border:none;flex-wrap:nowrap;padding:.25rem 0}.list-btn{text-align:left;background:var(--surface);border:2px solid var(--border);cursor:pointer;color:var(--text);font:inherit;border-radius:12px;flex-direction:column;flex:1;min-height:48px;padding:.5rem .8rem;display:flex}.list-btn.on{border-color:var(--primary-strong);background:var(--surface-2)}.list-btn:hover{background:var(--surface-2)}.table-wrap{overflow-x:auto}.table{border-collapse:collapse;width:100%}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:.5rem .6rem}.table td.row{justify-content:flex-end;margin:0}.dialog{background:var(--surface);color:var(--text);border:none;border-radius:18px;max-width:min(520px,92vw);padding:0;box-shadow:0 20px 60px #00000059}.dialog::backdrop{background:#1e0f058c}.dialog-body{padding:1.4rem}.dots{gap:.4rem;margin:.6rem 0;display:flex}.dots span{background:var(--border);border-radius:50%;width:10px;height:10px}.dots span.on{background:var(--primary-strong)}.toast-region{pointer-events:none;z-index:60;justify-content:center;padding:0 1rem;display:flex;position:fixed;bottom:1rem;left:0;right:0}.toast{background:var(--text);color:var(--bg);box-shadow:var(--shadow);border-radius:12px;max-width:520px;padding:.7rem 1.1rem}.chord-now{background:var(--primary-strong);color:var(--on-primary);text-align:center;border-radius:16px;min-width:120px;padding:.4rem 1.2rem}.chord-now-label{text-transform:uppercase;letter-spacing:.08em;opacity:.9;font-size:.75rem;display:block}.chord-now-name{font:700 2rem/1.1 Iowan Old Style,Georgia,serif}.firstrun{background:var(--surface-2);font-size:.95rem}.stage{flex-direction:column;gap:.6rem;display:flex}.stage.portrait{align-items:center}.fretboard{filter:drop-shadow(0 6px 10px #3c230a40);width:100%;height:auto;display:block}.fretboard.portrait{width:auto;max-width:100%;max-height:62vh}.fretboard.compact{max-height:190px}.fretboard.portrait.compact{max-height:240px}.fb-wood{fill:var(--wood);stroke:var(--wood-2);stroke-width:3px}.fb-inlay{fill:#e9dcc0;opacity:.55}.fb-fret{stroke:#c9b98f;stroke-width:3px}.fb-nut{stroke:#f4ead2;stroke-width:9px;stroke-linecap:round}.fb-num{fill:#f4ead2;opacity:.9;font:600 13px system-ui,sans-serif}.fb-string{stroke:#e6e1d3;stroke-linecap:round;transition:stroke .1s}.fb-string.muted{opacity:.4}.fb-string.ringing{stroke:var(--accent);animation:.12s linear infinite alternate shimmer}@keyframes shimmer{0%{transform:translateY(-.6px)}to{transform:translateY(.6px)}}.fb-mark{fill:#f4ead2;font:700 22px system-ui,sans-serif}.fb-open{fill:none;stroke:#f4ead2;stroke-width:2.5px}.fb-dot{fill:var(--accent);stroke:#2b1d10;stroke-width:2px}.fb-finger{fill:#a8402b;stroke:#fff;stroke-width:2px}.fb-finger-text{fill:#fff;font:800 20px system-ui,sans-serif}.fb-capo{stroke:#c9a24a;stroke-width:14px;stroke-linecap:round;opacity:.92}.zone{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:crosshair;background:linear-gradient(var(--surface-2), var(--surface));border:2px solid var(--border);border-radius:16px;height:170px;position:relative;overflow:hidden}.zone.portrait{width:100%;max-width:520px;height:190px}.zone:focus-visible{outline:3px solid var(--focus)}.zone-string{height:var(--w);pointer-events:none;background:linear-gradient(#b9a98c,#8f8068);border-radius:3px;position:absolute;left:0;right:0;transform:translateY(-50%)}.zone.portrait .zone-string{width:var(--w);height:auto;inset:0 auto;transform:translate(-50%)}.zone-string.on{background:var(--accent);box-shadow:0 0 12px var(--accent)}.zone-sep{background:var(--border);pointer-events:none;height:1px;position:absolute;left:0;right:0}.zone.portrait .zone-sep{width:1px;height:auto;top:0;bottom:0;left:auto}.zone-key{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:6px;margin-top:-14px;padding:0 .4rem;font:700 .8rem ui-monospace,monospace;position:absolute;top:50%;left:8px;transform:translateY(-50%)}.zone.portrait .zone-key{margin:0;top:6px;left:50%;transform:translate(-50%)}.zone-hint{color:var(--muted);pointer-events:none;background:color-mix(in srgb, var(--surface) 80%, transparent);border-radius:6px;padding:0 .4rem;font-size:.8rem;position:absolute;bottom:6px;right:10px}.pads{grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:.5rem;margin:.6rem 0;display:grid}.pad{border:2px solid var(--border);background:var(--surface);min-height:76px;color:var(--text);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:.1rem;font-family:inherit;display:flex;position:relative}.pad.on{background:var(--primary-strong);color:var(--on-primary);border-color:var(--primary-strong)}.pad-key{background:var(--surface-2);color:var(--text);border-radius:5px;padding:0 .4rem;font:700 .78rem ui-monospace,monospace}.pad-name{font:700 1.3rem Iowan Old Style,Georgia,serif}.pad-roman{opacity:.75;font-size:.7rem;position:absolute;top:3px;right:7px}.keyref ul{margin:.5rem 0 0;padding-left:1.2rem}.keyref summary{cursor:pointer;padding:.4rem 0;font-weight:700}.fg{grid-template-columns:2.4rem repeat(var(--cols), minmax(0, 1fr));border:3px solid var(--wood-2);background:#e7d6b4;border-radius:8px;max-width:440px;margin:.6rem 0;display:grid;overflow:hidden}.fg-corner,.fg-num{color:#2b1d10;background:#d6c298;place-items:center;font:700 .85rem ui-monospace,monospace;display:grid}.fg-head{cursor:pointer;color:#2b1d10;background:#d6c298;border:none;border-bottom:5px solid #f4ead2;flex-direction:column;justify-content:center;align-items:center;min-height:48px;font:700 1.3rem/1 system-ui;display:flex}.fg-head small{margin-top:2px;font-size:.65rem;font-weight:600}.fg-head:hover{background:#c7b283}.fg-cell{cursor:pointer;background:0 0;border-top:none;border-bottom:3px solid #a79269;border-left:1px solid #0000;border-right:none;place-items:center;min-height:48px;display:grid;position:relative}.fg-cell:before{content:"";background:#6d5a3a;width:3px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}.fg-cell:hover{background:#c8553d33}.fg-dot{z-index:1;color:#fff;background:#a8402b;border:2px solid #fff;border-radius:50%;place-items:center;width:32px;height:32px;font:800 1rem system-ui;display:grid;position:relative}.fg-cell:focus-visible,.fg-head:focus-visible{outline-offset:-3px}.fingers-row{grid-template-columns:2.4rem repeat(var(--cols), minmax(0, 1fr));align-items:center;gap:2px;max-width:440px;display:grid}.fingers-row select{width:100%;min-height:34px;padding:.2rem}.suggest{flex-wrap:wrap;align-items:center;gap:.4rem;margin:.4rem 0 .8rem;display:flex}.numrow{grid-template-columns:repeat(7,minmax(0,1fr));gap:.4rem;display:grid}.numkey{background:var(--surface-2);border:2px solid var(--border);text-align:center;border-radius:12px;flex-direction:column;gap:.1rem;padding:.5rem .2rem;display:flex}.numkey-key{color:var(--muted);font:700 .85rem ui-monospace,monospace}.numkey-chord{font:700 clamp(1rem,3.4vw,1.6rem) Iowan Old Style,Georgia,serif}.numkey-roman{color:var(--muted);font-size:.8rem}.amp{color:#f7ecdd;background:linear-gradient(160deg,#3a2a20,#241811);border-color:#5a4232}.amp h2{color:#f7ecdd}.amp .small-text{color:#e0d0bb}.amp .btn.ghost{color:#f7ecdd;border-color:#8a7360}.amp .btn.ghost:hover{background:#ffffff1a}.amp .btn.primary{background:var(--accent);color:#2b1d10}.amp-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.amp-knobs{gap:1rem;display:flex}.knob{flex-direction:column;align-items:center;gap:.2rem;display:flex}.knob small{color:#e0d0bb;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem}.knob-dial{background:radial-gradient(circle at 35% 30%,#d9c7a3,#8d7650);border:2px solid #1b120c;border-radius:50%;width:42px;height:42px;transition:transform .2s;position:relative}.knob-dial span{background:#2b1d10;border-radius:2px;width:3px;height:13px;margin-left:-1.5px;position:absolute;top:4px;left:50%}.tone-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.6rem;margin:.8rem 0;display:grid}.tone-card{text-align:left;color:#f7ecdd;cursor:pointer;background:#ffffff0f;border:2px solid #6b5444;border-radius:14px;flex-direction:column;gap:.2rem;min-height:84px;padding:.7rem .9rem;font-family:inherit;display:flex}.tone-card span{color:#e0d0bb;font-size:.85rem}.tone-card.on{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent) inset;background:#f2b1342e}.meter-row{align-items:center;gap:.8rem;margin-top:.8rem;display:flex}.meter{border:1px solid var(--border);background:#00000059;border-radius:99px;flex:1;height:16px;position:relative;overflow:hidden}.meter-bar{background:linear-gradient(90deg,#5fbf74,#f2b134 70%,#e5533d);width:0;height:100%}.meter-peak{background:#fff;width:3px;position:absolute;top:0;bottom:0;left:0}.rec .meter{background:var(--surface-2)}.song-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;margin-top:1rem;display:grid}.song-card{flex-direction:column;gap:.2rem;display:flex}.song-card .row{margin-top:auto}.progress{background:var(--surface-2);border:1px solid var(--border);border-radius:99px;height:12px;margin:.4rem 0;overflow:hidden}.progress>div{background:var(--primary-strong);height:100%;transition:width .3s}.progress.small{height:8px}.lesson{margin-top:.8rem;padding:0;overflow:hidden}.lesson-head{text-align:left;cursor:pointer;width:100%;color:var(--text);font:inherit;background:0 0;border:none;align-items:center;gap:.8rem;padding:.9rem 1.1rem;display:flex}.check{border:2px solid var(--border);border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-weight:800;display:grid}.check.on{background:var(--ok);color:#fff;border-color:var(--ok)}:root[data-theme=dark] .check.on{color:#10281a}.lesson-body{border-top:1px solid var(--border);padding:0 1.1rem 1.1rem}.lesson-chords{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.8rem;margin:.8rem 0;display:grid}.lesson-chord{background:var(--surface-2);border-radius:12px;padding:.6rem}.lesson-chord-top{flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:.4rem;display:flex}.transport .field.inline{min-width:200px}.guide{padding:.8rem 0 .4rem;position:relative;overflow:hidden}.ribbon-clip{height:86px;margin-left:90px;position:relative;overflow:hidden}.ribbon{will-change:transform;height:100%;position:absolute;top:0;left:0}.rseg{height:100%;padding:4px;position:absolute;top:0}.rseg span{background:var(--surface-2);border:2px solid var(--border);border-radius:12px;justify-content:flex-start;align-items:center;height:100%;padding-left:.9rem;font:700 1.6rem Iowan Old Style,Georgia,serif;display:flex;overflow:hidden}.now-line{background:var(--primary-strong);z-index:3;border-radius:2px;width:4px;position:absolute;top:.4rem;bottom:2.2rem;left:86px}.guide-status{align-items:center;gap:1rem;min-height:40px;padding:.4rem 1rem 0;display:flex}.countdown{color:var(--primary-strong);font:800 2rem Iowan Old Style,Georgia,serif}.beats{gap:.5rem;display:inline-flex}.beats i{background:var(--border);border-radius:50%;width:16px;height:16px;display:block}.beats i.on{background:var(--primary-strong);transform:scale(1.3)}.now-next{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.big-chord{font:800 2.4rem/1.1 Iowan Old Style,Georgia,serif}.big-chord.dim{color:var(--muted)}.chart{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.4rem;max-height:340px;padding:2px;display:grid;overflow-y:auto}.bar{border:2px solid var(--border);background:var(--surface);border-radius:10px;flex-wrap:wrap;align-items:baseline;gap:.5rem;min-height:52px;padding:.4rem .5rem;display:flex;position:relative}.bar.on{border-color:var(--primary-strong);background:var(--surface-2);box-shadow:0 0 0 2px var(--primary-strong) inset}.bar-n{color:var(--muted);font-size:.65rem;position:absolute;top:1px;right:5px}.bar-chord{font:700 1.15rem Iowan Old Style,Georgia,serif}.timer{min-width:5.5rem;font:700 1.8rem ui-monospace,Menlo,monospace}.timer.live{color:var(--danger)}.wave{border:1px solid var(--border);border-radius:10px;width:100%;height:120px;margin:.5rem 0;display:block}.last-input{background:var(--surface-2);border-radius:10px;margin:0;padding:.5rem .8rem}.about-hero{align-items:center;gap:1.2rem;margin-bottom:.5rem;display:flex}.about-hero .logo{box-shadow:var(--shadow);border-radius:20px}@media (width<=520px){.content{padding:.75rem}.now-next{grid-template-columns:1fr}.ribbon-clip{margin-left:60px}.now-line{left:56px}.zone{height:150px}.card{padding:.85rem}}