/* ── Theme tokens ──────────────────────────────────────────── */

:root {
    --site-bg: #f8f9fa;
    --site-surface: #ffffff;
    --site-surface-elevated: #ffffff;
    --site-text: #212529;
    --site-text-muted: #6c757d;
    --site-border: #dee2e6;
    --site-navbar-bg: #212529;
    --site-primary: #3EB489;
    --site-primary-hover: #35a077;
    --site-success: #3EB489;
    --site-success-hover: #35a077;
    --site-accent-cyan: #3EB489;
    --site-accent-yellow: #e6a700;
    --site-shadow: rgba(0, 0, 0, 0.08);

    --chat-panel-bg: #ffffff;
    --chat-header-bg: #f8f9fa;
    --chat-messages-bg: #ffffff;
    --chat-compose-bg: #f8f9fa;
    --chat-border: #dee2e6;
    --chat-text: #212529;
    --chat-nick: #495057;
    --chat-nick-mine-bg: #e9ecef;
    --chat-nick-mine-text: #343a40;
    --chat-sep: #6c757d;
    --chat-row-active-bg: #ecf9f4;
    --chat-pin-active-bg: #ecf9f4;
    --chat-pin-active-color: #3EB489;
    --chat-student-pin-active-bg: #f3eef8;
    --chat-student-pin-active-color: #6f42c1;
    --workspace-shell-bg: #f8f9fa;
    --workspace-panel-bg: #ffffff;
    --workspace-header-bg: #fafbfc;
    --workspace-table-bg: #ffffff;
    --workspace-table-header-bg: #fafbfc;
    --workspace-table-border: #e9ecef;

    --bs-body-bg: var(--site-bg);
    --bs-body-color: var(--site-text);
    --bs-primary: var(--site-primary);
    --bs-success: var(--site-success);
    --bs-primary-rgb: 62, 180, 137;
    --bs-success-rgb: 62, 180, 137;
    --bs-link-color: var(--site-primary);
    --bs-link-hover-color: var(--site-primary-hover);
    --bs-border-color: var(--site-border);

    --palette-pink: #E9B2B5;
    --palette-peach: #E1B68F;
    --palette-sage-pale: #D8E7D5;
    --palette-sage: #A1B8A4;
    --palette-pink-hover: #dfa0a4;
    --palette-peach-hover: #d4a67d;
    --palette-sage-pale-hover: #c5d9c1;
    --palette-sage-hover: #8fa892;
    --palette-btn-text: #3a3a3a;
    --palette-sage-disabled: #8fa892;
    --palette-sage-pale-disabled: #c0d4bc;
    --palette-peach-disabled: #d4a67d;
    --palette-pink-disabled: #dfa0a4;

    --home-nav-bg: #2e2e2e;
    --home-nav-hover: #3a3a3a;
    --home-nav-border: #3f3f3f;
    --home-nav-text: #f3f3f3;
    --home-nav-text-hover: #ffffff;
    --home-nav-muted: #a8a8a8;
    --home-nav-icon: #d0d0d0;
    --home-nav-chevron: #8f8f8f;
    --home-nav-focus: #3EB489;
}

[data-theme="dark"] {
    --site-bg: #272822;
    --site-surface: #2d2e27;
    --site-surface-elevated: #3e3d32;
    --site-text: #f8f8f2;
    --site-text-muted: #75715e;
    --site-border: #49483e;
    --site-navbar-bg: #1e1f1c;
    --site-primary: #f92672;
    --site-primary-hover: #ff4d8d;
    --site-success: #a6e22e;
    --site-success-hover: #b8f045;
    --site-accent-cyan: #66d9ef;
    --site-accent-yellow: #e6db74;
    --site-shadow: rgba(0, 0, 0, 0.35);

    --chat-panel-bg: #2d2e27;
    --chat-header-bg: #3e3d32;
    --chat-messages-bg: #272822;
    --chat-compose-bg: #3e3d32;
    --chat-border: #49483e;
    --chat-text: #f8f8f2;
    --chat-nick: #66d9ef;
    --chat-nick-mine-bg: #49483e;
    --chat-nick-mine-text: #e6db74;
    --chat-sep: #75715e;
    --chat-row-active-bg: rgba(102, 217, 239, 0.12);
    --chat-pin-active-bg: rgba(249, 38, 114, 0.18);
    --chat-pin-active-color: #f92672;
    --chat-student-pin-active-bg: rgba(174, 129, 255, 0.18);
    --chat-student-pin-active-color: #ae81ff;
    --workspace-shell-bg: #272822;
    --workspace-panel-bg: #2d2e27;
    --workspace-header-bg: #3e3d32;
    --workspace-table-bg: #2d2e27;
    --workspace-table-header-bg: #3e3d32;
    --workspace-table-border: #49483e;

    --bs-body-bg: var(--site-bg);
    --bs-body-color: var(--site-text);
    --bs-primary: var(--site-primary);
    --bs-success: var(--site-success);
    --bs-primary-rgb: 249, 38, 114;
    --bs-success-rgb: 166, 226, 46;
    --bs-link-color: var(--site-accent-cyan);
    --bs-link-hover-color: #8eeaff;
    --bs-border-color: var(--site-border);
    --bs-secondary-color: #9e9988;

    --word-btn-know-disabled: #7da822;
    --word-btn-unsure-disabled: #4a9eb3;
    --word-btn-forgot-disabled: #b8ae5c;
    --word-btn-noidea-disabled: #bf1f58;
    --word-btn-extra-new-disabled: #2d8a66;
    --word-btn-extra-review-disabled: #4a9eb3;

    --home-nav-bg: #1e1f1c;
    --home-nav-hover: #2d2e27;
    --home-nav-border: #3e3d32;
    --home-nav-text: #f8f8f2;
    --home-nav-text-hover: #ffffff;
    --home-nav-muted: #75715e;
    --home-nav-icon: #cfcfc7;
    --home-nav-chevron: #75715e;
    --home-nav-focus: #66d9ef;
}

