#card-flip{perspective:1400px;container-type:inline-size}
.card-flip-inner{position:relative;display:grid;transform-style:preserve-3d;transition:none}
#card-flip.is-revealed .card-flip-inner{transform:rotateY(180deg)}
#card-flip.no-flip-motion .card-flip-inner{transition:none}
#card-flip #deck-card,#card-back{grid-area:1/1;min-width:0;width:100%;box-sizing:border-box;backface-visibility:hidden;-webkit-backface-visibility:hidden}
#card-flip #deck-card{transform:rotateY(180deg);transform-origin:center;min-height:370px}
#card-flip:not(.is-revealed) #deck-card{visibility:hidden}
#card-back{display:flex;align-items:center;justify-content:center;border:1px solid #665171;border-radius:22px;background:#1b1822;color:#dfff00;padding:44px 24px;min-height:370px;cursor:pointer;transform:rotateY(0deg);text-align:center}
#card-back:hover{border-color:#b29c66;background:#1b1822}
#card-back:focus-visible{outline:3px solid #e4ccff;outline-offset:4px}
.card-back-art{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;max-width:100%;pointer-events:none}
.card-back-welcome{display:block;color:#dbb66e;font-size:clamp(9px,1.6cqw,13px);line-height:1.9}
.card-back-brand{display:block;font-size:clamp(15px,4.5cqw,42px);line-height:1.9;color:#dfff00;text-shadow:2px 2px #050407,4px 4px #050407,6px 7px #0008;letter-spacing:0;font-weight:900;white-space:nowrap}
.card-back-brand .title-subtitle{font-size:.8em;white-space:nowrap}
.card-back-brand .mage-letter,.card-back-brand .mage-letter-front,.card-back-brand .mage-peek{font-size:inherit}
#card-flip-hint{font-size:10px;line-height:1.8;text-align:center;color:#dbb66e;margin:12px 0 0}
#deck-prompt:focus{outline:none}
@media(max-width:480px){#card-back,#card-flip #deck-card{min-height:330px}#card-back{padding:30px 12px}.card-back-art{gap:22px}.card-back-brand{font-size:4.35cqw}}
/* The explicit card preference overrides the general reduced-motion rule. */
#card-flip.flip-animation-on:not(.no-flip-motion) .card-flip-inner{transition:transform 550ms cubic-bezier(.25,.7,.25,1)!important}
#card-flip.no-flip-motion .card-flip-inner{transition:none!important}
