/* /Components/AccessDrawer.razor.rz.scp.css */
.access-drawer-overlay[b-3gza2cfdu1] {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: flex;
    justify-content: flex-end;
    background: var(--clv-color-overlay);
}

.access-drawer[b-3gza2cfdu1] {
    display: flex;
    width: min(680px, 100vw);
    max-width: 680px;
    height: 100dvh;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid var(--color-border);
    background: var(--color-white);
    box-shadow: var(--shadow-lg);
}

.access-drawer-header[b-3gza2cfdu1],
.access-drawer-footer[b-3gza2cfdu1] {
    display: flex;
    flex: 0 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-6);
    border-bottom: 1px solid var(--color-border-light);
}

.access-drawer-header h3[b-3gza2cfdu1] {
    margin: 0;
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-title3);
    font-weight: var(--font-medium);
}

.access-drawer-header p[b-3gza2cfdu1] {
    margin: var(--space-1) 0 0;
    color: var(--color-service-grey);
    font-size: var(--text-subhead);
}

.access-drawer-close[b-3gza2cfdu1] {
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    border-radius: var(--radius-md);
    color: var(--color-service-grey);
    font-size: var(--text-title3);
}

.access-drawer-close:hover[b-3gza2cfdu1] {
    background: var(--color-surface);
    color: var(--color-navy);
}

.access-drawer-close:focus-visible[b-3gza2cfdu1] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.access-drawer-body[b-3gza2cfdu1] {
    min-width: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    padding: var(--space-6);
}

.access-drawer-footer[b-3gza2cfdu1] {
    align-items: center;
    justify-content: flex-end;
    border-top: 1px solid var(--color-border-light);
    border-bottom: 0;
    background: var(--color-white);
}

.access-drawer-footer[b-3gza2cfdu1]  .btn {
    min-height: 44px;
}

@media (max-width: 427px) {
    .access-drawer[b-3gza2cfdu1] {
        width: 100vw;
        max-width: 100vw;
        border-left: 0;
    }

    .access-drawer-header[b-3gza2cfdu1],
    .access-drawer-body[b-3gza2cfdu1],
    .access-drawer-footer[b-3gza2cfdu1] {
        padding-right: var(--space-4);
        padding-left: var(--space-4);
    }

    .access-drawer-footer[b-3gza2cfdu1] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .access-drawer-footer[b-3gza2cfdu1]  .btn {
        width: 100%;
    }
}
/* /Components/AccessRoleDrawer.razor.rz.scp.css */
.access-form-field[b-ou3ucy7rou] {
    display: grid;
    gap: var(--space-2);
    margin-bottom: var(--space-5);
}

.access-form-field label[b-ou3ucy7rou] {
    color: var(--color-navy);
    font-size: var(--text-subhead);
    font-weight: var(--font-medium);
}

.access-form-field input[b-ou3ucy7rou],
.access-form-field textarea[b-ou3ucy7rou] {
    width: 100%;
    min-height: 44px;
    padding: var(--space-3) var(--space-4);
    border: 1.5px solid var(--color-control-border);
    border-radius: var(--radius-md);
    color: var(--color-navy);
    font: inherit;
}

.access-form-field textarea[b-ou3ucy7rou] {
    min-height: 88px;
    resize: vertical;
}

.access-form-field input:focus-visible[b-ou3ucy7rou],
.access-form-field textarea:focus-visible[b-ou3ucy7rou] {
    outline: none;
    border-color: var(--color-blue);
    box-shadow: var(--shadow-focus);
}

.access-field-error[b-ou3ucy7rou],
.access-inline-error[b-ou3ucy7rou] {
    color: var(--color-error);
    font-size: var(--text-footnote);
}

.access-inline-error[b-ou3ucy7rou] {
    margin-bottom: var(--space-4);
    padding: var(--space-3);
    border: 1px solid var(--color-error-tint-border);
    border-radius: var(--radius-md);
    background: var(--color-error-tint);
}

.access-search[b-ou3ucy7rou] {
    max-width: none;
}

.access-search input[b-ou3ucy7rou] {
    min-height: 44px;
}

.permission-count[b-ou3ucy7rou] {
    margin: var(--space-2) 0 var(--space-5);
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.permission-groups[b-ou3ucy7rou] {
    display: grid;
    gap: var(--space-6);
}

.access-choice-group[b-ou3ucy7rou] {
    display: grid;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    border: 0;
}

.access-choice-group legend[b-ou3ucy7rou] {
    margin-bottom: var(--space-3);
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-body);
    font-weight: var(--font-medium);
}

.access-choice[b-ou3ucy7rou] {
    display: flex;
    min-height: 44px;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
    cursor: pointer;
}

.access-choice:has(input:checked)[b-ou3ucy7rou] {
    border-color: var(--color-blue);
    background: var(--color-info-tint);
}

.access-choice input[b-ou3ucy7rou] {
    width: 18px;
    height: 18px;
    margin: var(--space-1) 0 0;
    accent-color: var(--color-navy);
}

.access-choice strong[b-ou3ucy7rou],
.access-choice small[b-ou3ucy7rou] {
    display: block;
}

.access-choice strong[b-ou3ucy7rou] {
    color: var(--color-navy);
    font-size: var(--text-subhead);
}

.access-choice small[b-ou3ucy7rou] {
    margin-top: var(--space-1);
    color: var(--color-service-grey);
    font-family: var(--font-mono);
    font-size: var(--text-caption1);
}
/* /Components/AccessRolesList.razor.rz.scp.css */
.access-role-list[b-6ok88vh3xw] {
    display: grid;
    gap: var(--space-3);
}

.access-role-card[b-6ok88vh3xw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5);
    padding: var(--space-4) var(--space-5);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-white);
}

.access-role-card.archived[b-6ok88vh3xw] {
    background: var(--color-surface);
}

.access-role-card-main[b-6ok88vh3xw] {
    min-width: 0;
}

.access-role-title-row[b-6ok88vh3xw],
.access-role-meta[b-6ok88vh3xw],
.access-role-actions[b-6ok88vh3xw] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
}

.access-role-title-row h3[b-6ok88vh3xw] {
    margin: 0;
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-body);
    font-weight: var(--font-medium);
}

.access-role-kind[b-6ok88vh3xw],
.access-role-archived[b-6ok88vh3xw] {
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-full);
    background: var(--color-info-tint);
    color: var(--color-info);
    font-size: var(--text-caption1);
}

.access-role-archived[b-6ok88vh3xw] {
    background: var(--color-draft-tint);
    color: var(--color-service-grey);
}

.access-role-card p[b-6ok88vh3xw] {
    overflow: hidden;
    margin: var(--space-2) 0;
    color: var(--color-service-grey);
    font-size: var(--text-subhead);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.access-role-meta[b-6ok88vh3xw] {
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.access-role-card .archive-guard[b-6ok88vh3xw] {
    margin-bottom: 0;
    color: var(--color-warning);
    font-size: var(--text-caption1);
    white-space: normal;
}

.access-role-meta span + span[b-6ok88vh3xw]::before {
    margin-right: var(--space-2);
    content: "·";
}

.access-role-actions[b-6ok88vh3xw] {
    flex: 0 0 auto;
    justify-content: flex-end;
}

.access-role-actions .btn[b-6ok88vh3xw] {
    min-height: 44px;
}

@media (max-width: 760px) {
    .access-role-card[b-6ok88vh3xw] {
        align-items: stretch;
        flex-direction: column;
    }

    .access-role-actions[b-6ok88vh3xw] {
        align-items: stretch;
        flex-direction: column;
        justify-content: flex-start;
    }

    .access-role-actions .btn[b-6ok88vh3xw] {
        width: 100%;
        white-space: normal;
    }

    .access-role-card p[b-6ok88vh3xw] {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }
}
/* /Components/CapabilityRouteView.razor.rz.scp.css */
.access-route-loading[b-c2z78mlmbk],
.access-route-denied[b-c2z78mlmbk] {
    max-width: var(--container-xs);
    margin: var(--space-8) auto;
    padding: var(--space-8);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-white);
}

.access-route-loading[b-c2z78mlmbk] {
    color: var(--color-service-grey);
}

.access-route-denied[b-c2z78mlmbk] {
    border-color: var(--color-warning);
}

.access-route-denied h1[b-c2z78mlmbk] {
    margin: 0 0 var(--space-2);
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-title3);
}

.access-route-denied p[b-c2z78mlmbk],
.access-route-loading p[b-c2z78mlmbk] {
    margin: 0;
}
/* /Components/DocumentOnlyRolesPanel.razor.rz.scp.css */
.dor-summary[b-rk8f05js0y] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
    color: var(--color-navy);
    font-size: var(--text-body2);
}

