/* Fonts are loaded from HTML <link> tags (see site-paths / page heads).
   display=optional avoids late font-swap layout jumps. Keep stacks below
   so pages still render correctly if the webfont link is missing. */

:root {
    --es-bg: #f4f6f9;
    --es-surface: #ffffff;
    --es-surface-muted: #eef1f6;
    --es-border: #d8dee6;
    --es-border-strong: #c5cdd8;
    --es-text: #1a2332;
    --es-text-secondary: #394956;
    --es-text-muted: #4f5d6b;
    --es-accent: #1e4d7b;
    --es-accent-hover: #163a5e;
    --es-accent-soft: #e8f0f8;
    --es-brand: #9a7b1a;
    --es-brand-soft: #f5eed6;
    --es-success: #2d6a4f;
    --es-success-soft: #e8f5ec;
    --es-info-soft: #e3eef8;
    --es-danger: #b42318;
    --es-radius: 10px;
    --es-radius-sm: 8px;
    --es-shadow: 0 1px 3px rgba(26, 35, 50, 0.06), 0 8px 24px rgba(26, 35, 50, 0.06);
    --es-font-ui: Arial, Helvetica, sans-serif;
    --es-font-heading: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --es-max-width: 1100px;
    --es-font-size-base: 12pt;
    --es-font-size-sm: 12pt;
    --es-font-size-xs: 12pt;
    --es-admin-page-title: #0f2840;
    --es-admin-heading: #163a5e;
    --es-admin-subheading: #1565c0;
    --es-admin-label: #0d47a1;
    --es-admin-supporting: #2a5570;
    --es-admin-stat: #7a5c00;
    --es-admin-header-bg: #d4e4f4;
    --es-admin-table-head-bg: #c5daf0;
    --es-learn-page-title: #0f2840;
    --es-learn-heading: #163a5e;
    --es-learn-subheading: #1565c0;
    --es-learn-label: #1a5f94;
    --es-learn-stat: #7a5c00;
    --es-learn-panel-bg: #d4e4f4;
    --es-learn-citation-bg: #f5eed6;
}

.ja-smallcaps {
    font-variant: small-caps;
    font-variant-caps: all-small-caps;
    letter-spacing: 0.06em;
}

/* Signed-in app shell */
body.es-app {
    margin: 0;
    font-family: var(--es-font-ui);
    font-size: var(--es-font-size-base);
    line-height: 1.65;
    color: var(--es-text);
    background: var(--es-bg);
    -webkit-font-smoothing: antialiased;
}

body.es-app .container {
    max-width: var(--es-max-width);
    margin: 0 auto;
    padding: 24px 20px 48px;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
}

body.es-app header {
    background: transparent;
    color: inherit;
    padding: 0 0 24px;
    text-align: left;
    border-bottom: 1px solid var(--es-border);
    margin-bottom: 28px;
}

body.es-app header h1 {
    margin: 0;
    font-family: var(--es-font-heading);
    font-size: 1.75rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--es-text);
}

body.es-app header h2 {
    margin: 6px 0 0;
    font-family: var(--es-font-ui);
    font-size: 1rem;
    font-weight: 500;
    color: var(--es-text-secondary);
}

body.es-app .es-brand {
    margin: 0 0 6px;
    font-size: var(--es-font-size-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--es-brand);
}

/* NSWCLT_large.png is 848×375. Size by width only — never stretch height. */
body.es-app .es-logo {
    display: block;
    box-sizing: border-box;
    width: 220px;
    max-width: min(100%, 220px);
    height: auto !important;
    max-height: none;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center;
    margin: 0 auto 10px;
    padding: 0;
    background: transparent;
    border-radius: 0;
    flex-shrink: 0;
    align-self: center;
    justify-self: center;
    overflow: visible;
}

body.es-app .es-logo-compact {
    width: 220px;
    max-width: min(100%, 220px);
    height: auto !important;
    margin-bottom: 8px;
}

body.es-app .training-container header .es-logo {
    width: 220px;
    max-width: min(100%, 220px);
    height: auto !important;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center;
}

body.es-app .user-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    margin: -8px 0 24px;
    min-height: 52px;
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    border-radius: var(--es-radius);
    color: var(--es-text-secondary);
    font-size: var(--es-font-size-sm);
    box-shadow: var(--es-shadow);
}

body.es-app .user-bar.user-bar--pending {
    visibility: hidden;
}

body.es-app #overallProgress:empty {
    min-height: 118px;
    margin-bottom: 32px;
}

body.es-app .module-progress.module-progress--pending {
    visibility: hidden;
}

body.es-app .user-bar strong {
    color: var(--es-text);
}

body.es-app .user-bar-btn {
    padding: 8px 14px;
    border-radius: var(--es-radius-sm);
    text-decoration: none;
    font-size: var(--es-font-size-sm);
    font-weight: 600;
    border: 1px solid var(--es-border);
    color: var(--es-text);
    background: var(--es-surface);
    cursor: pointer;
    font-family: inherit;
}

body.es-app .user-bar-btn:hover {
    background: var(--es-surface-muted);
    border-color: var(--es-border-strong);
}

body.es-app .module-progress {
    margin: 0 0 12px;
    padding: 8px 10px;
    background: var(--es-surface-muted);
    border: 1px solid var(--es-border);
    border-radius: var(--es-radius-sm);
    font-size: var(--es-font-size-sm);
    color: var(--es-text-secondary);
}

body.es-app .module-progress-fill {
    background: var(--es-accent);
}

