/* v76: one type style and shared fitted size across the three sample cards. */
.welcome-art{container-type:inline-size}
.welcome .welcome-card-text{height:11%;display:flex;flex-direction:column;justify-content:center;overflow:hidden;overflow-wrap:normal;word-break:normal;font:700 clamp(6px,1.8cqw,15px)/1.25 Georgia,serif;padding:2px}
.welcome-card-text.card-text-left,.welcome-card-text.card-text-right{height:10%}
/* The middle card covers the left part of the right card: reserve that space. */
.welcome-card-text.card-text-right{right:21%;width:14%;height:8%;padding:0}
.welcome-card-text span{flex:none}
.welcome-play.welcome-new{background:#0c3c2edb;color:#fff4dc;border-color:#e8cc8a;box-shadow:none;min-height:42px;font-size:.9rem}
.welcome-play.hidden{display:none!important}
.offline-status{min-height:1.2em;margin:8px 0 0;font:12px/1.3 system-ui,sans-serif;color:#e5d4aa;text-wrap:balance}
.welcome:has(#welcomeContinue:not(.hidden)) .welcome-copy{display:none}
.welcome:has(#welcomeContinue:not(.hidden)) .welcome-play{min-height:46px;margin-top:7px}
.game-dialog{width:min(92vw,440px);max-height:88dvh;overflow:auto;padding:26px 22px;border:1px solid #e2bf76;border-radius:22px;background:linear-gradient(145deg,#245c46,#10372d);color:#fff4da;box-shadow:0 20px 70px #00190ecc;text-align:center}
.game-dialog::backdrop{background:#001e17bb;backdrop-filter:blur(5px)}
.game-dialog h2{font:700 1.5rem/1.3 Georgia,serif;margin:0 0 18px}
.game-dialog p{font:1rem/1.5 system-ui,sans-serif}
#completionCount{font:700 2rem Georgia,serif;color:#ffe1a1}
.dialog-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.dialog-actions button{flex:1 1 130px;min-height:48px;padding:10px 14px;border:1px solid #e4c184;border-radius:12px;background:#f3d698;color:#164633;font:700 1rem/1.3 system-ui,sans-serif}
.dialog-actions button:focus-visible{outline:3px solid white;outline-offset:4px}
#game .status.save-warning{clip-path:none;position:fixed;left:12px;right:12px;bottom:0;width:auto;height:auto;z-index:20;background:#6b321e;color:white;padding:8px;font:14px/1.3 system-ui,sans-serif;text-align:center}
@media(max-height:700px){.welcome-content h2{font-size:1.35rem;margin-bottom:5px}.welcome-content .welcome-play,.welcome-content .welcome-rules,.welcome:has(#welcomeContinue:not(.hidden)) .welcome-play{min-height:40px;margin-top:6px}.welcome-privacy{min-height:32px;margin-top:1px;font-size:.75rem}.offline-status{font-size:11px;margin-top:6px}}
/* Wider windows preserve the portrait image and overlay coordinate system. */
@media(min-aspect-ratio:3/4){
 .welcome{--welcome-art-width:min(100vw,520px,calc(max(100dvh,780px) * 841 / 1870));overflow-y:auto}
 .welcome-art{width:var(--welcome-art-width);height:calc(var(--welcome-art-width) * 1870 / 841);top:0;bottom:auto}
 .welcome-content{position:relative;left:auto;right:auto;bottom:auto;margin:calc(var(--welcome-art-width) * 1870 / 841 * .47 - 46px) auto 24px;width:min(calc(var(--welcome-art-width) * .84),420px)}
 .welcome-top{position:relative;left:auto;right:auto;top:16px;width:calc(var(--welcome-art-width) * .84);max-width:460px;margin:0 auto}
 .welcome:before{position:absolute;min-height:780px;background:linear-gradient(180deg,#072e2660,transparent 25%,#061b1799 100%)}
 .welcome-card-text{top:35.8%}.card-text-center{top:34.4%}
}

/* Transparent publisher mark; frame the supplied artwork without a background. */
.publisher-mark{display:block;position:relative;width:138px;height:84px;overflow:hidden;flex:none}
.publisher-mark img{display:block;position:absolute;width:160px;height:160px;max-width:none;left:-11px;top:-40px}
.game-credits .publisher-mark{margin:0 auto 20px}