.site-body,
body.bg-light {
    background-color: var(--site-bg) !important;
    color: var(--site-text);
}

/* ── Bootstrap overrides ───────────────────────────────────── */

.btn-primary,
.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--site-primary);
    --bs-btn-border-color: var(--site-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--site-primary-hover);
    --bs-btn-hover-border-color: var(--site-primary-hover);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--site-primary-hover);
    --bs-btn-active-border-color: var(--site-primary-hover);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--site-primary);
    --bs-btn-disabled-border-color: var(--site-primary);
}

.btn-success {
    --bs-btn-bg: var(--site-success);
    --bs-btn-border-color: var(--site-success);
    --bs-btn-hover-bg: var(--site-success-hover);
    --bs-btn-hover-border-color: var(--site-success-hover);
    --bs-btn-focus-shadow-rgb: var(--bs-success-rgb);
    --bs-btn-active-bg: var(--site-success-hover);
    --bs-btn-active-border-color: var(--site-success-hover);
    --bs-btn-disabled-bg: var(--site-success);
    --bs-btn-disabled-border-color: var(--site-success);
}

[data-theme="dark"] .btn-success {
    --bs-btn-color: #272822;
    --bs-btn-hover-color: #272822;
    --bs-btn-active-color: #272822;
}

.text-success {
    color: var(--site-success) !important;
}

.bg-success,
.progress-bar.bg-success,
.badge.bg-success {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
}

.navbar.bg-dark {
    background-color: var(--site-navbar-bg) !important;
    position: relative;
    z-index: 1045;
}

.theme-toggle-group .theme-toggle-btn,
.word-reveal-toggle-group .word-reveal-toggle-btn {
    width: 31px;
    min-width: 31px;
    height: 31px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.word-reveal-toggle-group .word-reveal-toggle-btn {
    font-weight: 700;
}

.theme-toggle-group .theme-toggle-btn.active {
    background-color: var(--site-primary);
    border-color: var(--site-primary);
    color: #fff;
}

.word-reveal-toggle-group .word-reveal-toggle-btn.active {
    background-color: var(--site-primary);
    border-color: var(--site-primary);
    color: #fff;
}

[data-theme="dark"] .theme-toggle-group .theme-toggle-btn.active {
    color: #272822;
}

[data-theme="dark"] .word-reveal-toggle-group .word-reveal-toggle-btn.active {
    color: #272822;
}

[data-theme="dark"] .bg-white,
[data-theme="dark"] .card,
[data-theme="dark"] .modal-content {
    background-color: var(--site-surface) !important;
    color: var(--site-text);
}

[data-theme="dark"] .card-header,
[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer {
    background-color: var(--site-surface-elevated) !important;
    border-color: var(--site-border);
    color: var(--site-text);
}

.lesson-form-modal {
    max-width: min(920px, calc(100vw - 2rem));
}

.lesson-form-modal.modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 2rem);
}

.lesson-form-modal.modal-dialog-scrollable .modal-content > form {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: inherit;
}

.lesson-form-modal.modal-dialog-scrollable .modal-body {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
}

.lesson-form-modal .modal-header,
.lesson-form-modal .modal-footer {
    flex-shrink: 0;
}

.lesson-form-modal .modal-body {
    padding: 1rem 1.25rem;
}

[data-theme="dark"] .bg-light {
    background-color: var(--site-surface-elevated) !important;
    color: var(--site-text);
}

[data-theme="dark"] .text-dark {
    color: var(--site-text) !important;
}

[data-theme="dark"] .text-muted {
    color: var(--site-text-muted) !important;
}

[data-theme="dark"] .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--site-text);
    --bs-table-border-color: var(--site-border);
    color: var(--site-text);
}

[data-theme="dark"] .table-light {
    --bs-table-bg: var(--site-surface-elevated);
    --bs-table-color: var(--site-text);
}

[data-theme="dark"] .table-hover > tbody > tr:hover > * {
    --bs-table-bg-state: var(--site-surface-elevated);
    color: var(--site-text);
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
    background-color: var(--site-surface-elevated);
    border-color: var(--site-border);
    color: var(--site-text);
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
    background-color: var(--site-surface-elevated);
    border-color: var(--site-accent-cyan);
    color: var(--site-text);
    box-shadow: 0 0 0 0.2rem rgba(102, 217, 239, 0.2);
}

[data-theme="dark"] .form-control::placeholder,
[data-theme="dark"] textarea.form-control::placeholder {
    color: var(--bs-secondary-color);
    opacity: 1;
}

