/* The menu is a racing poster: navy ink, warm paper and a yellow ticket. */
.menu-sound{position:absolute;z-index:40;top:max(10px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:transparent;color:#102a47;touch-action:manipulation}
.menu-sound-disc{display:grid;place-items:center;width:20px;height:20px;border:1px solid #102a47;border-radius:50%;background:#ffdb35;box-shadow:0 2px 0 #102a4730;pointer-events:none}
.menu-sound[aria-pressed="true"] .menu-sound-disc{background:#adb8bd}
.sound-icon{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.sound-icon ellipse{fill:currentColor;stroke:none}
.menu-sound .sound-icon{width:12px;height:12px}
#sound{display:inline-grid;place-items:center;background:#ffdb35;color:#102a47}
#sound[aria-pressed="true"]{background:#adb8bd;color:#102a47}
.menu-map-arrow{display:grid;place-items:center;padding:0;line-height:1}
.menu-map-arrow svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.menu-sound:focus-visible{outline:3px solid #1781bb;outline-offset:3px}
.menu-page-top .menu-mini-brand{margin-right:44px}
.menu-shell{--menu-ink:#102a47;--menu-yellow:#ffdb35;--menu-paper:#fff9e8;--menu-red:#f25d45;position:absolute;inset:0;z-index:20;isolation:isolate;overflow:hidden;background:#a2d9f0;color:var(--menu-ink);font-family:"Microsoft YaHei","PingFang SC","Segoe UI",sans-serif}
.menu-active>.topbar,.menu-active>.vignette,.menu-active>#speech-layer,.menu-active>#toast{visibility:hidden}.menu-active>#game{visibility:hidden}
.menu-shell button,.menu-shell input,.menu-shell textarea,.menu-shell select{font-family:inherit}.menu-shell button{touch-action:manipulation}.menu-shell button:disabled{cursor:not-allowed;opacity:.65}.menu-shell button:focus-visible,.menu-shell input:focus-visible,.menu-shell textarea:focus-visible,.menu-shell select:focus-visible{outline:3px solid #1781bb;outline-offset:4px}
.menu-shell [hidden]{display:none!important}.menu-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.menu-scene{position:absolute;inset:-.5%;z-index:-2;background:url('assets/home-scene.jpg') center 48%/cover no-repeat;animation:menu-drift 14s ease-in-out infinite alternate;will-change:transform;transform:scale(1.012)}
.menu-shell::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,#102a4733,transparent 30%,transparent 85%,#fff1)}
.menu-view{position:absolute;inset:0}.menu-home{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:max(12px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom));gap:14px}
.menu-logo{display:block;width:min(94%,540px);height:auto;max-height:29%;object-fit:contain;filter:drop-shadow(0 5px 0 #102a4720);animation:menu-logo-float 5s ease-in-out infinite;pointer-events:none}
.menu-ticket{width:min(100%,520px);padding:14px 16px 13px;background:var(--menu-paper);border:2px solid var(--menu-ink);border-radius:22px;box-shadow:0 7px 0 #102a4770;position:relative}
.menu-ticket::before,.menu-ticket::after{content:"";position:absolute;top:45%;width:14px;height:24px;background:#315575;border:2px solid var(--menu-ink);border-radius:20px;pointer-events:none}.menu-ticket::before{left:-9px;border-left:0}.menu-ticket::after{right:-9px;border-right:0}
.menu-primary{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;gap:13px;width:100%;min-height:64px;padding:12px 20px;border:3px solid var(--menu-ink);border-radius:18px;background:linear-gradient(160deg,#ffe960,var(--menu-yellow) 62%,#ffcd22);box-shadow:0 5px 0 var(--menu-ink);color:var(--menu-ink);font-size:clamp(24px,5.6vw,39px);font-weight:950;font-style:italic;line-height:1.2;letter-spacing:.03em;transition:transform .14s,box-shadow .14s}
.menu-primary:not(:disabled):active{transform:translateY(4px);box-shadow:0 1px 0 var(--menu-ink)}.menu-primary:not(:disabled):hover{background:#ffe567}.menu-home .menu-primary::after{content:"";position:absolute;inset:-80% auto -80% -80%;width:23%;background:linear-gradient(90deg,transparent,#fff9,transparent);transform:rotate(25deg);animation:menu-shine 7s ease-in-out infinite;pointer-events:none}
.menu-fast{display:flex;gap:0;flex:none}.menu-fast::before,.menu-fast::after{content:"";width:16px;height:23px;display:block;background:var(--menu-ink);clip-path:polygon(0 0,45% 0,100% 50%,45% 100%,0 100%,55% 50%)}
.menu-checker{display:flex;align-items:center;gap:18px;height:24px;margin:6px 2px}.menu-checker::before,.menu-checker::after{content:"";flex:1;height:4px;border-top:3px solid var(--menu-red);border-bottom:1px solid var(--menu-red)}.menu-checker i{display:block;flex:none;width:65px;height:14px;transform:skew(-14deg);background:conic-gradient(var(--menu-ink) 25%,transparent 0 50%,var(--menu-ink) 0 75%,transparent 0) 0 0/14px 14px}
.menu-secondary-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.menu-secondary{display:flex;align-items:center;justify-content:center;gap:7px;min-height:49px;padding:9px 6px;border:2px solid var(--menu-ink);border-radius:13px;background:#fffdf3;box-shadow:0 3px 0 #102a4750;color:var(--menu-ink);font-size:clamp(15px,4.2vw,22px);font-weight:850}.menu-secondary:hover{background:#fff0bd}.menu-secondary:active{transform:translateY(2px);box-shadow:0 1px 0 #102a4750}.menu-icon{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.menu-page{display:flex;flex-direction:column;align-items:center;padding:max(16px,env(safe-area-inset-top)) 0 max(16px,env(safe-area-inset-bottom));background:linear-gradient(180deg,#c2eeffdc,#fdf8e9f5 68%);overflow:auto;overscroll-behavior:contain}
.menu-page-top{width:min(100% - 36px,740px);display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none}.menu-back{min-height:44px;padding:9px 15px;border:2px solid var(--menu-ink);border-radius:18px;background:#fffbed;font-size:15px;font-weight:850;color:var(--menu-ink);box-shadow:0 3px 0 #102a4730}.menu-mini-brand{font-size:19px;font-weight:950;font-style:italic;letter-spacing:-1px;color:var(--menu-ink)}
.menu-shell h2{font-size:clamp(28px,7.5vw,43px);line-height:1.15;letter-spacing:-1px;margin:20px 0 8px;font-weight:950;font-style:italic}.menu-page-copy{margin:0 18px 16px;font-size:13px;color:#486174;font-weight:600;text-align:center;line-height:1.7}.menu-page h2:focus{outline:none}
.menu-map-carousel{--card-width:min(74vw,390px);width:min(100%,760px);position:relative;overflow:hidden;padding:4px 0 12px;flex:none;touch-action:pan-y;outline:none}.menu-map-track{display:flex;gap:18px;transform:translateX(calc((100% - var(--card-width))/2 - var(--map-index,0)*(var(--card-width) + 18px)));transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.menu-map-card{flex:0 0 var(--card-width);min-width:0;border:3px solid var(--menu-ink);border-radius:24px;background:var(--menu-paper);box-shadow:0 6px 0 #102a4735;overflow:hidden;opacity:.55;transform:scale(.95);transition:transform .25s,opacity .25s}.menu-map-card.is-current{opacity:1;transform:scale(1)}.menu-map-art{height:clamp(155px,28vh,265px);position:relative;overflow:hidden;background:#b5dcdf}.menu-map-badge{position:absolute;left:12px;top:12px;padding:6px 12px;border:2px solid var(--menu-ink);border-radius:10px;background:var(--menu-yellow);font-size:12px;font-weight:900}.menu-map-card.is-locked .menu-map-badge{background:#f4f3eb}
.menu-map-mountain{background:linear-gradient(#a5c3b9,#ece7d5);isolation:isolate}.menu-map-mountain::before{content:"";position:absolute;inset:25% -10% 0;background:#597775;clip-path:polygon(0 75%,20% 16%,38% 55%,62% 0,100% 85%,100% 100%,0 100%)}.menu-map-mountain::after{content:"";position:absolute;inset:45% 0 0;background:#7f9790;clip-path:polygon(0 74%,30% 14%,58% 62%,72% 25%,100% 80%,100% 100%,0 100%)}
.menu-map-night{background:linear-gradient(#657285,#bcc3ca)}.menu-map-night::before{content:"";position:absolute;inset:30% 10% 0;background:repeating-linear-gradient(90deg,#627380 0 12%,transparent 12% 16%);clip-path:polygon(0 30%,14% 30%,14% 0,31% 0,31% 42%,45% 42%,45% 15%,62% 15%,62% 45%,78% 45%,78% 8%,100% 8%,100% 100%,0 100%)}.menu-map-night::after{content:"";position:absolute;right:14%;top:19%;width:32px;height:32px;background:#f3ecd6;border-radius:50%}
.menu-lock{position:absolute;left:50%;top:50%;z-index:1;transform:translate(-50%,-30%);width:54px;height:44px;border:4px solid var(--menu-ink);border-radius:9px;background:#fff8e8;box-shadow:0 3px 0 #fff9}.menu-lock::before{content:"";position:absolute;left:9px;right:9px;height:30px;bottom:34px;border:5px solid var(--menu-ink);border-bottom:0;border-radius:22px 22px 0 0}.menu-lock::after{content:"";position:absolute;left:21px;top:12px;height:13px;width:6px;background:var(--menu-ink);border-radius:5px}
.menu-map-info{padding:16px 17px 18px}.menu-map-info h3{margin:0 0 7px;font-size:27px;font-weight:950;font-style:italic}.menu-map-info p{margin:0;color:#546879;font-size:13px;line-height:1.6}.menu-map-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.menu-map-tags span{font-size:11px;font-weight:750;border:1px solid #dab586;background:#ffebc8;padding:4px 10px;border-radius:20px}
.menu-map-arrow{position:absolute;top:39%;width:45px;height:48px;border:2px solid var(--menu-ink);border-radius:16px;background:#fff9e8e8;color:var(--menu-ink);font-size:32px;font-weight:900;z-index:2}.menu-map-arrow:hover{background:#ffdf55}.menu-map-prev{left:max(10px,calc((100% - 540px)/2))}.menu-map-next{right:max(10px,calc((100% - 540px)/2))}.menu-map-dots{display:flex;gap:12px;margin-top:5px}.menu-map-dot{width:24px;height:24px;padding:4px;background:transparent;border-radius:50%;display:grid;place-items:center}.menu-map-dot::after{content:"";display:block;width:12px;height:12px;background:#a2b1b9;border:2px solid var(--menu-ink);border-radius:50%}.menu-map-dot[aria-current="true"]::after{background:var(--menu-yellow)}
.menu-map-footer{width:min(100% - 48px,430px);margin-top:auto;padding-top:10px;flex:none;text-align:center}.menu-map-footer .menu-primary{min-height:58px;font-size:25px}.menu-map-ready{min-height:20px;margin:13px 0 0;font-size:12px;line-height:1.5;color:#5b6f7d}.menu-map-footer #best{margin:7px 0 0;color:#5b6f7d;font-size:11px}.menu-map-footer #tilt-status{font-size:11px;color:#5b6f7d;margin-top:5px;line-height:1.5}
.menu-content{width:min(100% - 36px,700px);padding:22px;background:#fffbedf5;border:2px solid var(--menu-ink);border-radius:22px;box-shadow:0 5px 0 #102a4730;margin:10px 0 24px}.menu-content p{line-height:1.9;font-size:14px;margin:8px 0 18px;color:#465c70}.menu-howto{display:grid;gap:14px;margin:18px 0 0}.menu-howto div{display:grid;grid-template-columns:82px 1fr;gap:10px;align-items:start;font-size:14px;line-height:1.8;border-top:1px solid #d7d8cf;padding-top:12px}.menu-howto dt{font-weight:900}.menu-howto dd{margin:0;color:#52687a}.menu-about-title{font-size:23px;font-weight:900;margin:0}.menu-about-note{border-top:1px solid #d7d8cf;padding-top:15px;font-size:12px!important;color:#758491!important}
.menu-feedback-toolbar{display:flex;align-items:center;gap:12px;width:min(100% - 36px,700px);margin:7px 0 17px}.menu-feedback-toolbar .menu-primary{font-size:21px;min-height:53px;flex:1}.menu-small-button{min-height:44px;padding:8px 14px;background:#fffbed;border:2px solid var(--menu-ink);border-radius:12px;color:var(--menu-ink);font-size:13px;font-weight:800}.menu-feedback-list{width:min(100% - 36px,700px);display:flex;flex-direction:column;gap:14px}.menu-feedback-card{padding:18px;background:#fffbed;border:2px solid var(--menu-ink);border-radius:18px;box-shadow:0 4px 0 #102a4722}.menu-feedback-card header{display:flex;align-items:center;gap:10px;margin-bottom:13px}.menu-avatar{display:grid;place-items:center;width:38px;height:38px;border:2px solid var(--menu-ink);border-radius:50%;background:#ffdf6c;font-size:18px;font-weight:900;flex:none}.menu-feedback-author{min-width:0;flex:1}.menu-feedback-author b{display:block;font-size:15px;overflow-wrap:anywhere}.menu-feedback-author time{display:block;color:#7c8b95;font-size:11px;margin-top:3px}.menu-category-label{font-size:11px;white-space:nowrap;padding:5px 8px;background:#edf4f1;border-radius:10px;color:#526b70}.menu-feedback-message{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8;font-size:14px;margin:0}.menu-feedback-state{width:min(100% - 36px,700px);padding:25px 20px;text-align:center;background:#fffbeddf;border:1px dashed #9aabb6;border-radius:16px;line-height:1.8;font-size:14px;color:#5d7180}.menu-load-more{margin:20px auto}.menu-public-note{font-size:11px;line-height:1.8;text-align:center;color:#5d7180;margin:20px 22px 5px}.menu-feedback-success{width:min(100% - 36px,700px);padding:12px 16px;margin:0 0 15px;border:1px solid #68a87a;border-radius:12px;background:#effbea;color:#28643c;font-size:13px;line-height:1.7}
.menu-feedback-form{display:flex;flex-direction:column;gap:18px}.menu-field{display:flex;flex-direction:column;gap:8px}.menu-field>label,.menu-field>span{font-size:14px;font-weight:850}.menu-field label small{font-size:12px;font-weight:500;color:#71818c;margin-left:6px}.menu-field input,.menu-field select,.menu-field textarea{font-size:16px;line-height:1.6;padding:11px 13px;border:2px solid #a4b3b8;background:#fffefa;border-radius:12px;color:var(--menu-ink);width:100%;outline:none}.menu-field textarea{resize:vertical;min-height:155px;max-height:36vh}.menu-text-count{align-self:flex-end;color:#7a8c98;font-size:11px;margin-top:-4px}.menu-form-error{margin:0!important;color:#ad3730!important;background:#fff0e8;border-radius:10px;padding:10px 12px;font-size:13px!important}.menu-feedback-form .menu-primary{font-size:24px;min-height:58px}.menu-form-public{margin:0!important;font-size:12px!important;line-height:1.7!important;color:#687b8a!important}.menu-form-footer{display:flex;gap:14px;justify-content:center;align-items:center}.menu-form-footer button{border:0;background:transparent;min-height:44px;color:#5a7183;font-size:13px;text-decoration:underline;text-underline-offset:4px}
.menu-dialog-view{display:flex;align-items:center;justify-content:center;background:#102a476b;padding:24px}.menu-exit-dialog{width:min(100%,400px);padding:28px;border:3px solid var(--menu-ink);border-radius:24px;background:var(--menu-paper);box-shadow:0 8px 0 #102a4740;text-align:center}.menu-exit-dialog h2{font-size:31px;margin:0 0 14px}.menu-exit-dialog p{font-size:14px;line-height:1.9;color:#536b7b;margin:0 0 22px}.menu-exit-dialog .menu-primary{font-size:23px;min-height:54px}.menu-exit-dialog .menu-small-button{margin-top:17px;min-width:130px}.menu-exited{background:#edf5f3;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}.menu-exited .menu-logo{animation:none;max-height:none;width:240px;margin:0 auto 24px}.menu-exited h2{font-size:29px;margin:0 0 13px}.menu-exited p{font-size:14px;color:#657887;margin-bottom:28px}.menu-exited .menu-primary{font-size:22px;width:240px;margin:auto}
.menu-motion-paused .menu-scene,.menu-motion-paused .menu-logo,.menu-motion-paused .menu-home .menu-primary::after,.menu-shell:not([data-menu-view="home"]) .menu-scene,.menu-shell:not([data-menu-view="home"]) .menu-logo{animation-play-state:paused}
@keyframes menu-drift{0%{transform:scale(1.012) translate3d(-.18%,-.1%,0)}100%{transform:scale(1.018) translate3d(.18%,.1%,0)}}@keyframes menu-logo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}@keyframes menu-shine{0%,64%{left:-80%}84%,100%{left:150%}}
@media(min-aspect-ratio:6/5){.menu-scene{inset:0;background-image:url("assets/home-scene-landscape.jpg");background-position:70% 50%;background-size:cover;background-color:#64b4ee}.menu-home{align-items:flex-start;justify-content:space-between;width:45%;min-width:340px;max-width:620px;padding:clamp(22px,4vh,48px) clamp(22px,4vw,60px);background:none}.menu-logo{width:100%;max-height:43%;margin:0}.menu-ticket{width:100%;max-width:430px;padding:13px}.menu-primary{font-size:clamp(24px,2.6vw,38px)}.menu-secondary{font-size:clamp(15px,1.6vw,21px)}.menu-map-art{height:clamp(140px,31vh,280px)}}
@media(max-width:360px){.menu-home{padding-left:12px;padding-right:12px}.menu-ticket{padding:11px 10px}.menu-secondary-row{gap:8px}.menu-secondary{gap:4px;font-size:15px}.menu-icon{width:19px;height:19px}.menu-primary{font-size:25px}.menu-map-card{border-radius:18px}.menu-map-info{padding:12px}.menu-map-info h3{font-size:24px}.menu-content{padding:17px}.menu-feedback-card{padding:14px}.menu-category-label{font-size:10px;padding:4px 6px}}
@media(max-height:650px){.menu-home{padding-top:8px;padding-bottom:max(12px,env(safe-area-inset-bottom))}.menu-logo{max-height:27%}.menu-ticket{padding:10px 13px}.menu-primary{min-height:53px;padding:9px 15px}.menu-secondary{min-height:44px;padding:7px 5px}.menu-checker{height:19px;margin:5px 0}.menu-page{padding-top:10px;padding-bottom:12px}.menu-shell h2{margin-top:12px;font-size:28px}.menu-page-copy{margin-bottom:9px}.menu-map-art{height:clamp(110px,24vh,170px)}.menu-map-info{padding:11px 14px}.menu-map-info h3{font-size:23px}.menu-map-tags{margin-top:7px}.menu-map-footer{padding-top:5px}.menu-map-footer .menu-primary{min-height:48px}.menu-map-ready{margin-top:9px}.menu-map-footer #best{display:none}.menu-page-top .menu-back{min-height:40px;padding:7px 12px}}
@media(max-height:430px) and (min-aspect-ratio:6/5){.menu-home{width:47%;min-width:300px;max-width:500px;padding:12px 24px;gap:5px}.menu-logo{max-height:40%;width:83%;align-self:center}.menu-ticket{padding:8px 11px}.menu-primary{min-height:44px;font-size:25px;border-width:2px}.menu-secondary{min-height:39px;font-size:14px}.menu-checker{height:14px;margin:4px 0}.menu-icon{width:18px;height:18px}.menu-map-carousel{--card-width:min(50vw,340px)}.menu-map-art{height:100px}.menu-map-tags{display:none}.menu-map-info{padding:9px 13px}.menu-map-info h3{font-size:21px}.menu-page h2{font-size:25px;margin:8px 0 2px}.menu-map-footer{margin-top:0}.menu-map-footer #tilt-status{display:none}}
@media(prefers-reduced-motion:reduce){.menu-scene,.menu-logo,.menu-home .menu-primary::after{animation:none!important}.menu-map-track,.menu-map-card,.menu-primary{transition:none!important}}
/* The cover now animates inside the illustration; the camera stays still. */
.menu-scene{animation:none;transform:scaleX(-1);will-change:auto}
.menu-scene canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}
@media(prefers-reduced-motion:reduce){.menu-scene canvas{display:none}}
/* Mirror only the artwork, including its animated canvas and static fallback.
   Logos, badges, controls and card perspective keep their normal orientation. */
.menu-map-coast{background:#b5dcdf}
.menu-map-coast::before{content:"";position:absolute;inset:0;background:url('assets/home-scene.jpg') center 42%/cover no-repeat;transform:scaleX(-1);pointer-events:none}
.menu-map-coast .menu-map-badge{z-index:1}
/* Map cards sit on a small display stage. Theme layers cross-fade with the swipe. */
.menu-maps-page{--map-heading:#102a47;--map-copy:#486174;isolation:isolate;background:#d8e8ec;color:var(--map-heading);transition:color .48s ease,background-color .55s ease}
.menu-maps-page[data-map-theme="mountain"]{--map-heading:#173f35;--map-copy:#355e50;background:#cddfcf}
.menu-maps-page[data-map-theme="night"]{--map-heading:#fff5d9;--map-copy:#d0d7f1;background:#2c3458}
.menu-map-atmospheres{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.menu-map-atmosphere{position:absolute;inset:0;opacity:0;transition:opacity .55s cubic-bezier(.2,.7,.2,1)}
.atmosphere-coast{opacity:1;background:radial-gradient(ellipse at 50% 38%,#ffffffad,transparent 65%),linear-gradient(165deg,#a8ddf7 0%,#d9f1f4 46%,#fff7df 100%)}
.atmosphere-mountain{background:radial-gradient(ellipse at 45% 34%,#f3ffdfc4,transparent 65%),linear-gradient(165deg,#6fa88d 0%,#b9d6b9 47%,#e7ecda 100%)}
.atmosphere-night{background:radial-gradient(ellipse at 85% 18%,#a45d6855,transparent 45%),radial-gradient(ellipse at 40% 49%,#7179b575,transparent 60%),linear-gradient(160deg,#192f50 0%,#393653 58%,#655578 100%)}
.menu-maps-page .menu-mini-brand{color:var(--map-heading);transition:color .48s ease}
.menu-maps-page>.menu-page-copy,.menu-maps-page .menu-map-ready,.menu-maps-page .menu-map-footer #best,.menu-maps-page .menu-map-footer #tilt-status{color:var(--map-copy);transition:color .48s ease}
.menu-maps-page .menu-map-carousel{perspective:1100px;perspective-origin:50% 45%;padding-top:15px;padding-bottom:42px;cursor:grab;user-select:none;-webkit-user-select:none}
.menu-maps-page .menu-map-track{transform-style:preserve-3d;transition:transform .5s cubic-bezier(.18,.75,.22,1)}
.menu-maps-page .menu-map-card{--card-slide:0px;--card-turn:28deg;--card-depth:-72px;--card-lift:14px;--card-scale:.88;--card-visibility:.65;position:relative;flex-shrink:0;color:var(--menu-ink);border-color:#18374c;border-top-color:#e9f8ee;transform-origin:50% 54%;transform:translate3d(var(--card-slide),var(--card-lift),var(--card-depth)) rotateY(var(--card-turn)) rotateX(1.5deg) scale(var(--card-scale));opacity:var(--card-visibility);box-shadow:0 2px 0 #ffffffc4 inset,0 -2px 0 #aeb49b inset,0 8px 0 #314b56,0 10px 0 #0c243e,0 24px 25px -9px #102a4770;transition:transform .5s cubic-bezier(.18,.75,.22,1),opacity .45s ease,box-shadow .45s ease;backface-visibility:hidden}
.menu-maps-page .menu-map-card.is-current{--card-turn:0deg;--card-depth:24px;--card-lift:-3px;--card-scale:1;--card-visibility:1;box-shadow:0 2px 0 #ffffffd9 inset,0 -2px 0 #aeb49b inset,0 8px 0 #45616b,0 10px 0 #102a47,0 28px 28px -9px #102a4766}
.menu-maps-page .menu-map-card::after{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid #ffffff7a;background:linear-gradient(125deg,#ffffff3b 0%,#ffffff05 24%,transparent 55%);pointer-events:none}
.menu-maps-page .menu-map-art{box-shadow:inset 0 -12px 22px -20px #102a47}
.menu-maps-page .menu-map-mountain{background:linear-gradient(#92c7b3,#e5edce)}
.menu-maps-page .menu-map-mountain::before{background:#49796b}.menu-maps-page .menu-map-mountain::after{background:#79a68d}
.menu-maps-page .menu-map-night{background:linear-gradient(#34406f,#797394)}
.menu-maps-page .menu-map-night::before{background:repeating-linear-gradient(90deg,#263554 0 12%,transparent 12% 16%)}
.menu-maps-page .menu-map-night::after{background:#ffe5a1;box-shadow:0 0 25px #ffe7b250}
.menu-maps-page .menu-map-dots{margin-top:-10px;position:relative;z-index:2}
.menu-maps-page[data-map-theme="night"] .menu-map-dot::after{background:#7783aa;border-color:#e4e8fa}.menu-maps-page[data-map-theme="night"] .menu-map-dot[aria-current="true"]::after{background:#ffdb35;border-color:#fff7d9}
.menu-maps-page .menu-map-footer{padding-top:18px}
.menu-maps-page.is-dragging .menu-map-carousel{cursor:grabbing}
.menu-maps-page.is-dragging .menu-map-track,.menu-maps-page.is-dragging .menu-map-card,.menu-maps-page.is-dragging .menu-map-atmosphere{transition:none}
@media(max-height:650px){.menu-maps-page .menu-map-carousel{padding-top:10px;padding-bottom:31px}.menu-maps-page .menu-map-footer{padding-top:11px}}
@media(max-height:430px) and (min-aspect-ratio:6/5){.menu-maps-page .menu-map-carousel{padding-top:10px;padding-bottom:28px}.menu-maps-page .menu-map-footer{padding-top:8px}}
@media(prefers-reduced-motion:reduce){.menu-maps-page,.menu-maps-page .menu-mini-brand,.menu-maps-page>.menu-page-copy,.menu-maps-page .menu-map-ready,.menu-maps-page .menu-map-footer #best,.menu-maps-page .menu-map-footer #tilt-status,.menu-map-atmosphere,.menu-maps-page .menu-map-track,.menu-maps-page .menu-map-card{transition:none!important}}

/* A dedicated wide composition fills landscape without a blank sidebar. */
@media (min-aspect-ratio:6/5) {
  .menu-home {left:auto;right:0;align-items:flex-end;width:42%;max-width:620px;min-width:310px;padding:clamp(18px,3vh,34px) clamp(22px,3.5vw,54px)}
  #game-shell:has(.menu-shell[data-menu-view="home"]:not([hidden])) > .menu-sound {left:max(12px,env(safe-area-inset-left));right:auto}
  .menu-home .menu-logo {filter:drop-shadow(0 6px 0 #102a4730) drop-shadow(0 2px 12px #fff9)}
  .menu-home .menu-ticket {background:#fff9eaf5;box-shadow:0 8px 0 #102a4755,0 14px 30px #102a4733}
  .menu-page:not(.menu-maps-page) {background:linear-gradient(180deg,#e1f4fae3,#fff9ebe6)}
}
@media (max-height:430px) and (min-aspect-ratio:6/5) {
  .menu-home {width:42%;min-width:300px;padding:12px max(18px,env(safe-area-inset-left));gap:5px}
}

/* Wide map selection uses the available screen, with a height budget for the CTA. */
@media (min-aspect-ratio:6/5) {
  .menu-maps-page {
    display:grid;grid-template-columns:minmax(0,1fr);
    grid-template-rows:44px 22px minmax(0,1fr) 24px auto;
    align-items:center;justify-items:center;row-gap:6px;
    padding:16px max(22px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left));
    overflow:hidden;
  }
  .menu-maps-page>.menu-page-top {grid-area:1/1;width:min(100%,1420px)}
  .menu-maps-page>h2 {grid-area:1/1;max-width:calc(100% - 260px);margin:0;font-size:clamp(27px,3vw,38px);line-height:1.15;white-space:nowrap;text-align:center}
  .menu-maps-page>.menu-page-copy {grid-area:2/1;margin:0;line-height:1.5;font-size:13px}
  .menu-maps-page .menu-map-carousel {
    --card-width:min(clamp(240px,25vw,340px),calc((100vw - 160px)/2.4));grid-area:3/1;
    width:min(100%,1480px);min-width:0;max-height:100%;
    padding:14px 0 38px;overflow:visible;align-self:center;
  }
  .menu-maps-page .menu-map-art {height:clamp(130px,calc(100dvh - 495px),260px)}
  .menu-maps-page .menu-map-info {padding:14px 16px 16px}
  .menu-maps-page .menu-map-info h3 {font-size:27px;margin-bottom:6px}
  .menu-maps-page .menu-map-info p {font-size:13px;line-height:1.6}
  .menu-maps-page .menu-map-tags {margin-top:10px}
  .menu-maps-page .menu-map-prev {left:clamp(8px,2vw,28px)}
  .menu-maps-page .menu-map-next {right:clamp(8px,2vw,28px)}
  .menu-maps-page .menu-map-dots {grid-area:4/1;margin:0;align-self:center}
  .menu-maps-page .menu-map-footer {grid-area:5/1;width:min(100%,430px);margin:0;padding:0}
  .menu-maps-page .menu-map-footer .menu-primary {min-height:52px;font-size:24px}
  .menu-maps-page .menu-map-ready {min-height:18px;margin-top:8px;line-height:1.5}
  .menu-maps-page .menu-map-footer #best {margin-top:4px}
  .menu-maps-page .menu-map-footer #tilt-status {margin-top:3px}
}
/* Phone landscape keeps the same carousel, with its action and status on one row. */
@media (min-aspect-ratio:6/5) and (max-height:560px) {
  .menu-maps-page {grid-template-rows:38px 18px minmax(0,1fr) 18px 50px;row-gap:3px;padding:10px max(18px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}
  .menu-maps-page>.menu-page-top {width:100%}
  .menu-maps-page>.menu-page-top .menu-back {min-height:36px;padding:6px 12px;font-size:13px}
  .menu-maps-page .menu-mini-brand {font-size:16px}
  .menu-maps-page>h2 {font-size:25px;max-width:calc(100% - 230px)}
  .menu-maps-page>.menu-page-copy {font-size:11px}
  .menu-maps-page .menu-map-carousel {--card-width:min(clamp(220px,27vw,300px),calc((100vw - 156px)/2.4));padding:10px 0 26px}
  .menu-maps-page .menu-map-art {height:clamp(85px,calc(100dvh - 280px),165px)}
  .menu-maps-page .menu-map-card {border-radius:19px}
  .menu-maps-page .menu-map-info {padding:8px 13px 10px}
  .menu-maps-page .menu-map-info h3 {font-size:22px;margin-bottom:4px}
  .menu-maps-page .menu-map-info p {font-size:11px;line-height:1.5}
  .menu-maps-page .menu-map-tags {display:none}
  .menu-maps-page .menu-map-badge {left:9px;top:9px;padding:4px 8px;font-size:10px}
  .menu-maps-page .menu-map-arrow {width:42px;height:44px;font-size:29px}
  .menu-maps-page .menu-map-dots {gap:8px}
  .menu-maps-page .menu-map-dot {width:20px;height:18px;padding:3px}
  .menu-maps-page .menu-map-footer {width:min(100%,670px);display:grid;grid-template-columns:minmax(190px,280px) minmax(0,1fr);align-items:center;gap:6px 16px;text-align:left}
  .menu-maps-page .menu-map-footer .menu-primary {grid-area:1/1;min-height:44px;font-size:22px;padding:8px 15px}
  .menu-maps-page .menu-map-ready {grid-area:1/2;margin:0;min-height:0;font-size:12px}
  .menu-maps-page .menu-map-footer #best,.menu-maps-page .menu-map-footer #tilt-status {display:none}
}
@media (min-aspect-ratio:6/5) {
  .menu-maps-page .menu-map-card.is-map-recycling {opacity:0;transition:none;pointer-events:none}
}
@media (min-aspect-ratio:6/5) and (max-height:360px) {
  .menu-maps-page {grid-template-rows:34px 16px minmax(0,1fr) 16px 46px;row-gap:3px;padding-top:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .menu-maps-page>h2 {font-size:22px}
  .menu-maps-page>.menu-page-top .menu-back {min-height:32px;padding:4px 12px}
  .menu-maps-page .menu-map-carousel {padding-top:8px;padding-bottom:20px}
  .menu-maps-page .menu-map-art {height:clamp(64px,calc(100dvh - 270px),90px)}
  .menu-maps-page .menu-map-info {padding-top:6px;padding-bottom:7px}
  .menu-maps-page .menu-map-info h3 {font-size:20px;margin-bottom:3px}
}
