/* Keep the approved portrait composition fitted to its own frame, even on tall desktop panels. */
/* Retain the driving viewport during the dissolve; fit the full art inside it. */
#ending{position:absolute;inset:0;z-index:4;pointer-events:none;display:none}
#ending.active{display:block}
#ending-canvas{display:block;width:100%;height:100%}
#ending-skip{position:absolute;top:calc(16px + env(safe-area-inset-top));right:16px;pointer-events:auto;padding:10px 14px;min-height:44px;border:1px solid #ffe1b088;background:#102438bb;color:#fff0d4;border-radius:6px;font-size:13px}
#ending-caption{position:absolute;top:calc(75px + env(safe-area-inset-top));left:20px;right:20px;text-align:center;font-size:15px;color:#fff0d4;text-shadow:0 2px 4px #102438}
#ending-finish{position:absolute;top:25%;left:0;right:0;text-align:center;font:italic 900 44px monospace;color:#ffe1b0;text-shadow:3px 3px #102438;letter-spacing:2px}
.ending-result #result-screen{z-index:5;background:transparent;backdrop-filter:none;justify-content:flex-start;padding-top:calc(26px + env(safe-area-inset-top));pointer-events:none}
.ending-result #result-screen{color:#fff4df;text-shadow:0 1px 3px #452f38,0 2px 10px #452f3899;animation:ending-results-in .5s ease-out both}
@keyframes ending-results-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ending-result #result-screen{animation:none}}
.ending-result #result-screen h2{font-size:26px;margin:8px 0}
.ending-result #result-screen p{font-size:12px;line-height:1.5;margin:0 0 12px}
.ending-result #result-screen button{width:auto;min-height:44px;align-self:flex-start;padding:9px 18px;margin:0;pointer-events:auto}
#ending-preview{pointer-events:auto;margin-top:8px;background:transparent;color:#ffe1b0;border:1px solid #ffe1b055;border-radius:4px;min-height:36px;padding:6px 12px;font-size:12px}

#ending.active #ending-skip{animation:ending-results-in 1s 2s both}