:root{color:#1d201d;background:#f6f2ea;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;min-height:100svh;background:linear-gradient(135deg,rgba(39,122,91,.12),transparent 34%),linear-gradient(220deg,rgba(199,80,61,.11),transparent 40%),#f6f2ea;overscroll-behavior-y:contain}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:rgba(39,122,91,.18)}button:disabled{cursor:default}.iconTextButton:disabled,.iconButton:disabled{transform:none;opacity:.46;filter:saturate(.4);box-shadow:none}.appShell{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;width:min(1440px,100%);min-height:100vh;min-height:100svh;margin:0 auto;padding:calc(24px + env(safe-area-inset-top)) calc(24px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(24px + env(safe-area-inset-left))}.quizLayout{display:flex;flex-direction:column;gap:18px;min-width:0}.appHeader{display:flex;align-items:center;justify-content:space-between;gap:16px}.headerActions{display:flex;flex:0 0 auto;flex-wrap:wrap;gap:8px;justify-content:flex-end}.eyebrow{margin:0 0 4px;color:#6d4e2e;font-size:.78rem;font-weight:800;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(2rem,5vw,4.2rem);line-height:1;letter-spacing:0}h2{margin-bottom:0;font-size:1.15rem}h3{margin-bottom:12px;font-size:.96rem}.iconTextButton,.iconButton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:0;border-radius:8px;font-weight:800;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.iconTextButton{padding:0 16px}.iconTextButton:hover,.iconButton:hover{transform:translateY(-1px)}.iconTextButton:focus-visible,.iconButton:focus-visible,.answerButton:focus-visible,.fretToggle:focus-visible,.segmentButton:focus-visible{outline:3px solid rgba(38,141,105,.35);outline-offset:2px}.primaryButton{color:#fdfbf6;background:#277a5b;box-shadow:0 10px 22px #277a5b38}.startButton{min-width:180px;color:#fdfbf6;background:#277a5b;box-shadow:0 12px 28px #277a5b3d}.secondaryButton,.ghostButton{color:#24312c;background:#fffaf1;box-shadow:0 1px #24312c1a}.nextButton{color:#fffaf6;background:#c7503d;box-shadow:0 10px 22px #c7503d2e}.iconButton{width:42px;height:42px;padding:0}.statusBar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.statusBar>div{min-width:0;padding:14px 16px;border:1px solid rgba(69,47,27,.14);border-radius:8px;background:#fffaf1d1}.statusLabel{display:block;margin-bottom:4px;color:#6c6b5f;font-size:.78rem;font-weight:700}.statusBar strong{display:block;overflow-wrap:anywhere;font-size:1.15rem}.startPanel{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px;border:1px solid rgba(69,47,27,.14);border-radius:8px;background:#fffaf1;box-shadow:0 18px 50px #4b361d1f}.startPanel h2{margin-bottom:6px;font-size:1.35rem}.startPanel p{max-width:540px;margin-bottom:0;color:#5f5a4f;font-weight:700}.timeAttackStartPanel{border-color:#8b530738;background:radial-gradient(circle at 84% 24%,rgba(199,80,61,.1),transparent 28%),#fff7e9}.countdownStartPanel{justify-content:center;text-align:center}.countdownStartPanel p{margin:0 auto}.countdownDisplay{display:inline-grid;place-items:center;width:clamp(86px,11vw,124px);height:clamp(86px,11vw,124px);margin-top:18px;border:1px solid rgba(139,83,7,.26);border-radius:999px;color:#fffaf2;background:radial-gradient(circle at 34% 24%,rgba(255,255,255,.32),transparent 30%),linear-gradient(135deg,#9a5b08,#4a2600);font-size:clamp(2.8rem,7vw,4.8rem);font-weight:950;line-height:1;box-shadow:0 18px 36px #5730002e}.fretboardShell{overflow-x:hidden;padding:14px;border:1px solid rgba(69,47,27,.16);border-radius:8px;background:#fffaf1;box-shadow:0 18px 50px #4b361d1f}.fretNumbers,.stringRow{display:grid;grid-template-columns:52px repeat(24,minmax(42px,1fr));width:100%;min-width:0}.fretNumbers{margin-bottom:4px;color:#6f5942;font-size:.75rem;font-weight:800;text-align:center}.fretboard{overflow:visible;width:100%;border:1px solid #4a2e1e;border-radius:8px;background:linear-gradient(90deg,#7c4929,#a5673a 42%,#8c542d)}.stringRow{position:relative;min-height:54px}.stringLabel{display:flex;align-items:center;justify-content:center;border-right:4px solid #25140d;color:#fff6e6;background:#312117;font-size:.82rem;font-weight:800}.stringLabelText{position:relative;z-index:1}.openStringLabel .stringLabelText{opacity:.38}.openStringBadge{position:absolute;top:50%;left:var(--open-string-badge-x, calc(clamp(34px, 11%, 52px) - 4px) );z-index:12;min-width:clamp(26px,4.2vw,34px);min-height:clamp(26px,4.2vw,34px);pointer-events:none;transform:translate(-50%,-50%)}.fretCell{position:relative;display:grid;place-items:center;min-width:0;border-right:2px solid rgba(235,219,186,.86)}.fretCell:before{position:absolute;top:0;right:0;bottom:0;left:0;content:"";background:linear-gradient(180deg,transparent,rgba(255,255,255,.08),transparent);opacity:.55}.stringLine{position:absolute;left:0;right:0;top:50%;height:2px;transform:translateY(-50%);background:linear-gradient(180deg,#fafafa,#b5b5b5 55%,#777);box-shadow:0 1px 2px #00000042}.stringRow[data-string-number="1"] .stringLine{height:1px}.stringRow[data-string-number="2"] .stringLine{height:1.3px}.stringRow[data-string-number="3"] .stringLine{height:1.7px}.stringRow[data-string-number="4"] .stringLine{height:2.1px}.stringRow[data-string-number="5"] .stringLine{height:2.6px}.stringRow[data-string-number="6"] .stringLine{height:3px}.withMarker:after{position:absolute;inset:50% auto auto 50%;width:9px;height:9px;border-radius:999px;background:#fff5da8a;content:"";transform:translate(-50%,-50%)}.doubleMarker:after{height:24px;border-radius:999px;box-shadow:0 -15px #fff5da8a,0 15px #fff5da8a;background:transparent}.noteBadge{position:relative;z-index:2;display:grid;place-items:center;min-width:clamp(26px,6.4vw,34px);min-height:clamp(26px,6.4vw,34px);padding:0 6px;border:2px solid rgba(255,255,255,.74);border-radius:999px;color:#17201b;font-size:clamp(.66rem,2.7vw,.86rem);font-weight:900;line-height:1;box-shadow:0 0 0 5px #fff3,0 0 28px currentColor}.rootBadge{background:#ffd166}.targetBadge{background:#5fe0c0}.rootCell{background:#ffd16638}.targetCell{background:#5fe0c033}.controlRow{display:flex;flex-wrap:wrap;gap:10px}.audioMessage{margin:-6px 0 0;color:#8b3c2f;font-weight:700}.answerSection{display:flex;flex-direction:column;gap:12px}.sectionHeader,.panelHeader,.panelTitle{display:flex;align-items:center}.sectionHeader,.panelHeader{justify-content:space-between;gap:12px}.panelTitle{gap:8px}.panelTitle h2{margin:0}.answerGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:9px}.answerButton{min-height:48px;padding:8px 10px;border:1px solid rgba(69,47,27,.16);border-radius:8px;color:#24241f;background:#fffaf1;font-weight:800;line-height:1.18;box-shadow:0 1px #24312c14;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}@media(hover:hover)and (pointer:fine){.answerButton:not(:disabled):hover{border-color:#277a5b7a;background:#f8efe0}}.selectedAnswer{border-color:#c7503d;background:#f8ddd6;box-shadow:0 0 0 3px #c7503d2e,0 10px 24px #c7503d24}.correctAnswer{border-color:#277a5b;background:#daf4e8;box-shadow:0 0 0 3px #277a5b33,0 10px 24px #277a5b29}.guidedAnswer{position:relative;z-index:2;border-color:#277a5b;background:#dff8eb;box-shadow:0 0 0 3px #277a5b33,0 0 0 8px #277a5b1a,0 12px 28px #277a5b38}.answerButton:disabled:not(.guidedAnswer):not(.selectedAnswer):not(.correctAnswer){opacity:.38;filter:saturate(.28)}.answerButton:disabled.selectedAnswer,.answerButton:disabled.correctAnswer{opacity:1;filter:none}.feedback{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;border-radius:8px}.feedback h2{margin-bottom:4px}.feedback p{margin-bottom:0}.correctFeedback{border:1px solid rgba(39,122,91,.28);background:#daf4e8}.wrongFeedback{border:1px solid rgba(199,80,61,.28);background:#f9e1d7}.answerDivider{color:#776b5e}.noteReveal{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.noteReveal span{padding:6px 9px;border-radius:999px;background:#ffffffa6;font-weight:800}.noteReveal p{flex:1 1 100%;margin:0;color:#514a40;font-size:.82rem;font-weight:800;line-height:1.4;text-align:right}.settingsPanel{position:sticky;top:24px;align-self:start;width:min(420px,92vw);max-height:calc(100vh - 48px);overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:18px;border:1px solid rgba(69,47,27,.16);border-radius:8px;background:#fffaf1;box-shadow:0 18px 50px #4b361d2e;-webkit-overflow-scrolling:touch}.settingsWarning{margin:12px 0 0;padding:10px 12px;border-radius:8px;color:#813326;background:#f8ddd6;font-weight:800}.settingsCategoryMenu{display:grid;gap:10px;margin-top:18px}.settingsCategoryButton{display:grid;grid-template-columns:48px minmax(0,1fr) 22px;gap:12px;align-items:center;width:100%;min-height:78px;padding:12px;border:1px solid rgba(69,47,27,.14);border-radius:8px;color:#161612;background:#fffdf8;text-align:left}.settingsCategoryButton:hover{border-color:#277a5b57;background:#fffaf1}.settingsCategoryIcon{display:inline-grid;place-items:center;width:48px;height:48px;border:1px solid rgba(22,22,18,.12);border-radius:8px;color:#161612;background:#f8efe0}.settingsCategoryCopy{display:grid;gap:4px;min-width:0}.settingsCategoryCopy>span{font-weight:900;line-height:1.25}.settingsCategoryCopy small{color:#6c6b5f;font-size:.76rem;font-weight:700;line-height:1.4}.settingsCategoryArrow{color:#161612}.settingsBackButton{width:36px;height:36px;min-height:36px}.settingBlock{margin-top:18px;padding-top:16px;border-top:1px solid rgba(69,47,27,.13)}.settingsGroup{margin-top:18px;padding:14px;border:1px solid rgba(69,47,27,.13);border-radius:8px;background:#fffdf8b8}.settingsGroup+.settingsGroup{margin-top:16px}.settingsGroupHeader{display:grid;gap:4px}.settingsGroupHeader h3{margin:0;font-size:1rem}.settingsGroupHeader p,.settingHint{margin:0;color:#6c6b5f;font-size:.78rem;font-weight:700;line-height:1.45}.settingBlock h4{margin:0 0 12px;font-size:.96rem}.settingHint{margin:-5px 0 10px}.settingsPanel.tutorialSettingsActive{padding-bottom:calc(170px + env(safe-area-inset-bottom));scroll-padding:84px 16px calc(170px + env(safe-area-inset-bottom))}.tutorialSettingsActive .settingBlock,.tutorialSettingsActive .switchRow{transition:opacity .18s ease,filter .18s ease,box-shadow .18s ease,background .18s ease}.tutorialDimBlock,.tutorialDimItem{opacity:.3;filter:saturate(.35)}.tutorialFocusBlock,.tutorialFocusItem{position:relative;z-index:1;opacity:1;filter:none}.tutorialFocusBlock{margin-right:-8px;margin-left:-8px;padding:16px 8px 10px;border-radius:8px;background:#ffffff94;box-shadow:0 0 0 3px #277a5b3d,0 12px 30px #277a5b1f}.tutorialFocusItem{border-color:#277a5b6b;background:#fffaf1;box-shadow:0 0 0 3px #277a5b38,0 10px 24px #277a5b1a}.rootCandidateRow{display:grid;grid-template-columns:42px minmax(0,1fr);gap:9px;align-items:start;margin-bottom:12px}.rootCandidateLabel{padding-top:8px;font-size:.86rem;font-weight:900}.rootStringAccordion{display:grid;gap:8px}.rootStringItem{overflow:hidden;border:1px solid rgba(69,47,27,.14);border-radius:8px;background:#f8efe0}.activeRootStringItem{border-color:#277a5b75;background:#f0f9f3;box-shadow:inset 4px 0 #277a5b,0 8px 20px #277a5b14}.rootStringHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:50px;padding:10px 12px;border:0;color:#38271a;background:transparent;text-align:left}.rootStringHeaderText{display:grid;gap:3px}.rootStringHeaderText>span{font-weight:900;line-height:1.25}.rootStringHeaderText small{color:#6c6b5f;font-size:.76rem;font-weight:700;line-height:1.4}.activeRootStringItem .rootStringHeaderText>span,.activeIntervalSourceItem .intervalSourceHeaderText>span{color:#214f3b}.activeRootStringItem .rootStringHeaderText small,.activeIntervalSourceItem .intervalSourceHeaderText small{color:#277a5b}.rootStringHeaderActions,.intervalSourceHeaderActions{display:inline-flex;flex:0 0 auto;align-items:center;gap:8px}.selectionBadge{display:inline-flex;align-items:center;gap:4px;min-height:24px;padding:0 8px;border:1px solid rgba(39,122,91,.28);border-radius:999px;color:#1f684b;background:#e5f5eb;font-size:.72rem;font-weight:900;white-space:nowrap}.rootStringChevron{flex:0 0 auto;color:#6d4e2e;transition:transform .18s ease}.rootStringHeader[aria-expanded=true] .rootStringChevron{transform:rotate(180deg)}.rootStringPanel{padding:0 12px 12px;animation:accordionReveal .18s ease}.fretToggleGrid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}.fretToggle{display:flex;align-items:center;justify-content:center;gap:2px;min-height:34px;border:1px solid rgba(69,47,27,.16);border-radius:7px;color:#38271a;background:#f8efe0;font-size:.82rem;font-weight:800}.activeFretToggle{color:#fffaf6;background:#277a5b}.intervalToggleGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.intervalToggle{display:flex;align-items:center;gap:6px;min-height:38px;padding:7px 8px;border:1px solid rgba(69,47,27,.16);border-radius:8px;color:#38271a;background:#fffaf1;font-size:clamp(.68rem,2.25vw,.78rem);font-weight:800;letter-spacing:0;line-height:1.2;text-align:left}.activeIntervalToggle{border-color:#277a5b57;background:#e5f5eb}.intervalSelectAllToggle{width:100%;margin-bottom:8px}.intervalSelectAllToggle[aria-checked=true]{border-color:#277a5b57;color:#214f3b;background:#e5f5eb}.intervalCheck{display:inline-grid;flex:0 0 auto;place-items:center;width:17px;height:17px;border:1px solid rgba(39,122,91,.42);border-radius:5px;color:#fffaf6;background:#fffdf8}.activeIntervalToggle .intervalCheck,.intervalSelectAllToggle[aria-checked=true] .intervalCheck{background:#277a5b}.segmentedControl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:4px;border-radius:8px;background:#f0dec0}.toneControl{grid-template-columns:repeat(3,minmax(0,1fr))}.answerSymbolDisplayControl{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:14px}.answerSymbolDisplayControl .segmentButton{padding-inline:5px;font-size:clamp(.66rem,2vw,.78rem)}.toneControl+.subSettingTitle{margin-top:16px}.scaleControl{grid-template-columns:repeat(2,minmax(0,1fr))}.intervalSourceAccordion{display:grid;gap:8px}.intervalSourceItem{overflow:hidden;border:1px solid rgba(69,47,27,.14);border-radius:8px;background:#f8efe0}.activeIntervalSourceItem{border-color:#277a5b80;background:#f0f9f3;box-shadow:inset 4px 0 #277a5b,0 0 0 2px #277a5b1f,0 10px 24px #277a5b14}.expandedIntervalSourceItem{background:#fffaf1}.intervalSourceHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:52px;padding:10px 12px;border:0;color:#38271a;background:transparent;text-align:left}.intervalSourceHeaderText{display:grid;gap:3px}.intervalSourceHeaderText>span{font-weight:900;line-height:1.25}.intervalSourceHeaderText small,.intervalSourceAllNote,.intervalSourcePanelLabel{color:#6c6b5f;font-size:.76rem;font-weight:700;line-height:1.4}.intervalSourceChevron{flex:0 0 auto;color:#6d4e2e;transition:transform .18s ease}.intervalSourceHeader[aria-expanded=true] .intervalSourceChevron{transform:rotate(180deg)}.intervalSourcePanel{display:grid;gap:10px;padding:0 12px 12px;animation:accordionReveal .18s ease}.intervalSourcePanelLabel,.intervalSourceAllNote,.intervalSourcePanelHint{margin:0}@keyframes accordionReveal{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.segmentButton{min-height:40px;border:0;border-radius:6px;color:#5d422a;background:transparent;font-weight:900}.activeSegment{color:#17201b;background:#fffaf1;box-shadow:0 1px #24312c1a}.subSettingTitle{margin:0 0 8px;color:#6d4e2e;font-size:.82rem;line-height:1.2}.volumeControl{display:grid;gap:10px;margin-top:14px}.volumeRow{display:grid;gap:7px;padding:10px 12px;border:1px solid rgba(69,47,27,.13);border-radius:8px;background:#fffdf8}.volumeRow>span{display:flex;align-items:center;justify-content:space-between;gap:12px}.volumeLabel,.volumeValue{font-weight:800}.volumeValue{color:#277a5b;font-size:.82rem}.volumeRow input{width:100%;height:26px;accent-color:#277a5b}.volumeAdjuster{display:grid!important;grid-template-columns:32px minmax(0,1fr) 32px;gap:8px}.volumeStepButton{display:inline-grid;place-items:center;width:32px;height:32px;border:0;border-radius:8px;color:#24312c;background:#f8efe0}.volumeStepButton:not(:disabled):hover{background:#eadabc}.volumeStepButton:disabled{opacity:.38}.toggleStack{display:grid;gap:10px}.inlineToggleStack{margin-top:14px}.switchRow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px;border:1px solid rgba(69,47,27,.13);border-radius:8px;background:#fffdf8;font-weight:800}.switchCopy{display:grid;gap:3px}.switchCopy small{color:#6c6b5f;font-size:.76rem;font-weight:700;line-height:1.35}.switchRow input{flex:0 0 auto;width:44px;height:24px;accent-color:#277a5b}.intervalStatsTableWrap{overflow-x:hidden;border:1px solid rgba(69,47,27,.13);border-radius:8px;background:#fffdf8}.intervalStatsTable{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.82rem}.intervalStatsTable th,.intervalStatsTable td{padding:8px 10px;border-bottom:1px solid rgba(69,47,27,.1);text-align:right;line-height:1.25;overflow-wrap:anywhere}.intervalStatsTable th:nth-child(1),.intervalStatsTable td:nth-child(1){width:42%}.intervalStatsTable th:nth-child(2),.intervalStatsTable td:nth-child(2){width:17%}.intervalStatsTable th:nth-child(3),.intervalStatsTable td:nth-child(3),.intervalStatsTable th:nth-child(4),.intervalStatsTable td:nth-child(4){width:20.5%}.intervalStatsTable th:first-child{text-align:left}.intervalStatsTable thead th{color:#6d4e2e;background:#f8efe0;font-size:.74rem}.intervalStatsTable tbody tr:last-child th,.intervalStatsTable tbody tr:last-child td{border-bottom:0}.tutorialPanel{position:fixed;right:calc(20px + env(safe-area-inset-right));bottom:calc(20px + env(safe-area-inset-bottom));left:calc(20px + env(safe-area-inset-left));z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:780px;margin:0 auto;padding:16px;border:1px solid rgba(69,47,27,.16);border-radius:8px;color:#24241f;background:#fffaf1;box-shadow:0 18px 50px #4b361d3d}.tutorialConfirming:before,.tutorialHelpReminderActive:before,.tutorialPracticeReading:before{position:fixed;top:0;right:0;bottom:0;left:0;z-index:15;background:#161b1894;content:""}.tutorialConfirming .quizLayout,.tutorialConfirming .settingsPanel,.tutorialHelpReminderActive .quizLayout,.tutorialHelpReminderActive .settingsPanel,.tutorialPracticeReading .quizLayout,.tutorialPracticeReading .settingsPanel{pointer-events:none}.tutorialConfirming .tutorialPanel,.tutorialHelpReminderActive .tutorialHelpReminder,.tutorialPracticeReading .tutorialPanel{z-index:21;box-shadow:0 0 0 4px #ffffff38,0 24px 70px #17140f5c}.tutorialSettingsGuide .tutorialPanel{z-index:240}.tutorialPanelConfirm{top:50%;right:calc(20px + env(safe-area-inset-right));bottom:auto;left:calc(20px + env(safe-area-inset-left));max-width:560px;transform:translateY(-50%)}.tutorialPanel h2{margin-bottom:6px;font-size:1rem}.tutorialPanel p{margin-bottom:0;color:#514a40;font-weight:700;line-height:1.45}.tutorialKicker{margin-bottom:4px;color:#277a5b;font-size:.72rem;font-weight:900;text-transform:uppercase}.tutorialSuccessLabel{display:inline-grid;place-items:center;min-height:26px;margin:0 0 6px!important;padding:0 10px;border-radius:999px;color:#fff8e8!important;background:#277a5b;font-size:.78rem;font-weight:950;line-height:1}.tutorialActions{display:flex;flex:0 0 auto;flex-wrap:wrap;gap:8px;justify-content:flex-end}.tutorialStartQuizButton{gap:0;white-space:nowrap}.tutorialStartButtonLine{display:inline}.tutorialPanelCondensed{align-items:center;gap:12px;max-width:520px;padding:12px}.tutorialPanelCondensed:after{position:absolute;right:34px;bottom:-8px;width:16px;height:16px;border-right:1px solid rgba(69,47,27,.16);border-bottom:1px solid rgba(69,47,27,.16);background:#fffaf1;content:"";transform:rotate(45deg)}.tutorialHelpReminder{position:fixed;right:calc(20px + env(safe-area-inset-right));bottom:auto;left:calc(20px + env(safe-area-inset-left));top:50%;z-index:21;display:grid;gap:12px;max-width:500px;margin:0 auto;padding:16px;border:1px solid rgba(69,47,27,.16);border-radius:8px;color:#24241f;background:#fffaf1;box-shadow:0 18px 50px #4b361d38;transform:translateY(-50%)}.tutorialHelpReminderActions{display:flex;align-items:center;justify-content:flex-end}.tutorialCloseButton{min-width:92px}.tutorialHelpReminder p{margin:0;color:#514a40;font-size:.92rem;font-weight:800;line-height:1.45}.tutorialHelpReminderCheck{display:inline-flex;align-items:center;gap:8px;min-height:36px;color:#514a40;font-size:.86rem;font-weight:800}.tutorialHelpReminderCheck input{width:18px;height:18px;margin:0;accent-color:#277a5b}.tutorialCompactCopy{min-width:0}.tutorialCompactText{margin:0;color:#514a40;font-size:.86rem;font-weight:800;line-height:1.25}.tutorialCompactActions{position:relative;z-index:1;flex-wrap:nowrap}.tutorialMiniButton{min-height:36px;padding:0 10px}.tutorialHint{align-self:center;color:#6c6b5f;font-size:.8rem;font-weight:800}.tutorialList{display:grid;gap:4px;margin:0;padding-left:18px;color:#514a40;font-size:.88rem;font-weight:700;line-height:1.4}@media(max-width:960px){.appShell{grid-template-columns:1fr}.settingsPanel{position:fixed;top:calc(16px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));bottom:auto;left:calc(16px + env(safe-area-inset-left));z-index:220;width:auto;height:calc(100vh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:calc(100vh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:0;overflow-y:auto;touch-action:pan-y}}@media(max-height:760px)and (min-width:681px){.appShell{min-height:100vh;min-height:100dvh;padding:calc(14px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left))}.quizLayout{gap:8px}h1{font-size:clamp(1.5rem,3vw,2.4rem)}h2{font-size:1rem}.eyebrow{margin-bottom:2px;font-size:.66rem}.statusBar>div{padding:8px 10px}.statusLabel{margin-bottom:2px;font-size:.68rem}.statusBar strong{font-size:.96rem}.fretboardShell{padding:8px}.stringRow{min-height:36px}.fretNumbers{margin-bottom:2px;font-size:.68rem}.noteBadge{min-width:28px;min-height:28px;font-size:.72rem}.controlRow{gap:6px}.iconTextButton{min-height:38px}.answerSection,.answerGrid{gap:6px}.answerButton{min-height:38px;padding:5px 8px;font-size:.82rem}.feedback{padding:10px 12px}}@media(max-width:680px){body{overflow:hidden}.appShell{height:100vh;height:100dvh;min-height:0;padding:calc(8px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left));overflow:hidden}.quizLayout{height:100%;min-height:0;gap:clamp(4px,.9dvh,8px);overflow:hidden}.settingsPanel{top:0;right:0;bottom:0;left:0;z-index:220;width:100vw;width:100dvw;height:100vh;height:100dvh;max-height:none;padding:calc(14px + env(safe-area-inset-top)) calc(14px + env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)) calc(14px + env(safe-area-inset-left));border:0;border-radius:0;box-shadow:none}.settingsPanel .panelHeader{position:sticky;top:calc(-14px - env(safe-area-inset-top));z-index:2;margin:calc(-14px - env(safe-area-inset-top)) calc(-14px - env(safe-area-inset-right)) 0 calc(-14px - env(safe-area-inset-left));padding:calc(14px + env(safe-area-inset-top)) calc(14px + env(safe-area-inset-right)) 12px calc(14px + env(safe-area-inset-left));border-bottom:1px solid rgba(69,47,27,.12);background:#fffaf1}.settingsCategoryMenu{gap:12px;margin-top:14px}.settingsCategoryButton{min-height:86px;grid-template-columns:48px minmax(0,1fr) 20px}.settingsGroup{margin-top:14px;padding:12px}.appHeader{align-items:center;flex-direction:row;gap:8px}.appHeader>div{min-width:0}.eyebrow{margin-bottom:1px;font-size:clamp(.52rem,1.9vw,.68rem)}h1{font-size:clamp(1.08rem,6vw,1.55rem);line-height:1.05}h2{font-size:.92rem}.iconTextButton{min-height:clamp(34px,5.8dvh,40px);padding:0 10px}.secondaryButton{flex:0 0 auto}.headerActions{gap:5px}.headerActions .iconTextButton{gap:5px;padding:0 8px}.statusBar{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.statusBar>div{padding:6px}.statusLabel{margin-bottom:1px;font-size:clamp(.56rem,2vw,.66rem)}.statusBar strong{font-size:clamp(.72rem,3.4vw,.9rem);line-height:1.1}.controlRow{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:5px}.startPanel{align-items:stretch;flex-direction:column;gap:10px;padding:14px}.startPanel h2{font-size:1rem}.startPanel p{font-size:.82rem}.fretboardShell{flex:0 0 auto;padding:6px}.fretNumbers{margin-bottom:2px;font-size:clamp(.54rem,2.1vw,.66rem)}.stringRow{min-height:clamp(28px,5.2dvh,40px)}.stringLabel{border-right-width:3px;font-size:clamp(.58rem,2.3vw,.72rem)}.fretCell{border-right-width:1px}.withMarker:after{width:7px;height:7px}.doubleMarker:after{height:18px;box-shadow:0 -11px #fff5da8a,0 11px #fff5da8a}.noteBadge{min-width:clamp(22px,6.6vw,30px);min-height:clamp(22px,6.6vw,30px);padding:0 3px;border-width:1px;font-size:clamp(.56rem,2.6vw,.78rem);box-shadow:0 0 0 3px #fff3,0 0 18px currentColor}.audioMessage{margin:0;font-size:.72rem;line-height:1.15}.answerSection{min-height:0;gap:4px}.sectionHeader h2{font-size:.82rem}.answerGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.answerButton{min-height:clamp(29px,5.2dvh,39px);padding:3px 4px;border-radius:6px;font-size:clamp(.6rem,2.75vw,.82rem);line-height:1.08}.feedback{align-items:stretch;flex-direction:column;gap:5px;padding:7px 8px}.feedback h2{margin-bottom:1px;font-size:.88rem}.feedback p{font-size:.72rem;line-height:1.25}.noteReveal{justify-content:flex-start;gap:4px}.noteReveal span{padding:3px 5px;font-size:.68rem}.noteReveal p{font-size:.68rem;line-height:1.25;text-align:left}.fretToggleGrid{grid-template-columns:repeat(6,minmax(0,1fr))}.scaleControl{grid-template-columns:repeat(2,minmax(0,1fr))}.scaleControl .segmentButton{min-height:36px;padding:0 5px;font-size:.72rem;line-height:1.12}.volumeRow{padding:8px}.intervalStatsTable{font-size:.72rem}.intervalStatsTable th,.intervalStatsTable td{padding:6px 5px}.tutorialPanel{right:calc(8px + env(safe-area-inset-right));bottom:calc(8px + env(safe-area-inset-bottom));left:calc(8px + env(safe-area-inset-left));align-items:stretch;flex-direction:column;gap:9px;max-height:min(48dvh,310px);overflow-y:auto;padding:10px;-webkit-overflow-scrolling:touch}.tutorialPanelConfirm{top:50%;bottom:auto;max-height:min(80dvh,360px);transform:translateY(-50%)}.tutorialPanelCondensed{top:calc(112px + env(safe-area-inset-top));right:calc(10px + env(safe-area-inset-right));bottom:auto;left:calc(10px + env(safe-area-inset-left));align-items:center;flex-direction:row;gap:8px;width:min(420px,calc(100vw - 20px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:none;margin:0 auto;overflow:visible;padding:8px 9px}.tutorialPanelCondensed:after{right:42px}.tutorialHelpReminder{right:calc(8px + env(safe-area-inset-right));bottom:auto;left:calc(8px + env(safe-area-inset-left));top:50%;gap:9px;max-height:min(80dvh,310px);overflow-y:auto;padding:10px}.tutorialHelpReminder p{font-size:.76rem;line-height:1.35}.tutorialHelpReminderCheck{min-height:34px;font-size:.72rem}.tutorialCompactText{font-size:.72rem;line-height:1.18}.tutorialCompactActions{display:flex;flex:0 0 auto;gap:5px}.tutorialMiniButton{min-height:30px;padding:0 8px;font-size:.68rem}.tutorialPanel h2{margin-bottom:3px;font-size:.88rem}.tutorialPanel p,.tutorialList{font-size:.72rem;line-height:1.3}.tutorialKicker{margin-bottom:2px;font-size:.62rem}.tutorialSuccessLabel{min-height:22px;margin-bottom:4px!important;padding:0 8px;font-size:.68rem}.tutorialActions{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px}.tutorialStartQuizButton{flex-direction:column;gap:1px;min-height:46px;padding:5px 10px;white-space:normal;line-height:1.08}.tutorialStartButtonLine{display:block;white-space:nowrap}.tutorialHint{font-size:.68rem}}@media(max-width:480px){.fretboardShell{padding:5px}.fretNumbers{font-size:.66rem}.stringRow{min-height:clamp(26px,5.1dvh,34px)}.stringLabel{border-right-width:3px;font-size:.72rem}.fretCell{border-right-width:1px}.withMarker:after{width:7px;height:7px}.doubleMarker:after{height:18px;box-shadow:0 -11px #fff5da8a,0 11px #fff5da8a}.noteBadge{padding:0 4px;border-width:1px;box-shadow:0 0 0 3px #fff3,0 0 18px currentColor}}@media(max-height:560px)and (max-width:960px){body{overflow:hidden}.appShell{height:100vh;height:100dvh;min-height:0;padding:calc(6px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left));overflow:hidden}.quizLayout{height:100%;min-height:0;gap:4px;overflow:hidden}.appHeader{align-items:center;gap:8px}h1{font-size:clamp(1rem,3.3vw,1.5rem);line-height:1}.eyebrow{margin-bottom:0;font-size:.52rem}.iconTextButton{min-height:32px;padding:0 10px}.statusBar{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.statusBar>div{padding:4px 6px}.statusLabel{margin-bottom:0;font-size:.54rem}.statusBar strong{font-size:.76rem;line-height:1.05}.fretboardShell{padding:4px}.fretNumbers{margin-bottom:1px;font-size:.52rem}.stringRow{min-height:clamp(20px,7.6dvh,30px)}.stringLabel{border-right-width:3px;font-size:.58rem}.noteBadge{min-width:21px;min-height:21px;padding:0 3px;border-width:1px;font-size:.58rem;box-shadow:0 0 0 2px #fff3,0 0 14px currentColor}.controlRow{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:4px}.sectionHeader h2{font-size:.72rem}.answerSection{gap:3px}.answerGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px}.answerButton{min-height:clamp(24px,7.2dvh,32px);padding:2px 3px;border-radius:5px;font-size:clamp(.54rem,1.8vw,.72rem);line-height:1.05}.tutorialStartQuizButton{min-height:40px;padding:4px 8px;font-size:.72rem}.feedback{gap:4px;padding:5px 7px}.feedback h2{font-size:.76rem}.feedback p,.noteReveal span{font-size:.62rem}.noteReveal p{font-size:.62rem;line-height:1.18;text-align:left}.tutorialPanel{max-height:min(48dvh,230px);padding:8px}.tutorialPanelConfirm{max-height:min(80dvh,310px)}.tutorialPanelCondensed{top:calc(78px + env(safe-area-inset-top));right:calc(8px + env(safe-area-inset-right));bottom:auto;left:calc(8px + env(safe-area-inset-left));align-items:center;flex-direction:row;gap:8px;width:min(520px,calc(100vw - 16px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-height:none;margin:0 auto;overflow:visible;padding:6px 8px}.tutorialCompactText{font-size:.66rem}.tutorialMiniButton{min-height:28px;padding:0 7px;font-size:.62rem}.noteReveal{gap:3px}.noteReveal span{padding:2px 4px}}body{background:linear-gradient(180deg,#fffdf8,#f8f2e8 54%,#f4ecdf)}.appShell{width:min(1560px,100%);gap:18px;padding:calc(16px + env(safe-area-inset-top)) calc(28px + env(safe-area-inset-right)) calc(26px + env(safe-area-inset-bottom)) calc(28px + env(safe-area-inset-left))}.quizLayout{gap:16px}.appHeader{min-height:70px;padding-bottom:12px;border-bottom:1px solid rgba(72,52,34,.14)}.brandArea{display:flex;align-items:center;gap:14px;min-width:0}.brandMark{display:inline-grid;flex:0 0 auto;place-items:center;width:46px;height:46px;border-radius:999px;color:#fff8e8;background:radial-gradient(circle at 34% 24%,rgba(255,255,255,.34),transparent 26%),linear-gradient(145deg,#9a5b08,#5f3400);box-shadow:inset 0 1px #ffffff47,0 12px 24px #5f34002e}.eyebrow{color:#8a5b19;font-size:.72rem;letter-spacing:.08em}h1{font-size:clamp(1.55rem,2.6vw,2.25rem);color:#221913}.headerActions{align-items:stretch;gap:10px}.navButton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 18px;border:1px solid rgba(72,52,34,.18);border-radius:8px;color:#4f3f32;background:#fffcf6b3;font-weight:900;box-shadow:0 8px 18px #3627190a}.navButton:hover{border-color:#9a5b0847;background:#fff7eb}.activeNavButton{color:#8b5307;background:#fff4e3;border-color:#9a5b085c;box-shadow:inset 0 -3px #8b5307,0 12px 24px #8b530714}.mobileMenuButton,.mobileSettingsButton{display:none}.statusBar{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:16px 18px;border:1px solid rgba(72,52,34,.16);border-radius:8px;background:#fffcf6db;box-shadow:0 12px 38px #4b361d14}.statusBar>div{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:center;min-height:54px;padding:0 18px;border:0;border-right:1px solid rgba(72,52,34,.18);border-radius:0;background:transparent}.statusBar>div:last-child{border-right:0}.statusIcon{grid-row:span 2;color:#7a746e}.statusLabel{margin:0;color:#756c63;font-size:.78rem}.statusBar strong{color:#2a2019;font-size:1.5rem;line-height:1.05}.trainingSummary{display:grid;grid-template-columns:1fr 1.55fr;align-items:center;gap:12px;padding:0;border:0;border-radius:0;background:transparent}.trainingSummary>div{position:relative;min-width:0;padding:0;border-right:0;text-align:center}.trainingSummary>div:last-child{border-right:0}.summaryLabel{display:block;margin-bottom:5px;color:#756c63;font-size:.76rem;font-weight:800}.trainingSummary strong{display:block;overflow-wrap:anywhere;color:#2a2019;font-size:1.12rem}.summarySelectButton{display:grid;align-items:center;width:100%;min-height:74px;padding:12px 16px;border:1px solid rgba(72,52,34,.16);border-radius:8px;color:#2a2019;background:#fffcf6db;box-shadow:0 12px 28px #4b361d14;text-align:center;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease}.summarySelectButton:hover:not(:disabled),.summarySelectButton[aria-expanded=true]{border-color:#9a5b0857;background:#fff4e3;box-shadow:0 14px 30px #8b53071a}.summarySelectButton:active:not(:disabled){transform:translateY(1px)}.summarySelectValue{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;max-width:100%}.summarySelectButton strong{min-width:0;font-size:1.12rem}.summarySelectButton .summarySelectValue strong{flex:0 1 auto;width:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.summaryOptions{position:absolute;top:calc(100% + 12px);left:12px;z-index:30;display:grid;gap:6px;width:min(460px,82vw);max-height:min(72dvh,calc(100dvh - 330px),620px);padding:8px;overflow-y:auto;overscroll-behavior:contain;border:1px solid rgba(72,52,34,.18);border-radius:8px;background:#fffdf8;box-shadow:0 20px 44px #36271929}.summarySelector:not(.modeSummarySelector)>.summaryOptions{right:0;left:auto}.summaryOption{display:grid;gap:3px;align-content:center;min-height:42px;padding:0 12px;border:1px solid transparent;border-radius:7px;color:#3d3027;background:transparent;font-weight:850;text-align:left}.summaryOption small{color:#756c63;font-size:.72rem;font-weight:750;line-height:1.3}.summaryOption:hover,.activeSummaryOption{border-color:#9a5b0838;background:#fff4e3}.summaryNestedPanel{display:grid;gap:8px;margin-top:4px;padding:10px;border-top:1px solid rgba(72,52,34,.12)}.summaryNestedTitle{color:#756c63;font-size:.74rem;font-weight:900}.summaryScaleGrid,.summaryIntervalGrid{display:grid;gap:7px}.summaryScaleGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.summaryIntervalGrid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:220px;overflow-y:auto;padding-right:2px}.summaryScaleButton,.summaryIntervalButton{min-height:42px;padding:8px 10px;border:1px solid rgba(72,52,34,.14);border-radius:7px;color:#3d3027;background:#fffaf2;font-weight:850;text-align:left}.summaryScaleButton{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:center}.summaryScaleCopy{display:grid;gap:2px;min-width:0}.summaryScaleButton small{color:#7b7167;font-size:.68rem;font-weight:800;line-height:1.15}.summaryIntervalButton{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-color:#452f1b2e;background:#fffaf1;text-align:center}.summaryScaleButton:hover,.summaryIntervalButton:hover,.activeSummaryChoice{border-color:#2a705357;background:#edf8f0;color:#214f3b}.summaryIntervalButton.activeSummaryChoice{border-color:#277a5b57;background:#e5f5eb}.summarySelectAllButton{display:inline-flex;align-items:center;justify-content:flex-start;gap:8px;min-height:38px;padding:7px 10px;border:1px solid rgba(69,47,27,.18);border-radius:7px;color:#3d3027;background:#fffaf1;font-weight:850}.summarySelectAllButton[aria-checked=true]{border-color:#277a5b57;color:#214f3b;background:#e5f5eb}.summaryIntervalCheck{display:inline-grid;flex:0 0 auto;place-items:center;width:17px;height:17px;border:1px solid rgba(39,122,91,.42);border-radius:5px;color:#fffaf6;background:#fffdf8}.summaryIntervalButton.activeSummaryChoice .summaryIntervalCheck,.summaryScaleButton.activeSummaryChoice .summaryIntervalCheck,.summarySelectAllButton[aria-checked=true] .summaryIntervalCheck{background:#277a5b}.summarySettingsWarning{margin:2px 4px;padding:9px 10px;border-left:4px solid #c7503d;border-radius:6px;color:#7b2f26;background:#fff0ec;font-size:.78rem;font-weight:850;line-height:1.4}.summaryMenuActions{position:sticky;bottom:0;z-index:2;display:flex;justify-content:flex-end;padding:7px 2px 1px;border-top:1px solid rgba(72,52,34,.12);background:#fffdf8}.summarySaveButton{min-height:38px;padding:0 14px;border-radius:8px}.mobileSummaryDialog{display:none}.replayButton{border:1px solid rgba(116,74,17,.34);color:#4a2e1e;background:#fffaf2;box-shadow:none}.startPanel{min-height:280px;padding:32px;border-color:#48342229;background:radial-gradient(circle at 86% 26%,rgba(209,143,31,.12),transparent 26%),#fffaf1}.questionPrompt{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:62px}.questionPromptCopy{display:flex;align-items:center;gap:22px;min-width:0}.questionBadge{display:inline-grid;place-items:center;min-width:136px;min-height:50px;padding:0 18px;border-radius:8px;color:#fff8e8;background:linear-gradient(145deg,#633500,#2f1700);font-size:1rem;font-weight:900;box-shadow:0 12px 24px #2f170029}.questionPrompt p{margin:0;color:#2a2019;font-weight:900;line-height:1.5}.promptTextCompact{display:none}.inlineNote{display:inline-grid;place-items:center;width:30px;height:30px;margin:0 7px;border-radius:999px;font-weight:900}.rootInline{background:#ffd37a}.targetInline{background:#ffd6bd}.replayButton{min-width:150px}.fretboardShell{position:relative;overflow:visible;padding:0 0 20px;border:0;border-radius:0;background:transparent;box-shadow:none}.fretNumbers{position:relative;z-index:2;margin:0 0 7px;padding:0 18px;color:#7c6c58;font-size:.75rem}.fretboardFrame{position:relative;filter:drop-shadow(0 24px 26px rgba(28,15,8,.3)) drop-shadow(0 4px 5px rgba(28,15,8,.18))}.headstockSlice{position:absolute;inset:-16px auto -12px 0;width:clamp(42px,7vw,86px);border-radius:36px 4px 4px 36px;background:radial-gradient(circle at 14% 30%,rgba(255,169,56,.28),transparent 20%),linear-gradient(90deg,#0f0b08,#2d1709 52%,#0b0705);clip-path:polygon(0 0,100% 8%,100% 92%,0 100%)}.fretboard{--fretboard-edge-top-glow: rgba(255, 239, 198, .12);--fretboard-edge-bottom-shade: rgba(0, 0, 0, .28);--fretboard-inset-top-line: rgba(255, 239, 198, .18);--fretboard-inset-upper-glow: rgba(255, 229, 174, .06);--fretboard-inset-lower-shadow: rgba(0, 0, 0, .46);--fretboard-overlay-top-glow: rgba(255, 248, 224, .07);--fretboard-overlay-bottom-shade: rgba(0, 0, 0, .2);--fretboard-surface-top-glow: rgba(255, 247, 222, .16);--fretboard-surface-bottom-shade: rgba(0, 0, 0, .34);--fretboard-dark-bevel-layer: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent 7%, transparent 91%, rgba(0, 0, 0, .58));--wound-string-background: repeating-linear-gradient(90deg, rgba(255, 242, 187, .98) 0 1px, rgba(165, 96, 28, .98) 1px 2px, rgba(255, 214, 126, .96) 2px 3px), linear-gradient(180deg, #fff4c9 0%, #e6ad4c 36%, #9b5c1f 62%, #f2bf5b 82%, #5e3512 100%);--plain-string-background: linear-gradient(180deg, #ffffff 0%, #f1f1f1 30%, #a8a8a8 54%, #f8f8f8 74%, #595959 100%);--string-3d-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 -1px 1px rgba(255, 255, 255, .38), 0 0 7px rgba(255, 218, 134, .22);position:relative;overflow:visible;width:100%;border:1px solid rgba(22,12,7,.96);border-radius:0 26px 26px 0;background:linear-gradient(180deg,var(--fretboard-edge-top-glow),transparent 24%,var(--fretboard-edge-bottom-shade) 100%),radial-gradient(ellipse at 50% 48%,transparent 46%,rgba(0,0,0,.22) 100%),url(/assets/fretboard-ebony-4-BJ2lF-Oo.png) center / cover no-repeat,#17110e;box-shadow:inset 0 2px 0 var(--fretboard-inset-top-line),inset 0 10px 18px var(--fretboard-inset-upper-glow),inset 0 -8px 16px var(--fretboard-inset-lower-shadow),inset 14px 0 18px #00000052,inset -18px 0 28px #00000057}.showNut .fretboard{box-shadow:inset 0 2px 0 var(--fretboard-inset-top-line),inset 0 10px 18px var(--fretboard-inset-upper-glow),inset 0 -8px 16px var(--fretboard-inset-lower-shadow),inset -18px 0 28px #00000057}.fretboard:before{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;content:"";background:linear-gradient(90deg,rgba(0,0,0,.28),transparent 10%,transparent 88%,rgba(0,0,0,.34)),linear-gradient(180deg,var(--fretboard-overlay-top-glow),transparent 50%,var(--fretboard-overlay-bottom-shade));opacity:1}.showNut .fretboard:before{background:linear-gradient(90deg,transparent,transparent 88%,rgba(0,0,0,.34)),linear-gradient(180deg,var(--fretboard-overlay-top-glow),transparent 50%,var(--fretboard-overlay-bottom-shade))}.fretboard:after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;content:"";background:var(--fretboard-dark-bevel-layer),linear-gradient(180deg,var(--fretboard-surface-top-glow),transparent 18%,transparent 82%,var(--fretboard-surface-bottom-shade)),radial-gradient(ellipse at 50% 52%,transparent 44%,rgba(0,0,0,.28) 100%),linear-gradient(90deg,rgba(255,213,142,.1),transparent 16%,transparent 82%,rgba(255,255,255,.08))}.hideNut .headstockSlice{display:none}.hideNut .stringLabel{border-right-width:0;border-right-color:transparent;background:linear-gradient(90deg,#160d09c2,#361d11b8);box-shadow:none}.positionMarkerLayer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:grid;pointer-events:none}.positionMarkerSlot{position:relative;min-width:0}.positionMarkerDot{position:absolute;left:50%;width:21px;height:21px;border:1px solid rgba(78,49,24,.32);border-radius:999px;background:radial-gradient(circle at 34% 28%,#fffdf2,#e4cfaa 56%,#a9875d);box-shadow:inset 0 1px #ffffff94,inset 0 -2px 3px #52301633,0 2px 5px #00000047;transform:translate(-50%,-50%)}.singleMarkerSlot .positionMarkerDot{top:50%}.doubleMarkerSlot .positionMarkerDot:first-child{top:25%}.doubleMarkerSlot .positionMarkerDot:last-child{top:75%}.stringRow{position:relative;z-index:4;min-height:clamp(29px,2.85vw,39px)}.openStringRow{z-index:8}.stringLabel{--nut-width: 8px;position:relative;z-index:2;justify-content:flex-start;padding-left:8px;border-right:8px solid #f5e6c9;color:#fff8e8e0;background:linear-gradient(90deg,#070504e6,#2c160ae6);font-size:.72rem;text-shadow:0 1px 2px rgba(0,0,0,.6);box-shadow:none}.showNut .stringLabel:after{position:absolute;top:50%;right:calc(-1 * var(--nut-width) - 8px);z-index:7;width:calc(var(--nut-width) + 18px);height:2px;content:"";pointer-events:none;background:var(--wound-string-background);background-blend-mode:overlay,normal;box-shadow:var(--string-3d-shadow);transform:translateY(-50%)}.showNut .stringRow[data-string-number="1"] .stringLabel:after{height:1px}.showNut .stringRow[data-string-number="2"] .stringLabel:after{height:1.3px}.showNut .stringRow[data-string-number="3"] .stringLabel:after{height:1.7px}.showNut .stringRow[data-string-number="4"] .stringLabel:after{height:2.1px}.showNut .stringRow[data-string-number="5"] .stringLabel:after{height:2.6px}.showNut .stringRow[data-string-number="6"] .stringLabel:after{height:3px}.showNut .stringRow[data-string-number="1"] .stringLabel:after,.showNut .stringRow[data-string-number="2"] .stringLabel:after,.showNut .stringRow[data-string-number="3"] .stringLabel:after{background:var(--plain-string-background)}.hideNut .stringLabel{box-shadow:none}.fretCell{border-right:0;background:transparent}.fretCell:before{position:absolute;top:-5px;left:auto;right:-5px;bottom:-5px;z-index:2;width:10px;content:"";border-radius:999px;opacity:1;background:linear-gradient(90deg,#1f1e1c,#8e887f 13%,#fffdf2 34%,#78736c,#f1eadb 74%,#33302c);box-shadow:-2px 0 2px #00000080,1px 0 #ffffff80,3px 0 7px #0000005c}.stringRow[data-string-number="1"] .fretCell:before{top:0}.stringRow[data-string-number="6"] .fretCell:before{bottom:0}.stringLine{z-index:4;left:-1px;right:-1px;background:var(--wound-string-background);background-blend-mode:overlay,normal;box-shadow:var(--string-3d-shadow)}.stringRow[data-string-number="1"] .stringLine,.stringRow[data-string-number="2"] .stringLine,.stringRow[data-string-number="3"] .stringLine{background:var(--plain-string-background)}.withMarker:after{z-index:2;display:none;width:17px;height:17px;border:1px solid rgba(97,66,34,.22);background:radial-gradient(circle at 35% 30%,#fffdf1,#e7d5b5 58%,#b99d72);box-shadow:0 2px 5px #0000003d}.stringRow[data-string-number="3"] .withMarker:after{display:block}.doubleMarker:after{width:17px;height:17px;background:transparent;box-shadow:0 -22px #e7d5b5,0 22px #e7d5b5,0 2px 5px #0000003d}.rootCell,.targetCell{background:transparent}.noteBadge{z-index:5;min-width:44px;min-height:44px;padding:0 8px;border:3px solid rgba(255,255,255,.92);color:#fffdf8;font-size:1rem;text-shadow:0 2px 4px rgba(0,0,0,.38);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px)}.fretCell>.noteBadge{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.rootBadge{--note-playback-glow: 0 0 0 10px rgba(255, 170, 35, .32), 0 0 34px rgba(255, 214, 90, 1), 0 0 78px rgba(255, 174, 38, .62);background:#e0890ab3;box-shadow:0 0 0 7px #ffaa2333,0 0 24px #ffae26f2,0 0 58px #ffae2670}.targetBadge{--note-playback-glow: 0 0 0 10px rgba(104, 180, 255, .28), 0 0 34px rgba(124, 210, 255, 1), 0 0 78px rgba(104, 180, 255, .58);background:#2b7babad;box-shadow:0 0 0 7px #68b4ff2e,0 0 24px #68b4fff2,0 0 58px #68b4ff6b}.openStringBadge{position:absolute;top:50%;left:var(--open-string-badge-x, calc(clamp(34px, 11%, 52px) - 4px) );z-index:20;min-width:clamp(31px,4.8vw,42px);min-height:clamp(31px,4.8vw,42px);padding:0 7px;pointer-events:none;transform:translate(-50%,-50%)}.answerSection{gap:10px}.sectionHeader span{color:#756c63;font-size:.82rem;font-weight:800}.answerGrid{grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}.answerButton{display:grid;gap:8px;place-items:center;min-height:84px;padding:12px 8px;border-color:#4834222e;background:#fffcf6e0;box-shadow:0 1px #fffc,0 10px 22px #3627190f}.answerButton.intervalColoredAnswer:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer){background:linear-gradient(180deg,#ffffffd1,#ffffff6b),var(--answer-interval-soft, rgba(255, 252, 246, .88));box-shadow:inset 0 4px 0 var(--answer-interval-color, rgba(72, 52, 34, .26)),0 1px #fffc,0 10px 22px #3627190f}.answerButton.intervalColoredAnswer:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer) .answerSymbol{color:var(--answer-interval-text, #2a2019)}@media(hover:hover)and (pointer:fine){.answerButton.intervalColoredAnswer:not(:disabled):not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):hover{border-color:#48342247;background:linear-gradient(180deg,#ffffffad,#ffffff38),var(--answer-interval-soft, #f8efe0);box-shadow:inset 0 4px 0 var(--answer-interval-color, rgba(39, 122, 91, .38)),0 1px #fffc,0 12px 24px #36271914}}.answerSymbol{color:#2a2019;font-size:clamp(1.05rem,1.6vw,1.36rem);font-weight:950;line-height:1;text-align:center}.compoundAnswerSymbol{line-height:1.08}.answerSymbolPart{white-space:nowrap}.tensionAnswerButton{align-content:center;gap:0}@media(min-width:761px){.answerGrid.tensionAnswerGrid{grid-template-columns:repeat(6,minmax(0,1fr))}.answerGrid.tensionAnswerGrid .answerButton{min-height:64px}}@media(max-width:760px){.tensionAnswerButton .compoundAnswerSymbol{display:grid;gap:1px;justify-items:center}.tensionAnswerButton .answerSymbolPart{display:block}.tensionAnswerButton .answerSymbolBreak{display:none}}.answerName{color:#4f463e;font-size:.78rem;font-weight:850;line-height:1.15}.answerButton.selectedAnswer:not(.correctAnswer){border-color:#c7503d;color:#5a1f17;background:linear-gradient(180deg,rgba(255,255,255,.36),transparent 46%),#f5cfc5;box-shadow:0 0 0 3px #c7503d38,0 14px 28px #c7503d2e}.answerButton.correctAnswer,.answerButton.selectedAnswer.correctAnswer{border-color:#277a5b;color:#164d37;background:linear-gradient(180deg,rgba(255,255,255,.42),transparent 46%),#c9f2df;box-shadow:0 0 0 3px #277a5b3d,0 14px 28px #277a5b33}.answerButton.selectedAnswer:not(.correctAnswer) .answerSymbol,.answerButton.selectedAnswer:not(.correctAnswer) .answerName{color:#5a1f17}.answerButton.correctAnswer .answerSymbol,.answerButton.correctAnswer .answerName{color:#164d37}@media(hover:none),(pointer:coarse){.answerButton:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):active,.answerButton:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):focus{border-color:#4834222e;color:#24241f;background:#fffcf6e0;box-shadow:0 1px #fffc,0 10px 22px #3627190f;outline:none}.answerButton:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):active .answerSymbol,.answerButton:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):active .answerName,.answerButton:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):focus .answerSymbol,.answerButton:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):focus .answerName{color:inherit}.answerButton.intervalColoredAnswer:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):active,.answerButton.intervalColoredAnswer:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):focus{background:linear-gradient(180deg,#ffffffd1,#ffffff6b),var(--answer-interval-soft, rgba(255, 252, 246, .88));box-shadow:inset 0 4px 0 var(--answer-interval-color, rgba(72, 52, 34, .26)),0 1px #fffc,0 10px 22px #3627190f}.answerButton.intervalColoredAnswer:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):active .answerSymbol,.answerButton.intervalColoredAnswer:not(.selectedAnswer):not(.correctAnswer):not(.guidedAnswer):focus .answerSymbol{color:var(--answer-interval-text, #2a2019)}}.feedback{display:grid;grid-template-columns:minmax(240px,1fr) auto;align-items:center;gap:24px;padding:20px 24px;border-radius:8px;background:#fffcf6db;box-shadow:0 12px 38px #4b361d14}.feedbackDetailOpen{grid-template-columns:minmax(240px,.85fr) minmax(360px,1.45fr) auto}.feedbackResult{display:flex;align-items:center;gap:18px}.feedbackIcon{display:inline-grid;flex:0 0 auto;place-items:center;width:58px;height:58px;border-radius:999px;color:#fff;background:#2f8f3a}.wrongFeedback .feedbackIcon{background:#c7503d}.timeUpFeedback .feedbackIcon{background:#8b5307}.timeUpDialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:6000;display:grid;place-items:center;padding:calc(24px + env(safe-area-inset-top)) calc(22px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(22px + env(safe-area-inset-left));background:#1618189e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.timeAttackFinished .quizLayout,.timeAttackFinished .settingsPanel{pointer-events:none}.timeUpFeedback{width:min(720px,100%);max-height:min(620px,calc(100dvh - 48px));overflow:auto;grid-template-columns:1fr;gap:22px;border:1px solid rgba(139,83,7,.18);background:radial-gradient(circle at 88% 18%,rgba(199,80,61,.08),transparent 28%),#fffcf6f0;box-shadow:0 0 0 4px #ffffff29,0 28px 86px #14100c70}.timeUpStats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0}.timeUpStat{min-width:0;padding:16px 12px;border:1px solid rgba(72,52,34,.14);border-radius:8px;background:#fffaf1;text-align:center}.timeUpStat dt{margin:0 0 8px;color:#756c63;font-size:.78rem;font-weight:850}.timeUpStat dd{margin:0;color:#2a2019;font-size:clamp(1.35rem,3vw,2rem);font-weight:950;line-height:1.05}.timeUpModeOptions{display:grid;gap:10px;padding:12px;border:1px solid rgba(72,52,34,.14);border-radius:8px;background:#fffaf1d6}.timeUpModeOption{display:grid;gap:4px;width:100%;min-height:58px;padding:10px 12px;border:1px solid rgba(72,52,34,.16);border-radius:8px;color:#2a2019;background:#fffdf8;text-align:left;cursor:pointer}.timeUpModeOption:hover,.timeUpModeOption:focus-visible{border-color:#8b53076b;background:#fff4e3}.timeUpModeOption span{font-size:.92rem;font-weight:950}.timeUpModeOption small{color:#6b6259;font-size:.72rem;font-weight:800;line-height:1.35}.feedbackDetail{display:none;gap:12px;min-width:0}.feedbackDetailOpen .feedbackDetail{display:grid}.explanationCopy{display:grid;gap:7px}.explanationCopy h3{margin:0;color:#2a2019;font-size:.94rem;font-weight:950}.feedbackDetail p{margin:0;color:#4f463e;font-weight:850;line-height:1.45}.positionExplanation strong{margin:0 3px;color:#2f8f3a}.intervalDiagram{display:grid;gap:10px;padding:12px 16px;border:1px solid rgba(72,52,34,.14);border-radius:8px;background:#fffaf1}.intervalMeasure{--measure-line-color: #aa9e92;display:grid;grid-template-columns:0 minmax(0,1fr) 0;align-items:end;min-height:36px;margin:0 var(--measure-inset, 0px) -2px;padding:0 0 2px}.measureExtension{position:relative;justify-self:center;width:0;height:28px;border-left:1px solid var(--measure-line-color)}.measureLine{position:relative;align-self:start;display:flex;justify-content:center;min-width:0;margin-top:6px;border-top:1px solid var(--measure-line-color)}.measureLine:before,.measureLine:after{position:absolute;top:-5px;width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;content:""}.measureLine:before{left:0;border-right:8px solid var(--measure-line-color);transform:translate(-1px)}.measureLine:after{right:0;border-left:8px solid var(--measure-line-color);transform:translate(1px)}.measureLine span{max-width:100%;padding:0 9px;color:#2f8f3a;background:#fffaf1;font-size:.84rem;font-weight:950;line-height:1.1;text-align:center;transform:translateY(-50%);white-space:nowrap}.zeroIntervalMeasure{grid-template-columns:1fr}.zeroIntervalMeasure .measureExtension{display:none}.zeroIntervalMeasure .measureLine{border-top:0}.zeroIntervalMeasure .measureLine:before,.zeroIntervalMeasure .measureLine:after{display:none}.semitoneSteps{display:flex;align-items:flex-start;gap:4px;margin:0;padding:0;list-style:none}.semitoneStep{position:relative;display:grid;flex:1 1 0;gap:4px;justify-items:center;min-width:0}.semitoneStep+.semitoneStep:before{position:absolute;top:11px;right:calc(50% + 12px);left:calc(-50% + 12px);height:2px;content:"";background:#4834223d}.stepDot{position:relative;z-index:1;display:inline-grid;place-items:center;width:24px;height:24px;border:1px solid rgba(72,52,34,.18);border-radius:999px;color:#5c4a38;background:#fffdf8;font-size:.68rem;font-weight:900;white-space:nowrap}.endpointStep .stepDot{border-color:#7a531447;color:#2a2019;background:#ffd37a}.endpointStep:last-child .stepDot{background:#ffd6bd}.stepCaption{color:#76695d;font-size:.62rem;font-weight:850;line-height:1}.stepCaption:empty{display:none}.semitoneStep:only-child .stepDot{width:auto;min-width:42px;padding:0 8px}.diagramCaption{font-size:.76rem}.noteReveal{justify-content:flex-start}.noteReveal p{text-align:left}.feedbackActions{display:grid;gap:12px;justify-items:stretch}.feedbackActions .iconTextButton{min-width:150px}@media(max-width:1180px){.answerGrid{grid-template-columns:repeat(6,minmax(0,1fr))}.feedback,.timeUpFeedback{grid-template-columns:1fr}.timeUpStats{grid-template-columns:repeat(3,minmax(0,1fr))}.feedbackActions{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-height:760px)and (min-width:681px){.appShell{padding:calc(10px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left))}.quizLayout{gap:8px}.appHeader{min-height:56px;padding-bottom:7px}.brandMark{width:38px;height:38px}.navButton{min-height:42px;padding:0 12px}.statusBar{min-height:62px;padding:8px 12px}.statusBar>div{min-height:44px;padding:0 12px}.statusBar strong{font-size:1.12rem}.trainingSummary{min-height:0;gap:8px;padding:0}.trainingSummary>div{padding:0}.summaryLabel{margin-bottom:2px;font-size:.66rem}.trainingSummary strong{font-size:.9rem}.summarySelectButton{min-height:54px;padding:8px 10px}.questionPrompt{min-height:44px}.questionBadge{min-height:40px;min-width:112px}.stringRow{min-height:clamp(25px,4.5vh,31px)}.answerButton{min-height:52px;gap:4px;padding:8px 6px}.feedback{padding:14px 16px}}@media(max-width:680px){body{background:#f7f7f6}.appShell{padding:0;background:#f7f7f6}.quizLayout{gap:0}.appHeader,.statusBar,.questionPrompt,.fretboardShell,.feedback{flex:0 0 auto}.appHeader{min-height:92px;padding:calc(16px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) 16px calc(18px + env(safe-area-inset-left));border:0;color:#fff;background:radial-gradient(circle at 22% -10%,rgba(119,155,191,.3),transparent 34%),linear-gradient(135deg,#0f2437,#17293b 48%,#07131f)}.brandArea{flex:1 1 auto;justify-content:center;gap:8px}.brandMark,.eyebrow,.headerActions{display:none}.mobileMenuButton,.mobileSettingsButton{display:inline-grid;flex:0 0 auto;width:42px;height:42px;color:#fff;background:transparent;box-shadow:none}h1{color:#fff;font-size:clamp(.84rem,3.6vw,1rem);text-align:center;white-space:nowrap}.statusBar{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:12px 10px;border-width:0 0 1px;border-radius:0;background:#fff;box-shadow:none}.statusBar>div{display:block;min-height:54px;padding:0 8px;text-align:center}.statusIcon{display:inline-grid;margin-bottom:3px;color:#7b7b7b}.statusLabel{font-size:clamp(.6rem,2.4vw,.72rem)}.statusBar strong{font-size:clamp(1rem,4.3vw,1.35rem)}.trainingSummary{display:none}.startPanel{margin:18px;min-height:0}.questionPrompt{min-height:88px;padding:14px 30px;background:#fff;border-bottom:1px solid rgba(0,0,0,.16)}.questionPromptCopy{gap:12px}.questionBadge{min-width:112px;min-height:46px;padding:0 12px;font-size:.92rem;background:linear-gradient(145deg,#3f4247,#15171a)}.questionPrompt p{font-size:clamp(.82rem,3.6vw,1.04rem)}.inlineNote{display:inline-grid;width:24px;height:24px;margin:0 4px;font-size:.78rem}.replayButton{min-width:56px;width:56px;height:56px;padding:0;border-color:#0d1f33;color:#0d1f33;background:#fff}.replayButton span{display:none}.fretboardShell{padding:0 0 14px;background:#0a0a0b}.fretNumbers{position:absolute;right:0;bottom:4px;left:0;z-index:6;grid-template-columns:inherit;padding:0 12px;color:#ffffffe0;font-size:.72rem}.fretboardFrame{filter:none}.headstockSlice{inset:0 auto 0 0;width:52px;border-radius:0 10px 10px 0}.hideNut .stringLabel{border-right-width:0;border-right-color:transparent;background:#120c09bd;box-shadow:none}.fretboard{border-width:0;border-radius:0}.stringRow{min-height:clamp(36px,5.9dvh,49px)}.stringLabel{--nut-width: 7px;justify-content:center;padding:0;border-right-width:7px;font-size:0}.positionMarkerDot{width:16px;height:16px}.noteBadge{min-width:clamp(42px,10.5vw,52px);min-height:clamp(42px,10.5vw,52px);font-size:1.05rem}.answerSection{padding:18px 30px 0;background:#f7f7f6}.quizAnswered .answerSection,.sectionHeader{display:none}.answerGrid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.answerButton{min-height:clamp(70px,8.4dvh,82px);gap:5px;padding:8px 4px;border-color:#a8a8a8;background:linear-gradient(180deg,#fff,#f8f8f8);box-shadow:0 8px 18px #0000000a}.answerSymbol{font-size:clamp(1.1rem,5.5vw,1.55rem)}.answerName{font-size:clamp(.56rem,2.5vw,.72rem);line-height:1.08}.feedback{grid-template-columns:1fr;gap:12px;margin:12px 30px 0;padding:14px;border:1px solid rgba(0,0,0,.16);border-radius:8px;background:#fff;box-shadow:none}.feedbackResult{gap:12px}.feedbackIcon{width:48px;height:48px}.feedbackDetail,.noteReveal,.intervalDiagram{display:none}.feedbackDetailOpen .feedbackDetail{display:grid}.feedbackDetailOpen .noteReveal{display:flex}.feedbackDetailOpen .intervalDiagram{display:grid}.feedbackActions{grid-template-columns:1fr}.feedbackActions .secondaryButton{min-height:42px}.feedbackActions .nextButton{min-height:58px;background:radial-gradient(circle at 48% 0%,rgba(255,255,255,.18),transparent 34%),linear-gradient(135deg,#10243a,#183251)}}@media(max-width:430px){.questionPrompt,.answerSection{padding-inline:18px}.answerGrid{gap:7px}.feedback{margin-inline:18px}}@media(max-height:700px)and (max-width:680px){.appHeader{min-height:72px;padding-bottom:10px}.statusBar{padding-block:8px}.statusBar>div{min-height:43px}.questionPrompt{min-height:62px;padding-block:8px}.stringRow{min-height:clamp(26px,5.7dvh,36px)}.answerSection{padding-top:10px}.answerGrid{gap:8px}.answerButton{min-height:clamp(56px,8.8dvh,68px)}.feedback{margin-top:8px;padding:10px}}@media(max-width:960px)and (max-height:560px)and (orientation:landscape){html,body,#root{height:100%;overflow:hidden}body{background:linear-gradient(135deg,rgba(39,122,91,.09),transparent 34%),linear-gradient(220deg,rgba(199,80,61,.08),transparent 40%),#f6f2ea}.appShell{display:block;width:100%;max-width:none;height:100dvh;min-height:100dvh;padding:calc(6px + env(safe-area-inset-top)) calc(10px + env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) calc(10px + env(safe-area-inset-left));overflow:hidden;background:transparent}.quizLayout{display:grid;grid-template-rows:auto auto auto auto minmax(92px,1fr) auto;gap:5px;height:100%;overflow:hidden}.quizIdle .quizLayout{grid-template-rows:auto auto auto minmax(0,1fr)}.appHeader,.statusBar,.trainingSummary,.questionPrompt,.fretboardShell,.answerSection,.feedback{min-width:0}.appHeader{min-height:34px;padding:0;border:0;color:#221913;background:transparent}.brandArea{flex:1 1 auto;justify-content:flex-start;gap:7px;min-width:0}.brandMark{display:inline-grid;width:30px;height:30px}.eyebrow{display:none}h1{color:#221913;font-size:clamp(.82rem,2.25vw,1rem);text-align:left;white-space:nowrap}.headerActions{display:flex;flex-wrap:nowrap;gap:5px}.mobileMenuButton,.mobileSettingsButton{display:none}.navButton{min-height:32px;padding:0 9px;gap:5px;border-color:#4834222e;color:#4f3f32;background:#fffcf6b8;font-size:.68rem;box-shadow:0 6px 14px #3627190d}.navButton svg{width:15px;height:15px}.activeNavButton{color:#8b5307;background:#fff4e3;border-color:#9a5b085c;box-shadow:inset 0 -2px #8b5307,0 8px 16px #8b530714}.statusBar{grid-template-columns:repeat(4,minmax(0,1fr));min-height:40px;padding:5px 6px;border:1px solid rgba(72,52,34,.16);border-radius:8px;background:#fffcf6db;box-shadow:0 8px 20px #4b361d0f}.statusBar>div{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:6px;min-height:30px;padding:0 8px;text-align:left;border-right:1px solid rgba(72,52,34,.16)}.statusIcon{display:inline-grid;grid-row:span 2;margin:0;color:#7a746e}.statusIcon svg{width:15px;height:15px}.statusLabel{font-size:.55rem;line-height:1.05}.statusBar strong{font-size:.84rem;line-height:1.05}.trainingSummary{display:grid;grid-template-columns:.85fr 1.55fr;min-height:36px;gap:6px;padding:0;border:0;border-radius:0;background:transparent}.trainingSummary>div{padding:0;border-right:0}.summaryLabel{margin-bottom:1px;font-size:.54rem;line-height:1}.trainingSummary strong,.summarySelectButton strong{font-size:.74rem;line-height:1.05}.summarySelectButton{min-height:40px;gap:3px;padding:6px 8px}.summaryOptions{top:calc(100% + 6px);left:4px;width:min(380px,78vw);max-height:calc(100dvh - 88px);gap:4px;padding:6px;overflow:auto}.summaryOption{min-height:32px;padding:0 9px;font-size:.72rem}.summaryNestedPanel{gap:6px;padding:7px}.summaryScaleGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.summaryIntervalGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;max-height:130px}.summaryScaleButton,.summaryIntervalButton{min-height:32px;padding:5px 6px;font-size:.64rem}.summaryScaleButton small{display:none}.startPanel{margin:0;min-width:0;min-height:0;height:100%;padding:18px clamp(18px,4vw,34px);border-color:#48342229;background:#fffaf1}.startPanel>div{min-width:0}.startPanel h2{overflow-wrap:anywhere;font-size:clamp(.9rem,2.6vw,1.16rem);line-height:1.22}.startPanel p{overflow-wrap:anywhere;font-size:clamp(.68rem,1.9vw,.84rem);line-height:1.45}.startButton{flex:0 0 auto;min-width:clamp(118px,18vw,148px);min-height:38px}.countdownDisplay{width:clamp(62px,11dvh,82px);height:clamp(62px,11dvh,82px);margin-top:8px;font-size:clamp(2rem,9dvh,3rem)}.questionPrompt{display:flex;min-height:34px;padding:4px 9px;border:1px solid rgba(72,52,34,.14);border-radius:8px;background:#fffcf6db}.questionPromptCopy{gap:8px}.questionBadge{min-width:82px;min-height:28px;padding:0 9px;font-size:.72rem;background:linear-gradient(145deg,#633500,#2f1700)}.questionPrompt p{color:#2a2019;font-size:.72rem;line-height:1.2}.inlineNote{width:20px;height:20px;margin:0 3px;font-size:.68rem}.replayButton{width:auto;min-width:112px;height:32px;min-height:32px;padding:0 10px;border-color:#744a1157;color:#4a2e1e;background:#fffaf2;font-size:.7rem}.replayButton span{display:inline}.fretboardShell{overflow:visible;padding:0 0 8px;border:0;border-radius:0;background:transparent;box-shadow:none}.fretNumbers{position:relative;inset:auto;z-index:2;margin:0 0 3px;padding:0 9px;color:#7c6c58;font-size:.54rem}.fretboardFrame{filter:drop-shadow(0 12px 14px rgba(28,15,8,.24))}.headstockSlice{inset:-8px auto -7px 0;width:clamp(36px,7vw,64px);border-radius:28px 4px 4px 28px}.fretboard{border:1px solid rgba(25,14,9,.95);border-radius:0 18px 18px 0}.stringRow{min-height:clamp(16px,4.5dvh,22px)}.stringLabel{--nut-width: 6px;justify-content:flex-start;padding-left:5px;border-right-width:6px;color:#fff8e8d6;background:linear-gradient(90deg,#070504e6,#2c160ae6);font-size:.48rem}.hideNut .stringLabel{border-right-width:0;border-right-color:transparent;background:linear-gradient(90deg,#160d09c2,#361d11b8);box-shadow:none}.fretCell:before{right:-3px;width:6px}.stringLine{left:-1px;right:-1px}.positionMarkerDot{width:12px;height:12px}.noteBadge{min-width:29px;min-height:29px;padding:0 5px;border-width:2px;font-size:.7rem;box-shadow:0 0 0 4px #ffffff29,0 0 18px currentColor}.answerSection{gap:4px;padding:0;background:transparent}.quizAnswered .answerSection,.sectionHeader{display:none}.answerGrid{grid-template-columns:repeat(12,minmax(0,1fr));gap:5px}.answerButton{min-height:clamp(38px,10dvh,46px);gap:2px;padding:4px 2px;border-color:#4834222e;background:#fffcf6eb}.answerSymbol{font-size:clamp(.72rem,2.4vw,.9rem)}.answerName{font-size:clamp(.44rem,1.55vw,.55rem);line-height:1.02}.feedback{grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:0;padding:7px 9px;border:1px solid rgba(72,52,34,.14);border-radius:8px;background:#fffcf6eb;box-shadow:0 8px 20px #4b361d14}.timeUpFeedback{width:min(620px,100%);max-height:calc(100dvh - 24px);gap:10px;padding:12px;grid-template-columns:1fr}.timeUpStats{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.timeUpStat{padding:5px 4px}.timeUpStat dt{margin-bottom:2px;font-size:.52rem}.timeUpStat dd{font-size:.94rem}.timeUpModeOptions{gap:5px;padding:7px}.timeUpModeOption{min-height:34px;padding:5px 7px}.timeUpModeOption span{font-size:.68rem}.timeUpModeOption small{font-size:.55rem;line-height:1.2}.feedbackDetailOpen{grid-template-columns:minmax(0,.9fr) minmax(0,1.35fr) auto}.feedbackResult{gap:8px}.feedbackIcon{width:32px;height:32px}.feedback h2{font-size:.82rem}.feedback p{font-size:.64rem;line-height:1.25}.feedbackDetail{display:none;gap:5px}.feedbackDetailOpen .feedbackDetail{display:grid}.explanationCopy h3{font-size:.72rem}.feedbackDetail p{font-size:.62rem}.intervalDiagram,.noteReveal{display:none}.feedbackDetailOpen .intervalDiagram{display:grid;gap:4px;padding:5px 7px}.feedbackDetailOpen .noteReveal{display:flex}.intervalMeasure{min-height:26px}.measureExtension{height:18px}.measureLine{margin-top:4px}.measureLine span,.diagramCaption,.stepCaption{font-size:.56rem}.stepDot{width:18px;height:18px;font-size:.54rem}.semitoneStep+.semitoneStep:before{top:8px;right:calc(50% + 9px);left:calc(-50% + 9px)}.feedbackActions{grid-template-columns:1fr;gap:5px}.feedbackActions .iconTextButton{min-width:104px;min-height:30px;padding:0 8px;font-size:.66rem}}@media(max-width:960px)and (max-height:560px)and (orientation:landscape){.quizStarted .quizLayout{display:grid;grid-template-areas:"header header" "summary answers" "prompt answers" "board answers" "feedback answers";grid-template-columns:minmax(0,1fr) clamp(150px,25vw,192px);grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:6px;min-height:0}.quizIdle .quizLayout{grid-template-areas:"header" "summary" "start";grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);min-height:0}.appHeader{grid-area:header}.quizStarted .statusBar,.quizIdle .statusBar{display:none}.trainingSummary{grid-area:summary}.startPanel{grid-area:start}.questionPrompt{grid-area:prompt}.fretboardShell{grid-area:board}.answerSection{grid-area:answers}.feedback{grid-area:feedback}.audioMessage{grid-area:prompt;align-self:end;justify-self:start;margin:0;padding:4px 8px;border-radius:999px;background:#fffcf6f0;font-size:.58rem;box-shadow:0 6px 14px #36271914}.appHeader{min-height:32px}.brandMark{width:27px;height:27px}.brandMark svg{width:17px;height:17px}h1{max-width:42vw;overflow:hidden;font-size:clamp(.76rem,2.1vw,.96rem);text-overflow:ellipsis}.navButton{min-height:29px;padding:0 8px;border-radius:9px;font-size:.64rem}.trainingSummary{grid-template-columns:repeat(2,minmax(0,1fr));min-height:37px;gap:6px;padding:0;border-radius:0;background:transparent}.trainingSummary>div{min-width:0;min-height:28px;padding:0}.summaryLabel{font-size:.49rem}.trainingSummary strong,.summarySelectButton strong{display:block;width:100%;overflow:hidden;font-size:clamp(.58rem,1.55vw,.72rem);text-align:center;text-overflow:ellipsis;white-space:nowrap}.summarySelectButton{min-width:0;min-height:34px;padding:5px 7px;border-radius:8px}.summarySelectButton svg{flex:0 0 auto;width:12px;height:12px}.summaryOptions{width:min(390px,calc(100dvw - 20px));max-height:calc(100dvh - 70px)}.summaryNestedPanel{max-height:calc(100dvh - 142px);overflow-y:auto}.questionPrompt{min-height:34px;padding:4px 7px;border-radius:11px}.questionPromptCopy{flex:1 1 auto;gap:7px;min-width:0}.questionBadge{min-width:72px;min-height:26px;padding:0 8px;border-radius:9px;font-size:.66rem;white-space:nowrap}.questionPrompt p{overflow:hidden;font-size:clamp(.58rem,1.6vw,.72rem);text-overflow:ellipsis;white-space:nowrap}.inlineNote{width:19px;height:19px;margin:0 2px;font-size:.62rem}.replayButton{flex:0 0 auto;min-width:104px;height:29px;min-height:29px;padding:0 8px;border-radius:9px;font-size:.62rem;white-space:nowrap}.replayButton svg{width:15px;height:15px}.fretboardShell{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;padding:0 0 4px;overflow:hidden}.fretNumbers{margin-bottom:2px;padding:0 8px;font-size:.5rem;line-height:1}.fretboardFrame{display:flex;min-height:0;align-items:stretch}.fretboard{display:grid;grid-template-rows:repeat(6,minmax(0,1fr));min-height:0;align-self:stretch;border-radius:0 18px 18px 0}.stringRow{min-height:0}.stringLabel{--nut-width: 6px;width:clamp(26px,5.2vw,40px);padding-left:5px;border-right-width:6px;font-size:.5rem}.showNut .stringLabel:after{right:calc(-1 * var(--nut-width) - 6px);width:calc(var(--nut-width) + 14px)}.fretCell:before{right:-3.5px;width:7px}.positionMarkerDot{width:14px;height:14px}.noteBadge{min-width:31px;min-height:31px;padding:0 5px;border-width:2px;font-size:.7rem}.answerSection,.quizAnswered .answerSection{display:flex}.answerSection{flex-direction:column;gap:6px;min-height:0;padding:7px;border:1px solid rgba(72,52,34,.16);border-radius:14px;background:#fffcf6e6;box-shadow:0 1px #ffffffc2,0 12px 26px #3627191a;overflow:hidden}.sectionHeader{display:flex;flex:0 0 auto;align-items:center;justify-content:center;min-height:18px}.sectionHeader h2{color:#4d3d31;font-size:.62rem;line-height:1;text-align:center}.answerGrid{display:grid;flex:1 1 auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:5px;min-height:0}.answerButton{gap:2px;min-width:0;min-height:0;height:100%;padding:3px 2px;border-radius:11px;box-shadow:inset 0 1px #ffffffb8,0 5px 11px #3627190f}.answerSymbol{max-width:100%;overflow-wrap:anywhere;font-size:clamp(.58rem,1.75vw,.78rem);line-height:1.02;text-align:center}.answerName{max-width:100%;overflow-wrap:anywhere;font-size:clamp(.42rem,1.28vw,.52rem);line-height:1.05;text-align:center}.feedback{align-items:center;grid-template-columns:minmax(0,1fr) auto;gap:7px;min-height:0;padding:6px 8px;border-radius:12px}.feedbackResult{min-width:0}.feedbackIcon{width:30px;height:30px}.feedback h2{font-size:.76rem}.feedback p{overflow:hidden;font-size:.58rem;line-height:1.22;text-overflow:ellipsis}.feedbackActions{display:grid;grid-template-columns:1fr;gap:5px}.feedbackActions .iconTextButton{min-width:100px;min-height:28px;border-radius:9px;font-size:.62rem}.feedbackDetailOpen{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto}.feedbackDetailOpen .feedbackDetail{max-height:108px;overflow-y:auto}.quizIdle .trainingSummary{display:grid}.quizIdle .startPanel{align-self:stretch;min-height:0;border-radius:14px}}@media(max-width:720px)and (max-height:420px)and (orientation:landscape){.quizStarted .quizLayout{grid-template-columns:minmax(0,1fr) clamp(142px,27vw,168px);gap:5px}.brandArea{gap:5px}.brandMark{width:25px;height:25px}h1{max-width:34vw;font-size:.72rem}.navButton{min-height:27px;padding:0 6px;gap:3px}.navButton span{font-size:.58rem}.navButton svg{width:13px;height:13px}.trainingSummary{min-height:34px}.summaryLabel{font-size:.46rem}.trainingSummary strong,.summarySelectButton strong{font-size:.56rem}.questionPrompt{min-height:31px;padding:3px 6px}.questionBadge{min-width:66px;min-height:24px;font-size:.6rem}.questionPrompt p{font-size:.56rem}.replayButton{min-width:96px;height:27px;min-height:27px;font-size:.58rem}.answerSection{gap:4px;padding:5px;border-radius:12px}.sectionHeader{min-height:15px}.sectionHeader h2{font-size:.56rem}.answerGrid{gap:4px}.answerButton{border-radius:9px;padding:2px 1px}.answerSymbol{font-size:clamp(.52rem,1.75vw,.7rem)}.answerName{font-size:clamp(.36rem,1.25vw,.48rem)}.fretNumbers{font-size:.45rem}.stringLabel{width:clamp(24px,5vw,34px);font-size:.44rem}.noteBadge{min-width:27px;min-height:27px;font-size:.62rem}.feedback{padding:5px 6px}.feedbackIcon{width:26px;height:26px}.feedback h2{font-size:.68rem}.feedback p{font-size:.52rem}.feedbackActions .iconTextButton{min-width:92px;min-height:26px;font-size:.56rem}}@media(max-width:760px),(max-width:960px)and (max-height:560px)and (orientation:landscape){html,body,#root{min-height:100%;height:auto;overflow-x:hidden;overflow-y:auto}body{overflow:auto;background:#f7f3ec}.appShell{display:block;width:100%;max-width:none;min-height:100dvh;height:auto;padding:0;overflow:visible;background:#f7f3ec}.quizLayout,.quizStarted .quizLayout,.quizIdle .quizLayout{display:flex;flex-direction:column;gap:0;min-height:100dvh;overflow:visible}.appHeader{order:1;flex-wrap:wrap;align-items:center;gap:10px;min-height:0;padding:calc(10px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) 10px calc(12px + env(safe-area-inset-left));border:0;color:#fff8e8;background:radial-gradient(circle at 18% -18%,rgba(255,217,146,.18),transparent 36%),linear-gradient(135deg,#24150c,#39210f 52%,#120b07)}.brandArea{order:1;flex:1 1 100%;justify-content:flex-start;gap:9px;min-width:0}.brandMark{display:inline-grid;width:30px;height:30px}.brandMark svg{width:17px;height:17px}.eyebrow{display:none}h1{color:#fff8e8;font-size:clamp(.88rem,4vw,1.08rem);line-height:1.16;text-align:left;white-space:normal}.headerActions{order:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:6px}.mobileMenuButton,.mobileSettingsButton{display:none}.navButton{min-height:34px;padding:0 8px;gap:5px;border-color:#fff8e82e;border-radius:9px;color:#fff8e8;background:#fffcf614;font-size:.68rem;box-shadow:none}.navButton svg{width:15px;height:15px}.activeNavButton{color:#2f210f;background:#ffd37a;border-color:#ffd37ae6;box-shadow:none}.statusBar{order:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;min-height:0;padding:6px 10px;border:0;border-bottom:1px solid rgba(72,52,34,.13);border-radius:0;background:#fffaf1;box-shadow:none}.quizStarted .statusBar,.quizIdle .statusBar{display:grid}.statusBar>div{display:grid;gap:2px;min-height:30px;padding:0 4px;border:0;border-right:1px solid rgba(72,52,34,.12);text-align:center}.statusBar>div:last-child{border-right:0}.streakStatus,.bestStatus{display:none!important}.correctStatus{border-right:0!important}.statusIcon{display:none}.statusLabel{font-size:clamp(.48rem,2.2vw,.62rem);line-height:1.05}.statusBar strong{font-size:clamp(.76rem,3.1vw,.94rem);line-height:1.05}.trainingSummary{order:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-height:0;padding:6px 10px 5px;border:0;border-bottom:0;border-radius:0;background:transparent;box-shadow:none}.trainingSummary>div{min-width:0;min-height:38px;padding:0;border-right:0;text-align:center}.trainingSummary>div:nth-child(2n){border-right:0}.summaryLabel{margin-bottom:2px;font-size:.58rem;line-height:1.05}.trainingSummary strong,.summarySelectButton strong{display:block;width:100%;overflow:hidden;font-size:clamp(.68rem,2.8vw,.84rem);text-align:center;text-overflow:ellipsis;white-space:nowrap}.summarySelectButton{min-width:0;min-height:38px;gap:3px;padding:5px 8px}.summarySelectButton svg{flex:0 0 auto;width:12px;height:12px}.summaryOptions{right:8px;left:8px;width:auto;max-height:min(68dvh,520px);overflow-y:auto}.summaryScaleGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.summaryIntervalGrid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:240px}.startPanel{order:4;display:grid;gap:18px;align-items:center;margin:12px;min-height:250px;padding:22px;border-radius:12px}.startPanel h2{font-size:clamp(1.05rem,5vw,1.32rem);line-height:1.25}.startPanel p{font-size:clamp(.82rem,3.5vw,.98rem);line-height:1.55}.startButton{width:100%;min-height:48px}.questionPrompt{order:4;align-items:center;gap:6px;min-height:0;padding:6px 10px;border:0;border-bottom:1px solid rgba(72,52,34,.13);border-radius:0;background:#fffdf8}.questionPromptCopy{flex:1 1 auto;gap:6px;min-width:0}.questionBadge{min-width:66px;min-height:28px;padding:0 8px;border-radius:9px;font-size:.66rem;white-space:nowrap}.questionPrompt p{min-width:0;color:#2a2019;font-size:clamp(.68rem,3vw,.84rem);line-height:1.15;white-space:nowrap}.promptTextFull{display:none}.promptTextCompact{display:inline-flex;align-items:center;gap:3px}.inlineNote{width:18px;height:18px;margin:0 2px;font-size:.6rem}.replayButton{flex:0 0 auto;width:auto;min-width:42px;height:30px;min-height:30px;padding:0 8px;border-color:#744a1157;border-radius:9px;color:#4a2e1e;background:#fffaf2}.replayButton span{display:none}.replayButton svg{width:15px;height:15px}.fretboardShell{order:5;position:relative;padding:5px 8px 8px;border:0;background:#f7f3ec;overflow:visible}.fretNumbers{position:relative;inset:auto;z-index:2;margin:0 0 2px;padding:0 6px;color:#7c6c58;font-size:.5rem;line-height:1}.fretboardFrame{filter:drop-shadow(0 10px 14px rgba(28,15,8,.22))}.headstockSlice{inset:-6px auto -5px 0;width:clamp(30px,10vw,42px);border-radius:20px 4px 4px 20px}.fretboard{border:1px solid rgba(22,12,7,.96);border-radius:0 16px 16px 0}.stringRow{min-height:clamp(21px,3.5dvh,27px)}.stringLabel{--nut-width: 6px;width:clamp(26px,8vw,34px);justify-content:center;padding:0;border-right-width:6px;color:#fff8e8db;font-size:.48rem}.showNut .stringLabel:after{right:calc(-1 * var(--nut-width) - 5px);width:calc(var(--nut-width) + 12px)}.fretCell:before{right:-3px;width:6px}.positionMarkerDot{width:12px;height:12px}.noteBadge{min-width:26px;min-height:26px;padding:0 5px;border-width:2px;font-size:.66rem}.answerSection,.quizAnswered .answerSection{display:block}.answerSection{order:6;padding:7px 10px 10px;background:#f7f3ec}.quizAnswered .answerSection{order:7;padding-top:6px}.sectionHeader{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}.sectionHeader h2{color:#2a2019;font-size:.74rem;line-height:1.2}.answerGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.answerButton{min-height:43px;gap:1px;padding:5px 3px;border-radius:8px}.answerSymbol{max-width:100%;overflow-wrap:anywhere;font-size:clamp(.82rem,4.2vw,1.08rem);line-height:1.05;text-align:center}.answerName{max-width:100%;overflow-wrap:anywhere;font-size:clamp(.42rem,2vw,.55rem);line-height:1.08;text-align:center}.feedback{position:fixed;right:calc(8px + env(safe-area-inset-right));bottom:calc(8px + env(safe-area-inset-bottom));left:calc(8px + env(safe-area-inset-left));z-index:70;order:7;display:grid;grid-template-columns:1fr;gap:6px;margin:0;padding:8px;border-radius:12px;box-shadow:0 18px 42px #36271938}.quizAnswered .feedback{order:6}.quizAnswered .answerButton{min-height:43px}.feedbackResult{gap:8px;min-width:0}.feedbackResult>div{min-width:0}.feedbackIcon{width:32px;height:32px}.feedback h2{font-size:.84rem;line-height:1.1}.feedback p{display:-webkit-box;overflow:hidden;font-size:.66rem;line-height:1.25;-webkit-box-orient:vertical;-webkit-line-clamp:2}.feedbackActions{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;align-self:center;width:100%}.feedbackActions .iconTextButton{width:100%;min-width:0;min-height:34px;padding:0 9px;border-radius:9px;font-size:.68rem}.feedbackDetailOpen{grid-template-columns:1fr}.feedbackDetail{gap:10px}.feedbackDetailOpen .feedbackDetail{display:grid}.feedbackDetailOpen .intervalDiagram{display:grid;overflow-x:auto;padding:10px}.feedbackDetailOpen .noteReveal{display:flex;flex-wrap:wrap}.measureLine span,.diagramCaption,.stepCaption{font-size:.58rem}.stepDot{width:20px;height:20px;font-size:.56rem}.semitoneStep+.semitoneStep:before{top:9px;right:calc(50% + 10px);left:calc(-50% + 10px)}.settingsPanel{inset:calc(8px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left));width:auto;max-width:none;max-height:none;border-radius:12px;overflow-y:auto}.settingsPanel .panelHeader{position:sticky;top:0;z-index:2;background:#fffaf1}.settingsCategoryMenu{grid-template-columns:1fr}.settingsCategoryButton{min-height:74px}.fretToggleGrid,.rootFretToggleGrid,.intervalToggleGrid{grid-template-columns:repeat(4,minmax(0,1fr))}.scaleControl,.toneControl{grid-template-columns:repeat(2,minmax(0,1fr))}.toneControl{grid-template-columns:1fr}.timeUpDialog{padding:calc(16px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(16px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}.timeUpFeedback{max-height:calc(100dvh - 32px)}.timeUpStats{grid-template-columns:1fr}}@media(max-width:380px)and (orientation:portrait){.headerActions{gap:5px}.navButton{padding:0 6px;font-size:.62rem}.trainingSummary strong,.summarySelectButton strong{font-size:.64rem}.questionPrompt{padding-inline:9px}.questionBadge{min-width:66px;font-size:.64rem}.answerGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.answerButton{min-height:40px;padding:4px 2px}.answerName{font-size:.4rem}.feedbackActions{grid-template-columns:repeat(2,minmax(0,1fr))}}.answerExplanationDialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:6100;display:grid;place-items:center;padding:calc(24px + env(safe-area-inset-top)) calc(22px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(22px + env(safe-area-inset-left));background:#1618189e;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.answerExplanationCard{display:grid;gap:18px;width:min(900px,100%);max-height:min(680px,calc(100dvh - 48px));overflow:auto;padding:22px;border:1px solid rgba(72,52,34,.16);border-radius:12px;background:radial-gradient(circle at 88% 18%,rgba(199,80,61,.08),transparent 28%),#fffcf6f5;box-shadow:0 0 0 4px #ffffff29,0 28px 86px #14100c70}.answerExplanationHeader{display:flex;align-items:center;justify-content:space-between;gap:16px}.answerExplanationTitle{display:flex;align-items:center;gap:14px;min-width:0}.answerExplanationTitle p{margin:0 0 3px;color:#756c63;font-size:.78rem;font-weight:850}.answerExplanationTitle h2{color:#2a2019;font-size:clamp(1.2rem,2.3vw,1.65rem);line-height:1.15}.answerExplanationIcon{display:inline-grid;flex:0 0 auto;place-items:center;width:48px;height:48px;border-radius:999px;color:#fff8e8;background:linear-gradient(145deg,#9a5b08,#5f3400);box-shadow:inset 0 1px #ffffff47,0 12px 24px #5f34002e}.answerExplanationCloseButton{flex:0 0 auto}.answerExplanationContent{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:18px;align-items:start}.answerExplanationContent .explanationCopy{align-self:start}.answerExplanationContent .intervalDiagram{display:grid;min-width:0}.answerExplanationContent .noteReveal{display:flex;grid-column:1 / -1;justify-content:flex-start}.answerExplanationContent p{margin:0}.answerExplanationActions{display:flex;justify-content:flex-end}.answerExplanationActions .iconTextButton{min-width:140px}@media(min-width:761px){.quizAnswered .feedback{gap:16px;padding:12px 16px}.quizAnswered .feedbackIcon{width:46px;height:46px}.quizAnswered .feedback h2{font-size:1rem}.quizAnswered .feedback p{font-size:.82rem;line-height:1.35}.quizAnswered .feedbackActions{grid-template-columns:repeat(2,minmax(130px,auto));gap:8px}.quizAnswered .feedbackActions .iconTextButton{min-height:36px;padding:0 12px}}@media(min-width:761px)and (max-height:760px){.appShell{padding:calc(8px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left))}.quizLayout{gap:6px}.appHeader{min-height:46px;padding-bottom:4px}.brandMark{width:32px;height:32px}.eyebrow{display:none}h1{font-size:clamp(1.1rem,2.2vw,1.55rem)}.navButton{min-height:34px;padding:0 10px}.statusBar{min-height:46px;padding:5px 10px}.statusBar>div{min-height:34px;padding:0 10px}.statusIcon svg{width:16px;height:16px}.statusLabel,.summaryLabel{font-size:.58rem;line-height:1}.statusBar strong,.trainingSummary strong,.summarySelectButton strong{font-size:.86rem;line-height:1.05}.trainingSummary{gap:6px}.summarySelectButton{min-height:42px;padding:5px 9px}.questionPrompt{min-height:38px;gap:10px}.questionPromptCopy{gap:12px}.questionBadge{min-width:96px;min-height:34px;padding:0 12px;font-size:.82rem}.questionPrompt p{font-size:.82rem;line-height:1.25}.inlineNote{width:22px;height:22px;margin:0 4px;font-size:.72rem}.replayButton{min-height:34px}.answerSection{gap:4px}.answerGrid{gap:6px}.answerButton{min-height:46px;gap:3px;padding:5px 4px}.answerSymbol{font-size:clamp(.86rem,1.2vw,1rem)}.answerName{font-size:.62rem;line-height:1.04}.quizAnswered .answerSection{gap:0}.quizAnswered .sectionHeader{display:none}.quizAnswered .answerGrid{gap:5px}.quizAnswered .answerButton{min-height:34px;gap:2px;padding:3px 4px}.quizAnswered .answerSymbol{font-size:clamp(.68rem,1vw,.84rem)}.quizAnswered .answerName{font-size:.54rem;line-height:1}.quizAnswered .feedback{grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:7px 12px}.quizAnswered .feedbackIcon{width:34px;height:34px}.quizAnswered .feedback h2{font-size:.86rem;line-height:1.05}.quizAnswered .feedback p{font-size:.68rem;line-height:1.2}.quizAnswered .feedbackActions .iconTextButton{min-height:36px;font-size:.66rem;padding:0 10px}}@media(min-width:761px)and (max-width:899px)and (max-height:760px){.quizAnswered .feedback{grid-template-columns:1fr}}@media(min-width:761px)and (min-height:761px)and (max-height:840px){.appShell{padding:calc(10px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left))}.quizLayout{gap:8px}.appHeader{min-height:56px;padding-bottom:7px}.brandMark{width:38px;height:38px}.navButton{min-height:42px;padding:0 12px}.statusBar{min-height:62px;padding:8px 12px}.statusBar>div{min-height:44px;padding:0 12px}.statusBar strong{font-size:1.12rem}.trainingSummary{gap:8px}.summaryLabel{margin-bottom:2px;font-size:.66rem}.trainingSummary strong,.summarySelectButton strong{font-size:.9rem}.summarySelectButton{min-height:54px;padding:8px 10px}.questionPrompt{min-height:44px;gap:12px}.questionPromptCopy{gap:14px}.questionBadge{min-width:112px;min-height:40px;padding:0 14px}.questionPrompt p{font-size:.86rem;line-height:1.3}.fretboardShell{padding-bottom:12px}.answerSection,.answerGrid{gap:6px}.answerButton{min-height:52px;gap:4px;padding:7px 5px}.quizAnswered .answerSection{gap:4px}.quizAnswered .sectionHeader{display:none}.quizAnswered .answerGrid{gap:6px}.quizAnswered .answerButton{min-height:40px;gap:2px;padding:4px}.quizAnswered .answerSymbol{font-size:clamp(.8rem,1.1vw,.95rem)}.quizAnswered .answerName{font-size:.62rem;line-height:1.05}.quizAnswered .feedback{grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 12px}.quizAnswered .feedbackIcon{width:38px;height:38px}.quizAnswered .feedback h2{font-size:.92rem;line-height:1.1}.quizAnswered .feedback p{font-size:.72rem;line-height:1.25}.quizAnswered .feedbackActions .iconTextButton{min-height:36px;padding:0 11px;font-size:.7rem}}@media(max-width:960px)and (max-height:560px)and (orientation:landscape){.answerExplanationDialog{padding:calc(10px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}.answerExplanationCard{gap:10px;width:min(760px,100%);max-height:calc(100dvh - 20px);padding:12px;border-radius:10px}.answerExplanationIcon{width:36px;height:36px}.answerExplanationTitle p{font-size:.62rem}.answerExplanationTitle h2{font-size:1rem}.answerExplanationContent{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:10px}.answerExplanationContent .explanationCopy{gap:5px}.answerExplanationContent .explanationCopy h3{font-size:.72rem}.answerExplanationContent p,.answerExplanationContent .feedbackDetail p{font-size:.62rem;line-height:1.32}.answerExplanationContent .intervalDiagram{gap:4px;padding:7px}.answerExplanationContent .noteReveal{gap:5px}.answerExplanationContent .noteReveal span{padding:4px 7px;font-size:.62rem}.answerExplanationActions .iconTextButton{min-height:30px;font-size:.66rem}}@media(max-width:760px),(max-width:960px)and (max-height:560px)and (orientation:landscape){.answerExplanationDialog{align-items:end;padding:calc(12px + env(safe-area-inset-top)) calc(10px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(10px + env(safe-area-inset-left))}.answerExplanationCard{gap:14px;width:100%;max-height:calc(100dvh - 24px);padding:16px;border-radius:14px}.answerExplanationHeader{gap:10px}.answerExplanationIcon{width:40px;height:40px}.answerExplanationTitle{gap:10px}.answerExplanationTitle p{font-size:.68rem}.answerExplanationTitle h2{font-size:1.15rem}.answerExplanationContent{grid-template-columns:1fr;gap:12px}.answerExplanationContent .intervalDiagram{overflow-x:auto;padding:10px}.answerExplanationContent .noteReveal{grid-column:auto}.answerExplanationActions{display:grid}.answerExplanationActions .iconTextButton{width:100%;min-height:44px}}@media(max-width:760px)and (orientation:portrait),(max-width:960px)and (max-height:560px)and (orientation:landscape){.summarySelector>.summaryOptions{display:none}.mobileSummaryDialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:120;display:flex;padding:calc(12px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));background:radial-gradient(circle at 14% 0%,rgba(211,143,31,.13),transparent 28%),#fffaf1}.mobileSummaryPanel{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;width:100%;min-height:0}.mobileSummaryHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid rgba(72,52,34,.14);border-radius:12px;background:#fffcf6e6;box-shadow:0 14px 34px #4b361d1a}.mobileSummaryHeader p{margin:0 0 3px;color:#8b5307;font-size:.68rem;font-weight:900}.mobileSummaryHeader h2{margin:0;color:#2a2019;font-size:clamp(1rem,4.2vw,1.28rem);line-height:1.15}.mobileSummaryCloseButton{flex:0 0 auto;min-height:38px;padding:0 14px;border-radius:9px}.mobileSummaryContent{display:grid;align-content:start;gap:8px;min-height:0;padding:12px;overflow-y:auto;overscroll-behavior:contain;border:1px solid rgba(72,52,34,.14);border-radius:12px;background:#fffcf6db;box-shadow:0 18px 40px #4b361d1a}.mobileSummaryContent .summaryOption{min-height:54px;padding:10px 12px;border-color:#4834221f;background:#fffaf2}.mobileSummaryContent .summaryOption small{font-size:.75rem}.mobileSummaryContent .summaryNestedPanel{gap:10px;margin-top:6px;padding:12px;border:1px solid rgba(72,52,34,.12);border-radius:10px;background:#ffffff8c}.mobileSummaryContent .summaryNestedTitle{font-size:.76rem}.mobileSummaryContent .summaryScaleGrid,.mobileSummaryContent .summaryIntervalGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:none;overflow:visible;padding-right:0}.mobileSummaryContent .summaryScaleButton,.mobileSummaryContent .summaryIntervalButton{min-height:48px;padding:8px 9px}.mobileSummaryContent .summarySelectAllButton{min-height:46px}.mobileSummaryContent .summaryMenuActions{display:none}}.stringRow[data-string-number="1"],.stringRow[data-string-number="6"]{min-height:clamp(17px,1.65vw,23px)}.playingStringRow .stringLine,.showNut .playingStringRow .stringLabel:after{animation:stringPlaybackVibration .58s ease-out both;filter:brightness(1.22) saturate(1.18)}.playingNoteBadge{animation:notePlaybackGlow .64s ease-out both}.visuallyHidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.brandLogo{display:block;width:clamp(178px,18vw,232px);height:auto}.replayButton{white-space:nowrap}.timeAttackHeaderTimer{display:grid;gap:9px;width:min(360px,42vw);padding:10px 14px;border:1px solid rgba(139,83,7,.28);border-radius:10px;background:#fff7e9;box-shadow:0 10px 24px #57300017}.timeAttackHeaderLabel{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#4a2e1e;font-weight:900}.timeAttackHeaderLabel span{margin-left:auto}.timeAttackHeaderLabel strong{color:#9a3f2f;font-size:1.28rem}.timeAttackProgressTrack{height:9px;overflow:hidden;border-radius:999px;background:#5b3c2029}.timeAttackProgressFill{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#277a5b,#d18f1f 68%,#c7503d);transform:scaleX(1);transform-origin:left center;animation:timeAttackProgressCountdown 60s linear forwards;will-change:transform}@keyframes timeAttackProgressCountdown{to{transform:scaleX(0)}}@media(prefers-reduced-motion:reduce){.timeAttackProgressFill{width:var(--time-attack-progress-percent, 0%);transform:none;animation:none;will-change:auto}}.startPanelCopy{min-width:0}.startPanelActions{display:grid;flex:0 0 auto;gap:10px;min-width:220px}.startPanelActions .startButton,.timeAttackSettingsButton{width:100%}.timeAttackSettingsNotice{margin-top:14px;padding:10px 12px;border-left:4px solid #d18f1f;border-radius:6px;color:#69461d;background:#fff4e3db;font-size:.82rem;line-height:1.5}.rootStringSelectionState{display:inline;margin-left:10px;color:#6c6b5f}.activeRootStringItem .rootStringSelectionState{color:#277a5b}.rootStringCheckBadge{min-width:24px;padding:0 5px}@media(max-width:760px),(max-width:960px)and (max-height:560px)and (orientation:landscape){.brandLogo{width:clamp(128px,39vw,170px);padding:2px 6px;border-radius:8px;background:#fffaf1}.timeAttackHeaderTimer{order:2;width:100%;padding:8px 10px;border-color:#fff8e838;background:#fffcf61a;box-shadow:none}.timeAttackHeaderLabel{color:#fff8e8;font-size:.76rem}.timeAttackHeaderLabel strong{color:#ffd37a;font-size:1rem}.timeAttackProgressTrack{height:7px;background:#fff8e82e}.startPanelActions{width:100%;min-width:0}.timeAttackSettingsNotice{font-size:.74rem}.mobileSummaryContent .summaryOption.activeSummaryOption,.mobileSummaryContent .summaryOption[aria-pressed=true]{position:relative;padding-right:44px;border:2px solid #277a5b;color:#173f30;background:#dff3e8;box-shadow:0 8px 18px #277a5b1f}.mobileSummaryContent .summaryOption.activeSummaryOption:after,.mobileSummaryContent .summaryOption[aria-pressed=true]:after,.mobileSummaryContent .summaryScaleButton.activeSummaryChoice:after,.mobileSummaryContent [aria-pressed=true].summaryScaleButton:after{position:absolute;top:50%;right:14px;display:grid;place-items:center;width:24px;height:24px;border-radius:999px;color:#fff;background:#277a5b;content:"✓";font-size:.78rem;font-weight:950;transform:translateY(-50%)}.mobileSummaryContent .summaryOption.activeSummaryOption small,.mobileSummaryContent .summaryOption[aria-pressed=true] small{color:#315e4b}.mobileSummaryContent .summaryScaleButton,.mobileSummaryContent .summaryIntervalButton{position:relative}.mobileSummaryContent .summaryScaleButton.activeSummaryChoice,.mobileSummaryContent .summaryScaleButton[aria-pressed=true],.mobileSummaryContent .summaryIntervalButton.activeSummaryChoice,.mobileSummaryContent .summaryIntervalButton[aria-pressed=true]{padding-right:9px;border:2px solid #277a5b;color:#173f30;background:#dff3e8}.mobileSummaryContent .summaryIntervalButton.activeSummaryChoice,.mobileSummaryContent .summaryIntervalButton[aria-pressed=true]{padding-right:9px;border-color:#277a5b57;background:#e5f5eb}.mobileSummaryContent .summaryScaleButton.activeSummaryChoice:after,.mobileSummaryContent [aria-pressed=true].summaryScaleButton:after{content:none}}@media(max-width:760px)and (orientation:portrait)and (min-height:760px){.answerButton,.quizAnswered .answerButton{min-height:clamp(54px,6.8dvh,64px);padding:7px 4px}.answerSymbol{font-size:clamp(.96rem,4.7vw,1.2rem)}.answerName{font-size:clamp(.48rem,2.15vw,.62rem)}}@keyframes stringPlaybackVibration{0%{transform:translateY(-50%)}13%{transform:translateY(calc(-50% - 1.2px)) scaleY(1.22)}27%{transform:translateY(calc(-50% + 1px)) scaleY(.92)}41%{transform:translateY(calc(-50% - .7px)) scaleY(1.12)}58%{transform:translateY(calc(-50% + .45px)) scaleY(.96)}to{transform:translateY(-50%)}}@keyframes notePlaybackGlow{0%{filter:brightness(1) saturate(1)}34%{box-shadow:var(--note-playback-glow);filter:brightness(1.42) saturate(1.24)}to{filter:brightness(1) saturate(1)}}@media(max-width:760px),(max-width:960px)and (max-height:560px)and (orientation:landscape){.stringRow[data-string-number="1"],.stringRow[data-string-number="6"]{min-height:clamp(9px,2.7dvh,14px)}}@media(max-width:760px)and (orientation:portrait){.stringRow[data-string-number="1"],.stringRow[data-string-number="6"]{min-height:clamp(12px,2dvh,16px)}}@media(max-width:760px)and (max-height:700px)and (orientation:portrait){.tutorialPracticeAnswered .answerSection{padding-top:4px;padding-bottom:4px}.tutorialPracticeAnswered .answerGrid{gap:3px}.tutorialPracticeAnswered .answerButton{min-height:30px;gap:1px;padding:2px 3px;border-radius:6px}.tutorialPracticeAnswered .answerSymbol{font-size:clamp(.62rem,2.4vw,.78rem);line-height:1}.tutorialPracticeAnswered .answerName{font-size:.46rem;line-height:1}.tutorialPracticeAnswered .tutorialPanelAnswered{right:calc(8px + env(safe-area-inset-right));bottom:calc(6px + env(safe-area-inset-bottom));left:calc(8px + env(safe-area-inset-left));gap:6px;max-height:min(34dvh,150px);padding:7px 8px}.tutorialPracticeAnswered .tutorialPanelAnswered h2{margin-bottom:2px;font-size:.78rem;line-height:1.08}.tutorialPracticeAnswered .tutorialPanelAnswered p{font-size:.64rem;line-height:1.22}.tutorialPracticeAnswered .tutorialSuccessLabel{min-height:18px;margin-bottom:2px!important;padding:0 7px;font-size:.6rem}.tutorialPracticeAnswered .tutorialActions{gap:5px}.tutorialPracticeAnswered .tutorialActions .iconTextButton{min-height:28px;padding:0 8px;font-size:.62rem}}.trainingSummary.timeAttackPlayingSummary{grid-template-columns:minmax(0,1fr)}.timeAttackAbortButton{width:100%;min-height:62px;border:1px solid rgba(199,80,61,.3);border-radius:8px;color:#7b2f26;background:#fff0eceb;box-shadow:0 10px 24px #7b2f2614}.timeAttackAbortButton:hover{border-color:#c7503d7a;background:#ffe8e2}.timeAttackAbortDialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:7000;display:grid;place-items:center;padding:calc(24px + env(safe-area-inset-top)) calc(20px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(20px + env(safe-area-inset-left));background:#1618188f;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.timeAttackAbortCard{display:grid;gap:24px;width:min(540px,100%);max-height:calc(100dvh - 48px);padding:26px;overflow-y:auto;border:1px solid rgba(199,80,61,.22);border-radius:14px;background:radial-gradient(circle at 90% 10%,rgba(199,80,61,.1),transparent 32%),#fffaf1;box-shadow:0 0 0 4px #ffffff24,0 28px 80px #14100c6b}.timeAttackAbortCopy{display:flex;align-items:flex-start;gap:16px}.timeAttackAbortCopy>div{min-width:0}.timeAttackAbortIcon{display:inline-grid;flex:0 0 auto;place-items:center;width:52px;height:52px;border-radius:999px;color:#fffaf1;background:#c7503d;box-shadow:0 10px 24px #c7503d38}.timeAttackAbortCopy h2{margin:0 0 8px;color:#2a2019;font-size:clamp(1.15rem,2.4vw,1.48rem);line-height:1.3}.timeAttackAbortCopy p{margin:0;color:#665b51;font-size:.92rem;font-weight:750;line-height:1.6}.timeAttackAbortActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.timeAttackAbortActions .iconTextButton{width:100%;min-height:46px}.timeAttackAbortActions .dangerButton{border-color:#b94332;color:#fff;background:linear-gradient(135deg,#c7503d,#a93628);box-shadow:0 10px 22px #c7503d33}.timeAttackAbortActions .dangerButton:hover{border-color:#9e3024;background:linear-gradient(135deg,#b94332,#922a20)}@media(max-width:760px),(max-width:960px)and (max-height:560px)and (orientation:landscape){.trainingSummary.timeAttackPlayingSummary{display:grid;grid-template-columns:minmax(0,1fr)}.timeAttackAbortButton{min-height:42px;border-radius:9px;font-size:.76rem}.timeAttackAbortDialog{align-items:end;padding:calc(12px + env(safe-area-inset-top)) calc(10px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(10px + env(safe-area-inset-left))}.timeAttackAbortCard{gap:18px;width:100%;max-height:calc(100dvh - 24px);padding:18px;border-radius:14px}.timeAttackAbortCopy{gap:12px}.timeAttackAbortIcon{width:42px;height:42px}.timeAttackAbortCopy h2{font-size:1.08rem}.timeAttackAbortCopy p{font-size:.8rem;line-height:1.5}.timeAttackAbortActions .iconTextButton{min-height:44px}}.studyModeActive{overflow-x:hidden}.studyModeActive .quizLayout{width:min(100%,1540px);gap:12px}.studyTrainingSummary{grid-template-columns:minmax(0,1fr)}.studyTrainingSummary .modeSummarySelector{width:100%}.studyWorkspace{display:grid;gap:12px;min-width:0}.studyControlsCard{display:grid;gap:10px;padding:14px;border:1px solid rgba(72,52,34,.14);border-radius:12px;background:#fffdf8f5;box-shadow:0 8px 22px #36271912}.studyControlsHeader{display:flex;gap:16px;align-items:center;justify-content:space-between}.studyControlsHeader h2{margin:2px 0 0;color:#30251d;font-size:clamp(1rem,1.5vw,1.28rem)}.studyKicker{margin:0;color:#277a5b;font-size:.7rem;font-weight:900;letter-spacing:.08em}.studyUtilityControls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end}.studySelectAllButton,.studyInteractionModeButton,.studyRangeButton{min-height:40px;border:1px solid rgba(69,47,27,.18);border-radius:9px;color:#3d3027;background:#fffaf1;font-weight:850}.studySelectAllButton,.studyInteractionModeButton{display:inline-flex;gap:7px;align-items:center;justify-content:center;padding:0 12px}.studyInteractionModeControl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:3px;border:1px solid rgba(69,47,27,.14);border-radius:11px;background:#f3ede2}.studyInteractionModeButton{min-width:138px;white-space:nowrap}.studyInteractionModeButton.activeStudyInteractionMode{border:2px solid #277a5b;border-color:#277a5b;color:#173f30;background:#dff3e8;box-shadow:0 0 0 2px #277a5b21}.studyModeSelectionCheck{display:inline-grid;flex:0 0 auto;place-items:center;width:17px;height:17px;border-radius:999px}.activeStudyInteractionMode .studyModeSelectionCheck{color:#fff;background:#277a5b}.studyRangeControl{display:grid;grid-template-columns:repeat(2,minmax(48px,1fr));padding:3px;border:1px solid rgba(69,47,27,.14);border-radius:10px;background:#f3ede2}.studyRangeButton{min-height:34px;border:0;background:transparent}.studyRangeButton.activeStudyRange{color:#fff;background:#277a5b;box-shadow:0 2px 7px #277a5b38}.studyIntervalScroller{min-width:0}.studyIntervalGrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.studyIntervalChip{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px;align-items:center;min-height:55px;padding:7px 8px;border:1px solid rgba(69,47,27,.16);border-radius:9px;color:#514238;background:#fffaf1;text-align:left}.studyIntervalChip:hover{border-color:var(--study-marker-color)}.studyIntervalChip.activeStudyIntervalChip{border:2px solid var(--study-marker-color);color:var(--study-marker-text);background:var(--study-marker-soft)}.studyControlCheck{display:inline-grid;flex:0 0 auto;place-items:center;width:18px;height:18px;border:1px solid rgba(69,47,27,.26);border-radius:5px;color:#fff;background:#fffdf8}.activeStudyIntervalChip .studyControlCheck,.studySelectAllButton[aria-checked=true] .studyControlCheck{border-color:var(--study-marker-color, #277a5b);background:var(--study-marker-color, #277a5b)}.studyIntervalChipCopy{display:grid;min-width:0;line-height:1.08}.studyIntervalChipCopy strong{overflow:hidden;font-size:.9rem;text-overflow:ellipsis;white-space:nowrap}.studyIntervalChipCopy>span{overflow:hidden;font-size:.64rem;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.studyIntervalChipCopy small{margin-top:3px;color:#8a3b30;font-size:.58rem;font-weight:900}.studyEmptyNotice{margin:0;padding:9px 11px;border-left:4px solid #d18f1f;border-radius:7px;color:#624616;background:#fff4d8;font-size:.78rem;font-weight:800}.studyBoardArea{min-width:0}.studyFretboardShell{--study-string-label-width: 58px;--study-open-string-width: 48px;--study-first-fret-width: 128px;display:grid;gap:7px;min-width:0}.studyFretboardHint{display:flex;gap:12px;justify-content:space-between;padding-inline:4px;color:#76675c;font-size:.7rem;font-weight:750}.studyInteractionRootActive .studyFretboardHint span:first-child{color:#1e664d;font-weight:900}.studyInteractionPlaybackActive .studyFretboardHint span:first-child{color:#245d84;font-weight:900}.studyFretboardScroller{width:100%;overflow-x:auto;overflow-y:hidden;border:0;border-radius:0;background:transparent;box-shadow:none;scrollbar-color:#8f725a #e8dece;scrollbar-width:thin;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.studyFretboardScroller:focus-visible{outline:3px solid rgba(39,122,91,.4);outline-offset:3px}.studyFretboardCanvas{width:max-content;min-width:100%;padding-bottom:12px}.studyFretNumberRow,.studyStringRow{display:grid;grid-template-columns:58px repeat(25,64px)}.studyFretNumberRow{position:relative;z-index:5;min-height:28px;margin-bottom:7px;color:#7c6c58;background:transparent;font-size:.68rem;font-weight:850}.studyStickyCorner,.studyStringLabel{position:sticky;left:0;z-index:50;display:grid;isolation:isolate;place-items:center;color:#f7eee1;background:linear-gradient(90deg,#070504,#2c160a);background-clip:padding-box;box-shadow:5px 0 9px #140d0847}.studyStickyCorner{color:#7c6c58;background:#f6f2ea;box-shadow:5px 0 9px #51392514}.studyFretNumber{display:grid;place-items:center;min-width:0;border-radius:999px}.studyFretNumberInRange{margin:2px 3px;color:#174c38;background:#d8f1e3;box-shadow:inset 0 0 0 1px #277a5b52;font-weight:950}.studyOpenStringNumber{align-content:center;gap:1px;font-size:.68rem;letter-spacing:-.03em;white-space:nowrap}.studyOpenStringNumber small{font-size:.48rem;line-height:1}.studyFretboardWood{--fretboard-edge-top-glow: rgba(255, 239, 198, .12);--fretboard-edge-bottom-shade: rgba(0, 0, 0, .28);--fretboard-inset-top-line: rgba(255, 239, 198, .18);--fretboard-inset-upper-glow: rgba(255, 229, 174, .06);--fretboard-inset-lower-shadow: rgba(0, 0, 0, .46);--fretboard-overlay-top-glow: rgba(255, 248, 224, .07);--fretboard-overlay-bottom-shade: rgba(0, 0, 0, .2);--fretboard-surface-top-glow: rgba(255, 247, 222, .16);--fretboard-surface-bottom-shade: rgba(0, 0, 0, .34);--fretboard-dark-bevel-layer: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent 7%, transparent 91%, rgba(0, 0, 0, .58));--wound-string-background: repeating-linear-gradient(90deg, rgba(255, 242, 187, .98) 0 1px, rgba(165, 96, 28, .98) 1px 2px, rgba(255, 214, 126, .96) 2px 3px), linear-gradient(180deg, #fff4c9 0%, #e6ad4c 36%, #9b5c1f 62%, #f2bf5b 82%, #5e3512 100%);--plain-string-background: linear-gradient(180deg, #ffffff 0%, #f1f1f1 30%, #a8a8a8 54%, #f8f8f8 74%, #595959 100%);--string-3d-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 -1px 1px rgba(255, 255, 255, .38), 0 0 7px rgba(255, 218, 134, .22);position:relative;overflow:visible;border:1px solid rgba(22,12,7,.96);border-radius:0 26px 26px 0;background:linear-gradient(180deg,var(--fretboard-edge-top-glow),transparent 24%,var(--fretboard-edge-bottom-shade) 100%),radial-gradient(ellipse at 50% 48%,transparent 46%,rgba(0,0,0,.22) 100%),url(/assets/fretboard-ebony-4-BJ2lF-Oo.png) center / cover no-repeat,#17110e;box-shadow:inset 0 2px 0 var(--fretboard-inset-top-line),inset 0 10px 18px var(--fretboard-inset-upper-glow),inset 0 -8px 16px var(--fretboard-inset-lower-shadow),inset 14px 0 18px #00000052,inset -18px 0 28px #00000057}.studyFretboardWood:before,.studyFretboardWood:after{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border-radius:inherit;content:""}.studyFretboardWood:before{z-index:1;background:linear-gradient(90deg,rgba(0,0,0,.28),transparent 10%,transparent 88%,rgba(0,0,0,.34)),linear-gradient(180deg,var(--fretboard-overlay-top-glow),transparent 50%,var(--fretboard-overlay-bottom-shade))}.studyFretboardWood:after{z-index:3;background:var(--fretboard-dark-bevel-layer),linear-gradient(180deg,var(--fretboard-surface-top-glow),transparent 18%,transparent 82%,var(--fretboard-surface-bottom-shade)),radial-gradient(ellipse at 50% 52%,transparent 44%,rgba(0,0,0,.28) 100%),linear-gradient(90deg,rgba(255,213,142,.1),transparent 16%,transparent 82%,rgba(255,255,255,.08))}.studyPositionMarkerLayer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:grid;grid-template-columns:58px repeat(25,64px);pointer-events:none}.studyPositionMarkerSlot{position:relative;min-width:0}.studyPositionMarkerDot{position:absolute;left:50%;width:21px;height:21px;border:1px solid rgba(78,49,24,.32);border-radius:999px;background:radial-gradient(circle at 34% 28%,#fffdf2,#e4cfaa 56%,#a9875d);box-shadow:inset 0 1px #ffffff94,inset 0 -2px 3px #52301633,0 2px 5px #00000047;transform:translate(-50%,-50%)}.studySingleMarkerSlot .studyPositionMarkerDot{top:50%}.studyDoubleMarkerSlot .studyPositionMarkerDot:first-child{top:25%}.studyDoubleMarkerSlot .studyPositionMarkerDot:last-child{top:75%}.studyStringRow{position:relative;z-index:auto;height:clamp(29px,2.85vw,39px)}.studyStringRow[data-study-string-row="1"],.studyStringRow[data-study-string-row="6"]{height:clamp(17px,1.65vw,23px)}.studyStringLabel{border-right:0;font-size:.7rem;font-weight:900;text-shadow:0 1px 2px rgba(0,0,0,.6)}.studyFretCell{position:relative;display:grid;place-items:center;min-width:0;padding:0;overflow:visible;border:0;border-radius:0;color:inherit;background:transparent}.studyFretCell:before{position:absolute;top:-5px;right:-5px;bottom:-5px;z-index:4;width:10px;content:"";border-radius:999px;background:linear-gradient(90deg,#1f1e1c,#8e887f 13%,#fffdf2 34%,#78736c,#f1eadb 74%,#33302c);box-shadow:-2px 0 2px #00000080,1px 0 #ffffff80,3px 0 7px #0000005c}.studyStringRow[data-study-string-row="1"] .studyFretCell:before{top:0}.studyStringRow[data-study-string-row="6"] .studyFretCell:before{bottom:0}.studyFretCell[data-study-fret="0"]:before{right:-6px;width:12px;border-radius:2px;background:linear-gradient(90deg,#9f8d6e,#f8ebcf 30%,#fff9e9 52%,#d7c09c,#8c785a);box-shadow:-2px 0 3px #00000075,2px 0 2px #ffffff57}.studyFretCell.studyFretOutOfRange{background:#0c090799}.studyFretCell.studyFretInRange{background:linear-gradient(180deg,#d8f1e338,#277a5b47)}.studyStringRow[data-study-string-row="1"] .studyFretInRange{border-top:3px solid #6ed2a5}.studyStringRow[data-study-string-row="6"] .studyFretInRange{border-bottom:3px solid #6ed2a5}.studyFretCell.studyFretRangeStart{border-left:3px solid #6ed2a5}.studyFretCell.studyFretRangeEnd{border-right:3px solid #6ed2a5}.studyFretCell:hover,.studyFretCell:focus-visible{z-index:3;background:#ffffff17}.studyFretCell:focus-visible{outline:3px solid #f3c665;outline-offset:-3px}.studyInteractionRootActive .studyFretCell{cursor:crosshair}.studyInteractionPlaybackActive .studyFretCell[aria-disabled=true]{cursor:default}.studyInteractionPlaybackActive .studyFretCell[aria-disabled=true]:hover{background:#0c090799}.studyInteractionPlaybackActive .studyFretInRange[aria-disabled=true]:hover{background:linear-gradient(180deg,#d8f1e338,#277a5b47)}.studyStringLine{position:absolute;top:50%;right:0;left:0;height:1px;z-index:5;background:var(--wound-string-background);background-blend-mode:overlay,normal;box-shadow:var(--string-3d-shadow);transform:translateY(-50%)}.studyStringRow[data-study-string-row="1"] .studyStringLine,.studyStringRow[data-study-string-row="2"] .studyStringLine,.studyStringRow[data-study-string-row="3"] .studyStringLine{background:var(--plain-string-background)}.studyStringRow[data-study-string-row="2"] .studyStringLine{height:1.3px}.studyStringRow[data-study-string-row="3"] .studyStringLine{height:1.7px}.studyStringRow[data-study-string-row="4"] .studyStringLine{height:2.2px}.studyStringRow[data-study-string-row="5"] .studyStringLine{height:2.6px}.studyStringRow[data-study-string-row="6"] .studyStringLine{height:3px}.studyNoteMarker{position:absolute;top:50%;left:50%;z-index:10;display:grid;place-items:center;min-width:35px;min-height:35px;padding:4px;border:3px solid rgba(255,255,255,.92);border-radius:999px;color:#fff;font-size:.72rem;font-weight:950;line-height:1;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.38);box-shadow:0 3px 9px #00000052;transform:translate(-50%,-50%)}.studyRootMarker{min-width:39px;min-height:39px;color:#fffdf8;background:#e0890ab3;box-shadow:0 0 0 7px #ffaa2333,0 0 24px #ffae26f2,0 0 58px #ffae2670}.studyTargetMarker{color:#fff;background:var(--study-marker-color)}.studyPlayingCell .studyNoteMarker{animation:studyNotePulse .68s ease-out;box-shadow:0 0 0 8px #fff4be47,0 0 22px #ffe276db}@keyframes studyNotePulse{0%{transform:translate(-50%,-50%) scale(.86)}45%{transform:translate(-50%,-50%) scale(1.16)}to{transform:translate(-50%,-50%) scale(1)}}.studyTutorialFocus{position:relative;z-index:6;outline:3px solid #d18f1f;outline-offset:3px;box-shadow:0 0 0 7px #d18f1f29}.helpChooserDialog,.studyTutorialDialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:7200;display:grid;place-items:center;padding:20px;background:#261d176e;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.helpChooserCard,.studyTutorialConfirmCard{display:grid;gap:18px;width:min(560px,100%);max-height:calc(100dvh - 40px);padding:clamp(18px,4vw,30px);overflow-y:auto;border:1px solid rgba(72,52,34,.18);border-radius:16px;background:#fffdf8;box-shadow:0 28px 70px #261b124d}.helpChooserHeader{display:flex;gap:16px;align-items:flex-start;justify-content:space-between}.helpChooserHeader p,.studyTutorialConfirmCard .tutorialKicker{margin:0 0 4px;color:#277a5b;font-size:.72rem;font-weight:900;letter-spacing:.08em}.helpChooserHeader h2,.studyTutorialConfirmCard h2{margin:0;color:#30251d;font-size:clamp(1.2rem,3vw,1.55rem)}.helpChooserOptions{display:grid;gap:10px}.helpChooserOption{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;min-height:82px;padding:14px;border:1px solid rgba(69,47,27,.17);border-radius:12px;color:#3b2d24;background:#fff9ef;text-align:left}.helpChooserOption:hover,.helpChooserOption:focus-visible{border-color:#277a5b;background:#edf7f1}.helpChooserOption>span{display:grid;gap:3px}.helpChooserOption small{color:#79695e;font-size:.74rem;line-height:1.4}.studyTutorialConfirmCard>div:first-child{display:grid;gap:6px}.studyTutorialConfirmCard p{margin:0;color:#67584e;line-height:1.65}.studyTutorialHideCheck{display:inline-flex;gap:8px;align-items:center;width:fit-content;color:#514238;font-size:.84rem;font-weight:800}.studyTutorialActions{display:flex;flex-wrap:wrap;gap:9px;justify-content:flex-end}.studyTutorialPanel{position:fixed;top:50%;left:50%;z-index:7100;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;width:min(430px,calc(100vw - 32px));padding:15px;border:2px solid #d18f1f;border-radius:14px;background:#fffaf0;box-shadow:0 18px 48px #39271640;transform:translate(-50%,-50%)}.studyTutorialPanel h2{margin:2px 0 4px;font-size:1rem}.studyTutorialPanel p{margin:0;color:#67584e;font-size:.76rem;line-height:1.45}.studyTutorialPanel .tutorialKicker{color:#9a6410;font-weight:900}.studyTutorialSkipButton{min-height:40px;padding-inline:11px;white-space:nowrap}.studyTutorialPanelActions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.studyTutorialNextButton{min-height:40px;padding-inline:13px;white-space:nowrap}.studyTutorialComplete{grid-template-columns:auto minmax(0,1fr);border-color:#277a5b;background:#edf7f1}.studyTutorialComplete>.iconTextButton{grid-column:1 / -1;justify-self:end}@media(max-width:760px),(max-width:960px)and (max-height:560px)and (orientation:landscape){.studyModeActive .quizLayout{display:flex;flex-direction:column}.studyModeActive .appHeader{order:1}.studyModeActive .studyTrainingSummary{order:2}.studyModeActive .studyWorkspace{order:3}}.studyModeLabelShort,.studyMobileIntervalSummary{display:none}.studyIntervalSheetDialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:7050;display:grid;align-items:end;padding:calc(18px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));background:#241b1470;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.studyIntervalSheetPanel{display:grid;grid-template-rows:auto auto auto minmax(0,1fr);gap:10px;width:min(620px,100%);max-height:min(70dvh,560px);margin-inline:auto;padding:10px 14px 14px;overflow:hidden;border:1px solid rgba(72,52,34,.18);border-radius:18px 18px 14px 14px;background:#fffdf8;box-shadow:0 -20px 54px #1b130c52}.studyIntervalSheetHandle{justify-self:center;width:42px;height:4px;border-radius:999px;background:#5f4a3747}.studyIntervalSheetHeader{display:flex;gap:12px;align-items:center;justify-content:space-between}.studyIntervalSheetHeader p{margin:0 0 3px;color:#277a5b;font-size:.68rem;font-weight:900;letter-spacing:.08em}.studyIntervalSheetHeader h2{margin:0;color:#30251d;font-size:1.04rem}.studyIntervalSheetStatus{position:relative;z-index:1;padding:9px 10px;border:1px solid rgba(72,52,34,.12);border-radius:11px;background:#fff8ec;color:#4c3d32;font-size:.82rem;font-weight:900}.studyIntervalSheetStatus>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.studyIntervalSheetActions{display:flex;justify-content:flex-end;min-height:36px}.studySheetSelectAllButton{min-height:36px;padding-inline:10px;white-space:nowrap}.studyIntervalSheetScroller{min-height:0;overflow-y:auto;border-top:1px solid rgba(72,52,34,.1);padding-top:10px;padding-right:2px;overscroll-behavior:contain}@media(min-width:1320px){.studyIntervalGrid{grid-template-columns:repeat(12,minmax(0,1fr))}.studyIntervalChip{grid-template-columns:1fr;justify-items:center;min-height:66px;text-align:center}.studyIntervalChip .studyControlCheck{position:absolute;margin:-42px 0 0 54px}}@media(max-width:900px){.studyFretboardShell{--study-string-label-width: 52px;--study-open-string-width: 44px;--study-first-fret-width: 114px}.studyControlsHeader{align-items:flex-start;flex-direction:column}.studyUtilityControls{width:100%;justify-content:flex-start}.studyFretNumberRow,.studyStringRow,.studyPositionMarkerLayer{grid-template-columns:52px repeat(25,58px)}.studyPositionMarkerDot{width:16px;height:16px}}@media(max-width:760px){.studyFretboardShell{--study-string-label-width: 36px;--study-open-string-width: 40px;--study-first-fret-width: 100px}.studyModeActive .quizLayout{gap:8px}.studyControlsCard{gap:7px;padding:8px;border-radius:10px}.studyControlsHeader{gap:0}.studyControlsHeader>div:first-child,.studyDesktopSelectAllButton,.studyDesktopIntervalPicker,.studyControlsCard>.studyEmptyNotice,.studyModeLabelFull{display:none}.studyModeLabelShort{display:inline}.studyControlsHeader h2{font-size:.98rem}.studyUtilityControls{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;width:100%}.studySelectAllButton,.studyInteractionModeButton{min-height:38px;padding-inline:8px;font-size:.7rem}.studyInteractionModeControl{order:1;width:100%}.studyInteractionModeButton{min-width:0}.studyRangeControl{order:2;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.studyMobileIntervalSummary{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:center;padding:8px;border:1px solid rgba(72,52,34,.12);border-radius:10px;background:#fff8ec}.studyMobileIntervalSummaryText{overflow:hidden;color:#4c3d32;font-size:.78rem;font-weight:900;text-overflow:ellipsis;white-space:nowrap}.studyMobileIntervalButton{min-height:36px;padding:0 13px;border-radius:999px;white-space:nowrap}.studyIntervalScroller{overflow-x:auto;padding-bottom:3px;overscroll-behavior-x:contain;scrollbar-width:thin}.studyIntervalGrid{grid-auto-columns:132px;grid-auto-flow:column;grid-template-columns:none;grid-template-rows:repeat(2,minmax(52px,auto));width:max-content}.studyIntervalSheetGrid{grid-auto-columns:unset;grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;width:auto}.studyIntervalChip{min-height:52px;padding:6px 7px}.studyFretboardHint{display:grid;gap:2px;font-size:.62rem}.studyFretNumberRow,.studyStringRow,.studyPositionMarkerLayer{grid-template-columns:36px repeat(25,52px)}.studyFretboardWood{border-radius:0 18px 18px 0}.studyFretNumberRow{margin-bottom:8px}.studyOpenStringNumber{font-size:.62rem}.studyOpenStringNumber small{font-size:.42rem}.studyFretCell:before{top:-3px;right:-3px;bottom:-3px;width:6px}.studyFretCell[data-study-fret="0"]:before{right:-4px;width:8px}.studyPositionMarkerDot{width:12px;height:12px}.studyStringRow{height:clamp(21px,3.5dvh,27px)}.studyStringRow[data-study-string-row="1"],.studyStringRow[data-study-string-row="6"]{height:clamp(9px,2.7dvh,14px)}.studyStringLabel{font-size:.58rem}.studyNoteMarker{min-width:26px;min-height:26px;max-width:38px;font-size:.63rem}.studyRootMarker{min-width:30px;min-height:30px}.studyTutorialPanel{top:auto;bottom:max(10px,env(safe-area-inset-bottom));left:10px;right:10px;grid-template-columns:minmax(0,1fr);width:auto;padding:11px 12px;transform:none}.studyTutorialPanel h2{font-size:.9rem}.studyTutorialPanel p{font-size:.69rem}.studyTutorialPanelActions{justify-content:flex-end}.studyTutorialNextButton,.studyTutorialSkipButton{min-height:34px}.helpChooserDialog,.studyTutorialDialog{padding:calc(12px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}.helpChooserCard,.studyTutorialConfirmCard{gap:14px;max-height:calc(100dvh - 24px);padding:17px}}@media(max-width:760px)and (orientation:portrait){.studyStringRow[data-study-string-row="1"],.studyStringRow[data-study-string-row="6"]{height:clamp(12px,2dvh,16px)}}@media(min-width:761px)and (max-width:960px)and (max-height:560px)and (orientation:landscape){.studyStringRow{height:clamp(21px,3.5dvh,27px)}.studyStringRow[data-study-string-row="1"],.studyStringRow[data-study-string-row="6"]{height:clamp(9px,2.7dvh,14px)}}@media(max-width:380px){.studyIntervalSheetPanel{max-height:calc(100dvh - 24px)}.studyUtilityControls{grid-template-columns:minmax(0,1fr)}.studyInteractionModeButton{gap:5px;padding-inline:6px;font-size:.64rem}.studyIntervalGrid{grid-auto-columns:122px}.studyIntervalSheetGrid{grid-auto-columns:unset;grid-template-columns:repeat(2,minmax(0,1fr))}.studyIntervalSheetStatus{padding-block:8px}.studySheetSelectAllButton{width:100%}}.chordModeActive .trainingSummary{grid-template-columns:1fr 1fr}.chordNoteCountControl{grid-template-columns:repeat(2,minmax(0,1fr))}.chordNoteCountControl .segmentButton{display:grid;gap:3px;align-content:center;min-height:58px;padding:8px;line-height:1.2}.chordNoteCountControl .segmentButton small{color:currentColor;font-size:.64rem;font-weight:750;opacity:.78}.chordQuestionPrompt .targetInline{min-width:38px;padding-inline:7px}.chordFretboardShell .noteBadge{min-width:42px;min-height:42px;font-size:.92rem}.chordToneBadge{background:#2b7babb8}.currentChordToneBadge{border-color:#fff7d6;box-shadow:0 0 0 8px #68b4ff38,0 0 0 13px #ffd37a33,0 0 30px #68b4fff5,0 0 64px #68b4ff6b}.answeredChordToneBadge:not(.chordRootBadge){opacity:.76}.chordSectionHeader{display:flex;align-items:center;justify-content:space-between;gap:10px}.chordSectionHeader>span{flex:0 0 auto;color:#756c63;font-size:.82rem;font-weight:900}.chordFeedback{grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr) auto;align-items:center}.chordFeedbackResult{min-width:0}.chordAnswerReview{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:8px;min-width:0}.chordAnswerReviewItem{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:center;min-height:48px;padding:7px 9px;border:1px solid rgba(72,52,34,.14);border-radius:8px;background:#fffaf1}.chordAnswerReviewItem.correctChordAnswer{border-color:#277a5b47;background:#e5f5eb}.chordAnswerReviewItem.wrongChordAnswer{border-color:#c7503d47;background:#fff0ec}.chordAnswerMarker{display:inline-grid;place-items:center;min-width:34px;min-height:34px;padding-inline:6px;border-radius:999px;color:#fffdf8;background:#2b7bab;font-size:.78rem;font-weight:950}.chordAnswerReviewCopy{display:grid;gap:2px;min-width:0}.chordAnswerReviewCopy strong,.chordAnswerReviewCopy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chordAnswerReviewCopy strong{color:#2a2019;font-size:.78rem;line-height:1.15}.chordAnswerReviewCopy small{color:#8a3b30;font-size:.66rem;font-weight:850}@media(min-width:761px){.quizAnswered .chordFeedback{grid-template-columns:minmax(210px,.72fr) minmax(0,1.3fr) auto}}@media(max-width:760px){.chordModeActive .trainingSummary{grid-template-columns:1fr 1fr}.chordQuestionPrompt .targetInline{min-width:32px}.chordFretboardShell{padding-bottom:8px}.chordFretboardShell .noteBadge{min-width:30px;min-height:30px;padding-inline:5px;border-width:2px;font-size:.68rem}.chordAnswerSection .answerGrid{grid-template-columns:repeat(4,minmax(0,1fr))}.chordFeedback{grid-template-columns:1fr;max-height:min(50dvh,340px);overflow-y:auto}.chordAnswerReview{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.chordAnswerReviewItem{min-height:40px;padding:5px 6px}.chordAnswerMarker{min-width:27px;min-height:27px;font-size:.65rem}.chordAnswerReviewCopy strong{font-size:.66rem}.chordAnswerReviewCopy small{font-size:.58rem}}@media(max-width:380px){.chordAnswerReview,.chordNoteCountControl{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.studyPlayingCell .studyNoteMarker{animation:none}}