body.es-app a.es-link {
    color: var(--es-accent);
    font-weight: 600;
    text-decoration: none;
}

body.es-app a.es-link:hover {
    text-decoration: underline;
}

body.es-app header h1,
body.es-app header h2,
body.es-app .overall-progress-card h3,
body.es-app .module-card h3 {
    color: inherit;
}

body.es-app .module-progress .progress-label {
    color: var(--es-accent);
}

/* Auth / sign-in */
body.auth-page {
    background: var(--es-bg);
    color: var(--es-text);
    font-family: var(--es-font-ui);
    font-size: var(--es-font-size-base);
    line-height: 1.65;
}

.auth-card {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    box-shadow: var(--es-shadow);
}

body.auth-page .auth-card h1,
body.auth-page .auth-login-shell .auth-login-header h1,
body.auth-page .auth-login-shell--chooser .auth-login-header h1 {
    color: var(--es-text);
    font-family: var(--es-font-heading);
    font-size: 1.35rem;
}

body.auth-page .auth-card .auth-subtitle,
body.auth-page .auth-form-note,
body.auth-page .auth-field-hint,
body.auth-page .portal-chooser-footer,
body.auth-page .portal-login-footer,
body.auth-page .portal-login-footer-line,
body.auth-page #portalLoginNote,
body.auth-page .auth-card.auth-card-login .auth-subtitle,
body.auth-page .auth-card.auth-card-login #portalLoginNote,
body.auth-page .auth-card.auth-card-login .portal-chooser-footer,
body.auth-page .auth-card.auth-card-login .portal-login-footer,
body.auth-page .auth-card.auth-card-login .portal-login-footer-line,
body.auth-page .auth-tab,
body.auth-page .auth-forgot-device-note,
body.auth-page .auth-forgot-device-note strong {
    color: var(--es-text-secondary);
    font-size: var(--es-font-size-sm);
    line-height: 1.55;
}

body.auth-page .portal-choice {
    border: 1px solid var(--es-border);
    background: var(--es-surface);
    color: var(--es-text);
    font-size: 1.05rem;
}

body.auth-page .portal-choice:hover,
body.auth-page .portal-choice:focus {
    background: var(--es-accent-soft);
    border-color: var(--es-accent);
    color: var(--es-text);
}

body.auth-page .auth-field label {
    color: var(--es-text);
    font-size: var(--es-font-size-sm);
}

body.auth-page .auth-field input,
body.auth-page .auth-field select,
body.auth-page .auth-field textarea {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
    font-size: var(--es-font-size-base);
}

body.auth-page .auth-field input:focus,
body.auth-page .auth-field select:focus,
body.auth-page .auth-field textarea:focus {
    border-color: var(--es-accent);
    outline: none;
    box-shadow: 0 0 0 3px var(--es-accent-soft);
}

body.auth-page .auth-field.auth-field-disabled label,
body.auth-page .auth-field.auth-field-disabled input:disabled {
    color: var(--es-text-muted);
}

body.auth-page .auth-link-btn,
body.auth-page .portal-chooser-footer a,
body.auth-page .portal-login-footer a,
body.auth-page .password-toggle-btn {
    color: var(--es-accent);
    font-size: var(--es-font-size-sm);
}

body.auth-page .auth-link-btn:hover,
body.auth-page .portal-chooser-footer a:hover,
body.auth-page .portal-login-footer a:hover,
body.auth-page .password-toggle-btn:hover,
body.auth-page .password-toggle-btn:focus {
    color: var(--es-accent-hover);
}

.auth-cancel {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
    font-size: var(--es-font-size-base);
}

.auth-submit {
    background: var(--es-accent);
    color: #fff;
    font-size: var(--es-font-size-base);
}

.auth-submit:hover {
    background: var(--es-accent-hover);
}

.auth-error {
    background: #fef3f2;
    border-color: #fecdca;
    color: var(--es-danger);
}

.auth-success {
    background: var(--es-success-soft);
    border-color: #b7dfc9;
    color: var(--es-success);
}

/* Welcome page */
body:has(.welcome-page) {
    background: var(--es-bg);
    color: var(--es-text);
    font-family: var(--es-font-ui);
}

.welcome-content h2 {
    color: var(--es-text);
    font-family: var(--es-font-heading);
}

.welcome-footer,
.welcome-skip {
    color: var(--es-text-secondary);
}

.btn-enter {
    background: var(--es-accent);
    border-color: var(--es-border);
}

.btn-enter:hover {
    background: var(--es-accent-hover);
}

/* Client Administrator portal */
body.admin-body {
    background: var(--es-bg);
    color: var(--es-text);
    font-family: var(--es-font-ui);
}

.admin-page {
    color: var(--es-text);
}

.admin-body .user-bar {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    border-radius: var(--es-radius);
    color: var(--es-text-secondary);
    box-shadow: var(--es-shadow);
}

.admin-body .user-bar strong {
    color: var(--es-admin-stat);
    font-weight: 700;
}

.admin-header h1 {
    color: var(--es-admin-page-title);
    font-family: var(--es-font-heading);
    font-weight: 700;
    font-size: 1.85rem;
    letter-spacing: -0.01em;
}

.admin-header p {
    color: var(--es-admin-supporting);
    font-weight: 500;
}

.admin-nav-btn {
    border: 2px solid var(--es-accent);
    background: var(--es-surface);
    color: var(--es-admin-heading);
    font-weight: 700;
}