.dor-summary span[b-rk8f05js0y] {
    display: block;
    margin-top: var(--space-1);
    color: var(--color-service-grey);
}

.dor-toolbar[b-rk8f05js0y] {
    justify-content: flex-start;
}

.dor-toolbar .search-field[b-rk8f05js0y] {
    width: min(420px, 100%);
}

.dor-table[b-rk8f05js0y] {
    min-width: 0;
    table-layout: fixed;
}

.dor-role-name[b-rk8f05js0y] {
    color: var(--color-navy);
    font-weight: var(--font-medium);
}

.dor-secondary[b-rk8f05js0y] {
    display: block;
    margin-top: 2px;
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.dor-notes[b-rk8f05js0y] {
    display: -webkit-box;
    max-width: 340px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--color-service-grey);
    line-height: 1.35;
}

.dor-edit[b-rk8f05js0y] {
    border: 0;
    background: transparent;
    cursor: pointer;
}

.dor-edit:focus-visible[b-rk8f05js0y],
.dor-inline-actions button:focus-visible[b-rk8f05js0y] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dor-action-cell[b-rk8f05js0y] {
    width: 52px;
    text-align: center;
}

.dor-page[b-rk8f05js0y] {
    align-self: center;
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.btn-cancel[b-rk8f05js0y] {
    padding: 8px 16px;
    border: 1.5px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-white);
    color: var(--color-navy);
    font: inherit;
    cursor: pointer;
}

.btn-cancel:hover[b-rk8f05js0y] {
    background: var(--color-surface);
}


.dor-inline-edit-row td[b-rk8f05js0y] {
    padding: 0;
    background: var(--color-surface);
}

.dor-inline-edit[b-rk8f05js0y] {
    display: grid;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-5);
    border-block: 1px solid var(--color-border-light);
    box-shadow: inset 3px 0 0 var(--color-blue);
}

.dor-inline-edit-head[b-rk8f05js0y] {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.dor-inline-edit-head strong[b-rk8f05js0y] {
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-body2);
    font-weight: var(--font-medium);
}

.dor-fields[b-rk8f05js0y] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-4);
}

.dor-fields label[b-rk8f05js0y] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}

.dor-fields label > span[b-rk8f05js0y] {
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-caption1);
    font-weight: var(--font-medium);
}

.dor-fields select[b-rk8f05js0y],
.dor-fields input[b-rk8f05js0y],
.dor-fields textarea[b-rk8f05js0y] {
    width: 100%;
    min-height: 40px;
    border: 1px solid var(--color-control-border);
    border-radius: var(--radius-sm);
    background: var(--color-white);
    color: var(--color-navy);
    font: inherit;
    padding: 8px 10px;
}

.dor-fields textarea[b-rk8f05js0y] {
    resize: vertical;
}

.dor-fields select:focus-visible[b-rk8f05js0y],
.dor-fields input:focus-visible[b-rk8f05js0y],
.dor-fields textarea:focus-visible[b-rk8f05js0y] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

.dor-notes-field[b-rk8f05js0y],
.dor-error[b-rk8f05js0y] {
    grid-column: 1 / -1;
}

.dor-inline-actions[b-rk8f05js0y] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
}

.dor-error[b-rk8f05js0y] {
    padding: var(--space-3);
    border-radius: var(--radius-sm);
    background: var(--color-error-tint);
    color: var(--color-error);
    font-size: var(--text-body2);
}

@media (max-width: 640px) {
    .dor-edit[b-rk8f05js0y] {
        width: 44px;
        height: 44px;
    }

    .dor-fields[b-rk8f05js0y] {
        grid-template-columns: 1fr;
    }

    .dor-notes-field[b-rk8f05js0y],
    .dor-error[b-rk8f05js0y] {
        grid-column: auto;
    }

    .dor-inline-edit-head[b-rk8f05js0y] {
        align-items: flex-start;
        flex-direction: column;
        gap: var(--space-1);
    }
}
/* /Components/MemberRoleDrawer.razor.rz.scp.css */
.access-search[b-dnun5sdjwg] {
    max-width: none;
    margin-bottom: var(--space-5);
}

.access-search input[b-dnun5sdjwg] {
    min-height: 44px;
}

.access-inline-error[b-dnun5sdjwg] {
    margin-bottom: var(--space-4);
    padding: var(--space-3);
    border: 1px solid var(--color-error-tint-border);
    border-radius: var(--radius-md);
    background: var(--color-error-tint);
    color: var(--color-error);
    font-size: var(--text-subhead);
}

.access-choice-group[b-dnun5sdjwg] {
    display: grid;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    border: 0;
}

.access-choice-group legend[b-dnun5sdjwg],
.effective-access h4[b-dnun5sdjwg] {
    margin: 0 0 var(--space-3);
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-body);
    font-weight: var(--font-medium);
}

.access-choice[b-dnun5sdjwg] {
    display: flex;
    min-height: 44px;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-3);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-md);
    cursor: pointer;
}

.access-choice:has(input:checked)[b-dnun5sdjwg] {
    border-color: var(--color-blue);
    background: var(--color-info-tint);
}

.access-choice input[b-dnun5sdjwg] {
    width: 18px;
    height: 18px;
    margin: var(--space-1) 0 0;
    accent-color: var(--color-navy);
}

.access-choice strong[b-dnun5sdjwg],
.access-choice small[b-dnun5sdjwg] {
    display: block;
}

.access-choice strong[b-dnun5sdjwg] {
    color: var(--color-navy);
    font-size: var(--text-subhead);
}

.access-choice small[b-dnun5sdjwg] {
    margin-top: var(--space-1);
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.effective-access[b-dnun5sdjwg] {
    margin-top: var(--space-6);
    padding-top: var(--space-5);
    border-top: 1px solid var(--color-border-light);
}

.effective-access > p[b-dnun5sdjwg],
.effective-access li[b-dnun5sdjwg] {
    color: var(--color-service-grey);
    font-size: var(--text-subhead);
}

.effective-access-group h5[b-dnun5sdjwg] {
    margin: var(--space-4) 0 var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-subhead);
    font-weight: var(--font-medium);
}

.effective-access-group ul[b-dnun5sdjwg] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    list-style: none;
}

.effective-access-group li[b-dnun5sdjwg] {
    padding: var(--space-1) var(--space-3);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-full);
    background: var(--color-surface);
}
/* /Components/RoleMappingsPanel.razor.rz.scp.css */
/* Role Mappings view — ported from the v37 prototype (specs/045-v37-ui-parity/reference/role-mappings.css:
   mp-table tweaks + the mpx-* expanded-detail rules) on the earlier v14 base. The app shares the same
   vendored brand tokens, so the prototype values port directly. */

.mp-toolbar-check[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-caption1); color: var(--color-navy); cursor: pointer; white-space: nowrap; }
.mp-toolbar-check input[b-8klzpkmyh2] { accent-color: var(--color-navy); width: 14px; height: 14px; cursor: pointer; }

/* Toolbar: filters on the first row, status chips on the second. */
.mp-filter-row[b-8klzpkmyh2], .mp-status-row[b-8klzpkmyh2] { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; width: 100%; }
.mp-status-row[b-8klzpkmyh2] { justify-content: space-between; margin-top: var(--space-3); }
.mp-filter-row .search-field[b-8klzpkmyh2] { flex: 1 1 240px; min-width: 190px; }
.mp-filter-row .filter-select[b-8klzpkmyh2] { flex: 0 0 auto; }
.mapped-role-filter-btn[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 12px; border: 1.5px solid var(--color-control-border); border-radius: var(--radius-md); background: var(--color-white); color: var(--color-navy); font: inherit; font-size: var(--text-subhead); cursor: pointer; white-space: nowrap; }
.mapped-role-filter-btn:hover[b-8klzpkmyh2], .mapped-role-filter-btn.active[b-8klzpkmyh2] { border-color: var(--color-blue); background: var(--color-surface); }
.mapped-role-filter-btn svg[b-8klzpkmyh2] { width: 15px; height: 15px; flex: 0 0 auto; }
.mapped-role-chip[b-8klzpkmyh2] { display: inline-flex; align-items: center; height: 30px; padding: 0 10px; border: 1px solid color-mix(in srgb, var(--color-teal) 45%, transparent); border-radius: var(--radius-full); background: color-mix(in srgb, var(--color-teal) 12%, transparent); color: var(--color-navy); font: inherit; font-size: var(--text-caption1); cursor: pointer; white-space: nowrap; }
.mapped-role-chip:hover[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-teal) 20%, transparent); }

