:root{--font-display: "Pacifico", "Segoe Script", "Bradley Hand", cursive;--font-course-name: "Sacramento", "Segoe Script", "Bradley Hand", cursive;--kafe-radius: 14px;--kafe-radius-sm: 9px;--kafe-pad: 16px;--page-top-bar-inner-min-height: 60px;--mac-sidebar-control-height: 36px;--kafe-desktop-window-width: 1200px;--kafe-chrome-bar-height: 122px;--kafe-hidden-titlebar-top: 14px;--kafe-hidden-titlebar-leading: 78px;--kafe-hidden-titlebar-toolbar-top: 22px;--kafe-bg: #e7f5f8;--kafe-bg-elevated: #ffffff;--kafe-bg-card: #ffffff;--kafe-bg-card-hover: #f0f0f0;--kafe-border: #cccccc;--kafe-text: #000000;--kafe-text-dim: #808080;--kafe-text-faint: #b3b3b3;--kafe-notation-paper: #ffffff;--kafe-accent: #007aff;--kafe-accent-strong: #4676ee;--kafe-blue: #007aff;--kafe-purple: #af52de;--kafe-orange: #ff9500;--kafe-yellow: #ffd60a;--kafe-green: #34c759;--kafe-correct: #00fac5;--kafe-incorrect: #f66366;--hand-left-white: #007aff;--hand-left-black: #285cc1;--hand-right-white: #af52de;--hand-right-black: #623283;--kafe-shadow: 0 4px 12px rgba(0, 0, 0, .12);--kafe-hub-button-bg: #ffffff;--kafe-hub-button-border: #d9d9d9;--kafe-hub-button-bg-gradient: var(--kafe-hub-button-bg);--kafe-hub-button-shadow: inset 0 2px 4px rgba(0, 0, 0, .08), 0 8px 18px rgba(0, 0, 0, .1);--kafe-hub-button-hover-shadow: 0 12px 28px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, .9);--kafe-sidebar-bg: #4d4d4d;--kafe-sidebar-text: #ffffff;--kafe-sidebar-text-dim: rgba(255, 255, 255, .75);--kafe-sidebar-text-faint: rgba(255, 255, 255, .55);--kafe-sidebar-divider: rgba(255, 255, 255, .5);--kafe-sidebar-pro-bg: #ff9500;--kafe-sidebar-pro-bg-cta: var(--kafe-sidebar-pro-bg);--kafe-sidebar-nav-hover: rgba(255, 255, 255, .1);--kafe-panel: #f5f5f5;--kafe-panel-hover: rgba(0, 0, 0, .06);--kafe-body-gradient: none;--kafe-spinner-track: rgba(0, 0, 0, .12);--kafe-desktop-wallpaper: radial-gradient(ellipse 120% 80% at 15% 10%, rgba(120, 180, 255, .55), transparent 55%), radial-gradient(ellipse 90% 70% at 85% 20%, rgba(180, 140, 255, .45), transparent 50%), radial-gradient(ellipse 100% 90% at 50% 100%, rgba(100, 200, 220, .35), transparent 60%), linear-gradient(145deg, #6eb5ff 0%, #9a8cff 38%, #c4a8ff 62%, #7ec8e8 100%);--kafe-desktop-window-shadow: 0 28px 70px rgba(15, 35, 70, .28), 0 8px 24px rgba(15, 35, 70, .16), 0 0 0 1px rgba(255, 255, 255, .45);--kafe-desktop-chrome-bg: rgba(255, 255, 255, .82);--kafe-unit-card-highlight: #f5d565;--kafe-unit-card-highlight-glow: rgba(245, 213, 101, .45);--kafe-unit-card-pulse-mid: rgba(245, 213, 101, .18);--kafe-announce-banner-bg: rgba(0, 122, 255, .08);--kafe-open-btn-text: #ffffff;--kafe-brand-gradient: linear-gradient( 90deg, var(--kafe-accent-strong) 0%, var(--kafe-purple) 55%, var(--kafe-orange) 100% );--kafe-brand-gradient-subtle: linear-gradient( 90deg, rgba(70, 118, 238, .1) 0%, rgba(175, 82, 222, .12) 55%, rgba(255, 149, 0, .08) 100% );color-scheme:light}[data-theme=dark]{--kafe-bg: #14102a;--kafe-bg-elevated: #1f1840;--kafe-bg-card: #261d4d;--kafe-bg-card-hover: #312663;--kafe-border: #3a2f6b;--kafe-text: #f5f0ff;--kafe-text-dim: #b6acd8;--kafe-text-faint: #8076a8;--kafe-notation-paper: #ffffff;--kafe-accent: #8b5cf6;--kafe-accent-strong: #a78bfa;--kafe-blue: #2f7bff;--kafe-purple: #af52de;--kafe-orange: #ff9f0a;--kafe-yellow: #ffd60a;--kafe-green: #30d158;--kafe-correct: #00fa92;--kafe-incorrect: #f66366;--hand-left-white: #2f7bff;--hand-left-black: #1e4fad;--hand-right-white: #af52de;--hand-right-black: #7a2f9e;--kafe-shadow: 0 10px 30px rgba(0, 0, 0, .35);--kafe-hub-button-bg: #2a234f;--kafe-hub-button-border: #453a75;--kafe-hub-button-bg-gradient: linear-gradient( 165deg, var(--kafe-bg-card-hover) 0%, var(--kafe-hub-button-bg) 100% );--kafe-hub-button-shadow: 0 8px 22px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .06);--kafe-hub-button-hover-shadow: 0 12px 28px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .08);--kafe-sidebar-bg: var(--kafe-bg-elevated);--kafe-sidebar-text: var(--kafe-text);--kafe-sidebar-text-dim: var(--kafe-text-dim);--kafe-sidebar-text-faint: var(--kafe-text-faint);--kafe-sidebar-divider: rgba(255, 255, 255, .18);--kafe-sidebar-pro-bg: var(--kafe-accent);--kafe-sidebar-pro-bg-cta: linear-gradient(90deg, var(--kafe-accent), var(--kafe-accent-strong));--kafe-sidebar-nav-hover: var(--kafe-bg-card-hover);--kafe-panel: #312663;--kafe-panel-hover: rgba(255, 255, 255, .06);--kafe-body-gradient: radial-gradient(1200px 600px at 80% -10%, rgba(139, 92, 246, .18), transparent 60%), radial-gradient(900px 500px at -10% 110%, rgba(47, 123, 255, .14), transparent 55%);--kafe-spinner-track: rgba(255, 255, 255, .15);--kafe-desktop-wallpaper: radial-gradient(ellipse 110% 75% at 10% 5%, rgba(90, 60, 180, .55), transparent 55%), radial-gradient(ellipse 85% 65% at 90% 15%, rgba(40, 90, 200, .45), transparent 50%), radial-gradient(ellipse 95% 80% at 55% 100%, rgba(120, 50, 160, .35), transparent 58%), linear-gradient(155deg, #0f1228 0%, #1a1848 35%, #241a58 65%, #121830 100%);--kafe-desktop-window-shadow: 0 32px 80px rgba(0, 0, 0, .55), 0 10px 28px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .08);--kafe-desktop-chrome-bg: rgba(31, 24, 64, .92);--kafe-unit-card-highlight: #f5d565;--kafe-unit-card-highlight-glow: rgba(245, 213, 101, .45);--kafe-unit-card-pulse-mid: rgba(245, 213, 101, .18);--kafe-announce-banner-bg: rgba(139, 92, 246, .12);--kafe-open-btn-text: #1a1000;--kafe-brand-gradient: linear-gradient( 90deg, var(--kafe-accent-strong) 0%, var(--kafe-purple) 55%, var(--kafe-orange) 100% );--kafe-brand-gradient-subtle: linear-gradient( 90deg, rgba(167, 139, 250, .14) 0%, rgba(175, 82, 222, .16) 55%, rgba(255, 159, 10, .1) 100% );color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}#root{display:flex;flex-direction:column}body{background:var(--kafe-body-gradient),var(--kafe-bg);color:var(--kafe-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:var(--kafe-accent-strong)}button{font-family:inherit}h1,h2,h3,h4{margin:0 0 .4em;font-weight:700;letter-spacing:-.01em}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:var(--kafe-radius-sm);padding:11px 18px;font-size:15px;font-weight:600;cursor:pointer;background:var(--kafe-bg-card);color:var(--kafe-text);transition:transform .06s ease,background .15s ease,opacity .15s ease}.btn:hover{background:var(--kafe-bg-card-hover)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(180deg,var(--kafe-accent-strong),var(--kafe-accent));color:#fff}.btn-primary:hover{filter:brightness(1.07);background:linear-gradient(180deg,var(--kafe-accent-strong),var(--kafe-accent))}.btn-ghost{background:transparent;border:1px solid var(--kafe-border)}.btn-block{width:100%}.card{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:var(--kafe-radius);padding:var(--kafe-pad)}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field label{font-size:13px;color:var(--kafe-text-dim)}.input{background:var(--kafe-bg);border:1px solid var(--kafe-border);border-radius:var(--kafe-radius-sm);padding:11px 13px;color:var(--kafe-text);font-size:15px}.input:focus{outline:2px solid var(--kafe-accent);outline-offset:1px}.muted{color:var(--kafe-text-dim)}.faint{color:var(--kafe-text-faint)}.error-text{color:var(--kafe-incorrect);font-size:14px}.row{display:flex;align-items:center;gap:12px}.spacer{flex:1}.center-screen{min-height:100%;flex:1;display:grid;place-items:center;padding:24px}.spinner{width:26px;height:26px;border-radius:50%;border:3px solid var(--kafe-spinner-track);border-top-color:var(--kafe-accent-strong);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.badge{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;background:var(--kafe-bg-elevated);border:1px solid var(--kafe-border);color:var(--kafe-text-dim)}.badge-free{color:var(--kafe-correct);border-color:#00fa9266}.badge-locked{color:var(--kafe-yellow);border-color:#ffd60a66}.subscription-status-section{display:flex;flex-direction:column;gap:4px}.subscription-status-row{display:flex;flex-wrap:wrap;gap:10px}.subscription-status-row--single{justify-content:flex-start}.subscription-status-pill{display:inline-flex;align-items:center;gap:8px;min-width:132px;padding:10px 14px;border-radius:12px;border:1px solid var(--kafe-border);background:var(--kafe-bg-elevated);color:var(--kafe-text-dim);font-size:14px;font-weight:700}.subscription-status-pill.is-active{color:var(--kafe-text)}.subscription-status-pill--edu.is-active{border-color:#ff95008c;background:#ff95001f}.subscription-status-pill--kafe.is-active{border-color:#00fa9273;background:#00fa921a}.subscription-status-pill-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;font-size:11px;font-weight:800;background:#ffffff14}.subscription-status-pill.is-active .subscription-status-pill-icon{background:#ffffff29}.subscription-status-pill-label{white-space:nowrap}.subscription-status-upgrade-btn{display:inline-flex;align-items:center;justify-content:center;min-width:132px;padding:10px 16px;border:none;border-radius:12px;background:var(--kafe-brand-gradient);color:#fff;font-size:14px;font-weight:800;letter-spacing:.01em;cursor:pointer;box-shadow:0 4px 16px #af52de59,0 2px 8px #ff950040;transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}.subscription-status-upgrade-btn:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:0 8px 22px #af52de6b,0 4px 12px #ff950052}.subscription-status-upgrade-btn:active{transform:translateY(0)}.app-frame{flex:1;min-height:0}.app-frame--desktop{display:flex;align-items:center;justify-content:center;min-height:100%;padding:28px 24px;background:var(--kafe-desktop-wallpaper);background-attachment:fixed}.app-frame--fullscreen{min-height:100%;min-height:100dvh}.app-window{display:flex;flex-direction:column;min-height:0;background:var(--kafe-body-gradient),var(--kafe-bg);color:var(--kafe-text)}.app-frame--desktop .app-window{position:relative;transform:translateZ(0);width:min(var(--kafe-desktop-window-width),100%);height:min(900px,calc(100dvh - 56px));max-height:calc(100dvh - 56px);border-radius:12px;overflow:hidden;box-shadow:var(--kafe-desktop-window-shadow)}.app-frame--fullscreen .app-window{flex:1;min-height:100%;min-height:100dvh}.app-window-traffic-overlay{position:absolute;top:var(--kafe-hidden-titlebar-top);left:var(--kafe-hidden-titlebar-top);z-index:300;pointer-events:none;-webkit-user-select:none;user-select:none}.app-window-traffic{display:flex;align-items:center;gap:8px}.app-window-traffic-dot{width:12px;height:12px;border-radius:50%;box-shadow:inset 0 -1px 1px #0000001f}.app-window-traffic-dot--close{background:#ff5f57}.app-window-traffic-dot--minimize{background:#febc2e}.app-window-traffic-dot--zoom{background:#28c840}.app-window-body{flex:1;min-height:0;display:flex;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch}.app-frame--desktop .app-window-body{overscroll-behavior:contain}.app-frame--desktop .shell{min-height:100%;flex:1}html[data-app-frame=desktop] body{background:var(--kafe-desktop-wallpaper);background-attachment:fixed}html[data-app-frame=fullscreen] .app-window-body{padding-bottom:env(safe-area-inset-bottom,0px)}html[data-app-frame=desktop] .app-window-body:has(.home-page),html[data-app-frame=desktop] .app-window-body:has(.pom-library-page),html[data-app-frame=desktop] .app-window-body:has(.unit-selection-page),html[data-app-frame=desktop] .app-window-body:has(.song-unit-page:not(.groove-session-page)){overflow:hidden}html[data-app-frame=desktop] .shell:has(.home-page),html[data-app-frame=desktop] .shell:has(.pom-library-page),html[data-app-frame=desktop] .shell:has(.unit-selection-page),html[data-app-frame=desktop] .shell:has(.song-unit-page:not(.groove-session-page)){min-height:0;overflow:hidden}html[data-app-frame=desktop] .content:has(.home-page){padding-top:0;padding-bottom:44px}html[data-app-frame=fullscreen] .content{max-width:none;padding-left:15px;padding-right:15px;padding-top:0}html[data-app-frame=desktop] .home-sidebar-clip,html[data-app-frame=desktop] .home-sidebar{height:100%;max-height:100%}html[data-app-frame=desktop] .reports-page{max-height:calc(100% - 92px)}html[data-app-frame=desktop] .unit-selection-page,html[data-app-frame=desktop] .pom-library-page,html[data-app-frame=desktop] .pom-activity-page{max-height:100%}html[data-app-frame=desktop] .song-unit-page:not(.groove-session-page){max-height:100%}html[data-app-frame=desktop] .groove-session-page,html[data-app-frame=fullscreen] .groove-session-page{max-height:100%}html[data-app-frame=desktop] .content:has(.song-unit-page),html[data-app-frame=desktop] .content:has(.groove-session-page),html[data-app-frame=fullscreen] .content:has(.groove-session-page){display:flex;flex-direction:column;min-height:0;padding-top:0;padding-bottom:12px}html[data-app-frame=desktop] .content:has(.home-page),html[data-app-frame=fullscreen] .content:has(.home-page),html[data-app-frame=desktop] .content:has(.pom-library-page),html[data-app-frame=fullscreen] .content:has(.pom-library-page),html[data-app-frame=desktop] .content:has(.pom-activity-page),html[data-app-frame=fullscreen] .content:has(.pom-activity-page),html[data-app-frame=desktop] .content:has(.unit-selection-page),html[data-app-frame=fullscreen] .content:has(.unit-selection-page),html[data-app-frame=desktop] .content:has(.song-unit-page),html[data-app-frame=fullscreen] .content:has(.song-unit-page){padding-left:0;padding-right:0;max-width:none}html[data-app-frame=desktop] .content:has(.groove-session-page),html[data-app-frame=fullscreen] .content:has(.groove-session-page),html[data-app-frame=desktop] .content:has(.flash-session-page),html[data-app-frame=fullscreen] .content:has(.flash-session-page),html[data-app-frame=desktop] .content:has(.instrument-session-page),html[data-app-frame=fullscreen] .content:has(.instrument-session-page),html[data-app-frame=desktop] .content:has(.lesson-video-page),html[data-app-frame=fullscreen] .content:has(.lesson-video-page),html[data-app-frame=desktop] .content:has(.staff-performance),html[data-app-frame=fullscreen] .content:has(.staff-performance){padding-left:0;padding-right:0;padding-bottom:0;max-width:none}html[data-app-frame=desktop] .shell:has(.song-unit-page),html[data-app-frame=desktop] .shell:has(.groove-session-page),html[data-app-frame=fullscreen] .shell:has(.groove-session-page),html[data-app-frame=desktop] .shell:has(.flash-session-page),html[data-app-frame=fullscreen] .shell:has(.flash-session-page),html[data-app-frame=desktop] .shell:has(.instrument-session-page),html[data-app-frame=fullscreen] .shell:has(.instrument-session-page),html[data-app-frame=desktop] .shell:has(.lesson-video-page),html[data-app-frame=fullscreen] .shell:has(.lesson-video-page),html[data-app-frame=desktop] .shell:has(.staff-performance),html[data-app-frame=fullscreen] .shell:has(.staff-performance){min-height:0}html[data-app-frame=desktop] .flash-session-page,html[data-app-frame=fullscreen] .flash-session-page,html[data-app-frame=desktop] .instrument-session-page,html[data-app-frame=fullscreen] .instrument-session-page,html[data-app-frame=desktop] .lesson-video-page,html[data-app-frame=fullscreen] .lesson-video-page,html[data-app-frame=desktop] .staff-performance,html[data-app-frame=fullscreen] .staff-performance{max-height:100%}html[data-app-frame=desktop] .content:has(.flash-session-page),html[data-app-frame=fullscreen] .content:has(.flash-session-page),html[data-app-frame=desktop] .content:has(.instrument-session-page),html[data-app-frame=fullscreen] .content:has(.instrument-session-page),html[data-app-frame=desktop] .content:has(.lesson-video-page),html[data-app-frame=fullscreen] .content:has(.lesson-video-page),html[data-app-frame=desktop] .content:has(.staff-performance),html[data-app-frame=fullscreen] .content:has(.staff-performance){padding-top:0;padding-bottom:0;display:flex;flex-direction:column;min-height:0}html[data-app-frame=desktop] .app-window-body:has(.flash-session-page),html[data-app-frame=fullscreen] .app-window-body:has(.flash-session-page),html[data-app-frame=desktop] .app-window-body:has(.instrument-session-page),html[data-app-frame=fullscreen] .app-window-body:has(.instrument-session-page),html[data-app-frame=desktop] .app-window-body:has(.lesson-video-page),html[data-app-frame=fullscreen] .app-window-body:has(.lesson-video-page){overflow:hidden;padding-bottom:0}html[data-app-frame=desktop] .app-window-body:has(.staff-performance),html[data-app-frame=fullscreen] .app-window-body:has(.staff-performance),html[data-app-frame=desktop] .app-window-body:has(.groove-session-page),html[data-app-frame=fullscreen] .app-window-body:has(.groove-session-page){overflow:hidden;padding-bottom:0}html[data-app-frame=desktop] .page-top-bar:not(.app-chrome-bar){padding-top:var(--kafe-hidden-titlebar-toolbar-top);padding-left:calc(var(--kafe-hidden-titlebar-leading) - 15px)}html[data-app-frame=desktop] .app-chrome-bar,html[data-app-frame=fullscreen] .app-chrome-bar{padding-top:0;padding-left:10px;padding-right:10px}html[data-app-frame=desktop] .staff-close-btn:not(.page-close-btn){left:calc(var(--kafe-hidden-titlebar-leading) - 12px);top:calc(var(--kafe-hidden-titlebar-toolbar-top) - 4px)}html[data-app-frame=desktop] .page-header{padding-top:var(--kafe-hidden-titlebar-toolbar-top);padding-left:calc(var(--kafe-hidden-titlebar-leading) - 15px)}.shell{display:flex;flex-direction:column;min-height:100%;flex:1}.content{flex:1;padding:28px 34px 64px;max-width:1180px;width:100%;margin:0 auto}.content:has(.groove-session-page),.content:has(.flash-session-page),.content:has(.lesson-video-page),.content:has(.home-page),.content:has(.pom-library-page),.content:has(.pom-activity-page),.content:has(.unit-selection-page),.content:has(.song-unit-page),.content:has(.staff-performance){padding-left:0;padding-right:0}.content:has(.pom-activity-page){max-width:none;display:flex;flex-direction:column;min-height:0;padding-top:0;padding-bottom:0}.content:has(.pom-library-page),.content:has(.unit-selection-page){max-width:none;display:flex;flex-direction:column;min-height:0;padding-top:0;padding-bottom:0}.content:has(.song-unit-page){max-width:none;display:flex;flex-direction:column;min-height:0;padding-top:0}.content:has(.groove-session-page),.content:has(.flash-session-page),.content:has(.lesson-video-page),.content:has(.staff-performance){max-width:none;display:flex;flex-direction:column;min-height:0;padding-top:0;padding-bottom:0}.content:has(.home-page){display:flex;flex-direction:column;min-height:0;padding-top:0;padding-bottom:48px}.page-header{margin-bottom:22px}.reports-page{display:flex;flex-direction:column;max-height:calc(100dvh - 92px)}html[data-app-frame=desktop] .account-page .page-header,html[data-app-frame=desktop] .reports-page .page-header{padding-left:0}.account-page .page-header-title-row .page-close-btn,.reports-page .page-header-title-row .page-close-btn{margin-left:0}.reports-page .page-header,.reports-page .stat-strip,.reports-page .toolbar{flex-shrink:0}.reports-page-list{flex:1;min-height:0;overflow-y:auto}.page-header h1{font-size:28px}.page-header p{margin:0;color:var(--kafe-text-dim)}.announce-banner{background:var(--kafe-announce-banner-bg);border:1px solid var(--kafe-border);border-radius:10px;padding:10px 14px;margin-bottom:18px;font-size:14px}.browser-recommend-banner{position:relative;background:#f59e0b24;border:1px solid rgba(245,158,11,.45);border-radius:10px;padding:12px 36px 12px 16px;font-size:14px;line-height:1.45;color:var(--kafe-text)}.browser-recommend-banner__dismiss{position:absolute;top:8px;right:8px;width:28px;height:28px;border:none;border-radius:999px;background:#0000002e;color:inherit;font-size:18px;line-height:1;cursor:pointer}.browser-recommend-banner__dismiss:hover{background:#00000047}.browser-recommend-banner strong{color:#fbbf24}.browser-recommend-banner a{color:var(--kafe-accent-strong);font-weight:600;white-space:nowrap}.browser-recommend-banner--app{border-radius:0;border-left:none;border-right:none;border-top:none;text-align:center}.auth-page-stack{width:100%;max-width:420px;display:flex;flex-direction:column;gap:14px}.auth-page-stack--signup{max-width:560px}.auth-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.auth-form-row .field{margin-bottom:0}@media (max-width: 520px){.auth-page-stack--signup{max-width:420px}.auth-form-row{grid-template-columns:1fr}}.auth-form-section+.auth-form-section{margin-top:20px;padding-top:20px;border-top:1px solid var(--kafe-border, rgba(148, 163, 184, .25))}.auth-form-section-title{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--kafe-text-muted, #64748b)}.auth-form-section .field,.auth-form-section .auth-form-row{margin-bottom:12px}.auth-form-section .auth-form-row:last-child{margin-bottom:0}.auth-course-group{margin-top:8px;margin-bottom:4px}.auth-course-group .field{margin-bottom:10px}.auth-course-hint{font-size:12px;margin:5px 0 10px;line-height:1.4}.input-affixed{position:relative}.input-affixed__input{width:100%;padding-right:52px}.input--masked{-webkit-text-security:disc}.input-affixed__action{position:absolute;top:0;right:0;bottom:0;padding:0 12px;border:none;background:none;color:var(--kafe-accent, #0ea5e9);font-size:13px;font-weight:500;cursor:pointer}.input-affixed__action:hover{opacity:.85}.auth-card{width:100%}.auth-header{text-align:center;margin-bottom:18px}.auth-header--full-sail .auth-brand-name{margin:0 0 6px;font-family:var(--font-display);font-size:28px;font-weight:400;line-height:1.15;color:var(--kafe-text)}.auth-header--full-sail .auth-header-icon{display:block;margin:0 auto;border-radius:12px}.auth-header--full-sail .auth-school-name{margin:6px 0 0;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--kafe-text-muted, #94a3b8)}.auth-header--full-sail h1{font-size:24px;margin:6px 0 0}.auth-header--full-sail .muted{margin:8px 0 0}.auth-decision-tree{display:flex;flex-direction:column;gap:10px;margin-bottom:4px}.auth-decision-prompt{margin:0 0 8px;font-size:15px;line-height:1.35;text-align:center}.btn-link{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;padding:0;color:var(--kafe-accent, #0ea5e9);text-decoration:underline;cursor:pointer;font:inherit}.btn-link:hover{opacity:.85}.auth-decision-btn{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;padding:14px 16px;height:auto}.auth-decision-btn strong{font-size:15px}.auth-decision-btn .muted{font-size:13px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}.tile{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:var(--kafe-radius);padding:18px;cursor:pointer;text-align:left;color:inherit;display:flex;flex-direction:column;gap:8px;transition:transform .08s ease,border-color .15s ease,background .15s ease}.tile:hover{transform:translateY(-2px);border-color:var(--kafe-accent);background:var(--kafe-bg-card-hover)}.tile h3{margin:0;font-size:17px}.tile .tile-sub{color:var(--kafe-text-dim);font-size:13px}.tile .tile-foot{margin-top:auto;display:flex;align-items:center;gap:8px}.tile-accent{height:4px;border-radius:4px;width:42px}.section-title{margin:28px 0 12px;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--kafe-text-faint)}.empty-state{text-align:center;padding:60px 20px;color:var(--kafe-text-dim)}.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:18px}.seg{display:inline-flex;background:var(--kafe-bg);border:1px solid var(--kafe-border);border-radius:10px;padding:3px;gap:3px}.seg button{border:none;background:transparent;color:var(--kafe-text-dim);padding:7px 14px;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px}.seg button.active{background:var(--kafe-accent);color:#fff}.piano-key{position:relative;box-sizing:border-box;cursor:pointer;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:none}.piano-key--disabled{cursor:default}.piano-key-img{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}.piano-key-overlay,.piano-key-decorative{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:1}.piano-key-decorative{background:gray}.piano-key>.groove-key-face{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2}.piano-wrap{width:100%;overflow-x:auto;padding:8px 0}.piano-wrap--fit{overflow-x:hidden;padding:8px 0}.piano{position:relative;display:flex;height:150px;-webkit-user-select:none;user-select:none;touch-action:none;min-width:max-content;margin:0 auto}.piano--fit{min-width:0;margin:0}.white-key{width:42px;height:150px;flex-shrink:0}.black-key{width:26px;height:95px;position:absolute;top:0;z-index:2}.key-label,.flash-session-piano .key-label{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:flex-end;justify-content:center;padding:6px;text-align:center;font-size:24px;font-stretch:condensed;font-weight:500;color:#595961;opacity:.7;line-height:1;pointer-events:none}[data-theme=dark] .flash-session-piano,[data-theme=dark] .staff-keyboard-wrap,[data-theme=dark] .groove-keyboard-wrap,[data-theme=dark] .melodic-keyboard-wrap{background:var(--kafe-bg-elevated);border-top:1px solid var(--kafe-border)}[data-theme=dark] .piano-key--white .piano-key-img{filter:brightness(.88) saturate(.85)}[data-theme=dark] .piano-key--black .piano-key-img{filter:brightness(.95)}[data-theme=dark] .key-label,[data-theme=dark] .flash-session-piano .key-label{color:#595961;opacity:.7}[data-theme=dark] .groove-white-key .groove-key-name{color:#000}[data-theme=dark] .groove-black-key .groove-key-name{color:#fff}.flash-stage{display:flex;flex-direction:column;gap:16px;align-items:center}.flash-card{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:var(--kafe-radius);padding:22px;width:100%;max-width:960px;text-align:center;min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.flash-instructions{font-size:20px;line-height:1.4}.flash-question-img{max-height:260px;max-width:100%;background:var(--kafe-notation-paper);border-radius:8px;padding:8px}.flash-notation{background:var(--kafe-notation-paper);border:1px solid var(--kafe-border);border-radius:8px;padding:8px;width:100%;max-width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001f}[data-theme=dark] .flash-notation{border-color:#af52de47;box-shadow:0 1px 3px #00000047,0 6px 18px #140c3059}.flash-notation-viewport{position:relative;width:100%;max-width:100%;max-height:min(42vh,380px);display:flex;align-items:center;justify-content:center;overflow:hidden}.flash-notation-canvas{display:block;flex-shrink:0}.flash-notation-image{display:block;max-width:100%;max-height:min(42vh,380px);width:auto;height:auto;object-fit:contain;margin:0 auto}.flash-notation-image-layer{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;opacity:0;pointer-events:none}.flash-notation-image-layer.is-active{opacity:1;z-index:1;pointer-events:auto}.flash-notation-image-swap{animation:flash-notation-fade-in .2s ease-out}@keyframes flash-notation-fade-in{0%{opacity:0}to{opacity:1}}.flash-notation-placeholder,.flash-notation-error{padding:24px 16px;font-size:13px;color:var(--kafe-text-dim);text-align:center}.flash-notation-error{color:var(--kafe-incorrect)}@keyframes flash-shake{0%,to{transform:translate(0)}25%{transform:translate(12px)}75%{transform:translate(-12px)}}@keyframes flash-pop{0%{transform:scale(1)}40%{transform:scale(1.05)}to{transform:scale(1)}}.flash-notation-shaking{animation:flash-shake .35s ease-in-out}.flash-notation-popping{animation:flash-pop .5s ease-out}.flash-session-page{display:flex;flex-direction:column;flex:1;min-height:0;width:100%}.lesson-video-page{position:relative;display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;min-height:0;width:100%;background:#000;overflow:hidden}.lesson-video-player{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;background:#000}.lesson-video-close.staff-close-btn{top:calc((var(--kafe-chrome-bar-height) - 44px) / 2);left:10px;color:#ffffffd9}html[data-app-frame=desktop] .lesson-video-close.staff-close-btn,html[data-app-frame=fullscreen] .lesson-video-close.staff-close-btn{top:calc((var(--kafe-chrome-bar-height) - 44px) / 2);left:10px}.lesson-video-close.staff-close-btn:hover{color:#fff}.lesson-video-page .center-screen{min-height:0;flex:1;width:100%}.lesson-video-page .center-screen .muted{color:#ffffffb8}.lesson-video-message{padding:24px;text-align:center;color:#ffffffb8}.flash-session-layout{display:flex;flex-direction:column;gap:0;flex:1;min-height:0;padding:0;box-sizing:border-box}.flash-session-stage{display:grid;grid-template-columns:minmax(0,1fr) 288px;flex:1;min-height:0;align-items:stretch;gap:10px;max-width:100%;padding-top:0}.flash-session-card-area{min-width:0;min-height:0;display:flex;flex-direction:column;align-self:stretch}.flash-session-notation-col{display:flex;flex-direction:column;align-items:stretch;width:100%;min-height:0;flex:1;padding:30px 20px 0;box-sizing:border-box}.flash-session-card-area .flash-card-body{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;overflow:visible;padding:0 6px 10px;box-sizing:border-box;margin-bottom:10px}.flash-session-instructions-row{display:grid;grid-template-columns:minmax(0,1fr) 288px;gap:10px;flex-shrink:0;width:100%;box-sizing:border-box}.flash-instructions-gradient{flex-shrink:0;font-size:18px;line-height:1.2;text-align:center;width:100%;min-height:35px;max-height:35px;display:flex;align-items:center;justify-content:center;padding:0 20px;margin:0;box-sizing:border-box;background:linear-gradient(90deg,var(--kafe-bg) 0%,#fff 18%,#fff 82%,var(--kafe-bg) 100%)}[data-theme=dark] .flash-instructions-gradient{background:linear-gradient(90deg,var(--kafe-bg) 0%,var(--kafe-bg-elevated) 18%,var(--kafe-bg-elevated) 82%,var(--kafe-bg) 100%)}.flash-session-piano{flex-shrink:0;box-sizing:border-box;width:calc(100% + env(safe-area-inset-left,0px) + env(safe-area-inset-right,0px));margin-left:calc(-1*env(safe-area-inset-left,0px));margin-right:calc(-1*env(safe-area-inset-right,0px));margin-bottom:calc(-1*env(safe-area-inset-bottom,0px));padding:0;overflow:visible}.flash-session-piano .piano-wrap,.flash-session-piano .piano-wrap.piano-wrap--fit{padding:0;overflow:hidden}.flash-session-piano .piano,.flash-session-piano .white-key{height:100px}.flash-session-piano .black-key{height:63px}.flash-session-piano .flash-midi-hint{display:none}.flash-session-sidebar{align-self:stretch;min-height:0;overflow-y:auto;overflow-x:hidden;padding:20px 10px 10px 0;box-sizing:border-box;gap:0}.flash-session-sidebar-shell{background:var(--kafe-bg-elevated);border-radius:10px;box-shadow:0 3px 8px #0000001f;width:100%}.flash-session-sidebar-section{padding:10px 11px}.flash-session-sidebar-section-title{margin:0 0 10px;font-size:17px;font-weight:600;color:var(--kafe-text-dim)}.flash-session-sidebar-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:10px}.flash-session-sidebar-section-heading .flash-session-sidebar-section-title{margin:0}.flash-session-sidebar-divider{border:none;border-top:1px solid var(--kafe-border);margin:0}.flash-sidebar-histo{width:100%;max-width:none;height:52px}.flash-midi-hint{margin:0;font-size:11px;text-align:center;flex-shrink:0}.flash-session-card-area .flash-notation.flash-notation-fill{flex:1 1 auto;height:100%;max-height:100%;min-height:240px;border:none;border-radius:7px;padding:0;box-shadow:0 1px 3px #00000029,0 3px 10px #0003;overflow:visible;background:var(--kafe-notation-paper)}[data-theme=dark] .flash-session-card-area .flash-notation.flash-notation-fill{box-shadow:0 1px 3px #00000047,0 6px 18px #140c3066}.flash-notation-fill .flash-notation-viewport{flex:1 1 auto;min-height:160px;max-height:none;height:100%}.flash-session-card-area .flash-notation-fill .flash-notation-viewport{flex:1 1 auto;min-height:0;max-height:100%;height:100%;width:100%;border-radius:7px;overflow:hidden;background:var(--kafe-notation-paper)}.flash-notation-fill .flash-notation-image{max-height:100%}.flash-session-card-area .flash-notation-fill .flash-notation-image{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.flash-session-card-area .flash-notation-fill .flash-notation-image-layer{max-width:100%;max-height:100%;width:100%;height:100%}.flash-session-info-mode{margin:0 0 8px;font-size:17px;font-weight:700}.flash-session-info-progress{display:flex;align-items:center;gap:10px;margin-bottom:8px}.flash-sidebar-progress{flex:1;max-width:none;margin:0}.flash-sidebar-progress>div{transition:width .35s ease-out,background-color .35s ease-out}.flash-session-info-time{font-size:14px;font-weight:700;color:var(--kafe-text-dim);font-variant-numeric:tabular-nums;flex-shrink:0}.flash-session-info-count{margin:0;font-size:14px;color:var(--kafe-text-dim);font-weight:600}.flash-sidebar-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 10px}.flash-sidebar-stats-compact{grid-template-columns:repeat(4,1fr);gap:6px 4px}.flash-sidebar-stats-compact .stat .v{font-size:17px}.flash-sidebar-stats-compact .stat .k{font-size:10px}.flash-session-sidebar .histo,.flash-session-sidebar .flash-sidebar-histo{height:76px;flex:none;min-height:0}.instrument-session-page{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;background:var(--kafe-bg)}.instrument-session-toolbar{display:flex;align-items:center;flex-shrink:0;height:var(--kafe-chrome-bar-height);min-height:var(--kafe-chrome-bar-height);padding:0 20px 0 10px;box-sizing:border-box;background:var(--kafe-bg);border-bottom:1px solid var(--kafe-border);box-shadow:0 5px 10px #0000001f}.instrument-session-toolbar-back{width:50px;height:50px;margin-right:20px}.instrument-session-title{flex:1;margin:0;text-align:center;font-family:var(--font-display);font-size:clamp(32px,4vw,54px);font-weight:400;color:var(--kafe-text);line-height:1.1}.instrument-session-picker-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:160px}.instrument-session-picker-label{font-size:12px;color:var(--kafe-text-dim)}.instrument-session-picker{min-width:180px;padding:8px 12px;border:1px solid var(--kafe-border);border-radius:10px;background:var(--kafe-bg-elevated);color:var(--kafe-text);font-size:15px;font-weight:600}.instrument-session-body{display:flex;flex:1;min-height:0;gap:0;padding:0 10px 20px 20px}.instrument-session-main{flex:1;min-width:0;display:flex;flex-direction:column;align-items:stretch;padding-top:20px}.instrument-session-instructions{width:calc(100% + 20px);margin-left:-20px;margin-bottom:8px;min-height:58px;display:flex;align-items:center;padding:0 20px;box-sizing:border-box;font-size:clamp(22px,3.2vw,42px);font-weight:600;font-stretch:condensed;background:linear-gradient(90deg,#fff,#fff0)}[data-theme=dark] .instrument-session-instructions{background:linear-gradient(90deg,var(--kafe-bg-elevated) 0%,transparent 100%);color:var(--kafe-text)}.instrument-session-image-wrap{flex:1;display:flex;align-items:center;justify-content:center;width:100%;min-height:0;padding:12px 24px}.instrument-session-image{max-width:min(100%,520px);max-height:min(48vh,420px);width:auto;height:auto;object-fit:contain;filter:drop-shadow(10px 10px 5px rgba(0,0,0,.18))}.instrument-session-image-placeholder{width:280px;height:200px}.instrument-session-image--pop{animation:flash-pop .5s ease-out}.instrument-session-image--shake{animation:flash-shake .35s ease-in-out}.instrument-session-clips-panel{display:flex;align-items:flex-end;justify-content:center;width:fit-content;max-width:100%;margin:0 auto;box-sizing:border-box;gap:100px;padding:16px 56px 16px 20px;background:var(--kafe-bg-elevated);color:var(--kafe-text);border-radius:20px;box-shadow:0 3px 12px #0000001f}.instrument-session-clips{display:flex;align-items:flex-end;flex-shrink:0;gap:35px}.instrument-session-clip{display:flex;flex-direction:column;align-items:center;gap:5px;flex-shrink:0;min-width:80px}.instrument-session-clip-label{width:100%;text-align:center;font-size:14px;font-style:italic;font-stretch:expanded;color:var(--kafe-text-dim)}.instrument-session-play-btn{display:inline-flex;align-items:center;justify-content:center;width:80px;height:80px;padding:0;border:none;border-radius:50%;cursor:pointer;color:#000000e6;background:linear-gradient(145deg,#78787899,#505050e6);box-shadow:inset 0 2px 4px #ffffff59,0 8px 16px #00000026;flex-shrink:0;overflow:hidden}.instrument-session-play-btn--selected{background:linear-gradient(145deg,#00b4aae6,#008cc8f2)}.instrument-session-play-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;font-size:40px;line-height:1;font-variation-settings:"FILL" 1,"wght" 500,"GRAD" 0,"opsz" 40;color:#000000e6;pointer-events:none}.instrument-session-select-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;font-size:18px;line-height:1;flex-shrink:0;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 20}.instrument-session-select-btn--selected .instrument-session-select-icon{color:#fff}.instrument-session-link-icon{font-size:16px;font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 20}.instrument-session-select-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 10px;border:2px solid rgba(0,122,255,.4);border-radius:999px;background:var(--kafe-bg-elevated);color:var(--kafe-blue);font-size:14px;cursor:pointer;white-space:nowrap;flex-shrink:0}.instrument-session-select-label{display:grid;line-height:1}.instrument-session-select-label>span{grid-area:1 / 1}.instrument-session-select-label-hidden{visibility:hidden}.instrument-session-select-btn--selected{background:var(--kafe-blue);border-color:var(--kafe-blue);color:#fff}.instrument-session-submit{flex-shrink:0;align-self:center;padding:12px 24px;border:none;border-radius:20px;background:#9ca3af;color:#fff;font-size:clamp(22px,2.5vw,34px);font-weight:800;font-stretch:condensed;cursor:not-allowed}.instrument-session-submit--active{background:var(--kafe-blue);cursor:pointer}.instrument-session-sidebar{width:288px;flex-shrink:0;padding:10px;box-sizing:border-box}.instrument-session-sidebar-card{background:var(--kafe-bg-elevated);color:var(--kafe-text);border-radius:10px;box-shadow:0 3px 12px #0000001f;overflow:hidden}.instrument-session-sidebar-section{padding:16px 16px 12px}.instrument-session-sidebar-title{margin:0 0 12px;font-size:13px;font-weight:600;color:var(--kafe-text-dim);text-transform:none}.instrument-session-sidebar-divider{border:none;border-top:1px solid var(--kafe-border);margin:0}.instrument-session-meta{margin:0 0 16px}.instrument-session-meta-row{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;align-items:baseline;font-size:16px}.instrument-session-meta-row dt{margin:0;font-weight:300;text-align:right}.instrument-session-meta-row dd{margin:0;font-weight:700}.instrument-session-mode-practice{color:var(--kafe-green)}.instrument-session-mode-test{color:var(--kafe-incorrect)}.instrument-session-progress{display:flex;flex-direction:column;align-items:center;gap:4px}.instrument-session-progress-track{width:163px;height:25px;border-radius:14px;background:#9ca3af;overflow:hidden}.instrument-session-progress-fill{height:100%;background:#fca326;border-radius:14px;transition:width .25s ease}.instrument-session-progress-label{font-size:10px;color:var(--kafe-text-dim)}.instrument-session-stats{display:flex;flex-direction:column;align-items:center}.instrument-session-stats-tabs{align-self:stretch;display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:12px;padding:3px;border-radius:8px;background:#e5e5ea}.instrument-session-stats-tab{border:none;border-radius:6px;padding:6px 8px;font-size:12px;font-weight:600;background:transparent;color:var(--kafe-text-dim);cursor:pointer}.instrument-session-stats-tab.active{background:var(--kafe-blue);color:#fff}.instrument-session-stats-grid{display:grid;grid-template-columns:auto auto;gap:5px 12px;margin:0;font-size:16px;width:fit-content}.instrument-session-stats-grid dt{margin:0;text-align:right;font-weight:400}.instrument-session-stats-grid dd{margin:0;text-align:left;font-weight:700}.instrument-session-reset{margin-top:10px;padding:0;border:none;background:none;color:var(--kafe-incorrect);font-size:14px;cursor:pointer;text-align:center}.instrument-session-info-name{margin:0 0 8px;font-size:18px;font-weight:700}.instrument-session-info-about{height:80px;margin-bottom:12px;padding:8px;border-radius:10px;background:var(--kafe-bg);color:var(--kafe-text);box-shadow:0 1px 4px #00000014;overflow:auto;font-size:14px;line-height:1.35}.instrument-session-info-about p{margin:0}.instrument-session-learn-more{margin:0 0 6px;font-size:18px;font-weight:600}.instrument-session-links{list-style:none;margin:0;padding:0}.instrument-session-links a{display:inline-flex;align-items:center;gap:6px;color:var(--kafe-blue);font-size:14px;text-decoration:none}.instrument-session-links a:hover{text-decoration:underline}.flash-speed-accuracy{display:flex;align-items:stretch;gap:10px}.flash-speed-accuracy-stats{display:flex;flex-direction:column;justify-content:center;gap:10px;flex-shrink:0}.flash-speed-stat{display:flex;flex-direction:column;align-items:center;gap:2px}.flash-speed-stat-label{font-size:10px;color:var(--kafe-text-dim);text-align:center}.flash-speed-stat-value{min-width:2.5rem;padding:1px 10px 3px;border:1px solid var(--kafe-border);border-radius:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:16px;line-height:1.2;text-align:center}.flash-speed-accuracy-chart{flex:1;min-width:0;padding:6px 8px;border:1px solid var(--kafe-border);border-radius:8px;background:var(--kafe-bg)}.flash-card-actions{display:flex;align-items:flex-end;justify-content:space-evenly;gap:20px;padding:0 10px}.flash-nav-btn{display:flex;flex-direction:column;align-items:center;gap:5px;flex:1 1 0;min-width:0;border:none;background:none;padding:0;cursor:pointer;color:inherit}.flash-nav-btn:disabled{cursor:default;opacity:.5}.flash-nav-btn__icon{display:flex;align-items:center;justify-content:center;width:45px;height:45px;color:var(--flash-nav-color, var(--kafe-accent))}.flash-nav-btn__icon svg{width:28px;height:28px}.flash-nav-btn__material-icon{font-size:28px;line-height:1;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}.flash-nav-btn__label{font-size:13px;font-weight:300;line-height:1.2;text-align:center}.stat-strip{display:flex;gap:18px;flex-wrap:wrap;justify-content:center}.stat{text-align:center}.stat .v{font-size:24px;font-weight:400}.stat .k{font-size:12px;color:var(--kafe-text-dim);text-transform:uppercase;letter-spacing:.05em}.progress{width:100%;max-width:760px;height:8px;background:var(--kafe-bg);border-radius:8px;overflow:hidden}.progress>div{height:100%;background:linear-gradient(90deg,var(--kafe-accent),var(--kafe-accent-strong));transition:width .3s ease}.histo{display:flex;align-items:flex-end;gap:3px;height:80px}.histo .bar{flex:1;border-radius:3px 3px 0 0;min-height:3px;background:var(--kafe-accent)}.histo .bar.perfect{background:var(--kafe-correct)}.histo .bar.almost{background:var(--kafe-yellow)}.histo .bar.incorrect{background:var(--kafe-incorrect)}.histo .bar.unanswered{background:var(--kafe-border)}.staff-performance{position:relative;display:flex;flex-direction:column;flex:1;gap:0;min-height:0;width:100%}.staff-performance>.performance-header-bar{flex-shrink:0}.performance-header-bar.app-chrome-bar{height:auto;min-height:var(--kafe-chrome-bar-height)}.performance-header-bar .mac-toolbar{align-items:center}.mac-toolbar-balanced>.performance-header-titles{min-width:0;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.performance-header-subtitle{margin:0;font-size:14px;line-height:1.2;font-style:italic;color:var(--kafe-text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.performance-header-mode{margin:0;font-size:12px;line-height:1.2;color:var(--kafe-text-faint);white-space:nowrap}.mac-unit-title-slot>.mac-session-title--fit{overflow:visible;text-overflow:clip;max-width:100%}.staff-performance>.center-screen{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;background:var(--kafe-bg, #fff)}.staff-performance-content{display:flex;flex-direction:column;flex:1;min-height:0;gap:0}.staff-performance-mid{flex:1 1 auto;display:flex;align-items:center;min-height:0;padding:0 12px}.staff-performance-top{flex:0 0 auto;display:flex;flex-direction:column;gap:8px;min-height:0}.staff-close-btn{position:absolute;top:4px;left:4px;z-index:5;width:44px;height:44px;border:none;border-radius:50%;background:transparent;color:var(--kafe-text-dim);font-size:36px;line-height:1;cursor:pointer}.staff-close-btn:hover{color:var(--kafe-text)}.staff-close-btn.page-close-btn{position:static;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-left:-8px;padding:0}.page-header-title-row{display:flex;align-items:center;gap:4px;margin-bottom:4px}.page-header-title-row h1{margin:0;line-height:1.15}.staff-countoff-header{flex:0 0 auto;text-align:center;padding:4px 48px 0;min-height:50px}.staff-countoff-label{margin:8px 0 0;font-size:clamp(24px,3.5vw,36px);color:var(--kafe-purple);font-weight:600;height:44px;line-height:44px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:1;transition:opacity 4s ease-out}.staff-countoff-label--fade-out{opacity:0}.scroll-score-viewport{--scroll-score-pdf-height: 400px;--scroll-score-padding-y: 20px;position:relative;flex:0 0 auto;height:calc(var(--scroll-score-pdf-height) + 2 * var(--scroll-score-padding-y));max-height:calc(var(--scroll-score-pdf-height) + 2 * var(--scroll-score-padding-y));min-height:0;margin:8px 0 0 20px;background:#fff;border-radius:20px 0 0 20px;box-shadow:0 4px 18px #00000040;overflow:hidden}.scroll-score-stage{position:absolute;top:var(--scroll-score-padding-y);right:0;bottom:var(--scroll-score-padding-y);left:0;overflow:hidden}.scroll-sigs-fixed{position:absolute;left:0;top:0;bottom:0;z-index:1;line-height:0}.scroll-sigs-fixed canvas{display:block;vertical-align:top}.scroll-score-clip{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;overflow:hidden}.scroll-score-track{display:inline-block;will-change:transform;line-height:0;padding-left:0}.scroll-score-track canvas{display:block;vertical-align:top}.scroll-playbar{position:absolute;top:0;bottom:0;width:22px;z-index:3;border-radius:2px;pointer-events:none;opacity:.7;transition:background .2s ease-in}.scroll-score-status{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:grid;place-items:center;font-size:14px;color:#555;background:#ffffffeb;pointer-events:none}.scroll-score-status.error{color:#b42318;font-weight:600}.staff-progress-track{flex-shrink:0;width:100%;height:6px;border-radius:3px;background:#00000024;overflow:hidden}.staff-progress-fill{width:100%;height:100%;transform-origin:left center;background:var(--kafe-accent);border-radius:3px;will-change:transform}.staff-complete-banner{text-align:center;font-size:14px;padding:6px;color:var(--kafe-correct)}.staff-keyboard-wrap{flex-shrink:0}.staff-keyboard-wrap .piano-wrap,.staff-keyboard-wrap .piano-wrap.piano-wrap--fit{padding:0;overflow:hidden}.staff-keyboard-wrap .piano,.staff-keyboard-wrap .white-key{height:100px}.staff-keyboard-wrap .black-key{height:63px}.player-shell{display:flex;flex-direction:column;gap:18px}.notation-frame{width:100%;height:420px;border:none;border-radius:10px;background:#fff}.groove-session-page{display:flex;flex-direction:column;flex:1;min-height:0;gap:0;overflow:hidden;background:var(--kafe-bg);--groove-panel-edge-inset: 20px;--groove-panel-gap: 10px}.groove-session-page>.page-top-bar{box-sizing:border-box;position:relative;z-index:10}.groove-session-body{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;background:var(--kafe-bg)}.groove-session-body .song-unit-layout{flex:1;min-height:0;align-items:start;gap:var(--groove-panel-gap);padding:var(--groove-panel-edge-inset);box-sizing:border-box;grid-template-columns:minmax(0,1fr) 248px}.groove-session-body .song-unit-layout>*{min-height:0}.groove-session-main-column{display:flex;flex-direction:column;align-items:stretch;min-width:0;gap:0}.groove-session-page .groove-panel-card{background:var(--kafe-bg-card);border:none;border-radius:10px;box-shadow:0 1px 6px #00000024;padding:16px;box-sizing:border-box}.groove-session-page .groove-sidebar-card.groove-panel-card{padding:12px}.groove-session-page .groove-main-panel{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;flex:0 0 auto;align-self:start;width:100%;min-width:0;height:auto;overflow:visible;margin:0}.groove-session-page .song-sidebar{min-height:auto;height:auto;max-height:none;overflow:visible;overscroll-behavior:contain;align-self:start;width:248px;min-width:248px;max-width:248px}.groove-session-page .groove-session-sidebar{align-self:start;width:248px;min-width:248px;max-width:248px;min-height:auto;height:auto;box-sizing:border-box;margin:0;padding:0;overflow:visible}.groove-sidebar-card{border-radius:10px;gap:0;flex:0 0 auto;min-height:0;overflow:visible;overscroll-behavior:contain}.groove-sidebar-card .sidebar-panel-title{text-transform:none;letter-spacing:normal;font-size:17px;font-weight:600;color:var(--kafe-text-dim);margin-bottom:10px}.groove-sidebar-card .sidebar-panel+.unit-sidebar-divider{margin:10px 0}.groove-sidebar-card .unit-sidebar-divider{flex-shrink:0;width:100%}.groove-sidebar-card .mode-picker{gap:4px}.groove-sidebar-card .mode-icon-shell{width:48px;height:48px}.groove-sidebar-card .mode-btn{font-size:10px;padding:2px;gap:4px}.groove-metronome-controls{gap:10px;padding-bottom:4px}.groove-metronome-row{width:100%}.groove-metronome-bpm{min-height:34px;display:flex;align-items:center;justify-content:center}.groove-sidebar-card .metronome-reset-text{border:none;background:transparent;color:var(--kafe-text-dim);font-size:12px;cursor:pointer;padding:0 6px}.groove-sidebar-card .metronome-reset-text:hover:not(:disabled){color:var(--kafe-text)}.groove-sidebar-card .metronome-reset-text:disabled{cursor:default;opacity:.5}.playback-division-picker{position:relative;display:flex;flex-direction:column;align-items:center;width:100%}.division-picker-menu{min-width:220px;margin:0;padding:6px;list-style:none;background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:10px;box-shadow:var(--kafe-shadow)}.division-picker-menu--portal{position:fixed;transform:translate(-50%);z-index:1300;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:color-mix(in srgb,var(--kafe-bg-card) 94%,transparent)}.division-picker-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:none;border-radius:8px;background:transparent;color:var(--kafe-text);font-size:15px;font-weight:500;text-align:left;cursor:pointer}.division-picker-menu-item:hover{background:var(--kafe-panel)}.division-picker-menu-item.selected{font-weight:600}.division-picker-check{width:18px;font-size:16px;color:var(--kafe-blue);flex-shrink:0}.division-picker-check--spacer{visibility:hidden}.division-picker-menu-image{width:32px;height:32px;object-fit:contain;flex-shrink:0}[data-theme=dark] .division-picker-menu-image,[data-theme=dark] .playback-picker-image{filter:brightness(0) invert(1)}.groove-session-page>.groove-keyboard-wrap{flex-shrink:0;box-sizing:border-box;width:calc(100% + env(safe-area-inset-left,0px) + env(safe-area-inset-right,0px));margin-top:0;margin-left:calc(-1*env(safe-area-inset-left,0px));margin-right:calc(-1*env(safe-area-inset-right,0px));margin-bottom:env(safe-area-inset-bottom,0px);padding:0;overflow:visible}.groove-main-toolbar{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:16px;margin-bottom:12px;flex-shrink:0}.groove-main-toolbar .groove-picker-menu{justify-self:start;max-width:100%}.groove-main-toolbar-center{justify-self:center;display:flex;align-items:center;justify-content:center;min-height:45px}.groove-main-toolbar .groove-perf-score{justify-self:end}.groove-reset-bordered-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(128,128,128,.45);border-radius:8px;background:var(--kafe-bg-elevated);color:var(--kafe-text);font-size:15px;font-weight:600;line-height:1.2;padding:6px 16px;cursor:pointer;box-shadow:0 1px 3px #0000001a}.groove-reset-bordered-btn-icon{font-family:Material Symbols Rounded,sans-serif;font-size:18px;line-height:1;text-transform:none;font-variation-settings:"FILL" 0,"wght" 500,"GRAD" 0,"opsz" 24}.groove-reset-bordered-btn:hover{background:var(--kafe-bg-card-hover)}.groove-reset-bordered-btn:active{background:var(--kafe-panel)}.groove-eval-hint{margin:0;font-size:12px;font-weight:300;font-style:italic;line-height:1.25;text-align:center;white-space:nowrap;color:var(--kafe-text-faint)}.groove-best-score-modal{width:fit-content;max-width:min(calc(100vw - 32px),420px);padding:0;overflow:hidden;text-align:center}.groove-best-score-hero{display:flex;flex-direction:column;align-items:stretch;padding:12px 16px 8px;background:var(--kafe-brand-gradient);color:#fff}.groove-best-score-badge{display:inline-flex;align-self:center;align-items:center;gap:5px;margin-bottom:0;padding:4px 12px;border-radius:999px;background:#ffffff2e;font-size:clamp(14px,3.2vw,16px);font-weight:800;letter-spacing:.04em;line-height:1.2;text-transform:uppercase;white-space:nowrap}.groove-best-score-badge-sparkle{font-size:clamp(15px,3.2vw,17px);line-height:1}.groove-best-score-title{margin:0 0 8px;font-family:var(--font-display);font-size:clamp(24px,5vw,32px);font-weight:400;line-height:1.15;text-shadow:0 2px 12px rgba(0,0,0,.18)}.groove-best-score-message{margin:0;font-size:15px;font-weight:500;font-style:italic;line-height:1.45;color:#ffffffeb}.groove-best-score-body{display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 24px 0}.groove-best-score-score{display:flex;flex-direction:column;align-items:center;gap:2px;width:fit-content;padding:12px 28px;border-radius:var(--kafe-radius);background:var(--kafe-brand-gradient-subtle);border:1px solid rgba(175,82,222,.15);box-shadow:inset 0 0 0 1px #ffffff59}.groove-best-score-score-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--kafe-text-dim)}.groove-best-score-score-value{font-size:42px;font-weight:800;line-height:1;letter-spacing:-.03em;background:var(--kafe-brand-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}.groove-best-score-previous{margin:0;font-size:13px;color:var(--kafe-text-faint)}.groove-best-score-footer{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:16px 24px 24px}.groove-best-score-continue{margin:0;width:100%;min-width:unset}.groove-best-score-modal--improved .groove-best-score-hero{padding:12px 16px 6px;background:transparent;color:var(--kafe-text)}.groove-best-score-modal--improved .groove-best-score-badge{background:var(--kafe-brand-gradient-subtle);color:var(--kafe-text);border:1px solid rgba(175,82,222,.15)}.groove-best-score-modal--improved .groove-best-score-title{color:var(--kafe-text);text-shadow:none}.groove-best-score-modal--improved .groove-best-score-message{color:var(--kafe-text-dim)}.groove-best-score-modal--improved .groove-best-score-score{background:var(--kafe-bg-elevated);border:1px solid var(--kafe-border);box-shadow:inset 0 0 0 1px #ffffff59}.groove-best-score-modal--improved .groove-best-score-score-value{background:none;-webkit-background-clip:unset;background-clip:unset;color:var(--kafe-text)}.groove-best-score-divider{width:calc(100% + 32px);height:3px;margin:12px -16px 14px;background:var(--kafe-brand-gradient)}.groove-best-score-suppress{display:flex;align-items:center;justify-content:center;gap:8px;margin:0;font-size:13px;color:var(--kafe-text-dim);cursor:pointer;text-align:left}.groove-best-score-suppress input{margin:0}.groove-suppression-notice{padding:24px;text-align:center}.groove-suppression-copy{margin:0 0 16px;color:var(--kafe-text-dim)}.mac-settings-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:none;border-radius:10px;background:transparent;color:var(--kafe-text-dim);cursor:pointer;flex-shrink:0}.mac-settings-btn:hover{background:var(--kafe-panel-hover);color:var(--kafe-text)}.mac-settings-btn-icon{width:22px;height:22px}.settings-page{max-width:720px;margin:0 auto}.account-page .settings-list{margin-top:8px}.account-page .settings-list-item:last-child{border-bottom:none;padding-bottom:0}.settings-page-body{padding:20px 24px}.settings-page-intro{margin:0 0 16px;color:var(--kafe-text-dim)}.settings-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.settings-list-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--kafe-border)}.settings-list-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.settings-list-title{font-size:15px;font-weight:600}.settings-list-description{font-size:13px;color:var(--kafe-text-dim);line-height:1.4}.settings-action-btn{flex-shrink:0}.settings-toggle{position:relative;display:inline-flex;align-items:center;cursor:pointer;flex-shrink:0}.settings-toggle input{position:absolute;opacity:0;width:0;height:0}.settings-toggle-track{width:44px;height:26px;border-radius:999px;background:var(--kafe-border);transition:background .2s ease}.settings-toggle-track:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--kafe-bg-elevated);box-shadow:0 1px 3px #0003;transition:transform .2s ease}.settings-toggle input:checked+.settings-toggle-track{background:var(--kafe-blue)}.settings-toggle input:checked+.settings-toggle-track:after{transform:translate(18px)}.settings-list-item--choice{align-items:flex-start}.settings-segmented{display:inline-flex;flex-shrink:0;border:1px solid var(--kafe-border);border-radius:8px;overflow:hidden;background:var(--kafe-bg)}.settings-segmented-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;margin:0;padding:7px 14px;font:inherit;font-size:13px;font-weight:600;color:var(--kafe-text-dim);background:transparent;cursor:pointer;line-height:1.2}.settings-segmented-btn+.settings-segmented-btn{border-left:1px solid var(--kafe-border)}.settings-segmented-btn.is-selected{color:var(--kafe-text);background:var(--kafe-bg-elevated)}.settings-segmented-btn:focus-visible{outline:2px solid var(--kafe-blue);outline-offset:-2px;z-index:1}.groove-picker-menu{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:fit-content;max-width:100%}.groove-picker-label{font-size:13px;font-style:italic;color:var(--kafe-text-faint);padding-left:5px;white-space:nowrap}.groove-picker-select-wrap{position:relative;display:inline-flex;align-items:center;width:fit-content;max-width:100%;min-height:40px}.groove-picker-value{display:inline-flex;align-items:center;gap:6px;width:auto;max-width:100%;box-sizing:border-box;font-size:24px;font-weight:600;font-stretch:condensed;line-height:1.15;padding:8px 32px 8px 12px;border-radius:10px;background:var(--kafe-bg-elevated);color:var(--kafe-text);box-shadow:0 1px 3px #0000002e;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.groove-picker-value-text{overflow:hidden;text-overflow:ellipsis}.groove-picker-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;font-size:14px;font-weight:400}.groove-picker-select option{font-size:14px;font-weight:400}.groove-picker-menu--compact .groove-picker-select-wrap{max-width:100%}.groove-sidebar-stats{margin-top:12px}.groove-sidebar-stats-block{min-height:100px;box-sizing:border-box}.groove-sidebar-groove-title{margin:0 0 10px;font-size:20px;font-weight:500;line-height:1.2;text-align:center;color:var(--kafe-text)}.groove-sidebar-stats-panel{min-height:72px;box-sizing:border-box}.groove-sidebar-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:center;min-height:72px}.groove-sidebar-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;min-width:0}.groove-sidebar-stat-label{font-size:12px;line-height:1.2;color:var(--kafe-text-faint)}.groove-sidebar-stat-value{font-size:22px;font-weight:400;font-stretch:condensed;line-height:1}.playback-tempo-picker{position:relative;display:flex;flex-direction:column;align-items:center;width:100%}.playback-tempo-value{font-size:30px;font-weight:600;font-stretch:condensed;font-variant-numeric:tabular-nums;line-height:1;width:56px;min-width:56px;text-align:center;flex-shrink:0;color:var(--kafe-text)}.tempo-picker-menu{display:inline-flex;align-items:stretch;justify-content:center;width:fit-content;height:164px;margin:0;padding:8px;background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:10px;box-shadow:var(--kafe-shadow);box-sizing:border-box}.tempo-picker-menu--portal{position:fixed;transform:translateY(-50%);z-index:1300;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:color-mix(in srgb,var(--kafe-bg-card) 94%,transparent)}.tempo-picker-slider-wrap{display:flex;align-items:stretch;justify-content:center;width:32px;height:100%;min-height:0}.metronome-slider--vertical{width:32px;height:100%;min-height:148px;margin:0;padding:0;accent-color:var(--kafe-accent);cursor:pointer;-webkit-appearance:slider-vertical;-moz-appearance:auto;appearance:auto;writing-mode:vertical-lr;direction:rtl}.groove-sidebar-eval{display:flex;align-items:center;gap:12px;margin-top:4px;padding-top:4px}.mode-picker--locked{opacity:.55;pointer-events:none}.groove-main-panel .groove-hub{flex:0 0 auto;min-height:0;overflow:visible;background:transparent;box-shadow:none;border-radius:0;padding:0}.groove-stats-dl{margin:0;font-size:14px}.groove-stats-row{display:flex;justify-content:space-between;gap:12px;padding:3px 0}.groove-stats-row dt{font-weight:600;margin:0}.groove-stats-row dd{margin:0;font-weight:700;text-align:right}.groove-perf-score{display:flex;flex-direction:column;align-items:flex-start;gap:1px}.groove-perf-score-label{font-size:12px;color:var(--kafe-text-faint)}.groove-perf-score-value{font-size:32px;font-weight:500;font-stretch:condensed;line-height:1;min-width:72px;padding:4px 8px;border:1px solid rgba(128,128,128,.5);border-radius:3px;background:var(--kafe-bg-elevated);color:var(--kafe-text);box-shadow:inset 0 1px 3px #80808059}.groove-reset-btn{display:inline-flex;align-items:center;gap:4px;border:none;background:transparent;color:var(--kafe-blue, #007aff);font-size:15px;font-weight:600;cursor:pointer;padding:6px 0}.groove-reset-btn-icon{font-size:18px;font-variation-settings:"FILL" 0,"wght" 500,"GRAD" 0,"opsz" 20}.mode-btn--live{color:var(--kafe-text)}.groove-hub{background:#fff;border-radius:10px;box-shadow:0 2px 14px #00000024;padding:14px 16px 18px;color:#1c1c1e;overflow-x:auto}.groove-hub-status{display:grid;place-items:center;min-height:200px;padding:32px 16px;text-align:center}.groove-hub-loading{gap:16px;justify-items:center}.groove-countoff{position:relative;display:flex;align-items:center;margin-bottom:10px;min-height:24px;font-size:15px}.groove-countoff-left{display:flex;align-items:center;gap:10px;flex-shrink:0}.groove-countoff-label{color:#8e8e93;font-weight:300;white-space:nowrap}.groove-countoff-beat{color:#8e8e93;font-weight:300;flex-shrink:0}.groove-countoff-beat.active{color:#1c1c1e;font-weight:700}.groove-countoff-hint{position:absolute;left:50%;transform:translate(-50%);text-align:center;pointer-events:none}.groove-grid{min-width:min-content;border:1px solid #d1d1d6;border-radius:0;box-shadow:0 1px 4px #0000001a}.groove-grid-row{display:flex;min-width:min-content}.groove-grid-label{width:100px;min-width:100px;flex-shrink:0;border-right:1px solid #8e8e93;border-bottom:1px solid #8e8e93;box-sizing:border-box}.groove-header-label{display:flex;align-items:center;justify-content:flex-end;padding:0 6px;background:#48484a;color:#fff;font-size:13px;font-weight:700}.groove-measures-row,.groove-beats-row{height:25px}.groove-grid-cells{display:flex;flex:1;min-width:calc(var(--groove-steps, 32) * 14px)}.groove-span-block{display:flex;align-items:center;border-right:1px solid #8e8e93;border-bottom:1px solid #8e8e93;background:#636366;color:#fff;font-weight:700;font-size:13px;padding-left:4px;min-width:0;position:relative}.groove-measure-block{background:#636366}.groove-beat-block{background:#48484a;align-items:flex-end;padding-bottom:2px}.groove-beat-num{padding-left:2px}.groove-beat-spacer{flex:1 1 0}.groove-sub-tick{flex:0 0 auto;align-self:flex-end;width:1px;height:5px;background:#fff;margin-bottom:1px}.groove-sub-tick.mid{width:2px;height:10px}.groove-score-hint{margin:4px 0 16px;text-align:center;font-size:14px;color:var(--kafe-text-dim)}.groove-grid-tracks{position:relative}.groove-track-row{height:45px}.groove-track-label{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2px;padding:2px 4px 2px 2px;background:#48484a;color:#fff;border:none;text-align:right;font-family:inherit}.groove-track-label-controls{display:flex;flex-direction:column;gap:1px;flex-shrink:0}.groove-lane-btn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:16px;padding:0;border:none;border-radius:3px;background:transparent;color:#fffc;cursor:pointer}.groove-lane-btn:hover{background:#ffffff1f}.groove-lane-btn.mute.on{color:#ff9f0a}.groove-lane-btn.solo.on{color:#ffd60a}.groove-track-name-btn{flex:1;min-width:0;display:flex;align-items:center;justify-content:flex-end;padding:0;border:none;background:transparent;color:inherit;cursor:pointer;font-family:inherit;text-align:right}.groove-track-name-btn:disabled{cursor:default;opacity:.7}.groove-track-name-btn:hover:not(:disabled){opacity:.92}.groove-track-row.lane-muted .groove-track-cells,.groove-track-row.lane-muted .groove-track-name{opacity:.38}.groove-track-label:hover{background:#545456}.groove-track-name{font-size:14px;font-weight:700;line-height:1.1}.groove-track-cells{display:grid;grid-template-columns:repeat(var(--groove-steps, 32),minmax(14px,1fr));flex:1;min-width:calc(var(--groove-steps, 32) * 14px)}.groove-cell{height:45px;margin:0;padding:0;border:none;border-right:1px solid rgba(142,142,147,.65);border-bottom:1px solid rgba(142,142,147,.65);border-radius:0;background:#545456}.groove-cell.on{cursor:pointer}.groove-cell.beat-start{border-left:1px solid rgba(255,255,255,.35)}.groove-cell.measure-start{border-left:2px solid rgba(255,255,255,.55)}.groove-cell.on.highlighted{box-shadow:inset 0 0 0 1px #ffffff59}.groove-cell.eval-correct{background:var(--kafe-correct)!important;opacity:1}.groove-cell.eval-incorrect{background:var(--kafe-incorrect)!important;opacity:1}.groove-cell.eval-missed{background:#1c1c1e!important;opacity:1}.groove-cell.eval-clickable{cursor:pointer}.groove-feedback-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:grid;place-items:center;z-index:100;padding:16px}.groove-feedback-popup{position:relative;background:#fff;color:#111;border-radius:10px;padding:20px 24px;width:min(360px,100%);box-shadow:0 12px 40px #00000059}.groove-feedback-close{position:absolute;top:8px;right:10px;border:none;background:none;font-size:22px;line-height:1;cursor:pointer;color:#666}.groove-feedback-position{font-size:22px;font-weight:700;margin:0 0 16px}.groove-feedback-meter{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;margin-bottom:10px}.groove-feedback-meter-label{font-size:12px;color:#666}.groove-feedback-track{position:relative;height:40px;border:1px solid #111;display:grid;grid-template-columns:1fr 2px 1fr;overflow:hidden}.groove-feedback-zone{height:100%}.groove-feedback-zone-early{background:linear-gradient(90deg,#f66366 40%,#00fa92 60%)}.groove-feedback-zone-late{background:linear-gradient(90deg,#00fa92 40%,#f66366 60%)}.groove-feedback-center{background:#00000073}.groove-feedback-marker{position:absolute;top:2px;bottom:2px;width:3px;background:#ffd60a;transform:translate(-50%);pointer-events:none}.groove-feedback-accuracy{text-align:center;font-style:italic;margin:0}.groove-feedback-tolerance{text-align:center;font-size:12px;margin:6px 0 0}.groove-playhead{position:absolute;top:0;bottom:0;width:2px;background:#fff;pointer-events:none;z-index:2;transform:translate(-1px)}.groove-keyboard-wrap{width:100%;overflow:hidden;padding:16px 0 8px;margin-top:16px}.groove-keyboard{--gk-white-h: 210px;--gk-black-h: 112px;position:relative;width:100%;max-width:100%;margin:0 auto;-webkit-user-select:none;user-select:none;touch-action:none}.groove-keyboard-whites{display:flex;width:100%;height:var(--gk-white-h)}.groove-white-key{flex:1 1 0;min-width:0;height:var(--gk-white-h)}.groove-keyboard-blacks{position:absolute;top:0;left:0;right:0;height:var(--gk-black-h);pointer-events:none}.groove-black-key{position:absolute;top:0;height:100%;z-index:2;pointer-events:auto}.groove-white-key>.groove-key-face{top:50%}.groove-key-face{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:100%;padding:0 4px 8px;pointer-events:none}.groove-key-icon{width:40px;height:40px;flex-shrink:0;object-fit:contain;margin-bottom:6px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}.groove-key-name{font-size:13px;font-weight:600;text-align:center;line-height:1.15;padding:0 4px;max-width:100%}.groove-white-key .groove-key-name{min-height:32px;color:#000}.groove-black-key .groove-key-icon{width:34px;height:34px}.groove-black-key .groove-key-name{font-size:11px;line-height:1.1;color:#fff}.groove-white-key.playback,.groove-black-key.playback{box-shadow:inset 0 0 0 2px #ffffff73}.groove-key-brand{justify-content:flex-end;padding-bottom:8px}.groove-key-brand-letter{font-size:54px;font-weight:900;line-height:1;text-shadow:0 1px 1px rgba(0,0,0,.15)}.groove-key-marker{display:block;width:40px;height:40px;border-radius:50%;background:#2f7bff;margin-bottom:10px;opacity:.9}.groove-session-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.groove-refresh-btn{border:1px solid var(--kafe-border);background:var(--kafe-panel);color:var(--kafe-text);border-radius:8px;padding:6px 14px;font-size:14px;font-weight:600;cursor:pointer}.groove-refresh-btn:hover{background:var(--kafe-panel-hover, rgba(255, 255, 255, .06))}.back-link{display:inline-flex;align-items:center;gap:6px;color:var(--kafe-text-dim);text-decoration:none;font-size:14px;margin-bottom:14px}.back-link:hover{color:var(--kafe-text)}.kv{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--kafe-border);font-size:14px}.kv .muted{color:var(--kafe-text-dim)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:grid;place-items:center;z-index:50;padding:20px}.modal{width:100%;max-width:460px}.paywall-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 20%,rgba(175,82,222,.28),transparent 42%),radial-gradient(circle at 80% 80%,rgba(255,149,0,.24),transparent 40%),#0000009e;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.paywall-modal{position:relative;width:100%;max-width:480px;overflow:hidden;border-radius:20px;border:1px solid rgba(255,255,255,.22);background:var(--kafe-bg-elevated);box-shadow:0 24px 60px #00000059,0 0 0 1px #ffffff0f inset;animation:paywall-in .28s cubic-bezier(.22,1,.36,1)}@keyframes paywall-in{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.paywall-hero{position:relative;padding:28px 24px 22px;background:var(--kafe-brand-gradient);color:#fff}.paywall-close{position:absolute;top:12px;right:12px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:#0000002e;color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:background .15s ease}.paywall-close:hover:not(:disabled){background:#00000052}.paywall-kicker{display:inline-block;margin-bottom:8px;padding:4px 10px;border-radius:999px;background:#ffffff2e;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.paywall-title{margin:0 0 10px;font-family:var(--font-display);font-size:clamp(28px,5vw,36px);font-weight:400;line-height:1.1;text-shadow:0 2px 12px rgba(0,0,0,.18)}.paywall-lead{margin:0;max-width:38ch;font-size:15px;line-height:1.55;color:#ffffffeb}.paywall-features{margin:0;padding:20px 24px 8px;list-style:none;display:flex;flex-direction:column;gap:12px}.paywall-features li{display:flex;align-items:flex-start;gap:10px;font-size:15px;line-height:1.45;color:var(--kafe-text)}.paywall-feature-check{flex-shrink:0;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,var(--kafe-correct),var(--kafe-accent));color:#fff;font-size:12px;font-weight:800;box-shadow:0 2px 8px #00fac559}.paywall-message{margin:0 24px;padding:10px 12px;border-radius:10px;background:var(--kafe-announce-banner-bg);border:1px solid rgba(0,122,255,.22);color:var(--kafe-text);font-size:14px}.paywall-actions{padding:16px 24px 24px;display:flex;flex-direction:column;gap:12px}.paywall-subscribe-btn{width:100%;padding:14px 18px;border:none;border-radius:14px;background:var(--kafe-brand-gradient);color:#fff;font-size:17px;font-weight:800;cursor:pointer;box-shadow:0 8px 24px #af52de61,0 4px 12px #ff950047;transition:transform .15s ease,filter .15s ease,box-shadow .15s ease}.paywall-subscribe-btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 12px 28px #af52de73,0 6px 16px #ff950057}.paywall-subscribe-btn:disabled{opacity:.7;cursor:wait}.paywall-secondary-actions{display:flex;justify-content:center;gap:18px;flex-wrap:wrap}.paywall-link-btn{padding:0;border:none;background:none;color:var(--kafe-text-dim);font-size:14px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px}.paywall-link-btn:hover:not(:disabled){color:var(--kafe-accent)}.paywall-link-btn:disabled{opacity:.6;cursor:wait}.mac-back-btn{width:44px;height:44px;border:none;border-radius:10px;background:var(--kafe-blue);color:#fff;font-size:28px;line-height:1;cursor:pointer;flex-shrink:0}.mac-back-btn:disabled{cursor:default;opacity:.45}.mac-home-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 16px;border:none;border-radius:10px;background:var(--kafe-blue);color:#fff;font-size:15px;font-weight:700;line-height:1;cursor:pointer;flex-shrink:0}.mac-home-btn-icon{width:20px;height:20px}.mac-home-btn-label{white-space:nowrap}.page-top-bar{padding-bottom:18px;margin-bottom:24px;border-bottom:1px solid var(--kafe-border)}.app-chrome-bar,.flash-session-toolbar{display:flex;align-items:center;flex-shrink:0;height:var(--kafe-chrome-bar-height);min-height:var(--kafe-chrome-bar-height);padding:0 10px;box-sizing:border-box;background:var(--kafe-bg);border-bottom:1px solid var(--kafe-border);box-shadow:0 5px 10px #0003;position:relative;z-index:2;margin-bottom:0}.page-top-bar.app-chrome-bar{padding-bottom:0}.app-chrome-bar .mac-toolbar,.page-top-bar.app-chrome-bar .mac-toolbar,.flash-session-toolbar .mac-toolbar{width:100%;min-height:100%;height:100%;margin-bottom:0}.page-top-bar .mac-toolbar,.page-top-bar.page-top-bar-centered{min-height:var(--page-top-bar-inner-min-height)}.page-top-bar .mac-toolbar{margin-bottom:0}.page-top-bar-centered{display:flex;justify-content:center;align-items:center}.mac-toolbar{display:flex;align-items:center;gap:16px;margin-bottom:22px}.mac-toolbar-spread{justify-content:space-between;flex-wrap:wrap}.mac-toolbar-balanced{display:grid;grid-template-columns:minmax(88px,1fr) auto minmax(88px,1fr);align-items:center;gap:12px}.mac-toolbar-leading{display:flex;justify-content:flex-start;align-items:center;gap:8px;position:relative;z-index:1}.mac-toolbar-trailing{display:flex;justify-content:flex-end;align-items:center;gap:8px;position:relative;z-index:1}.mac-toolbar-balanced--nav-cluster{grid-template-columns:max-content minmax(0,1fr) max-content}.mac-toolbar-balanced--nav-cluster .mac-toolbar-leading,.mac-toolbar-balanced--nav-cluster .mac-toolbar-trailing{z-index:2}.mac-toolbar-balanced>.mac-session-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mac-toolbar-balanced>.mac-display-title{min-width:min-content;overflow:visible;white-space:nowrap;padding:0 .25em .1em}.mac-toolbar-balanced>.mac-unit-title-slot{min-width:0;width:100%;display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;z-index:0;pointer-events:none}.mac-unit-title-slot>.mac-unit-title{white-space:nowrap;max-width:100%;overflow:hidden}.mac-unit-title-measure{position:absolute;left:-9999px;top:0;visibility:hidden;pointer-events:none;white-space:nowrap;height:0;overflow:hidden;width:max-content;max-width:none}.mac-display-title{margin:0;font-family:var(--font-display);font-size:clamp(32px,5vw,52px);font-weight:400;line-height:1.25;text-align:center;color:var(--kafe-text)}.mac-display-title-edu-suffix{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700;font-stretch:expanded;letter-spacing:.04em;opacity:.8}.course-switcher-wrap{position:relative;display:inline-flex;justify-content:center}.course-switcher-toolbar{flex-direction:column;align-items:flex-start;gap:0}.course-switcher-toolbar-label{font-size:14px;font-style:italic;color:var(--kafe-text-muted, #888);padding-left:5px;line-height:1.2}.course-switcher-trigger{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:var(--kafe-bg-elevated);cursor:pointer;padding:2px 10px;margin:0;color:var(--kafe-text);text-align:center;border-radius:10px;box-shadow:0 1px 2px #0000001f;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:clamp(24px,3vw,36px);font-weight:600;font-stretch:condensed;letter-spacing:-.02em;line-height:1.15;min-width:56px}.course-switcher-trigger:hover{box-shadow:0 2px 4px #00000029}.course-switcher-chevron{font-family:system-ui,sans-serif;font-size:.45em;margin-left:.15em;opacity:.65;vertical-align:middle}.course-switcher-toolbar .course-switcher-menu{left:auto;right:0;transform:none}.course-switcher-check{font-weight:700}.course-switcher-menu{position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%);min-width:240px;background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:var(--kafe-radius);box-shadow:0 12px 32px #0000002e;z-index:40;padding:6px;display:flex;flex-direction:column;gap:2px}.course-switcher-menu button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;text-align:left;padding:10px 12px;border-radius:8px;cursor:pointer;font-size:15px;color:var(--kafe-text)}.course-switcher-menu button:hover{background:var(--kafe-bg-hover, rgba(0, 0, 0, .06))}.course-switcher-menu button.active{font-weight:600}.course-switcher-menu button.locked{opacity:.72}.course-switcher-divider{height:1px;margin:6px 10px 4px;border:none;background:linear-gradient(90deg,transparent,var(--kafe-border) 15%,var(--kafe-accent) 45%,var(--kafe-purple) 75%,transparent);pointer-events:none;flex-shrink:0}.course-switcher-menu button.course-switcher-kafe{font-family:var(--font-display);font-size:20px;letter-spacing:.02em;color:var(--kafe-text)}.course-password-modal{width:min(420px,calc(100vw - 32px));padding:22px}.mac-unit-title{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:clamp(25px,4vw,42px);font-weight:400;font-stretch:condensed;line-height:1.15;text-align:center;color:var(--kafe-text);letter-spacing:-.02em}.mac-unit-title-prefix{font-weight:700}.mac-session-title-prefix{font-weight:400}.mac-session-title-name{font-weight:700}.mac-session-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.mac-session-title-context{font-weight:400;color:var(--kafe-text-dim)}.mac-page-title{margin:0;font-family:var(--font-display);font-size:clamp(32px,5vw,52px);font-weight:400;line-height:1.15;text-align:center;color:var(--kafe-text)}.mac-favs-toggle{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;color:var(--kafe-text-dim);cursor:pointer;font-size:12px}.mac-favs-toggle.active,.mac-favs-toggle:hover{color:var(--kafe-incorrect)}.mac-favs-icon{font-size:22px}.mac-week-filter-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 16px;border:1px solid var(--kafe-border);border-radius:10px;background:var(--kafe-bg-elevated);color:var(--kafe-text-dim);font-size:15px;font-weight:700;line-height:1;cursor:pointer;flex-shrink:0}.mac-week-filter-toggle:hover:not(.active){background:var(--kafe-bg-card-hover)}.mac-week-filter-toggle.active{background:var(--kafe-blue);border-color:var(--kafe-blue);color:#fff}.mac-week-filter-wrap--before-switcher{margin-right:10px}.mac-week-filter-icon{width:20px;height:20px;display:block;flex-shrink:0}.unit-selection-page{display:flex;flex-direction:column;flex:1;min-height:0;max-height:calc(100dvh - 92px)}.song-unit-page{display:flex;flex-direction:column;gap:24px;flex:1;min-height:0;max-height:calc(100dvh - 92px)}.song-unit-page:not(.groove-session-page)>.song-unit-layout{padding-left:15px;padding-right:15px}.groove-session-page.song-unit-page{gap:0;max-height:100%}.song-unit-page .page-top-bar,.unit-selection-page .page-top-bar,.pom-library-page .page-top-bar,.pom-activity-page .page-top-bar{flex-shrink:0}.pom-library-page{display:flex;flex-direction:column;flex:1;min-height:0;max-height:calc(100dvh - 92px)}.unit-selection-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.unit-grid-shell{display:flex;justify-content:center;width:100%}.unit-grid{display:inline-grid;grid-template-columns:repeat(auto-fill,280px);gap:55px;padding:22px 16px 50px;max-width:100%;vertical-align:top}.unit-card{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:5px;padding:18px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--kafe-shadow);width:280px;max-width:100%;box-sizing:border-box}.unit-card--highlighted{border-color:var(--kafe-unit-card-highlight);box-shadow:0 0 0 2px var(--kafe-unit-card-highlight-glow),var(--kafe-shadow);animation:unit-highlight-pulse 1.2s ease-in-out 2}@keyframes unit-highlight-pulse{0%,to{background:var(--kafe-bg-card)}50%{background:var(--kafe-unit-card-pulse-mid)}}.unit-card-head{display:flex;justify-content:space-between;align-items:flex-start}.unit-card-title{margin:0;font-size:18px;line-height:1.2;min-height:calc(18px * 1.2)}.unit-card-sub{margin:4px 0 0;color:var(--kafe-text-dim);font-size:14px;line-height:1.25;min-height:17.5px}.unit-card-about{margin:0;font-size:13px;color:var(--kafe-text-dim);line-height:1.45;min-height:56.55px;max-height:56.55px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.unit-fav-btn{background:none;border:none;font-size:20px;cursor:pointer;color:var(--kafe-text-faint)}.unit-fav-btn.active{color:var(--kafe-incorrect)}.unit-card-tags-label{font-size:12px;font-weight:700;color:var(--kafe-text-dim)}.unit-card-tag-row{--unit-tag-row-height: 24px;display:flex;flex-wrap:wrap;align-content:flex-start;gap:6px;margin-top:6px;min-height:calc(var(--unit-tag-row-height) * 2 + 6px);max-height:calc(var(--unit-tag-row-height) * 2 + 6px);overflow:hidden}.tag-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.content-tag{background:var(--kafe-blue);color:#fff;font-size:11px;font-weight:600;padding:4px 10px;border-radius:999px}.content-tag.muted{background:var(--kafe-border);color:var(--kafe-text-dim)}.rhythm-unit-info{display:flex;flex-direction:column;gap:6px}.rhythm-unit-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;min-height:calc(var(--unit-tag-row-height) * 2 + 6px)}.rhythm-unit-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:6px 8px;border-radius:8px;background:color-mix(in srgb,var(--kafe-pink, #ec4899) 7%,transparent);border:1px solid color-mix(in srgb,var(--kafe-pink, #ec4899) 22%,transparent);text-align:center}.rhythm-unit-stat-value{font-size:20px;font-weight:700;color:var(--kafe-pink, #ec4899);line-height:1.1}.rhythm-unit-stat-symbols{font-size:18px;line-height:1.2;letter-spacing:.08em}.rhythm-unit-stat-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--kafe-text-dim)}.unit-mastery-label{display:flex;justify-content:space-between;font-size:13px;font-weight:600}.unit-mastery-bar{height:10px;background:var(--kafe-border);border-radius:999px;overflow:hidden;margin:6px 0 4px}.unit-mastery-fill{height:100%;border-radius:999px;transition:width .3s ease}.unit-mastery-hint{font-size:11px;color:var(--kafe-text-faint);font-style:italic}.unit-open-btn{width:100%;background:var(--kafe-orange);color:var(--kafe-open-btn-text);font-weight:700;border:none;margin-top:auto}.unit-open-btn:hover{background:var(--kafe-orange);filter:brightness(1.05)}.pom-activity-page{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;max-height:calc(100dvh - 92px)}.pom-activity-heading,.pom-activity-prompt,.pom-activity-grid{flex-shrink:0}.pom-activity-heading{text-align:center;padding:0 16px}.pom-activity-lesson-name{margin:0 0 8px;font-family:var(--font-course-name);font-size:clamp(40px,7vw,64px);font-weight:400;line-height:1.15}.pom-activity-course-name{margin:0 0 12px;font-size:18px;color:var(--kafe-text-dim)}.pom-activity-director{margin:0;font-size:15px;line-height:1.25;color:var(--kafe-text-dim)}.pom-activity-prompt{margin:0 0 24px;padding:0 16px;text-align:center;font-size:16px;color:var(--kafe-text-dim)}.pom-activity-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:32px 40px;padding:0 16px}.pom-activity-tile{background:none;border:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;color:inherit;transition:transform .1s ease}.pom-activity-tile:disabled{cursor:not-allowed;opacity:.45}.pom-activity-tile:not(:disabled):hover{transform:translateY(-3px)}.pom-activity-tile:not(:disabled):hover .pom-activity-circle{border-color:var(--kafe-accent-strong);box-shadow:var(--kafe-hub-button-hover-shadow)}.pom-activity-tile:not(:disabled):active .pom-activity-circle{transform:scale(.97);filter:brightness(.92)}.pom-activity-circle{width:175px;height:175px;border-radius:50%;background:var(--kafe-hub-button-bg-gradient);border:1px solid var(--kafe-hub-button-border);box-shadow:var(--kafe-hub-button-shadow);display:grid;place-items:center;transition:border-color .15s ease,box-shadow .15s ease,transform .1s ease,filter .1s ease}.pom-activity-icon{width:58%;height:58%;object-fit:contain;pointer-events:none}.pom-activity-label{font-size:22px;font-weight:600}.unit-header-title{display:flex;align-items:center;gap:10px}.unit-header-title h1{margin:0;font-family:var(--font-display);font-size:clamp(28px,4vw,44px);font-weight:400;line-height:1.15}.unit-header-icon{font-size:28px}.song-unit-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,320px);gap:18px;align-items:stretch;flex:1;min-height:0}.song-table-panel{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0;overflow-x:auto;overflow-y:auto;box-shadow:var(--kafe-shadow)}.song-table-panel .song-table{flex:1}.mac-panel{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:14px;padding:16px}.mac-panel-label{margin:0 0 12px;font-size:13px;color:var(--kafe-text-faint);font-weight:600}.song-table{width:100%;border-collapse:separate;border-spacing:0 var(--song-table-row-gap, 4px);font-size:14px;--song-table-row-height: 40px;--song-table-row-gap: 4px}.song-table thead tr{background:transparent}.song-table th{text-align:left;padding:8px 12px 10px;color:var(--kafe-text-dim);font-weight:600;font-size:13px;border:none;border-bottom:1px solid var(--kafe-border);border-right:1px solid var(--kafe-border)}.song-table th:last-child{border-right:none}.song-table tbody tr{cursor:pointer;height:var(--song-table-row-height)}.song-table td{height:var(--song-table-row-height);padding:0 12px;vertical-align:middle;box-sizing:border-box;border:none;background:transparent;transition:background .12s ease,color .12s ease;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.song-table tbody tr.song-table-row--filler{cursor:default;pointer-events:none}.song-table tbody tr:nth-child(odd) td{background:var(--kafe-bg-card)}.song-table tbody tr:nth-child(2n) td{background:var(--kafe-panel)}.song-table tbody tr td:first-child{border-radius:8px 0 0 8px}.song-table tbody tr td:last-child{border-radius:0 8px 8px 0}.song-table tbody tr:not(.selected):not(.song-table-row--filler):hover td{filter:brightness(.97)}.song-table-panel:focus{outline:none}.song-table tbody tr.selected td{background:var(--kafe-blue);color:#fff}.song-table tbody tr.locked td{color:var(--kafe-text-faint);font-style:italic}.song-table tbody tr.selected.locked td{color:#fff;font-style:italic}.lock-mark{display:inline-flex;align-items:center;margin-right:6px;color:inherit;vertical-align:middle;line-height:0}.lock-mark svg{display:block;width:.85em;height:.85em}.song-sidebar{display:flex;flex-direction:column;gap:12px;min-height:100%;width:100%;min-width:320px}.unit-sidebar-card{display:flex;flex-direction:column;background:var(--kafe-bg-card);border-radius:12px;box-shadow:var(--kafe-shadow);padding:16px}.unit-sidebar-card .sidebar-panel{background:transparent;border:none;padding:0;border-radius:0}.unit-sidebar-divider{border:none;border-top:1px solid var(--kafe-border);margin:10px 0}.unit-sidebar-card .sidebar-action-btn{margin-top:4px}.session-detail-list{display:flex;flex-direction:column;gap:8px;margin:0}.session-detail-row{display:flex;align-items:flex-start;gap:12px;font-size:14px}.session-detail-row dt{flex:0 0 90px;margin:0;color:var(--kafe-text-muted)}.session-detail-row dd{margin:0;font-weight:700}.dictation-sidebar-detail-list{display:grid;grid-template-columns:1fr 1fr;column-gap:10px;row-gap:6px;width:100%;margin:0;font-size:14px}.dictation-sidebar-detail-list dt{margin:0;text-align:right;white-space:nowrap;color:var(--kafe-text-muted)}.dictation-sidebar-detail-list dd{margin:0;text-align:left;font-weight:400}.dictation-selection-stats dd{font-weight:400}.dictation-activity-info .sidebar-panel-title{margin-bottom:6px}.dictation-selection-stats{margin-bottom:2px}.dictation-selection-reset{display:block;width:100%;margin-top:6px}.sidebar-action-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:225px;max-width:100%;height:43px;align-self:center;margin:0;padding:0 12px;border:none;border-radius:10px;background:var(--sidebar-action-color, var(--kafe-blue));box-shadow:0 1px 2px #0000002e;color:#fff;font-size:24px;font-weight:700;line-height:1;cursor:pointer}.sidebar-action-btn:disabled{cursor:default;opacity:.45}.sidebar-action-btn__label{white-space:nowrap}.sidebar-action-btn__icon{display:inline-flex;align-items:center;color:inherit;flex-shrink:0}.sidebar-panel{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:12px;padding:14px}.sidebar-panel-title{margin:0 0 10px;font-size:12px;color:var(--kafe-text-faint);font-weight:700;text-transform:uppercase;letter-spacing:.04em}.sidebar-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.sidebar-panel-heading .sidebar-panel-title{margin:0}.song-sidebar-name{margin:0;font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-cache-refresh-btn{display:flex;align-items:center;justify-content:center;gap:6px;width:fit-content;margin:10px auto 0;padding:6px 12px;border:1px solid var(--kafe-border);border-radius:8px;background:var(--kafe-panel, transparent);color:var(--kafe-text-dim);font-size:13px;font-weight:600;cursor:pointer}.song-cache-refresh-btn:hover:not(:disabled){color:var(--kafe-text);background:var(--kafe-panel-hover, rgba(255, 255, 255, .06))}.song-cache-refresh-btn:disabled{opacity:.6;cursor:default}.song-cache-refresh-btn .material-symbols-rounded{font-size:18px}.sidebar-name-measure{position:absolute;visibility:hidden;white-space:nowrap;pointer-events:none;height:0;overflow:hidden}.song-sidebar-artist{margin:6px 0 0;color:var(--kafe-text-dim);font-style:italic;font-size:14px}.lesson-sidebar-about{margin:8px 0 0;font-size:14px;line-height:1.4;min-height:calc(14px * 1.4 * 3);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}.lesson-info-report{display:flex;justify-content:center;margin-top:10px}.mac-field-label{margin:0 0 8px;font-size:12px;color:var(--kafe-text-dim);font-weight:600}.mode-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.mode-picker-3{grid-template-columns:repeat(3,minmax(0,1fr))}.mode-picker-2{grid-template-columns:repeat(2,minmax(0,1fr))}.mode-btn{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:none;color:var(--kafe-text-dim);cursor:pointer;font-size:11px;padding:4px;min-width:0}.mode-btn>span:last-child{white-space:nowrap;font-stretch:condensed;letter-spacing:-.02em;max-width:100%;overflow:hidden}.mode-btn:focus,.mode-btn:focus-visible{outline:none}.mode-btn.active{color:var(--kafe-text)}.mode-icon-shell{position:relative;width:56px;height:56px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;border:3px solid transparent;border-radius:50%;--mode-color: currentColor}.mode-icon-shell.mode-icon-active{border-color:var(--mode-color)}.mode-icon-shell--locked .mode-toolbar-glyph-badge,.mode-icon-shell--locked .mode-toolbar-glyph--bare{filter:grayscale(.5)}.mode-icon-lock-overlay{position:absolute;right:0;bottom:0;color:var(--mode-color);line-height:0;pointer-events:none;opacity:1}.mode-icon-lock-overlay svg{display:block}.mode-toolbar-glyph{display:block;flex-shrink:0;color:#fff}.mode-toolbar-glyph--dimmed{opacity:.72;filter:grayscale(.25)}.mode-toolbar-glyph--bare{color:#fff}.material-symbols-rounded{font-family:Material Symbols Rounded,sans-serif;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}.mode-toolbar-glyph-badge{position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0}.mode-toolbar-glyph-circle{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:var(--mode-color)}.mode-toolbar-material-icon{position:relative;z-index:1;color:#fff;line-height:1;-webkit-user-select:none;user-select:none}.mac-field-value{font-size:15px;font-weight:600;padding:8px 0 2px}.mode-about{margin:10px 0 0;font-size:12px;color:var(--kafe-text-dim);line-height:1.4;min-height:calc(12px * 1.4 * 2)}.playback-modes{margin-top:14px;padding-top:14px;border-top:1px solid var(--kafe-border)}.playback-modes--study{margin-top:0;padding-top:0;border-top:none}.playback-setup{display:flex;flex-direction:column;gap:16px;padding-bottom:8px}.playback-setup-row{display:flex;align-items:flex-start;gap:16px}.playback-setup-divider{flex-shrink:0;width:1px;height:64px;margin:0;border:none;background:var(--kafe-border)}.playback-setup-section-divider{width:100%;margin:0;border:none;border-top:1px solid var(--kafe-border)}.playback-option-col{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px}.playback-option-col--locked{opacity:.45}.playback-option-label{margin:0;font-size:14px;font-weight:500;color:var(--kafe-text)}.playback-option-label--center{text-align:center;width:100%}.playback-section-picker{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:34px}.playback-section-value{font-size:30px;font-weight:600;line-height:1;pointer-events:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.playback-section-select{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;font-size:16px}.playback-section-select:disabled{cursor:default}.playback-hand-row{display:flex;align-items:flex-start;justify-content:center;gap:16px}.playback-hand-btn{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:none;background:none;cursor:pointer;color:var(--kafe-text-dim)}.playback-hand-btn:disabled{cursor:default}.playback-hand-icon{font-size:34px;line-height:1;color:#94a3b873}.playback-hand-btn.left.on .playback-hand-icon{color:var(--hand-left-white)}.playback-hand-btn.right .playback-hand-icon{transform:scaleX(-1)}.playback-hand-btn.right.on .playback-hand-icon{color:var(--hand-right-white)}.playback-icon-picker{display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;border:none;background:none;cursor:pointer;color:var(--kafe-text-dim)}.playback-icon-picker:disabled{cursor:default}.playback-icon-picker-main{display:inline-flex;align-items:center;gap:2px}.playback-picker-image{width:44px;height:34px;object-fit:contain;display:block}.playback-picker-chevron{font-size:11px;font-weight:600;color:var(--kafe-text-dim);transform:translateY(2px)}.playback-picker-caption{font-size:12px;font-weight:500;color:var(--kafe-text-dim)}.playback-mode-block{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}.playback-mode-block .sidebar-panel-title{align-self:stretch}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metronome-controls{display:flex;flex-direction:column;gap:8px}.metronome-controls--locked{opacity:.6}.metronome-tempo-row{display:flex;align-items:baseline;justify-content:space-between}.metronome-bpm-value{font-size:20px;font-weight:800;color:var(--kafe-text);font-variant-numeric:tabular-nums}.metronome-slider{width:100%;accent-color:var(--kafe-accent);cursor:pointer}.metronome-slider:disabled{cursor:default}.metronome-slider.metronome-slider--vertical{width:32px;height:100%;min-height:148px}.metronome-slider-scale{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--kafe-text-dim);margin-top:-2px}.metronome-reset{width:16px;height:16px;padding:0;border-radius:50%;border:2px solid var(--kafe-text-dim);background:transparent;cursor:pointer;transition:border-color .15s ease,background .15s ease}.metronome-reset:hover:not(:disabled){border-color:var(--kafe-accent);background:#ffffff14}.metronome-reset:disabled{cursor:default;opacity:.5}.metronome-division{margin-top:6px}.mac-field--locked{opacity:.45}.mac-field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--kafe-text-dim);min-width:0}.mac-field select{width:100%;min-height:var(--mac-sidebar-control-height);padding:0 28px 0 10px;border-radius:8px;border:1px solid var(--kafe-border);background-color:var(--kafe-bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' stroke='%23b6acd8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;color:var(--kafe-text);font:inherit;font-size:12px;line-height:1.2;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.mac-field select:disabled{cursor:default;opacity:.85}.hand-toggles{display:flex;gap:6px;width:100%}.hand-btn{flex:1;min-width:0;min-height:var(--mac-sidebar-control-height);display:inline-flex;align-items:center;justify-content:center;padding:0 8px;border-radius:8px;border:1px solid var(--kafe-border);background:var(--kafe-bg);color:var(--kafe-text-dim);cursor:pointer;font-size:12px}.hand-btn.left.on{background:var(--hand-left-white);color:#fff}.hand-btn.right.on{background:var(--hand-right-white);color:#fff}.begin-btn{width:100%;font-weight:800;font-size:16px;padding:14px;border:none}.mode-symbol{display:block;line-height:1}.mode-symbol--step{display:inline-block;filter:brightness(0) invert(1)}.home-page .home-edu-directors,.home-page .home-hub-grid{padding-inline:15px}.home-page{display:flex;flex-direction:column;gap:16px;flex:1;min-height:0}.home-hub-grid{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;max-width:820px;margin:0 auto;flex:1;min-height:0}.home-hub-row{display:flex;flex-wrap:nowrap;justify-content:center;gap:72px}.home-hub-tile{background:none;border:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;color:inherit;transition:transform .1s ease}.home-hub-tile:hover .home-hub-icon-wrap{border-color:var(--kafe-accent-strong);box-shadow:var(--kafe-hub-button-hover-shadow)}.home-hub-tile:hover{transform:translateY(-3px)}.home-hub-tile:active .home-hub-icon-wrap{transform:scale(.97);filter:brightness(.92)}.home-hub-icon-wrap{width:clamp(88px,16vw,130px);height:clamp(88px,16vw,130px);border-radius:clamp(18px,3.2vw,26px);background:var(--kafe-hub-button-bg-gradient);border:1px solid var(--kafe-hub-button-border);box-shadow:var(--kafe-hub-button-shadow);display:grid;place-items:center;transition:border-color .15s ease,box-shadow .15s ease,transform .1s ease,filter .1s ease}.home-hub-icon{width:70%;height:70%;object-fit:contain}.home-hub-label{font-weight:300;font-size:clamp(15px,2vw,21px);text-align:center;white-space:nowrap;line-height:1.2}.home-info-card{background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:18px;padding:28px 32px;display:flex;flex-direction:column;justify-content:center;gap:22px;max-width:920px;margin:0 auto;width:100%;flex-shrink:0;box-shadow:var(--kafe-shadow)}.home-info-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:14px}.home-edu-featured-block{display:flex;flex-direction:column;gap:10px}.home-info-kicker--spacer{visibility:hidden;-webkit-user-select:none;user-select:none}.home-info-kicker{font-size:16px;font-weight:700;color:var(--kafe-text-faint);width:130px;flex-shrink:0;text-align:right;margin-right:14px}.home-info-text{flex:1;font-size:21px;display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.home-info-unit-icon{width:25px;height:25px;object-fit:contain;flex-shrink:0}.home-info-text.featured{color:var(--kafe-purple)}.home-go-btn{padding:8px 18px;border-radius:8px;border:1px solid var(--kafe-border);background:var(--kafe-bg-card);color:var(--kafe-text-dim);cursor:pointer;font-size:17px}.home-go-btn:disabled{opacity:.45;cursor:not-allowed}.home-announce-list{margin:0;padding-left:18px;font-size:21px}.home-info-card .muted{font-size:21px}.home-edu-directors{text-align:center;margin:0 0 -8px;padding-top:12px}.home-edu-course-name{margin:0 0 8px;font-family:var(--font-course-name);font-size:36px;font-weight:400;line-height:1.15;color:var(--kafe-text)}.home-edu-director{margin:0;font-size:15px;line-height:1.25;color:var(--kafe-text-dim);font-weight:600}.home-edu-director-name{font-weight:400;font-style:italic;color:var(--kafe-text);opacity:.78}.home-edu-director--associate{margin-top:2px;font-size:14px}.home-sidebar-pro--edu{cursor:default}.page-top-bar:has(.home-menu-btn),.home-top-bar{position:relative}.page-top-bar .mac-toolbar-leading .home-menu-btn,.home-top-bar .mac-toolbar-leading .home-menu-btn{position:relative;left:auto;top:auto;transform:none;align-self:flex-start;margin-top:30px;margin-left:5px}.home-menu-btn{position:absolute;left:0;top:calc(50% - 14px);transform:translateY(-50%);width:90px;height:70px;padding:0;display:flex;flex-direction:column;gap:10px;background:none;border:none;cursor:pointer;opacity:.5;transition:opacity .15s ease}.home-menu-btn:hover{opacity:.65}.home-menu-btn span{display:block;flex:1;width:100%;border-radius:10px}.home-menu-btn span:nth-child(1){background:#eb33ea}.home-menu-btn span:nth-child(2){background:#b83aec}.home-menu-btn span:nth-child(3){background:#9d23e7}.home-sidebar-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1200;pointer-events:none}.home-sidebar-layer.is-open{pointer-events:auto}.home-sidebar-layer.is-instant .home-sidebar-backdrop,.home-sidebar-layer.is-instant .home-sidebar-clip,.home-sidebar-layer.is-instant .home-sidebar{transition:none}.home-sidebar-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000073;opacity:0;transition:opacity .25s ease}.home-sidebar-layer.is-open .home-sidebar-backdrop{opacity:1}.home-sidebar-clip{position:fixed;top:0;left:0;bottom:0;padding:0 30px 0 0;overflow:hidden;pointer-events:none;visibility:hidden;transition:visibility 0s linear .3s}.home-sidebar-layer.is-open .home-sidebar-clip{visibility:visible;transition:visibility 0s}.home-sidebar{position:relative;width:275px;max-width:84vw;height:100%;max-height:100%;display:flex;flex-direction:column;background:var(--kafe-sidebar-bg);color:var(--kafe-sidebar-text);border-radius:0;box-shadow:6px 6px 28px #00000080;pointer-events:auto;transform:translate(-100%);transition:transform .3s cubic-bezier(.22,1,.36,1);--home-sidebar-stat-section-height: 152px;--home-sidebar-chart-height: 115px;--home-sidebar-practice-panel-height: calc( 22px + 10px + var(--home-sidebar-chart-height) + 10px + 34px + 8px + 26px + 9px + 12px );--home-sidebar-stats-scroll-max: calc( 20px + (var(--home-sidebar-stat-section-height) * 2 + 10px) + 12px );--home-sidebar-body-constrained-height: calc( var(--home-sidebar-stats-scroll-max) + var(--home-sidebar-practice-panel-height) )}.home-sidebar-layer.is-open .home-sidebar{transform:translate(0)}.home-sidebar-pro{position:relative;flex-shrink:0;width:100%;min-height:48px;display:flex;align-items:center;justify-content:center;background:var(--kafe-sidebar-pro-bg);color:#fff;font-size:18px;font-weight:800;letter-spacing:.2px;padding:0 44px}.home-sidebar-pro--cta{background:var(--kafe-sidebar-pro-bg-cta);cursor:pointer}.home-sidebar-close{position:absolute;top:50%;right:8px;transform:translateY(-50%);width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:#00000029;border:none;border-radius:50%;color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:background .15s ease}.home-sidebar-close:hover{background:#00000057}.home-sidebar-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding:20px 10px 12px;display:flex;flex-direction:column;gap:10px}.home-sidebar-body{flex:1 1 auto;display:flex;flex-direction:column;min-height:0}.home-sidebar-body--constrained{flex:1 1 auto;min-height:0;max-height:none}.home-sidebar-stats-scroll{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;padding:20px 10px 0;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.35) transparent}.home-sidebar-stats-scroll::-webkit-scrollbar{width:6px}.home-sidebar-stats-scroll::-webkit-scrollbar-thumb{background:#ffffff59;border-radius:999px}.home-sidebar-practice-panel{flex:0 0 auto;flex-shrink:0;min-height:var(--home-sidebar-practice-panel-height);padding:10px 10px 12px;display:flex;flex-direction:column;gap:10px}.home-sidebar-heading{margin:0;padding:0 5px;font-size:15px;font-weight:700;color:var(--kafe-sidebar-text)}.home-sidebar-stat-section{display:flex;flex-direction:column;gap:8px}.home-sidebar-stat-header{margin:0;padding:5px 0 0 5px;font-size:17px;font-weight:700;color:var(--kafe-sidebar-text)}.home-sidebar-stat-row{display:flex;justify-content:space-around;gap:8px}.home-sidebar-stat-cell{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1}.home-sidebar-stat-box{width:70px;height:35px;display:flex;align-items:center;justify-content:center;background:#fff;color:#000;border-radius:5px;font-size:24px;font-weight:400;line-height:1;font-variant-numeric:tabular-nums}.home-sidebar-stat-box--locked{background:gray;color:#fff}.home-sidebar-stat-lock{font-size:16px;opacity:.5}.home-sidebar-stat-label{font-size:12px;color:var(--kafe-sidebar-text);text-align:center}.home-sidebar-divider{width:100%;height:1px;margin:4px 0;border:none;background:var(--kafe-sidebar-divider)}.home-sidebar-chart{flex:0 0 auto;display:flex;align-items:flex-end;gap:6px;height:var(--home-sidebar-chart-height);min-height:var(--home-sidebar-chart-height);padding:4px 10px 0}.home-sidebar-chart--locked{opacity:.55}.home-sidebar-chart--locked .home-chart-weekday,.home-sidebar-chart--locked .home-chart-date,.home-sidebar-chart--locked .home-chart-value{color:#ffffff73}.home-chart-col{flex:1;display:flex;flex-direction:column;align-items:center;height:var(--home-sidebar-chart-height);min-height:var(--home-sidebar-chart-height);flex-shrink:0}.home-chart-bar-track{flex:1 1 auto;min-height:0;width:100%;display:flex;align-items:flex-end;justify-content:center;padding-top:14px}.home-chart-bar{position:relative;width:70%;min-height:2px;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--kafe-accent-strong),var(--kafe-accent))}.home-chart-value{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:1px;font-size:10px;font-weight:700;color:var(--kafe-sidebar-text-dim);font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1}.home-chart-weekday{margin-top:5px;font-size:10px;color:var(--kafe-sidebar-text-dim)}.home-chart-date{font-size:10px;color:var(--kafe-sidebar-text-faint)}.home-sidebar-seg{flex:0 0 auto;width:100%;padding:0 2px;background:#ffffff1f;border-color:#fff3}.home-sidebar-seg button{flex:1;font-size:11px;padding:5px 6px;color:var(--kafe-sidebar-text-dim)}.home-sidebar-seg button.active{background:#fff;color:#333}.home-sidebar-view-more{flex:0 0 auto;align-self:center;margin:0;padding:4px 12px;background:none;border:none;color:var(--kafe-sidebar-text-dim);font-size:12px;font-weight:600;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.home-sidebar-view-more:hover{color:var(--kafe-sidebar-text)}.home-sidebar-footer{flex-shrink:0;display:flex;justify-content:space-around;align-items:flex-start;gap:4px;padding:0 6px 10px}.home-sidebar-footer-btn{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;flex:1;padding:0;background:none;border:none;color:var(--kafe-sidebar-text);font-size:12px;text-decoration:none;cursor:pointer}.home-sidebar-footer-btn:hover{opacity:.85}.home-sidebar-footer-icon{width:100%;max-width:52px;height:auto;object-fit:contain;padding:0 6px}@keyframes performance-results-overlay-in{0%{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{opacity:1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}}@keyframes performance-results-overlay-out{0%{opacity:1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}to{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}@keyframes performance-results-modal-in{0%{opacity:0;transform:scale(.86) translateY(40px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes performance-results-modal-out{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.92) translateY(20px)}}.performance-results-overlay.is-entering{animation:performance-results-overlay-in .5s ease forwards}.performance-results-overlay.is-entered{opacity:1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.performance-results-overlay.is-exiting{animation:performance-results-overlay-out .3s ease forwards;pointer-events:none}.performance-results-overlay.is-entering .performance-results-modal{animation:performance-results-modal-in .62s cubic-bezier(.22,1,.36,1) forwards}.performance-results-overlay.is-entered .performance-results-modal{opacity:1;transform:scale(1) translateY(0);animation:none}.performance-results-overlay.is-exiting .performance-results-modal{animation:performance-results-modal-out .3s ease forwards}.performance-results-modal{width:100%;max-width:360px;background:var(--kafe-bg-elevated);border:1px solid var(--kafe-border);border-radius:16px;padding:28px 24px 24px;text-align:center;box-shadow:0 12px 40px #00000059;opacity:0;transform:scale(.86) translateY(40px)}.performance-results-modal.groove-best-score-modal{width:fit-content;max-width:min(calc(100vw - 32px),420px);padding:0}.performance-results-title{margin:0 0 12px;font-size:22px;font-weight:700;line-height:1.2}.performance-results-stars{display:flex;justify-content:center;gap:6px;margin-bottom:6px}.performance-results-star{font-size:26px;color:#8c8c9673;line-height:1}.performance-results-star.earned{color:var(--kafe-blue)}.performance-results-mode{margin:0 0 16px;font-style:italic;color:var(--kafe-text-dim);font-size:14px}.performance-results-honor{margin:-8px 0 14px;font-size:14px;color:var(--kafe-text)}.performance-results-stats{display:flex;align-items:stretch;gap:16px;background:var(--kafe-bg-card);border:1px solid var(--kafe-border);border-radius:12px;padding:14px 16px;margin-bottom:20px;text-align:left;font-size:14px}.performance-results-col{flex:1;display:flex;flex-direction:column;gap:6px}.performance-results-row{display:flex;justify-content:space-between;gap:12px}.performance-results-label{white-space:nowrap}.performance-results-label.strong,.performance-results-value.strong{font-weight:700}.performance-results-divider{width:1px;background:var(--kafe-border);flex-shrink:0}.performance-results-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.performance-results-export,.performance-results-close{min-width:120px}.toolbar-labeled-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 16px;border-radius:10px;font-size:15px;font-weight:700;line-height:1;flex-shrink:0;box-shadow:0 1px 2px #0000001f}.toolbar-labeled-btn__icon{font-size:20px;line-height:1}.toolbar-labeled-btn--test{background:var(--kafe-incorrect);color:#fff}.toolbar-labeled-btn--test:hover{filter:brightness(1.05);background:var(--kafe-incorrect)}.lesson-report-print-host{position:fixed;left:-10000px;top:0;width:8.5in;pointer-events:none}.lesson-report-page{display:flex;flex-direction:column;width:100%;min-height:auto;margin:0 auto;padding:.32in .42in .38in;background:#fff;color:#111;font-family:Segoe UI,system-ui,sans-serif;box-sizing:border-box}.lesson-report-student-bar{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:18px;padding-bottom:10px;border-bottom:1px solid #d0d0d0}.lesson-report-student-name{font-size:15px;font-weight:700;color:#111}.lesson-report-student-meta{display:flex;gap:18px;font-size:11px;color:#444}.lesson-report-hero{display:grid;place-items:center;text-align:center;margin-bottom:22px;padding:22px 28px 26px;border-radius:16px;background:#fff;color:#333;box-shadow:0 4px 14px #0000001a}.lesson-report-hero-eyebrow{margin:0 0 8px;font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:#888}.lesson-report-hero-title{margin:0;font-size:36px;font-weight:800;line-height:1.1;letter-spacing:-.02em;color:#2a2a2a}.lesson-report-block{margin-top:18px}.lesson-report-block-title{margin:0;text-align:center;font-size:20px;font-weight:500;color:#111}.lesson-report-block-rule{height:1px;margin:6px 0 0;background:#b0b0b0}.lesson-report-bottom-row{display:grid;grid-template-columns:1fr 1fr;align-items:center;padding-top:18px;min-height:120px}.lesson-report-bottom-half{display:flex;align-items:center;min-width:0}.lesson-report-bottom-half--left{justify-content:flex-end;padding-right:40px}.lesson-report-bottom-half--right{justify-content:flex-start}.lesson-report-bottom-spacer{flex:1;min-width:0}.lesson-report-bottom-half--left .lesson-report-bottom-spacer{display:none}.lesson-report-practice-panel{flex-shrink:0}.lesson-report-practice-title{margin:0 0 12px;text-align:center;font-size:22px;font-weight:500;color:#111}.lesson-report-practice-cols{display:grid;grid-template-columns:auto auto;column-gap:12px;row-gap:7px;align-items:baseline;font-size:16px}.lesson-report-practice-labels,.lesson-report-practice-values{list-style:none;margin:0;padding:0}.lesson-report-practice-labels li{text-align:right;color:#111;font-weight:400;white-space:nowrap}.lesson-report-practice-values li{text-align:left;color:#111;font-weight:700}.lesson-report-block--test .lesson-report-block-title{font-size:26px}.lesson-report-block--test .lesson-report-mac-row{gap:26px;min-height:163px;padding:18px 0 6px}.lesson-report-block--test .lesson-report-mac-cell{width:163px}.lesson-report-block--test .lesson-report-mac-cell--narrow{width:117px}.lesson-report-block--test .lesson-report-mac-cell-label{font-size:16px}.lesson-report-block--test .lesson-report-mac-cell-value{min-height:94px;font-size:59px}.lesson-report-mac-row{display:flex;justify-content:center;gap:20px;min-height:125px;padding:14px 0 4px;align-items:flex-start}.lesson-report-mac-cell{display:flex;flex-direction:column;align-items:center;gap:4px;width:125px}.lesson-report-mac-cell--narrow{width:90px}.lesson-report-mac-cell-label{font-size:12px;font-weight:300;color:#111;text-align:center;line-height:1.2}.lesson-report-mac-cell-value{display:grid;place-items:center;width:100%;min-height:72px;padding:6px;border:1px solid #b0b0b0;border-radius:4px;background:#fff;font-size:45px;font-weight:400;line-height:1;color:#111}.lesson-report-qr-card{display:flex;align-items:center;gap:16px;flex-shrink:0;padding:14px 18px;border:1px solid #c8c8c8;border-radius:12px;background:#fff;box-shadow:0 2px 8px #0000000f}.lesson-report-qr{display:block;flex-shrink:0;border-radius:6px}.lesson-report-qr-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.lesson-report-qr-lesson{font-size:15px;font-weight:700;color:#111;line-height:1.2}.lesson-report-qr-score{font-size:13px;font-weight:600;color:#2f7bff}.lesson-report-qr-hint{font-size:11px;color:#666}@media print{@page{size:letter;margin:.4in}body.printing-lesson-report #root{visibility:hidden!important;position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important;pointer-events:none!important}body.printing-lesson-report .lesson-report-print-host{position:static!important;left:auto!important;top:auto!important;width:100%!important;pointer-events:auto}.lesson-report-page{box-shadow:none;min-height:auto;width:100%;padding:0;border-radius:0}body.printing-unit-report #root{display:none!important}body.printing-unit-report .unit-report-print-host{position:static!important;left:auto!important;top:auto!important;width:100%!important;pointer-events:auto}.unit-report-page.lesson-report-page{min-height:auto}.unit-report-qr-anchor,.lesson-report-qr-card{break-inside:avoid;page-break-inside:avoid}}.unit-report-print-host{position:fixed;left:-10000px;top:0;width:8.5in;pointer-events:none}.unit-report-page .lesson-report-block--test .lesson-report-block-title{font-size:20px}.unit-report-page .lesson-report-block--test .lesson-report-mac-row{min-height:auto;padding:8px 0 2px}.unit-report-page .unit-report-breakdown{margin-top:18px}.unit-report-page .lesson-report-block--test .lesson-report-mac-cell--wide{width:190px}.unit-report-page .lesson-report-block--test .lesson-report-mac-cell--wide .lesson-report-mac-cell-value{font-size:52px;letter-spacing:-.02em}.unit-report-qr-rule{margin:18px 0}.unit-report-qr-anchor{display:flex;justify-content:flex-start;align-items:flex-end;margin-top:4px}.unit-report-page .unit-report-table{width:100%;margin-top:14px;border-collapse:collapse;font-size:13px;color:#111}.unit-report-page .unit-report-table th,.unit-report-page .unit-report-table td{padding:8px 10px;border-bottom:1px solid #d0d0d0;text-align:left}.unit-report-page .unit-report-table th{font-weight:600;color:#333}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:grid;place-items:center;z-index:60;padding:20px}.unit-report-modal{width:100%;max-width:720px;max-height:90vh;overflow:auto;background:var(--kafe-bg-elevated);border:1px solid var(--kafe-border);border-radius:16px;padding:20px}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-bottom:16px}.unit-report-banner{display:flex;justify-content:space-between;margin-bottom:16px}.unit-report-title{margin:0 0 20px;font-size:20px}.unit-report-section{margin:0 0 12px;font-size:14px;color:var(--kafe-text-dim)}.unit-report-bubbles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px}.report-bubble{background:var(--kafe-bg-card);border-radius:12px;padding:16px;text-align:center}.report-bubble .v{font-size:28px;font-weight:800}.report-bubble .k{font-size:11px;color:var(--kafe-text-dim);margin-top:4px}.unit-report-body .unit-report-table{width:100%;border-collapse:collapse;font-size:13px}.unit-report-body .unit-report-table th,.unit-report-body .unit-report-table td{padding:8px 10px;border-bottom:1px solid var(--kafe-border);text-align:left}@media print{.announce-banner,.no-print{display:none!important}}@media (max-width: 820px){:root{--page-top-bar-inner-min-height: 44px}.mac-toolbar-balanced{grid-template-columns:52px 1fr 52px;gap:8px}.mac-toolbar-balanced--nav-cluster{grid-template-columns:max-content minmax(0,1fr) max-content}.mac-home-btn{width:44px;padding:0}.mac-home-btn-label{display:none}.mac-display-title{font-size:clamp(22px,6vw,32px);line-height:1.2;word-break:break-word}.mac-unit-title{font-size:clamp(20px,5vw,28px);line-height:1.2}.mac-session-title{word-break:normal}.content{padding:18px}.content:has(.groove-session-page),.content:has(.flash-session-page),.content:has(.lesson-video-page),.content:has(.home-page),.content:has(.pom-library-page),.content:has(.pom-activity-page),.content:has(.unit-selection-page),.content:has(.song-unit-page){padding-left:0;padding-right:0}.unit-grid-shell{display:block}.unit-grid{display:grid;width:100%;grid-template-columns:1fr;gap:32px;padding:16px 0 32px}.unit-card{width:100%}.song-unit-layout{grid-template-columns:1fr}.song-sidebar{min-width:0}.flash-session-layout{min-height:auto}.flash-session-instructions-row{grid-template-columns:1fr}.flash-session-instructions-sidebar-gap{display:none}.flash-session-stage{grid-template-columns:1fr}.flash-session-sidebar{padding:0}.flash-session-notation-col{padding:16px 12px 8px}.flash-session-card-area .flash-notation.flash-notation-fill{min-height:min(55vh,380px)}.flash-notation:not(.flash-notation-fill) .flash-notation-viewport{max-height:280px}.mode-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.unit-report-bubbles{grid-template-columns:1fr}}.mobile-unsupported-screen{min-height:100%;min-height:100dvh;display:grid;place-items:center;padding:24px;padding-top:max(24px,env(safe-area-inset-top));padding-right:max(24px,env(safe-area-inset-right));padding-bottom:max(24px,env(safe-area-inset-bottom));padding-left:max(24px,env(safe-area-inset-left));box-sizing:border-box;background:var(--kafe-body-gradient),var(--kafe-bg);color:var(--kafe-text)}.mobile-unsupported-screen__card{max-width:360px;text-align:center;display:grid;gap:16px;justify-items:center}.mobile-unsupported-screen__icon{border-radius:14px}.mobile-unsupported-screen__title{margin:0;font-family:var(--font-display);font-size:clamp(26px,7vw,32px);font-weight:400;line-height:1.15}.mobile-unsupported-screen__message{margin:0;font-size:17px;line-height:1.45;color:var(--kafe-text-dim)}.melodic-session-page{display:flex;flex-direction:column;min-height:100%}.melodic-session-toolbar-actions{display:flex;justify-content:flex-end;padding:0 20px 8px}.melodic-hint-btn{background:#ff9500;color:#fff;border:none;border-radius:8px;padding:8px 16px;font-weight:600;cursor:pointer}.melodic-session-body{display:flex;flex:1;gap:16px;padding:0 20px 12px;min-height:0}.melodic-session-main{flex:1;display:flex;flex-direction:column;min-height:0;padding-top:20px}.melodic-dictation-unit-session .melodic-session-main{padding-top:0}.melodic-dictation-indicator-zone{flex:1;min-height:0;display:flex;align-items:center;justify-content:center}.melodic-session-main .instrument-session-instructions.rhythm-session-instructions{flex-shrink:0;margin-bottom:0}.melodic-dictation-main-panel{display:flex;flex-direction:column;min-height:0;flex:1}.melodic-dictation-unit-session .melodic-dictation-main-panel{padding-top:20px;box-sizing:border-box}.melodic-dictation-unit-session .melodic-dictation-main-panel .instrument-session-instructions{flex-shrink:0;margin-bottom:0}.melodic-dictation-unit-session .melodic-session-instructions,.melodic-session-page .melodic-session-instructions{width:100%;margin-left:0;justify-content:center;text-align:center;padding:0 20px;background:linear-gradient(90deg,transparent 0%,#fff 18%,#fff 82%,transparent 100%)}[data-theme=dark] .melodic-dictation-unit-session .melodic-session-instructions,[data-theme=dark] .melodic-session-page .melodic-session-instructions{background:linear-gradient(90deg,transparent 0%,var(--kafe-bg-elevated) 18%,var(--kafe-bg-elevated) 82%,transparent 100%)}.melodic-dictation-unit-session .flash-session-piano .piano,.melodic-session-page .flash-session-piano .piano,.melodic-dictation-unit-session .flash-session-piano .white-key,.melodic-session-page .flash-session-piano .white-key{height:130px}.melodic-dictation-unit-session .flash-session-piano .black-key,.melodic-session-page .flash-session-piano .black-key{height:82px}.melodic-session-instructions{font-size:clamp(24px,2.4vw,36px);white-space:nowrap}.melodic-dictation-unit-session .melodic-session-embedded{display:flex;align-items:center;justify-content:center;width:fit-content;flex:0 0 auto}.melodic-game-indicator-stack{display:flex;flex-direction:column;align-items:center;position:relative;width:fit-content;max-width:100%}.melodic-game-new-best{position:absolute;bottom:calc(100% + 6px);left:50%;margin:0;font-size:15px;font-weight:800;letter-spacing:.02em;color:var(--kafe-correct);animation:melodic-new-best-fade 2.6s ease-out forwards;pointer-events:none;white-space:nowrap;z-index:1}.melodic-game-sidebar-fill{background:#fc8226;transition:width .35s ease,background-color .25s ease}.melodic-game-sidebar-fill--new-best{background:var(--kafe-correct)}@keyframes melodic-new-best-fade{0%{opacity:0;transform:translate(-50%) translateY(10px)}12%{opacity:1;transform:translate(-50%) translateY(0)}72%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-14px)}}.melodic-dictation-unit-session .melodic-question-panel{flex:0 0 auto;min-height:0;margin:0}.flash-plays-remaining{margin:10px 0 0;text-align:center;font-size:12px;color:var(--kafe-text-dim)}.melodic-card-actions{display:flex;flex-direction:column;gap:14px}.melodic-card-actions-play-row{display:flex;align-items:flex-end;gap:10px}.melodic-plays-stat{flex-shrink:0}.melodic-plays-stat-value{min-width:50px;min-height:50px;width:50px;height:50px;display:flex;align-items:center;justify-content:center;padding:0;box-sizing:border-box}.melodic-card-actions-nav{padding:0}.melodic-note-bank-panel{display:flex;flex-direction:column;gap:10px}.melodic-note-bank-play-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;border-radius:8px;background:#ff9500;color:#fff;cursor:pointer;padding:0}.melodic-note-bank-play-btn:disabled{opacity:.5;cursor:default}.melodic-note-bank-play-btn .melodic-play-btn__icon{width:18px;height:18px}.melodic-note-bank-indicators{display:flex;flex-wrap:wrap;gap:10px 12px}.melodic-note-bank-indicator{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:28px}.melodic-note-bank-dot{width:14px;height:14px;border-radius:50%;background:#78788059;transition:background .12s ease,box-shadow .12s ease}.melodic-note-bank-indicator--active .melodic-note-bank-dot{background:#007aff;box-shadow:0 0 0 3px #007aff40}.melodic-note-bank-label{font-size:10px;line-height:1.1;color:var(--kafe-text-dim)}.melodic-note-bank-indicator--active .melodic-note-bank-label{color:var(--kafe-text);font-weight:600}.melodic-dictation-session-sidebar{padding-top:30px}.melodic-dictation-session-sidebar .melodic-session-info-mode{font-size:20px;font-weight:600}.melodic-dictation-session-sidebar .flash-session-info-count{text-align:center}.melodic-practice-progress-fill{background:linear-gradient(90deg,#007aff,#0051d5)}.melodic-practice-time{margin:0}.melodic-question-panel{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;width:fit-content;max-width:100%;padding:36px 40px;background:var(--kafe-bg-card);border-radius:10px;box-shadow:var(--kafe-shadow)}[data-theme=dark] .melodic-question-panel{background:var(--kafe-bg-elevated)}.melodic-question-panel--popping{animation:flash-pop .5s ease-out}.melodic-play-btn{flex:1;min-height:50px;height:50px;border-radius:10px;border:none;background:#ff9500;color:#fff;font-size:15px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.melodic-play-btn__icon{width:20px;height:20px;flex-shrink:0}.melodic-play-btn:hover:not(:disabled){filter:brightness(1.05)}.melodic-play-btn:disabled{opacity:.5;cursor:default}.melodic-dots{display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.melodic-dots--shake{animation:melodic-shake .2s ease}@keyframes melodic-shake{0%,to{transform:translate(0)}25%{transform:translate(8px)}75%{transform:translate(-8px)}}.melodic-dot{width:58px;height:58px;border-radius:50%;border:none;padding:0;cursor:default;flex-shrink:0}.melodic-dot--pending{background:#80808059}.melodic-dot--active{background:#007aff8c;box-shadow:0 0 0 4px #007aff59}.melodic-dot.melodic-dot--playback{outline:3px solid rgba(0,122,255,1);outline-offset:3px;box-shadow:none}.melodic-dot--active.melodic-dot--attempt-first{background:var(--kafe-correct);box-shadow:0 0 0 4px color-mix(in srgb,var(--kafe-correct) 55%,transparent)}.melodic-dot--active.melodic-dot--attempt-second{background:#ffd60a;box-shadow:0 0 0 4px #ffd60a73}.melodic-dot--active.melodic-dot--attempt-third{background:var(--kafe-incorrect);box-shadow:0 0 0 4px color-mix(in srgb,var(--kafe-incorrect) 55%,transparent)}.melodic-dot--current{background:#80808059;box-shadow:0 0 0 3px #007aff}.melodic-dot--selected{outline:2px solid #333;outline-offset:3px}.melodic-session-page .melodic-dot:not(:disabled){cursor:pointer}.melodic-sidebar{width:280px;background:var(--kafe-bg-elevated);color:var(--kafe-text);border-radius:10px;padding:16px;box-shadow:0 2px 6px #0000000f}.melodic-keyboard-wrap{padding:8px 12px 16px}.melodic-midi-hint{text-align:center;font-size:12px;color:var(--kafe-text-dim);margin:0 0 4px}.melodic-session-complete{margin:auto;text-align:center;display:grid;gap:12px}.rhythm-main-toolbar{flex-wrap:wrap;gap:10px 14px;align-items:center}.rhythm-pattern-nav{display:flex;flex-direction:column;gap:2px}.rhythm-nav-btn{border:none;background:transparent;color:var(--kafe-blue);font-size:16px;font-weight:800;line-height:1;padding:2px 6px;cursor:pointer}.rhythm-nav-btn:disabled{color:var(--kafe-text-faint);cursor:default}.rhythm-notation-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.rhythm-notation-btn{border:1px solid var(--kafe-border);background:var(--kafe-bg-elevated);border-radius:8px;padding:8px 12px;font-weight:600;font-size:14px;color:var(--kafe-purple);cursor:pointer;font-family:inherit}.rhythm-notation-btn:focus,.rhythm-notation-btn:focus-visible{outline:none}.rhythm-notation-btn.active{background:var(--kafe-purple);color:#fff;border-color:var(--kafe-purple)}.rhythm-notation-btn:disabled{opacity:.45;cursor:not-allowed}.rhythm-mode-picker{min-width:0}.rhythm-metronome-inline{display:flex;gap:10px;align-items:center}.rhythm-hub{margin-top:8px}.rhythm-grid-tracks{position:relative}.rhythm-grid.groove-grid{width:100%;box-sizing:border-box}.rhythm-grid .groove-grid-cells,.rhythm-grid .rhythm-track-cells{flex:1 1 0;min-width:calc(var(--groove-steps, 32) * 14px)}.rhythm-track-label{min-height:45px}.rhythm-track-cells{display:block;position:relative;min-height:45px;background:var(--kafe-gray-9, #f2f2f7);border:1px solid rgba(0,0,0,.12);overflow:hidden}.rhythm-track-cells--staff{background:var(--kafe-notation-paper, #ffffff)}.rhythm-staff-loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;padding-left:12px;font-size:13px}.rhythm-beat-grid-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;opacity:.8;background-image:linear-gradient(to right,#8e8e93 0,#8e8e93 1px,transparent 1px),linear-gradient(to right,#8e8e93 0,#8e8e93 1.6px,transparent 1.6px),linear-gradient(to right,#8e8e93 0,#8e8e93 2.2px,transparent 2.2px);background-size:12.5% 100%,25% 100%,50% 100%;background-repeat:repeat-x}.rhythm-staff-image{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:100%;height:100%;object-fit:fill;transform:translate(5px)}.rhythm-pattern-block{position:absolute;z-index:2;top:10%;height:80%;border-radius:4px;background:var(--kafe-purple);box-shadow:0 1px 2px #00000026}.rhythm-user-block{position:absolute;z-index:2;top:10%;height:80%;border:1px solid rgba(0,0,0,.25);border-radius:4px;padding:0;cursor:pointer}.rhythm-user-block.selected{outline:3px solid var(--kafe-blue);outline-offset:-1px}.rhythm-bottom-bar{display:grid;grid-template-columns:200px 1fr 140px;gap:16px;margin-top:14px;padding:16px 18px;background:var(--kafe-bg-elevated);color:var(--kafe-text);border-radius:16px;box-shadow:0 1px 4px #0000001a}.rhythm-bottom-title{margin:0 0 6px;font-size:28px;font-weight:600;line-height:1.1}.rhythm-bottom-caption{margin:0 0 4px;font-size:13px}.rhythm-instrument-name{margin:0 0 8px;font-weight:600}.rhythm-note-status{margin:0 0 4px;display:flex;align-items:center;gap:6px}.rhythm-note-dot{width:12px;height:12px;border-radius:999px;border:1px solid rgba(0,0,0,.25);background:#ccc;display:inline-block}.rhythm-note-dot.active{background:var(--kafe-blue)}.rhythm-key-hint{margin:0;font-size:12px}.rhythm-feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rhythm-feedback-grid h4{margin:0 0 6px;font-size:20px;text-decoration:underline}.rhythm-feedback-grid p{margin:0 0 4px}.rhythm-score-value{margin:0 0 8px;font-size:40px;font-weight:600;line-height:1}.rhythm-reset-bordered-btn{border:none;border-radius:6px;background:var(--kafe-blue);color:#fff;font-weight:700;padding:6px 14px;cursor:pointer}.rhythm-reset-bordered-btn:disabled{background:#999;cursor:default}.rhythm-sidebar-drill-name{margin:0 0 10px;font-size:22px}.rhythm-sidebar-stats-grid{display:grid;gap:8px;margin-bottom:10px}.rhythm-sidebar-stat{display:flex;justify-content:space-between;gap:8px;font-size:15px}.rhythm-sidebar-stat-label{color:var(--kafe-text-dim)}.rhythm-sidebar-stat-value{font-weight:400}.rhythm-reset-stats-btn{border:none;background:transparent;color:var(--kafe-incorrect);font-weight:600;padding:0;cursor:pointer}.rhythm-reset-stats-btn:disabled{opacity:.45;cursor:default}.rhythm-topic-dl{margin:0;display:grid;gap:8px;font-size:14px}.rhythm-topic-dl div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rhythm-topic-dl dt{margin:0;text-align:right;color:var(--kafe-text-dim)}.rhythm-topic-dl dd{margin:0;font-weight:600}.rhythm-reset-modal{max-width:420px}.text-correct{color:var(--kafe-correct)}.text-incorrect{color:var(--kafe-incorrect)}.rhythm-user-block.eval-clickable{cursor:pointer}.rhythm-user-block.eval-clickable:hover{filter:brightness(.95)}.rhythm-session-instructions{flex-shrink:0;width:calc(100% + var(--groove-panel-edge-inset));margin-left:calc(-1 * var(--groove-panel-edge-inset));margin-bottom:50px;padding-left:var(--groove-panel-edge-inset);padding-right:20px;box-sizing:border-box}.rhythm-note-feedback-popup{max-width:360px}.rhythm-feedback-section{margin-top:14px}.rhythm-feedback-heading{margin:0 0 6px;font-size:15px;font-weight:700}.rhythm-feedback-status{margin:0 0 8px;font-size:18px;font-weight:700}.rhythm-feedback-status--correct{color:var(--kafe-correct)}.rhythm-feedback-status--incorrect{color:var(--kafe-incorrect)}@media (max-width: 980px){.rhythm-bottom-bar{grid-template-columns:1fr}.rhythm-main-toolbar{flex-direction:column;align-items:stretch}}.coach-mark-anchor{position:relative;display:block}.home-hub-coach{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:32px;width:100%}.coach-mark-anchor.is-highlighted{outline:3px solid var(--kafe-accent, #0ea5e9);outline-offset:8px;border-radius:14px}.coach-mark-callout{position:fixed;z-index:80;width:min(280px,calc(100vw - 24px));padding:14px;border-radius:12px;background:var(--kafe-bg-elevated, #fff);border:1px solid var(--kafe-border, rgba(148, 163, 184, .35));box-shadow:0 12px 28px #0000002e;transform:translate(-50%);color:var(--kafe-text)}.coach-mark-blocker{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:24px;background:#00000073}.home-activity-coach-blocker{display:block;padding:0}.home-activity-coach-ring{position:fixed;z-index:91;border:3px solid var(--kafe-accent, #0ea5e9);border-radius:16px;pointer-events:none;box-sizing:border-box}.home-activity-coach-lessons-hit{position:fixed;z-index:92;border:none;padding:0;margin:0;background:transparent;cursor:pointer}.coach-mark-callout--side{position:fixed;z-index:93;width:min(320px,calc(100vw - 48px));transform:translateY(-50%)}.coach-mark-side-caret{position:absolute;top:50%;width:0;height:0;border-style:solid;transform:translateY(-50%)}.coach-mark-side-caret--left{left:-10px;border-width:8px 10px 8px 0;border-color:transparent var(--kafe-bg-elevated, #fff) transparent transparent;filter:drop-shadow(-1px 0 0 var(--kafe-border, rgba(148, 163, 184, .35)))}.coach-mark-side-caret--right{right:-10px;border-width:8px 0 8px 10px;border-color:transparent transparent transparent var(--kafe-bg-elevated, #fff);filter:drop-shadow(1px 0 0 var(--kafe-border, rgba(148, 163, 184, .35)))}.coach-mark-callout--modal{position:relative;top:auto;left:auto;transform:none;width:min(400px,calc(100vw - 48px));z-index:91;margin:24vh auto 0}.coach-mark-callout--closable{padding-top:36px}.coach-mark-close{position:absolute;top:8px;right:8px;width:28px;height:28px;border:none;border-radius:999px;background:#94a3b82e;color:var(--kafe-text-dim, #64748b);font-size:18px;line-height:1;cursor:pointer}.coach-mark-close:hover{background:#94a3b847;color:var(--kafe-text)}.coach-mark-callout--options{width:min(340px,calc(100vw - 24px))}.coach-mark-callout--above{z-index:93;width:min(320px,calc(100vw - 48px));transform:translate(-50%,-100%)}.coach-mark-callout--below{position:fixed;z-index:93;width:min(320px,calc(100vw - 48px));transform:translate(-50%)}.coach-mark-callout-caret{position:absolute;left:50%;width:12px;height:12px;background:var(--kafe-bg-elevated, #fff);border-left:1px solid var(--kafe-border, rgba(148, 163, 184, .35));border-top:1px solid var(--kafe-border, rgba(148, 163, 184, .35));transform:translate(-50%) rotate(45deg)}.coach-mark-callout--below .coach-mark-callout-caret{top:-6px}.coach-mark-callout--above .coach-mark-callout-caret{bottom:-6px;transform:translate(-50%) rotate(225deg)}.coach-mark-callout-title{margin:0 0 8px;font-size:15px;font-weight:600}.coach-mark-callout-body{margin:0 0 12px;font-size:13px;line-height:1.4;color:var(--kafe-text-dim, #64748b)}.coach-mark-callout-body:has(+.coach-mark-option-list){margin-bottom:0}.coach-mark-option-list{list-style:none;margin:12px 0;padding:12px 0 0;border-top:1px solid var(--kafe-border, rgba(148, 163, 184, .35));display:flex;flex-direction:column;gap:8px}.coach-mark-option{display:flex;flex-direction:column;gap:2px}.coach-mark-option-title{font-size:13px;font-weight:600;color:var(--kafe-text)}.coach-mark-option-detail{font-size:12px;line-height:1.35;color:var(--kafe-text-dim, #64748b)}.coach-mark-callout-actions{display:flex;justify-content:flex-end;gap:8px;align-items:center}.coach-mark-got-it{font-size:13px;padding:6px 12px}