/* The scene, rather than the width of an image box, owns the portrait baseline. */
.story-screen{--stage-top:144px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);height:100vh;height:100svh;height:100dvh;bottom:auto}
.story-topbar{height:calc(82px + var(--safe-top));padding-top:var(--safe-top)}
.story-tools{top:calc(102px + var(--safe-top))}
.story-location{top:calc(120px + var(--safe-top))}
.story-screen .companion-portrait-frame{display:flex;align-items:flex-end;justify-content:center;top:calc(var(--stage-top) + var(--safe-top));bottom:0;right:0;width:54%;height:auto;min-width:0;max-width:none;overflow:hidden;mask-image:linear-gradient(#000 88%,transparent 100%);-webkit-mask-image:linear-gradient(#000 88%,transparent 100%)}
.story-screen .companion-portrait-frame[hidden]{display:none}
.story-screen .kai-portrait{display:block;flex:0 0 auto;width:auto;height:100%;max-width:none;max-height:none;object-fit:contain;object-position:center bottom;mask-image:none;-webkit-mask-image:none;transform-origin:50% 100%}
.story-screen .companion-portrait-frame figcaption{display:none}
.story-screen .companion-portrait-frame:after{background:linear-gradient(0deg,#0c142b70,transparent 15%)}
.story-dialogue{bottom:calc(36px + var(--safe-bottom));max-height:calc(100% - 285px - var(--safe-top) - var(--safe-bottom));width:min(660px,53%)}
.story-dialogue-text{font-size:var(--reading-size,clamp(16px,1.5vw,19px))}
.story-screen[data-speaker=facility] .story-dialogue-text{font-size:var(--reading-size,14px)}
.story-player-tag{bottom:calc(13px + var(--safe-bottom))}
.story-screen[data-scene=game] .story-dialogue{width:min(650px,62%);max-height:calc(100% - 190px - var(--safe-top) - var(--safe-bottom))}
.story-screen[data-scene=game] .companion-portrait-frame{width:39%;right:0}
.story-screen[data-scene=game] .story-dialogue-text{font-size:var(--reading-size,15px)}
.story-choice,.story-tool,.story-settings summary,.story-next,.story-replay{touch-action:manipulation}
.story-tool,.story-settings summary{min-height:40px}
.story-tools{flex-wrap:wrap;justify-content:flex-end;max-width:calc(100% - 32px)}
.story-settings .reading-control{margin-top:17px;border-top:1px solid #ffffff20;padding-top:15px}
.story-settings .reading-control label{display:flex;justify-content:space-between;align-items:center}
.story-settings .reading-control output{color:var(--rose);font:10px var(--mono)}
.cast-memory{display:block;margin-top:12px;padding-top:10px;border-top:1px solid #ffffff19;color:#d8bdc8;font:11px/1.65 var(--serif)}
.story-save-dialog{width:min(700px,94vw);max-height:88dvh;overflow:auto;background:#142030;color:#e4dce4;border:1px solid #d3b6c044;border-radius:9px;padding:27px}
.story-save-dialog::backdrop{background:#030914bd}.story-save-dialog h2{font:31px var(--serif);font-weight:400;margin:8px 0}
.save-intro,.save-status{font:12px/1.8 Arial,sans-serif;color:#bdc4d1}.save-status{min-height:22px;color:#dfbac7}
.save-slots{display:grid;gap:12px;margin:20px 0}.save-slot{display:flex;align-items:center;justify-content:space-between;gap:15px;border:1px solid #ffffff21;border-radius:6px;padding:16px;background:#1b293a}
.save-slot h3{font:21px var(--serif);font-weight:400;margin:0 0 6px}.save-slot p{font:10px/1.7 var(--mono);color:#aebdce;margin:0}.save-slot>div:last-child,.save-actions{display:flex;gap:8px;flex-wrap:wrap}.save-actions{margin-top:18px;align-items:center}
.save-actions label{cursor:pointer;display:inline-flex;align-items:center;position:relative;overflow:hidden}.save-actions input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}.story-save-dialog>.story-tool{white-space:normal;text-align:left}
@media(max-width:600px){.story-save-dialog{padding:20px}.save-slot{align-items:flex-start;flex-direction:column;padding:13px}.save-slot>div:last-child{width:100%}.save-actions{align-items:stretch;flex-direction:column}.save-actions>button,.save-actions>label{width:100%;justify-content:center;text-align:center}.story-save-dialog h2{font-size:27px}}
.story-screen[data-scene=choice] .story-dialogue{max-height:calc(100% - 220px - var(--safe-top) - var(--safe-bottom))}
@media(min-width:1500px){.story-screen{--stage-top:154px}.story-screen .companion-portrait-frame{right:3%;width:50%}.story-dialogue{width:min(740px,50%);bottom:calc(45px + var(--safe-bottom))}}
@media(min-width:601px) and (max-width:1100px) and (orientation:portrait){
 .story-screen{--stage-top:160px}
 .story-screen .companion-portrait-frame{right:0;width:100%}
 .story-location{top:calc(154px + var(--safe-top));max-width:210px;left:24px}
 .story-location h2{font-size:28px}
 .story-dialogue,.story-screen[data-scene=choice] .story-dialogue,.story-screen[data-scene=end] .story-dialogue{left:20px;width:calc(100% - 40px);max-height:48%;padding:23px 25px;bottom:calc(32px + var(--safe-bottom))}
 .story-screen[data-scene=game] .story-dialogue{width:calc(100% - 40px);max-height:calc(100% - 190px - var(--safe-top) - var(--safe-bottom))}
 .story-screen[data-scene=game] .companion-portrait-frame{display:none}
 .story-screen[data-scene=game] .story-location{display:none}
 .story-choice{min-height:60px}
}
@media(max-width:600px){
 .story-screen{--stage-top:142px}
 .story-topbar{height:calc(66px + var(--safe-top));padding-inline:max(16px,env(safe-area-inset-left,0px))}
 .story-tools{top:calc(77px + var(--safe-top));left:12px;right:12px;max-width:none;gap:5px}
 .story-tools>.story-tool,.story-settings summary{font-size:8px;min-height:38px;padding:10px 9px}
 .story-location{top:calc(142px + var(--safe-top));left:18px;max-width:140px}
 .story-location h2{font-size:22px}
 .story-screen .companion-portrait-frame,.story-screen[data-scene=choice] .companion-portrait-frame,.story-screen[data-scene=end] .companion-portrait-frame{right:-12%;width:100%;top:calc(var(--stage-top) + var(--safe-top));bottom:0;height:auto;min-width:0}
 .story-dialogue,.story-screen[data-scene=choice] .story-dialogue,.story-screen[data-scene=end] .story-dialogue{left:12px;width:calc(100% - 24px);bottom:calc(29px + var(--safe-bottom));max-height:48%;padding:17px 16px 11px}
 .story-dialogue-text{font-size:var(--reading-size,16px);line-height:1.75}
 .story-screen[data-speaker=facility] .story-dialogue-text{font-size:var(--reading-size,13px)}
 .story-screen[data-scene=game] .story-dialogue{left:12px;width:calc(100% - 24px);max-height:calc(100% - 160px - var(--safe-top) - var(--safe-bottom));bottom:calc(29px + var(--safe-bottom))}
 .story-screen[data-scene=game] .companion-portrait-frame,.story-screen[data-scene=game] .story-location{display:none}
 .story-screen[data-scene=game] .story-dialogue-text{font-size:var(--reading-size,14px)}
 .story-player-tag{bottom:calc(10px + var(--safe-bottom))}
 .story-choice strong{font-size:14px}.story-choice small{font-size:10px}
 .story-dialogue-footer>span{font-size:7px}
}
@media(max-height:560px) and (orientation:landscape){
 .story-screen{--stage-top:92px}
 .story-topbar{height:calc(52px + var(--safe-top));padding-inline:16px}
 .story-tools{top:calc(62px + var(--safe-top));right:14px;gap:5px}
 .story-tools>.story-tool,.story-settings summary{font-size:8px;min-height:34px;padding:8px}
 .story-location{top:calc(68px + var(--safe-top));left:18px;max-width:230px}
 .story-location h2{font-size:21px;margin:8px 0}.story-location p{display:none}
 .story-screen .companion-portrait-frame{right:0;width:46%}
 .story-dialogue,.story-screen[data-scene=choice] .story-dialogue,.story-screen[data-scene=end] .story-dialogue{left:14px;width:60%;bottom:calc(23px + var(--safe-bottom));max-height:calc(100% - 130px - var(--safe-top) - var(--safe-bottom));padding:14px 16px 10px}
 .story-dialogue-text{font-size:var(--reading-size,14px);line-height:1.65;margin:10px 0;min-height:0}
 .story-speaker-row{padding-bottom:9px}.story-choice{padding:10px;min-height:48px}
 .story-screen[data-scene=game] .story-dialogue{width:70%;max-height:calc(100% - 135px - var(--safe-top) - var(--safe-bottom))}
 .story-screen[data-scene=game] .companion-portrait-frame{display:none}
 .story-player-tag{bottom:calc(7px + var(--safe-bottom))}
}