.admin-nav-btn:hover {
    background: var(--es-admin-header-bg);
    border-color: var(--es-admin-subheading);
    color: var(--es-admin-subheading);
}

.admin-nav-btn.active {
    background: var(--es-accent);
    border-color: var(--es-accent);
    color: #fff;
    box-shadow: 0 2px 8px rgba(22, 58, 94, 0.25);
}

.admin-settings-card,
.admin-quick-actions-card,
.admin-add-user-card,
.admin-import-user-card,
.admin-stat,
.admin-table-wrap,
.admin-detail-card {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    box-shadow: var(--es-shadow);
}

.admin-panel-title {
    color: var(--es-admin-heading);
    font-family: var(--es-font-heading);
    font-weight: 700;
}

.admin-subheading {
    color: var(--es-admin-subheading);
    font-family: var(--es-font-heading);
    font-weight: 700;
}

.admin-panel-desc,
.admin-settings-desc {
    color: var(--es-admin-supporting);
}

.admin-pass-mark-current {
    color: var(--es-text);
}

.admin-table th {
    background: var(--es-admin-table-head-bg);
    color: var(--es-admin-page-title);
    border-color: #9eb8d9;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.8125rem;
    letter-spacing: 0.04em;
}

.admin-table td {
    border-color: var(--es-border);
    color: var(--es-text);
}

.admin-table tr:nth-child(even) td {
    background: var(--es-surface-muted);
}

.admin-add-user-input,
.admin-pass-mark-input,
.admin-import-file-input,
.admin-filter-input {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
}

.admin-hosting-banner {
    background: var(--es-brand-soft);
    border: 2px solid #d4bc6a;
    color: var(--es-admin-page-title);
    font-weight: 600;
}

.admin-page-alert.info {
    background: var(--es-info-soft);
    border-color: var(--es-border);
    color: var(--es-text);
}

.admin-page-alert.error {
    background: #fef3f2;
    border-color: #fecdca;
    color: var(--es-danger);
}

.admin-remove-btn {
    background: #fef3f2;
    border-color: #fecdca;
    color: var(--es-danger);
}

body.admin-body {
    font-size: var(--es-font-size-base);
    line-height: 1.65;
}

body.admin-body .admin-table,
body.admin-body .admin-panel-desc,
body.admin-body .admin-settings-desc,
body.admin-body .admin-pass-mark-msg,
body.admin-body .admin-hosting-banner,
body.admin-body .admin-page-alert,
body.admin-body .admin-import-status,
body.admin-body .admin-add-user-label,
body.admin-body .admin-module-card-stats,
body.admin-body .admin-user-detail,
body.admin-body .admin-module-detail,
body.admin-body .admin-modal-desc,
body.admin-body .admin-search-label,
body.admin-body .admin-filter-label,
body.admin-body .admin-contact-label,
body.admin-body .admin-credential-label,
body.admin-body .admin-stat span,
body.admin-body .admin-mini-label,
body.admin-body .admin-muted,
body.admin-body .admin-expand-btn,
body.admin-body .admin-import-preview-table {
    font-size: var(--es-font-size-sm);
}

body.admin-body .admin-matrix-table,
body.admin-body .admin-matrix-module-col,
body.admin-body .admin-status-chip,
body.admin-body .admin-badge,
body.admin-body .admin-status-btn {
    font-size: var(--es-font-size-xs);
}

/* Client Administrator — readable light theme (overrides legacy dark auth.css) */
body.admin-body .user-bar-btn {
    background: var(--es-surface);
    border: 2px solid var(--es-accent);
    color: var(--es-admin-heading);
    font-size: var(--es-font-size-sm);
    font-weight: 700;
}

body.admin-body .user-bar-btn:hover {
    background: var(--es-admin-header-bg);
    border-color: var(--es-admin-subheading);
    color: var(--es-admin-subheading);
}

body.admin-body .user-bar-btn.primary {
    background: var(--es-accent);
    border-color: var(--es-accent);
    color: #fff;
}

body.admin-body .admin-nav-btn {
    font-size: var(--es-font-size-sm);
}

body.admin-body .admin-panel-title {
    font-size: 1.45rem;
    color: var(--es-admin-heading);
    font-family: var(--es-font-heading);
    font-weight: 700;
}

body.admin-body .admin-subheading {
    font-size: 1.15rem;
    color: var(--es-admin-subheading);
    font-family: var(--es-font-heading);
    font-weight: 700;
}

body.admin-body .admin-header h1 {
    color: var(--es-admin-page-title);
    font-weight: 700;
}

body.admin-body .admin-header p,
body.admin-body .admin-panel-desc,
body.admin-body .admin-settings-desc {
    color: var(--es-admin-supporting);
}

body.admin-body .admin-stat {
    color: var(--es-text);
}

body.admin-body .admin-stat strong {
    color: var(--es-admin-stat);
    font-size: 2rem;
    font-weight: 800;
}

body.admin-body .admin-table th {
    background: var(--es-admin-table-head-bg);
    color: var(--es-admin-page-title);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.8125rem;
    letter-spacing: 0.04em;
    border-color: #9eb8d9;
}

body.admin-body .admin-stat span {
    color: var(--es-admin-supporting);
}

body.admin-body .admin-module-card {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
}

body.admin-body .admin-module-card h4 {
    color: var(--es-admin-heading);
    font-family: var(--es-font-heading);
    font-size: 1.05rem;
    font-weight: 700;
}

body.admin-body .admin-module-card-stats strong {
    color: var(--es-admin-subheading);
    font-weight: 700;
}

