*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;width:100%;margin:0;overflow:hidden;overscroll-behavior:none;touch-action:none}body{background:#0b0d12;color:#e6e6e6;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;user-select:none;-webkit-user-select:none}button{font-family:inherit}.menu-screen{width:100%;height:100%;display:flex;flex-direction:column;padding:24px 20px 32px;gap:20px;background:radial-gradient(circle at 50% 0%,#1b2238,#0b0d12 70%)}.menu-header{text-align:center}.menu-title{margin:0;font-size:34px;letter-spacing:2px;font-weight:800;background:linear-gradient(180deg,#eaeffb,#8fa3d6);-webkit-background-clip:text;background-clip:text;color:transparent}.menu-sub{font-size:12px;color:#6b7486;letter-spacing:1px;margin-top:2px}.menu-hero{flex:1;display:flex;align-items:center;justify-content:center;position:relative;min-height:320px}.menu-hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 50% 70%,rgba(53,89,209,.22) 0%,transparent 65%);pointer-events:none}.menu-hero-viewer{width:100%;max-width:300px;height:340px;position:relative;touch-action:none}.menu-hero-viewer canvas{width:100%;height:100%;display:block}.menu-actions{display:flex;flex-direction:column;gap:10px}.btn-primary{background:linear-gradient(180deg,#3559d1,#2a4ab5);color:#fff;border:0;padding:16px;border-radius:10px;font-weight:700;font-size:16px;cursor:pointer;box-shadow:0 4px 20px #3559d166}.btn-primary:active{transform:translateY(1px);box-shadow:0 2px 10px #3559d166}.btn-secondary{background:#1a1f2c;color:#8a93a6;border:1px solid #2a2f3b;padding:12px;border-radius:10px;font-weight:600;font-size:13px;cursor:pointer}.btn-secondary:disabled{cursor:not-allowed;opacity:.6}.menu-footer{text-align:center;font-size:11px;color:#4a5061}.arena-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;overflow:hidden}.arena-canvas{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.arena-canvas canvas{width:100%;height:100%;display:block}.arena-top-hud{position:absolute;top:calc(12px + var(--tg-content-top, 0px));left:50%;transform:translate(-50%);display:flex;gap:10px;align-items:center;font-size:13px;z-index:10;pointer-events:none}.arena-hud-box{background:#10131cbf;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:6px 12px;font-weight:700;min-width:60px;text-align:center}.arena-hud-box span{color:#6b7486;margin-right:5px;font-weight:500;font-size:11px}.arena-hud-mid{background:#10131cbf;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:6px 14px;font-size:12px;color:#b6bfd4;font-weight:600;letter-spacing:.5px}.arena-exit{position:absolute;top:calc(12px + var(--tg-content-top, 0px));right:calc(12px + var(--tg-content-right, 0px));width:36px;height:36px;border-radius:50%;background:#10131cbf;border:1px solid rgba(255,255,255,.08);color:#e6e6e6;font-size:16px;font-weight:700;cursor:pointer;z-index:10;display:flex;align-items:center;justify-content:center}.arena-status{position:absolute;bottom:8px;left:50%;transform:translate(-50%);font-size:10px;color:#5a6377;z-index:5;pointer-events:none}.arena-controls-left{position:absolute;left:calc(20px + var(--tg-safe-left, 0px));bottom:calc(20px + var(--tg-safe-bottom, 0px));z-index:20}.arena-controls-right{position:absolute;right:calc(20px + var(--tg-safe-right, 0px));bottom:calc(20px + var(--tg-safe-bottom, 0px));z-index:20}.joystick-base{width:140px;height:140px;border-radius:50%;background:#1418218c;border:2px solid rgba(255,255,255,.12);position:relative;touch-action:none;display:flex;align-items:center;justify-content:center}.joystick-knob{width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#4a9eff,#1f4c95);box-shadow:0 4px 14px #4a9eff59,inset 0 0 10px #ffffff26;pointer-events:none;transition:transform .08s ease-out}.action-buttons{display:flex;flex-direction:column;align-items:flex-end;gap:10px;touch-action:none}.skill-row{display:flex;gap:8px}.btn-skill{position:relative;width:56px;height:56px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#253049,#151a27);border:2px solid rgba(255,255,255,.12);color:#e6e6e6;font-size:22px;cursor:pointer;touch-action:none;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:0;transition:transform .08s ease,border-color .15s ease}.btn-skill:active{transform:scale(.94)}.btn-skill-ready{border-color:#ffe17a8c;box-shadow:0 0 14px #ffe17a40}.btn-skill-active{border-color:#4a9effd9;box-shadow:0 0 18px #4a9eff73;animation:skill-active-pulse .9s ease-in-out infinite}@keyframes skill-active-pulse{0%,to{box-shadow:0 0 18px #4a9eff73}50%{box-shadow:0 0 28px #4a9effcc}}.btn-skill-icon{position:relative;z-index:2;font-weight:700}.btn-skill-cooldown-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#05080eb8;transform-origin:top;z-index:1;pointer-events:none}.btn-skill-cooldown-num{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:3;font-size:13px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.8);pointer-events:none}.btn-attack{width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff8a6b,#c94832);border:3px solid rgba(255,255,255,.18);color:#fff;font-size:34px;font-weight:800;cursor:pointer;box-shadow:0 6px 20px #c9483266,inset 0 0 15px #ffffff1a;touch-action:none}.btn-attack:active{transform:scale(.95)}.btn-attack-locked{opacity:.45;pointer-events:none}.ingame-root{position:fixed;top:0;right:0;bottom:0;left:0;background:#000;overflow:hidden}.search-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,#1b2238,#0b0d12 80%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;z-index:100}.search-cancel{position:absolute;top:16px;left:16px;background:#141821b3;border:1px solid rgba(255,255,255,.1);color:#b6bfd4;padding:8px 14px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer}.search-center{display:flex;flex-direction:column;align-items:center;gap:14px}.search-spinner{width:92px;height:92px;border-radius:50%;border:3px solid rgba(74,158,255,.15);border-top-color:#4a9eff;border-right-color:#4a9eff;animation:spin 1.1s linear infinite;box-shadow:0 0 40px #4a9eff4d}@keyframes spin{to{transform:rotate(360deg)}}.search-title{font-size:22px;font-weight:700;color:#e6e6e6;letter-spacing:.5px;margin-top:12px}.search-sub{font-size:13px;color:#8a93a6}.search-timer{font-size:16px;font-weight:700;color:#4a9eff;font-variant-numeric:tabular-nums;margin-top:8px}.search-footer{position:absolute;bottom:20px;font-size:11px;color:#4a5061;letter-spacing:1px;text-transform:uppercase}.vs-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,#2b1432,#0b0d12 80%);display:flex;align-items:center;justify-content:space-between;padding:0 6vw;z-index:100;overflow:hidden}.vs-card{display:flex;flex-direction:column;align-items:center;gap:10px;animation-duration:.5s;animation-timing-function:cubic-bezier(.16,1,.3,1);animation-fill-mode:both}.vs-card-left{animation-name:slide-from-left}.vs-card-right{animation-name:slide-from-right}@keyframes slide-from-left{0%{opacity:0;transform:translate(-120px)}to{opacity:1;transform:translate(0)}}@keyframes slide-from-right{0%{opacity:0;transform:translate(120px)}to{opacity:1;transform:translate(0)}}.vs-avatar{width:128px;height:128px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:44px;font-weight:800;color:#fff;letter-spacing:1px;border:4px solid rgba(255,255,255,.15)}.vs-avatar-p1{background:radial-gradient(circle at 30% 30%,#4a9eff,#1f4c95);box-shadow:0 0 40px #4a9eff80}.vs-avatar-p2{background:radial-gradient(circle at 30% 30%,#ff6b6b,#8a2a2a);box-shadow:0 0 40px #ff6b6b80}.vs-name{font-size:18px;font-weight:700;color:#e6e6e6;max-width:160px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vs-tag{font-size:11px;color:#8a93a6;letter-spacing:2px}.vs-center{display:flex;flex-direction:column;align-items:center;animation:vs-pop .6s cubic-bezier(.16,1,.3,1) .3s both}@keyframes vs-pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.vs-label{font-size:14px;letter-spacing:6px;color:#8a93a6;font-weight:600;text-transform:uppercase}.vs-label-sub{color:#e6e6e6}.vs-big{font-size:88px;font-weight:900;letter-spacing:4px;background:linear-gradient(180deg,#ffe17a,#ff8a3a);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 30px rgba(255,138,58,.3);line-height:1;margin:4px 0}.rotate-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0b0d12;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;z-index:1000}.rotate-phone-icon{position:relative;width:72px;height:120px;display:flex;align-items:center;justify-content:center}.rotate-phone-body{width:64px;height:112px;border:3px solid #4a9eff;border-radius:12px;background:#4a9eff14;animation:rotate-anim 2s ease-in-out infinite}.rotate-phone-arrow{position:absolute;font-size:28px;color:#4a9eff;animation:arrow-pulse 2s ease-in-out infinite}@keyframes rotate-anim{0%{transform:rotate(0)}50%{transform:rotate(-90deg)}to{transform:rotate(-90deg)}}@keyframes arrow-pulse{0%,to{opacity:.5}50%{opacity:1}}.rotate-title{font-size:22px;font-weight:700;color:#e6e6e6;margin-top:16px}.rotate-sub{font-size:13px;color:#8a93a6;text-align:center}