[data-theme="dark"] .form-control::-webkit-input-placeholder,
[data-theme="dark"] textarea.form-control::-webkit-input-placeholder {
    color: var(--bs-secondary-color);
    opacity: 1;
}

[data-theme="dark"] .form-control::-moz-placeholder,
[data-theme="dark"] textarea.form-control::-moz-placeholder {
    color: var(--bs-secondary-color);
    opacity: 1;
}

[data-theme="dark"] .dropdown-menu {
    background-color: var(--site-surface);
    border-color: var(--site-border);
}

[data-theme="dark"] .dropdown-item {
    color: var(--site-text);
}

[data-theme="dark"] .dropdown-item:hover,
[data-theme="dark"] .dropdown-item:focus {
    background-color: var(--site-surface-elevated);
    color: var(--site-text);
}

[data-theme="dark"] .dropdown-item.active {
    background-color: var(--site-primary);
    color: #fff;
}

[data-theme="dark"] .btn-outline-primary {
    --bs-btn-color: var(--site-accent-cyan);
    --bs-btn-border-color: var(--site-accent-cyan);
    --bs-btn-hover-bg: var(--site-accent-cyan);
    --bs-btn-hover-border-color: var(--site-accent-cyan);
    --bs-btn-hover-color: #272822;
}

[data-theme="dark"] .btn-outline-secondary {
    --bs-btn-color: var(--site-text-muted);
    --bs-btn-border-color: var(--site-border);
    --bs-btn-hover-bg: var(--site-surface-elevated);
    --bs-btn-hover-border-color: var(--site-text-muted);
    --bs-btn-hover-color: var(--site-text);
}

[data-theme="dark"] .alert-danger {
    background-color: rgba(249, 38, 114, 0.15);
    border-color: rgba(249, 38, 114, 0.35);
    color: #ffb3cc;
}

[data-theme="dark"] .shadow-sm {
    box-shadow: 0 0.125rem 0.5rem var(--site-shadow) !important;
}

[data-theme="dark"] .github-diff {
    background: var(--site-surface);
    border-color: var(--site-border);
}

[data-theme="dark"] .github-diff-header {
    background: var(--site-surface-elevated);
    border-bottom-color: var(--site-border);
    color: var(--site-text);
}

[data-theme="dark"] .github-diff-line {
    color: var(--site-text);
}

[data-theme="dark"] .github-diff-removed {
    background: rgba(249, 38, 114, 0.18);
}

[data-theme="dark"] .github-diff-added {
    background: rgba(166, 226, 46, 0.15);
}

[data-theme="dark"] .note-editor-panel,
[data-theme="dark"] .student-info-panel {
    background: var(--site-surface) !important;
    color: var(--site-text);
}

[data-theme="dark"] .badge.bg-secondary {
    background-color: var(--site-surface-elevated) !important;
    color: var(--site-text);
}

/* ── Lesson chat panel ─────────────────────────────────────── */

.lesson-chat-panel {
    background: var(--chat-panel-bg);
    color: var(--chat-text);
}

.lesson-chat-header.bg-light {
    background-color: var(--chat-header-bg) !important;
    border-bottom-color: var(--chat-border) !important;
    color: var(--chat-text);
}

.lesson-chat-header .text-dark {
    color: var(--chat-text) !important;
}

.lesson-chat-compose.bg-light {
    background-color: var(--chat-compose-bg) !important;
    border-top-color: var(--chat-border) !important;
}

.lesson-chat-messages,
.lesson-workspace-chat-messages {
    background: var(--chat-messages-bg);
    color: var(--chat-text);
}

.lesson-chat-nick,
.lesson-workspace-chat-messages .lesson-chat-nick {
    color: var(--chat-nick);
}

.lesson-chat-line.is-mine .lesson-chat-nick,
.lesson-workspace-chat-messages .lesson-chat-line.is-mine .lesson-chat-nick {
    background: var(--chat-nick-mine-bg);
    color: var(--chat-nick-mine-text);
}

.lesson-chat-sep,
.lesson-workspace-chat-messages .lesson-chat-sep {
    color: var(--chat-sep);
}

.lesson-chat-text,
.lesson-workspace-chat-messages .lesson-chat-text {
    color: var(--chat-text);
}

.lesson-chat-panel.theme-teacher .lesson-chat-header-actions .btn-icon.active {
    color: var(--chat-pin-active-color);
    background-color: var(--chat-pin-active-bg);
    border-color: var(--chat-pin-active-color);
}

.lesson-chat-panel.theme-student .lesson-chat-header-actions .btn-icon.active {
    color: var(--chat-student-pin-active-color);
    background-color: var(--chat-student-pin-active-bg);
    border-color: var(--chat-student-pin-active-color);
}

tr.lesson-row-chat-active {
    background-color: var(--chat-row-active-bg) !important;
}

[data-theme="dark"] .lesson-chat-header .btn-close {
    filter: invert(1) grayscale(1);
    opacity: 0.75;
}

[data-theme="dark"] .lesson-chat-header .btn-close:hover {
    opacity: 1;
}

/* ── Lesson workspace page ─────────────────────────────────── */

.lesson-workspace-shell {
    background: var(--workspace-shell-bg) !important;
    color: var(--site-text);
}

