body.page {
    --repo-fb-body-size: 0.9375rem;
    --repo-fb-body-line: 1.3334;
    --repo-fb-body-weight: 400;
    --repo-fb-link-weight: 500;
    --repo-fb-small-size: 0.8125rem;
    --repo-fb-small-line: 1.3847;
    --repo-fb-h1-size: clamp(1.625rem, 1.48rem + 0.45vw, 1.875rem);
    --repo-fb-h2-size: clamp(1.25rem, 1.14rem + 0.28vw, 1.375rem);
    --repo-fb-h3-size: clamp(1.0625rem, 1rem + 0.14vw, 1.125rem);
    --repo-fb-h4-size: 0.9375rem;
    --repo-fb-h5-size: 0.8125rem;
    --repo-fb-copy-space: 12px;
    --repo-fb-title-space-lg: 12px;
    --repo-fb-title-space-md: 10px;
    --repo-fb-title-space-sm: 8px;
}

body.page .layout-stack {
    font-size: var(--repo-fb-body-size);
    line-height: var(--repo-fb-body-line);
    font-weight: var(--repo-fb-body-weight);
    letter-spacing: 0;
    --repo-container-border: rgba(11, 107, 58, 0.48);
}

body.page .layout-stack :where(
    .panel,
    .card,
    .module-card,
    .meta-card,
    .registry-top-card,
    .registry-results-card,
    .empty-state,
    .transfer-group,
    .transfer-card,
    .transfer-meta-card,
    .transfer-stats-head,
    .transfer-stats-summary,
    .transfer-stats-group,
    .transfer-stats-card,
    .general-db-summary-card,
    .general-db-group,
    .settings-card,
    .settings-result-card,
    .settings-attendance-card,
    .advisory-panel,
    .dash-banner,
    .dash-panel,
    .dash-card,
    [class$='-card'],
    [class*='-card '],
    [class$='-panel'],
    [class*='-panel ']
) {
    border: 1px solid var(--repo-container-border);
}

body.page .layout-stack :where(h1, h2, h3, h4, h5) {
    margin-block-start: 0;
    padding: 0;
    color: var(--text);
}

body.page .layout-stack :where(p, ul, ol, dl, blockquote, figure) {
    margin-block-start: 0;
    margin-block-end: var(--repo-fb-copy-space);
}

body.page .layout-stack :where(p, ul, ol, dl, blockquote, figure):last-child {
    margin-block-end: 0;
}

body.page .layout-stack :where(ul, ol) {
    padding-inline-start: 1.25rem;
}

body.page .layout-stack :where(li, dd) {
    margin-block-end: 4px;
}

body.page .layout-stack p,
body.page .layout-stack li,
body.page .layout-stack dd,
body.page .layout-stack dt {
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    letter-spacing: 0;
}

body.page .layout-stack h1,
body.page .layout-stack h1.section-title,
body.page .layout-stack h1.page-title,
body.page .layout-stack h1.settings-page-title,
body.page .layout-stack h1.public-page-title {
    font-size: var(--repo-fb-h1-size);
    font-weight: 700;
    line-height: 1.1667;
    letter-spacing: -0.02em;
    margin-block-end: var(--repo-fb-title-space-lg);
}

body.page .layout-stack h2,
body.page .layout-stack h2.section-title,
body.page .layout-stack h2.page-title,
body.page .layout-stack h2.settings-section-title,
body.page .layout-stack .card-header > .section-title:not(h1),
body.page .layout-stack .module-header > .section-title:not(h1),
body.page .layout-stack .registry-card-title,
body.page .layout-stack .dash-card-head,
body.page .layout-stack .dash-card-h {
    font-size: var(--repo-fb-h2-size);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.015em;
    margin-block-end: var(--repo-fb-title-space-md);
}

body.page .layout-stack h3,
body.page .layout-stack h3.section-title,
body.page .layout-stack h3.page-title,
body.page .layout-stack .subsection-title {
    font-size: var(--repo-fb-h3-size);
    font-weight: 600;
    line-height: 1.2353;
    letter-spacing: -0.01em;
    margin-block-end: var(--repo-fb-title-space-sm);
}

body.page .layout-stack h4 {
    font-size: var(--repo-fb-h4-size);
    font-weight: 600;
    line-height: var(--repo-fb-body-line);
    letter-spacing: 0;
    margin-block-end: 6px;
}

body.page .layout-stack h5 {
    font-size: var(--repo-fb-h5-size);
    font-weight: 600;
    line-height: var(--repo-fb-small-line);
    letter-spacing: 0.01em;
    margin-block-end: 4px;
}

