.game-finale{--finale-accent:#9a640c;display:grid;grid-template-columns:auto minmax(0,1fr);gap:1rem;padding:1.4rem;margin:1.5rem 0;border:2px solid var(--finale-accent);border-radius:10px;background:var(--paper,#faf7ee);color:var(--ink,#263b36);box-shadow:0 6px 0 #0000000c;overflow:hidden}
/* Recommendations belong below both columns, not in the icon column. */
.game-finale > .finale-related{grid-column:1/-1;min-width:0}
.finale-summary{min-width:0}
.game-finale[hidden]{display:none}.game-finale[data-outcome=loss]{--finale-accent:#526c77}.game-finale[data-outcome=draw]{--finale-accent:#746585}.game-finale[data-outcome=stopped]{--finale-accent:#627566}.game-finale[data-outcome=complete]{--finale-accent:#37745e}
.game-finale h2{font-size:clamp(1.3rem,4vw,1.9rem);margin:.25rem 0;line-height:1.35;overflow-wrap:anywhere}.game-finale p{margin:.4rem 0;line-height:1.65}.finale-eyebrow{font-size:.68rem;letter-spacing:.2em;color:var(--finale-accent);font-weight:bold}.finale-seal{display:grid;place-items:center;width:3.5rem;height:3.5rem;border:2px double var(--finale-accent);border-radius:50%;font-size:2rem;color:var(--finale-accent)}.finale-detail{font-variant-numeric:tabular-nums;font-weight:bold}.finale-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.6rem}.finale-actions button{min-height:44px}.finale-actions button:focus-visible{outline:3px solid var(--finale-accent);outline-offset:4px}
.finale-toast{position:fixed;top:25%;left:50%;width:min(88vw,390px);box-sizing:border-box;transform:translateX(-50%);z-index:80;pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:1.5rem;border:2px solid #ad791c;border-radius:14px;background:#faf4e8f5;color:#263b36;box-shadow:0 12px 45px #20363535;text-align:center;overflow:hidden;animation:finale-appear 2s ease both}.finale-toast strong{font-size:clamp(1.4rem,6vw,2.3rem);line-height:1.3;position:relative;z-index:2}.finale-toast-seal{font-size:3.2rem;line-height:1.2;color:#a16e19;animation:finale-seal .75s ease-out both}.finale-toast[data-outcome=loss]{border-color:#526c77}.finale-toast[data-outcome=draw]{border-color:#746585}.finale-toast[data-outcome=stopped]{border-color:#627566}.finale-toast[data-outcome=loss] .finale-toast-seal{color:#526c77}.finale-toast[data-outcome=draw] .finale-toast-seal{color:#746585}.finale-toast[data-outcome=stopped] .finale-toast-seal{color:#627566}
.finale-particle{position:absolute;top:-15px;left:var(--x);width:6px;height:11px;background:#c99331;animation:finale-fall 1.5s calc(var(--i)*.025s) ease-in both}.finale-particle:nth-child(3n){background:#648b72}.finale-particle:nth-child(3n+1){background:#ac6554}
@keyframes finale-appear{0%{opacity:0;transform:translate(-50%,18px) scale(.96)}15%,76%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-8px)}}
@keyframes finale-seal{0%{transform:scale(.7) rotate(-12deg)}65%{transform:scale(1.08) rotate(3deg)}100%{transform:scale(1) rotate(0)}}
@keyframes finale-fall{0%{opacity:0;transform:translateY(0) rotate(0)}15%{opacity:.85}100%{opacity:0;transform:translateY(210px) rotate(calc(var(--turn)*240deg))}}
.reduce-motion .finale-toast *{animation:none!important}.reduce-motion .game-finale *{animation:none!important}
@media(prefers-reduced-motion:reduce){.finale-toast *{animation:none!important}.game-finale *{animation:none!important}}
@media(max-width:420px){.game-finale{padding:1rem;gap:.7rem}.finale-seal{width:2.8rem;height:2.8rem;font-size:1.65rem}.finale-actions button{flex:1 1 auto}}

/* The result remains until the player chooses an action. */
.finale-toast{position:fixed;inset:0;margin:auto;transform:none;pointer-events:auto;max-height:85dvh;overflow:auto;animation:finale-dialog-in .22s ease-out both;padding:1.5rem;display:block}.finale-toast:not([open]){display:none}.finale-toast::backdrop{background:#102b2866}.finale-toast h2{font-size:clamp(1.4rem,6vw,2.3rem);margin:.5rem 0 1rem}.finale-toast .finale-actions{position:relative;z-index:2;display:grid;gap:.6rem}.finale-toast .btn{min-height:44px;text-decoration:none}.finale-particle{pointer-events:none}.finale-toast-seal{display:block}@keyframes finale-dialog-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.finale-toast{animation:none}}.reduce-motion .finale-toast{animation:none}

.finale-dismiss{position:absolute;right:6px;top:6px;width:44px;height:44px;border:0;background:transparent;color:inherit;font-size:30px;line-height:1;z-index:4;cursor:pointer}.finale-dismiss:hover{background:#ffffff66}.finale-toast h2{padding-inline:20px}

.ending-root{position:relative}.scene-ending{position:absolute;z-index:12;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;padding:10px 18px;border:2px solid #fff5d5;border-radius:12px;background:#2c654eef;color:#fff9e7;box-shadow:0 5px 18px #173a3466;pointer-events:none;max-width:90%;text-align:center;font-size:clamp(18px,4vw,26px);white-space:normal}.scene-ending-icon{font-size:1.4em}.scene-ending[data-scene-ending=loss]{background:#934f45ef}.scene-ending[data-scene-ending=draw],.scene-ending[data-scene-ending=stopped]{background:#596975ef}.scene-ending[data-animated=true]{animation:scene-arrive .5s ease-out both}.ending-board-animate[data-scene-result=clear],.ending-board-animate[data-scene-result=win]{animation:board-glow .9s ease-out}.ending-board-animate[data-scene-result=loss]{animation:board-hit .4s ease-out}.runner-knockout{transform-box:fill-box;transform-origin:center bottom;animation:runner-fall .65s ease-out forwards}.runner-finish{transform-box:fill-box;transform-origin:center bottom;animation:runner-cheer .8s ease-out}.runner-pit{animation:runner-drop .65s ease-in forwards}.finish-star{fill:#dbb451;stroke:#fff5c9;stroke-width:1}.defeat-mark{fill:#914b3c;stroke:#fff7df;stroke-width:1}.brick-goal{position:absolute;inset:15% 10% auto;width:80%;height:45%;pointer-events:none}.brick-lost-ball{position:absolute;left:50%;bottom:2%;width:22px;height:22px;border-radius:50%;background:#dcc685;box-shadow:0 0 0 8px #ad685844;animation:lost-ball .7s ease-out forwards}.snake-crash{transform-box:fill-box;transform-origin:center;animation:board-hit .4s ease-out}.goal-flag{color:#987d2b;font-weight:bold}.ending-board[data-scene-result=clear] [data-flow=true]{filter:drop-shadow(0 0 3px #ddc268)}
@keyframes scene-arrive{from{opacity:0;translate:0 8px;scale:.85}to{opacity:1;translate:0 0;scale:1}}@keyframes board-glow{0%,100%{filter:none}45%{filter:drop-shadow(0 0 9px #d9b966)}}@keyframes board-hit{0%,100%{translate:0}25%{translate:-5px 0}65%{translate:4px 0}}@keyframes runner-fall{to{transform:translateY(8px) rotate(-72deg)}}@keyframes runner-drop{to{transform:translateY(45px) rotate(28deg);opacity:.3}}@keyframes runner-cheer{35%{transform:translateY(-13px)}70%{transform:translateY(0)}85%{transform:translateY(-4px)}}@keyframes lost-ball{to{translate:0 15px;opacity:.35}}
@media(prefers-reduced-motion:reduce){.scene-ending,.ending-board-animate,.runner-knockout,.runner-finish,.runner-pit,.brick-lost-ball,.snake-crash{animation:none!important}}.reduce-motion .scene-ending,.reduce-motion .ending-board-animate,.reduce-motion .runner-knockout,.reduce-motion .runner-finish,.reduce-motion .runner-pit,.reduce-motion .brick-lost-ball,.reduce-motion .snake-crash{animation:none!important}

svg .pipe-water{stroke:#eedb87;stroke-width:3;stroke-dasharray:8 12;animation:pipe-flow 1s linear both}@keyframes pipe-flow{from{stroke-dashoffset:60;opacity:.3}to{stroke-dashoffset:0;opacity:1}}@media(prefers-reduced-motion:reduce){svg .pipe-water{animation:none}}.reduce-motion svg .pipe-water{animation:none}

.runner-knockout{transform:translateY(8px) rotate(var(--runner-fall-angle,-72deg))}.runner-fall-right{--runner-fall-angle:72deg}@keyframes runner-fall{from{transform:none}to{transform:translateY(8px) rotate(var(--runner-fall-angle,-72deg))}}.runner-pit{transform:translateY(45px) rotate(28deg);opacity:.3}@keyframes runner-drop{from{transform:none;opacity:1}to{transform:translateY(45px) rotate(28deg);opacity:.3}}[data-game=pipe-connect] svg .pipe-water{stroke:#eedb87;stroke-width:3}

.scene-ending{width:max-content;box-sizing:border-box}
/* Compact pictures keep the main next/replay actions above the suggestions. */
.finale-related .related-card{display:inline-flex;vertical-align:top;flex-direction:column;width:calc(33.333% - 8px);margin:6px 4px;padding:5px;box-sizing:border-box;white-space:normal;gap:5px;font-size:12px;line-height:1.4;text-align:center}
.related-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:3px}
.more-games a{display:flex;align-items:center;gap:8px}.more-games img{width:64px;height:36px;object-fit:cover;flex-shrink:0;border-radius:3px}
