:root{color-scheme:dark;--bg: #111311;--panel: #191c19;--panel-raised: #202420;--line: #313631;--muted: #8f998f;--text: #f4f5ef;--accent: #dfff4f;--accent-soft: rgba(223, 255, 79, .13);--danger: #ff826e;font-family:Inter,Avenir,Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;min-width:0;min-height:100vh;display:flex;flex-direction:column;color:var(--text);background:radial-gradient(circle at 78% 7%,rgba(160,188,77,.09),transparent 30%),var(--bg)}button,select{font:inherit}button{color:inherit}.app-shell{min-width:0;min-height:0;width:100%;flex:1}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;border-bottom:1px solid rgba(255,255,255,.07)}.topbar-actions{display:flex;align-items:center;gap:12px}.page-switch{height:39px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 13px;color:#b9c1b9;background:#181b18;cursor:pointer;transition:.15s ease}.page-switch svg{width:20px;height:20px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.page-switch span{font-size:12px;font-weight:600}.page-switch:hover,.page-switch.active{color:var(--accent);border-color:#59623a;background:var(--accent-soft)}.connection.hidden{display:none}.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font-size:17px;font-weight:700;letter-spacing:-.02em}.brand-mark{width:27px;height:27px;display:flex;align-items:center;justify-content:center;gap:3px;transform:rotate(-8deg)}.brand-mark i{width:3px;border-radius:4px;background:var(--accent);display:block}.brand-mark i:nth-child(1){height:12px}.brand-mark i:nth-child(2){height:23px}.brand-mark i:nth-child(3){height:17px}.connection{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px}.status-dot{width:7px;height:7px;border-radius:50%;background:#666e66;box-shadow:0 0 0 4px #666e661f}.connection.active{color:#c9d2c9}.connection.active .status-dot{background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.connection.error .status-dot{background:var(--danger)}.workspace{width:min(980px,calc(100% - 80px));margin:0 auto;padding:50px 0 38px}.page{display:none}.page.active{display:block;animation:page-in .24s ease-out}.feature-load-message{padding:12px;border:1px solid var(--line);border-radius:10px;color:var(--muted);font-size:13px}.feature-load-message button{margin-left:8px;padding:6px 12px;border:1px solid var(--line);border-radius:6px;background:var(--panel-raised);cursor:pointer}@keyframes page-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.intro{text-align:center;margin-bottom:27px}.eyebrow{margin:0 0 10px;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.intro h1{margin:0;font-size:clamp(34px,4vw,49px);line-height:1.12;letter-spacing:-.045em}.intro>p:last-child{margin:12px 0 0;color:var(--muted);font-size:14px}.tuner-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:22px;padding:32px 48px 29px;background:linear-gradient(145deg,rgba(255,255,255,.018),transparent 45%),var(--panel);box-shadow:0 24px 70px #00000040}.tuner-card:before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:var(--accent);filter:blur(130px);opacity:.035;left:calc(50% - 165px);top:-190px}.note-readout{height:205px;position:relative;display:flex;align-items:center;justify-content:center}.note{font-size:154px;line-height:1;font-weight:600;letter-spacing:-.09em;margin-left:-.08em;font-variant-numeric:tabular-nums}.frequency,.cents{position:absolute;top:50%;transform:translateY(-50%);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;color:var(--muted);font-size:14px}.frequency{left:0;display:flex;align-items:baseline;gap:5px}.frequency small{font-size:10px;color:#667066}.cents{right:0;width:120px;text-align:right}.meter{margin-top:1px}.meter-labels{display:flex;justify-content:space-between;padding:0 2px 8px;color:#646d64;font:10px SFMono-Regular,Consolas,monospace}.meter-track{position:relative;height:42px;border-top:1px solid #3d433d}.ticks{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(5% - 1px),rgba(255,255,255,.12) calc(5% - 1px),rgba(255,255,255,.12) 5%);mask-image:linear-gradient(to bottom,#000 0 9px,transparent 9px)}.tune-zone{position:absolute;left:46%;right:46%;top:-1px;height:20px;background:linear-gradient(to bottom,rgba(223,255,79,.25),transparent);border-top:1px solid var(--accent);opacity:.45}.needle{position:absolute;top:-8px;left:50%;width:2px;height:34px;border-radius:2px;background:#7e877e;transform:translate(-50%);transition:left .1s ease-out,background .16s;box-shadow:0 0 13px #dfff4f00}.meter.detecting .needle{background:var(--text)}.meter.in-tune .needle{background:var(--accent);box-shadow:0 0 13px #dfff4f99}.direction-row{display:grid;grid-template-columns:1fr 1fr 1fr;color:#677067;font-size:11px}.direction-row strong{text-align:center;color:var(--muted);text-transform:uppercase;font-size:10px;letter-spacing:.12em}.direction-row span:last-child{text-align:right}.direction-row .active{color:var(--text)}.direction-row strong.active{color:var(--accent)}.strings{display:flex;align-items:center;justify-content:center;gap:11px;margin-top:26px}.strings button{width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:#171a17;cursor:pointer;color:#b8c0b8;font-weight:600;transition:.15s ease}.strings button span{display:block;font:8px SFMono-Regular,Consolas,monospace;color:#606860;margin-bottom:-2px}.strings button:hover{border-color:#606960;transform:translateY(-1px)}.strings button.active{color:#161a0d;background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 5px var(--accent-soft)}.strings button.active span{color:#596423}.controls{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;align-items:end;gap:16px;margin-top:22px}.device-control>span,.reference-control>span{display:block;margin:0 0 7px 2px;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.select-wrap{position:relative}.select-wrap .select-chevron{position:absolute;right:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}select{width:100%;height:47px;appearance:none;border:1px solid var(--line);border-radius:11px;padding:0 42px 0 15px;background:var(--panel);color:var(--text);outline:none}select:focus{border-color:#6e786e}.reference-stepper{height:47px;display:flex;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--panel)}.reference-stepper button{width:34px;border:0;background:transparent;color:var(--muted);cursor:pointer}.reference-stepper button:hover{color:var(--text);background:#ffffff08}.reference-value-wrap{min-width:74px;display:flex;align-items:center;justify-content:center;gap:5px;border-radius:6px;font:12px SFMono-Regular,Consolas,monospace;cursor:text;touch-action:manipulation;transition:.14s ease}.reference-value-wrap input{width:32px;border:0;padding:0;color:var(--text);background:transparent;outline:none;font:inherit;text-align:right;appearance:textfield;cursor:text}.reference-value-wrap input::-webkit-inner-spin-button{display:none}.reference-value-wrap>span{color:var(--text);text-transform:none;letter-spacing:0;font:inherit}.reference-value-wrap.editing{background:#ffffff0f;box-shadow:inset 0 0 0 1px #596259}.reference-value-wrap.editing input{color:var(--accent)}.listen-button{height:47px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:11px;padding:0 22px;color:#171a0e;background:var(--accent);font-size:13px;font-weight:700;cursor:pointer;transition:.15s}.listen-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.listen-button.listening{color:var(--text);background:var(--panel-raised);border:1px solid var(--line)}.listen-icon{width:9px;height:13px;border:2px solid currentColor;border-radius:5px;position:relative}.listen-icon:after{content:"";position:absolute;width:7px;height:4px;border:1px solid currentColor;border-top:0;border-radius:0 0 6px 6px;left:-1px;bottom:-5px}.help{min-height:19px;margin:15px 0 0;text-align:center;color:#697269;font-size:12px}.help.error{color:var(--danger)}.metronome-page{width:min(850px,calc(100% - 80px))}.metronome-intro{margin-bottom:24px}.metronome-card{border:1px solid var(--line);border-radius:22px;padding:28px 44px 25px;background:linear-gradient(145deg,rgba(255,255,255,.018),transparent 45%),var(--panel);box-shadow:0 24px 70px #00000040}.beat-lights{min-height:16px;display:flex;justify-content:center;align-items:center;gap:10px}.beat-lights span{width:7px;height:7px;border-radius:50%;background:#464d46;transition:70ms ease}.beat-lights span.active{transform:scale(1.45);background:#dfe5df;box-shadow:0 0 11px #ffffff40}.beat-lights span.accent{background:var(--accent);box-shadow:0 0 14px #dfff4fa6}.tempo-display{display:grid;grid-template-columns:56px minmax(250px,290px) 56px;align-items:center;justify-content:center;gap:26px;margin:10px 0 5px}.tempo-step{width:52px;height:52px;border:1px solid var(--line);border-radius:50%;color:var(--muted);background:#171a17;font-size:26px;font-weight:300;cursor:pointer;transition:.15s ease}.tempo-step:hover{color:var(--accent);border-color:#68713f;transform:scale(1.04)}.tempo-value-wrap{min-width:0;display:grid;grid-template-columns:1fr;justify-items:center;text-align:center}.tempo-number{grid-row:2;width:260px;border:0;border-radius:10px;padding:0 18px;color:var(--text);background:transparent;outline:none;font:600 104px/1 Inter,Avenir,Segoe UI,sans-serif;letter-spacing:-.055em;text-align:center;appearance:textfield;cursor:text;transition:.14s ease}.tempo-number::-webkit-inner-spin-button{display:none}.tempo-value-wrap>span{grid-row:1;margin-bottom:7px;color:var(--muted);font:10px SFMono-Regular,Consolas,monospace;letter-spacing:.12em}.tempo-value-wrap strong{grid-row:3;margin-top:6px;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.tempo-value-wrap.editing .tempo-number{color:var(--accent);background:#ffffff0d;box-shadow:inset 0 0 0 1px #596259}input[type=range]{accent-color:var(--accent)}.tempo-slider{width:100%;height:4px;margin:18px 0 28px;cursor:pointer}.tempo-slider::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(90deg,#65732e,#303530)}.tempo-slider::-webkit-slider-thumb{width:16px;height:16px;margin-top:-6px;border:3px solid var(--panel);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent);appearance:none}.metronome-settings{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:22px;border-top:1px solid rgba(255,255,255,.07)}.metronome-control-layout{display:contents}.metronome-settings label>span{display:block;margin:0 0 7px 2px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.metronome-settings select{height:44px}.metronome-actions{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;margin-top:24px}.tap-button{justify-self:start;height:42px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 14px;color:#b7bfb7;background:transparent;font-size:12px;font-weight:600;cursor:pointer}.tap-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.tap-button:hover{color:var(--text);border-color:#596159}.tap-button.pulse{animation:tap-pulse .18s ease}@keyframes tap-pulse{50%{color:var(--accent);border-color:var(--accent);transform:scale(.96)}}.metronome-start{min-width:142px;height:52px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:13px;color:#171a0e;background:var(--accent);font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 0 0 0 var(--accent-soft);transition:.16s ease}.metronome-start:hover{filter:brightness(1.06);transform:translateY(-1px)}.metronome-start.running{color:var(--text);background:#303530;box-shadow:0 0 0 1px #474e47}.play-shape{width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid currentColor}.metronome-start.running .play-shape{width:10px;height:12px;border:0;background:linear-gradient(90deg,currentColor 0 35%,transparent 35% 65%,currentColor 65%)}.accent-toggle{justify-self:end;display:flex;align-items:center;gap:9px;color:var(--muted);font-size:11px;cursor:pointer;white-space:nowrap}.accent-toggle input{position:absolute;opacity:0;pointer-events:none}.toggle-track{width:34px;height:19px;border-radius:20px;background:#363c36;padding:3px;transition:.15s ease}.toggle-track i{display:block;width:13px;height:13px;border-radius:50%;background:#899289;transition:.15s ease}.accent-toggle input:checked+.toggle-track{background:#5d6b27}.accent-toggle input:checked+.toggle-track i{transform:translate(15px);background:var(--accent)}.volume-row{display:grid;grid-template-columns:18px auto 1fr 42px;align-items:center;gap:9px;margin-top:23px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07);color:var(--muted);font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.volume-row svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.volume-row input{width:100%}.volume-row output{text-align:right;font:10px SFMono-Regular,Consolas,monospace}.shortcut-hint{margin:15px 0 0;color:#697269;text-align:center;font-size:10px}.shortcut-hint kbd{display:inline-block;min-width:25px;margin:0 3px;border:1px solid #3c423c;border-bottom-width:2px;border-radius:5px;padding:2px 6px;color:#a8b0a8;background:#191c19;font:9px SFMono-Regular,Consolas,monospace}.shortcut-hint span{margin:0 7px;color:#404640}.fretboard-page{width:min(1100px,calc(100% - 60px))}.fretboard-intro{margin-bottom:24px}.fretboard-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:22px;padding:24px;background:linear-gradient(145deg,rgba(255,255,255,.018),transparent 45%),var(--panel);box-shadow:0 24px 70px #00000040}.fretboard-toolbar{display:grid;grid-template-columns:minmax(210px,1fr) 145px 105px 105px 190px;align-items:end;gap:14px;margin:0 4px 22px}.played-note{min-width:240px;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:end}.played-note>span,.note-duration-control>span,.fret-volume-control>span{display:block;margin-bottom:7px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.played-note>span{grid-column:1 / -1}.played-note strong{color:var(--accent);font-size:27px;line-height:1}.played-note small{overflow:hidden;padding-bottom:2px;color:var(--muted);font:10px SFMono-Regular,Consolas,monospace;text-overflow:ellipsis;white-space:nowrap}.note-duration-control select{height:43px}.fret-volume-control{display:grid;grid-template-columns:1fr 38px;align-items:center;column-gap:8px}.fret-volume-control>span{grid-column:1 / -1}.fret-volume-control input{width:100%}.fret-volume-control output{color:var(--muted);text-align:right;font:10px SFMono-Regular,Consolas,monospace}.fret-volume-stack{align-self:end}.challenge-input-status{display:none;margin-top:7px}.game-mode-button,.learn-mode-button{height:43px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid #59632f;border-radius:10px;padding:0 14px;color:#182009;background:var(--accent);font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:.15s ease}.learn-mode-button{color:#dce5cf;background:#30372a}.game-mode-button:hover,.learn-mode-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.game-mode-button.active,.learn-mode-button.active{border-color:#4b514b;color:#d6ddd6;background:#303530}.game-panel{display:grid;grid-template-columns:120px 1fr 135px;align-items:center;gap:12px 24px;margin:-2px 4px 22px;border:1px solid #485126;border-radius:14px;padding:15px 18px;background:linear-gradient(100deg,#dfff4f13,#ffffff03)}.game-panel[hidden],.learn-panel[hidden]{display:none}.learn-level-control{display:grid;grid-template-columns:74px 1fr;align-items:center;column-gap:8px;padding-top:1px}.learn-level-control>label{grid-column:1 / -1;margin-bottom:2px;color:#9ca78e;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.learn-level-control>input{width:74px;height:40px;border:0;border-radius:7px;padding:0 5px;color:var(--accent);background:#0c100a59;font:650 30px/1 SFMono-Regular,Consolas,monospace;text-align:center;box-shadow:inset 0 0 0 1px #dfff4f38}.learn-level-control>input:focus{outline:1px solid var(--accent);box-shadow:0 0 0 3px #dfff4f1a}.learn-level-control>small{align-self:center;padding:0;color:#a9b2a9;font:9px/1.55 SFMono-Regular,Consolas,monospace;white-space:nowrap}.learn-level-control>small b{color:var(--accent);font-weight:700}.learn-level-control>small span{display:block}.learn-progress-track{grid-column:1 / -1;height:3px;overflow:hidden;margin-top:7px;border-radius:4px;background:#343b31}.learn-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#91ad2d,var(--accent));box-shadow:0 0 7px #dfff4f73;transition:width .3s ease}.learn-timer-control{display:grid;grid-template-columns:1fr;justify-items:start;padding-top:1px;transition:.18s ease}.learn-timer-control>span{margin-bottom:2px;color:#9ca49c;font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.learn-timer-control strong{min-width:38px;color:var(--text);font:650 38px/1 SFMono-Regular,Consolas,monospace}.learn-timer-control small{margin-top:3px;padding:0;color:var(--muted);font-size:8px}.learn-timer-control.urgent strong{color:#ff9e91}.game-rank{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:8px}.game-rank>span,.game-question>span{grid-column:1 / -1;margin-bottom:3px;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.game-rank strong{color:var(--accent);font:600 30px/1 SFMono-Regular,Consolas,monospace}.game-rank strong.gained{animation:point-gained .36s ease}.game-rank strong.lost{animation:point-lost .36s ease}@keyframes point-gained{50%{color:#fff;transform:scale(1.25)}}@keyframes point-lost{50%{color:var(--danger);transform:translate(-3px)}}.game-rank small{padding-bottom:3px;color:#a9b2a9;font-size:9px}.game-input-status{grid-column:1 / -1;width:100%;overflow:hidden;margin-top:5px;border:0;padding:0;color:#818981;background:none;font: 8px SFMono-Regular,Consolas,monospace;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.game-input-status i{display:inline-block;width:5px;height:5px;margin-right:4px;border-radius:50%;background:#727972;vertical-align:1px}.game-input-status:hover{color:#d5dcd2}.game-input-status:focus-visible{border-radius:3px;outline:1px solid var(--accent);outline-offset:2px}.game-input-status.active{color:#aeb9a5}.game-input-status.active i{background:var(--accent);box-shadow:0 0 6px #dfff4f80}.game-input-status.error{color:#d89086}.game-input-status.error i{background:var(--danger)}.game-input-status.off{color:#8b928b}.game-input-status.off i{background:#555c55;box-shadow:none}.game-question{display:grid;grid-template-columns:auto 1fr;justify-self:center;align-items:center;column-gap:9px;text-align:center}.game-question>span{text-align:center}.game-question strong{justify-self:end;color:var(--text);font-size:30px;line-height:1}.game-question p{margin:0;color:var(--muted);font-size:11px}.game-question b{color:var(--accent);font-weight:700}.replay-note{width:41px;height:41px;display:flex;align-items:center;justify-content:center;border:1px solid #59662d;border-radius:50%;padding:0;color:#d8e3bb;background:linear-gradient(145deg,#3d4724,#29301d);cursor:pointer;box-shadow:inset 0 1px #ffffff0f,0 5px 14px #0003;transition:.15s ease}.replay-note:hover{color:var(--accent);border-color:#8da13d;transform:rotate(-25deg) scale(1.05)}.replay-note svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.game-feedback{grid-column:1 / -1;min-height:15px;margin:0;color:var(--muted);text-align:center;font-size:10px}.game-feedback.correct{color:#8ff2a7}.game-feedback.wrong{color:#ff9586}.fretboard-scroll{overflow-x:auto;border:1px solid #363b32;border-radius:14px;background:#171a15;outline:none;scrollbar-color:#535b3b #20241e;scrollbar-width:thin}.fretboard-scroll:focus-visible{box-shadow:0 0 0 2px var(--accent-soft);border-color:#647039}.fretboard{width:1008px;display:grid;grid-template-columns:72px repeat(13,72px);grid-template-rows:34px repeat(6,58px) 28px;position:relative;background:linear-gradient(90deg,#24261d,#313226 45%,#292b21)}.fret-corner,.fret-number{display:grid;place-items:center;border:0;border-bottom:1px solid #4b4d3e;padding:0;color:#8b9282;background:#1d201b;font:9px SFMono-Regular,Consolas,monospace;text-transform:uppercase}.fret-number.open{border-right:4px solid #d6cfad}.string-label{display:grid;place-items:center;border:0;border-right:1px solid #4b4d3e;border-bottom:1px solid rgba(255,255,255,.035);padding:0;color:#aab1a3;background:#1d201b;font:10px SFMono-Regular,Consolas,monospace}.fret-cell{position:relative;display:grid;place-items:center;border-right:2px solid rgba(193,194,176,.43);border-bottom:1px solid rgba(255,255,255,.035)}.fret-cell.open{border-right:4px solid #d6cfad;background:#20231e}.string-line{position:absolute;z-index:0;width:100%;height:var(--string-weight);left:0;top:50%;background:linear-gradient(to bottom,#ebe9dc,#777a70);box-shadow:0 1px 1px #0009;transform:translateY(-50%)}.note-bubble{position:relative;z-index:1;width:36px;height:36px;display:grid;place-items:center;border:1px solid #9eb339;border-radius:50%;color:#182009;background:var(--accent);font-size:11px;font-weight:800;cursor:pointer;box-shadow:0 3px 9px #00000059;transition:.12s ease}.note-bubble.sharp{border-color:#626a62;color:#d4dad4;background:#333833}.note-bubble:hover{z-index:2;transform:scale(1.12);filter:brightness(1.08)}.note-bubble.selected{color:#13170b;background:#fff;border-color:var(--accent);box-shadow:0 0 0 5px #dfff4f2e,0 3px 9px #0006;transform:scale(1.1)}.fretboard-card.game-mode .fretboard-toolbar{grid-template-columns:120px max-content 43px minmax(40px,1fr) auto 200px;align-items:center;column-gap:24px;padding-bottom:17px;border-bottom:1px solid rgba(255,255,255,.07)}.fretboard-card.game-mode .played-note,.fretboard-card.game-mode .note-duration-control,.fretboard-card.game-mode .learn-mode-button{display:none}.fretboard-card.game-mode .game-panel:not([hidden]){display:contents}.fretboard-card.game-mode .game-rank{grid-column:1;grid-row:1}.fretboard-card.game-mode .game-question{grid-column:2;grid-row:1}.fretboard-card.game-mode .replay-note{grid-column:3;grid-row:1}.fretboard-card.game-mode .fret-volume-stack{grid-column:6;grid-row:1}.fretboard-card.game-mode .challenge-input-status{display:block}.fretboard-card.game-mode .game-mode-button{grid-column:5;grid-row:1}.fretboard-card.game-mode .game-feedback{grid-column:1 / -1;grid-row:2;margin-top:-2px}.fretboard-card.game-mode .string-label{cursor:pointer;transition:.12s ease}.fretboard-card.game-mode .string-label[aria-pressed=true]{color:var(--accent);background:#29301e;box-shadow:inset 3px 0 var(--accent)}.fretboard-card.game-mode .string-label[aria-pressed=false]{color:#555d55;background:#181b17;box-shadow:inset 3px 0 #3c423c}.fretboard-card.game-mode .string-label:hover{color:#fff;background:#32382a}.fretboard-card.game-mode .string-label:focus-visible{z-index:2;outline:2px solid var(--accent);outline-offset:-3px}.fretboard-card.game-mode .fret-number.open{cursor:pointer;transition:.12s ease}.fretboard-card.game-mode .fret-number.open:hover{color:#fff;background:#32382a}.fretboard-card.game-mode .fret-number.open[aria-pressed=true]{color:#182009;background:var(--accent);border-right-color:var(--accent)}.fretboard-card.game-mode .fret-number.open:focus-visible{z-index:2;outline:2px solid var(--accent);outline-offset:-3px}.fretboard-card.game-mode .fret-cell.string-disabled{opacity:.28}.fretboard-card.game-mode .fret-cell.string-disabled .note-bubble{pointer-events:none}.fretboard-card.game-mode .note-bubble,.fretboard-card.game-mode .note-bubble.sharp{border-color:#596159;color:transparent;background:#303530}.fretboard-card.game-mode .note-bubble:hover{border-color:#899289;background:#3a403a}.fretboard-card.game-mode .note-bubble.correct{border-color:#9cf5ad;color:#102016;background:#78e88e;box-shadow:0 0 0 5px #78e88e33,0 3px 9px #0006}.fretboard-card.game-mode .note-bubble.wrong{border-color:#ffaca1;color:#fff;background:#dc5f51;box-shadow:0 0 0 4px #dc5f512b,0 3px 9px #0006}.fretboard-card.learn-mode .fretboard-toolbar{grid-template-columns:180px 300px 95px minmax(40px,1fr) auto 180px;align-items:start;column-gap:18px;padding:3px 0 18px;border-bottom:1px solid rgba(255,255,255,.07)}.fretboard-card.learn-mode .played-note,.fretboard-card.learn-mode .note-duration-control,.fretboard-card.learn-mode .game-mode-button{display:none}.fretboard-card.learn-mode .learn-panel:not([hidden]){display:contents}.fretboard-card.learn-mode .learn-level-control{grid-column:1;grid-row:1}.fretboard-card.learn-mode .learn-question{grid-column:2;grid-row:1}.fretboard-card.learn-mode .learn-timer-control{grid-column:3;grid-row:1}.fretboard-card.learn-mode .learn-mode-button{grid-column:5;grid-row:1;margin-top:12px}.fretboard-card.learn-mode .fret-volume-stack{grid-column:6;grid-row:1;align-self:start}.fretboard-card.learn-mode .challenge-input-status{display:block}.fretboard-card.learn-mode .learn-feedback{grid-column:1 / -1;grid-row:2;margin-top:-2px}.fretboard-card.learn-mode .learn-question{min-width:220px;display:grid;grid-template-columns:1fr;justify-self:start;justify-items:start;padding-top:1px;text-align:left}.fretboard-card.learn-mode .learn-question>span{grid-column:1;text-align:left}.fretboard-card.learn-mode .learn-question strong{justify-self:start;font-size:32px}.fretboard-card.learn-mode .learn-question p{margin-top:7px}.fretboard-card.learn-mode .learn-question strong{text-shadow:0 0 20px rgba(223,255,79,.12)}.fretboard-card.learn-mode .learn-mode-button.active{border-color:#59605b;color:#e7ece6;background:linear-gradient(145deg,#353b36,#272c28);box-shadow:inset 0 1px #ffffff0d}.fretboard-card.learn-mode .learn-feedback{width:fit-content;justify-self:center;border-radius:12px;padding:5px 14px;background:#ffffff06}.fretboard-card.learn-mode .string-label[aria-pressed=true]{color:var(--accent);background:#29301e;box-shadow:inset 3px 0 var(--accent)}.fretboard-card.learn-mode .string-label[aria-pressed=false]{color:#555d55;background:#181b17;box-shadow:inset 3px 0 #3c423c}.fretboard-card.learn-mode .fret-cell.learn-disabled{opacity:.2}.fretboard-card.learn-mode .fret-cell.learn-disabled .note-bubble{pointer-events:none}.fretboard-card.learn-mode .note-bubble,.fretboard-card.learn-mode .note-bubble.sharp{border-color:#596159;color:transparent;background:#303530}.fretboard-card.learn-mode .note-bubble:hover{border-color:#899289;background:#3a403a}.fretboard-card.learn-mode .note-bubble.correct{border-color:#9cf5ad;color:#102016;background:#78e88e;box-shadow:0 0 0 5px #78e88e33,0 3px 9px #0006}.fretboard-card.learn-mode .note-bubble.wrong{border-color:#ffaca1;color:#fff;background:#dc5f51;box-shadow:0 0 0 4px #dc5f512b,0 3px 9px #0006}.marker-label,.fret-marker{display:flex;align-items:center;justify-content:center;background:#1d201b}.marker-label{border-right:1px solid #353a33}.fret-marker{gap:8px;border-right:1px solid #30352f}.fret-marker i{width:5px;height:5px;border-radius:50%;background:#788071}.fretboard-legend{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:15px;color:#717971;font-size:9px}.fretboard-legend span{display:flex;align-items:center;gap:6px}.fretboard-legend .game-string-hint,.fretboard-legend .learn-level-hint{display:none;color:#aeb99a}.fretboard-card.game-mode .fretboard-legend span:not(.game-string-hint){display:none}.fretboard-card.game-mode .fretboard-legend .game-string-hint{display:flex}.fretboard-card.learn-mode .fretboard-legend span:not(.learn-level-hint){display:none}.fretboard-card.learn-mode .fretboard-legend .learn-level-hint{display:flex}.fretboard-legend i{width:8px;height:8px;border-radius:50%}.root-swatch{background:var(--accent)}.sharp-swatch{background:#414741;border:1px solid #687068}.confetti-layer{position:absolute;z-index:20;width:1px;height:1px;left:50%;top:180px;pointer-events:none}.confetti-layer i{position:absolute;width:7px;height:12px;border-radius:2px;opacity:0}.confetti-layer.celebrate i{animation:confetti-burst 1.15s cubic-bezier(.15,.65,.35,1) var(--delay) forwards}@keyframes confetti-burst{0%{opacity:1;transform:translate(0) rotate(0)}45%{opacity:1}to{opacity:0;transform:translate(var(--x),390px) rotate(var(--rotation))}}.level-confetti-layer{position:fixed;z-index:100;inset:0;overflow:hidden;pointer-events:none}.level-confetti-layer i{position:absolute;width:9px;height:16px;top:-24px;border-radius:2px;opacity:0}.level-confetti-layer.celebrate i{animation:level-confetti-fall 3.7s cubic-bezier(.12,.6,.25,1) var(--delay) forwards}@keyframes level-confetti-fall{0%{opacity:1;transform:translateY(-30px) rotate(0)}80%{opacity:1}to{opacity:0;transform:translate(var(--drift),110vh) rotate(var(--rotation))}}.chords-page{width:min(1100px,calc(100% - 60px))}.chords-intro{margin-bottom:22px}.chords-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:22px;padding:24px;background:linear-gradient(145deg,rgba(255,255,255,.02),transparent 46%),var(--panel);box-shadow:0 24px 70px #00000040}.chords-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 84px 104px 210px;align-items:end;gap:15px;margin:0 4px 18px}.selected-chord{display:grid;grid-template-columns:auto 1fr;align-items:end;gap:0 14px;min-width:0}.selected-chord>span,.chord-volume-control>span,.advanced-chord-controls label>span,.advanced-root-control>span{grid-column:1 / -1;display:block;margin-bottom:6px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.selected-chord strong{color:var(--accent);font-size:34px;line-height:1;letter-spacing:-.04em}.selected-chord small{overflow:hidden;padding-bottom:3px;color:#b8c1b4;font:10px SFMono-Regular,Consolas,monospace;text-overflow:ellipsis;white-space:nowrap}.advanced-chords-button,.chord-game-button{height:43px;display:flex;align-items:center;justify-content:center;border:1px solid #59632f;border-radius:10px;color:#dce5cf;background:#30372a;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:.15s ease}.advanced-chords-button:hover,.chord-game-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.advanced-chords-button.active,.chord-game-button{color:#182009;background:var(--accent)}.chord-game-button.active{border-color:#505750;color:#e2e8df;background:#303530}.chord-volume-control{display:grid;grid-template-columns:1fr 39px;align-items:center;column-gap:9px}.chord-volume-control>span{grid-column:1 / -1}.chord-volume-control input{width:100%}.chord-volume-control output{color:var(--muted);text-align:right;font:10px SFMono-Regular,Consolas,monospace}.chord-volume-stack{align-self:end}.chord-game-input-status{display:none;width:100%;overflow:hidden;margin-top:7px;border:0;padding:0;color:#818981;background:none;font: 8px SFMono-Regular,Consolas,monospace;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.chord-game-input-status i{display:inline-block;width:5px;height:5px;margin-right:4px;border-radius:50%;background:#727972;vertical-align:1px}.chord-game-input-status:hover{color:#d5dcd2}.chord-game-input-status.active{color:#aeb9a5}.chord-game-input-status.active i{background:var(--accent);box-shadow:0 0 6px #dfff4f80}.chord-game-input-status.error{color:#d89086}.chord-game-input-status.error i{background:var(--danger)}.chord-game-input-status.off i{background:#555c55}.chords-card.advanced-mode .chord-game-button{display:none}.chords-card.advanced-mode .chords-toolbar{grid-template-columns:minmax(220px,1fr) 104px 210px}.chords-card.game-mode .selected-chord,.chords-card.game-mode .advanced-chords-button{display:none}.chords-card.game-mode .chords-toolbar{grid-template-columns:minmax(0,1fr) 84px 210px}.chords-card.game-mode .chord-game-button{grid-column:2}.chords-card.game-mode .chord-volume-stack{grid-column:3}.chords-card.game-mode .chord-game-input-status{display:block}.chord-game-panel{display:grid;grid-template-columns:150px minmax(220px,1fr) 80px 106px;align-items:center;gap:16px 22px;margin:-3px 4px 18px;border:1px solid #485126;border-radius:14px;padding:14px 18px;background:linear-gradient(100deg,#dfff4f13,#ffffff03)}.chord-game-panel[hidden]{display:none}.chord-game-score,.chord-game-question,.chord-game-timer{display:grid}.chord-game-score>span,.chord-game-question>span,.chord-game-timer>span{margin-bottom:3px;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.chord-game-score{grid-template-columns:auto 1fr;align-items:end;column-gap:9px}.chord-game-score>span{grid-column:1 / -1}.chord-game-score strong{color:var(--accent);font:650 31px/1 SFMono-Regular,Consolas,monospace}.chord-game-score small{padding-bottom:3px;color:#8f998f;font-size:8px}.chord-game-score small b{color:#bdca9a}.chord-game-question{justify-items:center;text-align:center}.chord-game-question strong{color:var(--text);font-size:31px;line-height:1}.chord-game-question small{margin-top:5px;color:var(--muted);font-size:9px}.chord-game-timer{justify-items:start}.chord-game-timer strong{color:var(--text);font:650 32px/1 SFMono-Regular,Consolas,monospace}.chord-game-timer small{margin-top:3px;color:var(--muted);font-size:8px}.chord-game-timer.urgent strong{color:#ff9e91}.chord-game-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.chord-repeat-button,.chord-skip-button{height:38px;display:flex;align-items:center;justify-content:center;border:1px solid #4d5544;color:#d7ded2;background:#2b302a;cursor:pointer;transition:.14s ease}.chord-repeat-button{width:38px;border-radius:50%;padding:0}.chord-repeat-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.chord-repeat-button:hover{border-color:#87983e;color:var(--accent);transform:rotate(-24deg)}.chord-repeat-button.playing{animation:chord-repeat-pulse .42s ease}@keyframes chord-repeat-pulse{50%{color:var(--accent);box-shadow:0 0 0 5px #dfff4f1a}}.chord-skip-button{min-width:58px;border-radius:9px;padding:0 12px;font-size:9px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}.chord-skip-button:hover{border-color:#6c765d;color:#fff;background:#363c34;transform:translateY(-1px)}.chord-game-feedback{grid-column:1 / -1;min-height:14px;margin:-2px 0 0;color:var(--muted);text-align:center;font-size:10px}.chord-game-feedback.correct{color:#8ff2a7}.chord-game-feedback.wrong{color:#ff9586}.chord-game-feedback.timeout{color:#d7c58e}.common-chords{display:grid;grid-template-columns:repeat(10,minmax(62px,1fr));gap:7px;margin-bottom:18px}.common-chords button{height:54px;display:grid;place-content:center;gap:2px;border:1px solid #3b4138;border-radius:10px;color:#d9dfd6;background:#222621;cursor:pointer;transition:.14s ease}.common-chords button:hover{border-color:#6b783d;color:#fff;background:#2a3024;transform:translateY(-1px)}.common-chords button.active{border-color:#93a943;color:#172007;background:var(--accent);box-shadow:0 0 0 3px #dfff4f14}.common-chords button strong{font-size:16px;line-height:1}.common-chords button span{font-size:8px;opacity:.67}.advanced-chords{margin-bottom:18px;border:1px solid #3a4035;border-radius:13px;padding:12px 15px;background:#dfff4f06}.advanced-chords[hidden],.common-chords[hidden]{display:none}.advanced-chord-controls{display:grid;grid-template-columns:minmax(0,1fr) 210px;align-items:end;gap:16px}.advanced-chord-controls select{width:100%;height:40px}.advanced-root-buttons{display:grid;grid-template-columns:repeat(12,minmax(42px,1fr));gap:6px}.advanced-root-buttons button{height:42px;border:1px solid #42483e;border-radius:8px;padding:0 5px;color:#cbd2c8;background:#232722;font-size:12px;font-weight:750;cursor:pointer;transition:.13s ease}.advanced-root-buttons button:hover{border-color:#6e7b3d;color:#fff;background:#2e3428;transform:translateY(-1px)}.advanced-root-buttons button.active{border-color:#a2b846;color:#182009;background:var(--accent);box-shadow:0 0 0 3px #dfff4f14}.chord-fretboard-scroll{overflow-x:auto;border:1px solid #363b32;border-radius:14px;background:#171a15;outline:none;scrollbar-color:#535b3b #20241e;scrollbar-width:thin}.chord-fretboard-scroll:focus-visible{border-color:#647039;box-shadow:0 0 0 2px var(--accent-soft)}.chord-fretboard{position:relative;width:1008px;display:grid;grid-template-columns:72px repeat(13,72px);grid-template-rows:34px repeat(6,58px);background:linear-gradient(90deg,#24261d,#313226 45%,#292b21)}.chord-fret-corner,.chord-fret-number{display:grid;place-items:center;border-bottom:1px solid #4b4d3e;color:#8b9282;background:#1d201b;font:9px SFMono-Regular,Consolas,monospace;text-transform:uppercase}.chord-fret-number.open{border-right:4px solid #d6cfad}.chord-string-label{display:grid;place-items:center;border-right:1px solid #4b4d3e;border-bottom:1px solid rgba(255,255,255,.035);color:#aab1a3;background:#1d201b;font:10px SFMono-Regular,Consolas,monospace}.chord-string-label.muted{color:#646c64}.chord-fret-cell{position:relative;display:grid;place-items:center;border-right:2px solid rgba(193,194,176,.43);border-bottom:1px solid rgba(255,255,255,.035)}.chord-fret-cell.open{border-right:4px solid #d6cfad;background:#20231e}.chord-string-line{position:absolute;z-index:0;width:100%;height:var(--string-weight);left:0;top:50%;background:linear-gradient(to bottom,#ebe9dc,#777a70);box-shadow:0 1px 1px #0009;transform:translateY(-50%)}.chord-barre{position:absolute;z-index:1;left:calc(72px + (var(--barre-fret) + .5) * 72px - 15.5px);top:calc(34px + var(--barre-from) * 58px + 11px);width:31px;height:calc(var(--barre-strings) * 58px - 22px);min-height:36px;border:1px solid rgba(189,205,157,.22);border-radius:18px;background:linear-gradient(90deg,#74806261,#9daa8185,#74806261);box-shadow:0 4px 12px #00000047;pointer-events:none;transition:opacity .22s ease,transform .22s ease}.chord-note-bubble{position:relative;z-index:2;width:34px;height:34px;display:grid;place-items:center;border:1px solid #727c70;border-radius:50%;color:#e7ece5;background:#3b423a;font-size:10px;font-weight:800;box-shadow:0 3px 9px #00000052;transition:opacity .22s ease,transform .22s ease}.chord-note-bubble.root{border-color:#a8bd43;color:#182009;background:var(--accent);box-shadow:0 0 0 4px #dfff4f1a,0 3px 9px #00000059}.chord-muted-string{position:relative;z-index:1;color:#aab3aa;font:700 24px/1 SFMono-Regular,Consolas,monospace;text-shadow:0 1px 3px #111}.chords-card.game-mode:not(.answer-revealed) .chord-note-bubble,.chords-card.game-mode:not(.answer-revealed) .chord-muted-string,.chords-card.game-mode:not(.answer-revealed) .chord-barre{opacity:0;transform:scale(.72)}.chords-card.game-mode.answer-revealed .chord-note-bubble,.chords-card.game-mode.answer-revealed .chord-muted-string,.chords-card.game-mode.answer-revealed .chord-barre{opacity:.38;filter:grayscale(.45)}.chords-card.game-mode.answer-revealed.correct-answer .chord-note-bubble,.chords-card.game-mode.answer-revealed.correct-answer .chord-muted-string,.chords-card.game-mode.answer-revealed.correct-answer .chord-barre{opacity:1;filter:none}.chord-legend{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:15px;color:#747d74;font-size:9px}.chord-legend span{display:flex;align-items:center;gap:6px}.chord-legend i{width:9px;height:9px;border-radius:50%}.chord-legend b{color:#9aa39a;font:15px/1 SFMono-Regular,Consolas,monospace}.chord-root-swatch{background:var(--accent)}.chord-tone-swatch{border:1px solid #727c70;background:#3b423a}.chord-barre-swatch{width:16px!important;height:7px!important;border:1px solid rgba(189,205,157,.35);border-radius:5px!important;background:#919f7780}.chord-confetti-layer{position:absolute;z-index:20;width:1px;height:1px;left:50%;top:175px;pointer-events:none}.chord-confetti-layer i{position:absolute;width:7px;height:11px;border-radius:2px;opacity:0}.chord-confetti-layer.celebrate i{animation:chord-confetti-burst 1.05s cubic-bezier(.15,.65,.35,1) var(--delay) forwards}@keyframes chord-confetti-burst{0%{opacity:1;transform:translate(0) rotate(0)}45%{opacity:1}to{opacity:0;transform:translate(var(--x),330px) rotate(var(--rotation))}}.chord-milestone-confetti{position:fixed;z-index:110;inset:0;overflow:hidden;pointer-events:none}.chord-milestone-confetti i{position:absolute;width:9px;height:16px;top:-24px;border-radius:2px;opacity:0}.chord-milestone-confetti.celebrate i{animation:chord-confetti-fall 3.4s cubic-bezier(.12,.6,.25,1) var(--delay) forwards}@keyframes chord-confetti-fall{0%{opacity:1;transform:translateY(-30px) rotate(0)}82%{opacity:1}to{opacity:0;transform:translate(var(--drift),110vh) rotate(var(--rotation))}}.scales-page{width:min(1180px,calc(100% - 60px))}.scales-intro{margin-bottom:22px}.scales-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:22px;padding:24px;background:linear-gradient(145deg,rgba(255,255,255,.025),transparent 48%),var(--panel);box-shadow:0 24px 70px #00000040}.scales-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:16px}.scales-heading-actions{display:flex;align-items:flex-start;gap:18px}.scale-learn-counter{display:none;min-width:86px;margin-top:7px}.scales-card.learn-mode .scale-learn-counter{display:grid;gap:4px}.scale-learn-counter>span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.scale-learn-counter strong{display:flex;align-items:baseline;gap:4px;color:var(--accent);font:700 28px/1 SFMono-Regular,Consolas,monospace}.scale-learn-counter strong small{color:#7f887d;font-size:8px}.scale-learn-counter.complete strong{text-shadow:0 0 18px rgba(223,255,79,.45)}.scale-game-button,.scale-learn-button{height:39px;margin-top:13px;border:1px solid #50594b;border-radius:9px;padding:0 18px;color:#d5ddd2;background:#2b302b;font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;cursor:pointer}.scale-game-button:hover,.scale-game-button.active,.scale-learn-button:hover,.scale-learn-button.active{border-color:#91a63d;color:#192107;background:var(--accent)}.selected-scale-summary{min-width:0;display:grid}.selected-scale-summary>span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.14em;text-transform:uppercase}.selected-scale-summary strong{margin-top:4px;color:#f5f7f2;font-size:25px;line-height:1}.selected-scale-summary small{margin-top:7px;color:#91a072;font:9px SFMono-Regular,Consolas,monospace}.scale-volume-stack{width:220px;display:grid;gap:7px}.scale-volume-control{width:100%;display:grid;grid-template-columns:1fr 38px;align-items:center;gap:5px 9px}.scale-volume-control>span{grid-column:1 / -1;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.scale-volume-control input{width:100%}.scale-volume-control output{color:var(--muted);text-align:right;font:9px SFMono-Regular,Consolas,monospace}.scale-category-tabs{display:flex;gap:7px;border-top:1px solid rgba(255,255,255,.055);padding-top:15px}.scale-category-tabs button,.scale-pattern-control button{height:34px;border:1px solid #444c40;border-radius:9px;padding:0 15px;color:#aeb7aa;background:#242824;font-size:9px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:.14s ease}.scale-category-tabs button:hover,.scale-pattern-control button:hover{border-color:#778345;color:#fff}.scale-category-tabs button.active,.scale-pattern-control button.active{border-color:#899d36;color:#172006;background:var(--accent);box-shadow:0 0 0 4px #dfff4f12}.scale-category-tabs button:disabled{border-color:#383e37;color:#626a61;background:#222622;cursor:not-allowed;opacity:.52}.scale-root-buttons{display:grid;grid-template-columns:repeat(12,minmax(55px,1fr));gap:6px;margin-top:12px}.scale-root-buttons button{min-width:0;height:38px;overflow:hidden;border:1px solid #3f483d;border-radius:9px;padding:0 5px;color:#c9d0c6;background:#252a24;font:700 9px SFMono-Regular,Consolas,monospace;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;transition:.14s ease}.scale-root-buttons button:hover{border-color:#71803c;color:#fff;background:#30362b}.scale-root-buttons button.active{border-color:var(--accent);color:#182007;background:var(--accent);box-shadow:0 0 0 4px #dfff4f12}.scale-root-buttons button.playing{transform:translateY(-2px);box-shadow:0 0 0 5px #dfff4f24}.scale-controls{display:grid;grid-template-columns:minmax(125px,.9fr) minmax(150px,1.15fr) minmax(200px,1.55fr) 100px 120px 108px;align-items:end;gap:11px;margin-top:15px}.scale-controls label,.scale-pattern-control{min-width:0;display:grid;gap:6px}.scale-controls label>span,.scale-pattern-control>span{color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.scale-controls select{width:100%;height:39px;border:1px solid #485046;border-radius:9px;padding:0 28px 0 10px;color:#eef2eb;background:#242924;font:10px SFMono-Regular,Consolas,monospace;cursor:pointer}.scale-controls select:focus-visible{border-color:var(--accent);outline:none}.scale-controls select:disabled{opacity:.45;cursor:default}.scale-pattern-control>div{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.scale-pattern-control button{height:39px;padding:0 7px;font-size:8px}.play-scale-button{height:39px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #6e7c39;border-radius:9px;padding:0 12px;color:#192107;background:var(--accent);font-size:9px;font-weight:800;cursor:pointer;transition:.14s ease}.play-scale-button:hover{transform:translateY(-1px);box-shadow:0 6px 16px #00000047}.play-scale-button.playing{color:#efffc1;background:#536026}.play-scale-button.paused{border-color:#899d36;color:var(--accent);background:#2d3422}.play-scale-button:disabled{border-color:#454b42;color:#788076;background:#292d29;box-shadow:none;cursor:not-allowed;opacity:.55;transform:none}.play-scale-button svg{width:16px;height:16px;fill:currentColor;stroke:none}.scale-style-hint{margin:12px 0 -2px;border-left:2px solid #8da13d;padding:2px 0 2px 10px;color:#9ca89a;font-size:9px;line-height:1.45}.scale-game-panel{display:grid;gap:12px;border-top:1px solid rgba(255,255,255,.055);padding-top:15px}.scale-game-panel[hidden]{display:none}.scale-game-status-row{display:grid;grid-template-columns:135px minmax(260px,1fr) 84px;align-items:start;gap:20px}.scale-game-score,.scale-game-question,.scale-game-timer{display:grid;gap:3px}.scale-game-score>span,.scale-game-question>span,.scale-game-timer>span,.scale-game-controls label>span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.14em;text-transform:uppercase}.scale-game-score strong{display:flex;align-items:baseline;gap:4px;color:var(--accent);font:700 30px/1 SFMono-Regular,Consolas,monospace}.scale-game-score strong small{color:#7f887d;font-size:8px}.scale-game-score em{color:#b4beb1;font-size:9px;font-style:normal}.scale-game-question strong{color:#f5f7f2;font-size:24px;line-height:1.05}.scale-game-question small{color:#9ca89a;font:9px SFMono-Regular,Consolas,monospace}.scale-game-timer strong{color:#f5f7f2;font:700 30px/1 SFMono-Regular,Consolas,monospace}.scale-game-timer small{color:#7f887d;font-size:8px}.scale-game-timer.urgent strong{color:#ff9187}.scale-game-controls{display:grid;grid-template-columns:1.2fr 1.25fr .8fr .9fr;gap:10px}.scale-game-controls label{min-width:0;display:grid;gap:5px}.scale-game-controls select{width:100%;height:37px;border:1px solid #485046;border-radius:9px;padding:0 28px 0 10px;color:#eef2eb;background:#242924;font:9px SFMono-Regular,Consolas,monospace;cursor:pointer}.scale-game-message-row{min-height:18px;display:grid;grid-template-columns:minmax(260px,1fr) auto;align-items:center;gap:14px}.scale-game-input-status{display:none;width:100%;overflow:hidden;border:0;padding:0;color:#818981;background:none;font:8px SFMono-Regular,Consolas,monospace;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.scales-card.game-mode .scale-volume-stack .scale-game-input-status,.scales-card.learn-mode .scale-volume-stack .scale-game-input-status{display:block}.scale-game-input-status i{display:inline-block;width:5px;height:5px;margin-right:4px;border-radius:50%;background:#727972;vertical-align:1px}.scale-game-input-status.active{color:#aeb9a5}.scale-game-input-status.active i{background:var(--accent);box-shadow:0 0 6px #dfff4f80}.scale-game-input-status.error{color:#d89086}.scale-game-input-status.error i{background:var(--danger)}.scale-game-input-status.off i{background:#555c55}.scale-game-feedback{margin:0;color:#929b8f;font-size:9px;text-align:center}.scale-game-feedback.correct{color:#bceccf}.scale-game-feedback.wrong,.scale-game-feedback.timeout{color:#ef9b91}.scale-game-progress{color:#8d978b;font:9px SFMono-Regular,Consolas,monospace;text-align:right}.scales-card.game-mode .selected-scale-summary,.scales-card.game-mode .scale-category-tabs,.scales-card.game-mode .scale-root-buttons,.scales-card.game-mode>.scale-controls,.scales-card.game-mode>.scale-style-hint,.scales-card.game-mode .scale-legend{display:none}.scales-card.game-mode .scale-learn-button,.scales-card.learn-mode .scale-game-button,.scales-card.learn-mode .play-scale-button{display:none}.scales-card.learn-mode>.scale-controls{grid-template-columns:minmax(125px,.9fr) minmax(150px,1.15fr) minmax(200px,1.55fr) 100px 120px}.scales-card.game-mode{display:grid;grid-template-columns:75px minmax(300px,1.25fr) 72px minmax(35px,.8fr) 74px 220px;align-items:start;column-gap:20px;row-gap:13px}.scales-card.game-mode .scales-heading,.scales-card.game-mode .scales-heading-actions,.scales-card.game-mode .scale-game-panel:not([hidden]),.scales-card.game-mode .scale-game-status-row{display:contents}.scales-card.game-mode .scale-game-score{grid-column:1;grid-row:1}.scales-card.game-mode .scale-game-question{grid-column:2;grid-row:1}.scales-card.game-mode .scale-game-timer{grid-column:3;grid-row:1}.scales-card.game-mode .scale-game-button{grid-column:5;grid-row:1;align-self:center;width:74px;margin:0;padding:0}.scales-card.game-mode .scale-volume-stack{grid-column:6;grid-row:1;align-self:center}.scales-card.game-mode .scale-game-controls{grid-column:1 / -1;grid-row:2;border-top:1px solid rgba(255,255,255,.07);padding-top:14px}.scales-card.game-mode .scale-game-message-row{grid-column:1 / -1;grid-row:3}.scales-card.game-mode .scale-fretboard-wrap{grid-column:1 / -1;grid-row:4;margin-top:0}.scales-card.game-mode .scale-note-button{opacity:0;pointer-events:none;transform:scale(.72)}.scales-card.game-mode .scale-note-button.game-correct{opacity:1;border-color:#a9f5bf;color:#102416;background:#72d891;box-shadow:0 0 0 4px #72d8911f;transform:scale(1.08)}.scales-card.game-mode .scale-note-button.game-wrong,.scales-card.game-mode .scale-note-button.scale-game-wrong-marker{opacity:1;border-color:#ff9a8e;color:#fff;background:#a4473f;box-shadow:0 0 0 4px #ff6c601a;transform:scale(1)}.scales-card.game-mode .scale-fret-cell>.scale-game-wrong-marker,.scales-card.learn-mode .scale-fret-cell>.scale-game-wrong-marker{position:absolute;z-index:3;inset:0;margin:auto;transform:none!important}.scales-card.game-mode.answer-revealed .scale-note-button:not(.game-correct):not(.game-wrong){opacity:.3;filter:grayscale(.25);transform:scale(.88)}.scales-card.learn-mode.listen-active .scale-note-button{opacity:.24;filter:grayscale(.3);transform:scale(.9)}.scales-card.learn-mode.listen-active .scale-note-button.learn-correct{opacity:1;filter:none;box-shadow:0 0 0 4px #72d8911f,0 3px 9px #00000059;transform:scale(1.08)}.scales-card.learn-mode .scale-note-button.scale-game-wrong-marker{opacity:1;border-color:#ff9a8e;color:#fff;background:#a4473f;filter:none;box-shadow:0 0 0 4px #ff6c601a;transform:none!important}.scale-confetti-layer{position:absolute;z-index:30;width:1px;height:1px;left:50%;top:255px;pointer-events:none}.scale-confetti-layer i{position:absolute;width:7px;height:12px;border-radius:2px;opacity:0}.scale-confetti-layer.celebrate i{animation:scale-confetti-burst 1.15s cubic-bezier(.15,.65,.35,1) var(--delay) forwards}@keyframes scale-confetti-burst{0%{opacity:1;transform:translate(0) rotate(0)}45%{opacity:1}to{opacity:0;transform:translate(var(--x),330px) rotate(var(--rotation))}}.scale-fretboard-wrap{overflow-x:auto;overflow-y:hidden;margin-top:16px;border:1px solid #373d34;border-radius:14px;background:#171a16;scrollbar-color:#535b3b #20241e;scrollbar-width:thin}.scale-fretboard{min-width:1020px;display:grid;grid-template-columns:92px 64px repeat(12,72px);grid-template-rows:31px repeat(6,49px)}.scale-fret-corner,.scale-fret-number{display:grid;place-items:center;border-right:1px solid #3e443b;border-bottom:1px solid #464b3e;color:#899388;background:#1d211c;font:8px SFMono-Regular,Consolas,monospace;text-transform:uppercase}.scale-fret-number.open{border-right:4px solid #d6cfad}.scale-string-label{display:flex;align-items:center;justify-content:center;gap:6px;border-right:1px solid #444a40;border-bottom:1px solid rgba(255,255,255,.04);color:#bbc4b8;background:#1d211c}.scale-string-label span{color:var(--accent);font:700 8px SFMono-Regular,Consolas,monospace}.scale-string-label strong{font-size:9px}.scale-fret-cell{position:relative;display:grid;place-items:center;border-right:2px solid rgba(193,194,176,.36);border-bottom:1px solid rgba(255,255,255,.035);background:linear-gradient(90deg,rgba(255,255,255,.008),transparent)}.scale-fret-cell.open{border-right:4px solid #d6cfad;background:#20241f}.scale-string-line{position:absolute;z-index:0;width:100%;height:var(--string-weight);left:0;top:50%;background:linear-gradient(to bottom,#e6e5d9,#74786f);box-shadow:0 1px 1px #0000009e;transform:translateY(-50%)}.scale-note-button{position:relative;z-index:1;width:31px;height:31px;display:grid;place-items:center;border:1px solid #6ca689;border-radius:50%;padding:0;color:#e8fff3;background:#356b53;font:750 9px SFMono-Regular,Consolas,monospace;box-shadow:0 3px 8px #00000057;cursor:pointer;transition:.13s ease}.scale-note-button.root{border-color:#a8bd43;color:#182009;background:var(--accent);box-shadow:0 0 0 4px #dfff4f17,0 3px 9px #00000059}.scale-note-button:hover,.scale-note-button.playing{border-color:#fff;color:#fff;background:#4a8c6d;transform:scale(1.13)}.scale-note-button.root:hover,.scale-note-button.root.playing{color:#172006;background:#efff83}.scale-legend{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 22px;margin-top:13px;color:#7f897e;font-size:9px}.scale-legend span{display:flex;align-items:center;gap:6px}.scale-legend span:last-child{color:#929b8f}.scale-legend i{width:9px;height:9px;border-radius:50%}.scale-root-swatch{background:var(--accent)}.scale-tone-swatch{border:1px solid #6ca689;background:#356b53}.fifths-page{width:min(900px,calc(100% - 60px))}.fifths-intro{margin-bottom:22px}.fifths-card{position:relative;width:min(760px,100%);margin:0 auto;border:1px solid var(--line);border-radius:22px;padding:22px 28px 20px;background:linear-gradient(145deg,rgba(255,255,255,.025),transparent 48%),var(--panel);box-shadow:0 24px 70px #00000040}.fifths-toolbar{min-height:42px;display:grid;grid-template-columns:1fr 170px 190px;align-items:center;gap:20px}.fifths-legend{display:flex;align-items:center;gap:18px;color:#8e988e;font-size:9px}.fifths-legend span{display:flex;align-items:center;gap:6px}.fifths-legend i{width:10px;height:10px;border-radius:50%}.major-key-swatch{border:1px solid #94a93c;background:var(--accent)}.minor-key-swatch{border:1px solid #63ae90;background:#28483b}.fifths-mode-control{display:grid}.fifths-mode-control select{width:100%;height:32px;border:1px solid #4a5245;border-radius:8px;padding:0 28px 0 10px;color:#edf1e9;background:#242924;font:10px SFMono-Regular,Consolas,monospace;cursor:pointer}.fifths-mode-control select:hover,.fifths-mode-control select:focus-visible{border-color:#8ca33a;outline:none}.fifths-volume-control{width:190px;display:grid;grid-template-columns:1fr 38px;align-items:center;column-gap:9px}.fifths-volume-control>span{grid-column:1 / -1;margin-bottom:5px;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.fifths-volume-control input{width:100%}.fifths-volume-control output{color:var(--muted);text-align:right;font:9px SFMono-Regular,Consolas,monospace}.fifths-learning-panel{display:grid;grid-template-columns:118px minmax(320px,1fr) 104px;align-items:center;gap:10px 15px;margin-top:15px;border:1px solid #4a5427;border-radius:13px;padding:13px 15px 10px;background:linear-gradient(100deg,#dfff4f12,#ffffff03)}.fifths-learning-panel[hidden]{display:none}.fifths-learning-summary{display:grid}.fifths-learning-summary>span{color:var(--muted);font-size:7px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.fifths-learning-summary strong{margin-top:4px;color:var(--accent);font:700 15px/1.1 SFMono-Regular,Consolas,monospace}.fifths-learning-summary small{margin-top:4px;color:#8b9589;font-size:8px}.fifths-progression{display:flex;align-items:center;justify-content:flex-start;justify-content:safe center;gap:6px;overflow-x:auto;padding:5px 3px 7px;scrollbar-width:thin}.progression-chord{position:relative;flex:0 0 48px;height:48px;display:grid;place-content:center;gap:2px;border:1px solid #3e463a;border-radius:9px;color:#cbd3c8;background:#252a24;text-align:center;transition:.15s ease}.progression-chord+.progression-chord:before{content:"\203a";position:absolute;right:calc(100% + 1px);top:50%;color:#667064;transform:translateY(-53%)}.progression-chord span{color:#8c9788;font:700 7px/1 SFMono-Regular,Consolas,monospace}.progression-chord strong{font-size:11px;line-height:1}.progression-chord.current{border-color:#dfff4f;color:#172006;background:var(--accent);box-shadow:0 0 0 4px #dfff4f14}.progression-chord.current span{color:#536019}.progression-chord.completed{border-color:#65bd91;color:#eafff3;background:#32654b}.progression-chord.completed span{color:#b8e7d0}.progression-chord.previewing{border-color:#80b9ff;color:#eef7ff;background:#315373;transform:translateY(-2px);box-shadow:0 5px 12px #0000004d}.progression-chord.wrong{border-color:#ff826e;color:#fff;background:#713b35;animation:fifths-wrong-shake .28s ease}@keyframes fifths-wrong-shake{33%{transform:translate(-3px)}66%{transform:translate(3px)}}.fifths-learning-actions{display:flex;justify-content:flex-end;gap:7px}.fifths-learning-actions button{height:36px;border:1px solid #4d5544;color:#d7ded2;background:#2b302a;cursor:pointer;transition:.14s ease}#fifthsReplayProgression{width:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:50%;padding:0}#fifthsReplayProgression svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}#fifthsReplayProgression:hover{border-color:#87983e;color:var(--accent);transform:rotate(-24deg)}#fifthsReplayProgression.playing{animation:chord-repeat-pulse .42s ease}#fifthsNewProgression{min-width:61px;border-radius:9px;padding:0 8px;font-size:7px;font-weight:750;letter-spacing:.05em;text-transform:uppercase}#fifthsNewProgression:hover{border-color:#6c765d;color:#fff;background:#363c34;transform:translateY(-1px)}.fifths-learning-feedback{grid-column:1 / 3;min-height:13px;margin:0;color:var(--muted);font-size:9px;text-align:center}.fifths-learning-feedback.correct{color:#8ff2a7}.fifths-learning-feedback.wrong,.fifths-learning-feedback.error{color:#ff9586}.fifths-volume-stack{width:100%;min-width:0;display:grid;gap:7px}.fifths-input-status{display:none;width:100%;min-width:0;overflow:hidden;border:0;padding:0;color:#818981;background:none;font: 8px SFMono-Regular,Consolas,monospace;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.fifths-card.learning-mode .fifths-input-status{display:block}.fifths-input-status i{display:inline-block;width:5px;height:5px;margin-right:4px;border-radius:50%;background:#727972;vertical-align:1px}.fifths-input-status.active{color:#aeb9a5}.fifths-input-status.active i{background:var(--accent);box-shadow:0 0 6px #dfff4f80}.fifths-input-status.error{color:#d89086}.fifths-input-status.error i{background:var(--danger)}.fifths-input-status.off i{background:#555c55}.fifths-wheel{position:relative;width:min(100%,600px);aspect-ratio:1;height:auto;margin:16px auto 12px;border-radius:50%;background:#171c17;box-shadow:0 18px 42px #0004}.fifths-segments{display:block;width:100%;height:100%;overflow:visible}.circle-key{cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.circle-key path{fill:#262e22;stroke:#46513c;stroke-width:1.5;stroke-linejoin:round;transition:fill .15s ease,stroke .15s ease}.circle-key.minor path{fill:#20332b;stroke:#3e564a}.circle-key text{text-anchor:middle;dominant-baseline:middle;pointer-events:none;user-select:none}.circle-key .circle-label{fill:#e3e9dd;font-size:23px;font-weight:650}.circle-key.minor .circle-label{font-size:19px;fill:#cce6d8}.circle-key .circle-degree{fill:#c0cf9c;font:12px SFMono-Regular,Consolas,monospace}.circle-key.grouped.major path{fill:#46572c}.circle-key.grouped.minor path{fill:#2d5742}.circle-key.related path{stroke:#9bad67;stroke-width:2}.circle-key.active.major path{fill:var(--accent);stroke:#eaff9b;stroke-width:3}.circle-key.active.major text{fill:#243007}.circle-key.active.minor path{fill:#79d7ad;stroke:#bdffe1;stroke-width:3}.circle-key.active.minor text{fill:#102d20}.circle-key:hover path,.circle-key:focus-visible path{stroke:#fff;stroke-width:3;filter:brightness(1.22)}.circle-key:focus-visible .circle-label{text-decoration:underline}.circle-key.practice-current path{fill:#79542c;stroke:#ffd18e;stroke-width:3}.circle-key.practice-current text{fill:#fff0d4}.fifths-card.learning-mode .circle-key:not(.practice-current):not(.active){opacity:.75}.fifths-center{position:absolute;z-index:3;left:50%;top:50%;width:178px;height:178px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #4e5936;border-radius:50%;padding:0;color:inherit;background:radial-gradient(circle at 50% 38%,#262d20,#171a17 72%);font:inherit;box-shadow:0 0 0 8px #141714c7,0 12px 34px #0006;cursor:pointer;transform:translate(-50%,-50%);transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.fifths-center:hover,.fifths-center:focus-visible{border-color:#92a841;outline:none;box-shadow:0 0 0 8px #dfff4f12,0 12px 34px #0006;transform:translate(-50%,-50%) scale(1.025)}.fifths-center.active{border-color:var(--accent);box-shadow:0 0 0 9px #dfff4f1c,0 12px 34px #0006}.fifths-wheel .fifths-center{width:34%;height:34%;box-shadow:none}.fifths-center span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.15em;text-transform:uppercase}.fifths-center strong{margin:5px 0 4px;color:var(--accent);font-size:34px;line-height:1;letter-spacing:-.04em}.fifths-center small{color:#bdc5b9;font:9px SFMono-Regular,Consolas,monospace}.fifths-center em{margin-top:11px;color:#6f796e;font-size:8px;font-style:normal}.fifths-family{display:grid;grid-template-columns:minmax(165px,1fr) minmax(430px,2.4fr);align-items:center;gap:18px;margin-top:15px;border:1px solid #394035;border-radius:13px;padding:13px 15px;background:#ffffff03}.fifths-family-summary{display:grid;min-width:0}.fifths-family-summary>span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.14em;text-transform:uppercase}.fifths-family-summary strong{margin-top:3px;color:#eef2e9;font-size:13px}.fifths-family-summary small{overflow:hidden;margin-top:4px;color:#7f897e;font:8px SFMono-Regular,Consolas,monospace;text-overflow:ellipsis;white-space:nowrap}.fifths-family-chords{display:grid;grid-template-columns:repeat(7,minmax(52px,1fr));gap:6px}.fifths-card.learning-mode .fifths-family{display:none}.family-chord{height:45px;display:grid;place-content:center;gap:2px;border:1px solid #4b553c;border-radius:9px;color:#edf3df;background:#343c29;cursor:pointer;transition:.14s ease}.family-chord span{color:#aebe7e;font:700 7px/1 SFMono-Regular,Consolas,monospace}.family-chord strong{font-size:12px;line-height:1}.family-chord.minor{border-color:#3e5c4c;background:#263b31}.family-chord.minor span{color:#82bfa1}.family-chord.diminished{border-color:#665749;color:#f0dac5;background:#40342b}.family-chord.diminished span{color:#c49d79}.family-chord:hover,.family-chord:focus-visible{border-color:var(--accent);color:#172006;background:var(--accent);outline:none;transform:translateY(-2px);box-shadow:0 5px 12px #00000047}.family-chord:hover span,.family-chord:focus-visible span{color:#536019}.fifths-hint{margin:10px 0 0;color:#747e74;font-size:9px;text-align:center}.fifths-confetti-layer{position:absolute;z-index:30;width:1px;height:1px;left:50%;top:440px;pointer-events:none}.fifths-confetti-layer i{position:absolute;width:7px;height:12px;border-radius:2px;opacity:0}.fifths-confetti-layer.celebrate i{animation:fifths-confetti-burst 1.15s cubic-bezier(.15,.65,.35,1) var(--delay) forwards}@keyframes fifths-confetti-burst{0%{opacity:1;transform:translate(0) rotate(0)}45%{opacity:1}to{opacity:0;transform:translate(var(--x),330px) rotate(var(--rotation))}}.coffee-support{position:fixed;z-index:95;right:20px;bottom:18px;display:block;width:154px;border-radius:12px;filter:drop-shadow(0 7px 14px rgba(0,0,0,.34));transition:transform .16s ease,filter .16s ease}.coffee-support img{display:block;width:100%;height:auto;border-radius:12px}.coffee-support{--cat-size: 116px}.coffee-cat-link{position:absolute;width:var(--cat-size);right:calc((100% - var(--cat-size)) / 2);bottom:calc(100% - 5px)}.coffee-cat-link[hidden]{display:none}.coffee-support .coffee-cat{width:100%;height:auto;border-radius:0}.coffee-cat-link:focus-visible,.coffee-support>a:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:12px}.coffee-cat-link .coffee-cat-bubble{right:0;bottom:calc(100% + 2px);animation:coffee-bubble-blink 20s linear infinite}@keyframes coffee-bubble-blink{0%,96%,to{opacity:1}97%,99%{opacity:0}}@media(prefers-reduced-motion:reduce){.coffee-cat-link .coffee-cat-bubble{animation:none}}.coffee-cat-bubble{position:absolute;right:24px;bottom:calc(100% + var(--cat-size) - 3px);padding:6px 11px;border:1px solid #556142;border-radius:12px 12px 12px 3px;background:#eef2d6;color:#29321e;font:700 12px/1.2 Consolas,monospace;white-space:nowrap;pointer-events:none}.coffee-cat-bubble:after{content:"";position:absolute;bottom:-6px;left:12px;width:9px;height:9px;border-right:1px solid #556142;border-bottom:1px solid #556142;background:#eef2d6;transform:skewY(-20deg) rotate(45deg)}.coffee-support:hover,.coffee-support:focus-visible{transform:translateY(-3px);filter:drop-shadow(0 10px 18px rgba(0,0,0,.44))}.coffee-support:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.coffee-message{position:absolute;z-index:1;right:0;bottom:calc(100% + 10px);width:260px;padding:11px 13px;border:1px solid #454d42;border-radius:10px;background:#20241f;color:#e9eee7;font:11px/1.5 SFMono-Regular,Consolas,monospace;text-align:left;box-shadow:0 10px 28px #0000006b;opacity:0;visibility:hidden;transform:translateY(5px);pointer-events:none;transition:opacity .15s ease,transform .15s ease,visibility .15s ease}.coffee-message:after{content:"";position:absolute;right:22px;top:100%;border:7px solid transparent;border-top-color:#20241f}.coffee-button:hover+.coffee-message,.coffee-button:focus-visible+.coffee-message{opacity:1;visibility:visible;transform:translateY(0)}.strumming-page{width:min(1180px,calc(100% - 60px))}.strumming-intro{margin-bottom:22px}.strumming-card{overflow:hidden;border:1px solid var(--line);border-radius:22px;padding:24px;background:linear-gradient(145deg,rgba(255,255,255,.025),transparent 48%),var(--panel);box-shadow:0 24px 70px #00000040}.strumming-mode-switch{width:max-content;display:flex;gap:5px;margin-bottom:18px;border:1px solid #41483d;border-radius:11px;padding:4px;background:#171a17}.strumming-mode-switch button{height:32px;border:0;border-radius:7px;padding:0 15px;color:#929d90;background:transparent;font-size:9px;font-weight:750;cursor:pointer}.strumming-mode-switch button:hover{color:#eef2eb}.strumming-mode-switch button.active{color:#172006;background:var(--accent)}.strumming-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,440px);align-items:center;gap:18px;padding-bottom:18px}@media(min-width:851px){.strumming-card{padding:20px}.strumming-header{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(280px,340px);align-items:center;gap:20px;padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid var(--line)}.strumming-header .strumming-toolbar{display:contents}.strumming-header .strumming-mode-switch{grid-column:1;margin:0}.strumming-header .strumming-mode-switch button{padding-inline:10px;height:36px}.strumming-header .selected-strumming{grid-column:2;padding-left:16px;border-left:2px solid #dfff4f55}.strumming-header .selected-strumming strong{white-space:normal;overflow-wrap:anywhere;font-size:22px;line-height:1.15}.strumming-header .strumming-playback-controls{grid-column:3;grid-template-columns:110px minmax(0,1fr);gap:12px}.strumming-card .strumming-song-controls{border-top:0;padding-top:0}}.strumming-song-controls[hidden],#strummingLibraryPanel[hidden]{display:none}.strumming-song-controls{display:grid;grid-template-columns:minmax(190px,1fr) 180px auto auto auto auto;align-items:end;gap:10px;margin:0 0 15px;border-top:1px solid rgba(255,255,255,.06);padding-top:14px}.strumming-song-controls>label:not(.strumming-loop-control){display:grid;gap:5px}.strumming-song-controls>label>span{color:#8e998c;font-size:8px;font-weight:750;letter-spacing:.11em;text-transform:uppercase}.strumming-song-controls input[type=text],.strumming-song-controls input[type=number]{width:100%;height:36px;border:1px solid #444c40;border-radius:9px;padding:0 11px;color:#edf1ea;background:#20241f;font:10px SFMono-Regular,Consolas,monospace;outline:none}.strumming-arrow-count-row{display:grid;grid-template-columns:minmax(68px,1fr) auto;gap:6px}.strumming-arrow-count-row button{height:36px;border:1px solid #4b5545;border-radius:9px;padding:0 10px;color:#c9d1c6;background:#252a24;font-size:8px;font-weight:750;cursor:pointer;white-space:nowrap}.strumming-arrow-count-row button:hover{border-color:#82923f;color:#172006;background:var(--accent)}.strumming-song-controls input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #dfff4f14}.strumming-loop-control{min-height:36px;display:flex;align-items:center;gap:7px;color:#abb5a8;font-size:9px;white-space:nowrap}.strumming-song-controls>button{height:36px;border:1px solid #4b5545;border-radius:9px;padding:0 12px;color:#c9d1c6;background:#252a24;font-size:9px;font-weight:750;cursor:pointer;white-space:nowrap}.strumming-song-controls>button:hover{border-color:#82923f;color:#172006;background:var(--accent)}.strumming-song-controls output{grid-column:1 / -1;min-height:13px;color:#8e9a8b;font:9px SFMono-Regular,Consolas,monospace}.strumming-song-controls output.error{color:#ff887a}.strumming-rhythm-builder{grid-column:1 / -1;display:grid;grid-template-columns:auto minmax(150px,200px) auto auto minmax(155px,1fr) 175px;align-items:center;gap:8px;border-top:1px solid rgba(255,255,255,.06);padding-top:12px}.strumming-rhythm-builder>span{color:#8e998c;font-size:8px;font-weight:750;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}.strumming-rhythm-builder select,.strumming-rhythm-builder button{height:34px;border:1px solid #465040;border-radius:8px;padding:0 10px;color:#d5ddd2;background:#222721;font-size:9px;outline:none}.strumming-rhythm-builder button{cursor:pointer;font-weight:750}.strumming-rhythm-builder button:hover{border-color:#82923f;color:#172006;background:var(--accent)}.strumming-rhythm-builder select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #dfff4f14}.strumming-rhythm-builder small{color:#7f897e;font:9px SFMono-Regular,Consolas,monospace;line-height:1.35}.strumming-arrow-action{width:175px;justify-self:end}.strumming-arrow-action:disabled{cursor:default;opacity:.38}.strumming-rhythm-builder button:disabled{cursor:default;opacity:.38;color:#899087;background:#20231f}.strumming-rhythm-builder button:disabled:hover{border-color:#465040;color:#899087;background:#20231f}.strumming-chord-assignment{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 14px;border-top:1px solid rgba(255,255,255,.06);padding-top:14px}.strumming-chord-copy{display:grid;flex:0 1 360px;gap:4px}.strumming-chord-copy>span{color:#aeb8aa;font-size:8px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.strumming-chord-copy small{color:#788277;font-size:9px;line-height:1.45}.strumming-chord-palette{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.strumming-chord-palette button{min-width:39px;height:34px;border:1px solid #454e40;border-radius:9px;padding:0 10px;color:#cbd3c8;background:#252a24;font:700 10px SFMono-Regular,Consolas,monospace;cursor:pointer}.strumming-chord-palette button:hover{border-color:#7d8b43;color:#fff}.strumming-chord-palette button.active{border-color:var(--accent);color:#172006;background:var(--accent);box-shadow:0 0 0 3px #dfff4f17}.strumming-chord-palette button:disabled{cursor:default;opacity:.38;filter:grayscale(.4)}.strumming-chord-palette button.clear{min-width:53px}.selected-strumming{min-width:0;display:grid}.selected-strumming>span,.strumming-tempo-control>span,.strumming-volume-control>span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.selected-strumming strong{overflow:hidden;margin-top:5px;color:#f4f6f1;font-size:24px;line-height:1.05;text-overflow:ellipsis;white-space:nowrap}.selected-strumming small{margin-top:7px;color:#93a08f;font:9px SFMono-Regular,Consolas,monospace}.strumming-tempo-control,.strumming-volume-control{display:grid;grid-template-columns:1fr 54px;align-items:center;gap:7px 9px}.strumming-tempo-control>span,.strumming-volume-control>span{grid-column:1 / -1}.strumming-tempo-control input[type=range],.strumming-volume-control input{width:100%}.strumming-tempo-control output,.strumming-volume-control output{color:#a8b1a5;font:9px SFMono-Regular,Consolas,monospace;text-align:right}.strumming-playback-controls{display:grid;grid-template-columns:minmax(100px,140px) minmax(0,1fr);gap:16px;align-items:center;min-width:0}.strumming-playback-controls>.strumming-play-button{grid-column:1;grid-row:1;height:44px;padding:0 8px}.strumming-slider-stack{grid-column:2;display:grid;gap:10px;min-width:0}.strumming-slider-stack>:is(.strumming-tempo-control,.strumming-volume-control){grid-column:1;grid-row:auto;grid-template-columns:minmax(0,1fr) 32px;grid-template-rows:auto 22px;gap:2px 8px;min-width:0}.strumming-slider-stack input[type=range]{height:22px;min-width:0;margin:0}.strumming-play-button{height:41px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #829638;border-radius:10px;color:#172006;background:var(--accent);font-size:9px;font-weight:800;cursor:pointer}.strumming-play-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.strumming-play-button:disabled{cursor:default;opacity:.42;filter:grayscale(.3);transform:none}.strumming-play-button.playing{color:#efffc1;background:#536026}.strumming-play-button svg{width:16px;height:16px;fill:currentColor}.strumming-stage{overflow-x:auto;border:1px solid #3b4238;border-radius:15px;padding:22px 18px 17px;background:radial-gradient(circle at 50% 0,rgba(223,255,79,.055),transparent 55%),#171a16;scrollbar-color:#535b3b #20241e;scrollbar-width:thin}.strumming-stage.song-layout{overflow-x:hidden}.strumming-song-pages[hidden]{display:none}.strumming-song-pages{position:sticky;z-index:4;left:0;width:max-content;display:flex;align-items:center;gap:8px;margin:-8px auto 14px;border:1px solid #3f483b;border-radius:9px;padding:4px;background:#181c17f5}.strumming-song-pages button{width:31px;height:27px;border:0;border-radius:6px;color:#dce4d9;background:#2c322a;font-size:18px;cursor:pointer}.strumming-song-pages button:hover:not(:disabled){color:#172006;background:var(--accent)}.strumming-song-pages button:disabled{cursor:default;opacity:.3}.strumming-song-pages output{min-width:210px;color:#a7b1a3;font:9px SFMono-Regular,Consolas,monospace;text-align:center}.strumming-counts,.strumming-strokes{min-width:700px;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(42px,1fr);gap:5px}.strumming-counts[hidden]{display:none}.strumming-counts span{color:#7f897e;font:8px SFMono-Regular,Consolas,monospace;text-align:center}.strumming-strokes{margin-top:8px}.strumming-stage.song-layout .strumming-strokes{min-width:0;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));grid-auto-flow:row;grid-auto-columns:auto;gap:8px 5px;margin-top:0}.strumming-stroke{position:relative;height:66px;display:grid;place-content:center;gap:3px;border:1px solid #424a3e;border-radius:10px;padding:0;color:#ecf0e9;background:#242924;font:700 27px/1 SFMono-Regular,Consolas,monospace;transition:.1s ease}.strumming-step-label{position:absolute;top:5px;left:0;width:100%;overflow:hidden;color:#7f897e;font:8px/1 SFMono-Regular,Consolas,monospace;text-align:center;text-overflow:ellipsis;white-space:nowrap}button.strumming-stroke{cursor:pointer}button.strumming-stroke:hover{border-color:#7e8c46;background:#2c3328}.strumming-stroke.selected{border-color:#b8ce57;box-shadow:0 0 0 3px #dfff4f1f}.strumming-stroke.selected:after{content:"";position:absolute;width:5px;height:5px;right:6px;top:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 7px #dfff4fb3}.strumming-stroke .strumming-arrow{display:block;line-height:1}.strumming-assignment-labels{min-height:10px;display:flex;align-items:center;justify-content:center;gap:4px}.strumming-stroke strong{color:var(--accent);font:800 10px/1 SFMono-Regular,Consolas,monospace;letter-spacing:.02em}.strumming-stroke.has-chord{border-color:#68763a;background:linear-gradient(180deg,rgba(223,255,79,.08),transparent),#282d27}.strumming-stroke.has-instrument{border-color:#6f6243;background:linear-gradient(180deg,rgba(226,184,95,.1),transparent),#2c2923}.strumming-stroke.has-chord .strumming-arrow,.strumming-stroke.has-instrument .strumming-arrow{font-size:21px}.strumming-stroke .strumming-instrument-name{color:#e2b85f;font-size:8px}.strumming-stroke:nth-child(odd){background:#282d27}.strumming-stroke.has-chord.has-instrument{border-color:#9a8b42;background:linear-gradient(135deg,#dfff4f1a,#e2b85f1c),#2b2d24}.strumming-stroke.rhythm-group{box-shadow:inset 0 -3px #81993dc7}.strumming-stroke.rhythm-group-start{border-left-color:var(--accent)}.strumming-stroke.rhythm-group-end{border-right-color:var(--accent)}.strumming-stroke.rest{border-style:dashed;color:#626b61;background:#1e221e}.strumming-stroke.muted{color:#d8c7a1;background:#302d26}.strumming-stroke.ghost{color:#849082;opacity:.72}.strumming-stroke.accent:before{content:"\203a";position:absolute;top:2px;left:7px;color:var(--accent);font-size:15px;transform:rotate(90deg)}.strumming-stroke.active{z-index:2;border-color:var(--accent);color:#172006;background:var(--accent);box-shadow:0 0 0 5px #dfff4f1a,0 8px 18px #00000059;transform:translateY(-3px)}.strumming-stroke.active:before{color:#354207}.strumming-stroke.active strong{color:#172006}.strumming-stroke.active .strumming-step-label{color:#354207}.strumming-stage p{margin:15px 0 0;color:#909b8e;font-size:10px;text-align:center}.strumming-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:11px 24px;padding:14px 0;color:#7f897e;font-size:9px}.strumming-legend button{min-height:30px;display:flex;align-items:center;gap:6px;border:1px solid transparent;border-radius:8px;padding:4px 9px;color:#879186;background:transparent;font-size:9px;cursor:pointer}.strumming-legend button:hover:not(:disabled){border-color:#59634d;color:#e8eee5;background:#242924}.strumming-legend button.active{border-color:#7d8b43;color:#172006;background:var(--accent)}.strumming-legend button:disabled{cursor:default;opacity:.42}.strumming-legend b{min-width:12px;color:#d9dfd5;font:700 15px/1 SFMono-Regular,Consolas,monospace;text-align:center}.strumming-legend button.active b{color:inherit}.strumming-instrument-editor{display:flex;align-items:center;justify-content:center;gap:15px;border-top:1px solid rgba(255,255,255,.06);padding:13px 0 15px}.strumming-instrument-editor>span{color:#7f897e;font-size:8px;font-weight:750;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}.strumming-instrument-palette{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.strumming-instrument-palette button{min-height:32px;display:flex;align-items:center;gap:6px;border:1px solid #454e40;border-radius:8px;padding:4px 10px;color:#aeb7aa;background:#242824;font-size:9px;cursor:pointer}.strumming-instrument-palette button b{min-width:12px;color:#e2b85f;font-size:13px;text-align:center}.strumming-instrument-palette button:hover:not(:disabled){border-color:#8b7647;color:#fff}.strumming-instrument-palette button.active{border-color:#e2b85f;color:#211b0f;background:#e2b85f;box-shadow:0 0 0 3px #e2b85f17}.strumming-instrument-palette button.active b{color:inherit}.strumming-instrument-palette button:disabled{cursor:default;opacity:.38}.strumming-category-tabs{display:flex;flex-wrap:wrap;gap:7px;border-top:1px solid rgba(255,255,255,.06);padding-top:15px}.strumming-category-tabs button{height:34px;border:1px solid #444c40;border-radius:999px;padding:0 14px;color:#aeb7aa;background:#242824;font-size:8px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}.strumming-category-tabs button:hover{border-color:#778345;color:#fff}.strumming-category-tabs button.active{border-color:#899d36;color:#172006;background:var(--accent)}.strumming-library{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:13px}.strumming-library button{min-width:0;min-height:86px;display:grid;align-content:center;gap:5px;border:1px solid #3e453b;border-radius:11px;padding:13px;color:#d6ddd3;background:#222622;text-align:left;cursor:pointer;transition:.14s ease}.strumming-library button:hover{border-color:#69763c;background:#2b3127;transform:translateY(-1px)}.strumming-library button.active{border-color:#91a33d;background:#dfff4f1a;box-shadow:inset 3px 0 var(--accent)}.strumming-library button>span{color:#859080;font:8px SFMono-Regular,Consolas,monospace;text-transform:uppercase}.strumming-library button strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.strumming-library button small{overflow:hidden;color:#aeb9aa;font:11px SFMono-Regular,Consolas,monospace;letter-spacing:.06em;text-overflow:ellipsis;white-space:nowrap}.site-footer{min-height:72px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;border-top:1px solid rgba(255,255,255,.07);padding:16px 24px;color:#7f887f;background:#0d0f0db8}.footer-brand{display:grid;gap:3px}.footer-brand strong{color:#dfe5dc;font-size:13px}.footer-brand span,.site-footer p{margin:0;font-size:10px}.footer-brand small{margin-top:3px;color:#626b62;font-size:9px}.site-footer nav{display:flex;align-items:center;justify-content:center;gap:24px}.site-footer a,.site-footer #pwaInstall{color:#aeb7aa;font-size:11px;font-weight:650;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}.site-footer #pwaInstall{padding:0;border:0;background:none;cursor:pointer}.site-footer #pwaInstall[hidden]{display:none}.site-footer a:hover,.site-footer #pwaInstall:hover{color:var(--accent)}.site-footer a:focus-visible,.site-footer #pwaInstall:focus-visible{color:var(--accent);outline:2px solid var(--accent);outline-offset:4px}.site-footer .footer-copyright{margin:0;padding:0;color:#8f998f;font-size:10px;line-height:1.5;text-align:center}.pedals-panel,.pedals-monitor{border:1px solid var(--line);border-radius:24px;padding:30px;background:var(--panel);margin-bottom:24px;text-align:left}.pedals-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin:8px 0 20px}.pedals-heading h2,.pedals-monitor h2{margin:6px 0;font-size:clamp(22px,3vw,30px);letter-spacing:-.03em;color:#edf1ea}.pedals-page button:not(.effect-pedal){min-height:44px;border:1px solid var(--line);padding:10px 16px;border-radius:10px;background:#252e22;color:var(--accent);cursor:pointer}.pedals-page button:disabled{opacity:.45;cursor:not-allowed}.pedal-settings-file{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin-bottom:12px}.pedal-settings-file label{display:grid;gap:8px;flex:1 1 200px;min-width:0;font-size:12px;color:#b9c1b9}.pedal-settings-file input[type=text]{width:100%;min-width:0;box-sizing:border-box;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;color:var(--text);background:var(--panel)}.pedals-page :is(button,input,select):focus-visible{outline:2px solid var(--accent);outline-offset:4px}.pedal-eq{display:grid;grid-template-columns:46px repeat(6,minmax(0,1fr));gap:12px;padding:24px 20px;background:radial-gradient(ellipse at 50% 0,#ffffff08,transparent 70%),linear-gradient(145deg,#272e25,#191f17);border:1px solid #434d3b;border-radius:14px;box-shadow:inset 0 1px #ffffff0c,0 8px 22px #0003;margin-bottom:22px}.pedal-control{display:flex;flex-direction:column;gap:14px;min-width:0;color:#c5cdbd;font-size:12px}.pedal-control input{width:100%;min-width:0;accent-color:var(--accent);cursor:pointer}.pedal-control output{color:var(--accent);font:12px monospace}.pedal-eq .pedal-control{align-items:center;gap:12px;font:11px monospace;text-align:center}.pedal-eq .pedal-control output{font:11px monospace;line-height:16px;min-height:16px;color:#d5e5b8;white-space:nowrap}.eq-fader{display:flex;justify-content:center;position:relative;width:100%;height:200px}.eq-fader:before{content:"";position:absolute;inset:12px 0 11px;background:repeating-linear-gradient(to bottom,#919d7938 0 1px,transparent 1px 44px);pointer-events:none}.eq-fader:after{content:"";position:absolute;top:100px;left:0;right:0;height:1px;background:#c4e69455;pointer-events:none}.pedal-eq input{position:relative;z-index:1;writing-mode:vertical-lr;direction:rtl;appearance:none;-webkit-appearance:none;width:min(44px,100%);height:200px;margin:0;background:transparent;touch-action:none}.pedal-eq input::-webkit-slider-runnable-track{width:8px;height:100%;border-radius:6px;background:#10160e;border:1px solid #10140d;box-shadow:inset 2px 1px 3px #000b,1px 0 #ffffff13}.pedal-eq input::-moz-range-track{width:8px;height:100%;border-radius:6px;background:#10160e;border:1px solid #10140d;box-shadow:inset 2px 1px 3px #000b,1px 0 #ffffff13}.pedal-eq input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin-left:-9px;border:1px solid #9fae8e;border-radius:50%;background:radial-gradient(circle at 50% 50%,#d6ff45 0 3px,#728e3c 3px 4px,transparent 5px),radial-gradient(circle at 35% 25%,#cbd5bf,#7b8970 55%,#394a2d);box-shadow:0 3px 5px #0009,inset 0 1px 1px #ffffff70,0 0 8px #c8ed4520}.pedal-eq input::-moz-range-thumb{width:22px;height:22px;border:1px solid #9fae8e;border-radius:50%;background:radial-gradient(circle at 50% 50%,#d6ff45 0 3px,#728e3c 3px 4px,transparent 5px),radial-gradient(circle at 35% 25%,#cbd5bf,#7b8970 55%,#394a2d);box-shadow:0 3px 5px #0009,inset 0 1px 1px #ffffff70,0 0 8px #c8ed4520}.eq-db-scale{display:flex;flex-direction:column;justify-content:space-between;height:200px;margin-top:28px;padding:5px 0;color:#a8b39b;font:10px/14px monospace;white-space:nowrap;text-align:right}.eq-db-scale span:nth-child(3){color:#d4e9b2}.pedal-effects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0 38px}.pedal-module{min-width:0;padding:18px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#252b23,#161c16);box-shadow:inset 0 1px #ffffff0a}.pedal-module header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.pedal-module h3{margin:0;font-size:14px;letter-spacing:.06em;color:#e0e8d9}.pedal-module-controls{display:flex;flex-wrap:wrap;justify-content:space-evenly;gap:22px 12px}.pedal-module-controls>.pedal-control{align-items:center;flex:1 1 84px;text-align:center}.pedal-module-controls>.pedal-eq{width:100%;margin:0}.pedal-module.is-bypassed .pedal-module-controls{opacity:.5}.pedal-amp{padding:24px;margin:24px 0;border:2px solid #46513e;border-radius:18px;background:repeating-linear-gradient(0deg,#ffffff02 0 1px,transparent 1px 4px),linear-gradient(125deg,#262d22,#11170f);box-shadow:inset 0 0 0 5px #11160f,0 8px 18px #0004}.pedal-amp .pedal-module-controls{margin:28px 0}.pedal-cabinet{display:flex;flex-wrap:wrap;align-items:center;gap:12px;color:#bec8b4;font-size:13px}.pedal-cabinet select{width:min(100%,260px)}.pedal-bank-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.pedal-jump-links{justify-content:center}.pedals-page .pedal-bank-buttons button[aria-pressed=true]{background:var(--accent);color:#172006;border-color:var(--accent)}#pedalEngaged{font:12px monospace;color:var(--accent)}.pedal-effects{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}.pedal-module.stompbox{position:relative;display:flex;flex-direction:column;padding:24px 16px 18px;min-height:350px;border:2px solid #73806a;border-radius:14px 14px 20px 20px;background:radial-gradient(circle at 12px 12px,#182016 0 2px,#8b9583 3px 5px,transparent 6px),radial-gradient(circle at calc(100% - 12px) 12px,#182016 0 2px,#8b9583 3px 5px,transparent 6px),linear-gradient(130deg,#ffffff16,transparent 60%),var(--stomp-color);box-shadow:inset 0 1px 2px #ffffff30,0 8px #0b100a,0 12px 20px #0005}.pedal-module.stompbox[hidden]{display:none}.stompbox h3{font-size:18px;text-align:center;width:100%;text-transform:uppercase;letter-spacing:.04em}.stompbox header{margin:8px 0 24px}.stompbox .pedal-module-controls{display:grid;grid-template-columns:repeat(var(--knob-columns,3),minmax(0,1fr));flex:1;align-content:start;padding-bottom:20px}.stompbox .pedal-control{flex-basis:70px}.stompbox .pedal-dial{width:64px;height:64px;background:conic-gradient(from 225deg,#9ba98c 0deg,var(--accent) 270deg,transparent 270deg)}.pedals-page button.pedal-toggle.stomp-switch{align-self:center;flex-direction:column;gap:10px;min-width:76px;padding:8px 12px;border:0;background:transparent}.pedal-toggle.stomp-switch:before{width:9px;height:9px;border-radius:50%;border:1px solid #737e65;background:#17200e}.pedal-toggle.stomp-switch[aria-checked=true]:before{background:var(--accent);box-shadow:0 0 12px var(--accent)}.stomp-switch i{display:block;width:38px;height:38px;border-radius:50%;border:4px solid #a7afa0;background:radial-gradient(circle at 35% 25%,#d1d6cd,#737c6a 55%,#333e2b);box-shadow:0 4px #141c0f,0 6px 9px #0008,inset 0 0 0 2px #535e47}.stomp-switch:active i{transform:translateY(2px);box-shadow:0 2px #141c0f}.stompbox.is-bypassed .pedal-module-controls{opacity:.75}.pedal-loop-track{display:grid;grid-template-columns:64px minmax(0,1fr) 290px;gap:12px;align-items:center;padding:12px;margin-top:8px;border:1px solid #414c38;border-radius:12px;background:#131b11}.pedal-loop-track h3{color:var(--accent);font:700 21px monospace;margin:0 0 6px}.loop-track-identity .pedal-caption{display:block;font:10px/1.5 monospace}.pedal-loop-track canvas{display:block;min-width:0;width:100%;height:64px;border:1px solid #303d28;background:linear-gradient(#cfe3a405 1px,transparent 1px) 0 0/100% 16px,#0c130a;border-radius:7px}.loop-track-tools{min-width:0}.loop-waveform{position:relative;min-width:0}.loop-record-cursor{position:absolute;top:0;left:clamp(0px,var(--record-position, 0%),calc(100% - 2px));height:64px;width:2px;background:var(--accent);pointer-events:none}.loop-record-position{display:grid;grid-template-columns:1fr auto;gap:2px 8px;margin-top:6px;color:#b4c1a6;font:10px monospace}.loop-record-position input{grid-column:1 / -1;width:100%;min-width:0;height:28px;margin:0;accent-color:var(--accent)}.loop-track-tools .pedal-bank-buttons{margin:0 0 8px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:5px}#pedalLooper .pedal-bank-buttons button{padding:8px 10px;font-size:11px}.loop-track-mix{display:flex;align-items:center;gap:10px;color:#abb99b;font:10px monospace}.loop-track-mix input{width:100%;min-width:0;accent-color:var(--accent);height:22px;margin:0}.loop-track-mix output{min-width:30px;text-align:right}.pedal-loop-track.is-recording{border-color:#d98f65}#pedalLooper .is-recording .loop-record{background:#653429;color:#ffdec4;border-color:#d98f65}.loop-track-editor{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:end;gap:12px 20px;padding-top:12px;border-top:1px solid #37432e}.loop-track-editor[hidden]{display:none}.loop-track-editor .pedal-bank-buttons,.loop-track-editor .pedal-loop-trim{margin:0}#pedalLooper .pedals-heading{margin:0 0 8px;gap:12px}#pedalLooper h2{font-size:clamp(20px,3vw,26px)}#pedalLooper .loop-quick-help{margin:0 0 12px;font-size:11px}#pedalLoopTime{padding:9px 12px;background:#0d1609;border:1px solid #3c4c2e;border-radius:8px}.loop-help{color:#aebda0;font-size:12px;line-height:1.7}.loop-help summary{cursor:pointer;padding-block:10px;min-height:44px}.loop-help p{margin:0 0 8px}@media(max-width:850px){.pedal-loop-track{grid-template-columns:44px minmax(0,1fr);gap:10px}.loop-track-tools{grid-column:1 / -1}.loop-track-tools .pedal-bank-buttons{grid-template-columns:1.5fr 1fr 1fr 1fr}#pedalLooper .loop-transport{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}#pedalLooper .pedal-bank-buttons button{padding-inline:6px}}.pedal-loop-trim{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin:12px 0}.pedal-loop-trim label{display:grid;gap:6px;color:#b4c1a6;font-size:12px}.pedal-loop-trim input{width:100px;min-height:44px;color:var(--text);background:#10170e;border:1px solid var(--line);padding:8px;border-radius:6px}#pedalLoopTime{color:var(--accent);font:20px monospace}#pedalLoopStatus{color:#bdc9b0;font-size:13px;line-height:1.6}@media(max-width:1000px){.pedal-effects{grid-template-columns:repeat(2,minmax(0,1fr))}}.pedals-page .pedal-toggle{display:inline-flex;align-items:center;gap:9px;padding:4px 8px;background:transparent;border:0;color:#aab4a2;font:11px monospace}.pedal-toggle:before{content:"";width:34px;height:20px;border:1px solid #67705e;border-radius:12px;background:radial-gradient(circle at 9px 50%,#a0a999 6px,transparent 7px),#10150f}.pedals-page .pedal-toggle[aria-checked=true]{color:var(--accent)}.pedal-toggle[aria-checked=true]:before{background:radial-gradient(circle at 25px 50%,var(--accent) 6px,transparent 7px),#414d22;border-color:#829539;box-shadow:0 0 12px #d6ff4515}.pedal-dial{--rotation: 0deg;display:block;position:relative;width:80px;height:80px;border-radius:50%;background:conic-gradient(from 225deg,#65773d 0deg,var(--accent) 270deg,transparent 270deg);padding:6px;box-shadow:0 4px 12px #0006}.pedal-dial-face{display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 35% 25%,#515a4b,#252c23 62%);border:3px solid #171c16;box-shadow:inset 0 1px 2px #ffffff35;transform:rotate(var(--rotation))}.pedal-dial-face:after{content:"";position:absolute;left:calc(50% - 2px);top:7px;width:4px;height:17px;background:var(--accent);border-radius:3px;box-shadow:0 0 7px #d6ff4540}.pedal-dial input{position:absolute;inset:0;width:100%;height:100%;opacity:0;touch-action:none;cursor:ns-resize}.pedal-dial:focus-within{outline:2px solid var(--accent);outline-offset:5px}.pedal-caption,.pedal-warning,#pedalStatus{font-size:13px;line-height:1.7;color:#b4beac}#pedalPresetName{color:var(--accent);font-size:13px}.pedal-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}.effect-pedal{--pedal-color: #344744;position:relative;display:flex;flex-direction:column;align-items:center;gap:15px;min-width:0;min-height:290px;padding:28px 20px 24px;color:#f5f5e8;border:2px solid #63716a;border-radius:10px 10px 15px 15px;background:radial-gradient(circle at 10px 10px,#222821 0 2px,#8a9285 3px 4px,transparent 5px),radial-gradient(circle at calc(100% - 10px) 10px,#222821 0 2px,#8a9285 3px 4px,transparent 5px),linear-gradient(155deg,#ffffff13,transparent 55%),var(--pedal-color);box-shadow:0 7px #0d110d,0 10px 18px #0005,inset 0 1px #ffffff25;cursor:pointer;text-align:center}.effect-pedal:after{content:"";position:absolute;bottom:15px;left:18px;right:18px;height:62px;border:1px solid #ffffff13;border-radius:5px;background:repeating-linear-gradient(0deg,#10150d 0 2px,#1c2219 2px 4px);pointer-events:none}.effect-pedal strong{font-size:18px;text-transform:uppercase;letter-spacing:.04em}.preset-description{font-size:12px;line-height:1.5;color:#e2e7db;flex:1}.pedal-knobs{display:flex;gap:18px;margin-bottom:4px}.pedal-knobs i{position:relative;width:25px;height:25px;border-radius:50%;border:2px solid #161c14;background:radial-gradient(circle at 35% 25%,#62695c,#22291f 65%);box-shadow:0 3px 4px #0007;transform:rotate(var(--preset-angle))}.pedal-knobs i:after{content:"";position:absolute;top:2px;left:9px;width:3px;height:8px;border-radius:2px;background:#dce3d4}.preset-state{display:flex;align-items:center;gap:7px;color:#c3cbbb;font:10px monospace;text-transform:uppercase}.preset-state:before{content:"";width:7px;height:7px;border-radius:50%;border:1px solid #939e87;background:#21291b}.pedal-stomp{z-index:1;width:38px;height:38px;margin-top:7px;border:4px solid #aeb5ab;border-radius:50%;background:radial-gradient(circle at 35% 25%,#e0e4da,#848d79 55%,#38422e);box-shadow:0 4px #101410,inset 0 0 0 2px #626c57}.effect-pedal[aria-pressed=true]{border-color:var(--accent);box-shadow:0 7px #0d110d,0 0 0 2px #d6ff4533}.effect-pedal[aria-pressed=true] .preset-state{color:var(--accent)}.effect-pedal[aria-pressed=true] .preset-state:before{background:var(--accent);box-shadow:0 0 10px #d6ff4599}.effect-pedal:active .pedal-stomp{transform:translateY(2px)}.pedal-funk{--pedal-color: #45502c}.pedal-blues{--pedal-color: #284856}.pedal-crunch{--pedal-color: #63492d}.pedal-metal{--pedal-color: #333941}.pedal-fuzz{--pedal-color: #623b45}.pedal-chorus{--pedal-color: #3b4d64}.pedal-country{--pedal-color: #65552b}.pedal-ambient{--pedal-color: #4c3d60}.pedals-monitor{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.8fr);gap:0 24px;padding:22px 24px;background:linear-gradient(135deg,#232b1f,#171e14)}.pedal-monitor-heading{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:12px}.pedal-monitor-heading h2{font-size:clamp(20px,3vw,26px);margin:0}.pedal-monitor-heading>span{font:10px monospace;color:#c1d5ac;border:1px solid #49573b;border-radius:20px;padding:6px 9px;white-space:nowrap}.pedal-warning{grid-column:1 / -1;border-left:2px solid #e3bb6b;padding-left:10px;margin:12px 0 4px;color:#e3cfab;font-size:12px;line-height:1.6}.pedal-headphones{grid-column:1 / -1;display:flex;align-items:center;gap:10px;margin:2px 0 10px;min-height:44px;font-size:12px;line-height:1.5;color:#d8dfd0;cursor:pointer}.pedal-headphones input{flex-shrink:0;width:20px;height:20px;accent-color:var(--accent)}.pedal-monitor-controls{grid-column:1 / -1;display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px}.pedal-monitor-controls label{display:flex;flex-direction:column;gap:8px;min-width:0;color:#bbc6b3;font-size:11px}.pedal-output-control>span{display:flex;justify-content:space-between;gap:8px}.pedal-output-control output{color:var(--accent);font-family:monospace}.pedal-output-control input{height:44px;margin:0}.pedal-monitor-controls select{width:100%;min-width:0;min-height:44px;background:#171d16;color:#edf1ea;border:1px solid var(--line);border-radius:10px;padding:10px}.pedal-monitor-controls input{width:100%;accent-color:var(--accent)}.pedal-monitor-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.pedals-monitor .pedal-monitor-actions button{padding:9px 12px;font-size:12px}.pedals-page #pedalStart{background:var(--accent);color:#172006;font-weight:700}.pedals-monitor #pedalStatus{grid-column:1 / -1;grid-row:6;margin:10px 0 2px;font-size:12px;line-height:1.6;overflow-wrap:anywhere}.pedal-level{grid-column:2;grid-row:5;display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px;font:10px monospace;color:#bbc6b3}.pedal-level meter{flex:1;min-width:100px;height:22px}.pedal-audio-help{grid-column:1 / -1;color:#aebda0;font-size:12px;line-height:1.7}.pedal-audio-help summary{cursor:pointer;min-height:44px;padding-block:10px}.pedal-audio-help p{margin:0}@media(max-width:650px){.pedals-panel,.pedals-monitor{padding:20px 16px}.pedal-eq{grid-template-columns:34px repeat(6,minmax(0,1fr));gap:3px;padding:20px 6px}.pedal-eq .pedal-control,.pedal-eq .pedal-control output{font-size:9px}.eq-db-scale{font-size:8px}.pedal-effects{grid-template-columns:1fr;gap:16px}.pedal-module{padding:14px 10px}.pedal-module-controls{gap:18px 6px}.pedal-module-controls>.pedal-control{flex-basis:70px;font-size:11px}.pedal-dial{width:68px;height:68px}.pedal-amp{padding:20px 12px}.pedal-bank-buttons{gap:6px}.pedal-bank-buttons button{flex:1 1 auto;font-size:11px}.pedal-module.stompbox{padding-inline:14px}.pedal-presets{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.effect-pedal{padding:24px 10px}.pedal-knobs{gap:8px}.effect-pedal strong{font-size:15px}.pedal-monitor-controls{grid-template-columns:1fr 1fr}.pedal-monitor-controls label:first-child{grid-column:1 / -1}.pedals-monitor{grid-template-columns:minmax(0,1fr)}.pedals-monitor .pedal-monitor-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.pedals-monitor .pedal-monitor-actions button{padding:8px 5px;font-size:11px}.pedals-monitor #pedalStatus{grid-row:auto}.pedal-level{grid-column:1;grid-row:auto;margin-top:10px}}#progressPage .section-heading{margin-bottom:20px}#progressPage .section-heading h1{font-size:clamp(27px,4vw,40px);margin:8px 0}#progressPage .section-heading>p:last-child{font-size:13px}.practice-progress{--pixel-edge: #56633e;width:100%;padding:20px;box-sizing:border-box;text-align:left;border:2px solid #4d593d;border-radius:4px;background:linear-gradient(#ffffff02 1px,transparent 1px) 0 0 / 100% 4px,var(--panel);box-shadow:4px 4px #0b100b,inset 0 0 0 3px #121912}.practice-progress p{color:#b9c6ac;font-size:12px;line-height:1.6}.practice-progress :is(button,a,summary):focus-visible{outline:2px solid var(--accent);outline-offset:4px}.practice-profile{display:grid;grid-template-columns:90px minmax(0,1fr);gap:22px;align-items:center;padding:16px 20px;border:2px solid #8d9e55;border-radius:2px;background:linear-gradient(110deg,#354126,#1b2319 70%);box-shadow:inset 0 0 0 3px #172012,3px 3px #0a1008}.profile-emblem{display:grid;justify-items:center;gap:6px}.rank-badge{display:block;width:100%;max-width:76px;shape-rendering:crispEdges}.rank-shield{fill:#172117;stroke:var(--rank-color);stroke-width:1}.rank-shield-inset{fill:#263229;stroke:#070d08;stroke-width:1}.rank-symbol{fill:var(--rank-color);stroke:#0b170e;stroke-width:.6}.profile-emblem>span{color:#172006;background:var(--accent);border:2px solid #111a0b;padding:3px 9px;font:800 11px monospace;box-shadow:2px 2px #091006}.practice-progress .profile-kicker{margin:0 0 6px;color:#bdcda0;font:9px monospace;letter-spacing:.09em}.profile-identity h2{color:#e8f2da;font:900 clamp(23px,3vw,32px)/1.15 Consolas,monospace;text-transform:uppercase;letter-spacing:-.04em;margin:0;text-shadow:2px 2px #090f07}.profile-identity>p{margin:5px 0 12px;font-size:11px}.profile-xp{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px}.profile-xp strong{color:var(--accent);font:900 18px monospace}.profile-xp span{color:#bdcda8;font:10px monospace}.profile-meter{position:relative;height:16px;padding:2px;border:2px solid #0a1008;outline:1px solid #84905a;background:#10190e;overflow:hidden;box-sizing:border-box}.profile-meter:after{content:"";position:absolute;inset:2px;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 12px,#10190e 12px 15px)}.profile-meter i{display:block;height:100%;background:linear-gradient(#eaff8c 0 35%,#bddb41 35% 70%,#7eaa30 70%)}.practice-progress #practiceProgressStatus{color:#aabc91;margin:10px 0 3px;font:10px/1.5 monospace}.practice-progress .profile-disclaimer{margin:0;font-size:10px;color:#9ca98f}.profile-section{margin-top:20px}.profile-section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}.profile-section-heading h2{color:#d9e6c6;font:800 14px monospace;text-transform:uppercase;letter-spacing:.06em;margin:0}.profile-section-heading h2:before{content:"\25b8  ";color:var(--accent)}.profile-section-heading>span{color:#97a487;font-size:10px}.practice-missions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.practice-mission{display:flex;flex-direction:column;gap:7px;padding:12px;border:2px solid #45533b;border-radius:2px;box-shadow:2px 2px #0b120a;color:inherit;background:#202a1d;text-decoration:none}.practice-mission:first-child{border-color:#b6ca69;background:#303c23}.practice-mission h3{margin:0;color:#e8efd9;font:700 14px/1.3 monospace}.practice-mission p{margin:0;flex:1;font-size:11px;line-height:1.55}.practice-mission small{color:#b1c399;font:9px/1.5 monospace}.practice-mission>strong{align-self:start;display:inline-block;margin-top:3px;padding:8px 10px;border:2px solid #0f1a0a;color:#18220d;background:#c4dc70;box-shadow:2px 2px #0c1408;font:800 10px monospace;text-transform:uppercase}.practice-mission:hover{border-color:var(--accent)}.practice-mission:hover>strong{background:var(--accent)}.practice-progress-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.practice-progress-grid a{min-width:0;display:grid;gap:7px;align-content:start;padding:12px;border:1px solid #4c5b40;border-top:3px solid #8fbd8e;background:#162015;color:#d4e4c1;text-decoration:none}.practice-progress-grid a:nth-child(2){border-top-color:#80c4ce}.practice-progress-grid a:nth-child(3){border-top-color:#dcb779}.practice-progress-grid a:nth-child(4){border-top-color:#b79bdc}.practice-progress-grid strong{font:700 11px monospace;text-transform:uppercase}.practice-progress-grid span{font-size:11px;color:#b2bfa5;line-height:1.5;overflow-wrap:anywhere}.practice-rank-path{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px;list-style:none;margin:0;padding:0}.practice-rank-path li{display:grid;justify-items:center;align-content:start;gap:5px;padding:10px 5px;border:1px solid #3c4a34;background:#172015;text-align:center}.practice-rank-path .rank-badge{width:38px;margin-bottom:2px}.practice-rank-path .locked .rank-badge{opacity:.65;filter:saturate(.25)}.practice-rank-path .current{border-color:var(--accent);box-shadow:inset 0 -3px var(--accent);background:#2b361e}.practice-rank-path strong{font:700 10px/1.4 monospace;color:#dfeacf}.practice-rank-path span{color:#a8b69b;font:9px monospace}.practice-rank-path small{color:#a8b69b;font-size:9px;line-height:1.4}.profile-guide,.profile-scoring{margin-top:14px;border:1px solid #4b593c;background:#162014}.profile-guide>summary,.profile-scoring>summary{padding:13px 14px;cursor:pointer;color:#cfdcba;font:700 11px/1.4 monospace;text-transform:uppercase}.profile-guide>summary small{color:#a7b995;font:10px monospace;text-transform:none;margin-left:12px}.profile-guide>p,.profile-scoring>p{margin:10px 14px}.practice-routine{list-style:none;padding:0 14px;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}.practice-routine li{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--line)}.practice-routine li>span{flex:0 0 44px;color:#c0ce92;font:10px monospace;padding-top:3px}.practice-routine a,.practice-extra a{color:#dfecc9;text-underline-offset:4px}.practice-routine p{margin:5px 0 0;font-size:11px}.practice-extra{margin:0 14px 14px;padding:12px;background:#b7db5708;border-left:2px solid #b7cc65}.practice-extra h3{margin:0;color:#cbdcad;font:700 12px monospace}.practice-extra p{margin-bottom:0}#practiceXpBreakdown{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;padding:8px 14px}#practiceXpBreakdown>div{display:flex;justify-content:space-between;gap:12px;color:#d2dec5;font-size:12px}#practiceXpBreakdown small{display:block;color:#9ba98e;font-size:10px;margin-top:5px}#practiceXpBreakdown strong{white-space:nowrap;color:var(--accent);font:12px monospace}.profile-save-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:14px}.practice-progress .profile-save-row p{font-size:10px;margin:0}.practice-progress button{min-height:44px;flex-shrink:0;padding:10px 14px;border:2px solid #708453;border-radius:2px;color:#dbeaaf;background:#2b3d22;box-shadow:2px 2px #090f07;cursor:pointer;font:700 10px monospace;text-transform:uppercase}.practice-progress button:hover{color:#182006;background:var(--accent)}@media(max-width:900px){.practice-rank-path{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:650px){.practice-progress{padding:14px}.practice-profile{grid-template-columns:65px minmax(0,1fr);padding:12px;gap:12px}.profile-identity h2{font-size:23px;overflow-wrap:anywhere}.profile-xp{flex-direction:column;gap:4px}.profile-identity>p{margin-bottom:9px}.profile-emblem>span{font-size:9px;padding-inline:6px}.practice-missions{grid-template-columns:1fr}.practice-mission{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px}.practice-mission>.profile-kicker,.practice-mission>h3,.practice-mission>p{grid-column:1 / -1}.practice-mission>small{align-self:center}.practice-mission>strong{margin:0;align-self:end}.practice-progress-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-section-heading{flex-wrap:wrap;gap:4px}.profile-section{margin-top:16px}.practice-routine,#practiceXpBreakdown{grid-template-columns:1fr}.profile-save-row{flex-direction:column;align-items:stretch}.profile-guide>summary small{display:block;margin:5px 0 0 14px}}.audio-setup{margin-top:18px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(120deg,#d6ff4505,transparent 60%),var(--panel);text-align:left}.audio-setup>summary{display:flex;align-items:center;gap:12px;padding:16px 18px;cursor:pointer;list-style:none}.audio-setup>summary::-webkit-details-marker{display:none}.audio-setup>summary svg{flex:0 0 24px;width:24px;height:24px;fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round}.audio-setup-title{color:#edf1ea;font-size:14px;font-weight:600}.audio-setup-title small{display:block;margin-top:4px;color:#aeb8a7;font-size:11px;font-weight:400}.audio-setup>summary .audio-setup-chevron{flex:0 0 20px;width:20px;height:20px;margin-left:auto;stroke-linejoin:round;transition:transform .15s ease}.audio-setup[open]>summary .audio-setup-chevron{transform:rotate(180deg)}.audio-setup-body{padding:0 18px 14px}.audio-setup-steps{display:flex;gap:16px;list-style:none;counter-reset:setup-step;margin:0;padding:12px 0;border-top:1px solid var(--line);color:#b9c4b0;font-size:11px}.audio-setup-steps li{display:flex;align-items:center;gap:7px}.audio-setup-steps li:before{counter-increment:setup-step;content:counter(setup-step);display:grid;place-items:center;flex:0 0 20px;height:20px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font:10px monospace}.audio-setup-command{display:flex;align-items:center;gap:20px;padding:8px 0 14px}#setupMessage{flex:1;min-width:0;margin:0;font-size:12px;line-height:1.6;color:#e0e8db}.audio-setup-readings{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;margin:0;padding:14px 0;border-block:1px solid var(--line)}.audio-setup-readings>div{min-width:0}.audio-setup-readings>div+div{border-left:1px solid var(--line);padding-left:14px}.audio-setup-readings span{display:block;color:#aeb8a7;font:9px monospace;text-transform:uppercase;letter-spacing:.08em;margin-bottom:7px}.audio-setup-readings strong{display:block;font-size:12px;line-height:1.5;color:#edf1ea;overflow-wrap:anywhere}#setupNoise[data-level=low]{color:#85dfa0}#setupNoise[data-level=medium]{color:#f0cf77}#setupNoise[data-level=high]{color:#ff9c8e}.audio-setup-meters label{display:grid;grid-template-columns:55px minmax(0,1fr) 78px;gap:10px;align-items:center;margin:10px 0;color:#bdc8b5;font:11px monospace}.audio-setup-meters meter{width:100%;min-width:0;height:16px}.audio-setup-actions{display:flex;flex-wrap:wrap;gap:8px}.audio-setup-actions button{min-height:44px;padding:10px 14px;border-radius:10px;background:var(--accent);color:#172006;border:1px solid var(--line);cursor:pointer;font-size:12px;font-weight:600}.audio-setup-actions #setupStop{background:transparent;color:#d6dfd0}.audio-setup-actions button[hidden]{display:none}.audio-setup summary:focus-visible,.audio-setup button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.audio-setup-bottom{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 18px;margin-top:8px}.audio-setup-tips{flex:1 1 180px}.audio-setup-tips summary{padding:8px 0;cursor:pointer;color:#c4cfbd;font-size:11px}.audio-setup-tip{margin:4px 0;font-size:12px;line-height:1.7;color:#aeb8a7}.audio-setup-privacy{color:#99a38f;font-size:10px}@media(max-width:580px){.audio-setup>summary{padding:14px;gap:10px}.audio-setup-body{padding:0 14px 14px}.audio-setup-steps{gap:8px;justify-content:space-between;font-size:10px}.audio-setup-steps li{gap:4px}.audio-setup-steps li:before{flex-basis:17px;height:17px}.audio-setup-command{flex-direction:column;align-items:stretch;gap:10px}.audio-setup-actions button{flex:1}.audio-setup-readings{grid-template-columns:1fr 1fr;gap:12px;padding:12px 0}.audio-setup-readings>div:first-child{grid-column:1 / -1}.audio-setup-readings>div:nth-child(2){border-left:0;padding-left:0}.audio-setup-meters label{grid-template-columns:48px minmax(0,1fr) 70px;gap:6px;font-size:10px}}.pwa-controls{flex-wrap:wrap;align-items:center;gap:10px;width:min(480px,calc(100% - 32px));padding:22px;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--text)}.pwa-controls[open]{display:flex}.pwa-controls::backdrop{background:#0009}.pwa-controls form{flex-basis:100%;display:flex;justify-content:flex-end}.pwa-controls[hidden],.pwa-controls [hidden]{display:none}.pwa-controls>span{color:#b9c6ac;font-size:12px}.pwa-controls button{min-height:44px;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--accent);cursor:pointer}.pwa-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.pwa-controls p{flex-basis:100%;max-width:540px;line-height:1.6;font-size:12px;color:#b9c6ac}.info-page{width:min(1080px,calc(100% - 80px));padding-top:44px}.info-card{overflow:hidden;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.025),transparent 42%),var(--panel);box-shadow:0 24px 70px #00000040}.info-hero{max-width:780px;padding:54px 56px 42px}.info-hero h1{max-width:690px;margin:0;font-size:clamp(36px,5vw,60px);line-height:1.02;letter-spacing:-.05em}.info-hero>p:last-child{max-width:710px;margin:20px 0 0;color:#a7b0a5;font-size:15px;line-height:1.7}.musician-stories{padding:12px 48px 40px}.musician-stories-heading{max-width:650px;margin-bottom:34px}.info-card .musician-stories-heading h2{font-size:clamp(26px,3.5vw,38px)}.musician-story{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:center;margin:0 0 38px}.musician-story-reverse{grid-template-columns:minmax(0,1fr) 220px}.musician-story-reverse .musician-person{grid-column:2;grid-row:1}.musician-story-reverse .musician-bubble{grid-column:1;grid-row:1}.musician-person{margin:0;min-width:0;text-align:center}.musician-person img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 12px 14px rgba(0,0,0,.2))}.musician-person figcaption{display:grid;gap:7px;margin-top:12px}.musician-person figcaption span,.musician-stage{font:10px/1.5 SFMono-Regular,Consolas,monospace;letter-spacing:.1em;text-transform:uppercase;color:#b3bead}.musician-person strong{font-size:15px;color:#edf1ea}.musician-bubble{--bubble-fill: #242c21;position:relative;min-width:0;padding:30px 32px;border:1px solid #48513e;border-radius:26px 30px 30px 10px;background:var(--bubble-fill)}.musician-bubble:before{content:"";position:absolute;width:20px;height:20px;top:48px;left:-11px;background:var(--bubble-fill);border-left:1px solid #48513e;border-bottom:1px solid #48513e;transform:rotate(45deg)}.musician-story-reverse .musician-bubble{--bubble-fill: #202d29;border-radius:30px 26px 10px 30px}.musician-story-reverse .musician-bubble:before{left:auto;right:-11px;transform:rotate(225deg)}.musician-stage{color:var(--accent)}.musician-bubble h3{margin:14px 0;font-size:clamp(21px,2.3vw,27px);line-height:1.25;letter-spacing:-.025em;color:#f1f4e9}.info-card .musician-bubble p{margin:0;color:#bec7b9;font-size:14px;line-height:1.8}.musician-tools{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:20px}.musician-tools a{padding:10px 0;color:var(--accent);font-size:12px;font-weight:600;text-underline-offset:5px}.musician-tools a:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:3px}.info-card .musician-stories-note{margin:8px auto 0;text-align:center;max-width:610px;color:#a6b09f;font-size:11px}@media(max-width:850px){.musician-stories{padding:12px 26px 32px}.musician-story{grid-template-columns:160px minmax(0,1fr);gap:24px}.musician-story-reverse{grid-template-columns:minmax(0,1fr) 160px}.musician-bubble{padding:24px}}@media(max-width:580px){.musician-stories{padding:8px 22px 30px}.musician-story,.musician-story-reverse{grid-template-columns:minmax(0,1fr);gap:24px;margin-bottom:36px}.musician-story .musician-person,.musician-story .musician-bubble{grid-column:1;grid-row:auto}.musician-person{width:min(220px,100%);justify-self:center}.musician-bubble,.musician-story-reverse .musician-bubble{border-radius:22px;padding:24px 20px 18px}.musician-bubble:before,.musician-story-reverse .musician-bubble:before{top:-11px;left:calc(50% - 10px);right:auto;transform:rotate(135deg)}}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.info-grid section{min-width:0;padding:34px;border-right:1px solid var(--line)}.info-grid section:last-child{border-right:0}.info-number{color:var(--accent);font:10px SFMono-Regular,Consolas,monospace}.info-card h2{margin:12px 0 10px;color:#edf1ea;font-size:21px;line-height:1.22;letter-spacing:-.025em}.info-card section p,.info-card section li{color:#98a298;font-size:12px;line-height:1.72}.support-story{display:grid;grid-template-columns:1fr auto;align-items:center;gap:36px;border-top:1px solid var(--line);padding:38px 42px;background:linear-gradient(100deg,rgba(223,255,79,.07),transparent 66%)}.support-story h2{max-width:660px;margin-top:8px}.support-story p:last-child{max-width:720px;margin-bottom:0}.info-primary-link{min-height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:0 19px;color:#172006;background:var(--accent);font-size:11px;font-weight:800;text-decoration:none;white-space:nowrap}.info-primary-link:hover,.info-primary-link:focus-visible{filter:brightness(1.07);outline:2px solid rgba(223,255,79,.3);outline-offset:3px}.manual-card .info-hero{padding-bottom:28px}.manual-index{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 56px;background:#171a17}.manual-index a{border:1px solid #424a3e;border-radius:999px;padding:8px 13px;color:#b9c2b6;font-size:10px;text-decoration:none}.manual-index a:hover,.manual-index a:focus-visible{border-color:var(--accent);color:#172006;background:var(--accent);outline:none}.manual-sections{display:grid;grid-template-columns:repeat(2,1fr)}.manual-sections section{min-width:0;scroll-margin-top:20px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:32px 38px}.manual-sections section:nth-child(2n){border-right:0}.manual-sections section:last-child:nth-child(odd){grid-column:1 / -1;border-right:0}.manual-sections h2{margin-top:6px}.manual-sections h2 a{color:inherit;text-decoration-color:#66713f;text-underline-offset:4px}.manual-sections h2 a:hover{color:var(--accent)}.manual-sections ol,.contact-checklist ul{margin:12px 0 0;padding-left:18px}.manual-kicker{margin:0;color:var(--accent)!important;font:8px SFMono-Regular,Consolas,monospace!important;letter-spacing:.13em;text-transform:uppercase}.manual-tip{display:flex;gap:14px;padding:22px 38px;color:#aeb8aa;background:#dfff4f0e;font-size:11px;line-height:1.55}.manual-tip strong{flex:0 0 auto;color:var(--accent)}.contact-layout{display:grid;grid-template-columns:1.25fr .75fr;border-top:1px solid var(--line)}.contact-layout>section{padding:38px 44px}.contact-checklist{border-left:1px solid var(--line);background:#171a17}.contact-email-placeholder{display:grid;gap:7px;margin-top:26px;border:1px dashed #596255;border-radius:14px;padding:20px;background:#ffffff05}.contact-email-placeholder span{color:var(--muted);font-size:8px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.contact-email-placeholder strong{color:var(--accent);font:16px SFMono-Regular,Consolas,monospace}.contact-email-placeholder small{color:#7f887d;font-size:9px}@media(max-width:850px){.workspace{width:calc(100% - 40px);padding-top:34px}.tuner-card{padding-inline:28px}.controls{grid-template-columns:1fr 1fr}.device-control{grid-column:span 2}.note{font-size:126px}.metronome-card{padding-inline:28px}.metronome-settings{grid-template-columns:1fr 1fr}.metronome-settings label:last-child{grid-column:span 2}.metronome-actions{grid-template-columns:1fr 1fr}.metronome-start{grid-column:1 / -1;grid-row:1}.accent-toggle{justify-self:end}.topbar{padding-inline:22px}.topbar-actions{gap:8px}.page-switch span{display:none}.page-switch{width:40px;padding:0;justify-content:center}.fretboard-page,.chords-page,.scales-page,.fifths-page,.strumming-page{width:calc(100% - 40px)}.fretboard-card{padding:18px}.fretboard-toolbar{grid-template-columns:1fr 1fr}.played-note{grid-column:span 2}.fret-volume-stack{align-self:center}.game-mode-button,.learn-mode-button{justify-self:stretch}.fretboard-card.game-mode .fretboard-toolbar{grid-template-columns:80px minmax(0,1fr) 42px}.fretboard-card.game-mode .game-rank{grid-column:1;grid-row:1}.fretboard-card.game-mode .game-question{grid-column:2;grid-row:1}.fretboard-card.game-mode .replay-note{grid-column:3;grid-row:1}.fretboard-card.game-mode .fret-volume-stack{grid-column:1 / 3;grid-row:2}.fretboard-card.game-mode .game-mode-button{grid-column:3;grid-row:2;width:42px;padding:0}.fretboard-card.game-mode .game-feedback{grid-column:1 / -1;grid-row:3}.fretboard-card.learn-mode .fretboard-toolbar{grid-template-columns:92px minmax(0,1fr) 62px}.fretboard-card.learn-mode .learn-level-control{grid-column:1;grid-row:1}.fretboard-card.learn-mode .learn-question{grid-column:2;grid-row:1}.fretboard-card.learn-mode .learn-timer-control{grid-column:3;grid-row:1}.fretboard-card.learn-mode .fret-volume-stack{grid-column:1 / 3;grid-row:2}.fretboard-card.learn-mode .learn-mode-button{grid-column:3;grid-row:2;width:42px;padding:0}.fretboard-card.learn-mode .learn-feedback{grid-column:1 / -1;grid-row:3}.fretboard-legend{flex-wrap:wrap;gap:9px 18px}.chords-card{padding:18px}.chords-toolbar{grid-template-columns:84px 104px 1fr}.selected-chord{grid-column:1 / -1}.chords-card.advanced-mode .chords-toolbar{grid-template-columns:104px 1fr}.chords-card.game-mode .chords-toolbar{grid-template-columns:1fr 84px minmax(190px,1fr)}.chord-game-panel{grid-template-columns:92px minmax(130px,1fr) 62px 96px;gap:11px;padding-inline:13px}.common-chords{grid-template-columns:repeat(5,1fr)}.advanced-chord-controls{grid-template-columns:1fr 190px}.advanced-root-control{grid-column:1 / -1}.advanced-root-buttons{grid-template-columns:repeat(6,1fr)}.chord-legend{flex-wrap:wrap;gap:9px 18px}.scales-card{padding:18px}.scales-heading-actions{gap:10px}.scale-volume-stack{width:185px}.scale-root-buttons{grid-template-columns:repeat(6,1fr)}.scale-controls{grid-template-columns:1fr 1.2fr 100px}.play-scale-button{grid-column:3}.scale-game-status-row{grid-template-columns:110px minmax(190px,1fr) 68px;gap:12px}.scales-card.game-mode{grid-template-columns:72px minmax(170px,1fr) 58px 62px 185px;column-gap:10px}.scales-card.game-mode .scale-game-score{grid-column:1}.scales-card.game-mode .scale-game-question{grid-column:2}.scales-card.game-mode .scale-game-timer{grid-column:3}.scales-card.game-mode .scale-game-button{grid-column:4;width:62px}.scales-card.game-mode .scale-volume-stack{grid-column:5}.scale-game-controls{grid-template-columns:1fr 1fr}.scale-game-message-row{grid-template-columns:1fr auto}.fifths-card{padding-inline:18px}.fifths-toolbar{grid-template-columns:1fr 160px 175px}.fifths-learning-panel{grid-template-columns:105px minmax(250px,1fr) 96px;gap:10px}.fifths-family{grid-template-columns:1fr}.fifths-family-summary{text-align:center}.strumming-card{padding:18px}.strumming-toolbar{grid-template-columns:1fr 1fr}.selected-strumming{grid-column:1 / -1}.strumming-play-button{grid-column:2}.strumming-song-controls{grid-template-columns:1fr 180px}.strumming-song-controls>button,.strumming-loop-control{min-width:0}.strumming-rhythm-builder{grid-template-columns:1fr 1fr}.strumming-rhythm-builder>span,.strumming-rhythm-builder small{grid-column:1 / -1}.strumming-arrow-action{grid-column:2;width:100%}.strumming-chord-assignment{align-items:flex-start;flex-direction:column}.strumming-chord-copy{flex-basis:auto}.strumming-chord-palette{justify-content:flex-start}.strumming-instrument-editor{align-items:flex-start;flex-direction:column}.strumming-instrument-palette{justify-content:flex-start}.strumming-library{grid-template-columns:repeat(2,minmax(0,1fr))}.coffee-support{right:14px;bottom:14px;width:132px}.coffee-message{width:230px}.site-footer{grid-template-columns:1fr;justify-items:center;padding:22px 24px 200px;text-align:center}.site-footer>p{justify-self:center;padding-right:0}.info-page{width:calc(100% - 40px)}.info-hero{padding:40px 32px 30px}.info-grid,.manual-sections,.contact-layout{grid-template-columns:1fr}.info-grid section,.manual-sections section{border-right:0}.support-story{grid-template-columns:1fr;padding:32px}.manual-index{padding-inline:32px}.contact-checklist{border-top:1px solid var(--line);border-left:0}}@media(max-width:850px){html,body{width:100%;max-width:100%;overflow-x:hidden}body,button,select,input{min-width:0}.topbar{width:100%;min-width:0;height:auto;min-height:112px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:13px 16px 11px}.brand{font-size:16px}.topbar-actions{grid-column:1 / -1;width:100%;min-width:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.topbar-actions .connection{display:none}.page-switch{width:100%;min-width:0;height:42px;border-radius:9px;padding:0;justify-content:center}.page-switch svg{width:19px;height:19px}.workspace,.metronome-page,.fretboard-page,.chords-page,.scales-page,.fifths-page,.strumming-page,.info-page{width:calc(100% - 24px);max-width:100%;padding-top:28px}.intro{margin-bottom:20px}.intro h1{font-size:clamp(30px,8vw,42px)}.intro>p:last-child{font-size:13px;line-height:1.5}.tuner-card,.metronome-card,.fretboard-card,.chords-card,.scales-card,.fifths-card,.strumming-card{border-radius:18px;padding:20px}.controls{grid-template-columns:minmax(0,1fr) minmax(160px,auto)}.device-control{grid-column:1 / -1}.fretboard-scroll,.chord-fretboard-scroll,.scale-fretboard-wrap{width:100%;overflow:hidden}.fretboard,.chord-fretboard,.scale-fretboard{width:100%;min-width:0;max-width:560px;margin:0 auto;grid-template-columns:42px repeat(6,minmax(0,1fr));grid-template-rows:36px repeat(13,52px);background:linear-gradient(180deg,#24261d,#313226 45%,#292b21)}.fret-corner,.chord-fret-corner,.scale-fret-corner{grid-column:1;grid-row:1}.fret-number,.chord-fret-number,.scale-fret-number{grid-column:1;grid-row:var(--mobile-fret-row);border-right:1px solid #4b4d3e;border-bottom:2px solid rgba(193,194,176,.43)}.string-label,.chord-string-label,.scale-string-label{grid-column:var(--mobile-string-column);grid-row:1;overflow:hidden;border-right:1px solid rgba(255,255,255,.04);padding:3px;font-size:7px;line-height:1.15;text-align:center;white-space:normal}.scale-string-label{display:grid;place-content:center;gap:1px}.string-label,.chord-string-label{font-size:0}.string-label:before,.chord-string-label:before{content:attr(data-string-number);color:var(--accent);font:700 8px/1 SFMono-Regular,Consolas,monospace}.string-label:after,.chord-string-label:after{content:attr(data-string-name);margin-top:2px;color:#aab1a3;font:700 7px/1 SFMono-Regular,Consolas,monospace}.fretboard-card.game-mode .string-label[aria-pressed=false]:after,.fretboard-card.learn-mode .string-label[aria-pressed=false]:after{display:none}.fret-cell,.chord-fret-cell,.scale-fret-cell{grid-column:var(--mobile-string-column);grid-row:var(--mobile-fret-row);border-right:1px solid rgba(255,255,255,.035);border-bottom:2px solid rgba(193,194,176,.43);background:linear-gradient(180deg,rgba(255,255,255,.008),transparent)}.fret-number.open,.fret-cell.open,.chord-fret-number.open,.chord-fret-cell.open,.scale-fret-number.open,.scale-fret-cell.open{border-right-width:1px;border-bottom:4px solid #d6cfad}.string-line,.chord-string-line,.scale-string-line{width:var(--string-weight);height:100%;left:50%;top:0;background:linear-gradient(to right,#ebe9dc,#777a70);transform:translate(-50%)}.marker-label,.fret-marker{display:none}.chord-barre{position:relative;left:auto;top:auto;grid-column:var(--mobile-barre-column) / span var(--barre-strings);grid-row:calc(var(--barre-fret) + 2);align-self:center;justify-self:center;width:calc(100% - 12px);height:31px;min-height:0;border-radius:16px;background:linear-gradient(180deg,#74806261,#9daa8185,#74806261)}.chords-toolbar{grid-template-columns:minmax(0,1fr) auto auto}.selected-chord{grid-column:1 / -1}.chord-volume-stack{grid-column:1 / -1;width:100%}.chords-card.advanced-mode .chords-toolbar,.chords-card.game-mode .chords-toolbar{grid-template-columns:minmax(0,1fr) auto}.chords-card.game-mode .chord-game-button{grid-column:1}.chords-card.game-mode .chord-volume-stack{grid-column:2}.chord-game-panel{grid-template-columns:90px minmax(0,1fr) 62px 96px}.advanced-chord-controls{grid-template-columns:minmax(0,1fr) minmax(170px,.7fr)}.scales-heading{align-items:flex-start}.scales-heading-actions{flex-wrap:wrap;justify-content:flex-end}.scale-root-buttons{grid-template-columns:repeat(6,minmax(0,1fr))}.scale-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.scale-pattern-control{grid-column:1 / -1}.scales-card.learn-mode>.scale-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.scales-card.learn-mode>.scale-controls .scale-pattern-control{grid-column:1 / -1}.scales-card.game-mode{grid-template-columns:72px minmax(0,1fr) 60px 64px;column-gap:10px}.scales-card.game-mode .scale-game-score{grid-column:1}.scales-card.game-mode .scale-game-question{grid-column:2}.scales-card.game-mode .scale-game-timer{grid-column:3}.scales-card.game-mode .scale-game-button{grid-column:4;width:64px}.scales-card.game-mode .scale-volume-stack{grid-column:1 / -1;grid-row:2;width:100%}.scales-card.game-mode .scale-game-controls{grid-row:3}.scales-card.game-mode .scale-game-message-row{grid-row:4}.scales-card.game-mode .scale-fretboard-wrap{grid-row:5}.fifths-card{width:100%}.fifths-toolbar{grid-template-columns:minmax(0,1fr) minmax(170px,.8fr)}.fifths-legend{grid-column:1 / -1}.fifths-volume-control{width:100%}.fifths-learning-panel{grid-template-columns:105px minmax(0,1fr) 96px}.fifths-progression{justify-content:center;flex-wrap:wrap;overflow:hidden}.fifths-wheel{width:min(100%,500px);height:auto;aspect-ratio:1}.strumming-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.strumming-song-controls{grid-template-columns:minmax(0,1fr) 180px}.strumming-rhythm-builder{grid-template-columns:repeat(2,minmax(0,1fr))}.strumming-rhythm-builder>span,.strumming-rhythm-builder small{grid-column:1 / -1}.strumming-stage,.strumming-stage.song-layout{overflow-x:hidden}.strumming-counts,.strumming-strokes{min-width:0;grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(auto-fit,minmax(42px,1fr))}.strumming-song-pages{position:static;width:100%;justify-content:center}.strumming-song-pages output{min-width:0;flex:1}}@media(max-width:520px){.topbar{min-height:108px}.brand-mark{width:24px;height:24px}.workspace,.metronome-page,.fretboard-page,.chords-page,.scales-page,.fifths-page,.strumming-page,.info-page{width:calc(100% - 16px);padding:22px 0 30px}.tuner-card,.metronome-card,.fretboard-card,.chords-card,.scales-card,.fifths-card,.strumming-card{padding:14px}.intro h1{font-size:32px}.eyebrow{font-size:9px}.note-readout{height:174px}.note{font-size:102px}.frequency,.cents{top:14px;transform:none;font-size:11px}.cents{width:105px}.strings{gap:5px}.strings button{width:43px;height:43px}.controls{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 8px}.device-control{grid-column:1 / -1;width:100%}.reference-control{grid-column:1;width:100%}.listen-button{grid-column:2;width:100%;padding-inline:10px;gap:7px;white-space:nowrap}.reference-stepper{width:100%}.reference-stepper button{width:30px;flex:0 0 30px}.reference-value-wrap{min-width:0;flex:1}.tempo-display{grid-template-columns:46px minmax(0,1fr) 46px;gap:7px}.tempo-step{width:44px;height:44px}.tempo-number{width:100%;font-size:76px}.metronome-control-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 8px;padding-top:22px;border-top:1px solid rgba(255,255,255,.07)}.metronome-settings,.metronome-actions{display:contents}.metronome-settings label:nth-child(1){grid-column:1;grid-row:1}.metronome-settings label:nth-child(2){grid-column:2;grid-row:1}.metronome-settings label:nth-child(3){grid-column:1;grid-row:2}.metronome-control-layout .metronome-start{grid-column:2;grid-row:2;width:100%;min-width:0;height:44px;align-self:end}.metronome-control-layout .tap-button{grid-column:1;grid-row:3}.metronome-control-layout .accent-toggle{grid-column:2;grid-row:3}.tap-button,.accent-toggle{justify-self:stretch;justify-content:center}.volume-row{grid-template-columns:17px auto minmax(0,1fr) 36px;gap:6px}.shortcut-hint{line-height:2}.fretboard,.chord-fretboard,.scale-fretboard{grid-template-columns:38px repeat(6,minmax(0,1fr));grid-template-rows:34px repeat(13,48px)}.note-bubble,.chord-note-bubble{width:32px;height:32px}.scale-note-button{width:29px;height:29px}.fretboard-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-inline:0}.played-note{min-width:0}.fret-volume-stack{grid-column:1 / -1}.fretboard-card:not(.game-mode):not(.learn-mode) .fretboard-toolbar{grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr) minmax(0,.8fr)}.fretboard-card:not(.game-mode):not(.learn-mode) .played-note{grid-column:1 / -1;grid-row:1}.fretboard-card:not(.game-mode):not(.learn-mode) .note-duration-control{grid-column:1;grid-row:2}.fretboard-card:not(.game-mode):not(.learn-mode) .learn-mode-button{grid-column:2;grid-row:2;padding-inline:6px}.fretboard-card:not(.game-mode):not(.learn-mode) .game-mode-button{grid-column:3;grid-row:2;padding-inline:6px}.fretboard-card:not(.game-mode):not(.learn-mode) .fret-volume-stack{grid-column:1 / -1;grid-row:3}.fretboard-card.game-mode .fretboard-toolbar{grid-template-columns:78px minmax(0,1fr)}.fretboard-card.game-mode .game-rank{grid-column:1;grid-row:1}.fretboard-card.game-mode .game-question{grid-column:2;grid-row:1}.fretboard-card.game-mode .replay-note{grid-column:1;grid-row:2}.fretboard-card.game-mode .game-mode-button{grid-column:2;grid-row:2;width:100%}.fretboard-card.game-mode .fret-volume-stack{grid-column:1 / -1;grid-row:3}.fretboard-card.game-mode .game-feedback{grid-row:4}.fretboard-card.learn-mode .fretboard-toolbar{grid-template-columns:96px minmax(0,1fr) 42px;align-items:start;gap:18px 10px}.fretboard-card.learn-mode .learn-level-control{grid-column:1;grid-row:2;grid-template-columns:52px minmax(0,1fr);column-gap:6px;width:100%}.fretboard-card.learn-mode .learn-level-control>input{width:52px;font-size:25px}.fretboard-card.learn-mode .learn-level-control>small{min-width:0;font-size:8px;line-height:1.4;white-space:normal}.fretboard-card.learn-mode .learn-question{grid-column:2;grid-row:2;width:100%;min-width:0;justify-self:stretch}.fretboard-card.learn-mode .learn-question p{line-height:1.4}.fretboard-card.learn-mode .learn-timer-control{grid-column:3;grid-row:2}.fretboard-card.learn-mode .learn-timer-control strong{font-size:32px}.fretboard-card.learn-mode .learn-mode-button{grid-column:1;grid-row:1;width:88px;height:46px;margin-top:0;justify-self:start}.fretboard-card.learn-mode .fret-volume-stack{grid-column:2 / -1;grid-row:1;width:100%;min-width:0}.fretboard-card.learn-mode .fret-volume-control{grid-template-columns:minmax(0,1fr) 28px;column-gap:5px}.fretboard-card.learn-mode .fret-volume-control input{min-width:0;margin-inline:0}.fretboard-card.learn-mode .challenge-input-status{min-height:24px;margin-top:3px}.fretboard-card.learn-mode .learn-feedback{grid-column:1 / -1;grid-row:3;max-width:100%;margin-top:0}.chords-toolbar,.chords-card.advanced-mode .chords-toolbar,.chords-card.game-mode .chords-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-inline:0}.selected-chord,.chord-volume-stack,.chords-card.game-mode .chord-volume-stack,.chords-card.game-mode .chord-game-button{grid-column:1 / -1}.chord-game-panel{grid-template-columns:1fr 1fr;gap:12px;margin-inline:0;padding:13px}.chord-game-score{grid-column:1}.chord-game-timer{grid-column:2;justify-items:end}.chord-game-question{grid-column:1 / -1}.chord-game-actions{grid-column:1 / -1;justify-content:center}.chords-card.game-mode .chords-toolbar{margin-bottom:12px}.chords-card.game-mode .chord-game-panel{grid-template-columns:repeat(6,minmax(0,1fr));align-items:start;gap:18px 6px;padding:14px 10px}.chords-card.game-mode .chord-game-panel .chord-volume-stack{grid-column:1 / 4;grid-row:1;min-width:0;width:100%}.chord-game-panel .chord-volume-control{grid-template-columns:minmax(0,1fr) 26px;column-gap:4px}.chord-game-panel .chord-volume-control input{min-width:0;margin-inline:0}.chord-game-panel .chord-game-input-status{min-height:24px;margin-top:3px}.chords-card.game-mode .chord-game-actions{grid-column:4 / 7;grid-row:1;justify-content:flex-end;gap:6px;align-self:start}.chord-game-actions .chord-repeat-button{width:40px;height:44px;flex-shrink:0}.chord-game-actions .chord-skip-button{min-width:52px;height:44px;padding-inline:6px}.chords-card.game-mode .chord-game-score{grid-column:1 / 3;grid-row:2;grid-template-columns:minmax(0,1fr);gap:4px}.chord-game-score small{line-height:1.4}.chords-card.game-mode .chord-game-question{grid-column:3 / 6;grid-row:2;min-width:0;gap:4px}.chord-game-question small{line-height:1.4}.chords-card.game-mode .chord-game-timer{grid-column:6;grid-row:2;justify-items:end}.chord-game-timer strong{font-size:28px}.chords-card.game-mode .chord-game-feedback{grid-column:1 / -1;grid-row:3;line-height:1.5}.chords-card:not(.game-mode):not(.advanced-mode) .common-chords{grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.chords-card:not(.game-mode):not(.advanced-mode) .common-chords button{height:46px;min-width:0;border-radius:8px;padding:0 2px}.chords-card:not(.game-mode):not(.advanced-mode) .common-chords button strong{font-size:13px}.chords-card:not(.game-mode):not(.advanced-mode) .common-chords button span{display:none}.advanced-chord-controls{grid-template-columns:1fr}.advanced-root-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.scales-heading{display:grid;gap:15px}.scales-heading-actions{display:grid;grid-template-columns:auto auto;justify-content:stretch}.scale-learn-counter{grid-column:1 / -1}.scale-volume-stack{grid-column:1 / -1;width:100%}.scale-learn-button,.scale-game-button{width:100%;margin-top:0}.scale-category-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.scale-category-tabs button{padding:0 5px}.scale-root-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.scale-controls,.scales-card.learn-mode>.scale-controls{grid-template-columns:1fr 1fr}.scale-style-control,.scale-type-control,.scale-pattern-control,.play-scale-button{grid-column:1 / -1}.scales-card:not(.game-mode) .scales-heading-actions{width:100%;min-width:0;grid-template-columns:58px 58px minmax(0,1fr);gap:10px 8px;align-items:start}.scales-card:not(.game-mode) .scale-learn-button{grid-column:1;padding-inline:4px}.scales-card:not(.game-mode) .scale-game-button{grid-column:2;padding-inline:4px}.scales-card:not(.game-mode) .scale-volume-stack{grid-column:3;min-width:0}.scales-card:not(.game-mode) .scale-volume-control{grid-template-columns:minmax(0,1fr) 28px;gap:5px}.scales-card:not(.game-mode) .scale-volume-control input{min-width:0;margin-inline:0}.scales-card.learn-mode .scales-heading-actions{grid-template-columns:58px minmax(0,1fr)}.scales-card.learn-mode .scale-volume-stack{grid-column:2}.scales-card:not(.game-mode)>.scale-controls{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 6px}.scales-card:not(.game-mode) .scale-style-control{grid-column:1 / 4;grid-row:1}.scales-card:not(.game-mode) .scale-type-control{grid-column:4 / 7;grid-row:1}.scales-card:not(.game-mode) .scale-pattern-control{grid-column:1 / -1;grid-row:2}.scales-card:not(.game-mode) .scale-position-control{grid-column:1 / 3;grid-row:3}.scales-card:not(.game-mode) .scale-direction-control{grid-column:3 / 5;grid-row:3}.scales-card:not(.game-mode) .play-scale-button{grid-column:5 / 7;grid-row:3;padding-inline:4px;gap:4px}.scales-card:not(.game-mode) .scale-controls select{padding-inline:6px;font-size:9px}.scales-card.learn-mode .scale-position-control{grid-column:1 / 4}.scales-card.learn-mode .scale-direction-control{grid-column:4 / 7}.scales-card.game-mode{display:grid;grid-template-columns:1fr 1fr;gap:12px}.scales-card.game-mode .scale-game-score{grid-column:1;grid-row:1}.scales-card.game-mode .scale-game-timer{grid-column:2;grid-row:1;justify-items:end}.scales-card.game-mode .scale-game-question{grid-column:1 / -1;grid-row:2}.scales-card.game-mode .scale-game-button{grid-column:1;grid-row:3;width:100%}.scales-card.game-mode .scale-volume-stack{grid-column:2;grid-row:3}.scales-card.game-mode .scale-game-controls{grid-row:4;grid-template-columns:1fr 1fr}.scales-card.game-mode .scale-game-message-row{grid-row:5;grid-template-columns:1fr}.scales-card.game-mode .scale-game-progress{text-align:center}.scales-card.game-mode .scale-fretboard-wrap{grid-row:6}.fifths-toolbar{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 8px}.fifths-legend{grid-column:1 / -1;justify-content:center;flex-wrap:wrap}.fifths-mode-control{grid-column:1;grid-row:2;min-width:0}.fifths-volume-stack{grid-column:2;grid-row:2}.fifths-volume-control{min-width:0;grid-template-columns:minmax(0,1fr) 28px;column-gap:5px}.fifths-volume-control input{min-width:0;margin-inline:0}.fifths-learning-panel{grid-template-columns:1fr auto}.fifths-learning-summary,.fifths-progression{grid-column:1 / -1}.fifths-learning-actions{grid-column:1;justify-content:flex-start}.fifths-learning-feedback{grid-column:1 / -1}.fifths-center strong{font-size:25px}.fifths-center small{max-width:82px;overflow:hidden;font-size:7px;text-overflow:ellipsis;white-space:nowrap}.fifths-center em{margin-top:6px;font-size:6px}.fifths-family-chords{grid-template-columns:repeat(4,minmax(0,1fr))}.strumming-mode-switch{width:100%}.strumming-mode-switch button{flex:1;padding-inline:8px}.strumming-toolbar{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}.selected-strumming,.strumming-play-button{grid-column:1 / -1}.strumming-tempo-control{grid-column:1;grid-template-columns:minmax(0,1fr) 44px;gap:7px 5px}.strumming-volume-control{grid-column:2;grid-template-columns:minmax(0,1fr) 28px;gap:7px 5px}.strumming-tempo-control,.strumming-volume-control{grid-row:2;grid-template-rows:auto 30px;align-self:start}.strumming-tempo-control input[type=range],.strumming-volume-control input{min-width:0;margin-inline:0}.strumming-playback-controls{grid-column:1 / -1;width:100%;gap:12px;grid-template-columns:minmax(90px,110px) minmax(0,1fr)}.strumming-card>.strumming-playback-controls{margin-bottom:14px}.strumming-song-controls{grid-template-columns:minmax(0,1.8fr) repeat(2,minmax(0,1fr));gap:10px 6px}.strumming-song-controls>*{grid-column:1 / -1;min-width:0}#strummingUsePattern{grid-column:1;padding-inline:4px;white-space:normal}#strummingExport{grid-column:2;padding-inline:4px}#strummingImport{grid-column:3;padding-inline:4px}.strumming-rhythm-builder{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 5px}.strumming-rhythm-builder select,.strumming-rhythm-builder button{min-width:0;padding-inline:4px;font-size:8px}#strummingSubdivision{grid-column:1;grid-row:2}#strummingAddSingle{grid-column:2;grid-row:2}#strummingAddGroup{grid-column:3;grid-row:2}.strumming-rhythm-builder>span,.strumming-rhythm-builder small{grid-column:1 / -1}.strumming-arrow-action{grid-column:1 / -1;width:100%}.strumming-chord-palette,.strumming-instrument-palette{justify-content:flex-start}.strumming-stage{padding-inline:10px}.strumming-counts,.strumming-strokes{grid-template-columns:repeat(auto-fit,minmax(39px,1fr))}.strumming-library{grid-template-columns:1fr}.site-footer{padding-inline:16px}.site-footer nav{flex-wrap:wrap;gap:14px 20px}.info-hero{padding:30px 22px 24px}.info-hero h1{font-size:34px}.info-grid section,.manual-sections section,.contact-layout>section{padding:25px 22px}.support-story{padding:26px 22px}.manual-index{padding-inline:22px}.manual-tip{align-items:flex-start;flex-direction:column;padding:20px 22px}.contact-email-placeholder strong{overflow-wrap:anywhere;font-size:13px}.coffee-support{width:106px}.coffee-support{--cat-size: 84px}.coffee-cat-bubble{right:12px;padding:5px 9px;font-size:11px}}