@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');
:root {color-scheme:dark;--bg:#050915;--cyan:#62e9f9;--muted:#8595b0;--line:rgba(171,202,255,.13);--display:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--mono:'Space Mono',monospace;--body:'DM Sans',Inter,system-ui,sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);font-family:var(--body);color:#eaf7ff}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.hidden{display:none!important}#app{position:relative;width:100%;height:100dvh;min-height:450px;overflow:hidden;isolation:isolate}#game{display:block;position:absolute;width:100%;height:100%;touch-action:none;inset:0}.screen-vignette{pointer-events:none;position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse at 49% 47%,transparent 28%,rgba(1,3,11,.37) 83%,rgba(1,2,9,.8) 100%)}.dot-pattern{pointer-events:none;position:absolute;inset:0;z-index:1;opacity:.16;background-image:radial-gradient(rgba(255,255,255,.13) .5px,transparent .8px);background-size:5px 5px;mask-image:linear-gradient(to bottom,transparent 40%,black)}
.header{position:absolute;top:0;left:0;right:0;z-index:10;height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,72px);border-bottom:1px solid rgba(161,183,235,.105);background:linear-gradient(180deg,rgba(3,7,22,.82),rgba(3,7,22,.18));gap:15px}.brand{display:flex;align-items:center;gap:12px;white-space:nowrap}.brand-mark{position:relative;width:36px;height:36px;display:block;transform:rotate(-23deg)}.brand-mark span{position:absolute;border:3px solid #68e6f9;border-radius:50%;box-shadow:0 0 14px rgba(94,224,255,.55);inset:2px}.brand-mark span:nth-child(2){inset:10px;border-width:2px;border-color:#e5ffff}.brand-mark span:nth-child(3){inset:auto;width:8px;height:8px;top:0;right:0;background:#d7fdff;border:0}.brand-type{font-family:var(--display);font-weight:900;font-size:32px;line-height:.84;letter-spacing:1px}.brand-type>span{color:#58def8}.brand-type small{display:block;font:700 7.7px var(--mono);letter-spacing:2.1px;margin-top:7px;color:#7790b0}.center-status{display:flex;align-items:center;gap:11px;font:700 10px var(--mono);letter-spacing:1.2px;color:#9cacc4;white-space:nowrap}.live-dot,.pulse-dot{display:inline-block;width:8px;height:8px;flex:none;border-radius:50%;background:#4af4bc;box-shadow:0 0 0 5px rgba(74,244,188,.1),0 0 13px rgba(74,244,188,.62);animation:breathe 2.4s ease-in-out infinite}.status-sep{height:11px;width:1px;background:#4d5b75;margin:0 6px}#roomText{color:#eef9ff}.top-actions{display:flex;align-items:center;gap:11px}.online-count{font:700 10px var(--mono);letter-spacing:1px;color:#acc0da;white-space:nowrap;margin-right:9px;display:flex;align-items:center;gap:12px}.online-count .pulse-dot{width:6px;height:6px}.icon-button{height:36px;width:36px;display:grid;place-items:center;border:1px solid rgba(173,212,255,.16);border-radius:9px;background:rgba(255,255,255,.03);color:#a9bfd8;transition:.2s}.icon-button:hover{background:rgba(102,219,255,.14);color:white}.icon-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.menu-layer{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center}.menu-fog{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,6,19,.80),rgba(3,7,23,.33) 50%,rgba(3,8,24,.36));pointer-events:none}.menu-body{position:relative;width:min(1400px,calc(100% - 144px));display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,445px);gap:clamp(48px,8vw,158px);align-items:center;margin-top:26px}.hero{padding-bottom:12px}.hero-badge{display:inline-flex;align-items:center;gap:13px;padding:12px 17px;border:1px solid rgba(77,231,242,.27);border-radius:4px;background:rgba(30,90,111,.15);font:700 10px var(--mono);letter-spacing:1.8px;color:#89def0;margin-bottom:25px}.hero-badge .live-dot{width:6px;height:6px}.hero h1{font:900 clamp(64px,7.2vw,125px)/.93 var(--display);letter-spacing:-1.7px;margin:0 0 26px;text-shadow:0 9px 45px rgba(0,0,0,.35);white-space:nowrap}.hero h1 span{background:linear-gradient(108deg,#48d9ee,#a2f5fa 43%,#baa9ff 87%);background-clip:text;-webkit-background-clip:text;color:transparent}.hero p{max-width:435px;color:#9cabc5;font:400 clamp(14px,1.18vw,16px)/1.95 var(--body);letter-spacing:.05px;margin:0 0 36px}.hero p strong{font-weight:700;color:#dae9f6}.hero-features{display:flex;flex-wrap:wrap;gap:15px 22px;max-width:490px}.hero-features span{font:700 9px var(--mono);letter-spacing:.3px;color:#c8d3e6;white-space:nowrap}.feature-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:8px;vertical-align:middle}.feature-dot.cyan{background:#55dfed;box-shadow:0 0 10px #55dfed}.feature-dot.purple{background:#ae7afc;box-shadow:0 0 10px #ae7afc}.feature-dot.coral{background:#ff798e;box-shadow:0 0 10px #ff798e}.hero-signature{font:700 9px var(--mono);letter-spacing:1.4px;color:#67839f;margin-top:76px}.hero-signature span{color:#53c4d9;padding:0 12px}
.entry-card{border:1px solid rgba(152,200,247,.25);border-radius:19px;background:linear-gradient(146deg,rgba(18,30,56,.86),rgba(9,15,37,.90));box-shadow:0 24px 90px rgba(0,0,0,.48),0 0 80px rgba(79,142,247,.06),inset 0 1px 0 rgba(255,255,255,.055);backdrop-filter:blur(32px);position:relative;overflow:hidden}.entry-card:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,#5ceafa,#9b8dfb,transparent)}.entry-card:after{content:"";pointer-events:none;position:absolute;width:270px;height:270px;right:-155px;top:-180px;background:radial-gradient(circle,rgba(68,139,238,.28),transparent 68%)}.entry-inner{padding:33px 34px 26px}.card-top{display:flex;align-items:center;gap:12px;font:700 9px var(--mono);letter-spacing:1.4px;color:#80d5ea}.card-top-icon{font-size:21px}.card-version{margin-left:auto;color:#7f93aa;letter-spacing:0}.entry-inner h2{font:800 43px/1 var(--display);letter-spacing:.2px;margin:28px 0 8px}.entry-inner h2 span,.death-card h2 span{color:#65e8f6}.card-desc{font-size:12px;color:#8093b0;line-height:1.7;margin:0 0 30px}.field-label{display:flex;justify-content:space-between;font:700 10px var(--mono);letter-spacing:1.2px;color:#d6e9f5;margin-bottom:12px}.field-label span{color:#6386a4}.name-input-wrap{display:flex;align-items:center;gap:12px;height:52px;background:rgba(3,9,27,.55);border:1px solid rgba(139,183,232,.18);border-radius:8px;padding:0 14px;transition:border-color .2s}.name-input-wrap:focus-within{border-color:rgba(95,231,248,.65);box-shadow:0 0 0 3px rgba(70,223,247,.06)}.name-input-wrap svg{width:20px;height:20px;fill:none;stroke:#789cb7;stroke-width:1.5;stroke-linecap:round}.name-input-wrap input{background:none;border:0;outline:0;color:white;font-size:14px;width:100%;min-width:0;letter-spacing:.2px}.name-input-wrap input::placeholder{color:#607591}.input-caret{color:#68cce0;font-size:23px}.palette-title{margin-top:27px}.skin-select{display:flex;align-items:center;gap:12px;margin:3px 0 28px;flex-wrap:wrap}.skin{height:27px;width:27px;flex:none;border:2px solid rgba(10,18,36,.7);background:radial-gradient(circle at 30% 25%,white -45%,var(--skin) 55%,rgba(23,28,49,.5) 145%);border-radius:50%;box-shadow:0 3px 12px color-mix(in srgb,var(--skin) 32%,transparent);transition:transform .15s}.skin:hover{transform:scale(1.18)}.skin.active{outline:2px solid #e3fbff;outline-offset:3px;transform:scale(1.04)}.room-selector{border-top:1px solid rgba(161,191,232,.1);padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:9px}.room-selector .field-label{margin:0 0 7px;font-size:9px}.room-subtitle{font:400 10px var(--body);color:#7c92ae}.room-selector select{max-width:158px;background:#101e39;border:1px solid rgba(168,199,233,.17);color:#dbedf9;padding:10px 8px;border-radius:6px;font:700 9px var(--mono);outline:none}.private-input{display:flex;margin:12px 0 0;gap:9px}.private-input input{width:100%;background:#091426;color:#e5f7ff;padding:10px 12px;border-radius:6px;border:1px solid #39536d;outline:none}.private-input button{border:1px solid #39536d;border-radius:6px;background:#12273a;color:#a7e7f9;font-size:20px;width:46px}.play-btn{border:0;background:linear-gradient(103deg,#57e4fa,#54baf4 68%,#7d93fb);color:#04172e;border-radius:9px;height:60px;width:100%;font:900 13px var(--mono);letter-spacing:1px;display:flex;align-items:center;justify-content:center;gap:15px;box-shadow:0 8px 24px rgba(50,200,253,.22),inset 0 1px rgba(255,255,255,.55);margin-top:26px;position:relative;transition:filter .15s,transform .15s}.play-btn:hover{filter:brightness(1.13);transform:translateY(-2px)}.play-btn:active{transform:translateY(0)}.play-btn:disabled{filter:grayscale(.5);cursor:wait}.play-symbol{font-size:13px}.play-arrow{position:absolute;right:22px;font-size:20px;font-weight:500}.join-note{display:flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;margin-top:19px;color:#698099;font:700 8px var(--mono);letter-spacing:.35px}.shield{color:#60e4ca;font-size:15px}.connection-error{color:#ff8d9e;font-size:12px;margin:14px 0 0}.menu-bottom{position:absolute;bottom:31px;left:clamp(24px,4vw,72px);right:clamp(24px,4vw,72px);display:flex;align-items:center;justify-content:space-between;gap:15px;color:#65849e;font:700 9px var(--mono);letter-spacing:1.5px}.menu-bottom>div{display:flex;align-items:center;gap:10px}.menu-bottom b{color:#70e0f0}.step-line{width:19px;height:1px;background:#416077;margin:0 5px}.menu-bottom div:nth-child(2) span{color:#85e9f1}
.glass{background:linear-gradient(140deg,rgba(13,25,49,.78),rgba(7,14,30,.68));border:1px solid rgba(158,203,249,.15);backdrop-filter:blur(18px);box-shadow:0 12px 39px rgba(0,0,0,.2);border-radius:12px}.hud-side{position:absolute;left:clamp(18px,3vw,55px);top:112px;z-index:3;width:245px}.eyebrow{font:700 10px var(--mono);letter-spacing:1.6px;color:#66dcb7}.eyebrow i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#40d99a;margin-right:9px;box-shadow:0 0 9px #3adb99}.hud-name{font:800 36px var(--display);letter-spacing:.2px;margin:7px 0}.hud-meta{font:700 9px var(--mono);color:#647e9d;letter-spacing:.8px;display:flex;justify-content:space-between}.hud-meta span{color:#96b1cd}.progress-wrap{height:4px;background:rgba(104,166,207,.16);border-radius:6px;margin-top:21px;overflow:hidden}.progress-fill{width:15%;height:100%;background:linear-gradient(90deg,#23b6ff,#87f4ff);box-shadow:0 0 14px #59e7ff;border-radius:6px;transition:width .15s}.progress-caption{display:flex;justify-content:space-between;color:#7394b5;font:700 8px var(--mono);margin-top:9px}.leaderboard{position:absolute;top:110px;right:clamp(18px,3vw,55px);width:262px;padding:17px 18px 12px}.panel-title{font:700 10px var(--mono);letter-spacing:1px;color:#ecf6ff;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--line);padding-bottom:13px}.tiny-icon{color:#70eafd;font-size:20px}.panel-label{font:700 8px var(--mono);color:#7894b3;margin-left:auto;letter-spacing:0}.leader-row{display:flex;align-items:center;gap:11px;height:32px;font-size:11px;color:#a6b9ce}.leader-row .rank{color:#627e9c;font:700 10px var(--mono);width:16px}.leader-row .lb-dot{width:8px;height:8px;border-radius:50%;background:hsl(var(--hue),90%,67%);box-shadow:0 0 8px hsla(var(--hue),80%,65%,.5)}.leader-row .lb-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.leader-row .lb-mass{font:700 10px var(--mono);color:#a0b7d0}.leader-row.me{color:#90eefa}.leader-row.me .rank,.leader-row.me .lb-mass{color:#64e1ef}.leader-footer{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;display:flex;justify-content:space-between;font:700 9px var(--mono);color:#7594b1}.leader-footer b{font-size:12px;color:#74e9f6}.kill-feed{position:absolute;right:clamp(18px,3vw,55px);top:515px;width:266px;display:flex;flex-direction:column;align-items:flex-end;gap:5px;pointer-events:none}.kill-item{background:rgba(8,18,35,.72);border:1px solid rgba(122,182,213,.11);border-radius:5px;padding:8px 10px;font:600 10px var(--body);color:#a9bfdb;animation:fade-pop .2s}.kill-item b{color:#8de4f0}.kill-item span{color:#ff8298}.stats-bottom{position:absolute;left:50%;bottom:27px;transform:translateX(-50%);display:flex;align-items:center;padding:13px 24px;gap:25px;min-width:340px;z-index:4}.stat{display:flex;flex-direction:column;gap:4px;align-items:center;flex:1;white-space:nowrap}.stat span{font:700 8px var(--mono);letter-spacing:1.4px;color:#7893af}.stat strong{font:800 26px var(--display);color:white;line-height:1}.stat strong em{font:600 10px var(--mono);font-style:normal;color:#829bb5}.stat-divider{height:24px;width:1px;background:var(--line)}.control-hint{position:absolute;bottom:33px;left:clamp(18px,3vw,55px);color:#7b96b0;font-size:10px}.hint-title{font:700 9px var(--mono);color:#a9c9dc;letter-spacing:1px;margin-bottom:12px}.control-hint>div:not(.hint-title){display:flex;align-items:center;gap:8px;margin-top:8px}.control-hint kbd{display:inline-flex;justify-content:center;align-items:center;min-width:57px;padding:5px 6px;color:#d7e7f3;border-radius:4px;background:rgba(101,146,192,.12);border:1px solid rgba(173,213,246,.17);font:700 9px var(--mono)}.minimap{position:absolute;bottom:26px;right:clamp(18px,3vw,55px);width:210px;padding:10px 9px}.minimap-header,.mini-footer{display:flex;justify-content:space-between;align-items:center;font:700 8px var(--mono);letter-spacing:.6px;color:#c3dcf1;padding:2px 3px 8px}.minimap-header span+span{color:#668aa7}.minimap canvas{width:190px;height:142px;display:block;border-radius:4px;background:rgba(12,28,46,.58)}.mini-footer{color:#91ddea;padding-top:7px;padding-bottom:1px;justify-content:flex-start;gap:7px}.mini-legend{width:6px;height:6px;background:#69f4ff;border-radius:50%;box-shadow:0 0 6px #6cf1ff}.mini-mode{margin-left:auto;color:#6f91aa}.mobile-controls{display:none}.toast-container{position:absolute;top:100px;left:50%;transform:translateX(-50%);z-index:100;display:grid;gap:10px;pointer-events:none}.toast{padding:10px 18px;border:1px solid rgba(112,234,247,.3);border-radius:8px;background:rgba(9,31,48,.9);color:#bdedf4;font:700 11px var(--mono);white-space:nowrap;animation:fade-pop .2s}
.death-overlay{position:absolute;inset:0;z-index:20;background:rgba(2,5,15,.67);display:grid;place-items:center;backdrop-filter:blur(13px)}.death-card{padding:40px;width:min(390px,calc(100vw - 40px));text-align:center}.death-icon{color:#ff718b;font-size:48px;text-shadow:0 0 25px #ff5c7e}.death-eyebrow{font:700 9px var(--mono);letter-spacing:1.8px;color:#ff879e;margin:8px 0}.death-card h2{font:900 75px var(--display);margin:6px 0}.death-card p{color:#9eb0c8;font-size:13px;line-height:1.8}.death-card p b{color:#f3fbff}.death-score{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 3px;margin-top:23px;font:700 10px var(--mono);color:#90a8c0}.death-score b{font:800 28px var(--display);color:#fff}.back-menu{border:0;background:transparent;color:#91aabe;font:700 10px var(--mono);letter-spacing:1px;margin-top:19px}.back-menu:hover{color:white}
@keyframes breathe{50%{opacity:.6;box-shadow:0 0 0 7px rgba(74,244,188,.06),0 0 20px rgba(74,244,188,.7)}}@keyframes fade-pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1180px){.menu-body{width:calc(100% - 80px);gap:40px;grid-template-columns:minmax(0,1fr) minmax(345px,410px)}.hero h1{font-size:clamp(59px,6.7vw,86px)}.hero-features{gap:12px}.hero-features span{font-size:8px}.hero-signature{margin-top:45px}.center-status{font-size:9px}.leaderboard{width:225px}.hud-side{width:215px}.minimap{width:175px}.minimap canvas{width:155px}}
@media(max-width:850px){.header{height:69px;padding:0 20px}.center-status{display:none}.menu-body{width:calc(100% - 40px);display:flex;flex-direction:column;gap:20px;max-width:480px;margin-top:60px}.hero{text-align:center;padding:0}.hero-badge{margin-bottom:9px;font-size:8px;padding:9px}.hero h1{font-size:clamp(40px,9vw,68px);margin-bottom:8px}.hero p,.hero-features,.hero-signature{display:none}.entry-card{width:100%}.entry-inner{padding:24px}.entry-inner h2{margin-top:18px;font-size:34px}.card-desc{margin-bottom:18px}.palette-title{margin-top:19px}.skin-select{margin-bottom:20px}.play-btn{margin-top:18px;height:54px}.menu-bottom{display:none}.leaderboard{top:85px;right:15px;width:190px;padding:10px}.panel-title{font-size:8px}.panel-label{display:none}.leader-row{height:26px;font-size:10px}.leader-row:nth-child(n+7){display:none}.hud-side{top:91px;left:15px;width:180px}.hud-name{font-size:26px}.hud-meta{font-size:7px}.minimap{display:none}.control-hint{display:none}.kill-feed{top:310px;right:15px;width:195px}.stats-bottom{bottom:16px;min-width:300px;padding:10px 14px;gap:16px}.mobile-controls{display:flex;position:absolute;bottom:18px;left:18px;right:18px;align-items:flex-end;justify-content:space-between;z-index:4;pointer-events:none}.joystick{width:114px;height:114px;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(143,218,255,.34);background:radial-gradient(circle,rgba(103,172,219,.12),rgba(6,17,33,.35));pointer-events:auto;touch-action:none}.joystick #joystickKnob{width:47px;height:47px;border-radius:50%;border:2px solid rgba(174,250,255,.7);background:radial-gradient(circle at 28% 27%,#98f8ff,#428bbd);box-shadow:0 0 20px rgba(87,222,255,.35);transform:translate(0,0)}.mobile-abilities{display:flex;gap:12px;pointer-events:auto}.ability-btn{width:66px;height:66px;border-radius:50%;border:1px solid rgba(133,220,255,.4);background:rgba(11,28,51,.75);color:#c7f4ff;font-size:29px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;backdrop-filter:blur(10px)}.ability-btn span{font:700 9px var(--mono);letter-spacing:.6px}.eject-btn{border-color:rgba(203,127,255,.5);color:#debdff}.stats-bottom{bottom:133px;left:50%;min-width:170px;gap:9px;padding:10px}.stats-bottom .stat:nth-last-child(-n+2),.stats-bottom .stat-divider:nth-last-child(3){display:none}.stats-bottom .stat strong{font-size:27px}}
@media(max-height:730px) and (min-width:851px){.menu-body{transform:scale(.82);transform-origin:center}.hero-signature{margin-top:35px}.entry-inner{padding:26px 28px}.card-desc{margin-bottom:20px}.entry-inner h2{margin-top:18px}.palette-title{margin-top:18px}.skin-select{margin-bottom:18px}.play-btn{margin-top:18px}.menu-bottom{bottom:15px}}
@media(max-width:520px){.brand-type{font-size:27px}.brand-mark{width:29px;height:29px}.online-count{font-size:8px;margin-right:0}.top-actions{gap:5px}.icon-button{width:30px;height:30px}.menu-body{margin-top:44px;gap:13px}.hero h1{font-size:clamp(44px,10.4vw,59px)}.hero-badge{letter-spacing:.65px}.entry-inner{padding:20px 21px 18px}.entry-inner h2{font-size:34px}.card-desc{font-size:11px;margin-bottom:17px}.field-label{font-size:9px}.name-input-wrap{height:45px}.skin-select{gap:9px;margin-bottom:17px}.skin{height:24px;width:24px}.room-selector{padding-top:13px}.room-selector select{font-size:8px}.room-subtitle{font-size:9px}.play-btn{height:50px}.join-note{font-size:7px}.hud-side{top:84px;width:160px}.leaderboard{width:155px;top:85px}.leader-row:nth-child(n+6){display:none}.hud-meta,.progress-caption{font-size:7px}.leader-footer{font-size:8px}.leader-row{gap:6px}.kill-feed{top:288px}}
@media(max-width:370px){.menu-body{width:calc(100% - 22px);margin-top:45px}.entry-inner{padding:16px}.hero-badge{font-size:7px}.hero h1{font-size:43px}.card-desc{margin-bottom:12px}.palette-title{margin-top:15px}.skin-select{margin-bottom:13px}.room-selector .field-label{font-size:8px}.join-note{letter-spacing:0;font-size:6.8px}.online-count{display:none}}

/* EVENT HORIZON · cosmic art direction */
:root{--cyan:#ffbb7c;--bg:#03050c;--muted:#9f97ad;--line:rgba(255,189,151,.15)}
.header{border-bottom-color:rgba(255,171,136,.14);background:linear-gradient(180deg,rgba(4,4,17,.88),rgba(6,4,19,.16))}
.brand-mark{transform:rotate(-30deg)}.brand-mark span{border-color:#ffb979;box-shadow:0 0 19px rgba(255,113,67,.48)}.brand-mark span:nth-child(2){border-color:#ffefbf}.brand-mark span:nth-child(3){background:#fff5ca}
.brand-type>span{color:#ffc18d}.brand-type small{color:#a58dba}
.hero-badge{background:rgba(108,45,57,.17);color:#ffd1a8;border-color:rgba(255,155,94,.4)}
.hero h1{font-size:clamp(72px,7.3vw,128px);line-height:.9}.hero h1 span{background:linear-gradient(110deg,#ffebc0,#ffa368 42%,#e58ed3 90%);-webkit-background-clip:text;background-clip:text}
.hero p{color:#a9a5bb}.hero p strong{color:#f5d8ce}.feature-dot.cyan{background:#ffc57e;box-shadow:0 0 10px #ff8a54}.feature-dot.purple{background:#c39bff}.feature-dot.coral{background:#ff6583}
.hero-signature{color:#927f9d}.hero-signature span{color:#ffa981}
.menu-fog{background:linear-gradient(90deg,rgba(3,4,14,.8),rgba(4,5,20,.34) 54%,rgba(7,5,22,.42))}
.entry-card{border-color:rgba(255,188,159,.24);background:linear-gradient(145deg,rgba(24,18,42,.86),rgba(10,9,24,.94));box-shadow:0 28px 95px rgba(0,0,0,.62),0 0 66px rgba(224,101,131,.07),inset 0 1px rgba(255,255,255,.06)}
.entry-card:before{background:linear-gradient(90deg,transparent,#ffa26d,#ac78ec,transparent)}
.card-top{color:#ffbf91}.card-desc,.room-subtitle{color:#a197b9}.field-label{color:#edddea}
.name-input-wrap{background:rgba(5,5,21,.57);border-color:rgba(222,168,205,.2)}
.name-input-wrap:focus-within{border-color:rgba(255,174,116,.72);box-shadow:0 0 0 3px rgba(255,144,76,.08)}
.play-btn{background:linear-gradient(100deg,#ffe0aa,#ffa46d 62%,#df87a8);color:#271122;box-shadow:0 9px 29px rgba(247,110,76,.22),inset 0 1px rgba(255,255,255,.6)}
.entry-inner h2 span,.death-card h2 span{color:#ffbb84}
.room-selector select,.private-input input{background:#171126}
.glass{background:linear-gradient(145deg,rgba(21,17,41,.83),rgba(9,8,24,.75));border-color:rgba(241,183,219,.15)}
.progress-fill{background:linear-gradient(90deg,#b26cff,#ffb569);box-shadow:0 0 15px #ffb569}
.surge-readout{display:flex;justify-content:space-between;align-items:center;margin-top:20px;color:#a98cae;font:700 9px var(--mono);letter-spacing:.2px}
.surge-readout strong{color:#b7a3c0;font-size:9px}.surge-readout strong.charged{color:#ffd092;text-shadow:0 0 9px rgba(250,140,66,.5)}
.progress-wrap{margin-top:9px}.eyebrow{color:#ffc193}.eyebrow i{background:#ffad63;box-shadow:0 0 11px #ffad63}
.leader-row.me,.leader-row.me .rank,.leader-row.me .lb-mass,.leader-footer b{color:#ffc78c}
.tiny-icon{color:#ffb879}.kill-item b{color:#ffc79e}.control-hint kbd{background:rgba(185,110,141,.13)}
.toast{border-color:rgba(255,162,119,.3);background:rgba(31,16,35,.9);color:#ffdfc1}
.mini-legend{background:#ffb57c;box-shadow:0 0 7px #ffb57c}.mini-footer{color:#e6bba0}
.planet-counter strong{color:#d7a8ff}.joystick #joystickKnob{background:radial-gradient(circle at 30% 25%,#ffe0ae,#d48085);border-color:#ffd4b1;box-shadow:0 0 22px rgba(255,150,110,.37)}
.surge-btn{border-color:rgba(255,179,92,.65);color:#ffcc9b}
@media(max-width:1180px){.hero h1{font-size:clamp(59px,6.5vw,87px)}}
@media(max-width:850px){.hero h1{font-size:clamp(44px,8.2vw,73px)}.mobile-controls{bottom:16px}.mobile-abilities{gap:9px}.ability-btn{width:65px;height:65px}}
@media(max-width:520px){.hero h1{font-size:clamp(46px,10.5vw,64px)}.planet-counter{display:none}.stats-bottom{bottom:132px}.menu-body{margin-top:44px}}

/* V3: event-horizon destruction warning, kept independent of world camera shake. */
.collapse-alert{position:absolute;left:50%;top:105px;transform:translateX(-50%);z-index:6;display:flex;align-items:center;gap:12px;max-width:90vw;padding:11px 17px;border:1px solid rgba(255,137,84,.53);border-radius:12px;background:linear-gradient(120deg,rgba(58,18,27,.85),rgba(30,10,30,.83));box-shadow:0 0 40px rgba(235,69,54,.18),inset 0 0 16px rgba(255,145,49,.07);font-family:var(--mono,monospace);font-size:11px;font-weight:800;letter-spacing:.09em;color:#ffbc9c;white-space:nowrap;pointer-events:none;animation:collapse-pulse 1.3s ease-in-out infinite alternate}
.collapse-alert.hidden{display:none}.collapse-alert-mark{font-size:17px;color:#ff8667}.collapse-alert b{font-size:10px;color:#fff4e7;padding:4px 8px;border-radius:5px;background:rgba(255,112,79,.2)}
@keyframes collapse-pulse{from{box-shadow:0 0 18px rgba(255,84,69,.12)}to{box-shadow:0 0 48px rgba(255,84,69,.42)}}
@media(max-width:700px){.collapse-alert{top:75px;gap:7px;padding:8px;font-size:9px;letter-spacing:.02em}.collapse-alert-mark{font-size:12px}.collapse-alert b{font-size:9px}}

/* V4: one-tap visual quality selection; no new scrolling surfaces. */
.effects-button{height:36px;min-width:80px;padding:0 9px;border-radius:9px;border:1px solid rgba(255,177,112,.37);background:linear-gradient(125deg,rgba(154,73,44,.23),rgba(67,29,79,.28));color:#ffe0b5;font:800 10px var(--mono);letter-spacing:.6px;white-space:nowrap;transition:border-color .2s,background .2s}
.effects-button:hover{border-color:#ffdba0;background:rgba(184,101,72,.23)}
@media(max-width:850px){.effects-button{min-width:62px;padding:0 5px;font-size:9px}}
@media(max-width:520px){.effects-button{min-width:55px;font-size:8px}}

/* V5: Celestial atlas and powerup HUD */
.atlas-button{border-color:rgba(172,159,255,.34);color:#d5c3ff;background:rgba(85,48,118,.18)}
.atlas-teaser{display:block;margin:15px auto -3px;background:none;border:0;font:800 9px var(--mono);color:#d6b8ff;letter-spacing:1px;transition:color .2s}
.atlas-teaser:hover{color:#fff}
.active-power{margin-top:13px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid rgba(220,156,255,.47);border-radius:8px;background:linear-gradient(100deg,rgba(123,54,162,.36),rgba(51,36,90,.36));box-shadow:0 0 22px rgba(139,59,216,.12)}
.active-power b{font:800 10px var(--mono);letter-spacing:.3px;color:#f4c9ff}.active-power .power-timer{color:#ffd4a4}
.atlas-discover{display:flex;justify-content:space-between;align-items:center;margin:10px 0 0;font:600 8px var(--mono);letter-spacing:.1px;color:#9ba6c9}.atlas-discover b{color:#ffd7a1}
.atlas-overlay{position:absolute;inset:0;z-index:25;display:grid;place-items:center;padding:85px 20px 18px;background:rgba(2,4,15,.86);backdrop-filter:blur(20px)}
.atlas-panel{width:min(1180px,100%);height:min(850px,100%);min-height:300px;display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(144deg,#131426,#090d1b 74%);border:1px solid rgba(240,190,248,.26);border-radius:20px;box-shadow:0 28px 110px rgba(0,0,0,.65),0 0 66px rgba(170,93,205,.1)}
.atlas-top{display:flex;justify-content:space-between;align-items:start;gap:16px;padding:26px 32px 14px}.atlas-kicker{font:800 10px var(--mono);color:#f7b790;letter-spacing:2px}.atlas-top h2{font:900 clamp(31px,3.8vw,59px)/1 var(--display);margin:10px 0 7px}.atlas-top h2 span{color:#ffa977}.atlas-top p{margin:0;font-size:12px;color:#8e9bad;line-height:1.6}.atlas-top button{flex:none;background:rgba(255,255,255,.06);border:1px solid rgba(239,199,251,.2);border-radius:9px;color:#ffe7f9;width:41px;height:41px;font-size:18px}.atlas-controls{display:flex;gap:10px;padding:7px 32px}.atlas-controls input,.atlas-controls select{height:43px;background:rgba(2,8,19,.85);border:1px solid rgba(164,172,216,.25);border-radius:8px;color:#e8e6ff;padding:10px 15px;min-width:0}.atlas-controls input{flex:1}.atlas-controls select{width:250px;font:700 10px var(--mono)}.atlas-summary{padding:12px 32px;display:flex;justify-content:space-between;gap:8px;color:#a7a4bd;font:700 9px var(--mono);letter-spacing:.6px}
.atlas-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overflow:auto;padding:6px 30px 25px;scrollbar-color:#574569 #101321}.atlas-card{border:1px solid rgba(206,166,221,.14);border-radius:10px;background:rgba(255,255,255,.035);padding:14px 14px 12px;display:flex;align-items:start;gap:12px;min-height:100px;transition:border-color .15s,background .15s}.atlas-card:hover{border-color:rgba(219,155,232,.47);background:rgba(168,99,207,.065)}.atlas-orb{--orb:#e0b6ff;border:1px solid color-mix(in srgb,var(--orb),transparent 40%);width:33px;height:33px;border-radius:50%;flex:none;box-shadow:0 0 19px color-mix(in srgb,var(--orb),transparent 65%);background:radial-gradient(circle at 32% 29%,#fff,var(--orb) 38%,#20162c 77%)}.atlas-card-body{min-width:0}.atlas-card-top{display:flex;gap:8px;justify-content:space-between;align-items:start}.atlas-card-title{font:800 12px var(--body);line-height:1.4;color:#f3e7fd}.atlas-tier{font:700 9px var(--mono);color:#a28fac}.atlas-card-sub{font:700 9px var(--mono);color:#9c9bb5;margin-top:5px}.atlas-size{margin-top:8px;font:600 10px var(--mono);color:#dacde7}.atlas-power{display:inline-block;margin-top:8px;padding:4px 6px;border-radius:4px;background:rgba(178,99,221,.15);color:#f7c6ff;font:700 9px var(--mono)}.atlas-footnote{padding:12px 32px;margin:0;border-top:1px solid rgba(160,154,182,.1);font-size:10px;line-height:1.55;color:#a19dad}
@media(max-width:950px){.atlas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.atlas-overlay{padding-top:75px}.atlas-top{padding:18px 20px 10px}.atlas-controls,.atlas-summary{padding-left:20px;padding-right:20px}.atlas-grid{padding-left:20px;padding-right:20px}.atlas-footnote{padding:9px 20px}}
@media(max-width:590px){.atlas-button{display:none}.atlas-grid{grid-template-columns:1fr}.atlas-controls{flex-direction:column}.atlas-controls select{width:100%}.atlas-overlay{padding:64px 7px 7px}.atlas-summary{font-size:8px}.atlas-top h2{font-size:30px}.atlas-card{min-height:84px}.atlas-footnote{font-size:8px}}

/* V5.1 - Bigger galaxy, unobtrusive corner alerts, openable star chart */
.toast-container{top:auto;bottom:180px;left:clamp(12px,2vw,28px);transform:none;max-width:min(340px,calc(100vw - 24px));z-index:14;justify-items:start}
.toast{white-space:normal;max-width:100%;padding:11px 15px;line-height:1.5;box-shadow:0 8px 25px rgba(0,0,0,.35)}
.collapse-alert{top:auto;bottom:310px;left:clamp(12px,2vw,28px);right:auto;transform:none;z-index:8;max-width:min(310px,calc(100vw - 24px));white-space:normal;line-height:1.5;font-size:9px;letter-spacing:.02em}
.minimap{width:340px;bottom:20px;right:clamp(15px,2vw,35px);padding:13px 14px 10px;background:linear-gradient(160deg,rgba(17,15,42,.95),rgba(6,11,31,.93));border-color:rgba(174,150,249,.29);box-shadow:0 0 50px rgba(145,80,252,.1),0 18px 60px rgba(0,0,0,.4)}
.minimap canvas{width:100%;height:auto;aspect-ratio:1;display:block;border-radius:8px;background:#030813;box-shadow:inset 0 0 32px #030a18;outline:1px solid rgba(176,134,254,.26)}
.minimap-header{font-size:10px;letter-spacing:1.2px;color:#e8d9ff;gap:12px}
.minimap-header span+span{color:#f3ad8f;white-space:nowrap}
.map-expand{display:block;width:100%;border:1px solid rgba(157,125,223,.29);padding:7px;border-radius:6px;margin-bottom:10px;background:rgba(129,92,178,.1);font:800 9px var(--mono);letter-spacing:1px;color:#e4c3ff;text-align:center;transition:background .18s}
.map-expand:hover{background:rgba(151,100,225,.25)}
.mini-footer{font-size:9px;letter-spacing:.25px;gap:6px}
.mini-mode{font-size:8px;color:#bfb0e2}
.server-monitor{position:absolute;z-index:22;right:clamp(15px,2vw,35px);top:74px;width:min(365px,calc(100vw - 24px));max-height:calc(100dvh - 88px);overflow:auto;padding:18px 20px 15px;box-shadow:0 25px 85px rgba(0,0,0,.68),0 0 45px rgba(104,87,215,.1);border-color:rgba(149,166,255,.4);background:linear-gradient(150deg,rgba(15,23,49,.97),rgba(10,12,32,.98))}
.server-monitor-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;font:800 11px var(--mono);letter-spacing:.6px;color:#ecddff}
.server-monitor-heading button{border:1px solid rgba(160,171,248,.28);border-radius:8px;background:rgba(255,255,255,.07);color:#eee;font-size:21px;line-height:26px;width:32px;height:32px}
.monitor-caption{font:600 9px/1.6 var(--mono);color:#859bb7;margin:9px 0 14px}
.monitor-line{display:flex;align-items:baseline;justify-content:space-between;gap:9px;margin-top:15px;font:700 10px var(--mono);color:#99a9c6}
.monitor-line strong{font:800 12px var(--mono);color:#eaf8ff;text-align:right}
.monitor-line.small{font-size:8px;margin-top:12px}.monitor-line.small strong{font-size:10px}
.monitor-track{height:7px;border-radius:8px;background:rgba(137,168,209,.13);overflow:hidden;margin-top:7px}
.monitor-track i{width:0%;height:100%;display:block;border-radius:8px;background:linear-gradient(90deg,#609cfc,#8cdeff);transition:width .45s}
.monitor-track.ram i{background:linear-gradient(90deg,#8867f6,#df91f7)}
.monitor-divider{height:1px;background:rgba(160,180,236,.14);margin:19px 0 4px}
.monitor-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:15px}
.monitor-four div{padding:10px 3px;text-align:center;border:1px solid rgba(165,171,245,.12);border-radius:8px;background:rgba(129,119,215,.05);min-width:0}
.monitor-four small{display:block;font:700 8px var(--mono);color:#a1a3c5;white-space:nowrap}
.monitor-four b{display:block;font:800 15px var(--display);color:#ffe0c5;margin-top:7px}
.monitor-button{border-color:rgba(137,211,255,.38);color:#bfeaff}
.galaxy-map-overlay{position:absolute;z-index:24;inset:0;display:grid;place-items:center;padding:82px 16px 16px;background:rgba(2,4,12,.82);backdrop-filter:blur(14px)}
.galaxy-map-panel{width:min(1000px,100%);height:min(100%,1100px);min-height:300px;padding:20px;display:flex;flex-direction:column;background:linear-gradient(155deg,rgba(12,16,38,.99),rgba(7,12,30,.97));border-color:rgba(158,136,241,.38);overflow:hidden}
.galaxy-map-top{display:flex;align-items:start;justify-content:space-between;gap:14px;flex:none}
.galaxy-map-top small{font:800 9px var(--mono);letter-spacing:1.4px;color:#c6a0ff}
.galaxy-map-top h2{font:900 clamp(28px,3.3vw,42px)/1 var(--display);margin:8px 0 5px;letter-spacing:1px;color:#ffe1c6}
.galaxy-map-top p{font:500 11px var(--body);color:#a9afc9;max-width:650px;margin:0 0 14px;line-height:1.5}
.galaxy-map-top button{flex:none;border:1px solid rgba(187,159,245,.4);border-radius:8px;background:rgba(112,75,181,.15);font:800 10px var(--mono);color:#efdfff;padding:11px 14px}
.galaxy-map-content{display:flex;align-items:center;flex-direction:column;min-height:0;flex:1;gap:12px}
.galaxy-map-content canvas{height:100%;width:auto;max-width:100%;min-height:0;aspect-ratio:1;object-fit:contain;border:1px solid rgba(148,136,219,.35);border-radius:8px;box-shadow:0 0 43px rgba(93,64,159,.17)}
.map-legend{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:18px;font:700 9px var(--mono);color:#b4b4d0;white-space:nowrap}
.map-legend span{display:flex;align-items:center;gap:6px}.map-dot{display:inline-block;width:9px;height:9px;border-radius:50%}.map-dot.me{background:#ffd18d}.map-dot.others{background:#8cf5ff}.map-dot.stars{background:#ffeeac}.map-dot.vista{background:#bf88ff;border:1px solid #eac7ff}
@media(max-width:1350px){.minimap{width:270px}.minimap-header{font-size:8px}.mini-mode{font-size:7px}}
@media(max-width:950px){.minimap{width:222px}.collapse-alert{bottom:210px}.toast-container{bottom:160px}.galaxy-map-panel{padding:12px}.galaxy-map-top p{font-size:9px}}
@media(max-width:850px){.minimap{display:block;right:10px;bottom:159px;width:160px;padding:7px}.minimap-header span+span{display:none}.minimap-header{font-size:8px}.minimap canvas{height:130px}.map-expand{font-size:7px;padding:5px;margin-bottom:7px}.mini-footer{font-size:7px}.mini-mode{display:none}.collapse-alert{top:auto;bottom:280px;left:10px;max-width:180px}.toast-container{left:10px;bottom:215px;max-width:170px}.toast{font-size:8px;padding:6px 8px}.server-monitor{top:66px;right:8px;width:min(350px,calc(100vw - 16px))}.monitor-button{min-width:55px}.galaxy-map-overlay{padding:69px 6px 8px}.galaxy-map-top h2{font-size:25px}.map-legend{font-size:7px;gap:9px}}
@media(max-width:560px){.minimap{width:133px;bottom:165px}.minimap canvas{height:102px}.mini-footer{display:none}.galaxy-map-top small{font-size:7px}.galaxy-map-top h2{font-size:23px}.galaxy-map-top p{font-size:8px}.galaxy-map-top button{padding:8px;font-size:8px}.map-legend{white-space:normal}.collapse-alert{bottom:345px;max-width:150px;font-size:8px}.toast-container{bottom:255px;max-width:144px}.toast{font-size:8px}.server-monitor{padding:12px}}

/* V5.2 - Sound design / positional audio preferences */
.sound-toggle.sound-active{color:#ffd7a5;border-color:rgba(240,191,131,.48);filter:drop-shadow(0 0 6px rgba(255,176,100,.35))}
.sound-panel{position:absolute;z-index:27;top:73px;right:clamp(16px,2vw,36px);width:min(355px,calc(100vw - 24px));padding:19px 20px 17px;background:linear-gradient(140deg,rgba(22,18,46,.97),rgba(8,15,34,.98));border-color:rgba(246,180,116,.37);box-shadow:0 18px 65px rgba(0,0,0,.65),0 0 35px rgba(255,158,78,.1)}
.sound-panel-title{display:flex;justify-content:space-between;align-items:center;font:800 11px var(--mono);letter-spacing:1px;color:#ffdab6}
.sound-panel-title button{width:30px;height:30px;border:1px solid rgba(255,204,150,.25);color:#fff;border-radius:7px;background:rgba(255,255,255,.06);font-size:20px}
.sound-intro,.sound-caption{font:500 10px/1.6 var(--body);color:#a8aec8;margin-top:12px}
.sound-switches{display:flex;gap:8px;margin:17px 0 20px}.sound-switches button{flex:1;min-width:0;padding:12px 9px;border:1px solid rgba(175,158,220,.36);border-radius:8px;background:rgba(177,122,244,.1);color:#f6e2ff;font:800 9px var(--mono);letter-spacing:.3px}
.sound-switches button[aria-pressed='true']{background:rgba(248,172,91,.14);border-color:rgba(255,194,117,.48);color:#ffe1bd}
.sound-slider{display:flex;justify-content:space-between;font:800 9px var(--mono);letter-spacing:1px;color:#c9bedf}.sound-slider output{color:#ffc98b}
.sound-panel input[type='range']{display:block;width:100%;margin:13px 0;accent-color:#ffc98b;cursor:pointer}
.sound-caption{margin:4px 0 0;font-size:9px}
@media(max-width:850px){.sound-panel{top:65px;right:8px;padding:13px;max-height:calc(100dvh - 70px);overflow:auto}.sound-intro{font-size:9px}}


/* V5.3 · REBUILT HUD — flow-based bounded rails; no overlapping absolute cards */
#app{min-height:0}
.header{height:64px;padding:0 clamp(12px,2vw,30px);gap:12px;background:linear-gradient(180deg,rgba(6,8,24,.96),rgba(9,9,26,.83));border-bottom:1px solid rgba(250,185,139,.16)}
.header .brand-type{font-size:28px}.header .brand-mark{width:31px;height:31px}
.header .center-status{font-size:9px;gap:8px;letter-spacing:.7px;min-width:0}
.header .top-actions{gap:7px}.header .effects-button{height:33px;min-width:69px;padding:0 8px;font-size:9px}
.header .icon-button{width:33px;height:33px}.header .online-count{margin-right:4px;font-size:9px}
.game-hud{position:absolute;inset:0;pointer-events:none;z-index:7}
.game-hud button,.game-hud .minimap{pointer-events:auto}
.hud-left-rail,.hud-right-rail{position:absolute;top:74px;bottom:65px;display:flex;flex-direction:column;gap:9px;pointer-events:none;min-height:0}
.hud-left-rail{left:clamp(12px,1.5vw,24px);width:clamp(190px,18.7vw,254px)}
.hud-right-rail{right:clamp(12px,1.5vw,24px);width:clamp(200px,19.2vw,264px)}
.hud-left-rail .hud-side{position:static;width:100%;max-width:100%;padding:13px 14px 12px;background:linear-gradient(145deg,rgba(17,16,44,.86),rgba(8,13,31,.79));border:1px solid rgba(168,151,209,.19);border-radius:12px;backdrop-filter:blur(11px);box-shadow:0 10px 38px rgba(0,0,0,.24);flex:none}
.hud-name{font-size:clamp(23px,2.2vw,31px);margin:3px 0 5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1}
.eyebrow{font-size:8px;letter-spacing:.9px}.hud-meta{font-size:8px;gap:8px}.hud-meta span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.surge-readout{margin-top:10px;font-size:8px}.surge-readout strong{font-size:8px}
.atlas-discover{margin-top:8px;font-size:7px}.progress-wrap{margin-top:8px}.progress-caption{margin-top:6px}
.active-power{margin-top:8px;padding:6px 8px;gap:5px;min-width:0}.active-power b{font-size:8px}.active-power .power-name{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.hud-right-rail .leaderboard{position:static;width:100%;max-width:100%;padding:12px 13px 9px;max-height:min(33dvh,252px);overflow:hidden;flex:0 1 auto;min-height:76px}
.hud-right-rail .panel-title{font-size:9px;padding-bottom:9px;letter-spacing:.6px}
.hud-right-rail .leader-row{height:25px;font-size:10px;gap:7px}.hud-right-rail .leader-row:nth-child(n+6){display:none}
.hud-right-rail .leader-footer{margin-top:5px;padding-top:7px}
.hud-right-rail .minimap{position:static;width:100%;max-width:100%;margin-top:auto;padding:11px;background:linear-gradient(150deg,rgba(16,15,42,.93),rgba(7,13,35,.9));display:flex;flex-direction:column;align-items:stretch;gap:5px;min-height:0;max-height:calc(100% - 85px)}
.hud-right-rail .minimap canvas{width:min(100%,26dvh,245px);height:auto;aspect-ratio:1;display:block;align-self:center;flex:0 1 auto;min-height:0;object-fit:contain}
.hud-right-rail .minimap-header{padding:0;font-size:9px;gap:6px}.hud-right-rail .minimap-header span+span{font-size:8px}
.hud-right-rail .map-expand{margin:0;padding:6px 5px;font-size:8px}
.hud-right-rail .mini-footer{padding:0;font-size:8px}.hud-right-rail .mini-mode{font-size:7px}
.hud-events{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;min-height:0;flex:1 1 auto;width:100%;overflow:hidden;pointer-events:none}
.hud-events .collapse-alert{position:static;transform:none;max-width:100%;margin:0;padding:7px 9px;gap:7px;font-size:8px;line-height:1.35;letter-spacing:0;animation:collapse-pulse 1.3s ease-in-out infinite alternate}
.hud-events .collapse-alert-mark{font-size:12px}.hud-events .collapse-alert b{font-size:8px;padding:3px 5px}
.hud-events .kill-feed{position:static;inset:auto;display:flex;flex-direction:column;gap:5px;width:100%;max-width:100%;align-items:stretch;min-height:0;overflow:hidden}
.hud-events .kill-item{font-size:9px;line-height:1.25;padding:6px 8px;max-width:100%;background:rgba(10,16,32,.84);border:1px solid rgba(151,133,210,.25);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hud-events .toast-container{position:static;transform:none;max-width:100%;display:flex;flex-direction:column;gap:5px;min-height:0;overflow:hidden;justify-items:normal}
.hud-events .toast{font-size:9px;line-height:1.2;padding:7px 9px;white-space:normal;word-break:break-word;max-width:100%;background:rgba(14,32,51,.94)}
.hud-controls-toggle{flex:none;position:relative;display:block;width:100%;height:29px;background:rgba(16,22,48,.86);border:1px solid rgba(149,139,211,.29);color:#b5b8d4;border-radius:7px;font:800 9px var(--mono);letter-spacing:1px;backdrop-filter:blur(7px)}
.hud-controls-toggle:hover{background:rgba(61,49,102,.85);color:white}
.hud-left-rail .control-hint{position:static;left:auto;bottom:auto;flex:none;max-height:min(185px,27dvh);overflow:auto;padding:9px 12px;background:rgba(11,16,35,.94);border:1px solid rgba(156,140,210,.25);border-radius:9px;backdrop-filter:blur(9px);font-size:9px}
.hud-left-rail .control-hint>div:not(.hint-title){margin-top:5px}.hud-left-rail .control-hint kbd{padding:4px 5px;min-width:51px;font-size:8px}
.stats-bottom{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);min-width:0;width:max-content;max-width:min(620px,calc(100vw - 32px));padding:7px 15px;gap:17px;border-radius:11px;pointer-events:none;z-index:8;box-shadow:0 12px 25px rgba(0,0,0,.28);background:rgba(10,11,30,.88)}
.stats-bottom .stat{min-width:68px}.stats-bottom .stat span{font-size:7px;white-space:nowrap;letter-spacing:.65px}.stats-bottom .stat strong{font-size:23px;line-height:1.1}
.stats-bottom .stat-divider{height:27px}
.menu-toast-container{position:absolute;left:16px;bottom:20px;z-index:30;display:flex;flex-direction:column;gap:7px;max-width:min(340px,calc(100vw - 32px));pointer-events:none}
.menu-toast-container .toast{font-size:10px;white-space:normal;word-break:break-word}
.server-monitor,.sound-panel{top:69px;right:clamp(12px,1.5vw,24px);max-height:calc(100dvh - 81px)}
.galaxy-map-overlay{z-index:30}
@media(max-width:1100px){
 .header .center-status{display:none}
 .hud-left-rail{width:210px}.hud-right-rail{width:214px}
 .hud-right-rail .minimap canvas{width:min(100%,24dvh,195px)}
 .header .top-actions{gap:5px}
}
@media(max-height:680px) and (min-width:851px){
 .header{height:59px}.hud-left-rail,.hud-right-rail{top:67px;bottom:53px;gap:6px}
 .hud-left-rail .hud-side{padding:10px 12px}.hud-name{font-size:27px}
 .hud-right-rail .leaderboard{max-height:170px;padding:9px 11px 7px}
 .hud-right-rail .leader-row{height:22px}.hud-right-rail .leader-row:nth-child(n+5){display:none}
 .hud-right-rail .minimap{padding:8px;gap:4px}.hud-right-rail .minimap canvas{width:min(100%,24dvh,170px)}
 .hud-right-rail .minimap-header{font-size:8px}.hud-right-rail .mini-footer{font-size:7px}
 .stats-bottom{bottom:7px;padding:5px 13px;gap:12px}.stats-bottom .stat strong{font-size:20px}
 .hud-events .kill-item:nth-child(n+3){display:none}
 .server-monitor,.sound-panel{top:62px}
}
@media(max-width:850px){
 .header{height:58px;padding:0 11px}
 .header .brand-type{font-size:25px}.header .brand-mark{width:28px;height:28px}
 .header .effects-button{min-width:50px;height:30px;font-size:8px;padding:0 5px}.header .icon-button{width:30px;height:30px}
 .header .top-actions{gap:4px}.header .online-count{font-size:8px;margin:0}
 .hud-left-rail,.hud-right-rail{top:65px;bottom:150px;gap:6px}
 .hud-left-rail{left:8px;width:clamp(142px,31vw,189px)}
 .hud-right-rail{right:8px;width:clamp(127px,29vw,172px)}
 .hud-left-rail .hud-side{padding:9px}.hud-name{font-size:23px}
 .hud-right-rail .leaderboard{max-height:160px;padding:8px}
 .hud-right-rail .leader-row{height:22px}.hud-right-rail .leader-row:nth-child(n+4){display:none}
 .hud-right-rail .minimap{display:flex;padding:7px;gap:4px}
 .hud-right-rail .minimap canvas{width:min(100%,19dvh,135px);height:auto;aspect-ratio:1}
 .hud-right-rail .minimap-header span+span,.hud-right-rail .mini-mode{display:none}
 .hud-controls-toggle{height:25px;font-size:8px}.hud-events .toast{font-size:8px}
 .stats-bottom{bottom:125px;padding:7px 9px;gap:9px;max-width:calc(100vw - 20px)}
 .stats-bottom .stat strong{font-size:19px}
 .stats-bottom .stat span{font-size:6px}.stats-bottom .stat:nth-last-child(-n+2),.stats-bottom .stat-divider:nth-last-child(3){display:none}
 .server-monitor,.sound-panel{top:64px;right:8px}
}
@media(max-width:590px){
 .header .online-count{display:none}.header .atlas-button{display:none}.header .monitor-button{min-width:47px}
 .hud-left-rail{width:146px;bottom:147px}.hud-right-rail{width:129px;bottom:146px}
 .hud-left-rail .hud-side{padding:8px}.hud-name{font-size:21px}
 .hud-left-rail .hud-meta{display:none}.hud-left-rail .eyebrow{font-size:7px}
 .hud-right-rail .leaderboard{display:none}.hud-right-rail .minimap{margin-top:0}
 .hud-right-rail .minimap canvas{width:min(100%,19dvh,111px)}
 .hud-right-rail .map-expand{font-size:7px}.hud-right-rail .mini-footer{font-size:7px}
 .hud-events .kill-feed{display:none}.hud-events .collapse-alert{font-size:7px;padding:5px}.hud-events .toast-container{gap:3px}
 .stats-bottom{bottom:132px}.stats-bottom .stat strong{font-size:18px}
 .mobile-abilities{gap:7px}.ability-btn{width:60px;height:60px}
}
@media(max-height:520px){
 .hud-left-rail .hud-side{padding:6px 9px}.hud-name{font-size:21px}
 .hud-left-rail .atlas-discover,.hud-left-rail .hud-meta{display:none}
 .hud-right-rail .leader-row:nth-child(n+3){display:none}
 .hud-right-rail .minimap canvas{width:min(100%,20dvh,115px)}
}

/* V5.3.1 — mobile-safe, responsive game HUD. Fixed viewport; no browser zoom trickery. */
.mobile-menu-trigger,.mobile-menu-panel{display:none}
#app{height:100dvh;min-height:0}
.hud-left-rail,.hud-right-rail{min-width:0}
.hud-right-rail .minimap canvas{max-width:100%;}
.hud-left-rail .control-hint:not(.hidden){display:block}
.mobile-abilities .ability-btn span{font:700 9px/1.2 var(--mono);display:block;white-space:nowrap;letter-spacing:0}
.mobile-abilities .ability-btn{font-family:var(--body);line-height:1.05}
@media (max-width:1100px){
 .header .brand-type{font-size:23px}
 .header .brand-type small{font-size:6px;letter-spacing:1.35px}
}
@media (max-width:850px){
 .header{height:54px;gap:8px;padding:0 9px}
 .header .brand{gap:8px;min-width:0}
 .header .brand-mark{width:26px;height:26px;flex:none}
 .header .brand-type{font-size:21px;letter-spacing:0}
 .header .brand-type small{font-size:6px;letter-spacing:1px;margin-top:4px}
 .header .top-actions{margin-left:auto;flex:none;gap:5px}
 .header .center-status{display:none}
 .header .online-count,.header #atlasBtn,.header #effectsBtn,.header #inviteBtn,.header #fullscreenBtn{display:none}
 .header .monitor-button{min-width:58px;height:31px;font-size:8px}
 .header #audioBtn{height:31px;width:31px}
 .mobile-menu-trigger{display:grid;position:relative;flex:none;place-items:center;width:33px;height:33px;border:1px solid rgba(255,185,139,.35);border-radius:8px;background:rgba(21,16,41,.96);color:#ffcbad;font-size:19px;z-index:1}
 .mobile-menu-panel{display:grid;position:fixed;top:calc(54px + env(safe-area-inset-top,0px));right:8px;width:min(265px,calc(100vw - 16px));padding:9px;gap:5px;border:1px solid rgba(250,182,135,.35);border-radius:12px;background:rgba(11,12,34,.98);box-shadow:0 20px 60px rgba(0,0,0,.65);backdrop-filter:blur(18px);z-index:99;max-height:calc(100dvh - 63px);overflow:auto;overscroll-behavior:contain}
 .mobile-menu-panel.hidden{display:none}
 .mobile-menu-panel button{width:100%;min-height:43px;text-align:left;background:rgba(255,255,255,.035);color:#f5eaff;border:1px solid rgba(255,255,255,.08);border-radius:7px;padding:11px 12px;font:700 11px var(--mono)}
 .mobile-menu-panel button:active{background:rgba(255,162,122,.2)}
 .hud-left-rail,.hud-right-rail{top:61px;bottom:calc(154px + env(safe-area-inset-bottom,0px))}
 .hud-left-rail .control-hint:not(.hidden){position:absolute;top:0;left:calc(100% + 8px);width:190px;max-height:min(280px,52dvh);z-index:15;overflow:auto;box-shadow:0 20px 40px rgba(0,0,0,.6)}
 .hud-left-rail .hud-controls-toggle{order:1;flex-shrink:0}
 .hud-left-rail .hud-events{order:2;min-height:0}
 .hud-left-rail .hud-side{order:0}
 .mobile-controls{bottom:calc(13px + env(safe-area-inset-bottom,0px));left:max(10px,env(safe-area-inset-left,0px));right:max(10px,env(safe-area-inset-right,0px));align-items:flex-end;gap:12px}
 .mobile-controls .joystick{height:104px;width:104px;flex:none}
 .mobile-abilities{display:flex;flex:none;gap:7px;align-items:center}
 .mobile-abilities .ability-btn{width:57px;height:57px;font-size:22px;min-width:0;touch-action:manipulation}
 .mobile-abilities .ability-btn span{font-size:8px;line-height:1.1;letter-spacing:0}
 .stats-bottom{bottom:calc(121px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);padding:6px 11px;gap:11px}
 .stats-bottom .stat{min-width:0}.stats-bottom .stat span{font-size:7px}.stats-bottom .stat strong{font-size:22px}
 .stats-bottom .stat-divider{height:24px}
 .stats-bottom .stat:nth-last-child(-n+2),.stats-bottom .stat-divider:nth-last-child(3){display:none}
 .server-monitor,.sound-panel{top:58px;right:8px;width:min(340px,calc(100vw - 16px));max-height:calc(100dvh - 65px);overflow:auto}
 .menu-body{max-height:calc(100dvh - 85px);overflow-y:auto;overscroll-behavior:contain;padding:4px 0 10px;align-self:center}
 .menu-layer{align-items:flex-start;padding-top:50px;overflow:hidden}
 .menu-body{margin-top:0}
}
@media (max-width:590px){
 .header{padding-left:9px;padding-right:8px}
 .header .brand-type{font-size:20px}
 .header .monitor-button{display:none} /* all options including server stats are in the mobile menu */
 .hud-left-rail{width:clamp(132px,37vw,156px);left:8px;bottom:calc(169px + env(safe-area-inset-bottom,0px))}
 .hud-right-rail{width:clamp(120px,33vw,143px);right:8px;bottom:calc(169px + env(safe-area-inset-bottom,0px))}
 .hud-left-rail .hud-side{padding:9px}
 .hud-left-rail .hud-name{font-size:21px}
 .hud-left-rail .hud-controls-toggle{height:29px}
 .hud-left-rail .control-hint:not(.hidden){top:0;width:min(180px,calc(100vw - 175px));padding:8px;left:calc(100% + 8px)}
 .hud-events .toast{font-size:8px;padding:6px 7px;line-height:1.2}
 .hud-events .kill-feed{display:none}
 .hud-right-rail .minimap{padding:8px 6px;gap:5px}
 .hud-right-rail .minimap canvas{width:min(100%,18dvh,113px);max-height:113px}
 .stats-bottom{bottom:calc(128px + env(safe-area-inset-bottom,0px));min-width:0;gap:8px;padding:6px 10px}
 .stats-bottom .stat span{font-size:6px;letter-spacing:0}
 .stats-bottom .stat strong{font-size:21px}
 .stats-bottom .stat-divider{height:22px}
 .mobile-controls .joystick{height:104px;width:104px}
 .mobile-abilities .ability-btn{width:54px;height:54px;font-size:20px}
 .mobile-abilities{gap:6px}
 .menu-body{width:calc(100% - 20px);max-width:430px}
 .hero h1{font-size:clamp(36px,10vw,55px)}
 .entry-inner{padding:17px}
 .join-note{white-space:normal;text-align:center;gap:5px;flex-wrap:wrap}
 .atlas-teaser{font-size:9px}
}
@media (max-width:360px){
 .header .brand-type{font-size:18px}
 .hud-left-rail{width:127px}.hud-right-rail{width:119px}
 .hud-left-rail .control-hint:not(.hidden){left:0;top:100%;width:190px}
 .stats-bottom .stat span{font-size:6px}
 .mobile-controls .joystick{height:92px;width:92px}
 .mobile-abilities .ability-btn{width:50px;height:50px}
 .mobile-abilities{gap:5px}
}
@media (max-width:850px) and (max-height:540px){
 .hud-left-rail,.hud-right-rail{bottom:78px}
 .hud-left-rail .atlas-discover,.hud-left-rail .progress-wrap,.hud-left-rail .progress-caption,.hud-left-rail .hud-events{display:none}
 .hud-left-rail .hud-side{padding:5px 8px}
 .hud-left-rail .hud-controls-toggle{margin-top:4px}
 .hud-right-rail .minimap canvas{width:min(100%,30dvh,95px)}
 .mobile-controls .joystick{height:64px;width:64px}
 .joystick #joystickKnob{width:33px;height:33px}
 .mobile-abilities .ability-btn{height:46px;width:46px;font-size:18px}
 .mobile-abilities .ability-btn span{font-size:7px}
 .stats-bottom{bottom:8px;left:50%;max-width:40%;padding:4px;gap:5px}
 .stats-bottom .stat strong{font-size:16px}
 .stats-bottom .stat span{font-size:5px}
 .stats-bottom .stat:nth-of-type(n+3),.stats-bottom .stat-divider:nth-of-type(n+2){display:none}
}
@media (max-width:590px) and (min-height:541px){.hud-left-rail{bottom:calc(191px + env(safe-area-inset-bottom,0px))}}
@media (max-width:850px) and (max-height:540px){
 .hud-right-rail .leaderboard{max-height:106px;min-height:0;padding:6px 9px;flex:0 0 auto}
 .hud-right-rail .leader-row{height:18px;font-size:9px}
 .hud-right-rail .leader-footer{display:none}
 .hud-right-rail .minimap{margin-top:auto;max-height:calc(100% - 112px)}
}