.lesson-workspace-sidebar {
    background: var(--workspace-panel-bg) !important;
    border-color: var(--chat-border) !important;
}

.lesson-workspace-sidebar-header,
.lesson-workspace-nav {
    background: var(--workspace-header-bg) !important;
    border-color: var(--chat-border) !important;
    color: var(--site-text);
}

.lesson-workspace-nav-meta {
    color: var(--site-text-muted) !important;
}

.lesson-workspace-chat-compose {
    background: var(--chat-compose-bg) !important;
    border-top-color: var(--chat-border) !important;
}

.lesson-workspace-main-scroll {
    background: var(--workspace-shell-bg);
    color: var(--site-text);
}

.words-table-block {
    background: var(--workspace-table-bg) !important;
    border-color: var(--workspace-table-border) !important;
    color: var(--site-text);
}

.words-table-block .card-header {
    background: var(--workspace-table-header-bg) !important;
    border-bottom-color: var(--chat-border) !important;
    color: var(--site-text);
}

[data-theme="dark"] .words-create-block .form-control {
    background: var(--site-surface-elevated);
    border-color: var(--site-border);
    color: var(--site-text);
}

/* Убираем все кастомные стили для кнопок */
.btn-teacher {
    background-color: initial !important;
    color: initial !important;
    border: initial !important;
    box-shadow: initial !important;
    padding: initial !important;
    font-size: initial !important;
    font-weight: initial !important;
    border-radius: initial !important;
    transition: initial !important;
}

/* ── Home page ─────────────────────────────────────────────── */

.home-page {
    --home-grid-columns: 1fr 3fr 1fr;
}

.home-page .navbar {
    margin-bottom: 0 !important;
}

.home-top-bar {
    padding: 0;
}

.home-top-bar-inner {
    display: grid;
    grid-template-columns: var(--home-grid-columns);
    width: 100%;
    align-items: center;
}

.home-top-bar-brand {
    padding: 0.75rem 1rem 0.75rem 50%;
    min-width: 0;
}

.home-top-bar-brand .navbar-brand {
    margin: 0;
    padding: 0;
    white-space: nowrap;
}

.home-top-bar-actions {
    grid-column: 2 / -1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0.5rem 1.5rem;
}

.home-split {
    --home-block-btn-width: 100%;
    --home-block-gap: 1rem;
    display: grid;
    grid-template-columns: var(--home-grid-columns);
    min-height: calc(100vh - 72px);
}

.home-split-pane {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--home-block-gap);
    padding: 2.5rem 1.5rem 2rem;
}

.home-split-left {
    justify-content: flex-start;
    align-items: stretch;
    padding: 0;
    gap: 0;
    background: var(--home-nav-bg);
    border-right: 1px solid var(--home-nav-border);
}

.home-nav-accordion {
    width: 100%;
    flex: 1 1 auto;
}

.home-nav-heading {
    padding: 1.25rem 1rem 0.65rem;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--home-nav-muted);
}

.home-nav-list {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.home-nav-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.65rem 1rem;
    border: none;
    border-radius: 0;
    background: transparent;
    color: var(--home-nav-text);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.3;
    text-align: left;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.home-nav-item:hover,
.home-nav-item:focus {
    background: var(--home-nav-hover);
    color: var(--home-nav-text-hover);
}

.home-nav-item:focus-visible {
    outline: 2px solid var(--home-nav-focus);
    outline-offset: -2px;
}

.home-nav-icon {
    width: 1.125rem;
    flex-shrink: 0;
    text-align: center;
    color: var(--home-nav-icon);
    font-size: 0.95rem;
}

.home-nav-label {
    flex: 1 1 auto;
    min-width: 0;
}

.home-nav-chevron {
    flex-shrink: 0;
    color: var(--home-nav-chevron);
    font-size: 0.72rem;
    opacity: 0.8;
}

.home-nav-footer {
    margin-top: auto;
    width: 100%;
    padding-top: 0.5rem;
    border-top: 1px solid var(--home-nav-border);
}

.home-next-lesson-item {
    align-items: center;
}

.home-next-lesson-content {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.home-next-lesson-label {
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1.25;
    color: var(--home-nav-muted);
}

.home-next-lesson-countdown {
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    color: var(--home-nav-text);
}

.next-lesson-widget {
    display: block;
    width: 100%;
}

.home-split-right {
    padding: 2.5rem 1.5rem 2rem;
    justify-content: flex-start;
    align-items: stretch;
}

.home-split-center {
    justify-content: flex-start;
    align-items: stretch;
    padding: 0;
    gap: 0;
    border-right: 1px solid var(--site-border);
    min-height: 0;
    overflow: hidden;
}

.home-center-stack {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    height: 100%;
}

.home-center-top {
    flex: 3 1 0;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.home-center-panels {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.home-center-panel {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.home-center-panel[hidden] {
    display: none !important;
}

.home-center-panel-header {
    flex-shrink: 0;
    padding: 1.5rem 1.5rem 0.75rem;
    border-bottom: 1px solid var(--site-border);
}

.home-center-panel-title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--site-text);
}

.home-center-panel-body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 1rem 1.5rem 1.25rem;
    overflow: auto;
}

.home-center-panel-text {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--site-text-muted);
}

.home-center-panel-empty {
    align-items: center;
    justify-content: center;
}

.home-center-panel-empty-inner {
    padding: 2rem 1.5rem;
    text-align: center;
}

.home-center-panel-empty-text {
    margin: 0;
    font-size: 0.95rem;
    color: var(--site-text-muted);
}

.home-login-panel {
    width: 100%;
    max-width: 22rem;
    text-align: center;
}

.home-login-panel-lead {
    margin: 0 0 1.25rem;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--site-text-muted);
}

