/* Three picture-led choices; no gameplay layout rules. */
#game[data-mode=menu]>header,#game[data-mode=menu]>.lake,#game[data-mode=menu]>#banger,#game[data-mode=menu]>#controls,#game[data-mode=menu]>footer{visibility:hidden}
.overlay.setup{padding:18px 16px 44px;align-items:center;justify-content:center;background:linear-gradient(#002a6b20,#00133566),url('brand-water.jpg') center/cover}
.setup .setup-panel{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:12px;width:min(590px,100%);max-height:100%;padding:0 18px 18px;margin:0;overflow:auto;border-radius:24px}
.menu-top{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin:0 -18px 0;padding:10px 16px;border-bottom:1px solid #56ebff66;background:linear-gradient(120deg,#063d89,#002351)}
.menu-bar-logo{width:58px;height:58px;object-fit:contain;flex:none}
.setup-panel .menu-top h1{margin:0;min-width:0;font-size:24px;line-height:1;text-transform:uppercase;letter-spacing:-1px}
.menu-wordmark{display:block;width:80%;max-height:54.4px;margin-inline:auto;object-fit:contain}
.menu-top h1{flex:1}.menu-top h1 span{color:#00edeb}
.menu-profile-toggle{margin-left:auto;width:42px;height:42px;min-height:42px;flex:none;padding:10px;border:1px solid #66cfff66;border-radius:10px;background:#001d4a88;display:flex;flex-direction:column;justify-content:center;gap:4px}
.menu-profile-toggle span{display:block;width:20px;height:2px;background:#ecfdff;border-radius:2px}
.menu-rider,.menu-equipment{min-width:0;align-self:stretch}
.menu-stage{height:100%;display:flex;flex-direction:column;overflow:hidden;border:1px solid #62e1ff70;border-radius:16px;background:radial-gradient(ellipse at 40% 20%,#117bbda8,#032957)}
#menuRider{display:block;flex:1;min-height:0;width:100%;height:248px;object-fit:contain;touch-action:none;cursor:grab;user-select:none;filter:drop-shadow(0 10px 10px #00113644)}#menuRider:active{cursor:grabbing}
.menu-rider-name,.tile-caption{display:flex;align-items:center;justify-content:center;min-height:36px;padding:7px 6px;background:#001d42d9;border-top:1px solid #38ddff44;color:#f4feff;font-size:12px;font-weight:800;line-height:1.2;text-transform:uppercase;text-align:center;overflow-wrap:anywhere}
.menu-tiles{display:grid;grid-template-rows:1fr 1fr;gap:10px}
.menu-picker{position:relative;min-width:0;border:1px solid #62e1ff70;border-radius:14px;background:linear-gradient(135deg,#147bada8,#032957)}
.tile-trigger{width:100%;height:100%;display:flex;flex-direction:column;padding:0;border:0;border-radius:13px;background:transparent;overflow:hidden;text-align:center;color:#fff}
.tile-trigger img{display:block;width:100%;height:100%;min-height:0;flex:1;object-fit:cover;max-height:99px}.tile-trigger #menuBoat{object-fit:contain;transform:scale(1.12)}
.tile-caption{width:100%;gap:4px;position:relative}.tile-caption>span:first-child{flex:1}.tile-caption>span:last-child{font-size:17px;line-height:1;color:#39ffff}
.tile-trigger[aria-expanded=true]{outline:2px solid #04f5e2;outline-offset:-2px}
.tile-choices{position:absolute;z-index:8;top:calc(100% + 5px);right:0;width:max(100%,220px);max-width:calc(100vw - 64px);max-height:220px;overflow:auto;padding:5px;border:1px solid #4de5ff;border-radius:12px;background:#032653;box-shadow:0 12px 25px #001333a8}
.tile-choices[hidden]{display:none}.tile-choices button{display:block;width:100%;min-height:42px;border:0;border-radius:7px;padding:9px 10px;background:transparent;text-align:left;font-size:14px;color:#eafaff}.tile-choices button[aria-current=true]{background:#075ead;color:#5dfff2}.tile-choices button:hover{background:#0b558c}
.menu-main{grid-column:1/-1;min-width:0;padding:0}.menu-select{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.menu-select:focus-within{position:static;width:auto;height:auto;clip-path:none;display:block}
#menuModes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
#menuModes button{position:relative;min-height:50px;border:1px solid #4e9fce66;border-radius:11px;background:#032b60;color:#c3edff;font-size:14px;font-weight:750;padding:9px 5px}
#menuModes button[aria-pressed=true]{border-color:#00e7ec;background:linear-gradient(120deg,#005da2,#044481);color:#fff;box-shadow:inset 3px 0 #00efd9}
#menuModes small{display:block;margin-top:3px;color:#a4c6e3;font-size:12px;font-weight:450}
.request-count{position:absolute;top:-7px;right:-5px;min-width:21px;height:21px;padding:2px 5px;border-radius:12px;background:#00f1df;color:#002550;font-size:12px;font-weight:800;border:2px solid #032653}
.setup-panel #start{min-height:54px;padding:12px;font-size:21px;letter-spacing:2px;border-radius:12px}.setup-panel #start:disabled{opacity:.6;font-size:14px;letter-spacing:.4px}
.setup-panel [data-ranked-status]{font-size:12px!important;text-align:center;line-height:1.3!important;margin:8px 0;color:#a1cdec!important}.setup-panel [data-ranked-status]:empty{display:none}
.menu-links{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.setup-panel .menu-links .secondary{width:100%;margin:0;min-height:42px;padding:9px 3px;border:1px solid #3d91c777;border-radius:10px;background:#053061;color:#edfbff;font-size:14px;text-align:center}
.menu-top button:focus-visible,#menuRider:focus-visible,.tile-trigger:focus-visible,.tile-choices button:focus-visible,#menuModes button:focus-visible{outline:2px solid #4ffff0;outline-offset:-3px}
@media(max-width:600px){.overlay.setup{align-items:flex-end;padding:12px 12px 40px}.setup .setup-panel{gap:9px;padding:0 12px 12px}.menu-top{margin:0 -12px;padding:8px 12px}.menu-bar-logo{width:48px;height:48px}#menuRider{height:236px}.tile-trigger img{max-height:94px}.menu-rider-name,.tile-caption{font-size:12px;min-height:34px;padding:6px 4px}}
@media(max-height:740px){.menu-top{padding-top:6px;padding-bottom:6px}.menu-bar-logo{width:42px;height:42px}#menuRider{height:182px}.tile-trigger img{max-height:67px}.menu-rider-name,.tile-caption{min-height:34px}#menuModes button{min-height:44px;padding:6px 4px}#menuModes{margin-bottom:9px}.setup-panel #start{min-height:48px;padding:10px}.menu-links{gap:6px;margin-top:8px}.setup-panel .menu-links .secondary{min-height:40px;padding:7px 3px}}
@media(max-height:450px) and (min-width:601px){.overlay.setup{padding:10px 14px 36px}.setup .setup-panel{width:min(900px,100%);grid-template-columns:1.15fr .8fr 1.5fr;gap:8px 12px;padding-bottom:12px}.menu-top{grid-column:1/-1;padding-top:5px;padding-bottom:5px}.menu-bar-logo{height:34px;width:34px}.menu-wordmark{max-height:30.4px;max-width:240px}.menu-profile-toggle{height:34px;min-height:34px}.menu-main{grid-column:3;grid-row:2}.menu-rider{grid-column:1;grid-row:2}.menu-equipment{grid-column:2;grid-row:2}#menuRider{height:174px}.tile-trigger img{max-height:64px}#menuModes button{min-height:40px}.menu-links{margin-top:6px}.setup-panel [data-ranked-status]{margin:5px 0}.tile-choices{max-height:160px;top:auto;bottom:0}}

/* A quiet home screen, with setup options inside each game section. */
.setup .setup-panel{width:min(540px,100%);grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);border:1px solid #66cfff55;box-shadow:0 24px 80px #00112688}
.menu-top{justify-content:center;background:transparent;border-bottom:0;padding:24px 16px 12px}
.menu-bar-logo{display:none}.menu-wordmark{width:100%;max-width:340px;max-height:70px;filter:grayscale(1) brightness(2)}
.menu-navigation{grid-column:1/-1;display:flex;align-items:center;gap:16px;margin-bottom:6px}
.menu-back{border:1px solid #66cfff55;border-radius:10px;background:#032653;color:#beecff;padding:10px 12px;font-size:13px}
.menu-navigation h2{margin:0;font-size:22px;color:#fff;letter-spacing:-.5px}
.setup-panel[data-section=home]{display:block;padding:24px;width:min(440px,100%)}
.setup-panel[data-section=home] .menu-top{margin:0;padding:12px 0 32px}
.setup-panel[data-section=home] .menu-profile-toggle,
.setup-panel[data-section=home] .menu-rider,
.setup-panel[data-section=home] .menu-equipment,
.setup-panel[data-section=home] .menu-navigation,
.setup-panel[data-section=home] .menu-main>:not(#menuModes),
.setup-panel[data-section=home] .career-menu{display:none}
#menuModes{grid-template-columns:1fr;gap:12px;margin:0}
#menuModes button,#menuModes button[aria-pressed=true]{min-height:60px;padding:16px 22px;text-align:left;font-size:19px;letter-spacing:.2px;color:#efffff;background:linear-gradient(110deg,#075080,#062e60);border:1px solid #55c9ef66;box-shadow:none;border-radius:14px}
#menuModes button::after{content:'';float:right;width:8px;height:8px;margin-top:7px;border-top:2px solid #39eceb;border-right:2px solid #39eceb;transform:rotate(45deg)}
#menuModes button:hover,.career-levels [data-level]:hover{border-color:#50fff0;background:#075183}
.setup-panel:not([data-section=home]) #menuModes,.setup-panel:not([data-section=home]) .mode-choice{display:none}
.career-menu{grid-column:1/-1;display:none}
.setup-panel[data-section=career] .career-menu{display:grid;gap:12px}
.setup-panel[data-section=career] .menu-rider,.setup-panel[data-section=career] .menu-equipment,.setup-panel[data-section=career] .menu-main{display:none}
.career-menu .primary{width:100%;min-height:46px;padding:10px 12px;border-radius:11px;font-size:15px;letter-spacing:.3px}
.career-levels{padding:14px;border:1px solid #55c9ef55;border-radius:14px;background:#001f4580}
.career-levels h3{margin:0;color:#efffff;font-size:17px}.career-levels p{margin:5px 0 0;font-size:11px;color:#a5cddd;line-height:1.4}
.career-levels [role=group]{display:grid;grid-template-columns:1fr;gap:5px;margin:12px 0}
.career-levels [data-level]{display:flex;align-items:center;gap:8px;width:100%;min-height:40px;padding:7px 10px;text-align:left;border:1px solid #4e9fce66;border-radius:10px;background:#032b60;color:#edfbff;font-size:13px;line-height:1.2}
.career-levels .level-number{flex:none;font-size:10px;font-variant-numeric:tabular-nums;color:#83b1c7}
.career-levels [data-level][aria-pressed=true]{border-color:#31eadc;box-shadow:inset 3px 0 #31eadc}
.career-levels [aria-pressed=true] .level-number{color:#31eadc}
.career-menu button:disabled{opacity:.35;cursor:not-allowed}
.setup-panel[data-section=competition] [data-social-open=social],.setup-panel[data-section=multiplayer] [data-social-open=rankings],.setup-panel[data-section=free] [data-social-open=rankings],.setup-panel[data-section=free] [data-social-open=social]{display:none}
.menu-navigation button:focus-visible,.career-menu button:focus-visible{outline:2px solid #4ffff0;outline-offset:3px}
@media(max-width:600px){.overlay.setup{align-items:center}.setup-panel[data-section=home]{padding:22px}}
@media(max-height:450px) and (min-width:601px){.setup .setup-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px}.setup-panel[data-section=home]{display:block}.menu-top{grid-column:1/-1;padding:8px}.menu-navigation{grid-column:1/-1}.menu-rider,.menu-equipment,.menu-main{grid-column:auto;grid-row:auto}.menu-main{grid-column:1/-1}#menuModes{grid-template-columns:1fr 1fr}.setup-panel[data-section=home] .menu-top{padding:0 0 18px}.career-menu{grid-column:1/-1}}

.setup-panel[data-section=career] .menu-top h1,.setup-panel[data-section=career] .menu-bar-logo,.setup-panel[data-section=career] .menu-navigation{display:none}
.setup-panel[data-section=career] .menu-top{justify-content:space-between;padding-top:12px;padding-bottom:0}
.career-menu .primary{display:flex;align-items:center;justify-content:center;text-align:center}
#careerProgress:empty{display:none}
.career-levels [data-level]:not([data-level=lesson]){opacity:.55}
@media(max-width:360px){.career-levels{padding:11px}.career-levels [data-level]{padding:8px;gap:6px;font-size:12px}}
@media(max-height:450px) and (min-width:601px){
 .setup .setup-panel[data-section=career]{width:min(760px,100%);gap:8px}
 .setup-panel[data-section=career] .menu-top{padding:6px 12px 0}
 .setup-panel[data-section=career] .career-menu{grid-template-columns:minmax(140px,.7fr) minmax(0,2fr);align-items:start;gap:12px}
 .career-levels{padding:10px 12px}.career-levels [role=group]{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:8px 0}
 .career-levels [data-level]{min-height:44px;padding:7px;font-size:12px}.career-levels h3{font-size:15px}
 .career-levels .primary{min-height:44px;padding:8px}
}
