.prologue-scene{position:absolute;inset:0;isolation:isolate;pointer-events:auto;display:grid;grid-template-rows:auto minmax(60px,1fr) auto;overflow:hidden;background:#090d0e;color:#eee5d4;font-family:inherit}
.prologue-backdrop{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#080b0d38,#080b0d72 40%,#080b0df5 78%),url('./assets/story-embers.png') center 35%/cover no-repeat}
.prologue-scene[data-background="pilgrimage"] .prologue-backdrop{background-image:linear-gradient(180deg,#080b0d90,#080b0dbb 40%,#080b0df5 78%),url('./assets/story-pilgrimage.png')}
.prologue-scene[data-background="homecoming"] .prologue-backdrop{background-image:linear-gradient(180deg,#080b0d60,#080b0d94 40%,#080b0df5 78%),url('./assets/story-homecoming.png')}
.prologue-header{position:relative;z-index:2;background:linear-gradient(#080b0dbb,transparent);text-shadow:0 1px 5px #000;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:max(20px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) 8px max(24px,env(safe-area-inset-left))}
.prologue-header small{font-size:12px;letter-spacing:.12em;color:#bda878}.prologue-header h1{margin:5px 0;font-family:Georgia,'Noto Serif KR',serif;font-size:clamp(22px,3vw,32px);font-weight:500;line-height:1.25;color:#efe2bf;text-shadow:0 2px 8px #000}
.prologue-scene button{font:inherit;font-size:14px;line-height:1.4;min-height:44px;background:transparent;border:0;box-shadow:none;color:#d0c4ab;cursor:pointer;touch-action:manipulation;border-radius:2px;white-space:normal;overflow-wrap:anywhere}
.prologue-scene button:focus-visible{outline:2px solid #dfc78e;outline-offset:3px}.prologue-scene button:hover:not(:disabled){color:#fff1c6;background:#b9a57412}.prologue-scene button:active:not(:disabled){background:#b9a57422}.prologue-scene button:disabled{opacity:.3;cursor:default}
.prologue-skip{padding:8px 0 8px 14px;max-width:40%;flex-shrink:0}
.prologue-stage{width:min(920px,92%);min-height:0;margin:0 auto;display:flex;align-items:flex-end;justify-content:center;gap:clamp(12px,9vw,116px);direction:ltr;padding-top:10px;overflow:hidden}
.prologue-portrait{position:relative;display:flex;flex-direction:column;justify-content:flex-end;margin:0;min-width:0;width:min(290px,40%);height:100%;opacity:.45;filter:saturate(.5) brightness(.72);transition:opacity .2s ease,filter .2s ease}
.prologue-portrait.speaking{opacity:1;filter:none}.prologue-portrait canvas{display:block;object-fit:contain;object-position:bottom;max-height:100%;width:100%;height:100%;mask-image:linear-gradient(#000 80%,transparent 100%)}
.prologue-portrait figcaption{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-size:13px;color:#d5c7aa;text-shadow:0 1px 6px #000}.prologue-portrait.speaking figcaption{color:#f6e7c1}.prologue-portrait.portrait-unavailable figcaption{bottom:50%;font-size:20px}
.prologue-conversation{width:min(940px,100%);justify-self:center;position:relative;padding:20px max(28px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left));background:linear-gradient(90deg,#0c1119e0,#10141bee 40%,#0b1119e8);border-top:1px solid #b39b5d75;box-shadow:0 -24px 45px #06090b77}
.prologue-conversation:before{content:'';position:absolute;top:-2px;inset-inline-start:28px;width:70px;height:3px;background:var(--speaker-color,#ddbf85)}
.prologue-dialogue{cursor:pointer;touch-action:manipulation}.prologue-speaker{display:flex;align-items:baseline;gap:13px;flex-wrap:wrap;margin-bottom:12px}.prologue-speaker strong{font-family:Georgia,'Noto Serif KR',serif;font-size:clamp(22px,2.5vw,29px);color:var(--speaker-color,#ead6a5);font-weight:500;line-height:1.25}.prologue-speaker span{color:#a5a697;font-size:12px;letter-spacing:.04em}
#prologue-line{margin:0;min-height:3.4em;max-height:27dvh;overflow-y:auto;overscroll-behavior:contain;font-size:clamp(17px,2.2vw,22px);line-height:1.7;word-break:keep-all;overflow-wrap:break-word;color:#eee7d8;scrollbar-width:thin}
.prologue-objective{padding:10px 0 0;margin:10px 0 0;border-top:1px solid #b19b6140;color:#bfccad;font-size:14px;line-height:1.55}
.prologue-controls{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;margin-top:16px}.prologue-previous{justify-self:start;text-align:start;padding:8px 5px}.prologue-page{font:13px Georgia,serif;color:#dec99b;font-variant-numeric:tabular-nums;direction:ltr}.prologue-page i{font-style:normal;color:#798079}.prologue-scene .prologue-next{justify-self:end;color:#efdaa7;text-align:end;border-bottom:1px solid #a78b4e;padding:8px 4px;display:flex;align-items:center;gap:13px;font-size:16px}.prologue-next>span{direction:ltr;font:27px Georgia,serif;line-height:1}[dir="rtl"] .prologue-next>span{transform:scaleX(-1)}
.prologue-tap-hint{display:block;margin-top:8px;color:#7f897f;font-size:11px;text-align:center;line-height:1.4}
@media(max-width:600px){.prologue-header{padding: max(14px,env(safe-area-inset-top)) 18px 5px;gap:10px}.prologue-header small{font-size:10px}.prologue-header h1{font-size:22px}.prologue-stage{width:100%;gap:7%;padding:8px 16px 0}.prologue-portrait{width:44%;max-width:230px}.prologue-portrait figcaption{font-size:11px;bottom:6px}.prologue-conversation{padding:17px 20px max(12px,env(safe-area-inset-bottom))}.prologue-conversation:before{inset-inline-start:20px}.prologue-speaker{gap:9px;margin-bottom:10px}.prologue-speaker strong{font-size:23px}.prologue-speaker span{font-size:11px}.prologue-scene button{font-size:12px}.prologue-scene .prologue-next{font-size:14px;gap:10px}#prologue-line{font-size:17px;line-height:1.65;max-height:30dvh}.prologue-controls{margin-top:11px;gap:8px}.prologue-objective{font-size:12px}.prologue-tap-hint{font-size:10px}}
@media(max-height:480px) and (orientation:landscape){.prologue-scene{grid-template-columns:38% 62%;grid-template-rows:auto minmax(0,1fr)}.prologue-header{grid-column:1/-1;padding:8px 20px 4px}.prologue-header h1{font-size:21px;display:inline;margin-inline-start:14px}.prologue-header small{font-size:10px}.prologue-stage{grid-row:2;grid-column:1;width:100%;padding:0 5px;gap:0}.prologue-portrait{width:50%}.prologue-conversation{grid-row:2;grid-column:2;align-self:center;width:100%;padding:15px 22px;max-height:100%;overflow-y:auto}.prologue-speaker{margin-bottom:8px}.prologue-speaker strong{font-size:22px}#prologue-line{font-size:16px;line-height:1.55;max-height:29dvh;min-height:0}.prologue-objective{font-size:12px;margin-top:7px;padding-top:7px}.prologue-controls{margin-top:10px}.prologue-tap-hint{display:none}}
@media(prefers-reduced-motion:reduce){.prologue-portrait{transition:none}}
.reduced-effects .prologue-portrait{transition:none}