/* The opening shares the battle surface, with a transient character draft. */
html:has(body.arrival-active),body.arrival-active{overflow:hidden;height:100dvh}
body.arrival-active #battleVeil .battle-modal{position:relative;width:100vw;height:100dvh;max-height:100dvh;padding:0;overflow:hidden}
body.arrival-active #battleVeil #battleBoard.arrival-board{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;min-height:0;background:#141d24;border:0;overflow:hidden}
.arrival-canvas{display:block;width:100%;height:100%;touch-action:none}
body.arrival-active #battleVeil #battleCommandBar.arrival-hud{position:absolute;inset:0;display:block;width:100%;height:100%;max-height:none;overflow:visible;padding:0;background:transparent;pointer-events:none;transform:none}
.arrival-vitals{position:absolute;top:calc(env(safe-area-inset-top) + 16px);left:calc(env(safe-area-inset-left) + 18px);display:grid;gap:5px;width:min(260px,45vw);padding:10px 14px;border:1px solid #b69d69aa;border-radius:8px;background:#112430d9;color:#fff2ce;font:600 13px system-ui}
.arrival-hp-track{display:block;height:8px;border-radius:3px;background:#07121d;overflow:hidden}.arrival-hp-track i{display:block;height:100%;background:linear-gradient(90deg,#982d31,#df6053)}
.arrival-vitals [data-arrival-distance]:empty{display:none}
.arrival-callout{position:absolute;top:24%;left:50%;transform:translateX(-50%);max-width:80%;padding:10px 18px;border-radius:8px;background:#0e1a27da;color:#ffe7ac;font:600 clamp(13px,2vw,20px)/1.5 system-ui;text-align:center}.arrival-callout:empty{display:none}
.arrival-scene-caption{position:absolute;bottom:calc(env(safe-area-inset-bottom) + 8%);left:12%;right:12%;text-align:center;color:#f7e9ce;text-shadow:0 2px 5px #000,0 0 12px #000;font:600 clamp(16px,2vw,27px)/1.6 system-ui;letter-spacing:.04em}.arrival-scene-caption:empty{display:none}
.arrival-board::after{content:'';position:absolute;inset:0;pointer-events:none;background:#000;opacity:0;transition:opacity .8s;z-index:600}.arrival-board.arrival-fade::after,.arrival-board.arrival-blackout::after{opacity:1}
body.arrival-active:has(.arena-intro-active) .arrival-vitals{display:none}
.tutorial-black-dialogue{background:#000!important;backdrop-filter:none}
.tutorial-overlay .tutorial-choices{display:flex;flex-direction:column;gap:8px;align-items:stretch;max-height:54dvh;overflow:auto;margin-top:12px}
.tutorial-overlay .tutorial-choices button{display:flex;align-items:center;gap:12px;width:100%;min-width:0;text-align:left;white-space:normal;padding:7px 0;line-height:1.45;background:transparent;border:0;border-radius:0;box-shadow:none;color:var(--text,#ece9df);font:inherit;cursor:pointer;outline:none}
.tutorial-overlay .tutorial-choices button:hover,.tutorial-overlay .tutorial-choices button:focus-visible,.tutorial-overlay .tutorial-choices button:active{background:transparent;border:0;box-shadow:none;transform:none;color:var(--text,#ece9df)}
.tutorial-overlay .tutorial-choices button>span,.tutorial-overlay .tutorial-choices button:focus-visible>span{text-decoration:none}
.tutorial-choices kbd{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border:1px solid #d6bf8b;border-bottom-width:3px;border-radius:5px;background:linear-gradient(#425661,#1b303f);color:inherit;font:700 17px system-ui;box-shadow:inset 0 1px #ffffff24}
.tutorial-choices button>span{min-width:0;overflow-wrap:anywhere}
.tutorial-dialogue-box:has(.tutorial-choices){padding-bottom:18px;max-height:calc(100dvh - 28px);overflow:auto}
html.mobile-combat-device .tutorial-dialogue-box:has(.tutorial-choices){padding:10px 16px;bottom:calc(env(safe-area-inset-bottom) + 10px)}
html.mobile-combat-device .tutorial-choices{gap:5px;max-height:63dvh;margin-top:6px}
html.mobile-combat-device .tutorial-choices button{min-height:36px;padding:5px 0;font-size:14px;gap:9px}
html.mobile-combat-device .tutorial-choices kbd{flex-basis:25px;width:25px;height:25px;font-size:14px}