body.admin-body .admin-module-card-percent {
    color: var(--es-admin-supporting);
    font-size: var(--es-font-size-sm);
}

body.admin-body .admin-progress-bar-track {
    background: var(--es-surface-muted);
    border: 1px solid var(--es-border);
}

body.admin-body .admin-module-card-stats {
    color: var(--es-admin-supporting);
    font-weight: 500;
}

body.admin-body .admin-progress-bar-fill {
    background: linear-gradient(90deg, var(--es-accent) 0%, var(--es-admin-subheading) 55%, var(--es-brand) 100%);
}

body.admin-body .admin-mini-bar-track {
    background: var(--es-surface-muted);
}

body.admin-body .admin-mini-bar-fill {
    background: var(--es-brand);
}

body.admin-body .admin-add-user-label,
body.admin-body .admin-pass-mark-label,
body.admin-body .admin-search-label,
body.admin-body .admin-filter-label,
body.admin-body .admin-contact-label {
    color: var(--es-admin-label);
    font-weight: 700;
}

body.admin-body .admin-add-user-input,
body.admin-body .admin-pass-mark-input,
body.admin-body .admin-search,
body.admin-body .admin-select {
    background: var(--es-surface);
    border: 1px solid var(--es-border-strong);
    color: var(--es-text);
    font-size: var(--es-font-size-base);
}

body.admin-body .admin-pass-mark-current {
    background: var(--es-admin-header-bg);
    border: 2px solid #9eb8d9;
    color: var(--es-admin-page-title);
    font-weight: 600;
}

body.admin-body .admin-pass-mark-current strong {
    color: var(--es-admin-stat);
    font-size: 1.35rem;
    font-weight: 800;
}

body.admin-body .admin-pass-mark-msg.success {
    background: var(--es-success-soft);
    border: 1px solid #b7dfc9;
    color: var(--es-success);
}

body.admin-body .admin-pass-mark-msg.error {
    background: #fef3f2;
    border: 1px solid #fecdca;
    color: var(--es-danger);
}

body.admin-body .admin-import-preview-table th,
body.admin-body .admin-import-preview-table td {
    border-color: var(--es-border);
    color: var(--es-text);
}

