.lms-body {
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, 0.16), transparent 34rem),
        radial-gradient(circle at top right, rgba(16, 185, 129, 0.12), transparent 28rem),
        var(--light);
    min-height: 100vh;
}

.lms-shell {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: 280px minmax(0, 1fr);
    margin: 0 auto;
    max-width: 1500px;
    padding: 6.4rem 1.2rem 2rem;
}

.lms-sidebar,
.lms-panel,
.lms-card,
.lms-player,
.lms-auth-card {
    background: color-mix(in srgb, var(--white) 88%, transparent);
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
}

.lms-sidebar {
    align-self: start;
    backdrop-filter: blur(18px);
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
    position: sticky;
    top: 5.8rem;
}

.lms-user {
    border-bottom: 1px solid var(--border);
    padding: 0.4rem 0.3rem 1rem;
}

.lms-user strong {
    display: block;
    font-size: 1.05rem;
}

.lms-user span {
    color: var(--gray);
    font-size: 0.84rem;
}

.lms-tab {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: var(--dark);
    cursor: pointer;
    display: flex;
    font: inherit;
    font-weight: 700;
    gap: 0.7rem;
    padding: 0.82rem 0.9rem;
    text-align: left;
}

.lms-sidebar-label {
    color: var(--gray);
    display: block;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    margin: 0.85rem 0 0.25rem;
    text-transform: uppercase;
}

.website-setting-tab {
    padding-left: 1.35rem;
}

.website-control-main-tab {
    background: #0f172a;
    color: white;
}

.lms-tab.active,
.lms-tab:hover {
    background: var(--primary);
    color: white;
}

.lms-main {
    display: grid;
    gap: 1.2rem;
}

.lms-hero {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.96), rgba(14, 165, 233, 0.9));
    border-radius: 8px;
    color: white;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1.5rem;
}

.lms-hero h1 {
    font-size: clamp(1.8rem, 4vw, 2.7rem);
    line-height: 1.1;
    margin-bottom: 0.4rem;
}

.lms-hero p,
.lms-kicker {
    opacity: 0.9;
}

.lms-actions,
.lms-filters,
.lms-inline {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.admin-date-filter {
    align-items: center;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid var(--border);
    border-radius: 14px;
    margin: 1rem 0;
    padding: 0.75rem;
}

.admin-date-filter input,
.admin-date-filter select {
    flex: 1 1 150px;
    max-width: 220px;
    width: auto !important;
}

.admin-date-filter input[type="search"] {
    flex: 2 1 260px;
    max-width: 420px;
}

.lms-filter-summary {
    background: var(--light);
    border: 1px solid var(--border);
    border-radius: 999px;
    color: var(--gray);
    flex: 1 1 230px;
    font-size: 0.86rem;
    font-weight: 800;
    min-height: 44px;
    padding: 0.72rem 0.9rem;
}

.lms-btn {
    align-items: center;
    background: var(--primary);
    border: 0;
    border-radius: 8px;
    color: white;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 800;
    gap: 0.45rem;
    justify-content: center;
    min-height: 42px;
    padding: 0.72rem 1rem;
}

.lms-btn.secondary {
    background: var(--success);
}

.lms-btn.light {
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.32);
}

.lms-btn.danger {
    background: var(--danger);
}