/* Toolbar: multi-asset scope toggle + quick-chip filters */
.mp-scope-toggle[b-8klzpkmyh2] { display: flex; align-items: center; }
.scope-label[b-8klzpkmyh2] { display: flex; align-items: center; gap: 6px; font-size: var(--text-caption1); color: var(--color-navy); cursor: pointer; padding: 0 4px; white-space: nowrap; }
.scope-label input[b-8klzpkmyh2] { accent-color: var(--color-navy); width: 14px; height: 14px; cursor: pointer; }
.chip-group-label[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); padding: 0 4px; align-self: center; }
.quick-chips[b-8klzpkmyh2] { display: flex; gap: 6px; margin-left: auto; align-items: center; flex-wrap: wrap; }
.quick-chip[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; font-size: 13px; background: var(--color-white); border: 1.5px solid var(--color-control-border); border-radius: 999px; color: var(--color-text-secondary); cursor: pointer; transition: all .12s; }
.quick-chip:hover[b-8klzpkmyh2] { border-color: var(--color-blue); color: var(--color-navy); }
.quick-chip.active[b-8klzpkmyh2] { background: var(--color-navy); color: var(--color-white); border-color: var(--color-navy); }
.qc-num[b-8klzpkmyh2] { font-size: 11px; background: color-mix(in srgb, var(--color-deep-navy) 12%, transparent); border-radius: 999px; padding: 0 6px; }
.quick-chip.active .qc-num[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-white) 25%, transparent); }

/* v55: slightly tighter cell gutters than the 16px data-table default so all nine columns fit a
   13" viewport without the inner horizontal scroll clipping the Actions header. (Selector depth
   beats the global ".tbl-scroll .data-table thead th" padding rule in components.css.) The thead-th
   half of this rule moved to roles.css (055): the headers are now the shared SortableTh component,
   whose markup never carries this component's scope attribute. */
.tbl-scroll .data-table.mp-table tbody td[b-8klzpkmyh2] { padding-left: 12px; padding-right: 12px; }

/* Rows — v37: every row is clickable/expandable */
.mp-row[b-8klzpkmyh2] { cursor: pointer; }
.mp-row:hover[b-8klzpkmyh2] { background: var(--color-surface); }
.mp-table .grp-row[b-8klzpkmyh2] { cursor: pointer; background: rgba(43, 122, 120, .035); }
.mp-table .grp-row:hover[b-8klzpkmyh2] { background: rgba(43, 122, 120, .07); }
.mp-table .grp-row.open[b-8klzpkmyh2] { background: rgba(43, 122, 120, .09); }
.mp-table .grp-row > td[b-8klzpkmyh2] { border-bottom: 1px solid var(--color-border-light); }

.rl-name[b-8klzpkmyh2] { font-size: var(--text-subhead); color: var(--color-navy); line-height: 1.3; }
.rl-acr[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); margin-left: 6px; }
.grp-name-wrap[b-8klzpkmyh2] { display: flex; align-items: flex-start; gap: 8px; }
/* v55: SVG chevron (the old 11px "▸" text glyph read as a stray bullet before every role name). */
.mp-caret[b-8klzpkmyh2] { display: inline-flex; align-items: center; color: var(--color-service-grey); margin-top: 2px; padding: 2px; flex: 0 0 auto; border: 0; border-radius: 2px; background: transparent; cursor: pointer; }
.mp-caret svg[b-8klzpkmyh2] { width: 13px; height: 13px; transition: transform .18s ease; }
.mp-caret.open svg[b-8klzpkmyh2] { transform: rotate(90deg); }
.mp-caret:focus-visible[b-8klzpkmyh2] { outline: none; box-shadow: var(--shadow-focus); }
.mp-caret.hidden[b-8klzpkmyh2] { visibility: hidden; }
.grp-name[b-8klzpkmyh2] { font-weight: var(--font-medium); display: flex; align-items: center; flex-wrap: wrap; gap: 0; }
/* .grp-applies / .grp-assets / .grp-assign moved to components.css: AppliesCell emits them from a
   C# RenderFragment, which never receives the scoped-CSS attribute, so rules here cannot reach
   them (the stacked two-line layout silently never applied). */
.fan-pill[b-8klzpkmyh2] { font-size: 9.5px; font-family: var(--font-heading); letter-spacing: .05em; text-transform: uppercase; background: color-mix(in srgb, var(--color-teal) 30%, transparent); color: var(--color-navy); border-radius: 3px; padding: 2px 6px; margin-left: 8px; vertical-align: middle; font-weight: 500; }
.candidate-pill[b-8klzpkmyh2] { background: var(--color-warning-tint); color: var(--color-warning); }

.map-arrow[b-8klzpkmyh2] { color: var(--color-service-grey); font-weight: 600; }
.map-arrow.dim[b-8klzpkmyh2] { color: var(--color-text-secondary); }
/* In the mappings table the mapped-to target is plain text, not a control (v37 .mp-table override). */
.mp-table .mapped-to-select[b-8klzpkmyh2] { display: inline; height: auto; padding: 0; border: none; border-radius: 0; background: none; color: var(--color-navy); font-size: var(--text-subhead); font-weight: var(--font-medium); cursor: default; }
.mp-table .mapped-to-select[b-8klzpkmyh2]::after { display: none; }
.mapped-to-select.multi-mapped[b-8klzpkmyh2] { color: var(--color-service-grey); font-style: italic; font-weight: var(--font-regular); }
.no-target[b-8klzpkmyh2] { color: var(--color-text-secondary); }

/* v37 column behaviour: long names wrap instead of stretching the row. */
.mp-table td .rl-name[b-8klzpkmyh2] { white-space: normal; word-break: break-word; }
.mp-table td .mapped-to-select[b-8klzpkmyh2] { white-space: normal; word-break: break-word; }
/* (th:nth-child moved to roles.css with the header padding — see the v55 note above.)
   Indexes count the v55 leading checkbox column: 3 = Documented Role, 5 = Mapped To. */
.mp-table td:nth-child(5)[b-8klzpkmyh2] { min-width: 230px; }
.mp-table td:nth-child(3)[b-8klzpkmyh2] { min-width: 160px; }
.mp-table.mp-readonly td:nth-child(4)[b-8klzpkmyh2] { min-width: 230px; }
.mp-table.mp-readonly td:nth-child(5)[b-8klzpkmyh2] { min-width: 90px; }

/* v55 follow-up: multi-select. The td/th shells are literal markup (scoped); the row checkbox
   input itself is fragment-emitted, so its rule lives in components.css. */
.mp-table .mp-cbcell[b-8klzpkmyh2] { width: 34px; min-width: 34px; text-align: center; padding-left: 8px !important; padding-right: 0 !important; }

/* Fixed bottom-centre bulk bar (same pattern as Manage roles' mr36-bulkbar). */
.mp-bulkbar[b-8klzpkmyh2] { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 900; display: flex; align-items: center; gap: 12px; background: var(--color-navy); color: var(--color-white); border-radius: 10px; padding: 10px 16px; font-size: 13px; box-shadow: var(--shadow-lg); }
.mp-bulkbar strong[b-8klzpkmyh2] { font-weight: 600; white-space: nowrap; }
.mp-bulkbar .mp-bulk-sub[b-8klzpkmyh2] { color: color-mix(in srgb, var(--color-white) 72%, transparent); white-space: nowrap; }
.mp-bulkbar .sp[b-8klzpkmyh2] { width: 4px; }
.mp-bulkbar button[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 7px; border: 1px solid rgba(255,255,255,.35); background: transparent; color: var(--color-white); font-size: 12.5px; font-weight: 500; cursor: pointer; font-family: inherit; white-space: nowrap; }
.mp-bulkbar button:hover[b-8klzpkmyh2] { background: rgba(255,255,255,.12); }
.mp-bulkbar button svg[b-8klzpkmyh2] { width: 13px; height: 13px; }
.mp-bulkbar button.mp-bulk-confirm[b-8klzpkmyh2] { background: var(--color-success); border-color: var(--color-success); }
.mp-bulkbar button.mp-bulk-confirm:hover[b-8klzpkmyh2] { filter: brightness(1.08); }
.mp-bulkbar button:disabled[b-8klzpkmyh2] { opacity: .5; cursor: not-allowed; }

/* Bulk confirm modal: the role list above the shared blast-radius grid. */
.mp-bulk-list[b-8klzpkmyh2] { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 6px; max-height: 180px; overflow-y: auto; }
.mp-bulk-list li[b-8klzpkmyh2] { font-size: 13px; }
.mp-bulk-more[b-8klzpkmyh2] { color: var(--color-service-grey); font-style: italic; }

/* The match-type / role-type pills, attention badge, kind pill and edit-action
   hover are rendered from C# RenderFragment builders, which Blazor scoped CSS cannot reach, so they live
   in the global components.css. Only classes written as literal markup in this component stay here. */
.mp-row-err[b-8klzpkmyh2] { color: var(--color-error); font-size: var(--text-subhead); margin-top: 4px; }

