.school-page {
    grid-template-columns: minmax(0, 1fr);
}

/* Staff workspaces follow the global light/dark switch. */
html:not(.is_dark) .school-admin-body {
    --school-bg: #f4f7fb;
    --school-panel: #ffffff;
    --school-panel-2: #eef3fa;
    --school-line: rgba(43, 58, 83, .16);
    --school-text: #172033;
    --school-muted: #64748b;
    color: var(--school-text);
    background: var(--school-bg) !important;
}

html:not(.is_dark) .school-admin-content {
    background: radial-gradient(circle at 86% 0, rgba(108, 99, 255, .08), transparent 30%), var(--school-bg);
}

html:not(.is_dark) .school-admin-sidebar,
html:not(.is_dark) .school-topbar,
html:not(.is_dark) .school-profile-menu > div {
    background: rgba(255, 255, 255, .96);
    color: var(--school-text);
}

html:not(.is_dark) .school-card {
    background: linear-gradient(155deg, #fff, #f8fafc);
    box-shadow: 0 18px 55px rgba(30, 41, 59, .08);
}

html:not(.is_dark) .school-page-header h1,
html:not(.is_dark) .school-card__head h2,
html:not(.is_dark) .school-card h2,
html:not(.is_dark) .school-card h3,
html:not(.is_dark) .school-kpi strong,
html:not(.is_dark) .school-alert strong,
html:not(.is_dark) .school-list-item strong,
html:not(.is_dark) .school-detail-list dd,
html:not(.is_dark) .school-topbar__brand strong,
html:not(.is_dark) .school-profile-menu summary,
html:not(.is_dark) .school-admin-sidebar .dashboard__nav li > a,
html:not(.is_dark) .school-admin-sidebar .alpha-sidebar-group summary {
    color: var(--school-text);
}

html:not(.is_dark) .school-form label,
html:not(.is_dark) .school-filters label,
html:not(.is_dark) .school-table td,
html:not(.is_dark) .school-alert,
html:not(.is_dark) .school-list-item {
    color: #334155;
}

html:not(.is_dark) .school-form input,
html:not(.is_dark) .school-form select,
html:not(.is_dark) .school-form textarea,
html:not(.is_dark) .school-filters input,
html:not(.is_dark) .school-filters select,
html:not(.is_dark) .school-topbar__search,
html:not(.is_dark) .school-tabs,
html:not(.is_dark) .school-table th,
html:not(.is_dark) .school-page .page-link {
    background: #fff;
    color: #172033;
}

html:not(.is_dark) .school-button--secondary,
html:not(.is_dark) .course-form-path,
html:not(.is_dark) .course-form-media-preview {
    background: #eef3fa;
    color: #273449 !important;
}

html:not(.is_dark) .course-form-module,
html:not(.is_dark) .course-form-submit {
    background: rgba(255, 255, 255, .96);
    color: #172033;
}

html:not(.is_dark) .academic-workspace {
    --academic-bg: #f4f7fb;
    --academic-panel: #ffffff;
    --academic-line: rgba(43, 58, 83, .16);
    --academic-text: #172033;
    --academic-muted: #64748b;
    background: radial-gradient(circle at top right, rgba(108, 124, 255, .09), transparent 34%), var(--academic-bg);
}

html:not(.is_dark) .academic-card,
html:not(.is_dark) .academic-nav,
html:not(.is_dark) .academic-grade,
html:not(.is_dark) .academic-course-card,
html:not(.is_dark) .academic-class-card,
html:not(.is_dark) .academic-lesson,
html:not(.is_dark) .academic-structure-course,
html:not(.is_dark) .academic-structure-path,
html:not(.is_dark) .academic-structure-module,
html:not(.is_dark) .academic-curriculum-node {
    background: #fff;
    box-shadow: 0 14px 40px rgba(30, 41, 59, .07);
}

html:not(.is_dark) .academic-workspace h1,
html:not(.is_dark) .academic-workspace h2,
html:not(.is_dark) .academic-workspace h3,
html:not(.is_dark) .academic-workspace h4,
html:not(.is_dark) .academic-grade h3,
html:not(.is_dark) .academic-course-card h3,
html:not(.is_dark) .academic-class-card h3,
html:not(.is_dark) .academic-lesson h3,
html:not(.is_dark) .academic-stat strong,
html:not(.is_dark) .academic-metric strong,
html:not(.is_dark) .academic-course-cell,
html:not(.is_dark) .academic-empty h3 {
    color: #172033;
}

html:not(.is_dark) .academic-workspace label,
html:not(.is_dark) .academic-table td,
html:not(.is_dark) .academic-details summary {
    color: #334155;
}

html:not(.is_dark) .academic-workspace input,
html:not(.is_dark) .academic-workspace select,
html:not(.is_dark) .academic-workspace textarea,
html:not(.is_dark) .academic-table th,
html:not(.is_dark) .academic-tab,
html:not(.is_dark) .academic-wizard-nav,
html:not(.is_dark) .academic-resource,
html:not(.is_dark) .academic-module,
html:not(.is_dark) .academic-module-shell,
html:not(.is_dark) .academic-results,
html:not(.is_dark) .academic-builder-submit {
    background: #f8fafc;
    color: #172033;
}

html:not(.is_dark) .academic-button--secondary {
    background: #eef3fa;
    color: #273449 !important;
}

html:not(.is_dark) .academic-nav a.is-active,
html:not(.is_dark) .academic-nav a:hover,
html:not(.is_dark) .academic-wizard-nav button.is-active {
    color: #fff;
    background: var(--academic-brand);
}

.school-page > * {
    grid-column: 1 / -1;
    min-width: 0;
}

.school-admin-sidebar .dashboard__inner {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.school-admin-sidebar .dashboard__nav,
.school-admin-sidebar .dashboard__nav > ul,
.school-admin-sidebar .alpha-sidebar-group__panel {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.school-admin-sidebar .alpha-sidebar-group__text strong,
.school-admin-sidebar .alpha-sidebar-group__icon,
.school-admin-sidebar .alpha-sidebar-group__chevron,
.school-admin-sidebar .alpha-sidebar-subnav a {
    color: #cdd8ec !important;
    opacity: 1 !important;
}

.school-admin-sidebar .alpha-sidebar-group:hover .alpha-sidebar-group__text strong,
.school-admin-sidebar .alpha-menu-has-active .alpha-sidebar-group__text strong {
    color: #fff !important;
}

.school-activity-grid {
    grid-template-columns: repeat(auto-fit, minmax(115px, 1fr));
}

.school-flash--warning {
    border-color: rgba(255, 190, 85, .4);
    background: rgba(255, 190, 85, .1);
    color: #ffdda1;
}

@media (max-width: 720px) {
    .school-table {
        min-width: 720px;
    }

    .school-page-header,
    .school-seat-card,
    .school-card__head {
        min-width: 0;
    }

    .school-activity-grid {
        grid-template-columns: 1fr;
    }
}

/* Tenant brand is authoritative across the shared student, teacher, and school
   administration surfaces. Semantic success/warning/danger colors stay
   semantic; interactive primary accents use the school palette. */
body .btn-primary,
body .default__button,
body .bg-primary,
body .badge.bg-primary {
    border-color: var(--school-brand) !important;
    background-color: var(--school-brand) !important;
    background-image: linear-gradient(135deg, var(--school-brand), var(--school-accent)) !important;
    color: #fff !important;
}

body .btn-outline-primary {
    border-color: var(--school-brand) !important;
    color: var(--school-brand) !important;
    background-color: transparent !important;
}

body .btn-outline-primary:hover,
body .btn-outline-primary:focus-visible {
    color: #fff !important;
    background: var(--school-brand) !important;
}

body a:not(.school-button):not(.academic-button):not(.gf-studio-button):focus-visible,
body button:focus-visible,
body input:focus-visible,
body select:focus-visible,
body textarea:focus-visible {
    outline-color: var(--school-brand);
}

.school-admin-sidebar,
.school-admin-sidebar .dashboard__inner {
    scrollbar-color: color-mix(in srgb, var(--school-brand) 55%, transparent) transparent;
}

.school-roster-dialog {
    border-color: color-mix(in srgb, var(--school-brand) 30%, var(--school-line));
    color: var(--school-text);
    background: var(--school-panel);
}

.school-roster-search,
.school-roster-result small {
    color: var(--school-muted);
}

.school-roster-search input {
    border-color: color-mix(in srgb, var(--school-brand) 28%, var(--school-line));
    color: var(--school-text);
    background: var(--school-panel-2);
}

.school-roster-result:has(input:checked),
.school-roster-selected,
.school-roster-chip {
    border-color: color-mix(in srgb, var(--school-brand) 45%, var(--school-line));
    color: var(--school-text);
    background: var(--school-brand-soft);
}

.academic-editor,
.academic-structure-editor {
    min-width: 0;
}

.academic-structure-module .academic-details {
    width: 100%;
}

/* Legacy learner/teacher dialogs often emit inline blue labels. Keep those
   transient surfaces inside the active school's palette as well. */
body .swal2-container .swal2-confirm {
    background-color: var(--school-brand) !important;
}

body .swal2-container .swal2-html-container strong,
body .swal2-container .swal2-title a {
    color: var(--school-brand) !important;
}

body .swal2-container .swal2-input:focus,
body .swal2-container .swal2-select:focus {
    border-color: var(--school-brand) !important;
    box-shadow: 0 0 0 3px var(--school-brand-soft) !important;
}

/* School-owned brand artwork ------------------------------------------------
   Logo and cover assets are shared by school administrators and teachers. */
.school-topbar::after {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, color-mix(in srgb, var(--school-panel) 96%, transparent) 0 48%, color-mix(in srgb, var(--school-panel) 78%, transparent)),
        var(--school-cover-image, none) right center / min(48%, 760px) 100% no-repeat;
    opacity: .48;
}

.school-topbar {
    isolation: isolate;
}

.school-topbar > * {
    position: relative;
    z-index: 1;
}

.school-topbar__brand > .school-topbar__logo-link {
    display: flex;
    flex: 0 0 94px;
    width: 94px;
    max-width: 94px;
    height: 46px;
    max-height: 46px;
    overflow: hidden;
    align-items: center;
    justify-content: center;
}

.school-topbar__brand > .school-topbar__logo-link > .school-topbar__logo {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 100% !important;
    object-fit: contain;
}

@media (max-width: 1024px) {
    .school-topbar__brand > .school-topbar__logo-link {
        flex-basis: 76px;
        width: 76px;
        max-width: 76px;
        height: 42px;
        max-height: 42px;
    }
}

@media (max-width: 720px) {
    .school-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: "school-brand school-actions";
    }

    .school-topbar__brand {
        grid-area: school-brand;
        min-width: 0;
    }

    .school-topbar__actions {
        grid-area: school-actions;
    }

    .school-topbar__search,
    .school-topbar__workspace-note {
        grid-column: 1 / -1;
    }

    .school-topbar__brand > .school-topbar__logo-link {
        flex: 0 0 58px;
        width: 58px;
        max-width: 58px;
        height: 38px;
        max-height: 38px;
    }
}

.school-sidebar-welcome {
    background-image:
        linear-gradient(105deg, color-mix(in srgb, var(--school-panel) 92%, transparent), color-mix(in srgb, var(--school-brand) 12%, transparent)),
        var(--school-cover-image, none) !important;
    background-position: center !important;
    background-size: cover !important;
}

.school-sidebar-welcome__avatar {
    overflow: hidden;
}

.school-sidebar-welcome__avatar img {
    width: 100%;
    height: 100%;
    padding: 3px;
    object-fit: contain;
    background: color-mix(in srgb, white 92%, transparent);
}

/* Student gamer identity ----------------------------------------------------
   Uses the live avatar rig and equipped-item animation rules from the campus. */
.student-identity-card {
    position: relative;
    min-height: 360px;
    margin: -3px -3px 14px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--school-brand) 34%, var(--school-line));
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(circle at 88% 8%, color-mix(in srgb, var(--school-accent) 34%, transparent), transparent 34%),
        linear-gradient(160deg, color-mix(in srgb, var(--school-brand) 88%, #081020), color-mix(in srgb, var(--school-accent) 58%, #071022));
    box-shadow: 0 20px 44px color-mix(in srgb, var(--school-brand) 22%, transparent);
    isolation: isolate;
}

.student-identity-card::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image:
        radial-gradient(circle, color-mix(in srgb, white 17%, transparent) 1px, transparent 1px),
        linear-gradient(180deg, color-mix(in srgb, var(--school-brand) 18%, transparent), color-mix(in srgb, #050817 72%, transparent));
    background-size: 10px 10px, auto;
    opacity: .78;
}

.student-identity-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 160px;
    height: 160px;
    inset: 42px -55px auto auto;
    border: 1px solid color-mix(in srgb, white 22%, transparent);
    transform: rotate(28deg);
}

.student-identity-card__brand {
    position: relative;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 13px 0;
}

.student-identity-card__brand img {
    width: 40px;
    height: 32px;
    padding: 3px;
    border-radius: 9px;
    object-fit: contain;
    background: rgba(255, 255, 255, .9);
}

.student-identity-card__brand span {
    overflow: hidden;
    font-size: .68rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.student-identity-card__stage {
    position: relative;
    height: 228px;
    margin-top: -2px;
}

.student-identity-card__shape {
    position: absolute;
    bottom: 20px;
    border: 1px solid color-mix(in srgb, white 12%, transparent);
    background: linear-gradient(145deg, color-mix(in srgb, var(--school-brand) 78%, transparent), color-mix(in srgb, var(--school-accent) 64%, transparent));
    box-shadow: 0 0 28px color-mix(in srgb, var(--school-accent) 18%, transparent);
}

.student-identity-card__shape--one { left: 13px; width: 64px; height: 126px; opacity: .52; clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%, 0 20%); }
.student-identity-card__shape--two { left: 47px; width: 94px; height: 183px; opacity: .8; clip-path: polygon(15% 0, 82% 0, 100% 16%, 100% 100%, 0 100%, 0 25%); }
.student-identity-card__shape--three { right: 25px; width: 86px; height: 145px; opacity: .66; clip-path: polygon(0 0, 72% 0, 100% 22%, 100% 100%, 0 100%); }
.student-identity-card__shape--four { right: -9px; width: 52px; height: 100px; bottom: 40px; opacity: .34; clip-path: polygon(0 13%, 70% 0, 100% 18%, 100% 100%, 0 100%); }
.student-identity-card__shape--five { left: 118px; width: 88px; height: 208px; bottom: 8px; opacity: .38; clip-path: polygon(0 8%, 72% 0, 100% 16%, 100% 100%, 0 100%); }

.student-identity-card .gf-avatar-actor {
    left: 50% !important;
    top: 92% !important;
    z-index: 4 !important;
    width: 126px;
    transform: translate(-50%, -92%);
    animation: studentIdentityFloat 4.6s ease-in-out infinite;
}

.student-identity-card .gf-avatar-nameplate {
    display: none;
}

.student-identity-card__nameplate {
    position: relative;
    z-index: 6;
    width: calc(100% - 32px);
    min-height: 58px;
    margin: 0px -29px auto 15px;
    padding: 10px 23px 9px;
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(100deg, var(--school-brand), color-mix(in srgb, var(--school-accent) 82%, var(--school-brand)));
    box-shadow: 0 10px 25px color-mix(in srgb, var(--school-brand) 32%, transparent);
    clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
    text-align: center;
}

.student-identity-card__nameplate strong,
.student-identity-card__nameplate span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.student-identity-card__nameplate strong { font-size: .92rem; }
.student-identity-card__nameplate span { font-size: .66rem; font-weight: 750; opacity: .84; }

.student-identity-card__rank {
    position: relative;
    z-index: 7;
    width: 65%;
    min-height: 46px;
    margin: -1px auto 12px;
    padding: 5px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: var(--school-text);
    background: var(--school-panel);
    clip-path: polygon(10% 0, 92% 0, 100% 100%, 0 100%);
}

.student-identity-card__rank img { width: 31px; height: 31px; object-fit: contain; }
.student-identity-card__rank span { display: grid; line-height: 1.15; }
.student-identity-card__rank small { color: var(--school-muted); font-size: .52rem; text-transform: uppercase; }
.student-identity-card__rank strong { color: var(--school-text); font-size: .7rem; }

@keyframes studentIdentityFloat {
    50% { transform: translate(-50%, calc(-92% - 5px)); }
}

@media (prefers-reduced-motion: reduce) {
    .student-identity-card .gf-avatar-actor { animation: none; }
}

/* Teachers share the same live avatar identity used by learners. The compact
   state keeps the existing sidebar control available without the old banner. */
.teacher-identity-card {
    position: relative;
}

.teacher-identity-card > .school-sidebar-collapse {
    position: absolute;
    z-index: 9;
    top: 10px;
    right: 10px;
}

.teacher-identity-card .student-identity-card__brand {
    padding-inline-end: 54px;
}

.teacher-identity-card__workspace > i {
    display: grid;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 9px;
    color: #fff;
    background: linear-gradient(145deg, var(--school-brand), var(--school-accent));
}

.school-admin-shell.is-sidebar-collapsed .teacher-identity-card {
    min-height: 45px;
    margin: 0 0 8px;
    padding: 6px 0 10px;
    overflow: visible;
    border: 0;
    border-bottom: 1px solid rgba(153, 169, 201, .14);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.school-admin-shell.is-sidebar-collapsed .teacher-identity-card::before,
.school-admin-shell.is-sidebar-collapsed .teacher-identity-card::after,
.school-admin-shell.is-sidebar-collapsed .teacher-identity-card > :not(.school-sidebar-collapse) {
    display: none !important;
}

.school-admin-shell.is-sidebar-collapsed .teacher-identity-card > .school-sidebar-collapse {
    position: static;
    margin: 0 auto;
    transform: rotate(180deg);
}

/* Fully tokenized live-learning administration -----------------------------
   This overrides the legacy fixed navy/violet palette in gamelify-admin.css. */
.school-admin-body .gf-studio-page {
    --gf-studio-ink: var(--school-text);
    --gf-studio-muted: var(--school-muted);
    --gf-studio-panel: var(--school-panel);
    --gf-studio-panel-strong: var(--school-panel);
    --gf-studio-line: var(--school-line);
    --gf-studio-violet: var(--school-brand);
    --gf-studio-cyan: var(--school-accent);
}

.school-admin-body .gf-studio-hero,
.school-admin-body .gf-studio-panel {
    border-color: var(--school-line);
    color: var(--school-text);
    background-color: var(--school-panel);
    box-shadow: 0 24px 64px rgba(31, 45, 73, .12);
}

.school-admin-body .gf-studio-hero {
    background:
        radial-gradient(circle at 88% 14%, var(--school-accent-soft), transparent 17rem),
        radial-gradient(circle at 62% 115%, var(--school-brand-soft), transparent 20rem),
        linear-gradient(135deg, color-mix(in srgb, var(--school-brand) 12%, var(--school-panel)), var(--school-panel));
}

.school-admin-body .gf-studio-hero::after {
    border-color: color-mix(in srgb, var(--school-brand) 18%, transparent);
    background: var(--school-brand-soft);
}

.school-admin-body :is(.gf-studio-hero, .gf-studio-panel, .gf-studio-card) :is(h1, h2, h3, strong),
.school-admin-body .gf-event-table {
    color: var(--school-text);
}

.school-admin-body .gf-studio-kicker,
.school-admin-body .gf-event-table__id,
.school-admin-body .gf-studio-empty i {
    color: var(--school-brand);
}

.school-admin-body .gf-studio-stat,
.school-admin-body .gf-studio-card,
.school-admin-body .gf-meta-card,
.school-admin-body .gf-room-manager-card,
.school-admin-body .gf-question-card,
.school-admin-body .gf-answer-card,
.school-admin-body .gf-form-section,
.school-admin-body .gf-event-filters,
.school-admin-body .gf-event-schedule-box,
.school-admin-body .gf-event-campus-target,
.school-admin-body .gf-event-choice-builder,
.school-admin-body [data-gf-question-bank-picker],
.school-admin-body .gf-studio-empty,
.school-admin-body .gf-event-table-wrap {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel-2);
}

.school-admin-body .gf-studio-card::before {
    background: radial-gradient(circle, var(--school-brand-soft), transparent 68%);
}

.school-admin-body .gf-studio-card:hover {
    border-color: color-mix(in srgb, var(--school-brand) 36%, var(--school-line));
    box-shadow: 0 18px 40px rgba(31, 45, 73, .13);
}

.school-admin-body .gf-studio-card__meta,
.school-admin-body :is(.gf-event-table__identity, .gf-event-table__stack, .gf-event-table__badges) small,
.school-admin-body .gf-event-wizard__footer span,
.school-admin-body .gf-event-control-hero__stats span,
.school-admin-body .gf-studio-field small,
.school-admin-body .gf-map-picker__intro,
.school-admin-body .gf-map-option__copy small {
    color: var(--school-muted);
}

.school-admin-body .gf-studio-button {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel-2);
}

