/* Menu styles are isolated from the game HUD and the standalone Guide. */
body:not(.playing):not(.previewing){display:block;height:auto;min-height:100dvh;overflow:auto;background:#202630;}
#legacy-controls{display:none!important;}
body:not(.playing):not(.previewing) #game-map{position:fixed;visibility:hidden;pointer-events:none;inset:0;}
body.playing #game-map,body.previewing #game-map{height:100dvh;width:100%;}
body:not(.playing)>#error{left:50%;transform:translateX(-50%);width:min(860px,calc(100% - 32px));right:auto;bottom:90px;font:14px/1.5 system-ui,sans-serif;border-radius:8px;pointer-events:none;}
.landing{--menu-blue:#008bcc;--menu-navy:#081423;--menu-panel:#0b0e11;--menu-border:#ffffff1c;position:relative;isolation:isolate;min-height:100dvh;display:flex;flex-direction:column;color:#f3f4f6;font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color-scheme:dark;}
.landing *{box-sizing:border-box;}
.menu-background{position:fixed;inset:81px 0 80px;width:100%;height:calc(100dvh - 161px);z-index:-1;pointer-events:none;}
.landing button,.landing input,.landing select,.landing a{font:inherit;}
.landing button{border:1px solid transparent;border-radius:8px;color:#f3f4f6;background:#181c20;padding:12px 16px;cursor:pointer;transition:background .15s,border-color .15s;color-scheme:dark;}
.landing button:hover{filter:none;background:#20313e;}
.landing button:disabled{cursor:default;background:#373f4a;color:#969ca5;opacity:.65;}
.landing button span{float:none;}
.landing button:focus-visible,.landing a:focus-visible,.landing input:focus-visible,.landing select:focus-visible{outline:2px solid #64c6ff;outline-offset:3px;}
.landing a{color:inherit;text-decoration:none;}
.landing .support-payments{position:absolute;right:18px;bottom:18px;margin:0;padding:8px 12px;background:#203d37;color:#fff5d6;border:1px solid #c6ad73;border-radius:4px;font-size:14px;z-index:5;pointer-events:auto;}
.landing .support-payments a{text-decoration:underline;text-underline-offset:3px;font-weight:600;}
@media(max-width:650px){.landing .support-payments{right:14px;bottom:64px;}}
.landing h1,.landing h2,.landing h3,.landing p{margin:0;letter-spacing:normal;}
.landing h1{font-size:24px;line-height:1.3;font-weight:650;letter-spacing:2px;text-transform:uppercase;}
.landing h2{font-size:18px;font-weight:650;}
.landing label{margin:0;color:inherit;font-size:14px;}
.landing input,.landing select{width:100%;margin-top:8px;padding:10px 12px;border:1px solid #42464d;background:#111827;color:#f3f4f6;border-radius:5px;}
.landing input[type=checkbox]{width:20px;height:20px;accent-color:var(--menu-blue);margin:0;}
.menu-muted,.landing p{color:#8e949d;font-size:14px;}
.menu-header{min-height:81px;background:#191a1cec;backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;gap:48px;padding:12px 24px;position:relative;z-index:5;}
.menu-logo{display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--menu-blue)!important;width:146px;flex-shrink:0;}
.menu-logo svg{width:146px;height:25px;display:block;}
.menu-logo small{font-size:10px;font-weight:800;letter-spacing:1.2px;}
.menu-nav{display:flex;align-items:center;gap:26px;}
.menu-nav button,.menu-nav>a{background:transparent;color:#b3b4b7;text-transform:uppercase;letter-spacing:1px;padding:8px 2px;border-radius:0;}
.menu-nav button.active,.menu-nav button:hover,.menu-nav a:hover{color:var(--menu-blue);background:transparent;}
.menu-nav .menu-profile-link{border:1px solid #44464a;border-radius:25px;text-transform:none;font-size:12px;font-weight:600;letter-spacing:1px;padding:10px 17px;display:flex;gap:10px;align-items:center;}
.menu-profile-link>span{font-size:21px;line-height:1;}
.landing .menu-hamburger{display:none;}
.menu-content{width:100%;flex:1;padding:24px 16px 13px;}
.menu-home{max-width:876px;margin:0 auto;}
.menu-top-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-bottom:24px;}
.menu-top-grid>div:first-child{display:flex;flex-direction:column;gap:8px;min-width:0;}
.menu-news-banner{display:flex;align-items:center;gap:12px;background:var(--menu-navy);border-radius:12px;padding:10px 12px;min-height:60px;}
.menu-news-badge{background:#063c3b;color:#76dfca;font-size:10px;font-weight:650;letter-spacing:.6px;padding:2px 8px;border-radius:3px;}
.menu-news-banner #menu-news-open{padding:0;background:transparent;text-align:left;min-width:0;flex:1;border-radius:0;}
#menu-news-open strong,#menu-news-open small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#menu-news-open strong{font-size:13px;font-weight:500;}#menu-news-open small{color:#85909d;font-size:11px;margin-top:2px;}
#menu-news-dismiss{background:transparent;padding:0;color:#71808f;}
.menu-identity{background:var(--menu-navy);border-radius:12px;min-height:68px;display:flex;align-items:center;padding:8px;gap:12px;}
.identity-symbol{color:#58b5de;font-size:29px;padding:0 8px;}
#menu-name-slot{flex:1;min-width:0;}
.menu-identity input{font-size:24px;letter-spacing:1px;margin:0;padding:4px 0;border:0;background:transparent;border-radius:0;}
.landing .identity-profile{background:#0a1827;box-shadow:0 3px 5px #0009;border:1px solid #060f1b;padding:3px 13px;font-size:28px;}
.menu-availability{background:var(--menu-navy);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:15px;}
.menu-availability strong{font-size:12px;font-weight:600;letter-spacing:.5px;color:#b6bec7;display:flex;align-items:center;gap:8px;}
.menu-availability i{display:inline-block;width:8px;height:8px;background:#00ba96;border-radius:50%;}
#menu-availability{font-size:13px;color:#b9c4ce;}
.menu-availability button{padding:0;background:transparent;text-align:left;font-size:12px;color:#72bcdf;margin-top:auto;}
#menu-resume{margin:-8px 0 16px;}#menu-resume button{width:100%;border:1px solid #008bcc66;color:#91dcff;}
.menu-public-cards{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:184px 184px;gap:16px;}
.menu-public-cards>.menu-room-card:first-child{grid-row:span 2;}
.landing .menu-room-card{padding:0;overflow:hidden;border:0;border-radius:16px;position:relative;text-align:left;background:var(--menu-navy);min-width:0;height:100%;}
.menu-room-card:hover{box-shadow:0 0 0 2px #008bcc;}
.menu-room-card>canvas{width:100%;height:100%;object-fit:cover;pointer-events:none;image-rendering:auto;}
.menu-card-badge,.menu-card-timer{position:absolute;top:10px;background:var(--menu-blue);font-size:12px;letter-spacing:1px;font-weight:650;line-height:1.4;border-radius:4px;padding:4px 7px;}
.menu-card-badge{left:8px;max-width:calc(100% - 75px);}.menu-card-timer{right:8px;font-size:11px;letter-spacing:.5px;}
.menu-card-seats{position:absolute;right:8px;bottom:56px;background:#05080bbd;border-radius:4px;padding:0 7px;font-weight:650;font-size:12px;}
.menu-card-label{position:absolute;bottom:0;left:0;right:0;min-height:52px;padding:7px 12px;background:#080e17c7;backdrop-filter:blur(5px);display:flex;flex-direction:column;justify-content:center;}
.menu-card-label strong{text-transform:uppercase;letter-spacing:.6px;font-size:16px;font-weight:650;line-height:1.2;}.menu-card-label small{font-size:12px;text-transform:uppercase;color:#c1c6cb;line-height:1.3;}
.menu-empty{grid-column:1/-1;grid-row:1/-1;background:#081423dc;border:1px solid var(--menu-border);border-radius:16px;display:grid;place-items:center;padding:30px;color:#aab8c6;text-align:center;}
#menu-online-message:empty{display:none;}#menu-online-message{margin-top:8px;}
.landing .menu-primary{background:var(--menu-blue);color:white;border:0;text-transform:uppercase;letter-spacing:.6px;min-height:56px;width:100%;}
.landing .menu-primary:hover{background:#06a2e6;}.landing .menu-primary:disabled{background:#373f4a;color:#969ca5;}
.landing .menu-solo{margin-top:16px;}
.menu-play-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px;}
.menu-play-actions button{background:var(--menu-navy);text-transform:uppercase;min-height:56px;font-size:14px;letter-spacing:.5px;}
.menu-footer{min-height:81px;background:#191a1cec;border-top:1px solid #ffffff0a;position:relative;padding:10px 24px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#85858a;gap:5px;margin-top:auto;}
.menu-footer-links{display:flex;gap:24px;font-size:27px;line-height:1.2;}.menu-footer small{font-size:11px;}
.menu-footer-promo{position:absolute;right:4.3%;bottom:15px;display:flex;align-items:center;gap:22px;padding:8px 12px;background:#303742;border:1px solid #47505d;border-radius:3px;color:#e8ebef!important;}
.menu-footer-promo>span:first-child{color:var(--menu-blue);width:106px;}.menu-footer-promo svg{width:100%;height:20px;}.menu-footer-promo strong,.menu-footer-promo small{display:block;font-size:12px;}.menu-footer-promo small{color:#9ca6b2;font-size:10px;}.menu-footer-promo b{background:#008bcc;padding:6px 10px;font-size:11px;border-radius:3px;}
.menu-section{max-width:908px;margin:0 auto;height:calc(100dvh - 198px);min-height:450px;background:linear-gradient(120deg,#0a0d10,#0a1017);border:1px solid #ffffff06;border-radius:20px;overflow:hidden;display:flex;flex-direction:column;}
.menu-section-header{display:flex;align-items:center;gap:16px;min-height:90px;padding:20px 24px;border-bottom:1px solid var(--menu-border);flex-shrink:0;}
.menu-section-header h1{flex:1;}.landing .menu-back{border:1px solid #32363c;border-radius:50%;padding:0;flex-shrink:0;width:40px;height:40px;font-size:26px;line-height:1;color:#929ba6;}
.menu-section-scroll{padding:24px;overflow:auto;overscroll-behavior:contain;flex:1;scrollbar-width:thin;scrollbar-color:#43484f transparent;min-height:0;}
.menu-map-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--menu-border);padding-bottom:10px;gap:16px;}.menu-map-heading h2{display:flex;gap:16px;align-items:center;text-transform:uppercase;letter-spacing:1px;}.menu-map-heading h2 span{color:#3da9e0;background:#06283c;padding:2px 8px;border-radius:6px;}
.menu-search{max-width:300px;}.menu-search input{margin:0;background:transparent;border:1px solid #30363d;font-size:13px;padding:8px 10px;}
.menu-map-tabs{display:flex;border:1px solid var(--menu-border);padding:4px;border-radius:12px;margin:24px 0 32px;}.menu-map-tabs button{flex:1;background:transparent;font-size:12px;font-weight:600;color:#969ba1;text-transform:uppercase;padding:7px;}
.menu-map-tabs button[aria-selected=true]{background:#082b3c;color:white;}
.menu-map-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:32px;}
.menu-map-option{position:relative;min-width:0;}.landing .menu-map-choice{width:100%;height:141px;padding:12px;background:#191d21;border:1px solid #34383d;border-radius:12px;display:flex;flex-direction:column;gap:10px;align-items:center;}
.menu-map-choice canvas{width:100%;height:87px;border-radius:7px;image-rendering:auto;pointer-events:none;}.menu-map-choice strong{font-size:12px;text-transform:uppercase;line-height:1.2;font-weight:650;}
.landing .menu-map-choice[aria-pressed=true],.landing .menu-choice[aria-pressed=true]{border-color:var(--menu-blue);background:#072739;box-shadow:0 0 12px #008bcc16;}
.landing .menu-favorite{position:absolute;right:9px;top:9px;padding:0;width:25px;height:25px;color:#e8dba2;background:#091523bb;font-size:18px;opacity:.7;}.menu-favorite[aria-pressed=true],.menu-favorite:hover{opacity:1;}
.menu-setup-group{border-top:1px solid var(--menu-border);padding-top:20px;margin-top:24px;}.menu-setup-group>h2{text-transform:uppercase;letter-spacing:1px;margin-bottom:20px;}
.menu-difficulties{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}.landing .menu-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:108px;gap:15px;background:#191d21;border:1px solid #34383d;border-radius:12px;}.menu-choice span{color:#ff403d;font-size:22px;}.menu-choice strong{font-size:12px;text-transform:uppercase;}
.menu-options-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}.menu-options-grid>label{padding:16px;background:#181c20;border:1px solid #34383d;border-radius:12px;}.menu-options-grid>label:has(input[type=checkbox]){display:flex;align-items:center;gap:12px;min-height:68px;}
.menu-options-grid .hint{float:none;display:block;color:#929ba4;font-size:12px;}.menu-options-grid input,.menu-options-grid select{font-size:14px;}
#lobby>.menu-muted{margin:18px 0;}.menu-setup-footer{padding:16px 24px 24px;border-top:1px solid var(--menu-border);background:#0b0e12;flex-shrink:0;}.menu-setup-footer output{font-size:13px;color:#a0acb9;display:block;margin-bottom:8px;}.menu-setup-footer output:empty{display:none;}
#menu-setup-actions{display:flex;gap:12px;}#menu-setup-actions>button{flex:1;margin:0;}
#menu-waiting-actions{display:flex;gap:12px;flex-wrap:wrap;}#menu-waiting-actions>button{flex:1;margin:0;}
#menu-waiting-code{margin-left:auto;max-width:100%;}
#menu-waiting-preview{display:block;width:100%;height:220px;object-fit:contain;background:var(--menu-navy);border-radius:12px;}
.menu-lobby-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 24px;margin:20px 0;font-size:14px;}.menu-lobby-facts dt{color:#8e949d;}.menu-lobby-facts dd{margin:0;text-align:right;overflow-wrap:anywhere;}
#menu-waiting-players>label{display:block;margin-top:18px;max-width:240px;}.menu-member{overflow-wrap:anywhere;min-width:0;}
.menu-segmented{display:flex;border:1px solid #34383d;border-radius:20px;padding:3px;}.menu-segmented button{padding:3px 10px;border-radius:20px;font-size:10px;letter-spacing:1px;text-transform:uppercase;background:transparent;color:#94979c;}.menu-segmented button[aria-pressed=true]{background:var(--menu-blue);color:white;}
.landing .menu-code{font:12px monospace;letter-spacing:1px;white-space:nowrap;border:1px solid #34383d;transition:filter 90ms ease,box-shadow 90ms ease;}
.landing .menu-code:active{filter:brightness(.82);box-shadow:inset 0 2px 4px #0006;}
.menu-roster{margin-top:24px;border-top:1px solid var(--menu-border);padding-top:24px;}.menu-roster h2{font-size:12px;color:#90979f;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;}.menu-members{background:#191d21;border:1px solid #34383d;border-radius:8px;padding:12px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;}.menu-member{font-size:13px;background:#123347;border:1px solid #1774a0;border-radius:20px;padding:8px 12px;}
.menu-centered-card{max-width:448px;padding:32px;margin:0 auto 24px;background:#191c20;border:1px solid #34383d;border-radius:16px;display:flex;flex-direction:column;gap:20px;}.menu-centered-card h2,.menu-centered-card p{text-align:center;}.menu-big-icon{margin:0 auto 4px;width:64px;height:64px;display:grid;place-items:center;font-size:34px;color:#54aaf6;border:1px solid #394a6f;border-radius:16px;background:linear-gradient(125deg,#223747,#372545);}
#menu-ranked-controls{display:flex;flex-direction:column;gap:14px;}#queue-state{font-size:14px;color:#8ccbf1;}
.menu-settings-tabs{display:flex;justify-content:center;border-bottom:1px solid var(--menu-border);flex-shrink:0;}.menu-settings-tabs button{background:transparent;border-radius:0;text-transform:uppercase;color:#8b8d93;font-size:14px;font-weight:600;padding:12px 8px;border-bottom:2px solid transparent;}.menu-settings-tabs button[aria-selected=true]{color:#2bb5fa;border-bottom-color:#008bcc;}
.landing .menu-setting-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 16px;border:1px solid #34383d;background:#191d21;border-radius:12px;margin-bottom:8px;}.menu-setting-row strong{font-size:14px;font-weight:600;display:block;}.menu-setting-row small{font-size:13px;color:#8b8d93;display:block;margin-top:4px;}.menu-setting-row select{width:155px;flex-shrink:0;margin:0;font-size:13px;}.menu-setting-row kbd{float:none;color:#b5dfff;text-align:right;font:13px/1.5 monospace;}.menu-secondary{margin-top:18px;}.menu-secondary+p{margin-top:14px;}
.menu-news-article+article{margin-top:24px;}.menu-news-article h2{font-size:24px;padding-bottom:10px;border-bottom:1px solid var(--menu-border);margin-bottom:18px;}.menu-news-article time{color:#bdc3cd;font-size:14px;font-style:italic;}.menu-news-article p{margin-top:12px;}.menu-news-article ul{margin:14px 0 0;padding-left:20px;}.menu-news-article li{margin:10px 0;color:#c3cbd5;font-size:15px;}
#menu-history>h2{margin-bottom:8px;}#load-results{margin:16px 0;}.landing #result-history p{padding:14px;border-top:1px solid var(--menu-border);}
.menu-room-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:20px;}.menu-room-list .menu-room-card{height:230px;}
.menu-preview-back{position:fixed;z-index:100;left:16px;top:16px;background:#008bcc;color:white;font:14px system-ui,sans-serif;}
.menu-busy .menu-play-actions,.menu-busy .menu-nav,.menu-busy #menu-public-cards,.menu-busy #menu-solo{pointer-events:none;opacity:.7;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media(max-width:1400px){.menu-footer-promo{position:static;display:none;}.menu-header{gap:30px;}}
@media(max-width:1023px){.menu-header{min-height:64px;padding:10px 20px;justify-content:space-between;}.landing .menu-hamburger{display:block;padding:4px 10px;background:transparent;font-size:26px;}.menu-nav{display:none;position:absolute;top:64px;left:0;right:0;background:#191a1c;border-bottom:1px solid #34383d;padding:20px;align-items:stretch;gap:12px;}.menu-nav-open .menu-nav{display:flex;flex-direction:column;}.menu-nav button,.menu-nav>a{text-align:left;padding:8px 14px;}.menu-section{height:calc(100dvh - 181px);}.menu-background{top:64px;height:calc(100dvh - 145px);}.menu-content{padding-top:20px;}.menu-section-header{flex-wrap:wrap;gap:12px;}.menu-section-header h1{font-size:21px;}.menu-code{margin-left:auto;}.menu-map-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:639px){.menu-content{padding:12px 12px 20px;}.menu-top-grid{grid-template-columns:1fr;margin-bottom:16px;gap:10px;}.menu-availability{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;padding:10px 12px;}.menu-availability>strong{font-size:10px;}.menu-availability>span{font-size:11px;text-align:right;}.menu-availability>button{grid-column:1/-1;font-size:12px;} .menu-public-cards{grid-template-columns:1fr;grid-template-rows:245px 175px 175px;gap:12px;}.menu-public-cards>.menu-room-card:first-child{grid-row:auto;}.menu-play-actions{gap:8px;}.menu-play-actions button{font-size:11px;padding:10px 5px;}.menu-news-banner{gap:8px;}.menu-identity input{font-size:21px;}.menu-section{min-height:450px;height:calc(100dvh - 177px);border-radius:14px;}.menu-section-header{padding:16px;min-height:78px;}.menu-section-header h1{font-size:17px;letter-spacing:1px;}.menu-section-scroll{padding:16px;}.menu-map-heading{flex-wrap:wrap;}.menu-search{width:100%;max-width:none;}.menu-map-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}.landing .menu-map-choice{height:126px;padding:9px;}.menu-map-choice canvas{height:78px;}.menu-map-choice strong{font-size:10px;}.menu-map-tabs{margin:18px 0;}.menu-options-grid{grid-template-columns:1fr;gap:10px;}.menu-difficulties{gap:8px;}.landing .menu-choice{padding:12px 5px;min-height:95px;}.menu-setup-footer{padding:12px;}.menu-setup-footer output{font-size:11px;}#menu-setup-actions button{font-size:12px;padding:10px;}.menu-settings-tabs button{font-size:11px;padding:12px 6px;}.landing .menu-setting-row{flex-wrap:wrap;gap:12px;}.menu-setting-row select{width:100%;}.menu-centered-card{padding:24px 18px;}.menu-room-list{grid-template-columns:1fr;}.menu-room-list .menu-room-card{height:230px;}.menu-footer{min-height:70px;}.menu-background{bottom:70px;height:calc(100dvh - 134px);}body:not(.playing)>#error{bottom:80px;}.menu-code{max-width:100%;}.menu-settings-tabs{gap:0;}}
@media(prefers-reduced-motion:reduce){.landing *{transition:none!important;}}
.menu-background{filter:brightness(.8) saturate(.85);}
.landing .menu-map-collection{display:flex;align-items:center;justify-content:space-between;gap:8px;text-transform:uppercase;font-size:12px;letter-spacing:.6px;color:#858990;margin:0 8px 14px;}
.landing #menu-random-map{padding:5px 10px;font-size:12px;white-space:nowrap;}