.home-login-form {
    text-align: left;
}

.home-tasks-panel-body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.home-tasks-panel-body .user-tasks-table-block {
    flex: 1 1 auto;
    min-height: 0;
}

.home-nav-item.is-active {
    background: var(--home-nav-hover);
    color: var(--home-nav-text-hover);
}

.home-center-bottom {
    flex: 2 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0;
    border-top: 1px solid var(--site-border);
    overflow: hidden;
    background: var(--site-bg);
}

.home-center-bottom.is-collapsed {
    flex: 0 0 auto;
}

.home-sr-toggle {
    width: 100%;
    min-height: 4.5rem;
    border: none;
    border-bottom: 1px solid transparent;
    background: var(--site-surface-elevated);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.5rem 1.5rem;
    cursor: pointer;
    color: var(--site-text);
    flex-shrink: 0;
    transition: background-color 0.15s ease;
}

.home-center-bottom:not(.is-collapsed) .home-sr-toggle {
    border-bottom-color: var(--site-border);
}

.home-sr-toggle:hover,
.home-sr-toggle:focus {
    background: var(--site-surface);
}

.home-sr-toggle:focus-visible {
    outline: 2px solid var(--site-primary);
    outline-offset: -2px;
}

.home-sr-toggle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    color: var(--site-text-muted);
    transition: transform 0.2s ease, color 0.15s ease;
}

.home-center-bottom.is-collapsed .home-sr-toggle-icon {
    transform: rotate(180deg);
}

.home-sr-toggle-label {
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: var(--site-text-muted);
    line-height: 1.2;
}

.home-sr-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 1.25rem 1.25rem;
}

.home-sr-content .home-word-widget {
    gap: 0.5rem;
}

.home-sr-content .home-word-frame {
    aspect-ratio: 10 / 2.15;
    padding: 0.5rem 1rem 0.35rem;
}

.home-sr-content .home-word-empty-state {
    gap: 0.35rem;
}

.home-sr-content .home-word-extra-actions {
    gap: 0.35rem;
    margin-bottom: 0;
}

.home-sr-content .home-word-text {
    font-size: 1.5rem;
}

.home-sr-content .home-word-progress {
    gap: 0.35rem;
}

.home-sr-content .home-word-progress-btn {
    padding: 0.35rem 0.15rem;
    font-size: 0.75rem;
}

.home-center-bottom.is-collapsed .home-sr-content {
    display: none;
}

.home-sr-content .home-word-widget,
.home-center-bottom .home-word-widget {
    width: 90%;
    max-width: 100%;
}

.home-word-widget {
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--home-block-gap);
}

.home-word-frame {
    width: 100%;
    aspect-ratio: 10 / 3;
    border: 2px solid var(--site-primary);
    border-radius: 12px;
    background: var(--site-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.25rem;
    text-align: center;
    cursor: default;
    flex-direction: column;
}

.home-word-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    width: 100%;
}

.home-word-want-more {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.3;
    color: var(--site-text-muted);
}

.home-word-extra-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
}

.home-word-extra-btn {
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.2;
    border: none;
    color: var(--palette-btn-text);
    white-space: normal;
}

.home-word-extra-btn-new {
    background-color: var(--palette-sage);
}

.home-word-extra-btn-new:hover,
.home-word-extra-btn-new:focus {
    background-color: var(--palette-sage-hover);
    color: var(--palette-btn-text);
}

.home-word-extra-btn-review {
    background-color: var(--palette-peach);
}

.home-word-extra-btn-review:hover,
.home-word-extra-btn-review:focus {
    background-color: var(--palette-peach-hover);
    color: var(--palette-btn-text);
}

.home-word-extra-btn:disabled {
    opacity: 1;
    cursor: not-allowed;
}

.home-word-extra-btn-new:disabled {
    background-color: var(--palette-sage-disabled);
    color: var(--palette-btn-text);
}

.home-word-extra-btn-review:disabled {
    background-color: var(--palette-peach-disabled);
    color: var(--palette-btn-text);
}

[data-theme="dark"] .home-word-extra-btn-new {
    background-color: #3EB489;
    color: #272822;
}

[data-theme="dark"] .home-word-extra-btn-review {
    background-color: #66d9ef;
    color: #272822;
}

.home-word-frame.is-revealed {
    cursor: pointer;
}

.home-word-text {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--site-text);
    word-break: break-word;
}

.home-word-definition {
    font-size: 1.15rem;
    font-weight: 500;
    line-height: 1.4;
}

.home-word-empty {
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--site-text-muted);
}

.home-word-progress {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
    width: 100%;
}

