/* Screen assets are authored without text; labels remain accessible DOM content. */
.title-screen { background: #123d50 url('../assets/art/screens/title-phone-v1.png') center / cover; display:block; }
.title-atmosphere,.title-emblem,.title-eyebrow,.title-lead { display:none; }
.title-content { position:absolute; inset:0; width:auto; margin:0; padding:0; display:block; }
.title-content h1 { position:absolute; left:50%; top:61%; transform:translate(-50%,-50%); width:300px; height:90px; margin:0; font-size:0; background:url('../assets/art/screens/logo-odifense-v1.png') center / contain no-repeat; }
.title-action,.painted-button { color:#fff3d0; background:transparent url('../assets/art/screens/button-primary-v1.png') center / 100% 100% no-repeat; border:0; box-shadow:none; border-radius:0; font-weight:800; text-shadow:0 2px 2px #142732; }
.title-action { position:absolute; left:50%; top:77%; transform:translateX(-50%); width:230px; min-width:0; height:62px; padding:10px 25px; }
.title-action:active:not(:disabled),.painted-button:active { transform:translateX(-50%); background-image:url('../assets/art/screens/button-primary-pressed-v1.png'); box-shadow:none; }
.title-note { position:absolute; left:50%; top:calc(77% + 62px); transform:translateX(-50%); margin:4px 0; white-space:nowrap; font-size:11px; }
#title-loading { top:75%; }
.title-screen .pwa-actions { position:absolute; top:8px; right:10px; margin:0; max-width:230px; }
.chapter-screen { position:fixed; inset:0; z-index:30; background:#174451 url('../assets/art/screens/chapter-map-phone-v1.png') center / 100% 100%; }
.chapter-header { position:absolute; inset:8px 12px auto; display:flex; justify-content:space-between; align-items:center; pointer-events:none; }
.chapter-header h1 { font-size:20px; margin:0; padding:7px 22px; color:#ffe3a4; background:#133340e8; border-block:1px solid #b89151; text-shadow:0 2px #06161b; }
.chapter-header button,.chapter-header span { pointer-events:auto; min-width:44px; padding:6px 12px; background:#132e39ec; border:1px solid #a78446; color:#ffe3a4; }
.chapter-header button { font-size:28px; }
.chapter-node { position:absolute; left:var(--phone-x); top:var(--phone-y); transform:translate(-50%,-50%); width:52px; height:52px; padding:0; border:0; border-radius:50%; background:transparent url('../assets/art/screens/node-open-v1.png') center / contain; box-shadow:0 2px 8px #061a2699; color:#fff3be; }
.chapter-node b { display:block; font-size:18px; text-shadow:0 2px 2px #000,1px 0 #000,-1px 0 #000; }
.chapter-node small { position:absolute; bottom:-12px; left:50%; transform:translateX(-50%); color:#ffe496; font-size:11px; white-space:nowrap; text-shadow:0 1px 3px #000; }
.chapter-node:disabled { opacity:1; background-image:url('../assets/art/screens/node-locked-v1.png'); color:#c5c0ac; }
.chapter-node:hover:not(:disabled),.chapter-node:focus-visible { outline:2px solid #ffe8a5; outline-offset:4px; }
.chapter-node:active:not(:disabled) { transform:translate(-50%,-50%) scale(.96); }
.chapter-note { position:absolute; left:50%; bottom:4px; transform:translateX(-50%); margin:0; padding:4px 16px; background:#12313cd9; color:#eee0bb; font-size:12px; white-space:nowrap; }
.result-panel { position:fixed; inset:50% auto auto 50%; transform:translate(-50%,-50%); width:min(540px,88vw); height:min(330px,90dvh); border:0; padding:78px 70px 45px; background:transparent url('../assets/art/screens/result-plate-v1.png') center / 100% 100% no-repeat; box-shadow:0 0 0 100vmax #06141dab; z-index:60; display:flex; gap:8px; align-items:center; justify-content:center; flex-direction:column; }
.result-panel[data-outcome="defeat"] { background-image:url('../assets/art/screens/result-defeat-plate-v1.png'); }
.result-panel { margin:0; overflow:visible; }
.result-panel::backdrop,.training-inner::backdrop { background:#071a24aa; }
.game-shell .training-inner { color:#f3e6ca; margin:0; }
.result-panel strong { font-size:21px; text-shadow:0 2px #071a24; }
.result-panel span { font-size:13px; color:#fff1cc; }
.result-panel button { min-height:36px; padding:4px 18px; color:#fbe8bd; border:1px solid #b9975a; background:#112f3de8; }
.result-panel > strong { position:absolute; top:34%; left:0; width:100%; text-align:center; }
.result-panel > span { position:absolute; top:59%; left:0; width:100%; text-align:center; }
.result-rating { position:absolute; left:36%; right:36%; top:42%; height:16%; display:flex; align-items:center; justify-content:space-between; }
.result-rating i { width:33%; text-align:center; font-size:40px; font-style:normal; color:#153446; -webkit-text-stroke:1px #d9b875; }
.result-rating .earned { color:#ffda62; text-shadow:0 1px 2px #694120; }
.result-panel[data-outcome='defeat'] .result-rating { display:none; }
.result-actions { position:absolute; left:5%; right:5%; top:81%; display:flex; justify-content:center; gap:8px; }
.result-actions button { font-size:13px; min-height:44px; padding:5px 12px; }
.pause-dialog { width:min(360px,84vw); max-height:88dvh; padding:28px 38px; color:#f9e9c6; border:3px ridge #be9b5b; background:linear-gradient(140deg,#224b5a,#0c2736); box-shadow:0 10px 40px #000a,inset 0 0 0 4px #102b39; }
.pause-dialog::backdrop { background:#071a24aa; }
.pause-dialog h2 { text-align:center; margin:0 0 20px; color:#f3d48e; font-size:23px; }
.pause-dialog button { display:block; width:100%; margin:8px auto; min-height:44px; border:1px solid #a78548; color:#f4e4c0; background:#163a49; }
.pause-dialog .painted-button { height:58px; border:0; background:transparent url('../assets/art/screens/button-primary-v1.png') center / 100% 100%; }
.training-settings .training-inner h2 { margin:0 0 12px; color:#f3d48e; }
.setting-toggle { display:flex; gap:10px; align-items:center; min-height:44px; font-size:16px; }
.setting-toggle span { margin-right:auto; }
.setting-toggle input { width:24px; height:24px; accent-color:#cbac67; }
.game-shell #start-button,.game-shell #early-button { background-image:url('../assets/art/hud/call-wave-v1.png'); }
.game-shell[data-hud='phone'] .deck-context.has-build { width:420px !important; }
#settings-close { width:100%; margin:10px 0; }
.game-shell .training-settings[open] .training-inner { position:fixed; left:50%; top:50%; right:auto; transform:translate(-50%,-50%); width:min(360px,84vw); max-height:86dvh; padding:20px; border:3px ridge #be9b5b; background:#153644; box-shadow:0 0 0 100vmax #071a24aa; z-index:55; }
@media (max-aspect-ratio: 31/20) {
  .title-screen { background-image:url('../assets/art/screens/title-fold-v1.png'); }
  .title-content h1 { top:53%; width:340px; height:102px; }
  .title-action { top:68%; width:280px; height:74px; }
  .title-note { top:calc(68% + 78px); }
  .chapter-screen { background-image:url('../assets/art/screens/chapter-map-fold-v1.png'); }
  .chapter-node { left:var(--fold-x); top:var(--fold-y); width:58px; height:58px; }
  .result-panel { width:min(620px,90vw); height:360px; }
}
