@import"https://fonts.googleapis.com/css2?family=Anton&family=Bebas+Neue&family=JetBrains+Mono:wght@400;500;600;700&family=Permanent+Marker&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{--void: #0a0a0a;--abyss: #141414;--smoke: #1a1a1a;--ash: #2a2a2a;--ember: #404040;--charcoal: #333333;--neon-cyan: #00f5ff;--neon-cyan-muted: #00b8c4;--neon-magenta: #ff00aa;--neon-magenta-muted: #c4007f;--toxic-green: #39ff14;--toxic-green-muted: #2bc40f;--blaze-orange: #ff6a00;--blaze-orange-muted: #c45200;--void-purple: #8b00ff;--void-purple-muted: #6b00c4;--blood-red: #dc143c;--text-primary: #f0f0f0;--text-secondary: #a0a0a0;--text-muted: #606060;--text-inverse: #0a0a0a;--color-success: var(--toxic-green);--color-warning: var(--blaze-orange);--color-error: var(--blood-red);--color-info: var(--neon-cyan);--color-spotify: #1db954;--glow-cyan: 0 0 10px var(--neon-cyan), 0 0 20px rgba(0, 245, 255, .5), 0 0 40px rgba(0, 245, 255, .25);--glow-magenta: 0 0 10px var(--neon-magenta), 0 0 20px rgba(255, 0, 170, .5), 0 0 40px rgba(255, 0, 170, .25);--glow-green: 0 0 10px var(--toxic-green), 0 0 20px rgba(57, 255, 20, .5), 0 0 40px rgba(57, 255, 20, .25);--glow-orange: 0 0 10px var(--blaze-orange), 0 0 20px rgba(255, 106, 0, .5), 0 0 40px rgba(255, 106, 0, .25);--glow-purple: 0 0 10px var(--void-purple), 0 0 20px rgba(139, 0, 255, .5), 0 0 40px rgba(139, 0, 255, .25);--glow-subtle-cyan: 0 0 20px rgba(0, 245, 255, .3);--glow-subtle-magenta: 0 0 20px rgba(255, 0, 170, .3);--font-display: "Bebas Neue", "Anton", sans-serif;--font-accent: "Permanent Marker", cursive;--font-body: "Space Grotesk", sans-serif;--font-mono: "JetBrains Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.25rem;--text-xl: 1.5rem;--text-2xl: 2rem;--text-3xl: 3rem;--text-4xl: 4rem;--text-5xl: 5rem;--text-6xl: 6rem;--leading-none: 1;--leading-tight: 1.15;--leading-snug: 1.25;--leading-normal: 1.5;--leading-relaxed: 1.625;--tracking-tighter: -.05em;--tracking-tight: -.025em;--tracking-normal: 0;--tracking-wide: .025em;--tracking-wider: .05em;--tracking-widest: .1em;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 2.5rem;--space-8: 3rem;--space-10: 4rem;--space-12: 6rem;--space-16: 8rem;--space-20: 10rem;--radius-none: 0;--radius-sm: 2px;--radius-md: 4px;--radius-lg: 8px;--radius-full: 9999px;--border-thin: 1px;--border-medium: 2px;--border-thick: 3px;--border-chunky: 4px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .5);--shadow-md: 0 4px 6px rgba(0, 0, 0, .5);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .5);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .5);--shadow-inner: inset 0 2px 4px rgba(0, 0, 0, .5);--shadow-lifted: 0 20px 40px rgba(0, 0, 0, .4), 0 10px 20px rgba(0, 0, 0, .3);--z-base: 0;--z-elevated: 10;--z-sticky: 50;--z-dropdown: 100;--z-overlay: 500;--z-modal: 1000;--z-toast: 2000;--z-max: 9999;--duration-instant: 50ms;--duration-fast: .15s;--duration-normal: .3s;--duration-slow: .5s;--duration-slower: .8s;--ease-linear: linear;--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--ease-out-back: cubic-bezier(.34, 1.56, .64, 1);--ease-bounce: cubic-bezier(.68, -.55, .265, 1.55);--transition-fast: all var(--duration-fast) var(--ease-out);--transition-normal: all var(--duration-normal) var(--ease-out);--transition-slow: all var(--duration-slow) var(--ease-out-expo);--transition-colors: color var(--duration-fast) var(--ease-out), background-color var(--duration-fast) var(--ease-out), border-color var(--duration-fast) var(--ease-out);--transition-transform: transform var(--duration-normal) var(--ease-out-expo);--transition-opacity: opacity var(--duration-normal) var(--ease-out);--bp-sm: 640px;--bp-md: 768px;--bp-lg: 1024px;--bp-xl: 1280px;--bp-2xl: 1536px;--gradient-primary: linear-gradient(135deg, var(--neon-cyan) 0%, var(--void-purple) 100%);--gradient-warm: linear-gradient(135deg, var(--blaze-orange) 0%, var(--neon-magenta) 100%);--gradient-success: linear-gradient(135deg, var(--toxic-green) 0%, var(--neon-cyan) 100%);--gradient-mesh: radial-gradient(ellipse at 20% 80%, rgba(255, 0, 170, .15) 0%, transparent 50%), radial-gradient(ellipse at 80% 20%, rgba(0, 245, 255, .1) 0%, transparent 50%), radial-gradient(ellipse at 50% 50%, rgba(139, 0, 255, .08) 0%, transparent 60%);--gradient-shimmer: linear-gradient( 90deg, transparent 0%, rgba(255, 255, 255, .05) 50%, transparent 100% );--noise-pattern: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E")}*,*:before,*:after{box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--text-primary);background-color:var(--void);min-height:100vh}.textured{position:relative}.textured:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:var(--noise-pattern);opacity:.03;pointer-events:none;z-index:1}.bg-mesh{background:var(--gradient-mesh),var(--void)}.glow-cyan{box-shadow:var(--glow-cyan)}.glow-magenta{box-shadow:var(--glow-magenta)}.glow-green{box-shadow:var(--glow-green)}.glow-orange{box-shadow:var(--glow-orange)}.glow-purple{box-shadow:var(--glow-purple)}.text-glow-cyan{text-shadow:0 0 10px var(--neon-cyan),0 0 20px rgba(0,245,255,.5)}.text-glow-magenta{text-shadow:0 0 10px var(--neon-magenta),0 0 20px rgba(255,0,170,.5)}.text-glow-green{text-shadow:0 0 10px var(--toxic-green),0 0 20px rgba(57,255,20,.5)}.heading-display{font-family:var(--font-display);text-transform:uppercase;letter-spacing:var(--tracking-tight);line-height:var(--leading-none)}.heading-accent{font-family:var(--font-accent);letter-spacing:var(--tracking-normal)}.text-mono{font-family:var(--font-mono)}@keyframes pulse-glow{0%,to{opacity:1}50%{opacity:.7}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes scan-line{0%{top:0}to{top:100%}}@keyframes gradient-shift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.animate-pulse-glow{animation:pulse-glow 2s ease-in-out infinite}.animate-shimmer{animation:shimmer 2s linear infinite}.animate-fade-up{animation:fade-up var(--duration-slow) var(--ease-out-expo) forwards}.animate-scale-in{animation:scale-in var(--duration-normal) var(--ease-out-back) forwards}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.touch-target{min-width:48px;min-height:48px}.stack-mobile{display:flex;flex-direction:column;gap:var(--space-3)}@media (min-width: 768px){.stack-mobile{flex-direction:row}}.full-mobile{width:100%}@media (min-width: 768px){.full-mobile{width:auto}}.hide-mobile{display:none}@media (min-width: 768px){.hide-mobile{display:block}.hide-desktop{display:none}}@media (hover: none) and (pointer: coarse){.hover-lift:hover{transform:none}.hover-glow:hover{box-shadow:none}.touch-feedback:active{transform:scale(.98);transition:transform .1s ease}button,a,[role=button],.clickable{-webkit-tap-highlight-color:rgba(0,245,255,.2)}button,[role=button],.clickable{-webkit-user-select:none;user-select:none}}.container{width:100%;max-width:1200px;margin:0 auto;padding-left:var(--space-4);padding-right:var(--space-4)}@media (min-width: 768px){.container{padding-left:var(--space-6);padding-right:var(--space-6)}}.text-responsive-hero{font-size:clamp(2.5rem,8vw,6rem)}.text-responsive-title{font-size:clamp(1.75rem,5vw,2.5rem)}.text-responsive-body{font-size:clamp(.875rem,2.5vw,1rem)}input,select,textarea{font-size:16px}@media (min-width: 768px){input,select,textarea{font-size:inherit}}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,0)}.safe-area-top{padding-top:env(safe-area-inset-top,0)}.sticky-bottom-cta{position:fixed;bottom:0;left:0;right:0;padding:var(--space-4);padding-bottom:calc(var(--space-4) + env(safe-area-inset-bottom,0));background:linear-gradient(to top,var(--void) 80%,transparent);z-index:var(--z-sticky)}.grid-auto-fit{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--grid-min, 280px),1fr));gap:var(--space-4)}.grid-2-4{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}@media (min-width: 768px){.grid-2-4{grid-template-columns:repeat(4,1fr);gap:var(--space-4)}}.grid-1-2{display:grid;grid-template-columns:1fr;gap:var(--space-3)}@media (min-width: 768px){.grid-1-2{grid-template-columns:repeat(2,1fr);gap:var(--space-4)}}.app-container{display:flex;flex-direction:column;min-height:100vh;background:var(--gradient-mesh),var(--void)}.app-header{background-color:var(--abyss);border-bottom:1px solid var(--ash);position:sticky;top:0;z-index:var(--z-sticky)}.header-content{max-width:1200px;margin:0 auto;padding:var(--space-4) var(--space-6);display:flex;justify-content:space-between;align-items:center}.header-logo{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:var(--tracking-tight);margin:0;color:var(--neon-cyan);text-shadow:0 0 20px rgba(0,245,255,.4)}.header-right{display:flex;align-items:center}.profile-container{position:relative}.user-profile{display:flex;align-items:center;gap:var(--space-2);cursor:pointer;padding:var(--space-2);border-radius:var(--radius-md);transition:var(--transition-fast)}.user-profile:hover{background-color:var(--smoke)}.user-avatar{width:36px;height:36px;border-radius:var(--radius-full);overflow:hidden;background-color:var(--smoke);display:flex;align-items:center;justify-content:center;border:2px solid var(--ash)}.user-avatar img{width:100%;height:100%;object-fit:cover}.avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);color:var(--text-inverse);font-weight:var(--font-semibold);font-size:var(--text-base)}.user-name{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-primary)}.chevron-icon{color:var(--text-muted)}.profile-dropdown{position:absolute;top:calc(100% + var(--space-2));right:0;background-color:var(--abyss);border:1px solid var(--ash);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);min-width:150px;padding:var(--space-2) 0;z-index:var(--z-dropdown)}.dropdown-item{width:100%;padding:var(--space-3) var(--space-4);background:none;border:none;text-align:left;cursor:pointer;font-size:var(--text-sm);color:var(--text-secondary);transition:var(--transition-fast);font-family:var(--font-body)}.dropdown-item:hover{background-color:var(--smoke);color:var(--text-primary)}.main-content{flex:1;padding:var(--space-6)}@media (max-width: 768px){.header-content{padding:var(--space-4)}.header-logo{font-size:var(--text-lg)}.user-name{display:none}}.login-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--space-6);background:var(--gradient-mesh),var(--void);position:relative}.login-page:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:var(--noise-pattern);opacity:.03;pointer-events:none;z-index:0}.login-container{position:relative;z-index:1;max-width:600px;width:100%;background:var(--abyss);border:2px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-8);text-align:center}.login-container h1,.login-title{font-family:var(--font-display);font-size:var(--text-3xl);letter-spacing:var(--tracking-tight);margin:0 0 var(--space-2) 0;color:var(--neon-cyan);text-shadow:0 0 30px rgba(0,245,255,.5)}.tagline,.login-tagline{font-size:var(--text-lg);color:var(--text-secondary);margin:0 0 var(--space-6) 0}.visual-example{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--space-5);margin:var(--space-6) 0;padding:var(--space-5);background:var(--smoke);border:1px solid var(--ash);border-radius:var(--radius-md)}.example-poster{width:160px;min-height:220px;background:linear-gradient(135deg,rgba(139,0,255,.3) 0%,transparent 50%),linear-gradient(225deg,rgba(255,0,170,.2) 0%,transparent 50%),var(--void);border:2px solid var(--ash);border-radius:var(--radius-sm);padding:var(--space-3);display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden}.example-poster:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:var(--noise-pattern);opacity:.05;pointer-events:none}.poster-header{font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:var(--tracking-tight);color:var(--neon-cyan);text-shadow:0 0 20px rgba(0,245,255,.5);margin-bottom:2px}.poster-year{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--space-3)}.poster-lineup{display:flex;flex-direction:column;gap:2px;margin-bottom:var(--space-3)}.poster-lineup .headliner{font-family:var(--font-display);font-size:var(--text-base);color:var(--text-primary);letter-spacing:var(--tracking-wide)}.poster-lineup .artist{font-family:var(--font-display);font-size:var(--text-sm);color:var(--text-secondary);letter-spacing:var(--tracking-wide)}.poster-lineup .artist-small{font-family:var(--font-body);font-size:9px;color:var(--text-muted);letter-spacing:.5px;margin-top:2px}.poster-footer{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);letter-spacing:var(--tracking-wider);margin-top:auto;padding-top:var(--space-2);border-top:1px solid var(--ash);width:100%}.example-arrow{font-size:var(--text-2xl);color:var(--neon-magenta);font-weight:var(--font-bold);text-shadow:0 0 15px rgba(255,0,170,.5)}.example-playlist{width:180px;background:var(--abyss);border:2px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-3);text-align:left}.playlist-header-row{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-3);padding-bottom:var(--space-2);border-bottom:1px solid var(--ash)}.playlist-icon{color:var(--color-spotify);font-size:var(--text-lg)}.playlist-header-row span:last-child{font-family:var(--font-display);font-size:var(--text-sm);color:var(--text-primary);letter-spacing:var(--tracking-tight)}.playlist-tracks{display:flex;flex-direction:column;gap:var(--space-2)}.track-row{display:flex;flex-direction:column;gap:1px}.track-row .track-title{font-size:var(--text-sm);color:var(--text-primary);font-weight:var(--font-medium)}.track-row .track-artist{font-size:10px;color:var(--text-muted)}.playlist-footer{margin-top:var(--space-3);padding-top:var(--space-2);border-top:1px solid var(--ash);font-family:var(--font-mono);font-size:10px;color:var(--text-muted)}.poster-placeholder{width:160px;height:220px;background:var(--gradient-warm);border-radius:var(--radius-md);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-inverse);padding:var(--space-4);font-family:var(--font-display);font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase}.playlist-preview,.playlist-mockup{width:180px;background:var(--abyss);border:2px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-4)}.playlist-header{font-family:var(--font-display);font-size:var(--text-sm);margin-bottom:var(--space-3);color:var(--text-primary);text-align:left;letter-spacing:var(--tracking-wide)}.track-item,.playlist-item{padding:var(--space-2) 0;border-bottom:1px solid var(--ash);text-align:left;font-size:var(--text-sm);color:var(--text-secondary)}.track-item:last-child,.playlist-item:last-child{border-bottom:none}.track-info{display:flex;flex-direction:column}.track-name{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--text-primary);margin-bottom:2px}.explanation,.login-explanation{margin:var(--space-5) 0 var(--space-4)}.explanation p,.login-explanation p{font-size:var(--text-base);color:var(--text-secondary);line-height:var(--leading-relaxed);margin:0}.why-spotify{margin-top:var(--space-4)}.why-spotify p{font-size:var(--text-sm);color:var(--text-muted);margin:0}.error-message,.login-error{margin-bottom:var(--space-4);padding:var(--space-3);background:#dc143c1a;border:1px solid var(--blood-red);border-radius:var(--radius-md)}.error-message p,.login-error p{font-size:var(--text-sm);color:var(--blood-red);margin:0}.login-button-container{display:flex;justify-content:center;margin-top:var(--space-5)}@media (max-width: 640px){.login-page{padding:var(--space-4)}.login-container{padding:var(--space-6) var(--space-4)}.login-container h1,.login-title{font-size:var(--text-2xl)}.tagline,.login-tagline{font-size:var(--text-base)}.visual-example{flex-direction:column;gap:var(--space-4);padding:var(--space-4)}.example-arrow{transform:rotate(90deg)}.example-poster{width:100%;max-width:180px}.example-playlist,.poster-placeholder,.playlist-preview,.playlist-mockup{width:100%;max-width:200px}}.editable-artist-list{width:100%}.add-artist-section{margin-bottom:var(--space-5)}.add-artist-section .MuiTextField-root{background:var(--smoke);border-radius:var(--radius-md)}.add-artist-section .MuiOutlinedInput-root{background:var(--smoke);color:var(--text-primary);font-family:var(--font-body)}.add-artist-section .MuiOutlinedInput-root:hover,.add-artist-section .MuiOutlinedInput-root.Mui-focused{background:var(--abyss)}.add-artist-section .MuiOutlinedInput-notchedOutline{border-color:var(--ash);border-width:2px}.add-artist-section .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline{border-color:var(--neon-cyan)}.add-artist-section .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{border-color:var(--neon-cyan);box-shadow:var(--glow-subtle-cyan)}.add-artist-section .MuiInputLabel-root{color:var(--text-muted)}.add-artist-section .MuiInputLabel-root.Mui-focused{color:var(--neon-cyan)}.add-artist-section .MuiInputBase-input{color:var(--text-primary)}.add-artist-section .MuiInputBase-input::placeholder{color:var(--text-muted);opacity:1}.add-hint{display:block;margin-top:var(--space-1);color:var(--text-muted);font-size:var(--text-xs)}.artist-chips-container{background:var(--smoke);border:1px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-4)}.chips-header{color:var(--text-secondary);margin-bottom:var(--space-3);font-weight:var(--font-medium);display:flex;justify-content:space-between;align-items:center}.edit-hint{font-size:var(--text-xs);color:var(--text-muted);font-weight:var(--font-normal)}.artist-chips{display:flex;flex-wrap:wrap;gap:var(--space-3);max-height:400px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.artist-chips .MuiChip-root{background:var(--abyss);color:var(--text-primary);border:1px solid var(--ash);font-size:var(--text-base);font-family:var(--font-body);cursor:pointer;transition:var(--transition-fast);height:auto;padding:var(--space-2) var(--space-1)}.artist-chips .MuiChip-label{padding:0 var(--space-2)}.artist-chips .MuiChip-root:hover{background:var(--charcoal);border-color:var(--neon-cyan)}.artist-chips .MuiChip-deleteIcon{color:var(--text-muted);transition:var(--transition-fast);font-size:1.25rem;margin-right:var(--space-1)}.artist-chips .MuiChip-deleteIcon:hover{color:var(--blood-red)}.artist-chips .uncertain-chip{background:#ff6a0026;border-color:var(--blaze-orange);color:var(--blaze-orange)}.artist-chips .uncertain-chip:hover{background:#ff6a0040}.chip-edit-container{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--abyss);border:2px solid var(--neon-cyan);border-radius:var(--radius-full);padding:var(--space-2) var(--space-3);box-shadow:var(--glow-subtle-cyan)}.chip-edit-input{border:none;outline:none;font-size:var(--text-base);font-family:var(--font-body);padding:var(--space-1) 0;width:140px;background:transparent;color:var(--text-primary)}.chip-edit-action{font-size:22px!important;cursor:pointer;padding:var(--space-1);border-radius:var(--radius-full);transition:var(--transition-fast)}.chip-edit-action.save{color:var(--toxic-green)}.chip-edit-action.save:hover{background:#39ff1426}.chip-edit-action.cancel{color:var(--text-muted)}.chip-edit-action.cancel:hover{color:var(--blood-red);background:#dc143c26}.artist-chips::-webkit-scrollbar{width:6px}.artist-chips::-webkit-scrollbar-track{background:var(--smoke);border-radius:var(--radius-full)}.artist-chips::-webkit-scrollbar-thumb{background:var(--ash);border-radius:var(--radius-full)}.artist-chips::-webkit-scrollbar-thumb:hover{background:var(--ember)}@media (hover: none) and (pointer: coarse){.artist-chips-container{touch-action:pan-y}.artist-chips{scroll-behavior:smooth}}.upload-page{min-height:calc(100dvh - 80px);display:flex;flex-direction:column;align-items:center;padding:var(--space-8) var(--space-4);position:relative}@supports not (min-height: 100dvh){.upload-page{min-height:calc(100vh - 80px)}}.upload-header{text-align:center;margin-bottom:var(--space-8);max-width:600px;animation:fade-up var(--duration-slow) var(--ease-out-expo) forwards}.upload-header h1{font-family:var(--font-display);font-size:clamp(2rem,6vw,var(--text-3xl));letter-spacing:var(--tracking-tight);margin:0 0 var(--space-4) 0;color:var(--text-primary);line-height:var(--leading-tight)}.upload-header .subtitle{color:var(--text-secondary);margin:0;font-size:var(--text-lg);line-height:var(--leading-relaxed)}.input-card{background:var(--abyss);border:2px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-6);width:100%;max-width:500px;animation:fade-up var(--duration-slow) var(--ease-out-expo) .1s forwards;opacity:0}.input-group{margin-bottom:var(--space-5)}.input-group:last-of-type{margin-bottom:0}.input-label{display:block;font-family:var(--font-display);font-size:var(--text-sm);letter-spacing:var(--tracking-widest);color:var(--text-muted);margin-bottom:var(--space-3);text-transform:uppercase}.festival-input-row{display:flex;gap:var(--space-3)}.text-input{flex:1;padding:var(--space-4);background:var(--smoke);border:2px solid var(--ash);border-radius:var(--radius-md);font-family:var(--font-body);font-size:16px;color:var(--text-primary);transition:var(--transition-fast)}.text-input:hover{border-color:var(--ember)}.text-input:focus{outline:none;border-color:var(--neon-cyan);box-shadow:var(--glow-subtle-cyan);background:var(--abyss)}.text-input:disabled{background:var(--smoke);color:var(--text-muted);cursor:not-allowed}.text-input::placeholder{color:var(--text-muted)}.year-select{padding:var(--space-4);background:var(--smoke);border:2px solid var(--ash);border-radius:var(--radius-md);font-family:var(--font-body);font-size:16px;color:var(--text-primary);cursor:pointer;min-width:100px;transition:var(--transition-fast)}.year-select:hover{border-color:var(--ember)}.year-select:focus{outline:none;border-color:var(--neon-cyan);box-shadow:var(--glow-subtle-cyan);background:var(--abyss)}.search-button{width:100%;background:var(--gradient-primary);color:var(--text-inverse);padding:var(--space-4) var(--space-6);border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:var(--tracking-wide);cursor:pointer;transition:var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:var(--space-3);margin-top:var(--space-5);box-shadow:var(--glow-subtle-cyan);min-height:56px}.search-button:hover:not(:disabled){transform:scale(1.02);box-shadow:var(--glow-cyan)}.search-button:active:not(:disabled){transform:scale(.98)}.search-button:disabled{background:var(--ash);color:var(--text-muted);cursor:not-allowed;transform:none;box-shadow:none}.poster-fallback{margin-top:var(--space-5)}.fallback-divider{display:flex;align-items:center;margin:var(--space-5) 0;color:var(--text-muted);font-size:var(--text-sm);font-weight:var(--font-medium)}.fallback-divider:before,.fallback-divider:after{content:"";flex:1;height:1px;background:var(--ash)}.fallback-divider span{padding:0 var(--space-4)}.fallback-actions{display:flex;gap:var(--space-4);margin-top:var(--space-5)}.fallback-actions .extract-button{flex:1}.try-again-button{background:transparent;border:2px solid var(--ash);color:var(--text-secondary);padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:var(--transition-fast);white-space:nowrap}.try-again-button:hover:not(:disabled){border-color:var(--text-muted);color:var(--text-primary)}.try-again-button:disabled{opacity:.5;cursor:not-allowed}.poster-dropzone{border:2px dashed var(--ash);border-radius:var(--radius-md);padding:var(--space-8) var(--space-6);text-align:center;cursor:pointer;transition:var(--transition-fast);display:flex;flex-direction:column;align-items:center;gap:var(--space-3);background:var(--smoke)}.poster-dropzone:hover{border-color:var(--neon-magenta);background:#ff00aa0d;box-shadow:var(--glow-subtle-magenta)}.poster-dropzone .upload-icon{font-size:3rem;color:var(--text-muted);transition:var(--transition-fast)}.poster-dropzone:hover .upload-icon{color:var(--neon-magenta)}.poster-dropzone span{color:var(--text-secondary);font-size:var(--text-sm)}.poster-dropzone .file-hint{font-size:var(--text-xs);color:var(--text-muted)}.poster-preview-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.poster-preview{max-width:100%;max-height:220px;border-radius:var(--radius-md);object-fit:contain;border:2px solid var(--ash)}.remove-poster-btn{background:transparent;border:1px solid var(--ash);color:var(--text-muted);padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);cursor:pointer;transition:var(--transition-fast)}.remove-poster-btn:hover{border-color:var(--blood-red);color:var(--blood-red)}.status-text{text-align:center;color:var(--neon-cyan);font-weight:var(--font-medium);margin-top:var(--space-5)}.upload-page .MuiAlert-root{margin-top:var(--space-5);border-radius:var(--radius-md);background:#dc143c1a;border:1px solid var(--blood-red);color:var(--blood-red)}.extract-button{width:100%;background:transparent;color:var(--neon-magenta);padding:var(--space-4) var(--space-6);border:2px solid var(--neon-magenta);border-radius:var(--radius-md);font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:var(--tracking-wide);cursor:pointer;transition:var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:56px}.extract-button:hover:not(:disabled){background:#ff00aa1a;box-shadow:var(--glow-subtle-magenta)}.extract-button:active:not(:disabled){transform:scale(.98)}.extract-button:disabled{border-color:var(--ash);color:var(--text-muted);cursor:not-allowed;transform:none;box-shadow:none}.results-section{background:var(--abyss);border:2px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-6);width:100%;max-width:700px;animation:fade-up var(--duration-slow) var(--ease-out-expo) forwards}.results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-5);flex-wrap:wrap;gap:var(--space-3)}.results-header h2{margin:0;font-family:var(--font-display);font-size:var(--text-2xl);letter-spacing:var(--tracking-tight);color:var(--text-primary)}.source-badge{background:#39ff1426;color:var(--toxic-green);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wide);text-transform:uppercase}.results-poster{margin-bottom:var(--space-6);text-align:center}.results-poster img{max-width:100%;max-height:450px;border-radius:var(--radius-md);border:2px solid var(--ash);object-fit:contain}.source-link{margin-bottom:var(--space-5);font-size:var(--text-sm);color:var(--text-muted)}.source-link a{color:var(--neon-cyan);text-decoration:none;word-break:break-all;transition:var(--transition-fast)}.source-link a:hover{text-shadow:var(--glow-subtle-cyan)}.results-fallback{text-align:center;margin-top:var(--space-5)}.results-fallback-link{background:none;border:none;color:var(--text-muted);font-size:var(--text-sm);cursor:pointer;text-decoration:underline;padding:var(--space-2);transition:var(--transition-fast)}.results-fallback-link:hover{color:var(--neon-magenta)}.continue-section{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-6);padding-top:var(--space-6);border-top:1px solid var(--ash);gap:var(--space-4)}.continue-button{background:var(--gradient-primary);color:var(--text-inverse);padding:var(--space-4) var(--space-6);border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-size:var(--text-base);letter-spacing:var(--tracking-wide);cursor:pointer;transition:var(--transition-fast);box-shadow:var(--glow-subtle-cyan);min-height:48px}.continue-button:hover:not(:disabled){transform:scale(1.02);box-shadow:var(--glow-cyan)}.continue-button:disabled{background:var(--ash);color:var(--text-muted);cursor:not-allowed;box-shadow:none}.start-over-button{background:transparent;border:2px solid var(--ash);color:var(--text-secondary);padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:var(--transition-fast);min-height:48px}@media (max-width: 540px){.upload-page{padding:var(--space-5) var(--space-4)}.upload-header{margin-bottom:var(--space-6)}.upload-header h1{font-size:var(--text-2xl)}.upload-header .subtitle{font-size:var(--text-base)}.input-card{padding:var(--space-5)}.festival-input-row{flex-direction:column}.year-select{width:100%}.continue-section{flex-direction:column-reverse}.continue-button,.start-over-button{width:100%}.fallback-actions{flex-direction:column}.try-again-button{width:100%}}@media (hover: none) and (pointer: coarse){.search-button:active:not(:disabled),.extract-button:active:not(:disabled),.continue-button:active:not(:disabled){transform:scale(.98)}.poster-dropzone:active{border-color:var(--neon-magenta);background:#ff00aa0d}}.track-selection-page{min-height:calc(100vh - 80px);padding:var(--space-6) var(--space-4)}.loading-section{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center}.loading-section h2{margin:var(--space-5) 0 var(--space-2);color:var(--text-primary);font-family:var(--font-display);font-size:var(--text-2xl);letter-spacing:var(--tracking-tight)}.loading-section p{color:var(--text-secondary);margin:var(--space-1) 0}.loading-section .loading-hint{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--space-4)}.loading-section .MuiCircularProgress-root{color:var(--neon-cyan)}.progress-bar-container{width:100%;max-width:400px;margin:var(--space-5) auto var(--space-3)}.progress-status{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--text-secondary);margin:var(--space-2) 0}.progress-artist-name{font-size:var(--text-base);color:var(--text-muted);margin:var(--space-1) 0}.progress-artist-name strong{color:var(--neon-cyan)}.error-section{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;max-width:480px;margin:0 auto}.error-section .MuiAlert-root{background:#dc143c1a;border:1px solid var(--blood-red);color:var(--blood-red);border-radius:var(--radius-md)}.error-actions{display:flex;gap:var(--space-4);margin-top:var(--space-4)}.retry-button{background:var(--gradient-primary);color:var(--text-inverse);padding:var(--space-4) var(--space-6);border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-size:var(--text-base);letter-spacing:var(--tracking-wide);cursor:pointer;transition:var(--transition-fast);box-shadow:var(--glow-subtle-cyan)}.retry-button:hover{transform:scale(1.02);box-shadow:var(--glow-cyan)}.back-button{background:transparent;border:2px solid var(--ash);color:var(--text-secondary);padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:var(--transition-fast)}.back-button:hover{border-color:var(--text-muted);color:var(--text-primary)}.results-container{max-width:900px;margin:0 auto}.results-summary{text-align:center;margin-bottom:var(--space-8);animation:fade-up var(--duration-slow) var(--ease-out-expo) forwards}.results-summary h1{font-family:var(--font-display);font-size:var(--text-3xl);letter-spacing:var(--tracking-tight);color:var(--text-primary);margin:0 0 var(--space-2)}.results-summary p{color:var(--text-secondary);font-size:var(--text-lg);margin:0}.results-summary strong{color:var(--neon-cyan)}.artist-results{display:flex;flex-direction:column;gap:var(--space-5)}.artist-result-card{background:var(--abyss);border:2px solid var(--ash);border-radius:var(--radius-md);padding:var(--space-5);transition:var(--transition-fast);animation:fade-up var(--duration-slow) var(--ease-out-expo) forwards;opacity:0}.artist-result-card:nth-child(1){animation-delay:.05s}.artist-result-card:nth-child(2){animation-delay:.1s}.artist-result-card:nth-child(3){animation-delay:.15s}.artist-result-card:nth-child(4){animation-delay:.2s}.artist-result-card:nth-child(5){animation-delay:.25s}.artist-result-card:hover{border-color:var(--neon-cyan);box-shadow:var(--glow-subtle-cyan)}.artist-result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4);padding-bottom:var(--space-3);border-bottom:1px solid var(--ash)}.artist-name-link{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:var(--tracking-tight);color:var(--text-primary);text-decoration:none;transition:var(--transition-fast)}.artist-name-link:hover{color:var(--neon-cyan);text-shadow:var(--glow-subtle-cyan)}.artist-track-total{font-size:var(--text-sm);color:var(--text-muted);font-family:var(--font-mono)}.track-list{list-style:none;padding:0;margin:0}.track-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) 0;border-bottom:1px solid var(--ash);gap:var(--space-2)}.track-item:last-child{border-bottom:none}.track-name{font-size:var(--text-sm);color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.track-duration{font-size:var(--text-xs);color:var(--text-muted);font-family:var(--font-mono);flex-shrink:0}.track-familiar{background:#1db9540f;margin:0 calc(-1 * var(--space-3));padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm)}.familiar-badge{display:inline-block;font-size:10px;font-family:var(--font-mono);font-weight:var(--font-semibold);text-transform:uppercase;letter-spacing:.05em;color:#1db954;background:#1db9541f;padding:1px 6px;border-radius:var(--radius-sm);margin-right:var(--space-2);vertical-align:middle}.skipped-section{margin-top:var(--space-6);background:var(--abyss);border:1px solid var(--ash);border-radius:var(--radius-md);overflow:hidden}.skipped-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;padding:var(--space-4) var(--space-5);background:none;border:none;cursor:pointer;font-size:var(--text-base);font-weight:var(--font-medium);font-family:var(--font-body);color:var(--text-muted);transition:var(--transition-fast)}.skipped-toggle:hover{background:var(--smoke);color:var(--text-secondary)}.skipped-toggle svg{color:var(--text-muted)}.skipped-list{list-style:none;padding:0 var(--space-5) var(--space-4);margin:0}.skipped-item{display:flex;justify-content:space-between;align-items:center;padding:var(--space-3) 0;border-bottom:1px solid var(--ash)}.skipped-item:last-child{border-bottom:none}.skipped-name{font-size:var(--text-sm);color:var(--text-secondary)}.skipped-reason{font-size:var(--text-xs);color:var(--text-muted)}.action-section{display:flex;justify-content:space-between;align-items:center;margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--ash)}.start-over-button{background:transparent;border:2px solid var(--ash);color:var(--text-secondary);padding:var(--space-4) var(--space-6);border-radius:var(--radius-md);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:var(--transition-fast);min-height:52px}.start-over-button:hover{border-color:var(--text-muted);color:var(--text-primary)}.create-playlist-button{background:var(--gradient-primary);color:var(--text-inverse);padding:var(--space-4) var(--space-8);border:none;border-radius:var(--radius-md);font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:var(--tracking-wide);cursor:pointer;transition:var(--transition-fast);box-shadow:var(--glow-subtle-cyan);min-height:52px}.create-playlist-button:hover:not(:disabled){transform:scale(1.02);box-shadow:var(--glow-cyan)}.create-playlist-button:active:not(:disabled){transform:scale(.98)}.create-playlist-button:disabled{background:var(--ash);color:var(--text-muted);cursor:not-allowed;box-shadow:none}@media (max-width: 768px){.track-selection-page{padding:var(--space-5) var(--space-4)}.artist-result-header{flex-direction:column;align-items:flex-start;gap:var(--space-2)}.results-summary h1{font-size:var(--text-2xl)}.action-section{flex-direction:column-reverse;gap:var(--space-4)}.start-over-button,.create-playlist-button{width:100%}}@media (hover: none) and (pointer: coarse){.retry-button:active,.create-playlist-button:active:not(:disabled){transform:scale(.98)}.artist-result-card:hover{border-color:var(--ash);box-shadow:none}.artist-result-card:active{border-color:var(--neon-cyan)}}.results-page{max-width:1200px;margin:0 auto;padding:var(--space-6) var(--space-4)}.results-grid{display:grid;grid-template-columns:1fr;gap:var(--space-6)}.grid-full-width{grid-column:1 / -1}@media (min-width: 960px){.results-grid{grid-template-columns:1fr 1fr}.grid-artists{grid-column:1}.grid-artists.grid-artists-full{grid-column:1 / -1}.grid-skipped{grid-column:2}}.success-card{background:linear-gradient(135deg,var(--color-spotify) 0%,#1ed760 100%);color:#fff;text-align:center;border-radius:var(--radius-md)!important;box-shadow:0 0 40px #1db95466;animation:fade-up var(--duration-slow) var(--ease-out-expo) forwards}.success-content{padding:var(--space-8) var(--space-6)!important}.success-icon{font-size:64px!important;margin-bottom:var(--space-4);animation:scale-in var(--duration-normal) var(--ease-out-back) forwards}.success-title{font-family:var(--font-display)!important;font-size:var(--text-3xl)!important;letter-spacing:var(--tracking-tight)!important;font-weight:var(--font-bold)!important;margin-bottom:var(--space-2)!important}.playlist-name{opacity:.9;margin-bottom:var(--space-2)!important;font-size:var(--text-lg)!important}.playlist-stats{opacity:.85;margin-bottom:var(--space-6)!important;font-family:var(--font-mono)!important;font-size:var(--text-sm)!important;letter-spacing:var(--tracking-wide)!important}.open-spotify-button{background-color:#fff!important;color:var(--color-spotify)!important;font-weight:var(--font-semibold)!important;font-family:var(--font-body)!important;padding:var(--space-4) var(--space-8)!important;border-radius:var(--radius-full)!important;transition:var(--transition-fast)!important;min-height:52px!important}.open-spotify-button:hover{background-color:#f0f0f0!important;transform:scale(1.02);box-shadow:0 4px 20px #0003}.artists-card{background-color:var(--abyss)!important;border:2px solid var(--ash)!important;border-radius:var(--radius-md)!important;color:var(--text-primary);animation:fade-up var(--duration-slow) var(--ease-out-expo) .1s forwards;opacity:0}.section-title{color:var(--text-primary)!important;font-family:var(--font-display)!important;font-size:var(--text-xl)!important;letter-spacing:var(--tracking-tight)!important;font-weight:var(--font-semibold)!important}.artist-list{max-height:400px;overflow-y:auto}.artist-list-item{padding:var(--space-2) 0!important}.artist-check-icon{color:var(--toxic-green);margin-right:var(--space-3);font-size:20px!important}.skipped-card{background-color:var(--smoke)!important;border:1px solid var(--ash)!important;border-radius:var(--radius-md)!important;color:var(--text-primary);animation:fade-up var(--duration-slow) var(--ease-out-expo) .15s forwards;opacity:0}.skipped-list{max-height:300px;overflow-y:auto}.skipped-list-item{padding:var(--space-2) 0!important}.skipped-icon{color:var(--blaze-orange);margin-right:var(--space-3);font-size:20px!important}.artists-card .MuiListItemText-primary,.skipped-card .MuiListItemText-primary{color:var(--text-primary);font-family:var(--font-body)}.artists-card .MuiListItemText-secondary,.skipped-card .MuiListItemText-secondary{color:var(--text-muted);font-family:var(--font-body);font-size:var(--text-sm)}.artists-card .MuiDivider-root,.skipped-card .MuiDivider-root{border-color:var(--ash)}.artists-card .MuiCardContent-root,.skipped-card .MuiCardContent-root{padding:var(--space-5)!important}.artist-list::-webkit-scrollbar,.skipped-list::-webkit-scrollbar{width:6px}.artist-list::-webkit-scrollbar-track,.skipped-list::-webkit-scrollbar-track{background:var(--smoke);border-radius:var(--radius-full)}.artist-list::-webkit-scrollbar-thumb,.skipped-list::-webkit-scrollbar-thumb{background:var(--ash);border-radius:var(--radius-full)}.artist-list::-webkit-scrollbar-thumb:hover,.skipped-list::-webkit-scrollbar-thumb:hover{background:var(--ember)}.action-section{display:flex;justify-content:center;padding:var(--space-4) 0}.start-new-button{border:2px solid var(--neon-cyan)!important;color:var(--neon-cyan)!important;font-family:var(--font-body)!important;font-weight:var(--font-medium)!important;padding:var(--space-4) var(--space-8)!important;border-radius:var(--radius-md)!important;transition:var(--transition-fast)!important;min-height:52px!important}.start-new-button:hover{background-color:#00f5ff1a!important;box-shadow:var(--glow-subtle-cyan)}@media (max-width: 600px){.results-page{padding:var(--space-4) var(--space-3)}.success-content{padding:var(--space-6) var(--space-4)!important}.success-icon{font-size:48px!important}.success-title{font-size:var(--text-2xl)!important}.artist-list{max-height:300px}.skipped-list{max-height:200px}}@media (hover: none) and (pointer: coarse){.open-spotify-button:active{transform:scale(.98)}.start-new-button:active{background-color:#00f5ff26!important}}