/* Expanded detail row: example assignments are the primary evidence; candidate and fan-out rows add
   their real mapping controls and per-asset breakdown inside the same panel. */
.mp-exp td[b-8klzpkmyh2] { padding: 0 !important; border: none !important; }
.mp-exp-inner[b-8klzpkmyh2] { max-height: 0; overflow: hidden; transition: max-height var(--duration-base) var(--ease-default); background: var(--color-surface); }
.mp-exp-inner.open[b-8klzpkmyh2] { max-height: 820px; padding: var(--space-3) var(--space-5); }
.mpx-detail[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: var(--space-3); }
.mpx-grid[b-8klzpkmyh2] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 18px; }
.mpx-field[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.mpx-label[b-8klzpkmyh2] { font-size: 11px; color: var(--color-service-grey); }
.mpx-val[b-8klzpkmyh2] { font-size: 13px; color: var(--color-navy); overflow-wrap: break-word; }
.mpx-notes[b-8klzpkmyh2] { color: var(--color-service-grey); font-size: 12px; line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.example-assignments[b-8klzpkmyh2] { background: var(--color-white); border: 1px solid color-mix(in srgb, var(--color-teal) 28%, var(--color-border-light)); border-radius: var(--radius-sm); padding: 12px 14px; }
.example-assignments-head[b-8klzpkmyh2] { color: var(--color-navy); font-size: 12px; font-weight: var(--font-medium); margin-bottom: 8px; }
.example-assignments-loading[b-8klzpkmyh2] { color: var(--color-service-grey); font-size: 13px; padding: 8px 0; }
.example-assignment-line[b-8klzpkmyh2] { padding: 8px 0; border-top: 1px solid var(--color-border-light); }
.example-assignment-quote[b-8klzpkmyh2] { color: var(--color-navy); font-size: 13px; line-height: 1.45; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.example-assignment-meta[b-8klzpkmyh2] { display: flex; align-items: center; gap: 8px; margin-top: 3px; color: var(--color-service-grey); font-size: 11px; }
.example-assignment-meta > span:first-child[b-8klzpkmyh2] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.example-assignment-status[b-8klzpkmyh2] { flex: 0 0 auto; padding: 2px 6px; border-radius: var(--radius-full); background: var(--color-surface); color: var(--color-service-grey); }
.example-assignments-link[b-8klzpkmyh2] { display: inline-block; margin-top: 8px; color: var(--color-text-link); font-size: 12px; text-decoration: none; }
.example-assignments-link:hover[b-8klzpkmyh2] { color: var(--color-text-link-hover); text-decoration: underline; }

/* Fan-out target-role chips (rendered inside the expanded detail) */
.fanout-head[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); margin-bottom: var(--space-3); }
.fanout-head strong[b-8klzpkmyh2] { color: var(--color-navy); font-weight: var(--font-medium); }
.fo-role-chips[b-8klzpkmyh2] { display: flex; flex-wrap: wrap; gap: 6px; }
.fo-role-chip[b-8klzpkmyh2] { display: inline-flex; align-items: center; padding: 3px 10px; background: color-mix(in srgb, var(--color-teal) 18%, transparent); border: 1px solid color-mix(in srgb, var(--color-teal) 40%, transparent); border-radius: var(--radius-full); font-size: var(--text-caption1); color: var(--color-navy); font-weight: var(--font-medium); }

/* Competing candidate mappings (#243): visible together, but each is an explicit choose-one action. */
.candidate-head[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); }
.candidate-list[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 6px; }
.candidate-option[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 9px 12px; background: var(--color-white); border: 1px solid var(--color-border-light); border-radius: var(--radius-sm); }
.candidate-option > div[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.candidate-option strong[b-8klzpkmyh2] { color: var(--color-navy); font-size: var(--text-subhead); }
.candidate-option span[b-8klzpkmyh2] { color: var(--color-service-grey); font-size: var(--text-caption1); }
.candidate-choose[b-8klzpkmyh2] { flex: 0 0 auto; border: 1px solid var(--color-navy); background: var(--color-white); color: var(--color-navy); border-radius: var(--radius-sm); padding: 6px 12px; cursor: pointer; font: inherit; font-size: var(--text-caption1); }
.candidate-choose:hover[b-8klzpkmyh2] { background: var(--color-navy); color: var(--color-white); }

/* Client-side paging (#263) bounds table DOM work while keeping the full filtered export in memory. */
.rm-page-size[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; color: var(--color-service-grey); white-space: nowrap; }
.rm-page-size select[b-8klzpkmyh2] { height: 30px; padding: 0 24px 0 8px; border: 1px solid var(--color-control-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-navy); font: inherit; font-weight: var(--font-medium); cursor: pointer; }

/* Mapped-role filter slide-over */
.mapped-role-filter-overlay[b-8klzpkmyh2] { position: fixed; inset: 0; z-index: 9100; background: color-mix(in srgb, var(--color-deep-navy) 35%, transparent); }
.mapped-role-filter-panel[b-8klzpkmyh2] { position: absolute; top: 0; right: 0; bottom: 0; width: 340px; max-width: 92vw; background: var(--color-white); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; animation: mapped-role-filter-in-b-8klzpkmyh2 .16s ease-out; }
@keyframes mapped-role-filter-in-b-8klzpkmyh2 { from { transform: translateX(100%); } to { transform: translateX(0); } }
.mapped-role-filter-head[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border-light); }
.mapped-role-filter-title[b-8klzpkmyh2] { color: var(--color-navy); font-size: var(--text-body); font-weight: var(--font-medium); }
.mapped-role-filter-close[b-8klzpkmyh2] { border: 0; background: none; color: var(--color-service-grey); font-size: 22px; line-height: 1; cursor: pointer; padding: 0 4px; }
.mapped-role-filter-close:hover[b-8klzpkmyh2] { color: var(--color-navy); }
.mapped-role-filter-body[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 16px; padding: var(--space-4) var(--space-5); overflow-y: auto; }
.mapped-role-filter-search[b-8klzpkmyh2] { width: 100%; box-sizing: border-box; height: 36px; padding: 0 10px; border: 1px solid var(--color-control-border); border-radius: var(--radius-sm); color: var(--color-navy); font: inherit; }
.mapped-role-filter-search:focus[b-8klzpkmyh2] { outline: none; border-color: var(--color-control-border); box-shadow: var(--shadow-focus); }
.mapped-role-filter-group[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 2px; }
.mapped-role-filter-group-title[b-8klzpkmyh2] { margin-bottom: 4px; color: var(--color-service-grey); font-size: 11px; font-weight: var(--font-medium); letter-spacing: .05em; text-transform: uppercase; }
.mapped-role-filter-option[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 8px 10px; border: 0; border-radius: 6px; background: none; color: var(--color-navy); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.mapped-role-filter-option:hover[b-8klzpkmyh2] { background: var(--color-surface); }
.mapped-role-filter-name[b-8klzpkmyh2] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mapped-role-filter-count[b-8klzpkmyh2] { flex: 0 0 auto; color: var(--color-service-grey); font-size: 12px; }

/* Confirm (blast-radius) modal */
.rm-modal-overlay[b-8klzpkmyh2] { position: fixed; inset: 0; background: color-mix(in srgb, var(--color-deep-navy) 45%, transparent); display: flex; align-items: center; justify-content: center; z-index: 200; padding: var(--space-4); }
.rm-modal[b-8klzpkmyh2] { background: var(--color-white); border-radius: var(--radius-lg); width: 440px; max-width: 100%; box-shadow: var(--shadow-lg); overflow: hidden; }
.rm-modal-head[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border-light); }
.modal-title[b-8klzpkmyh2] { font-family: var(--font-heading); font-size: var(--text-body-lg); color: var(--color-navy); font-weight: var(--font-medium); }
.modal-x[b-8klzpkmyh2] { background: none; border: none; font-size: 22px; line-height: 1; color: var(--color-service-grey); cursor: pointer; padding: 0 4px; }
.modal-x:hover[b-8klzpkmyh2] { color: var(--color-navy); }
.rm-modal-body[b-8klzpkmyh2] { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-4); }
.rm-modal-foot[b-8klzpkmyh2] { display: flex; justify-content: flex-end; gap: var(--space-3); padding: var(--space-4) var(--space-5); border-top: 1px solid var(--color-border-light); }
.mc-map[b-8klzpkmyh2] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: var(--text-body); }
.mc-from[b-8klzpkmyh2] { font-weight: var(--font-medium); color: var(--color-navy); }
.mc-arrow[b-8klzpkmyh2] { color: var(--color-service-grey); }
.mc-to[b-8klzpkmyh2] { font-weight: var(--font-medium); color: var(--color-navy); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 4px 12px; }
.mc-blast[b-8klzpkmyh2] { background: var(--color-surface); border: 1px solid var(--color-border-light); border-radius: var(--radius-md); padding: var(--space-4); }
.mc-blast-title[b-8klzpkmyh2] { font-size: var(--text-caption1); font-weight: var(--font-medium); color: var(--color-service-grey); text-transform: uppercase; letter-spacing: .04em; margin-bottom: var(--space-3); }
.mc-blast-grid[b-8klzpkmyh2] { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--space-3); text-align: center; }
.mc-blast-grid.two[b-8klzpkmyh2] { grid-template-columns: repeat(2,1fr); }
.mc-blast-grid.single[b-8klzpkmyh2] { grid-template-columns: 1fr; }
.mc-blast-cell[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 2px; padding: var(--space-3) var(--space-2); background: var(--color-white); border-radius: var(--radius-sm); border: 1px solid var(--color-border-light); }
.mc-num[b-8klzpkmyh2] { font-family: var(--font-heading); font-size: var(--text-title3); font-weight: var(--font-medium); color: var(--color-navy); }
.mc-cap[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); }
.mc-note[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); font-style: italic; }
.mc-kind-field[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 6px; margin-top: var(--space-4); color: var(--color-navy); font-size: var(--text-caption1); font-weight: var(--font-medium); }
.mc-kind-field select[b-8klzpkmyh2] { min-height: 40px; border: 1px solid var(--color-control-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-navy); font: inherit; padding: 8px 10px; }
.mc-kind-field small[b-8klzpkmyh2] { color: var(--color-service-grey); font-weight: var(--font-regular); }
.btn-cancel[b-8klzpkmyh2] { border: 1.5px solid var(--color-border); background: var(--color-white); color: var(--color-navy); border-radius: var(--radius-md); padding: 8px 16px; cursor: pointer; font: inherit; }
.btn-cancel:hover[b-8klzpkmyh2] { background: var(--color-surface); }
.btn-primary[b-8klzpkmyh2] { border: none; background: var(--color-navy); color: var(--color-white); border-radius: var(--radius-md); padding: 8px 16px; cursor: pointer; font: inherit; }
.btn-primary:disabled[b-8klzpkmyh2] { opacity: .55; cursor: default; }

