/*
 * HPC-AC consolidated no-build stylesheet.
 * Source sections are kept in their former cascade order so consolidation
 * reduces stylesheet sprawl without changing selector precedence.
 */

/* ========================================================================
   Consolidated source: canonical-responsive-layout.css
   ======================================================================== */
/* Canonical no-build responsive layout primitives. Loaded last on purpose. */
.ui-metric-grid,
.ui-auto-grid,
.ui-form-grid {
    display: grid;
    gap: .85rem;
    min-width: 0;
}

.ui-metric-grid {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

/*
 * ui-consistency.js marks the first eligible content child as ui-page-root. Overlays,
 * page guidance, actor navigation and contextual notices are excluded. The marker is
 * structural and must never collapse a semantic grid back to one column.
 * Keep this rule specific because the Assessment completion contract uses
 * !important for ordinary page roots.
 */
body[data-assessment-module="1"] .hpc-page-container .ui-page-root.ui-metric-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
    align-items: stretch !important;
    gap: .85rem !important;
}

body[data-assessment-module="1"] .hpc-page-container .ui-page-root.ui-auto-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
}

body[data-assessment-module="1"] .hpc-page-container .ui-page-root.ui-form-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)) !important;
}

.ui-metric-card {
    min-width: 0;
    min-height: 104px;
    border: 1px solid var(--app-border, #d8e6f0);
    border-radius: 14px;
    background: #fff;
    padding: 1rem;
    box-shadow: var(--app-shadow-sm, 0 8px 22px rgba(15, 23, 42, .05));
}

.ui-metric-card p {
    margin: 0;
    color: #64748b;
    font-size: .78rem;
    font-weight: 700;
}

.ui-metric-card strong {
    display: block;
    margin-top: .45rem;
    color: #0f172a;
    font-size: 1.7rem;
    line-height: 1;
}

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

.ui-form-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    align-items: end;
}

@media (min-width: 640px) {
    .hpc-page-container .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .hpc-page-container .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (min-width: 768px) {
    .hpc-page-container .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .hpc-page-container .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .hpc-page-container .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media (min-width: 1024px) {
    .hpc-page-container .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .hpc-page-container .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .hpc-page-container .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}

@media (min-width: 1280px) {
    .hpc-page-container .xl\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .hpc-page-container .xl\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .hpc-page-container .xl\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .hpc-page-container .xl\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
    body[data-assessment-module="1"] .hpc-topbar > .hpc-shell-row--primary {
        overflow-x: clip;
    }

    body[data-assessment-module="1"] .hpc-user-button > svg:last-child {
        display: none !important;
    }
}

@media (max-width: 639px) {
    .ui-metric-grid,
    .ui-auto-grid,
    .ui-form-grid {
        grid-template-columns: 1fr;
    }

    body[data-assessment-module="1"] .hpc-page-container .ui-page-root.ui-metric-grid,
    body[data-assessment-module="1"] .hpc-page-container .ui-page-root.ui-auto-grid,
    body[data-assessment-module="1"] .hpc-page-container .ui-page-root.ui-form-grid {
        grid-template-columns: 1fr !important;
    }
}

/* ========================================================================
   Consolidated source: workspace-density.css
   ======================================================================== */
/*
 * Authenticated workspace density contract.
 *
 * Safety rule: page-specific/semantic grids always win. This stylesheet only
 * styles containers explicitly marked by workspace-density.js or known filter
 * bars. It does NOT override .ui-form-grid/.hpc-form-grid column definitions.
 */
.hpc-auth-body .hpc-page-container :where(.ui-density-grid, .ui-density-filter-grid) {
    min-width: 0;
}

@media (min-width: 761px) {
    .hpc-auth-body .hpc-page-container .ui-density-grid {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important;
        gap: .78rem .9rem !important;
        align-items: start !important;
    }

    .hpc-auth-body .hpc-page-container .ui-density-grid.ui-density-filter-grid,
    .hpc-auth-body .hpc-page-container :where(
        .adw-filter-grid,
        .hpc-filter-bar,
        .hpc-core-filter-row,
        .hpc-master-filters,
        .ui-filter-grid
    ) {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 175px), 1fr)) !important;
        gap: .62rem .7rem !important;
        align-items: end !important;
        min-width: 0;
    }
}

.hpc-auth-body .hpc-page-container :where(
    .ui-density-field--wide,
    .ui-density-actions,
    .ui-grid-span-full,
    .ui-field-span-full,
    .hpc-master-field--wide,
    .hpc-structured-field--wide,
    .adw-field--wide
) {
    grid-column: 1 / -1 !important;
}

.hpc-auth-body .hpc-page-container .ui-density-actions {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem;
    min-width: 0;
}

.hpc-auth-body .hpc-page-container .ui-density-grid > :where(label, .ui-field, .ac-form-field, .adw-field, .hpc-master-field) {
    min-width: 0;
    margin-bottom: 0;
}

.hpc-auth-body .hpc-page-container .ui-density-grid :where(input, select, textarea, .hpc-combobox, .hpc-multi-select) {
    min-width: 0;
    max-width: 100%;
}

.hpc-auth-body .hpc-page-container .ui-density-field--wide :where(textarea, [contenteditable="true"]) {
    min-height: 7rem;
}

@media (max-width: 760px) {
    .hpc-auth-body .hpc-page-container :where(
        .ui-density-grid,
        .ui-density-filter-grid,
        .adw-filter-grid,
        .hpc-filter-bar,
        .hpc-core-filter-row,
        .hpc-master-filters,
        .ui-filter-grid
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .hpc-auth-body .hpc-page-container .ui-density-actions {
        justify-content: stretch;
    }

    .hpc-auth-body .hpc-page-container .ui-density-actions > :where(button, a, form) {
        flex: 1 1 auto;
    }
}

/* Assessment standard library: explicit no-build layout contract. */
.assessment-standard-library__workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr);
    gap: 1rem;
    align-items: start;
}
.assessment-standard-library__clone {
    display: grid;
    gap: .9rem;
    min-width: 0;
}
.assessment-standard-library__clone-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(96px, 1fr));
    gap: .75rem;
}
.assessment-standard-library__clone-fields .assessment-standard-library__source {
    grid-column: 1 / -1;
}
.assessment-standard-library__clone-head p { margin-top: .25rem; }
.assessment-standard-library__errors:empty { display: none; }
.assessment-standard-library__actions {
    display: flex;
    justify-content: flex-end;
    border-top: 1px solid #e2e8f0;
    padding-top: .85rem;
}
.assessment-standard-library__actions .btn { width: auto !important; }
.assessment-standard-library__drafts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: .75rem;
}

