@import url('./menu-base.css');
.our-menu #landing,.our-menu #topnav,.our-menu #picker>h1{display:none!important}
.our-menu #picker{position:static;padding:0;margin:0;border:0;background:none;max-width:none}
.our-menu #picker>:not(#frontend){display:none!important}
.our-menu #frontend{position:fixed;inset:0;z-index:20;background:#000;display:grid;place-items:center}
.our-menu #frontendstage{width:min(100vw,133.333vh);aspect-ratio:4/3;overflow:auto;position:relative}
.our-menu #frontendart{display:block;width:100%;height:100%;image-rendering:pixelated}
.our-menu #frontactions{position:absolute;left:49%;right:5%;top:32%;max-height:66%;overflow:auto;font:12px monospace}
.our-menu #frontactions>button{display:block;border:0;background:transparent;color:#e7cf74;font:bold clamp(14px,2.5vw,25px) monospace;text-shadow:2px 2px #402913;padding:8px 0;text-align:left;box-shadow:none}
.our-menu #frontactions h1{display:none}.our-menu #frontactions p{font-size:10px;color:#c2b48e;line-height:1.5}
.our-menu #frontactions #coop{margin:10px 0;padding:10px;background:#050505ed;border:1px solid #8b8750}
.our-menu #coop .row{display:block}.our-menu #coop input,.our-menu #coop select,.our-menu #our-options select{max-width:100%;width:100%;box-sizing:border-box;margin:5px 0;background:#151515;color:#fff;padding:6px;font:12px monospace}
.our-menu #coop input[type=checkbox],.our-menu #our-options input[type=checkbox]{width:auto}
.our-menu #coop button,.our-menu #our-options button{font:12px monospace;background:#1f2924;color:#e5d57b;padding:7px;border:1px solid #8b8750;box-shadow:none;text-transform:none}
.our-menu #our-options{padding:10px;background:#050505ed;border:1px solid #8b8750}.our-menu #our-options label{display:block;margin:10px 0}
.our-menu #status{z-index:25;color:#e7cf74;pointer-events:none}
.our-menu.migration-playing #frontend{display:none!important}
#touchcontrols *{box-sizing:border-box}
/* Lobby labels must not inherit the large menu's offset shadow/display font. */
.our-menu #frontactions #coop button{
 font:500 14px/1.3 Consolas,"Courier New",monospace;
 text-shadow:none;
 letter-spacing:0;
 text-transform:none;
}
/* Room entry stays above the independently scrolling match settings. */
.our-menu #frontactions:has(#coop:not([hidden])){
 position:fixed;inset:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
 max-height:none;overflow:hidden;display:flex;justify-content:center;align-items:center;
}
.our-menu #frontactions:has(#coop:not([hidden]))>button,
.our-menu #frontactions:has(#coop:not([hidden]))>#frontstatus{display:none}
.our-menu #frontactions #coop:not([hidden]){
 display:flex;flex-direction:column;width:100%;max-width:720px;max-height:100%;
 margin:0;padding:16px;gap:12px;background:#080b09f5;overflow:hidden;
}
.our-menu #coop .our-lobby-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none}
.our-menu #coop .our-lobby-header h2{margin:0;color:#e7cf74;font:20px/1.2 monospace;text-shadow:none}
.our-menu #coop .our-room-entry{flex:none;display:grid;gap:8px}
.our-menu #coop .our-room-entry>label{display:flex;align-items:center;gap:12px;margin:0;white-space:nowrap}
.our-menu #coop .our-room-entry>label input{flex:1;min-width:0}
.our-menu #coop .our-room-entry>.row{display:grid;grid-template-columns:auto minmax(90px,1fr) auto;gap:10px;align-items:center;margin:0}
.our-menu #coop .our-room-entry>.row>span{display:none}
.our-menu #coop .our-room-entry input{margin:0;min-height:40px}
.our-menu #frontactions #coop .our-room-entry button{min-height:40px;white-space:nowrap;margin:0;padding:8px 12px}
.our-menu #coop .our-lobby-details{min-height:0;overflow:auto;overscroll-behavior:contain;border-top:1px solid #615d37;padding-top:8px}
.our-menu #coop .our-lobby-details>p:first-child{display:none}
.our-menu #coop .our-lobby-details>.row{display:flex;flex-wrap:wrap;gap:10px}
.our-menu #coop .our-lobby-details>.row>.field{flex:1 1 180px;min-width:0;margin:0}
.our-menu #coop .our-lobby-details p{margin:6px 0}
@media(max-width:520px){
 .our-menu #frontactions #coop:not([hidden]){padding:12px;gap:8px}
 .our-menu #coop .our-room-entry>.row{grid-template-columns:1fr 1fr;gap:8px}
 .our-menu #coop .our-room-entry #coop-code{grid-column:1/-1;grid-row:1}
 .our-menu #coop .our-room-entry #coop-host{grid-column:1;grid-row:2}
 .our-menu #coop .our-room-entry #coop-join{grid-column:2;grid-row:2}
}
@media(max-height:450px) and (min-width:600px){
 .our-menu #frontactions #coop:not([hidden]){padding:10px;gap:6px}
 .our-menu #coop .our-room-entry{grid-template-columns:minmax(130px,1fr) minmax(300px,2fr);align-items:end;gap:10px}
 .our-menu #coop .our-room-entry>label{display:block}
 .our-menu #coop .our-room-entry>label input{display:block;margin-top:4px}
}
/* Gameplay follows the browser's changing visible area; artwork retains its proportions. */
.our-menu.migration-playing #game{position:fixed;inset:0;width:100%;height:100dvh}
.our-menu.migration-playing #screen{width:100%;height:100%;min-width:0;min-height:0}
/* Keep original HUD counters unobstructed; diagnostics remain under MENU. */
.migration-playing #migration-panel:not(.expanded){padding:0;background:none;pointer-events:none}
.migration-playing #migration-panel:not(.expanded)>strong{display:none}
#dropin-status{position:fixed;top:64px;left:50%;transform:translateX(-50%);z-index:80;padding:8px 12px;background:#080b09e8;color:#e7cf74;font:12px/1.4 monospace;max-width:90vw;text-align:center;pointer-events:none}
#dropin-status[hidden]{display:none}
.dropin-loading:after{content:'';position:fixed;inset:0;background:#080b09;z-index:79}
.dropin-loading #dropin-status{top:45%;font-size:16px}
#dropin-return{position:fixed;top:60%;left:50%;transform:translateX(-50%);z-index:82;padding:12px;font:14px monospace}
#migration-panel.expanded{max-height:75dvh;overflow:auto;pointer-events:auto}
#migration-invite-link{width:100%;margin:6px 0;padding:6px;font:12px monospace;user-select:text}
#migration-panel.expanded output{display:none!important}
#migration-panel.expanded{top:64px;max-height:calc(100dvh - 80px)}
#migration-close-options{margin:0 0 8px auto;padding:6px 12px}

/* Keep the engine options separate from the room/invite panel on small screens. */
.our-menu.migration-playing.migration-options #tools{position:fixed;transform:none;left:328px;right:8px;bottom:8px;top:auto;max-width:none;flex-wrap:wrap}
@media(max-width:599px){
 #migration-panel.expanded{max-height:calc(100dvh - 250px)}
 .our-menu.migration-playing.migration-options #tools{left:8px;right:8px;bottom:8px;max-height:160px;overflow:auto}
}