@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;600;700&family=Manrope:wght@800&display=swap";[data-v-4327b39e]:root{--color-bg: #0D1117;--color-bg-card: #161B22;--color-bg-elevated: #1C2129;--color-bg-hover: #21262D;--color-bg-input: #0D1117;--color-border: #30363D;--color-border-light: #21262D;--color-text: #E6EDF3;--color-text-secondary: #8B949E;--color-text-muted: #7D8590;--color-primary: #7A2530;--color-primary-rgb: 122, 37, 48;--color-primary-dark: #5C1B24;--color-primary-light: #C26B7A;--color-primary-hover: #965666;--color-primary-glow: rgba(122, 37, 48, .15);--color-success: #3FB950;--color-success-glow: rgba(63, 185, 80, .15);--color-warning: #D29922;--color-warning-glow: rgba(210, 153, 34, .15);--color-error: #FF5C54;--color-error-glow: rgba(255, 92, 84, .15);--color-feedback-soft: #f0a060;--color-feedback-soft-glow: rgba(240, 160, 96, .12);--color-info: #C26B7A;--color-purple: #BC8CFF;--color-purple-glow: rgba(188, 140, 255, .15);--color-surface: var(--color-bg-card);--color-surface-hover: var(--color-bg-hover);--color-warning-rgb: 210, 153, 34;--color-accent: var(--color-primary-light);--color-bg-secondary: var(--color-bg-elevated);--color-bg-muted: var(--color-bg-hover);--color-text-primary: var(--color-text);--color-fretboard-wood: #6b4423;--color-fretboard-string: #4a5568;--color-fretboard-fret: #cbd5e0;--color-fretboard-dot: #a0aec0;--color-note-active: #C26B7A;--color-note-playing: #3FB950;--color-note-hover: #C26B7A;--color-note-1: #58A6FF;--color-note-2: #D29922;--color-note-3: #3FB950;--color-note-4: #F85149;--color-piano-white: #F5F1E8;--color-piano-black: #1A1A1A;--color-piano-active: #C26B7A;--color-piano-played: #3FB950;--color-piano-frame: #0A0A0A;--color-piano-ivory-hover: #E8E4D8}.nav-bar[data-v-4327b39e]{display:flex;flex-direction:row;width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:none}.nav-bar[data-v-4327b39e]::-webkit-scrollbar{display:none}.nav-item[data-v-4327b39e]{flex:1 0 56px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 4px;scroll-snap-align:start;background:none;border:none;cursor:pointer;color:var(--color-text-muted);line-height:1.2;white-space:nowrap;transition:color .15s}.nav-item--active[data-v-4327b39e]{color:var(--color-primary-light)}.nav-item__icon-wrap[data-v-4327b39e]{position:relative;display:inline-flex}.nav-item__label[data-v-4327b39e]{font-size:10px;font-weight:500}.nav-item__badge[data-v-4327b39e]{position:absolute;top:-4px;right:-6px;min-width:16px;height:16px;padding:0 3px;border-radius:8px;background:var(--color-error, #ef4444);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;pointer-events:none}.toast-stack[data-v-450a6ac4]{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:.5rem;pointer-events:none;max-width:360px;width:calc(100vw - 2rem)}.toast[data-v-450a6ac4]{display:flex;align-items:flex-start;gap:.625rem;padding:.75rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;line-height:1.4;box-shadow:0 8px 24px #0006;pointer-events:auto;border:1px solid transparent}.toast--info[data-v-450a6ac4]{background:var(--color-bg-elevated);border-color:var(--color-border);color:var(--color-text)}.toast--success[data-v-450a6ac4]{background:#3fb9501f;border-color:#3fb9504d;color:#3fb950}.toast--error[data-v-450a6ac4]{background:#ff5c541f;border-color:#ff5c544d;color:#ff5c54}.toast--warning[data-v-450a6ac4]{background:#d299221f;border-color:#d299224d;color:#d29922}.toast__icon[data-v-450a6ac4]{flex-shrink:0;margin-top:1px}.toast__message[data-v-450a6ac4]{flex:1}.toast-enter-active[data-v-450a6ac4]{transition:transform .2s cubic-bezier(.16,1,.3,1),opacity .2s ease}.toast-leave-active[data-v-450a6ac4]{transition:transform .15s ease-in,opacity .15s ease-in}.toast-enter-from[data-v-450a6ac4],.toast-leave-to[data-v-450a6ac4]{transform:translate(110%);opacity:0}.toast-move[data-v-450a6ac4]{transition:transform .2s ease}@media (prefers-reduced-motion: reduce){.toast-enter-active[data-v-450a6ac4],.toast-leave-active[data-v-450a6ac4],.toast-move[data-v-450a6ac4]{transition:opacity .15s ease}.toast-enter-from[data-v-450a6ac4],.toast-leave-to[data-v-450a6ac4]{transform:none}}@media (max-width: 480px){.toast-stack[data-v-450a6ac4]{bottom:5rem;right:.75rem;left:.75rem;width:auto}}[data-v-0887eb8b]:root{--color-bg: #0D1117;--color-bg-card: #161B22;--color-bg-elevated: #1C2129;--color-bg-hover: #21262D;--color-bg-input: #0D1117;--color-border: #30363D;--color-border-light: #21262D;--color-text: #E6EDF3;--color-text-secondary: #8B949E;--color-text-muted: #7D8590;--color-primary: #7A2530;--color-primary-rgb: 122, 37, 48;--color-primary-dark: #5C1B24;--color-primary-light: #C26B7A;--color-primary-hover: #965666;--color-primary-glow: rgba(122, 37, 48, .15);--color-success: #3FB950;--color-success-glow: rgba(63, 185, 80, .15);--color-warning: #D29922;--color-warning-glow: rgba(210, 153, 34, .15);--color-error: #FF5C54;--color-error-glow: rgba(255, 92, 84, .15);--color-feedback-soft: #f0a060;--color-feedback-soft-glow: rgba(240, 160, 96, .12);--color-info: #C26B7A;--color-purple: #BC8CFF;--color-purple-glow: rgba(188, 140, 255, .15);--color-surface: var(--color-bg-card);--color-surface-hover: var(--color-bg-hover);--color-warning-rgb: 210, 153, 34;--color-accent: var(--color-primary-light);--color-bg-secondary: var(--color-bg-elevated);--color-bg-muted: var(--color-bg-hover);--color-text-primary: var(--color-text);--color-fretboard-wood: #6b4423;--color-fretboard-string: #4a5568;--color-fretboard-fret: #cbd5e0;--color-fretboard-dot: #a0aec0;--color-note-active: #C26B7A;--color-note-playing: #3FB950;--color-note-hover: #C26B7A;--color-note-1: #58A6FF;--color-note-2: #D29922;--color-note-3: #3FB950;--color-note-4: #F85149;--color-piano-white: #F5F1E8;--color-piano-black: #1A1A1A;--color-piano-active: #C26B7A;--color-piano-played: #3FB950;--color-piano-frame: #0A0A0A;--color-piano-ivory-hover: #E8E4D8}.app[data-v-0887eb8b]{min-height:100vh;display:flex;flex-direction:column;background:var(--color-bg)}.app-sidebar[data-v-0887eb8b]{display:none}@media (min-width: 768px){.app-sidebar[data-v-0887eb8b]{display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;width:260px;background:var(--color-surface);border-right:1px solid var(--color-border);padding:1.5rem 1rem;z-index:100;overflow:hidden;transition:width .2s ease}}@media (min-width: 768px){.app-sidebar--collapsed[data-v-0887eb8b]{width:52px;padding-left:0;padding-right:0}.app-sidebar--collapsed .app-sidebar__brand-text[data-v-0887eb8b],.app-sidebar--collapsed .app-sidebar__user-info[data-v-0887eb8b],.app-sidebar--collapsed .app-sidebar__logout[data-v-0887eb8b]{display:none}.app-sidebar--collapsed .app-sidebar__brand[data-v-0887eb8b]{justify-content:center;padding-left:0;padding-right:0}.app-sidebar--collapsed .app-sidebar__collapse-btn[data-v-0887eb8b]{margin-left:auto;margin-right:auto;padding:.25rem;width:32px;height:32px;justify-content:center}.app-sidebar--collapsed .app-sidebar__nav[data-v-0887eb8b]{padding:0}.app-sidebar--collapsed .app-sidebar__link[data-v-0887eb8b]{justify-content:center;padding:.5rem 0;width:100%}.app-sidebar--collapsed .app-sidebar__link span[data-v-0887eb8b],.app-sidebar--collapsed .app-sidebar__badge[data-v-0887eb8b]{display:none}.app-sidebar--collapsed .app-sidebar__user[data-v-0887eb8b]{justify-content:center;padding:0}.app-sidebar--collapsed .app-sidebar__footer[data-v-0887eb8b]{padding:.5rem 0 0}}.app-sidebar__brand[data-v-0887eb8b]{display:flex;align-items:center;gap:.5rem;padding-bottom:2rem;border-bottom:1px solid var(--color-border-light);margin-bottom:1.5rem}.app-sidebar__brand-icon[data-v-0887eb8b]{font-size:1.5rem;flex-shrink:0}.app-sidebar__brand-text[data-v-0887eb8b]{font-size:1.125rem;font-weight:700;color:var(--color-text);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;white-space:nowrap;overflow:hidden;transition:opacity .15s ease}.app-sidebar__nav[data-v-0887eb8b]{display:flex;flex-direction:column;gap:.25rem;flex:1}.app-sidebar__link[data-v-0887eb8b]{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.5rem;text-decoration:none;color:var(--color-text-secondary);font-size:1rem;font-weight:500;transition:background .15s ease,color .15s ease,padding .2s ease,justify-content .2s ease;white-space:nowrap}.app-sidebar__link[data-v-0887eb8b]:hover{background:var(--color-surface-hover);color:var(--color-text)}.app-sidebar__link--active[data-v-0887eb8b]{background:var(--color-primary-glow);color:var(--color-primary-light)}.app-sidebar__badge[data-v-0887eb8b]{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--color-primary);color:#fff;font-size:11px;font-weight:700;margin-left:auto}.app-sidebar__collapse-btn[data-v-0887eb8b]{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.app-sidebar__collapse-btn[data-v-0887eb8b]:focus{outline:none}.app-sidebar__collapse-btn[data-v-0887eb8b]:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.app-sidebar__collapse-btn[data-v-0887eb8b]{display:flex;align-items:center;justify-content:center;margin-left:auto;flex-shrink:0;width:28px;height:28px;border-radius:.375rem;color:var(--color-text-muted);cursor:pointer;transition:background .15s ease,color .15s ease}.app-sidebar__collapse-btn[data-v-0887eb8b]:hover{background:var(--color-surface-hover);color:var(--color-text)}.app-sidebar__footer[data-v-0887eb8b]{border-top:1px solid var(--color-border-light);padding-top:1rem;flex-shrink:0}.app-sidebar__user[data-v-0887eb8b]{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;overflow:hidden;text-decoration:none;border-radius:.5rem;padding:.25rem;margin-left:-.25rem;margin-right:-.25rem}.app-sidebar__user--clickable[data-v-0887eb8b]{cursor:pointer;transition:background .15s ease}.app-sidebar__user--clickable[data-v-0887eb8b]:hover{background:var(--color-surface-hover)}.app-sidebar__user-avatar[data-v-0887eb8b]{width:36px;height:36px;border-radius:9999px;background:var(--color-primary-glow);display:flex;align-items:center;justify-content:center;font-size:.875rem;font-weight:700;color:var(--color-primary-light);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;flex-shrink:0;overflow:hidden}.app-sidebar__user-avatar-img[data-v-0887eb8b]{width:100%;height:100%;object-fit:cover}.app-sidebar__user-info[data-v-0887eb8b]{display:flex;flex-direction:column;overflow:hidden}.app-sidebar__user-name[data-v-0887eb8b]{font-size:.875rem;font-weight:600;color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-sidebar__user-role[data-v-0887eb8b]{font-size:.75rem;color:var(--color-text-secondary);text-transform:capitalize}.app-sidebar__logout[data-v-0887eb8b]{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.app-sidebar__logout[data-v-0887eb8b]:focus{outline:none}.app-sidebar__logout[data-v-0887eb8b]:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.app-sidebar__logout[data-v-0887eb8b]{width:100%;padding:.25rem 1rem;border-radius:.375rem;border:1px solid var(--color-border);background:transparent;color:var(--color-text-secondary);font-size:.875rem;cursor:pointer;transition:all .2s ease}.app-sidebar__logout[data-v-0887eb8b]:hover{background:var(--color-surface-hover);color:var(--color-text)}.app-topbar[data-v-0887eb8b]{display:flex;justify-content:space-between;align-items:center;padding:.5rem 1.5rem;background:var(--color-surface);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:50}@media (min-width: 768px){.app-topbar[data-v-0887eb8b]{display:none}}.app-topbar__brand[data-v-0887eb8b]{display:flex;align-items:center;gap:.25rem}.app-topbar__brand-text[data-v-0887eb8b]{font-size:1rem;font-weight:700;color:var(--color-text);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app-topbar__right[data-v-0887eb8b]{display:flex;align-items:center;gap:.5rem}.app-topbar__user[data-v-0887eb8b]{font-size:.875rem;color:var(--color-text-secondary);font-weight:500}.app-topbar__logout[data-v-0887eb8b]{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.app-topbar__logout[data-v-0887eb8b]:focus{outline:none}.app-topbar__logout[data-v-0887eb8b]:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.app-topbar__logout[data-v-0887eb8b]{padding:4px .5rem;border-radius:.375rem;border:1px solid var(--color-border);background:transparent;color:var(--color-text-secondary);font-size:.75rem;cursor:pointer}.app-content[data-v-0887eb8b]{min-height:100vh;overflow-x:hidden;padding-top:1.5rem;padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}@media (min-width: 768px){.app-content[data-v-0887eb8b]{margin-left:260px;padding-top:3rem;padding-bottom:0;transition:margin-left .2s ease}}@media (min-width: 768px){.app-content--sidebar-collapsed[data-v-0887eb8b]{margin-left:52px}}.app-content--fullscreen[data-v-0887eb8b]{margin-left:0!important;padding-bottom:0!important}.app-content--lesson[data-v-0887eb8b]{margin-left:0;padding-top:0;padding-bottom:0;min-height:100vh}.app-mobile-nav[data-v-0887eb8b]{position:fixed;bottom:0;left:0;right:0;z-index:100;background:var(--color-surface);border-top:1px solid var(--color-border);padding-bottom:env(safe-area-inset-bottom,0px);height:auto}@media (min-width: 768px){.app-mobile-nav[data-v-0887eb8b]{display:none}}.app-topbar__inner[data-v-0887eb8b]{max-width:1200px;margin:0 auto;width:100%;display:flex;justify-content:space-between;align-items:center}:root{--color-bg: #0D1117;--color-bg-card: #161B22;--color-bg-elevated: #1C2129;--color-bg-hover: #21262D;--color-bg-input: #0D1117;--color-border: #30363D;--color-border-light: #21262D;--color-text: #E6EDF3;--color-text-secondary: #8B949E;--color-text-muted: #7D8590;--color-primary: #7A2530;--color-primary-rgb: 122, 37, 48;--color-primary-dark: #5C1B24;--color-primary-light: #C26B7A;--color-primary-hover: #965666;--color-primary-glow: rgba(122, 37, 48, .15);--color-success: #3FB950;--color-success-glow: rgba(63, 185, 80, .15);--color-warning: #D29922;--color-warning-glow: rgba(210, 153, 34, .15);--color-error: #FF5C54;--color-error-glow: rgba(255, 92, 84, .15);--color-feedback-soft: #f0a060;--color-feedback-soft-glow: rgba(240, 160, 96, .12);--color-info: #C26B7A;--color-purple: #BC8CFF;--color-purple-glow: rgba(188, 140, 255, .15);--color-surface: var(--color-bg-card);--color-surface-hover: var(--color-bg-hover);--color-warning-rgb: 210, 153, 34;--color-accent: var(--color-primary-light);--color-bg-secondary: var(--color-bg-elevated);--color-bg-muted: var(--color-bg-hover);--color-text-primary: var(--color-text);--color-fretboard-wood: #6b4423;--color-fretboard-string: #4a5568;--color-fretboard-fret: #cbd5e0;--color-fretboard-dot: #a0aec0;--color-note-active: #C26B7A;--color-note-playing: #3FB950;--color-note-hover: #C26B7A;--color-note-1: #58A6FF;--color-note-2: #D29922;--color-note-3: #3FB950;--color-note-4: #F85149;--color-piano-white: #F5F1E8;--color-piano-black: #1A1A1A;--color-piano-active: #C26B7A;--color-piano-played: #3FB950;--color-piano-frame: #0A0A0A;--color-piano-ivory-hover: #E8E4D8}*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{min-height:100vh;min-height:100dvh;line-height:1.5;overscroll-behavior-y:none}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}button{cursor:pointer}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}a{color:inherit;text-decoration:inherit}ul,ol{list-style:none}body{font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:1rem;font-weight:400;line-height:1.5;color:var(--color-text);background-color:var(--color-bg);overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.25;color:var(--color-text)}h1{font-size:2.25rem;margin-bottom:1.5rem}h2{font-size:1.75rem;margin-bottom:1rem}h3{font-size:1.375rem;margin-bottom:1rem}h4{font-size:1.25rem;margin-bottom:.5rem}h5{font-size:1.125rem;margin-bottom:.5rem}h6{font-size:1rem;margin-bottom:.5rem}p{margin-bottom:1rem;color:var(--color-text-secondary)}a{color:var(--color-primary-light);transition:all .15s ease}a:hover{color:var(--color-primary-hover)}a:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}code{font-family:JetBrains Mono,SF Mono,Monaco,Cascadia Code,Consolas,monospace;font-size:.875rem;padding:.125rem .25rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:.25rem}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::selection{background-color:var(--color-primary-light);color:#fff}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 .5rem}@media (min-width: 640px){.container{padding:0 1rem}}@media (min-width: 1024px){.container{padding:0 2rem}}.container--narrow{max-width:800px}.container--wide{max-width:95vw}@media (max-width: 640px){.container--wide{max-width:100%;padding:0 .25rem;overflow-x:hidden}}.grid{display:grid;gap:1rem}.grid--2{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.grid--3{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.grid--4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.flex{display:flex}.flex--center{align-items:center;justify-content:center}.flex--between{justify-content:space-between}.flex--column{flex-direction:column}.flex--gap-sm{gap:.5rem}.flex--gap-md{gap:1rem}.flex--gap-lg{gap:1.5rem}.mt-sm{margin-top:.5rem}.mt-md{margin-top:1rem}.mt-lg{margin-top:1.5rem}.mt-xl{margin-top:2rem}.mb-sm{margin-bottom:.5rem}.mb-md{margin-bottom:1rem}.mb-lg{margin-bottom:1.5rem}.mb-xl{margin-bottom:2rem}.p-sm{padding:.5rem}.p-md{padding:1rem}.p-lg{padding:1.5rem}.p-xl{padding:2rem}.btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.btn:focus{outline:none}.btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;font-size:1rem;font-weight:500;line-height:1.25;border-radius:.375rem;transition:all .2s ease;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;min-height:44px;-webkit-tap-highlight-color:transparent}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background-color:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background-color:var(--color-primary-dark)}.btn--primary:active:not(:disabled){transform:translateY(1px)}.btn--secondary{background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn--secondary:hover:not(:disabled){background-color:var(--color-surface-hover)}.btn--ghost{background-color:transparent;color:var(--color-text-secondary)}.btn--ghost:hover:not(:disabled){background-color:var(--color-surface-hover);color:var(--color-text)}.btn--danger{background-color:var(--color-error);color:#fff}.btn--danger:hover:not(:disabled){background-color:#dc2626}.btn--success{background-color:var(--color-success);color:#fff}.btn--success:hover:not(:disabled){background-color:#059669}.btn--sm{padding:.25rem .5rem;font-size:.875rem;min-height:36px}.btn--lg{padding:1rem 1.5rem;font-size:1.125rem}.btn--icon{padding:.5rem;aspect-ratio:1}.btn--block{width:100%}.input,.select,.textarea{display:block;width:100%;padding:.5rem 1rem;font-size:1rem;line-height:1.5;color:var(--color-text);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:.375rem;transition:all .15s ease;min-height:44px}.input::placeholder,.select::placeholder,.textarea::placeholder{color:var(--color-text-muted)}.input:hover:not(:disabled),.select:hover:not(:disabled),.textarea:hover:not(:disabled){border-color:var(--color-text-muted)}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.input:disabled,.select:disabled,.textarea:disabled{opacity:.5;cursor:not-allowed;background-color:var(--color-surface)}.input--error{border-color:var(--color-error)}.input--error:focus{box-shadow:0 0 0 3px #ef44441a}.textarea{min-height:100px;resize:vertical}.select{cursor:pointer;padding-right:2rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:1.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none}.label{display:block;font-size:.875rem;font-weight:500;color:var(--color-text);margin-bottom:.25rem}.form-group{margin-bottom:1rem}.form-group__error{display:block;margin-top:.25rem;font-size:.875rem;color:var(--color-error)}.form-group__hint{display:block;margin-top:.25rem;font-size:.875rem;color:var(--color-text-secondary)}.range{width:100%;height:6px;background:var(--color-surface);border-radius:9999px;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;background:var(--color-primary);border-radius:9999px;cursor:pointer;transition:all .15s ease}.range::-webkit-slider-thumb:hover{transform:scale(1.1)}.range::-moz-range-thumb{width:18px;height:18px;background:var(--color-primary);border:none;border-radius:9999px;cursor:pointer;transition:all .15s ease}.range::-moz-range-thumb:hover{transform:scale(1.1)}.range:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:.5rem;box-shadow:0 1px 2px #0003;padding:1rem}@media (min-width: 768px){.card{padding:1.5rem}}.card__header{margin-bottom:.5rem;padding-bottom:.5rem;border-bottom:1px solid var(--color-border);display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}@media (min-width: 768px){.card__header{margin-bottom:1rem;padding-bottom:1rem;gap:1rem}}.card__header-right{display:flex;align-items:center;gap:.25rem;flex-shrink:0}.card__title{font-size:1.125rem;font-weight:700;color:var(--color-text);margin:0}@media (min-width: 768px){.card__title{font-size:1.25rem}}.card__subtitle{font-size:.75rem;color:var(--color-text-secondary);margin-top:.25rem}@media (min-width: 768px){.card__subtitle{font-size:.875rem}}.card__body{margin-bottom:.5rem}@media (min-width: 768px){.card__body{margin-bottom:1rem}}.card__footer{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-border);display:flex;gap:.5rem;justify-content:flex-end;flex-wrap:wrap}@media (min-width: 768px){.card__footer{margin-top:1rem;padding-top:1rem}}.card--hoverable{cursor:pointer;transition:all .2s ease;-webkit-tap-highlight-color:transparent}.card--hoverable:hover{box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003;transform:translateY(-2px)}.card--hoverable:active{transform:translateY(0)}.card--compact{padding:.5rem}@media (min-width: 768px){.card--compact{padding:1rem}}@media (max-width: 767px){.card--instrument{padding:0;border-radius:0;border-left:none;border-right:none;width:100vw;margin-left:calc(-50vw + 50%)}.card--instrument .card__header,.card--instrument .card__header-actions,.card--instrument .editor__toolbar{padding-left:.5rem;padding-right:.5rem}.card--instrument .card__body{padding-left:0!important;padding-right:0!important}}.modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1050;display:flex;align-items:flex-end;justify-content:center;padding:0}@media (min-width: 768px){.modal{align-items:center;padding:1rem}}.modal__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1040;animation:fadeIn .2s ease}.modal__content{position:relative;z-index:1050;background:var(--color-bg);border-radius:.75rem .75rem 0 0;box-shadow:0 16px 48px #0006;width:100%;max-height:90vh;max-height:90dvh;overflow-y:auto;animation:slideUp .3s ease}.modal__content::-webkit-scrollbar{width:8px;height:8px}.modal__content::-webkit-scrollbar-track{background:var(--color-surface);border-radius:.375rem}.modal__content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:.375rem}.modal__content::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}@media (min-width: 768px){.modal__content{max-width:600px;border-radius:.5rem}}.modal__header{padding:1rem 1rem .5rem;border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--color-bg);z-index:1}@media (min-width: 768px){.modal__header{padding:1.5rem}}.modal__title{font-size:1.25rem;font-weight:700;color:var(--color-text);margin:0}@media (min-width: 768px){.modal__title{font-size:1.375rem}}.modal__close{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.modal__close:focus{outline:none}.modal__close:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.modal__close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:.375rem;color:var(--color-text-secondary);transition:all .15s ease;flex-shrink:0}.modal__close:hover{background-color:var(--color-surface-hover);color:var(--color-text)}.modal__body{padding:1rem}@media (min-width: 768px){.modal__body{padding:1.5rem}}.modal__footer{padding:1rem;border-top:1px solid var(--color-border);display:flex;gap:.5rem;justify-content:flex-end;flex-wrap:wrap;position:sticky;bottom:0;background:var(--color-bg)}@media (min-width: 768px){.modal__footer{padding:1.5rem}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fretboard{width:100%;max-width:100%;margin:0 auto;-webkit-user-select:none;user-select:none;touch-action:manipulation}.fretboard__svg{display:block;margin:0 auto;width:100%;height:auto;touch-action:manipulation}.fretboard--small .fretboard__svg{max-width:800px}.fretboard--normal .fretboard__svg{max-width:1200px}.fretboard--large .fretboard__svg{max-width:100%;width:100%;height:auto}@media (max-width: 767px){.fretboard--large .fretboard__svg{min-width:600px}}.fretboard--fullscreen .fretboard__svg{max-width:95vw;max-height:90vh;width:auto;height:auto}.fretboard--vertical .fretboard__svg{width:100%!important;max-width:100%!important;height:auto!important;min-width:unset!important}.fretboard__string{stroke-linecap:round;fill:none;opacity:.95;stroke:#b0b0b0}.fretboard__nut{opacity:.95;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}.fretboard__fret{stroke-width:2.5;fill:none;opacity:.9}.fretboard__fret-marker{opacity:.9;stroke:#b4afa566;stroke-width:.5;filter:drop-shadow(0 .5px 1px rgba(255,255,255,.15))}.fretboard__fret-number{fill:var(--color-fretboard-dot);opacity:.6;font-size:10px;font-weight:700;pointer-events:none;-webkit-user-select:none;user-select:none;text-shadow:0 1px 2px rgba(0,0,0,.5)}.fretboard__note-spot{fill:transparent;cursor:pointer;pointer-events:all;transition:all .15s ease;touch-action:manipulation}.fretboard__note-spot:hover{fill:var(--color-note-hover);opacity:.3}.fretboard__note{cursor:pointer;transition:all .2s ease}.fretboard__note circle,.fretboard__note .fretboard__note-bg{fill:var(--color-note-active);stroke:#ffffffe6;stroke-width:2.5;transition:all .2s ease;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45)) drop-shadow(0 1px 2px rgba(0,0,0,.3))}.fretboard__note text{fill:#fff;font-size:14px;font-weight:700;text-anchor:middle;dominant-baseline:central;pointer-events:none;transition:all .2s ease;text-shadow:0 1px 2px rgba(0,0,0,.8)}.fretboard__note:hover circle,.fretboard__note:hover .fretboard__note-bg{fill:var(--color-note-hover);stroke-width:3.5;filter:drop-shadow(0 3px 8px rgba(0,0,0,.5)) drop-shadow(0 1px 3px rgba(0,0,0,.35))}.fretboard__note--playing circle,.fretboard__note--playing .fretboard__note-bg{fill:#fbbf24!important;stroke:#fff;stroke-width:5;filter:drop-shadow(0 0 14px rgba(251,191,36,.9)) drop-shadow(0 0 6px rgba(245,158,11,.7)) drop-shadow(0 0 3px rgba(255,255,255,.8));transition:all .2s ease-out}.fretboard__note--playing text{fill:#000;font-weight:900;font-size:19px}.fretboard__note--sustained circle,.fretboard__note--sustained .fretboard__note-bg{fill:#2ea043!important;stroke:#86efac;stroke-width:3.5;filter:drop-shadow(0 0 10px rgba(46,160,67,.7)) drop-shadow(0 0 4px rgba(134,239,172,.5));transition:all .2s ease-out;animation:fretboard-sustain-pulse 1.8s ease-in-out infinite}.fretboard__note--sustained text{fill:#fff;font-weight:700}.fretboard__note--previous circle,.fretboard__note--previous .fretboard__note-bg{opacity:.2;filter:saturate(.3) brightness(.8)}.fretboard__note--previous text{opacity:.25}.fretboard__note--next circle,.fretboard__note--next .fretboard__note-bg{stroke:#10b981;stroke-width:3.5;stroke-dasharray:6 4;opacity:.9;filter:drop-shadow(0 0 6px rgba(16,185,129,.4))}.fretboard__note--next text{font-weight:700;filter:drop-shadow(0 0 2px rgba(16,185,129,.3))}.fretboard__note--upcoming circle,.fretboard__note--upcoming .fretboard__note-bg{opacity:.65;filter:saturate(.7)}.fretboard__note--upcoming text{opacity:.7}.fretboard__note--finger-0 circle,.fretboard__note--finger-0 .fretboard__note-bg{fill:#6b7280}.fretboard__note--finger-1 circle,.fretboard__note--finger-1 .fretboard__note-bg{fill:var(--color-note-1);stroke:#ffffffe6;stroke-width:2.5}.fretboard__note--finger-2 circle,.fretboard__note--finger-2 .fretboard__note-bg{fill:var(--color-note-2);stroke:#ffffffe6;stroke-width:2.5}.fretboard__note--finger-3 circle,.fretboard__note--finger-3 .fretboard__note-bg{fill:var(--color-note-3);stroke:#ffffffe6;stroke-width:2.5}.fretboard__note--finger-4 circle,.fretboard__note--finger-4 .fretboard__note-bg{fill:var(--color-note-4);stroke:#ffffffe6;stroke-width:2.5}.fretboard__note--technique-slap circle,.fretboard__note--technique-slap .fretboard__note-bg{stroke:#ef4444;stroke-width:4}.fretboard__note--technique-pop circle,.fretboard__note--technique-pop .fretboard__note-bg{stroke:#3b82f6;stroke-width:4}.fretboard__note--technique-hammer circle,.fretboard__note--technique-hammer .fretboard__note-bg,.fretboard__note--technique-pull circle,.fretboard__note--technique-pull .fretboard__note-bg{stroke:#8b5cf6;stroke-width:4;stroke-dasharray:5,5}.fretboard__note--technique-slide circle,.fretboard__note--technique-slide .fretboard__note-bg{stroke:#f59e0b;stroke-width:4;stroke-dasharray:10,5}.fretboard__note--technique-ghost circle,.fretboard__note--technique-ghost .fretboard__note-bg{opacity:.5;stroke-dasharray:3,3}.fretboard__note--technique-mute circle,.fretboard__note--technique-mute .fretboard__note-bg{fill:#6b7280}.fretboard__note--technique-ring circle,.fretboard__note--technique-ring .fretboard__note-bg{stroke:#10b981;stroke-width:4;animation:ring-pulse 1.5s ease-in-out infinite}.fretboard__note--technique-root circle,.fretboard__note--technique-root .fretboard__note-bg{fill:var(--color-primary, #6366f1)!important;stroke:#fff;stroke-width:4;filter:drop-shadow(0 0 10px rgba(99,102,241,.7)) drop-shadow(0 0 4px rgba(255,255,255,.5))}.fretboard__note--technique-root text{fill:#fff!important;font-weight:900}.fretboard__note--technique-scale-tone circle,.fretboard__note--technique-scale-tone .fretboard__note-bg{fill:#94a3b88c;stroke:#fff9;stroke-width:2;filter:none}.fretboard__note--technique-scale-tone text{fill:#fff;font-weight:600;opacity:.9}.fretboard__note--hovered circle,.fretboard__note--hovered .fretboard__note-bg{fill:#ef4444!important;stroke:#fff!important;stroke-width:4;filter:drop-shadow(0 0 12px rgba(239,68,68,.8));opacity:.85}.fretboard__note--hovered text{fill:#fff!important}.fretboard__note--selected circle,.fretboard__note--selected .fretboard__note-bg{stroke:#38bdf8!important;stroke-width:5;filter:drop-shadow(0 0 10px rgba(56,189,248,.7)) drop-shadow(0 0 4px rgba(56,189,248,.4));animation:selected-pulse 1.2s ease-in-out infinite}.fretboard__note--selected text{fill:#fff!important}.fretboard__note--midi-correct circle,.fretboard__note--midi-correct .fretboard__note-bg{fill:var(--color-success)!important;stroke:#fff!important;stroke-width:7!important;filter:drop-shadow(0 0 14px rgba(63,185,80,.9))!important;animation:midi-correct-pulse .4s ease-out}.fretboard__note--midi-correct text{fill:#000!important;font-weight:900!important;filter:drop-shadow(0 1px 2px rgba(255,255,255,.5))}.fretboard__note--midi-correct .fretboard__note-glyph{opacity:1}.fretboard__note--midi-incorrect circle,.fretboard__note--midi-incorrect .fretboard__note-bg{fill:var(--color-error)!important;stroke:#fff!important;stroke-width:6!important;filter:drop-shadow(0 0 12px rgba(248,81,73,.85))!important;animation:midi-incorrect-shake .4s ease-out}.fretboard__note--midi-incorrect text{fill:#fff!important;font-weight:900!important;filter:drop-shadow(0 1px 3px rgba(0,0,0,.6))}.fretboard__note--midi-incorrect .fretboard__note-glyph{opacity:1}.fretboard__note-glyph{opacity:0;pointer-events:none;font-weight:700;fill:#fff;stroke:#0006;stroke-width:.5px;paint-order:stroke fill}.fretboard__note-text{fill:#fff;font-size:14px;font-weight:700;text-anchor:middle;dominant-baseline:central;pointer-events:none}.fretboard__note-order{fill:var(--color-text-secondary);font-size:11px;font-weight:500;text-anchor:middle;pointer-events:none}.fretboard__note-order-small{fill:#fff;font-weight:700;text-anchor:middle;pointer-events:none;opacity:.9}.fretboard__legend{display:flex;flex-wrap:wrap;gap:8px 16px;padding:8px 12px;margin-top:8px;background:#ffffff0d;border-radius:8px;border:1px solid rgba(255,255,255,.08);font-size:11px;color:var(--color-text-secondary);justify-content:center}@media (min-width: 768px){.fretboard__legend{gap:12px 24px;padding:8px 16px;font-size:12px}}.fretboard__legend-group{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}.fretboard__legend-title{font-weight:700;color:var(--color-text);font-size:11px;text-transform:uppercase;letter-spacing:.5px;margin-right:4px}.fretboard__legend-item{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--color-text-secondary);white-space:nowrap}.fretboard__legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;border:1px solid rgba(255,255,255,.3)}.fretboard__legend-dot--f0{background:#6b7280}.fretboard__legend-dot--f1{background:var(--color-note-1)}.fretboard__legend-dot--f2{background:var(--color-note-2)}.fretboard__legend-dot--f3{background:var(--color-note-3)}.fretboard__legend-dot--f4{background:var(--color-note-4)}.fretboard__legend-tech{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;font-size:10px;color:#fff;font-weight:700;line-height:1}.fretboard__legend-tech--slap{background:#ef4444}.fretboard__legend-tech--pop{background:#3b82f6}.fretboard__legend-tech--hammer,.fretboard__legend-tech--pull{background:#8b5cf6}.fretboard__legend-tech--slide{background:#f59e0b}.fretboard__legend-tech--ghost{background:#6b7280b3}.fretboard__legend-tech--ring{background:#10b981}.fretboard__legend-tech--mute{background:#6b7280}.fretboard__note-name-label{fill:#fff!important;font-weight:900!important;text-anchor:middle;dominant-baseline:middle;pointer-events:none;text-transform:uppercase;letter-spacing:.06em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Arial Black,Arial,sans-serif;paint-order:stroke fill;stroke:#000000f2;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round}.fretboard__note-circle{stroke:#00000040;stroke-width:1;transition:all .2s ease;pointer-events:none;filter:drop-shadow(0 1.5px 3px rgba(0,0,0,.25))}.fretboard__string-label{fill:var(--color-text);font-size:16px;font-weight:700;text-anchor:middle;dominant-baseline:middle}.fretboard__fret-label{fill:var(--color-text);font-size:16px;font-weight:700;text-anchor:middle;dominant-baseline:middle;opacity:.9}.fretboard__fret-label:nth-child(3n){opacity:1;font-size:18px;fill:var(--color-primary)}.fretboard--large .fretboard__fret-label,.fretboard--fullscreen .fretboard__fret-label{font-size:20px;opacity:.95}.fretboard--large .fretboard__fret-label:nth-child(3n),.fretboard--fullscreen .fretboard__fret-label:nth-child(3n){font-size:24px;opacity:1;fill:var(--color-primary)}.fretboard--large .fretboard__string-label,.fretboard--fullscreen .fretboard__string-label{font-size:20px}.fretboard--fullscreen .fretboard__fret-label{font-size:24px}.fretboard--fullscreen .fretboard__fret-label:nth-child(3n){font-size:28px}.fretboard--fullscreen .fretboard__string-label{font-size:24px}.fretboard--fullscreen .fretboard__note-name-label{font-weight:900!important;stroke-width:5px!important;stroke:#000000f2!important;letter-spacing:-1px}.fretboard--fullscreen .fretboard__note-circle{stroke-width:2;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.fretboard--fullscreen .fretboard__note circle,.fretboard--fullscreen .fretboard__note .fretboard__note-bg{stroke-width:3;filter:drop-shadow(0 3px 8px rgba(0,0,0,.45))}.fretboard--vertical .fretboard__svg{max-height:none}.fretboard--horizontal .fretboard__svg{max-width:100%}.player-controls{display:flex;flex-direction:column;gap:1.5rem;padding:1.5rem;background:var(--color-surface);border-radius:.5rem;margin-top:1.5rem}@media (max-width: 767px){.player-controls{padding:1rem;gap:1rem}}.player-controls__main{display:flex;align-items:center;justify-content:center;gap:1rem}@media (max-width: 767px){.player-controls__main{gap:.5rem}}.player-controls__tempo{display:flex;align-items:center;gap:1rem}.player-controls__tempo label{font-size:.875rem;font-weight:500;color:var(--color-text);min-width:100px}.player-controls__tempo input{flex:1}.player-controls__tempo span{min-width:60px;font-size:.875rem;font-weight:700;color:var(--color-primary-light)}@media (max-width: 767px){.player-controls__tempo{flex-wrap:wrap;gap:.5rem}.player-controls__tempo label{min-width:0;flex:0 0 auto}.player-controls__tempo input{order:3;flex:1 0 100%}.player-controls__tempo span{min-width:0}.player-controls__tempo select{flex:1}}.player-controls__audio{display:flex;align-items:center;gap:1rem}.player-controls__audio label{font-size:.875rem;font-weight:500;color:var(--color-text);min-width:100px}.player-controls__audio input{flex:1}.player-controls__audio span{min-width:60px;font-size:.875rem;font-weight:500;color:var(--color-text-secondary)}@media (max-width: 767px){.player-controls__audio{flex-wrap:wrap;gap:.5rem}.player-controls__audio label{min-width:0;flex:0 0 auto}.player-controls__audio input{flex:1;min-width:80px}.player-controls__audio span{min-width:0}}.player-controls__progress{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--color-text-secondary)}.player-controls__progress-bar{flex:1;height:6px;background:var(--color-border);border-radius:9999px;overflow:hidden}.player-controls__progress-bar-fill{height:100%;background:var(--color-primary);transition:width .15s linear}@keyframes ring-pulse{0%,to{stroke-opacity:1}50%{stroke-opacity:.5}}@keyframes midi-correct-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.9}to{transform:scale(1);opacity:1}}@keyframes midi-incorrect-shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}@keyframes selected-pulse{0%,to{stroke-opacity:1;filter:drop-shadow(0 0 10px rgba(56,189,248,.7)) drop-shadow(0 0 4px rgba(56,189,248,.4))}50%{stroke-opacity:.6;filter:drop-shadow(0 0 16px rgba(56,189,248,.9)) drop-shadow(0 0 6px rgba(56,189,248,.6))}}@keyframes fretboard-sustain-pulse{0%,to{filter:drop-shadow(0 0 8px rgba(46,160,67,.6)) drop-shadow(0 0 3px rgba(134,239,172,.4))}50%{filter:drop-shadow(0 0 14px rgba(46,160,67,.85)) drop-shadow(0 0 6px rgba(134,239,172,.6))}}.progress-ring{display:inline-flex;align-items:center;justify-content:center;transform:rotate(-90deg)}.progress-ring__track{fill:none;stroke:var(--color-border)}.progress-ring__fill{fill:none;stroke-linecap:round;transition:stroke-dashoffset .6s ease}.progress-ring__label{transform-box:fill-box;transform-origin:center;transform:rotate(90deg);font-family:JetBrains Mono,SF Mono,Monaco,Cascadia Code,Consolas,monospace;font-size:.75rem;font-weight:700;fill:var(--color-text-secondary);text-anchor:middle;dominant-baseline:central}.mastery-badge{display:inline-flex;align-items:center;gap:6px;padding:.25rem 10px;border-radius:9999px;font-size:.75rem;font-weight:600;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;border:1px solid;white-space:nowrap}.mastery-badge--mastered{color:var(--color-success);border-color:var(--color-success);background:var(--color-success-glow)}.mastery-badge--progress{color:var(--color-primary-light);border-color:var(--color-primary);background:var(--color-primary-glow)}.mastery-badge--locked{color:var(--color-text-muted);border-color:var(--color-text-muted);background:transparent}.nav-bar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:420px;display:flex;justify-content:space-around;padding:.5rem 1rem 1rem;background:linear-gradient(transparent,var(--color-bg) 20%);z-index:1035}.nav-item{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.nav-item:focus{outline:none}.nav-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.nav-item{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:10px 1rem;border-radius:.75rem;transition:all .2s ease}.nav-item__icon{display:flex;color:var(--color-text-muted);transition:color .2s ease}.nav-item__label{font-size:.6875rem;font-weight:500;color:var(--color-text-muted);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:color .2s ease}.nav-item--active{background:var(--color-primary-glow)}.nav-item--active .nav-item__icon,.nav-item--active .nav-item__label{color:var(--color-text)}.stat-card{padding:1rem;border-radius:.75rem;background:var(--color-bg-card);border:1px solid var(--color-border-light);text-align:center}.stat-card__icon{display:flex;justify-content:center;margin-bottom:.5rem}.stat-card__value{font-size:1.25rem;font-weight:700;color:var(--color-text);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:.5rem 0 .125rem}.stat-card__label{font-size:.75rem;color:var(--color-text-secondary);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.stat-card--lg .stat-card__value{font-size:1.375rem;margin:10px 0 .125rem}.lesson-item{display:flex;align-items:center;gap:14px;padding:14px 0;cursor:pointer;transition:opacity .2s ease}.lesson-item:not(:first-child){border-top:1px solid var(--color-border-light)}.lesson-item--locked{cursor:default;opacity:.45}.lesson-item__icon-box{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.lesson-item__icon-box--mastered{background:var(--color-success-glow)}.lesson-item__icon-box--progress{background:var(--color-primary-glow)}.lesson-item__icon-box--locked{background:var(--color-bg-elevated)}.lesson-item__content{flex:1;min-width:0}.lesson-item__title{font-size:15px;font-weight:500;color:var(--color-text);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.lesson-item__meta{font-size:.75rem;color:var(--color-text-secondary);margin-top:2px;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.exercise-card{display:flex;align-items:center;gap:14px;padding:1rem;margin-bottom:.5rem;border-radius:.75rem;background:var(--color-bg-card);border:1px solid var(--color-border-light);cursor:pointer;transition:border-color .2s ease}.exercise-card:hover:not(.exercise-card--locked){border-color:var(--color-border)}.exercise-card--locked{cursor:default;opacity:.45}.exercise-card__icon-box{width:44px;height:44px;border-radius:.75rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.exercise-card__icon-box--mastered{background:var(--color-success-glow)}.exercise-card__icon-box--progress{background:var(--color-primary-glow)}.exercise-card__icon-box--locked{background:var(--color-bg-elevated)}.exercise-card__content{flex:1;min-width:0}.exercise-card__title{font-size:15px;font-weight:500;color:var(--color-text);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.exercise-card__meta{font-size:.75rem;color:var(--color-text-secondary);margin-top:3px;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.exercise-card__action{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.exercise-card__action:focus{outline:none}.exercise-card__action:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.exercise-card__action{padding:.5rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:600;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:all .2s ease}.exercise-card__action--primary{background:var(--color-primary);color:#fff}.exercise-card__action--secondary{background:var(--color-bg-elevated);color:var(--color-text-secondary)}.session-summary{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0d1117f0;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:1050}.session-summary__card{width:360px;max-width:calc(100vw - 2rem);padding:2rem;border-radius:1.25rem;background:var(--color-bg-card);border:1px solid var(--color-border);text-align:center;box-shadow:0 16px 48px #0006}.session-summary__icon{margin-bottom:.5rem}.session-summary__title{font-size:1.375rem;font-weight:700;color:var(--color-text);margin:.5rem 0 .25rem;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__subtitle{font-size:.875rem;color:var(--color-text-secondary);margin:0 0 .5rem;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__encouragement{font-size:.875rem;color:var(--color-text-secondary);margin:0 0 1.5rem;padding:.5rem 1rem;background:var(--color-primary-glow);border-radius:.5rem;line-height:1.6;font-style:italic;animation:encouragement-slide-in .5s ease .3s both}.session-summary__badge{display:inline-block;padding:.25rem .5rem;margin-bottom:1rem;border-radius:.5rem;background:#38bd7e1f;color:var(--color-success);font-size:.75rem;font-weight:600;letter-spacing:.02em}.session-summary__stats{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:1.5rem}.session-summary__stat{padding:14px;border-radius:.75rem;background:var(--color-bg-elevated)}.session-summary__stat-value{font-size:1.375rem;font-weight:700;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__stat-label{font-size:.75rem;color:var(--color-text-secondary);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__stat-sub{font-size:.6875rem;margin-top:2px;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__mastery{padding:14px;border-radius:.75rem;background:var(--color-primary-glow);border:1px solid rgba(122,37,48,.2);margin-bottom:1.5rem}.session-summary__mastery-title{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:6px;font-size:.875rem;font-weight:600;color:var(--color-primary-light);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__mastery-hint{font-size:.875rem;color:var(--color-text-secondary);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__pass-dots{display:flex;gap:6px;justify-content:center;margin-top:10px}.session-summary__pass-dot{width:28px;height:6px;border-radius:3px;background:var(--color-border)}.session-summary__pass-dot--filled{background:var(--color-primary)}.session-summary__best{font-size:.875rem;color:var(--color-text-secondary);margin-bottom:2rem;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.session-summary__best strong{color:var(--color-success)}.session-summary__actions{display:flex;gap:10px}.session-summary__btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.session-summary__btn:focus{outline:none}.session-summary__btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.session-summary__btn{flex:1;padding:.5rem 0;border-radius:10px;font-size:.875rem;font-weight:600;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:all .2s ease}.session-summary__btn--secondary{background:var(--color-bg-elevated);border:1px solid var(--color-border);color:var(--color-text)}.session-summary__btn--primary{background:var(--color-primary);color:#fff}@keyframes encouragement-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-bg);padding:2rem;position:relative;overflow:hidden}.auth-page__glow{position:absolute;width:900px;height:900px;border-radius:50%;background:radial-gradient(circle,rgba(122,37,48,.22),transparent 60%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.auth-card{position:relative;z-index:1;width:100%;max-width:400px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:1.25rem;padding:2.5rem 2.25rem 2rem}.auth-card__header{text-align:center;margin-bottom:2rem}.auth-card__logo{display:inline-flex;align-items:center;gap:9px;margin-bottom:6px}.auth-card__brand{font-family:Manrope,DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:1.1875rem;font-weight:800;color:var(--color-text);letter-spacing:-.01em}.auth-card__title{font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:1.375rem;font-weight:700;color:var(--color-text);margin:0 0 .25rem}.auth-card__subtitle{font-size:.875rem;color:var(--color-text-secondary);margin:0}.auth-form{display:flex;flex-direction:column;gap:1rem}.auth-form__field{display:flex;flex-direction:column;gap:7px}.auth-form__label{font-size:.8125rem;font-weight:600;color:var(--color-text-secondary)}.auth-form__field-wrap{position:relative}.auth-form__input{width:100%;padding:.75rem .875rem;background:var(--color-bg-input);border:1px solid var(--color-border);border-radius:.625rem;color:var(--color-text);font-size:.9375rem;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:border-color .15s ease,box-shadow .15s ease}.auth-form__input::placeholder{color:var(--color-text-muted)}.auth-form__input:focus{outline:none;border-color:var(--color-primary-light);box-shadow:0 0 0 3px #c26b7a29}.auth-form__input--error{border-color:var(--color-error)}.auth-form__pw-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--color-text-muted);cursor:pointer;padding:4px;display:grid;place-items:center;transition:color .15s ease}.auth-form__pw-toggle:hover{color:var(--color-text-secondary)}.auth-form__field-error{font-size:.75rem;color:var(--color-error);margin:0}.auth-form__optional{font-weight:400;color:var(--color-text-muted)}.auth-form__role-select{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.auth-form__role-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1rem;background:var(--color-bg-input);border:2px solid var(--color-border);border-radius:.5rem;cursor:pointer;transition:all .2s ease;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.auth-form__role-btn:hover{border-color:var(--color-text-muted)}.auth-form__role-btn--active{border-color:var(--color-primary);background:var(--color-primary-glow)}.auth-form__role-icon{font-size:1.5rem}.auth-form__role-label{font-size:1rem;font-weight:600;color:var(--color-text)}.auth-form__role-desc{font-size:.75rem;color:var(--color-text-secondary);text-align:center}.auth-form__submit{width:100%;padding:.875rem 0;background:var(--color-primary);color:#fff;border:none;border-radius:.625rem;font-size:.9375rem;font-weight:700;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;letter-spacing:.02em;cursor:pointer;transition:background .15s ease;margin-top:6px;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px}.auth-form__submit:hover:not(:disabled){background:var(--color-primary-hover)}.auth-form__submit:disabled{cursor:default}.auth-form__submit--loading .auth-form__submit-label{display:none}.auth-form__submit--loading .auth-form__eq{display:flex}.auth-form__eq{display:none;align-items:center;gap:3px;height:16px}.auth-form__eq i{display:block;width:3px;height:4px;background:#fff;border-radius:1px;animation:auth-eqbar .9s ease-in-out infinite}.auth-form__eq i:nth-child(1){animation-delay:0s}.auth-form__eq i:nth-child(2){animation-delay:.12s}.auth-form__eq i:nth-child(3){animation-delay:.24s}.auth-form__eq i:nth-child(4){animation-delay:.36s}.auth-form__eq i:nth-child(5){animation-delay:.48s}.auth-form__footer{display:flex;justify-content:space-between;align-items:center;margin-top:1.25rem}.auth-form__link{font-size:.8125rem;color:var(--color-primary-light);background:none;border:none;padding:0;cursor:pointer;font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;text-decoration:none}.auth-form__link:hover{text-decoration:underline}.auth-form__text{font-size:.875rem;color:var(--color-text-secondary);margin:0;text-align:center}.auth-form__text strong{color:var(--color-text)}.auth-form__error{padding:.5rem 1rem;background:#f851491a;border:1px solid rgba(248,81,73,.3);border-radius:.375rem;color:var(--color-error);font-size:.875rem}.auth-form__success{padding:.5rem 1rem;background:#3fb9501a;border:1px solid rgba(63,185,80,.3);border-radius:.375rem;color:var(--color-success);font-size:.875rem;margin:0}.auth-form__invite-toggle{background:none;border:none;padding:0;font-size:.875rem;color:var(--color-text-secondary);cursor:pointer;text-align:left;line-height:1.5;transition:color .15s ease}.auth-form__invite-toggle:hover{color:var(--color-text)}.auth-form__invite-reveal{margin-top:.5rem}@keyframes auth-eqbar{0%,to{height:4px}50%{height:16px}}@media (prefers-reduced-motion: reduce){.auth-form__eq i{animation:none;height:10px}}.lesson-content{color:var(--color-text);font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:1rem;line-height:1.6}.lesson-content h1,.lesson-content h2,.lesson-content h3,.lesson-content h4,.lesson-content h5,.lesson-content h6{font-family:DM Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-weight:700;color:var(--color-text);margin-top:1.6em;margin-bottom:.6em;line-height:1.3}.lesson-content h1:first-child,.lesson-content h2:first-child,.lesson-content h3:first-child,.lesson-content h4:first-child,.lesson-content h5:first-child,.lesson-content h6:first-child{margin-top:0}.lesson-content h1{font-size:1.375rem}.lesson-content h2{font-size:1.25rem;padding-bottom:.3em;border-bottom:1px solid var(--color-border-light)}.lesson-content h3{font-size:1.125rem}.lesson-content h4{font-size:1rem;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.06em}.lesson-content p{margin:0 0 1em}.lesson-content p:last-child{margin-bottom:0}.lesson-content a{color:var(--color-primary-light);text-decoration:none;font-weight:500;transition:opacity all .15s ease}.lesson-content a:hover{opacity:.8;text-decoration:underline}.lesson-content strong{font-weight:700;color:var(--color-text)}.lesson-content em{font-style:italic}.lesson-content ul,.lesson-content ol{margin:0 0 1em;padding-left:1.5em}.lesson-content ul{list-style-type:disc}.lesson-content ul ul{list-style-type:circle}.lesson-content ol{list-style-type:decimal}.lesson-content li{margin-bottom:.35em;line-height:1.6}.lesson-content li>p{margin-bottom:.25em}.lesson-content blockquote{margin:1em 0;padding:1rem 1.5rem;border-left:3px solid var(--color-primary);background:var(--color-primary-glow);border-radius:0 .5rem .5rem 0;color:var(--color-text);font-style:normal}.lesson-content blockquote p{margin-bottom:.5em}.lesson-content blockquote p:last-child{margin-bottom:0}.lesson-content blockquote strong{color:var(--color-primary-light)}.lesson-content table{width:100%;border-collapse:collapse;margin:1em 0;font-size:.875rem;border-radius:.5rem;overflow:hidden;border:1px solid var(--color-border-light)}.lesson-content thead{background:var(--color-bg-elevated)}.lesson-content thead th{padding:.5rem 1rem;text-align:left;font-weight:600;color:var(--color-text);border-bottom:2px solid var(--color-border);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em}.lesson-content tbody td{padding:.5rem 1rem;border-bottom:1px solid var(--color-border-light);color:var(--color-text-secondary)}.lesson-content tbody tr:last-child td{border-bottom:none}.lesson-content tbody tr:hover{background:var(--color-bg-elevated)}.lesson-content code{font-family:SF Mono,Fira Code,Cascadia Code,monospace;font-size:.88em;background:var(--color-bg-elevated);padding:.15em .4em;border-radius:.25rem;color:var(--color-primary-light);border:1px solid var(--color-border-light)}.lesson-content pre{margin:1em 0;padding:1.5rem;background:var(--color-bg-elevated);border:1px solid var(--color-border-light);border-radius:.5rem;overflow-x:auto}.lesson-content pre code{background:none;padding:0;border:none;color:var(--color-text);font-size:.875rem}.lesson-content hr{border:none;border-top:1px solid var(--color-border-light);margin:1.5em 0}.lesson-content img{max-width:100%;height:auto;border-radius:.5rem;margin:1em 0;border:1px solid var(--color-border-light)}.fb-tag{display:inline;background:var(--color-primary-glow);color:var(--color-primary-light);padding:.1em .45em;border-radius:.25rem;font-weight:600;cursor:pointer;border-bottom:2px solid var(--color-primary);transition:all all .15s ease;white-space:nowrap;-webkit-user-select:none;user-select:none}.fb-tag:hover,.fb-tag:focus-visible{background:var(--color-primary);color:#fff;outline:none}.fb-tag:before{content:"🎸 ";font-size:.85em}.fb-popover{width:420px;max-width:calc(100vw - 16px);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:.75rem;box-shadow:0 12px 40px #00000040,0 4px 12px #0000001a;overflow:hidden}.fb-popover__header{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border-light)}.fb-popover__label{font-weight:700;font-size:.875rem;color:var(--color-text);text-transform:capitalize}.fb-popover__notes{flex:1;font-size:.75rem;color:var(--color-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fb-popover__close{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.fb-popover__close:focus{outline:none}.fb-popover__close:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.fb-popover__close{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:9999px;color:var(--color-text-muted);font-size:.875rem;cursor:pointer;flex-shrink:0;transition:all all .15s ease}.fb-popover__close:hover{background:var(--color-bg);color:var(--color-text)}.fb-popover__fretboard{padding:.5rem;overflow-x:auto;display:flex;justify-content:center}.fb-popover-enter-active{transition:opacity .15s ease,transform .15s ease}.fb-popover-leave-active{transition:opacity .1s ease,transform .1s ease}.fb-popover-enter-from,.fb-popover-leave-to{opacity:0;transform:translateY(-4px)}.quiz-editor{margin-top:1.5rem;border:1px solid var(--color-border-light);border-radius:.75rem;background:var(--color-bg-card);overflow:hidden}.quiz-editor__header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border-light);cursor:pointer;-webkit-user-select:none;user-select:none}.quiz-editor__header:hover{background:var(--color-primary-glow)}.quiz-editor__header-left{display:flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:600;color:var(--color-text)}.quiz-editor__header-badge{font-size:.6875rem;font-weight:500;padding:2px .5rem;border-radius:9999px;background:var(--color-primary-glow);color:var(--color-primary-light)}.quiz-editor__body{padding:1.5rem}.quiz-editor__settings{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border-light)}@media (max-width: 600px){.quiz-editor__settings{grid-template-columns:1fr}}.quiz-editor__toggle{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--color-text-secondary);cursor:pointer}.quiz-editor__toggle input[type=checkbox]{accent-color:var(--color-primary)}.quiz-editor__questions-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.quiz-editor__questions-title{font-size:.875rem;font-weight:600;color:var(--color-text)}.quiz-editor__add-btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.quiz-editor__add-btn:focus{outline:none}.quiz-editor__add-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.quiz-editor__add-btn{display:flex;align-items:center;gap:.25rem;padding:.25rem 1rem;border-radius:.5rem;background:var(--color-primary);color:#fff;font-size:.75rem;font-weight:600;cursor:pointer;transition:background all .15s ease}.quiz-editor__add-btn:hover{background:var(--color-primary-hover)}.quiz-editor__empty{text-align:center;padding:2rem;color:var(--color-text-muted);font-size:.875rem}.quiz-editor__delete-btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.quiz-editor__delete-btn:focus{outline:none}.quiz-editor__delete-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.quiz-editor__delete-btn{padding:.5rem 1rem;border-radius:.5rem;background:var(--color-error, #e53e3e);color:#fff;font-size:.75rem;font-weight:600;cursor:pointer;margin-top:1.5rem}.quiz-editor__delete-btn:hover{opacity:.9}.question-item{display:flex;align-items:flex-start;gap:1rem;padding:1rem;border:1px solid var(--color-border-light);border-radius:.5rem;margin-bottom:.5rem;background:var(--color-bg);transition:border-color all .15s ease}.question-item:hover{border-color:var(--color-primary)}.question-item__grip{color:var(--color-text-muted);cursor:grab;flex-shrink:0;padding-top:2px}.question-item__body{flex:1;min-width:0}.question-item__title{font-size:.875rem;font-weight:500;color:var(--color-text);margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.question-item__meta{font-size:.6875rem;color:var(--color-text-muted);text-transform:capitalize}.question-item__actions{display:flex;gap:4px;flex-shrink:0}.question-item__btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.question-item__btn:focus{outline:none}.question-item__btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.question-item__btn{padding:.25rem;border-radius:.375rem;color:var(--color-text-muted);cursor:pointer;transition:all all .15s ease}.question-item__btn:hover{background:var(--color-primary-glow);color:var(--color-primary-light)}.question-item__btn--danger:hover{background:#e53e3e1a;color:var(--color-error, #e53e3e)}.question-form{padding:1.5rem;border:2px solid var(--color-primary);border-radius:.75rem;margin-bottom:1rem;background:var(--color-bg-card)}.question-form__row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}@media (max-width: 600px){.question-form__row{grid-template-columns:1fr}}.question-form__options{margin-top:1rem}.question-form__option{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.question-form__option input[type=text]{flex:1}.question-form__option input[type=radio],.question-form__option input[type=checkbox]{accent-color:var(--color-primary);flex-shrink:0}.question-form__option-remove{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.question-form__option-remove:focus{outline:none}.question-form__option-remove:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.question-form__option-remove{color:var(--color-text-muted);cursor:pointer;padding:.25rem}.question-form__option-remove:hover{color:var(--color-error, #e53e3e)}.question-form__add-option{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.question-form__add-option:focus{outline:none}.question-form__add-option:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.question-form__add-option{display:flex;align-items:center;gap:.25rem;font-size:.75rem;color:var(--color-primary-light);cursor:pointer;padding:.25rem 0}.question-form__add-option:hover{text-decoration:underline}.question-form__alternatives{margin-top:.5rem;font-size:.75rem;color:var(--color-text-secondary)}.question-form__actions{display:flex;gap:.5rem;margin-top:1.5rem;justify-content:flex-end}.question-form__btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.question-form__btn:focus{outline:none}.question-form__btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.question-form__btn{padding:.5rem 1.5rem;border-radius:.5rem;font-size:.75rem;font-weight:600;cursor:pointer;transition:all all .15s ease}.question-form__btn--primary{background:var(--color-primary);color:#fff}.question-form__btn--primary:hover{background:var(--color-primary-hover)}.question-form__btn--secondary{background:var(--color-bg-elevated);color:var(--color-text-secondary);border:1px solid var(--color-border-light)}.question-form__btn--secondary:hover{background:var(--color-bg)}.quiz-player{border:1px solid var(--color-border-light);border-radius:.75rem;background:var(--color-bg-card);overflow:hidden}.quiz-player__start{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem 1.5rem;gap:.5rem}.quiz-player__title{font-size:1.125rem;font-weight:700;color:var(--color-text);margin:.25rem 0 0;line-height:1.3}.quiz-player__desc{font-size:.875rem;color:var(--color-text-secondary);line-height:1.6;margin:0;max-width:360px}.quiz-player__meta-list{list-style:none;padding:0;margin:.25rem 0 .5rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem 1rem;font-size:.75rem;color:var(--color-text-muted)}.quiz-player__meta-list li{display:flex;align-items:center;gap:.125rem}.quiz-player__meta-list li:before{content:"";width:4px;height:4px;border-radius:9999px;background:var(--color-text-muted)}.quiz-player__meta-list li:first-child:before{display:none}.quiz-player__max-reached{font-size:.75rem;color:var(--color-error, #e53e3e);margin:.25rem 0 0}.quiz-player__active{padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.quiz-player__progress{height:6px;background:var(--color-bg-elevated);border-radius:9999px;overflow:hidden}.quiz-player__progress-fill{height:100%;background:var(--color-primary);border-radius:9999px;transition:width .3s ease}.quiz-player__progress-text{font-size:.75rem;color:var(--color-text-muted);font-variant-numeric:tabular-nums;margin-top:-.25rem}.quiz-player__question{display:flex;flex-direction:column;gap:1rem}.quiz-player__question-text{font-size:1rem;font-weight:600;color:var(--color-text);line-height:1.5;margin:0}.quiz-player__hint{font-size:.75rem;color:var(--color-text-muted);font-style:italic;display:flex;align-items:center;gap:.25rem;padding:.5rem 1rem;background:var(--color-bg-elevated);border-radius:.375rem;border-left:3px solid var(--color-primary)}.quiz-player__hint-btn{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.quiz-player__hint-btn:focus{outline:none}.quiz-player__hint-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.quiz-player__hint-btn{display:inline-flex;align-items:center;gap:.25rem;font-size:.75rem;color:var(--color-primary-light);cursor:pointer;padding:.25rem 0;transition:opacity all .15s ease}.quiz-player__hint-btn:hover{opacity:.8;text-decoration:underline}.quiz-player__options{display:flex;flex-direction:column;gap:.5rem}.quiz-player__option{display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;border:1.5px solid var(--color-border-light);border-radius:.5rem;cursor:pointer;transition:all all .15s ease;font-size:.875rem;color:var(--color-text);line-height:1.4}.quiz-player__option:hover{border-color:var(--color-primary);background:var(--color-primary-glow)}.quiz-player__option--selected{border-color:var(--color-primary);background:var(--color-primary-glow);font-weight:500}.quiz-player__option input[type=radio],.quiz-player__option input[type=checkbox]{accent-color:var(--color-primary);flex-shrink:0;width:18px;height:18px;cursor:pointer}.quiz-player__option span{flex:1}.quiz-player__fill .form-field__input,.quiz-player__fill input[type=text]{display:block;width:100%;max-width:400px;padding:.5rem 1rem;border:1.5px solid var(--color-border-light);border-radius:.5rem;background:var(--color-bg);color:var(--color-text);font-size:1rem;min-height:44px;outline:none;transition:border-color all .15s ease,box-shadow all .15s ease}.quiz-player__fill .form-field__input::placeholder,.quiz-player__fill input[type=text]::placeholder{color:var(--color-text-muted)}.quiz-player__fill .form-field__input:focus,.quiz-player__fill input[type=text]:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.quiz-player__nav{display:flex;justify-content:space-between;align-items:center;padding-top:1rem;border-top:1px solid var(--color-border-light);gap:.5rem}.quiz-player__loading{text-align:center;padding:3rem;color:var(--color-text-muted);font-size:.875rem}.quiz-results{padding:1.5rem}.quiz-results__score-area{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding-bottom:1.5rem}.quiz-results__score-label{font-size:1.375rem;font-weight:700;color:var(--color-text);font-variant-numeric:tabular-nums;margin-top:-.25rem}.quiz-results__status{font-size:.875rem;font-weight:600;padding:.25rem 1rem;border-radius:9999px}.quiz-results__status--passed{background:var(--color-success-glow, rgba(16, 185, 129, .1));color:var(--color-success)}.quiz-results__status--failed{background:#ef44441a;color:var(--color-error, #e53e3e)}.quiz-results__breakdown{border-top:1px solid var(--color-border-light);padding-top:1.5rem;margin-top:.5rem}.quiz-results__breakdown-title{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0 0 1rem}.quiz-results__breakdown-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem}.quiz-results__breakdown-item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;transition:background all .15s ease}.quiz-results__breakdown-item--correct{background:var(--color-success-glow, rgba(16, 185, 129, .06))}.quiz-results__breakdown-item--incorrect{background:#ef44440f}.quiz-results__breakdown-info{display:flex;align-items:center;gap:.5rem;flex:1;min-width:0}.quiz-results__breakdown-q{font-weight:600;color:var(--color-text);white-space:nowrap}.quiz-results__breakdown-pts{font-size:.75rem;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.quiz-results__breakdown-answer{font-size:.75rem;color:var(--color-text-muted);margin-left:auto;white-space:nowrap;padding-left:.5rem}.quiz-results__actions{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--color-border-light)}.note-picker-piano__prompt{font-weight:500;margin-bottom:.5rem;color:var(--color-text)}.note-picker-piano__selection{display:flex;align-items:center;gap:.5rem;margin-top:1rem}.note-picker-piano__note-badge{display:inline-flex;align-items:center;padding:.25rem 1rem;background:var(--color-primary-soft, rgba(99, 102, 241, .12));color:var(--color-primary-light);border-radius:9999px;font-weight:600;font-size:.95rem}.note-picker-piano__clear{display:inline-flex;align-items:center;gap:4px;border:none;background:none;color:var(--color-text-muted);cursor:pointer;font-size:.85rem;padding:.25rem;border-radius:.25rem}.note-picker-piano__clear:hover{color:var(--color-danger)}.note-picker-piano__hint{display:flex;align-items:center;gap:.25rem;margin-top:.5rem;color:var(--color-text-muted);font-size:.85rem}.note-picker-fretboard__prompt{font-weight:500;margin-bottom:.5rem;color:var(--color-text)}.note-picker-fretboard__selection{display:flex;align-items:center;gap:.5rem;margin-top:1rem}.note-picker-fretboard__note-badge{display:inline-flex;align-items:center;padding:.25rem 1rem;background:var(--color-primary-soft, rgba(99, 102, 241, .12));color:var(--color-primary-light);border-radius:9999px;font-weight:600;font-size:.95rem}.note-picker-fretboard__clear{display:inline-flex;align-items:center;gap:4px;border:none;background:none;color:var(--color-text-muted);cursor:pointer;font-size:.85rem;padding:.25rem;border-radius:.25rem}.note-picker-fretboard__clear:hover{color:var(--color-danger)}.note-picker-fretboard__hint{display:flex;align-items:center;gap:.25rem;margin-top:.5rem;color:var(--color-text-muted);font-size:.85rem}.ordering-question__prompt{font-weight:500;margin-bottom:.5rem;color:var(--color-text)}.ordering-question__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem}.ordering-question__item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--color-bg-card);border:1px solid var(--color-border-light);border-radius:.375rem;cursor:grab;-webkit-user-select:none;user-select:none;transition:box-shadow .15s,border-color .15s}.ordering-question__item:active{cursor:grabbing}.ordering-question__item--dragging{opacity:.5;border-color:var(--color-primary)}.ordering-question__item--over{border-color:var(--color-primary);box-shadow:0 0 0 2px var(--color-primary-soft, rgba(99, 102, 241, .2))}.ordering-question__grip{flex-shrink:0;cursor:grab}.ordering-question__label{flex:1;font-size:.95rem}.ordering-question__number{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:9999px;background:var(--color-bg-elevated);color:var(--color-text-muted);font-size:.8rem;font-weight:600}.ordering-question__mobile-hint{display:none;color:var(--color-text-muted);font-size:.8rem;margin-top:.5rem}@media (max-width: 600px){.ordering-question__mobile-hint{display:block}}.ordering-question__buttons{display:none;flex-direction:column;gap:.25rem;margin-top:.5rem}@media (max-width: 600px){.ordering-question__buttons{display:flex}}.ordering-question__btn-row{display:flex;align-items:center;gap:.5rem}.ordering-question__btn-label{flex:1;font-size:.9rem}.ordering-question__btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border);border-radius:.25rem;background:var(--color-bg-card);cursor:pointer;color:var(--color-text-secondary)}.ordering-question__btn:hover:not(:disabled){background:var(--color-bg-elevated);color:var(--color-text)}.ordering-question__btn:disabled{opacity:.3;cursor:not-allowed}.ordering-question__hint{display:flex;align-items:center;gap:.25rem;margin-top:.5rem;color:var(--color-text-muted);font-size:.85rem}.question-form__midi-row{display:flex;align-items:center;gap:.5rem}.question-form__midi-name{font-weight:600;color:var(--color-primary-light);font-size:.95rem;white-space:nowrap}.question-form__option-num{flex-shrink:0;width:20px;color:var(--color-text-muted);font-weight:600;font-size:.85rem}.quiz-player__note-picker{margin-top:1rem;overflow-x:auto}.quiz-player__ordering{margin-top:1rem}.quiz-analytics__loading,.quiz-analytics__empty{padding:2rem;text-align:center;color:var(--color-text-secondary);font-size:.875rem;display:flex;flex-direction:column;align-items:center;gap:.5rem}.quiz-analytics__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem}.quiz-analytics__stat{text-align:center;padding:1rem;background:var(--color-bg-elevated);border-radius:.5rem;border:1px solid var(--color-border-light)}.quiz-analytics__stat-value{display:block;font-size:1.375rem;font-weight:700;color:var(--color-text)}.quiz-analytics__stat-label{display:block;font-size:.75rem;color:var(--color-text-secondary);margin-top:2px}.quiz-analytics__section{margin-bottom:1.5rem}.quiz-analytics__section-title{display:flex;align-items:center;gap:.25rem;font-size:.875rem;font-weight:600;color:var(--color-text);margin:0 0 1rem}.quiz-analytics__questions{display:flex;flex-direction:column;gap:.5rem}.quiz-analytics__question{padding:.5rem 1rem;background:var(--color-bg-elevated);border-radius:.375rem;border:1px solid var(--color-border-light)}.quiz-analytics__question-header{display:flex;align-items:center;gap:.5rem;margin-bottom:4px}.quiz-analytics__question-num{font-weight:700;font-size:.75rem;color:var(--color-text-muted);min-width:28px}.quiz-analytics__question-text{flex:1;font-size:.875rem;color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quiz-analytics__question-rate{font-weight:700;font-size:.875rem}.quiz-analytics__question-rate--high{color:var(--color-success)}.quiz-analytics__question-rate--mid{color:var(--color-warning)}.quiz-analytics__question-rate--low{color:var(--color-error)}.quiz-analytics__question-bar{height:4px;background:var(--color-border-light);border-radius:2px;margin-bottom:4px}.quiz-analytics__question-bar-fill{height:100%;border-radius:2px;transition:width .4s ease}.quiz-analytics__question-bar-fill--high{background:var(--color-success)}.quiz-analytics__question-bar-fill--mid{background:var(--color-warning)}.quiz-analytics__question-bar-fill--low{background:var(--color-error)}.quiz-analytics__question-detail{font-size:.75rem;color:var(--color-text-muted)}.quiz-analytics__attempts{display:flex;flex-direction:column;gap:2px}.quiz-analytics__attempt{display:flex;align-items:center;gap:.5rem;padding:.25rem 1rem;font-size:.875rem}.quiz-analytics__attempt:nth-child(odd){background:var(--color-bg-elevated);border-radius:.25rem}.quiz-analytics__attempt-name{flex:1;color:var(--color-text)}.quiz-analytics__attempt-score{font-weight:700}.quiz-analytics__attempt-score--pass{color:var(--color-success)}.quiz-analytics__attempt-score--fail{color:var(--color-error)}.quiz-analytics__attempt-date{font-size:.75rem;color:var(--color-text-muted);min-width:100px;text-align:right}@media (max-width: 767px){.instrument-renderer__scroll-wrap--horizontal{overflow-x:scroll;overflow-y:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-x;scroll-snap-type:x mandatory;overscroll-behavior:contain}.instrument-renderer__scroll-wrap--vertical{overflow-x:hidden;overflow-y:scroll;-webkit-overflow-scrolling:touch;touch-action:pan-y;scroll-snap-type:y mandatory;overscroll-behavior:contain;max-height:65vh}.instrument-scroll-indicator--horizontal{width:100%;height:12px;margin-top:4px}.instrument-scroll-indicator--vertical{width:12px;height:100%;margin-left:4px;position:absolute;right:0;top:0}.instrument-settings-trigger{display:flex;align-items:center;margin-bottom:6px}.player-controls__main--sticky{position:sticky;bottom:0;background:var(--color-surface);border-top:1px solid var(--color-border);z-index:100;padding:.75rem;margin:0 -.75rem}.fretboard--horizontal{padding:0}.piano-keyboard--vertical .piano-keyboard__svg--vertical{min-width:unset;width:100%}.pattern-list{max-height:40vh;overflow-y:auto}}@media (max-width: 767px) and (orientation: landscape){.instrument-renderer__scroll-wrap--vertical{max-height:calc(100vh - 120px)}.player-controls__main--sticky{padding:.4rem .75rem}}.ai-coach{position:fixed;right:0;top:0;bottom:0;width:380px;max-width:100vw;display:flex;flex-direction:column;background:var(--color-bg-elevated);border-left:1px solid var(--color-border);box-shadow:-4px 0 24px #0000004d;z-index:1000}.ai-coach--mobile{top:auto;left:0;right:0;bottom:0;width:100%;max-height:70vh;border-left:none;border-top:1px solid var(--color-border);border-radius:16px 16px 0 0;box-shadow:0 -4px 24px #0000004d}.ai-coach__header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--color-border);background:var(--color-bg-card);flex-shrink:0}.ai-coach__header-left{display:flex;align-items:center;gap:8px}.ai-coach__icon{font-size:20px;line-height:1}.ai-coach__title{font-size:14px;font-weight:700;color:var(--color-text);letter-spacing:-.2px}.ai-coach__header-right{display:flex;align-items:center;gap:4px}.ai-coach__header-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;border-radius:8px;background:transparent;color:var(--color-text-secondary);cursor:pointer;transition:all .15s ease}.ai-coach__header-btn:hover{background:var(--color-bg-hover);color:var(--color-text)}.ai-coach__messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}.ai-coach__messages::-webkit-scrollbar{width:4px}.ai-coach__messages::-webkit-scrollbar-track{background:transparent}.ai-coach__messages::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}.ai-coach__welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 16px;gap:12px;flex:1}.ai-coach__welcome-icon{font-size:48px;line-height:1;opacity:.8}.ai-coach__welcome-text{font-size:13px;color:var(--color-text-secondary);line-height:1.5;max-width:260px;margin:0}.ai-coach__message{max-width:90%;position:relative}.ai-coach__message--user{align-self:flex-end}.ai-coach__message--user .ai-coach__message-content{background:var(--color-primary);color:#fff;border-radius:16px 16px 4px;padding:10px 14px;font-size:13px;line-height:1.5}.ai-coach__message--assistant{align-self:flex-start}.ai-coach__message--assistant .ai-coach__message-content{background:var(--color-bg-card);color:var(--color-text);border:1px solid var(--color-border);border-radius:16px 16px 16px 4px;padding:12px 14px;font-size:13px;line-height:1.6}.ai-coach__message--assistant .ai-coach__message-content p{margin:0 0 8px}.ai-coach__message--assistant .ai-coach__message-content p:last-child{margin-bottom:0}.ai-coach__message--assistant .ai-coach__message-content strong{color:var(--color-primary-light);font-weight:700}.ai-coach__message--assistant .ai-coach__message-content em{color:var(--color-text-secondary)}.ai-coach__message--assistant .ai-coach__message-content code{background:#ffffff0f;padding:1px 5px;border-radius:4px;font-family:JetBrains Mono,SF Mono,Monaco,Cascadia Code,Consolas,monospace;font-size:12px}.ai-coach__message--assistant .ai-coach__message-content ul,.ai-coach__message--assistant .ai-coach__message-content ol{margin:6px 0;padding-left:18px}.ai-coach__message--assistant .ai-coach__message-content li{margin-bottom:3px}.ai-coach__message--loading .ai-coach__message-content{display:flex;align-items:center;gap:8px;padding:12px 16px}.ai-coach__cached-badge{position:absolute;top:-4px;right:-4px;font-size:10px;opacity:.6}.ai-coach__typing{display:flex;gap:4px;align-items:center}.ai-coach__typing span{width:6px;height:6px;border-radius:50%;background:var(--color-text-secondary);animation:typing-bounce 1.2s ease-in-out infinite}.ai-coach__typing span:nth-child(2){animation-delay:.2s}.ai-coach__typing span:nth-child(3){animation-delay:.4s}.ai-coach__thinking-text{font-size:12px;color:var(--color-text-muted);font-style:italic}.ai-coach__error{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--color-error-glow);border:1px solid rgba(248,81,73,.3);border-radius:8px;font-size:12px;color:var(--color-error)}.ai-coach__quick-actions{display:flex;gap:6px;padding:8px 16px;border-top:1px solid var(--color-border-light);flex-shrink:0;overflow-x:auto}.ai-coach__quick-actions::-webkit-scrollbar{display:none}.ai-coach__quick-actions{-ms-overflow-style:none;scrollbar-width:none}.ai-coach__quick-btn{flex-shrink:0;padding:6px 12px;border:1px solid var(--color-border);border-radius:20px;background:var(--color-bg-card);color:var(--color-text-secondary);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s ease;white-space:nowrap}.ai-coach__quick-btn:hover:not(:disabled){background:var(--color-bg-hover);color:var(--color-text);border-color:var(--color-primary)}.ai-coach__quick-btn:disabled{opacity:.4;cursor:not-allowed}.ai-coach__input-area{display:flex;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid var(--color-border-light);background:var(--color-bg-card);flex-shrink:0}.ai-coach__input{flex:1;padding:8px 14px;border:1px solid var(--color-border);border-radius:20px;background:var(--color-bg-input);color:var(--color-text);font-size:13px;outline:none;transition:border-color .15s ease}.ai-coach__input::placeholder{color:var(--color-text-muted)}.ai-coach__input:focus{border-color:var(--color-primary)}.ai-coach__input:disabled{opacity:.5}.ai-coach__send-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;border-radius:50%;background:var(--color-primary);color:#fff;cursor:pointer;transition:all .15s ease;flex-shrink:0}.ai-coach__send-btn:hover:not(:disabled){background:var(--color-primary-dark);transform:scale(1.05)}.ai-coach__send-btn:disabled{opacity:.3;cursor:not-allowed}.ai-coach__usage{text-align:center;padding:6px 16px 10px;font-size:11px;color:var(--color-text-muted);flex-shrink:0}.coach-panel-enter-active,.coach-panel-leave-active{transition:transform .3s cubic-bezier(.16,1,.3,1)}.coach-panel-enter-from{transform:translate(100%)}.ai-coach--mobile .coach-panel-enter-from{transform:translateY(100%)}.coach-panel-leave-to{transform:translate(100%)}.ai-coach--mobile .coach-panel-leave-to{transform:translateY(100%)}.ai-quick-tip{display:flex;align-items:flex-start;gap:8px;padding:10px 14px;margin:8px 0;background:var(--color-primary-glow);border:1px solid rgba(122,37,48,.2);border-radius:12px;font-size:13px;color:var(--color-text);line-height:1.5;position:relative}.ai-quick-tip__icon{font-size:16px;flex-shrink:0;line-height:1.4}.ai-quick-tip__content{flex:1}.ai-quick-tip__close{position:absolute;top:6px;right:6px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border:none;border-radius:50%;background:transparent;color:var(--color-text-muted);cursor:pointer;transition:all .15s ease}.ai-quick-tip__close:hover{background:#ffffff1a;color:var(--color-text)}.quick-tip-enter-active,.quick-tip-leave-active{transition:all .3s ease}.quick-tip-enter-from,.quick-tip-leave-to{opacity:0;transform:translateY(-8px)}@keyframes typing-bounce{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-4px);opacity:1}}.teacher-character{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem}.teacher-character__portrait{border-radius:.75rem;object-fit:cover;object-position:center top;flex-shrink:0;background:var(--color-bg-elevated)}.teacher-character__portrait--placeholder{background:linear-gradient(160deg,var(--color-bg-elevated) 0%,var(--color-bg-card) 100%);border-right:1px solid var(--color-border-light)}.teacher-character__bubble-area{flex:1;min-width:0;display:flex;flex-direction:column;gap:.5rem;padding-top:.25rem}.teacher-character__name{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;margin:0}.teacher-character__chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.teacher-character__chip{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.teacher-character__chip:focus{outline:none}.teacher-character__chip:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.teacher-character__chip{padding:.25rem 1rem;border-radius:9999px;border:1px solid var(--color-border);background:var(--color-bg-elevated);color:var(--color-text);font-size:.875rem;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}.teacher-character__chip:hover{border-color:var(--color-primary-light);background:var(--color-bg-hover)}.teacher-character__chip:focus-visible{outline:2px solid var(--color-primary-light);outline-offset:2px}.teacher-character--lesson{position:relative;display:block;width:100%;min-height:320px;margin-bottom:2rem;border:1px solid var(--color-border-light);border-radius:1rem;overflow:hidden;background:var(--color-bg-card);isolation:isolate}@media (min-width: 768px){.teacher-character--lesson{min-height:440px}}.teacher-character--lesson .teacher-character__scene{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center top}.teacher-character--lesson .teacher-character__scene--placeholder{background:radial-gradient(120% 95% at 18% 28%,var(--color-primary-glow),transparent 55%),radial-gradient(90% 80% at 88% 12%,var(--color-success-glow),transparent 60%),linear-gradient(155deg,var(--color-bg-elevated) 0%,var(--color-bg) 100%)}.teacher-character--lesson .teacher-character__scrim{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:linear-gradient(105deg,#0000001f,#00000014 28%,#0000006b 68%,#000000a8),linear-gradient(to top,rgba(0,0,0,.6) 0%,transparent 42%)}.teacher-character--lesson .teacher-character__label{position:absolute;left:2rem;bottom:2rem;z-index:2}.teacher-character--lesson .teacher-character__name{font-size:1rem;font-weight:600;color:var(--color-text);text-transform:none;letter-spacing:0;margin:0}.teacher-character--lesson .teacher-character__role{font-size:.75rem;color:var(--color-text-secondary);margin:2px 0 0}.teacher-character--lesson .teacher-character__stack{position:absolute;top:2rem;right:2rem;z-index:2;width:min(360px,60%);display:flex;flex-direction:column;align-items:flex-end;gap:1rem}.teacher-character--lesson .teacher-character__greeting{width:100%;max-width:none;box-shadow:0 14px 36px #0006;animation:teacher-bubble-in .24s cubic-bezier(.165,.84,.44,1) both}.teacher-character--lesson .teacher-character__cta-card{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.teacher-character--lesson .teacher-character__cta-card:focus{outline:none}.teacher-character--lesson .teacher-character__cta-card:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.teacher-character--lesson .teacher-character__cta-card{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.5rem 1rem;border-radius:.75rem;border:1px solid rgba(var(--color-success-rgb, 63 185 80)/.45);background:#0000006b;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--color-text);text-align:left;cursor:pointer;box-shadow:0 12px 30px #00000052;transition:border-color .15s ease,background .15s ease,transform .15s ease}.teacher-character--lesson .teacher-character__cta-card strong{color:var(--color-success);font-weight:600}.teacher-character--lesson .teacher-character__cta-card:hover{border-color:var(--color-success);background:#00000094;transform:translateY(-1px)}.teacher-character--lesson .teacher-character__cta-card:focus-visible{outline:2px solid var(--color-success);outline-offset:2px}.teacher-character--lesson .teacher-character__cta-text{font-size:.875rem;line-height:1.4}.teacher-character--lesson .teacher-character__cta-arrow{flex-shrink:0;color:var(--color-success);font-size:1rem;font-weight:600}.teacher-character--lesson .teacher-character__chips{width:100%;justify-content:flex-end;margin-top:0}.teacher-character--lesson .teacher-character__chip{background:#0000006b;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 8px 20px #00000047}.teacher-character--lesson .teacher-character__chip:hover{background:#00000094}@media (max-width: 768px){.teacher-character--lesson{min-height:0}.teacher-character--lesson .teacher-character__scene,.teacher-character--lesson .teacher-character__scene--placeholder{bottom:auto;height:200px}.teacher-character--lesson .teacher-character__scrim{bottom:auto;height:200px;background:linear-gradient(to top,rgba(0,0,0,.55) 0%,transparent 60%)}.teacher-character--lesson .teacher-character__label{top:144px;bottom:auto;left:1rem}.teacher-character--lesson .teacher-character__stack{position:static;width:auto;align-items:stretch;margin-top:200px;padding:1rem;background:var(--color-bg-card)}.teacher-character--lesson .teacher-character__chips{justify-content:flex-start}}.teacher-character--exercise{position:fixed;bottom:1.5rem;right:1.5rem;z-index:100;flex-direction:column;align-items:center;gap:.25rem;margin-bottom:0}.teacher-character--exercise .teacher-character__portrait{width:64px;height:64px;border-radius:9999px;border:2px solid var(--color-border)}.teacher-character--exercise .teacher-character__bubble-area{display:none}.teacher-character--summary{flex-direction:column;align-items:center;text-align:center;gap:.5rem}.teacher-character--summary .teacher-character__portrait{width:120px;height:120px;border-radius:9999px;border:3px solid var(--color-border)}.teacher-character--summary .teacher-character__bubble-area{align-items:center}@keyframes teacher-bubble-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.teacher-character--lesson .teacher-character__greeting{animation:none}}.speech-bubble{position:relative;background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:1rem;padding:1rem 1.5rem;max-width:360px;color:var(--color-text);font-size:.875rem;line-height:1.6}.speech-bubble:before{content:"";position:absolute;left:-10px;top:1.5rem;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:10px solid var(--color-border)}.speech-bubble:after{content:"";position:absolute;left:-8px;top:1.5rem;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:10px solid var(--color-bg-elevated)}.speech-bubble__highlight{color:var(--color-primary-light);font-weight:600}.speech-bubble--action{border-color:var(--color-success)}.speech-bubble--action .speech-bubble__cta{color:var(--color-success);font-weight:600;cursor:pointer;text-decoration:underline}.teacher-hero{position:relative;width:100%;min-height:280px;max-height:420px;overflow:hidden;border-radius:1rem;background:var(--color-bg-card);display:flex;align-items:flex-end}.teacher-hero__photo{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center top}.teacher-hero__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.2) 50%,transparent 100%),linear-gradient(to right,rgba(0,0,0,.4) 0%,transparent 60%)}.teacher-hero__label{position:absolute;bottom:1.5rem;left:1.5rem;z-index:1}.teacher-hero__name{font-size:1rem;font-weight:600;color:var(--color-text);margin:0 0 2px}.teacher-hero__title{font-size:.75rem;color:var(--color-text-secondary);margin:0}.teacher-hero__bubble{position:absolute;top:1.5rem;right:1.5rem;z-index:1;max-width:320px}.teacher-hero--no-photo{background:var(--color-bg-elevated);min-height:180px}.teacher-hero--no-photo .teacher-hero__overlay{display:none}.teacher-hero--no-photo .teacher-hero__bubble{position:relative;top:auto;right:auto;margin:1.5rem auto}.lesson-state-sidebar{display:flex;flex-direction:column;gap:0;min-width:200px}.lesson-state-sidebar__title{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;padding:0 .5rem .5rem;margin:0}.lesson-state-sidebar__item{display:flex;align-items:center;gap:.5rem;padding:.5rem;border-radius:.5rem;cursor:pointer;transition:background .15s ease;position:relative}.lesson-state-sidebar__item:hover{background:var(--color-bg-hover)}.lesson-state-sidebar__item:not(:last-child):after{content:"";position:absolute;left:calc(.5rem + 9px);top:calc(100% - 4px);width:2px;height:calc(1rem + 4px);background:var(--color-border);z-index:0}.lesson-state-sidebar__item--active{background:var(--color-bg-elevated)}.lesson-state-sidebar__item--active .lesson-state-sidebar__label{color:var(--color-text);font-weight:500}.lesson-state-sidebar__item--locked{opacity:.4;cursor:default;pointer-events:none}.lesson-state-sidebar__icon{width:20px;height:20px;border-radius:9999px;border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;flex-shrink:0;z-index:1;background:var(--color-bg);font-size:.75rem}.lesson-state-sidebar__icon--done{background:var(--color-success);border-color:var(--color-success);color:#fff}.lesson-state-sidebar__icon--active{background:var(--color-primary);border-color:var(--color-primary)}.lesson-state-sidebar__label{font-size:.875rem;color:var(--color-text-secondary);line-height:1.25;z-index:1}.coach-note{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:.75rem;padding:1rem}.coach-note__header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.coach-note__avatar{width:32px;height:32px;border-radius:9999px;object-fit:cover;background:var(--color-bg-hover);flex-shrink:0}.coach-note__meta{flex:1;min-width:0}.coach-note__title{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0}.coach-note__text{font-size:.875rem;color:var(--color-text-secondary);line-height:1.6;margin:0 0 .5rem}.coach-note__audio{display:flex;align-items:center;gap:.5rem}.coach-note__play-btn{width:32px;height:32px;border-radius:9999px;border:1px solid var(--color-border);background:var(--color-bg);color:var(--color-text);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease;flex-shrink:0}.coach-note__play-btn:hover{background:var(--color-bg-hover)}.coach-note__play-btn--playing{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.coach-note__duration{font-size:.75rem;color:var(--color-text-muted);font-family:JetBrains Mono,SF Mono,Monaco,Cascadia Code,Consolas,monospace}.lesson-progress-sidebar{display:flex;flex-direction:column;gap:1rem;min-width:260px;max-width:300px}.lesson-progress-sidebar__progress-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:1rem;padding:1rem}.lesson-progress-sidebar__progress-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1rem}.lesson-progress-sidebar__progress-label{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0}.lesson-progress-sidebar__progress-level{font-size:.75rem;color:var(--color-text-secondary)}.lesson-progress-sidebar__progress-body{display:flex;align-items:center;gap:1rem}.lesson-progress-sidebar__progress-text{flex:1}.lesson-progress-sidebar__progress-message{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0 0 .25rem}.lesson-progress-sidebar__progress-sub{font-size:.75rem;color:var(--color-text-secondary);margin:0}.lesson-progress-sidebar__stats{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;padding-top:1rem;border-top:1px solid var(--color-border-light);margin-top:1rem}.lesson-progress-sidebar__stat-label{font-size:.75rem;color:var(--color-text-muted);margin:0 0 2px}.lesson-progress-sidebar__stat-value{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0}.lesson-progress-sidebar__milestone-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:1rem;padding:1rem}.lesson-progress-sidebar__milestone-title{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;margin:0 0 .5rem}.lesson-progress-sidebar__milestone-name{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0 0 .25rem}.lesson-progress-sidebar__milestone-desc{font-size:.75rem;color:var(--color-text-secondary);margin:0 0 1rem}.lesson-progress-sidebar__milestone-btn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.5rem 1rem;background:var(--color-success);color:#fff;border:none;border-radius:.5rem;font-size:.875rem;font-weight:600;cursor:pointer;text-decoration:none;transition:opacity .15s ease}.lesson-progress-sidebar__milestone-btn:hover{opacity:.9}.lesson-progress-sidebar__up-next-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:1rem;padding:1rem}.lesson-progress-sidebar__up-next-title{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;margin:0 0 .5rem}.lesson-progress-sidebar__up-next-row{display:flex;align-items:center;gap:.5rem}.lesson-progress-sidebar__up-next-lock{font-size:1.125rem;color:var(--color-text-muted);flex-shrink:0}.lesson-progress-sidebar__up-next-name{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0 0 2px}.lesson-progress-sidebar__up-next-sub{font-size:.75rem;color:var(--color-text-secondary);margin:0}.lesson-state-editor{border:1px solid var(--color-border);border-radius:.75rem;overflow:hidden}.lesson-state-editor__header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:var(--color-bg-elevated);border-bottom:1px solid var(--color-border)}.lesson-state-editor__title{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0}.lesson-state-editor__empty{padding:1rem;font-size:.875rem;color:var(--color-text-muted);text-align:center}.lesson-state-editor__list{list-style:none;margin:0;padding:0}.lesson-state-editor__item{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-bottom:1px solid var(--color-border-light)}.lesson-state-editor__item:last-child{border-bottom:none}.lesson-state-editor__position{font-size:.75rem;color:var(--color-text-muted);width:16px;text-align:center;flex-shrink:0}.lesson-state-editor__type-badge{font-size:.75rem;padding:2px .25rem;border-radius:.25rem;background:var(--color-bg-hover);color:var(--color-text-secondary);flex-shrink:0;min-width:64px;text-align:center}.lesson-state-editor__label-input{flex:1;min-width:0;font-size:.875rem;color:var(--color-text);background:transparent;border:none;border-bottom:1px solid transparent;padding:2px 0;outline:none}.lesson-state-editor__label-input:focus{border-bottom-color:var(--color-primary-light)}.lesson-state-editor__ref-select{flex-shrink:0;max-width:160px;font-size:.75rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:.25rem;padding:2px .25rem;color:var(--color-text);cursor:pointer}.lesson-state-editor__ref-select--unset{border-color:var(--color-danger, #e53e3e)}.lesson-state-editor__move-btn,.lesson-state-editor__delete-btn{background:none;border:none;cursor:pointer;color:var(--color-text-muted);padding:2px .25rem;border-radius:.25rem;font-size:.875rem;line-height:1;flex-shrink:0;transition:color .15s ease,background .15s ease}.lesson-state-editor__move-btn:hover,.lesson-state-editor__delete-btn:hover{color:var(--color-text);background:var(--color-bg-hover)}.lesson-state-editor__move-btn:disabled,.lesson-state-editor__delete-btn:disabled{opacity:.3;cursor:default}.lesson-state-editor__delete-btn:hover{color:var(--color-danger, #e53e3e)}.lesson-state-editor__add-row{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:var(--color-bg-elevated);border-top:1px solid var(--color-border)}.lesson-state-editor__type-select{font-size:.875rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:.375rem;padding:.25rem .5rem;color:var(--color-text);cursor:pointer}.lesson-state-editor__add-btn{font-size:.875rem;padding:.25rem .5rem;background:var(--color-primary);color:#fff;border:none;border-radius:.375rem;cursor:pointer;transition:opacity .15s ease}.lesson-state-editor__add-btn:hover{opacity:.85}.snippet-player{width:100%;aspect-ratio:16/9;background:#000;border-radius:.75rem;overflow:hidden;position:relative}.snippet-player__video{width:100%;height:100%;object-fit:contain}.snippet-player__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:.875rem;color:var(--color-text-muted);background:var(--color-bg-elevated)}.snippet-picker{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.snippet-picker__select{flex:1;min-width:120px;max-width:200px;font-size:.75rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:.25rem;padding:2px .25rem;color:var(--color-text);cursor:pointer}.snippet-picker__upload{font-size:.75rem;padding:2px .5rem;border:1px solid var(--color-border);border-radius:.25rem;color:var(--color-primary-light);cursor:pointer;white-space:nowrap;transition:background .15s ease}.snippet-picker__upload:hover{background:var(--color-bg-hover)}.snippet-picker__error{flex-basis:100%;margin:0;font-size:.75rem;color:var(--color-danger, #e53e3e)}.lesson-scale-player{background:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:.75rem;padding:1.5rem}.lesson-scale-player__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.lesson-scale-player__title{font-size:1.125rem;font-weight:600;color:var(--color-text);margin:0}.lesson-scale-player__views{display:flex;gap:.25rem}.lesson-scale-player__view-btn{font-size:.875rem;padding:.25rem .5rem;border:1px solid var(--color-border);border-radius:.375rem;background:transparent;color:var(--color-text-secondary);cursor:pointer}.lesson-scale-player__view-btn--active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.lesson-scale-player__maximize{background:none;border:1px solid var(--color-border);border-radius:.375rem;color:var(--color-text-muted);padding:.25rem;cursor:pointer}.lesson-scale-player__board{margin:1rem 0}.lesson-scale-player__empty{padding:1.5rem;text-align:center;font-size:.875rem;color:var(--color-text-muted)}.lesson-scale-player__footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem}.lesson-scale-player__instructions{flex:1;margin:0;font-size:.875rem;color:var(--color-text-secondary);list-style:none;padding:0}.lesson-scale-player__bpm{font-size:.875rem;color:var(--color-text-muted);white-space:nowrap}.lesson-scale-player__start{font-size:.875rem;font-weight:600;padding:.5rem 1.5rem;background:var(--color-primary);color:#fff;border:none;border-radius:.375rem;cursor:pointer;white-space:nowrap}.lesson-scale-player__start:disabled{opacity:.4;cursor:default}.practice-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:var(--color-bg);display:flex;flex-direction:column;overflow:auto}.practice-overlay__bar{display:flex;justify-content:flex-end;padding:.5rem 1rem;border-bottom:1px solid var(--color-border)}.practice-overlay__close{background:none;border:1px solid var(--color-border);border-radius:.375rem;color:var(--color-text);font-size:.875rem;padding:.25rem 1rem;cursor:pointer}.practice-overlay__body{flex:1;min-height:0}.text--center{text-align:center}.text--left{text-align:left}.text--right{text-align:right}.text--xs{font-size:.75rem}.text--sm{font-size:.875rem}.text--base{font-size:1rem}.text--lg{font-size:1.125rem}.text--xl{font-size:1.25rem}.text--bold{font-weight:700}.text--semibold{font-weight:600}.text--medium{font-weight:500}.text--muted{color:var(--color-text-muted)}.text--secondary{color:var(--color-text-secondary)}.text--primary{color:var(--color-primary)}.text--success{color:var(--color-success)}.text--warning{color:var(--color-warning)}.text--error{color:var(--color-error)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hidden{display:none!important}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border-width:0!important}.pointer-events-none{pointer-events:none}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-scroll{overflow:scroll}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.fade-in-gentle{animation:_fade-in-gentle .6s ease both}.fade-in-up{animation:_fade-in-up .5s ease both}.breathe{animation:_breathe 3s ease-in-out infinite}.warm-glow{background:var(--color-primary-glow);border:1px solid rgba(122,37,48,.12);border-radius:.5rem;padding:.5rem 1rem}.text--gentle-error{color:#f0a060;font-size:.875rem}@keyframes _fade-in-gentle{0%{opacity:0}to{opacity:1}}@keyframes _fade-in-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes _breathe{0%,to{opacity:1}50%{opacity:.65}}