:root{--bg: #f8fafc;--fg: #1e293b;--glass-bg: rgba(255, 255, 255, .85);--glass-border: rgba(255, 255, 255, .5);--glass-shadow: 0 8px 32px rgba(0, 0, 0, .08);--card-bg: rgba(255, 255, 255, .95);--card-border: rgba(226, 232, 240, .8);--card-shadow: 0 1px 3px rgba(0, 0, 0, .04), 0 4px 12px rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .04);--card-shadow-hover: 0 2px 6px rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .1), 0 16px 48px rgba(0, 0, 0, .06);--progress-track: #e2e8f0;--progress-glow: rgba(59, 130, 246, .2);--scrollbar-track: rgba(226, 232, 240, .5);--scrollbar-thumb: rgba(148, 163, 184, .6);--scrollbar-thumb-hover: rgba(100, 116, 139, .8)}[data-theme=dark],.dark-mode{--bg: #0f172a;--fg: #f1f5f9;--glass-bg: rgba(30, 41, 59, .75);--glass-border: rgba(71, 85, 105, .4);--glass-shadow: 0 8px 32px rgba(0, 0, 0, .3);--card-bg: rgba(30, 41, 59, .6);--card-border: rgba(71, 85, 105, .5);--card-shadow: 0 1px 3px rgba(0, 0, 0, .2), 0 4px 12px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .2);--card-shadow-hover: 0 2px 6px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .4), 0 16px 48px rgba(0, 0, 0, .2);--progress-track: rgba(71, 85, 105, .5);--progress-glow: rgba(59, 130, 246, .3);--scrollbar-track: rgba(51, 65, 85, .5);--scrollbar-thumb: rgba(100, 116, 139, .6);--scrollbar-thumb-hover: rgba(148, 163, 184, .8)}html,body,#root{height:100%;margin:0;background-color:var(--bg, #f8fafc);color:var(--fg, #1e293b)}.glass-card{background:var(--glass-bg);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:1rem}.glass-card-premium{background:var(--card-bg);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid var(--card-border);box-shadow:var(--card-shadow);border-radius:1rem;transition:box-shadow .3s ease,transform .2s ease}.glass-card-premium:hover{box-shadow:var(--card-shadow-hover)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}@keyframes pulseGlow{0%,to{box-shadow:0 0 0 0 var(--progress-glow)}50%{box-shadow:0 0 20px 4px var(--progress-glow)}}@keyframes subtlePulse{0%,to{opacity:1}50%{opacity:.85}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:fadeIn .3s ease-out}.animate-fade-in-up{animation:fadeInUp .4s ease-out}.animate-shake{animation:shake .5s ease-in-out}.animate-pulse-glow{animation:pulseGlow 2s ease-in-out infinite}.animate-subtle-pulse{animation:subtlePulse 3s ease-in-out infinite}.transition-premium{transition:all .3s cubic-bezier(.4,0,.2,1)}.hover-lift{transition:transform .2s ease,box-shadow .3s ease}.hover-lift:hover{transform:translateY(-2px)}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}.custom-scrollbar::-webkit-scrollbar{width:6px;height:6px}.custom-scrollbar::-webkit-scrollbar-track{background:var(--scrollbar-track);border-radius:3px}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:3px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover)}.quest-scroll::-webkit-scrollbar{width:6px}.quest-scroll::-webkit-scrollbar-track{background:#1e293b4d;border-radius:3px}.quest-scroll::-webkit-scrollbar-thumb{background:#fbbf2480;border-radius:3px}.quest-scroll::-webkit-scrollbar-thumb:hover{background:#fbbf24b3}.glow-blue{box-shadow:0 0 20px #3b82f64d}.glow-emerald{box-shadow:0 0 20px #10b9814d}.glow-amber{box-shadow:0 0 20px #fbbf244d}.glow-purple{box-shadow:0 0 20px #8b5cf64d}.gradient-text-blue{background:linear-gradient(135deg,#3b82f6,#06b6d4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.gradient-text-gold{background:linear-gradient(135deg,#fbbf24,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.focus-glow:focus{outline:none;box-shadow:0 0 0 3px #3b82f64d}.badge-glow-gold{box-shadow:0 0 10px #fbbf2466,0 0 20px #fbbf2433}.badge-glow-silver{box-shadow:0 0 10px #94a3b866,0 0 20px #94a3b833}.badge-glow-bronze{box-shadow:0 0 10px #d9770666,0 0 20px #d9770633}.badge-glow-platinum{box-shadow:0 0 10px #8b5cf666,0 0 20px #8b5cf633}