.lms-stats {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lms-stat {
    background: var(--white);
    border-radius: 8px;
    padding: 1rem;
}

.lms-stat span {
    color: var(--gray);
    font-size: 0.85rem;
}

.lms-stat strong {
    display: block;
    font-size: 1.8rem;
}

.lms-section {
    display: none;
}

.lms-section.active {
    display: grid;
    gap: 1rem;
}

.lms-panel {
    padding: 1rem;
}

.lms-panel h2 {
    margin-bottom: 0.75rem;
}

.lms-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.admin-section-groups {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-section-group {
    background: white;
    border: 1px solid #dbe3ef;
    border-top: 5px solid #2563eb;
    border-radius: 8px;
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
}

.admin-section-group.account {
    border-top-color: #0f766e;
}

.admin-section-group.website {
    border-top-color: #7c3aed;
}

.admin-section-icon {
    align-items: center;
    background: #dbeafe;
    border-radius: 8px;
    color: #1d4ed8;
    display: flex;
    font-size: 1.35rem;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.admin-section-group.account .admin-section-icon {
    background: #ccfbf1;
    color: #0f766e;
}

.admin-section-group.website .admin-section-icon {
    background: #ede9fe;
    color: #7c3aed;
}

.admin-section-group span {
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.admin-section-group.account span {
    color: #0f766e;
}

.admin-section-group.website span {
    color: #7c3aed;
}

.admin-section-group h2 {
    font-size: 1.12rem;
    margin: 0.2rem 0 0.35rem;
}

.admin-section-group p {
    color: var(--gray);
    line-height: 1.55;
    margin: 0;
}

.admin-section-links {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.admin-section-links .lms-btn {
    font-size: 0.82rem;
    min-height: 36px;
    padding: 0.56rem 0.72rem;
}

.website-settings-hub {
    background: linear-gradient(180deg, #eef6ff 0%, #f8fafc 52%, #ffffff 100%);
    border: 2px solid #bfdbfe;
    border-radius: 8px;
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.website-settings-head {
    align-items: center;
    background: linear-gradient(135deg, #0f172a, #1d4ed8);
    border-radius: 8px;
    color: white;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1.25rem;
}

.website-mode-row {
    align-items: center;
    background: white;
    border: 1px solid #dbe3ef;
    border-left: 5px solid #2563eb;
    border-radius: 8px;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1rem;
}

.website-mode-row strong {
    display: block;
    font-size: 1rem;
    margin-bottom: 0.25rem;
}

.website-mode-row span {
    color: var(--gray);
    line-height: 1.55;
}

.website-settings-head h2 {
    font-size: clamp(1.7rem, 3vw, 2.35rem);
    margin: 0.2rem 0;
}

.website-settings-head p {
    color: #cbd5e1;
}

.website-settings-status {
    display: grid;
    gap: 0.65rem;
    min-width: 170px;
}

.website-settings-status span {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 8px;
    display: grid;
    padding: 0.75rem;
}

.website-settings-status strong {
    font-size: 1.45rem;
}

.website-control-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.website-control-tile {
    align-items: start;
    background: white;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    display: grid;
    gap: 1rem;
    grid-template-columns: auto minmax(0, 1fr);
    padding: 1.1rem;
}

.website-control-tile .lms-btn {
    grid-column: 1 / -1;
    justify-self: start;
}

.website-control-tile.primary {
    border-color: rgba(37, 99, 235, 0.35);
}

.website-control-icon {
    align-items: center;
    background: #e0f2fe;
    border-radius: 8px;
    color: #0369a1;
    display: flex;
    font-size: 1.35rem;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.website-control-tile.primary .website-control-icon {
    background: #dbeafe;
    color: #1d4ed8;
}

.website-control-tile span {
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.website-control-tile h3 {
    margin: 0.2rem 0;
}

.website-control-tile p {
    color: var(--gray);
    line-height: 1.6;
}

.website-settings-strip {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.website-settings-strip span {
    align-items: center;
    background: white;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
    color: var(--dark);
    display: flex;
    font-weight: 700;
    gap: 0.55rem;
    padding: 0.85rem;
}

@media (max-width: 900px) {
    .admin-section-groups,
    .website-settings-head,
    .website-control-grid,
    .website-mode-row,
    .website-settings-strip {
        grid-template-columns: 1fr;
    }
}

.lms-card {
    overflow: hidden;
    padding: 1rem;
}

.lecture-thumb {
    align-items: center;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #0f172a, #2563eb);
    border-radius: 8px;
    color: white;
    display: flex;
    font-size: 2.4rem;
    justify-content: center;
    margin-bottom: 0.9rem;
    overflow: hidden;
}

.lecture-thumb img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.lms-card h3 {
    font-size: 1.02rem;
    margin-bottom: 0.3rem;
}

.lms-meta {
    color: var(--gray);
    font-size: 0.82rem;
    margin-bottom: 0.7rem;
}

.lms-progress {
    background: var(--border);
    border-radius: 999px;
    height: 8px;
    overflow: hidden;
}

.lms-progress span {
    background: var(--success);
    display: block;
    height: 100%;
}

.lms-player video,
.lms-player iframe {
    aspect-ratio: 16 / 9;
    background: #020617;
    border: 0;
    border-radius: 8px;
    display: block;
    width: 100%;
}

.lms-form {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lms-form label {
    color: var(--dark);
    display: flex;
    flex-direction: column;
    font-size: 0.85rem;
    font-weight: 800;
    gap: 0.35rem;
}

.lms-form .wide {
    grid-column: 1 / -1;
}

.lms-form input,
.lms-form select,
.lms-form textarea,
.lms-filters input,
.lms-filters select {
    background: var(--light);
    border: 2px solid var(--border);
    border-radius: 8px;
    color: var(--dark);
    font: inherit;
    min-height: 44px;
    padding: 0.72rem;
    width: 100%;
}

.lms-form textarea {
    min-height: 100px;
    resize: vertical;
}

.lms-table-wrap {
    overflow-x: auto;
}

.lms-table {
    border-collapse: collapse;
    min-width: 760px;
    width: 100%;
}

.lms-table th,
.lms-table td {
    border-bottom: 1px solid var(--border);
    padding: 0.8rem;
    text-align: left;
    vertical-align: top;
}

.lms-table th {
    color: var(--gray);
    font-size: 0.8rem;
    text-transform: uppercase;
}

.lms-badge {
    background: rgba(37, 99, 235, 0.12);
    border-radius: 999px;
    color: var(--primary);
    display: inline-flex;
    font-size: 0.76rem;
    font-weight: 800;
    padding: 0.24rem 0.6rem;
}

.lms-empty {
    color: var(--gray);
    padding: 1rem;
    text-align: center;
}

.lms-auth-page {
    align-items: center;
    display: grid;
    min-height: 100vh;
    padding: 2rem;
}

.lms-auth-card {
    margin: 0 auto;
    max-width: 460px;
    padding: 1.4rem;
    width: 100%;
}

.lms-alert {
    border-radius: 8px;
    font-weight: 700;
    margin-bottom: 0.8rem;
    padding: 0.7rem;
}

.lms-alert.error {
    background: rgba(239, 68, 68, 0.12);
    color: var(--danger);
}

.lms-alert.success {
    background: rgba(16, 185, 129, 0.12);
    color: var(--success);
}

.lms-alert.info {
    background: rgba(37, 99, 235, 0.12);
    color: var(--primary);
}

.lms-form-status {
    color: var(--gray);
    font-size: 0.9rem;
    font-weight: 700;
    margin-top: 0.6rem;
}

.lms-form-status.error {
    color: var(--danger);
}

.lms-form-status.success {
    color: var(--success);
}

@media (max-width: 980px) {
    .lms-shell {
        grid-template-columns: 1fr;
    }

    .lms-sidebar {
        position: static;
    }

    .lms-stats,
    .lms-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .lms-shell {
        padding: 5.5rem 0.75rem 1rem;
    }

    .lms-form {
        grid-template-columns: 1fr;
    }
}

.lms-profile-card {
    grid-column: span 2;
}

.lms-info-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.9rem;
}

.lms-info-list p {
    align-items: center;
    border-bottom: 1px solid var(--border);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: 0;
    padding-bottom: 0.55rem;
}

.lms-info-list strong {
    color: var(--dark);
    font-size: 0.84rem;
}

.lms-info-list span {
    color: var(--gray);
    font-size: 0.84rem;
    text-align: right;
}

.lms-info-compact {
    display: grid;
    gap: 0.25rem;
    min-width: 180px;
}

.lms-info-compact strong {
    color: var(--dark);
    font-size: 0.9rem;
}

.lms-info-compact span {
    color: var(--gray);
    font-size: 0.78rem;
    line-height: 1.35;
}

@media (max-width: 720px) {
    .lms-profile-card {
        grid-column: span 1;
    }

    .lms-info-list p {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.2rem;
    }

    .lms-info-list span {
        text-align: left;
    }
}
.lms-form-status {
    color: var(--success);
    font-size: 0.86rem;
    font-weight: 600;
    min-height: 1.2rem;
}

.lms-modal {
    background: rgba(15, 23, 42, 0.72);
    display: none;
    inset: 0;
    padding: 1rem;
    place-items: center;
    position: fixed;
    z-index: 3000;
}

.lms-modal.open {
    display: grid;
}

.lms-modal-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: var(--shadow);
    display: grid;
    gap: 1rem;
    max-height: 92vh;
    overflow: auto;
    padding: 1.25rem;
    width: min(1080px, 96vw);
}

.lms-modal-head {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.lms-modal-head h2 {
    color: var(--dark);
    margin-top: 0.5rem;
}

.lms-icon-btn {
    align-items: center;
    background: var(--light);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--dark);
    cursor: pointer;
    display: inline-flex;
    height: 2.4rem;
    justify-content: center;
    width: 2.4rem;
}

.student-detail-stats {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.student-detail-stats article {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(16, 185, 129, 0.1));
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1rem;
}

.student-detail-stats span {
    color: var(--gray);
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
}

.student-detail-stats strong {
    color: var(--dark);
    display: block;
    font-size: 1.65rem;
    margin-top: 0.25rem;
}

.student-detail-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.student-detail-card {
    box-shadow: none;
    display: grid;
    gap: 0.65rem;
}

.student-detail-card p {
    align-items: flex-start;
    border-bottom: 1px solid var(--border);
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    margin: 0;
    padding-bottom: 0.55rem;
}

.student-detail-card p:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.student-detail-card strong,
.student-history-list strong {
    color: var(--dark);
}

.student-detail-card span,
.student-history-list span {
    color: var(--gray);
    font-size: 0.84rem;
    text-align: right;
}

.student-history-panel {
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1rem;
}

.student-history-panel h3 {
    color: var(--dark);
}

.student-history-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.75rem;
}

.student-history-list article {
    align-items: center;
    background: var(--light);
    border: 1px solid var(--border);
    border-radius: 8px;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 0.8rem;
}

.student-history-list article div {
    display: grid;
    gap: 0.15rem;
}

@media (max-width: 820px) {
    .student-detail-stats,
    .student-detail-grid {
        grid-template-columns: 1fr;
    }

    .student-history-list article {
        grid-template-columns: 1fr;
    }

    .student-detail-card span,
    .student-history-list span {
        text-align: left;
    }
}

/* Premium dashboard UI refresh: visual-only, keeps all dashboard behavior intact. */
.lms-body {
    background:
        radial-gradient(circle at 12% 0%, rgba(239, 68, 68, 0.12), transparent 24rem),
        radial-gradient(circle at 92% 8%, rgba(17, 24, 39, 0.1), transparent 26rem),
        var(--light);
}

.lms-shell {
    gap: 1.4rem;
}

.lms-sidebar {
    background: color-mix(in srgb, var(--white) 76%, transparent);
    border-radius: 18px;
    box-shadow: var(--premium-shadow);
}

.lms-user {
    background:
        radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.18), transparent 7rem),
        #0a0a0a;
    border: 0;
    border-radius: 14px;
    color: white;
    padding: 1rem;
}

.lms-user span {
    color: rgba(255, 255, 255, 0.68);
}

.lms-tab {
    border: 1px solid transparent;
    border-radius: 14px;
}

.lms-tab.active,
.lms-tab:hover {
    background: var(--dark);
    border-color: color-mix(in srgb, var(--accent) 28%, transparent);
    box-shadow: 0 14px 38px rgba(17, 24, 39, 0.16);
    color: var(--light);
}

.lms-hero {
    background:
        linear-gradient(135deg, rgba(0, 0, 0, 0.88), rgba(34, 34, 34, 0.86)),
        radial-gradient(circle at 84% 12%, rgba(239, 68, 68, 0.22), transparent 18rem);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 18px;
    box-shadow: var(--premium-shadow);
}

.lms-hero h1 {
    letter-spacing: 0;
    text-transform: uppercase;
}

.lms-panel,
.lms-card,
.lms-player,
.lms-auth-card,
.lms-stat,
.lms-modal-card,
.student-history-panel {
    backdrop-filter: blur(18px);
    background: color-mix(in srgb, var(--white) 78%, transparent);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: var(--soft-shadow);
}

.lms-card,
.lms-panel,
.lms-stat {
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.lms-card:hover,
.lms-stat:hover {
    border-color: color-mix(in srgb, var(--accent) 36%, var(--border));
    box-shadow: var(--premium-shadow);
    transform: translateY(-4px);
}

.lms-btn {
    background: var(--dark);
    border-radius: 999px;
    color: var(--light);
}

.lms-btn.secondary,
.lms-btn.light {
    background: color-mix(in srgb, var(--white) 76%, transparent);
    border: 1px solid var(--border);
    color: var(--dark);
}

.lms-btn.danger {
    background: var(--danger);
    color: white;
}

.lms-form input,
.lms-form select,
.lms-form textarea,
.lms-filters input,
.lms-filters select {
    background: color-mix(in srgb, var(--white) 76%, transparent);
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

.lms-table {
    border-collapse: separate;
    border-spacing: 0 0.55rem;
}

.lms-table th {
    color: var(--gray);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.lms-table td {
    background: color-mix(in srgb, var(--white) 76%, transparent);
    border-bottom: 1px solid var(--border);
    border-top: 1px solid var(--border);
}

.lms-table td:first-child {
    border-left: 1px solid var(--border);
    border-radius: 12px 0 0 12px;
}

.lms-table td:last-child {
    border-right: 1px solid var(--border);
    border-radius: 0 12px 12px 0;
}

.lms-badge,
.video-badge {
    border-radius: 999px;
}

.lecture-thumb,
.lms-player iframe,
.lms-player video {
    border-radius: 14px;
    overflow: hidden;
}

.student-detail-stats article {
    background:
        radial-gradient(circle at 80% 0%, rgba(239, 68, 68, 0.12), transparent 8rem),
        color-mix(in srgb, var(--white) 82%, transparent);
    border-radius: 16px;
}

.student-detail-card p,
.student-history-list article {
    border-color: color-mix(in srgb, var(--border) 78%, transparent);
}

.lms-modal {
    backdrop-filter: blur(10px);
}

@media (max-width: 980px) {
    .lms-sidebar {
        display: flex;
        gap: 0.55rem;
        overflow-x: auto;
        padding-bottom: 0.9rem;
    }

    .lms-user {
        min-width: 220px;
    }

    .lms-tab {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}

@media (max-width: 640px) {
    .lms-shell {
        padding-top: 5.9rem;
    }

    .lms-actions,
    .lms-filters {
        align-items: stretch;
        flex-direction: column;
    }

    .lms-btn,
    .lms-filters input,
    .lms-filters select {
        width: 100%;
    }
}

/* Dashboard hierarchy redesign v2. */
.lms-shell {
    grid-template-columns: 92px minmax(0, 1fr);
    max-width: 1600px;
}

.lms-sidebar {
    align-items: center;
    border-radius: 26px;
    justify-items: center;
    min-height: calc(100vh - 8rem);
}

.lms-user {
    aspect-ratio: 1;
    display: grid;
    min-width: 0;
    place-items: center;
    text-align: center;
    width: 64px;
}

.lms-user strong {
    font-size: 0;
}

.lms-user strong::first-letter {
    font-size: 1.4rem;
}

.lms-user span {
    display: none;
}

.lms-tab {
    height: 54px;
    justify-content: center;
    padding: 0;
    position: relative;
    width: 54px;
}

.lms-tab i {
    font-size: 1rem;
}

.lms-tab {
    font-size: 0;
}

.lms-tab:hover::after,
.lms-tab.active::after {
    background: var(--dark);
    border-radius: 999px;
    color: var(--light);
    content: attr(data-lms-tab);
    font-size: 0.72rem;
    font-weight: 800;
    left: 4.2rem;
    letter-spacing: 0.02em;
    padding: 0.45rem 0.7rem;
    position: absolute;
    text-transform: uppercase;
    white-space: nowrap;
    z-index: 5;
}

#adminLogout::after,
#studentLogout::after {
    content: "logout";
}

.lms-main {
    gap: 1rem;
}

.lms-hero {
    min-height: 260px;
    overflow: hidden;
    padding: clamp(1.4rem, 4vw, 2.6rem);
    position: relative;
}

.lms-hero::after {
    background-image: radial-gradient(rgba(255, 255, 255, 0.32) 1px, transparent 1px);
    background-size: 18px 18px;
    content: "";
    inset: 0;
    opacity: 0.32;
    pointer-events: none;
    position: absolute;
}

.lms-hero > * {
    position: relative;
    z-index: 1;
}

.lms-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lms-stat {
    min-height: 128px;
}

.lms-stat strong {
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1;
}

.lms-section.active {
    gap: 1rem;
}

.lms-grid {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.lms-card {
    min-height: 190px;
}

.lms-card h3 {
    font-size: 1.05rem;
}

.lms-panel > h2 {
    align-items: center;
    display: flex;
    font-size: clamp(1.25rem, 2vw, 1.8rem);
    gap: 0.65rem;
    text-transform: uppercase;
}

.lms-panel > h2::before {
    background: var(--accent);
    border-radius: 999px;
    content: "";
    height: 0.7rem;
    width: 0.7rem;
}

.lms-table-wrap {
    border-radius: 18px;
}

.lms-modal-card {
    border-radius: 24px;
}

@media (max-width: 980px) {
    .lms-shell {
        grid-template-columns: 1fr;
    }

    .lms-sidebar {
        align-items: center;
        border-radius: 20px;
        display: flex;
        min-height: 0;
    }

    .lms-user {
        min-width: 64px;
    }

    .lms-tab:hover::after,
    .lms-tab.active::after {
        display: none;
    }

    .lms-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .lms-stats {
        grid-template-columns: 1fr;
    }

    .lms-sidebar {
        gap: 0.45rem;
    }
}

/* Restore readable dashboard options while keeping the premium layout. */
.lms-shell {
    grid-template-columns: 280px minmax(0, 1fr);
}

.lms-sidebar {
    align-items: stretch;
    justify-items: stretch;
}

.lms-user {
    aspect-ratio: auto;
    min-width: 0;
    place-items: start;
    text-align: left;
    width: auto;
}

.lms-user strong {
    font-size: 1.05rem;
}

.lms-user span {
    display: block;
}

.lms-tab {
    font-size: 0.95rem;
    height: auto;
    justify-content: flex-start;
    padding: 0.82rem 0.9rem;
    width: 100%;
}

.lms-tab:hover::after,
.lms-tab.active::after,
#adminLogout::after,
#studentLogout::after {
    display: none;
}

@media (max-width: 980px) {
    .lms-shell {
        grid-template-columns: 1fr;
    }

    .lms-sidebar {
        align-items: stretch;
    }

    .lms-tab {
        width: auto;
    }
}

/* Dashboard device optimization final pass. */
.lms-body {
    max-width: 100%;
    overflow-x: hidden;
}

.lms-shell,
.lms-main,
.lms-sidebar,
.lms-panel,
.lms-card,
.lms-table-wrap {
    min-width: 0;
}

.lms-table-wrap {
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    overflow-x: auto;
}

.lms-table {
    min-width: 760px;
}

.lms-form input,
.lms-form select,
.lms-form textarea,
.lms-filters input,
.lms-filters select {
    min-width: 0;
    width: 100%;
}

@media (max-width: 1180px) {
    .lms-shell {
        gap: 1rem;
        grid-template-columns: 240px minmax(0, 1fr);
        padding-inline: 1rem;
    }

    .lms-sidebar {
        padding: 0.85rem;
    }

    .lms-tab {
        font-size: 0.86rem;
        padding: 0.72rem 0.75rem;
    }

    .lms-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .lms-shell {
        grid-template-columns: 1fr;
        padding-top: 6rem;
    }

    .lms-sidebar {
        align-items: center;
        display: flex;
        gap: 0.55rem;
        min-height: 0;
        overflow-x: auto;
        padding: 0.75rem;
        position: sticky;
        top: 82px;
        z-index: 20;
    }

    .lms-user {
        flex: 0 0 210px;
    }

    .lms-tab {
        flex: 0 0 auto;
        white-space: nowrap;
        width: auto;
    }

    .lms-hero {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .lms-actions,
    .lms-filters {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (max-width: 720px) {
    .lms-shell {
        padding-inline: 0.8rem;
        padding-top: 5.5rem;
    }

    .lms-sidebar {
        border-radius: 16px;
        top: 76px;
    }

    .lms-user {
        flex-basis: 180px;
        padding: 0.8rem;
    }

    .lms-hero,
    .lms-panel,
    .lms-card,
    .lms-stat {
        border-radius: 14px;
    }

    .lms-hero {
        padding: 1.1rem;
    }

    .lms-hero h1 {
        font-size: clamp(1.6rem, 8vw, 2.3rem);
        line-height: 1.05;
        overflow-wrap: anywhere;
    }

    .lms-stats,
    .lms-grid,
    .student-detail-grid,
    .student-detail-stats {
        grid-template-columns: 1fr;
    }

    .lms-form {
        grid-template-columns: 1fr;
    }

    .lms-form .wide {
        grid-column: auto;
    }

    .lms-btn {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 460px) {
    .lms-shell {
        padding-inline: 0.65rem;
    }

    .lms-sidebar {
        gap: 0.4rem;
    }

    .lms-user {
        flex-basis: 150px;
    }

    .lms-tab {
        font-size: 0.78rem;
        padding: 0.62rem 0.68rem;
    }

    .lms-panel {
        padding: 0.9rem;
    }

    .lms-card {
        min-height: auto;
    }

    .lms-table {
        min-width: 680px;
    }
}

/* Admin grouped navigation: keep all three sections readable on smaller screens. */
@media (max-width: 980px) {
    .lms-sidebar {
        align-items: stretch;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        overflow-x: visible;
        position: static;
    }

    .lms-user,
    .lms-sidebar-label {
        grid-column: 1 / -1;
    }

    .lms-sidebar-label {
        margin-top: 0.35rem;
    }

    .lms-tab {
        justify-content: flex-start;
        white-space: normal;
        width: 100%;
    }
}

@media (max-width: 520px) {
    .lms-sidebar {
        grid-template-columns: 1fr;
    }
}

/* Full admin dashboard redesign. */
.lms-body {
    background:
        linear-gradient(135deg, rgba(239, 246, 255, 0.92), rgba(248, 250, 252, 0.96) 42%, rgba(236, 253, 245, 0.74)),
        #f6f8fb;
    color: #111827;
}

.lms-shell {
    gap: 1.35rem;
    grid-template-columns: 300px minmax(0, 1fr);
    max-width: 1580px;
}

.lms-sidebar {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(148, 163, 184, 0.28);
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.1);
    gap: 0.45rem;
    padding: 0.9rem;
}

.lms-user {
    background: linear-gradient(135deg, #111827, #1e3a8a);
    border: 0;
    border-radius: 8px;
    color: white;
    margin-bottom: 0.3rem;
    padding: 1rem;
}

.lms-user strong {
    font-size: 1.12rem;
}

.lms-user span {
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.5;
}

.lms-sidebar-label {
    align-items: center;
    color: #64748b;
    display: flex;
    gap: 0.45rem;
    letter-spacing: 0.08em;
    margin: 0.95rem 0 0.25rem;
}

.lms-sidebar-label::before {
    background: #cbd5e1;
    border-radius: 999px;
    content: "";
    height: 6px;
    width: 6px;
}

.lms-tab {
    border: 1px solid transparent;
    color: #334155;
    font-weight: 800;
    gap: 0.75rem;
    min-height: 44px;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.lms-tab i {
    align-items: center;
    background: #f1f5f9;
    border-radius: 8px;
    color: #0f172a;
    display: inline-flex;
    flex: 0 0 30px;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.lms-tab:hover,
.lms-tab.active {
    background: #0f172a;
    border-color: rgba(15, 23, 42, 0.12);
    color: white;
    transform: translateY(-1px);
}

.lms-tab:hover i,
.lms-tab.active i {
    background: rgba(255, 255, 255, 0.14);
    color: white;
}

.website-control-main-tab {
    background: #eff6ff;
    color: #1d4ed8;
}

.website-setting-tab {
    padding-left: 0.9rem;
}

.lms-main {
    gap: 1.1rem;
}

.lms-hero {
    background:
        linear-gradient(135deg, rgba(15, 23, 42, 0.98), rgba(30, 64, 175, 0.93) 58%, rgba(15, 118, 110, 0.9));
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 26px 70px rgba(15, 23, 42, 0.18);
    min-height: 300px;
}

.lms-hero::after {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.12) 1px, transparent 1px);
    background-size: 34px 34px;
    opacity: 0.18;
}

.lms-hero h1 {
    max-width: 780px;
}

.lms-hero p {
    max-width: 760px;
}

.admin-hero-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1rem;
}

.admin-hero-badges span {
    align-items: center;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    color: white;
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 800;
    gap: 0.45rem;
    min-height: 38px;
    padding: 0.55rem 0.75rem;
}

.lms-actions {
    align-self: end;
}

.lms-actions .lms-btn.light {
    background: rgba(255, 255, 255, 0.94);
    border-color: rgba(255, 255, 255, 0.2);
    color: #0f172a;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
}

.lms-stats {
    gap: 0.9rem;
}

.lms-stat {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.22);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
    min-height: 116px;
    overflow: hidden;
    position: relative;
}

.lms-stat::after {
    align-items: center;
    border-radius: 8px;
    color: white;
    display: flex;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    height: 44px;
    justify-content: center;
    position: absolute;
    right: 1rem;
    top: 1rem;
    width: 44px;
}

.lms-stat:nth-child(1)::after {
    background: #2563eb;
    content: "\f0c0";
}

.lms-stat:nth-child(2)::after {
    background: #0f766e;
    content: "\f03d";
}

.lms-stat:nth-child(3)::after {
    background: #7c3aed;
    content: "\f02d";
}

.lms-stat:nth-child(4)::after {
    background: #f59e0b;
    content: "\f4fc";
}

.lms-stat span {
    color: #64748b;
    font-weight: 800;
    text-transform: uppercase;
}

.lms-stat strong {
    color: #0f172a;
    margin-top: 0.65rem;
}

.admin-section-groups {
    gap: 1rem;
}

.admin-section-group {
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-top: 0;
    box-shadow: 0 20px 48px rgba(15, 23, 42, 0.08);
    min-height: 300px;
    overflow: hidden;
    padding: 1.15rem;
    position: relative;
}

.admin-section-group::before {
    background: #2563eb;
    content: "";
    height: 5px;
    inset: 0 0 auto;
    position: absolute;
}

.admin-section-group.account::before {
    background: #0f766e;
}

.admin-section-group.website::before {
    background: #7c3aed;
}

.admin-section-icon {
    box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.12);
}

.admin-section-links {
    align-self: end;
}

.admin-section-links .lms-btn.secondary {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    color: #0f172a;
    width: auto;
}

.admin-section-links .lms-btn.secondary:hover {
    background: #0f172a;
    color: white;
}

.lms-panel,
.lms-card,
.website-settings-hub,
.website-control-tile,
.website-mode-row,
.website-settings-strip span {
    background: rgba(255, 255, 255, 0.96);
    border-color: rgba(148, 163, 184, 0.24);
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.07);
}

.lms-panel {
    border-radius: 8px;
    padding: 1.15rem;
}

.lms-panel > h2 {
    color: #0f172a;
    font-size: clamp(1.12rem, 2vw, 1.55rem);
    letter-spacing: 0;
    text-transform: none;
}

.lms-panel > h2::before {
    background: #2563eb;
    height: 0.55rem;
    width: 0.55rem;
}

.lms-form input,
.lms-form select,
.lms-form textarea,
.lms-filters input,
.lms-filters select {
    background: #f8fafc;
    border: 1px solid #dbe3ef;
    border-radius: 8px;
}

.lms-table-wrap {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: none;
}

.lms-table th {
    background: #f8fafc;
    color: #475569;
}

.website-settings-hub {
    background: linear-gradient(180deg, #ffffff, #f8fafc);
}

.website-settings-head {
    background: linear-gradient(135deg, #111827, #1d4ed8 58%, #0f766e);
}

@media (max-width: 1180px) {
    .lms-shell {
        grid-template-columns: 260px minmax(0, 1fr);
    }
}

@media (max-width: 980px) {
    .lms-shell {
        grid-template-columns: 1fr;
    }

    .lms-sidebar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        position: static;
    }

    .lms-user,
    .lms-sidebar-label {
        grid-column: 1 / -1;
    }

    .lms-hero {
        min-height: auto;
    }
}

@media (max-width: 720px) {
    .lms-sidebar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.34rem;
        padding: 0.56rem;
    }

    .lms-user {
        padding: 0.7rem 0.8rem;
    }

    .lms-user strong {
        font-size: 1rem;
    }

    .lms-user span {
        font-size: 0.76rem;
    }

    .lms-sidebar-label {
        font-size: 0.64rem;
        margin: 0.26rem 0 0.05rem;
    }

    .lms-tab {
        font-size: 0.74rem;
        gap: 0.34rem;
        min-height: 32px;
        padding: 0.32rem 0.4rem;
    }

    .lms-tab i {
        border-radius: 7px;
        flex-basis: 22px;
        font-size: 0.76rem;
        height: 22px;
        width: 22px;
    }

    .admin-section-group {
        min-height: auto;
    }

    .admin-section-links .lms-btn.secondary {
        width: 100%;
    }
}

@media (max-width: 520px) {
    .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 380px) {
    .lms-sidebar {
        grid-template-columns: 1fr;
    }
}

/* Nothing-inspired admin UI: monochrome, dotted, minimal, high-contrast. */
body.lms-body {
    background:
        radial-gradient(circle, rgba(17, 17, 17, 0.07) 1px, transparent 1px),
        linear-gradient(180deg, #fafafa, #f4f4f2);
    background-size: 18px 18px, auto;
    color: #111;
}

body.lms-body .header {
    background: rgba(250, 250, 250, 0.86);
    border-bottom: 1px solid #d8d8d2;
    backdrop-filter: blur(18px);
}

body.lms-body .logo {
    background: #111;
    border: 1px solid #111;
    border-radius: 8px;
    color: #fff;
    padding: 0.62rem 0.9rem;
}

body.lms-body .logo i {
    color: #ff1f1f;
}

body.lms-body .lms-shell {
    gap: 1rem;
    grid-template-columns: 310px minmax(0, 1fr);
    max-width: 1540px;
}

body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid #d8d8d2;
    border-radius: 8px;
    box-shadow: 0 12px 36px rgba(17, 17, 17, 0.07);
}

body.lms-body .lms-sidebar {
    gap: 0.42rem;
    padding: 0.85rem;
}

body.lms-body .lms-user {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.2) 1px, transparent 1px),
        #111;
    background-size: 12px 12px, auto;
    border: 1px solid #111;
    border-radius: 8px;
    color: #fff;
    padding: 1rem;
}

body.lms-body .lms-user strong,
body.lms-body .lms-hero h1 {
    font-family: "Poppins", system-ui, sans-serif;
    font-weight: 800;
    letter-spacing: 0;
}

body.lms-body .lms-user span {
    color: rgba(255, 255, 255, 0.68);
}

body.lms-body .lms-sidebar-label {
    color: #777;
    font-size: 0.68rem;
    letter-spacing: 0.16em;
    margin: 0.9rem 0 0.16rem;
}

body.lms-body .lms-sidebar-label::before {
    background: #ff1f1f;
    height: 5px;
    width: 5px;
}

body.lms-body .lms-tab {
    border: 1px solid transparent;
    border-radius: 8px;
    color: #111;
    font-size: 0.9rem;
    font-weight: 800;
    min-height: 42px;
    padding: 0.58rem 0.62rem;
}

body.lms-body .lms-tab i {
    background: #f1f1ee;
    border: 1px solid #e0e0da;
    border-radius: 8px;
    color: #111;
    height: 28px;
    width: 28px;
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active {
    background: #111;
    border-color: #111;
    color: #fff;
    transform: none;
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i {
    background: #fff;
    border-color: #fff;
    color: #111;
}

body.lms-body .website-control-main-tab {
    background: #f5f5f1;
    color: #111;
}

body.lms-body .lms-main {
    gap: 1rem;
}

body.lms-body .lms-hero {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.17) 1px, transparent 1px),
        linear-gradient(135deg, #111 0%, #1c1c1a 65%, #3b0b0b 100%);
    background-size: 14px 14px, auto;
    border: 1px solid #111;
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(17, 17, 17, 0.16);
    min-height: 280px;
}

body.lms-body .lms-hero::after {
    display: none;
}

body.lms-body .lms-kicker {
    color: inherit;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    opacity: 0.76;
    text-transform: uppercase;
}

body.lms-body .lms-hero h1 {
    color: #fff;
    font-size: clamp(2rem, 4.8vw, 4rem);
    line-height: 0.98;
    max-width: 860px;
    text-transform: uppercase;
}

body.lms-body .lms-hero p {
    color: rgba(255, 255, 255, 0.78);
    max-width: 760px;
}

body.lms-body .admin-hero-badges span,
body.lms-body .lms-actions .lms-btn.light {
    background: #fff;
    border: 1px solid #fff;
    border-radius: 8px;
    color: #111;
    box-shadow: none;
}

body.lms-body .admin-hero-badges span i {
    color: #ff1f1f;
}

body.lms-body .lms-btn {
    background: #111;
    border: 1px solid #111;
    border-radius: 8px;
    color: #fff;
}

body.lms-body .lms-btn.secondary {
    background: #fff;
    border-color: #d8d8d2;
    color: #111;
}

body.lms-body .lms-btn.secondary:hover,
body.lms-body .lms-btn:hover {
    background: #ff1f1f;
    border-color: #ff1f1f;
    color: #fff;
}

body.lms-body .lms-stat {
    min-height: 106px;
    padding: 1rem;
}

body.lms-body .lms-stat::after {
    background: #111;
    border-radius: 8px;
    color: #fff;
}

body.lms-body .lms-stat:nth-child(4)::after {
    background: #ff1f1f;
}

body.lms-body .lms-stat span,
body.lms-body .lms-meta,
body.lms-body .admin-section-group p,
body.lms-body .website-control-tile p,
body.lms-body .website-mode-row span {
    color: #6b6b66;
}

body.lms-body .lms-stat strong,
body.lms-body .admin-section-group h2,
body.lms-body .lms-panel > h2 {
    color: #111;
}

body.lms-body .admin-section-group {
    background:
        radial-gradient(circle, rgba(17, 17, 17, 0.05) 1px, transparent 1px),
        rgba(255, 255, 255, 0.96);
    background-size: 14px 14px, auto;
    border: 1px solid #d8d8d2;
    border-radius: 8px;
    box-shadow: 0 14px 34px rgba(17, 17, 17, 0.07);
    min-height: 280px;
}

body.lms-body .admin-section-group::before {
    background: #111;
}

body.lms-body .admin-section-group.account::before {
    background: #ff1f1f;
}

body.lms-body .admin-section-group.website::before {
    background: #111;
}

body.lms-body .admin-section-icon,
body.lms-body .admin-section-group.account .admin-section-icon,
body.lms-body .admin-section-group.website .admin-section-icon {
    background: #111;
    border: 1px solid #111;
    border-radius: 8px;
    box-shadow: none;
    color: #fff;
}

body.lms-body .admin-section-group span,
body.lms-body .admin-section-group.account span,
body.lms-body .admin-section-group.website span,
body.lms-body .website-control-tile span {
    color: #ff1f1f;
    letter-spacing: 0.14em;
}

body.lms-body .lms-panel > h2 {
    text-transform: uppercase;
}

body.lms-body .lms-panel > h2::before {
    background: #ff1f1f;
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select {
    background: #fff;
    border: 1px solid #d8d8d2;
    border-radius: 8px;
    color: #111;
}

body.lms-body .lms-table-wrap {
    border: 1px solid #d8d8d2;
}

body.lms-body .lms-table th {
    background: #111;
    color: #fff;
}

body.lms-body .lms-table td {
    border-bottom-color: #e7e7e2;
}

body.lms-body .website-settings-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.18) 1px, transparent 1px),
        #111;
    background-size: 14px 14px, auto;
    border-radius: 8px;
}

body.lms-body .website-settings-status span {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.18);
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 260px minmax(0, 1fr);
    }
}

@media (max-width: 980px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        position: static;
    }

    body.lms-body .lms-user,
    body.lms-body .lms-sidebar-label {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    body.lms-body .lms-sidebar {
        gap: 0.34rem;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        padding: 0.56rem;
    }

    body.lms-body .lms-user {
        padding: 0.7rem 0.8rem;
    }

    body.lms-body .lms-tab {
        font-size: 0.74rem;
        gap: 0.34rem;
        min-height: 32px;
        padding: 0.32rem 0.4rem;
    }

    body.lms-body .lms-tab i {
        flex-basis: 22px;
        font-size: 0.76rem;
        height: 22px;
        width: 22px;
    }

    body.lms-body .admin-section-group {
        min-height: auto;
    }
}

@media (max-width: 520px) {
    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 380px) {
    body.lms-body .lms-sidebar {
        grid-template-columns: 1fr;
    }
}

/* Nothing alternate format: modular control-board layout. */
body.lms-body {
    background:
        linear-gradient(90deg, rgba(17, 17, 17, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(17, 17, 17, 0.045) 1px, transparent 1px),
        #f7f7f4;
    background-size: 28px 28px;
}

body.lms-body .lms-shell {
    align-items: start;
    grid-template-columns: 280px minmax(0, 1fr);
}

body.lms-body .lms-sidebar {
    background: #fff;
    border: 2px solid #111;
    box-shadow: 8px 8px 0 #111;
    gap: 0.38rem;
    top: 6rem;
}

body.lms-body .lms-user {
    background:
        linear-gradient(135deg, rgba(255, 31, 31, 0.18), transparent 42%),
        #111;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    min-height: 102px;
}

body.lms-body .lms-sidebar-label {
    border-top: 1px dashed #c9c9c3;
    padding-top: 0.7rem;
}

body.lms-body .lms-tab {
    background: #fff;
    border: 1px solid #e2e2dc;
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active {
    background: #111;
    box-shadow: 4px 4px 0 #ff1f1f;
}

body.lms-body .lms-hero {
    align-items: end;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.18) 1px, transparent 1px),
        linear-gradient(135deg, #111 0 62%, #ff1f1f 62% 64%, #f7f7f4 64% 100%);
    background-size: 12px 12px, auto;
    border: 2px solid #111;
    box-shadow: 8px 8px 0 #111;
    color: white;
    grid-template-columns: minmax(0, 1fr) 240px;
    min-height: 330px;
}

body.lms-body .lms-hero h1 {
    font-size: clamp(2.4rem, 5.7vw, 5rem);
    max-width: 920px;
}

body.lms-body .lms-actions {
    align-self: stretch;
    display: grid;
    grid-template-columns: 1fr;
}

body.lms-body .lms-actions .lms-btn.light {
    align-items: center;
    background: #fff;
    border: 2px solid #111;
    box-shadow: 4px 4px 0 #111;
    justify-content: flex-start;
}

body.lms-body .lms-actions .lms-btn.light:hover {
    background: #ff1f1f;
    border-color: #111;
    color: #fff;
}

body.lms-body .lms-stats {
    grid-template-columns: 1.35fr 1fr 1fr 1fr;
}

body.lms-body .lms-stat {
    border: 2px solid #111;
    box-shadow: 5px 5px 0 #111;
}

body.lms-body .lms-stat:first-child {
    background: #111;
    color: #fff;
}

body.lms-body .lms-stat:first-child span,
body.lms-body .lms-stat:first-child strong {
    color: #fff;
}

body.lms-body .lms-stat:first-child::after {
    background: #ff1f1f;
}

body.lms-body .admin-command-strip {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .admin-command-strip button {
    align-items: center;
    background: #fff;
    border: 2px solid #111;
    border-radius: 8px;
    box-shadow: 5px 5px 0 #111;
    color: #111;
    cursor: pointer;
    display: flex;
    font: inherit;
    font-weight: 900;
    gap: 0.65rem;
    justify-content: flex-start;
    min-height: 62px;
    padding: 0.85rem;
    text-align: left;
}

body.lms-body .admin-command-strip button:nth-child(2) {
    background: #111;
    color: #fff;
}

body.lms-body .admin-command-strip button:nth-child(2) i {
    color: #ff1f1f;
}

body.lms-body .admin-command-strip button:hover {
    background: #ff1f1f;
    color: #fff;
}

body.lms-body .admin-command-strip i {
    align-items: center;
    background: #f1f1ee;
    border-radius: 8px;
    color: #111;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

body.lms-body .admin-section-groups {
    grid-template-columns: 1.25fr 0.85fr 1fr;
}

body.lms-body .admin-section-group {
    border: 2px solid #111;
    box-shadow: 7px 7px 0 #111;
    min-height: 320px;
}

body.lms-body .admin-section-group.learning {
    grid-row: span 2;
}

body.lms-body .admin-section-group.account {
    background:
        radial-gradient(circle, rgba(255, 31, 31, 0.11) 1px, transparent 1px),
        #fff;
    background-size: 13px 13px, auto;
}

body.lms-body .admin-section-group.website {
    background: #111;
    color: #fff;
}

body.lms-body .admin-section-group.website h2,
body.lms-body .admin-section-group.website p {
    color: #fff;
}

body.lms-body .admin-section-group.website .admin-section-icon {
    background: #fff;
    color: #111;
}

body.lms-body .admin-section-links .lms-btn.secondary {
    border: 2px solid #111;
    box-shadow: 3px 3px 0 #111;
}

body.lms-body .lms-panel {
    border: 2px solid #111;
    box-shadow: 6px 6px 0 #111;
}

body.lms-body .lms-table-wrap {
    border: 2px solid #111;
}

body.lms-body .website-settings-hub {
    border: 2px solid #111;
    box-shadow: 7px 7px 0 #111;
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        box-shadow: 5px 5px 0 #111;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        position: static;
    }

    body.lms-body .lms-user,
    body.lms-body .lms-sidebar-label {
        grid-column: 1 / -1;
    }

    body.lms-body .lms-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    body.lms-body .lms-stats,
    body.lms-body .admin-command-strip,
    body.lms-body .admin-section-groups {
        grid-template-columns: 1fr;
    }

    body.lms-body .admin-section-group.learning {
        grid-row: auto;
    }
}

@media (max-width: 620px) {
    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.lms-body .lms-hero {
        box-shadow: 5px 5px 0 #111;
        min-height: auto;
    }
}

/* Section visibility redesigned format. */
body.lms-body .visibility-board {
    background: #fff;
    border: 2px solid #111;
    border-radius: 8px;
    box-shadow: 7px 7px 0 #111;
    display: grid;
    gap: 1rem;
    overflow: hidden;
    padding: 1rem;
}

body.lms-body .visibility-board-head {
    align-items: end;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.18) 1px, transparent 1px),
        linear-gradient(135deg, #111 0 70%, #ff1f1f 70% 72%, #f7f7f4 72% 100%);
    background-size: 13px 13px, auto;
    border: 2px solid #111;
    border-radius: 8px;
    color: #fff;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1.15rem;
}

body.lms-body .visibility-board-head h2 {
    color: #fff;
    font-size: clamp(1.8rem, 4vw, 3.1rem);
    line-height: 0.98;
    margin: 0.2rem 0 0.45rem;
    text-transform: uppercase;
}

body.lms-body .visibility-board-head p {
    color: rgba(255, 255, 255, 0.78);
    max-width: 780px;
}

body.lms-body .visibility-leds {
    display: grid;
    gap: 0.5rem;
    min-width: 230px;
}

body.lms-body .visibility-leds span {
    align-items: center;
    background: #fff;
    border: 2px solid #111;
    border-radius: 8px;
    color: #111;
    display: flex;
    font-size: 0.82rem;
    font-weight: 900;
    gap: 0.5rem;
    min-height: 42px;
    padding: 0.6rem 0.7rem;
}

body.lms-body .visibility-leds i {
    color: #ff1f1f;
}

body.lms-body .visibility-console {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.lms-body .visibility-tile {
    background:
        radial-gradient(circle, rgba(17, 17, 17, 0.055) 1px, transparent 1px),
        #fff;
    background-size: 14px 14px, auto;
    border: 2px solid #111;
    border-radius: 8px;
    box-shadow: 5px 5px 0 #111;
    display: grid;
    gap: 0.9rem;
    min-height: 238px;
    padding: 1rem;
}

body.lms-body .visibility-tile.videos,
body.lms-body .visibility-tile.pyq {
    transform: translateY(0.6rem);
}

body.lms-body .visibility-tile.prompts {
    background:
        radial-gradient(circle, rgba(255, 31, 31, 0.11) 1px, transparent 1px),
        #fff;
    background-size: 14px 14px, auto;
}

body.lms-body .visibility-tile.pyq {
    background: #111;
    color: #fff;
}

body.lms-body .visibility-tile.pyq p,
body.lms-body .visibility-tile.pyq h3 {
    color: #fff;
}

body.lms-body .visibility-tile-head {
    align-items: center;
    display: flex;
    gap: 0.75rem;
}

body.lms-body .visibility-tile-head > i {
    align-items: center;
    background: #111;
    border: 2px solid #111;
    border-radius: 8px;
    color: #fff;
    display: flex;
    flex: 0 0 46px;
    height: 46px;
    justify-content: center;
    width: 46px;
}

body.lms-body .visibility-tile.pyq .visibility-tile-head > i {
    background: #fff;
    color: #111;
}

body.lms-body .visibility-tile-head span {
    color: #ff1f1f;
    display: block;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

body.lms-body .visibility-tile-head h3 {
    color: #111;
    font-size: 1.15rem;
    line-height: 1.15;
    margin: 0.16rem 0 0;
}

body.lms-body .visibility-tile p {
    color: #666;
    line-height: 1.55;
    margin: 0;
}

body.lms-body .visibility-control-row {
    align-self: end;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.lms-body .visibility-control-row label {
    color: #111;
    display: grid;
    font-size: 0.78rem;
    font-weight: 900;
    gap: 0.35rem;
    text-transform: uppercase;
}

body.lms-body .visibility-tile.pyq .visibility-control-row label {
    color: #fff;
}

body.lms-body .visibility-control-row select {
    appearance: none;
    background:
        linear-gradient(45deg, transparent 50%, #111 50%) calc(100% - 18px) 50% / 7px 7px no-repeat,
        linear-gradient(135deg, #111 50%, transparent 50%) calc(100% - 13px) 50% / 7px 7px no-repeat,
        #fff;
    border: 2px solid #111;
    border-radius: 8px;
    color: #111;
    font: inherit;
    font-size: 0.86rem;
    min-height: 44px;
    padding: 0.62rem 2rem 0.62rem 0.7rem;
    width: 100%;
}

body.lms-body .visibility-save-bar {
    align-items: center;
    background: #f7f7f4;
    border: 2px solid #111;
    border-radius: 8px;
    box-shadow: 5px 5px 0 #111;
    display: grid;
    gap: 1rem;
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 1rem;
}

body.lms-body .visibility-save-bar strong {
    display: block;
    font-size: 1rem;
    margin-bottom: 0.2rem;
}

body.lms-body .visibility-save-bar span {
    color: #666;
    display: block;
}

body.lms-body .visibility-save-bar .lms-btn {
    box-shadow: 4px 4px 0 #ff1f1f;
    min-width: 230px;
}

body.lms-body .visibility-category-panel {
    margin-top: 0.35rem;
}

body.lms-body .visibility-category-panel .lms-card {
    border: 2px solid #111;
    box-shadow: 4px 4px 0 #111;
}

@media (max-width: 900px) {
    body.lms-body .visibility-board-head,
    body.lms-body .visibility-console,
    body.lms-body .visibility-control-row,
    body.lms-body .visibility-save-bar {
        grid-template-columns: 1fr;
    }

    body.lms-body .visibility-leds {
        min-width: 0;
    }

    body.lms-body .visibility-tile.videos,
    body.lms-body .visibility-tile.pyq {
        transform: none;
    }

    body.lms-body .visibility-save-bar .lms-btn {
        min-width: 0;
        width: 100%;
    }
}

/* Main website-style admin dashboard with working light/dark theme. */
body.lms-body {
    --admin-bg: #f8fafc;
    --admin-surface: #ffffff;
    --admin-surface-soft: #f1f5f9;
    --admin-text: #0f172a;
    --admin-muted: #64748b;
    --admin-border: #e2e8f0;
    --admin-primary: #2563eb;
    --admin-secondary: #1e40af;
    --admin-accent: #f59e0b;
    --admin-success: #10b981;
    --admin-danger: #ef4444;
    --admin-shadow: 0 18px 50px rgba(15, 23, 42, 0.09);
    background:
        radial-gradient(circle at 14% 0%, rgba(37, 99, 235, 0.13), transparent 30rem),
        radial-gradient(circle at 92% 10%, rgba(16, 185, 129, 0.1), transparent 28rem),
        var(--admin-bg);
    background-size: auto;
    color: var(--admin-text);
}

body.lms-body[data-theme="dark"] {
    --admin-bg: #0f172a;
    --admin-surface: #1e293b;
    --admin-surface-soft: #111827;
    --admin-text: #f8fafc;
    --admin-muted: #94a3b8;
    --admin-border: #334155;
    --admin-primary: #3b82f6;
    --admin-secondary: #1d4ed8;
    --admin-accent: #fbbf24;
    --admin-success: #34d399;
    --admin-danger: #f87171;
    --admin-shadow: 0 22px 60px rgba(0, 0, 0, 0.28);
    background:
        radial-gradient(circle at 14% 0%, rgba(59, 130, 246, 0.18), transparent 30rem),
        radial-gradient(circle at 92% 10%, rgba(16, 185, 129, 0.12), transparent 28rem),
        var(--admin-bg);
}

body.lms-body .header {
    background: color-mix(in srgb, var(--admin-surface) 90%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--admin-border) 75%, transparent);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

body.lms-body[data-theme="dark"] .header {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
}

body.lms-body .logo {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--admin-primary);
    padding: 0;
}

body.lms-body .logo i {
    color: var(--admin-primary);
}

body.lms-body .nav-menu {
    background: color-mix(in srgb, var(--admin-surface) 82%, transparent);
    border: 1px solid color-mix(in srgb, var(--admin-border) 70%, transparent);
    border-radius: 999px;
}

body.lms-body .nav-menu a {
    color: var(--admin-text);
}

body.lms-body .lms-shell {
    align-items: start;
    gap: 1.2rem;
    grid-template-columns: 300px minmax(0, 1fr);
    max-width: 1500px;
    padding-top: 6.4rem;
}

body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar {
    background: color-mix(in srgb, var(--admin-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--admin-border) 82%, transparent);
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
}

body.lms-body .lms-sidebar {
    backdrop-filter: blur(18px);
    gap: 0.55rem;
    padding: 1rem;
    position: sticky;
    top: 5.8rem;
}

body.lms-body .lms-user {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border: 0;
    box-shadow: none;
    color: #fff;
    min-height: auto;
    padding: 1rem;
}

body.lms-body .lms-user span {
    color: rgba(255, 255, 255, 0.78);
}

body.lms-body .lms-sidebar-label {
    border-top: 0;
    color: var(--admin-muted);
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    margin: 0.85rem 0 0.18rem;
    padding: 0;
}

body.lms-body .lms-sidebar-label::before {
    background: var(--admin-accent);
}

body.lms-body .lms-tab {
    background: transparent;
    border: 0;
    box-shadow: none;
    color: var(--admin-text);
    min-height: 44px;
    padding: 0.72rem 0.8rem;
    transform: none;
}

body.lms-body .lms-tab i {
    background: color-mix(in srgb, var(--admin-primary) 10%, transparent);
    border: 0;
    color: var(--admin-primary);
    height: 30px;
    width: 30px;
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active {
    background: var(--admin-primary);
    border: 0;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--admin-primary) 25%, transparent);
    color: #fff;
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

body.lms-body .website-control-main-tab {
    background: color-mix(in srgb, var(--admin-primary) 10%, transparent);
    color: var(--admin-primary);
}

body.lms-body .lms-main {
    gap: 1.2rem;
}

body.lms-body .lms-hero {
    align-items: center;
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border: 0;
    box-shadow: 0 24px 60px color-mix(in srgb, var(--admin-primary) 22%, transparent);
    color: #fff;
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 300px;
    overflow: hidden;
    padding: clamp(1.5rem, 4vw, 2.6rem);
    position: relative;
    text-align: left;
}

body.lms-body .lms-hero::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' fill='%23ffffff22'%3E%3Cpolygon points='0,100 1000,0 1000,100'/%3E%3C/svg%3E");
    background-size: cover;
    content: "";
    display: block;
    inset: 0;
    opacity: 0.6;
    pointer-events: none;
    position: absolute;
}

body.lms-body .lms-hero > * {
    position: relative;
    z-index: 1;
}

body.lms-body .lms-hero h1 {
    color: #fff;
    font-size: clamp(2.1rem, 5vw, 3.75rem);
    line-height: 1.08;
    max-width: 850px;
    text-transform: none;
}

body.lms-body .lms-hero p {
    color: rgba(255, 255, 255, 0.88);
    max-width: 760px;
}

body.lms-body .lms-kicker {
    color: inherit;
    letter-spacing: 0.12em;
    opacity: 0.88;
}

body.lms-body .admin-hero-badges span,
body.lms-body .lms-actions .lms-btn.light {
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: none;
    color: #fff;
}

body.lms-body .admin-hero-badges span i {
    color: #fff;
}

body.lms-body .lms-actions {
    align-self: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}

body.lms-body .lms-btn {
    background: var(--admin-primary);
    border: 0;
    border-radius: 999px;
    box-shadow: none;
    color: #fff;
}

body.lms-body .lms-btn.secondary {
    background: color-mix(in srgb, var(--admin-success) 92%, #000 0%);
    border: 0;
    color: #fff;
}

body.lms-body .lms-btn.danger {
    background: var(--admin-danger);
}

body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-secondary);
    color: #fff;
    transform: translateY(-2px);
}

body.lms-body .lms-stats {
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .lms-stat {
    border-top: 4px solid var(--admin-primary);
    min-height: 126px;
    padding: 1.2rem;
    position: relative;
}

body.lms-body .lms-stat:first-child {
    background: color-mix(in srgb, var(--admin-surface) 94%, transparent);
    color: var(--admin-text);
}

body.lms-body .lms-stat span,
body.lms-body .lms-stat:first-child span {
    color: var(--admin-muted);
}

body.lms-body .lms-stat strong,
body.lms-body .lms-stat:first-child strong {
    color: var(--admin-text);
}

body.lms-body .lms-stat::after,
body.lms-body .lms-stat:first-child::after,
body.lms-body .lms-stat:nth-child(4)::after {
    background: var(--admin-primary);
    border-radius: 8px;
    color: #fff;
}

body.lms-body .admin-command-strip {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .admin-command-strip button {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
    min-height: 72px;
}

body.lms-body .admin-command-strip button:nth-child(2) {
    background: var(--admin-primary);
    color: #fff;
}

body.lms-body .admin-command-strip button:hover {
    background: var(--admin-secondary);
    color: #fff;
}

body.lms-body .admin-command-strip i {
    background: color-mix(in srgb, var(--admin-primary) 10%, transparent);
    color: var(--admin-primary);
}

body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

body.lms-body .admin-section-groups {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.lms-body .admin-section-group,
body.lms-body .admin-section-group.learning,
body.lms-body .admin-section-group.account,
body.lms-body .admin-section-group.website {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-top: 4px solid var(--admin-primary);
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
    grid-row: auto;
    min-height: 285px;
}

body.lms-body .admin-section-group.account {
    border-top-color: var(--admin-success);
}

body.lms-body .admin-section-group.website {
    border-top-color: var(--admin-accent);
}

body.lms-body .admin-section-group::before {
    display: none;
}

body.lms-body .admin-section-group h2,
body.lms-body .admin-section-group.website h2,
body.lms-body .admin-section-group p,
body.lms-body .admin-section-group.website p,
body.lms-body .lms-panel > h2 {
    color: var(--admin-text);
}

body.lms-body .admin-section-group p,
body.lms-body .lms-meta,
body.lms-body .website-control-tile p,
body.lms-body .website-mode-row span,
body.lms-body .visibility-tile p,
body.lms-body .visibility-save-bar span {
    color: var(--admin-muted);
}

body.lms-body .admin-section-icon,
body.lms-body .admin-section-group.account .admin-section-icon,
body.lms-body .admin-section-group.website .admin-section-icon,
body.lms-body .visibility-tile-head > i,
body.lms-body .visibility-tile.pyq .visibility-tile-head > i {
    background: color-mix(in srgb, var(--admin-primary) 12%, transparent);
    border: 0;
    color: var(--admin-primary);
}

body.lms-body .admin-section-group span,
body.lms-body .admin-section-group.account span,
body.lms-body .admin-section-group.website span,
body.lms-body .website-control-tile span,
body.lms-body .visibility-tile-head span {
    color: var(--admin-primary);
    letter-spacing: 0.08em;
}

body.lms-body .admin-section-links .lms-btn.secondary {
    background: var(--admin-primary);
    border: 0;
    box-shadow: none;
    color: #fff;
}

body.lms-body .lms-panel > h2 {
    letter-spacing: 0;
    text-transform: none;
}

body.lms-body .lms-panel > h2::before {
    background: var(--admin-accent);
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    color: var(--admin-text);
}

body.lms-body .lms-table-wrap {
    border: 1px solid var(--admin-border);
    box-shadow: none;
}

body.lms-body .lms-table th {
    background: var(--admin-surface-soft);
    color: var(--admin-text);
}

body.lms-body .lms-table td {
    border-bottom-color: var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border: 0;
    color: #fff;
}

body.lms-body .website-settings-head h2,
body.lms-body .visibility-board-head h2 {
    color: #fff;
    text-transform: none;
}

body.lms-body .website-settings-head p,
body.lms-body .visibility-board-head p {
    color: rgba(255, 255, 255, 0.86);
}

body.lms-body .visibility-board {
    padding: 1rem;
}

body.lms-body .visibility-console {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.lms-body .visibility-tile,
body.lms-body .visibility-tile.pyq,
body.lms-body .visibility-tile.prompts {
    background: var(--admin-surface);
    color: var(--admin-text);
    transform: none;
}

body.lms-body .visibility-tile.pyq h3,
body.lms-body .visibility-tile.pyq p,
body.lms-body .visibility-tile.pyq .visibility-control-row label {
    color: var(--admin-text);
}

body.lms-body .visibility-control-row label {
    color: var(--admin-text);
}

body.lms-body .visibility-save-bar {
    background: var(--admin-surface-soft);
}

body.lms-body .visibility-save-bar .lms-btn {
    box-shadow: none;
}

body.lms-body .visibility-leds span,
body.lms-body .website-settings-status span {
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
}

body.lms-body .visibility-leds i {
    color: #fff;
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        position: static;
    }

    body.lms-body .lms-user,
    body.lms-body .lms-sidebar-label {
        grid-column: 1 / -1;
    }

    body.lms-body .lms-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    body.lms-body .lms-stats,
    body.lms-body .admin-command-strip,
    body.lms-body .admin-section-groups,
    body.lms-body .visibility-console,
    body.lms-body .visibility-board-head,
    body.lms-body .visibility-save-bar {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-actions {
        justify-content: stretch;
    }
}

@media (max-width: 640px) {
    body.lms-body .lms-shell {
        padding-top: 5.6rem;
    }

    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.lms-body .lms-hero {
        min-height: auto;
        padding: 1.25rem;
    }

    body.lms-body .visibility-control-row {
        grid-template-columns: 1fr;
    }
}

/* Nothing UI final admin theme with readable dark mode. */
body.lms-body {
    --admin-bg: #f6f6f2;
    --admin-surface: #ffffff;
    --admin-surface-soft: #f1f1ed;
    --admin-text: #111111;
    --admin-muted: #6f6f68;
    --admin-border: #d8d8d0;
    --admin-primary: #111111;
    --admin-secondary: #2a2a26;
    --admin-accent: #ff2b2b;
    --admin-success: #111111;
    --admin-danger: #ff2b2b;
    --admin-shadow: 0 18px 50px rgba(17, 17, 17, 0.08);
    background:
        radial-gradient(circle, rgba(17, 17, 17, 0.08) 1px, transparent 1.2px),
        linear-gradient(180deg, #fbfbf8, var(--admin-bg));
    background-size: 18px 18px, auto;
    color: var(--admin-text);
}

body.lms-body[data-theme="dark"] {
    --admin-bg: #0c0c0b;
    --admin-surface: #151514;
    --admin-surface-soft: #1f1f1c;
    --admin-text: #f7f7f2;
    --admin-muted: #aaa9a1;
    --admin-border: #34342f;
    --admin-primary: #f7f7f2;
    --admin-secondary: #e6e6df;
    --admin-accent: #ff3b3b;
    --admin-success: #f7f7f2;
    --admin-danger: #ff3b3b;
    --admin-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.08) 1px, transparent 1.2px),
        linear-gradient(180deg, #070707, var(--admin-bg));
    background-size: 18px 18px, auto;
}

body.lms-body .header {
    background: color-mix(in srgb, var(--admin-surface) 88%, transparent);
    border-bottom: 1px solid var(--admin-border);
    box-shadow: none;
}

body.lms-body .nav-container {
    min-height: 76px;
}

body.lms-body .logo {
    background: var(--admin-text);
    border: 1px solid var(--admin-text);
    border-radius: 8px;
    color: var(--admin-surface);
    font-weight: 800;
    padding: 0.64rem 0.9rem;
}

body.lms-body .logo i {
    color: var(--admin-accent);
}

body.lms-body .nav-menu {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
}

body.lms-body .nav-menu a {
    color: var(--admin-text);
}

body.lms-body .lms-shell {
    gap: 1rem;
    grid-template-columns: 304px minmax(0, 1fr);
}

body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .admin-command-strip button,
body.lms-body .admin-section-group,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar {
    background: color-mix(in srgb, var(--admin-surface) 94%, transparent);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
}

body.lms-body .lms-sidebar {
    gap: 0.48rem;
    padding: 0.9rem;
}

body.lms-body .lms-user {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.16) 1px, transparent 1.2px),
        #111111;
    background-size: 12px 12px, auto;
    border: 1px solid #111111;
    color: #ffffff;
    padding: 1rem;
}

body.lms-body .lms-user span {
    color: rgba(255, 255, 255, 0.66);
}

body.lms-body .lms-sidebar-label {
    align-items: center;
    color: var(--admin-muted);
    display: flex;
    font-size: 0.68rem;
    font-weight: 900;
    gap: 0.45rem;
    letter-spacing: 0.16em;
    margin: 0.8rem 0 0.16rem;
    text-transform: uppercase;
}

body.lms-body .lms-sidebar-label::before {
    background: var(--admin-accent);
    border-radius: 999px;
    content: "";
    height: 6px;
    width: 6px;
}

body.lms-body .lms-tab {
    background: transparent;
    border: 1px solid transparent;
    color: var(--admin-text);
    font-weight: 900;
}

body.lms-body .lms-tab i {
    background: var(--admin-surface-soft);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active {
    background: var(--admin-text);
    color: var(--admin-surface);
    box-shadow: none;
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i {
    background: var(--admin-surface);
    color: var(--admin-text);
}

body.lms-body .website-control-main-tab {
    background: var(--admin-surface-soft);
    color: var(--admin-text);
}

body.lms-body .lms-hero {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.16) 1px, transparent 1.2px),
        linear-gradient(135deg, #111 0 68%, var(--admin-accent) 68% 70%, #efefe9 70% 100%);
    background-size: 13px 13px, auto;
    border: 1px solid #111;
    box-shadow: var(--admin-shadow);
    color: white;
    min-height: 315px;
}

body.lms-body[data-theme="dark"] .lms-hero {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.14) 1px, transparent 1.2px),
        linear-gradient(135deg, #050505 0 68%, var(--admin-accent) 68% 70%, #22221f 70% 100%);
}

body.lms-body .lms-hero::after {
    display: none;
}

body.lms-body .lms-hero h1 {
    color: #fff;
    font-size: clamp(2.2rem, 5vw, 4.4rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: 0.98;
    text-transform: uppercase;
}

body.lms-body .lms-hero p {
    color: rgba(255, 255, 255, 0.78);
}

body.lms-body .lms-kicker {
    color: inherit;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

body.lms-body .admin-hero-badges span,
body.lms-body .lms-actions .lms-btn.light {
    background: #ffffff;
    border: 1px solid #ffffff;
    color: #111111;
}

body.lms-body .admin-hero-badges span i,
body.lms-body .lms-actions .lms-btn.light i {
    color: var(--admin-accent);
}

body.lms-body .lms-btn {
    background: var(--admin-text);
    border: 1px solid var(--admin-text);
    border-radius: 8px;
    color: var(--admin-surface);
    font-weight: 900;
}

body.lms-body .lms-btn.secondary {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-btn.danger,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-accent);
    border-color: var(--admin-accent);
    color: #fff;
}

body.lms-body .lms-stat {
    border-top: 0;
    min-height: 120px;
}

body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    background: var(--admin-accent);
    content: "";
    height: 4px;
    inset: 0 0 auto;
    position: absolute;
}

body.lms-body .lms-stat::after,
body.lms-body .lms-stat:first-child::after,
body.lms-body .lms-stat:nth-child(4)::after {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-stat span,
body.lms-body .lms-meta,
body.lms-body .admin-section-group p,
body.lms-body .website-control-tile p,
body.lms-body .website-mode-row span,
body.lms-body .visibility-tile p,
body.lms-body .visibility-save-bar span {
    color: var(--admin-muted);
}

body.lms-body .lms-stat strong,
body.lms-body .admin-section-group h2,
body.lms-body .admin-section-group.website h2,
body.lms-body .admin-section-group.website p,
body.lms-body .lms-panel > h2 {
    color: var(--admin-text);
}

body.lms-body .admin-command-strip button {
    border-color: var(--admin-border);
    box-shadow: none;
    color: var(--admin-text);
}

body.lms-body .admin-command-strip button:nth-child(2),
body.lms-body .admin-command-strip button:hover {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .admin-section-group.account .admin-section-icon,
body.lms-body .admin-section-group.website .admin-section-icon,
body.lms-body .visibility-tile-head > i,
body.lms-body .visibility-tile.pyq .visibility-tile-head > i {
    background: var(--admin-text);
    border: 1px solid var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .admin-command-strip button:nth-child(2) i,
body.lms-body .admin-command-strip button:hover i {
    background: var(--admin-surface);
    color: var(--admin-text);
}

body.lms-body .admin-section-group,
body.lms-body .admin-section-group.learning,
body.lms-body .admin-section-group.account,
body.lms-body .admin-section-group.website {
    background:
        radial-gradient(circle, color-mix(in srgb, var(--admin-text) 7%, transparent) 1px, transparent 1.2px),
        var(--admin-surface);
    background-size: 14px 14px, auto;
    border-top: 0;
    overflow: hidden;
    position: relative;
}

body.lms-body .admin-section-group::before {
    display: block;
}

body.lms-body .admin-section-group span,
body.lms-body .admin-section-group.account span,
body.lms-body .admin-section-group.website span,
body.lms-body .website-control-tile span,
body.lms-body .visibility-tile-head span {
    color: var(--admin-accent);
    font-weight: 900;
    letter-spacing: 0.14em;
}

body.lms-body .lms-panel > h2 {
    font-weight: 900;
    text-transform: uppercase;
}

body.lms-body .lms-panel > h2::before {
    background: var(--admin-accent);
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-table th {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-table td {
    color: var(--admin-text);
}

body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.15) 1px, transparent 1.2px),
        #111111;
    background-size: 13px 13px, auto;
    border: 1px solid #111111;
}

body.lms-body[data-theme="dark"] .website-settings-head,
body.lms-body[data-theme="dark"] .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.12) 1px, transparent 1.2px),
        #050505;
}

body.lms-body .visibility-tile,
body.lms-body .visibility-tile.pyq,
body.lms-body .visibility-tile.prompts {
    background:
        radial-gradient(circle, color-mix(in srgb, var(--admin-text) 6%, transparent) 1px, transparent 1.2px),
        var(--admin-surface);
    background-size: 14px 14px, auto;
}

body.lms-body .visibility-save-bar {
    background: var(--admin-surface-soft);
}

body.lms-body .visibility-leds span,
body.lms-body .website-settings-status span {
    background: #ffffff;
    border: 1px solid #ffffff;
    color: #111111;
}

body.lms-body .visibility-leds i {
    color: var(--admin-accent);
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        position: static;
    }
}

@media (max-width: 900px) {
    body.lms-body .admin-command-strip,
    body.lms-body .admin-section-groups,
    body.lms-body .visibility-console,
    body.lms-body .visibility-board-head,
    body.lms-body .visibility-save-bar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.lms-body .lms-hero {
        min-height: auto;
    }
}

/* FINAL OVERRIDE: force black/white Nothing admin UI. Keep this last. */
body.lms-body {
    --primary: #111111 !important;
    --secondary: #111111 !important;
    --accent: #111111 !important;
    --success: #111111 !important;
    --danger: #111111 !important;
    --purple: #111111 !important;
    --orange: #111111 !important;
    --dark: #111111 !important;
    --light: #f7f7f7 !important;
    --gray: #666666 !important;
    --white: #ffffff !important;
    --border: #dddddd !important;
    --admin-bg: #f7f7f7 !important;
    --admin-surface: #ffffff !important;
    --admin-surface-soft: #eeeeee !important;
    --admin-text: #111111 !important;
    --admin-muted: #666666 !important;
    --admin-border: #dddddd !important;
    --admin-primary: #111111 !important;
    --admin-secondary: #111111 !important;
    --admin-accent: #111111 !important;
    --admin-success: #111111 !important;
    --admin-danger: #111111 !important;
    background:
        radial-gradient(circle, rgba(0, 0, 0, 0.08) 1px, transparent 1.2px),
        #f7f7f7 !important;
    background-size: 18px 18px, auto !important;
    color: #111111 !important;
}

body.lms-body[data-theme="dark"] {
    --primary: #ffffff !important;
    --secondary: #ffffff !important;
    --accent: #ffffff !important;
    --success: #ffffff !important;
    --danger: #ffffff !important;
    --purple: #ffffff !important;
    --orange: #ffffff !important;
    --dark: #ffffff !important;
    --light: #090909 !important;
    --gray: #aaaaaa !important;
    --white: #151515 !important;
    --border: #333333 !important;
    --admin-bg: #090909 !important;
    --admin-surface: #151515 !important;
    --admin-surface-soft: #222222 !important;
    --admin-text: #ffffff !important;
    --admin-muted: #aaaaaa !important;
    --admin-border: #333333 !important;
    --admin-primary: #ffffff !important;
    --admin-secondary: #ffffff !important;
    --admin-accent: #ffffff !important;
    --admin-success: #ffffff !important;
    --admin-danger: #ffffff !important;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.08) 1px, transparent 1.2px),
        #090909 !important;
    background-size: 18px 18px, auto !important;
    color: #ffffff !important;
}

body.lms-body .header,
body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .admin-stack-category,
body.lms-body .admin-command-strip button,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar,
body.lms-body .lms-modal-card {
    background:
        radial-gradient(circle, color-mix(in srgb, var(--admin-text) 5%, transparent) 1px, transparent 1.2px),
        var(--admin-surface) !important;
    background-size: 14px 14px, auto !important;
    border-color: var(--admin-border) !important;
    box-shadow: 0 18px 44px rgba(17, 17, 17, 0.08) !important;
    color: var(--admin-text) !important;
}

body.lms-body[data-theme="dark"] .header,
body.lms-body[data-theme="dark"] .lms-sidebar,
body.lms-body[data-theme="dark"] .lms-panel,
body.lms-body[data-theme="dark"] .lms-card,
body.lms-body[data-theme="dark"] .lms-stat,
body.lms-body[data-theme="dark"] .admin-stack-category,
body.lms-body[data-theme="dark"] .admin-command-strip button,
body.lms-body[data-theme="dark"] .website-settings-hub,
body.lms-body[data-theme="dark"] .website-control-tile,
body.lms-body[data-theme="dark"] .website-mode-row,
body.lms-body[data-theme="dark"] .website-settings-strip span,
body.lms-body[data-theme="dark"] .visibility-board,
body.lms-body[data-theme="dark"] .visibility-tile,
body.lms-body[data-theme="dark"] .visibility-save-bar,
body.lms-body[data-theme="dark"] .lms-modal-card {
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.45) !important;
}

body.lms-body .logo,
body.lms-body .lms-user,
body.lms-body .lms-hero,
body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.15) 1px, transparent 1.2px),
        #111111 !important;
    background-size: 13px 13px, auto !important;
    border-color: #111111 !important;
    color: #ffffff !important;
}

body.lms-body[data-theme="dark"] .logo,
body.lms-body[data-theme="dark"] .lms-user,
body.lms-body[data-theme="dark"] .lms-hero,
body.lms-body[data-theme="dark"] .website-settings-head,
body.lms-body[data-theme="dark"] .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.1) 1px, transparent 1.2px),
        #000000 !important;
    color: #ffffff !important;
}

body.lms-body .lms-hero::after {
    display: none !important;
}

body.lms-body .lms-hero h1,
body.lms-body .website-settings-head h2,
body.lms-body .visibility-board-head h2 {
    color: #ffffff !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}

body.lms-body .lms-hero p,
body.lms-body .lms-user span,
body.lms-body .website-settings-head p,
body.lms-body .visibility-board-head p {
    color: rgba(255, 255, 255, 0.72) !important;
}

body.lms-body .lms-tab,
body.lms-body .admin-stack-list button,
body.lms-body .admin-command-strip button,
body.lms-body .lms-btn.secondary {
    background: var(--admin-surface) !important;
    border: 1px solid var(--admin-border) !important;
    color: var(--admin-text) !important;
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active,
body.lms-body .admin-stack-list button:hover,
body.lms-body .admin-command-strip button:hover,
body.lms-body .admin-command-strip button:nth-child(2),
body.lms-body .lms-btn,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-text) !important;
    border-color: var(--admin-text) !important;
    color: var(--admin-surface) !important;
}

body.lms-body .lms-tab i,
body.lms-body .admin-stack-list i,
body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .website-control-icon,
body.lms-body .visibility-tile-head > i {
    background: var(--admin-surface-soft) !important;
    border: 1px solid var(--admin-border) !important;
    color: var(--admin-text) !important;
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i,
body.lms-body .admin-stack-list button:hover i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: var(--admin-surface) !important;
    color: var(--admin-text) !important;
}

body.lms-body .lms-panel > h2,
body.lms-body .lms-stat strong,
body.lms-body .admin-stack-category h2,
body.lms-body .lms-card h3,
body.lms-body .visibility-tile-head h3,
body.lms-body .website-control-tile h3,
body.lms-body .lms-table td {
    color: var(--admin-text) !important;
}

body.lms-body .lms-meta,
body.lms-body .lms-stat span,
body.lms-body .admin-stack-category p,
body.lms-body .visibility-tile p,
body.lms-body .website-control-tile p {
    color: var(--admin-muted) !important;
}

body.lms-body .lms-table th,
body.lms-body .admin-stack-category header > span,
body.lms-body .lms-stat::after {
    background: var(--admin-text) !important;
    color: var(--admin-surface) !important;
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface) !important;
    border-color: var(--admin-border) !important;
    color: var(--admin-text) !important;
}

