/* Shared blue-water menu system. Gameplay HUD and story artwork stay authored. */
:root{--menu-blue:#0649db;--menu-line:#8ffcff99;--menu-surface:linear-gradient(155deg,#0665eaf5 0%,#008bdcee 55%,#00b9c8ee 100%);--menu-soft:#003fa666;--menu-white:#f0fbff;--menu-text:#fff}
.overlay.setup{background:linear-gradient(180deg,#0756fa99,#00efdc88),url('brand-water.jpg') center/cover;backdrop-filter:none}
.setup .setup-panel,.overlay .panel,#socialDialog,#trickBook,.pause-menu,.career-difficulty{background:var(--menu-surface);border:1px solid var(--menu-line);border-radius:18px;color:var(--menu-text);font-family:var(--hud-font);box-shadow:0 18px 60px #00478e33,inset 0 1px #ffffff33}
#socialDialog::backdrop,#trickBook::backdrop,.pause-menu::backdrop,.career-difficulty::backdrop{background:#003d8880;backdrop-filter:blur(6px)}
.setup-panel[data-section=home] .menu-main>.menu-secondary{grid-template-columns:1fr 1.5fr 1fr 1fr;border-color:#9dfcff8c}
#menuModes button,#menuModes button[aria-pressed=true],.overlay .panel .primary,#socialBody .primary,.pause-menu button:not(.secondary),.career-difficulty .difficulty-option,#start,#resume{background:var(--menu-white);color:var(--menu-blue);border:1px solid #ffffffb3;box-shadow:inset 0 1px #fff;font-family:var(--hud-font);font-weight:600;letter-spacing:0;text-shadow:none}
#menuModes button::after{border-color:var(--menu-blue)}
#menuModes button:not(:disabled):hover,.overlay .panel .primary:hover{background:#fff;color:#0343c5}
.menu-secondary button,.setup-panel .menu-links .secondary,.menu-back,.menu-profile-toggle,.pause-menu .secondary,.overlay .panel .secondary,.social-tabs button,#socialBody .secondary,.career-difficulty button{background:#007bc155;border:1px solid var(--menu-line);color:#fff;border-radius:9px;font-family:var(--hud-font);font-weight:500;letter-spacing:0;text-transform:none;box-shadow:none}
.menu-secondary button{padding:9px 3px;font-size:11px}
.menu-stage,.menu-picker,.career-levels{background:linear-gradient(140deg,#0049bd66,#00c5d54d);border-color:var(--menu-line)}
.menu-rider{display:flex;flex-direction:column;gap:8px}.menu-rider .menu-stage{flex:1;height:auto}.menu-rider-tile{flex:none}.menu-rider-tile .tile-trigger{min-height:44px}.menu-rider-tile .tile-choices{left:0;right:auto}
.menu-rider-name,.tile-caption{background:#0047a877;border-color:#9dfcff55;color:#fff;font-family:var(--hud-font);font-weight:600;text-transform:none;letter-spacing:0}
.tile-choices{background:linear-gradient(150deg,#0754bc,#006b8c);border-color:#85faff;width:min(300px,calc(100vw - 64px));max-height:270px;padding:6px}
.tile-choices button{display:flex;align-items:center;gap:10px;min-height:62px;padding:6px;font-family:var(--hud-font);font-size:13px;line-height:1.25;border:1px solid transparent}
.tile-choices button img{width:64px;height:48px;flex:none;object-fit:cover;border-radius:6px;background:#ffffff22}.tile-choices img[data-kind=boat],.tile-choices img[data-kind=gender]{object-fit:contain}
.tile-choices button>span{flex:1}.tile-choices button small{float:none;font-size:9px;color:#d4faff}
.tile-choices button[aria-current=true]{background:#ffffff20;border-color:#73ffee;color:#fff}.tile-choices button:not(:disabled):hover{background:#ffffff2b}
.tile-choices button[data-social-open]{min-height:44px;justify-content:center;border-top-color:#ffffff40}
.career-levels [data-level]{background:#004ab455;color:#fff;border-color:#ffffff40;min-height:54px}.career-levels [data-level]:not([data-level=lesson]):not([data-level=chapter-1]){opacity:1}.career-levels [data-level]:disabled{opacity:.45}
.career-thumb{flex:none;width:56px;height:40px;object-fit:cover;border-radius:5px;background:#ffffff22}.career-levels .completion{margin-left:auto;font-size:10px;color:#c5fff2}.career-levels .level-number{color:#d4faff}
.career-levels p,.setup-panel [data-ranked-status],.panel p,.panel label,#socialBody label,#socialBody p,#socialMessage{color:#e1f7ff!important}
.social-heading{background:#075ece;border-color:#8dfaff77}.social-heading strong,.panel h2,.panel .eyebrow,.rankings strong,.mp-state{color:#fff}
#socialBody input,#socialBody select,.panel select{background:#00499b;color:#fff;border-color:var(--menu-line)}
.social-tabs button[aria-pressed=true]{background:#eafbff;color:var(--menu-blue);border-color:#fff}
#socialBody .rider-portrait{background:radial-gradient(ellipse,#82ffff55,transparent 70%)}
.rider-option-group{border:0;padding:0;margin:18px 0}.rider-option-group legend{font-size:14px;font-weight:600;margin-bottom:8px}.rider-option-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#socialBody .rider-option{display:flex;flex-direction:column;align-items:center;gap:5px;background:#0049a466;color:#fff;border:1px solid var(--menu-line);border-radius:10px;padding:8px;margin:0;font:500 12px var(--hud-font)}
#socialBody .rider-option[aria-pressed=true]{border-color:#fff;box-shadow:inset 0 0 0 1px #fff;background:#ffffff24}.rider-option img{width:100%;height:86px;object-fit:contain}
#trickBook .book-scroller{background:#00387977}#trickBook thead th{background:#064ba2}#trickBook .book-group th{background:#086aa0;color:#e5ffff}
:is(.setup-panel,#socialDialog,.pause-menu,.career-difficulty) button:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media(max-width:350px){.setup-panel[data-section=home] .menu-main>.menu-secondary{grid-template-columns:1fr 1fr}.menu-secondary button{min-height:44px;font-size:12px}.career-thumb{width:44px;height:34px}}
@media(max-height:450px) and (min-width:601px){.tile-choices{max-height:190px}.career-thumb{width:38px;height:30px}.career-levels [data-level]{min-height:44px}.menu-rider-tile .tile-trigger{min-height:38px}}
html[data-beta-audience=public] .career-levels [data-level]:disabled::after{content:attr(data-lock-label);text-transform:none;letter-spacing:0;color:#e4faff;font-size:10px}
.pause-menu #resume{background:var(--menu-white);color:var(--menu-blue);border:1px solid #fff}
#pauseMenu button.secondary{border-color:var(--menu-line);background:#007bc155}
#socialBody h2{font-weight:600;letter-spacing:-.4px;font-size:24px}
.career-difficulty{padding:20px;overflow:auto}
.career-difficulty .difficulty-option:hover{background:#fff;color:var(--menu-blue)}