.hero{position:relative;overflow:hidden;background:radial-gradient(circle at center,#0d001f,#000)}.hero::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;background-image:radial-gradient(1px 1px at 20px 30px,rgba(255,255,255,0.8) 98%,transparent 0),radial-gradient(2px 2px at 80px 80px,rgba(255,255,255,0.5) 98%,transparent 0),radial-gradient(1.5px 1.5px at 120px 40px,rgba(255,255,255,0.6) 98%,transparent 0);background-size:100px 100px;animation:drift-fast 120s linear infinite,twinkle-fast 4s ease-in-out infinite alternate}.hero::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;background-image:radial-gradient(2px 2px at 40px 60px,rgba(255,255,255,0.7) 98%,transparent 0),radial-gradient(3px 3px at 100px 20px,rgba(255,255,255,0.4) 98%,transparent 0);background-size:200px 200px;animation:drift-slow 300s linear infinite,twinkle-slow 5s ease-in-out infinite alternate}@keyframes drift-fast{from{background-position:0 0}to{background-position:-1000px 1000px}}@keyframes drift-slow{from{background-position:0 0}to{background-position:1000px -1000px}}@keyframes twinkle-fast{from{opacity:0.5}to{opacity:1}}@keyframes twinkle-slow{from{opacity:0.4}to{opacity:0.8}}.sky{position:fixed!important;top:0;left:0;width:100%;height:100vh;overflow:hidden;z-index:-1;background:#1b0f3b}.shooting-star{position:absolute;top:-10%;width:2px;height:100px;background:linear-gradient(-45deg,rgba(255,255,255,0.9) 0%,rgba(255,255,255,0) 100%);border-radius:50%;opacity:0;transform:rotate(45deg) scaleY(0);filter:drop-shadow(0 0 6px rgba(255,255,255,0.5));animation:shoot 2.5s ease-in-out infinite}.star1{animation-delay:0s;left:5%}.star2{animation-delay:1.2s;left:20%;top:-15%}@keyframes shoot{0%{opacity:0;transform:rotate(45deg) scaleY(0)}10%{opacity:1;transform:rotate(45deg) scaleY(1)}100%{opacity:0;transform:translate(600px,600px) rotate(45deg) scaleY(1)}}.flashcard{perspective:1000px;cursor:pointer;position:relative;width:300px;height:450px;margin:20px auto;border:none;background:transparent}.flashcard .front,.flashcard .back{width:100%;height:100%;transition:transform 0.6s;backface-visibility:hidden;position:absolute;top:0;left:0;display:flex;align-items:center;justify-content:center;padding:0;box-sizing:border-box;background:transparent}.flashcard .front{z-index:2}.flashcard .back{transform:rotateY(180deg)}.flashcard.flipped .front{transform:rotateY(180deg)}.flashcard.flipped .back{transform:rotateY(360deg)}.flashcard .front img:hover{box-shadow:0 0 15px rgba(255,215,0,0.6);transition:box-shadow 0.3s ease}.reset-button{display:none;margin:20px auto;padding:12px 24px;background:gold;color:navy;font-family:serif;font-size:16px;border:none;border-radius:8px;cursor:pointer;box-shadow:0 0 10px rgba(0,0,0,0.2);transition:background 0.3s ease}.card-wrapper.flipped .reset-button{display:block}