/* RUNEWORLD: Vinnie's Adventure — shared title screen for all chapters. */
.on-title .arcade{max-width:1440px;padding:22px 28px}
.on-title .masthead,.on-title #run-status,.on-title .hud,.on-title .console-bar,.on-title .footnote,.on-title .touch-controls,.on-title #toast{display:none!important}
.on-title .game-shell{width:100%;margin:0;border:1px solid #78906766;box-shadow:0 24px 90px #0009;border-radius:14px;isolation:isolate}
.on-title .overlay{display:block;padding:0;background:transparent;backdrop-filter:none}
.on-title .title-card{position:absolute;inset:0;width:100%;max-width:none;padding:0;margin:0;text-align:center;background:#080f27 url('./assets/menu-night-vcs.png') center center/cover no-repeat;border:0;border-radius:0;overflow:hidden;box-shadow:none}
.title-card::before{content:'';position:absolute;inset:0;background:linear-gradient(#020a2473,transparent 28%,transparent 55%,#0009193b);pointer-events:none}
.title-card>.chapter-tag,.title-card>p,.title-card .start-controls{display:none}
body.on-title .title-card h1{position:absolute;z-index:2;top:3.5%;left:3%;right:3%;margin:0;font-size:clamp(35px,6.7vw,92px);font-weight:900;line-height:.94;letter-spacing:-3px;color:#a3ff12;text-shadow:0 2px 0 #385a08,0 5px 0 #102b16,0 0 6px #a3ff1277,0 0 20px #76ff2466,0 0 46px #68ff242e,0 9px 24px #000}
body.on-title .title-card h1 span{display:block;margin-top:11px;color:#ffd994;font-size:.33em;font-weight:800;letter-spacing:3px;text-transform:none;text-shadow:0 2px 0 #1b1625,0 4px 10px #000}
.menu-characters{position:absolute;inset:0;pointer-events:none;z-index:1}
.menu-characters canvas{position:absolute;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 0 #07132188) drop-shadow(0 0 13px #68a9cb44)}
#menu-vinnie{left:6.5%;bottom:10%;width:31%;max-height:56%;transform:translateX(calc(-100% - 16vw));opacity:0;transform-origin:55% 98%}
#menu-bear{right:10%;bottom:9%;width:22%;max-height:48%;transform:rotate(5deg) scaleX(-1);opacity:0}
.menu-ready #menu-vinnie{animation:vinnie-title-enter 2.05s linear both}
.menu-ready #menu-bear{animation:bear-title-enter 1.3s 1.4s linear both,bear-title-growl 2.2s 2.7s ease-in-out forwards}
@keyframes vinnie-title-enter{0%{opacity:1;transform:translateX(calc(-100% - 16vw))}84%{opacity:1;transform:translateX(0) scaleX(1)}91%{opacity:1;transform:translateX(0) scaleX(.87)}100%{opacity:1;transform:translateX(0) scaleX(1)}}
@keyframes bear-title-enter{0%{opacity:1;transform:translateX(calc(100% + 16vw)) rotate(5deg) scaleX(-1)}100%{opacity:1;transform:translateX(0) rotate(5deg) scaleX(-1)}}
@keyframes bear-title-growl{0%,100%{transform:translate(0,0) rotate(5deg) scaleX(-1)}18%,42%,66%{transform:translate(-5px,-6px) rotate(3deg) scale(-1.025,1.025)}30%,54%,78%{transform:translate(-2px,-2px) rotate(4deg) scale(-1.01,1.01)}}
.menu-controls{box-sizing:border-box;position:absolute;z-index:3;left:50%;bottom:6.5%;width:26%;min-width:210px;max-width:340px;transform:translateX(-50%);display:flex;flex-direction:column;gap:9px;padding:15px;border:1px solid #c8e59855;border-radius:10px;background:linear-gradient(#07182bee,#07141ef5);box-shadow:0 9px 0 #030a1280,0 12px 32px #0009}
.menu-controls #play-button,.menu-controls #start-account-button,.menu-controls select{box-sizing:border-box;width:100%;min-width:0;min-height:44px;border-radius:5px;font-size:clamp(12px,1.1vw,16px);font-weight:800;line-height:1.2;letter-spacing:.4px}
.menu-controls #play-button{order:0;background:linear-gradient(#dcff8e,#b9ed62);border:1px solid #e8ffb1;color:#183323;box-shadow:0 3px 0 #597d2b;margin:0;padding:12px 7px}
.menu-controls .chapter-picker{order:1;display:flex;flex-direction:column;align-items:stretch;gap:4px;margin:2px 0 0;font-size:8px;line-height:1;letter-spacing:1.8px;color:#b4c8c6;text-align:left}
.menu-controls select{max-width:none;margin:0;color:#e8f0db;background:#142b36;border:1px solid #66838b;padding:10px 9px;font-weight:500;letter-spacing:0;appearance:auto}
.menu-controls #start-account-button{display:block!important;order:2;margin:0;color:#e3efda;background:#203846;border:1px solid #789193;padding:10px 8px;box-shadow:0 2px 0 #08111b}
.menu-controls button:hover{filter:brightness(1.12)}
.menu-controls button:focus-visible,.menu-controls select:focus-visible{outline:3px solid #fff0b0;outline-offset:3px}
.menu-credit{position:absolute;bottom:1.5%;left:0;right:0;font-size:clamp(6px,.68vw,10px);letter-spacing:2px;color:#a5b7c9;text-shadow:0 1px 3px #000;z-index:3}
.on-title.embed .arcade{padding:0}
@media(max-width:700px){
 .on-title .arcade{padding:8px}
 .on-title .game-shell{aspect-ratio:3/4;min-height:490px;max-height:none}
 .on-title .title-card{background-position:center 44%}
 body.on-title .title-card h1{top:5%;font-size:clamp(38px,10vw,66px);letter-spacing:-2px}
 body.on-title .title-card h1 span{font-size:.36em;letter-spacing:1.6px}
 #menu-vinnie{left:-1%;bottom:38%;width:45%;max-height:39%}
 #menu-bear{right:2%;bottom:36%;width:31%;max-height:32%}
 .menu-controls{bottom:7%;width:68%;min-width:0;max-width:310px;padding:13px;gap:8px}
 .menu-controls #play-button,.menu-controls #start-account-button,.menu-controls select{font-size:14px;min-height:44px}
 .menu-credit{bottom:2.5%;font-size:8px;letter-spacing:1.4px}
}
@media(max-height:550px) and (orientation:landscape){
 .on-title .arcade{padding:0}
 .on-title .game-shell{aspect-ratio:16/9;min-height:0;max-height:100dvh}
 body.on-title .title-card h1{top:3%;font-size:clamp(32px,6vw,66px)}
 body.on-title .title-card h1 span{margin-top:6px}
 .menu-controls{bottom:6%;padding:8px;gap:5px;min-width:185px;width:27%}
 .menu-controls #play-button,.menu-controls #start-account-button,.menu-controls select{min-height:32px;font-size:11px;padding:7px}
 .menu-controls .chapter-picker{font-size:7px;gap:3px}
}
@media(prefers-reduced-motion:reduce){.menu-ready #menu-vinnie{animation:none;opacity:1;transform:none}.menu-ready #menu-bear{animation:none;opacity:1;transform:rotate(5deg) scaleX(-1)}}