/* Canonical session show page: compact operational overview. */
.session-show__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}
.session-overview-summary {
    display: grid;
    gap: .65rem;
    padding: .8rem .95rem;
}
.session-overview-summary__facts {
    display: grid;
    grid-template-columns: minmax(260px, 1.8fr) repeat(3, minmax(110px, .55fr));
    gap: .65rem;
    align-items: stretch;
}
.session-overview-summary__fact {
    min-width: 0;
    padding-left: .7rem;
    border-left: 2px solid var(--hpc-theme-border, #d8e6f0);
}
.session-overview-summary__fact:first-child { padding-left: 0; border-left: 0; }
.session-overview-summary__fact span {
    display: block;
    color: var(--hpc-theme-muted-text, #64748b);
    font-size: .7rem;
    font-weight: 700;
}
.session-overview-summary__fact strong {
    display: block;
    margin-top: .15rem;
    color: var(--hpc-theme-heading-text, #0f172a);
    font-size: .95rem;
    line-height: 1.3;
}
.session-overview-summary__details {
    border-top: 1px solid var(--hpc-theme-border, #e2e8f0);
    padding-top: .45rem;
}
.session-overview-summary__details > summary {
    width: fit-content;
    cursor: pointer;
    color: var(--hpc-primary, #1c6f91);
    font-size: .75rem;
    font-weight: 700;
}
.session-overview-summary__details dl {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: .6rem;
    margin: .6rem 0 0;
}
.session-overview-summary__details dt {
    color: var(--hpc-theme-muted-text, #64748b);
    font-size: .7rem;
    font-weight: 700;
}
.session-overview-summary__details dd {
    margin: .1rem 0 0;
    color: var(--hpc-theme-content-text, #0f172a);
    font-size: .82rem;
    font-weight: 650;
}
.session-overview-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr);
    gap: 1rem;
    margin-top: 1rem;
    align-items: start;
}
.session-overview-stages,
.session-overview-targets { min-width: 0; }
.session-overview-targets__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: .6rem;
}
.session-overview-target-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fbfd;
    padding: .7rem .75rem;
}
.session-overview-target-card strong { display: block; line-height: 1.3; }
.session-stage-deadline-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    gap: .5rem;
    align-items: end;
    min-width: 270px;
}
.session-stage-deadline-form .adw-field { margin: 0; }
.session-overview-stage-table td { vertical-align: top; }

@media (max-width: 1180px) {
    .assessment-standard-library__workspace,
    .session-overview-workspace {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .assessment-standard-library__clone-fields,
    .session-overview-summary__facts,
    .session-overview-targets__grid,
    .session-stage-deadline-form {
        grid-template-columns: minmax(0, 1fr);
    }
    .session-overview-summary__fact { padding: .5rem 0 0; border-left: 0; border-top: 1px solid var(--hpc-theme-border, #e2e8f0); }
    .session-overview-summary__fact:first-child { padding-top: 0; border-top: 0; }
    .assessment-standard-library__clone-fields .assessment-standard-library__source {
        grid-column: auto;
    }
    .assessment-standard-library__actions {
        justify-content: stretch;
    }
    .assessment-standard-library__actions .btn { width: 100% !important; }
    .session-stage-deadline-form { min-width: 220px; }
}

/* ========================================================================
   Consolidated source: app-ui-integrity.css
   ======================================================================== */
/*
 * HPC-AC authenticated UI integrity layer.
 * Loaded last among global assets. The purpose is to make existing page-specific
 * layouts predictable, readable, and responsive without flattening specialized
 * operational workspaces into generic grids.
 */
.hpc-auth-body .hpc-page-container,
.hpc-auth-body .hpc-page-container :where(section, article, form, fieldset, .card, .ui-card, .as-card, .hpc-card, .grid, .flex) {
    min-width: 0;
}

.hpc-auth-body .hpc-page-container :where(.grid, [class*="grid-cols-"]) > * {
    min-width: 0;
}

/* Text must never collapse into one-character vertical columns because a grid
 * track became too narrow. Keep normal writing direction across ordinary UI. */
.hpc-auth-body .hpc-page-container :where(
    label,
    legend,
    th,
    td,
    dt,
    dd,
    .ui-field,
    .adw-field,
    .hpc-master-field,
    .as-field,
    .afr-field
) {
    writing-mode: horizontal-tb;
    text-orientation: mixed;
    word-break: normal;
    overflow-wrap: break-word;
}

.hpc-auth-body .hpc-page-container :where(input, select, textarea, button, .btn, .ui-button, .adw-button) {
    max-width: 100%;
    min-width: 0;
}

.hpc-auth-body .hpc-page-container textarea {
    width: 100%;
}

/* Dense but readable filter families used across Assessment/Core/CMS/SaaS. */
@media (min-width: 900px) {
    .hpc-auth-body .hpc-page-container :where(
        .ui-filter-grid,
        .ui-filter-region.ui-density-grid,
        .hpc-filter-bar,
        .hpc-core-filter-row,
        .hpc-master-filters,
        .adw-filter-grid,
        .assessment-session-filters,
        .ac-foundation-matrix-filters,
        .erc-filters
    ) {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)) !important;
        align-items: end !important;
        gap: .6rem .7rem !important;
        width: 100%;
        min-width: 0;
    }
}

/* Common form-grid aliases. Existing page-specific column definitions remain
 * authoritative; these declarations only establish safe display/gap/min-width. */
.hpc-auth-body .hpc-page-container :where(
    .ui-form-grid,
    .hpc-form-grid,
    .hpc-form-grid-3,
    .hpc-form-grid-4,
    .hpc-core-form-grid,
    .hpc-master-form-grid,
    .ac-form-grid,
    .as-form-grid,
    .as-form-grid-2,
    .afr-form-grid,
    .afr-form-grid--two,
    .actor-form-grid__full,
    .assessment-recording-form-grid,
    .professional-target-editor__form-grid
) {
    display: grid;
    min-width: 0;
    gap: .75rem .85rem;
    align-items: start;
}

.hpc-auth-body .hpc-page-container :where(
    .ui-form-grid,
    .hpc-form-grid,
    .hpc-form-grid-3,
    .hpc-form-grid-4,
    .hpc-core-form-grid,
    .hpc-master-form-grid,
    .ac-form-grid,
    .as-form-grid,
    .as-form-grid-2,
    .afr-form-grid,
    .afr-form-grid--two,
    .actor-form-grid__full,
    .assessment-recording-form-grid,
    .professional-target-editor__form-grid
) > :where(label, .ui-field, .adw-field, .hpc-master-field, .as-field, .afr-field) {
    min-width: 0;
    margin-bottom: 0;
}

/* Full-width narrative/content controls remain full width. */
.hpc-auth-body .hpc-page-container :where(
    .ui-field-span-full,
    .ui-grid-span-full,
    .ui-density-field--wide,
    .hpc-master-field--wide,
    .hpc-structured-field--wide,
    .adw-field--wide,
    [data-field-kind="description"],
    [data-field-kind="narrative"],
    [data-field-kind="evidence"]
) {
    grid-column: 1 / -1 !important;
}

/* Tables remain usable on smaller laptops without forcing the whole page wider. */
.hpc-auth-body .hpc-page-container :where(
    .card,
    .ui-card,
    .as-card,
    .hpc-card,
    .ui-panel,
    .as-panel,
    .adw-card
):has(> table) {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

.hpc-auth-body .hpc-page-container table {
    max-width: 100%;
}

/* Desktop action rows should stay compact; full-width buttons are for mobile or
 * explicit page designs, not an accidental result of form/grid normalization. */
@media (min-width: 761px) {
    .hpc-auth-body .hpc-page-container :where(
        .ui-form-actions,
        .hpc-master-form-actions,
        .adw-filter-actions,
        .assessment-standard-library__actions,
        .assessment-session-plan__stage-actions
    ) :where(button, .btn, .ui-button, .adw-button, a) {
        width: auto !important;
    }
}

/* Missing no-build responsive utility coverage. */
@media (min-width: 640px) {
    .hpc-page-container .sm\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
    .hpc-page-container .sm\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
    .hpc-page-container .sm\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
}
@media (min-width: 768px) {
    .hpc-page-container .md\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
    .hpc-page-container .md\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
    .hpc-page-container .md\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
    .hpc-page-container .md\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; }
}
@media (min-width: 1024px) {
    .hpc-page-container .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
    .hpc-page-container .lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
    .hpc-page-container .lg\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
    .hpc-page-container .lg\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)) !important; }
    .hpc-page-container .lg\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; }
}
@media (min-width: 1280px) {
    .hpc-page-container .xl\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
    .hpc-page-container .xl\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
    .hpc-page-container .xl\:grid-cols-10 { grid-template-columns: repeat(10, minmax(0, 1fr)) !important; }
    .hpc-page-container .xl\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
    .hpc-auth-body .hpc-page-container :where(
        .ui-density-grid,
        .ui-form-grid,
        .hpc-form-grid,
        .hpc-form-grid-3,
        .hpc-form-grid-4,
        .hpc-core-form-grid,
        .hpc-master-form-grid,
        .ac-form-grid,
        .as-form-grid,
        .as-form-grid-2,
        .afr-form-grid,
        .afr-form-grid--two,
        .actor-form-grid__full,
        .assessment-recording-form-grid
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

.hpc-auth-body .hpc-page-container .ui-auto-table-scroll {
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

/* Required fields: one consistent red asterisk beside the label text. Older
 * label::after contracts placed the mark after the input when labels use grid. */
.hpc-auth-body .hpc-page-container label.ui-required-field-label::after,
.hpc-auth-body .hpc-page-container label:has(:is(input, select, textarea)[required])::after {
    content: none !important;
}
.hpc-auth-body .hpc-page-container .ui-field-label-text {
    display: inline-flex;
    align-items: baseline;
    gap: .22rem;
    min-width: 0;
    width: fit-content;
}
.hpc-auth-body .hpc-page-container .ui-required-mark {
    display: inline !important;
    color: #dc2626 !important;
    font-weight: 700 !important;
    line-height: 1;
    margin-left: .18rem;
}

/* Best-effort Print Screen deterrence. Browser code cannot guarantee blocking
 * OS-level screenshots; the proctoring event is also logged server-side. */
html.hpc-screenshot-deterrence-active .par-runtime {
    filter: blur(14px) !important;
    user-select: none !important;
}

/* Consolidated from public/assets/css/assessment-execution-plan.css — Batch 1A; kept in original cascade position. */
/* Program Asesmen multi-stage authoring + session execution planning. */
.assessment-program-stage-builder{display:grid;gap:1rem}
.assessment-program-stage-builder__head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid #cbd5e1;border-radius:1rem;background:#f8fafc}
.assessment-program-stage-builder__head h2{margin:0;font-size:1.05rem;font-weight:700;color:#0f172a}
.assessment-program-stage-builder__head p{margin:.3rem 0 0;max-width:72rem;color:#64748b;font-size:.82rem;line-height:1.5}
.assessment-program-stage-builder__list{display:grid;gap:1rem}
.assessment-program-stage-card{overflow:hidden;border:1px solid #cbd5e1;border-radius:1rem;background:#fff;box-shadow:0 1px 2px rgb(15 23 42 / .05)}
.assessment-program-stage-card__head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.8rem 1rem;border-bottom:1px solid #e2e8f0;background:#f8fafc}
.assessment-program-stage-card__head strong,.assessment-program-stage-card__head small{display:block}.assessment-program-stage-card__head strong{font-size:.92rem;color:#0f172a}.assessment-program-stage-card__head small{margin-top:.15rem;color:#64748b;font-size:.72rem}
.assessment-program-stage-card__number{display:grid;place-items:center;width:2rem;height:2rem;border-radius:.65rem;background:#3347a8;color:#fff;font-weight:700}
.assessment-program-stage-card__grid{padding:1rem}.assessment-program-stage-card__name{grid-column:span 2}
.assessment-program-stage-card__forms,.assessment-program-stage-card__staffing{margin:0 1rem 1rem;padding:1rem;border:1px solid #e2e8f0;border-radius:.85rem;background:#fff}
.assessment-program-stage-card__forms legend,.assessment-program-stage-card__staffing legend{padding:0 .35rem;font-weight:700;color:#1e293b}.assessment-program-stage-card__staffing p{margin:0 0 .75rem;color:#64748b;font-size:.75rem}

.execution-plan-panel{border:1px solid #cbd5e1;border-radius:1rem;background:#fff;box-shadow:0 1px 2px rgb(15 23 42 / .05)}
.execution-plan-panel__head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border-bottom:1px solid #e2e8f0;background:#f8fafc}
.execution-plan-panel__head h2{margin:0;font-size:1rem;font-weight:700;color:#0f172a}.execution-plan-panel__head p{margin:.25rem 0 0;color:#64748b;font-size:.78rem;line-height:1.45}
.execution-plan-panel__body{padding:1rem 1.1rem}.execution-plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem}
.execution-plan-roster{max-height:24rem;overflow:auto;border:1px solid #e2e8f0;border-radius:.8rem}.execution-plan-roster>label{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(130px,190px);gap:.65rem;align-items:center;padding:.65rem .75rem;border-bottom:1px solid #f1f5f9}.execution-plan-roster>label:last-child{border-bottom:0}
.execution-plan-roster__identity strong,.execution-plan-roster__identity small{display:block}.execution-plan-roster__identity small{color:#64748b;font-size:.72rem}
.execution-plan-actor-row{display:grid;grid-template-columns:auto minmax(0,1.2fr) minmax(140px,.7fr) minmax(150px,.8fr);gap:.65rem;align-items:center;padding:.65rem .75rem;border-bottom:1px solid #f1f5f9}.execution-plan-actor-row:last-child{border-bottom:0}
.execution-plan-print-actions{display:flex;flex-wrap:wrap;gap:.5rem}.execution-plan-print-actions a{white-space:nowrap}
.execution-plan-exception{border-color:#fbbf24;background:#fffbeb}.execution-plan-exception .execution-plan-panel__head{background:#fff7ed;border-color:#fed7aa}
.execution-plan-credential{padding:.75rem;border:1px dashed #94a3b8;border-radius:.75rem;background:#f8fafc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem}
@media(max-width:900px){.assessment-program-stage-card__name{grid-column:auto}.execution-plan-actor-row{grid-template-columns:auto minmax(0,1fr)}.execution-plan-actor-row>select{grid-column:2}.execution-plan-roster>label{grid-template-columns:auto minmax(0,1fr)}.execution-plan-roster>label>select{grid-column:2}}
@media(max-width:640px){.assessment-program-stage-builder__head,.execution-plan-panel__head{display:grid}.assessment-program-stage-card__head{grid-template-columns:auto minmax(0,1fr)}.assessment-program-stage-card__head>[data-program-stage-remove]{grid-column:2;justify-self:start}.execution-plan-grid{grid-template-columns:1fr}}
.assessment-program-stage-card__actions{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-end}.execution-plan-panel{padding-bottom:1rem}.execution-plan-panel>.mt-4,.execution-plan-panel>.mt-3{margin-left:1rem;margin-right:1rem}.execution-plan-label{display:block;margin-bottom:.3rem;font-size:.72rem;font-weight:700;color:#475569}.execution-plan-note{align-self:end;border:1px solid #e2e8f0;border-radius:.75rem;background:#f8fafc;padding:.65rem .75rem;color:#64748b;font-size:.72rem;line-height:1.45}.execution-plan-badge{border-radius:999px;background:#eef2ff;color:#3730a3;padding:.3rem .65rem;font-size:.68rem;font-weight:700;white-space:nowrap}.execution-plan-badge--warning{background:#fff7ed;color:#9a3412}.execution-plan-panel--exception{border-color:#fed7aa}.execution-plan-panel--exception .execution-plan-panel__head{background:#fff7ed}.execution-plan-checkbox-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.4rem}.execution-plan-checkbox-grid label{display:flex;gap:.45rem;align-items:flex-start;border:1px solid #e2e8f0;border-radius:.65rem;padding:.55rem .65rem;font-size:.75rem}.execution-plan-credential strong,.execution-plan-credential span,.execution-plan-credential code,.execution-plan-credential small{display:block}.execution-plan-credential code{margin:.25rem 0;font-size:.85rem}.execution-plan-details{border-top:1px solid #e2e8f0;padding-top:.85rem}.execution-plan-details summary{cursor:pointer;font-weight:700;color:#334155}.execution-plan-roster>label>span strong,.execution-plan-roster>label>span small{display:block}.execution-plan-roster>label>span small{font-size:.7rem;color:#64748b}

/* Consolidated from ui-strict-mode.css — Core UI Design System Batch 1B. */
/*
 * HPC-AC strict interface layer.
 *
 * This stylesheet contains reusable layout utilities and dynamic-value targets
 * used to keep active browser UI free from page-local <style> blocks and
 * Blade style attributes. Self-contained PDF/report documents remain isolated
 * from this application-shell contract.
 */

[x-cloak] {
    display: none !important;
}

.ui-hidden-initial {
    display: none;
}

.ui-mt-025 { margin-top: .25rem; }
.ui-mt-035 { margin-top: .35rem; }
.ui-mt-045 { margin-top: .45rem; }
.ui-mt-055 { margin-top: .55rem; }
.ui-mt-075 { margin-top: .75rem; }
.ui-mt-080 { margin-top: .8rem; }
.ui-mt-085 { margin-top: .85rem; }
.ui-mt-090 { margin-top: .9rem; }
.ui-mt-100 { margin-top: 1rem; }
.ui-mb-075 { margin-bottom: .75rem; }

.ui-grid-span-full { grid-column: 1 / -1; }
.ui-grid-span-2 { grid-column: span 2; }
.ui-grid-column-auto { grid-column: auto; }
.ui-min-w-0 { min-width: 0; }
.ui-text-left { text-align: left; }
.ui-text-right { text-align: right; }
.ui-cursor-pointer { cursor: pointer; }
.ui-summary-reset { cursor: pointer; list-style: none; }
.ui-align-self-end { align-self: end; }
.ui-justify-end { justify-content: flex-end; }
.ui-justify-between { justify-content: space-between; }
.ui-justify-center { justify-content: center; }
.ui-w-full { width: 100%; }
.ui-word-wrap { word-break: normal; overflow-wrap: break-word; }

.ui-flex-meta {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
}

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

.ui-card-pad-1 { padding: 1rem; }
.ui-font-090 { font-size: .9rem; line-height: 1.45; }
.ui-font-100 { font-size: 1rem; }
.ui-font-110 { font-size: 1.1rem; }
.ui-font-115 { font-size: 1.15rem; }
.ui-font-120 { font-size: 1.2rem; }
.ui-font-125 { font-size: 1.25rem; }
.ui-max-w-560 { min-width: min(100%, 560px); }

.ui-danger-action {
    color: #b91c1c;
    border-color: #fecaca;
}

.ui-note-success {
    border-color: #9dd9ae;
    background: #f0fbf3;
    color: #146c2e;
}

.ui-note-warning {
    border-color: #f5c777;
    background: #fff9eb;
    color: #8a4d08;
}

.ui-error-list {
    margin: .5rem 0 0 1.2rem;
}

.ui-actions-spread {
    margin-top: .55rem;
    justify-content: space-between;
}

.ui-primary-submit-full {
    margin-top: 1rem;
    width: 100%;
    justify-content: center;
}

.ui-settings-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 1rem;
    align-items: start;
}

.ui-settings-preview-panel {
    grid-column: auto;
    position: sticky;
    top: 84px;
}

.ui-dynamic-theme {
    background: var(--ui-dynamic-bg, transparent);
    color: var(--ui-dynamic-color, inherit);
    font-family: var(--ui-dynamic-font, inherit);
}

.ui-dynamic-bg {
    background: var(--ui-dynamic-bg, transparent);
}

.ui-modal-panel {
    max-width: var(--ui-max-width, 520px);
}

.ui-sidebar-theme {
    background: var(--app-sidebar-bg);
    color: var(--app-sidebar-text);
}

.ui-progress-value {
    width: var(--ui-progress, 0%);
}

.ui-meeting-frame {
    width: min(100%, 1080px);
    height: min(68vh, 650px);
    min-height: 430px;
}

.ui-designer-canvas-copy,
.ui-designer-canvas-footer {
    position: absolute;
    left: 40px;
    right: 40px;
    border: 1px dashed #d8e7f5;
    border-radius: 14px;
    padding: 18px;
    color: #557095;
}

.ui-designer-canvas-copy { top: 120px; }
.ui-designer-canvas-footer { bottom: 40px; }

.ui-designer-asset {
    left: var(--ui-left, 0px);
    top: var(--ui-top, 0px);
    width: var(--ui-width, 120px);
    height: var(--ui-height, 70px);
}

.ui-designer-preview-image {
    position: absolute;
    object-fit: contain;
    left: var(--ui-left, 0px);
    top: var(--ui-top, 0px);
    width: var(--ui-width, 120px);
    height: var(--ui-height, 70px);
}

.ui-public-logo-mark {
    width: 64px;
    height: 64px;
    border-radius: 20px;
    background: #fff;
    padding: 6px;
    box-shadow: 0 10px 24px rgb(15 23 42 / .1);
}

/* Participant meeting workspace: simple, accessible, and single-action first. */
html.participant-zoom-page,
html.participant-zoom-page body {
    margin: 0 !important;
    min-height: 100% !important;
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

html.participant-zoom-page body {
    font-family: var(--app-content-font-family, Inter, "Segoe UI", Roboto, Arial, sans-serif);
    font-size: 16px;
}

.participant-meeting-shell {
    min-height: 100vh;
    min-height: 100dvh;
    background: #f1f5f9;
}

.participant-meeting-header {
    position: sticky;
    top: 0;
    z-index: 40;
    display: flex;
    min-height: 72px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid #cbd5e1;
    background: rgb(255 255 255 / .96);
    padding: .75rem clamp(1rem, 3vw, 2rem);
    backdrop-filter: blur(10px);
}

.participant-meeting-brand {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .8rem;
}

.participant-meeting-brand-mark {
    display: inline-flex;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #1d4ed8;
    color: #fff;
    font-size: .9rem;
    font-weight: 700;
}

.participant-meeting-brand strong,
.participant-meeting-brand span {
    display: block;
}

.participant-meeting-brand strong {
    overflow: hidden;
    font-size: 1rem;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.participant-meeting-brand span {
    margin-top: .1rem;
    color: #475569;
    font-size: .875rem;
    font-weight: 700;
}

.participant-meeting-back,
.participant-meeting-external-primary,
.participant-meeting-troubleshooting a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    padding: .7rem 1rem;
    font-size: .95rem;
    font-weight: 700;
    text-decoration: none;
}

.participant-meeting-back {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #0f172a;
}

.participant-meeting-back:hover {
    background: #f8fafc;
}

.participant-meeting-context {
    width: min(calc(100% - 2rem), 1180px);
    margin: 1rem auto 0;
    border: 1px solid #dbeafe;
    border-radius: 20px;
    background: #fff;
    padding: clamp(1rem, 2vw, 1.5rem);
    box-shadow: 0 12px 30px rgb(15 23 42 / .06);
}

.participant-meeting-eyebrow {
    color: #1d4ed8;
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform:none;
}

.participant-meeting-context h1 {
    margin: .35rem 0 0;
    font-size: clamp(1.35rem, 3vw, 2rem);
    font-weight: 700;
    line-height: 1.2;
}

.participant-meeting-stage-name {
    margin: .4rem 0 0;
    color: #475569;
    font-size: 1rem;
    font-weight: 700;
}

.participant-meeting-meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
    margin: 1.25rem 0 0;
}

.participant-meeting-meta div {
    min-width: 0;
    border-radius: 14px;
    background: #f8fafc;
    padding: .8rem;
}

.participant-meeting-meta dt {
    color: #64748b;
    font-size: .82rem;
    font-weight: 700;
}

.participant-meeting-meta dd {
    overflow-wrap: anywhere;
    margin: .25rem 0 0;
    color: #0f172a;
    font-size: .95rem;
    font-weight: 700;
}

.participant-meeting-pill {
    display: inline-flex;
    border-radius: 999px;
    background: #dbeafe;
    padding: .35rem .7rem;
    color: #1e3a8a;
    font-size: .82rem;
    font-weight: 700;
}

.participant-meeting-stage {
    width: min(calc(100% - 2rem), 1180px);
    margin: 1rem auto 0;
    padding-bottom: 2rem;
}

.participant-meeting-guidance,
.participant-meeting-helper {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    border: 1px solid #bae6fd;
    border-radius: 16px;
    background: #f0f9ff;
    padding: .9rem 1rem;
    color: #0c4a6e;
    font-size: .95rem;
    line-height: 1.55;
}

.participant-meeting-guidance {
    margin-bottom: .8rem;
}

.participant-meeting-frame {
    width: 100%;
    height: min(72vh, 720px);
    min-height: 460px;
    overflow: hidden;
    border: 1px solid #0f172a;
    border-radius: 20px;
    background: #020617;
    box-shadow: 0 18px 50px rgb(15 23 42 / .18);
}

.participant-meeting-frame iframe,
.participant-meeting-frame [data-zoom-sdk-panel] {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    border: 0 !important;
}

.participant-meeting-fallback {
    display: grid;
    height: 100%;
    place-items: center;
    padding: 2rem;
    text-align: center;
    color: #fff;
}

.participant-meeting-fallback h2 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
}

.participant-meeting-fallback p {
    max-width: 620px;
    margin: .75rem auto 0;
    color: #cbd5e1;
    font-size: 1rem;
    line-height: 1.65;
}

.participant-meeting-external-primary {
    margin-top: 1.25rem;
    background: #2563eb;
    color: #fff;
}

.participant-meeting-no-link {
    border: 1px solid #fbbf24;
    border-radius: 12px;
    background: #422006;
    padding: .8rem 1rem;
    color: #fef3c7 !important;
    font-weight: 700;
}

.participant-meeting-troubleshooting {
    margin-top: .8rem;
    border: 1px solid #cbd5e1;
    border-radius: 16px;
    background: #fff;
}

.participant-meeting-troubleshooting summary {
    min-height: 44px;
    cursor: pointer;
    padding: .85rem 1rem;
    font-size: .95rem;
    font-weight: 700;
}

.participant-meeting-troubleshooting > div {
    border-top: 1px solid #e2e8f0;
    padding: 1rem;
}

.participant-meeting-troubleshooting p {
    margin: 0 0 .75rem;
    color: #475569;
    font-size: .95rem;
    line-height: 1.6;
}

.participant-meeting-troubleshooting a {
    border: 1px solid #2563eb;
    color: #1d4ed8;
}

.participant-meeting-helper {
    margin-top: .8rem;
}

@media (max-width: 900px) {
    .participant-meeting-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .participant-meeting-frame {
        height: 64vh;
        min-height: 380px;
        border-radius: 16px;
    }
}

@media (max-width: 560px) {
    .participant-meeting-header {
        align-items: flex-start;
    }

    .participant-meeting-brand-mark {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

    .participant-meeting-back {
        padding-inline: .75rem;
        font-size: .85rem;
    }

    .participant-meeting-context,
    .participant-meeting-stage {
        width: min(calc(100% - 1rem), 1180px);
    }

    .participant-meeting-meta {
        grid-template-columns: minmax(0, 1fr);
    }

    .participant-meeting-frame {
        height: 60vh;
        min-height: 340px;
    }
}

input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear {
    display: none;
}

@media (max-width: 920px) {
    .participant-meeting-shell { display: block; }
    .participant-meeting-sidebar { display: none; }
    .participant-meeting-nav { justify-content: space-between; font-size: 1rem; }
    .participant-meeting-context { margin: .75rem; padding: .75rem 1rem; }
    .participant-meeting-frame { height: 64vh; min-height: 360px; }
}

@media (max-width: 900px) {
    .ui-settings-layout { grid-template-columns: minmax(0, 1fr); }
    .ui-settings-preview-panel { position: static; }
}

/* Zoom readiness and permanent participant meeting layout closure. */
html.participant-zoom-page,
html.participant-zoom-page body { width: 100%; max-width: 100%; overflow-x: hidden; }
.participant-meeting-shell,
.participant-meeting-context,
.participant-meeting-stage,
.participant-meeting-frame { box-sizing: border-box; min-width: 0; max-width: 100%; }
.participant-meeting-fallback h2 { color: #fff !important; }


/* Consolidated from ui-action-consistency.css — Core UI Design System Batch 1B. */
/* Shared row-action contract for all index/work-queue tables. */
:root{--hpc-row-action-height:34px;--hpc-row-action-radius:9px;--hpc-row-action-gap:.35rem}
.hpc-page-container :where(.hpc-core-actions-cell,.hpc-table-actions,.as-actions-cell,td[data-actions="1"]){min-width:max-content!important;width:1%;white-space:nowrap!important;text-align:right}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions){display:inline-flex!important;align-items:center!important;justify-content:flex-end!important;flex-flow:row nowrap!important;gap:var(--hpc-row-action-gap)!important;min-width:max-content;width:max-content;max-width:none;margin-left:auto;white-space:nowrap!important}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions)>form{display:inline-flex!important;flex:0 0 auto;margin:0!important}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) :where(a,button,.hpc-row-action){display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:.32rem;flex:0 0 auto;min-width:auto;min-height:var(--hpc-row-action-height)!important;height:var(--hpc-row-action-height);border:1px solid var(--app-border,var(--tenant-border,#d8e6f0))!important;border-radius:var(--hpc-row-action-radius)!important;background:var(--tenant-surface,#fff)!important;color:var(--app-content-text,#173a56)!important;padding:.42rem .62rem!important;box-shadow:none!important;font-size:.68rem!important;font-weight:700!important;line-height:1!important;text-decoration:none!important;text-transform:none!important;letter-spacing:0!important;white-space:nowrap!important;cursor:pointer}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) :where(a,button):hover{border-color:color-mix(in srgb,var(--tenant-primary,#1c8fbd) 46%,var(--app-border,#d8e6f0))!important;background:var(--tenant-soft-surface,#f6fafc)!important;color:var(--tenant-primary,#1c8fbd)!important}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) :where(.is-primary,.primary,[data-action-variant="primary"]){background:var(--tenant-primary,#1c8fbd)!important;border-color:var(--tenant-primary,#1c8fbd)!important;color:var(--tenant-primary-text,#fff)!important}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) :where(.impersonate,.is-warning,.warning,[data-action-variant="warning"]){background:#fff8e8!important;border-color:#f2c86e!important;color:#8a5400!important}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) :where(.danger,.is-danger,[data-action-variant="danger"]){background:#fff2f4!important;border-color:#f0a6b4!important;color:#b42345!important}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) svg{width:14px!important;height:14px!important;flex:0 0 14px}
.hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions) :where(button:disabled,a[aria-disabled="true"]){opacity:.48;cursor:not-allowed}

@media(max-width:900px){
    .hpc-page-container :where(.hpc-core-actions-cell,.hpc-table-actions,.as-actions-cell,td[data-actions="1"]){max-width:min(78vw,34rem);overflow-x:auto;overscroll-behavior-inline:contain}
    .hpc-page-container :where([data-row-actions="1"],.hpc-core-row-actions,.hpc-row-actions,.hpc-table-actions,.as-actions,.ac-actions){justify-content:flex-start!important;margin-left:0}
}

/* Institution access screen: prototype-aligned compact filters and prioritized admins. */
.institution-access-filters{display:grid!important;grid-template-columns:minmax(15rem,1.6fr) minmax(12rem,1fr) minmax(9rem,.7fr) auto;gap:.55rem;align-items:end;min-width:min(100%,58rem)}
.institution-access-filters>label{display:flex;min-width:0;margin:0}
.institution-access-filters :where(input,select){width:100%;min-height:40px;margin:0}
.institution-access-per-page{align-items:center;gap:.4rem;white-space:nowrap;color:var(--app-muted-text,#66788e);font-size:.7rem;font-weight:700}
.institution-access-per-page select{width:5.3rem}
.institution-access-account{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.hpc-core-status.is-admin{background:color-mix(in srgb,var(--tenant-primary,#1c8fbd) 11%,var(--tenant-surface,#fff));border-color:color-mix(in srgb,var(--tenant-primary,#1c8fbd) 28%,var(--app-border,#d8e6f0));color:var(--tenant-primary,#1c8fbd);font-size:.58rem}
.hpc-core-table tr.is-institution-admin>td{background:color-mix(in srgb,var(--tenant-primary,#1c8fbd) 3.5%,var(--tenant-surface,#fff))}
.hpc-core-table tr.is-institution-admin>td:first-child{box-shadow:inset 3px 0 0 var(--tenant-primary,#1c8fbd)}
.hpc-core-row-actions .hpc-row-action i{display:inline-flex;width:14px;height:14px}

@media(max-width:1180px){.institution-access-filters{grid-template-columns:minmax(14rem,1.5fr) 1fr 1fr}.institution-access-per-page{grid-column:3}}
@media(max-width:760px){.institution-access-filters{grid-template-columns:1fr;min-width:0;width:100%}.institution-access-per-page{grid-column:auto;justify-content:space-between}.institution-access-per-page select{width:6rem}}


/* Consolidated from ui-sot-slate-indigo.css — Core UI Design System Batch 1B. */
/*
 * HPC-AC UI/UX Source of Truth — Slate & Indigo, compact operational edition.
 *
 * Loaded after every legacy/workspace stylesheet. It normalizes visual behavior
 * without requiring npm/Tailwind compilation and keeps tenant branding as the
 * accent authority where a tenant explicitly overrides the default indigo.
 */
:root {
    --sot-slate-50: #f8fafc;
    --sot-slate-100: #f1f5f9;
    --sot-slate-200: #e2e8f0;
    --sot-slate-300: #cbd5e1;
    --sot-slate-400: #94a3b8;
    --sot-slate-500: #64748b;
    --sot-slate-600: #475569;
    --sot-slate-700: #334155;
    --sot-slate-800: #1e293b;
    --sot-slate-900: #0f172a;
    --sot-indigo-50: #eef2ff;
    --sot-indigo-100: #e0e7ff;
    --sot-indigo-500: #6366f1;
    --sot-indigo-600: #4f46e5;
    --sot-indigo-700: #4338ca;
    --sot-emerald-50: #ecfdf5;
    --sot-emerald-600: #059669;
    --sot-amber-50: #fffbeb;
    --sot-amber-600: #d97706;
    --sot-rose-50: #fff1f2;
    --sot-rose-600: #e11d48;
    --sot-sky-50: #f0f9ff;
    --sot-sky-600: #0284c7;

    --sot-accent: var(--tenant-primary, var(--app-primary, var(--sot-indigo-600)));
    --sot-accent-strong: var(--tenant-primary-strong, var(--app-primary-dark, var(--sot-indigo-700)));
    /*
     * The tinted companions to --sot-accent. Their fallback used to be the indigo ramp while
     * --sot-accent itself fell through to --app-primary, so a soft badge sat in indigo next
     * to a solid control in brand teal. Falling back to a teal tint keeps the pair in one
     * family when a tenant sets no soft colour of its own.
     */
    --sot-accent-soft: var(--tenant-primary-soft, #eef7fb);
    --sot-accent-soft-line: var(--tenant-primary-soft-line, #d7ecf6);
    --sot-page: var(--tenant-content-bg, var(--app-content-bg, var(--sot-slate-50)));
    --sot-surface: var(--tenant-surface, var(--app-card-bg, #ffffff));
    --sot-surface-muted: var(--tenant-soft-surface, var(--app-soft-bg, var(--sot-slate-100)));
    --sot-text: var(--tenant-content-text, var(--app-content-text, var(--sot-slate-800)));
    --sot-title: var(--tenant-title-text, var(--app-title-text, var(--sot-slate-900)));
    --sot-muted: var(--sot-slate-500);
    --sot-border: var(--tenant-border, var(--app-border-color, var(--sot-slate-200)));
    --sot-border-strong: var(--sot-slate-300);
    --sot-focus: rgba(99, 102, 241, .22);
    --sot-radius-sm: 6px;
    --sot-radius: 8px;
    --sot-radius-lg: 10px;
    --sot-shadow: 0 1px 2px rgba(15, 23, 42, .055);
    --sot-shadow-float: 0 8px 24px rgba(15, 23, 42, .10);
    --sot-control-height-sm: 32px;
    --sot-control-height: 38px;
    --sot-control-height-lg: 44px;
    --sot-transition: 150ms ease-in-out;

    /* Reconcile existing canonical tokens with this SOT. */
    --ui-primary: var(--sot-accent);
    --ui-primary-strong: var(--sot-accent-strong);
    --ui-bg: var(--sot-page);
    --ui-surface: var(--sot-surface);
    --ui-surface-muted: var(--sot-surface-muted);
    --ui-surface-subtle: var(--sot-slate-50);
    --ui-text: var(--sot-text);
    --ui-text-muted: var(--sot-muted);
    --ui-border: var(--sot-border);
    --ui-border-strong: var(--sot-border-strong);
    --ui-focus: var(--sot-focus);
    --ui-shadow-xs: var(--sot-shadow);
    --ui-shadow-sm: 0 4px 14px rgba(15, 23, 42, .065);
    --ui-radius-control: var(--sot-radius);
    --ui-radius-card: var(--sot-radius-lg);
    --ui-control-height: var(--sot-control-height);
    --ui-content-pad: clamp(12px, 1.25vw, 20px);
    --ui-section-gap: 12px;
}

[data-hpc-ui-sot="slate-indigo-v1"] {
    background: var(--sot-page);
    color: var(--sot-text);
}

[data-hpc-ui-sot="slate-indigo-v1"] *,
[data-hpc-ui-sot="slate-indigo-v1"] *::before,
[data-hpc-ui-sot="slate-indigo-v1"] *::after {
    box-sizing: border-box;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(a, button, input, select, textarea, summary, [role="button"], [role="tab"], [tabindex]) {
    transition: color var(--sot-transition), background-color var(--sot-transition), border-color var(--sot-transition), box-shadow var(--sot-transition), opacity var(--sot-transition), transform var(--sot-transition);
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(:focus-visible) {
    outline: 2px solid var(--sot-accent);
    outline-offset: 2px;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(h1, h2, h3, h4, h5, h6) {
    color: var(--sot-title);
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container {
    padding: var(--ui-content-pad);
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.space-y-8, .space-y-10, .space-y-12) > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1rem !important;
}

/* Page hierarchy */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-primary-page-header, .ui-page-header-component, .page-header, .ac-page-header, .hpc-core-hero) {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
    margin: 0 0 .75rem;
    padding: .8rem .9rem;
    border: 1px solid var(--sot-border);
    border-radius: var(--sot-radius-lg);
    background: var(--sot-surface);
    box-shadow: var(--sot-shadow);
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-primary-page-heading, .page-title, .ac-title, .hpc-core-title) {
    margin: 0;
    color: var(--sot-title) !important;
    font-size: clamp(1.18rem, 1.5vw, 1.45rem) !important;
    font-weight: 700 !important;
    line-height: 1.22 !important;
    letter-spacing: -.018em !important;
}

/*
 * .ui-primary-page-header is also reused as an inner title-stack wrapper
 * (badge row, heading, description) inside .as-card-header on list pages
 * such as the participant command center. The row-direction/space-between
 * rule above is meant for a true top-level page header (title block next
 * to actions) and collapses that stacked content to near-zero width when
 * nested this way. Force it back to a block/column stack in that context.
 */
.as-card-header > .ui-primary-page-header {
    display: block;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.page-description, .ac-subtitle, .hpc-page-subtitle, .ui-page-description) {
    margin: .22rem 0 0;
    color: var(--sot-muted) !important;
    font-size: .82rem !important;
    line-height: 1.45 !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-page-header-eyebrow, .ui-eyebrow) {
    display: block;
    margin-bottom: .2rem;
    color: var(--sot-accent-strong);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform:none;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-page-header-actions, .ui-action-group, .as-actions, .ac-actions, .row-actions) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .4rem;
}

/* Cards, panels, toolbars and filters */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-section-card, .as-card, .ac-panel, .hpc-card, .card, .hpc-core-panel, .adw-panel, .panel, .rounded-xl.bg-white, .rounded-2xl.bg-white) {
    border: 1px solid var(--sot-border) !important;
    border-radius: var(--sot-radius-lg) !important;
    background: var(--sot-surface) !important;
    color: var(--sot-text);
    box-shadow: var(--sot-shadow) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-section-card__header, .card-header, .panel-header, .ac-panel-header) {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .65rem;
    padding: .7rem .8rem;
    border-bottom: 1px solid var(--sot-border);
    background: var(--sot-slate-50);
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-section-card__header h2, .card-header h2, .panel-header h2) {
    margin: 0;
    font-size: .92rem;
    font-weight: 700;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-section-card__header p, .card-header p, .panel-header p) {
    margin: .15rem 0 0;
    color: var(--sot-muted);
    font-size: .75rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-toolbar, .ui-filter-bar, .filter-bar, .filters, .hpc-filter-bar, .ac-filter-bar, .ui-form-actions, .ui-sticky-action-bar) {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: space-between;
    gap: .55rem;
    padding: .65rem .75rem;
    border: 1px solid var(--sot-border);
    border-radius: var(--sot-radius-lg);
    background: var(--sot-surface-muted);
}

/* Buttons */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button, .hpc-button, .as-btn, .ac-btn, .btn, [data-ui-button]) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .38rem;
    min-height: var(--sot-control-height);
    padding: .48rem .72rem;
    border: 1px solid transparent;
    border-radius: var(--sot-radius) !important;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.15;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--sm, .hpc-button-sm, .as-btn-sm, .btn-sm, [data-ui-button-size="sm"]) {
    min-height: var(--sot-control-height-sm);
    padding: .36rem .58rem;
    font-size: .75rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--lg, .hpc-button-lg, .as-btn-lg, .btn-lg, [data-ui-button-size="lg"]) {
    min-height: var(--sot-control-height-lg);
    padding: .62rem .9rem;
    font-size: .86rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--primary, .hpc-button-primary, .as-btn-primary, .ac-btn-primary, .btn-primary, [data-ui-button="primary"]) {
    border-color: var(--sot-accent);
    background: var(--sot-accent) !important;
    color: #fff !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--primary, .hpc-button-primary, .as-btn-primary, .ac-btn-primary, .btn-primary, [data-ui-button="primary"]):hover {
    border-color: var(--sot-accent-strong);
    background: var(--sot-accent-strong) !important;
    transform: translateY(-1px);
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--secondary, .ui-button--outline, .hpc-button-secondary, .hpc-button-soft, .as-btn-secondary, .ac-btn-secondary, .btn-secondary, .btn-outline, [data-ui-button="secondary"]) {
    border-color: var(--sot-border-strong) !important;
    background: var(--sot-surface) !important;
    color: var(--sot-slate-700) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--secondary, .ui-button--outline, .hpc-button-secondary, .hpc-button-soft, .as-btn-secondary, .ac-btn-secondary, .btn-secondary, .btn-outline, [data-ui-button="secondary"]):hover {
    border-color: var(--sot-slate-400) !important;
    background: var(--sot-slate-50) !important;
    color: var(--sot-slate-900) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--danger, .hpc-button-danger, .as-btn-danger, .btn-danger, [data-ui-button="danger"]) {
    border-color: var(--sot-rose-600) !important;
    background: var(--sot-rose-600) !important;
    color: #fff !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button, .hpc-button, .as-btn, .ac-btn, .btn, [data-ui-button]):disabled,
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button, .hpc-button, .as-btn, .ac-btn, .btn, [data-ui-button])[aria-disabled="true"] {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}

/* Forms */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.hpc-field-stack, .ui-form-field, .form-group) {
    display: grid;
    gap: .3rem;
    min-width: 0;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.hpc-field-stack > label, .ui-form-field > label, .form-label) {
    color: var(--sot-slate-700);
    font-size: .76rem;
    font-weight: 700;
    line-height: 1.3;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea, [contenteditable="true"], .hpc-combobox-button) {
    min-height: var(--sot-control-height) !important;
    border: 1px solid var(--sot-border-strong) !important;
    border-radius: var(--sot-radius) !important;
    background: var(--sot-surface) !important;
    color: var(--sot-text) !important;
    font-size: .82rem !important;
    line-height: 1.35;
    box-shadow: none !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea, [contenteditable="true"], .hpc-combobox-button):focus,
[data-hpc-ui-sot="slate-indigo-v1"] :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea, [contenteditable="true"], .hpc-combobox-button):focus-within {
    border-color: var(--sot-accent) !important;
    box-shadow: 0 0 0 3px var(--sot-focus) !important;
    outline: 0 !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(input, select, textarea)::placeholder {
    color: var(--sot-slate-400);
    opacity: 1;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(input, select, textarea):disabled,
[data-hpc-ui-sot="slate-indigo-v1"] :where(input, select, textarea)[readonly] {
    background: var(--sot-slate-100) !important;
    color: var(--sot-slate-500) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.hpc-field-help, .ui-field-help, .form-help) {
    color: var(--sot-muted);
    font-size: .72rem;
    line-height: 1.4;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.hpc-field-error, .ui-field-error, .invalid-feedback) {
    color: var(--sot-rose-600);
    font-size: .72rem;
    font-weight: 650;
}

/* Tables and lists */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.hpc-ui-table-region, .ui-table-shell, .table-wrap, .overflow-x-auto):has(> table) {
    overflow-x: auto;
    border: 1px solid var(--sot-border);
    border-radius: var(--sot-radius-lg);
    background: var(--sot-surface);
    box-shadow: var(--sot-shadow);
}

[data-hpc-ui-sot="slate-indigo-v1"] table {
    width: 100%;
    border-collapse: collapse;
    color: var(--sot-text);
    font-size: .79rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] table :where(th, td) {
    padding: .54rem .65rem !important;
    border-bottom: 1px solid var(--sot-border) !important;
    line-height: 1.36;
    vertical-align: top;
}

[data-hpc-ui-sot="slate-indigo-v1"] table th {
    background: var(--sot-slate-50) !important;
    color: var(--sot-slate-600) !important;
    font-size: .69rem !important;
    font-weight: 700 !important;
    letter-spacing: .035em;
    text-align: left;
    text-transform:none;
    white-space: nowrap;
}

[data-hpc-ui-sot="slate-indigo-v1"] table tbody tr:hover > td {
    background: rgba(248, 250, 252, .72) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] table tbody tr:last-child > td {
    border-bottom: 0 !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(td.is-numeric, th.is-numeric, td[data-align="number"], th[data-align="number"]) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(td.is-actions, th.is-actions, td[data-align="actions"], th[data-align="actions"]) {
    text-align: right;
    white-space: nowrap;
}

/* Statuses and alerts */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-status, .hpc-ui-badge, .as-badge, .badge, .hpc-status, .ac-status, [data-ui-status]) {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    min-height: 24px;
    padding: .2rem .48rem;
    border: 1px solid var(--sot-border);
    border-radius: 999px !important;
    background: var(--sot-slate-100);
    color: var(--sot-slate-700);
    font-size: .68rem;
    font-weight: 700;
    line-height: 1.15;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.is-success, .status-success, .badge-success, [data-ui-status="success"]) { border-color: #a7f3d0 !important; background: var(--sot-emerald-50) !important; color: #047857 !important; }
[data-hpc-ui-sot="slate-indigo-v1"] :where(.is-warning, .status-warning, .badge-warning, [data-ui-status="warning"]) { border-color: #fde68a !important; background: var(--sot-amber-50) !important; color: #b45309 !important; }
[data-hpc-ui-sot="slate-indigo-v1"] :where(.is-danger, .is-error, .status-danger, .badge-danger, [data-ui-status="danger"]) { border-color: #fecdd3 !important; background: var(--sot-rose-50) !important; color: #be123c !important; }
[data-hpc-ui-sot="slate-indigo-v1"] :where(.is-info, .status-info, .badge-info, [data-ui-status="info"]) { border-color: #bae6fd !important; background: var(--sot-sky-50) !important; color: #0369a1 !important; }
[data-hpc-ui-sot="slate-indigo-v1"] :where(.is-active, .status-active, .badge-primary, [data-ui-status="active"]) { border-color: var(--sot-accent-soft-line) !important; background: var(--sot-accent-soft) !important; color: var(--sot-accent-strong) !important; }

[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-alert, .alert, [role="alert"]) {
    border: 1px solid var(--sot-border);
    border-left-width: 4px;
    border-radius: var(--sot-radius-lg);
    background: var(--sot-surface);
    padding: .65rem .75rem;
    box-shadow: var(--sot-shadow);
}

/* Navigation */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-topbar {
    border-bottom: 1px solid var(--sot-border);
    box-shadow: none !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-workspace-bar {
    border-bottom: 1px solid var(--sot-border);
    background: var(--sot-surface);
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-workspace-bar-inner {
    gap: .32rem;
    padding: .35rem .7rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-workspace-button {
    min-height: 34px;
    padding: .42rem .66rem;
    border: 1px solid transparent;
    border-radius: var(--sot-radius);
    background: transparent;
    color: var(--sot-slate-600);
    font-size: .76rem;
    font-weight: 680;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-workspace-button:hover {
    border-color: var(--sot-border);
    background: var(--sot-slate-50);
    color: var(--sot-slate-900);
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-workspace-button.is-active,
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-workspace-button[aria-selected="true"] {
    border-color: var(--sot-accent);
    background: var(--sot-accent) !important;
    color: #fff !important;
    font-size: .8rem;
    font-weight: 700;
    box-shadow: var(--sot-shadow);
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-sidebar-link {
    border: 1px solid transparent;
    border-radius: var(--sot-radius) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-sidebar-link:hover {
    border-color: rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .07);
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-sidebar-link.is-active,
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-sidebar-link[aria-current="page"] {
    border-color: var(--sot-accent);
    background: var(--sot-accent-soft) !important;
    color: var(--sot-accent-strong) !important;
    font-weight: 700;
}

/* Canonical pagination */
[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .55rem;
    padding-top: .65rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__summary {
    color: var(--sot-muted);
    font-size: .75rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__controls {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .22rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 32px;
    padding: .35rem .48rem;
    border: 1px solid var(--sot-border-strong);
    border-radius: var(--sot-radius-sm);
    background: var(--sot-surface);
    color: var(--sot-slate-700);
    font-size: .74rem;
    font-weight: 680;
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__item:hover:not([aria-disabled="true"]) {
    border-color: var(--sot-accent);
    background: var(--sot-accent-soft);
    color: var(--sot-accent-strong);
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__item.is-current,
[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__item[aria-current="page"] {
    border-color: var(--sot-accent);
    background: var(--sot-accent) !important;
    color: #fff !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination__item[aria-disabled="true"] {
    opacity: .45;
    cursor: default;
}

/* Toasts remain one global component. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-toast-region {
    top: calc(var(--ui-topbar-height) + 10px);
    right: 12px;
    width: min(380px, calc(100vw - 24px));
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-toast {
    border-color: var(--sot-border);
    border-radius: var(--sot-radius-lg);
    background: var(--sot-surface);
    box-shadow: var(--sot-shadow-float);
    animation-duration: 150ms;
}

/* Avoid pronounced legacy shadows and excessive roundness without touching pills. */
[data-hpc-ui-sot="slate-indigo-v1"] :where(.shadow-lg, .shadow-xl, .shadow-2xl) {
    box-shadow: var(--sot-shadow) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] :where(.rounded-2xl, .rounded-3xl):not(.rounded-full):not(.badge):not(.hpc-ui-badge) {
    border-radius: var(--sot-radius-lg) !important;
}

@media (max-width: 760px) {
    [data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-primary-page-header, .ui-page-header-component, .page-header, .ac-page-header, .hpc-core-hero) {
        align-items: stretch;
        flex-direction: column;
    }

    [data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-page-header-actions, .ui-action-group, .as-actions, .ac-actions, .row-actions) {
        justify-content: flex-start;
    }

    [data-hpc-ui-sot="slate-indigo-v1"] .ui-pagination {
        align-items: stretch;
        flex-direction: column;
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-hpc-ui-sot="slate-indigo-v1"] *,
    [data-hpc-ui-sot="slate-indigo-v1"] *::before,
    [data-hpc-ui-sot="slate-indigo-v1"] *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

[data-hpc-ui-sot="slate-indigo-v1"] .ui-section-card__body:not(.is-flush) {
    padding: .78rem .82rem;
}
[data-hpc-ui-sot="slate-indigo-v1"] .ui-section-card__body.is-flush { padding: 0; }
[data-hpc-ui-sot="slate-indigo-v1"] .ui-action-bar__message {
    color: var(--sot-muted);
    font-size: .76rem;
    line-height: 1.4;
}
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--success, [data-ui-button="success"]) {
    border-color: var(--sot-emerald-600) !important;
    background: var(--sot-emerald-600) !important;
    color: #fff !important;
}
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--warning, [data-ui-button="warning"]) {
    border-color: var(--sot-amber-600) !important;
    background: var(--sot-amber-600) !important;
    color: #fff !important;
}
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--ghost, [data-ui-button="ghost"]) {
    border-color: transparent !important;
    background: transparent !important;
    color: var(--sot-slate-600) !important;
}
[data-hpc-ui-sot="slate-indigo-v1"] :where(.ui-button--ghost, [data-ui-button="ghost"]):hover {
    background: var(--sot-slate-100) !important;
    color: var(--sot-slate-900) !important;
}
[data-hpc-ui-sot="slate-indigo-v1"] .ui-input-wrap { position: relative; min-width: 0; }
[data-hpc-ui-sot="slate-indigo-v1"] .ui-input-prefix {
    position: absolute;
    top: 50%;
    left: .7rem;
    z-index: 1;
    color: var(--sot-slate-400);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: .78rem;
    transform: translateY(-50%);
    pointer-events: none;
}
[data-hpc-ui-sot="slate-indigo-v1"] .ui-form-control.has-prefix { padding-left: 2.15rem !important; }
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-proctoring-video-float {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 50;
    width: 150px;
    height: 110px;
    border: 2px solid rgba(255, 255, 255, .9);
    border-radius: var(--sot-radius-lg);
    background: var(--sot-slate-900);
    box-shadow: var(--sot-shadow-float);
    object-fit: cover;
    opacity: .92;
    pointer-events: none;
}
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-proctoring-warning-toast {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 9999;
    max-width: 380px;
    padding: 14px 16px;
    border: 1px solid #fbbf24;
    border-radius: var(--sot-radius-lg);
    background: var(--sot-amber-50);
    color: #78350f;
    box-shadow: var(--sot-shadow-float);
    font: 700 14px/1.55 system-ui, sans-serif;
}


/* Core UI Design System Batch 1B — final consistency contract.
 * This block intentionally loads last. It unifies visual hierarchy across
 * legacy button/table/form families without requiring page-specific CSS. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container {
    --ui-control-height: 38px;
    --ui-control-radius: 9px;
    --ui-action-gap: .4rem;
    --ui-table-head-bg: #f8fafc;
    --ui-table-head-text: #475569;
    --ui-row-border: #e2e8f0;
}

/* Page headings: predictable hierarchy, no accidental all-caps treatment. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-primary-page-heading,
    .page-title,
    .as-card-title,
    .ac-page-title,
    .hpc-core-hero h1,
    h1[data-page-title]
) {
    color: #0f172a !important;
    font-size: clamp(1.2rem, 1.45vw, 1.55rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.018em !important;
    line-height: 1.22 !important;
    text-transform: none !important;
}

/* Unified action controls. Domain-specific classes keep their behavior but
 * share dimensions, typography, focus and semantic meaning. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-button,
    .as-btn,
    .hpc-button,
    .hpc-action-button,
    .hpc-core-btn,
    .ac-btn,
    .btn
) {
    min-height: var(--ui-control-height) !important;
    border-radius: var(--ui-control-radius) !important;
    padding: .52rem .78rem !important;
    font-size: .76rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    line-height: 1.1 !important;
    text-transform: none !important;
    box-shadow: none !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-button--primary,
    .as-btn-primary,
    .hpc-button-primary,
    .hpc-action-primary,
    .hpc-core-btn-primary,
    .ac-btn-primary,
    .btn-primary,
    [data-ui-button="primary"],
    [data-action-variant="primary"]
) {
    /*
     * The accent token, not the raw indigo swatch it happens to fall back to.
     *
     * `--sot-accent` resolves tenant brand -> --app-primary -> indigo, and --app-primary is
     * always defined, so every primary button here was painting itself indigo while the
     * shell's own controls, the sidebar and the logo used the brand teal. Two accents on one
     * screen is what made the product look assembled from different applications; reading
     * the token restores a single accent and lets a tenant rebrand actually reach these
     * buttons, which hardcoding the swatch prevented.
     */
    border-color: var(--sot-accent) !important;
    background: var(--sot-accent) !important;
    color: #fff !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-button--secondary,
    .as-btn-soft,
    .as-btn-secondary,
    .hpc-button-soft,
    .hpc-button-secondary,
    .hpc-action-button:not(.hpc-action-primary):not(.hpc-action-danger),
    .hpc-core-btn-soft,
    .ac-btn-secondary,
    .btn-secondary,
    [data-ui-button="secondary"]
) {
    border-color: #cbd5e1 !important;
    background: #fff !important;
    color: #334155 !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-button--danger,
    .as-btn-danger,
    .hpc-button-danger,
    .hpc-action-danger,
    .btn-danger,
    [data-ui-button="danger"],
    [data-action-variant="danger"]
) {
    border-color: #dc2626 !important;
    background: #fff !important;
    color: #b91c1c !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-button--success,
    [data-ui-button="success"]
) {
    border-color: #059669 !important;
    background: #059669 !important;
    color: #fff !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-button--warning,
    [data-ui-button="warning"]
) {
    border-color: #d97706 !important;
    background: #fff7ed !important;
    color: #9a3412 !important;
}

/* Row actions are visually consistent across index pages. Normal row actions
 * are neutral; destructive actions stay red; one explicitly-primary action
 * may be filled. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    [data-row-actions="1"],
    .ui-row-actions,
    .row-actions,
    .as-actions,
    .ac-actions,
    .hpc-row-actions,
    .hpc-core-row-actions,
    .hpc-table-actions
) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: var(--ui-action-gap) !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    [data-row-actions="1"],
    .ui-row-actions,
    .row-actions,
    .as-actions,
    .ac-actions,
    .hpc-row-actions,
    .hpc-core-row-actions,
    .hpc-table-actions
) :where(a, button, .ui-button, .as-btn, .hpc-button, .hpc-action-button, .hpc-core-btn, .btn) {
    min-height: 34px !important;
    height: auto !important;
    padding: .42rem .62rem !important;
    border-radius: 8px !important;
    font-size: .71rem !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

/* Tables: one visual hierarchy for headers, body data and action columns. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    table.hpc-ui-table,
    table.ui-data-table,
    table.as-table,
    table.ac-table,
    .ui-table-shell table,
    .hpc-ui-table-region table
) {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    color: #334155;
    font-size: .79rem;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    table.hpc-ui-table,
    table.ui-data-table,
    table.as-table,
    table.ac-table,
    .ui-table-shell table,
    .hpc-ui-table-region table
) thead th {
    background: var(--ui-table-head-bg) !important;
    color: var(--ui-table-head-text) !important;
    font-size: .69rem !important;
    font-weight: 700 !important;
    letter-spacing: .015em !important;
    line-height: 1.25 !important;
    text-transform: none !important;
    white-space: normal !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    table.hpc-ui-table,
    table.ui-data-table,
    table.as-table,
    table.ac-table,
    .ui-table-shell table,
    .hpc-ui-table-region table
) tbody td {
    border-top-color: var(--ui-row-border) !important;
    color: #475569;
    font-weight: 450;
    line-height: 1.38;
    vertical-align: middle;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    table.hpc-ui-table,
    table.ui-data-table,
    table.as-table,
    table.ac-table,
    .ui-table-shell table,
    .hpc-ui-table-region table
) tbody td :where(strong, .font-semibold, .font-bold) {
    color: #0f172a;
    font-weight: 680 !important;
}

/* Forms and filters share dimensions and label treatment. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-field > span:first-child,
    .as-label,
    .ac-field-label,
    .hpc-ui-label,
    .form-label
) {
    color: #475569 !important;
    font-size: .74rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
    select,
    textarea,
    .as-input,
    .hpc-input,
    .hpc-combobox-button
) {
    min-height: var(--ui-control-height);
    border-color: #cbd5e1;
    border-radius: var(--ui-control-radius);
    background: #fff;
    color: #0f172a;
    font-size: .8rem;
}

/* Tabs use one active-state language across the application. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    [role="tablist"],
    .as-tabs,
    .hpc-tabs-nav,
    .hpc-detail-tabs,
    .hpc-core-tabs
) {
    gap: .25rem !important;
}

[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    [role="tab"],
    .as-tab,
    .hpc-tab-button,
    .hpc-detail-tab,
    .hpc-core-tab
) {
    min-height: 36px;
    border-radius: 8px !important;
    font-size: .75rem !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

/* Status badges remain compact and semantic; no all-caps noise. */
[data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
    .ui-status,
    .hpc-ui-badge,
    .as-badge,
    .badge,
    .hpc-status,
    .ac-status,
    [data-ui-status]
) {
    min-height: 24px;
    border-radius: 999px !important;
    padding: .25rem .55rem !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    line-height: 1.15 !important;
    text-transform: none !important;
}

@media (max-width: 760px) {
    [data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
        [data-row-actions="1"], .ui-row-actions, .row-actions, .as-actions,
        .ac-actions, .hpc-row-actions, .hpc-core-row-actions, .hpc-table-actions
    ) {
        justify-content: flex-start !important;
    }

    [data-hpc-ui-sot="slate-indigo-v1"] .hpc-page-container :where(
        .ui-button, .as-btn, .hpc-button, .hpc-action-button, .hpc-core-btn, .ac-btn, .btn
    ) {
        min-height: 40px !important;
    }
}

/* ========================================================================
   Pagination (resources/views/partials/pagination.blade.php)
   ======================================================================== */
.hpc-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    padding: .75rem 0;
}
.hpc-pagination__summary {
    margin: 0;
    color: #64748b;
    font-size: .8rem;
    font-weight: 650;
}
.hpc-pagination__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem;
}
.hpc-pagination__page,
.hpc-pagination__ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 .4rem;
    border-radius: 8px;
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
    color: #334155;
}
a.hpc-pagination__page:hover {
    background: #f1f5f9;
}
.hpc-pagination__page.is-current {
    background: #17416f;
    color: #fff;
}
.hpc-pagination__ellipsis {
    color: #94a3b8;
}
.hpc-pagination .btn.is-disabled {
    opacity: .45;
    pointer-events: none;
}
@media (max-width: 640px) {
    .hpc-pagination {
        flex-direction: column;
        align-items: stretch;
    }
    .hpc-pagination__links {
        justify-content: center;
    }
}

/* ========================================================================
   Participant command center table readability
   ======================================================================== */
[data-participant-readiness-command-center="1"] .as-table th,
[data-participant-readiness-command-center="1"] .as-table td {
    vertical-align: top;
    white-space: normal;
}
[data-participant-readiness-command-center="1"] .as-table td:nth-child(2) {
    min-width: 190px;
}
[data-participant-readiness-command-center="1"] .as-table td:nth-child(2) .as-helper {
    overflow-wrap: anywhere;
}
[data-participant-readiness-command-center="1"] .people-position-editor {
    min-width: 12rem;
    grid-template-columns: minmax(8rem, 1fr) auto;
}
[data-participant-readiness-command-center="1"] .ui-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    justify-content: flex-end;
}

/* =========================================================================
 * Searchable select (.hpc-combobox) — presentation pass
 *
 * The base rules live minified inside app.css; this layer loads last and is
 * where the maintained appearance is expressed. Fixed here:
 *   - teal accent (#eaf7fc/#1676a0) replaced with the slate/indigo the rest of
 *     the admin UI uses, so the control stops reading as a foreign widget;
 *   - pills truncate instead of wrapping a whole "Name · CODE · email" label
 *     onto its own row and ballooning the closed control;
 *   - the dropdown arrow is visible and rotates, so the field reads as a
 *     dropdown rather than a plain box;
 *   - disabled controls look disabled;
 *   - keyboard focus is visible on the button, the pills' remove buttons and
 *     the options themselves.
 * ========================================================================= */

.hpc-combobox { position: relative; min-width: 0; }

.hpc-combobox-button {
    width: 100%;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .45rem .6rem;
    border: 1px solid #cbd5e1;
    border-radius: .7rem;
    background: #fff;
    color: #0f172a;
    font-size: .82rem;
    font-weight: 600;
    text-align: left;
    transition: border-color .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.hpc-combobox-button:hover:not(:disabled) { border-color: #a5b4fc; background: #fcfdff; }
.hpc-combobox-button:focus-visible { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .18); }
.hpc-combobox.open > .hpc-combobox-button { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .18); }

/* Placeholder must not read as a chosen value. */
.hpc-combobox-value { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; min-width: 0; max-width: 100%; overflow: hidden; }
.hpc-combobox-value.is-placeholder { color: #94a3b8; font-weight: 500; }

/* Arrow: visible, and it points the way the panel will go. */
.hpc-combobox-arrow {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 1.1rem;
    height: 1.1rem;
    color: #64748b;
    font-size: .85rem;
    line-height: 1;
    transition: transform .15s ease, color .12s ease;
}
.hpc-combobox.open > .hpc-combobox-button .hpc-combobox-arrow { transform: rotate(180deg); color: #4338ca; }

/* Pills: one line each, truncated, never the tallest thing on the form. */
.hpc-combobox .hpc-pill {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    max-width: 15rem;
    padding: .2rem .3rem .2rem .5rem;
    border: 1px solid #c7d2fe;
    border-radius: 999px;
    background: #eef2ff;
    color: #3730a3;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1.4;
}
.hpc-combobox .hpc-pill > span:first-child {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.hpc-combobox .hpc-pill--count { padding-inline: .5rem; border-style: dashed; background: #f8fafc; border-color: #cbd5e1; color: #475569; }

.hpc-combobox-pill-remove {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 1.05rem;
    height: 1.05rem;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #4f46e5;
    font-size: .85rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}
.hpc-combobox-pill-remove:hover:not(:disabled) { background: #4338ca; color: #fff; }
.hpc-combobox-pill-remove:focus-visible { outline: 2px solid #4338ca; outline-offset: 1px; }
.hpc-combobox-pill-remove:disabled { cursor: not-allowed; opacity: .45; }

/* Panel */
.hpc-combobox-panel {
    position: absolute;
    z-index: 90;
    left: 0; right: 0;
    top: calc(100% + .3rem);
    display: none;
    padding: .45rem;
    border: 1px solid #e2e8f0;
    border-radius: .8rem;
    background: #fff;
    box-shadow: 0 16px 40px rgba(15, 23, 42, .16);
}
.hpc-combobox.open .hpc-combobox-panel { display: block; }
.hpc-combobox.is-align-up .hpc-combobox-panel {
    top: auto;
    bottom: calc(100% + .3rem);
}

.hpc-combobox-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .1rem .3rem .4rem;
    border-bottom: 1px solid #f1f5f9;
    margin-bottom: .4rem;
}
.hpc-combobox-head-count { color: #475569; font-size: .7rem; font-weight: 700; }
.hpc-combobox-clear {
    border: 0;
    padding: .1rem .3rem;
    border-radius: .35rem;
    background: transparent;
    color: #4338ca;
    font-size: .7rem;
    font-weight: 700;
    cursor: pointer;
}
.hpc-combobox-clear:hover { background: #eef2ff; }
.hpc-combobox-clear:focus-visible { outline: 2px solid #4338ca; outline-offset: 1px; }

.hpc-combobox-search {
    width: 100%;
    min-height: 36px;
    margin-bottom: .4rem;
    padding: .4rem .55rem;
    border: 1px solid #cbd5e1;
    border-radius: .55rem;
    font-size: .8rem;
    font-weight: 600;
}
.hpc-combobox-search:focus-visible { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, .15); }

.hpc-combobox-options { display: grid; gap: .1rem; max-height: 17rem; overflow: auto; }
.hpc-combobox-option {
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .42rem .5rem;
    border: 0;
    border-radius: .45rem;
    background: transparent;
    color: #334155;
    font-size: .78rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}
.hpc-combobox-option:hover:not(.is-disabled) { background: #f1f5f9; }
.hpc-combobox-option.is-selected { background: #eef2ff; color: #3730a3; font-weight: 700; }
.hpc-combobox-option.is-selected:hover { background: #e0e7ff; }
.hpc-combobox-option:focus-visible { outline: 2px solid #4338ca; outline-offset: -2px; }
.hpc-combobox-option.is-disabled,
.hpc-combobox-option:disabled { color: #94a3b8; cursor: not-allowed; text-decoration: line-through; }

/* The tick column keeps labels aligned whether or not a row is selected. */
.hpc-combobox-option-marker {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 1rem;
    height: 1rem;
    border-radius: .25rem;
    color: #4338ca;
    font-size: .7rem;
    font-weight: 700;
}
.hpc-combobox.is-multiple .hpc-combobox-option-marker { border: 1px solid #cbd5e1; background: #fff; }
.hpc-combobox.is-multiple .hpc-combobox-option.is-selected .hpc-combobox-option-marker { border-color: #4338ca; background: #4338ca; color: #fff; }
.hpc-combobox-option-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Disabled control reads as locked. */
.hpc-combobox.is-disabled > .hpc-combobox-button,
.hpc-combobox-button:disabled { background: #f1f5f9; border-color: #e2e8f0; color: #94a3b8; cursor: not-allowed; }
.hpc-combobox.is-disabled .hpc-pill { border-color: #e2e8f0; background: #f8fafc; color: #64748b; }

/* On small screens the panel docks to the bottom instead of overflowing the page. */
@media (max-width: 760px) {
    .hpc-combobox .hpc-pill { max-width: 100%; }
    .hpc-combobox-panel { position: fixed; left: .75rem; right: .75rem; top: auto; bottom: .75rem; max-height: 60vh; overflow: auto; }
}

/* The option rows and the clear-all control are <button> elements, so they inherit the global
 * `.hpc-page-container button:not(...)` chrome — a 40px min-height, a border, a pill radius and
 * a drop shadow. That is right for real buttons and wrong for list rows: it made every option
 * 40px tall, so a picker showed ~11 of 300 candidates per screen and the panel ran off the page.
 * That rule scores (0,5,1), so these need !important to land; the scope is deliberately narrow.
 */
.hpc-combobox-options .hpc-combobox-option {
    min-height: 0 !important;
    padding: .34rem .45rem !important;
    border: 0 !important;
    border-radius: .4rem !important;
    box-shadow: none !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    justify-content: flex-start !important;
}
.hpc-combobox-options .hpc-combobox-option.is-selected { font-weight: 700 !important; }

.hpc-combobox-head .hpc-combobox-clear {
    min-height: 0 !important;
    padding: .15rem .4rem !important;
    border: 0 !important;
    border-radius: .35rem !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #4338ca !important;
    font-size: .7rem !important;
    font-weight: 700 !important;
}
.hpc-combobox-head .hpc-combobox-clear:hover { background: #eef2ff !important; }

/* Keep the list a predictable height so the panel cannot outgrow the viewport. */
.hpc-combobox .hpc-combobox-options { max-height: 15rem !important; }
.hpc-combobox .hpc-combobox-panel { max-height: min(24rem, 70vh); overflow: auto; }

/* ========================================================================
   Audit error queue: stable reading widths and plain institution attribution
   ======================================================================== */
.hpc-page-container .hpc-error-table[data-audit-error-table] {
    table-layout: fixed !important;
    width: 1770px !important;
    min-width: 1770px !important;
}

.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(1),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(1) { width: 100px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(2),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(2) { width: 110px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(3),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(3) { width: 90px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(4),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(4) { width: 170px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(5),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(5) {
    width: 420px !important;
    min-width: 420px !important;
    max-width: 420px !important;
}
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(6),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(6) { width: 220px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(7),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(7) { width: 230px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(8),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(8) { width: 210px !important; }
.hpc-page-container .hpc-error-table[data-audit-error-table] th:nth-child(9),
.hpc-page-container .hpc-error-table[data-audit-error-table] td:nth-child(9) { width: 220px !important; }

.hpc-page-container .hpc-error-table[data-audit-error-table] .hpc-error-message-cell a {
    -webkit-line-clamp: 4;
    line-height: 1.48;
    overflow-wrap: anywhere;
    word-break: normal;
}

.hpc-page-container .hpc-error-table[data-audit-error-table] .hpc-error-message-cell small {
    overflow-wrap: anywhere;
    word-break: normal;
}

.hpc-page-container .hpc-error-table[data-audit-error-table] .hpc-error-meta-cell {
    overflow-wrap: anywhere;
    word-break: normal;
}

/* Compact institution attribution is metadata in index tables, not a status.
   Render it as calm stacked text instead of a pill/badge that competes with
   status and severity badges. */
.hpc-page-container .hpc-ui-table .ui-institution-attribution.is-compact {
    display: grid !important;
    align-items: start !important;
    justify-items: start !important;
    gap: .14rem !important;
    width: 100%;
    max-width: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    color: #334155 !important;
    font-size: .72rem !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.hpc-page-container .hpc-ui-table .ui-institution-attribution.is-compact .ui-institution-attribution__name {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: normal;
}

.hpc-page-container .hpc-ui-table .ui-institution-attribution.is-compact .ui-institution-attribution__code {
    display: block;
    border-left: 0 !important;
    padding-left: 0 !important;
    color: #64748b !important;
    font-size: .66rem !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
    white-space: nowrap;
}

/* ========================================================================
   Participant operations table — compact, readable, role-operational layout
   ======================================================================== */
[data-participant-operations-table="1"] {
    width: 100%;
    min-width: 1240px;
    table-layout: fixed;
    font-size: .79rem;
    line-height: 1.42;
}
[data-participant-operations-table="1"] col.participant-col-select { width: 3.5%; }
[data-participant-operations-table="1"] col.participant-col-person { width: 23%; }
[data-participant-operations-table="1"] col.participant-col-readiness { width: 16%; }
[data-participant-operations-table="1"] col.participant-col-position { width: 12.5%; }
[data-participant-operations-table="1"] col.participant-col-target { width: 13.5%; }
[data-participant-operations-table="1"] col.participant-col-status { width: 7%; }
[data-participant-operations-table="1"] col.participant-col-actions { width: 24.5%; }

[data-participant-operations-table="1"] th,
[data-participant-operations-table="1"] td {
    vertical-align: top;
    white-space: normal;
    overflow-wrap: anywhere;
}
[data-participant-operations-table="1"] thead th {
    padding: .7rem .65rem;
    background: #f8fafc;
    color: #334155;
    border-bottom: 1px solid #cbd5e1;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .01em;
}
[data-participant-operations-table="1"] tbody td {
    padding: .8rem .65rem;
    border-bottom: 1px solid #e2e8f0;
    color: #1e293b;
}
[data-participant-operations-table="1"] tbody tr:hover td { background: #fbfdff; }
[data-participant-operations-table="1"] tbody tr.is-selected td { background: #f5f7ff; }

.participant-select-cell {
    text-align: center;
    vertical-align: middle !important;
}
.participant-select-cell input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin-top: .1rem;
}
.participant-identity-cell { min-width: 0; }
.participant-identity-cell__name {
    display: block;
    color: #0f2f52;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
}
.participant-identity-cell__name:hover { text-decoration: underline; }
.participant-identity-cell__meta,
.participant-identity-cell__counts {
    display: block;
    margin-top: .15rem;
    color: #64748b;
    font-size: .72rem;
    line-height: 1.35;
}
.participant-identity-cell__email,
.participant-identity-cell__groups {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.participant-identity-cell__counts {
    margin-top: .28rem;
    color: #475569;
    font-weight: 650;
}

.participant-readiness-cell { min-width: 0; }
.participant-readiness-state,
.participant-status-indicator {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: #334155;
    font-size: .74rem;
    font-weight: 700;
    line-height: 1.25;
}
.participant-state-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #94a3b8;
}
.participant-readiness-state.is-ready .participant-state-dot,
.participant-status-indicator.is-active .participant-state-dot { background: #16a34a; }
.participant-readiness-state.is-attention .participant-state-dot { background: #d97706; }
.participant-readiness-state.is-blocked .participant-state-dot { background: #dc2626; }
.participant-status-indicator.is-inactive .participant-state-dot { background: #94a3b8; }
.participant-readiness-cell__help,
.participant-readiness-cell__more {
    display: block;
    margin-top: .3rem;
    color: #64748b;
    font-size: .7rem;
    line-height: 1.35;
}
.participant-readiness-list {
    margin: .38rem 0 0;
    padding-left: 1rem;
    color: #475569;
    font-size: .72rem;
    line-height: 1.35;
}
.participant-readiness-list li + li { margin-top: .16rem; }
.participant-readiness-cell__more { font-weight: 700; }

.participant-position-cell,
.participant-target-cell {
    color: #334155;
    font-size: .76rem;
    line-height: 1.4;
}
.participant-target-display {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .38rem;
}
.participant-inline-action {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: .25rem .48rem;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    color: #334155;
    font-size: .7rem;
    font-weight: 700;
}
.participant-inline-action:hover { background: #f8fafc; border-color: #94a3b8; }
.participant-target-editor { min-width: 0 !important; grid-template-columns: 1fr !important; }
.participant-target-editor__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem;
    margin-top: .35rem;
}

.participant-status-cell { white-space: nowrap !important; }
.participant-actions-cell {
    min-width: 0 !important;
    overflow: visible !important;
    padding-right: .85rem !important;
    vertical-align: middle !important;
}
.participant-row-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .35rem !important;
    min-width: 0 !important;
    width: 100%;
    justify-content: stretch !important;
}
.participant-row-actions > form { display: contents !important; }
.participant-row-actions .as-btn,
.participant-row-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: 31px !important;
    height: auto !important;
    justify-content: center;
    padding: .34rem .45rem !important;
    font-size: .7rem !important;
    line-height: 1.2;
    white-space: normal;
    text-align: center;
}
.participant-table-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-top: 0;
}

@media (max-width: 1180px) {
    [data-participant-operations-table="1"] { min-width: 1240px; }
}
@media (max-width: 720px) {
    [data-participant-operations-table="1"] { min-width: 1180px; }
    .participant-identity-cell__email,
    .participant-identity-cell__groups { white-space: normal; }
}

/* ========================================================================
   Residual role-workspace convergence — operational directories and queues
   ======================================================================== */
[data-institution-access-workspace="1"] .hpc-core-panel,
[data-institution-access-workspace="1"] .hpc-core-table-wrap {
    overflow: visible;
}
[data-institution-access-workspace="1"] .hpc-core-table { min-width: 760px; }
[data-institution-access-workspace="1"] .hpc-row-action-menu { z-index: 30; }
[data-institution-access-workspace="1"] .hpc-row-action-menu__panel { z-index: 140; }
.institution-access-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .65rem;
}
.institution-access-summary > div {
    display: grid;
    gap: .15rem;
    min-width: 0;
    padding: .75rem .9rem;
    border: 1px solid var(--hpc-border, #dce5ef);
    border-radius: 14px;
    background: var(--hpc-surface, #fff);
}
.institution-access-summary span {
    color: var(--hpc-text-muted, #667085);
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.institution-access-summary strong { font-size: 1.25rem; line-height: 1.05; color: var(--hpc-text-strong, #101828); }
.institution-access-summary small { color: var(--hpc-text-muted, #667085); font-size: .72rem; line-height: 1.35; }
.institution-access-context { display: flex; gap: .35rem; align-items: baseline; margin-top: .3rem; }
.institution-access-context span { color: var(--hpc-text-muted, #667085); }
.institution-access-context strong { color: var(--hpc-text-strong, #344054); font-weight: 700; }
.institution-access-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1rem;
    border-top: 1px solid var(--hpc-border, #e4e7ec);
    background: #fbfcfe;
}
.institution-access-pagination__summary { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; color: var(--hpc-text-muted, #667085); font-size: .74rem; }
.institution-access-pagination__summary strong { color: var(--hpc-text-strong, #344054); }
.institution-access-pagination__controls { display: inline-flex; align-items: center; gap: .25rem; }
.institution-access-pagination__controls button {
    min-width: 34px;
    min-height: 34px;
    padding: .35rem .55rem;
    border: 1px solid var(--hpc-border, #d0d5dd);
    border-radius: 9px;
    background: #fff;
    color: var(--hpc-text-strong, #344054);
    font-size: .72rem;
    font-weight: 700;
}
.institution-access-pagination__controls button:hover:not(:disabled),
.institution-access-pagination__controls button.is-current { border-color: var(--tenant-primary, #1c8fbd); color: var(--tenant-primary, #1c8fbd); background: color-mix(in srgb, var(--tenant-primary, #1c8fbd) 8%, #fff); }
.institution-access-pagination__controls button:disabled { opacity: .45; cursor: not-allowed; }

/*
 * Each figure is a label, a number and a qualifier on three lines.
 *
 * Only the --compact variant was ever styled, and it set the card but not its contents, so
 * the three were left as bare inline elements and rendered as one run of text: "Populasi
 * terfilter882882 aktif dari hasil filter", "Dipilih0Maksimum 2.000 peserta". Stacking them
 * belongs on the base class so both variants read correctly.
 */
.participant-command-summary > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .15rem;
}
.participant-command-summary > div > span { font-size: .75rem; font-weight: 700; color: #5c7189; }
.participant-command-summary > div > strong { font-size: 1.35rem; font-weight: 700; line-height: 1.1; }
.participant-command-summary > div > small { font-size: .72rem; color: #7c8ea1; line-height: 1.35; }

.participant-command-summary--compact {
    display: grid;
    grid-template-columns: minmax(11rem, .75fr) minmax(11rem, .75fr) minmax(18rem, 2fr);
    align-items: stretch;
    gap: .65rem;
}
.participant-command-summary--compact > div {
    min-height: 86px;
    padding: .72rem .85rem;
    border-radius: 14px;
}
.participant-command-summary--compact > p {
    display: flex;
    align-items: center;
    margin: 0;
    padding: .75rem .9rem;
    border: 1px dashed var(--hpc-border, #d0d5dd);
    border-radius: 14px;
    background: #fbfcfe;
    color: var(--hpc-text-muted, #667085);
    font-size: .76rem;
    line-height: 1.5;
}
.participant-row-actions > .hpc-row-action,
.assessment-staff-index [data-row-actions="1"] > .hpc-row-action,
[data-institution-access-workspace="1"] [data-row-actions="1"] > .hpc-row-action {
    min-width: 0 !important;
    padding-inline: .68rem !important;
}
.participant-row-actions .hpc-row-action-menu__trigger,
.assessment-staff-index .hpc-row-action-menu__trigger,
[data-institution-access-workspace="1"] .hpc-row-action-menu__trigger {
    min-width: 0 !important;
    padding-inline: .68rem !important;
}
.assessment-staff-index__table .as-table th,
.assessment-staff-index__table .as-table td { vertical-align: top; }
.assessment-staff-index__table .as-table tbody tr:hover td { background: #fbfdff; }
.assessment-staff-index__table .as-helper { line-height: 1.35; }
.assessment-staff-index .institution-access-status-stack .as-status { font-size: .67rem; }

.assessor-assignment-directory { display: grid; gap: 1rem; }
.assessor-assignment-directory__summary .professional-workspace-intro__stats { grid-template-columns: repeat(3, minmax(8rem, 1fr)); }
.assessor-assignment-directory__workflow-note { display: flex; flex-wrap: wrap; gap: .35rem .65rem; align-items: center; }
.assessor-session-groups { display: grid; gap: 1rem; }
.assessor-session-group { overflow: hidden; padding: 0; }
.assessor-session-group__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--hpc-border, #e4e7ec);
    background: #fbfcfe;
}
.assessor-session-group__header h2 { margin: .1rem 0; font-size: 1.05rem; }
.assessor-session-group__header p { margin: 0; color: var(--hpc-text-muted, #667085); font-size: .74rem; }
.assessor-stage-groups { display: grid; gap: .8rem; padding: .9rem; }
.assessor-stage-group { border: 1px solid var(--hpc-border, #e4e7ec); border-radius: 14px; overflow: hidden; }
.assessor-stage-group__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .72rem .85rem;
    background: #f8fafc;
    border-bottom: 1px solid var(--hpc-border, #e4e7ec);
}
.assessor-stage-group__header > div { display: grid; gap: .12rem; }
.assessor-stage-group__header strong { color: var(--hpc-text-strong, #101828); }
.assessor-stage-group__header span:not(.adw-badge) { color: var(--hpc-text-muted, #667085); font-size: .7rem; }
.assessor-stage-participant-list { display: grid; }
.assessor-stage-participant-row {
    display: grid;
    grid-template-columns: 38px minmax(14rem, 1.25fr) minmax(12rem, 1fr) auto;
    gap: .75rem;
    align-items: center;
    padding: .72rem .85rem;
    border-bottom: 1px solid #eef2f6;
}
.assessor-stage-participant-row:last-child { border-bottom: 0; }
.assessor-stage-participant-row:hover { background: #fbfdff; }
.assessor-stage-participant-row__identity,
.assessor-stage-participant-row__workflow { display: grid; gap: .18rem; min-width: 0; }
.assessor-stage-participant-row__identity strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assessor-stage-participant-row__identity span,
.assessor-stage-participant-row__workflow small { color: var(--hpc-text-muted, #667085); font-size: .7rem; }
.assessor-stage-participant-row__workflow { justify-items: start; }
.assessor-stage-participant-row__actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: .4rem; white-space: nowrap; }
.assessor-assignment-directory__pagination { min-width: 0; }
.assessor-unqueued-work { padding: 1rem; }
.assessor-unqueued-work__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.assessor-unqueued-work__head h2 { margin: .2rem 0 .35rem; }
.assessor-unqueued-work__head p { margin: 0; max-width: 70rem; color: var(--hpc-text-muted, #667085); }
.assessor-unqueued-work__list { display: grid; margin-top: .85rem; border: 1px solid var(--hpc-border, #e4e7ec); border-radius: 12px; overflow: hidden; }
.assessor-unqueued-work__list article { display: grid; grid-template-columns: minmax(14rem, 1fr) auto auto; align-items: center; gap: .75rem; padding: .7rem .8rem; border-bottom: 1px solid #eef2f6; }
.assessor-unqueued-work__list article:last-child { border-bottom: 0; }
.assessor-unqueued-work__list article > div { display: grid; gap: .16rem; }
.assessor-unqueued-work__list article span:not(.adw-badge) { color: var(--hpc-text-muted, #667085); font-size: .72rem; }

@media (max-width: 1100px) {
    .institution-access-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .participant-command-summary--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .participant-command-summary--compact > p { grid-column: 1 / -1; }
    .assessor-stage-participant-row { grid-template-columns: 38px minmax(12rem, 1fr) minmax(10rem, 1fr); }
    .assessor-stage-participant-row__actions { grid-column: 2 / -1; justify-content: flex-start; }
}
@media (max-width: 760px) {
    .institution-access-summary { grid-template-columns: 1fr; }
    .institution-access-pagination { align-items: flex-start; flex-direction: column; }
    .institution-access-pagination__controls { flex-wrap: wrap; }
    .participant-command-summary--compact { grid-template-columns: 1fr; }
    .participant-command-summary--compact > p { grid-column: auto; }
    .assessor-session-group__header,
    .assessor-unqueued-work__head { align-items: flex-start; flex-direction: column; }
    .assessor-stage-participant-row { grid-template-columns: 38px minmax(0, 1fr); }
    .assessor-stage-participant-row__workflow,
    .assessor-stage-participant-row__actions { grid-column: 2; }
    .assessor-stage-participant-row__actions { flex-wrap: wrap; }
    .assessor-unqueued-work__list article { grid-template-columns: 1fr; align-items: start; }
}

/* Institution account directory — compact, readable, viewport-safe actions. */
[data-institution-access-workspace="1"] .institution-access-status-stack { gap: .28rem; }
[data-institution-access-workspace="1"] .institution-access-status-stack .hpc-core-status {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    min-height: 24px;
    padding: .22rem .48rem;
    font-size: .68rem;
    line-height: 1.15;
    white-space: nowrap;
}
[data-institution-access-workspace="1"] .institution-access-status-stack .hpc-core-status span { opacity: .78; font-weight: 700; }
[data-institution-access-workspace="1"] .institution-access-status-stack .hpc-core-status strong { font-weight: 700; }
[data-institution-access-workspace="1"] .hpc-core-actions-cell { min-width: 10.5rem; }
[data-institution-access-workspace="1"] .hpc-core-row-actions--compact { justify-content: flex-end; gap: .35rem; flex-wrap: nowrap; }
.institution-access-pagination--top {
    border-top: 0;
    border-bottom: 1px solid var(--hpc-border, #e4e7ec);
    padding-block: .55rem;
    background: #fff;
}
.institution-access-pagination__controls--compact button { min-width: 32px; padding-inline: .45rem; font-size: 1rem; }
[data-institution-access-workspace="1"] .hpc-row-action-menu__panel.is-viewport-positioned { z-index: 520 !important; }

/* ---------------------------------------------------------------------------
 * Page guide — on-demand orientation for menu landing pages and authoring pages.
 *
 * Guidance stays available to low-literacy users without occupying the first
 * viewport. A visible information button opens a readable dialog containing the
 * same "Apa ini / Untuk apa / Terkait dengan" copy and authorized related links.
 * ------------------------------------------------------------------------ */
.ui-page-guide--launcher {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: 2.15rem;
    margin: 0 0 .42rem;
}
.ui-page-guide__trigger {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border: 1px solid color-mix(in srgb, var(--ui-primary, #147fa9) 35%, var(--hpc-border, #dbe4ea));
    border-radius: 999px;
    background: color-mix(in srgb, var(--ui-primary-soft, #eef7fb) 72%, #fff);
    color: var(--ui-primary, #147fa9);
    font: 850 .88rem/1 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease;
}
.ui-page-guide__trigger:hover {
    border-color: var(--ui-primary, #147fa9);
    background: color-mix(in srgb, var(--ui-primary-soft, #eef7fb) 90%, #fff);
    box-shadow: 0 4px 12px rgba(15, 23, 42, .08);
    transform: translateY(-1px);
}
.ui-page-guide__trigger:focus-visible,
.ui-page-guide-dialog__close:focus-visible,
.ui-page-guide__related a:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--ui-primary, #147fa9) 28%, transparent);
    outline-offset: 2px;
}
.ui-page-guide__trigger[aria-expanded="true"] {
    border-color: var(--ui-primary, #147fa9);
    background: var(--ui-primary, #147fa9);
    color: #fff;
}
.ui-page-guide-dialog {
    width: min(42rem, calc(100vw - 2rem));
    max-width: none;
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--hpc-border, #dbe4ea);
    border-radius: 14px;
    background: #fff;
    color: #173047;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .26);
}
.ui-page-guide-dialog::backdrop {
    background: rgba(15, 23, 42, .52);
    backdrop-filter: blur(2px);
}
.ui-page-guide-dialog[open] {
    display: block;
}
.ui-page-guide-dialog__panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    max-height: calc(100dvh - 2rem);
    background: #fff;
}
.ui-page-guide-dialog__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.05rem .9rem;
    border-bottom: 1px solid var(--hpc-border, #dbe4ea);
    background: color-mix(in srgb, var(--ui-primary-soft, #eef7fb) 58%, #fff);
}
.ui-page-guide-dialog__heading {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-width: 0;
}
.ui-page-guide-dialog__icon {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border-radius: 999px;
    background: var(--ui-primary, #147fa9);
    color: #fff;
    font-size: .88rem;
    font-weight: 700;
    line-height: 1;
}
.ui-page-guide-dialog__eyebrow {
    display: block;
    margin: 0 0 .12rem;
    color: var(--ui-primary, #147fa9);
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: 1.15;
    text-transform: uppercase;
}
.ui-page-guide-dialog__header h2 {
    margin: 0;
    color: #102840;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
}
.ui-page-guide-dialog__close {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 2rem;
    border: 1px solid var(--hpc-border, #dbe4ea);
    border-radius: 9px;
    background: #fff;
    color: #526780;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
}
.ui-page-guide-dialog__close:hover {
    border-color: color-mix(in srgb, var(--ui-primary, #147fa9) 40%, var(--hpc-border, #dbe4ea));
    color: var(--ui-primary, #147fa9);
}
.ui-page-guide-dialog__body {
    display: grid;
    gap: .7rem;
    padding: 1rem 1.05rem 1.1rem;
    overflow: auto;
    overscroll-behavior: contain;
}
.ui-page-guide__item {
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--hpc-border, #dbe4ea) 88%, transparent);
    border-radius: 10px;
    background: #fff;
    padding: .75rem .8rem;
}
.ui-page-guide__label {
    display: block;
    margin: 0 0 .22rem;
    color: var(--ui-primary, #147fa9);
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .05em;
    line-height: 1.2;
    text-transform: uppercase;
}
.ui-page-guide__text,
.ui-page-guide__what,
.ui-page-guide__links {
    margin: 0;
    color: #40586c;
    font-size: .8rem;
    font-weight: 580;
    line-height: 1.52;
}
.ui-page-guide__related {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .55rem;
}
.ui-page-guide__related a {
    display: inline-flex;
    align-items: center;
    min-height: 1.75rem;
    border: 1px solid var(--hpc-border, #dbe4ea);
    border-radius: 999px;
    background: #fff;
    padding: .22rem .58rem;
    color: #31546b;
    font-size: .7rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
}
.ui-page-guide__related a:hover,
.ui-page-guide__related a:focus-visible {
    border-color: color-mix(in srgb, var(--ui-primary, #147fa9) 45%, var(--hpc-border, #dbe4ea));
    color: var(--ui-primary, #147fa9);
}
@media (max-width: 640px) {
    .ui-page-guide--launcher {
        min-height: 2rem;
        margin-bottom: .3rem;
    }
    .ui-page-guide__trigger {
        width: 2.15rem;
        height: 2.15rem;
        flex-basis: 2.15rem;
    }
    .ui-page-guide-dialog {
        width: calc(100vw - 1rem);
        max-height: calc(100dvh - 1rem);
        border-radius: 12px;
    }
    .ui-page-guide-dialog__panel {
        max-height: calc(100dvh - 1rem);
    }
    .ui-page-guide-dialog__header {
        padding: .85rem;
    }
    .ui-page-guide-dialog__body {
        gap: .55rem;
        padding: .75rem .85rem .9rem;
    }
    .ui-page-guide__item {
        padding: .7rem .72rem;
    }
    .ui-page-guide__text,
    .ui-page-guide__what,
    .ui-page-guide__links {
        font-size: .79rem;
        line-height: 1.5;
    }
}

/* Page-guide launcher belongs to the page content title, never the global navbar. */
/* Page guide overlays never participate in page-root/grid normalization. */
[data-hpc-overlay-root] {
    display: contents;
}

/* The launcher is a phrasing element and is moved inside the real content heading. */
.ui-page-guide-title-host > .ui-page-guide--launcher {
    display: inline-flex;
    align-items: center;
    min-height: 0;
    margin: 0 0 0 .45rem;
    vertical-align: .08em;
}
.ui-page-guide-title-host > .ui-page-guide--launcher .ui-page-guide__trigger {
    width: 1.75rem;
    height: 1.75rem;
    flex-basis: 1.75rem;
    border-color: color-mix(in srgb, var(--ui-primary, #147fa9) 30%, var(--hpc-border, #dbe4ea));
    background: #fff;
    font-size: .76rem;
    box-shadow: none;
}
.ui-page-guide-title-host > .ui-page-guide--launcher .ui-page-guide__trigger:hover {
    background: color-mix(in srgb, var(--ui-primary-soft, #eef7fb) 86%, #fff);
}
@media (max-width: 640px) {
    .ui-page-guide-title-host > .ui-page-guide--launcher .ui-page-guide__trigger {
        width: 1.85rem;
        height: 1.85rem;
        flex-basis: 1.85rem;
    }
}

/* ========================================================================
   Canonical page-header and action hierarchy
   ======================================================================== */
.ui-page-header-component {
    display: grid;
    /* The actions/notice column must not use a bare `auto` track: its max-content
       contribution is computed as if its text never wrapped, which can blow past
       the column's own rendered max-width (long lifecycle-lock notices do this)
       and force the title column to 0 — collapsing the heading into a one-letter-
       per-line vertical column. Mirror the actions slot's own max-width here so
       the grid track can never claim more than that. */
    grid-template-columns: minmax(0, 1fr) minmax(0, min(100%, 42rem));
    align-items: center;
    gap: .9rem 1rem;
}
.ui-page-header-main { min-width: 0; }
.ui-page-header-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem .65rem;
    min-width: 0;
}
.ui-page-header-title-row > .ui-primary-page-heading { min-width: 0; }
.ui-page-header-meta {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
    color: var(--ui-text-muted, #62758a);
    font-size: .76rem;
    font-weight: 700;
}
.ui-page-header-actions[data-page-header-actions] {
    align-self: center;
    max-width: min(100%, 42rem);
}
.ui-page-header-actions[data-page-header-actions] > :where(.btn-primary, .ui-button-primary, [data-action-variant="primary"]) {
    order: 20;
}
.ui-page-header-actions[data-page-header-actions] > :where(.btn-danger, [data-action-variant="danger"]) {
    order: 30;
}
.ui-page-header-actions[data-page-header-actions] > :where(.btn-secondary, .ui-button-secondary, a:not(.btn-primary):not(.btn-danger), button:not(.btn-primary):not(.btn-danger)) {
    order: 10;
}
.ui-page-header-component .ui-page-guide--launcher {
    margin: 0;
    transform: none;
}
.ui-page-header-component .ui-page-guide__trigger {
    width: 1.75rem;
    height: 1.75rem;
    flex-basis: 1.75rem;
}

@media (max-width: 900px) {
    .ui-page-header-component {
        grid-template-columns: 1fr;
        align-items: start;
    }
    .ui-page-header-actions[data-page-header-actions] {
        width: 100%;
        justify-content: flex-start !important;
    }
}
@media (max-width: 560px) {
    .ui-page-header-actions[data-page-header-actions] > :where(a, button) {
        flex: 1 1 auto;
        justify-content: center;
    }
}

/* ========================================================================
   Canonical index surfaces: filters -> result context -> table -> pagination
   ======================================================================== */
.ui-filter-bar--canonical {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end !important;
    gap: .7rem .85rem !important;
    padding: .72rem .78rem !important;
    border: 1px solid var(--sot-border, #dbe4ea) !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .025) !important;
}
.ui-filter-bar__fields {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: .62rem .7rem;
    min-width: 0;
}
.ui-filter-bar__fields > :where(label, .ui-form-field, .adw-field, .as-field) {
    display: grid;
    grid-column: span 2;
    gap: .28rem;
    min-width: 0;
    margin: 0;
    color: var(--sot-slate-700, #334155);
    font-size: .72rem;
    font-weight: 700;
    line-height: 1.25;
}
.ui-filter-bar__fields > :where(.is-wide, .adw-field--wide, [data-filter-width="wide"]) { grid-column: span 4; }
.ui-filter-bar__fields > :where(.is-medium, [data-filter-width="medium"]) { grid-column: span 3; }
.ui-filter-bar__fields > :where(.is-narrow, [data-filter-width="narrow"]) { grid-column: span 1; }
.ui-filter-bar__fields :where(input, select) { width: 100%; min-width: 0; }
.ui-filter-bar__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
    min-width: max-content;
}
.ui-index-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .45rem .75rem;
    min-height: 2rem;
    color: var(--sot-muted, #64748b);
    font-size: .74rem;
    line-height: 1.4;
}
.ui-index-summary__copy,
.ui-index-summary__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .42rem;
}
.ui-index-summary strong { color: var(--sot-text, #0f172a); font-weight: 700; }
.ui-table-shell {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    border: 1px solid var(--sot-border, #dbe4ea) !important;
    border-radius: 12px !important;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .025) !important;
    scrollbar-gutter: stable;
}
.ui-table-shell > table { min-width: 48rem; margin: 0; }
.ui-table-shell--sticky > table > thead > tr > th { position: sticky; top: 0; z-index: 2; }
.ui-table-shell table :where(th, td)[data-align="actions"],
.ui-table-shell table :where(th, td).is-actions {
    width: 1%;
    min-width: 8.5rem;
    text-align: right !important;
    white-space: nowrap;
}
.ui-pagination-shell {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: 2.25rem;
    margin-top: .15rem;
}
.ui-pagination-shell nav { max-width: 100%; }
.ui-pagination-shell :where(.relative.inline-flex, .inline-flex) { flex-wrap: wrap; }
@media (max-width: 1180px) {
    .ui-filter-bar__fields > :where(label, .ui-form-field, .adw-field, .as-field) { grid-column: span 3; }
    .ui-filter-bar__fields > :where(.is-wide, .adw-field--wide, [data-filter-width="wide"]) { grid-column: span 6; }
}
@media (max-width: 860px) {
    .ui-filter-bar--canonical { grid-template-columns: 1fr; }
    .ui-filter-bar__actions { justify-content: flex-start; min-width: 0; }
    .ui-filter-bar__fields > :where(label, .ui-form-field, .adw-field, .as-field) { grid-column: span 6; }
    .ui-filter-bar__fields > :where(.is-wide, .adw-field--wide, [data-filter-width="wide"]) { grid-column: 1 / -1; }
    .ui-pagination-shell { justify-content: flex-start; }
}
@media (max-width: 560px) {
    .ui-filter-bar__fields > :where(label, .ui-form-field, .adw-field, .as-field) { grid-column: 1 / -1; }
    .ui-filter-bar__actions > :where(a, button) { flex: 1 1 auto; }
    .ui-table-shell > table { min-width: 42rem; }
}

/* Instrument catalog index: compact instrument identity, metrics and actions. */
.instrument-catalog-index { min-width: 0; }
.instrument-catalog-card { gap: .72rem; }
.instrument-catalog-card__header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: .8rem 1rem;
}
.instrument-catalog-card__identity { min-width: 0; }
.instrument-catalog-card__identity .as-badge-row { margin-top: 0; }
.instrument-catalog-card__identity .as-card-title { margin-top: .45rem !important; }
.instrument-catalog-card__metrics {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(5.5rem, auto);
    gap: .45rem;
}
.instrument-catalog-card__metrics > span {
    display: grid;
    gap: .08rem;
    min-width: 5.5rem;
    padding: .48rem .62rem;
    border: 1px solid var(--sot-border, #dbe4ea);
    border-radius: 10px;
    background: #f8fafc;
    text-align: center;
}
.instrument-catalog-card__metrics strong {
    color: var(--sot-text, #0f172a);
    font-size: .88rem;
    font-weight: 700;
    line-height: 1.1;
}
.instrument-catalog-card__metrics small {
    color: var(--sot-muted, #64748b);
    font-size: .66rem;
    font-weight: 700;
    line-height: 1.2;
}
.instrument-catalog-card__actions { min-width: max-content; }
.instrument-catalog-card__guidance {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    padding: .52rem .62rem;
    border-radius: 10px;
    background: #f8fafc;
    color: var(--sot-muted, #64748b);
    font-size: .73rem;
    line-height: 1.45;
}
.instrument-catalog-card__guidance > svg,
.instrument-catalog-card__guidance > i {
    flex: 0 0 auto;
    width: .9rem;
    height: .9rem;
    margin-top: .08rem;
    color: #64748b;
}
@media (max-width: 960px) {
    .instrument-catalog-card__header { grid-template-columns: minmax(0, 1fr) auto; }
    .instrument-catalog-card__metrics { grid-row: 2; grid-column: 1; justify-self: start; }
    .instrument-catalog-card__actions { grid-row: 2; grid-column: 2; }
}
@media (max-width: 640px) {
    .instrument-catalog-card__header { grid-template-columns: 1fr; align-items: start; }
    .instrument-catalog-card__metrics,
    .instrument-catalog-card__actions { grid-row: auto; grid-column: auto; justify-self: stretch; }
    .instrument-catalog-card__metrics { grid-auto-columns: minmax(0, 1fr); }
    .instrument-catalog-card__actions { justify-content: flex-start; min-width: 0; }
}

/* Canonical content-header contract: contextual help belongs to page identity,
   while the global topbar carries application identity only on migrated pages. */
[data-hpc-ui-contract="1"] .hpc-content-header-region {
    min-width: 0;
}

[data-hpc-ui-contract="1"] .ui-primary-page-heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .55rem;
    min-width: 0;
}

[data-hpc-ui-contract="1"] .ui-primary-page-heading > .ui-page-guide--launcher {
    flex: 0 0 auto;
    margin: 0;
}

[data-hpc-ui-contract="1"] .ui-page-guide-fallback {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: 2.25rem;
}

[data-hpc-ui-contract="1"] .hpc-topbar-heading-copy.is-global-only > p {
    color: var(--app-navbar-text, #173a56);
    font-size: .78rem;
    letter-spacing: .08em;
}

[data-hpc-ui-contract="1"] .hpc-topbar-heading-copy.is-global-only .hpc-topbar-heading-line {
    margin-top: .25rem;
}

@media (max-width: 760px) {
    [data-hpc-ui-contract="1"] .ui-page-guide-fallback {
        justify-content: flex-start;
    }
}

[data-hpc-ui-contract="1"]:has([data-canonical-content-header]) .ui-page-guide-fallback {
    display: none;
}

/* ========================================================================
   Contextual page-guide discoverability
   The page-level info control is intentionally more visible than ordinary
   utility chrome, while remaining compact beside the canonical H1.
   ======================================================================== */
.ui-page-guide__glyph {
    display: inline-block;
    min-width: .5em;
    font-family: var(--ui-font-family, "Source Sans 3", "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif);
    font-size: .9rem;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    text-align: center;
    transform: translateY(-.015em);
}

.ui-page-guide__trigger {
    border-color: color-mix(in srgb, var(--ui-primary, #147fa9) 82%, #ffffff);
    background: var(--ui-primary, #147fa9);
    color: #ffffff;
    font-family: var(--ui-font-family, "Source Sans 3", "Segoe UI Variable", "Segoe UI", Roboto, Arial, sans-serif);
    font-weight: 700;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-primary, #147fa9) 10%, transparent),
        0 3px 9px rgba(15, 88, 119, .16);
}

.ui-page-guide__trigger:hover {
    border-color: color-mix(in srgb, var(--ui-primary, #147fa9) 88%, #0b526f);
    background: color-mix(in srgb, var(--ui-primary, #147fa9) 88%, #0b526f);
    color: #ffffff;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--ui-primary, #147fa9) 12%, transparent),
        0 6px 16px rgba(15, 88, 119, .22);
    transform: translateY(-1px);
}

.ui-page-guide__trigger[aria-expanded="true"] {
    border-color: color-mix(in srgb, var(--ui-primary, #147fa9) 84%, #0b526f);
    background: color-mix(in srgb, var(--ui-primary, #147fa9) 84%, #0b526f);
    color: #ffffff;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--ui-primary, #147fa9) 14%, transparent);
}

.ui-page-header-component .ui-page-guide__trigger,
[data-hpc-ui-contract="1"] .ui-primary-page-heading > .ui-page-guide--launcher .ui-page-guide__trigger {
    width: 1.9rem;
    height: 1.9rem;
    flex-basis: 1.9rem;
}

.ui-page-header-component .ui-page-guide__trigger .ui-page-guide__glyph,
[data-hpc-ui-contract="1"] .ui-primary-page-heading > .ui-page-guide--launcher .ui-page-guide__glyph {
    font-size: .86rem;
}

.ui-page-guide-dialog__icon .ui-page-guide__glyph {
    color: inherit;
    font-size: .9rem;
}

@media (max-width: 640px) {
    .ui-page-header-component .ui-page-guide__trigger,
    [data-hpc-ui-contract="1"] .ui-primary-page-heading > .ui-page-guide--launcher .ui-page-guide__trigger {
        width: 2rem;
        height: 2rem;
        flex-basis: 2rem;
    }
}

/* SaaS platform contract: this is a vertical operational workspace, not a
 * semantic page grid. ui-consistency.js dynamically adds ui-page-root to the
 * first page child and ui-form-page to long forms; those generic display:grid
 * rules can create competing grid contexts around these nested editor grids.
 * Keep the page and the editor as full-width block stacks at every viewport.
 * Scope strictly to /saas/platform, leaving other workspaces untouched. */
.hpc-page-container .platform-console-workspace {
    display: block !important;
    width: 100%;
    min-width: 0;
    max-width: none;
}
.hpc-page-container .platform-console-workspace > * + * {
    margin-top: 1rem;
}
.hpc-page-container .platform-console-contract-form {
    display: block !important;
    width: 100%;
    min-width: 0;
    max-width: none;
}
.hpc-page-container .platform-console-contract-form > * + * {
    margin-top: 1rem;
}
/* SaaS platform contract: the tenant selector and long contract editor are
 * separate tasks. Do not squeeze the editor beside a five-column tenant table.
 * Scope all fixes to this Livewire page; other workspaces keep their layouts. */
.hpc-page-container .platform-console-workspace,
.hpc-page-container .platform-console-main-grid,
.hpc-page-container .platform-console-tenant-card,
.hpc-page-container .platform-console-contract-card,
.hpc-page-container .platform-console-contract-form {
    min-width: 0;
    width: 100%;
    max-width: none;
}
.hpc-page-container .platform-console-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start;
    width: 100%;
}
.hpc-page-container .platform-console-main-grid > :where(.platform-console-tenant-card, .platform-console-contract-card) {
    grid-column: 1 / -1;
    min-width: 0;
    width: 100%;
}
.hpc-page-container .platform-console-workspace .platform-console-tenant-card .ui-card-header {
    flex-wrap: wrap;
    align-items: center;
}
.hpc-page-container .platform-console-search {
    flex: 1 1 240px;
    width: min(100%, 340px);
    max-width: 340px;
}
.hpc-page-container .platform-console-tenant-table {
    min-width: 840px;
}
.hpc-page-container .platform-console-tenant-table td {
    vertical-align: top;
    overflow-wrap: anywhere;
}
.hpc-page-container .platform-console-contract-card {
    container-type: inline-size;
}
.hpc-page-container .platform-console-contract-form :where(.platform-console-fields-two, .platform-console-fields-three) {
    display: grid;
    min-width: 0;
    width: 100%;
    align-items: start;
}
.hpc-page-container .platform-console-contract-form .platform-console-fields-two {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.hpc-page-container .platform-console-contract-form .platform-console-fields-three {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.hpc-page-container .platform-console-contract-form :where(.platform-console-fields-two, .platform-console-fields-three) > * {
    min-width: 0;
}
.hpc-page-container .platform-console-contract-form :where(label, small, p, span) {
    word-break: normal;
    hyphens: none;
}
.hpc-page-container .platform-console-contract-form :where(input, select, textarea) {
    width: 100%;
    min-width: 0;
}
/* The shell's .hpc-page-container label { display:block } overrides
 * utility .flex for checkbox descriptions unless this intent is explicit. */
.hpc-page-container .platform-console-contract-form label.flex {
    display: flex !important;
    align-items: flex-start;
    gap: .625rem;
    letter-spacing: normal;
}
.hpc-page-container .platform-console-contract-form label.flex > input[type="checkbox"] {
    flex: 0 0 1rem;
    width: 1rem !important;
    min-height: 1rem !important;
    padding: 0;
}
.hpc-page-container .platform-console-contract-form label.flex > span {
    flex: 1 1 auto;
    min-width: 0;
}
.hpc-page-container .platform-console-contract-form :where(label, small, p, span) {
    overflow-wrap: break-word;
}
@container (max-width: 760px) {
    .hpc-page-container .platform-console-contract-form .platform-console-fields-two,
    .hpc-page-container .platform-console-contract-form .platform-console-fields-three {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .hpc-page-container .platform-console-contract-form :where(.md\:col-span-2) {
        grid-column: 1 / -1 !important;
    }
}
@container (min-width: 761px) and (max-width: 1080px) {
    .hpc-page-container .platform-console-contract-form .platform-console-fields-three {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 760px) {
    .hpc-page-container .platform-console-search {
        flex-basis: 100%;
        max-width: none;
    }
}