.school-admin-body .gf-studio-button:hover,
.school-admin-body .gf-studio-button:focus-visible {
    border-color: color-mix(in srgb, var(--school-brand) 42%, var(--school-line));
    color: var(--school-text);
    background: var(--school-brand-soft);
    box-shadow: 0 14px 34px var(--school-brand-soft);
}

.school-admin-body :is(.gf-studio-button--primary, .gf-question-card__number) {
    border-color: color-mix(in srgb, var(--school-brand) 48%, transparent);
    color: #fff;
    background: linear-gradient(135deg, var(--school-brand), var(--school-accent));
    box-shadow: 0 14px 34px var(--school-brand-soft);
}

.school-admin-body :is(.gf-studio-button--primary, .gf-question-card__number):hover,
.school-admin-body :is(.gf-studio-button--primary, .gf-question-card__number):focus-visible {
    color: #fff;
}

.school-admin-body .gf-studio-field label,
.school-admin-body .gf-studio-field legend,
.school-admin-body .gf-answer-number,
.school-admin-body .gf-weight-matrix__head strong,
.school-admin-body .gf-studio-check,
.school-admin-body .gf-map-option {
    color: var(--school-text);
}

.school-admin-body .gf-studio-field :where(input:not([type='checkbox']):not([type='radio']), select, textarea),
.school-admin-body .gf-map-option,
.school-admin-body .gf-studio-check,
.school-admin-body .gf-recommendation-row,
.school-admin-body .gf-weight-matrix__empty {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel);
}

