:root{--primary-color: #19e252;--background-color: #f7f7f7;--card-border: #e7e7e7;--font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;--transition-speed: .4s}*{box-sizing:border-box}body{font-family:var(--font-family);background-color:#f0f2f5;margin:0;display:flex;justify-content:center}.flashcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;width:100%;max-width:900px}.flashcard{perspective:1000px}.card-inner{position:relative;width:100%;aspect-ratio:2 / 1;border-radius:10px;box-shadow:0 6px 12px #0000001a;background-color:var(--background-color);cursor:pointer;transition:transform var(--transition-speed),box-shadow var(--transition-speed);display:flex;align-items:center;justify-content:center;text-align:center;font-size:1.1rem;color:#333;-webkit-user-select:none;user-select:none;transform-style:preserve-3d}.card-inner:hover{box-shadow:0 10px 20px #00000026;transform:scale(1.02)}.selected .card-inner{border:2px solid var(--primary-color);box-shadow:0 0 15px var(--primary-color);font-weight:600;color:#19e252;background-color:#fff;transform:rotateY(180deg)}.card-front,.card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:10px;padding:1rem 1.5rem;display:flex;justify-content:center;align-items:center}.card-back{transform:rotateY(180deg);color:var(--primary-color);font-weight:700;font-size:1.2rem}.card-inner:focus{outline:3px solid var(--primary-color)}@media (max-width: 460px){.card-inner{font-size:1rem}}h1,h3{display:flex;justify-content:center}
