:root{--esa-bg-void:hsl(222, 30%, 4%);--esa-bg-base:hsl(222, 28%, 7%);--esa-bg-raised:hsl(222, 24%, 11%);--esa-bg-overlay:hsl(222, 22%, 15%);--esa-bg-highlight:hsl(222, 20%, 20%);--esa-border-subtle:hsl(222, 18%, 18%);--esa-border-default:hsl(222, 16%, 25%);--esa-border-strong:hsl(222, 14%, 35%);--esa-accent-primary:hsl(245, 90%, 65%);--esa-accent-primary-dim:hsl(245, 70%, 45%);--esa-accent-primary-glow:hsl(245, 90%, 65%, 0.25);--esa-accent-primary-subtle:hsl(245, 40%, 15%);--esa-wave-reference:hsl(158, 82%, 52%);--esa-wave-reference-dim:hsl(158, 60%, 30%);--esa-wave-learner:hsl(195, 90%, 55%);--esa-wave-learner-dim:hsl(195, 70%, 30%);--esa-karaoke-active:hsl(42, 100%, 65%);--esa-karaoke-glow:hsl(42, 100%, 65%, 0.30);--esa-karaoke-spoke:hsl(158, 82%, 52%);--esa-annotation-liaison:hsl(195, 90%, 65%);--esa-annotation-elision:hsl(222, 15%, 45%);--esa-annotation-stress:hsl(42, 100%, 70%);--esa-annotation-rising:hsl(120, 70%, 58%);--esa-annotation-falling:hsl(0,   75%, 62%);--esa-annotation-fall-rise:hsl(280, 80%, 70%);--esa-mastery-new:hsl(222, 15%, 45%);--esa-mastery-progress:hsl(42,  100%, 60%);--esa-mastery-practiced:hsl(120, 65%, 52%);--esa-mastery-mastered:hsl(55,  100%, 60%);--esa-srs-box-1:hsl(0,   75%, 55%);--esa-srs-box-2:hsl(25,  90%, 55%);--esa-srs-box-3:hsl(42, 100%, 55%);--esa-srs-box-4:hsl(120,  65%, 45%);--esa-srs-box-5:hsl(158,  82%, 45%);--esa-danger:hsl(0,   80%, 60%);--esa-warning:hsl(42, 100%, 58%);--esa-success:hsl(120,  65%, 52%);--esa-text-primary:hsl(222, 15%, 95%);--esa-text-secondary:hsl(222, 12%, 70%);--esa-text-tertiary:hsl(222, 10%, 50%);--esa-text-disabled:hsl(222,  8%, 35%);--esa-font-ui:'Inter', system-ui, -apple-system, sans-serif;--esa-font-mono:'JetBrains Mono', 'Fira Code', ui-monospace, monospace;--esa-text-xs:clamp(0.625rem, 0.6rem + 0.1vw, 0.75rem);--esa-text-sm:clamp(0.75rem,  0.72rem + 0.1vw, 0.875rem);--esa-text-base:clamp(0.875rem, 0.85rem + 0.15vw, 1rem);--esa-text-md:clamp(1rem,     0.95rem + 0.2vw,  1.125rem);--esa-text-lg:clamp(1.125rem, 1.05rem + 0.3vw,  1.375rem);--esa-text-xl:clamp(1.375rem, 1.2rem  + 0.6vw,  1.75rem);--esa-text-2xl:clamp(1.75rem,  1.5rem  + 1vw,    2.25rem);--esa-text-3xl:clamp(2.25rem,  1.8rem  + 1.5vw,  3rem);--esa-leading-tight:1.2;--esa-leading-snug:1.375;--esa-leading-normal:1.5;--esa-leading-relaxed:1.7;--esa-tracking-tight:-0.02em;--esa-tracking-normal:0;--esa-tracking-wide:0.04em;--esa-tracking-wider:0.08em;--esa-tracking-widest:0.15em;--esa-space-1:0.25rem;--esa-space-2:0.5rem;--esa-space-3:0.75rem;--esa-space-4:1rem;--esa-space-5:1.25rem;--esa-space-6:1.5rem;--esa-space-8:2rem;--esa-space-10:2.5rem;--esa-space-12:3rem;--esa-space-16:4rem;--esa-space-20:5rem;--esa-space-24:6rem;--esa-radius-sm:0.25rem;--esa-radius-md:0.5rem;--esa-radius-lg:0.75rem;--esa-radius-xl:1rem;--esa-radius-2xl:1.5rem;--esa-radius-full:9999px;--esa-shadow-sm:0 1px 3px hsl(222, 40%, 2%, 0.6);--esa-shadow-md:0 4px 12px hsl(222, 40%, 2%, 0.7);--esa-shadow-lg:0 8px 24px hsl(222, 40%, 2%, 0.8);--esa-shadow-xl:0 16px 48px hsl(222, 40%, 2%, 0.9);--esa-shadow-glow:0 0 20px var(--esa-accent-primary-glow);--esa-transition-fast:150ms ease;--esa-transition-base:250ms ease;--esa-transition-slow:400ms ease;--esa-transition-spring:300ms cubic-bezier(0.34, 1.56, 0.64, 1);--esa-z-base:0;--esa-z-raised:10;--esa-z-sticky:100;--esa-z-overlay:200;--esa-z-modal:300;--esa-z-toast:400;--esa-nav-height:3.5rem;--esa-transport-height:5rem;--esa-sidebar-width:22rem;--esa-content-max:80rem;--esa-catalog-max:72rem;--esa-waveform-height:6rem;--esa-karaoke-font:var(--esa-text-2xl);--esa-translation-font:var(--esa-text-lg)}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--esa-font-ui);font-size:var(--esa-text-base);line-height:var(--esa-leading-normal);color:var(--esa-text-primary);background-color:var(--esa-bg-void);min-height:100dvh;display:flex;flex-direction:column}:focus-visible{outline:2px solid var(--esa-accent-primary);outline-offset:3px;border-radius:var(--esa-radius-sm)}:focus:not(:focus-visible){outline:none}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:var(--esa-leading-tight);letter-spacing:var(--esa-tracking-tight);color:var(--esa-text-primary)}h1{font-size:var(--esa-text-3xl)}h2{font-size:var(--esa-text-2xl)}h3{font-size:var(--esa-text-xl)}h4{font-size:var(--esa-text-lg)}h5{font-size:var(--esa-text-md)}h6{font-size:var(--esa-text-base)}p{color:var(--esa-text-secondary);line-height:var(--esa-leading-relaxed)}a{color:var(--esa-accent-primary);text-decoration:none;transition:color var(--esa-transition-fast),opacity var(--esa-transition-fast)}a:hover{color:var(--esa-text-primary)}strong,b{font-weight:600;color:var(--esa-text-primary)}code,kbd{font-family:var(--esa-font-mono);font-size:.875em}code{background:var(--esa-bg-raised);border:1px solid var(--esa-border-subtle);border-radius:var(--esa-radius-sm);padding:.1em .35em;color:var(--esa-accent-primary)}kbd{background:var(--esa-bg-overlay);border:1px solid var(--esa-border-default);border-bottom-width:2px;border-radius:var(--esa-radius-sm);padding:.1em .5em;color:var(--esa-text-secondary);font-size:var(--esa-text-xs);letter-spacing:var(--esa-tracking-wide)}main{flex:1;padding-top:var(--esa-nav-height)}.container{width:100%;max-width:var(--esa-content-max);margin-inline:auto;padding-inline:var(--esa-space-6)}.container--catalog{max-width:var(--esa-catalog-max)}.site-header{position:fixed;top:0;left:0;right:0;height:var(--esa-nav-height);background:hsl(222,30%,5%,.85);backdrop-filter:blur(12px)saturate(180%);-webkit-backdrop-filter:blur(12px)saturate(180%);border-bottom:1px solid var(--esa-border-subtle);z-index:var(--esa-z-sticky)}.site-nav{display:flex;align-items:center;gap:var(--esa-space-8);height:100%;max-width:var(--esa-content-max);margin-inline:auto;padding-inline:var(--esa-space-6)}.site-nav__brand{display:flex;align-items:center;gap:var(--esa-space-2);color:var(--esa-text-primary);font-weight:700;font-size:var(--esa-text-md);letter-spacing:var(--esa-tracking-tight);flex-shrink:0}.site-nav__brand:hover{color:var(--esa-accent-primary)}.site-nav__logo{font-size:1.4em;color:var(--esa-accent-primary);filter:drop-shadow(0 0 8px var(--esa-accent-primary-glow))}.site-nav__links{display:flex;align-items:center;gap:var(--esa-space-2);flex:1}.site-nav__link{color:var(--esa-text-secondary);font-size:var(--esa-text-sm);font-weight:500;padding:var(--esa-space-2)var(--esa-space-3);border-radius:var(--esa-radius-md);transition:color var(--esa-transition-fast),background var(--esa-transition-fast);letter-spacing:var(--esa-tracking-wide)}.site-nav__link:hover,.site-nav__link.is-active{color:var(--esa-text-primary);background:var(--esa-bg-raised)}.site-nav__link.is-active{color:var(--esa-accent-primary)}.site-nav__actions{display:flex;align-items:center;gap:var(--esa-space-4);margin-left:auto}.streak-badge{display:flex;align-items:center;gap:var(--esa-space-1);background:var(--esa-bg-raised);border:1px solid var(--esa-border-subtle);border-radius:var(--esa-radius-full);padding:var(--esa-space-1)var(--esa-space-3);cursor:default}.streak-badge__count{font-size:var(--esa-text-sm);font-weight:600;color:var(--esa-mastery-progress);font-variant-numeric:tabular-nums}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--esa-space-2);font-family:var(--esa-font-ui);font-size:var(--esa-text-sm);font-weight:600;line-height:1;letter-spacing:var(--esa-tracking-wide);border:none;border-radius:var(--esa-radius-lg);padding:var(--esa-space-3)var(--esa-space-5);cursor:pointer;transition:background var(--esa-transition-fast),box-shadow var(--esa-transition-fast),transform var(--esa-transition-fast),color var(--esa-transition-fast);text-decoration:none;user-select:none;white-space:nowrap}.btn:active{transform:scale(.97)}.btn--primary{background:var(--esa-accent-primary);color:#090b11}.btn--primary:hover{background:#8277f8;box-shadow:var(--esa-shadow-glow)}.btn--ghost{background:0 0;color:var(--esa-text-secondary);border:1px solid var(--esa-border-default)}.btn--ghost:hover{background:var(--esa-bg-raised);color:var(--esa-text-primary);border-color:var(--esa-border-strong)}.btn--icon{padding:var(--esa-space-3);border-radius:var(--esa-radius-full);aspect-ratio:1}.card{background:var(--esa-bg-base);border:1px solid var(--esa-border-subtle);border-radius:var(--esa-radius-xl);padding:var(--esa-space-6);transition:border-color var(--esa-transition-fast),box-shadow var(--esa-transition-fast)}.card:hover{border-color:var(--esa-border-default);box-shadow:var(--esa-shadow-md)}.badge{display:inline-flex;align-items:center;gap:var(--esa-space-1);font-size:var(--esa-text-xs);font-weight:600;letter-spacing:var(--esa-tracking-wider);text-transform:uppercase;border-radius:var(--esa-radius-full);padding:.2em .65em}.badge--level{background:var(--esa-accent-primary-subtle);color:var(--esa-accent-primary);border:1px solid var(--esa-accent-primary-dim)}.badge--mastery-new{background:#272b35;color:var(--esa-mastery-new)}.badge--mastery-in-progress{background:#3d2f0f;color:var(--esa-mastery-progress)}.badge--mastery-practiced{background:#142914;color:var(--esa-mastery-practiced)}.badge--mastery-mastered{background:#312e0c;color:var(--esa-mastery-mastered)}.player-placeholder{display:flex;align-items:center;justify-content:center;min-height:60vh;padding:var(--esa-space-16)}.player-placeholder__label{font-size:var(--esa-text-sm);color:var(--esa-text-tertiary);letter-spacing:var(--esa-tracking-wider);text-transform:uppercase}.site-footer{border-top:1px solid var(--esa-border-subtle);padding:var(--esa-space-6);text-align:center}.site-footer__text{font-size:var(--esa-text-xs);color:var(--esa-text-tertiary);letter-spacing:var(--esa-tracking-wide)}.site-footer__link{color:var(--esa-text-tertiary)}.site-footer__link:hover{color:var(--esa-text-secondary)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--esa-border-default);border-radius:var(--esa-radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--esa-border-strong)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.text-secondary{color:var(--esa-text-secondary)}.text-tertiary{color:var(--esa-text-tertiary)}.font-mono{font-family:var(--esa-font-mono)}.font-medium{font-weight:500}.font-semibold{font-weight:600}@keyframes pulse-glow{0%,100%{box-shadow:0 0 8px var(--esa-accent-primary-glow)}50%{box-shadow:0 0 24px var(--esa-accent-primary-glow),0 0 48px var(--esa-accent-primary-glow)}}@keyframes fade-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.animate-fade-in{animation:fade-in var(--esa-transition-base)ease forwards}@media(max-width:768px){.site-nav__links{display:none}.container{padding-inline:var(--esa-space-4)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}