*{margin:0;padding:0;box-sizing:border-box}:root{--noir-bg: #0a0a0f;--noir-surface: #12121a;--noir-card: #1a1a26;--noir-elevated: #22223a;--noir-gold: #e8c97a;--noir-gold-dim: #b89a4e;--noir-purple: #8b6fbe;--noir-purple-dim: #5c4a8a;--noir-text: #f0ede6;--noir-text-sub: #a8a5b0;--noir-muted: #7a7885;--noir-border: rgba(255, 255, 255, .07);--noir-border-md: rgba(255, 255, 255, .12);--noir-border-gold: rgba(232, 201, 122, .25);--noir-overlay: rgba(10, 10, 15, .85);--noir-glow: rgba(232, 201, 122, .08);--primary: hsl(260, 85%, 65%);--primary-dark: hsl(260, 85%, 55%);--primary-light: hsl(260, 85%, 75%);--secondary: hsl(340, 75%, 60%);--secondary-dark: hsl(340, 75%, 50%);--accent: hsl(180, 70%, 55%);--accent-dark: hsl(180, 70%, 45%);--success: hsl(140, 65%, 50%);--warning: hsl(45, 100%, 60%);--error: hsl(0, 70%, 55%);--bg-dark: hsl(240, 15%, 8%);--bg-darker: hsl(240, 18%, 5%);--bg-card: hsl(240, 12%, 12%);--bg-card-hover: hsl(240, 12%, 15%);--glass-bg: rgba(255, 255, 255, .05);--glass-border: rgba(255, 255, 255, .1);--text-primary: hsl(0, 0%, 98%);--text-secondary: hsl(0, 0%, 75%);--text-muted: hsl(0, 0%, 50%);--gradient-primary: linear-gradient(135deg, var(--primary), var(--secondary));--gradient-accent: linear-gradient(135deg, var(--accent), var(--primary));--gradient-bg: linear-gradient( 180deg, var(--bg-darker) 0%, var(--bg-dark) 100% );--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 16px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px rgba(160, 100, 255, .3);--space-xs: .5rem;--space-sm: 1rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 3rem;--space-xxl: 4rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .5s cubic-bezier(.4, 0, .2, 1);--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-heading: "Poppins", var(--font-body)}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--noir-bg)}body{font-family:var(--font-body);background:var(--noir-bg);color:var(--noir-text-sub);min-height:100vh;line-height:1.6;overflow-x:hidden}::selection{background:#e8c97a33;color:var(--noir-text)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--noir-bg)}::-webkit-scrollbar-thumb{background:var(--noir-elevated);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--noir-gold-dim)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:700;line-height:1.2;margin-bottom:var(--space-sm)}h1{font-size:clamp(2rem,5vw,3rem);color:var(--noir-text)}h2{font-size:clamp(1.5rem,4vw,2.25rem)}h3{font-size:clamp(1.25rem,3vw,1.75rem)}p{margin-bottom:var(--space-sm);color:var(--noir-text-sub)}#app{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-lg);padding-bottom:calc(var(--space-lg) + 2rem);position:relative}.container{width:100%;max-width:800px;margin:0 auto}.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);min-height:50vh}.spinner{width:60px;height:60px;border:4px solid var(--noir-border-md);border-top-color:var(--noir-gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.card{background:var(--noir-card);border:1px solid var(--noir-border);border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--shadow-md);transition:all var(--transition-base)}.card:hover{background:var(--noir-elevated);border-color:var(--noir-border-md);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-selectable{cursor:pointer;-webkit-user-select:none;user-select:none}.card-selectable.selected{background:var(--noir-elevated);border-color:var(--noir-gold);box-shadow:var(--shadow-lg),0 0 20px #e8c97a1f;transform:scale(1.02)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-lg);font-family:var(--font-heading);font-size:1rem;font-weight:600;border:none;border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-base);text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none}.btn-primary{background:var(--noir-gold);color:#0a0a0f;box-shadow:var(--shadow-md)}.btn-primary:hover{background:var(--noir-gold-dim);color:#0a0a0f;box-shadow:var(--shadow-lg);transform:translateY(-2px) scale(1.03)}.btn-primary:active{transform:translateY(0) scale(1)}.btn-secondary{background:var(--noir-card);color:var(--noir-text);border:1px solid var(--noir-border)}.btn-secondary:hover{background:var(--noir-elevated);border-color:var(--noir-gold)}.btn-ghost{background:transparent;color:var(--text-muted);border:none;font-size:.875rem;padding:var(--space-xs) var(--space-sm);cursor:pointer;transition:color var(--transition-fast)}.btn-ghost:hover{color:var(--text-secondary)}.favorite-saved-card{text-align:center;padding:var(--space-md) var(--space-lg);border:1px solid var(--primary);border-radius:var(--radius-lg)}.favorite-saved-label{font-size:.875rem;color:var(--text-muted);margin-bottom:var(--space-xs)}.favorite-saved-title{font-size:1.125rem;color:var(--text-primary)}.favorite-saved-year{color:var(--text-muted)}.btn-large{padding:var(--space-md) var(--space-xl);font-size:1.125rem}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.input-group{margin-bottom:var(--space-md)}.input-label{display:block;margin-bottom:var(--space-xs);font-weight:600;color:var(--noir-text)}.input{width:100%;padding:var(--space-sm) var(--space-md);background:var(--noir-card);border:1px solid var(--noir-border);border-radius:var(--radius-md);color:var(--noir-text);font-family:var(--font-body);font-size:1rem;transition:all var(--transition-base)}.input:focus{outline:none;border-color:var(--noir-gold);box-shadow:0 0 0 3px #e8c97a1a}.input::placeholder{color:var(--noir-muted)}.progress-container{margin-bottom:var(--space-xl);display:flex;align-items:flex-start;gap:var(--space-sm)}.progress-content{flex:1}.btn-back{background:transparent;border:1px solid var(--glass-border);color:var(--text-secondary);font-size:.875rem;padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-full);cursor:pointer;transition:color var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast);white-space:nowrap;flex-shrink:0}.btn-back:hover{color:var(--text-primary);border-color:var(--primary-light);background:var(--glass-bg)}.progress-bar{display:flex;gap:var(--space-xs);margin-bottom:var(--space-sm)}.progress-segment{flex:1;height:8px;background:var(--noir-elevated);border-radius:var(--radius-full);overflow:hidden;position:relative}.progress-segment.completed{background:var(--noir-gold)}.progress-segment.active{background:var(--noir-gold);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.progress-text{text-align:center;font-size:.875rem;color:var(--noir-text-sub)}.grid{display:grid;gap:var(--space-md)}.grid-2{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.grid-4{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.results-grid{display:grid;gap:var(--space-lg)}.selection-card{background:var(--noir-card);border:2px solid var(--noir-border);border-radius:var(--radius-lg);padding:var(--space-lg);text-align:center;cursor:pointer;transition:all var(--transition-base);-webkit-user-select:none;user-select:none}.selection-card:hover{background:var(--noir-elevated);border-color:var(--noir-gold);transform:translateY(-4px);box-shadow:var(--shadow-lg)}.selection-card.selected{background:var(--noir-elevated);border-color:var(--noir-gold);box-shadow:var(--shadow-lg),0 0 20px #e8c97a1f;transform:scale(1.05)}.selection-card-icon{font-size:3rem;margin-bottom:var(--space-sm);filter:drop-shadow(0 4px 8px rgba(0,0,0,.3))}.selection-card-title{font-size:1.25rem;font-weight:700;color:var(--noir-text);margin-bottom:var(--space-xs)}.selection-card-description{font-size:.875rem;color:var(--noir-text-sub)}.selection-card.selected .selection-card-description{color:var(--noir-text-sub)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}.fade-in{animation:fadeIn var(--transition-base) ease-out}.slide-in-right{animation:slideInRight var(--transition-base) ease-out}.slide-in-left{animation:slideInLeft var(--transition-base) ease-out}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.mb-xl{margin-bottom:var(--space-xl)}@media(max-width:768px){:root{font-size:14px}#app{padding:var(--space-md)}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.card{padding:var(--space-md)}}