:root{--color-bg-primary:#0b0e14;--color-bg-secondary:#1e293b;--color-bg-tertiary:#334155;--color-bg-card:#1e293b99;--color-accent-cyan:#38bdf8;--color-accent-cyan-dark:#0ea5e9;--color-accent-amber:#f59e0b;--color-accent-amber-dark:#ea580c;--color-accent-emerald:#10b981;--color-accent-red:#dc2626;--color-text-primary:#f8fafc;--color-text-secondary:#94a3b8;--color-text-muted:#64748b;--color-text-dim:#475569;--rarity-common:#94a3b8;--rarity-uncommon:#38bdf8;--rarity-rare:#a78bfa;--rarity-legendary:#f59e0b;--shadow-sm:0 2px 8px #0003;--shadow-md:0 4px 16px #0000004d;--shadow-lg:0 8px 32px #0006;--shadow-glow-cyan:0 0 20px #38bdf84d;--shadow-glow-amber:0 0 20px #f59e0b4d;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:20px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes glowPulse{0%,to{box-shadow:0 0 10px #38bdf833}50%{box-shadow:0 0 25px #38bdf866}}@keyframes cardReveal{0%{opacity:0;transform:translateY(20px)rotateX(10deg)}to{opacity:1;transform:translateY(0)rotateX(0)}}body{background:var(--color-bg-primary);color:var(--color-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans SC,PingFang SC,sans-serif;overflow:hidden}#root{width:100vw;height:100vh;overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#1e293b4d;border-radius:3px}::-webkit-scrollbar-thumb{background:var(--color-bg-tertiary);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.card{border:1px solid var(--color-bg-tertiary);border-radius:var(--radius-lg);transition:all var(--transition-base);background:linear-gradient(145deg,#1e293bcc 0%,#0f172ae6 100%);position:relative;overflow:hidden}.card:before{content:"";opacity:0;height:1px;transition:opacity var(--transition-base);background:linear-gradient(90deg,#0000,#ffffff1a,#0000);position:absolute;top:0;left:0;right:0}.card:hover:before{opacity:1}.card:hover{border-color:var(--color-accent-cyan);box-shadow:var(--shadow-lg), var(--shadow-glow-cyan);transform:translateY(-6px)}.card:active{transition:all var(--transition-fast);transform:translateY(-3px)}.btn{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);text-transform:none;letter-spacing:.02em;border:1px solid #0000;padding:12px 24px;font-size:14px;font-weight:600;position:relative}.btn:after{content:"";background:#ffffff1a;border-radius:50%;width:0;height:0;transition:width .4s,height .4s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.btn:active:after{width:200px;height:200px}.btn-primary{background:linear-gradient(135deg, var(--color-accent-cyan) 0%, var(--color-accent-cyan-dark) 100%);color:var(--color-bg-primary);border-color:var(--color-accent-cyan);box-shadow:0 2px 8px #38bdf84d}.btn-primary:hover{background:linear-gradient(135deg, var(--color-accent-cyan-dark) 0%, #0284c7 100%);transform:translateY(-2px);box-shadow:0 6px 20px #38bdf866}.btn-primary:active{transform:translateY(0)}.btn-warning{background:linear-gradient(135deg, var(--color-accent-amber) 0%, var(--color-accent-amber-dark) 100%);color:#fff;border-color:var(--color-accent-amber);box-shadow:0 2px 8px #f59e0b4d}.btn-warning:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f59e0b66}.btn-secondary{border-color:var(--color-bg-tertiary);color:var(--color-text-secondary);background:0 0}.btn-secondary:hover{border-color:var(--color-text-muted);color:var(--color-text-primary);background:#1e293b80;transform:translateY(-2px)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.progress-bar{background:#1e293bcc;border-radius:4px;height:8px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--color-accent-cyan), var(--color-accent-cyan-dark));height:100%;transition:width var(--transition-slow);border-radius:4px;position:relative}.progress-fill:after{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);animation:2s infinite shimmer;position:absolute;inset:0}.animate-fadeIn{animation:fadeIn var(--transition-base)}.animate-slideUp{animation:slideUp var(--transition-slow)}.animate-scaleIn{animation:scaleIn var(--transition-base)}.animate-float{animation:3s ease-in-out infinite float}.animate-pulse{animation:2s ease-in-out infinite pulse}.glass-panel{background:var(--color-bg-card);border:1px solid var(--color-bg-tertiary);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px)}.glow-border{position:relative}.glow-border:after{content:"";border-radius:inherit;background:linear-gradient(135deg, var(--color-accent-cyan), transparent, var(--color-accent-cyan));-webkit-mask-composite:xor;opacity:0;transition:opacity var(--transition-base);padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.glow-border:hover:after{opacity:1}.text-glow{text-shadow:0 0 10px}@media (width<=768px){:root{font-size:14px}}*{box-sizing:border-box;margin:0;padding:0}body{color:#f8fafc;background:#0b0e14;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans SC,sans-serif;overflow:hidden}#root{width:100vw;height:100vh}.card{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);border:1px solid #334155;border-radius:12px;transition:all .2s cubic-bezier(.4,0,.2,1)}.card:hover{border-color:#38bdf8;transform:translateY(-4px);box-shadow:0 8px 24px #38bdf826}.card:active{transform:translateY(-2px)}.btn{cursor:pointer;border:1px solid;border-radius:8px;padding:10px 20px;font-weight:600;transition:all .2s}.btn-primary{color:#0b0e14;background:#38bdf8;border-color:#0ea5e9}.btn-primary:hover{background:#0ea5e9;box-shadow:0 4px 12px #38bdf84d}.btn-warning{color:#fff;background:#f97316;border-color:#ea580c}.btn-warning:hover{background:#ea580c;box-shadow:0 4px 12px #f973164d}.btn-secondary{color:#f8fafc;background:0 0;border-color:#475569}.btn-secondary:hover{background:#1e293b;border-color:#64748b}.progress-bar{background:#1e293b;border-radius:4px;height:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#38bdf8,#22d3ee);height:100%;transition:width .3s}.theme-day{background:linear-gradient(#fcd34d 0%,#f59e0b 100%)}.theme-night{background:linear-gradient(#1e293b 0%,#0b0e14 100%)}