.home-word-progress-btn {
    width: 100%;
    min-width: 0;
    padding: 0.45rem 0.2rem;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.15;
    white-space: normal;
    border: none;
    color: var(--palette-btn-text);
}

.home-word-btn-know {
    background-color: var(--palette-sage);
}

.home-word-btn-know:hover,
.home-word-btn-know:focus {
    background-color: var(--palette-sage-hover);
    color: var(--palette-btn-text);
}

.home-word-btn-unsure {
    background-color: var(--palette-sage-pale);
}

.home-word-btn-unsure:hover,
.home-word-btn-unsure:focus {
    background-color: var(--palette-sage-pale-hover);
    color: var(--palette-btn-text);
}

.home-word-btn-forgot {
    background-color: var(--palette-peach);
}

.home-word-btn-forgot:hover,
.home-word-btn-forgot:focus {
    background-color: var(--palette-peach-hover);
    color: var(--palette-btn-text);
}

.home-word-btn-noidea {
    background-color: var(--palette-pink);
}

.home-word-btn-noidea:hover,
.home-word-btn-noidea:focus {
    background-color: var(--palette-pink-hover);
    color: var(--palette-btn-text);
}

.home-page .home-word-progress-btn.home-word-btn-know:disabled,
.home-page .home-word-progress-disabled .home-word-btn-know {
    background-color: var(--palette-sage-disabled);
    color: var(--palette-btn-text);
}

.home-page .home-word-progress-btn.home-word-btn-unsure:disabled,
.home-page .home-word-progress-disabled .home-word-btn-unsure {
    background-color: var(--palette-sage-pale-disabled);
    color: var(--palette-btn-text);
}

.home-page .home-word-progress-btn.home-word-btn-forgot:disabled,
.home-page .home-word-progress-disabled .home-word-btn-forgot {
    background-color: var(--palette-peach-disabled);
    color: var(--palette-btn-text);
}

.home-page .home-word-progress-btn.home-word-btn-noidea:disabled,
.home-page .home-word-progress-disabled .home-word-btn-noidea {
    background-color: var(--palette-pink-disabled);
    color: var(--palette-btn-text);
}

[data-theme="dark"] .home-word-btn-know {
    background-color: #a6e22e;
    color: #272822;
}

[data-theme="dark"] .home-word-btn-know:hover,
[data-theme="dark"] .home-word-btn-know:focus {
    background-color: #b8f045;
    color: #272822;
}

[data-theme="dark"] .home-word-btn-unsure {
    background-color: #66d9ef;
    color: #272822;
}

[data-theme="dark"] .home-word-btn-unsure:hover,
[data-theme="dark"] .home-word-btn-unsure:focus {
    background-color: #8eeaff;
    color: #272822;
}

[data-theme="dark"] .home-word-btn-forgot {
    background-color: #e6db74;
    color: #272822;
}

[data-theme="dark"] .home-word-btn-forgot:hover,
[data-theme="dark"] .home-word-btn-forgot:focus {
    background-color: #f0e596;
    color: #272822;
}

[data-theme="dark"] .home-word-btn-noidea {
    background-color: #f92672;
    color: #fff;
}

[data-theme="dark"] .home-word-btn-noidea:hover,
[data-theme="dark"] .home-word-btn-noidea:focus {
    background-color: #ff4d8d;
    color: #fff;
}

[data-theme="dark"] .home-page .home-word-progress-btn.home-word-btn-know:disabled,
[data-theme="dark"] .home-page .home-word-progress-disabled .home-word-btn-know {
    background-color: var(--word-btn-know-disabled);
    color: #272822;
}

[data-theme="dark"] .home-page .home-word-progress-btn.home-word-btn-unsure:disabled,
[data-theme="dark"] .home-page .home-word-progress-disabled .home-word-btn-unsure {
    background-color: var(--word-btn-unsure-disabled);
    color: #272822;
}

[data-theme="dark"] .home-page .home-word-progress-btn.home-word-btn-forgot:disabled,
[data-theme="dark"] .home-page .home-word-progress-disabled .home-word-btn-forgot {
    background-color: var(--word-btn-forgot-disabled);
    color: #272822;
}

[data-theme="dark"] .home-page .home-word-progress-btn.home-word-btn-noidea:disabled,
[data-theme="dark"] .home-page .home-word-progress-disabled .home-word-btn-noidea {
    background-color: var(--word-btn-noidea-disabled);
    color: #fff;
}

[data-theme="dark"] .home-word-extra-btn-new:disabled {
    background-color: var(--word-btn-extra-new-disabled);
    color: #272822;
}

[data-theme="dark"] .home-word-extra-btn-review:disabled {
    background-color: var(--word-btn-extra-review-disabled);
    color: #272822;
}

.home-word-progress-disabled .home-word-progress-btn {
    opacity: 1;
    cursor: not-allowed;
}

.home-page .home-word-progress-btn.btn:disabled,
.home-page .home-word-extra-btn.btn:disabled {
    opacity: 1;
    border: none;
}

[data-theme="dark"] .home-word-progress-disabled .home-word-progress-btn {
    opacity: 1;
}

[data-theme="dark"] .home-page .home-word-progress-btn.btn:disabled,
[data-theme="dark"] .home-page .home-word-extra-btn.btn:disabled {
    opacity: 1;
}