body.admin-body .admin-import-preview-table th {
    background: var(--es-admin-table-head-bg);
    color: var(--es-admin-page-title);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

body.admin-body .admin-import-status {
    color: var(--es-admin-supporting);
}

body.admin-body .admin-badge.admin-pending {
    background: var(--es-brand-soft);
    border: 1px solid var(--es-border);
    color: var(--es-brand);
}

body.admin-body .admin-import-preview-table tr.admin-import-row-error td {
    color: var(--es-danger);
}

body.admin-body .admin-badge {
    background: var(--es-admin-header-bg);
    border: 1px solid #9eb8d9;
    color: var(--es-admin-heading);
    font-weight: 700;
}

body.admin-body .admin-badge.admin-role {
    background: #dceaf8;
    color: var(--es-admin-subheading);
    font-weight: 700;
}

body.admin-body .admin-badge.admin-account-active {
    background: var(--es-success-soft);
    color: var(--es-success);
}

body.admin-body .admin-badge.admin-account-inactive {
    background: #fef3f2;
    color: var(--es-danger);
}

body.admin-body .admin-expand-btn {
    border: 2px solid var(--es-accent);
    background: var(--es-admin-header-bg);
    color: var(--es-admin-heading);
    font-weight: 700;
}

body.admin-body .admin-expand-btn:hover {
    background: var(--es-accent);
    color: #fff;
}

body.admin-body .admin-user-detail-row td {
    background: var(--es-surface-muted);
}

body.admin-body .admin-user-detail-summary,
body.admin-body .admin-user-detail,
body.admin-body .admin-user-detail-note,
body.admin-body .admin-empty-msg,
body.admin-body .admin-muted,
body.admin-body .admin-mini-label {
    color: var(--es-admin-supporting);
}

body.admin-body .admin-module-detail,
body.admin-body .admin-module-detail strong {
    color: var(--es-text);
}

body.admin-body .admin-readonly-note,
body.admin-body .admin-username,
body.admin-body .admin-no-activity {
    color: var(--es-admin-supporting);
}

body.admin-body .admin-matrix-user {
    color: var(--es-admin-stat);
    font-weight: 700;
}

body.admin-body .admin-matrix-module-col {
    color: var(--es-admin-heading);
    font-weight: 700;
}

body.admin-body .admin-matrix-legend {
    color: var(--es-admin-supporting);
}

body.admin-body .admin-matrix-sticky {
    background: var(--es-surface);
}

body.admin-body .admin-status-not_started { color: var(--es-text-muted); }
body.admin-body .admin-status-started,
body.admin-body .admin-status-training_progress { color: var(--es-accent); }
body.admin-body .admin-status-training_complete,
body.admin-body .admin-status-complete { color: var(--es-success); font-weight: 800; }
body.admin-body .admin-status-quiz_in_progress,
body.admin-body .admin-status-quiz_attempted { color: var(--es-brand); font-weight: 700; }
body.admin-body .admin-status-quiz_passed { color: var(--es-admin-stat); font-weight: 700; }

body.admin-body .admin-status-btn {
    border: 2px solid var(--es-accent);
    background: var(--es-admin-header-bg);
    color: var(--es-admin-heading);
    font-weight: 700;
}

body.admin-body .admin-status-btn:hover {
    background: var(--es-accent);
    color: #fff;
    border-color: var(--es-accent);
}

body.admin-body .admin-contact-msg.success {
    color: var(--es-success);
}

body.admin-body .admin-contact-msg.error {
    color: var(--es-danger);
}

body.admin-body .admin-modal-panel {
    background: var(--es-surface);
    border: 1px solid var(--es-border-strong);
    color: var(--es-text);
    box-shadow: var(--es-shadow);
}

body.admin-body .admin-modal-title {
    color: var(--es-admin-page-title);
    font-family: var(--es-font-heading);
    font-weight: 700;
    font-size: 1.4rem;
}

body.admin-body .admin-modal-desc {
    color: var(--es-admin-supporting);
    font-weight: 500;
}

body.admin-body .admin-password-form .auth-field label {
    color: var(--es-admin-label);
    font-size: var(--es-font-size-sm);
    font-weight: 700;
}

body.admin-body .admin-password-form .auth-field input {
    background: var(--es-surface);
    border: 1px solid var(--es-border-strong);
    color: var(--es-text);
    font-size: var(--es-font-size-base);
}

body.admin-body .admin-password-error {
    background: #fef3f2;
    border: 1px solid #fecdca;
    color: var(--es-danger);
}

body.admin-body .admin-password-success {
    background: var(--es-success-soft);
    border: 1px solid #b7dfc9;
    color: var(--es-success);
}

body.admin-body .admin-credentials-box {
    background: var(--es-surface-muted);
    border: 1px solid var(--es-border);
}

body.admin-body .admin-credential-label {
    color: var(--es-text);
}

body.admin-body .admin-copy-btn {
    color: var(--es-accent);
}

body.admin-body .admin-copy-btn:hover {
    color: var(--es-accent-hover);
}

body.admin-body .admin-status-chip {
    border: 1px solid var(--es-border);
    color: var(--es-text);
    background: var(--es-surface-muted);
}

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

body.admin-body .admin-table-wrap {
    background: var(--es-surface);
    border-color: var(--es-border);
}

/* Website Manager */
body.license-page {
    background: var(--es-bg);
    color: var(--es-text);
    font-family: var(--es-font-ui);
    font-size: var(--es-font-size-base);
    line-height: 1.65;
}

.license-card {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    box-shadow: var(--es-shadow);
}

.license-card h1,
.license-section-title {
    color: var(--es-text);
    font-family: var(--es-font-heading);
}

.license-subtitle,
.license-muted,
.license-footnote,
.license-field-hint {
    color: var(--es-text-secondary);
    font-size: var(--es-font-size-sm);
    line-height: 1.55;
}

.license-field label,
.license-field-label,
.license-credential-label,
.license-details summary,
.license-print-module {
    color: var(--es-text);
    font-size: var(--es-font-size-sm);
}

.license-field input,
.license-field textarea,
.license-field select {
    background: var(--es-surface);
    border: 1px solid var(--es-border-strong);
    color: var(--es-text);
    font-size: var(--es-font-size-base);
}

.license-field input::placeholder,
.license-field textarea::placeholder {
    color: var(--es-text-muted);
}

.license-btn {
    background: var(--es-accent);
    color: #fff;
}

.license-btn:hover {
    background: var(--es-accent-hover);
}

.license-btn-secondary {
    background: var(--es-surface);
    border: 1px solid var(--es-border-strong);
    color: var(--es-text);
    font-size: var(--es-font-size-base);
}

.license-table {
    font-size: var(--es-font-size-sm);
}

.license-table th,
.license-table td {
    color: var(--es-text);
}

.license-badge {
    font-size: var(--es-font-size-xs);
}

.license-action-btn,
.license-limit-preset-btn {
    font-size: var(--es-font-size-sm);
}

.license-details,
.license-print-modules,
.license-table-wrap,
.license-credentials-box {
    background: var(--es-surface-muted);
    border-color: var(--es-border);
    color: var(--es-text);
}

.license-status {
    background: var(--es-surface-muted);
    border: 1px solid var(--es-border);
    color: var(--es-text);
}

.license-login-forgot-btn,
.license-link-btn {
    color: var(--es-accent);
    font-size: var(--es-font-size-sm);
}

.license-login-forgot-btn:hover,
.license-link-btn:hover {
    color: var(--es-accent-hover);
}

.license-link-danger {
    color: var(--es-danger);
}

.license-error {
    background: #fef3f2;
    border: 1px solid #fecdca;
    color: var(--es-danger);
}

.license-success {
    background: var(--es-success-soft);
    border: 1px solid #b7dfc9;
    color: var(--es-success);
}

.license-status.active strong {
    color: #1b5e3a;
}

.license-status.inactive strong {
    color: #9b1c12;
}

.license-limit-summary {
    background: var(--es-surface-muted);
    color: #0f1724;
}

.license-limit-at-capacity {
    color: #9b1c12;
}

.license-print-modules,
.license-table-wrap,
.license-details,
.license-credentials-box {
    background: var(--es-surface-muted);
    border-color: var(--es-border);
    color: #0f1724;
}

.license-table th {
    background: #e3e9f0;
    color: #0f1724;
}

.license-table td {
    border-color: var(--es-border);
    color: #1a2332;
}

.license-badge-active {
    background: #d8f0e3;
    color: #1b5e3a;
}

.license-badge-inactive {
    background: #fde8e8;
    color: #9b1c12;
}

.license-action-btn {
    border-color: #9eb8d9;
    background: var(--es-accent-soft);
    color: #163a5e;
}

.license-action-secondary {
    border-color: var(--es-border-strong);
    background: var(--es-surface);
    color: #394956;
}

.license-action-danger {
    border-color: #f0b4b4;
    background: #fde8e8;
    color: #9b1c12;
}

.license-limit-preset-btn {
    border-color: #9eb8d9;
    background: var(--es-accent-soft);
    color: #163a5e;
}

.license-btn-danger {
    background: #fde8e8;
    border-color: #f0b4b4;
    color: #9b1c12;
}

.license-modal-panel {
    background: var(--es-surface);
    border: 1px solid var(--es-border-strong);
    color: #0f1724;
}

.license-credentials-box code {
    color: #0f1724;
}

/* Marketing site */
body:has(.mkt-wrap) {
    background: var(--es-bg);
    color: var(--es-text);
    font-family: var(--es-font-ui);
}

body:has(.mkt-wrap) a {
    color: var(--es-accent);
}

body:has(.mkt-wrap) a:hover {
    color: var(--es-accent-hover);
}

.mkt-nav {
    border-bottom-color: var(--es-border);
}

.mkt-hero h1,
.mkt-section h1 {
    color: var(--es-text);
    font-family: var(--es-font-heading);
}

.mkt-section h1 {
    font-size: 1.85rem;
    margin-bottom: 12px;
}

.mkt-section article h2,
.mkt-section h2,
.mkt-sample h2,
.mkt-card h3,
.mkt-price-card h3,
.mkt-compare th {
    color: var(--es-text);
    font-family: var(--es-font-heading);
}

.mkt-hero-lead,
.mkt-section-lead,
.mkt-sample-sub,
.mkt-price-note,
.mkt-footer {
    color: var(--es-text-secondary);
}

.mkt-badge {
    background: var(--es-brand-soft);
    border-color: var(--es-border);
    color: var(--es-brand);
}

.mkt-sample,
.mkt-card,
.mkt-price-card,
.mkt-contact,
.mkt-module-pill {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    box-shadow: var(--es-shadow);
}

.mkt-price-card.featured {
    border-color: var(--es-accent);
    box-shadow: 0 0 0 1px var(--es-accent-soft);
}

.mkt-price {
    color: var(--es-text);
}

.mkt-sample-option {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
}

.mkt-sample-option:hover:not(:disabled) {
    border-color: var(--es-accent);
    background: var(--es-accent-soft);
}

.mkt-sample-explanation {
    background: var(--es-info-soft);
    border-color: var(--es-border);
    color: var(--es-text);
}

.mkt-compare th,
.mkt-compare td {
    border-color: var(--es-border);
}

.mkt-compare th {
    background: var(--es-surface-muted);
}

.mkt-contact label {
    color: var(--es-text);
}

.mkt-contact input,
.mkt-contact select,
.mkt-contact textarea {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
}

.mkt-btn-primary {
    background: var(--es-accent);
    color: #fff;
}

.mkt-btn-primary:hover {
    background: var(--es-accent-hover);
}

.mkt-btn-secondary {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
}

.mkt-footer {
    border-top-color: var(--es-border);
}

/* Manuals */
body.manual-page {
    background: var(--es-bg);
    color: var(--es-text);
    font-family: var(--es-font-ui);
}

.manual-page .sidebar {
    border-right-color: var(--es-border);
}

.manual-page .sidebar h1 {
    color: var(--es-text);
    font-family: var(--es-font-heading);
}

.manual-page .sidebar nav a {
    color: var(--es-accent);
}

.manual-page .sidebar nav a:hover {
    color: var(--es-accent-hover);
}

.manual-page .sidebar .back-links {
    border-top-color: var(--es-border);
}

.manual-page .sidebar .back-links a {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    color: var(--es-text);
}

.manual-page .main a {
    color: var(--es-accent);
}

.manual-page .main h2 {
    color: var(--es-text);
    font-family: var(--es-font-heading);
}

.manual-page .main h3,
.manual-page .lead {
    color: var(--es-text-secondary);
}

.manual-page th {
    background: var(--es-surface-muted);
    color: var(--es-text);
    border-color: var(--es-border);
}

.manual-page td {
    border-color: var(--es-border);
}

.manual-page .note-warn {
    background: var(--es-brand-soft);
    border-color: var(--es-border);
    color: var(--es-text);
}

.manual-page .note-info {
    background: var(--es-info-soft);
    border-color: var(--es-border);
    color: var(--es-text);
}

.manual-page code {
    background: var(--es-surface-muted);
    color: var(--es-accent);
}

/* Evidence Act guides (signed-in) */
body.es-app .guide-intro {
    color: var(--es-text);
}

body.es-app .guide-column-heading {
    color: var(--es-text);
    border-bottom-color: transparent;
    font-family: var(--es-font-heading);
    font-weight: 700;
}

body.es-app .guide-column {
    border-bottom-color: var(--es-border);
}

body.es-app .guide-column-sub {
    color: var(--es-text);
}

body.es-app .guide-card {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
    box-shadow: var(--es-shadow);
}

body.es-app .guide-card h3 {
    color: var(--es-text);
    font-family: var(--es-font-heading);
    font-weight: 700;
}

body.es-app .guide-card p {
    color: var(--es-text);
}

body.es-app .btn-guide-primary,
body.es-app .btn-guide-close {
    background: var(--es-accent);
}

body.es-app .btn-guide-primary:hover,
body.es-app .btn-guide-close:hover {
    background: var(--es-accent-hover);
}

body.es-app .btn-guide-nav {
    background: var(--es-surface);
    color: var(--es-text);
    border: 1px solid var(--es-border);
}

body.es-app .btn-guide-nav:hover {
    background: var(--es-surface-muted);
}

body.es-app .training-container.guide-evidence-act header {
    border-bottom-color: var(--es-border);
}

body.es-app .container.training-container.guide-evidence-act {
    max-width: 900px;
    padding-left: 24px;
    padding-right: 24px;
}

body.es-app .guide-evidence-act .guide-card {
    background: transparent;
    border-bottom-color: var(--es-border);
}

body.es-app .guide-evidence-act .guide-card p {
    color: var(--es-text);
}

body.es-app .training-container.guide-evidence-act header h1 {
    color: var(--es-text);
    font-weight: 700;
}

body.es-app .training-container.guide-evidence-act header h2 {
    color: var(--es-text);
    font-weight: 700;
}

body.es-app .guide-evidence-act h2,
body.es-app .guide-evidence-act h3,
body.es-app .guide-evidence-act .guide-column-heading,
body.es-app .guide-evidence-act .guide-card h3 {
    font-weight: 700;
}

/* Training Cards, Tests, Evidence Act — black text */
body.es-app .training-container header h1,
body.es-app .training-container header h2,
body.es-app .training-container > .training-progress,
body.es-app .training-container > .training-resume-note,
body.es-app .training-slide,
body.es-app .training-slide h3,
body.es-app .training-slide #slideContent,
body.es-app .training-slide #slideContent p,
body.es-app .slide-citation,
body.es-app .slide-citation cite,
body.es-app .guide-main,
body.es-app .guide-intro,
body.es-app .guide-column-heading,
body.es-app .guide-column-sub,
body.es-app .guide-card h3,
body.es-app .guide-card p,
body.es-app .container > header h1,
body.es-app .container > header h2,
body.es-app .score-display,
body.es-app .score-display p,
body.es-app main:not(.training-slide),
body.es-app #questionDisplay,
body.es-app .answer-btn,
body.es-app .exit-container h3,
body.es-app .exit-container p,
body.es-app .quiz-resume-note,
.guide-popup-content h3,
.guide-popup-content p,
.guide-popup-content li,
.guide-legislation-content .guide-legislation-body,
.guide-legislation-content .leg-section-heading,
.guide-legislation-content .leg-note {
    color: var(--es-text);
}

/* Readable minimum sizes — dashboard, training, tests, guides */
body.es-app .btn-nav,
body.es-app .module-sections,
body.es-app .btn-module,
body.es-app .btn-training,
body.es-app .btn-review,
body.es-app .dashboard-legal-notice,
body.es-app .dashboard-footer,
body.es-app .overall-progress-text,
body.es-app .overall-progress-percent {
    font-size: var(--es-font-size-sm);
}

body.es-app .training-container > .training-progress,
body.es-app .training-container > .training-resume-note,
body.es-app .quiz-resume-note,
body.es-app .slide-citation {
    font-size: var(--es-font-size-sm);
}

body.es-app .training-slide #slideContent p {
    font-size: var(--es-font-size-base);
}

