/* The title painting and logo remain native bitmap artwork. */
:root{color-scheme:dark;--cream:#fff0ce;--ink:#152b29;--gold:#eec95e}
*{box-sizing:border-box}
html,body{margin:0;min-width:280px;min-height:100%;background:#142221}
body{font-family:Arial,Helvetica,sans-serif;color:var(--cream)}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.title-screen{position:relative;isolation:isolate;display:grid;grid-template-rows:1fr auto;min-height:100svh;overflow:hidden;background:#142221}
.title-atmosphere{position:absolute;z-index:-3;inset:-6%;background:linear-gradient(#111e1a20,#101b18b0),url('../art/ed-edd-eddy/ui/v1/title-cast.png') center/cover;filter:blur(18px);transform:scale(1.04)}
.title-cast{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
.title-screen::after{position:absolute;content:"";inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#10211c08 0%,transparent 62%,#0d201b30 79%,#0d201bd9 100%)}
.title-brand{position:absolute;top:1.5svh;left:50%;transform:translateX(-50%);width:min(690px,59vw);height:25svh;text-align:center;pointer-events:none}
.title-logo{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 2px #10221960)}
.title-menu{align-self:end;grid-row:1;justify-self:center;width:min(850px,calc(100% - 48px));padding:22px 0 11px;text-align:center}
.title-kicker{margin:0 0 11px;font-size:11px;font-weight:800;letter-spacing:3px;line-height:1.5;text-shadow:0 1px 6px #000,0 1px 2px #000}
.title-actions{display:flex;justify-content:center;gap:12px}
.title-action{position:relative;display:flex;align-items:center;justify-content:center;min-height:55px;min-width:175px;padding:15px 27px;border:2px solid #fff0ce;border-radius:3px;text-decoration:none;color:var(--ink);background:#fff0ce;font-size:14px;font-weight:900;letter-spacing:2px;box-shadow:0 3px 0 #10261d,0 7px 20px #101c1870;transition:transform .12s,background .12s,color .12s}
.title-action-play{min-width:240px;background:var(--gold);border-color:var(--gold);font-size:20px;letter-spacing:4px}
.action-arrow{position:absolute;right:22px;font-size:22px;line-height:1}
.title-action:hover,.title-action.is-current{background:#152b29;color:#fff0ce;transform:translateY(-3px)}
.title-action:focus-visible{outline:3px solid #fff;outline-offset:5px;background:#152b29;color:#fff0ce;transform:translateY(-3px)}
.title-controls{margin:15px 0 0;color:#fff0ce;font-size:11px;line-height:1.6;text-shadow:0 1px 5px #000,0 1px 2px #000}
.title-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 24px 17px;font-size:10px;line-height:1.4;letter-spacing:.8px;color:#e4e8cf;text-shadow:0 1px 3px #000}
.title-footer b{padding:0 8px;color:#eec95e}
.logo-error #game-title{position:static!important;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal;font:bold clamp(30px,5vw,65px)/1.1 Georgia,serif;color:#fff0ce;text-shadow:0 3px #152b29}
.logo-error .title-logo{display:none}
@media(min-aspect-ratio:18/10){.title-brand{height:27svh}.title-menu{padding-bottom:5px}.title-footer{padding-top:10px}}
@media(max-aspect-ratio:4/5){.title-screen{min-height:max(620px,100svh)}.title-cast{inset:22svh 0 auto;height:auto;aspect-ratio:16/9;object-fit:contain}.title-brand{top:2svh;width:94vw;height:24svh}.title-screen::after{background:linear-gradient(180deg,#10211c10 0%,transparent 35%,#0d201b30 60%,#0d201bdd 90%)}.title-menu{width:min(360px,calc(100% - 44px));padding-top:30px}.title-kicker{font-size:9px;letter-spacing:2px}.title-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.title-action{min-width:0;padding:14px 10px;min-height:49px;font-size:11px;letter-spacing:1.2px}.title-action-play{grid-column:1/-1;min-height:57px;font-size:20px;letter-spacing:4px}.title-controls{font-size:10px;margin-top:12px}.title-footer{justify-content:center;flex-wrap:wrap;gap:4px 15px;font-size:8px;padding:13px 14px 15px}}
@media(max-height:540px) and (min-aspect-ratio:4/5){.title-brand{top:1svh;height:24svh;width:52vw}.title-menu{padding-bottom:0}.title-kicker{font-size:9px;margin-bottom:6px}.title-action{min-height:41px;padding:9px 17px;min-width:150px;font-size:11px}.title-action-play{min-width:210px;font-size:16px}.title-controls{margin-top:8px;font-size:9px}.title-footer{padding:8px 16px;font-size:8px}}
@media(prefers-reduced-motion:reduce){.title-action{transition:none}}