/* A single game menu board scales uniformly; it never stretches its artwork. */
:root { --menu-scale: 1; }
.menu-shell { position: absolute; inset: 0; overflow: hidden; isolation: isolate; }
.menu-shell::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 44% 92% at center,rgba(8,10,19,.94),rgba(8,10,19,.70) 56%,rgba(8,10,19,.15) 90%); z-index:-1; }
.menu-stage { position: absolute; left:50%; top:50%; width:900px; height:600px; transform:translate(-50%,-50%) scale(var(--menu-scale)); transform-origin:center; }
.menu-stage .game-title { position:absolute; left:258px; top:6px; width:384px; height:256px; margin:0; padding:0; line-height:1; }
.menu-stage .title-art { display:block; width:100%; height:100%; object-fit:contain; max-width:none; max-height:none; filter:drop-shadow(0 5px 12px rgba(0,0,0,.7)); }
.menu-stage .title-fallback { display:block; text-align:center; font:800 66px/.9 var(--display); color:#ffd175; }
.menu-stage .title-fallback>span {color:var(--bone)}
.menu-stage .title-fallback small { display:block; margin-top:14px; font-size:32px; color:var(--mint); }
.game-button { display:flex; align-items:center; justify-content:center; position:absolute; padding:0; margin:0; border:0; border-radius:0; background-color:transparent; background-image:url('../assets/ui/button-gold.webp'); background-repeat:no-repeat; background-position:center; background-size:100% 100%; color:#fff5c6; cursor:pointer; text-decoration:none; filter:drop-shadow(0 4px 4px rgba(0,0,0,.8)); transition:filter .13s; }
.game-button.purple { background-image:url('../assets/ui/button-purple.webp');color:#fff1ff; }
.game-button.green { background-image:url('../assets/ui/button-green.webp');color:#e9ffce; }
.game-button-label { display:block; max-width:89%; font-family:var(--display); font-weight:800; font-size:48px; line-height:.93; text-transform:uppercase; white-space:nowrap; text-align:center; letter-spacing:.15px; text-shadow:0 3px 1px rgba(15,5,1,.95),0 0 7px rgba(0,0,0,.5); pointer-events:none; }
.game-button:hover { filter:brightness(1.2) drop-shadow(0 4px 6px rgba(0,0,0,.8)); }
.game-button:active { transform:none; filter:brightness(.83) drop-shadow(0 1px 2px rgba(0,0,0,.8)); }
.game-button:focus-visible { outline:3px solid #fff1b7; outline-offset:4px; }
.menu-championship { left:218px;top:262px;width:464px;height:72px; }
.menu-championship .game-button-label {font-size:74px;}
.menu-quick { left:260px;top:342px;width:380px;height:62px; }
.menu-quick .game-button-label {font-size:68px;}
.menu-options { left:226px;top:412px;width:220px;height:62px; }
.menu-more-games { left:454px;top:412px;width:220px;height:62px; }
.menu-more-games .game-button-label {font-size:41px;}
.menu-controls { left:260px;top:482px;width:186px;height:52px; }
.menu-credits { left:454px;top:482px;width:186px;height:52px; }
.menu-controls .game-button-label,.menu-credits .game-button-label {font-size:39px;}
.menu-controls .game-button-label {font-size:33px;}
.has-cup .menu-new-cup { left:218px;top:482px;width:148px;height:52px; }
.has-cup .menu-controls {left:376px;width:148px;}
.has-cup .menu-credits {left:534px;width:148px;}
.has-cup .menu-controls .game-button-label {font-size:26px;}
.menu-new-cup .game-button-label {font-size:38px;}
.menu-fullscreen {left:812px;top:18px;width:64px;height:44px;}
.menu-fullscreen .game-button-label {font-size:32px;}
.menu-footer {position:absolute;left:50%;bottom:max(9px,env(safe-area-inset-bottom));display:block;width:900px;text-align:center;transform:translateX(-50%) scale(var(--menu-scale));transform-origin:bottom center;color:#fff1c4;font:800 23px/1 var(--display);letter-spacing:2px;text-shadow:0 2px 3px #000;}
body[data-screen='menu'] #toast { display:none; }
@media(max-width:699px) and (orientation:portrait) {
.menu-stage {width:600px;height:900px;}
.menu-stage .game-title {left:50px;top:45px;width:500px;height:333px;}
.menu-championship {left:40px;top:390px;width:520px;height:84px;}
.menu-championship .game-button-label {font-size:84px;}
.menu-quick {left:80px;top:488px;width:440px;height:74px;}
.menu-quick .game-button-label {font-size:78px;}
.menu-options {left:70px;top:576px;width:224px;height:76px;}
.menu-more-games {left:306px;top:576px;width:224px;height:76px;}
.menu-controls {left:80px;top:666px;width:212px;height:68px;}
.menu-credits {left:308px;top:666px;width:212px;height:68px;}
.menu-controls .game-button-label,.menu-credits .game-button-label {font-size:44px;}
.menu-controls .game-button-label {font-size:38px;}
.has-cup .menu-new-cup {left:40px;top:666px;width:166px;height:68px;}
.has-cup .menu-controls {left:218px;top:666px;width:164px;height:68px;}
.has-cup .menu-credits {left:394px;top:666px;width:166px;height:68px;}
.has-cup .menu-controls .game-button-label {font-size:29px;}
.menu-fullscreen {left:510px;top:12px;width:64px;height:44px;}
.menu-footer {width:600px;font-size:30px;}
}
/* The other game screens share the same actual painted button assets. */
.button {font-family:var(--display);font-size:25px;font-weight:800;line-height:1;text-transform:uppercase;background:url('../assets/ui/button-gold.webp') center/100% 100% no-repeat!important;border:0!important;border-radius:0!important;color:#fff5cc!important;box-shadow:none!important;text-shadow:0 2px 2px #180902;}
.button.secondary {background-image:url('../assets/ui/button-purple.webp')!important;color:#fff1ff!important;}
.button.plain {background-image:url('../assets/ui/button-green.webp')!important;color:#e9ffce!important;}
.button.primary:hover,.button.secondary:hover,.button.plain:hover {filter:brightness(1.15);}
.button small {font-family:var(--font);font-size:10px;text-transform:none;}
@media(max-height:550px) and (orientation:landscape){.button{font-size:22px;}}
@media (min-aspect-ratio:1/1) {
 .page-screen{position:absolute;left:50%;top:50%;width:900px;height:600px;transform:translate(-50%,-50%) scale(var(--page-scale,1));transform-origin:center;padding-bottom:14px;}
 .page-screen .topbar{height:64px;padding:0 4%;}
 .page-screen .page-content{margin:6px auto 0;padding:0 4%;max-width:900px;}
 .page-screen .page-heading{display:flex;align-items:center;margin-bottom:16px;gap:16px;}
 .page-screen .page-heading h1{font-size:48px;line-height:1;}
 .page-screen .page-heading p{font-size:11px;line-height:1.35;margin-top:9px;}
 .page-screen .eyebrow{font-size:9px;letter-spacing:1.5px;}
 .page-screen .team-grid{grid-template-columns:repeat(4,1fr);gap:12px;}
 .page-screen .team-option{min-height:242px;padding:16px 13px 12px;}
 .page-screen .team-option .crest{width:57px;height:62px;}
 .page-screen .team-option h2{font-size:25px;margin-top:10px;}
 .page-screen .team-option p{font-size:10px;line-height:1.4;}
 .page-screen .team-traits{margin-top:12px;}
 .page-screen .setup-bottom{margin-top:18px;gap:18px;}
 .page-screen .arena-options{gap:5px;}
 .page-screen .arena-option{padding:10px;font-size:10px;}
 .page-screen .setup-confirm .button{min-height:50px;}
 .page-screen .option-group{padding-top:10px;}
 .page-screen .option-group h2{font-size:19px;margin-bottom:9px;}
 .page-screen .option-row{min-height:44px;padding:5px 0;gap:14px;}
 .page-screen .option-row label{font-size:13px;}
 .page-screen .option-row small{font-size:9px;margin-top:3px;}
 .page-screen .option-row select{font-size:13px;padding:8px;}
 .page-screen .options-grid{gap:12px 32px;}
 .page-screen .ads-option{display:grid;grid-template-columns:1fr 1.5fr;column-gap:20px;row-gap:4px;}
 .page-screen .ads-option h2{grid-column:1;margin-bottom:0;}
 .page-screen .ads-option .option-row{grid-column:1;min-height:35px;}
 .page-screen .ads-option>p{grid-column:2;grid-row:1/3;margin:0;font-size:11px;line-height:1.45;}
 .page-screen .ads-option .option-note{grid-column:2;margin:0;font-size:10px;}
 .page-screen .page-footer{margin-top:10px;padding-top:8px;}
 .page-screen .page-footer .button{min-height:50px;height:50px;padding:10px 18px;font-size:25px;}
 .page-screen .control-row{min-height:64px;padding:9px 0;gap:9px;}
 .page-screen .control-row h2{font-size:19px;}
 .page-screen .control-row p{font-size:10px;line-height:1.35;margin-top:4px;}
 .page-screen .control-row kbd{font-size:10px;padding:9px 7px;}
 .page-screen .tips-panel{padding:17px;}
 .page-screen .tips-panel h2{font-size:31px;}
 .page-screen .tips-panel p{font-size:11px;line-height:1.4;margin-top:11px;}
 .page-screen .cup-rounds{grid-template-columns:repeat(3,1fr);gap:15px;}
 .page-screen .cup-round{padding:18px;}
 .page-screen .cup-round h2{font-size:30px;}
 .page-screen .cup-callout{display:flex;margin-top:19px;padding-top:17px;gap:18px;}
 .page-screen .cup-callout .button{min-height:52px;font-size:25px;}
 .page-screen .cup-callout h2{font-size:24px;}
 .page-screen .credits-content>h1{font-size:60px;margin-top:16px;}
 .page-screen .credit-grid{margin-top:22px;margin-bottom:22px;}
 .page-screen .credits-content .button{min-height:52px;padding:12px 18px;}
}