body.es-app .guide-evidence-act .guide-card .btn-guide-primary,
body.es-app .guide-evidence-act .guide-card h3,
body.es-app .guide-evidence-act .guide-card p {
    font-size: var(--es-font-size-sm);
}

body.es-app .guide-evidence-act .guide-card h3 {
    font-size: var(--es-font-size-base);
}

body.es-app #questionDisplay {
    font-size: 1.25rem;
}

body.es-app .answer-btn,
body.es-app .score-display {
    font-size: var(--es-font-size-base);
}

body.es-app .user-profile-panel-title {
    font-size: var(--es-font-size-sm);
}

body.es-app .user-profile-stat-label,
body.es-app .user-profile-status,
body.es-app .user-profile-module-chip {
    font-size: var(--es-font-size-xs);
}

/* Training cards & tests — colour */
body.es-app .training-container header,
body.es-app .container:not(.training-container) > header {
    padding: 20px 20px 16px;
    background: linear-gradient(135deg, var(--es-learn-panel-bg) 0%, var(--es-surface) 72%);
    border: 1px solid #9eb8d9;
    border-bottom: 3px solid var(--es-learn-subheading);
    border-radius: var(--es-radius) var(--es-radius) 0 0;
    margin-bottom: 0;
}

body.es-app .training-container header h1 {
    color: var(--es-learn-page-title);
    font-weight: 700;
}