.school-admin-body .gf-studio-field :where(input, select, textarea):focus {
    border-color: var(--school-brand);
    color: var(--school-text);
    background: var(--school-panel);
    box-shadow: 0 0 0 4px var(--school-brand-soft);
}

.school-admin-body .gf-studio-badge {
    border-color: color-mix(in srgb, var(--school-brand) 30%, var(--school-line));
    color: var(--school-text);
    background: var(--school-brand-soft);
}

.school-admin-body .gf-event-table-wrap {
    scrollbar-color: color-mix(in srgb, var(--school-brand) 62%, transparent) var(--school-panel-2);
}

.school-admin-body .gf-event-table th {
    color: var(--school-muted);
    background: var(--school-panel-2);
}

.school-admin-body .gf-event-table td {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel);
}

.school-admin-body .gf-event-table tbody tr:hover td {
    background: color-mix(in srgb, var(--school-brand) 6%, var(--school-panel));
}

.school-admin-body .gf-event-table__metrics span,
.school-admin-body .gf-room-manager-card__meta span {
    color: var(--school-muted);
    background: var(--school-panel-2);
}

.school-admin-body .gf-event-table__metrics strong,
.school-admin-body .gf-event-table__identity strong,
.school-admin-body .gf-studio-stat strong {
    color: var(--school-text);
}

.school-admin-body .gf-event-control-hero__stats > div {
    border-color: var(--school-line);
    color: var(--school-text);
    background: color-mix(in srgb, var(--school-panel) 78%, transparent);
}

.school-admin-body .gf-event-modal__dialog {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel);
    box-shadow: 0 34px 100px rgba(31, 45, 73, .25);
}

.school-admin-body .gf-event-modal__header {
    border-color: var(--school-line);
    background: linear-gradient(135deg, color-mix(in srgb, var(--school-brand) 16%, var(--school-panel)), var(--school-panel));
}

.school-admin-body .gf-event-modal__header h2,
.school-admin-body .gf-event-modal__header p {
    color: var(--school-text);
}

.school-admin-body .gf-event-modal__close {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel-2);
}

.school-admin-body .gf-event-wizard-steps,
.school-admin-body .gf-event-wizard__footer {
    border-color: var(--school-line);
    background: var(--school-panel);
}

.school-admin-body .gf-event-wizard-steps button {
    border-color: var(--school-line);
    color: var(--school-muted);
    background: var(--school-panel-2);
}

.school-admin-body .gf-event-wizard-steps button.is-current {
    border-color: color-mix(in srgb, var(--school-brand) 52%, var(--school-line));
    color: var(--school-text);
    background: var(--school-brand-soft);
}

.school-admin-body .gf-event-wizard-steps button.is-current > span,
.school-admin-body .gf-event-wizard-steps button.is-complete > span {
    color: #fff;
    background: var(--school-brand);
}

.school-admin-body .gf-studio-pagination .page-link {
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel);
}

.school-admin-body .gf-studio-pagination .active > .page-link {
    border-color: var(--school-brand);
    color: #fff;
    background: var(--school-brand);
}

/* Student-facing school surfaces use the same colors instead of fixed violet. */
body.alpha-dashboard-page {
    --alpha-primary: var(--school-brand);
    --alpha-accent: var(--school-accent);
    --alpha-gradient-primary: linear-gradient(135deg, var(--school-brand), var(--school-accent));
}

body.alpha-dashboard-page .alpha-dashboard-stat__icon,
body.alpha-dashboard-page .alpha-admin-quick-card__icon,
body.alpha-dashboard-page .alpha-dashboard-stat:nth-child(n) .alpha-dashboard-stat__icon,
body.alpha-dashboard-page .alpha-admin-quick-card:nth-child(n) .alpha-admin-quick-card__icon {
    background: linear-gradient(145deg, var(--school-brand), var(--school-accent));
    box-shadow: 0 12px 30px var(--school-brand-soft);
}

body.alpha-dashboard-page .alpha-dashboard-progress-ring {
    background: conic-gradient(var(--school-accent) var(--alpha-dashboard-progress), color-mix(in srgb, white 13%, transparent) 0);
}

.school-inline-actions,
.gf-studio-actions--inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

.gf-studio-actions--inline {
    margin: 0;
    justify-content: flex-end;
}

.school-inline-actions > form,
.gf-studio-actions--inline > form {
    margin: 0;
}

@media (max-width: 575.98px) {
    .gf-studio-actions--inline .gf-studio-button {
        width: auto;
    }
}

.school-roster-dialog {
    width: min(680px, calc(100vw - 28px));
    max-width: none;
    max-height: min(780px, calc(100vh - 28px));
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(144, 132, 255, .3);
    border-radius: 24px;
    color: #eef2ff;
    background: #11192c;
    box-shadow: 0 30px 90px rgba(0, 0, 0, .55);
}

.school-roster-dialog::backdrop {
    background: rgba(3, 7, 18, .76);
    backdrop-filter: blur(7px);
}

.school-roster-dialog__panel {
    display: grid;
    gap: 15px;
    padding: 24px;
}

.school-roster-dialog__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.school-roster-dialog__head h2,
.school-roster-dialog__head p {
    margin: 3px 0 0;
}

.school-roster-dialog__close {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid rgba(153, 169, 201, .24);
    border-radius: 12px;
    color: inherit;
    background: rgba(255, 255, 255, .04);
    font-size: 1.5rem;
    cursor: pointer;
}

.school-roster-search {
    display: grid;
    gap: 7px;
    color: #b6c2dc;
    font-size: .8rem;
    font-weight: 800;
}

.school-roster-search input {
    width: 100%;
    min-height: 48px;
    padding: 0 14px;
    border: 1px solid rgba(144, 132, 255, .28);
    border-radius: 14px;
    color: #f8faff;
    background: rgba(5, 10, 22, .48);
}

.school-roster-results {
    display: grid;
    gap: 8px;
    max-height: 290px;
    overflow-y: auto;
}

.school-roster-result {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 13px;
    border: 1px solid rgba(153, 169, 201, .15);
    border-radius: 13px;
    background: rgba(255, 255, 255, .025);
    cursor: pointer;
}

.school-roster-result:has(input:checked) {
    border-color: rgba(144, 132, 255, .62);
    background: rgba(108, 99, 255, .13);
}

