:root {
    color-scheme: light;
    --surface: #fff;
    --surface-soft: #f1f5f6;
    --accent-soft: #e8f4f3;
    --green: #167548;
    --red: #b93545;
}
html[data-theme="dark"] {
    color-scheme: dark;
    --bg: #10171d;
    --surface: #18232c;
    --surface-soft: #202f39;
    --ink: #e4edf1;
    --muted: #a0b3bf;
    --line: #30414b;
    --teal: #69d3ca;
    --teal-dark: #9ae5de;
    --accent-soft: #203c3d;
    --green: #80dbab;
    --red: #ff96a2;
}
.theme-toggle {
    display: inline-grid; place-items: center; flex-shrink: 0;
    width: 36px; height: 36px; border: 1px solid var(--line);
    border-radius: 10px; background: var(--surface); color: var(--ink); font-size: 1.2rem;
}
.theme-toggle:hover { background: var(--accent-soft); }
.auth-theme { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.error-summary.validation-summary-valid { display: none; }
.dictionary-heading { margin-bottom: 22px; }
.dictionary-heading h1 { font-size: 2rem; margin-bottom: 6px; }
.dictionary-heading .eyebrow { margin-bottom: 9px; }
.dictionary-workspace { display: flex; flex-direction: column; gap: 18px; }
.compact-dictionary { padding: 0 22px; overflow: visible; }
.compact-dictionary .dictionary-toolbar { padding: 20px 0; margin: 0; }
.reset-all-link { font-size: .75rem; white-space: nowrap; color: var(--muted); align-self: center; margin-left: auto; }
.word-list-head, .word-row {
    display: grid;
    grid-template-columns: minmax(160px, 1fr) minmax(155px, 200px) minmax(155px, 200px) 36px;
    column-gap: 28px;
    align-items: center;
}
.word-list-head { color: var(--muted); font-size: .65rem; letter-spacing: 1.1px; padding: 12px 0; background: var(--surface); }
.word-row { padding: 17px 0 12px; border-top: 1px solid var(--line); row-gap: 7px; position: relative; }
.word-pair { min-width: 0; }
.word-pair h2 { font-size: 1rem; line-height: 1.35; margin: 0 0 4px; overflow-wrap: anywhere; }
.word-pair p { font-size: .85rem; line-height: 1.4; margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.direction-top, .direction-bottom { display: flex; gap: 9px; align-items: center; font-size: .75rem; }
.direction-top { min-height: 21px; }
.direction-bottom { margin-top: 2px; }
.direction-bottom>span { white-space: nowrap; }
.direction-bottom form { margin-left: auto; }
.direction-bottom .text-button { font-size: .75rem; padding: 5px 0; }
.word-direction progress { appearance: none; border: 0; background: var(--surface-soft); height: 5px; width: 48px; border-radius: 6px; margin-left: auto; overflow: hidden; }
.word-direction progress::-webkit-progress-bar { background: var(--surface-soft); }
.word-direction progress::-webkit-progress-value { background: var(--teal); border-radius: 6px; }
.word-direction progress::-moz-progress-bar { background: var(--teal); }
.known-label, .answer-correct { color: var(--green); }
.answer-wrong, .delete-link { color: var(--red); }
.mobile-direction { display: none; }
.word-menu { position: relative; align-self: start; }
.word-menu>summary { list-style: none; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; font-size: 1.3rem; color: var(--muted); }
.word-menu>summary::-webkit-details-marker { display: none; }
.word-menu[open]>summary, .word-menu>summary:hover { background: var(--accent-soft); color: var(--teal); }
.word-menu-items { position: absolute; right: 0; top: 42px; width: 215px; padding: 6px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 8px 30px #0002; border-radius: 10px; z-index: 5; }
.word-menu-items a { display: block; font-size: .8rem; padding: 12px 10px; border-radius: 6px; }
.word-menu-items a:hover { background: var(--surface-soft); }
.word-history, .word-history-empty { grid-column: 1 / -1; margin: 0; font-size: .7rem; }
.word-history summary { font-size: .7rem; gap: 9px; width: fit-content; color: var(--muted); min-height: 25px; }
.word-history[open] { padding: 8px 12px 12px; background: var(--surface-soft); border-radius: 8px; }
.word-history .attempt-sequence { max-height: 160px; }
.dictionary-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid var(--line); padding: 12px 0; color: var(--muted); font-size: .75rem; }
.dictionary-footer .text-button { font-size: .75rem; color: var(--muted); }
.dictionary-entry { background: var(--surface); border: 1px solid var(--line); border-radius: 13px; }
.dictionary-entry>summary { padding: 17px 22px; color: var(--teal); font-size: .875rem; font-weight: 500; cursor: pointer; list-style: none; }
.dictionary-entry>summary::-webkit-details-marker { display: none; }
.dictionary-entry>summary span { float: right; color: var(--muted); font-size: .75rem; font-weight: 400; }
.entry-content { padding: 0 22px 22px; }
.single-entry { display: grid; grid-template-columns: 1fr 1fr auto; align-items: end; gap: 14px; }
.single-entry .button { width: auto; }
.bulk-entry { border-top: 1px solid var(--line); padding-top: 18px; margin-top: 20px; }
.bulk-entry summary { cursor: pointer; font-size: .85rem; color: var(--teal); }
.bulk-entry p, .field-hint { font-size: .8rem; color: var(--muted); margin: 12px 0; }
.bulk-entry textarea { resize: vertical; margin-bottom: 8px; }
.manage-panel { max-width: 580px; margin-top: 20px; padding: 28px; }
.manage-panel h1 { font-size: 1.75rem; }
.manage-target { font-weight: 500; overflow-wrap: anywhere; }
summary:focus-visible { outline: 3px solid #dca335; outline-offset: 3px; }
.practice-reset { align-self: flex-end; text-align: right; font-size: .8rem; padding: 10px 4px; min-height: 40px; }
@media(max-width: 1050px) {
    .word-list-head, .word-row { column-gap: 16px; grid-template-columns: minmax(135px,1fr) 145px 145px 36px; }
    .single-entry { grid-template-columns: 1fr 1fr; }
    .single-entry .button { grid-column: 1/-1; }
}
@media(max-width: 850px) {
    .word-list-head { display: none; }
    .word-row { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; padding: 16px 0 12px; }
    .word-pair { grid-column: 1/-1; grid-row: 1; padding-right: 44px; }
    .word-menu { position: absolute; right: 0; top: 16px; }
    .word-direction { grid-row: 2; min-width: 0; background: var(--surface-soft); border-radius: 8px; padding: 9px 10px; }
    .word-direction:nth-of-type(2) { grid-column: 1; }
    .word-direction:nth-of-type(3) { grid-column: 2; }
    .mobile-direction { display: block; color: var(--muted); font-size: .65rem; width: 100%; }
    .direction-top { flex-wrap: wrap; gap: 5px; }
    .word-direction progress { width: 30px; background: var(--line); }
    .word-direction progress::-webkit-progress-bar { background: var(--line); }
    .compact-dictionary { padding: 0 16px; }
    .compact-dictionary .dictionary-toolbar { gap: 12px; }
    .compact-dictionary .search-form { flex-basis: 100%; }
    .dictionary-entry>summary { padding: 15px 16px; }
    .entry-content { padding: 0 16px 16px; }
}
@media(max-width: 480px) {
    .topbar { flex-wrap: wrap; height: auto; min-height: 60px; padding-top: 10px; padding-bottom: 10px; gap: 5px; }
    .topbar>span { font-size: .65rem; }
    .breadcrumb { margin: 0 7px; }
    .account-actions { gap: 10px; }
    .account-actions>a, .account-actions .text-button { font-size: .7rem; }
    .dictionary-heading { gap: 12px; }
    .dictionary-heading h1 { font-size: 1.65rem; }
    .dictionary-heading p { font-size: .75rem; }
    .dictionary-heading .eyebrow { font-size: .6rem; }
    .dictionary-heading>.button { width: 100%; }
    .dictionary-entry>summary span { display: none; }
    .single-entry { grid-template-columns: 1fr; }
    .dictionary-footer { flex-wrap: wrap; }
    .focus-bar { gap: 8px; font-size: .75rem; }
    .focus-bar>small { font-size: .65rem; }
    .focus-bar .theme-toggle { width: 32px; height: 32px; }
    .manage-panel { padding: 20px; }
    .edit-actions { flex-wrap: wrap; }
}
/* Shared dark palette, including authentication and focused practice. */
html[data-theme="dark"] :is(.sidebar,.stat,.practice-panel,.settings-panel,.dictionary-panel,.entry-panel,.auth-card,.learning-path,.recent-panel,.translation-pair,.option,.secondary,.icon-button,.theme-toggle,.language-pill,kbd) { background: var(--surface); color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] :is(input,select,textarea) { background: var(--bg); color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder { color: var(--muted); opacity: .8; }
html[data-theme="dark"] :is(.nav-item,.focus-bar,.focus-exit,.option-number,.option-arrow,.choice-picker span,.tabs a,.practice-directions a,.word-table .russian) { color: var(--muted); border-color: var(--line); }
html[data-theme="dark"] :is(.nav-item.active,.nav-item:hover,.option:hover,.secondary:hover,.icon-button:hover) { background: var(--accent-soft); color: var(--teal); }
html[data-theme="dark"] :is(.welcome-progress,.mastery-panel,.notice,.status-pill,.empty-symbol,.result-icon) { background: var(--accent-soft); border-color: var(--line); color: var(--teal); }
html[data-theme="dark"] :is(.welcome-progress p,.mastery-panel p) { color: var(--muted); }
html[data-theme="dark"] :is(.tabs,.practice-directions,.practice-bottom,.panel-top,.direction-badge,.stat-icon,.local-profile>span:first-child) { background: var(--surface-soft); border-color: var(--line); color: var(--muted); }
html[data-theme="dark"] :is(.tabs a.active,.practice-directions a.active) { background: var(--surface); color: var(--teal); }
html[data-theme="dark"] :is(.primary,.brand-mark,.choice-picker input:checked+span) { background: var(--teal); color: #102b2c; }
html[data-theme="dark"] .primary:hover { background: var(--teal-dark); }
html[data-theme="dark"] .focus-body { background: var(--bg); }
html[data-theme="dark"] .auth-body { background: radial-gradient(ellipse at top right,#203c3d,transparent 65%),var(--bg); }
html[data-theme="dark"] .flag { background: var(--accent-soft); border-color: var(--line); color: #efd28d; }
html[data-theme="dark"] .attempt-mark.answer-correct { background: #204434; }
html[data-theme="dark"] .attempt-mark.answer-wrong { background: #472b34; }
html[data-theme="dark"] :is(.wrong-symbol,.error-summary) { background: #402832; border-color: #70434c; color: var(--red); }
html[data-theme="dark"] :is(.selected-answer>span,.danger-zone summary) { color: var(--red); }
html[data-theme="dark"] .success-ring { background: #203e32; color: var(--green); border-color: #68c697; }
html[data-theme="dark"] :is(.correct-result h1,.success-ring strong>span) { color: var(--green); }
html[data-theme="dark"] :is(.streak-dots>span,.success-steps>span) { background: var(--line); }
html[data-theme="dark"] :is(.streak-dots>span.filled,.success-steps>span.complete) { background: #378b69; color: white; }
html[data-theme="dark"] .difficult-path :is(.path-icon,.path-link),html[data-theme="dark"] .learning-path h2 small { color: #ebbf7d; }
html[data-theme="dark"] .learning-path h2 small { background: #423625; }
html[data-theme="dark"] .danger { background: #ad4545; color: white; }