body.page .layout-stack a:not(.btn):not(.fb-tab):not(.module-tab-link):not(.admin-role-tab):not(.transfer-page-tab) {
    font-size: inherit;
    line-height: inherit;
    letter-spacing: 0;
    text-underline-offset: 0.14em;
}

body.page .layout-stack :where(p, li, dd, dt, .hint, .page-subtitle, .help-text, .flash__msg) a:not(.btn):not(.fb-tab):not(.module-tab-link):not(.admin-role-tab):not(.transfer-page-tab) {
    font-weight: var(--repo-fb-link-weight);
}

body.page .layout-stack .hint,
body.page .layout-stack .page-subtitle,
body.page .layout-stack .help-text,
body.page .layout-stack .flash__msg,
body.page .layout-stack .transfer-card__copy,
body.page .layout-stack .transfer-group__hint {
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    letter-spacing: 0;
}

body.page .layout-stack .small,
body.page .layout-stack .meta-label,
body.page .layout-stack .field label,
body.page .layout-stack .badge,
body.page .layout-stack .transfer-card__eyebrow,
body.page .layout-stack .transfer-group__eyebrow,
body.page .layout-stack .transfer-meta-label {
    font-size: var(--repo-fb-small-size);
    line-height: var(--repo-fb-small-line);
    font-weight: 500;
    letter-spacing: 0.01em;
}

body.page .layout-stack .meta-value {
    font-size: 1.0625rem;
    line-height: 1.2353;
    font-weight: 600;
    letter-spacing: -0.01em;
}

body.page .layout-stack .field label {
    padding-bottom: 2px;
}

@media (max-width: 760px) {
    body.page {
        --repo-fb-h1-size: clamp(1.5rem, 1.36rem + 0.38vw, 1.68rem);
        --repo-fb-h2-size: clamp(1.16rem, 1.08rem + 0.2vw, 1.24rem);
        --repo-fb-h3-size: clamp(1rem, 0.96rem + 0.12vw, 1.06rem);
        --repo-fb-copy-space: 10px;
    }
}

