.practice-page.page{width:min(1180px,calc(100% - 48px))}.practice-page .practice-card{display:block;padding:22px}.practice-page .practice-card .practice-header{display:grid;grid-template-columns:112px minmax(0,1fr) 84px;gap:14px 22px;margin:0 0 18px;padding:0 0 18px;border-bottom:1px solid var(--line)}.practice-page .practice-card .practice-controls{grid-column:1 / -1;grid-row:1;display:flex;align-items:start;justify-content:space-between;gap:16px;min-height:60px}.practice-page .practice-card .practice-modes{display:grid;grid-template-columns:repeat(2,84px);gap:8px}.practice-page .practice-card .practice-modes .practice-mode{grid-row:1;width:84px;height:44px;min-width:0;margin:0;padding:0 10px;border:1px solid #556046;border-radius:10px;color:#e1e9d8;background:#2a3226;font-size:11px;font-weight:800}.practice-page .practice-card .practice-modes .practice-mode-learn{grid-column:2}.practice-page .practice-card .practice-modes .practice-mode-game{grid-column:1;background:var(--accent);border-color:#bdd644;color:#192107}.practice-page .practice-card .practice-modes .practice-mode.active{color:var(--accent);border-color:#7b8b43;background:#303923}.practice-page .practice-card .practice-header .practice-volume{grid-column:auto;grid-row:auto;align-self:start;width:240px;min-width:0;display:grid;gap:0}.practice-page .practice-card .practice-header .practice-volume-control{width:100%;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:4px 8px;margin:0}.practice-page .practice-card .practice-volume-control>span{grid-column:1 / -1;margin:0;color:#a9b5a0;font-size:9px;font-weight:750;letter-spacing:.13em}.practice-page .practice-card .practice-volume-control input{width:100%;min-width:0;height:20px;margin:0}.practice-page .practice-card .practice-volume-control output{color:#b6c2ae;font:10px Consolas,monospace}.practice-page .practice-card .practice-header .practice-input-status{width:100%;min-width:0;min-height:24px;margin:0;padding:3px 0;font:9px/1.4 Consolas,monospace;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.practice-page .practice-card .practice-header .practice-panel:not([hidden]),.practice-page .practice-card .practice-header .scale-game-status-row{display:contents}.practice-page .practice-card .practice-header .practice-panel[hidden]{display:none}.practice-page .practice-card .practice-header .practice-summary{grid-column:1 / -1;grid-row:2;min-width:0;display:grid;grid-template-columns:1fr;align-content:start;gap:5px}.practice-page .practice-card .practice-header .practice-summary>span{color:#a9b5a0;margin:0;font-size:9px;font-weight:750;letter-spacing:.13em;text-transform:uppercase}.practice-page .practice-card .practice-header .practice-summary strong{margin:0;color:#f5f8ef;font-size:clamp(26px,2.6vw,34px);line-height:1.15;overflow-wrap:anywhere}.practice-page .practice-card .practice-header .practice-summary small{margin:0;padding:0;color:#a4b498;font:11px/1.5 Consolas,monospace;white-space:normal}.practice-page .practice-card.game-mode .practice-summary,.practice-page .fretboard-card.learn-mode .practice-summary{display:none}.practice-page .practice-card.learn-mode .selected-scale-summary{grid-column:2 / -1;border-left:3px solid var(--accent);padding-left:16px}.practice-page .practice-card .practice-learn-prompt{display:none}.practice-page .scales-card.learn-mode .practice-learn-prompt{display:block;color:var(--accent)}.practice-page .scales-card.learn-mode #scaleCategoryLabel{display:none}.practice-page .scales-card.learn-mode .practice-summary strong{font-size:clamp(28px,3vw,40px);font-weight:800}.practice-page .practice-card .practice-header .practice-stat{grid-column:1;grid-row:2;min-width:0;align-self:start;grid-template-columns:1fr;gap:5px;padding:0;margin:0}.practice-page .practice-card .practice-header .practice-stat:not(.scale-learn-counter){display:grid}.practice-page .practice-card .practice-header .practice-stat>span:not(.learn-progress-track),.practice-page .practice-card .practice-stat>label{grid-column:1 / -1;margin:0;font-size:9px;line-height:1.4;color:#a9b5a0;letter-spacing:.12em;text-transform:uppercase}.practice-page .practice-card .practice-header .practice-stat strong{color:var(--accent);font:750 32px/1.1 Consolas,monospace}.practice-page .practice-card .practice-header .practice-stat small,.practice-page .practice-card .practice-header .practice-stat em{margin:0;padding:0;font:10px/1.4 Consolas,monospace;color:#acb7a6;white-space:normal}.practice-page .practice-card .practice-header .learn-level-control{grid-template-columns:58px minmax(0,1fr);column-gap:7px}.practice-page .practice-card .practice-header .learn-level-control input{width:58px;height:42px;font-size:28px}.practice-page .practice-card .practice-header .practice-question{grid-column:2;grid-row:2;width:100%;min-width:0;display:grid;grid-template-columns:1fr;gap:5px;align-content:start;justify-self:stretch;justify-items:start;text-align:left;border-left:3px solid var(--accent);padding:0 0 0 16px}.practice-page .practice-card .practice-header .practice-question>span{grid-column:1;margin:0;color:var(--accent);font:750 10px/1.4 Consolas,monospace;letter-spacing:.12em;text-align:left;text-transform:uppercase}.practice-page .practice-card .practice-header .practice-question strong{justify-self:start;color:#f7faef;font-size:clamp(28px,3vw,40px);font-weight:800;line-height:1.12;overflow-wrap:anywhere;text-shadow:0 0 24px #dfff4f15}.practice-page .practice-card .practice-header .practice-question p,.practice-page .practice-card .practice-header .practice-question small{margin:0;color:#afbd9f;font:11px/1.5 Consolas,monospace;white-space:normal}.practice-page .practice-card .practice-header .practice-timer{grid-column:3;grid-row:2;padding:0;display:grid;gap:5px;align-self:start;justify-items:end;text-align:right}.practice-page .practice-card .practice-header .practice-timer>span{margin:0;color:#a9b5a0;font-size:9px;letter-spacing:.12em}.practice-page .practice-card .practice-header .practice-timer strong{min-width:0;color:#f5f8ef;font:750 32px/1.1 Consolas,monospace}.practice-page .practice-card .practice-header .practice-timer.urgent strong{color:var(--danger)}.practice-page .practice-card .practice-header .practice-timer small{margin:0;color:#acb7a6;font-size:10px}.practice-page .practice-card .practice-header :is(.practice-feedback,.game-feedback,.chord-game-feedback){grid-column:1 / -1;grid-row:3;align-self:center;justify-self:stretch;width:auto;min-width:0;min-height:22px;margin:0;padding:0 138px 0 0;border-radius:0;background:none;text-align:left;font-size:11px;line-height:1.5}.practice-page .practice-card .practice-header .scale-game-message-row{grid-template-columns:minmax(0,1fr) auto;padding:0}.practice-page .practice-card .practice-header .scale-game-feedback{text-align:left;font-size:11px}.practice-page .practice-card .practice-header .practice-actions{grid-column:2 / -1;grid-row:3;justify-self:end;align-self:center;margin:0;position:relative;z-index:1}.practice-page .practice-card .practice-header button.replay-note{width:44px;height:44px}.practice-page .practice-card .practice-header .chord-game-actions button{min-height:44px}.practice-page .practice-card .practice-header .chord-repeat-button{width:44px}.practice-page .practice-card .practice-options{grid-column:1 / -1;grid-row:4;display:flex;align-items:end;gap:12px;min-width:0}.practice-page .practice-card .practice-options>label{width:170px;min-width:0;display:grid;gap:6px}.practice-page .practice-card .practice-options>label>span{margin:0;color:#a9b5a0;font-size:9px;text-transform:uppercase;letter-spacing:.1em}.practice-page .practice-card .practice-options select,.practice-page .practice-card .scale-game-controls select,.practice-page .practice-card .scale-controls select{height:44px;min-width:0;width:100%;font-size:11px}.practice-page .practice-card .practice-options>button{height:44px;margin:0}.practice-page .practice-card:not(.advanced-mode) .practice-options>label:has(#chordQuality){display:none}.practice-page .practice-card:is(.game-mode,.learn-mode) .note-duration-control,.chords-card.game-mode .practice-options,.scales-card.game-mode .practice-options{display:none}.practice-page .fretboard-card:is(.game-mode,.learn-mode) .practice-options{display:none}.practice-page .practice-card .practice-header .scale-controls{width:100%;margin:0;grid-template-columns:1fr 1.2fr 1.3fr .8fr .9fr auto;gap:10px}.practice-page .practice-card .practice-header .scale-controls .scale-pattern-control button,.practice-page .practice-card .practice-header .play-scale-button{min-height:44px}.practice-page .practice-card .practice-header .scale-game-controls{grid-column:1 / -1;grid-row:4;padding:0;border:0}.practice-page .practice-card .advanced-chord-controls{grid-template-columns:1fr}.practice-page .practice-card .scale-category-tabs{padding-top:0;border-top:0}.practice-page .practice-card .scale-fretboard-wrap{margin-top:16px}.practice-page .practice-card button:focus-visible,.practice-page .practice-card select:focus-visible,.practice-page .practice-card input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media(min-width:851px){.practice-page .practice-card .practice-header{grid-template-columns:176px minmax(0,1fr) auto 220px;align-items:center;gap:12px 20px;padding-bottom:14px;margin-bottom:14px}.practice-page .practice-card .practice-controls{display:contents}.practice-page .practice-card .practice-modes{grid-column:1;grid-row:1;align-self:center}.practice-page .practice-card .practice-header .practice-volume{grid-column:-2;grid-row:1;width:100%;align-self:center}.practice-page .practice-card .practice-header .practice-summary{grid-column:2;grid-row:1;align-self:center}.practice-page .practice-card .practice-options{grid-column:3;grid-row:1;gap:8px}.practice-page .practice-card .practice-options>label{width:140px}.practice-page .scales-card .practice-options{grid-column:1 / -1;grid-row:2}.practice-page .scales-card:not(.learn-mode) .practice-header .practice-summary{grid-column:2 / -2}.practice-page .practice-card:is(.game-mode,.learn-mode) .practice-header{grid-template-columns:176px 90px minmax(0,1fr) 54px 220px}.practice-page .practice-card .practice-header .practice-stat{grid-column:2;grid-row:1;align-self:center}.practice-page .practice-card .practice-header .practice-question,.practice-page .scales-card.learn-mode .practice-header .practice-summary{grid-column:3;grid-row:1;align-self:center}.practice-page .scales-card.learn-mode .practice-header .practice-summary{grid-column:3 / -2}.practice-page .practice-card .practice-header .practice-timer{grid-column:4;grid-row:1;align-self:center}.practice-page .practice-card .practice-header :is(.practice-feedback,.game-feedback,.chord-game-feedback){grid-column:2 / -1;grid-row:2}.practice-page .practice-card .practice-header .practice-actions{grid-column:-2;grid-row:2}.practice-page .practice-card .practice-header .scale-game-controls{grid-row:3}.practice-page .practice-card .practice-header .practice-question strong,.practice-page .scales-card.learn-mode .practice-header .practice-summary strong{font-size:clamp(25px,2.4vw,34px)}}@media(min-width:851px)and (max-width:1100px){.topbar{padding-inline:20px;gap:16px}.topbar-actions{gap:6px}.topbar-actions .page-switch{width:44px;padding:0;justify-content:center}.topbar-actions .page-switch span{display:none}.practice-page .practice-card .practice-header{grid-template-columns:152px minmax(0,1fr) auto 180px;column-gap:14px}.practice-page .practice-card:is(.game-mode,.learn-mode) .practice-header{grid-template-columns:152px 74px minmax(0,1fr) 44px 180px}.practice-page .practice-card .practice-modes{grid-template-columns:repeat(2,72px)}.practice-page .practice-card .practice-modes .practice-mode{width:72px}.practice-page .chords-card:not(.game-mode) .practice-options{grid-column:1 / -1;grid-row:2}.practice-page .chords-card:not(.game-mode) .practice-header .practice-summary{grid-column:2 / -2}}@media(max-width:850px){.practice-page.page{width:calc(100% - 24px)}.practice-page .practice-card{padding:16px}.practice-page .practice-card .practice-header{grid-template-columns:90px minmax(0,1fr) 60px;gap:12px 14px}.practice-page .practice-card .practice-header .scale-controls{grid-template-columns:repeat(6,minmax(0,1fr))}.practice-page .practice-card .practice-header .scale-style-control,.practice-page .practice-card .practice-header .scale-type-control{grid-column:span 3}.practice-page .practice-card .practice-header .scale-pattern-control{grid-column:1 / -1}.practice-page .practice-card .practice-header :is(.scale-position-control,.scale-direction-control,.play-scale-button){grid-column:span 2}}@media(max-width:520px){.practice-page.page{width:calc(100% - 16px)}.practice-page .practice-card{padding:12px}.practice-page .practice-card .practice-header{grid-template-columns:68px minmax(0,1fr) 45px;gap:12px 10px;padding-bottom:14px;margin-bottom:14px}.practice-page .practice-card .practice-controls{gap:12px;min-height:62px}.practice-page .practice-card .practice-modes{grid-template-columns:repeat(2,56px);gap:6px}.practice-page .practice-card .practice-modes .practice-mode{width:56px;height:44px;padding:0 4px;font-size:10px}.practice-page .practice-card .practice-header .practice-volume{flex:1;width:auto;max-width:240px}.practice-page .practice-card .practice-header .practice-input-status{font-size:8px}.practice-page .practice-card .practice-header .practice-volume-control{grid-template-columns:minmax(0,1fr) 28px;column-gap:4px}.practice-page .practice-card .practice-header .practice-question{padding-left:10px}.practice-page .practice-card .practice-header .practice-question strong,.practice-page .scales-card.learn-mode .practice-summary strong{font-size:clamp(23px,6vw,30px)}.practice-page .practice-card .practice-header .practice-question>span{font-size:8px;letter-spacing:.08em}.practice-page .practice-card .practice-header .practice-question p,.practice-page .practice-card .practice-header .practice-question small{font-size:10px}.practice-page .practice-card .practice-header .practice-stat strong,.practice-page .practice-card .practice-header .practice-timer strong{font-size:28px}.practice-page .practice-card .practice-header .practice-stat>span:not(.learn-progress-track),.practice-page .practice-card .practice-stat>label,.practice-page .practice-card .practice-header .practice-timer>span{font-size:8px;letter-spacing:.06em}.practice-page .practice-card .practice-header .practice-stat small,.practice-page .practice-card .practice-header .practice-stat em{font-size:9px}.practice-page .practice-card .practice-header .learn-level-control{grid-template-columns:1fr;gap:4px}.practice-page .practice-card .practice-header .learn-level-control input{width:62px;height:40px}.practice-page .practice-card .practice-header .learn-level-control>small span{display:inline}.practice-page .practice-card .practice-header .learn-progress-track{margin-top:0}.practice-page .practice-card .practice-header :is(.practice-feedback,.game-feedback,.chord-game-feedback){padding-right:122px;font-size:10px}.practice-page .practice-card .practice-header .learn-feedback,.practice-page .practice-card .practice-header .scale-game-message-row{padding-right:0}.practice-page .practice-card .practice-header .scale-game-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.practice-page .practice-card .practice-options>label{flex:1;width:auto}.practice-page .practice-card .practice-header .scale-game-feedback{font-size:10px}}