[data-theme="dark"] .home-word-extra-btn:disabled {
    opacity: 1;
}

.home-tasks-widget {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.home-tasks-title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--site-text);
}

.home-tasks-list {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

.home-task-item {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--site-border);
}

.home-task-item:last-child {
    border-bottom: none;
}

.home-task-checkbox {
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.home-task-label {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin: 0;
    cursor: pointer;
    min-width: 0;
}

.home-task-number {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--site-text-muted);
    line-height: 1.2;
}

.home-task-title {
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.35;
    color: var(--site-text);
    word-break: break-word;
}

.home-task-item.is-completed .home-task-title {
    text-decoration: line-through;
    opacity: 0.55;
}

.home-task-progress {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--site-text-muted);
    line-height: 1.2;
}

.home-task-item.is-automatic .home-task-checkbox:disabled {
    opacity: 1;
    cursor: default;
}

.home-task-item.is-automatic.is-completed .home-task-checkbox:disabled {
    background-color: var(--site-primary);
    border-color: var(--site-primary);
}

.home-tasks-empty {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.4;
    color: var(--site-text-muted);
}

.user-tasks-add-form .form-control {
    min-width: 0;
}

.user-tasks-table-block {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--site-surface);
    border: 1px solid var(--site-border);
    border-radius: 0.75rem;
    box-shadow: 0 0.125rem 0.5rem var(--site-shadow);
    overflow: hidden;
}

.user-tasks-table-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.user-tasks-table {
    margin-bottom: 0;
}

.user-tasks-table thead th {
    font-size: 0.78rem;
    white-space: nowrap;
}

.user-tasks-col-done {
    width: 3.5rem;
}

.user-tasks-col-type {
    width: 5.5rem;
}

.user-tasks-col-progress {
    width: 5.5rem;
    white-space: nowrap;
}

.user-tasks-table.hide-progress .col-progress {
    display: none;
}

.user-tasks-table-toolbar {
    flex-shrink: 0;
    border-bottom: 1px solid var(--site-border);
}

.user-tasks-col-actions {
    width: 1%;
    white-space: nowrap;
}

.user-tasks-actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.35rem;
}

.user-tasks-actions .btn {
    flex-shrink: 0;
    white-space: nowrap;
}

.user-tasks-move-up-btn,
.user-tasks-move-down-btn {
    width: 31px;
    height: 31px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.user-tasks-row.is-completed .user-tasks-title-text {
    text-decoration: line-through;
    opacity: 0.65;
}

.user-tasks-type-badge {
    background: var(--site-surface-elevated);
    color: var(--site-text-muted);
    border: 1px solid var(--site-border);
}

.user-tasks-row.is-automatic .user-tasks-type-badge {
    color: var(--site-primary);
    border-color: transparent;
    background: rgba(62, 180, 137, 0.15);
}

[data-theme="dark"] .user-tasks-row.is-automatic .user-tasks-type-badge {
    background: rgba(249, 38, 114, 0.18);
    color: var(--site-primary);
}

/* ── Words table (page + home panel) ───────────────────────── */

.words-uniform-input {
    height: 38px !important;
    box-sizing: border-box !important;
}

.words-add-form .form-control,
.words-add-form textarea.form-control {
    height: 38px !important;
    box-sizing: border-box !important;
}

.words-add-label {
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.35rem;
    color: var(--site-text-muted);
}

.sortable-th a {
    color: inherit;
    text-decoration: none;
}

.sortable-th a:hover {
    color: var(--site-primary);
}

.sortable-th .sort-icon {
    font-size: 0.75rem;
    margin-left: 0.25rem;
    opacity: 0.7;
}

.words-table.hide-translation .col-translation {
    display: none;
}

.words-table.hide-extra .col-extra {
    display: none;
}

.words-create-block {
    background: #2f4639;
    color: #f0f4f2;
    border-radius: 0.75rem;
    box-shadow: 0 0.25rem 1rem rgba(36, 56, 48, 0.18);
}

.words-create-block-compact {
    padding: 1rem;
}

.words-create-header {
    background: #243830;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.words-create-block .words-add-label {
    color: #d0d8d4;
}

.words-create-block .form-control {
    background: #fff;
    border-color: rgba(255, 255, 255, 0.15);
}

.words-create-block .invalid-feedback,
.words-create-block .errorlist,
.words-create-block .text-danger {
    color: #ffc9c9;
}

.words-create-details {
    border: 1px solid var(--site-border);
    border-radius: 0.75rem;
    padding: 0.65rem 0.85rem;
    background: var(--site-surface);
}

.words-create-summary {
    cursor: pointer;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--site-text);
    user-select: none;
}

.words-table-block {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--site-surface);
    border: 1px solid var(--site-border);
    border-radius: 0.75rem;
    box-shadow: 0 0.125rem 0.5rem var(--site-shadow);
    overflow: hidden;
}

.words-table-toolbar {
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--site-border);
    background: var(--site-surface-elevated);
}

.words-table-toolbar-label {
    font-size: 0.82rem;
    color: var(--site-text-muted);
    margin: 0;
}

.words-table-toolbar-toggles {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.85rem;
}

.words-table-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.words-table {
    margin-bottom: 0;
}

.words-table thead th {
    font-size: 0.78rem;
    white-space: nowrap;
}