body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before,
body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    background: var(--admin-text) !important;
}

/* Final black-white dotted admin UI. */
body.lms-body {
    --admin-bg: #f7f7f3;
    --admin-surface: #ffffff;
    --admin-surface-soft: #f0f0eb;
    --admin-text: #111111;
    --admin-muted: #6d6d66;
    --admin-border: #d9d9d2;
    --admin-primary: #111111;
    --admin-secondary: #2b2b27;
    --admin-accent: #ff3030;
    --admin-success: #111111;
    --admin-danger: #ff3030;
    --admin-shadow: 0 18px 46px rgba(17, 17, 17, 0.08);
    background:
        radial-gradient(circle, rgba(17, 17, 17, 0.08) 1px, transparent 1.25px),
        linear-gradient(180deg, #fbfbf8, var(--admin-bg));
    background-size: 18px 18px, auto;
    color: var(--admin-text);
}

body.lms-body[data-theme="dark"] {
    --admin-bg: #0c0c0b;
    --admin-surface: #171716;
    --admin-surface-soft: #22221f;
    --admin-text: #f8f8f3;
    --admin-muted: #aaa9a1;
    --admin-border: #363631;
    --admin-primary: #f8f8f3;
    --admin-secondary: #e8e8df;
    --admin-accent: #ff4242;
    --admin-success: #f8f8f3;
    --admin-danger: #ff4242;
    --admin-shadow: 0 24px 70px rgba(0, 0, 0, 0.44);
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.08) 1px, transparent 1.25px),
        linear-gradient(180deg, #080807, var(--admin-bg));
    background-size: 18px 18px, auto;
}

