:root{color:#eef2ff;font-family:Trebuchet MS,Segoe UI,sans-serif;background:radial-gradient(circle at top,rgba(56,189,248,.24),transparent 30%),linear-gradient(180deg,#08111f,#020617)}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;width:100%}body{overflow:hidden}#app{position:relative}canvas{display:block}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(circle at 14% 18%,rgba(34,197,94,.14),transparent 24%),radial-gradient(circle at 84% 16%,rgba(59,130,246,.16),transparent 22%),#03071275;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.overlay--respawn{place-items:center;background:#0307122e;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.respawn-panel{width:min(18rem,100%);text-align:center}.overlay[hidden],.roster[hidden]{display:none}[hidden]{display:none!important}.overlay__panel{width:min(38rem,100%);padding:1.35rem;border:2px solid rgba(255,255,255,.16);border-radius:24px;background:linear-gradient(180deg,#09101beb,#08101ed6),#0a101cdb;box-shadow:0 30px 80px #00000073}.overlay__panel--menu{width:min(50rem,100%);padding:1.2rem}.overlay__panel--narrow{width:min(26rem,100%)}.overlay__eyebrow{margin:0;color:#93c5fd;font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.overlay__panel h2{margin:1rem 0 0;font-size:1.4rem}.overlay__copy,.overlay__note{margin:.6rem 0 0;color:#d6def0;line-height:1.45}.overlay__copy--accent{color:#9bd0ff}.menu-shell{width:min(52rem,100%);display:grid;gap:.8rem;justify-items:center}.menu-shell__eyebrow{justify-self:start;margin-left:.2rem}.menu-shell__brand{margin:0;color:#f8fafc;font-family:Arial Black,Impact,sans-serif;font-size:clamp(2.5rem,8vw,4.7rem);line-height:.95;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 4px 0 rgba(1,6,18,.95),0 8px 22px rgba(0,0,0,.45)}.menu__label{display:block;margin-bottom:.55rem;color:#cfe7ff;font-size:.86rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.menu__identity{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem;align-items:stretch}.menu__input{width:100%;padding:.95rem 1rem;border:2px solid rgba(255,255,255,.18);border-radius:16px;color:#f8fafc;font-size:1.5rem;background:linear-gradient(180deg,#050c18f0,#071321e0);outline:none;transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease}.menu__input:focus{border-color:#7dd3fcbf;box-shadow:0 0 0 4px #38bdf82e}.menu__elo{min-width:7.2rem;display:grid;place-items:center;padding:.95rem 1rem;border:2px solid rgba(255,255,255,.18);border-radius:16px;color:#f8fafc;font-size:1.02rem;font-weight:800;letter-spacing:.04em;background:linear-gradient(180deg,#4d2c92f2,#301762db)}.menu__status{min-height:1.4rem;margin:.7rem 0 0;color:#cfd8ea;font-size:.93rem}.menu__buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.75rem;margin-top:1rem}.menu-toplist{position:absolute;top:1rem;right:1rem;z-index:3;width:min(18rem,calc(100vw - 2rem));padding:0;border:0;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}.menu__leaderboard-title{display:none}.menu__leaderboard-list{display:grid;gap:.35rem}.menu__leaderboard-entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.55rem .65rem;border-radius:12px;background:#ffffff0d}.menu__leaderboard-entry.is-self{border:1px solid rgba(56,189,248,.4);background:#11537842}.menu__leaderboard-name{overflow:hidden;color:#edf2ff;font-size:.95rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.menu__leaderboard-elo{color:#9ad0ff;font-size:.84rem;font-weight:800}.menu__leaderboard-empty{color:#b8c4d9;font-size:.92rem}.overlay__button{width:100%;padding:.95rem 1rem;border:2px solid rgba(255,255,255,.18);border-radius:18px;color:#f8fafc;font-weight:700;cursor:pointer;transition:transform .14s ease,opacity .14s ease,border-color .14s ease,box-shadow .14s ease}.overlay__button:hover:enabled,.piece-card:hover:enabled{transform:translateY(-2px);box-shadow:0 16px 30px #00000038}.overlay__button:disabled,.piece-card:disabled{opacity:.52;cursor:not-allowed;box-shadow:none}.overlay__button--secondary{margin-top:1rem;background:linear-gradient(180deg,#0d606fe0,#0b3b4ed6)}.mode-card{min-height:9.5rem;display:grid;align-content:center;justify-items:center;gap:.45rem;text-align:center}.mode-card--3{background:linear-gradient(180deg,#0b5e1ff0,#074516e0)}.mode-card--5{background:linear-gradient(180deg,#08535ef0,#073849e0)}.mode-card--16{background:linear-gradient(180deg,#712143f0,#4d1231e0)}.mode-card--arena{background:linear-gradient(180deg,#6e4a08f0,#4d3007e0)}.mode-card__title{font-size:2rem;font-weight:900;letter-spacing:.05em}.mode-card__copy{max-width:12rem;color:#f1f5f9e0;line-height:1.3}.mode-card__population{color:#cfe6ffeb;font-size:.82rem;font-weight:800;letter-spacing:.03em}.lobby__pieces{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem;margin-top:1rem}.piece-card{display:grid;gap:.25rem;padding:.9rem;border:1px solid rgba(255,255,255,.16);border-radius:16px;color:#eaf2ff;text-align:left;background:linear-gradient(180deg,#1d273aeb,#0a121ee0);cursor:pointer;transition:transform .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease}.piece-card.is-selected{border-color:#38bdf8e6;background:linear-gradient(180deg,#0d5b78b3,#0a121ee6)}.piece-card.is-taken{opacity:.5}.piece-card__title{font-size:1rem;font-weight:700}.piece-card__status{color:#aab8cf;font-size:.85rem}.hud,.roster{position:absolute;top:1rem;z-index:1;width:min(22rem,calc(100vw - 2rem));padding:.95rem 1rem;border:1px solid rgba(255,255,255,.16);border-radius:18px;background:#0a101ec2;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 12px 40px #02061752}.hud{left:1rem}.hud p{margin:0;color:#dbe4f3;line-height:1.45}.hud__meta{margin-top:.4rem;font-size:.92rem}.hud__meta:first-child{margin-top:0}.roster{right:1rem}.roster__eyebrow{margin:0 0 .75rem;color:#cfe7ff;font-size:.86rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.roster__list{display:grid;gap:.85rem}.roster__team{display:grid;gap:.45rem}.roster__team-title{display:flex;align-items:center;justify-content:space-between;margin:0;color:#f8fafc;font-size:.95rem;font-weight:800}.roster__team-title span:last-child{color:#9db3cf;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.roster__entries{display:grid;gap:.35rem}.roster__entry{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.55rem .65rem;border-radius:12px;background:#ffffff0d}.roster__entry.is-dead{opacity:.54}.roster__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#edf2ff;font-size:.95rem;font-weight:700}.roster__elo{color:#9ad0ff;font-size:.86rem;font-weight:800}.roster__empty{color:#b8c4d9;font-size:.92rem}.back-menu-button{position:absolute;left:1rem;bottom:1rem;z-index:4;min-width:12rem;padding:.9rem 1.1rem;border:2px solid rgba(255,255,255,.18);border-radius:16px;color:#f8fafc;font-size:.92rem;font-weight:800;letter-spacing:.04em;background:linear-gradient(180deg,#273249eb,#171f31e6);box-shadow:0 18px 40px #00000047;cursor:pointer;transition:transform .14s ease,opacity .14s ease,border-color .14s ease,box-shadow .14s ease}.back-menu-button:hover:enabled{transform:translateY(-2px);border-color:#7dd3fc80;box-shadow:0 22px 48px #00000057}.back-menu-button:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}@media(max-width:920px){.roster{top:auto;bottom:1rem}}@media(max-width:720px){.overlay,.overlay__panel,.overlay__panel--menu{padding:1rem}.menu-shell__brand{font-size:clamp(2.1rem,11vw,3.4rem);text-align:center}.menu__identity,.menu__buttons{grid-template-columns:1fr}.mode-card{min-height:7.4rem}.lobby__pieces{grid-template-columns:repeat(auto-fit,minmax(7.5rem,1fr))}.hud{top:auto;bottom:1rem}.roster{bottom:auto;top:1rem;width:min(20rem,calc(100vw - 2rem))}.back-menu-button{left:.75rem;bottom:.75rem;min-width:10.5rem;padding:.82rem 1rem}}