/* Host lobby only. The game and student screens keep their existing layout. */
.launcher{padding-top:3vh;padding-bottom:5vh;gap:18px}
.launcher-title .brand--game-logo img{display:block;width:min(500px,86vw);height:clamp(130px,34dvh,280px);object-fit:contain;filter:drop-shadow(0 7px 0 #081a33);}
.host-console.is-lobby{padding:0;background:#0d1629}
.host-console.is-lobby>.game-toolbar,.host-console.is-lobby>.host-grid{display:none!important}
.host-lobby[hidden]{display:none!important}
.host-lobby{width:100%;height:100dvh;display:grid;grid-template-columns:minmax(0,3fr) minmax(310px,1fr);overflow:hidden;color:#f6f7ff;background:#0a152a;font-family:ui-sans-serif,system-ui,sans-serif}
.lobby-screen{position:relative;min-width:0;min-height:0;overflow:hidden;isolation:isolate;background:#10243b}
.lobby-film-fallback,.lobby-film-stage,.lobby-screen-shade{position:absolute;inset:0}
.lobby-film-fallback{z-index:0;background:linear-gradient(180deg,#091b3210 40%,#081426b8),url('/assets/arena.png') center/cover no-repeat;image-rendering:pixelated}
.lobby-film-stage{z-index:1;opacity:0;transition:opacity .5s ease}
.film-ready .lobby-film-stage{opacity:1}
.lobby-film-stage canvas,.lobby-film-stage video{display:block;width:100%;height:100%;outline:none;object-fit:contain;background:#10243b}
.lobby-screen-shade{z-index:2;pointer-events:none;background:linear-gradient(180deg,#06112518,transparent 28%,transparent 52%,#030916e8)}
.lobby-chapter{position:absolute;z-index:3;inset:auto clamp(24px,3.4vw,72px) clamp(30px,4vh,64px);max-width:1000px;pointer-events:none;text-shadow:0 3px 15px #030a20,2px 3px #071329}
.lobby-chapter-kicker{margin:0 0 10px;color:#88eee0;font:700 clamp(22px,2vw,36px)/1.1 'Pixelify Sans',ui-monospace,monospace;letter-spacing:1.5px}
.lobby-chapter h1{margin:0;color:#fff0c7;font:800 clamp(44px,5.2vw,102px)/.98 'Pixelify Sans',ui-monospace,monospace;letter-spacing:-.5px;text-wrap:balance;max-width:13ch}
.lobby-chapter-subtitle{margin:14px 0 0;color:#e4efff;font:600 clamp(23px,2.1vw,37px)/1.18 ui-sans-serif,system-ui,sans-serif;max-width:34ch;text-wrap:balance}
.lobby-chapter-progress{height:5px;margin-top:22px;max-width:300px;background:#c9e5ff25;overflow:hidden}
.lobby-chapter-progress i{display:block;width:100%;height:100%;background:#8ce9d8;transform:scaleX(0);transform-origin:left center;box-shadow:0 0 10px #8ce9d8}
.lobby-join-panel{min-width:0;min-height:0;display:flex;flex-direction:column;gap:14px;padding:clamp(16px,1.35vw,28px);border-left:3px solid #6989b0;background:radial-gradient(ellipse at 50% 5%,#2d4765,#152840 55%,#101d32);box-shadow:-16px 0 50px #030c1d66,inset 2px 0 #cfe8ff16;z-index:4;container-type:inline-size}
.lobby-identity{flex:none;text-align:center;min-width:0}
.lobby-logo{display:block;width:92%;height:clamp(74px,12vh,138px);object-fit:contain;margin:0 auto 10px;filter:drop-shadow(0 5px 0 #050f23)}
.lobby-logo[hidden],.lobby-logo-fallback[hidden]{display:none!important}
.lobby-logo-fallback{display:block;margin:0 0 10px;font:800 48px/.82 'Pixelify Sans',ui-monospace,monospace;color:#fff1c2;text-shadow:3px 4px #061329}
.lobby-logo-fallback span{color:#ff9c83}
.lobby-url-label,.lobby-code-label{display:block;margin:0 0 4px;color:#a9c4e0;font:700 clamp(18px,5.9cqw,26px)/1 'Pixelify Sans',ui-monospace,monospace;letter-spacing:1.5px}
.lobby-join-url{margin:0 0 15px;font:700 clamp(22px,7.1cqw,30px)/1.13 ui-sans-serif,system-ui,sans-serif;color:#e9f5ff;overflow-wrap:anywhere;word-break:normal;text-wrap:balance}
.lobby-room-code{display:block;margin:0;color:#ffe091;font:800 clamp(58px,22cqw,108px)/1.08 ui-monospace,monospace;letter-spacing:-2px;text-shadow:0 4px #816345,2px 0 #816345;white-space:nowrap}
.host-console .lobby-copy{min-height:38px;margin-top:8px;padding:5px 10px;border:0;background:transparent;box-shadow:none;color:#9fe6e8;font-size:18px;text-decoration:underline;text-underline-offset:4px}
.lobby-crew{display:flex;flex:1;flex-direction:column;min-height:80px;overflow:hidden}
.lobby-crew>header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;padding:0 0 8px;margin-bottom:4px;border-bottom:2px solid #8eb3d840}
.lobby-crew h2{margin:0;color:#d7edff;font:700 clamp(24px,7.5cqw,34px)/1 'Pixelify Sans',ui-monospace,monospace;letter-spacing:.5px}
.lobby-crew>header>strong{font:800 clamp(22px,6.7cqw,30px)/1 'Pixelify Sans',ui-monospace,monospace;color:#ffe1a0;white-space:nowrap}
.lobby-player-list{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#6f91b8 #14233b;padding-right:3px;overscroll-behavior:contain}
.host-console .lobby-player{display:flex;align-items:center;gap:7px;min-height:38px;width:100%;padding:3px 2px;border:0;border-bottom:1px solid #8ab0d824;border-radius:0;background:transparent;box-shadow:none;text-align:left;animation:lobby-player-arrive .45s ease-out both}
.lobby-player .host-avatar{width:32px;height:32px;flex-basis:32px}
.lobby-player strong{min-width:0;color:#f2f6ff;font:700 clamp(22px,7.6cqw,30px)/1.1 'Pixelify Sans',ui-monospace,monospace;white-space:nowrap;letter-spacing:-.25px}
.lobby-name-alert{margin-left:auto;color:#ffce81;font-size:22px;font-weight:800}
.lobby-empty{margin:16px 0;color:#bed3ea;font:600 23px/1.25 'Pixelify Sans',ui-monospace,monospace;text-align:center}
.lobby-empty[hidden]{display:none}
.lobby-actions{flex:none;display:grid;gap:10px}
.host-console .lobby-start{width:100%;min-height:60px;border:2px solid #ffcf95;background:linear-gradient(#ff936e,#e96752);box-shadow:inset 0 2px #ffe9bd66,0 5px #753c3c;color:#142239;font:800 clamp(28px,9cqw,40px)/1 'Pixelify Sans',ui-monospace,monospace;text-shadow:none}
.host-console .lobby-start:hover:not(:disabled){background:linear-gradient(#ffae83,#ef8060)}
.host-console .lobby-start:disabled{opacity:.6}
.lobby-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.host-console .lobby-tools button{min-width:0;min-height:44px;padding:5px 4px;font:700 clamp(16px,5.4cqw,21px)/1.05 'Pixelify Sans',ui-monospace,monospace;background:#253d59;border-color:#6583a6;overflow-wrap:normal}
.host-console .lobby-tools button:hover:not(:disabled){background:#3d5979}
.host-console .lobby-tools .host-sound-toggle.is-on{background:#255b59;border-color:#78cfc1}
.lobby-tools [hidden]{display:none!important}
.lobby-connection{text-align:center;min-height:20px}
.host-console .lobby-connection .connection{font-size:18px;color:#a4c3db}
.host-console .lobby-connection .connection.retrying{color:#ffcc83}
@keyframes lobby-player-arrive{from{background:#8ce9d82b;transform:translateX(8px);opacity:.4}to{background:transparent;transform:none;opacity:1}}
@media(max-height:740px) and (min-width:901px){.lobby-join-panel{gap:10px;padding:13px 16px}.lobby-logo{height:65px;margin-bottom:5px}.lobby-join-url{margin-bottom:10px;font-size:21px}.lobby-room-code{font-size:clamp(58px,21cqw,88px)}.lobby-code-label,.lobby-url-label{font-size:19px}.host-console .lobby-copy{margin-top:3px;min-height:32px}.lobby-actions{gap:8px}.host-console .lobby-start{min-height:54px}.lobby-tools{gap:6px}.lobby-connection{display:none}.lobby-chapter-subtitle{font-size:clamp(23px,2vw,31px)}}
@media(max-width:1100px) and (min-width:901px){.host-lobby{grid-template-columns:minmax(0,1fr) 310px}.lobby-join-panel{padding:14px;gap:12px}.lobby-chapter{inset:auto 28px 32px}.lobby-chapter h1{font-size:clamp(44px,6vw,68px)}.lobby-chapter-subtitle{font-size:25px}.lobby-chapter-kicker{font-size:23px}}
@media(max-width:900px){.host-lobby{grid-template-columns:minmax(0,1fr) minmax(280px,38%)}.lobby-join-panel{padding:12px;gap:10px}.lobby-chapter{inset:auto 22px 26px}.lobby-chapter h1{font-size:44px}.lobby-chapter-kicker{font-size:21px}.lobby-chapter-subtitle{font-size:23px}.lobby-chapter-progress{margin-top:15px}.lobby-logo{height:78px}.lobby-tools{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px) and (orientation:portrait){.host-lobby{grid-template-columns:1fr;grid-template-rows:minmax(250px,43dvh) minmax(0,1fr)}.lobby-join-panel{border-left:0;border-top:3px solid #6989b0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;grid-template-areas:'identity crew' 'actions actions';gap:12px 18px;padding:14px 18px;container-type:normal}.lobby-identity{grid-area:identity;container-type:inline-size}.lobby-crew{grid-area:crew;container-type:inline-size;min-height:0}.lobby-actions{grid-area:actions;grid-template-columns:minmax(150px,1fr) 2fr;align-items:center;gap:12px}.lobby-logo{height:clamp(60px,7vh,88px)}.lobby-room-code{font-size:clamp(54px,22cqw,82px)}.lobby-join-url{font-size:clamp(20px,6.8cqw,25px);margin-bottom:9px}.lobby-url-label,.lobby-code-label{font-size:20px}.host-console .lobby-copy{margin-top:1px;min-height:30px}.lobby-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.host-console .lobby-tools button{font-size:18px;min-height:42px}.lobby-connection{display:none}.lobby-chapter h1{max-width:none;font-size:58px}.lobby-chapter-subtitle{font-size:27px;max-width:32ch}.lobby-chapter-kicker{font-size:25px}.host-console .lobby-start{min-height:60px;font-size:30px}}
@media(max-width:520px) and (orientation:portrait){.host-lobby{grid-template-rows:36dvh minmax(0,1fr)}.lobby-join-panel{padding:10px;gap:8px}.lobby-logo{height:48px}.lobby-room-code{font-size:clamp(36px,22cqw,60px);letter-spacing:-1px}.lobby-join-url{font-size:17px}.lobby-url-label,.lobby-code-label{font-size:17px}.lobby-crew h2{font-size:22px}.lobby-crew>header{flex-wrap:wrap;gap:3px}.lobby-crew>header>strong{font-size:21px}.lobby-player .host-avatar{width:24px;height:24px;flex-basis:24px}.lobby-player strong{font-size:18px}.host-console .lobby-player{min-height:34px;gap:4px}.lobby-actions{grid-template-columns:1fr}.host-console .lobby-start{min-height:48px;font-size:28px}.lobby-tools{grid-template-columns:repeat(3,minmax(0,1fr))}.host-console .lobby-tools button{min-height:40px;font-size:16px}.lobby-chapter{inset:auto 18px 20px}.lobby-chapter h1{font-size:40px}.lobby-chapter-kicker{font-size:19px;margin-bottom:6px}.lobby-chapter-subtitle{font-size:20px;margin-top:8px}.lobby-chapter-progress{margin-top:10px}.host-console .lobby-copy{font-size:16px}}
@media(prefers-reduced-motion:reduce){.host-lobby *{animation:none!important;transition:none!important}}
