:root{--primary-color: #6200ee;--primary-dark: #3700b3;--primary-light: #bb86fc;--secondary-color: #03dac6;--background-primary: #121212;--background-secondary: #1e1e1e;--card-color: #2c2c2c;--card-hover: #383838;--text-primary: #ffffff;--text-secondary: #b3b3b3;--success-color: #00ff00;--warning-color: #ffaa00;--error-color: #ff4444;--info-color: #448aff;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-xxl: 48px;--border-radius-sm: 8px;--border-radius-md: 12px;--border-radius-lg: 16px;--border-radius-full: 9999px;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--glow-primary: 0 0 10px var(--primary-light);--glow-success: 0 0 10px var(--success-color);--glow-warning: 0 0 10px var(--warning-color)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background-color:var(--background-primary);color:var(--text-primary);line-height:1.6;overflow-x:hidden}button{font-family:inherit;border:none;outline:none;cursor:pointer;transition:all .2s ease;font-weight:600}button:hover{transform:translateY(-2px)}button:active{transform:translateY(0)}input,textarea{font-family:inherit;background-color:var(--card-color);color:var(--text-primary);border:2px solid transparent;border-radius:var(--border-radius-md);padding:var(--spacing-sm) var(--spacing-md);transition:all .2s ease}input:focus,textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:var(--glow-primary)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--background-secondary);border-radius:var(--border-radius-full)}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:var(--border-radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes glow{0%,to{box-shadow:0 0 10px var(--primary-light)}50%{box-shadow:0 0 20px var(--primary-light),0 0 30px var(--primary-color)}}.pulse{animation:pulse 2s infinite}.float{animation:float 3s ease-in-out infinite}.glow{animation:glow 2s infinite}.badge{display:inline-block;padding:4px 12px;border-radius:var(--border-radius-full);font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.badge-primary{background-color:var(--primary-light);color:var(--background-primary)}.badge-success{background-color:var(--success-color);color:var(--background-primary)}.badge-warning{background-color:var(--warning-color);color:var(--background-primary)}.badge-error{background-color:var(--error-color);color:#fff}.game-card{background-color:var(--card-color);border-radius:var(--border-radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md);transition:all .3s ease;border:1px solid rgba(255,255,255,.1)}.game-card:hover{background-color:var(--card-hover);box-shadow:var(--shadow-lg);transform:translateY(-4px)}.game-title{background:linear-gradient(45deg,var(--primary-light),var(--secondary-color));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800;letter-spacing:-.5px}.progress-bar{width:100%;height:12px;background-color:var(--background-secondary);border-radius:var(--border-radius-full);overflow:hidden;position:relative}.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));transition:width .3s ease;border-radius:var(--border-radius-full)}@media (max-width: 768px){:root{--spacing-lg: 20px;--spacing-xl: 28px;--spacing-xxl: 40px}.game-card{padding:var(--spacing-md)}}@media (max-width: 480px){:root{--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 24px}}