body.lms-body .header {
    background: color-mix(in srgb, var(--admin-surface) 90%, transparent);
    border-bottom: 1px solid var(--admin-border);
    box-shadow: none;
}

body.lms-body .logo {
    background: var(--admin-text);
    border: 1px solid var(--admin-text);
    border-radius: 8px;
    color: var(--admin-surface);
    padding: 0.62rem 0.9rem;
}

body.lms-body .logo i {
    color: var(--admin-accent);
}

body.lms-body .nav-menu {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
}

body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .admin-command-strip button,
body.lms-body .admin-section-group,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar {
    background:
        radial-gradient(circle, color-mix(in srgb, var(--admin-text) 5%, transparent) 1px, transparent 1.2px),
        color-mix(in srgb, var(--admin-surface) 96%, transparent);
    background-size: 14px 14px, auto;
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
}

body.lms-body .lms-user,
body.lms-body .lms-hero,
body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.16) 1px, transparent 1.2px),
        #111111;
    background-size: 13px 13px, auto;
    border: 1px solid #111111;
    color: #ffffff;
}

body.lms-body[data-theme="dark"] .lms-user,
body.lms-body[data-theme="dark"] .lms-hero,
body.lms-body[data-theme="dark"] .website-settings-head,
body.lms-body[data-theme="dark"] .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.12) 1px, transparent 1.2px),
        #050505;
}

