.titleScreen{position:fixed;inset:0;z-index:250;display:none;flex-direction:column;justify-content:center;align-items:center;gap:7px;overflow-y:auto;overscroll-behavior:contain;padding:calc(env(safe-area-inset-top) + 12px) 14px calc(env(safe-area-inset-bottom) + 15px);background:radial-gradient(ellipse at 50% 45%,#1556a0 0%,#0a2c63 46%,#040e28 96%);color:#fff}
.titleScreen.open{display:flex}
.titleVisual{min-height:0;flex:1;display:flex;align-items:center;justify-content:center;width:100%;max-height:74dvh}
.titleWarriorLogo{display:block;max-height:100%;max-width:min(97vw,550px);width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 0 24px #389dff66)}
.titleEnter{flex:none;width:min(88vw,420px);font:900 clamp(22px,5vw,31px)/1.2 system-ui;letter-spacing:.13em;padding:16px 28px;border:2px solid #e6cd81;border-radius:18px;color:#071d3a;background:linear-gradient(130deg,#fff1b5,#e7c66f 48%,#c9993c);box-shadow:0 0 24px #ffe6a07c,0 9px 26px #0008}
.titleHint{flex:none;margin:8px 0 0;color:#c7dffa;font:700 11px system-ui;letter-spacing:.2em;text-align:center;text-transform:uppercase}
.titleTheme,.titleClose{position:absolute;top:calc(env(safe-area-inset-top) + 12px);width:42px;height:42px;border-radius:50%;border:1px solid #77ace0;background:#0d3260b5;color:#fff;z-index:2;font-size:21px}
.titleTheme{left:16px}.titleClose{right:16px}.titleClose[hidden]{display:none!important}
.brand[role="button"]{cursor:pointer}
#menu.hero{justify-content:safe center!important;gap:18px!important}
#menu.hero .modeHeading{margin:0;text-align:center;color:#f6d584;font:900 clamp(25px,7vw,38px)/1.2 system-ui;letter-spacing:.06em;flex:none}
#menu.hero .modeIntro{font-size:14px;margin:0;flex:none}
@media(max-height:700px){.titleVisual{max-height:68dvh}.titleEnter{padding-block:12px}.titleHint{margin:0}.titleScreen{gap:4px}}
body.light-mode .titleScreen{background:radial-gradient(ellipse at 50% 45%,#eaf8ff 0%,#c7e8ff 56%,#9ec8e9 100%);color:#153b5e}
body.light-mode .titleEnter{background:linear-gradient(130deg,#fff2b9,#e9cc7e 50%,#d8ab51);color:#12385a;box-shadow:0 4px 26px #5e9cc57a}
body.light-mode .titleHint{color:#345c7b}
body.light-mode .titleTheme,body.light-mode .titleClose{background:#f6fbff;color:#1b4667;border-color:#8fb6d4}
body.light-mode #menu.hero .modeHeading{color:#9b7012}
