:root{--bg-page: #fafafa;--bg-surface: #ffffff;--bg-elevated: #ffffff;--bg-page-gradient: linear-gradient(to bottom, #ffffff 0%, #fafafa 100%);--bg-surface-gradient: linear-gradient(to bottom, #ffffff 0%, #f9fafb 100%);--text-primary: #171717;--text-secondary: #525252;--text-muted: #a3a3a3;--text-on-accent: #ffffff;--border-subtle: rgba(0, 0, 0, .05);--border-default: rgba(0, 0, 0, .08);--border-prominent: rgba(0, 0, 0, .12);--accent-primary: #2563eb;--accent-secondary: #3b82f6;--accent-subtle: #eff6ff;--accent-glow: rgba(37, 99, 235, .15);--status-error: #dc2626;--status-error-bg: #fef2f2;--status-success: #059669;--status-success-bg: #ecfdf5;--card-shadow: 0 4px 6px -1px rgba(0, 0, 0, .05), 0 2px 4px -1px rgba(0, 0, 0, .03);--card-hover-shadow: 0 20px 25px -5px rgba(0, 0, 0, .08), 0 10px 10px -5px rgba(0, 0, 0, .03);--radius-lg: 1rem;--radius-md: .75rem;--radius-sm: .5rem}.dark{--bg-page: #09090b;--bg-surface: #121214;--bg-elevated: #1c1c1f;--bg-page-gradient: radial-gradient(circle at 50% 0%, #17171a 0%, #09090b 80%);--bg-surface-gradient: linear-gradient(180deg, rgba(255,255,255,.03) 0%, rgba(255,255,255,0) 100%);--text-primary: #ededef;--text-secondary: #a1a1aa;--text-muted: #52525b;--text-on-accent: #ffffff;--border-subtle: rgba(255, 255, 255, .06);--border-default: rgba(255, 255, 255, .08);--border-prominent: rgba(255, 255, 255, .12);--accent-primary: #3b82f6;--accent-secondary: #60a5fa;--accent-subtle: rgba(59, 130, 246, .1);--accent-glow: rgba(59, 130, 246, .25);--status-error: #f87171;--status-error-bg: rgba(127, 29, 29, .2);--status-success: #34d399;--status-success-bg: rgba(6, 78, 59, .2);--card-shadow: 0 0 0 1px rgba(255, 255, 255, .05), 0 4px 6px -1px rgba(0, 0, 0, .2);--card-hover-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 20px 25px -5px rgba(0, 0, 0, .3)}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg-page-gradient);background-attachment:fixed;color:var(--text-primary);-webkit-font-smoothing:antialiased;transition:background-color .4s cubic-bezier(.4,0,.2,1),color .4s cubic-bezier(.4,0,.2,1)}.glass-panel{background:#fffc;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-subtle)}.dark .glass-panel{background:#09090bb3;border-bottom:1px solid var(--border-subtle)}.premium-card{background:var(--bg-surface-gradient),var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--card-shadow);transition:all .4s cubic-bezier(.25,.8,.25,1)}.premium-card:hover{box-shadow:var(--card-hover-shadow);border-color:var(--border-default);transform:translateY(-2px)}.scrollbar-thin::-webkit-scrollbar{width:6px}.scrollbar-thin::-webkit-scrollbar-track{background:var(--bg-elevated)}.scrollbar-thin::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:10px}.scrollbar-thin::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.animate-fade-in{animation:fadeIn .4s ease-out forwards}.animate-fade-in-up{animation:fadeInUp .5s ease-out forwards}.animate-fade-in-right{animation:slideInRight .5s ease-out forwards}.active-pulse:active{transform:scale(.98)}.bg-bg-page{background-color:var(--bg-page)}.bg-bg-surface{background-color:var(--bg-surface)}.bg-bg-elevated{background-color:var(--bg-elevated)}.bg-bg-accent{background-color:var(--accent-subtle)}.bg-status-error-bg{background-color:var(--status-error-bg)}.bg-brand-subtle{background-color:var(--accent-subtle)}.text-text-primary{color:var(--text-primary)}.text-text-secondary{color:var(--text-secondary)}.text-text-muted{color:var(--text-muted)}.text-brand-primary{color:var(--accent-primary)}.text-status-error{color:var(--status-error)}.text-text-on-accent{color:var(--text-on-accent)}.border-border-subtle{border-color:var(--border-subtle)}.border-border-default,.border-border{border-color:var(--border-default)}.bg-brand-primary{background-color:var(--accent-primary)}.bg-brand-secondary{background-color:var(--accent-secondary)}.bg-brand-glow{box-shadow:0 0 15px var(--accent-glow)}@keyframes spark-1{0%,to{opacity:0;transform:scale(0) rotate(0)}5%{opacity:1;transform:scale(1) rotate(15deg)}10%{opacity:0;transform:scale(0) rotate(30deg)}}@keyframes spark-2{0%,15%{opacity:0;transform:scale(0) rotate(0)}20%{opacity:1;transform:scale(1.1) rotate(-15deg)}25%{opacity:0;transform:scale(0) rotate(-30deg)}to{opacity:0}}@keyframes drift-in-air{0%,to{transform:translateY(-3px) translate(0) rotate(0)}25%{transform:translateY(-4px) translate(4px) rotate(.5deg)}50%{transform:translateY(-2px) translate(0) rotate(0)}75%{transform:translateY(-5px) translate(-4px) rotate(-.5deg)}}@keyframes transition-fade-sequence{0%{opacity:1;filter:blur(0px);transform:scale(1)}30%{opacity:0;filter:blur(8px);transform:scale(.95)}60%{opacity:0;filter:blur(8px);transform:scale(.95)}to{opacity:1;filter:blur(0px);transform:scale(1)}}@keyframes discharge-glow{0%,to{opacity:.2;filter:blur(12px)}50%{opacity:.6;filter:blur(16px)}}.discharge-container{position:relative;display:flex;align-items:center;justify-content:center}.discharge-spark{position:absolute;pointer-events:none;background:var(--accent-primary);box-shadow:0 0 10px var(--accent-primary),0 0 20px var(--accent-secondary);border-radius:50%;opacity:0}@keyframes sound-wave-float{0%,to{transform:translate(-50%) scaleY(1);opacity:.3}50%{transform:translate(-50%) scaleY(1.2);opacity:.6}}@keyframes wave-pulse-1{0%,to{height:40px;opacity:.2}50%{height:60px;opacity:.5}}@keyframes wave-pulse-2{0%,to{height:30px;opacity:.25}50%{height:50px;opacity:.55}}@keyframes wave-pulse-3{0%,to{height:50px;opacity:.2}50%{height:70px;opacity:.5}}.sound-wave{position:absolute;left:50%;top:50%;transform:translate(-50%) translateY(-50%);width:2px;background:linear-gradient(to bottom,transparent,var(--accent-primary),transparent);border-radius:2px;opacity:.5;z-index:0;filter:blur(.5px)}.wave-1{height:40px;left:20%;animation:wave-pulse-1 2s ease-in-out infinite}.wave-2{height:30px;left:35%;animation:wave-pulse-2 2.5s ease-in-out infinite .3s}.wave-3{height:50px;left:50%;animation:wave-pulse-3 1.8s ease-in-out infinite .6s}.wave-4{height:35px;left:65%;animation:wave-pulse-1 2.2s ease-in-out infinite .9s}.wave-5{height:45px;left:80%;animation:wave-pulse-2 2.8s ease-in-out infinite 1.2s}.group:hover .sound-wave,.group:focus-within .sound-wave{opacity:.8;filter:blur(0px);background:linear-gradient(to bottom,transparent,var(--accent-secondary),transparent)}.discharge-aura{position:absolute;top:-20px;right:-20px;bottom:-20px;left:-20px;border-radius:50%;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 75%);animation:discharge-glow 4s infinite;filter:blur(12px);z-index:-1;transition:all .5s cubic-bezier(.4,0,.2,1)}.discharge-container{transition:transform 1.2s cubic-bezier(.4,0,.2,1)}.effects-group{transition:opacity .8s ease-in-out}.group:hover .effects-group,.group:focus-within .effects-group{animation:transition-fade-sequence 1.5s cubic-bezier(.4,0,.2,1) forwards}.group:hover .discharge-container,.group:focus-within .discharge-container{animation:drift-in-air 10s ease-in-out infinite;animation-delay:.3s}.group:hover .discharge-aura,.group:focus-within .discharge-aura{top:-35px;right:-35px;bottom:-35px;left:-35px;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 90%);opacity:.7;filter:blur(18px)}.group:hover img,.group:focus-within img{filter:invert(1) brightness(.85) hue-rotate(180deg) contrast(1.5) drop-shadow(0 0 15px rgba(37,99,235,.4)) drop-shadow(0 0 30px rgba(37,99,235,.2))!important;transition:filter 1.5s cubic-bezier(.4,0,.2,1)!important}.dark .group:hover img,.dark .group:focus-within img{filter:invert(0) brightness(1.3) hue-rotate(0deg) contrast(1.2) drop-shadow(0 0 20px rgba(59,130,246,.5)) drop-shadow(0 0 40px rgba(59,130,246,.2))!important;transition:filter 1.5s cubic-bezier(.4,0,.2,1)!important}@keyframes sparkle-flicker{0%,to{opacity:0;filter:blur(1px)}50%{opacity:.9;filter:blur(0px)}}.sparkle{position:absolute;pointer-events:none;width:10px;height:10px;opacity:0;z-index:20;transition:opacity .3s ease,top .5s ease,left .5s ease,right .5s ease,bottom .5s ease}.sparkle:before,.sparkle:after{content:"";position:absolute;background:currentColor;border-radius:999px}.sparkle:before{width:100%;height:1.5px;top:50%;left:0;transform:translateY(-50%)}.sparkle:after{height:100%;width:1.5px;left:50%;top:0;transform:translate(-50%)}.sparkle-yellow{color:#fbbf24;filter:drop-shadow(0 0 4px #fbbf24);animation:sparkle-flicker 2.5s infinite}.sparkle-orange{color:#f97316;filter:drop-shadow(0 0 4px #f97316);animation:sparkle-flicker 3s infinite}.group:hover .sparkle,.group:focus-within .sparkle{animation-duration:.8s!important}.group:hover .sparkle-yellow,.group:focus-within .sparkle-yellow{animation:sparkle-flicker .8s infinite!important}.group:hover .sparkle-orange,.group:focus-within .sparkle-orange{animation:sparkle-flicker 1s infinite .2s!important}.sparkle-hover-only{display:none}.group:hover .sparkle-hover-only,.group:focus-within .sparkle-hover-only{display:block}.sp-1{top:-15%;left:10%}.sp-2{top:20%;right:-15%}.sp-3{bottom:0%;left:-20%}.sp-4{bottom:-10%;right:10%}.sp-5{top:-20%;right:20%}.sp-6{top:50%;left:-25%}.sp-7{bottom:-20%;left:30%}.sp-8{top:10%;left:40%}.sp-9{bottom:40%;right:-20%}.sp-10{top:80%;left:-15%}.group:hover .sp-1,.group:focus-within .sp-1{top:-35%;left:-5%}.group:hover .sp-2,.group:focus-within .sp-2{top:10%;right:-35%}.group:hover .sp-3,.group:focus-within .sp-3{bottom:-15%;left:-40%}.group:hover .sp-4,.group:focus-within .sp-4{bottom:-25%;right:-5%}.group:hover .sp-5,.group:focus-within .sp-5{top:-40%;right:5%}.group:hover .sp-6,.group:focus-within .sp-6{top:40%;left:-45%}.group:hover .sp-7,.group:focus-within .sp-7{bottom:-30%;left:15%}.group:hover .sp-8,.group:focus-within .sp-8{top:-10%;left:50%}.group:hover .sp-9,.group:focus-within .sp-9{bottom:30%;right:-40%}.group:hover .sp-10,.group:focus-within .sp-10{top:70%;left:-35%}