body.lms-body .lms-hero {
    border: 0;
    min-height: 310px;
}

body.lms-body .lms-hero::after {
    display: none;
}

body.lms-body .lms-hero h1 {
    color: #ffffff;
    font-size: clamp(2.2rem, 5vw, 4.2rem);
    font-weight: 900;
    line-height: 0.98;
    text-transform: uppercase;
}

body.lms-body .lms-hero p,
body.lms-body .website-settings-head p,
body.lms-body .visibility-board-head p {
    color: rgba(255, 255, 255, 0.76);
}

body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before {
    background: var(--admin-accent);
}

body.lms-body .lms-tab,
body.lms-body .admin-command-strip button {
    color: var(--admin-text);
}

body.lms-body .lms-tab i,
body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .visibility-tile-head > i {
    background: var(--admin-surface-soft);
    color: var(--admin-text);
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active,
body.lms-body .admin-command-strip button:nth-child(2),
body.lms-body .admin-command-strip button:hover,
body.lms-body .lms-btn {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: var(--admin-surface);
    color: var(--admin-text);
}

body.lms-body .lms-btn {
    border: 1px solid var(--admin-text);
    border-radius: 8px;
}

body.lms-body .lms-btn.secondary {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-btn.danger,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-accent);
    border-color: var(--admin-accent);
    color: #ffffff;
}

body.lms-body .admin-hero-badges span,
body.lms-body .lms-actions .lms-btn.light,
body.lms-body .visibility-leds span,
body.lms-body .website-settings-status span {
    background: #ffffff;
    border: 1px solid #ffffff;
    color: #111111;
}

body.lms-body .admin-hero-badges span i,
body.lms-body .lms-actions .lms-btn.light i,
body.lms-body .visibility-leds i {
    color: var(--admin-accent);
}

body.lms-body .lms-stat {
    border-top: 0;
    overflow: hidden;
    position: relative;
}

body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    background: var(--admin-accent);
    content: "";
    display: block;
    height: 4px;
    inset: 0 0 auto;
    position: absolute;
}

body.lms-body .lms-stat::after {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .admin-section-group,
body.lms-body .admin-section-group.learning,
body.lms-body .admin-section-group.account,
body.lms-body .admin-section-group.website {
    border-top: 0;
    overflow: hidden;
    position: relative;
}

body.lms-body .admin-section-group span,
body.lms-body .website-control-tile span,
body.lms-body .visibility-tile-head span {
    color: var(--admin-accent);
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-table th {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-table td,
body.lms-body .lms-stat strong,
body.lms-body .admin-section-group h2,
body.lms-body .lms-panel > h2 {
    color: var(--admin-text);
}

body.lms-body .lms-meta,
body.lms-body .lms-stat span,
body.lms-body .admin-section-group p,
body.lms-body .visibility-tile p,
body.lms-body .visibility-save-bar span {
    color: var(--admin-muted);
}

/* Strict black and white admin UI: no color accents. */
body.lms-body {
    --admin-accent: #111111;
    --admin-danger: #111111;
    --admin-success: #111111;
    --admin-primary: #111111;
    --admin-secondary: #2b2b2b;
}

body.lms-body[data-theme="dark"] {
    --admin-accent: #f8f8f3;
    --admin-danger: #f8f8f3;
    --admin-success: #f8f8f3;
    --admin-primary: #f8f8f3;
    --admin-secondary: #d9d9d2;
}

body.lms-body .logo i,
body.lms-body .admin-hero-badges span i,
body.lms-body .lms-actions .lms-btn.light i,
body.lms-body .visibility-leds i,
body.lms-body .admin-section-group span,
body.lms-body .website-control-tile span,
body.lms-body .visibility-tile-head span,
body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before {
    color: inherit;
}

body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before,
body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    background: var(--admin-text);
}

body.lms-body .lms-btn.danger,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-text);
    border-color: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .logo i,
body.lms-body .admin-hero-badges span i,
body.lms-body .lms-actions .lms-btn.light i,
body.lms-body .visibility-leds i {
    color: #111111;
}

body.lms-body[data-theme="dark"] .admin-hero-badges span i,
body.lms-body[data-theme="dark"] .lms-actions .lms-btn.light i,
body.lms-body[data-theme="dark"] .visibility-leds i {
    color: #111111;
}

/* Absolute monochrome lock for admin: black, white, and neutral grays only. */
body.lms-body {
    --primary: #111111;
    --secondary: #111111;
    --accent: #111111;
    --success: #111111;
    --danger: #111111;
    --purple: #111111;
    --orange: #111111;
    --dark: #111111;
    --light: #f7f7f7;
    --gray: #666666;
    --white: #ffffff;
    --border: #dddddd;
    --admin-accent: #111111;
    --admin-danger: #111111;
    --admin-success: #111111;
    --admin-primary: #111111;
    --admin-secondary: #111111;
    background:
        radial-gradient(circle, rgba(0, 0, 0, 0.08) 1px, transparent 1.25px),
        #f7f7f7;
    background-size: 18px 18px, auto;
}

body.lms-body[data-theme="dark"] {
    --primary: #ffffff;
    --secondary: #ffffff;
    --accent: #ffffff;
    --success: #ffffff;
    --danger: #ffffff;
    --purple: #ffffff;
    --orange: #ffffff;
    --dark: #ffffff;
    --light: #090909;
    --gray: #aaaaaa;
    --white: #151515;
    --border: #333333;
    --admin-accent: #ffffff;
    --admin-danger: #ffffff;
    --admin-success: #ffffff;
    --admin-primary: #ffffff;
    --admin-secondary: #ffffff;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.08) 1px, transparent 1.25px),
        #090909;
    background-size: 18px 18px, auto;
}

body.lms-body .lms-hero,
body.lms-body .lms-user,
body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.16) 1px, transparent 1.25px),
        #111111;
    background-size: 13px 13px, auto;
    color: #ffffff;
}

body.lms-body[data-theme="dark"] .lms-hero,
body.lms-body[data-theme="dark"] .lms-user,
body.lms-body[data-theme="dark"] .website-settings-head,
body.lms-body[data-theme="dark"] .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.1) 1px, transparent 1.25px),
        #000000;
}

body.lms-body .logo,
body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active,
body.lms-body .lms-btn,
body.lms-body .admin-command-strip button:hover,
body.lms-body .admin-command-strip button:nth-child(2) {
    background: #111111;
    border-color: #111111;
    color: #ffffff;
}

body.lms-body[data-theme="dark"] .logo,
body.lms-body[data-theme="dark"] .lms-tab:hover,
body.lms-body[data-theme="dark"] .lms-tab.active,
body.lms-body[data-theme="dark"] .lms-btn,
body.lms-body[data-theme="dark"] .admin-command-strip button:hover,
body.lms-body[data-theme="dark"] .admin-command-strip button:nth-child(2) {
    background: #ffffff;
    border-color: #ffffff;
    color: #000000;
}

body.lms-body i,
body.lms-body .logo i,
body.lms-body .lms-tab i,
body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .visibility-tile-head > i,
body.lms-body .admin-hero-badges span i,
body.lms-body .lms-actions .lms-btn.light i,
body.lms-body .visibility-leds i {
    color: currentColor;
}

body.lms-body .lms-tab i,
body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .visibility-tile-head > i {
    background: #eeeeee;
    border-color: #dddddd;
    color: #111111;
}

body.lms-body[data-theme="dark"] .lms-tab i,
body.lms-body[data-theme="dark"] .admin-command-strip i,
body.lms-body[data-theme="dark"] .admin-section-icon,
body.lms-body[data-theme="dark"] .visibility-tile-head > i {
    background: #222222;
    border-color: #333333;
    color: #ffffff;
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: #ffffff;
    color: #111111;
}

body.lms-body[data-theme="dark"] .lms-tab:hover i,
body.lms-body[data-theme="dark"] .lms-tab.active i,
body.lms-body[data-theme="dark"] .admin-command-strip button:hover i,
body.lms-body[data-theme="dark"] .admin-command-strip button:nth-child(2) i {
    background: #000000;
    color: #ffffff;
}

body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before,
body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    background: currentColor;
}

/* Nothing stacked category dashboard layout. */
body.lms-body .lms-shell {
    grid-template-columns: 320px minmax(0, 1fr);
}

body.lms-body .lms-sidebar {
    border: 1px solid #111111;
    box-shadow: none;
    gap: 0.35rem;
}

body.lms-body[data-theme="dark"] .lms-sidebar {
    border-color: #ffffff;
}