/* Edit (manual remap) modal */
.edit-modal-overlay[b-8klzpkmyh2] { position: fixed; inset: 0; background: color-mix(in srgb, var(--color-deep-navy) 45%, transparent); z-index: 9000; display: flex; align-items: center; justify-content: center; padding: var(--space-4); }
.edit-modal[b-8klzpkmyh2] { background: var(--color-white); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); width: 680px; max-width: 96vw; max-height: 88vh; display: flex; flex-direction: column; overflow: hidden; }
.edit-modal-head[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: space-between; padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border-light); }
.edit-modal-title[b-8klzpkmyh2] { font-size: var(--text-body); font-weight: var(--font-medium); color: var(--color-navy); }
.edit-modal-close[b-8klzpkmyh2] { background: none; border: none; font-size: 20px; color: var(--color-service-grey); cursor: pointer; padding: 2px 6px; line-height: 1; }
.edit-modal-raw[b-8klzpkmyh2] { display: flex; align-items: center; gap: 10px; padding: var(--space-3) var(--space-5); background: var(--color-surface); border-bottom: 1px solid var(--color-border-light); }
.edit-raw-label[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); white-space: nowrap; }
.edit-raw-name[b-8klzpkmyh2] { font-size: var(--text-subhead); color: var(--color-navy); font-weight: var(--font-medium); }
.ce-mode-row[b-8klzpkmyh2] { display: flex; align-items: center; gap: 12px; padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--color-border-light); flex-wrap: wrap; }
/* Plain-text mode toggle (the prototype leaves these unstyled; a subtle active state keeps it usable). */
.ce-mode-toggle[b-8klzpkmyh2] { display: inline-flex; gap: 2px; }
.ce-mode-opt[b-8klzpkmyh2] { padding: 4px 10px; font-size: 13px; background: none; border: none; color: var(--color-service-grey); cursor: pointer; border-radius: 6px; font-family: inherit; }
.ce-mode-opt:hover[b-8klzpkmyh2] { color: var(--color-navy); }
.ce-mode-opt.active[b-8klzpkmyh2] { color: var(--color-navy); font-weight: 600; background: var(--color-surface); }
.ce-mode-hint[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); }
.ce-new-role-field[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 5px; padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--color-border-light); }
.ce-new-role-field label[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-navy); font-weight: var(--font-medium); }
.ce-new-role-field label span[b-8klzpkmyh2] { color: var(--color-service-grey); font-weight: var(--font-regular); }
.ce-new-role-field input[b-8klzpkmyh2],
.ce-new-role-field select[b-8klzpkmyh2] { width: 100%; box-sizing: border-box; min-height: 38px; padding: 7px 10px; border: 1px solid var(--color-control-border); border-radius: var(--radius-sm); background: var(--color-white); font: inherit; color: var(--color-navy); }
.ce-new-role-field input:focus[b-8klzpkmyh2],
.ce-new-role-field select:focus[b-8klzpkmyh2] { outline: none; border-color: var(--color-control-border); box-shadow: var(--shadow-focus); }
.ce-field-hint[b-8klzpkmyh2] { font-size: 11px; color: var(--color-service-grey); }
.edit-modal-body[b-8klzpkmyh2] { display: flex; flex-direction: column; flex: 1; overflow: hidden; min-height: 0; }
.ce-maps-to[b-8klzpkmyh2] { padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--color-border-light); }
.ce-maps-to .edit-raw-label[b-8klzpkmyh2] { display: block; margin-bottom: 8px; }
.mr-chips[b-8klzpkmyh2] { display: flex; flex-wrap: wrap; gap: 6px; min-height: 28px; align-items: center; }
.mr-chip[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px 3px 10px; background: color-mix(in srgb, var(--color-teal) 20%, transparent); border: 1px solid color-mix(in srgb, var(--color-teal) 50%, transparent); border-radius: var(--radius-full); font-size: var(--text-caption1); color: var(--color-navy); font-weight: var(--font-medium); }
.mr-chip-rm[b-8klzpkmyh2] { border: none; background: none; color: var(--color-navy); cursor: pointer; padding: 0 2px; font-size: 13px; line-height: 1; opacity: .7; }
.mr-chip-rm:hover[b-8klzpkmyh2] { opacity: 1; }
.mr-chips-empty[b-8klzpkmyh2] { font-size: var(--text-caption1); color: var(--color-service-grey); font-style: italic; }
.ce-picker[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 8px; padding: var(--space-3) var(--space-5); min-height: 240px; overflow: hidden; flex: 1; }
.ce-picker-controls[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ce-picker-check[b-8klzpkmyh2] { display: inline-flex; align-items: center; gap: 6px; font-size: var(--text-caption1); color: var(--color-navy); cursor: pointer; }
.ce-picker-check input[b-8klzpkmyh2] { accent-color: var(--color-navy); }
.ce-picker-controls select[b-8klzpkmyh2] { height: 28px; padding: 0 24px 0 8px; border: 1px solid var(--color-control-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-navy); font: inherit; font-size: 11px; }
.edit-search[b-8klzpkmyh2] { width: 100%; padding: 7px 10px; border: 1px solid var(--color-control-border); border-radius: var(--radius-sm); font-size: var(--text-subhead); outline: none; box-sizing: border-box; }
.edit-search:focus[b-8klzpkmyh2] { border-color: var(--color-control-border); box-shadow: var(--shadow-focus); }
.edit-role-list[b-8klzpkmyh2] { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; padding-right: 2px; }
/* justify-content:flex-start defeats the global button rule (justify-content:center) that otherwise
   centres the checkbox+name in each row; font-weight 500 matches the prototype. */
.ce-opt[b-8klzpkmyh2] { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; text-align: left; padding: 8px 10px; border: none; border-radius: 8px; background: none; cursor: pointer; font-family: inherit; font-size: var(--text-subhead); font-weight: 500; color: var(--color-navy); }
.ce-opt:hover[b-8klzpkmyh2] { background: var(--color-surface); }
.ce-opt.on[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-teal) 18%, transparent); }
.ce-opt.on .ce-opt-name[b-8klzpkmyh2] { font-weight: var(--font-medium); color: var(--color-navy); }
.ce-opt-copy[b-8klzpkmyh2] { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ce-opt-meta[b-8klzpkmyh2] { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.ce-role-source[b-8klzpkmyh2], .ce-role-chip[b-8klzpkmyh2] { display: inline-flex; align-items: center; padding: 1px 6px; border-radius: var(--radius-full); font-size: 10px; font-weight: var(--font-regular); white-space: nowrap; }
.ce-role-source[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-service-grey) 12%, transparent); color: var(--color-service-grey); }
.ce-role-source.org[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-teal) 18%, transparent); color: var(--color-navy); }
.ce-role-source.documented[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-blue) 10%, transparent); color: color-mix(in srgb, var(--color-blue) 70%, var(--color-navy)); }
.ce-role-chip[b-8klzpkmyh2] { background: var(--color-surface); color: var(--color-service-grey); }
.ce-box[b-8klzpkmyh2] { flex-shrink: 0; width: 18px; height: 18px; border: 1.5px solid var(--color-control-border); border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; color: var(--color-white); background: var(--color-white); transition: background .12s, border-color .12s; }
.ce-box svg[b-8klzpkmyh2] { width: 12px; height: 12px; }
.ce-opt.on .ce-box[b-8klzpkmyh2] { background: var(--color-blue); border-color: var(--color-blue); }
.edit-dep-warn[b-8klzpkmyh2] { background: var(--color-warning-tint); border: 1px solid var(--color-warning-tint-border); border-radius: var(--radius-sm); padding: 10px 14px; font-size: var(--text-caption1); color: var(--color-warning); margin: 0 var(--space-5) var(--space-3); }
.edit-modal-foot[b-8klzpkmyh2] { display: flex; justify-content: flex-end; gap: var(--space-2); padding: var(--space-3) var(--space-5); border-top: 1px solid var(--color-border-light); }
.edit-cancel-btn[b-8klzpkmyh2] { padding: 7px 16px; border: 1px solid var(--color-border); border-radius: var(--radius-sm); background: var(--color-white); color: var(--color-navy); font-size: var(--text-subhead); cursor: pointer; }
.edit-save-btn[b-8klzpkmyh2] { padding: 7px 16px; border: none; border-radius: var(--radius-sm); background: color-mix(in srgb, var(--color-teal) 55%, var(--color-navy)); color: var(--color-white); font-size: var(--text-subhead); font-weight: var(--font-medium); cursor: pointer; }
.edit-save-btn:hover[b-8klzpkmyh2] { background: color-mix(in srgb, var(--color-teal) 45%, var(--color-navy)); }
.edit-save-btn:disabled[b-8klzpkmyh2] { opacity: .55; cursor: default; }

