@font-face{font-family:CodexTitleMenu;src:url("/static/8cbc44217b401a46033e7388ba4d2ed40ec896538a61135d906293392c592d93.woff2") format("woff2");font-display:swap;font-weight:700}
@font-face{font-family:CodexBook;src:url("/static/d7378d5a21e0ad8a2abc026a0e1d61a9e8291ae4e453baf8c47807d22b7c3448.woff2") format("woff2");font-display:swap;font-weight:400 700}

.codex-reset-settings{margin-top:24px;padding-top:20px;border-top:1px solid var(--yashu-line,#c8b995)}
#titleSettings #titleDeleteData{color:var(--yashu-danger,#a5363e);border-color:var(--yashu-danger,#a5363e);background:var(--yashu-danger-soft,#fff0ed)}
#titleScreen .codex-startup-status{position:absolute;left:5%;bottom:max(20px,env(safe-area-inset-bottom));width:min(48%,440px);box-sizing:border-box;margin:0;padding:12px 16px;background:#102a40ed;color:#fff;border:1px solid #ffffff55;border-radius:8px;font:14px/1.65 -apple-system,sans-serif;text-shadow:none;z-index:2}
#titleScreen .codex-startup-status[hidden]{display:none}
#titleScreen .codex-startup-status p{margin:0}
#titleScreen .codex-startup-status pre{font:12px/1.5 monospace;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0}
#titleScreen .codex-startup-noscript{bottom:auto;top:36%;width:90%;max-width:560px}
#titleScreen .codex-title-menu a,#titleScreen .codex-title-menu button{touch-action:manipulation}
#titleScreen{background:#075cad;color:#fff8e8;font-family:CodexBook,"Hiragino Mincho ProN","Yu Mincho",serif;overflow:hidden;z-index:1000}
#titleScreen .codex-title-scene{height:100%;min-height:100svh;padding:0;overflow:hidden;background:#135687;isolation:isolate}
#titleScreen .codex-title-visual{position:absolute;inset:0;z-index:-2;display:block}
#titleScreen .codex-title-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:43% center}
#titleScreen .codex-title-scene::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#052b4a0d,transparent 45%),linear-gradient(0deg,#052b3f38,transparent 28%)}
#titleScreen .codex-title-brand{position:absolute;top:5%;left:5%;right:auto;width:clamp(320px,36vw,560px);text-align:center;animation:titleAppear .8s both;color:#fff;text-shadow:0 2px 5px #000a,0 1px 2px #000c}
#titleScreen .codex-title-brand h1{margin:0;font:inherit;line-height:1;white-space:normal;text-shadow:none}
#titleScreen .codex-title-logo{display:block;width:100%;height:auto;max-width:none;filter:none}
#titleScreen .codex-title-kicker{font:500 12px/1.5 CodexBook,serif;letter-spacing:.22em;margin:0 0 8px}
#titleScreen .codex-title-english{font:11px/1.6 Georgia,serif;letter-spacing:.26em;margin:8px 0 0}
#titleScreen .codex-title-tagline{font:500 clamp(13px,1.3vw,17px)/1.7 CodexBook,serif;letter-spacing:.2em;margin:13px 0 0}
#titleScreen .codex-title-menu{position:absolute;right:max(4%,env(safe-area-inset-right));bottom:max(22px,env(safe-area-inset-bottom));width:clamp(190px,20vw,260px);margin:0;padding:0;display:flex;flex-direction:column;gap:8px;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;text-shadow:0 2px 5px #000a,0 1px 2px #000c;font-family:CodexBook,"Hiragino Mincho ProN","Yu Mincho",serif}
#titleScreen .codex-title-menu .begin{display:flex;justify-content:flex-end;grid-column:auto;width:100%;min-height:52px;gap:10px;padding:9px 6px;margin:0 0 3px;background:transparent;color:#fff;border:0;box-shadow:none;font:700 21px/1.5 CodexTitleMenu,CodexBook,serif;letter-spacing:.13em;text-align:right;text-decoration:none;transform:none}
#titleScreen .codex-title-menu .begin::before{display:none}
#titleScreen .codex-title-menu .arrow{font-size:21px}
#titleScreen .codex-title-menu .story{display:flex;justify-content:flex-end;align-items:center;width:100%;min-height:44px;padding:7px 6px;margin:0;background:transparent;color:#fff;border:0;font:700 14px/1.5 CodexTitleMenu,CodexBook,serif;letter-spacing:.09em;box-shadow:none}
#titleScreen .codex-title-menu .begin:hover,#titleScreen .codex-title-menu .story:hover{background:transparent;color:#fff;text-decoration:underline;text-underline-offset:.25em}
#titleScreen .codex-title-menu .begin:focus-visible,#titleScreen .codex-title-menu .story:focus-visible{outline:none;background:transparent;text-decoration:underline;text-underline-offset:.25em}
#titleScreen .codex-title-copyright{display:block;margin-top:8px;color:#fff;text-align:right;font:9px/1.5 Georgia,serif;letter-spacing:.03em}
#titleScreen dialog{font-family:CodexBook,"Hiragino Mincho ProN","Yu Mincho",serif;color:#293c40;background:#fff9eb;border-color:#bcab83}
#titleScreen dialog h2{font:500 25px/1.55 CodexBook,serif;letter-spacing:.08em}
#titleScreen dialog button,#titleScreen dialog select{font-family:CodexBook,"Hiragino Mincho ProN","Yu Mincho",serif}
#titleScreen dialog .eyebrow{font-family:CodexBook,serif}
#titleScreen .codex-font-license{font:11px/1.6 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere}

#app,.codex-home-command small,.codex-mode-grid .home-cmd small{font-family:CodexBook,"Hiragino Mincho ProN","Yu Mincho",serif}
@media(max-aspect-ratio:4/5){
 #titleScreen .codex-title-visual img{object-position:43% center}
 #titleScreen .codex-title-brand{top:max(5%,env(safe-area-inset-top));left:6%;right:auto;width:88%;max-width:440px}
 #titleScreen .codex-title-kicker{font-size:10px;letter-spacing:.17em}
 #titleScreen .codex-title-english{font-size:9px;letter-spacing:.2em;margin-top:4px}
 #titleScreen .codex-title-tagline{font-size:14px;margin-top:10px}
 #titleScreen .codex-title-menu{right:max(4%,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));width:clamp(156px,46vw,210px);padding:0}
 #titleScreen .codex-title-menu .begin{min-height:48px;font-size:19px;padding:6px 4px;letter-spacing:.06em}
 #titleScreen .codex-title-menu .story{font-size:13px;padding:6px 4px;min-height:42px;letter-spacing:.06em}
}
@media(max-height:500px) and (min-aspect-ratio:4/5){
 #titleScreen .codex-title-brand{top:4%;left:4%;right:auto;width:clamp(230px,31vw,360px)}
 #titleScreen .codex-title-kicker{font-size:9px;margin-bottom:4px}
 #titleScreen .codex-title-english{font-size:8px;margin-top:3px}
 #titleScreen .codex-title-tagline{display:none}
 #titleScreen .codex-title-menu{width:190px;right:4%;bottom:12px;padding:0}
 #titleScreen .codex-title-menu .begin{min-height:40px;font-size:18px;padding:4px}
 #titleScreen .codex-title-menu .story{min-height:36px;font-size:12px;padding:4px}
 #titleScreen .codex-title-copyright{font-size:8px;margin-top:4px}
}
@media(prefers-reduced-motion:reduce){#titleScreen .codex-title-brand{animation:none}}
@media(max-height:360px) and (min-aspect-ratio:4/5){
 #titleScreen .codex-title-brand{width:180px;left:4%;right:auto;top:3%}
 #titleScreen .codex-title-menu .begin{min-height:36px;font-size:17px}
 #titleScreen .codex-title-menu .story{min-height:33px;font-size:11px;padding:3px 4px}
}

#titleScreen .codex-title-menu{--codex-title-action-size:21px}
#titleScreen .codex-title-menu #titleBegin,#titleScreen .codex-title-menu #titleSettingsButton{font-size:var(--codex-title-action-size);text-shadow:0 3px 6px #000e,0 1px 2px #000f,0 0 8px #0008}
@media(max-aspect-ratio:4/5){#titleScreen .codex-title-menu{--codex-title-action-size:19px}}
@media(max-height:500px) and (min-aspect-ratio:4/5){#titleScreen .codex-title-menu{--codex-title-action-size:18px}}
@media(max-height:360px) and (min-aspect-ratio:4/5){#titleScreen .codex-title-menu{--codex-title-action-size:17px}}


#titleDeleteConfirm{width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 32px);box-sizing:border-box;overflow:auto;padding:24px;border:2px solid #b99a55;border-radius:10px;background:#f5f0e4;color:#243c45;box-shadow:0 16px 60px #0008;font-family:CodexBook,serif;}
#titleDeleteConfirm::backdrop{background:#081820b8;}
#titleDeleteConfirm h2{margin:0 0 14px;font-size:22px;}
#titleDeleteConfirm p{line-height:1.7;}
.codex-reset-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px;}
.codex-reset-actions button{flex:1 1 180px;min-height:48px;white-space:normal;}
#titleScreen #titleDeleteConfirm #titleDeleteAccept{color:#fff;background:#963b32;border-color:#963b32;}