body.lms-body .lms-sidebar-label {
    border-bottom: 1px solid #d7d7d2;
    color: #111111;
    margin: 0.95rem 0 0.25rem;
    padding-bottom: 0.35rem;
}

body.lms-body[data-theme="dark"] .lms-sidebar-label {
    border-bottom-color: #333333;
    color: #ffffff;
}

body.lms-body .lms-tab {
    border: 1px solid transparent;
    min-height: 40px;
    padding: 0.55rem 0.65rem;
}

body.lms-body .lms-tab:not(.active):hover {
    border-color: #111111;
}

body.lms-body[data-theme="dark"] .lms-tab:not(.active):hover {
    border-color: #ffffff;
}

body.lms-body .lms-hero {
    min-height: 250px;
}

body.lms-body .lms-hero h1 {
    max-width: 760px;
}

body.lms-body .lms-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .lms-stat {
    box-shadow: none;
}

body.lms-body .admin-command-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .admin-command-strip button {
    box-shadow: none;
    min-height: 58px;
}

body.lms-body .admin-section-groups {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: 1fr;
}

body.lms-body .admin-section-group,
body.lms-body .admin-section-group.learning,
body.lms-body .admin-section-group.account,
body.lms-body .admin-section-group.website {
    align-items: center;
    box-shadow: none;
    display: grid;
    gap: 1rem;
    grid-template-columns: 58px minmax(210px, 0.8fr) minmax(0, 1.4fr);
    min-height: 0;
    padding: 1rem;
}

body.lms-body .admin-section-group::before {
    bottom: 0;
    height: auto;
    inset: 0 auto 0 0;
    width: 4px;
}

body.lms-body .admin-section-icon {
    height: 48px;
    width: 48px;
}

body.lms-body .admin-section-group h2 {
    font-size: 1.15rem;
    margin: 0.15rem 0 0.25rem;
}

body.lms-body .admin-section-group p {
    font-size: 0.86rem;
    line-height: 1.5;
}

body.lms-body .admin-section-links {
    display: grid;
    gap: 0.55rem;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    justify-self: stretch;
}

body.lms-body .admin-section-links .lms-btn {
    border-radius: 8px;
    font-size: 0.82rem;
    min-height: 38px;
    padding: 0.55rem 0.7rem;
    width: 100%;
}

body.lms-body .lms-panel {
    box-shadow: none;
}

body.lms-body #overview > .lms-panel {
    border-left: 4px solid #111111;
}

body.lms-body[data-theme="dark"] #overview > .lms-panel {
    border-left-color: #ffffff;
}

body.lms-body #overview > .lms-panel h2 {
    border-bottom: 1px solid #d7d7d2;
    padding-bottom: 0.65rem;
}

body.lms-body[data-theme="dark"] #overview > .lms-panel h2 {
    border-bottom-color: #333333;
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    body.lms-body .admin-command-strip,
    body.lms-body .lms-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.lms-body .admin-section-group,
    body.lms-body .admin-section-group.learning,
    body.lms-body .admin-section-group.account,
    body.lms-body .admin-section-group.website {
        align-items: start;
        grid-template-columns: 48px minmax(0, 1fr);
    }

    body.lms-body .admin-section-links {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    body.lms-body .lms-sidebar,
    body.lms-body .admin-command-strip,
    body.lms-body .lms-stats {
        grid-template-columns: 1fr;
    }

    body.lms-body .admin-section-group,
    body.lms-body .admin-section-group.learning,
    body.lms-body .admin-section-group.account,
    body.lms-body .admin-section-group.website {
        grid-template-columns: 1fr;
    }

    body.lms-body .admin-section-links {
        grid-template-columns: 1fr;
    }
}

/* Hard update: actual stacked admin dashboard component. */
body.lms-body .admin-stack-board {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
}

body.lms-body .admin-stack-category {
    background:
        radial-gradient(circle, color-mix(in srgb, var(--admin-text) 5%, transparent) 1px, transparent 1.2px),
        var(--admin-surface);
    background-size: 14px 14px, auto;
    border: 1px solid var(--admin-text);
    border-radius: 8px;
    color: var(--admin-text);
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(240px, 0.7fr) minmax(0, 1.3fr);
    padding: 1rem;
}

body.lms-body .admin-stack-category header {
    align-items: start;
    display: grid;
    gap: 0.8rem;
    grid-template-columns: 54px minmax(0, 1fr);
}

body.lms-body .admin-stack-category header > span {
    align-items: center;
    background: var(--admin-text);
    border-radius: 8px;
    color: var(--admin-surface);
    display: flex;
    font-size: 1.1rem;
    font-weight: 900;
    height: 54px;
    justify-content: center;
    width: 54px;
}

body.lms-body .admin-stack-category p {
    color: var(--admin-muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    margin: 0 0 0.25rem;
    text-transform: uppercase;
}

body.lms-body .admin-stack-category h2 {
    color: var(--admin-text);
    font-size: clamp(1.35rem, 3vw, 2.1rem);
    line-height: 1;
    margin: 0;
    text-transform: uppercase;
}

body.lms-body .admin-stack-list {
    display: grid;
    gap: 0.55rem;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

body.lms-body .admin-stack-list button {
    align-items: center;
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    color: var(--admin-text);
    cursor: pointer;
    display: flex;
    font: inherit;
    font-weight: 900;
    gap: 0.6rem;
    justify-content: flex-start;
    min-height: 48px;
    padding: 0.65rem 0.75rem;
    text-align: left;
}

body.lms-body .admin-stack-list button:hover {
    background: var(--admin-text);
    border-color: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .admin-stack-list i {
    align-items: center;
    background: var(--admin-surface-soft);
    border-radius: 8px;
    color: currentColor;
    display: inline-flex;
    flex: 0 0 30px;
    height: 30px;
    justify-content: center;
    width: 30px;
}

body.lms-body .admin-stack-list button:hover i {
    background: var(--admin-surface);
    color: var(--admin-text);
}

@media (max-width: 900px) {
    body.lms-body .admin-stack-category {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    body.lms-body .admin-stack-category header {
        grid-template-columns: 1fr;
    }

    body.lms-body .admin-stack-list {
        grid-template-columns: 1fr;
    }
}

/* Full Nothing UI admin redesign system. */
body.lms-body {
    --primary: #111111;
    --secondary: #111111;
    --accent: #111111;
    --success: #111111;
    --danger: #111111;
    --purple: #111111;
    --orange: #111111;
    --dark: #111111;
    --light: #f7f7f5;
    --gray: #70706a;
    --white: #ffffff;
    --border: #d8d8d0;
    --admin-bg: #f7f7f5;
    --admin-surface: #ffffff;
    --admin-surface-soft: #eeeeea;
    --admin-text: #111111;
    --admin-muted: #70706a;
    --admin-border: #d8d8d0;
    --admin-primary: #111111;
    --admin-secondary: #111111;
    --admin-accent: #111111;
    --admin-success: #111111;
    --admin-danger: #111111;
    --admin-shadow: 0 18px 44px rgba(17, 17, 17, 0.08);
    background:
        radial-gradient(circle, rgba(17, 17, 17, 0.085) 1px, transparent 1.25px),
        linear-gradient(180deg, #fbfbf8, var(--admin-bg));
    background-size: 18px 18px, auto;
    color: var(--admin-text);
}

body.lms-body[data-theme="dark"] {
    --primary: #ffffff;
    --secondary: #ffffff;
    --accent: #ffffff;
    --success: #ffffff;
    --danger: #ffffff;
    --purple: #ffffff;
    --orange: #ffffff;
    --dark: #ffffff;
    --light: #080808;
    --gray: #adada6;
    --white: #151515;
    --border: #333333;
    --admin-bg: #080808;
    --admin-surface: #151515;
    --admin-surface-soft: #222222;
    --admin-text: #ffffff;
    --admin-muted: #adada6;
    --admin-border: #333333;
    --admin-primary: #ffffff;
    --admin-secondary: #ffffff;
    --admin-accent: #ffffff;
    --admin-success: #ffffff;
    --admin-danger: #ffffff;
    --admin-shadow: 0 24px 70px rgba(0, 0, 0, 0.48);
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.075) 1px, transparent 1.25px),
        linear-gradient(180deg, #050505, var(--admin-bg));
    background-size: 18px 18px, auto;
    color: var(--admin-text);
}

body.lms-body *,
body.lms-body *::before,
body.lms-body *::after {
    letter-spacing: 0;
}

body.lms-body .header {
    background: color-mix(in srgb, var(--admin-surface) 90%, transparent);
    border-bottom: 1px solid var(--admin-border);
    box-shadow: none;
}

body.lms-body .nav-container {
    max-width: 1540px;
}

body.lms-body .logo {
    background: var(--admin-text);
    border: 1px solid var(--admin-text);
    border-radius: 8px;
    color: var(--admin-surface);
    font-weight: 900;
    padding: 0.62rem 0.9rem;
}

body.lms-body .logo i {
    color: currentColor;
}

body.lms-body .nav-menu {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: 999px;
}

body.lms-body .nav-menu a,
body.lms-body .mobile-menu-toggle {
    color: var(--admin-text);
}

body.lms-body .mobile-menu-toggle {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
}

body.lms-body .lms-shell {
    gap: 1rem;
    grid-template-columns: 320px minmax(0, 1fr);
    max-width: 1540px;
    padding-top: 6.3rem;
}

body.lms-body .lms-main {
    gap: 1rem;
}

body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-player,
body.lms-body .lms-auth-card,
body.lms-body .lms-stat,
body.lms-body .admin-command-strip button,
body.lms-body .admin-stack-category,
body.lms-body .admin-section-group,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar,
body.lms-body .lms-modal-card,
body.lms-body .student-history-panel {
    background:
        radial-gradient(circle, color-mix(in srgb, var(--admin-text) 5%, transparent) 1px, transparent 1.2px),
        color-mix(in srgb, var(--admin-surface) 96%, transparent);
    background-size: 14px 14px, auto;
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
}

body.lms-body .lms-sidebar {
    align-self: start;
    backdrop-filter: blur(18px);
    gap: 0.35rem;
    padding: 0.85rem;
    position: sticky;
    top: 5.7rem;
}

body.lms-body .lms-user,
body.lms-body .lms-hero,
body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.15) 1px, transparent 1.25px),
        #111111;
    background-size: 13px 13px, auto;
    border: 1px solid #111111;
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: #ffffff;
}

body.lms-body[data-theme="dark"] .lms-user,
body.lms-body[data-theme="dark"] .lms-hero,
body.lms-body[data-theme="dark"] .website-settings-head,
body.lms-body[data-theme="dark"] .visibility-board-head {
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.1) 1px, transparent 1.25px),
        #000000;
    border-color: #222222;
}

body.lms-body .lms-user {
    min-height: 96px;
    padding: 1rem;
}

body.lms-body .lms-user strong {
    font-size: 1.1rem;
    font-weight: 900;
}

body.lms-body .lms-user span,
body.lms-body .lms-hero p,
body.lms-body .website-settings-head p,
body.lms-body .visibility-board-head p {
    color: rgba(255, 255, 255, 0.72);
}

body.lms-body .lms-sidebar-label {
    border-bottom: 1px solid var(--admin-border);
    color: var(--admin-text);
    font-size: 0.72rem;
    font-weight: 900;
    margin: 0.8rem 0 0.25rem;
    padding: 0 0 0.35rem;
    text-transform: uppercase;
}

body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before,
body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    background: var(--admin-text);
}

body.lms-body .lms-tab {
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--admin-text);
    font-weight: 900;
    min-height: 40px;
    padding: 0.55rem 0.65rem;
}

body.lms-body .lms-tab i,
body.lms-body .admin-stack-list i,
body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .website-control-icon,
body.lms-body .visibility-tile-head > i {
    align-items: center;
    background: var(--admin-surface-soft);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    color: var(--admin-text);
    display: inline-flex;
    justify-content: center;
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active,
body.lms-body .admin-stack-list button:hover,
body.lms-body .admin-command-strip button:hover,
body.lms-body .admin-command-strip button:nth-child(2),
body.lms-body .lms-btn {
    background: var(--admin-text);
    border-color: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i,
body.lms-body .admin-stack-list button:hover i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: var(--admin-surface);
    border-color: var(--admin-surface);
    color: var(--admin-text);
}

body.lms-body .lms-hero {
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 270px;
    overflow: hidden;
    padding: clamp(1.4rem, 4vw, 2.4rem);
    position: relative;
}

body.lms-body .lms-hero::after {
    display: none;
}

body.lms-body .lms-hero h1 {
    color: #ffffff;
    font-size: clamp(2.1rem, 5vw, 4.15rem);
    font-weight: 900;
    line-height: 0.98;
    max-width: 820px;
    text-transform: uppercase;
}

body.lms-body .lms-kicker {
    color: inherit;
    font-size: 0.78rem;
    font-weight: 900;
    opacity: 0.9;
    text-transform: uppercase;
}

body.lms-body .admin-hero-badges span,
body.lms-body .lms-actions .lms-btn.light,
body.lms-body .visibility-leds span,
body.lms-body .website-settings-status span {
    background: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 8px;
    color: #111111;
}

body.lms-body .lms-btn {
    border: 1px solid var(--admin-text);
    border-radius: 8px;
    box-shadow: none;
    font-weight: 900;
}

body.lms-body .lms-btn.secondary {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-btn.danger,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-text);
    border-color: var(--admin-text);
    color: var(--admin-surface);
    transform: none;
}

body.lms-body .lms-stats {
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .lms-stat {
    min-height: 112px;
    overflow: hidden;
    padding: 1rem;
    position: relative;
}

body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    content: "";
    display: block;
    height: 4px;
    inset: 0 0 auto;
    position: absolute;
}

