/* v3: dialogue belongs to the same visual frame as its speaker, not a separate card stack. */
.reader{max-width:680px}
.opening{padding:54px 22px 44px}
.sequence{padding:0}
.comic-panel{position:relative;isolation:isolate;container-type:inline-size;margin:0 0 18px;scroll-margin-top:0}
.comic-panel>img{width:100%;display:block;height:auto}
.speech{--balloon:#faf8f2;position:absolute;z-index:2;left:var(--x);top:var(--y);width:var(--w);margin:0;background:var(--balloon);color:#1c2026;padding:.82em 1.16em .92em;border-radius:48% 49% 47% 48% / 44% 47% 45% 47%;font-family:var(--sans);font-size:clamp(16px,4.55cqw,26px);font-weight:500;line-height:1.5;letter-spacing:-.035em;text-align:center;word-break:keep-all;overflow-wrap:normal;text-wrap:balance;filter:drop-shadow(0 1px 1px #0005);overflow:visible}
.dialogue-copy{display:block}
.speech::after{content:"";position:absolute;width:clamp(14px,4cqw,25px);height:clamp(22px,6cqw,40px);background:var(--balloon);left:var(--pin);z-index:-1}
.speech.up::after{top:calc(clamp(22px,6cqw,40px)*-1 + 2px);clip-path:polygon(50% 0,100% 100%,0 100%);transform:skewX(-20deg)}
.speech.down::after{bottom:calc(clamp(22px,6cqw,40px)*-1 + 2px);clip-path:polygon(0 0,100% 0,65% 100%);transform:skewX(18deg)}
.speech.right::after{left:auto;right:-10px;top:24%;width:19px;height:18px;clip-path:polygon(0 0,100% 0,0 100%);transform:none}
.speech.left::after{left:-12px;top:40%;width:22px;height:18px;clip-path:polygon(0 0,100% 0,100% 100%);transform:none}
.speech.sharp{border-radius:32% 37% 30% 38% / 37% 30% 41% 34%;font-weight:650}
.speech.cold{--balloon:#eff1f2}
.speech.offscreen{border-radius:40% 44% 41% 39%}
.caption{position:absolute;z-index:1;max-width:86%;font-family:var(--serif);font-size:clamp(13px,3.6cqw,20px);line-height:1.8;color:#fff8e8;background:#0b1015d9;padding:.6em .85em;border-left:2px solid #bea381}
.caption.top-left{top:4%;left:4%}.caption.bottom-left{bottom:4%;left:4%}
.bridge-note{font-family:var(--serif);font-size:clamp(15px,3.8vw,20px);text-align:center;line-height:1.85;color:#d7d2c7;padding:24px 24px 38px}
.panel-sound{position:absolute;font-family:var(--serif);font-weight:700;line-height:1.1;text-shadow:1px 2px 5px #000}
.footsteps{top:12%;right:22%;font-size:clamp(25px,7cqw,44px);letter-spacing:.25em;color:#d7cebe;transform:rotate(-10deg)}
.gasp-in{bottom:16%;left:16%;font-size:clamp(26px,8cqw,48px);color:#f4e8dc;transform:rotate(-12deg)}
.metal-in{bottom:8%;right:14%;font-size:clamp(28px,8cqw,48px)}
.reaction-strip{aspect-ratio:1.55;overflow:visible}
.reaction-strip>img{height:100%;object-fit:cover;object-position:center 41%}
.assessment-strip{aspect-ratio:1;overflow:visible}
.assessment-strip>img{height:100%;object-fit:cover;object-position:center 38%}
.master-response{aspect-ratio:1.08;overflow:hidden}
.master-response>img{position:absolute;left:-70%;top:-5%;width:170%;max-width:none;height:auto}
.stake-dialogue{aspect-ratio:1;overflow:hidden}
.stake-dialogue>img{height:auto}
.quiet-beat{font-family:var(--serif);font-size:18px;color:#b9b8b5;text-align:center;padding:38px 20px 60px}
.curse-in{position:absolute;left:4%;right:4%;bottom:6%;text-align:center;font-family:var(--serif);font-size:clamp(21px,5.6cqw,36px);line-height:1.85;color:#ffede0;text-shadow:0 2px 5px #000,0 0 15px #000}
.curse-in p+p{margin-top:1em}.curse-in strong{font-size:1.2em}
.curse-finish{text-align:center;font-family:var(--serif);font-size:clamp(26px,6vw,38px);line-height:1.9;color:#d8a28d;padding:24px 20px 50px}
.ending{padding:35px 24px 68px}
.notes{padding-top:46px}
@media(max-width:359px){.speech{font-size:16px;padding:.8em 1em .85em}.caption{font-size:13px}.comic-panel{margin-bottom:14px}}
@media print{.comic-panel{break-inside:avoid}.speech{font-size:20px}}