.words-table-empty {
    margin: 0;
    font-size: 0.95rem;
    color: var(--site-text-muted);
}

.home-words-panel-body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.home-words-panel-body .words-table-block {
    flex: 1 1 auto;
    min-height: 0;
}

/* ── Topics table (page + home panel) ──────────────────────── */

.topics-uniform-input {
    height: 38px !important;
    box-sizing: border-box !important;
}

.topics-add-form .form-control,
.topics-add-form textarea.form-control {
    height: 38px !important;
    box-sizing: border-box !important;
}

.topics-add-label {
    font-size: 0.875rem;
    font-weight: 500;
    margin-bottom: 0.35rem;
    color: var(--site-text-muted);
}

.topics-create-block {
    background: #2f4639;
    color: #f0f4f2;
    border-radius: 0.75rem;
    box-shadow: 0 0.25rem 1rem rgba(36, 56, 48, 0.18);
}

.topics-create-block-compact {
    padding: 1rem;
}

.topics-create-header {
    background: #243830;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.topics-create-block .topics-add-label,
.topics-create-block .form-check-label {
    color: #d0d8d4;
}

.topics-create-block .form-control {
    background: #fff;
    border-color: rgba(255, 255, 255, 0.15);
}

.topics-create-block .form-check-input {
    border-color: rgba(255, 255, 255, 0.35);
}

.topics-create-block .invalid-feedback,
.topics-create-block .errorlist {
    color: #ffc9c9;
}

.topics-create-details {
    border: 1px solid var(--site-border);
    border-radius: 0.75rem;
    padding: 0.65rem 0.85rem;
    background: var(--site-surface);
}

.topics-create-summary {
    cursor: pointer;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--site-text);
    user-select: none;
}

.topics-table-block {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--site-surface);
    border: 1px solid var(--site-border);
    border-radius: 0.75rem;
    box-shadow: 0 0.125rem 0.5rem var(--site-shadow);
    overflow: hidden;
}

.topics-table-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.topics-table {
    margin-bottom: 0;
}

.topics-table thead th {
    font-size: 0.78rem;
    white-space: nowrap;
}

.topics-table-empty-cell {
    text-align: center;
    padding: 1.5rem 1rem !important;
    color: var(--site-text-muted);
}

.home-topics-panel-body {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.home-topics-panel-body .topics-table-block {
    flex: 1 1 auto;
    min-height: 0;
}

.home-teacher-panel-body {
    padding: 0;
    overflow: auto;
}

.home-teacher-panel-body.home-center-panel-body {
    padding: 0;
}

.home-teacher-panel .home-center-panel-header {
    position: relative;
    z-index: 3;
}

.home-teacher-panel-body .card-header {
    overflow: visible;
    position: relative;
    z-index: 2;
}

tr.student-row-chosen {
    background-color: var(--chat-row-active-bg);
}

.home-teacher-panel-body .dashboard-embed-root--embedded {
    min-height: 0;
}

.home-teacher-panel-body .dashboard-embed-content {
    padding: 0.75rem 1rem 1.25rem;
}

.dashboard-embed-root--embedded .card {
    margin-bottom: 1rem !important;
}

.dashboard-embed-root--embedded .card:last-child {
    margin-bottom: 0 !important;
}

.student-dashboard-embed-root--embedded .card {
    margin-bottom: 1rem !important;
}

.student-dashboard-embed-root--embedded .card:last-child {
    margin-bottom: 0 !important;
}

@media (max-width: 767.98px) {
    .home-top-bar-inner {
        grid-template-columns: 1fr;
    }

    .home-top-bar-brand {
        padding: 0.75rem 1rem;
    }

    .home-top-bar-actions {
        grid-column: 1;
        justify-content: center;
        padding: 0 1rem 0.75rem;
    }

    .home-split {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .home-split-left {
        border-right: none;
        border-bottom: 1px solid var(--home-nav-border);
    }

    .home-split-center {
        border-right: none;
        border-bottom: 1px solid var(--site-border);
    }

    .home-split-right {
        border-bottom: none;
    }

    .home-split-pane {
        padding: 2rem 1rem;
    }

    .home-split-left.home-split-pane {
        padding: 0;
    }

    .home-split-center.home-split-pane {
        padding: 0;
        min-height: auto;
        overflow: visible;
    }

    .home-center-stack {
        height: auto;
    }

    .home-center-top {
        flex: none;
        min-height: 14rem;
    }

    .home-center-panel-header {
        padding: 1.25rem 1rem 0.65rem;
    }

    .home-center-panel-body {
        padding: 0.75rem 1rem 1rem;
    }

    .home-center-bottom {
        flex: none;
        min-height: 18rem;
    }

    .home-center-bottom.is-collapsed {
        flex: none;
        min-height: 0;
    }

    .home-sr-toggle {
        min-height: 4.75rem;
    }

    .home-sr-content {
        padding: 1rem 1rem 1.25rem;
    }

    .home-sr-content .home-word-widget,
    .home-center-bottom .home-word-widget,
    .home-word-widget {
        width: 90%;
        max-width: 100%;
    }

    .home-word-progress-btn {
        font-size: 0.7rem;
        padding: 0.4rem 0.15rem;
    }
}
