.learn-root{--color-bg:#191919;--color-surface:#1a1a1a;--color-surface-2:#1e1e1e;--color-surface-3:#222;--color-border:#ffffff14;--color-text:#e8e8f0;--color-text-dim:#6b6b80;--color-accent:#7ecfcf;--color-record:#ef4444;--color-play:#22c55e;--color-brand-pink:#ec4899;--color-brand-purple:#8b5cf6;--color-brand-blue:#3b82f6;--color-brand-teal:#06b6d4;--gradient-brand:linear-gradient(90deg, #ec4899, #8b5cf6, #3b82f6, #06b6d4);--glass-blur:blur(20px);--glass-blur-sm:blur(10px);--glass-border:1px solid #ffffff14;--glass-border-light:1px solid #ffffff1a;--glass-shadow:0 4px 24px #0000004d;--glass-shadow-deep:0 8px 32px #0006;--glass-glow:inset 0 1px 0 #ffffff0a;--glass-highlight:inset 0 1px 0 #ffffff1a;--color-scrollbar-thumb:#ffffff14;--grain-texture:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");color:var(--color-text);-webkit-font-smoothing:antialiased;font-family:Glacial Indifference,Haskoy,system-ui,sans-serif}.learn-root,.learn-root *,.learn-root :before,.learn-root :after{border-color:var(--color-border)}.learn-root .brand-gradient-text{background:var(--gradient-brand);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.learn-root .glass-panel{-webkit-backdrop-filter:var(--glass-blur);box-shadow:var(--glass-highlight), var(--glass-shadow);position:relative}.learn-root .glass-panel:before{content:"";background:var(--grain-texture);opacity:.03;pointer-events:none;z-index:1;border-radius:inherit;background-size:128px 128px;position:absolute;inset:0}.learn-root .glass-panel-sm{-webkit-backdrop-filter:var(--glass-blur-sm);box-shadow:var(--glass-glow);position:relative}.learn-root .glass-panel-sm:before{content:"";background:var(--grain-texture);opacity:.02;pointer-events:none;z-index:1;border-radius:inherit;background-size:128px 128px;position:absolute;inset:0}.learn-root ::-webkit-scrollbar{width:6px;height:6px}.learn-root ::-webkit-scrollbar-track{background:0 0}.learn-root ::-webkit-scrollbar-thumb{background:var(--color-scrollbar-thumb);border-radius:3px}.learn-root ::-webkit-scrollbar-thumb:hover{background:#ffffff24}@keyframes genre-glow{0%{box-shadow:0 0 #7ecfcf66}50%{box-shadow:0 0 16px 4px #7ecfcf40}to{box-shadow:0 0 #7ecfcf00}}.learn-root .genre-highlight{animation:2.5s ease-out genre-glow}