/* Feature 054: blast-radius warning when re-mapping a documented role that shares an amalgamated
   PDF-only role. Deliberately loud — splitting a group silently is the failure this exists to stop. */
.remap-warn[b-8klzpkmyh2] {
    margin: 0 20px 4px;
    padding: 12px 14px;
    border: 1px solid var(--color-warning-tint-border);
    border-left: 3px solid var(--color-warning);
    border-radius: 6px;
    background: var(--color-warning-tint);
}

.remap-warn-head[b-8klzpkmyh2] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--color-warning);
}

.remap-warn-icon[b-8klzpkmyh2] {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--color-warning);
    color: var(--color-white);
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
}

.remap-warn-body[b-8klzpkmyh2] {
    margin: 8px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--color-text-secondary);
}

.remap-warn-list[b-8klzpkmyh2] {
    margin: 8px 0 0;
    padding: 0 0 0 18px;
    max-height: 96px;
    overflow-y: auto;
    font-size: 12px;
    color: var(--color-text-secondary);
}

.remap-warn-name[b-8klzpkmyh2] {
    font-weight: 600;
    color: var(--color-text-primary);
}

.remap-warn-count[b-8klzpkmyh2] {
    color: var(--color-text-secondary);
}

.remap-warn-choice[b-8klzpkmyh2] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-primary);
    cursor: pointer;
}

.remap-warn-note[b-8klzpkmyh2] {
    margin: 6px 0 0 24px;
    font-size: 12px;
    color: var(--color-text-secondary);
}
/* /Components/ScLandscapePanel.razor.rz.scp.css */
/* Extracted SC landscape panel (feature 051 issue 7). Tier colours mirror the CNOOC SC Definitions
   (SC-5 red → SC-0 grey). Scoped to this component; used on Change Control + the Safety Criticality view. */
.scl[b-4w15ecc0ef] {
    background: var(--v21-white, #fff);
    border: 1px solid var(--v21-border, #e2e8f0);
    border-radius: 10px;
    padding: 20px 22px;
    margin-bottom: 24px;
}

.scl-head[b-4w15ecc0ef] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-bottom: 14px;
}

.scl-title[b-4w15ecc0ef] {
    font-family: var(--font-heading, inherit);
    font-size: 1.05rem;
    font-weight: var(--font-medium, 500);
    color: var(--color-navy, #0f2942);
    margin: 0;
}

.scl-stats[b-4w15ecc0ef] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 13px;
    color: var(--color-service-grey, #64748b);
}

.scl-stat strong[b-4w15ecc0ef] {
    color: var(--color-navy, #0f2942);
    font-weight: var(--font-medium, 600);
}

.scl-stat.muted strong[b-4w15ecc0ef] {
    color: var(--color-service-grey, #64748b);
}

.scl-bars[b-4w15ecc0ef] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.scl-row[b-4w15ecc0ef] {
    display: grid;
    grid-template-columns: 52px minmax(120px, 1fr) minmax(0, 3fr) 44px;
    align-items: center;
    gap: 12px;
}

.scl-pill[b-4w15ecc0ef] {
    font-size: 11px;
    font-weight: 700;
    color: var(--color-dark-bg);
    text-align: center;
    padding: 2px 0;
    border-radius: 5px;
    letter-spacing: .02em;
}

.scl-tier[b-4w15ecc0ef] {
    font-size: 13px;
    color: var(--color-navy, #0f2942);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.scl-track[b-4w15ecc0ef] {
    height: 14px;
    background: var(--v21-soft, #f1f5f9);
    border-radius: 7px;
    overflow: hidden;
}

.scl-fill[b-4w15ecc0ef] {
    height: 100%;
    border-radius: 7px;
    min-width: 2px;
    transition: width 200ms ease;
}

.scl-count[b-4w15ecc0ef] {
    font-size: 13px;
    font-weight: var(--font-medium, 600);
    color: var(--color-navy, #0f2942);
    text-align: right;
}

/* Tier palette — CNOOC SC Definitions. */
.sc-5[b-4w15ecc0ef] { background: #F87171; }
.sc-4[b-4w15ecc0ef] { background: #FB923C; }
.sc-3[b-4w15ecc0ef] { background: #FBBF24; }
.sc-2[b-4w15ecc0ef] { background: #34D399; }
.sc-1[b-4w15ecc0ef] { background: #60A5FA; }
.sc-0[b-4w15ecc0ef] { background: #9CA3AF; }

@media (max-width: 640px) {
    .scl-row[b-4w15ecc0ef] {
        grid-template-columns: 48px minmax(0, 2fr) 40px;
    }
    .scl-tier[b-4w15ecc0ef] {
        display: none;
    }
}
/* /Components/SettingsActivity.razor.rz.scp.css */
.settings-activity[b-ukfylsyohv] {
    min-width: 0;
}

.settings-activity-header[b-ukfylsyohv] {
    margin-bottom: var(--space-4);
}

.settings-activity-header h2[b-ukfylsyohv] {
    margin: 0 0 var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-title2);
}

.settings-activity-header p[b-ukfylsyohv] {
    margin: 0;
    color: var(--color-service-grey);
}

.settings-activity-feed[b-ukfylsyohv] {
    margin: 0;
    padding: 0;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-white);
    list-style: none;
}

.settings-activity-feed li[b-ukfylsyohv] {
    display: grid;
    grid-template-columns: minmax(7rem, auto) minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4);
    border-bottom: 1px solid var(--color-border-light);
}

.settings-activity-feed li:last-child[b-ukfylsyohv] {
    border-bottom: 0;
}

.settings-activity-action[b-ukfylsyohv] {
    justify-self: start;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-full);
    color: var(--color-service-grey);
    background: var(--color-ice-blue);
    font-size: var(--text-caption1);
    font-weight: 600;
}

.settings-activity-detail[b-ukfylsyohv] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: var(--space-1);
}

.settings-activity-target[b-ukfylsyohv],
.settings-activity-snippet[b-ukfylsyohv],
.settings-activity-metadata[b-ukfylsyohv] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-activity-target[b-ukfylsyohv] {
    color: var(--color-navy);
    font-weight: 600;
}

a.settings-activity-target:hover[b-ukfylsyohv] {
    color: var(--color-blue);
}

.settings-activity-snippet[b-ukfylsyohv],
.settings-activity-metadata[b-ukfylsyohv],
.settings-activity-feed time[b-ukfylsyohv] {
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.settings-activity-metadata[b-ukfylsyohv] {
    color: var(--color-service-grey);
}

.settings-activity-feed time[b-ukfylsyohv] {
    white-space: nowrap;
}

@media (max-width: 700px) {
    .settings-activity-feed li[b-ukfylsyohv] {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .settings-activity-action[b-ukfylsyohv] {
        grid-column: 1 / -1;
    }
}
/* /Components/SettingsArchived.razor.rz.scp.css */
.settings-archived[b-zpu6c9n5de] {
    min-width: 0;
}

.settings-archived-header[b-zpu6c9n5de] {
    margin-bottom: var(--space-4);
}

.settings-archived-header h2[b-zpu6c9n5de] {
    margin: 0 0 var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-title2);
}

.settings-archived-header p[b-zpu6c9n5de],
.settings-archived-summary p[b-zpu6c9n5de] {
    margin: 0;
    color: var(--color-service-grey);
}

.settings-archived-summary[b-zpu6c9n5de] {
    padding: var(--space-8);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-white);
}

.settings-archived-summary[b-zpu6c9n5de] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
}

.settings-archived-summary strong[b-zpu6c9n5de] {
    display: block;
    margin-bottom: var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-title3);
}

.settings-archived-summary .btn[b-zpu6c9n5de] {
    min-width: 44px;
    min-height: 44px;
}

@media (max-width: 700px) {
    .settings-archived-summary[b-zpu6c9n5de] {
        align-items: flex-start;
        flex-direction: column;
    }
}
/* /Components/SettingsJobs.razor.rz.scp.css */
.settings-jobs[b-e3nzog95kn] {
    min-width: 0;
}

.settings-jobs-header[b-e3nzog95kn] {
    margin-bottom: var(--space-4);
}

.settings-jobs-header h2[b-e3nzog95kn] {
    margin: 0 0 var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-title2);
}

.settings-jobs-header p[b-e3nzog95kn] {
    margin: 0;
    color: var(--color-service-grey);
}

.settings-jobs-action-error[b-e3nzog95kn] {
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-error);
    border-radius: var(--radius-sm);
    color: var(--color-error);
    background: var(--color-error-light);
}

.settings-jobs-table-wrap[b-e3nzog95kn] {
    overflow-x: auto;
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-white);
}

.settings-jobs-table[b-e3nzog95kn] {
    width: 100%;
    border-collapse: collapse;
    color: var(--color-navy);
}

.settings-jobs-table th[b-e3nzog95kn],
.settings-jobs-table td[b-e3nzog95kn] {
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--color-border-light);
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

.settings-jobs-table th[b-e3nzog95kn] {
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.settings-jobs-table tr:last-child td[b-e3nzog95kn] {
    border-bottom: 0;
}

.settings-jobs-name[b-e3nzog95kn] {
    display: block;
    max-width: 22rem;
    overflow: hidden;
    font-weight: 600;
    text-overflow: ellipsis;
}

.settings-jobs-failure-badge[b-e3nzog95kn] {
    display: inline-flex;
    align-items: center;
    min-height: 1.5rem;
    padding: 0 var(--space-2);
    border-radius: var(--radius-full);
    color: var(--color-error);
    background: var(--color-error-light);
    font-size: var(--text-caption1);
    font-weight: 600;
}

.settings-jobs-action[b-e3nzog95kn] {
    text-align: right;
}

.settings-jobs-action .btn[b-e3nzog95kn] {
    min-width: 44px;
    min-height: 44px;
}

.settings-jobs-sr-only[b-e3nzog95kn] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 700px) {
    .settings-jobs-table th[b-e3nzog95kn],
    .settings-jobs-table td[b-e3nzog95kn] {
        padding: var(--space-3);
    }
}
/* /Components/SettingsMembers.razor.rz.scp.css */
.settings-members[b-2oc3hsx6sx] {
    min-width: 0;
}

.settings-members-header[b-2oc3hsx6sx] {
    margin-bottom: var(--space-5);
}

.settings-members-header h2[b-2oc3hsx6sx] {
    margin: 0 0 var(--space-1);
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-title3);
    font-weight: var(--font-medium);
}

.settings-members-header p[b-2oc3hsx6sx] {
    margin: 0;
    color: var(--color-service-grey);
    font-size: var(--text-subhead);
}

.members-filter-empty[b-2oc3hsx6sx] {
    padding: var(--space-8);
    border: 1px solid var(--color-border-light);
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    background: var(--color-white);
    text-align: center;
}

.members-filter-empty h3[b-2oc3hsx6sx] {
    margin: 0 0 var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-title3);
}

.members-filter-empty p[b-2oc3hsx6sx] {
    margin: 0;
    color: var(--color-service-grey);
}

.members-mutation-error[b-2oc3hsx6sx] {
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-error-tint-border);
    border-radius: var(--radius-sm);
    background: var(--color-error-tint);
    color: var(--color-error);
}

