.game-board{display:grid;gap:.5rem;margin:0 auto;width:100%;max-width:400px;padding:1rem;background:white;border-radius:1rem;box-shadow:0 4px 20px -5px rgba(0,0,0,.1)}@media (min-width:640px){.game-board{gap:.75rem;padding:1.5rem}}.number-card{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:1.25rem;font-weight:700;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:white;border-radius:.75rem;cursor:pointer;border:none;box-shadow:0 4px 10px -3px rgba(99,102,241,.3);transition:all .2s ease;user-select:none}@media (min-width:640px){.number-card{font-size:1.5rem;border-radius:1rem}}.number-card:hover:not(.revealed):not(.selected):not(.wrong){transform:translateY(-2px);box-shadow:0 8px 15px -3px rgba(99,102,241,.4)}.number-card:active{transform:scale(.95)}.number-card.revealed{background:linear-gradient(135deg,#22c55e,#16a34a);box-shadow:0 4px 10px -3px rgba(34,197,94,.4)}.number-card.selected{background:linear-gradient(135deg,#a855f7,#9333ea);transform:scale(1.05);box-shadow:0 6px 15px -3px rgba(168,85,247,.5)}.number-card.wrong{background:linear-gradient(135deg,#ef4444,#dc2626);animation:wrongShake .5s ease;box-shadow:0 4px 15px -3px rgba(239,68,68,.5)}@keyframes wrongShake{0%,to{transform:translateX(0)}20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}@media (prefers-color-scheme:dark){.game-board{background:rgba(30,30,50,.8)}}