body.lms-body .lms-stat::after {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-stat span,
body.lms-body .lms-meta,
body.lms-body .admin-stack-category p,
body.lms-body .admin-section-group p,
body.lms-body .website-control-tile p,
body.lms-body .website-mode-row span,
body.lms-body .visibility-tile p,
body.lms-body .visibility-save-bar span,
body.lms-body .student-detail-card span,
body.lms-body .student-history-list span {
    color: var(--admin-muted);
}

body.lms-body .lms-stat strong,
body.lms-body .lms-panel > h2,
body.lms-body .lms-card h3,
body.lms-body .admin-stack-category h2,
body.lms-body .admin-section-group h2,
body.lms-body .website-control-tile h3,
body.lms-body .visibility-tile-head h3,
body.lms-body .visibility-save-bar strong,
body.lms-body .student-detail-card strong,
body.lms-body .student-history-list strong {
    color: var(--admin-text);
}

body.lms-body .lms-panel {
    padding: 1rem;
}

body.lms-body .lms-panel > h2 {
    border-bottom: 1px solid var(--admin-border);
    font-size: clamp(1.15rem, 2vw, 1.55rem);
    font-weight: 900;
    margin-bottom: 0.9rem;
    padding-bottom: 0.65rem;
    text-transform: uppercase;
}

body.lms-body .lms-badge,
body.lms-body .lms-alert,
body.lms-body .lms-form-status {
    background: var(--admin-surface-soft);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    color: var(--admin-text);
}

body.lms-body .lms-alert.error,
body.lms-body .lms-alert.success,
body.lms-body .lms-alert.info,
body.lms-body .lms-form-status.error,
body.lms-body .lms-form-status.success {
    color: var(--admin-text);
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    color: var(--admin-text);
}

body.lms-body .lms-form input:focus,
body.lms-body .lms-form select:focus,
body.lms-body .lms-form textarea:focus,
body.lms-body .lms-filters input:focus {
    border-color: var(--admin-text);
    outline: 2px solid color-mix(in srgb, var(--admin-text) 16%, transparent);
}

body.lms-body .lms-table-wrap {
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    box-shadow: none;
}

body.lms-body .lms-table th {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .lms-table td {
    border-bottom-color: var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .admin-stack-board,
body.lms-body .admin-command-strip,
body.lms-body .admin-section-groups {
    gap: 1rem;
}

body.lms-body .admin-stack-category {
    box-shadow: none;
    grid-template-columns: minmax(250px, 0.72fr) minmax(0, 1.28fr);
}

body.lms-body .admin-stack-category header > span {
    background: var(--admin-text);
    color: var(--admin-surface);
}

body.lms-body .admin-stack-list button,
body.lms-body .admin-command-strip button {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    border-radius: 8px;
    color: var(--admin-text);
    font-weight: 900;
}

body.lms-body .admin-section-group {
    box-shadow: none;
}

body.lms-body .website-settings-head h2,
body.lms-body .visibility-board-head h2 {
    color: #ffffff;
    font-weight: 900;
    text-transform: uppercase;
}

body.lms-body .website-control-grid,
body.lms-body .visibility-console,
body.lms-body .website-settings-strip {
    gap: 1rem;
}

body.lms-body .visibility-control-row label {
    color: var(--admin-text);
    font-weight: 900;
}

body.lms-body .lms-modal {
    background: rgba(0, 0, 0, 0.62);
}

body.lms-body .lms-modal-card {
    max-height: 88vh;
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        position: static;
    }

    body.lms-body .lms-user,
    body.lms-body .lms-sidebar-label {
        grid-column: 1 / -1;
    }
}

@media (max-width: 900px) {
    body.lms-body .lms-hero,
    body.lms-body .visibility-board-head,
    body.lms-body .visibility-save-bar {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-stats,
    body.lms-body .admin-command-strip,
    body.lms-body .website-control-grid,
    body.lms-body .website-settings-strip,
    body.lms-body .visibility-console {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.lms-body .admin-stack-category {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    body.lms-body .lms-shell {
        padding-top: 5.5rem;
    }

    body.lms-body .lms-sidebar,
    body.lms-body .lms-stats,
    body.lms-body .admin-command-strip,
    body.lms-body .website-control-grid,
    body.lms-body .website-settings-strip,
    body.lms-body .visibility-console,
    body.lms-body .visibility-control-row {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-hero {
        min-height: auto;
    }

    body.lms-body .admin-stack-category header {
        grid-template-columns: 1fr;
    }

    body.lms-body .admin-stack-list {
        grid-template-columns: 1fr;
    }
}

/* Homepage-style admin dashboard final design. */
body.lms-body {
    --admin-bg: #f8fafc;
    --admin-surface: #ffffff;
    --admin-surface-soft: #f1f5f9;
    --admin-text: #0f172a;
    --admin-muted: #64748b;
    --admin-border: #e2e8f0;
    --admin-primary: #2563eb;
    --admin-secondary: #1e40af;
    --admin-accent: #f59e0b;
    --admin-success: #10b981;
    --admin-danger: #ef4444;
    --admin-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    background:
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, 0.14), transparent 28rem),
        radial-gradient(circle at 90% 8%, rgba(16, 185, 129, 0.1), transparent 28rem),
        var(--admin-bg);
    background-size: auto;
    color: var(--admin-text);
}

body.lms-body[data-theme="dark"] {
    --admin-bg: #0f172a;
    --admin-surface: #1e293b;
    --admin-surface-soft: #111827;
    --admin-text: #f8fafc;
    --admin-muted: #94a3b8;
    --admin-border: #334155;
    --admin-primary: #3b82f6;
    --admin-secondary: #1d4ed8;
    --admin-accent: #fbbf24;
    --admin-success: #34d399;
    --admin-danger: #f87171;
    --admin-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
    background:
        radial-gradient(circle at 12% 0%, rgba(59, 130, 246, 0.18), transparent 28rem),
        radial-gradient(circle at 90% 8%, rgba(16, 185, 129, 0.12), transparent 28rem),
        var(--admin-bg);
}

body.lms-body .header {
    background: color-mix(in srgb, var(--admin-surface) 90%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--admin-border) 75%, transparent);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}

body.lms-body .logo {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: var(--admin-primary);
    padding: 0;
}

body.lms-body .logo i {
    color: var(--admin-primary);
}

body.lms-body .nav-menu {
    background: color-mix(in srgb, var(--admin-surface) 82%, transparent);
    border: 1px solid color-mix(in srgb, var(--admin-border) 70%, transparent);
    border-radius: 999px;
}

body.lms-body .nav-menu a {
    color: var(--admin-text);
}

body.lms-body .lms-shell {
    gap: 1.2rem;
    grid-template-columns: 300px minmax(0, 1fr);
    max-width: 1500px;
    padding-top: 6.4rem;
}

body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .admin-command-strip button,
body.lms-body .admin-section-group,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar {
    background: color-mix(in srgb, var(--admin-surface) 94%, transparent);
    border: 1px solid color-mix(in srgb, var(--admin-border) 82%, transparent);
    border-radius: 8px;
    box-shadow: var(--admin-shadow);
    color: var(--admin-text);
}

body.lms-body .lms-sidebar {
    backdrop-filter: blur(18px);
    gap: 0.58rem;
    padding: 1rem;
    position: sticky;
    top: 5.8rem;
}

body.lms-body .lms-user {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border: 0;
    color: #fff;
    padding: 1rem;
}

body.lms-body .lms-user span {
    color: rgba(255, 255, 255, 0.78);
}

body.lms-body .lms-sidebar-label {
    color: var(--admin-muted);
    font-size: 0.72rem;
    letter-spacing: 0.1em;
}

body.lms-body .lms-sidebar-label::before {
    background: var(--admin-accent);
}

body.lms-body .lms-tab {
    background: transparent;
    border: 0;
    color: var(--admin-text);
    font-weight: 800;
}

body.lms-body .lms-tab i {
    background: color-mix(in srgb, var(--admin-primary) 10%, transparent);
    border: 0;
    color: var(--admin-primary);
}

body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active {
    background: var(--admin-primary);
    color: #fff;
}

body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

body.lms-body .website-control-main-tab {
    background: color-mix(in srgb, var(--admin-primary) 10%, transparent);
    color: var(--admin-primary);
}

body.lms-body .lms-hero {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border: 0;
    box-shadow: 0 24px 60px color-mix(in srgb, var(--admin-primary) 22%, transparent);
    color: #fff;
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 300px;
    overflow: hidden;
    padding: clamp(1.5rem, 4vw, 2.6rem);
    position: relative;
    text-align: left;
}

body.lms-body .lms-hero::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' fill='%23ffffff22'%3E%3Cpolygon points='0,100 1000,0 1000,100'/%3E%3C/svg%3E");
    background-size: cover;
    content: "";
    display: block;
    inset: 0;
    opacity: 0.65;
    pointer-events: none;
    position: absolute;
}

body.lms-body .lms-hero > * {
    position: relative;
    z-index: 1;
}

body.lms-body .lms-hero h1 {
    color: #fff;
    font-size: clamp(2.15rem, 5vw, 3.75rem);
    line-height: 1.08;
    max-width: 850px;
    text-transform: none;
}

body.lms-body .lms-hero p {
    color: rgba(255, 255, 255, 0.88);
}

body.lms-body .lms-kicker {
    color: inherit;
    letter-spacing: 0.12em;
    opacity: 0.9;
}

body.lms-body .admin-hero-badges span,
body.lms-body .lms-actions .lms-btn.light {
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
}

body.lms-body .admin-hero-badges span i,
body.lms-body .lms-actions .lms-btn.light i {
    color: #fff;
}

body.lms-body .lms-btn {
    background: var(--admin-primary);
    border: 0;
    border-radius: 999px;
    color: #fff;
}

body.lms-body .lms-btn.secondary {
    background: var(--admin-success);
    border: 0;
    color: #fff;
}

body.lms-body .lms-btn.danger {
    background: var(--admin-danger);
}

body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-secondary);
    color: #fff;
    transform: translateY(-2px);
}

body.lms-body .lms-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.lms-body .lms-stat {
    border-top: 4px solid var(--admin-primary);
    min-height: 126px;
    padding: 1.2rem;
}

body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before {
    display: none;
}

body.lms-body .lms-stat::after,
body.lms-body .lms-stat:first-child::after,
body.lms-body .lms-stat:nth-child(4)::after {
    background: var(--admin-primary);
    color: #fff;
}

body.lms-body .lms-stat span,
body.lms-body .lms-meta,
body.lms-body .admin-section-group p,
body.lms-body .website-control-tile p,
body.lms-body .website-mode-row span,
body.lms-body .visibility-tile p,
body.lms-body .visibility-save-bar span {
    color: var(--admin-muted);
}

body.lms-body .lms-stat strong,
body.lms-body .admin-section-group h2,
body.lms-body .admin-section-group.website h2,
body.lms-body .admin-section-group.website p,
body.lms-body .lms-panel > h2 {
    color: var(--admin-text);
}

body.lms-body .admin-command-strip button {
    color: var(--admin-text);
}

body.lms-body .admin-command-strip button:nth-child(2),
body.lms-body .admin-command-strip button:hover {
    background: var(--admin-primary);
    color: #fff;
}

body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .admin-section-group.account .admin-section-icon,
body.lms-body .admin-section-group.website .admin-section-icon,
body.lms-body .visibility-tile-head > i,
body.lms-body .visibility-tile.pyq .visibility-tile-head > i {
    background: color-mix(in srgb, var(--admin-primary) 12%, transparent);
    border: 0;
    color: var(--admin-primary);
}

body.lms-body .admin-command-strip button:nth-child(2) i,
body.lms-body .admin-command-strip button:hover i {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

body.lms-body .admin-section-group,
body.lms-body .admin-section-group.learning,
body.lms-body .admin-section-group.account,
body.lms-body .admin-section-group.website {
    background: var(--admin-surface);
    border-top: 4px solid var(--admin-primary);
    color: var(--admin-text);
}

body.lms-body .admin-section-group.account {
    border-top-color: var(--admin-success);
}

body.lms-body .admin-section-group.website {
    border-top-color: var(--admin-accent);
}

body.lms-body .admin-section-group span,
body.lms-body .admin-section-group.account span,
body.lms-body .admin-section-group.website span,
body.lms-body .website-control-tile span,
body.lms-body .visibility-tile-head span {
    color: var(--admin-primary);
    letter-spacing: 0.08em;
}

body.lms-body .lms-panel > h2 {
    text-transform: none;
}

body.lms-body .lms-panel > h2::before {
    background: var(--admin-accent);
}

body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface);
    border: 1px solid var(--admin-border);
    color: var(--admin-text);
}

body.lms-body .lms-table th {
    background: var(--admin-surface-soft);
    color: var(--admin-text);
}

body.lms-body .lms-table td {
    color: var(--admin-text);
}

body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background: linear-gradient(135deg, var(--admin-primary), var(--admin-secondary));
    border: 0;
    color: #fff;
}

body.lms-body .website-settings-head h2,
body.lms-body .visibility-board-head h2 {
    color: #fff;
    text-transform: none;
}

body.lms-body .website-settings-head p,
body.lms-body .visibility-board-head p {
    color: rgba(255, 255, 255, 0.86);
}

body.lms-body .visibility-tile,
body.lms-body .visibility-tile.pyq,
body.lms-body .visibility-tile.prompts {
    background: var(--admin-surface);
}

body.lms-body .visibility-save-bar {
    background: var(--admin-surface-soft);
}

body.lms-body .visibility-leds span,
body.lms-body .website-settings-status span {
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
}

@media (max-width: 1180px) {
    body.lms-body .lms-shell {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        position: static;
    }
}

@media (max-width: 900px) {
    body.lms-body .lms-stats,
    body.lms-body .admin-command-strip,
    body.lms-body .admin-section-groups,
    body.lms-body .visibility-console,
    body.lms-body .visibility-board-head,
    body.lms-body .visibility-save-bar {
        grid-template-columns: 1fr;
    }

    body.lms-body .lms-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    body.lms-body .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.lms-body .lms-hero {
        min-height: auto;
    }
}


/* ABSOLUTE LAST OVERRIDE: black/white category-wise Nothing admin UI. */
body.lms-body {
    --primary: #111111 !important;
    --secondary: #111111 !important;
    --accent: #111111 !important;
    --success: #111111 !important;
    --danger: #111111 !important;
    --dark: #111111 !important;
    --light: #f7f7f7 !important;
    --gray: #666666 !important;
    --white: #ffffff !important;
    --border: #dddddd !important;
    --admin-bg: #f7f7f7 !important;
    --admin-surface: #ffffff !important;
    --admin-surface-soft: #eeeeee !important;
    --admin-text: #111111 !important;
    --admin-muted: #666666 !important;
    --admin-border: #dddddd !important;
    --admin-primary: #111111 !important;
    --admin-secondary: #111111 !important;
    --admin-accent: #111111 !important;
    background: radial-gradient(circle, rgba(0,0,0,.08) 1px, transparent 1.2px), #f7f7f7 !important;
    background-size: 18px 18px, auto !important;
    color: #111111 !important;
}
body.lms-body[data-theme="dark"] {
    --primary: #ffffff !important;
    --secondary: #ffffff !important;
    --accent: #ffffff !important;
    --success: #ffffff !important;
    --danger: #ffffff !important;
    --dark: #ffffff !important;
    --light: #090909 !important;
    --gray: #aaaaaa !important;
    --white: #151515 !important;
    --border: #333333 !important;
    --admin-bg: #090909 !important;
    --admin-surface: #151515 !important;
    --admin-surface-soft: #222222 !important;
    --admin-text: #ffffff !important;
    --admin-muted: #aaaaaa !important;
    --admin-border: #333333 !important;
    --admin-primary: #ffffff !important;
    --admin-secondary: #ffffff !important;
    --admin-accent: #ffffff !important;
    background: radial-gradient(circle, rgba(255,255,255,.08) 1px, transparent 1.2px), #090909 !important;
    background-size: 18px 18px, auto !important;
    color: #ffffff !important;
}
body.lms-body .header,
body.lms-body .lms-sidebar,
body.lms-body .lms-panel,
body.lms-body .lms-card,
body.lms-body .lms-stat,
body.lms-body .admin-stack-category,
body.lms-body .admin-command-strip button,
body.lms-body .website-settings-hub,
body.lms-body .website-control-tile,
body.lms-body .website-mode-row,
body.lms-body .website-settings-strip span,
body.lms-body .visibility-board,
body.lms-body .visibility-tile,
body.lms-body .visibility-save-bar,
body.lms-body .lms-modal-card {
    background: radial-gradient(circle, color-mix(in srgb, var(--admin-text) 5%, transparent) 1px, transparent 1.2px), var(--admin-surface) !important;
    background-size: 14px 14px, auto !important;
    border: 1px solid var(--admin-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 18px 44px rgba(17,17,17,.08) !important;
    color: var(--admin-text) !important;
}
body.lms-body .logo,
body.lms-body .lms-user,
body.lms-body .lms-hero,
body.lms-body .website-settings-head,
body.lms-body .visibility-board-head {
    background: radial-gradient(circle, rgba(255,255,255,.15) 1px, transparent 1.2px), #111111 !important;
    background-size: 13px 13px, auto !important;
    border-color: #111111 !important;
    color: #ffffff !important;
}
body.lms-body[data-theme="dark"] .logo,
body.lms-body[data-theme="dark"] .lms-user,
body.lms-body[data-theme="dark"] .lms-hero,
body.lms-body[data-theme="dark"] .website-settings-head,
body.lms-body[data-theme="dark"] .visibility-board-head {
    background: radial-gradient(circle, rgba(255,255,255,.1) 1px, transparent 1.2px), #000000 !important;
    color: #ffffff !important;
}
body.lms-body .lms-hero::after { display: none !important; }
body.lms-body .lms-hero h1,
body.lms-body .website-settings-head h2,
body.lms-body .visibility-board-head h2 {
    color: #ffffff !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
}
body.lms-body .lms-hero p,
body.lms-body .lms-user span,
body.lms-body .website-settings-head p,
body.lms-body .visibility-board-head p { color: rgba(255,255,255,.72) !important; }
body.lms-body .lms-tab,
body.lms-body .admin-stack-list button,
body.lms-body .admin-command-strip button,
body.lms-body .lms-btn.secondary {
    background: var(--admin-surface) !important;
    border: 1px solid var(--admin-border) !important;
    color: var(--admin-text) !important;
}
body.lms-body .lms-tab:hover,
body.lms-body .lms-tab.active,
body.lms-body .admin-stack-list button:hover,
body.lms-body .admin-command-strip button:hover,
body.lms-body .admin-command-strip button:nth-child(2),
body.lms-body .lms-btn,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover {
    background: var(--admin-text) !important;
    border-color: var(--admin-text) !important;
    color: var(--admin-surface) !important;
}
body.lms-body .lms-tab i,
body.lms-body .admin-stack-list i,
body.lms-body .admin-command-strip i,
body.lms-body .admin-section-icon,
body.lms-body .website-control-icon,
body.lms-body .visibility-tile-head > i {
    background: var(--admin-surface-soft) !important;
    border: 1px solid var(--admin-border) !important;
    color: var(--admin-text) !important;
}
body.lms-body .lms-tab:hover i,
body.lms-body .lms-tab.active i,
body.lms-body .admin-stack-list button:hover i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: var(--admin-surface) !important;
    color: var(--admin-text) !important;
}
body.lms-body .lms-panel > h2,
body.lms-body .lms-stat strong,
body.lms-body .admin-stack-category h2,
body.lms-body .lms-card h3,
body.lms-body .visibility-tile-head h3,
body.lms-body .website-control-tile h3,
body.lms-body .lms-table td { color: var(--admin-text) !important; }
body.lms-body .lms-meta,
body.lms-body .lms-stat span,
body.lms-body .admin-stack-category p,
body.lms-body .visibility-tile p,
body.lms-body .website-control-tile p { color: var(--admin-muted) !important; }
body.lms-body .lms-table th,
body.lms-body .admin-stack-category header > span,
body.lms-body .lms-stat::after {
    background: var(--admin-text) !important;
    color: var(--admin-surface) !important;
}
body.lms-body .lms-form input,
body.lms-body .lms-form select,
body.lms-body .lms-form textarea,
body.lms-body .lms-filters input,
body.lms-body .lms-filters select,
body.lms-body .visibility-control-row select {
    background: var(--admin-surface) !important;
    border-color: var(--admin-border) !important;
    color: var(--admin-text) !important;
}
body.lms-body .lms-sidebar-label::before,
body.lms-body .lms-panel > h2::before,
body.lms-body .lms-stat::before,
body.lms-body .admin-section-group::before { background: var(--admin-text) !important; }
body.lms-body .admin-stack-board { display: grid !important; gap: 1rem !important; grid-template-columns: 1fr !important; }
body.lms-body .admin-stack-category { display: grid !important; grid-template-columns: minmax(250px,.72fr) minmax(0,1.28fr) !important; gap: 1rem !important; }
body.lms-body .admin-stack-list { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; gap: .55rem !important; }
@media (max-width: 900px) { body.lms-body .admin-stack-category { grid-template-columns: 1fr !important; } }
@media (max-width: 560px) { body.lms-body .admin-stack-list { grid-template-columns: 1fr !important; } }


/* FINAL BUTTON ACCENT: one extra color for admin actions. */
body.lms-body {
    --admin-button-accent: #ff3030;
}
body.lms-body[data-theme="dark"] {
    --admin-button-accent: #ff4a4a;
}
body.lms-body .lms-btn,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover,
body.lms-body .admin-stack-list button:hover,
body.lms-body .admin-command-strip button:hover,
body.lms-body .admin-command-strip button:nth-child(2) {
    background: var(--admin-button-accent) !important;
    border-color: var(--admin-button-accent) !important;
    color: #ffffff !important;
}
body.lms-body .lms-btn i,
body.lms-body .admin-stack-list button:hover i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: rgba(255, 255, 255, 0.18) !important;
    border-color: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}
body.lms-body .lms-btn.secondary {
    background: var(--admin-surface) !important;
    border-color: var(--admin-border) !important;
    color: var(--admin-text) !important;
}


