*{box-sizing:border-box}html,body{margin:0;padding:0;background:#0a0e1a;color:#e2e8f0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#root{min-height:100vh}.hud-header{display:flex;align-items:center;gap:16px;padding:14px 22px;background:#0000004d;border-bottom:1px solid rgba(124,58,237,.3)}.hud-brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}.hud-logo{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,#16a34a,#22c55e);border:2px solid rgba(134,239,172,.6);box-shadow:0 0 14px #22c55e8c,inset 0 1px #ffffff26;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.hud-title{font-size:18px;font-weight:800;line-height:1.15;letter-spacing:.5px}.hud-title-main{color:#fff;letter-spacing:1px}.hud-title-sub{color:#86efac;font-size:.82em;letter-spacing:.5px;opacity:.9}.hud-info-wrap{position:relative;flex:0 0 auto}.hud-info-btn{width:38px;height:38px;border-radius:50%;background:#a78bfa1f;border:1px solid rgba(167,139,250,.45);color:#a78bfa;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}.hud-info-btn:hover{background:#a78bfa40}.hud-info-popup{position:absolute;top:calc(100% + 10px);right:0;min-width:260px;max-width:340px;background:#0f0a1ef7;border:1px solid rgba(167,139,250,.4);border-radius:12px;padding:14px 16px;font-size:15px;line-height:1.55;z-index:200;box-shadow:0 8px 32px #0009}.hud-score{flex:0 0 auto;padding:10px 20px;border-radius:12px;background:#00000059;border:1px solid rgba(124,58,237,.4);font-size:22px;font-weight:800;white-space:nowrap}.hud-levelbar{display:flex;align-items:center;gap:16px;padding:12px 22px;border-bottom:1px solid rgba(124,58,237,.2)}.hud-levelinfo{display:flex;align-items:baseline;gap:12px;flex:0 0 auto}.hud-levelinfo .lvl{font-size:16px;color:#e879f9;font-weight:800;letter-spacing:.5px}.hud-levelinfo .lvl-name{font-size:18px;color:#e2e8f0;font-weight:600}.hud-dots{flex:1;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.hud-dot{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#e2e8f0}@media(max-width:760px){.hud-header{flex-wrap:wrap;padding:10px 14px;gap:10px}.hud-brand{flex:1 1 auto;gap:10px}.hud-logo{width:42px;height:42px;border-radius:11px}.hud-title{font-size:15px}.hud-score{font-size:18px;padding:8px 14px}.hud-levelbar{flex-wrap:wrap;padding:10px 14px;gap:8px}.hud-levelinfo{flex:1 1 100%;justify-content:center}.hud-dots{flex:1 1 100%}.hud-dot{width:38px;height:38px;font-size:15px}}