body.es-app .container:not(.training-container) > header h1 {
    color: #000;
    font-weight: 700;
}

body.es-app header.dashboard-page-header h1 {
    color: #000;
}

body.es-app .container > header h2 {
    color: var(--es-learn-subheading);
    font-weight: 600;
}

body.es-app .es-brand {
    color: var(--es-brand);
}

body.es-app .training-container > .training-progress {
    background: var(--es-learn-panel-bg);
    border-color: #9eb8d9;
    color: var(--es-learn-heading);
    font-weight: 600;
}

body.es-app .training-container > .training-progress #slideIndicator {
    color: var(--es-learn-heading);
}

body.es-app .training-slide h3 {
    color: var(--es-learn-subheading);
    border-bottom: 2px solid #9eb8d9;
    font-weight: 700;
}

body.es-app .training-slide #slideContent p {
    color: var(--es-text);
}

body.es-app .slide-citation {
    background: var(--es-learn-citation-bg);
    border-left: 4px solid var(--es-brand);
    color: var(--es-text);
}

body.es-app .slide-citation cite {
    color: var(--es-learn-stat);
    font-weight: 700;
}

body.es-app .progress-dot.active {
    background: var(--es-learn-subheading);
    box-shadow: 0 0 0 2px var(--es-learn-panel-bg);
}