/* ABSOLUTE LAST BUTTON ACCENT: only buttons get one extra color. */
body.lms-body { --admin-button-accent: #ff3030; }
body.lms-body[data-theme="dark"] { --admin-button-accent: #ff4a4a; }
body.lms-body .lms-btn,
body.lms-body .lms-btn:hover,
body.lms-body .lms-btn.secondary:hover,
body.lms-body .admin-stack-list button:hover,
body.lms-body .admin-command-strip button:hover,
body.lms-body .admin-command-strip button:nth-child(2) {
    background: var(--admin-button-accent) !important;
    border-color: var(--admin-button-accent) !important;
    color: #ffffff !important;
}
body.lms-body .lms-btn.secondary {
    background: var(--admin-surface) !important;
    border-color: var(--admin-border) !important;
    color: var(--admin-text) !important;
}
body.lms-body .lms-btn i,
body.lms-body .admin-stack-list button:hover i,
body.lms-body .admin-command-strip button:hover i,
body.lms-body .admin-command-strip button:nth-child(2) i {
    background: rgba(255,255,255,.18) !important;
    border-color: rgba(255,255,255,.25) !important;
    color: #ffffff !important;
}


/* ABSOLUTE LAST ADMIN HEADER FIX: logo and home button. */
body.lms-body .header .nav-container {
    align-items: center !important;
    display: flex !important;
    gap: 1rem !important;
    min-height: 76px !important;
    padding: 0.8rem 2rem !important;
}
body.lms-body .header .logo {
    align-items: center !important;
    background: #111111 !important;
    border: 1px solid #111111 !important;
    border-radius: 8px !important;
    color: #ffffff !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    font-size: 1.45rem !important;
    font-weight: 900 !important;
    gap: 0.5rem !important;
    height: auto !important;
    line-height: 1 !important;
    max-width: none !important;
    min-height: 48px !important;
    min-width: max-content !important;
    overflow: visible !important;
    padding: 0.72rem 1rem !important;
    text-indent: 0 !important;
    white-space: nowrap !important;
    width: auto !important;
}
body.lms-body[data-theme="dark"] .header .logo {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: #000000 !important;
}
body.lms-body .header .logo i {
    color: currentColor !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    font-size: 1.15rem !important;
    line-height: 1 !important;
    margin: 0 !important;
    width: auto !important;
}
body.lms-body .header .nav-menu {
    align-items: center !important;
    background: var(--admin-surface) !important;
    border: 1px solid var(--admin-border) !important;
    border-radius: 999px !important;
    display: flex !important;
    flex: 0 0 auto !important;
    gap: 0.25rem !important;
    list-style: none !important;
    margin-left: auto !important;
    padding: 0.35rem !important;
}
body.lms-body .header .nav-menu a {
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 999px !important;
    color: var(--admin-text) !important;
    display: inline-flex !important;
    font-size: 0.92rem !important;
    font-weight: 900 !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 0.55rem 1rem !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
body.lms-body .header .nav-menu a:hover,
body.lms-body .header .nav-menu a:focus-visible {
    background: var(--admin-text) !important;
    color: var(--admin-surface) !important;
    outline: 0 !important;
}
body.lms-body .header .mobile-menu-toggle {
    align-items: center !important;
    background: var(--admin-text) !important;
    border: 1px solid var(--admin-text) !important;
    border-radius: 999px !important;
    color: var(--admin-surface) !important;
    flex: 0 0 44px !important;
    height: 44px !important;
    justify-content: center !important;
    margin-left: auto !important;
    width: 44px !important;
}
body.lms-body[data-theme="dark"] .header .mobile-menu-toggle {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: #000000 !important;
}
@media (max-width: 760px) {
    body.lms-body .header .nav-container {
        padding: 0.7rem 1rem !important;
    }
    body.lms-body .header .logo {
        font-size: 1.15rem !important;
        min-height: 44px !important;
        padding: 0.64rem 0.8rem !important;
    }
    body.lms-body .header .nav-menu {
        display: none !important;
    }
    body.lms-body .header .mobile-menu-toggle {
        display: inline-flex !important;
    }
}
/* Student profile photo and social links. */
.student-profile-hero {
    align-items: center;
    display: grid;
    gap: 1rem;
    grid-template-columns: auto minmax(0, 1fr);
    margin: 0.7rem 0 1.2rem;
}

.student-profile-photo {
    align-items: center;
    background: #101010;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    color: #ffffff;
    display: inline-flex;
    font-size: 1.4rem;
    font-weight: 900;
    height: 82px;
    justify-content: center;
    overflow: hidden;
    width: 82px;
}

.student-profile-photo img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.student-social-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.student-social-links a,
.student-social-links span {
    align-items: center;
    background: var(--theme-surface-strong, rgba(17, 24, 39, 0.06));
    border: 1px solid var(--theme-border, rgba(17, 24, 39, 0.12));
    border-radius: 999px;
    color: inherit;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 800;
    gap: 0.35rem;
    padding: 0.45rem 0.65rem;
    text-decoration: none;
}

.student-social-links a:hover {
    background: var(--theme-primary, #111827);
    color: var(--theme-on-primary, #ffffff);
}

@media (max-width: 560px) {
    .student-profile-hero {
        grid-template-columns: 1fr;
    }
}

/* Student quick profile summary popup. */
.student-summary-trigger {
    cursor: pointer;
    position: relative;
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.student-summary-trigger::after {
    align-items: center;
    background: var(--theme-primary, #111111);
    border-radius: 999px;
    color: var(--theme-on-primary, #ffffff);
    content: "\f105";
    display: inline-flex;
    font-family: "Font Awesome 6 Free";
    font-size: 0.72rem;
    font-weight: 900;
    height: 24px;
    justify-content: center;
    position: absolute;
    right: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
}

.student-summary-trigger:hover,
.student-summary-trigger:focus-visible {
    border-color: var(--theme-primary, #111111) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12) !important;
    outline: 0;
    transform: translateY(-1px);
}

.student-summary-popover {
    display: none;
    left: 1.15rem;
    position: fixed;
    top: 6.25rem;
    width: min(370px, calc(100vw - 2rem));
    z-index: 2500;
}

.student-summary-popover.open {
    display: block;
}

.student-summary-card {
    background: var(--theme-surface, #ffffff);
    border: 1px solid var(--theme-border, rgba(17, 24, 39, 0.14));
    border-radius: 18px;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.22);
    color: var(--theme-text, #111111);
    display: grid;
    gap: 0.95rem;
    padding: 1rem;
    position: relative;
}

body.lms-body[data-theme="dark"] .student-summary-card {
    background: #0f0f0f;
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.55);
    color: #ffffff;
}

.student-summary-close {
    align-items: center;
    background: var(--theme-surface-strong, rgba(17, 24, 39, 0.08));
    border: 1px solid var(--theme-border, rgba(17, 24, 39, 0.12));
    border-radius: 50%;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    position: absolute;
    right: 0.75rem;
    top: 0.75rem;
    width: 34px;
}

.student-summary-close:hover,
.student-summary-close:focus-visible {
    background: var(--theme-primary, #111111);
    color: var(--theme-on-primary, #ffffff);
    outline: 0;
}

.student-summary-head {
    align-items: center;
    display: grid;
    gap: 0.85rem;
    grid-template-columns: auto minmax(0, 1fr);
    padding-right: 2.2rem;
}

.student-summary-head h3 {
    font-size: 1.15rem;
    margin: 0.35rem 0 0.15rem;
}

.student-summary-head p {
    color: var(--theme-muted, #6b7280);
    font-size: 0.86rem;
    font-weight: 700;
    margin: 0;
}

.student-summary-photo {
    align-items: center;
    background: #111111;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    color: #ffffff;
    display: inline-flex;
    font-size: 1rem;
    font-weight: 900;
    height: 62px;
    justify-content: center;
    overflow: hidden;
    width: 62px;
}

.student-summary-photo img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.student-summary-list {
    background: var(--theme-surface-strong, rgba(17, 24, 39, 0.05));
    border: 1px solid var(--theme-border, rgba(17, 24, 39, 0.1));
    border-radius: 14px;
    display: grid;
    gap: 0.55rem;
    padding: 0.8rem;
}

.student-summary-list p {
    align-items: start;
    display: grid;
    gap: 0.55rem;
    grid-template-columns: 78px minmax(0, 1fr);
    margin: 0;
}

.student-summary-list strong {
    font-size: 0.75rem;
    letter-spacing: 0;
    text-transform: uppercase;
}

.student-summary-list span {
    color: var(--theme-muted, #4b5563);
    font-size: 0.84rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.student-summary-socials {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.student-summary-socials a,
.student-summary-socials span {
    align-items: center;
    background: var(--theme-surface-strong, rgba(17, 24, 39, 0.06));
    border: 1px solid var(--theme-border, rgba(17, 24, 39, 0.12));
    border-radius: 999px;
    color: inherit;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 800;
    gap: 0.35rem;
    padding: 0.43rem 0.62rem;
    text-decoration: none;
}

.student-summary-socials a:hover,
.student-summary-socials a:focus-visible {
    background: var(--theme-primary, #111111);
    color: var(--theme-on-primary, #ffffff);
    outline: 0;
}

@media (max-width: 760px) {
    .student-summary-popover {
        left: 1rem;
        top: 5.4rem;
    }
}

.lms-subsection-title {
    align-items: center;
    background: #101010;
    border-radius: 8px;
    color: #fff;
    display: flex;
    font-size: 0.82rem;
    font-weight: 900;
    gap: 0.55rem;
    letter-spacing: 0;
    margin-top: 0.35rem;
    padding: 0.75rem 0.9rem;
    text-transform: uppercase;
}

body.lms-body.dark-mode .lms-subsection-title,
[data-theme-mode="dark"] .lms-subsection-title {
    background: #fff;
    color: #101010;
}
.contact-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.contact-resolved td {
    opacity: 0.78;
}

.lms-badge.success {
    background: #dcfce7;
    color: #166534;
}

.lms-badge.warning {
    background: #fef3c7;
    color: #92400e;
}

body.lms-body.dark-mode .lms-badge.success,
[data-theme-mode="dark"] .lms-badge.success {
    background: rgba(34, 197, 94, 0.18);
    color: #86efac;
}

body.lms-body.dark-mode .lms-badge.warning,
[data-theme-mode="dark"] .lms-badge.warning {
    background: rgba(245, 158, 11, 0.18);
    color: #fcd34d;
}
.website-control-grid-redesign {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.website-section-status-board {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.section-status-card {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(16, 16, 16, 0.12);
    border-radius: 8px;
    display: flex;
    gap: 0.85rem;
    padding: 0.9rem;
}

.section-status-card i {
    align-items: center;
    background: #101010;
    border-radius: 8px;
    color: #fff;
    display: flex;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.section-status-card strong,
.section-status-card span {
    display: block;
}

.section-status-card strong {
    color: #101010;
    font-size: 0.95rem;
}

.section-status-card span {
    color: #5f6673;
    font-size: 0.82rem;
    font-weight: 800;
}

.section-status-card.is-limited {
    border-color: rgba(215, 25, 32, 0.32);
}

.section-status-card.is-limited i {
    background: #d71920;
}

.lms-panel-head {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

body.lms-body.dark-mode .section-status-card,
[data-theme-mode="dark"] .section-status-card {
    background: #101010;
    border-color: rgba(255,255,255,0.16);
}

body.lms-body.dark-mode .section-status-card i,
[data-theme-mode="dark"] .section-status-card i {
    background: #fff;
    color: #101010;
}

body.lms-body.dark-mode .section-status-card strong,
[data-theme-mode="dark"] .section-status-card strong {
    color: #fff;
}

@media (max-width: 900px) {
    .website-control-grid-redesign,
    .website-section-status-board {
        grid-template-columns: 1fr;
    }

    .lms-panel-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-date-filter input,
    .admin-date-filter select,
    .admin-date-filter input[type="search"],
    .lms-filter-summary {
        flex-basis: 100%;
        max-width: none;
        width: 100% !important;
    }
}

@media (max-width: 640px) {
    body.lms-body .lms-shell {
        display: block !important;
        padding: 0.5rem !important;
    }

    body.lms-body .lms-sidebar {
        display: flex !important;
        gap: 0.35rem !important;
        overflow-x: auto !important;
        padding: 0.45rem !important;
        position: sticky !important;
        top: 0 !important;
        width: 100% !important;
        z-index: 20;
    }

    body.lms-body .lms-sidebar .lms-tab {
        flex: 0 0 auto !important;
        min-height: 42px;
        white-space: nowrap;
    }

    body.lms-body .lms-main {
        min-width: 0 !important;
        padding: 0.5rem !important;
    }

    body.lms-body .lms-form,
    body.lms-body .lms-grid,
    body.lms-body .website-control-grid-redesign,
    body.lms-body .website-section-status-board {
        grid-template-columns: 1fr !important;
    }

    body.lms-body .lms-form .wide {
        grid-column: auto !important;
    }

    body.lms-body .lms-panel {
        padding: 0.85rem !important;
    }

    body.lms-body .lms-table-wrap {
        overflow-x: auto !important;
        width: 100%;
    }
}

.admin-page-bar {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(16, 16, 16, 0.12);
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
}

.admin-page-bar[hidden] {
    display: none !important;
}

.admin-page-bar h2,
.admin-page-bar p {
    margin: 0;
}

.admin-section-launcher {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 1rem;
}

.admin-section-launcher button {
    align-items: center;
    background: #fff;
    border: 1px solid rgba(16, 16, 16, 0.12);
    border-radius: 8px;
    color: #101010;
    display: flex;
    gap: 0.75rem;
    min-height: 68px;
    padding: 0.8rem;
    text-align: left;
}

.admin-section-launcher button:hover {
    border-color: #d71920;
    box-shadow: inset 3px 0 #d71920;
}

.admin-section-launcher span,
.admin-section-launcher strong,
.admin-section-launcher small {
    display: block;
}

.admin-section-launcher small {
    color: #5f6673;
    margin-top: 0.15rem;
}

body.admin-page-mode .lms-hero,
body.admin-page-mode .lms-stats {
    display: none;
}

body.lms-body.dark-mode .admin-page-bar,
body.lms-body.dark-mode .admin-section-launcher button,
[data-theme-mode="dark"] .admin-page-bar,
[data-theme-mode="dark"] .admin-section-launcher button {
    background: #101010;
    border-color: rgba(255,255,255,0.16);
    color: #fff;
}

@media (max-width: 640px) {
    .admin-page-bar {
        align-items: stretch;
        flex-direction: column;
        gap: 0.65rem;
    }

    .admin-section-launcher {
        grid-template-columns: 1fr;
    }
}


/* Student profile generated ID polish. */
.student-profile-photo,
.student-summary-photo {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.14);
}

.student-profile-photo img,
.student-summary-photo img {
    display: block;
}

.lms-form input[readonly] {
    background: var(--theme-surface-strong, rgba(17, 24, 39, 0.05));
    color: var(--theme-text, #111827);
    cursor: default;
    font-weight: 900;
}


/* Admin account detail profile photo. */
.student-account-detail-head {
    align-items: flex-start;
}

.student-account-identity {
    align-items: center;
    display: flex;
    gap: 1rem;
    min-width: 0;
}

.student-account-photo {
    align-items: center;
    background: #0f0f10;
    border: 1px solid var(--border, rgba(17, 24, 39, 0.14));
    border-radius: 50%;
    color: #ffffff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.45rem;
    font-weight: 900;
    height: 76px;
    justify-content: center;
    overflow: hidden;
    width: 76px;
}

.student-account-photo img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

@media (max-width: 560px) {
    .student-account-identity {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Payment receipt action buttons. */
.payment-slip-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
}

.payment-slip-actions .lms-btn {
    min-width: 128px;
}

@media (max-width: 640px) {
    .payment-slip-actions {
        justify-content: flex-start;
    }
}

/* v60: mobile-only student dashboard screenshot fixes. Desktop and data behavior unchanged. */
@media (max-width: 1024px) {
    body.student-dashboard-page {
        overflow-x: hidden !important;
    }

    body.student-dashboard-page .header {
        position: sticky;
        top: 0;
        z-index: 50;
    }

    body.student-dashboard-page .lms-shell {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 0.85rem !important;
        margin: 0 !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
        padding: 0.75rem !important;
        width: 100% !important;
    }

    body.student-dashboard-page .lms-sidebar {
        align-items: stretch !important;
        display: grid !important;
        gap: 0.55rem !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        padding: 0.75rem !important;
        position: relative !important;
        top: auto !important;
        width: 100% !important;
    }

    body.student-dashboard-page .lms-user {
        grid-column: 1 / -1 !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    body.student-dashboard-page .lms-tab {
        justify-content: center !important;
        min-width: 0 !important;
        overflow: hidden !important;
        padding: 0.75rem 0.55rem !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    body.student-dashboard-page .lms-tab i {
        flex: 0 0 auto !important;
    }

    body.student-dashboard-page .lms-main,
    body.student-dashboard-page .lms-section,
    body.student-dashboard-page .lms-panel,
    body.student-dashboard-page .lms-grid,
    body.student-dashboard-page .lms-player {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
        width: 100% !important;
    }

    body.student-dashboard-page .lms-hero {
        align-items: stretch !important;
        display: grid !important;
        gap: 1rem !important;
        grid-template-columns: 1fr !important;
        padding: 1.25rem !important;
    }

    body.student-dashboard-page .lms-actions {
        display: grid !important;
        gap: 0.7rem !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
    }

    body.student-dashboard-page .lms-actions .lms-btn,
    body.student-dashboard-page .lms-actions .lms-btn.light {
        min-height: 52px !important;
        width: 100% !important;
    }

    body.student-dashboard-page .lms-stats {
        display: grid !important;
        gap: 0.8rem !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 560px) {
    body.student-dashboard-page .lms-shell {
        padding: 0.55rem !important;
    }

    body.student-dashboard-page .lms-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        padding: 0.6rem !important;
    }

    body.student-dashboard-page .lms-tab {
        border-radius: 12px !important;
        font-size: 0.76rem !important;
        min-height: 52px !important;
    }

    body.student-dashboard-page .lms-user {
        min-height: auto !important;
        padding: 0.8rem !important;
    }

    body.student-dashboard-page .lms-hero {
        border-radius: 18px !important;
        padding: 1rem !important;
    }

    body.student-dashboard-page .lms-hero h1 {
        font-size: clamp(2.2rem, 12vw, 3.6rem) !important;
        line-height: 0.98 !important;
        overflow-wrap: anywhere !important;
    }

    body.student-dashboard-page .lms-stats,
    body.student-dashboard-page .lms-grid {
        grid-template-columns: 1fr !important;
    }

    body.student-dashboard-page .payment-slip-actions,
    body.student-dashboard-page .student-payment-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
    }

    body.student-dashboard-page .payment-slip-actions .lms-btn,
    body.student-dashboard-page .student-payment-actions .lms-btn {
        width: 100% !important;
    }
}