.users-toolbar[b-2oc3hsx6sx] {
    justify-content: flex-start;
    margin-bottom: 0;
}

.users-search[b-2oc3hsx6sx] {
    width: min(360px, 100%);
}

.users-count[b-2oc3hsx6sx] {
    margin-left: auto;
    color: var(--color-service-grey);
    font-size: var(--text-subhead);
    white-space: nowrap;
}

.users-count strong[b-2oc3hsx6sx] {
    color: var(--color-navy);
    font-variant-numeric: tabular-nums;
}

.users-table-wrap[b-2oc3hsx6sx] {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.users-table[b-2oc3hsx6sx] {
    width: 100%;
    min-width: 760px;
}

.users-table tr.disabled[b-2oc3hsx6sx] {
    opacity: .65;
}

.users-table td:first-child[b-2oc3hsx6sx] {
    width: 28%;
    min-width: 220px;
    max-width: 28rem;
    white-space: normal;
}

.settings-member-name[b-2oc3hsx6sx],
.user-email[b-2oc3hsx6sx] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.member-identity[b-2oc3hsx6sx] {
    min-width: 0;
}

.user-email[b-2oc3hsx6sx] {
    margin-top: var(--space-1);
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.access-role-chips[b-2oc3hsx6sx],
.member-actions[b-2oc3hsx6sx] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.access-role-chip[b-2oc3hsx6sx],
.member-status[b-2oc3hsx6sx] {
    display: inline-flex;
    padding: var(--space-1) var(--space-3);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-full);
    background: var(--color-surface);
    color: var(--color-navy);
    font-size: var(--text-caption1);
    white-space: nowrap;
}

.access-no-roles[b-2oc3hsx6sx] {
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

.member-status.active[b-2oc3hsx6sx] {
    border-color: var(--color-success-tint-border);
    background: var(--color-success-tint);
    color: var(--color-success);
}

.member-status.disabled[b-2oc3hsx6sx] {
    color: var(--color-service-grey);
}

.member-actions .btn[b-2oc3hsx6sx] {
    min-height: 44px;
    padding: 0 var(--space-3);
}

@media (max-width: 760px) {
    .users-toolbar[b-2oc3hsx6sx] {
        align-items: stretch;
        padding: var(--space-4);
    }

    .users-search[b-2oc3hsx6sx],
    .users-toolbar .filter-select[b-2oc3hsx6sx] {
        width: 100%;
        max-width: none;
    }

    .users-count[b-2oc3hsx6sx] {
        width: 100%;
        margin-left: 0;
    }

    .users-table-wrap[b-2oc3hsx6sx] {
        overflow: visible;
        border: 0;
        background: transparent;
    }

    .users-table[b-2oc3hsx6sx] {
        min-width: 0;
    }

    .users-table thead[b-2oc3hsx6sx] {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .users-table tbody[b-2oc3hsx6sx],
    .users-table tr[b-2oc3hsx6sx],
    .users-table td[b-2oc3hsx6sx] {
        display: block;
        width: 100%;
    }

    .users-table tbody[b-2oc3hsx6sx] {
        display: grid;
        gap: var(--space-4);
    }

    .users-table tbody tr[b-2oc3hsx6sx] {
        overflow: hidden;
        border: 1px solid var(--color-border-light);
        border-radius: var(--radius-lg);
        background: var(--color-white);
    }

    .users-table tbody tr:nth-child(even)[b-2oc3hsx6sx] {
        background: var(--color-white);
    }

    .users-table td[b-2oc3hsx6sx],
    .users-table td:first-child[b-2oc3hsx6sx] {
        display: grid;
        width: auto;
        box-sizing: border-box;
        grid-template-columns: minmax(88px, 30%) minmax(0, 1fr);
        align-items: start;
        gap: var(--space-3);
        min-width: 0;
        max-width: none;
        padding: var(--space-3) var(--space-4);
        border-bottom: 1px solid var(--color-border-light);
        white-space: normal;
    }

    .users-table td:last-child[b-2oc3hsx6sx] {
        border-bottom: 0;
    }

    .users-table td[b-2oc3hsx6sx]::before {
        content: attr(data-label);
        color: var(--color-service-grey);
        font-size: var(--text-caption1);
        font-weight: var(--font-medium);
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .member-actions[b-2oc3hsx6sx] {
        align-items: stretch;
        flex-direction: column;
    }

    .member-actions .btn[b-2oc3hsx6sx] {
        width: 100%;
        white-space: normal;
    }

    .settings-member-name[b-2oc3hsx6sx],
    .user-email[b-2oc3hsx6sx] {
        white-space: normal;
        overflow-wrap: anywhere;
        text-overflow: clip;
    }
}
/* /Components/SettingsNav.razor.rz.scp.css */
.settings-nav[b-74c26n3ieb] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: var(--space-6);
}

.settings-nav-group[b-74c26n3ieb],
.settings-nav-list[b-74c26n3ieb] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: var(--space-1);
}

.settings-nav-label[b-74c26n3ieb] {
    margin: 0;
    padding: 0 var(--space-3);
    color: var(--color-service-grey);
    font-family: var(--font-primary);
    font-size: var(--text-overline);
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.settings-nav-item[b-74c26n3ieb] {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    align-items: center;
    padding: var(--space-2) var(--space-3);
    border: 0;
    border-radius: var(--radius-sm);
    background: none;
    color: var(--color-service-grey);
    cursor: pointer;
    font-family: var(--font-primary);
    font-size: var(--text-subhead);
    font-weight: 400;
    text-align: left;
    text-decoration: none;
    transition: background var(--duration-fast), color var(--duration-fast);
}

.settings-nav-item:hover[b-74c26n3ieb] {
    background: var(--color-surface);
    color: var(--color-navy);
}

.settings-nav-item.active[b-74c26n3ieb] {
    background: var(--color-surface);
    box-shadow: inset 2px 0 0 var(--color-blue);
    color: var(--color-navy);
    font-weight: 500;
}

.settings-nav-item:focus-visible[b-74c26n3ieb] {
    outline: none;
    box-shadow: var(--shadow-focus);
}

@media (max-width: 900px) {
    .settings-nav[b-74c26n3ieb] {
        flex-direction: row;
        gap: 0;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        border-bottom: 1px solid var(--color-border-light);
        scrollbar-width: thin;
    }

    .settings-nav-group[b-74c26n3ieb],
    .settings-nav-list[b-74c26n3ieb] {
        display: contents;
    }

    .settings-nav-label[b-74c26n3ieb] {
        display: none;
    }

    .settings-nav-item[b-74c26n3ieb] {
        width: auto;
        min-height: 44px;
        flex: 0 0 auto;
        border-radius: 0;
        white-space: nowrap;
    }

    .settings-nav-item.active[b-74c26n3ieb] {
        background: none;
        box-shadow: inset 0 -2px 0 var(--color-blue);
    }

    .settings-nav-item.active:focus-visible[b-74c26n3ieb] {
        outline: 2px solid var(--color-blue);
        outline-offset: -4px;
        box-shadow: inset 0 -2px 0 var(--color-blue);
    }
}
/* /Components/SettingsRoles.razor.rz.scp.css */
.settings-roles[b-2u7rxfqrtl] {
    min-width: 0;
}

.settings-roles-header[b-2u7rxfqrtl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-5);
    margin-bottom: var(--space-5);
}

.settings-roles-header h2[b-2u7rxfqrtl] {
    margin: 0 0 var(--space-1);
    color: var(--color-navy);
    font-family: var(--font-heading);
    font-size: var(--text-title3);
    font-weight: var(--font-medium);
}

.settings-roles-header p[b-2u7rxfqrtl] {
    margin: 0;
    color: var(--color-service-grey);
    font-size: var(--text-subhead);
}

.settings-roles-header .btn[b-2u7rxfqrtl],
.roles-archived-toggle[b-2u7rxfqrtl] {
    min-height: 44px;
}

.roles-archived-toggle[b-2u7rxfqrtl] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
    color: var(--color-navy);
    font-size: var(--text-subhead);
    cursor: pointer;
}

.roles-archived-toggle input[b-2u7rxfqrtl] {
    width: 18px;
    height: 18px;
    accent-color: var(--color-navy);
}

.roles-notice[b-2u7rxfqrtl] {
    margin-bottom: var(--space-4);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-error-tint-border);
    border-radius: var(--radius-md);
    background: var(--color-error-tint);
    color: var(--color-error);
}

