:root{--echo:#91e9ff;--echo2:#78ffa8;--warn:#ffcf5a;--danger:#ff6f72;--ink:#06090d;--panel:#0b1118e8;--line:#263844;--muted:#82939e}.echo-app{position:fixed;inset:0;width:100vw;height:100dvh;min-height:100dvh;margin:0;z-index:2147483000;background:radial-gradient(circle at 73% 30%,#13303a 0,#091117 28%,#05080b 64%,#030506 100%);color:#dce9ec;overflow:hidden;font-family:var(--font-sans,Inter,system-ui,sans-serif);isolation:isolate}.echo-app *{box-sizing:border-box}.echo-app button,.echo-app input,.echo-app select{font:inherit}.echo-noise,.echo-scanlines{position:absolute;inset:0;pointer-events:none;z-index:-1}.echo-noise{opacity:.12;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}.echo-scanlines{opacity:.09;background:repeating-linear-gradient(0deg,transparent 0 3px,#bdefff0b 3px 4px)}.echo-topline{height:70px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 28px;border-bottom:1px solid #2b3b43;background:#05090dd9;backdrop-filter:blur(18px);position:relative;z-index:20}.echo-back{color:#8fa1aa;font:700 10px var(--font-mono,monospace);letter-spacing:.15em}.echo-wordmark{font:900 17px var(--font-mono,monospace);letter-spacing:.18em}.echo-wordmark span{color:var(--echo)}.echo-wordmark small{display:block;text-align:center;color:#65747d;font-size:7px;letter-spacing:.35em;margin-top:4px}.echo-net{justify-self:end;display:flex;align-items:center;gap:9px;color:#7d8c93;font:700 8px var(--font-mono,monospace);letter-spacing:.1em}.echo-net i,.status-dot{width:7px;height:7px;border-radius:50%;background:#4b5960;box-shadow:0 0 12px currentColor}.echo-net.online i{background:#63e5a2;color:#63e5a2}.echo-net.error i{background:#ff6f72;color:#ff6f72}.echo-net b{color:#b4c7ce}.echo-shell{position:relative;height:calc(100dvh - 70px);min-height:0;overflow:hidden}.echo-screen{display:none;height:100%;min-height:0;padding:clamp(28px,5vw,72px);position:relative;overflow:auto}.echo-screen.is-active{display:block;animation:echoIn .4s cubic-bezier(.2,.75,.2,1)}@keyframes echoIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.echo-screen[data-screen=menu]{grid-template-columns:minmax(420px,.85fr) minmax(360px,1.15fr);gap:5vw;align-items:center}.echo-screen[data-screen=menu].is-active{display:grid}.echo-hero-copy{position:relative;z-index:2}.echo-eyebrow{color:#78909b;font:800 9px var(--font-mono,monospace);letter-spacing:.22em}.echo-hero-copy h1{font:900 clamp(62px,9vw,138px)/.72 var(--font-mono,monospace);letter-spacing:-.075em;margin:25px 0 30px;color:#edf7f8;text-shadow:0 10px 50px #000}.echo-hero-copy h1 span{color:transparent;-webkit-text-stroke:1px #76d8ed;text-shadow:0 0 50px #4ad7f52a}.echo-lead{max-width:570px;color:#96a8af;font-size:1rem;line-height:1.7}.echo-menu-actions{display:grid;max-width:500px;margin-top:35px;border-top:1px solid #283941}.echo-btn{position:relative;display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;padding:16px 18px;border:1px solid #2c3f48;border-top:0;background:#091016b8;color:#b7c7cc;font:800 10px var(--font-mono,monospace);letter-spacing:.14em;cursor:pointer;transition:.18s}.echo-btn:hover{background:#101d24;color:#effcff;padding-left:23px}.echo-btn.primary{background:linear-gradient(90deg,#0e3945,#102a32);color:#b9f5ff;border-color:#3a7380}.echo-btn.primary:hover{background:#154c5a}.echo-btn.danger{color:#f3989b;border-color:#5b3135}.echo-btn span{color:#50616a;font-size:8px}.echo-online{display:flex;gap:20px;margin-top:14px;color:#52636c;font:700 8px var(--font-mono,monospace);letter-spacing:.1em}.echo-online b{color:#81939a}.echo-hero-visual{position:relative;min-height:570px;display:grid;place-items:center;perspective:900px}.echo-depth-grid{position:absolute;inset:0;background:linear-gradient(#65dff20a 1px,transparent 1px),linear-gradient(90deg,#65dff20a 1px,transparent 1px);background-size:42px 42px;transform:rotateX(61deg) translateY(100px) scale(1.25);mask-image:linear-gradient(to bottom,#000,transparent 82%)}.echo-reactor{position:relative;width:min(34vw,390px);aspect-ratio:1;border:1px solid #3a5c66;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 80px #56dff318,0 0 120px #1c9ab31b;animation:reactor 8s linear infinite}.echo-reactor:before,.echo-reactor:after{content:"";position:absolute;border-radius:50%;border:1px dashed #4c8996}.echo-reactor:before{inset:11%;animation:reactor 5s linear infinite reverse}.echo-reactor:after{inset:29%;border-style:solid;box-shadow:0 0 32px #79e9ff33}.echo-reactor i{position:absolute;width:44%;height:1px;background:linear-gradient(90deg,transparent,#58d9ed,transparent);transform:rotate(calc(var(--i,0)*45deg))}.echo-reactor i:nth-child(1){--i:1}.echo-reactor i:nth-child(2){--i:2}.echo-reactor i:nth-child(3){--i:3}.echo-reactor i:nth-child(4){--i:4}.echo-reactor b{font:900 58px var(--font-mono,monospace);color:#bdecf5;letter-spacing:-.08em;text-shadow:0 0 35px #6ce7ff55}.echo-reactor+ .echo-depth-grid{}.echo-hero-visual>p{position:absolute;right:0;bottom:12%;font:700 8px/1.8 var(--font-mono,monospace);letter-spacing:.18em;color:#647680}.echo-hero-visual>p b{font-size:18px;color:#bdd8dd}.echo-signal{position:absolute;border:1px solid #38606b;opacity:.45}.signal-a{width:75%;height:22%;transform:rotate(-12deg)}.signal-b{width:55%;height:38%;transform:rotate(23deg)}@keyframes reactor{to{transform:rotate(360deg)}}.echo-brief{position:absolute;right:34px;bottom:25px;width:min(390px,33vw);padding:18px 20px;border:1px solid #2c3d44;background:#071016c9;backdrop-filter:blur(12px)}.echo-brief>span{font:700 7px var(--font-mono,monospace);color:#71848d;letter-spacing:.16em}.echo-brief h2{font:800 15px var(--font-mono,monospace);letter-spacing:.05em;margin:9px 0}.echo-brief p{font-size:11px;line-height:1.6;color:#81949c}.echo-brief dl{display:grid;grid-template-columns:repeat(3,1fr);margin:15px 0 0;border-top:1px solid #23343b;padding-top:11px}.echo-brief dt{font:700 7px var(--font-mono,monospace);color:#5e7078}.echo-brief dd{margin:4px 0 0;font:800 10px var(--font-mono,monospace);color:#c3d6da}.echo-lobby-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:34px}.echo-lobby-head h2,.echo-results-head h2{font:900 clamp(38px,5vw,68px) var(--font-mono,monospace);margin:6px 0 0;letter-spacing:-.06em}.echo-room-code small{display:block;text-align:right;color:#74858d;font:700 8px var(--font-mono,monospace)}.echo-room-code button{margin-top:8px;display:flex;align-items:center;gap:15px;border:1px solid #36505a;background:#091219;color:#dff8fb;padding:10px 13px;cursor:pointer}.echo-room-code b{font:900 25px var(--font-mono,monospace);letter-spacing:.18em;color:var(--echo)}.echo-room-code span{font:700 7px var(--font-mono,monospace);color:#6f828a}.echo-lobby-grid{display:grid;grid-template-columns:minmax(420px,1fr) minmax(330px,.7fr);gap:18px}.echo-panel{border:1px solid #293c44;background:linear-gradient(145deg,#0a1118e8,#070c11e8);box-shadow:0 20px 60px #0005}.echo-panel>header{display:flex;justify-content:space-between;padding:12px 15px;border-bottom:1px solid #26373e;color:#71848d;font:700 8px var(--font-mono,monospace);letter-spacing:.15em}.echo-roster>div{padding:7px}.roster-slot{display:grid;grid-template-columns:44px 1fr auto auto;align-items:center;gap:12px;min-height:68px;padding:10px;border-bottom:1px solid #1d2a30}.roster-slot:last-child{border:0}.roster-avatar{width:42px;height:42px;border:1px solid #3b5058;background:#111b21;display:grid;place-items:center;overflow:hidden;font:900 14px var(--font-mono,monospace);color:#8adff1}.roster-avatar img{width:100%;height:100%;object-fit:cover}.roster-slot strong{display:block;font:800 11px var(--font-mono,monospace);color:#d5e2e5}.roster-slot small{display:block;margin-top:5px;color:#61747d;font:700 7px var(--font-mono,monospace)}.roster-ready{font:800 8px var(--font-mono,monospace);color:#d58183}.roster-ready.ready{color:#65e4a0}.roster-kick{border:1px solid #4b2c31;background:transparent;color:#bd6b70;font:700 7px var(--font-mono,monospace);padding:7px;cursor:pointer}.empty-slot{opacity:.32}.echo-mission-config{padding-bottom:0}.echo-mission-config>label{display:grid;grid-template-columns:1fr minmax(165px,.8fr);align-items:center;gap:14px;margin:0 16px;padding:15px 0;border-bottom:1px solid #1f2e34;color:#7e9097;font:700 8px var(--font-mono,monospace);letter-spacing:.1em}.echo-mission-config select,.echo-settings-grid select{background:#0d171d;border:1px solid #334951;color:#c9dadd;padding:9px 10px;font:700 9px var(--font-mono,monospace)}.echo-loadout-summary{margin:18px;padding:15px;border-left:2px solid #55cfe7;background:#0c161d}.echo-loadout-summary small{color:#65777f;font:700 7px var(--font-mono,monospace)}.echo-loadout-summary b{display:block;margin-top:6px;color:#cceff4;font:800 13px var(--font-mono,monospace)}.echo-loadout-summary p{font-size:10px;color:#71838b;margin:5px 0}.echo-link{border:0;background:none;color:#78dff2;padding:0;font:700 8px var(--font-mono,monospace);cursor:pointer}.echo-lobby-actions{display:grid;grid-template-columns:.7fr 1fr 1.4fr}.echo-lobby-footer{display:flex;gap:28px;margin-top:12px;color:#64757d;font:700 8px var(--font-mono,monospace)}.echo-lobby-footer span:first-child{color:#83ad9b}.echo-game-screen{padding:0!important;height:100%;min-height:0;overflow:hidden}.echo-game-screen.is-active{display:block}.echo-game-screen canvas{display:block;width:100%;height:100%;background:#05080b;cursor:none}.echo-hud{position:absolute;inset:0;pointer-events:none;font-family:var(--font-mono,monospace);--ui-scale:1;transform-origin:top left}.echo-objective-card,.echo-team-card{position:absolute;top:24px;background:#071017d9;border:1px solid #294049;backdrop-filter:blur(8px);padding:13px 15px}.echo-objective-card{left:24px;width:310px}.echo-team-card{right:24px;width:230px}.echo-objective-card small,.echo-team-card>small{color:#647980;font-size:7px;letter-spacing:.16em}.echo-objective-card h3{font-size:12px;margin:7px 0 4px;color:#d7e8eb}.echo-objective-card p{font-size:9px;color:#879aa1;margin:0;line-height:1.5}.objective-progress{height:3px;background:#1b2a31;margin-top:11px}.objective-progress i{display:block;height:100%;width:0;background:var(--echo);box-shadow:0 0 10px #62dcf1}.team-row{display:grid;grid-template-columns:7px 1fr auto;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid #1d2c32;font-size:8px}.team-row i{width:5px;height:5px;border-radius:50%;background:var(--player-color)}.team-row b{color:#adc0c5;font-weight:700}.team-row span{color:#72858c}.team-row.downed b{color:#ffbf61}.team-row.dead{opacity:.4}.echo-top-hud{position:absolute;top:24px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:15px;background:#071017c7;border:1px solid #263b43;padding:9px 14px;color:#6f858d;font-size:7px;letter-spacing:.11em}.echo-top-hud b{font-size:13px;color:#dcecef}.echo-event-banner{position:absolute;top:96px;left:50%;transform:translateX(-50%);min-width:300px;text-align:center;background:#36181be8;border:1px solid #863e42;padding:10px 18px;box-shadow:0 0 50px #ff505022}.echo-event-banner small{display:block;color:#c5797d;font-size:6px;letter-spacing:.2em}.echo-event-banner b{display:block;margin-top:3px;color:#ffd1d1;font-size:12px;letter-spacing:.15em}.echo-player-hud{position:absolute;left:22px;right:22px;bottom:21px;display:flex;justify-content:space-between;align-items:end}.vitals{width:250px}.vitals>div{display:grid;grid-template-columns:65px 34px 1fr;align-items:center;gap:7px;margin-top:5px;color:#7e9198;font-size:7px}.vitals b{color:#dbe8ea;font-size:10px}.vitals span{height:5px;background:#15242a}.vitals i{display:block;height:100%;width:100%;background:#79e6ae;transition:width .14s}.vitals>div:first-child i{background:#e98684}.inventory{display:flex;gap:5px}.inventory button{pointer-events:auto;min-width:92px;padding:8px 9px;border:1px solid #2d4148;background:#071017d9;color:#72868d;text-align:left;display:grid;grid-template-columns:auto 1fr auto;gap:6px;align-items:center;font:700 7px var(--font-mono,monospace)}.inventory kbd,.echo-interact kbd{border:1px solid #4a6068;background:#101b20;color:#d4e1e3;padding:2px 4px;font:700 8px var(--font-mono,monospace)}.inventory b{color:#d2e3e6}.inventory .weapon{min-width:135px}.echo-interact{position:absolute;left:50%;bottom:112px;transform:translateX(-50%);display:grid;grid-template-columns:auto auto;gap:8px;align-items:center;background:#071017e8;border:1px solid #38525b;padding:8px 10px;color:#b9ccd1;font-size:8px}.echo-interact i{grid-column:1/3;height:2px;background:#1c2b31}.echo-interact i b{display:block;height:100%;width:0;background:var(--echo)}.echo-controls-tip{position:absolute;left:50%;bottom:15px;transform:translateX(-50%);color:#62747c;font-size:6px;letter-spacing:.07em;background:#071017a8;padding:5px 8px}.echo-crosshair{position:absolute;width:28px;height:28px;transform:translate(-50%,-50%);left:50%;top:50%}.echo-crosshair i{position:absolute;background:#d8f9ff;box-shadow:0 0 5px #6fe5f5}.echo-crosshair i:nth-child(1),.echo-crosshair i:nth-child(2){width:7px;height:1px;top:13px}.echo-crosshair i:nth-child(1){left:0}.echo-crosshair i:nth-child(2){right:0}.echo-crosshair i:nth-child(3),.echo-crosshair i:nth-child(4){width:1px;height:7px;left:13px}.echo-crosshair i:nth-child(3){top:0}.echo-crosshair i:nth-child(4){bottom:0}.echo-damage-vignette{position:absolute;inset:0;box-shadow:inset 0 0 90px 35px #ff273500;transition:.12s}.echo-damage-vignette.hit{box-shadow:inset 0 0 110px 45px #ff273555}.echo-results-head{text-align:center;margin-bottom:28px}.echo-results-head p{color:#778a91}.echo-results-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;max-width:980px;margin:0 auto 18px}.echo-result-stat{padding:18px;border:1px solid #2c4048;background:#091118;text-align:center}.echo-result-stat small{display:block;color:#687b83;font:700 7px var(--font-mono,monospace)}.echo-result-stat b{display:block;margin-top:7px;color:#d4e9ec;font:900 17px var(--font-mono,monospace)}.echo-result-table{max-width:980px;margin:auto}.result-player{display:grid;grid-template-columns:minmax(160px,1fr) repeat(6,80px);gap:8px;padding:12px 15px;border-bottom:1px solid #1d2a30;align-items:center;font:700 8px var(--font-mono,monospace);color:#81949b}.result-player b{color:#cddfe2}.result-player span:not(:first-child){text-align:right}.echo-xp{max-width:980px;margin:14px auto;padding:15px;border:1px solid #28404a;background:#081219}.echo-xp>small{color:#677a82;font:700 7px var(--font-mono,monospace)}.echo-xp>div{display:grid;grid-template-columns:70px 1fr 120px;gap:12px;align-items:center;margin-top:8px}.echo-xp b{font:900 12px var(--font-mono,monospace)}.echo-xp span{height:5px;background:#1a2a30}.echo-xp i{display:block;height:100%;width:0;background:var(--echo2)}.echo-xp em{font:700 8px var(--font-mono,monospace);color:#75888f;text-align:right;font-style:normal}.echo-result-actions{display:grid;grid-template-columns:1fr 1fr;max-width:580px;margin:18px auto}.echo-modal{border:1px solid #35505b;background:#081016;color:#d4e2e5;width:min(520px,92vw);padding:0;box-shadow:0 25px 100px #000c}.echo-modal.wide{width:min(820px,94vw)}.echo-modal::backdrop{background:#010406d9;backdrop-filter:blur(6px)}.echo-modal form{position:relative;padding:28px}.echo-modal h2{font:900 30px var(--font-mono,monospace);letter-spacing:-.05em;margin:7px 0}.echo-modal p{color:#778a91;font-size:11px;line-height:1.6}.modal-x{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#71838a;font-size:25px;cursor:pointer}.echo-modal input[data-join-code]{display:block;width:100%;margin:24px 0 12px;padding:18px;text-align:center;background:#04090d;border:1px solid #36515c;color:#9cecff;font:900 28px var(--font-mono,monospace);letter-spacing:.3em;text-transform:uppercase}.modal-error{min-height:20px;margin-top:10px;color:#ef7f83;font:700 8px var(--font-mono,monospace)}.echo-loadout-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;margin-top:22px}.loadout-card{padding:14px 10px;border:1px solid #2b4048;background:#0b141a;color:#82969d;cursor:pointer;text-align:left;min-height:150px}.loadout-card:hover,.loadout-card.selected{border-color:#55cbe0;background:#10222a}.loadout-card strong{display:block;color:#c7dadd;font:800 10px var(--font-mono,monospace)}.loadout-card small{display:block;margin-top:7px;color:#63767e;font-size:8px;line-height:1.55}.loadout-card em{display:block;margin-top:15px;color:#6edff2;font:700 7px var(--font-mono,monospace);font-style:normal}.modal-note{border-top:1px solid #22343b;padding-top:14px}.profile-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:20px 0}.profile-stat{padding:12px;border:1px solid #273b43;background:#0b141a}.profile-stat small{display:block;color:#62757d;font:700 7px var(--font-mono,monospace)}.profile-stat b{display:block;margin-top:6px;color:#d6e6e9;font:900 15px var(--font-mono,monospace)}.achievement-list{display:grid;gap:6px}.achievement-row{padding:10px;border-left:2px solid #64cfe2;background:#0b141a}.achievement-row b{display:block;font:800 9px var(--font-mono,monospace)}.achievement-row small{color:#75888f;font-size:8px}.echo-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:20px 0}.echo-settings-grid label{display:grid;gap:7px;color:#71848b;font:700 8px var(--font-mono,monospace)}.echo-settings-grid input[type=range]{width:100%}.echo-settings-grid .toggle{grid-template-columns:1fr auto;align-items:center;padding:12px;border:1px solid #263a42}.echo-toast{position:fixed;right:22px;bottom:22px;z-index:1000;max-width:360px;padding:12px 15px;border:1px solid #3b5660;background:#09131a;color:#cde0e4;font:700 9px var(--font-mono,monospace);box-shadow:0 15px 45px #0009}.echo-app~*{}body.echo-game-active .footer{display:none}body.echo-game-active #main{padding-bottom:0}body.echo-game-active .back-to-top{display:none!important}@media(max-width:1000px){.echo-screen[data-screen=menu].is-active{grid-template-columns:1fr}.echo-hero-visual,.echo-brief{display:none}.echo-lobby-grid{grid-template-columns:1fr}.echo-loadout-grid{grid-template-columns:repeat(2,1fr)}.result-player{grid-template-columns:1fr repeat(3,70px)}.result-player span:nth-child(n+5){display:none}}@media(max-width:700px){.echo-app:before{content:"Pentru cea mai buna experienta, foloseste un PC.";position:fixed;inset:70px 0 auto;z-index:80;background:#111b20;color:#dbe7e9;padding:10px;text-align:center;font:700 9px var(--font-mono,monospace)}.echo-topline{grid-template-columns:auto 1fr}.echo-wordmark{justify-self:center}.echo-net{display:none}.echo-screen{padding:30px 16px}.echo-lobby-head{align-items:flex-start;gap:20px;flex-direction:column}.echo-room-code small{text-align:left}.echo-results-grid{grid-template-columns:1fr 1fr}.echo-loadout-grid{grid-template-columns:1fr}.echo-settings-grid{grid-template-columns:1fr}.echo-team-card{display:none}.echo-objective-card{width:calc(100% - 48px)}.inventory button{min-width:54px}.inventory button span{display:none}.vitals{width:180px}}@media(prefers-reduced-motion:reduce){.echo-screen.is-active,.echo-reactor,.echo-reactor:before{animation:none}.echo-btn{transition:none}}
.echo-keybinds{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 0 18px}.echo-keybinds>small{grid-column:1/-1;color:#667a82;font:700 7px var(--font-mono,monospace);letter-spacing:.14em}.echo-keybinds button{display:flex;justify-content:space-between;align-items:center;padding:9px 10px;border:1px solid #2b4048;background:#0b141a;color:#84979e;font:700 7px var(--font-mono,monospace);cursor:pointer}.echo-keybinds button.listening{border-color:#65dff2;color:#bfeff7}.echo-keybinds kbd{color:#d6e6e9;font:800 8px var(--font-mono,monospace)}

/* ECHO DEPTHS dedicated fullscreen shell */
html:has(body.echo-game-active),body.echo-game-active{overflow:hidden!important}
body.echo-game-active header:not(.echo-topline),body.echo-game-active nav:not(.echo-topline *),body.echo-game-active .site-header,body.echo-game-active .navbar,body.echo-game-active .footer,body.echo-game-active footer,body.echo-game-active .back-to-top{visibility:hidden!important;pointer-events:none!important}
body.echo-game-active .echo-app,body.echo-game-active .echo-app *{visibility:visible}
@supports not (height:100dvh){.echo-app{height:100vh;min-height:100vh}.echo-shell{height:calc(100vh - 70px)}}

/* v4: viewport-fit layout — never require page scrolling on desktop */
:root{--echo-vw:100vw;--echo-vh:100dvh;--echo-topbar:clamp(48px,7.2vh,70px)}
html:has(body.echo-game-active),body.echo-game-active{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;margin:0!important;padding:0!important;overflow:hidden!important;overscroll-behavior:none}
body.echo-game-active .echo-app{position:fixed!important;left:0!important;top:0!important;right:auto!important;bottom:auto!important;width:var(--echo-vw)!important;height:var(--echo-vh)!important;min-height:0!important;max-height:var(--echo-vh)!important;overflow:hidden!important}
.echo-topline{height:var(--echo-topbar);min-height:0;padding-inline:clamp(14px,2vw,28px)}
.echo-shell{height:calc(var(--echo-vh) - var(--echo-topbar));min-height:0;overflow:hidden}
.echo-screen{height:100%;min-height:0;max-height:100%;overflow:hidden;padding:clamp(12px,3.1vh,42px) clamp(16px,4vw,72px)}
.echo-screen[data-screen=menu]{gap:clamp(18px,4vw,70px)}
.echo-hero-copy h1{font-size:clamp(46px,min(9vw,13.2vh),138px);margin:clamp(10px,2.2vh,25px) 0 clamp(12px,2.8vh,30px)}
.echo-lead{font-size:clamp(.78rem,1.55vh,1rem);line-height:1.55}
.echo-menu-actions{margin-top:clamp(12px,3vh,35px)}
.echo-btn{padding:clamp(9px,1.65vh,16px) 18px}
.echo-online{margin-top:clamp(6px,1.4vh,14px)}
.echo-hero-visual{min-height:0;height:min(570px,calc(var(--echo-vh) - var(--echo-topbar) - 44px))}
.echo-reactor{width:min(34vw,43vh,390px)}
.echo-brief{right:clamp(14px,2.4vw,34px);bottom:clamp(10px,2.4vh,25px);padding:clamp(10px,1.8vh,18px) 20px}
.echo-lobby-head{margin-bottom:clamp(12px,3vh,34px)}
.echo-lobby-head h2,.echo-results-head h2{font-size:clamp(32px,min(5vw,7vh),68px)}
.roster-slot{min-height:clamp(48px,7.1vh,68px);padding:clamp(6px,1vh,10px)}
.echo-mission-config>label{padding:clamp(8px,1.55vh,15px) 0}
.echo-loadout-summary{margin:clamp(8px,1.7vh,18px);padding:clamp(9px,1.5vh,15px)}
.echo-lobby-footer{margin-top:clamp(5px,1.2vh,12px)}
.echo-results-head{margin-bottom:clamp(10px,2vh,28px)}
.echo-result-stat{padding:clamp(9px,1.7vh,18px)}
.result-player{padding:clamp(7px,1.2vh,12px) 15px}
.echo-xp{margin:clamp(7px,1.5vh,14px) auto;padding:clamp(8px,1.5vh,15px)}
.echo-result-actions{margin:clamp(8px,1.8vh,18px) auto}
.echo-modal{max-height:calc(var(--echo-vh) - 20px);overflow:auto}
.echo-modal form{padding:clamp(18px,3vh,28px)}
@media(max-height:820px){
  :root{--echo-topbar:54px}
  .echo-wordmark{font-size:14px}.echo-wordmark small{margin-top:2px}
  .echo-hero-copy h1{font-size:clamp(48px,min(8vw,11.5vh),92px)}
  .echo-hero-copy h1 br{line-height:.72}
  .echo-brief{width:min(350px,31vw)}
  .echo-brief p{margin:6px 0;font-size:9px}.echo-brief dl{margin-top:8px;padding-top:7px}
  .echo-room-code b{font-size:21px}.echo-lobby-grid{gap:12px}
  .profile-grid{margin:10px 0}.echo-settings-grid{margin:10px 0;gap:8px}
}
@media(max-height:680px){
  :root{--echo-topbar:46px}
  .echo-topline{padding-inline:12px}.echo-wordmark{font-size:12px}.echo-wordmark small{display:none}
  .echo-screen{padding:9px 18px}
  .echo-eyebrow{font-size:7px}.echo-hero-copy h1{font-size:clamp(42px,min(7.2vw,10.2vh),70px);margin:7px 0 9px}
  .echo-lead{font-size:11px;line-height:1.35}.echo-menu-actions{margin-top:8px}.echo-btn{padding:8px 12px}
  .echo-online{margin-top:5px}.echo-brief{display:none}.echo-hero-visual{height:calc(var(--echo-vh) - var(--echo-topbar) - 18px)}
  .echo-lobby-head{margin-bottom:7px}.echo-lobby-head h2,.echo-results-head h2{font-size:30px;margin-top:2px}
  .roster-slot{min-height:42px}.roster-avatar{width:32px;height:32px}.echo-mission-config>label{padding:6px 0}
  .echo-loadout-summary{margin:6px 12px;padding:7px 10px}.echo-lobby-footer{display:none}
  .echo-results-grid{margin-bottom:7px}.echo-result-stat{padding:7px}.result-player{padding:6px 10px}.echo-xp{margin:6px auto;padding:7px}.echo-result-actions{margin:6px auto}
}

/* V7 entry gate — intentionally restrained, game-first UI */
.echo-fullscreen-gate{
  position:fixed;inset:0;z-index:2147483646;
  display:grid;place-items:center;padding:24px;
  background:
    radial-gradient(ellipse at 70% 35%,rgba(35,115,132,.12),transparent 42%),
    linear-gradient(180deg,#05090c 0%,#030608 100%);
  color:#dce7e9;
  transition:opacity .18s ease,visibility .18s ease;
}
.echo-fullscreen-gate::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 82%,transparent 100%);
}
.echo-fullscreen-gate.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.echo-entry-card{
  position:relative;width:min(560px,calc(100vw - 40px));
  padding:30px;border:1px solid #26373e;border-radius:4px;
  background:#091015;box-shadow:0 30px 90px rgba(0,0,0,.46);
}
.echo-entry-brand{display:flex;align-items:center;gap:13px;padding-bottom:22px;border-bottom:1px solid #1e2d33}
.echo-entry-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid #3c6670;color:#7dd6e7;font:800 17px/1 var(--font-mono,monospace)}
.echo-entry-brand strong{display:block;color:#ecf4f5;font:800 13px/1.1 var(--font-mono,monospace);letter-spacing:.08em}
.echo-entry-brand span{display:block;margin-top:4px;color:#63777e;font:600 7px/1 var(--font-mono,monospace);letter-spacing:.16em}
.echo-entry-copy{padding:30px 0 24px}
.echo-entry-copy small{display:block;margin-bottom:9px;color:#6d858d;font:700 7px/1 var(--font-mono,monospace);letter-spacing:.17em}
.echo-entry-copy h2{margin:0 0 12px;color:#f1f6f7;font:760 clamp(30px,5vw,45px)/.98 var(--font-display,Arial,sans-serif);letter-spacing:-.035em}
.echo-entry-copy p{max-width:430px;margin:0;color:#93a4aa;font:400 13px/1.6 var(--font-ui,Arial,sans-serif)}
.echo-entry-button{width:100%;height:48px;border:1px solid #4f98a6;border-radius:3px;background:#12333c;color:#d8f8ff;font:800 10px/1 var(--font-mono,monospace);letter-spacing:.13em;cursor:pointer;transition:background .12s ease,border-color .12s ease,transform .12s ease}
.echo-entry-button:hover{background:#17434e;border-color:#68bdcc}.echo-entry-button:active{transform:translateY(1px)}.echo-entry-button:disabled{opacity:.55;cursor:wait}
.echo-entry-meta{display:flex;justify-content:space-between;gap:16px;margin-top:11px;color:#536970;font:650 7px/1.3 var(--font-mono,monospace);letter-spacing:.1em}
.echo-entry-error{margin-top:16px;padding:11px 12px;border-left:2px solid #d76868;background:#241214;color:#f1a9a9;font:650 8px/1.5 var(--font-mono,monospace)}
@media(max-width:620px){.echo-entry-card{padding:22px}.echo-entry-copy{padding:24px 0 20px}.echo-entry-meta{flex-direction:column;gap:5px}.echo-entry-copy h2{font-size:32px}}
@media(max-height:560px){.echo-entry-card{padding:18px}.echo-entry-brand{padding-bottom:14px}.echo-entry-copy{padding:17px 0 15px}.echo-entry-copy p{font-size:11px}.echo-entry-button{height:42px}}

/* V8 — native 3D gameplay viewport */
.echo-game-screen canvas{position:absolute;inset:0;width:100%!important;height:100%!important;touch-action:none;outline:0;background:#020405}
body.echo-pointer-locked .echo-game-screen canvas{cursor:none}
.echo-game-screen .echo-crosshair{left:50%!important;top:50%!important;opacity:.92}
.echo-game-screen .echo-crosshair:after{content:"";position:absolute;left:13px;top:13px;width:2px;height:2px;border-radius:50%;background:#e7fbff;box-shadow:0 0 7px #66e6ff}
.echo-app:has(.echo-game-screen.is-active) .echo-topline{display:none}
.echo-app:has(.echo-game-screen.is-active) .echo-shell{height:var(--echo-vh)!important}
.echo-app:has(.echo-game-screen.is-active) .echo-game-screen{height:var(--echo-vh)!important}
.echo-game-screen .echo-objective-card,.echo-game-screen .echo-team-card,.echo-game-screen .echo-top-hud{background:rgba(4,10,13,.68);backdrop-filter:blur(5px)}
.echo-game-screen .echo-controls-tip{background:rgba(2,7,9,.58);border-color:rgba(92,149,160,.28)}

/* V12 performance pass: keep WebGL compositing cheap during gameplay */
.echo-app:has(.echo-game-screen.is-active) .echo-noise,
.echo-app:has(.echo-game-screen.is-active) .echo-scanlines{display:none!important}
.echo-game-screen .echo-objective-card,
.echo-game-screen .echo-team-card,
.echo-game-screen .echo-top-hud{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(4,10,13,.88)!important}
.echo-game-screen canvas{image-rendering:auto;contain:strict}