.flashcard,.nav-button{display:flex;color:#fff;cursor:pointer}.flashcard .back,.flashcard.flip{transform:rotateX(180deg)}.flashcard .front img,.image-container img{max-width:100%;max-height:100%;object-fit:contain}#counter,.header{transition:color .3s}body{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;margin:0;background-color:#000;color:#fff;font-family:'Courier New',monospace;transition:background-color .3s,color .3s}.header{font-size:24px;color:#fff;margin-bottom:20px;text-align:center}.flashcard-container{display:flex;justify-content:center;align-items:center;width:95%;max-width:750px;perspective:1000px;margin-bottom:20px}.flashcard{width:100%;height:80rem;max-height:400px;background-color:#333;justify-content:center;align-items:center;position:relative;box-shadow:0 0 17px 4px #000;transform-style:preserve-3d;transition:transform .2s;border-radius:13px 13px 0 0;border:1px solid #666}.flashcard .back,.flashcard .front{position:absolute;width:100%;height:90%;backface-visibility:hidden;justify-content:center;align-items:center;text-align:center;padding:0 20px;box-sizing:border-box;overflow-y:auto;word-wrap:break-word;line-height:1.4;scrollbar-width:thin;scrollbar-color:#888 transparent}.flashcard .front{font-size:40px}.flashcard .back{font-size:50px;display:flex;font-weight:bolder}@media (max-width:768px){.flashcard{height:60rem;max-height:300px}.flashcard .front{font-size:30px}.flashcard .back{font-size:40px}}@media (max-width:480px){.flashcard{height:50rem;max-height:180px}.flashcard .front{font-size:20px}.flashcard .back{font-size:30px}}.flashcard .back::-webkit-scrollbar,.flashcard .front::-webkit-scrollbar{width:4px}.flashcard .back::-webkit-scrollbar-thumb,.flashcard .front::-webkit-scrollbar-thumb{background-color:#888;border-radius:10px}.flashcard .back::-webkit-scrollbar-track,.flashcard .front::-webkit-scrollbar-track{background:0 0}.flashcard .front img{display:flex;margin:auto}.image-container{display:flex;justify-content:center;align-items:center;height:100%}.image-container img{display:block}.navigation{display:flex;align-items:center;gap:15px;margin-top:10px}.nav-button{width:50px;height:50px;justify-content:center;align-items:center;background:linear-gradient(145deg,#444,#666);font-size:20px;border:none;border-radius:5px;transition:transform .3s,background .3s,box-shadow .3s;box-shadow:0 5px 10px rgba(0,0,0,.15)}.shuffle-button,.toggle-theme-button{color:#fff;cursor:pointer;box-shadow:0 4px 10px rgba(0,0,0,.2)}.nav-button:hover{background:linear-gradient(145deg,#333,#555);box-shadow:0 8px 16px rgba(0,0,0,.3);transform:scale(1.1)}#counter{color:#fff;font-size:20px;font-weight:700}.shuffle-button{background-color:#000;border:.5px solid #444;border-radius:5px;transition:background-color .3s;margin-left:15px}.shuffle-button.active,.toggle-theme-button{background-color:#444}.shuffle-button svg,.toggle-theme-button svg{width:45px;height:45px}.toggle-theme-button{border:.5px solid #666;border-radius:5px;transition:background-color .3s,color .3s}.light-theme{background-color:#f0f0f0;color:#000}.light-theme .shuffle-button.active{background-color:#575757}.light-theme .flashcard{background-color:#fff;color:#000;border:1px solid #ddd}.light-theme .nav-button,.light-theme .shuffle-button,.light-theme .toggle-theme-button{background-color:#e0e0e0;color:#333;border:.5px solid #aaa}.light-theme #counter,.light-theme .header{color:#000}