.school-roster-result span,
.school-roster-result strong,
.school-roster-result small {
    display: block;
}

.school-roster-result small {
    margin-top: 2px;
    color: #96a3bd;
}

.school-roster-selected {
    padding: 12px;
    border-radius: 14px;
    background: rgba(108, 99, 255, .08);
}

.school-roster-selected > div:first-of-type {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 8px;
}

.school-roster-chip {
    padding: 6px 9px;
    border: 1px solid rgba(144, 132, 255, .32);
    border-radius: 999px;
    color: #e7eaff;
    background: rgba(108, 99, 255, .14);
    cursor: pointer;
}

.school-roster-dialog footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 4px;
}

/* Dedicated school administrator navigation. The shared role navigation is a
   horizontal popover menu; this sidebar deliberately returns every group to
   normal document flow. */
.school-admin-shell {
    grid-template-columns: 306px minmax(0, 1fr);
    transition: grid-template-columns 320ms cubic-bezier(.22, 1, .36, 1);
}

.teacher-no-topbar .school-admin-shell--no-topbar {
    min-height: 100vh;
}

.teacher-no-topbar .school-admin-sidebar {
    top: 0;
    height: 100vh;
}

.teacher-mobile-nav-launch {
    position: fixed;
    z-index: 1005;
    inset: 14px auto auto 14px;
    display: none;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--school-line);
    border-radius: 12px;
    padding: 10px 13px;
    color: #fff;
    background: linear-gradient(135deg, var(--school-brand), var(--school-accent));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--school-brand) 30%, transparent);
}

.school-admin-sidebar {
    z-index: 1250;
    box-sizing: border-box;
    padding: 14px 12px;
    overflow-x: hidden;
    background:
        radial-gradient(circle at 15% 0, rgba(108, 99, 255, .12), transparent 28%),
        #090f1d;
    transition:
        width 320ms cubic-bezier(.22, 1, .36, 1),
        padding 320ms cubic-bezier(.22, 1, .36, 1),
        transform 260ms cubic-bezier(.22, 1, .36, 1);
}

.gf-campus-page .school-admin-sidebar,
.gf-houses-page .school-admin-sidebar {
    pointer-events: auto;
    isolation: isolate;
}

