/* Shared story composition: artwork, a face-safe portrait, and one dialogue rail. */
#story.event-dialogue{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;display:block;background:#101715;isolation:isolate}
#story.event-dialogue::before{display:none}
#story.event-dialogue .cinematic{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;background-size:cover!important;background-position:center 35%!important;background-color:#101715}
#story.event-dialogue .cast-stage,#story.event-dialogue .call-status{display:none!important}
#story.event-dialogue .story-shade{position:absolute;inset:0;background:linear-gradient(#08130d20,#08130d08 45%,#08130d60);pointer-events:none;z-index:0}
#story.event-dialogue .story-top{position:absolute;inset:0 0 auto;padding:10px 4%;background:linear-gradient(#0c151ddd,transparent);font-size:clamp(11px,1.25cqw,16px);z-index:2}
#story.event-dialogue .dialogue-card{position:absolute!important;inset:auto 4% 3%!important;width:92%!important;max-width:none;min-height:0!important;max-height:36cqh!important;margin:0!important;padding:clamp(12px,2cqh,23px) clamp(15px,2cqw,27px)!important;display:flex!important;flex-direction:column;gap:10px;border:2px solid #b6a078;border-radius:12px;background:#15201cf5;box-shadow:none;backdrop-filter:none;overflow:auto;z-index:4;scrollbar-color:#c8aa78 #15201c;scrollbar-width:thin}
#story.event-dialogue .speaker{position:static!important;transform:none!important;display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 14px;padding:0!important;margin:0;background:none!important;border:0!important;max-width:none!important;color:#e4c58c;align-self:stretch;justify-content:flex-start;text-align:left}
#story.event-dialogue .speaker b{font-size:clamp(20px,2.1cqw,29px)}
#story.event-dialogue .speaker span{display:inline!important;width:auto!important;font-size:clamp(11px,1.15cqw,16px);color:#b9d4d4}
#story.event-dialogue #dialogueText{min-height:1.6em!important;max-width:none!important;margin:0!important;font-size:clamp(18px,2cqw,27px)!important;line-height:1.65!important;overflow-wrap:anywhere;color:#fff5e4;font-weight:500}
#story.event-dialogue .dialogue-advance-hint{margin:0;font-size:clamp(11px,1.05cqw,14px);color:#f3cf88;align-self:flex-end}
#story.event-dialogue #finalePortrait{display:block;position:absolute;inset:var(--portrait-y,7%) auto auto var(--portrait-x,4%);width:var(--portrait-w,19%);height:var(--portrait-h,40%);margin:0;z-index:3;border:3px solid #e4c58c;border-radius:12px;background:#101715;overflow:hidden;pointer-events:none;transform:none}
#story.event-dialogue #finalePortraitFace{width:100%;height:100%;aspect-ratio:auto;background-repeat:no-repeat}
/* Expression descriptions remain accessible, never painted across the face. */
#finalePortraitLabel{display:none}
#story.event-dialogue.coach-fullscreen #finalePortrait,#story.event-dialogue.coach-fullscreen .dialogue-card{display:none!important}
#story.event-dialogue .answers{margin:0;gap:8px}
#story.event-dialogue .dialogue-hint{margin:0;padding:0;border:0}
#story.event-dialogue.finale-quiz .dialogue-card{max-height:49cqh!important}
#story.event-dialogue.choice-scene .dialogue-card{max-height:47cqh!important}
#story.event-dialogue:has(#answers:not(.hidden)) .dialogue-advance-hint{display:none}
#coachEntrancePanel.portrait-dialogue #entrancePortrait{inset:var(--portrait-y,7%) auto auto var(--portrait-x,4%);height:var(--portrait-h,40%);width:var(--portrait-w,19%);transform:none;margin:0}
#coachEntrancePanel.portrait-dialogue .entrance-dialogue{max-height:36cqh;overflow:auto;padding:clamp(12px,2cqh,23px) clamp(15px,2cqw,27px);min-height:0;scrollbar-color:#c8aa78 #15201c}
#coachEntrancePanel.portrait-dialogue #entranceText{margin:10px 0;max-width:none;font-size:clamp(18px,2cqw,27px);line-height:1.65}
/* Joined companions live in one compact row below the player's top information. */
.party-hud{position:absolute;left:23px;top:130px;z-index:4;display:flex;gap:7px;pointer-events:none}
.party-hud:has(>.hidden):not(:has(>:not(.hidden))){display:none}
#partyHud .party-member{position:relative;inset:auto;display:grid;grid-template-columns:36px minmax(0,1fr);gap:2px 8px;padding:5px 8px 5px 5px;border:1px solid #b6a07888;border-radius:7px;background:#101715eb;color:#ffe6b8;max-width:190px;font-size:11px;line-height:1.3;box-shadow:none;white-space:normal}
.party-member .party-face{grid-row:1/3;width:36px;height:38px;border-radius:4px;background-color:#14201c;background-repeat:no-repeat}
#partyHud b{font-size:12px;line-height:1.25}.party-member span{color:#c9ded3;font-size:11px}
.party-face.girl{background-image:url('/assets/studio-refusal-v29.png');background-size:270% auto;background-position:52% 12%}
.party-face.aunt{background-image:url('/assets/cleaner-v31-contact-saved.png');background-size:400% auto;background-position:66% 19%}
#partyHud [data-joined="true"]{border-color:#ebc77f}
/* Full-bleed stills share the cabinet's dimensions; impact is on the artwork only. */
#specialPanel.special-panel{display:block;padding:0;gap:0}
#specialPanel .special-art{position:absolute;grid-area:auto;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;background-size:cover;background-position:center 35%;background-repeat:no-repeat}
#specialPanel.cleaner-show .special-art{position:relative;inset:0;width:100%;height:100%;max-height:none;background-size:cover;aspect-ratio:auto}
/* The unified panel is block layout: media must overlay, not follow, the full-height poster. */
#specialPanel.cleaner-show .cleaner-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:2}
#specialPanel[data-ultimate-shot] .special-art{animation:none!important;transform:translateX(var(--ultimate-shake,0px)) scale(var(--ultimate-scale,1));filter:none}
#specialPanel.linked[data-ultimate-shot] .special-art{background-position:center top;transform-origin:center top}
#specialPanel[data-ultimate-shot] .special-copy{z-index:4;bottom:3%;left:5%;width:90%;padding:0;background:none;text-shadow:2px 3px 0 #130d08,0 0 18px #000}
#specialPanel[data-ultimate-shot] .special-copy>span,#specialPanel[data-ultimate-shot] .special-copy>strong{display:none}
#specialPanel[data-ultimate-shot] .special-copy h2{color:#ffe6a6;font-family:'DFKai-SB','KaiTi',serif;font-style:italic;transform:rotate(-3deg);font-size:clamp(32px,6.5cqw,92px);margin:0}
#specialPanel[data-ultimate-shot]::before{display:block;content:'';position:absolute;inset:0;background:#ffe9b7;opacity:var(--ultimate-glow,0);pointer-events:none;z-index:3;animation:none}
#specialPanel[data-ultimate-shot='impact'] .special-focus{display:block;position:absolute;inset:20% 30%;border:3px solid #ffe0a2;border-radius:50%;opacity:var(--ultimate-glow,0);transform:scale(var(--ultimate-ring,1));z-index:3;pointer-events:none;animation:none}
#specialPanel:not(.cleaner-show)::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 20%,#ffe6ac88 46%,transparent 54%);animation:art-light-v53 .55s cubic-bezier(.16,1,.3,1) both}
#specialPanel.impact:not(.cleaner-show) .special-art{animation:art-hit-v53 .24s ease-out both}
#specialPanel .special-copy h2{font-size:clamp(32px,6cqw,86px);letter-spacing:-.035em}
#specialPanel .special-copy{margin-bottom:4%;width:75%;align-self:end}
#specialPanel:not(.cleaner-show) .special-copy{position:absolute;left:10%;bottom:5%;width:80%;margin:0;padding:14px 20px;background:#101421df}
#specialPanel .special-copy p{font-size:clamp(14px,1.6cqw,21px)}
#specialPanel .special-copy strong{font-size:clamp(22px,3cqw,42px)}
#vehicleCut .vehicle-cut-art,#vehicleCut .vehicle-cut-drift{object-fit:cover}
@keyframes art-light-v53{from{opacity:.75;transform:translateX(-70%)}to{opacity:0;transform:translateX(70%)}}
@keyframes art-hit-v53{0%{transform:translate(-7px,3px) scale(1.025);filter:brightness(1.35)}35%{transform:translate(5px,-2px) scale(1.02)}70%{transform:translate(-2px,1px) scale(1.01)}100%{transform:none;filter:none}}
@container game (max-width:700px){
 #story.event-dialogue .dialogue-card{padding:12px 14px!important;gap:7px;max-height:39cqh!important}
 #story.event-dialogue #dialogueText,#coachEntrancePanel.portrait-dialogue #entranceText{font-size:17px!important;line-height:1.55!important}
 #story.event-dialogue .speaker b{font-size:21px}
 #story.event-dialogue .speaker span{font-size:11px}
 #story.event-dialogue .dialogue-advance-hint{font-size:11px}
 #story.event-dialogue.finale-quiz .dialogue-card,#story.event-dialogue.choice-scene .dialogue-card{max-height:49cqh!important}
 .party-hud{left:12px;top:180px;gap:5px;right:12px}
 #partyHud .party-member{max-width:50%;flex:1;padding:4px;grid-template-columns:28px minmax(0,1fr);gap:2px 5px}
 .party-member .party-face{width:28px;height:32px}
 #partyHud b{font-size:11px}.party-member span{font-size:10px}
}
@container game (max-height:440px){
 #story.event-dialogue .dialogue-card{max-height:36cqh!important;padding:9px 15px!important;gap:3px}
 #story.event-dialogue #dialogueText,#coachEntrancePanel.portrait-dialogue #entranceText{font-size:16px!important;line-height:1.4!important}
 #story.event-dialogue .speaker b{font-size:18px}
 #story.event-dialogue .speaker span{font-size:11px}
 #story.event-dialogue .dialogue-advance-hint{font-size:10px}
 .party-hud{top:98px;left:18px}
 #partyHud .party-member{padding:3px 5px;grid-template-columns:27px minmax(0,1fr)}
 .party-member .party-face{width:27px;height:30px}
}
@media(prefers-reduced-motion:reduce){#specialPanel::after{display:none!important}#specialPanel .special-art{animation:none!important;transform:none!important;filter:none!important}}

#story.event-dialogue #dialogueText:focus-visible{outline:0}
#story.event-dialogue .dialogue-card:has(#dialogueText:focus-visible){border-color:#efd194}
@container game (max-width:700px){.stage:has(#partyHud>.party-member:not(.hidden)) #bossHud{top:235px;left:12%;right:12%}}

.stage:has(#partyHud>.party-member:not(.hidden)) #bossHud{left:40%}
@container game (max-width:700px){.stage:has(#partyHud>.party-member:not(.hidden)) #bossHud{left:12%}}

/* Close-ups with no face-free inset space keep the same portrait in the dialogue header. */
#story.event-dialogue.portrait-docked #dialoguePortraitDock{display:block;position:absolute;top:12px;left:14px;width:64px;height:64px}
#story.event-dialogue.portrait-docked #finalePortrait{position:relative;inset:auto;width:64px;height:64px;border-width:2px;border-radius:8px}
#story.event-dialogue.portrait-docked .speaker{padding-left:78px!important;min-height:66px;align-content:center}
