/* Full drawings share a height and baseline, while each keeps its own ratio. */
.pocket-world-actors{container-type:size}
.pocket-world-actors>div{display:flex;align-items:flex-end;justify-content:center;width:42%;height:100%;min-width:0}
.pocket-world-actors .atlas-character{display:block;height:min(100cqh,65cqw,350px)!important;width:auto!important;max-width:none;max-height:none;aspect-ratio:var(--frame-ratio)}
/* Full standing drawings keep their native proportions and a shared baseline. */
.vn-modal .vn-actor>.atlas-character,.vn-modal:has(.vn-decision) .vn-actor>.atlas-character{height:clamp(90px,calc(100cqh - var(--dialogue-space,225px)),275px)!important;width:auto!important;max-width:none;max-height:none;aspect-ratio:var(--frame-ratio);transform:none!important}
.live-cheer .live-cheer-avatar>.atlas-character{height:200px!important;width:auto!important;max-width:none;max-height:none;aspect-ratio:var(--frame-ratio)}
/* Fit the wider protagonist first, then give both people the same photo height. */
.cheki-shot-actors .cheki-shot-actor>.atlas-character{height:min(100cqh,75cqw)!important;width:auto!important;max-width:none;max-height:none;aspect-ratio:var(--frame-ratio)}

.hangout-friends{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}.hangout-friend{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 10px;border:2px solid #8da4b3;border-radius:7px;background:#f5f7ec;color:#365872}.hangout-friend:hover{border-color:#407392;background:#e3f1ed}.hangout-friend>b{font:17px var(--pixel)}.hangout-friend>span{font-size:11px;line-height:1.7}.hangout-friend>small{font-size:11px;color:#175da6}.hangout-friend>.atlas-character{width:80px!important}.hangout-friends:has(>.hangout-friend:only-child){grid-template-columns:minmax(0,260px);justify-content:center}@media(max-width:480px){.hangout-friends{gap:6px}.hangout-friend{padding:12px 6px;gap:8px}.hangout-friend>b{font-size:13px}.hangout-friend>span,.hangout-friend>small{font-size:9px}.hangout-friend>.atlas-character{width:62px!important}}

.opening-cg-scene{background:#15233b!important}.opening-cg-scene>.scene-backdrop{object-fit:contain!important}.opening-cg-scene .vn-dialogue-window{top:auto;bottom:38px;min-height:90px;height:auto;max-height:135px;padding:20px 24px 27px}.opening-cg-scene .vn-dialogue-window>p{font-size:17px;line-height:1.6}@media(max-width:480px){.opening-cg-scene .vn-dialogue-window{bottom:32px;padding:17px 15px 26px;min-height:88px;max-height:135px}.opening-cg-scene .vn-dialogue-window>p{font-size:13px}}@media(max-height:450px) and (min-width:600px){.opening-cg-scene .vn-dialogue-window{left:5%;right:5%;min-height:54px;max-height:80px;bottom:25px;padding:13px 15px 18px}.opening-cg-scene .vn-dialogue-window>p{font-size:11px}}
/* Keep all four social values readable within the top status strip. */
.hud-social{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;min-width:0}.hud-social>span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;font-size:8px;white-space:nowrap}.hud-social b{font-size:13px}

/* Portrait phones: full drawings stand behind the lower dialogue row. */
@media(max-width:599px){
 .vn-modal .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene){display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:48px minmax(64px,1fr) clamp(126px,21dvh,168px) 28px;--dialogue-space:0px}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene)>.vn-toolbar{position:relative;inset:auto;grid-area:1/1;min-height:0;padding:6px 8px;align-items:flex-start}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene)>.vn-cast{position:relative;inset:auto;grid-area:2/1/4/2;min-height:0;container-type:size;overflow:hidden}
 .vn-modal .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene) .vn-actor{bottom:0;height:100%;width:calc(100% / var(--cast-count));justify-content:flex-end}
 .vn-modal .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene) .vn-actor>.atlas-character{height:min(100cqh,calc(145cqw / var(--cast-count)))!important;width:auto!important;transform:none!important}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene)>.vn-dialogue-window{position:relative;inset:auto;grid-area:3/1;min-height:0;height:auto;max-height:none;margin:10px 8px 5px;padding:18px 12px 25px;border-radius:5px;overflow:visible}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene)>.vn-dialogue-window>p{font-size:12px;line-height:1.65;letter-spacing:0;height:100%;overflow:auto;overscroll-behavior:contain}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene) .vn-speaker{font-size:10px;top:-12px;padding:3px 10px;min-width:90px;left:10px}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene) .vn-next{font-size:9px;bottom:4px}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene) .vn-read-complete{font-size:8px;bottom:5px}
 .vn-scene:not(.opening-cg-scene):not(.ending-cg-scene)>.vn-status{position:relative;inset:auto;grid-area:4/1;min-height:0;padding:4px 6px}
}
@media(max-width:599px){
 .vn-modal,.outcome-modal.vn-modal{--result-window-height:clamp(150px,25dvh,200px)}
 .vn-modal>.vn-decision{flex-basis:var(--result-window-height);height:var(--result-window-height);min-height:var(--result-window-height);max-height:var(--result-window-height)}
}

/* Work performance stays visible at the upper right, including portrait phones. */
.hud-life{position:relative;padding-top:23px}
.hud-work-attitude{position:absolute;right:0;top:0;display:flex;align-items:center;gap:5px;padding:2px 6px;border:1px solid #8fa6b4;border-radius:3px;background:#edf3ec;color:#365773;font:9px var(--font);white-space:nowrap}
.hud-work-attitude>b{font:13px var(--pixel);color:#3b617d}
@media(max-width:820px){.hud-life{padding-top:22px}.hud-work-attitude{right:0;top:2px;font-size:8px}.hud-work-attitude>b{font-size:12px}}