/* Comic paper is the artwork, not a decorative game-window skin. */
.prologue-comic{position:absolute;inset:0;z-index:100;display:block;background:#050607;color:#e5e4df;pointer-events:auto;outline:0;isolation:isolate;padding:0;box-sizing:border-box}
/* Counter only the shared logical-stage scale: comic controls stay physically
   readable and tappable, while the native game's HUD/world scale is unchanged. */
#game .prologue-comic{inset:0 auto auto 0;width:var(--screen-width,100%);height:var(--screen-height,100%);transform:scale(var(--inverse-ui-scale,1));transform-origin:top left}
.prologue-comic header{position:absolute;top:max(8px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:2;pointer-events:none}.prologue-comic header button{pointer-events:auto}
#game .prologue-comic button{min-width:44px;min-height:36px;margin:0;padding:6px 14px;border:1px solid #4b4d4b;background:#141615;color:#e5e4df;font:13px/1.2 sans-serif;box-shadow:none;border-radius:2px;touch-action:manipulation;flex:none}
#game .prologue-comic button:hover,#game .prologue-comic button:focus-visible{border-color:#c8c6ba;background:#252823;outline:1px solid #ddd;outline-offset:2px}
#game .prologue-comic button:disabled{opacity:.3;cursor:default}
.comic-board{position:absolute;inset:0;min-width:0;min-height:0;overflow:hidden;cursor:pointer;outline:0}.comic-camera{position:absolute;inset:0}.comic-sheet{position:absolute}
.comic-cut{position:absolute;overflow:hidden;contain:paint;pointer-events:none}.comic-cut>img{position:absolute;display:block;max-width:none;pointer-events:none;object-fit:fill}
.comic-status{position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;padding:10px 14px;background:#050607;color:#ddd;font-size:14px;pointer-events:none}.comic-status:empty{display:none}
.comic-flash,.comic-shade{position:absolute;inset:0;pointer-events:none;opacity:0}.comic-flash{background:#fff}.comic-shade{background:linear-gradient(100deg,#000b,transparent 75%)}
.prologue-comic[data-effect="impact"] .comic-camera{animation:comic-impact .42s ease-out}.prologue-comic[data-effect="strike"] .comic-camera{animation:comic-strike .23s ease-out}
.prologue-comic[data-effect="impact"] .comic-flash{animation:comic-flash .55s ease-out}.prologue-comic[data-effect="prayer"] .comic-shade{animation:comic-prayer 3.2s ease-out forwards}.prologue-comic[data-effect="descent"] .comic-shade{animation:comic-prayer 4s ease-out forwards}
.prologue-comic:after{content:'';position:absolute;inset:0;background:#000;pointer-events:none;opacity:0;z-index:5;transition:opacity 1s ease}.prologue-comic.is-ending:after{opacity:1}
.comic-confirm{position:absolute;inset:0;z-index:4;background:#000e;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;align-content:center;gap:16px}.comic-confirm[hidden]{display:none}.comic-confirm p{flex-basis:100%;text-align:center;margin:0 0 8px;font-size:18px}
.prologue-active #hud,.prologue-active #touch-controls,.prologue-active .opening-guide,.prologue-active .guide-arrow,.prologue-active .opening-control-focus{visibility:hidden!important;pointer-events:none!important}
@keyframes comic-impact{0%,100%{transform:translate(0,0)}15%{transform:translate(-4px,2px)}35%{transform:translate(3px,-2px)}60%{transform:translate(-2px,1px)}}
@keyframes comic-strike{0%,100%{transform:translateX(0)}30%{transform:translateX(-3px)}65%{transform:translateX(2px)}}
@keyframes comic-flash{0%{opacity:.24}100%{opacity:0}}
@keyframes comic-prayer{from{opacity:0}to{opacity:.65}}
@media(max-height:500px){#game .prologue-comic button{min-height:40px;padding:5px 12px}}
@media(prefers-reduced-motion:reduce){.prologue-comic *{animation:none!important;transition:none!important}.prologue-comic:after{transition:none}}