.flashcard-container{perspective:1200px}.flashcard{transform-style:preserve-3d;border-radius:20px;transition:transform .6s cubic-bezier(.4,0,.2,1)}.flashcard.flip{transform:rotateY(180deg)}.side{backface-visibility:hidden;text-align:center;border-radius:20px;justify-content:center;align-items:center;width:100%;height:100%;padding:24px;font-size:18px;font-weight:600;line-height:1.5;transition:all .3s ease-in-out;display:flex;position:absolute}.front{color:#fff;background:linear-gradient(135deg,#9333eae6,#db2777e6);border:1px solid #fff3;box-shadow:0 8px 32px #9333ea4d,inset 0 1px #fff3}.back{color:#fff;background:linear-gradient(135deg,#06b6d4e6,#22d3eee6);border:1px solid #fff3;transform:rotateY(180deg);box-shadow:0 8px 32px #06b6d44d,inset 0 1px #fff3}.buttons{justify-content:center;gap:12px;width:100%;max-width:400px;margin-top:20px;display:flex}.prev-next-button{cursor:pointer;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-size:14px;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.prev-next-button:hover{background:#9333ea4d;border-color:#9333ea80;transform:translateY(-2px);box-shadow:0 4px 20px #9333ea4d}.prev-next-button:active{transform:translateY(0)}.progress-container{background:#ffffff1a;border-radius:999px;width:100%;max-width:400px;height:6px;margin:20px auto;overflow:hidden}.progress-bar{background:linear-gradient(90deg,#9333ea,#db2777,#06b6d4);border-radius:999px;height:100%;transition:width .4s cubic-bezier(.4,0,.2,1)}.flashcard-input{text-align:center;color:#fff;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:10px;width:60px;padding:8px 12px;font-size:16px;font-weight:600;transition:all .3s}.flashcard-input:focus{border-color:#9333ea80;outline:none;box-shadow:0 0 0 3px #9333ea33}.flashcard-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.flashcard-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.flashcard-input[type=number]{-moz-appearance:textfield}
