.memorize-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: 16px; border-bottom: 1px solid var(--border-color);
}
.memorize-header h2 { font-size: 1.2em; }
.memorize-stats { display: flex; gap: 16px; font-size: 0.85em; color: var(--text-secondary); }
.memorize-progress { padding: 8px 16px; }

/* Flash Card */
.card-container {
    padding: 20px 16px; display: flex; flex-direction: column; align-items: center; gap: 20px;
}
.card-inner {
    width: 100%; max-width: 400px; height: 240px; perspective: 600px; cursor: pointer;
}
.card-face {
    position: absolute; width: 100%; height: 100%; backface-visibility: hidden;
    border-radius: var(--radius-lg); display: flex; flex-direction: column;
    align-items: center; justify-content: center; padding: 24px;
    box-shadow: var(--shadow-md); transition: transform 0.4s;
}
.card-front {
    background: var(--bg-primary); border: 2px solid var(--border-color);
    z-index: 2; transform: rotateY(0deg);
}
.card-back {
    background: var(--bg-tertiary); transform: rotateY(180deg);
}
.card-inner.flipped .card-front { transform: rotateY(180deg); }
.card-inner.flipped .card-back { transform: rotateY(0deg); }
.card-word { font-size: 2em; font-weight: 700; text-align: center; }
.card-hint { font-size: 0.8em; color: var(--text-tertiary); margin-top: 12px; }
.card-defs { font-size: 1.1em; text-align: center; line-height: 1.8; }
.card-freq { margin-top: 12px; }

/* Quality Buttons */
.card-actions {
    display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; max-width: 400px;
}
.btn-quality {
    padding: 8px 14px; border-radius: var(--radius-sm); font-size: 0.8em;
    font-weight: 500; transition: all 0.15s; border: 1px solid var(--border-color);
    background: var(--bg-primary); min-width: 56px;
}
.btn-quality:active { transform: scale(0.95); }
.q-0:hover, .q-0:active { background: #FEE2E2; border-color: #DC2626; color: #DC2626; }
.q-1:hover, .q-1:active { background: #FEF3C7; border-color: #F59E0B; color: #B45309; }
.q-3:hover, .q-3:active { background: #DBEAFE; border-color: #2563EB; color: #2563EB; }
.q-4:hover, .q-4:active { background: #D1FAE5; border-color: #16A34A; color: #16A34A; }
.q-5:hover, .q-5:active { background: #E0E7FF; border-color: #4F46E5; color: #4F46E5; }

/* Multiple Choice */
.choice-container { padding: 20px 16px; }
.choice-prompt {
    font-size: 1.5em; font-weight: 700; text-align: center; margin-bottom: 20px;
}
.choice-options { display: flex; flex-direction: column; gap: 10px; max-width: 400px; margin: 0 auto; }
.choice-option {
    padding: 14px 16px; border: 1.5px solid var(--border-color); border-radius: var(--radius-md);
    font-size: 0.95em; cursor: pointer; transition: all 0.15s; text-align: center;
}
.choice-option:active { transform: scale(0.98); }
.choice-option.correct { background: #D1FAE5; border-color: #16A34A; color: #16A34A; }
.choice-option.wrong { background: #FEE2E2; border-color: #DC2626; color: #DC2626; }
.choice-option.disabled { pointer-events: none; opacity: 0.7; }
.choice-feedback {
    text-align: center; margin-top: 16px; font-weight: 600; font-size: 1em;
}

/* Spelling */
.spelling-container { padding: 20px 16px; }
.spelling-prompt {
    font-size: 1em; text-align: center; margin-bottom: 16px; color: var(--text-secondary);
}
.spelling-input {
    width: 100%; max-width: 400px; display: block; margin: 0 auto;
    padding: 12px 16px; border: 2px solid var(--border-color); border-radius: var(--radius-md);
    font-size: 1.2em; text-align: center; background: var(--bg-primary); color: var(--text-primary);
}
.spelling-input:focus { outline: none; border-color: var(--accent); }
.spelling-feedback {
    text-align: center; margin-top: 12px; font-weight: 600; font-size: 0.95em;
}
#btn-spelling-next, #btn-choice-next {
    display: block; margin: 16px auto 0; min-width: 120px;
}

.memorize-empty, .memorize-loading { padding: 60px 20px; text-align: center; }
.memorize-loading { color: var(--text-secondary); }