body.es-app .btn-nav {
    color: var(--es-learn-heading);
    border: 2px solid var(--es-border);
    font-weight: 600;
}

body.es-app .btn-nav:hover {
    background: var(--es-learn-panel-bg);
    border-color: var(--es-learn-subheading);
    color: var(--es-learn-subheading);
}

body.es-app .btn-training-nav {
    color: var(--es-learn-heading);
    border: 2px solid var(--es-border);
    font-weight: 600;
}

body.es-app .btn-training-nav:hover:not(:disabled) {
    background: var(--es-learn-panel-bg);
    border-color: var(--es-learn-subheading);
}

body.es-app .btn-training-nav.btn-training-nav-primary,
body.es-app .btn-training-nav-primary {
    background: var(--es-surface);
    border: 2px solid var(--es-border);
    color: var(--es-learn-heading);
}

body.es-app .btn-training-nav.btn-training-nav-primary:hover:not(:disabled),
body.es-app .btn-training-nav-primary:hover:not(:disabled) {
    background: var(--es-learn-panel-bg);
    border-color: var(--es-learn-subheading);
    color: var(--es-learn-heading);
}

body.es-app .btn-nav.btn-nav-primary {
    color: #fff;
}

body.es-app .btn-nav.btn-nav-primary:hover {
    color: #fff;
}

body.es-app .quiz-resume-note {
    background: var(--es-brand-soft);
    border-color: #d4bc6a;
    color: var(--es-learn-heading);
    font-weight: 600;
}

body.es-app .score-display {
    background: var(--es-learn-panel-bg);
    border-bottom: 2px solid #9eb8d9;
    color: var(--es-learn-heading);
    font-weight: 600;
}

body.es-app .score-display span {
    color: var(--es-learn-stat);
    font-weight: 800;
}

body.es-app #questionDisplay {
    color: var(--es-learn-heading);
    font-weight: 700;
    padding: 16px 18px;
    background: var(--es-accent-soft);
    border-left: 4px solid var(--es-learn-subheading);
    border-radius: 0 var(--es-radius-sm) var(--es-radius-sm) 0;
}

body.es-app .answer-btn {
    color: var(--es-text);
    border: 2px solid #c5daf0;
    font-weight: 500;
}

body.es-app .answer-btn:hover:not(:disabled):not(.answer-btn-wrong) {
    background: var(--es-learn-panel-bg);
    border-color: var(--es-learn-subheading);
    color: var(--es-learn-heading);
}

body.es-app main:not(.training-slide) {
    background: var(--es-surface);
    border: 1px solid var(--es-border);
}

body.es-app .exit-container h3 {
    color: var(--es-learn-subheading);
    font-weight: 700;
}

body.es-app .exit-container .quiz-result-pass {
    color: var(--es-success);
    font-size: 1.15rem;
}

body.es-app .exit-container .quiz-result-fail {
    color: var(--es-danger);
    font-size: 1.15rem;
}

body.es-app .modal-content {
    border-top: 4px solid var(--es-learn-subheading);
}

body.es-app .modal-content #feedbackText.correct-answer,
body.es-app #feedbackText.correct-answer {
    color: var(--es-success);
    border-bottom-color: #b7dfc9;
}

body.es-app .modal-content #feedbackText.incorrect-answer,
body.es-app #feedbackText.incorrect-answer {
    color: var(--es-danger);
    border-bottom-color: #fecdca;
}

body.es-app #feedbackDetails {
    color: var(--es-text);
}

body.es-app #feedbackDetails strong {
    color: var(--es-learn-heading);
}

body.es-app .feedback-cancel-btn {
    border: 2px solid var(--es-accent);
    background: var(--es-learn-panel-bg);
    color: var(--es-learn-heading);
    font-weight: 700;
}

body.es-app .feedback-cancel-btn:hover {
    background: var(--es-accent);
    color: #fff;
}

.site-copyright-footer {
    display: block;
    margin: 24px auto 0;
    padding: 16px 20px 24px;
    max-width: var(--es-max-width, 1100px);
    text-align: center;
    font-family: var(--es-font-ui);
    font-size: 0.8125rem;
    color: var(--es-text-muted);
    line-height: 1.4;
}

body.auth-page .site-copyright-footer {
    margin-top: auto;
    width: 100%;
    max-width: none;
    flex-shrink: 0;
}

body.license-page .site-copyright-footer {
    max-width: none;
    margin-top: 32px;
}

body.es-app .site-copyright-footer {
    max-width: var(--es-max-width);
}

@media print {
    .site-copyright-footer {
        display: none;
    }
}

/* Unified body copy: Arial 12pt. Headings keep their own font/size rules. */
body.es-app,
body.auth-page,
body.manual-page,
body.admin-body,
body.license-page {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 12pt !important;
}

body.es-app *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(script):not(style):not(svg):not(path):not(img),
body.auth-page *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(script):not(style):not(svg):not(path):not(img),
body.manual-page *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(script):not(style):not(svg):not(path):not(img),
body.admin-body *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(script):not(style):not(svg):not(path):not(img),
body.license-page *:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6):not(script):not(style):not(svg):not(path):not(img) {
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 12pt !important;
}
