/* Card back and original PNG are separate physical layers. */
.intro-character-grid{gap:18px 12px;padding-top:12px}
.intro-character{position:relative;padding:7px 5px 9px;isolation:isolate;background:transparent;border-color:#edce8b38;border-radius:12px 12px 7px 7px}
.intro-character:before{content:"";position:absolute;inset:14px 7px 29px;border-radius:46% 46% 7px 7px;background:linear-gradient(150deg,color-mix(in srgb,var(--accent,#ffb5d8) 25%,#362330),#362330);border:1px solid #edce8b24;z-index:-1}
.intro-character img{width:100%;aspect-ratio:1;object-fit:contain;background:transparent;border-radius:0;transform:translateY(-4px) scale(1.08);filter:drop-shadow(0 4px 2px #160d2166);transition:transform .2s ease}
.intro-character:hover{transform:none;background:#ffe5ef08}
.intro-character:hover img,.intro-character:focus-visible img{transform:translateY(-8px) scale(1.13)}
.intro-character:focus-visible{outline:2px solid #edce8b;outline-offset:3px}
.intro-character>span{margin-top:3px;position:relative;z-index:1}
.character-tilt-stage{width:min(450px,70vw,61vh)}
.character-tilt-card{aspect-ratio:.85;border:0;border-radius:0;padding:0;background:none;box-shadow:none;isolation:auto}
.character-tilt-card:before{display:none}
.character-card-back{position:absolute;inset:8% 5% 6%;border:1px solid #edce8b80;border-radius:46% 46% 14px 14px;background:linear-gradient(140deg,color-mix(in srgb,var(--accent,#ffb5d8) 32%,#362330),#362330 78%);box-shadow:0 30px 55px #09030d77,inset 0 0 0 7px #edce8b0d;transform:translateZ(-22px)}
.character-card-back:after{content:"";position:absolute;inset:12px;border:1px solid #edce8b29;border-radius:inherit}
.character-viewer-image{position:absolute;inset:-6% -8% auto;width:116%;height:92%;object-fit:contain;border-radius:0;background:none;box-shadow:none;transform:translateZ(65px);filter:drop-shadow(0 14px 7px #11081766);pointer-events:none}
.character-tilt-shine{display:none}
.character-viewer-caption{inset:auto 10% -2%;justify-content:center;align-items:center;flex-direction:column-reverse;gap:3px;padding:13px 8px;border-radius:6px;background:#362330ed;border:1px solid #edce8b38;transform:translateZ(38px);text-shadow:none}
.character-viewer-caption span{font-size:12px;letter-spacing:.03em;font-weight:500;color:#dbc5d2}
.character-viewer-caption strong{font-size:clamp(24px,4vw,36px);font-weight:800;color:#fff8f3}
.character-viewer-close:focus-visible{outline:2px solid #edce8b;outline-offset:4px}
.character-viewer-hint{letter-spacing:0}
@media(max-width:700px){.character-tilt-stage{width:min(360px,73vw,59vh)}.intro-character-grid{gap:17px 9px}.character-viewer-caption{bottom:-3%}}
@media(prefers-reduced-motion:reduce){.character-tilt-card{transform:none!important;transition:none}.intro-character img,.intro-character:hover img{transform:none;transition:none}}