*{box-sizing:border-box}body{background-color:linear-gradient(180deg,#ff7654,#fed6d6);font-family:Nato Sans TC,sans-serif;margin:0;padding:15px}.card-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:0 auto;max-width:900px}.card{perspective:900px}.card-inner{cursor:pointer;height:200px;position:relative;transform-style:preserve-3d;transition:transform .6s;width:100%}.card.flipped .card-inner{transform:rotateY(180deg)}.card-back,.card-front{align-items:center;backface-visibility:hidden;background-color:repeat(auto-fit,minmax(200px,1fr));border-radius:15px;box-shadow:0 4px 10px rgba(0,0,0,.1);display:flex;flex-direction:column;height:100%;justify-content:center;padding:15px;position:absolute;width:100%}.card-front{z-index:2}.card-back{background-color:#e3f2fd;transform:rotateY(180deg)}.card-title{font-size:20px;font-weight:700;margin-bottom:12px;text-align:center}.card-front .emoji{font-size:48px;margin-bottom:12px}.card-back p{font-size:14px;margin:6px 0;text-align:center}@media (max-width:600px){.card-inner{height:320px}}