.gcard{perspective:1100px;border-radius:1rem;display:grid}.gcard-inner{transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.7,.2,1);display:grid;position:relative}.gcard-face{backface-visibility:hidden;grid-area:1/1}.gcard-front{position:relative}.gcard-hit{cursor:pointer;background:0 0;border-radius:1rem;position:absolute;inset:0}.gcard-hit:focus{outline:none}.gcard-back{visibility:hidden;transition:visibility 0s linear .45s;position:absolute;inset:0;transform:rotateY(180deg)}.gcard[data-flipped] .gcard-inner{transform:rotateY(180deg)}.gcard:has(:focus-visible) .gcard-inner{transform:rotateY(180deg)}.gcard[data-flipped] .gcard-back{visibility:visible;transition-delay:0s}.gcard:has(:focus-visible) .gcard-back{visibility:visible;transition-delay:0s}.gcard[data-flipped] .gcard-front{pointer-events:none}.gcard:has(:focus-visible) .gcard-front{pointer-events:none}.gcard:has(:focus-visible){outline:3px solid var(--color-orange);outline-offset:3px}@media (hover:hover) and (pointer:fine){.gcard:hover .gcard-inner{transform:rotateY(180deg)}.gcard:hover .gcard-back{visibility:visible;transition-delay:0s}.gcard:hover .gcard-front{pointer-events:none}}@media (prefers-reduced-motion:reduce){.gcard-inner,.gcard[data-flipped] .gcard-inner,.gcard:hover .gcard-inner{transition:none;transform:none!important}.gcard:has(:focus-visible) .gcard-inner{transition:none;transform:none!important}.gcard-back{transition:none;transform:none}}