:root{--card:#0b1220;--accent:#7c3aed;--muted:#94a3b8;--danger:#ef4444;--glass:rgba(255, 255, 255, 0.03);--glass-light:rgba(255, 255, 255, 0.1)}*{box-sizing:border-box;font-family:Inter,system-ui,sans-serif}body{margin:0;background:#071025;color:#dbe6f0;min-height:100vh;padding:24px}a:link,a:visited{color:#add8e6;transition:all .2s ease}a:hover{color:#64aae6}b{font-weight:600}.screen{max-width:1200px;margin:0 auto;background:var(--glass);padding:18px;border-radius:12px;position:relative}.hidden{display:none!important}.loading-indicator{position:fixed;top:12px;left:12px;background:var(--card);padding:8px 12px;border-radius:6px;display:flex;align-items:center;gap:8px;z-index:10000}.loading-spinner{width:24px;height:24px;border:3px solid var(--muted);border-top:3px solid var(--accent);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.title{font-size:44px;margin-top:6px;margin-bottom:8px;color:var(--accent)}.hud{display:flex;gap:16px;margin-bottom:12px;color:var(--muted)}.panel{background:var(--glass);padding:12px;border-radius:10px;margin-bottom:10px}.profile-panel{display:flex;flex-direction:column;gap:10px}.list{display:flex;flex-wrap:wrap;gap:8px}.controls{display:flex;gap:10px;margin-top:10px;align-items:center}.btn{background:0 0;border:1px solid var(--glass-light);padding:8px 14px;border-radius:8px;color:inherit;cursor:pointer;transition:all .2s ease}.btn.primary{background:var(--accent);border:none}.btn.shop{background:#ec6c10;border:none}.btn.danger{background:var(--danger);border:none}.btn.profile{width:100%;text-align:left;font-size:15px}.btn:disabled{opacity:.7;cursor:not-allowed}.btn:hover:not(:disabled){background:#dbe6f015}.btn.primary:hover:not(:disabled){background:#8b5cf6}.btn.shop:hover:not(:disabled){background:#f1911c}.btn.danger:hover:not(:disabled){background:#f87171}.hint{color:var(--muted);font-size:13px;margin-bottom:6px}.scale-container{background:var(--glass);padding:20px;border-radius:10px;margin:20px 0;text-align:center}.scale-labels{display:flex;justify-content:space-between;margin-bottom:10px;color:var(--muted);font-size:14px}.scale-track{width:100%;height:6px;background:linear-gradient(90deg,#10b981,#f59e0b,#ef4444);border-radius:3px;position:relative;margin:20px 0}.scale-dot{width:20px;height:20px;background:#fff;border:3px solid var(--accent);border-radius:50%;position:absolute;top:50%;left:0;transform:translate(-50%,-50%);transition:left .1s linear}.opponent-preview{background:var(--glass);padding:15px;border-radius:10px;margin:15px 0}.opponent-preview h3{margin-top:0;color:var(--accent)}.level-dropdown{background:var(--glass-light);border:1px solid var(--glass-light);color:#fff;padding:8px;border-radius:6px;transition:all .2s ease}.level-dropdown option{background:var(--card);color:var(--muted)}.level-dropdown:hover{background:rgba(255,255,255,.2)}.level-dropdown:focus{outline:0}.topbar{display:flex;justify-content:space-between;align-items:center;padding:8px;margin-bottom:8px}.topbar .left,.topbar .right{display:flex;gap:10px;align-items:center}.content{display:flex;gap:12px}#game-canvas{border-radius:8px}.sidepanel{width:300px;max-height:560px;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.healthbar{width:180px;height:16px;background:rgba(255,255,255,.06);border-radius:8px;overflow:hidden;margin-top:2px}.hp-fill{height:100%;width:100%;background:#10b981;transition:width .4s ease}.skill-btn,.tactic-btn{padding:8px 10px;border-radius:8px;background:rgba(0,0,0,.25);cursor:pointer;display:flex;align-items:center;gap:8px;min-width:120px;position:relative;transition:all .2s ease}.skill-btn:hover:not(:disabled),.tactic-btn:hover:not(:disabled){background:rgba(255,255,255,.06)}.skill-count{font-weight:600;margin-left:auto;color:var(--muted)}.shop-lists{display:flex;gap:12px}.shop-panel{flex:1}.shop-list{display:flex;flex-direction:column;gap:8px}.shop-item{display:flex;justify-content:space-between;align-items:center;padding:8px;background:rgba(255,255,255,.02);border-radius:8px}.amount{width:60px;background:0 0;border:1px solid rgba(255,255,255,.2);color:inherit;text-align:center;font-size:14px;padding:2px;border-radius:4px}.amount:focus{outline:0;border-color:var(--accent)}.btn.tall{height:42px}.tooltip{position:fixed;background:#071426;border:1px solid var(--glass-light);padding:8px;border-radius:6px;color:#cfe9ff;z-index:999;max-width:260px}.messages{position:fixed;right:20px;top:18px;z-index:2000;display:flex;flex-direction:column;gap:8px;max-width:400px}.message{background:rgba(10,20,35,.95);border:1px solid rgba(255,255,255,.06);padding:10px 12px;border-radius:8px;color:#e6f6ff;font-size:14px;opacity:0;transform:translateX(10px);animation:msgIn .3s forwards}.message.info{background:#0284c7}.message.success{background:#059669}.message.warn{background:#f97316}.message.error{background:#b91c1c}body.math-active{background-image:url('assets/math.png');background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed}.math-question{font-size:20px;font-weight:600;padding:6px 2px}.math-choices{display:grid;grid-template-columns:1fr;gap:10px;margin:10px 0}.math-choice{text-align:left;white-space:normal;border:1px solid rgba(255,255,255,.15)}.math-choice.correct{background:#10b981!important;animation:glow-flash .5s ease-out forwards}.math-stats{font-size:15px;font-weight:700;margin-top:12px}#math-attack,#math-difficulty{transition:all .3s ease}.math-attack-update{color:#10b981}.math-difficulty-update{color:#f59e0b}@keyframes glow-flash{0%{box-shadow:0 0 0 rgba(16,185,129,.8);transform:scale(1)}50%{box-shadow:0 0 12px #10b981;transform:scale(1.02)}100%{box-shadow:0 0 0 rgba(16,185,129,0);transform:scale(1)}}.auth-controls{position:absolute;top:12px;right:12px;display:flex;gap:8px;align-items:center}.input-field{width:100%;padding:8px;border-radius:6px;background:var(--glass);color:#fff;border:1px solid var(--glass-light);margin-bottom:12px}.input-field:focus{outline:0;border:1px solid var(--accent)}.input-field::placeholder{color:var(--muted);opacity:.8;font-size:14px}@keyframes msgIn{to{opacity:1;transform:translateX(0)}}@keyframes msgOut{to{opacity:0;transform:translateX(10px);height:0;margin:0;padding:0}}