.gf-campus-page .school-admin-content,
.gf-houses-page .school-admin-content {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.gf-campus-page .school-admin-content > .main_wrapper,
.gf-houses-page .school-admin-content > .main_wrapper {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.school-admin-sidebar .dashboard__inner {
    box-sizing: border-box;
    height: 100%;
    max-height: none !important;
    margin: 0 !important;
    padding: 13px !important;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid rgba(144, 132, 255, .2) !important;
    border-radius: 24px;
    background:
        linear-gradient(160deg, rgba(24, 32, 57, .98), rgba(10, 17, 33, .99) 55%),
        #0b1222 !important;
    box-shadow:
        0 24px 60px rgba(0, 0, 0, .24),
        inset 0 1px 0 rgba(255, 255, 255, .035) !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(108, 99, 255, .45) transparent;
}

.school-admin-sidebar .dashboard__inner.school-admin-navigation {
    position: static !important;
    z-index: auto;
    top: auto !important;
    display: block;
    align-items: initial;
    gap: 0;
    width: auto;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.school-sidebar-welcome {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
    min-height: 88px;
    margin-bottom: 10px;
    padding: 13px 11px;
    overflow: hidden;
    border: 1px solid rgba(140, 128, 255, .24);
    border-radius: 18px;
    background:
        radial-gradient(circle at 100% 0, rgba(25, 199, 165, .18), transparent 38%),
        linear-gradient(135deg, rgba(108, 99, 255, .22), rgba(108, 99, 255, .07));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

.school-sidebar-welcome::after {
    content: "";
    position: absolute;
    right: -22px;
    bottom: -35px;
    width: 88px;
    height: 88px;
    border: 18px solid rgba(255, 255, 255, .025);
    border-radius: 50%;
    pointer-events: none;
}

.school-sidebar-welcome__identity {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.school-sidebar-welcome__avatar {
    display: grid;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 13px;
    color: #fff;
    background: linear-gradient(145deg, var(--school-brand), var(--school-accent));
    box-shadow: 0 9px 22px color-mix(in srgb, var(--school-brand) 28%, transparent);
    font-size: .92rem;
    font-weight: 900;
}

.school-sidebar-welcome__copy {
    display: grid;
    min-width: 0;
}

.school-sidebar-welcome__copy small {
    color: #9eabd0;
    font-size: .64rem;
    font-weight: 750;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.school-sidebar-welcome__copy strong,
.school-sidebar-welcome__copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.school-sidebar-welcome__copy strong {
    margin-top: 1px;
    color: #fff;
    font-size: .9rem;
    line-height: 1.25;
}

.school-sidebar-welcome__copy span {
    margin-top: 2px;
    color: #8e9bb7;
    font-size: .68rem;
}

.school-sidebar-collapse {
    position: relative;
    z-index: 2;
    display: grid;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: 10px;
    color: #e7e9ff;
    background: rgba(7, 12, 25, .42);
    cursor: pointer;
    transition:
        color 180ms ease,
        background-color 180ms ease,
        border-color 180ms ease,
        transform 320ms cubic-bezier(.22, 1, .36, 1);
}

.school-sidebar-collapse:hover,
.school-sidebar-collapse:focus-visible {
    border-color: rgba(157, 147, 255, .55);
    color: #fff;
    background: rgba(108, 99, 255, .3);
    outline: none;
}

.school-sidebar-context {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 0 2px 12px;
    padding: 0 6px 11px;
    border-bottom: 1px solid rgba(153, 169, 201, .13);
    color: #8593ad;
    font-size: .65rem;
    font-weight: 750;
}

.school-sidebar-context span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.school-sidebar-context strong {
    padding: 3px 7px;
    border-radius: 999px;
    color: #8ce7ca;
    background: rgba(53, 215, 167, .09);
    font-size: .6rem;
    text-transform: uppercase;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav {
    display: block;
    min-width: 0;
    overflow: visible;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch !important;
    justify-content: stretch !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;
    width: 100%;
    overflow: visible !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li,
.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li.alpha-sidebar-group-item {
    position: static !important;
    display: block;
    width: 100% !important;
    min-width: 0;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid transparent;
    border-radius: 14px;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li.alpha-sidebar-group-item {
    background: transparent;
    transition:
        border-color 180ms ease,
        background-color 180ms ease;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li.alpha-sidebar-group-item:has(> details[open]) {
    border-color: rgba(125, 113, 255, .17);
    background: rgba(108, 99, 255, .045);
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > a,
.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary {
    box-sizing: border-box;
    width: 100% !important;
    min-height: 47px !important;
    padding: 8px 9px !important;
    white-space: normal !important;
    transform: none !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > a:hover {
    transform: none !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group {
    position: static !important;
    width: 100%;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary .alpha-sidebar-group__text {
    flex: 1 1 auto !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary .alpha-sidebar-group__text strong {
    max-width: none !important;
    color: #d8e1f3 !important;
    font-size: .79rem;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary .alpha-sidebar-group__icon {
    width: 32px;
    height: 32px;
    flex-basis: 32px;
    border-color: rgba(132, 119, 255, .2);
    border-radius: 10px;
    color: #aaa4ff !important;
    background: rgba(108, 99, 255, .09);
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > .alpha-sidebar-group__panel {
    position: static !important;
    z-index: auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    inset: auto !important;
    padding: 2px 7px 9px 42px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transform-origin: top left;
    animation: schoolSidebarGroupIn 220ms cubic-bezier(.22, 1, .36, 1) both;
}

[dir="rtl"] .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > .alpha-sidebar-group__panel {
    padding: 2px 42px 9px 7px !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > .alpha-sidebar-group__panel::before {
    display: none !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav {
    display: grid !important;
    max-height: none !important;
    padding: 0 !important;
    overflow: visible !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a {
    min-height: 35px;
    padding: 7px 9px 7px 17px !important;
    color: #8998b5 !important;
    font-size: .74rem;
    line-height: 1.3;
}

[dir="rtl"] .school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a {
    padding: 7px 17px 7px 9px !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a::before {
    inset-inline-start: 3px;
    width: 5px;
    height: 5px;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a:hover,
.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a.is-active,
.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a[aria-current="page"] {
    color: #fff !important;
    background: rgba(108, 99, 255, .12) !important;
    transform: none;
}

.school-admin-nav-overlay {
    position: fixed;
    z-index: 980;
    inset: 78px 0 0;
    display: none;
    border: 0;
    background: rgba(3, 7, 16, .64);
    opacity: 0;
    visibility: hidden;
    cursor: default;
    backdrop-filter: blur(3px);
    transition:
        opacity 220ms ease,
        visibility 220ms ease;
}

.school-admin-shell.is-sidebar-collapsed {
    grid-template-columns: 82px minmax(0, 1fr);
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar {
    padding-inline: 8px;
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .dashboard__inner {
    padding: 9px 7px !important;
    border-radius: 20px;
}

.school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome {
    min-height: 45px;
    justify-content: center;
    margin-bottom: 8px;
    padding: 6px 0 10px;
    overflow: visible;
    border: 0;
    border-bottom: 1px solid rgba(153, 169, 201, .14);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome::after,
.school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome__identity,
.school-admin-shell.is-sidebar-collapsed .school-sidebar-context,
.school-admin-shell.is-sidebar-collapsed .school-nav-label,
.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .alpha-nav-section,
.school-admin-shell.is-sidebar-collapsed .alpha-sidebar-group__text,
.school-admin-shell.is-sidebar-collapsed .alpha-sidebar-group__chevron,
.school-admin-shell.is-sidebar-collapsed .alpha-sidebar-group__panel {
    display: none !important;
}

.school-admin-shell.is-sidebar-collapsed .school-sidebar-collapse {
    transform: rotate(180deg);
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li,
.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li.alpha-sidebar-group-item {
    border-color: transparent;
    background: transparent;
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > a,
.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary {
    justify-content: center;
    min-height: 44px !important;
    padding: 6px !important;
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > a i,
.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary .alpha-sidebar-group__icon {
    margin: 0;
}

@keyframes schoolSidebarGroupIn {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .school-admin-shell,
    .school-admin-sidebar,
    .school-sidebar-collapse,
    .school-admin-nav-overlay,
    .school-admin-sidebar .alpha-sidebar-group__panel {
        transition: none !important;
        animation: none !important;
    }
}

@media (max-width: 1024px) {
    .teacher-mobile-nav-launch {
        display: inline-flex;
    }

    .teacher-no-topbar .school-admin-content {
        padding-top: 72px;
    }

    .teacher-no-topbar .school-admin-sidebar {
        top: 0;
        height: 100vh;
    }

    .teacher-no-topbar .school-admin-nav-overlay {
        inset: 0;
    }
    .school-admin-shell,
    .school-admin-shell.is-sidebar-collapsed {
        grid-template-columns: minmax(0, 1fr);
    }

    .school-admin-sidebar {
        width: min(88vw, 328px);
        padding: 12px;
    }

    .school-admin-sidebar .dashboard__inner,
    .school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .dashboard__inner {
        padding: 13px !important;
        border-radius: 22px;
    }

    .school-sidebar-collapse {
        display: none;
    }

    .school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome {
        min-height: 88px;
        justify-content: space-between;
        margin-bottom: 10px;
        padding: 13px 11px;
        overflow: hidden;
        border: 1px solid rgba(140, 128, 255, .24);
        border-radius: 18px;
        background:
            radial-gradient(circle at 100% 0, rgba(25, 199, 165, .18), transparent 38%),
            linear-gradient(135deg, rgba(108, 99, 255, .22), rgba(108, 99, 255, .07));
    }

    .school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome::after,
    .school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome__identity,
    .school-admin-shell.is-sidebar-collapsed .school-sidebar-context,
    .school-admin-shell.is-sidebar-collapsed .school-nav-label,
    .school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .alpha-nav-section,
    .school-admin-shell.is-sidebar-collapsed .alpha-sidebar-group__text,
    .school-admin-shell.is-sidebar-collapsed .alpha-sidebar-group__chevron {
        display: flex !important;
    }

    .school-admin-shell.is-sidebar-collapsed .school-sidebar-welcome__copy {
        display: grid !important;
    }

    .school-admin-shell.is-sidebar-collapsed .alpha-sidebar-group__panel {
        display: block !important;
    }

    .school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > a,
    .school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary {
        justify-content: flex-start;
        min-height: 47px !important;
        padding: 8px 9px !important;
    }

    .school-admin-nav-overlay {
        display: block;
    }

    .school-admin-shell.is-nav-open .school-admin-nav-overlay {
        opacity: 1;
        visibility: visible;
    }
}

@media (max-width: 720px) {
    .teacher-no-topbar .school-admin-shell {
        padding-top: 0;
    }

    .teacher-no-topbar .school-admin-nav-overlay {
        inset-block-start: 0;
    }
    .school-admin-nav-overlay {
        inset-block-start: 128px;
    }
}

/* Shared role shell and full light/dark token system. School branding is
   injected as --school-brand/--school-accent by the authenticated layout. */
:root {
    --school-bg: #f3f6fb;
    --school-panel: #ffffff;
    --school-panel-2: #edf2f8;
    --school-line: rgba(32, 46, 72, .14);
    --school-text: #172238;
    --school-muted: #68758b;
    --school-danger: #d93d5d;
    --school-warning: #b87500;
    --school-success: #168866;
    --school-brand-soft: color-mix(in srgb, var(--school-brand) 13%, transparent);
    --school-accent-soft: color-mix(in srgb, var(--school-accent) 12%, transparent);
}

html.is_dark {
    --school-bg: #080d1b;
    --school-panel: #11182a;
    --school-panel-2: #172039;
    --school-line: rgba(153, 169, 201, .18);
    --school-text: #f4f7ff;
    --school-muted: #98a7c2;
    --school-danger: #ff647c;
    --school-warning: #ffbe55;
    --school-success: #35d7a7;
}

.school-admin-body,
.school-admin-body .main_wrapper,
.school-admin-content {
    color: var(--school-text);
    background-color: var(--school-bg) !important;
}

.school-admin-body .school-topbar {
    color: var(--school-text);
    background: color-mix(in srgb, var(--school-bg) 92%, transparent);
    box-shadow: 0 12px 38px rgba(31, 45, 73, .09);
}

.school-admin-body .school-topbar__brand strong,
.school-admin-body .school-profile-menu summary,
.school-admin-body .school-topbar__search input,
.school-admin-body .school-card__head h2,
.school-admin-body .school-card h2,
.school-admin-body .school-card h3,
.school-admin-body .school-page-header h1,
.school-admin-body .school-kpi strong,
.school-admin-body .school-seat-card__numbers strong,
.school-admin-body .school-alert strong,
.school-admin-body .school-list-item strong,
.school-admin-body .school-alert__count,
.school-admin-body .school-activity-stat strong,
.school-admin-body .school-detail-list dd {
    color: var(--school-text);
}

.school-topbar__workspace-note {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 9px 13px;
    border: 1px solid var(--school-line);
    border-radius: 13px;
    color: var(--school-text);
    background: color-mix(in srgb, var(--school-panel) 78%, transparent);
}

.school-topbar__workspace-note > i {
    color: var(--school-brand);
    font-size: 1.15rem;
}

.school-topbar__workspace-note span {
    display: grid;
    min-width: 0;
}

.school-topbar__workspace-note small {
    overflow: hidden;
    color: var(--school-muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.school-admin-body .school-topbar__search,
.school-admin-body .school-topbar__preview,
.school-admin-body .school-topbar__icon,
.school-admin-body .school-topbar__menu {
    color: var(--school-text);
    background: color-mix(in srgb, var(--school-panel) 72%, transparent);
}

.school-admin-body .school-topbar__search:focus-within {
    box-shadow: 0 0 0 3px var(--school-brand-soft);
}

.school-admin-body .school-profile-menu__avatar,
.school-sidebar-welcome__avatar,
.school-button,
.academic-button,
.school-progress span,
.academic-progress span {
    background: linear-gradient(135deg, var(--school-brand), var(--school-accent));
}

.school-admin-body .school-profile-menu > div {
    color: var(--school-text);
    background: var(--school-panel);
    box-shadow: 0 20px 55px rgba(31, 45, 73, .18);
}

.school-admin-body .school-profile-menu > div a,
.school-admin-body .school-profile-menu > div form {
    color: var(--school-text);
}

.school-admin-body .school-profile-menu > div a:hover,
.school-admin-body .school-profile-menu > div form:hover {
    background: var(--school-brand-soft);
}

.school-admin-body .school-admin-sidebar {
    background: var(--school-bg);
}

.school-admin-sidebar .dashboard__inner,
.student-modern-navigation.dashboard__inner {
    border-color: var(--school-line) !important;
    background: linear-gradient(160deg, var(--school-panel), color-mix(in srgb, var(--school-panel) 90%, var(--school-bg))) !important;
    box-shadow: 0 22px 54px rgba(31, 45, 73, .12) !important;
}

.school-sidebar-welcome {
    border-color: color-mix(in srgb, var(--school-brand) 25%, var(--school-line));
    background:
        radial-gradient(circle at 100% 0, var(--school-accent-soft), transparent 38%),
        linear-gradient(135deg, var(--school-brand-soft), color-mix(in srgb, var(--school-brand) 5%, transparent));
}

.school-sidebar-welcome__copy strong,
.school-sidebar-collapse {
    color: var(--school-text);
}

.school-sidebar-welcome__copy small,
.school-sidebar-welcome__copy span,
.school-sidebar-context,
.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a,
.student-modern-navigation .dashboard__nav li > a {
    color: var(--school-muted) !important;
}

.school-sidebar-context strong {
    color: color-mix(in srgb, var(--school-success) 85%, var(--school-text));
    background: color-mix(in srgb, var(--school-success) 11%, transparent);
}

.school-sidebar-collapse {
    border-color: var(--school-line);
    background: color-mix(in srgb, var(--school-panel-2) 82%, transparent);
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li.alpha-sidebar-group-item:has(> details[open]),
.school-admin-sidebar .dashboard__nav li > a[aria-current="page"],
.school-admin-sidebar .dashboard__nav li > a:hover,
.student-modern-navigation .dashboard__nav li > a[aria-current="page"],
.student-modern-navigation .dashboard__nav li > a:hover {
    border-color: color-mix(in srgb, var(--school-brand) 22%, transparent);
    color: var(--school-text) !important;
    background: var(--school-brand-soft) !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary .alpha-sidebar-group__text strong,
.school-admin-sidebar .alpha-sidebar-group:hover .alpha-sidebar-group__text strong,
.school-admin-sidebar .alpha-menu-has-active .alpha-sidebar-group__text strong {
    color: var(--school-text) !important;
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav > ul > li > .alpha-sidebar-group > summary .alpha-sidebar-group__icon {
    border-color: color-mix(in srgb, var(--school-brand) 22%, transparent);
    color: var(--school-brand) !important;
    background: var(--school-brand-soft);
}

.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a:hover,
.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a.is-active,
.school-admin-sidebar .school-admin-navigation .dashboard__nav ul.alpha-sidebar-subnav li a[aria-current="page"] {
    color: var(--school-text) !important;
    background: var(--school-brand-soft) !important;
}

.school-admin-content {
    background:
        radial-gradient(circle at 86% 0, var(--school-brand-soft), transparent 30%),
        var(--school-bg) !important;
}

.role-workspace-content {
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: var(--school-text);
    background: transparent !important;
    box-shadow: none !important;
}

/* Native Super Admin settings, safeguarding, and school-aware course catalog. */
.platform-settings-page {
    min-width: 0;
}

.platform-settings-page .dashboard__section__title {
    display: grid;
    gap: 4px;
    margin-bottom: 20px;
}

.platform-settings-page .dashboard__section__title h1 {
    margin: 0;
    color: var(--school-text);
}

.platform-settings-page .dashboard__section__title p,
.safety-queue-card p {
    margin: 0;
    color: var(--school-muted);
}

.platform-settings-page .dashboard__button__wrap {
    gap: 8px;
    overflow-x: auto;
    padding: 7px;
    border: 1px solid var(--school-line);
    border-radius: 13px;
    background: var(--school-panel);
}

.platform-settings-page .single__tab__link {
    min-height: 42px;
    white-space: nowrap;
    border-radius: 9px;
    color: var(--school-muted);
}

.platform-settings-page .single__tab__link.active {
    color: #fff;
    background: var(--school-brand);
}

.platform-settings-page .tab__content__wrapper {
    min-width: 0;
    margin-top: 14px;
    padding: 20px;
    border: 1px solid var(--school-line);
    border-radius: 17px;
    color: var(--school-text);
    background: var(--school-panel);
}

.platform-settings-page :is(.dashboard__form__input input, .form-control, select) {
    width: 100%;
    border-color: var(--school-line);
    color: var(--school-text);
    background: var(--school-panel-2);
}

.platform-settings-page :is(label, th, td) {
    color: var(--school-text);
}

.platform-settings-page .table-responsive {
    max-width: 100%;
    overflow-x: auto;
}

.school-identity {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 10px;
}

.school-identity > img,
.school-identity__fallback {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border: 1px solid var(--school-line);
    border-radius: 13px;
}

.school-identity > img {
    object-fit: contain;
    padding: 4px;
    background: #fff;
}

.school-identity__fallback {
    display: grid;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--school-brand), var(--school-accent));
    font-weight: 900;
}

.school-identity > span:last-child {
    display: grid;
    min-width: 0;
}

.school-identity small {
    color: var(--school-muted);
}

.school-identity strong {
    overflow-wrap: anywhere;
    color: var(--school-text);
}

.school-identity--compact > img,
.school-identity--compact > .school-identity__fallback {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    border-radius: 11px;
}

.school-identity--chip {
    width: fit-content;
    padding: 6px 9px 6px 6px;
    border: 1px solid var(--school-line);
    border-radius: 999px;
    background: var(--school-panel-2);
}

.school-identity--chip > img,
.school-identity--chip > .school-identity__fallback {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
    border-radius: 50%;
    padding: 2px;
    font-size: .72rem;
}

.safety-queue-card {
    display: grid;
    gap: 16px;
}

.safety-queue-card__header,
.course-catalog-card__title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.safety-queue-card__header h2 {
    margin-top: 8px;
}

.safety-queue-card .school-detail-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 18px;
}

.safety-review-form {
    grid-template-columns: minmax(170px, .3fr) minmax(260px, 1fr) auto;
    align-items: end;
    padding-top: 15px;
    border-top: 1px solid var(--school-line);
}

.safety-review-form__confirmation {
    grid-column: 1 / -1;
}

.school-callout {
    padding: 13px 15px;
    border: 1px solid var(--school-line);
    border-inline-start: 4px solid var(--school-brand);
    border-radius: 11px;
    color: var(--school-text);
    background: var(--school-panel-2);
}

.school-callout p {
    margin-top: 5px;
    white-space: pre-wrap;
}

.course-catalog-card {
    display: grid;
    gap: 13px;
    padding: 16px;
    overflow: hidden;
}

.course-catalog-card__summary {
    display: grid;
    grid-template-columns: minmax(170px, 220px) minmax(0, 1fr);
    gap: 16px;
}

.course-catalog-card__image {
    display: block;
    height: 150px;
    overflow: hidden;
    border-radius: 14px;
    background: var(--school-panel-2);
}

.course-catalog-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.course-catalog-card__body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    gap: 10px;
}

.course-catalog-card__title h2 {
    margin-top: 7px;
}

.course-catalog-card__title h2 a {
    color: var(--school-text);
}

.course-school-list,
.course-workspace-card__actions,
.course-offering-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.course-delivery-details {
    border-top: 1px solid var(--school-line);
}

.course-delivery-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 15px 0 0;
    color: var(--school-text);
    cursor: pointer;
    font-weight: 800;
}

.course-delivery-details:not([open]) > summary {
    padding-bottom: 2px;
}

.course-delivery-details[open] > summary {
    padding-bottom: 13px;
    border-bottom: 1px solid var(--school-line);
}

.course-delivery-details > summary::after {
    content: "+";
    margin-inline-start: auto;
    color: var(--school-brand);
    font-size: 1.25rem;
    line-height: 1;
}

.course-delivery-details[open] > summary::after {
    content: "−";
}

.course-delivery-details > summary span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.course-delivery-details > summary strong {
    display: grid;
    place-items: center;
    min-width: 29px;
    height: 29px;
    border-radius: 999px;
    color: var(--school-text);
    background: var(--school-panel-2);
}

.course-delivery-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr));
    gap: 12px;
    padding-top: 14px;
}

.course-delivery-class {
    display: grid;
    min-width: 0;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--school-line);
    border-radius: 13px;
    background: var(--school-panel-2);
}

.course-delivery-class .school-detail-list {
    font-size: .8rem;
}

.course-delivery-class .school-detail-list > div {
    align-items: flex-start;
}

.course-delivery-class .school-detail-list dd {
    max-width: 62%;
    overflow-wrap: anywhere;
}

.course-offering-links {
    align-items: center;
    padding-top: 14px;
    border-top: 1px solid var(--school-line);
}

.course-delivery-details > .course-school-list,
.course-delivery-details > .course-offering-links {
    padding-top: 13px;
}

.course-workspace-card__actions > form {
    display: flex;
    margin: 0;
}

.course-workspace-card__actions > form .school-button {
    width: 100%;
}

.course-form,
.course-form-curriculum,
.course-detail-offerings,
.course-detail-curriculum {
    display: grid;
    gap: 16px;
}

.course-form-section {
    display: grid;
    gap: 16px;
}

.course-form-section .school-card__head {
    margin-bottom: 0;
}

.course-form label > small {
    color: var(--school-muted);
    font-weight: 500;
}

.course-form-error,
.course-form-total--invalid {
    color: var(--school-danger) !important;
}

.course-form-media-preview {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 11px;
    border: 1px solid var(--school-line);
    border-radius: 13px;
    background: var(--school-panel-2);
}

.course-form-media-preview img {
    width: 112px;
    height: 70px;
    border-radius: 9px;
    object-fit: cover;
}

.course-form-media-preview div,
.course-form-media-preview strong,
.course-form-media-preview small {
    display: block;
}

.course-form-media-preview small {
    margin-top: 3px;
    color: var(--school-muted);
}

.course-form-path {
    display: grid;
    gap: 14px;
    padding: 17px;
    border: 1px solid color-mix(in srgb, var(--school-brand) 25%, var(--school-line));
    border-radius: 15px;
    background: var(--school-panel-2);
}

.course-form-node-head,
.course-detail-offering__head,
.course-detail-owner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.course-form-node-head h3 {
    margin-top: 5px;
}

.course-form-modules,
.course-form-modules > [data-module-list] {
    display: grid;
    gap: 11px;
}

.course-form-modules {
    padding-top: 14px;
    border-top: 1px solid var(--school-line);
}

.course-form-module {
    display: grid;
    gap: 11px;
    padding: 13px;
    border: 1px solid var(--school-line);
    border-radius: 12px;
    background: var(--school-panel);
}

.course-form-module__row {
    grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) minmax(85px, .28fr) auto;
    align-items: end;
}

.course-form-submit {
    position: sticky;
    z-index: 5;
    bottom: 14px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 13px;
    border: 1px solid var(--school-line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--school-panel) 92%, transparent);
    box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
    backdrop-filter: blur(16px);
}

.course-detail-hero {
    display: grid;
    grid-template-columns: minmax(230px, 340px) minmax(0, 1fr);
    gap: 20px;
}

.course-detail-hero__cover {
    width: 100%;
    height: 230px;
    border-radius: 14px;
    object-fit: cover;
}

.course-detail-hero__body {
    display: grid;
    align-content: start;
    gap: 18px;
}

.course-detail-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.course-detail-facts > div {
    padding: 12px;
    border: 1px solid var(--school-line);
    border-radius: 11px;
    background: var(--school-panel-2);
}

.course-detail-facts dt,
.course-detail-class dt {
    color: var(--school-muted);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.course-detail-facts dd,
.course-detail-class dd {
    margin: 4px 0 0;
    color: var(--school-text);
    overflow-wrap: anywhere;
}

.course-detail-offering {
    display: grid;
    gap: 15px;
    padding: 16px;
    border: 1px solid var(--school-line);
    border-radius: 15px;
    background: var(--school-panel-2);
}

.course-detail-offering__facts {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px 14px;
}

.course-detail-offering__facts > div {
    display: block;
    padding: 8px 0;
}

.course-detail-offering__facts dd {
    max-width: none;
    margin-top: 3px;
    text-align: start;
}

.course-detail-class-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    gap: 11px;
}

.course-detail-class {
    display: grid;
    align-content: start;
    gap: 11px;
    padding: 13px;
    border: 1px solid var(--school-line);
    border-radius: 12px;
    background: var(--school-panel);
}

.course-detail-class h3 {
    margin: 6px 0 2px;
}

.course-detail-class > div > small,
.course-detail-module > div > small {
    color: var(--school-muted);
}

.course-detail-class dl {
    display: grid;
    gap: 8px;
    margin: 0;
}

.course-detail-class dl > div {
    display: grid;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 9px;
}

.course-detail-class dd {
    margin: 0;
}

.course-detail-empty {
    min-height: 130px;
}

.course-detail-unlinked {
    display: grid;
    gap: 12px;
    margin-top: 17px;
    padding-top: 17px;
    border-top: 1px solid var(--school-line);
}

.course-detail-cycle {
    overflow: hidden;
    border: 1px solid var(--school-line);
    border-radius: 13px;
    background: var(--school-panel-2);
}

.course-detail-cycle > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    color: var(--school-text);
    cursor: pointer;
}

.course-detail-cycle > summary span:first-child {
    display: grid;
}

.course-detail-cycle > summary small,
.course-detail-cycle > summary span:last-child {
    color: var(--school-muted);
}

.course-detail-cycle > p {
    margin: 0;
    padding: 0 16px 14px;
    color: var(--school-muted);
}

.course-detail-module-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr));
    gap: 12px;
    padding: 15px;
    border-top: 1px solid var(--school-line);
}

.course-detail-module {
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--school-line);
    border-radius: 12px;
    background: var(--school-panel);
}

.course-detail-module h3 {
    margin: 6px 0 2px;
}

.course-detail-module > p {
    margin: 9px 0;
    color: var(--school-muted);
}

.course-detail-lessons {
    display: grid;
    gap: 8px;
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

.course-detail-lessons li {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    padding: 9px;
    border-radius: 9px;
    background: var(--school-panel-2);
}

.course-detail-lessons li > span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: var(--school-brand);
    font-weight: 800;
}

.course-detail-lessons strong,
.course-detail-lessons small {
    display: block;
}

.course-detail-lessons small {
    margin-top: 2px;
    color: var(--school-muted);
}

.course-detail-lessons .course-detail-lessons__empty {
    display: block;
    color: var(--school-muted);
}

.course-offering-links > strong {
    width: 100%;
    color: var(--school-text);
}

.course-offering-links a {
    display: grid;
    gap: 2px;
    padding: 9px 11px;
    border: 1px solid var(--school-line);
    border-radius: 10px;
    color: var(--school-text);
    background: var(--school-panel-2);
}

.course-offering-links a span {
    color: var(--school-muted);
    font-size: .75rem;
}

.super-admin-legacy-upgraded .alpha-site-header,
.super-admin-legacy-upgraded .alpha-footer {
    display: none !important;
}

.super-admin-modern-shell .super-admin-page-content {
    min-height: calc(100vh - 48px);
    padding: clamp(18px, 2.8vw, 38px) !important;
    border: 1px solid var(--school-line) !important;
    border-radius: 26px !important;
    background: color-mix(in srgb, var(--school-panel) 94%, transparent) !important;
    box-shadow: 0 24px 70px rgba(31, 45, 73, .12) !important;
}

.super-admin-modern-shell .super-admin-page-content .dashboard__section__title {
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--school-line);
}

.super-admin-modern-shell .super-admin-page-content .table,
.super-admin-modern-shell .super-admin-page-content table {
    color: var(--school-text);
    border-color: var(--school-line);
    background: var(--school-panel);
}

.super-admin-modern-shell .super-admin-page-content :is(.form-control, .form-select, select, textarea, input) {
    border-color: var(--school-line);
    color: var(--school-text);
    background-color: var(--school-panel);
}

.role-workspace-content .alpha-dashboard-page {
    --alpha-ink: var(--school-text);
    --alpha-muted: var(--school-muted);
    --alpha-text: var(--school-text);
    --alpha-text-muted: var(--school-muted);
    --alpha-surface: color-mix(in srgb, var(--school-panel) 92%, transparent);
    --alpha-surface-solid: var(--school-panel);
    --alpha-surface-soft: var(--school-panel-2);
    --alpha-border: var(--school-line);
    --alpha-shadow-sm: 0 16px 42px rgba(31, 45, 73, .12);
    --alpha-shadow-md: 0 28px 68px rgba(31, 45, 73, .18);
}

.role-workspace-content .alpha-admin-section,
.role-workspace-content .alpha-admin-quick-card {
    color: var(--school-text);
    background: var(--alpha-surface);
}

.role-workspace-content .alpha-admin-focus {
    color: var(--school-text);
    background: linear-gradient(145deg, color-mix(in srgb, var(--school-brand) 13%, var(--school-panel)), var(--school-panel));
}

.role-workspace-content .alpha-admin-focus-card {
    border-color: var(--school-line);
    background: color-mix(in srgb, var(--school-panel-2) 72%, transparent);
}

.role-workspace-content .alpha-admin-quick-card__icon,
.role-workspace-content .alpha-admin-quick-card:nth-child(4n + 2) .alpha-admin-quick-card__icon,
.role-workspace-content .alpha-admin-quick-card:nth-child(4n + 3) .alpha-admin-quick-card__icon,
.role-workspace-content .alpha-admin-quick-card:nth-child(4n + 4) .alpha-admin-quick-card__icon,
.role-workspace-content .alpha-admin-focus-card span {
    background: linear-gradient(145deg, var(--school-brand), var(--school-accent));
}

.role-workspace-content .alpha-admin-quick-card__arrow {
    color: var(--school-brand);
}

.communication-page,
.resource-library-page,
.course-workspace-page {
    color: var(--school-text);
}

.course-workspace-filter {
    padding: 15px;
}

.course-workspace-filter .school-filters {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
}

.course-workspace-filter .school-button {
    min-height: 43px;
}

.course-workspace-page > .school-page-header .school-button {
    white-space: nowrap;
}

.course-workspace-card {
    display: grid;
    grid-template-rows: 180px minmax(0, 1fr);
    padding: 0;
    overflow: hidden;
}

.course-workspace-card__image {
    display: block;
    overflow: hidden;
    background: var(--school-panel-2);
}

.course-workspace-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 320ms cubic-bezier(.22, 1, .36, 1);
}

.course-workspace-card:hover .course-workspace-card__image img {
    transform: scale(1.035);
}

.course-workspace-card__body {
    display: flex;
    flex-direction: column;
    gap: 13px;
    padding: 18px;
}

.course-workspace-card__body h2 {
    font-size: 1.12rem;
    line-height: 1.35;
}

.course-workspace-card__body h2 a {
    color: var(--school-text);
}

.course-workspace-card__meta,
.course-workspace-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 14px;
}

.course-workspace-card__meta {
    color: var(--school-muted);
    font-size: .79rem;
}

.course-workspace-card__meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.course-workspace-card__actions {
    margin-top: auto;
}

.course-workspace-card__actions .school-button {
    flex: 1 1 135px;
}

.communication-list {
    display: grid;
    gap: 10px;
}

.communication-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 13px;
    padding: 15px;
    border: 1px solid var(--school-line);
    border-radius: 13px;
    background: var(--school-panel-soft);
}

.communication-item.is-unread {
    border-color: color-mix(in srgb, var(--school-brand) 45%, var(--school-line));
    background: color-mix(in srgb, var(--school-brand) 8%, var(--school-panel));
}

.communication-item__icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    color: var(--school-brand);
    background: color-mix(in srgb, var(--school-brand) 13%, transparent);
}

.communication-item__title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.communication-item p {
    margin: 5px 0;
    color: var(--school-muted);
    overflow-wrap: anywhere;
}

.communication-item small {
    color: var(--school-muted);
}

.communication-compose-card {
    max-width: 860px;
}

.communication-important {
    width: 100%;
    border: 1px solid var(--school-line);
    background: var(--school-panel-soft);
}

.communication-important strong,
.communication-important small {
    display: block;
}

.communication-important small {
    color: var(--school-muted);
    font-weight: 500;
}

.resource-library-page .school-table {
    min-width: 1080px;
}

.resource-library-page .school-table td,
.resource-library-page .school-table th {
    color: var(--school-text);
}

.resource-library-page .school-table a {
    color: var(--school-brand);
}

.resource-library-page .form-control,
.resource-library-page select {
    color: var(--school-text);
    background: var(--school-field);
    border-color: var(--school-line);
}

.school-card,
.school-kpi,
.school-activity-stat,
.school-alert,
.school-list-item,
.school-check,
.school-score-pulse article {
    color: var(--school-text);
    background: var(--school-panel);
    box-shadow: 0 15px 42px rgba(31, 45, 73, .07);
}

.school-card,
.school-kpi,
.school-table-wrap,
.school-tabs,
.school-form input,
.school-form select,
.school-form textarea,
.school-filters input,
.school-filters select,
.school-check-grid {
    border-color: var(--school-line);
}

.school-button {
    border-color: color-mix(in srgb, var(--school-brand) 30%, transparent);
}

.school-button--secondary,
.school-tabs,
.school-badge,
.school-page .page-link {
    color: var(--school-text) !important;
    background: var(--school-panel-2);
}

.school-kicker,
.school-table a,
.school-empty i {
    color: var(--school-brand);
}

.school-table th {
    color: var(--school-muted);
    background: var(--school-panel-2);
}

.school-table td,
.school-form label,
.school-filters label {
    color: var(--school-text);
}

.school-form input,
.school-form select,
.school-form textarea,
.school-filters input,
.school-filters select,
.school-roster-search input {
    color: var(--school-text);
    background: var(--school-panel);
}

.school-form input:focus,
.school-form select:focus,
.school-form textarea:focus,
.school-filters input:focus,
.school-filters select:focus {
    box-shadow: 0 0 0 3px var(--school-brand-soft);
}

.school-roster-dialog {
    color: var(--school-text);
    background: var(--school-panel);
}

.school-roster-result,
.school-roster-selected {
    color: var(--school-text);
    background: var(--school-panel-2);
}

.school-roster-result:has(input:checked),
.school-roster-chip {
    border-color: color-mix(in srgb, var(--school-brand) 38%, transparent);
    color: var(--school-text);
    background: var(--school-brand-soft);
}

/* Student pages keep their existing responsive columns while sharing the
   same visual navigation language and avoiding the old overlay transformer. */
.student-modern-navigation.dashboard__inner {
    position: sticky !important;
    top: 96px !important;
    max-height: calc(100vh - 116px);
    margin-bottom: 28px !important;
    padding: 13px !important;
    overflow-y: auto;
    border: 1px solid var(--school-line) !important;
    border-radius: 24px;
}

.student-modern-navigation .dashboard__nav,
.student-modern-navigation .dashboard__nav > ul {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 5px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.student-modern-navigation .dashboard__nav li {
    position: static !important;
    width: 100% !important;
}

.student-modern-navigation .dashboard__nav li > a,
.student-modern-navigation .dashboard__nav li > form .alpha-logout-button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    padding: 9px 10px !important;
    border-radius: 11px;
    transform: none !important;
}

.student-modern-navigation .dashboard__nav li > a i {
    color: var(--school-brand);
}

.student-modern-navigation .alpha-nav-section {
    padding: 10px 9px 4px;
}

.student-modern-navigation .alpha-nav-section span {
    color: var(--school-muted);
    font-size: .67rem;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

/* Theme and school branding also reach the connected course/resource and
   event workspaces rendered inside the role shell. */
.school-admin-body .academic-workspace {
    --academic-bg: var(--school-bg);
    --academic-panel: var(--school-panel);
    --academic-line: var(--school-line);
    --academic-text: var(--school-text);
    --academic-muted: var(--school-muted);
    --academic-brand: var(--school-brand);
    --academic-brand-2: var(--school-accent);
    background: radial-gradient(circle at top right, var(--school-brand-soft), transparent 34%), var(--academic-bg);
}

.school-admin-body .academic-card,
.school-admin-body .academic-grade,
.school-admin-body .academic-course-card,
.school-admin-body .academic-class-card,
.school-admin-body .academic-lesson,
.school-admin-body .academic-metric,
.school-admin-body .academic-resource,
.school-admin-body .academic-details,
.school-admin-body .academic-nav,
.school-admin-body .academic-wizard-nav {
    color: var(--academic-text);
    background: var(--academic-panel);
}

.school-admin-body .academic-button:not(.academic-button--secondary):not(.academic-button--danger),
.school-admin-body .academic-step {
    border-color: color-mix(in srgb, var(--school-brand) 45%, transparent);
    background: linear-gradient(135deg, var(--school-brand), var(--school-accent));
    box-shadow: 0 12px 28px color-mix(in srgb, var(--school-brand) 22%, transparent);
}

.school-admin-body .academic-kicker,
.school-admin-body .academic-breadcrumb a {
    color: var(--school-brand);
}

.school-admin-body .academic-course-card:hover,
.school-admin-body .academic-curriculum-node {
    border-color: color-mix(in srgb, var(--school-brand) 40%, var(--school-line));
}

.school-admin-body .academic-curriculum-node {
    background: color-mix(in srgb, var(--school-brand) 5%, var(--school-panel));
}

.school-admin-body .academic-workspace input:focus,
.school-admin-body .academic-workspace select:focus,
.school-admin-body .academic-workspace textarea:focus {
    border-color: var(--school-brand);
    box-shadow: 0 0 0 3px var(--school-brand-soft);
}

.school-admin-body .academic-hero h1,
.school-admin-body .academic-section-head h2,
.school-admin-body .academic-section-head h3,
.school-admin-body .academic-grade h3,
.school-admin-body .academic-course-card h3,
.school-admin-body .academic-class-card h3,
.school-admin-body .academic-lesson h3,
.school-admin-body .academic-metric strong,
.school-admin-body .academic-stat strong,
.school-admin-body .academic-course-cell,
.school-admin-body .academic-empty h3 {
    color: var(--academic-text);
}

.school-admin-body .academic-button--secondary,
.school-admin-body .academic-badge,
.school-admin-body .academic-chip,
.school-admin-body .academic-tab,
.school-admin-body .academic-table th {
    color: var(--academic-text) !important;
    background: var(--school-panel-2);
}

.school-admin-body .academic-workspace input,
.school-admin-body .academic-workspace select,
.school-admin-body .academic-workspace textarea,
.school-admin-body .academic-results {
    color: var(--academic-text);
    background: var(--academic-panel);
}

.school-admin-body .academic-table td,
.school-admin-body .academic-workspace label,
.school-admin-body .academic-details summary,
.school-admin-body .academic-result {
    color: var(--academic-text);
}

.school-admin-body .gf-studio-page {
    --gf-studio-ink: var(--school-text);
    --gf-studio-muted: var(--school-muted);
    --gf-studio-panel: color-mix(in srgb, var(--school-panel) 92%, transparent);
    --gf-studio-panel-strong: var(--school-panel);
    --gf-studio-line: var(--school-line);
    --gf-studio-violet: var(--school-brand);
    --gf-studio-cyan: var(--school-accent);
}

.school-admin-body .gf-studio-hero {
    background:
        radial-gradient(circle at 88% 14%, var(--school-accent-soft), transparent 17rem),
        radial-gradient(circle at 62% 115%, var(--school-brand-soft), transparent 20rem),
        linear-gradient(135deg, color-mix(in srgb, var(--school-brand) 22%, var(--school-panel)), var(--school-panel));
}

.school-admin-body .gf-studio-kicker {
    color: var(--school-brand);
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .dashboard__nav > ul > li > a,
.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .dashboard__nav > ul > li > form .alpha-logout-button {
    font-size: 0 !important;
}

.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .dashboard__nav > ul > li > a i,
.school-admin-shell.is-sidebar-collapsed .school-admin-sidebar .dashboard__nav > ul > li > form .alpha-logout-button i {
    font-size: 1rem !important;
}

/* Student roster lifecycle and bounded class lookup. */
.school-row-actions {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

.school-row-actions form {
    margin: 0;
}

.school-button:disabled,
.school-button[disabled] {
    cursor: not-allowed;
    opacity: .48;
    filter: grayscale(.2);
}

.school-typeahead {
    position: relative;
    min-width: 0;
}

.school-typeahead__results {
    position: absolute;
    z-index: 80;
    top: calc(100% + 7px);
    right: 0;
    left: 0;
    display: grid;
    max-height: 280px;
    overflow-y: auto;
    padding: 6px;
    border: 1px solid color-mix(in srgb, var(--school-brand) 34%, var(--school-line));
    border-radius: 12px;
    background: var(--school-panel);
    box-shadow: 0 22px 50px color-mix(in srgb, var(--school-bg) 66%, transparent);
}

.school-typeahead__results[hidden] {
    display: none;
}

.school-typeahead__option {
    display: grid;
    gap: 3px;
    width: 100%;
    padding: 10px;
    border: 0;
    border-radius: 9px;
    color: var(--school-text);
    text-align: start;
    background: transparent;
    cursor: pointer;
}

.school-typeahead__option:hover,
.school-typeahead__option:focus-visible {
    background: var(--school-brand-soft);
}

.school-typeahead__option small,
.school-typeahead__empty,
.school-import-note {
    color: var(--school-muted);
}

.school-typeahead__empty {
    margin: 0;
    padding: 12px;
}

.school-divider {
    height: 1px;
    margin: 18px 0;
    border: 0;
    background: var(--school-line);
}

.school-import-note {
    margin: 12px 0 0;
    font-size: .84rem;
}

.school-import-note strong {
    color: var(--school-text);
}

@media (max-width: 1024px) {
    .student-modern-navigation.dashboard__inner {
        position: static !important;
        max-height: none;
    }
}

@media (max-width: 720px) {
    .course-catalog-card__summary {
        grid-template-columns: minmax(0, 1fr);
    }

    .course-catalog-card__image {
        max-height: 220px;
    }

    .course-catalog-card__title,
    .safety-queue-card__header {
        display: grid;
    }

    .course-detail-hero,
    .course-detail-facts,
    .course-detail-offering__facts,
    .course-form-module__row {
        grid-template-columns: minmax(0, 1fr);
    }

    .course-detail-hero__cover {
        height: 210px;
    }

    .course-detail-owner,
    .course-detail-offering__head,
    .course-form-node-head {
        display: grid;
    }

    .course-form-submit {
        display: grid;
        grid-template-columns: 1fr;
    }

    .course-form-submit .school-button {
        width: 100%;
    }

    .safety-queue-card .school-detail-list,
    .safety-review-form {
        grid-template-columns: minmax(0, 1fr);
    }

    .safety-review-form__confirmation {
        grid-column: auto;
    }

    .course-workspace-filter .school-filters {
        grid-template-columns: minmax(0, 1fr);
    }

    .school-topbar__workspace-note {
        position: absolute;
        z-index: 2;
        top: 79px;
        right: 12px;
        left: 12px;
        background: var(--school-panel);
    }
}