@media screen {
    html[data-theme='dark'] body.page {
        --repo-dark-page: #0d1712;
        --repo-dark-panel: #111e17;
        --repo-dark-panel-2: #14231b;
        --repo-dark-field: #08120d;
        --repo-dark-field-2: #0b160f;
        --repo-dark-head: #18291f;
        --repo-dark-border: rgba(176, 213, 190, 0.18);
        --repo-dark-border-strong: rgba(176, 213, 190, 0.28);
        --repo-dark-text: #f1f8f4;
        --repo-dark-muted: #b3c5bb;
        --repo-dark-faint: #7f9589;
        --repo-dark-accent: #79c993;
        --repo-dark-accent-strong: #0b5f33;
        --repo-dark-accent-deep: #003d10;
    }

    html[data-theme='dark'] body.page .layout-stack {
        --repo-container-border: rgba(121, 201, 147, 0.34);
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .panel,
        .card,
        .module-card,
        .empty-state,
        .meta-card,
        .table-shell,
        .table-wrap,
        .auto-table-wrap,
        .scholarship-stat-card,
        .scholarship-note,
        .scholarship-modal__dialog,
        .scholarship-modal__head,
        .scholarship-modal__body,
        .attendance-report-table-wrap,
        .attendance-report-meta-grid,
        .self-attendance-summary-table,
        .self-attendance-note,
        .self-attendance-calendar,
        .self-attendance-calendar-cell,
        .anf-report-wrap,
        .anf-setting-card,
        .anf-setting-current,
        .anf-approver-card,
        .academic-profile-control-panel,
        .academic-profile-sheet,
        .academic-profile-empty,
        .transfer-card,
        .transfer-section,
        .violation-report-card
    ) {
        background: var(--repo-dark-panel) !important;
        border-color: var(--repo-dark-border) !important;
        color: var(--repo-dark-text) !important;
        box-shadow: 0 20px 42px rgba(0, 0, 0, 0.28) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .toolbar,
        .table-toolbar,
        .card-header,
        .module-header,
        .scholarship-modal__head,
        .academic-profile-control-head
    ) {
        background: linear-gradient(180deg, rgba(121, 201, 147, 0.08), rgba(17, 30, 23, 0)) !important;
        border-color: var(--repo-dark-border) !important;
        color: var(--repo-dark-text) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        table,
        .table,
        .repo-table,
        .tc-table,
        .scholarship-table,
        .attendance-report-table,
        .self-attendance-summary-table,
        .anf-report-table,
        .anf-setting-table,
        .anf-approver-personnel-table,
        .violation-report-table,
        .academic-profile-table
    ) {
        background: var(--repo-dark-field) !important;
        color: var(--repo-dark-text) !important;
        border-color: var(--repo-dark-border) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        table,
        .table,
        .repo-table,
        .tc-table,
        .scholarship-table,
        .attendance-report-table,
        .self-attendance-summary-table,
        .anf-report-table,
        .anf-setting-table,
        .anf-approver-personnel-table,
        .violation-report-table,
        .academic-profile-table
    ) :where(th, td) {
        background: var(--repo-dark-field) !important;
        border-color: var(--repo-dark-border) !important;
        color: var(--repo-dark-text) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        table,
        .table,
        .repo-table,
        .tc-table,
        .scholarship-table,
        .attendance-report-table,
        .self-attendance-summary-table,
        .anf-report-table,
        .anf-setting-table,
        .anf-approver-personnel-table,
        .violation-report-table,
        .academic-profile-table
    ) :where(thead th, .academic-profile-subhead) {
        background: var(--repo-dark-head) !important;
        border-color: var(--repo-dark-border-strong) !important;
        color: #dff4e7 !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        table,
        .table,
        .repo-table,
        .tc-table,
        .scholarship-table,
        .attendance-report-table,
        .anf-report-table,
        .anf-setting-table,
        .anf-approver-personnel-table,
        .violation-report-table,
        .academic-profile-table
    ) tbody tr:nth-child(even) > * {
        background: var(--repo-dark-field-2) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        table,
        .table,
        .repo-table,
        .tc-table,
        .scholarship-table,
        .attendance-report-table,
        .anf-report-table,
        .anf-setting-table,
        .anf-approver-personnel-table,
        .violation-report-table,
        .academic-profile-table
    ) tbody tr:hover > * {
        background: #13261b !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .section-title,
        .page-title,
        .subsection-title,
        .scholarship-stat-card__value,
        .academic-profile-brand-name,
        .academic-profile-doc-title h2,
        .academic-profile-doc-title h3,
        .academic-profile-doc-title h4,
        strong,
        b
    ) {
        color: var(--repo-dark-text) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .hint,
        .small,
        .scholarship-muted,
        .scholarship-stat-card__label,
        .attendance-report-toolbar-note,
        .academic-profile-brand-copy,
        .academic-profile-print-date,
        .self-attendance-summary-label,
        label
    ) {
        color: var(--repo-dark-muted) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .input,
        input[type='text'],
        input[type='email'],
        input[type='password'],
        input[type='number'],
        input[type='search'],
        input[type='date'],
        input[type='time'],
        select,
        textarea
    ) {
        background: var(--repo-dark-field) !important;
        border-color: var(--repo-dark-border) !important;
        color: var(--repo-dark-text) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .input,
        input,
        select,
        textarea
    )::placeholder {
        color: var(--repo-dark-faint) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .input,
        input,
        select,
        textarea
    ):focus {
        border-color: rgba(121, 201, 147, 0.52) !important;
        box-shadow: 0 0 0 3px rgba(121, 201, 147, 0.14) !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .btn,
        a.btn,
        button.btn,
        input.btn[type='button'],
        input.btn[type='submit']
    ) {
        --repo-btn-bg: var(--repo-dark-accent-deep);
        --repo-btn-hover-bg: var(--repo-dark-accent-strong);
        --repo-btn-fg: #f7fff9;
        --repo-btn-border: rgba(121, 201, 147, 0.12);
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .btn.secondary,
        a.btn.secondary,
        button.btn.secondary
    ) {
        --repo-btn-bg: var(--repo-dark-panel-2);
        --repo-btn-hover-bg: #244934;
        --repo-btn-fg: var(--repo-dark-text);
        --repo-btn-border: var(--repo-dark-border);
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .badge,
        .self-attendance-status,
        .anf-status,
        .academic-profile-quarter-chip
    ) {
        background: rgba(121, 201, 147, 0.12) !important;
        border-color: rgba(121, 201, 147, 0.22) !important;
        color: #dff4e7 !important;
    }

    html[data-theme='dark'] body.page .layout-stack :where(
        .flash,
        .status-flash,
        .error-flash
    ) {
        background: var(--repo-dark-panel-2) !important;
        border-color: var(--repo-dark-border) !important;
        color: var(--repo-dark-text) !important;
    }
}
