body { font-family: 'Inter', sans-serif; }
.font-mono { font-family: 'Roboto Mono', monospace; }
.cursor {
    animation: blink 1s step-end infinite;
    border-left: 2px solid #facc15; margin-left: -2px;
    background-color: rgba(250, 204, 21, 0.15); border-radius: 2px;
}
@keyframes blink { from, to { border-color: transparent; } 50% { border-color: #facc15; } }
.correct { color: #4ade80; }
.incorrect {
    color: #f87171; background-color: rgba(239, 68, 68, 0.15);
    text-decoration: underline; text-decoration-color: #ef4444;
    text-decoration-thickness: 2px; border-radius: 2px;
}
#text-input::-webkit-scrollbar { display: none; }
#text-input { -ms-overflow-style: none; scrollbar-width: none; }
#source-text-container.exam-mode-1 #source-text span,
#source-text-container.exam-mode-2 #source-text span { color: transparent; }
#source-text-container.exam-mode-1 #source-text span.partial-hint { color: #4b5563; }
#source-text-container[class*="exam-mode-"] #source-text span.revealed.correct { color: #4ade80; }
#source-text-container[class*="exam-mode-"] #source-text span.revealed.incorrect { color: #f87171; background-color: rgba(239, 68, 68, 0.15); }
@keyframes shake {
    10%, 90% { transform: translate3d(-1px, 0, 0); } 20%, 80% { transform: translate3d(2px, 0, 0); }
    30%, 50%, 70% { transform: translate3d(-4px, 0, 0); } 40%, 60% { transform: translate3d(4px, 0, 0); }
}
.shake { animation: shake 0.5s cubic-bezier(.36,.07,.19,.97) both; }
#library-sidebar {
    position: fixed; top: 0; left: 0; height: 100%; width: 350px; max-width: 90%;
    background-color: #1f2937; border-right: 2px solid #374151;
    transform: translateX(-100%); transition: transform 0.3s ease-in-out;
    z-index: 50; display: flex; flex-direction: column;
}
#library-sidebar.open { transform: translateX(0); }
.nav-btn:disabled { background-color: #4b5563; cursor: not-allowed; }