/* A brief field-side voice, never a modal or an input/pause layer. */
#game-ui .character-story{position:fixed;z-index:35;left:max(24px,env(safe-area-inset-left));bottom:calc(var(--hud-height,190px) + 92px);display:flex;align-items:center;width:min(580px,calc(100vw - 48px));min-height:132px;padding:15px 42px 15px 112px;border:1px solid #bbaa795e;border-left:2px solid #ceb484;border-radius:3px;background:linear-gradient(100deg,#111e1bf5,#17241ef5);box-shadow:0 8px 28px #0006;color:#ede8d7;pointer-events:none}
#story-portrait{position:absolute;left:4px;bottom:0;width:104px;height:130px;object-fit:contain}
.story-copy{min-width:0}.story-heading{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:8px}.story-heading strong{font-family:'Noto Serif KR',serif;font-size:17px;font-weight:600;color:#edcf94}.story-heading span{font-size:12px;color:#acbaa5}.story-copy p{font-size:15px;line-height:1.65;word-break:keep-all;overflow-wrap:anywhere}
#game-ui #story-dismiss{position:absolute;top:1px;right:1px;width:40px;height:40px;display:grid;place-items:center;font-size:25px;line-height:1;color:#c6c8b2;pointer-events:auto;touch-action:manipulation}#game-ui #story-dismiss:hover{color:#ffe4aa;background:#ffffff09}
@media(max-width:760px){#game-ui .character-story{left:var(--safe-left,12px);bottom:calc(var(--hud-height,202px) + 70px);width:calc(100vw - var(--safe-left,12px) - var(--safe-right,12px));padding:13px 33px 13px 86px;min-height:128px}#story-portrait{left:0;width:84px;height:105px}.story-heading{gap:4px 7px;margin-bottom:6px}.story-heading strong{font-size:16px}.story-heading span{font-size:12px}.story-copy p{font-size:14px;line-height:1.55}#game-ui #story-dismiss{width:36px;height:40px}}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){#game-ui .character-story{left:max(12px,env(safe-area-inset-left));bottom:calc(var(--hud-height,128px) + 42px);width:min(560px,calc(100vw - max(12px,env(safe-area-inset-left)) - max(12px,env(safe-area-inset-right))));min-height:92px;padding:10px 40px 10px 82px}#story-portrait{width:78px;height:98px}.story-heading{gap:8px;margin-bottom:3px}.story-heading strong{font-size:15px}.story-copy p{font-size:14px;line-height:1.5}}
@media(prefers-reduced-motion:reduce){#game-ui .character-story{scroll-behavior:auto}}

/* V102: fine glyph-alpha waves name the decoded place, then a voice and the hunt. */
#game-ui[data-story-phase] #field{filter:blur(7px) brightness(.68);transition:filter .65s ease;pointer-events:none}
#game-ui[data-story-phase="reveal"] #field{filter:none}
#game-ui[data-story-phase]:not([data-story-phase="reveal"])>header,
#game-ui[data-story-phase]:not([data-story-phase="reveal"])>footer,
#game-ui[data-story-phase]:not([data-story-phase="reveal"])>.bottom-note,
#game-ui[data-story-phase]:not([data-story-phase="reveal"]) #journal,
#game-ui[data-story-phase]:not([data-story-phase="reveal"]) .field-top,
#game-ui[data-story-phase]:not([data-story-phase="reveal"]) .field-gold,
#game-ui[data-story-phase]:not([data-story-phase="reveal"]) .field-status-stack,
#game-ui[data-story-phase]:not([data-story-phase="reveal"]) .field-bottom{visibility:hidden;opacity:0;pointer-events:none}
#game-ui.story-hud-reveal>header,#game-ui.story-hud-reveal>footer,#game-ui.story-hud-reveal>.bottom-note,
#game-ui.story-hud-reveal .field-top,#game-ui.story-hud-reveal .field-gold,
#game-ui.story-hud-reveal .field-status-stack,#game-ui.story-hud-reveal .field-bottom{animation:story-hud-return .65s ease both;pointer-events:none}
#game-ui .character-story.story-cinematic{left:50%;bottom:max(32px,calc(env(safe-area-inset-bottom) + 22px));transform:translateX(-50%);width:min(900px,calc(100vw - 64px));min-height:180px;padding:28px 64px 28px 220px;border-color:#cfb88670;background:linear-gradient(105deg,#101b19f5,#18241df7);box-shadow:0 20px 90px #0009;pointer-events:auto;cursor:pointer;animation:story-dialogue-in .4s ease both}
#game-ui .story-cinematic #story-portrait{left:8px;bottom:0;width:194px;height:242px}
#game-ui .story-cinematic .story-heading{margin-bottom:13px;gap:14px}
#game-ui .story-cinematic .story-heading strong{font-size:21px}
#game-ui .story-cinematic .story-heading span{font-size:14px}
#game-ui .story-cinematic .story-copy p{font-size:18px;line-height:1.85}
#game-ui .story-cinematic #story-dismiss{top:8px;right:8px;width:44px;height:44px}
#game-ui[data-story-phase="dialogue-out"] .story-cinematic{animation:story-dialogue-out .28s ease both;pointer-events:none}
#story-arrival{position:fixed;z-index:34;inset:0;display:grid;place-items:center;padding:32px max(24px,env(safe-area-inset-right)) 32px max(24px,env(safe-area-inset-left));text-align:center;color:#f0dfb5;pointer-events:none}
.story-arrival-copy{position:relative;width:min(100%,1080px);font-family:'Noto Serif KR',serif;font-size:clamp(40px,7.2vw,82px);font-weight:500;line-height:1.4;letter-spacing:.08em;text-shadow:0 3px 18px #000;overflow-wrap:normal;word-break:keep-all}
.story-arrival-readable{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.story-arrival-word{display:inline-block;max-width:100%;vertical-align:top}.story-arrival-space{white-space:pre-wrap}
.story-arrival-glyph{position:relative;display:inline-block;vertical-align:top}.story-arrival-solid{display:block;opacity:0}
.story-arrival-particles{position:absolute;display:block;pointer-events:none;max-width:none;text-shadow:none}
#game-ui .story-arrival-skip{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));min-height:44px;min-width:88px;padding:10px 14px;border:1px solid #cfb88660;border-radius:3px;background:#101b19b3;color:#d5c8a8;font-size:13px;line-height:1.4;pointer-events:auto;touch-action:manipulation}
#game-ui .story-arrival-skip:hover{background:#17241ef5;color:#ffe4aa}
#auto-hunt-hint{position:absolute;right:0;bottom:calc(100% + 9px);white-space:nowrap;font-size:13px;line-height:1.5;color:#eadbb7;text-shadow:0 1px 5px #000;background:#111b19d9;border:1px solid #baa77338;border-radius:3px;padding:5px 9px;pointer-events:none;animation:story-auto-hint-pulse 1.35s ease-in-out infinite}
#game-ui .field-actions{position:relative}
#game-ui .character-story.story-boss-cue:not(.story-cinematic){animation:story-boss-cue .6s ease both}
@keyframes story-hud-return{from{opacity:0}to{opacity:1}}
@keyframes story-dialogue-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes story-dialogue-out{to{opacity:0;translate:0 8px}}
@keyframes story-auto-hint-pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes story-boss-cue{0%{opacity:0;translate:0 5px;box-shadow:0 0 26px #dbc68b38}100%{opacity:1;translate:0 0}}
@media(max-width:760px){
 #game-ui .character-story.story-cinematic{width:calc(100vw - 24px);bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));padding:20px 44px 20px 120px;min-height:172px}
 #game-ui .story-cinematic #story-portrait{left:0;width:118px;height:148px}
 #game-ui .story-cinematic .story-heading{gap:4px 8px;margin-bottom:9px}
 #game-ui .story-cinematic .story-heading strong{font-size:18px}
 #game-ui .story-cinematic .story-heading span{font-size:12px}
 #game-ui .story-cinematic .story-copy p{font-size:16px;line-height:1.7}
 #auto-hunt-hint{font-size:12px;padding:4px 7px}
}
@media(max-width:390px){#game-ui .character-story.story-cinematic{padding-left:92px;padding-right:35px}#game-ui .story-cinematic #story-portrait{width:90px;height:113px}#game-ui .story-cinematic .story-copy p{font-size:15px}}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
 #game-ui .character-story.story-cinematic{width:min(780px,calc(100vw - 32px));bottom:max(16px,calc(env(safe-area-inset-bottom) + 8px));min-height:116px;padding:16px 46px 16px 150px}
 #game-ui .story-cinematic #story-portrait{left:6px;width:132px;height:165px}
 #game-ui .story-cinematic .story-heading{margin-bottom:5px}
 #game-ui .story-cinematic .story-heading strong{font-size:18px}
 #game-ui .story-cinematic .story-copy p{font-size:16px;line-height:1.6}
}
@media(prefers-reduced-motion:reduce){
 #game-ui[data-story-phase] #field{transition:none}
 #game-ui .character-story.story-cinematic,#game-ui .character-story.story-boss-cue:not(.story-cinematic){animation:none}
 #game-ui[data-story-phase="dialogue-out"] .story-cinematic{animation:story-hud-return .08s reverse both}
 #game-ui.story-hud-reveal>header,#game-ui.story-hud-reveal>footer,#game-ui.story-hud-reveal>.bottom-note,#game-ui.story-hud-reveal .field-top,#game-ui.story-hud-reveal .field-gold,#game-ui.story-hud-reveal .field-status-stack,#game-ui.story-hud-reveal .field-bottom{animation-duration:.08s}
 #auto-hunt-hint{animation:none}
 .story-arrival-particles{display:none!important}
}

#game-ui.story-suspended #story-arrival,#game-ui.story-suspended .character-story,#game-ui.story-suspended.story-hud-reveal>header,#game-ui.story-suspended.story-hud-reveal>footer{animation-play-state:paused}
/* Existing HUD children opt into pointer events, so gate the children too. */
#game-ui[data-story-phase] .field-actions,#game-ui[data-story-phase] :is(header,footer,.field-bottom) button{pointer-events:none}

/* V101: fade the committed old field to black; lift only over decoded terrain.
   JS owns opacity so hidden tabs never complete an invisible CSS transition. */
#game-ui .story-blackout{position:fixed;z-index:36;inset:0;background:#000;opacity:1;pointer-events:auto;touch-action:none}
#game-ui .story-transition-status{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));color:#d5c8a8;font-size:13px;pointer-events:none}
#game-ui[data-map-transition] #field,#game-ui[data-map-transition] :is(header,footer,.field-bottom) button,#game-ui[data-map-transition] .field-actions{pointer-events:none}
#game-ui[data-map-transition] #battle-messages,#game-ui[data-story-phase] #battle-messages{visibility:hidden}
/* The user's pause controls remain reachable even during an asset stall. */
#game-ui #pause-overlay{z-index:40}

/* A boss line shares the field with left-side loot. Entry cinematics stay intact. */
@media(min-width:761px){#game-ui .character-story.story-boss-cue:not(.story-cinematic){left:auto;right:max(24px,env(safe-area-inset-right));width:min(580px,calc(52vw - 36px))}}
@media(max-width:760px){#game-ui .character-story.story-boss-cue:not(.story-cinematic){bottom:calc(var(--hud-height,202px) + 10px)}}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){#game-ui .character-story.story-boss-cue:not(.story-cinematic){left:auto;right:max(12px,env(safe-area-inset-right));bottom:calc(var(--hud-height,128px) + 8px);width:min(460px,calc(45vw - 32px))}}
@media(max-width:760px) and (orientation:portrait){
 #game-ui .character-story.story-boss-cue:not(.story-cinematic){min-height:0;max-height:min(180px,calc(100dvh - var(--hud-height,202px) - 220px));padding-left:86px}
 #game-ui .story-boss-cue:not(.story-cinematic) .story-copy{max-height:calc(min(180px,100dvh - var(--hud-height,202px) - 220px) - 26px);overflow-y:auto;overscroll-behavior-y:contain;pointer-events:auto;scrollbar-width:thin}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:1100px){
 #game-ui .character-story.story-boss-cue:not(.story-cinematic){padding-left:54px;padding-right:30px;min-height:0;max-height:calc(100dvh - var(--hud-height,128px) - 60px)}
 #game-ui .story-boss-cue:not(.story-cinematic) #story-portrait{left:5px;bottom:10px;width:44px;height:55px}
 #game-ui .story-boss-cue:not(.story-cinematic) .story-copy{max-height:calc(100dvh - var(--hud-height,128px) - 80px);overflow-y:auto;overscroll-behavior-y:contain;pointer-events:auto;scrollbar-width:thin}
}