.access-confirm-overlay[b-2u7rxfqrtl] {
    position: fixed;
    inset: 0;
    z-index: 310;
    display: grid;
    place-items: center;
    padding: var(--space-4);
    background: var(--clv-color-overlay);
}

.access-confirm[b-2u7rxfqrtl] {
    width: min(480px, 100%);
    padding: var(--space-6);
    border-radius: var(--radius-xl);
    background: var(--color-white);
    box-shadow: var(--shadow-lg);
}

.access-confirm h3[b-2u7rxfqrtl] {
    margin: 0 0 var(--space-3);
    color: var(--color-navy);
    font-size: var(--text-title3);
}

.access-confirm p[b-2u7rxfqrtl] {
    margin: 0;
    color: var(--color-service-grey);
}

.access-confirm-actions[b-2u7rxfqrtl] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-3);
    margin-top: var(--space-6);
}

.access-confirm-actions .btn[b-2u7rxfqrtl] {
    min-height: 44px;
}

.btn-danger[b-2u7rxfqrtl] {
    border: 2px solid var(--color-blue);
    background: var(--color-deep-navy);
    color: var(--color-white);
}

.btn-danger:hover[b-2u7rxfqrtl] {
    background: var(--color-navy);
}

@media (max-width: 427px) {
    .settings-roles-header[b-2u7rxfqrtl] {
        align-items: stretch;
        flex-direction: column;
    }

    .access-confirm-actions[b-2u7rxfqrtl] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .settings-roles-header .btn[b-2u7rxfqrtl],
    .access-confirm-actions .btn[b-2u7rxfqrtl] {
        width: 100%;
    }
}
/* /Components/SettingsShell.razor.rz.scp.css */
.settings-shell-grid[b-dzjy7tc558] {
    display: grid;
    grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
    align-items: start;
    gap: var(--space-6);
}

.settings-shell-content[b-dzjy7tc558] {
    min-width: 0;
}

@media (max-width: 900px) {
    .settings-shell-grid[b-dzjy7tc558] {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--space-6);
    }
}
/* /Components/SettingsTabFrame.razor.rz.scp.css */
.settings-tab-frame[b-e3glkuxjm6] {
    min-width: 0;
}

.settings-tab-frame-loading[b-e3glkuxjm6] {
    display: grid;
    gap: var(--space-3);
}

.settings-tab-frame-loading span[b-e3glkuxjm6] {
    height: 4rem;
    border-radius: var(--radius-sm);
    background: linear-gradient(90deg, var(--color-surface), var(--color-ice-blue), var(--color-surface));
    background-size: 200% 100%;
    animation: settings-tab-frame-pulse-b-e3glkuxjm6 1.4s ease-in-out infinite;
}

.settings-tab-frame-state[b-e3glkuxjm6] {
    padding: var(--space-8);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-lg);
    background: var(--color-white);
}

.settings-tab-frame-state h2[b-e3glkuxjm6],
.settings-tab-frame-state h3[b-e3glkuxjm6] {
    margin: 0 0 var(--space-2);
    color: var(--color-navy);
    font-size: var(--text-title3);
}

.settings-tab-frame-state p[b-e3glkuxjm6] {
    margin: 0 0 var(--space-4);
    color: var(--color-service-grey);
}

.settings-tab-frame-state p:last-child[b-e3glkuxjm6] {
    margin-bottom: 0;
}

.settings-tab-frame-state .btn[b-e3glkuxjm6],
.settings-tab-frame-pager .btn[b-e3glkuxjm6] {
    min-width: 44px;
    min-height: 44px;
}

.settings-tab-frame-denied[b-e3glkuxjm6] {
    border-color: var(--color-warning);
}

.settings-tab-frame-error[b-e3glkuxjm6] {
    border-color: var(--color-error);
}

.settings-tab-frame-empty[b-e3glkuxjm6] {
    text-align: center;
}

.settings-tab-frame-pager[b-e3glkuxjm6] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-3);
    margin-top: var(--space-4);
    color: var(--color-service-grey);
    font-size: var(--text-caption1);
}

@keyframes settings-tab-frame-pulse-b-e3glkuxjm6 {
    from {
        background-position: 100% 0;
    }

    to {
        background-position: -100% 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .settings-tab-frame-loading span[b-e3glkuxjm6] {
        animation: none;
    }
}
/* /Pages/ReviewQueue.razor.rz.scp.css */
/* Review Queue v5 (feature 022) styles live in the global stylesheet
   wwwroot/css/review-v5.css (rq-/rqnav- prefixed) so markup emitted from
   @code render fragments is reached. This scoped file is intentionally empty. */