@import '_content/Aderis.Common.Blazor.Components/Aderis.Common.Blazor.Components.ecmuddk7ht.bundle.scp.css';

/* /Components/Features/DeviceTemplates/DeploymentTemplateDeviceEditorDialog.razor.rz.scp.css */
.dtde-tabs[b-n1rsdwlfm2] {
    margin-bottom: 0.75rem;
}

.dtde-body[b-n1rsdwlfm2] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ── General tab grid ── */
.dtde-grid[b-n1rsdwlfm2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

.dtde-span2[b-n1rsdwlfm2] {
    grid-column: 1 / -1;
}

.dtde-toggles[b-n1rsdwlfm2] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    align-items: center;
    padding-top: 0.25rem;
}

/* ── Comms tab sub-grids ── */
.dtde-comms-4col[b-n1rsdwlfm2] {
    display: grid;
    grid-template-columns: 25% 1fr 1fr 1fr;
    gap: 0.75rem;
}

.dtde-comms-2-1-1[b-n1rsdwlfm2] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 0.75rem;
}

/* ── Parameters table ── */
.dtde-params-table[b-n1rsdwlfm2] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.dtde-params-table th[b-n1rsdwlfm2] {
    text-align: left;
    font-weight: 600;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text-muted);
}

.dtde-params-col-name[b-n1rsdwlfm2] {
    width: 55%;
}

.dtde-params-name[b-n1rsdwlfm2] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--app-border);
}

.dtde-params-required[b-n1rsdwlfm2] {
    color: var(--app-danger, var(--aderis-danger));
    margin-left: 0.15rem;
}

.dtde-params-unit[b-n1rsdwlfm2] {
    color: var(--app-text-muted);
    font-size: 0.72rem;
    margin-left: 0.25rem;
}

.dtde-params-value-cell[b-n1rsdwlfm2] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--app-border);
}

.dtde-params-input[b-n1rsdwlfm2],
.dtde-params-select[b-n1rsdwlfm2] {
    width: 100%;
    padding: 0.3rem 0.5rem;
    border: 1px solid var(--app-border);
    border-radius: 6px;
    background: var(--app-surface);
    color: var(--app-text);
    font-size: 0.8rem;
}

/* Inline boolean toggle inside the params table (ported from the source's toggle-switch). */
.dtde-toggle-switch[b-n1rsdwlfm2] {
    position: relative;
    display: inline-flex;
    width: 36px;
    height: 20px;
    cursor: pointer;
}

.dtde-toggle-switch input[b-n1rsdwlfm2] {
    opacity: 0;
    width: 0;
    height: 0;
}

.dtde-toggle-slider[b-n1rsdwlfm2] {
    position: absolute;
    inset: 0;
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 999px;
    transition: background 0.15s ease;
}

.dtde-toggle-slider[b-n1rsdwlfm2]::before {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    left: 2px;
    top: 2px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.15s ease;
}

.dtde-toggle-switch input:checked + .dtde-toggle-slider[b-n1rsdwlfm2] {
    background: var(--app-accent, var(--aderis-primary));
}

.dtde-toggle-switch input:checked + .dtde-toggle-slider[b-n1rsdwlfm2]::before {
    transform: translateX(16px);
}
/* /Components/Features/DeviceTemplates/DeploymentTemplateEditorDialog.razor.rz.scp.css */
.dte-tabs[b-j8eiclwjse] {
    margin-bottom: 0.75rem;
}

.dte-body[b-j8eiclwjse] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.dte-error[b-j8eiclwjse] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    color: var(--app-warning);
    margin-bottom: 0.25rem;
}

.dte-name-row[b-j8eiclwjse] {
    margin-bottom: 0.25rem;
}

.dte-grow[b-j8eiclwjse] {
    flex: 1 1 0;
}

/* ── Slot groups ── */
.dte-slot-group[b-j8eiclwjse] {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 0.75rem;
}

.dte-slot-header[b-j8eiclwjse] {
    margin-bottom: 0.5rem;
}

.dte-slot-title[b-j8eiclwjse] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 600;
}

.dte-slot-icon[b-j8eiclwjse] {
    display: inline-flex;
    width: 1rem;
    height: 1rem;
}

.dte-slot-icon svg[b-j8eiclwjse] {
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.dte-slot-count[b-j8eiclwjse] {
    font-weight: 400;
    color: var(--app-text-muted);
    font-size: 0.65rem;
    margin-left: 0.15rem;
}

.dte-slot-empty[b-j8eiclwjse] {
    font-size: 0.75rem;
    color: var(--app-text-muted);
    font-style: italic;
    padding: 0.25rem 0;
}

.dte-device-row[b-j8eiclwjse] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid var(--app-border);
    padding: 0.4rem 0;
}

.dte-device-info[b-j8eiclwjse] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.78rem;
}

.dte-device-name[b-j8eiclwjse] {
    font-weight: 500;
}

.dte-device-meta[b-j8eiclwjse] {
    color: var(--app-text-muted);
}

.dte-device-ip[b-j8eiclwjse] {
    font-family: var(--app-monospace, monospace);
    font-size: 0.7rem;
    color: var(--app-text-muted);
}

.dte-divider[b-j8eiclwjse] {
    color: var(--app-text-muted);
    opacity: 0.5;
}

/* ── Parameters table (meta params) ── */
.dte-params-table[b-j8eiclwjse] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.dte-params-table th[b-j8eiclwjse] {
    text-align: left;
    font-weight: 600;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text-muted);
}

.dte-params-col-name[b-j8eiclwjse] {
    width: 55%;
}

.dte-params-name[b-j8eiclwjse] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--app-border);
}

.dte-params-unit[b-j8eiclwjse] {
    color: var(--app-text-muted);
    font-size: 0.72rem;
    margin-left: 0.25rem;
}

.dte-params-value-cell[b-j8eiclwjse] {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--app-border);
}

.dte-params-input[b-j8eiclwjse],
.dte-params-select[b-j8eiclwjse] {
    width: 100%;
    padding: 0.3rem 0.5rem;
    border: 1px solid var(--app-border);
    border-radius: 6px;
    background: var(--app-surface);
    color: var(--app-text);
    font-size: 0.8rem;
}

/* Inline boolean toggle inside the params table (ported from the source's toggle-switch). */
.dte-toggle-switch[b-j8eiclwjse] {
    position: relative;
    display: inline-flex;
    width: 36px;
    height: 20px;
    cursor: pointer;
}

.dte-toggle-switch input[b-j8eiclwjse] {
    opacity: 0;
    width: 0;
    height: 0;
}

.dte-toggle-slider[b-j8eiclwjse] {
    position: absolute;
    inset: 0;
    background: var(--app-surface-muted);
    border: 1px solid var(--app-border);
    border-radius: 999px;
    transition: background 0.15s ease;
}

.dte-toggle-slider[b-j8eiclwjse]::before {
    content: "";
    position: absolute;
    width: 14px;
    height: 14px;
    left: 2px;
    top: 2px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.15s ease;
}

.dte-toggle-switch input:checked + .dte-toggle-slider[b-j8eiclwjse] {
    background: var(--app-accent, var(--aderis-primary));
}

.dte-toggle-switch input:checked + .dte-toggle-slider[b-j8eiclwjse]::before {
    transform: translateX(16px);
}
/* /Components/Features/Equipment/DeviceTypeTree.razor.rz.scp.css */
.dtt-card[b-2t15yeqnkx] {
    border: 1px solid var(--aderis-border);
    border-radius: 12px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.dtt-legacy-card[b-2t15yeqnkx] {
    border-color: rgba(var(--aderis-red-rgb), 0.3);
}

.dtt-header[b-2t15yeqnkx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.85rem 1rem;
    background: var(--aderis-card-header);
    border: none;
    cursor: pointer;
    text-align: left;
    color: var(--aderis-text);
}

.dtt-title[b-2t15yeqnkx] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.dtt-title h4[b-2t15yeqnkx] {
    margin: 0;
    font-size: 1rem;
}

.dtt-icon[b-2t15yeqnkx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}

.dtt-icon[b-2t15yeqnkx]  svg {
    width: 100%;
    height: 100%;
    fill: var(--aderis-text);
}

.dtt-body[b-2t15yeqnkx] {
    padding: 1.25rem;
}

.dtt-empty-inline[b-2t15yeqnkx] {
    padding: 1.5rem;
    text-align: center;
    color: var(--aderis-text-muted);
    font-size: 0.85rem;
}

.dtt-table[b-2t15yeqnkx] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.dtt-table th[b-2t15yeqnkx],
.dtt-table td[b-2t15yeqnkx] {
    padding: 0.5rem 0.6rem;
    border-bottom: 1px solid var(--aderis-border);
    text-align: left;
}

.dtt-table th[b-2t15yeqnkx] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--aderis-text-muted);
}

.dtt-center[b-2t15yeqnkx] {
    text-align: center;
}

.dtt-mono[b-2t15yeqnkx] {
    font-family: monospace;
    font-size: 0.8rem;
    color: var(--aderis-text-muted);
}

.dtt-muted[b-2t15yeqnkx] {
    font-size: 0.82rem;
    color: var(--aderis-text-muted);
}

.dtt-purple[b-2t15yeqnkx] {
    color: var(--aderis-purple);
}

.dtt-divider[b-2t15yeqnkx] {
    color: var(--aderis-text-muted);
    opacity: 0.5;
}

.dtt-badge[b-2t15yeqnkx] {
    margin-left: 0.4rem;
}

.dtt-count[b-2t15yeqnkx] {
    display: inline-block;
    min-width: 1.2rem;
    padding: 0.1rem 0.4rem;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    text-align: center;
}

.dtt-count--green[b-2t15yeqnkx] {
    background: rgba(var(--aderis-green-rgb), 0.18);
    color: var(--aderis-clean-green);
}

.dtt-count--grey[b-2t15yeqnkx] {
    background: var(--aderis-ash);
    color: var(--aderis-text-muted);
}
/* /Components/Features/Equipment/EquipmentCatalogDialogs.razor.rz.scp.css */
.ecd-form-grid[b-h9h8dbv6j2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.ecd-select[b-h9h8dbv6j2] {
    width: 100%;
    padding: 0.45rem 0.6rem;
    background: var(--aderis-surface-2);
    color: var(--aderis-text);
    border: 1px solid var(--aderis-border);
    border-radius: 8px;
    font-size: 0.85rem;
}

.ecd-alert[b-h9h8dbv6j2] {
    padding: 0.6rem 0.85rem;
    margin-bottom: 1rem;
    border-radius: 8px;
    background: rgba(var(--aderis-danger-rgb), 0.12);
    color: var(--aderis-danger);
    font-size: 0.85rem;
}

.ecd-muted[b-h9h8dbv6j2] {
    font-size: 0.82rem;
    color: var(--aderis-text-muted);
}

.ecd-reassign-name[b-h9h8dbv6j2] {
    margin-bottom: 1rem;
}
/* /Components/Features/Equipment/EquipmentMediaBrowser.razor.rz.scp.css */
.mb-tabs[b-jmfy916jsd] {
    display: flex;
    gap: 0.25rem;
    padding: 0 1rem;
    border-bottom: 1px solid var(--aderis-ash);
}

.mb-tab[b-jmfy916jsd] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.6rem 0.9rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    color: var(--aderis-text-muted);
    cursor: pointer;
    font-size: 0.85rem;
}

.mb-tab.active[b-jmfy916jsd] {
    color: var(--aderis-text);
    border-bottom-color: var(--aderis-primary);
}

.mb-count[b-jmfy916jsd] {
    font-size: 0.7rem;
    background: var(--aderis-ash);
    border-radius: 999px;
    padding: 0.05rem 0.4rem;
}

.mb-body[b-jmfy916jsd] {
    padding: 1rem;
}

.mb-addform[b-jmfy916jsd] {
    margin-bottom: 1rem;
}

.mb-addform-col[b-jmfy916jsd] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.mb-cat[b-jmfy916jsd] {
    flex: 0 0 200px;
}

.mb-grow[b-jmfy916jsd] {
    flex: 1 1 auto;
}

.mb-staged[b-jmfy916jsd] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.mb-staged-row[b-jmfy916jsd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.mb-staged-name[b-jmfy916jsd] {
    flex: 1 1 auto;
    font-size: 0.8rem;
}

.mb-size[b-jmfy916jsd] {
    font-size: 0.75rem;
    color: var(--aderis-text-muted);
    white-space: nowrap;
}

.mb-staged-actions[b-jmfy916jsd] {
    margin-top: 0.5rem;
}

.mb-list[b-jmfy916jsd] {
    display: flex;
    flex-direction: column;
}

.mb-item[b-jmfy916jsd] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.25rem;
    border-bottom: 1px solid var(--aderis-ash);
    gap: 0.75rem;
}

.mb-item-info[b-jmfy916jsd] {
    min-width: 0;
}

.mb-item-name[b-jmfy916jsd] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 600;
    font-size: 0.85rem;
}

.mb-item-meta[b-jmfy916jsd] {
    margin-top: 0.2rem;
}

.mb-item-right[b-jmfy916jsd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
}

.mb-item-details[b-jmfy916jsd] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    font-size: 0.72rem;
    color: var(--aderis-text-muted);
}

.mb-item-actions[b-jmfy916jsd] {
    display: flex;
    align-items: center;
}

/* AI extraction badge states */
.mb-ai[b-jmfy916jsd] {
    font-size: 0.55rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.05rem 0.3rem;
    border-radius: 4px;
    line-height: 1.3;
}

.mb-ai-cached[b-jmfy916jsd] {
    color: var(--aderis-purple);
    background: rgba(109, 74, 255, 0.15);
    border: 1px solid rgba(109, 74, 255, 0.35);
}

.mb-ai-queued[b-jmfy916jsd] {
    color: var(--aderis-purple);
    background: rgba(109, 74, 255, 0.08);
    border: 1px dashed rgba(109, 74, 255, 0.4);
    opacity: 0.75;
}

.mb-ai-btn[b-jmfy916jsd] {
    color: var(--aderis-danger);
    background: transparent;
    border: 1px dashed var(--aderis-danger);
    cursor: pointer;
}

.mb-ai-clear[b-jmfy916jsd] {
    font-size: 0.5rem;
    font-weight: 700;
    color: var(--aderis-danger);
    background: transparent;
    border: 1px solid rgba(238, 74, 99, 0.35);
    border-radius: 3px;
    padding: 0 0.2rem;
    cursor: pointer;
    line-height: 1.2;
}
/* /Components/Features/Equipment/LegacyEquipmentImportPanel.razor.rz.scp.css */
/* Legacy v3 import panel — scoped layout ported from ManageEquipment's former inline styles.
   All spacing/colour lives here; the markup carries no inline style= attributes. */

.lei-card[b-fb4g1fj1lo] {
    border: 1px solid rgba(139, 92, 246, 0.3);
    border-radius: 12px;
    background: var(--app-surface, #fff);
    margin-bottom: 1rem;
    overflow: hidden;
}

.lei-card--loading[b-fb4g1fj1lo] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1rem;
}

/* ── Header (collapsible toggle) ─────────────────────────────── */
.lei-header[b-fb4g1fj1lo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.85rem 1rem;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
}

.lei-header-content[b-fb4g1fj1lo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.lei-header-icon[b-fb4g1fj1lo] {
    color: var(--acuity-purple);
}

.lei-title[b-fb4g1fj1lo] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
}

.lei-chevron[b-fb4g1fj1lo] {
    color: var(--app-text-muted);
}

.lei-ignored-note[b-fb4g1fj1lo] {
    font-size: 0.7rem;
    color: var(--app-text-muted);
    margin-left: 0.25rem;
}

/* ── Badges ──────────────────────────────────────────────────── */
.lei-badge[b-fb4g1fj1lo] {
    font-size: 0.7rem;
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    white-space: nowrap;
}

.lei-badge--amber[b-fb4g1fj1lo] {
    background: rgba(245, 158, 11, 0.15);
    color: #f59e0b;
    margin-left: 0.5rem;
}

.lei-badge--grey[b-fb4g1fj1lo] {
    background: var(--app-surface-muted, rgba(148, 163, 184, 0.15));
    color: var(--app-text-muted);
}

/* ── Body / collapse ─────────────────────────────────────────── */
.lei-body[b-fb4g1fj1lo] {
    padding: 0 1rem 1rem;
}

.lei-collapsed[b-fb4g1fj1lo] {
    display: none;
}

.lei-section[b-fb4g1fj1lo] {
    display: flex;
    flex-direction: column;
}

.lei-toolbar[b-fb4g1fj1lo] {
    margin-bottom: 0.75rem;
}

/* ── Manufacturer rows ───────────────────────────────────────── */
.lei-mfr-row[b-fb4g1fj1lo] {
    border-top: 1px solid var(--app-border, rgba(148, 163, 184, 0.2));
    padding: 0.4rem 0;
}

.lei-mfr-row--ignored[b-fb4g1fj1lo] {
    opacity: 0.5;
}

.lei-mfr-header[b-fb4g1fj1lo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.lei-spacer[b-fb4g1fj1lo] {
    flex: 1;
    font-size: 0.85rem;
}

.lei-muted-link[b-fb4g1fj1lo] {
    font-size: 0.7rem;
    color: var(--app-text-muted);
}

.lei-undo-link[b-fb4g1fj1lo] {
    font-size: 0.7rem;
    color: #f59e0b;
}

/* ── Model rows ──────────────────────────────────────────────── */
.lei-model-list[b-fb4g1fj1lo] {
    display: flex;
    flex-direction: column;
    padding: 0.35rem 0 0.35rem 1.5rem;
    gap: 0.25rem;
}

.lei-model-row[b-fb4g1fj1lo] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.lei-model-check[b-fb4g1fj1lo] {
    font-family: var(--app-monospace, ui-monospace, monospace);
    font-size: 0.8rem;
}

.lei-model-id[b-fb4g1fj1lo] {
    font-size: 0.7rem;
    color: var(--app-text-muted);
}

/* ── Status line ─────────────────────────────────────────────── */
.lei-status[b-fb4g1fj1lo] {
    margin-top: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: rgba(16, 185, 129, 0.1);
    border-radius: 8px;
    font-size: 0.8rem;
    color: #10b981;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

/* ── Ignored section ─────────────────────────────────────────── */
.lei-ignored-section[b-fb4g1fj1lo] {
    margin-top: 0.75rem;
    border-top: 1px solid var(--app-border, rgba(148, 163, 184, 0.2));
    padding-top: 0.5rem;
}
/* /Components/Features/Equipment/ManageEquipmentPage.razor.rz.scp.css */
.mep-page[b-o6pqm62o4z] {
    padding: 1.5rem;
}

.mep-card[b-o6pqm62o4z] {
    border: 1px solid var(--aderis-border);
    border-radius: 12px;
    background: var(--aderis-card);
    overflow: hidden;
}

.mep-card-header[b-o6pqm62o4z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    background: var(--aderis-card-header);
    border-bottom: 1px solid var(--aderis-border);
}

.mep-card-header h2[b-o6pqm62o4z] {
    margin: 0;
    font-size: 1.1rem;
    letter-spacing: 0.04em;
}

.mep-card-body[b-o6pqm62o4z] {
    padding: 1.25rem;
}

.mep-tab-count[b-o6pqm62o4z] {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0.1rem 0.45rem;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    background: var(--aderis-ash);
}

.mep-tab-toolbar[b-o6pqm62o4z] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1rem;
}
/* /Components/Features/Equipment/ManufacturerTree.razor.rz.scp.css */
.met-card[b-2kodgd46k4] {
    border: 1px solid var(--aderis-border);
    border-radius: 12px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.met-card-header[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.85rem 1rem;
    background: var(--aderis-card-header);
    border: none;
    cursor: pointer;
    text-align: left;
    color: var(--aderis-text);
}

.met-header-content[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.met-header-content h4[b-2kodgd46k4] {
    font-size: 1rem;
    margin: 0;
}

.met-item-count[b-2kodgd46k4] {
    font-size: 0.8rem;
    color: var(--aderis-text-muted);
}

.met-header-actions[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.met-divider[b-2kodgd46k4] {
    color: var(--aderis-text-muted);
    opacity: 0.5;
}

.met-chevron[b-2kodgd46k4] {
    margin-left: 0.35rem;
    color: var(--aderis-text-muted);
}

.met-badge[b-2kodgd46k4] {
    margin-left: 0.4rem;
}

.met-body[b-2kodgd46k4] {
    padding: 1.25rem;
}

.met-inline-form[b-2kodgd46k4] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.met-type-select[b-2kodgd46k4] {
    max-width: 220px;
}

.met-grow[b-2kodgd46k4] {
    flex: 1 1 auto;
    min-width: 180px;
}

.met-select[b-2kodgd46k4] {
    width: 100%;
    padding: 0.45rem 0.6rem;
    background: var(--aderis-surface-2);
    color: var(--aderis-text);
    border: 1px solid var(--aderis-border);
    border-radius: 8px;
    font-size: 0.85rem;
}

.met-table[b-2kodgd46k4] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.met-table th[b-2kodgd46k4],
.met-table td[b-2kodgd46k4] {
    padding: 0.5rem 0.6rem;
    border-bottom: 1px solid var(--aderis-border);
    text-align: left;
}

.met-table th[b-2kodgd46k4] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--aderis-text-muted);
}

.met-center[b-2kodgd46k4] {
    text-align: center;
}

.met-meta-tag[b-2kodgd46k4] {
    color: var(--aderis-blue);
    font-weight: 600;
    font-size: 0.7rem;
    margin-right: 0.3rem;
}

.met-muted[b-2kodgd46k4] {
    font-size: 0.78rem;
    color: var(--aderis-text-muted);
}

.met-count[b-2kodgd46k4] {
    display: inline-block;
    min-width: 1.2rem;
    padding: 0.1rem 0.4rem;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    text-align: center;
    margin-right: 0.25rem;
}

.met-count--blue[b-2kodgd46k4] {
    background: rgba(var(--aderis-blue-rgb), 0.18);
    color: var(--aderis-blue);
}

.met-count--orange[b-2kodgd46k4] {
    background: rgba(var(--aderis-orange-rgb), 0.18);
    color: var(--aderis-orange);
}

.met-count--grey[b-2kodgd46k4] {
    background: var(--aderis-ash);
    color: var(--aderis-text-muted);
}

.met-ai-badge[b-2kodgd46k4] {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    margin-left: 0.35rem;
    padding: 0.1rem 0.4rem;
    border-radius: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    background: rgba(var(--aderis-red-rgb), 0.15);
    color: var(--aderis-red);
}

.met-disabled[b-2kodgd46k4] {
    opacity: 0.5;
}

/* ── Deployment-template section ── */
.met-template-cell[b-2kodgd46k4] {
    padding: 0 !important;
    background: rgba(var(--aderis-on-surface-rgb), 0.02);
}

.met-template-toggle[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0.35rem 0.75rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--aderis-blue);
    font-size: 0.78rem;
    font-weight: 500;
}

.met-template-title[b-2kodgd46k4] {
    color: var(--aderis-blue);
}

.met-template-toggle-right[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--aderis-text);
}

.met-template-body[b-2kodgd46k4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin: 0 0.75rem 0.5rem;
}

.met-template-actions[b-2kodgd46k4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.met-template-item[b-2kodgd46k4] {
    border: 1px solid var(--aderis-border);
    border-radius: 8px;
    padding: 0.75rem;
    background: var(--aderis-card);
}

.met-template-item-head[b-2kodgd46k4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

.met-template-item-toggle[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--aderis-text);
    font-size: 0.85rem;
    text-align: left;
}

.met-template-item-actions[b-2kodgd46k4] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

.met-template-slot[b-2kodgd46k4] {
    margin-top: 0.35rem;
}

.met-template-slot-label[b-2kodgd46k4] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--aderis-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.2rem;
}

.met-template-device[b-2kodgd46k4] {
    display: flex;
    gap: 1rem;
    align-items: center;
    font-size: 0.75rem;
    padding: 0.25rem 0.75rem;
}

.met-template-device-name[b-2kodgd46k4] {
    font-weight: 500;
}
/* /Components/Features/TagMaps/AssignTagMapDialog.razor.rz.scp.css */
.atm-assign-row[b-vjfl2tfs9j] {
    margin-bottom: 1.25rem;
}

/* Assign row: fixed-width device-type filter, the tag-map select takes the rest. */
.atm-filter[b-vjfl2tfs9j] {
    flex: 0 0 34%;
}

.atm-grow[b-vjfl2tfs9j] {
    flex: 1 1 auto;
}

.atm-list[b-vjfl2tfs9j] {
    display: flex;
    flex-direction: column;
}

.atm-row[b-vjfl2tfs9j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--aderis-ash);
}

.atm-meta[b-vjfl2tfs9j] {
    margin-left: 0.5rem;
    font-size: 0.75rem;
    color: var(--aderis-text-muted);
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* MainLayout scoped styles */
/* /Components/Pages/AdtsDocs.razor.rz.scp.css */
/* ::deep twins: this page's markup was split into child components (ADR-0005 size limit), and
   Blazor scoped CSS does not cross a component boundary. Every selector whose class is used by one
   of those children carries a ::deep twin so the rule still reaches it. Selectors used only by this
   component's own markup are left alone. */

/* Scoped styles for the ADTS documentation page. Lifted verbatim from its inline <style> block
   (ADR-0005 size limit; ADR-0028 keeps styling out of markup). */

.adts-layout[b-xdspzcv6z8] { display: flex; min-height: calc(100vh - 80px); margin: -1.5rem -24px -4rem; }

    .adts-sidebar[b-xdspzcv6z8] { width: 260px; min-width: 260px; background: rgba(0,0,0,0.3); border-right: 1px solid var(--app-border); display: flex; flex-direction: column; overflow-y: auto; }
    .adts-sidebar-header[b-xdspzcv6z8] { display: flex; align-items: center; gap: 0.75rem; padding: 1.25rem 1rem; border-bottom: 1px solid var(--app-border); color: rgba(100,180,255,0.95); font-size: 1.4rem; }

    /* ── Sidebar Tabs ──────────────────────────────────────────── */
    .adts-sidebar-tabs[b-xdspzcv6z8] {
        display: flex; gap: 2px; padding: 8px 8px 0; border-bottom: 1px solid var(--app-border); background: rgba(0,0,0,0.15);
    }
    .adts-sidebar-tab[b-xdspzcv6z8] {
        flex: 1; display: flex; align-items: center; justify-content: center; gap: 0.35rem;
        padding: 7px 4px; border: none; background: none; cursor: pointer;
        font-size: 0.68rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase;
        color: var(--app-text-muted); border-bottom: 2px solid transparent; margin-bottom: -1px;
        transition: color 0.2s, border-color 0.2s, background 0.2s;
    }
    .adts-sidebar-tab:hover[b-xdspzcv6z8] { color: var(--app-text); background: rgba(255,255,255,0.03); }
    .adts-sidebar-tab.active[b-xdspzcv6z8] { color: rgba(100,180,255,0.95); border-bottom-color: rgba(100,180,255,0.8); }
    .adts-sidebar-tab i[b-xdspzcv6z8] { font-size: 0.8rem; }
    .adts-sidebar-title[b-xdspzcv6z8] { font-size: 1.1rem; font-weight: 700; letter-spacing: 0.08em; color: rgba(100,180,255,0.95); }
    .adts-sidebar-version[b-xdspzcv6z8] { font-size: 0.7rem; color: var(--app-text-muted); letter-spacing: 0.06em; }
    .adts-sidebar-footer[b-xdspzcv6z8] { margin-top: auto; padding: 1rem; border-top: 1px solid var(--app-border); }
    .adts-back-link[b-xdspzcv6z8] { font-size: 0.82rem; color: var(--app-text-muted); text-decoration: none; display: flex; align-items: center; gap: 0.4rem; }
    .adts-back-link:hover[b-xdspzcv6z8] { color: var(--app-accent); }

    .adts-nav-group[b-xdspzcv6z8] { padding: 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
    .adts-nav-label[b-xdspzcv6z8] { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0.55rem 1rem; border: none; background: transparent; color: var(--app-text-muted); font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.12em; cursor: pointer; transition: all 0.15s ease; }
    .adts-nav-label:hover[b-xdspzcv6z8] { background: rgba(255,255,255,0.03); color: var(--app-heading); }
    .adts-nav-label i[b-xdspzcv6z8] { font-size: 0.6rem; opacity: 0.5; transition: transform 0.15s ease; }
    .adts-nav-label:hover i[b-xdspzcv6z8] { opacity: 0.8; }
    .adts-nav-item[b-xdspzcv6z8] { display: flex; align-items: center; gap: 0.5rem; width: 100%; padding: 0.4rem 1rem; border: none; background: transparent; color: var(--app-text); font-size: 0.82rem; cursor: pointer; transition: all 0.15s ease; text-align: left; }
    .adts-nav-item:hover[b-xdspzcv6z8] { background: rgba(255,255,255,0.05); color: var(--app-heading); }
    .adts-nav-item.active[b-xdspzcv6z8] { background: rgba(56,139,235,0.15); color: rgba(100,180,255,0.95); border-right: 2px solid rgba(56,139,235,0.7); }
    .adts-nav-item i[b-xdspzcv6z8] { font-size: 0.85rem; width: 1.1rem; text-align: center; opacity: 0.7; }
    .adts-nav-item.active i[b-xdspzcv6z8] { opacity: 1; }

    .adts-content[b-xdspzcv6z8] { flex: 1; padding: 2rem 3rem; overflow-y: auto; max-height: calc(100vh - 80px); }                

    .adts-doc h1[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc h1 { font-size: 1.8rem; margin-bottom: 0.5rem; color: var(--app-heading); }
    .adts-doc h2[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc h2 { font-size: 1.15rem; margin: 2rem 0 0.75rem; color: var(--app-heading); border-bottom: 1px solid var(--app-border); padding-bottom: 0.4rem; }
    .adts-doc p[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc p { color: var(--app-text); line-height: 1.6; margin-bottom: 0.75rem; }
    .adts-doc ul[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc ul, .adts-doc ol[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc ol { color: var(--app-text); line-height: 1.8; padding-left: 1.5rem; }
    .adts-doc code[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc code { background: rgba(56,139,235,0.12); color: rgba(140,200,255,1); padding: 0.1rem 0.4rem; border-radius: 4px; font-size: 0.85em; }
    .adts-doc pre code[b-xdspzcv6z8], [b-xdspzcv6z8] .adts-doc pre code { background: transparent; color: inherit; padding: 0; }
    .doc-lead[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-lead { font-size: 1.1rem; color: var(--app-text-muted); margin-bottom: 1.5rem; }

    .doc-info-grid[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-info-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin: 1.5rem 0 2rem; }
    .doc-info-card[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-info-card { background: rgba(255,255,255,0.03); border: 1px solid var(--app-border); border-radius: 14px; padding: 1.25rem; }
    .doc-info-card h3[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-info-card h3 { font-size: 0.95rem; margin: 0.75rem 0 0.4rem; }
    .doc-info-card p[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-info-card p { font-size: 0.85rem; color: var(--app-text-muted); margin: 0; }
    .doc-info-icon[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-info-icon { width: 40px; height: 40px; border-radius: 10px; background: rgba(56,139,235,0.15); color: rgba(100,180,255,0.95); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; }

    .doc-table-container[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-table-container { overflow-x: auto; margin: 0.75rem 0 1.5rem; }
    .doc-table[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-table { width: 100%; border-collapse: collapse; margin: 0.75rem 0 1.5rem; font-size: 0.88rem; }
    .doc-table th[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-table th { text-align: left; padding: 0.6rem 0.75rem; background: rgba(255,255,255,0.04); border-bottom: 1px solid var(--app-border-strong); color: var(--app-heading); font-weight: 600; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; }
    .doc-table td[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-table td { padding: 0.55rem 0.75rem; border-bottom: 1px solid var(--app-border); color: var(--app-text); }
    .doc-table tr:hover td[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-table tr:hover td { background: rgba(255,255,255,0.02); }

    .doc-code-block[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-code-block { background: rgba(0,0,0,0.4); border: 1px solid var(--app-border); border-radius: 12px; overflow: hidden; margin: 0.75rem 0 1.5rem; }
    .doc-code-lang[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-code-lang { padding: 0.3rem 0.75rem; background: rgba(255,255,255,0.04); border-bottom: 1px solid var(--app-border); font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--app-text-muted); }
    .doc-code-block pre[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-code-block pre { margin: 0; padding: 1rem; overflow-x: auto; font-size: 0.82rem; line-height: 1.6; color: rgba(200,220,240,0.9); }

    .doc-callout[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-callout { display: flex; gap: 0.75rem; padding: 1rem 1.25rem; background: rgba(56,139,235,0.08); border: 1px solid rgba(56,139,235,0.25); border-radius: 12px; margin: 1rem 0 1.5rem; color: var(--app-text); font-size: 0.9rem; }
    .doc-callout i[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-callout i { color: rgba(100,180,255,0.8); font-size: 1.1rem; flex-shrink: 0; margin-top: 0.15rem; }

    .doc-diagram[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram { margin: 1.5rem 0; }
    .doc-diagram-row[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-row { display: flex; align-items: center; justify-content: center; gap: 0.5rem; flex-wrap: wrap; }
    .doc-diagram-box[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-box { padding: 0.75rem 1.25rem; border-radius: 10px; font-size: 0.85rem; font-weight: 600; text-align: center; min-width: 130px; }
    .doc-diagram-box.blue[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-box.blue { background: rgba(56,139,235,0.15); border: 1px solid rgba(56,139,235,0.35); color: rgba(100,180,255,0.95); }
    .doc-diagram-box.green[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-box.green { background: rgba(0,177,118,0.15); border: 1px solid rgba(0,177,118,0.35); color: var(--app-accent); }
    .doc-diagram-box.purple[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-box.purple { background: rgba(147,91,247,0.15); border: 1px solid rgba(147,91,247,0.35); color: rgba(180,150,255,0.95); }
    .doc-diagram-box.amber[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-box.amber { background: rgba(255,199,25,0.15); border: 1px solid rgba(255,199,25,0.35); color: var(--app-warning); }
    .doc-diagram-box small[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-box small { font-size: 0.7rem; font-weight: 400; opacity: 0.7; }
    .doc-diagram-arrow[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-diagram-arrow { font-size: 1.3rem; color: var(--app-text-muted); }

    .doc-endpoint-meta[b-xdspzcv6z8] { display: flex; align-items: center; gap: 0.75rem; margin: 0.75rem 0 1rem; padding: 0.6rem 1rem; background: rgba(0,0,0,0.3); border-radius: 8px; border: 1px solid var(--app-border); }
    .doc-method[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-method { padding: 0.2rem 0.55rem; border-radius: 4px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; }
    .doc-method.get[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-method.get { background: rgba(0,177,118,0.2); color: var(--app-accent); }
    .doc-method.post[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-method.post { background: rgba(56,139,235,0.2); color: rgba(100,180,255,0.95); }
    .doc-endpoint-meta code[b-xdspzcv6z8] { background: transparent; color: var(--app-text); font-size: 0.85rem; }

    .doc-steps li[b-xdspzcv6z8], [b-xdspzcv6z8] .doc-steps li { margin-bottom: 0.75rem; }

    .api-endpoint-card[b-xdspzcv6z8], [b-xdspzcv6z8] .api-endpoint-card { background: rgba(255,255,255,0.02); border: 1px solid var(--app-border); border-radius: 12px; padding: 1rem 1.25rem; margin-bottom: 0.75rem; }
    .api-endpoint-card:hover[b-xdspzcv6z8], [b-xdspzcv6z8] .api-endpoint-card:hover { border-color: rgba(56,139,235,0.3); }
    .api-endpoint-header[b-xdspzcv6z8], [b-xdspzcv6z8] .api-endpoint-header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
    .api-endpoint-header code[b-xdspzcv6z8], [b-xdspzcv6z8] .api-endpoint-header code { background: transparent; color: var(--app-heading); font-size: 0.9rem; font-weight: 600; flex: 1; }
    .api-endpoint-card > p[b-xdspzcv6z8], [b-xdspzcv6z8] .api-endpoint-card > p { margin: 0; font-size: 0.85rem; color: var(--app-text-muted); }

    .suggested-prompt[b-xdspzcv6z8], [b-xdspzcv6z8] .suggested-prompt { border-color: rgba(0,177,118,0.3); }
    .suggested-prompt .doc-code-lang[b-xdspzcv6z8], [b-xdspzcv6z8] .suggested-prompt .doc-code-lang { display: flex; align-items: center; justify-content: space-between; background: rgba(0,177,118,0.1); color: var(--app-accent); }
    .copy-prompt-btn[b-xdspzcv6z8], [b-xdspzcv6z8] .copy-prompt-btn { background: rgba(0,177,118,0.15); border: 1px solid rgba(0,177,118,0.3); border-radius: 5px; color: var(--app-accent); padding: 0.2rem 0.5rem; cursor: pointer; font-size: 0.8rem; transition: all 0.15s ease; }
    .copy-prompt-btn:hover[b-xdspzcv6z8], [b-xdspzcv6z8] .copy-prompt-btn:hover { background: rgba(0,177,118,0.3); border-color: rgba(0,177,118,0.5); }
    .copy-prompt-btn.copied[b-xdspzcv6z8], [b-xdspzcv6z8] .copy-prompt-btn.copied { background: rgba(0,177,118,0.35); border-color: rgba(0,177,118,0.6); color: #4ade80; }
    .suggested-prompt pre[b-xdspzcv6z8], [b-xdspzcv6z8] .suggested-prompt pre { white-space: pre-wrap; word-wrap: break-word; }
/* /Components/Pages/AiRegisterDialog.razor.rz.scp.css */
/* Rules this component's own markup needs. Both were scoped to EditTagMap, and a child component cannot match
   a parent's scoped rules (scope is lexical — see the note in EditTagMap.razor.css).

   `.text-input` on the textarea is deliberately absent: it lives in the global app.css. AderisTextInput is not a
   substitute here — it renders an <input> and the library has no multiline variant. */

/* Mirrors Modal's own .aderis-modal-title, which cannot be reused: Modal's sheet is scoped to Modal, so a title
   written in a HeaderContent fragment is stamped with THIS component's scope id, not Modal's. */
.dialog-title-inline[b-zprly1qnn8] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--aderis-text);
    display: inline-flex;
    align-items: center;
}

.ai-spinner[b-zprly1qnn8] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(168, 85, 247, 0.25);
    border-top-color: #a855f7;
    border-radius: 50%;
    animation: ai-reg-spin-b-zprly1qnn8 0.8s linear infinite;
}

@keyframes ai-reg-spin-b-zprly1qnn8 {
    to { transform: rotate(360deg); }
}
/* /Components/Pages/AiTagMapWizard.razor.rz.scp.css */
/* ::deep twins: this page's markup was split into child components (ADR-0005 size limit), and
   Blazor scoped CSS does not cross a component boundary. Every selector whose class is used by one
   of those children carries a ::deep twin so the rule still reaches it. Selectors used only by this
   component's own markup are left alone. */

/* Scoped styles for the AI Tag Map Assistant.

   Lifted verbatim out of the page's inline <style> block (ADR-0005 file-size limit; ADR-0028 keeps page
   styling out of markup). Razor-escaped @@keyframes/@@media are plain @keyframes/@media here.
   Scoped CSS does not cross into child content, so anything targeting markup injected as a MarkupString
   would need ::deep — this page injects none. */

    /* ─── Info Bar ─────────────────────────────────── */
    .info-bar[b-210ckpsilj] {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        padding: 1rem 1.25rem;
        background: var(--app-surface-alt);
        border-radius: 12px;
        border: 1px solid var(--app-border);
        margin-bottom: 1.5rem;
    }

    .info-item[b-210ckpsilj] {
        display: flex;
        flex-direction: column;
        gap: 0.2rem;
    }

    .info-label[b-210ckpsilj] {
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--app-text-muted);
    }

    .info-value[b-210ckpsilj] {
        font-size: 0.95rem;
        color: var(--app-text);
    }

    /* ─── Wizard Steps ────────────────────────────── */
    .wizard-step-panel[b-210ckpsilj] {
        margin-bottom: 1.5rem;
    }

    .step-header[b-210ckpsilj] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin-bottom: 1rem;
    }

    .step-number[b-210ckpsilj] {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 0.85rem;
        border: 2px solid var(--app-border);
        color: var(--app-text-muted);
    }

    .step-number.active[b-210ckpsilj] {
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        border-color: #a855f7;
        color: #fff;
    }

    .step-number.complete[b-210ckpsilj] {
        background: #10b981;
        border-color: #10b981;
        color: #fff;
    }

    .step-header h3[b-210ckpsilj] {
        font-size: 1.1rem;
        margin: 0;
    }

    /* ─── Extraction Progress ─────────────────────── */
    .extraction-progress[b-210ckpsilj] {
        padding: 2rem 1.5rem;
        background: var(--app-surface-alt);
        border-radius: 12px;
        border: 1px solid var(--app-border);
        text-align: center;
    }

    .progress-bar-track[b-210ckpsilj] {
        width: 100%;
        height: 6px;
        background: var(--app-border);
        border-radius: 3px;
        overflow: hidden;
        margin-bottom: 1.5rem;
    }

    .progress-bar-indeterminate[b-210ckpsilj] {
        height: 100%;
        width: 40%;
        background: linear-gradient(90deg, transparent, #7c3aed, #a855f7, transparent);
        border-radius: 3px;
        animation: indeterminate-slide-b-210ckpsilj 1.5s ease-in-out infinite;
    }

    @keyframes indeterminate-slide-b-210ckpsilj {
        0% { transform: translateX(-100%); }
        100% { transform: translateX(350%); }
    }

    /* Step List */
    .step-list[b-210ckpsilj] {
        display: flex;
        flex-direction: column;
        gap: 0.6rem;
        padding: 1rem 0;
        text-align: left;
        max-width: 450px;
        margin: 0 auto;
    }

    .step-item[b-210ckpsilj] {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        font-size: 0.9rem;
        transition: all 0.3s ease;
    }

    .step-item.step-done[b-210ckpsilj] {
        color: #10b981;
    }

    .step-item.step-active[b-210ckpsilj] {
        color: #a855f7;
        font-weight: 600;
    }

    .step-item.step-pending[b-210ckpsilj] {
        color: var(--app-text-muted);
        opacity: 0.5;
    }

    .step-icon[b-210ckpsilj] {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
    }

    .step-icon.done[b-210ckpsilj] {
        color: #10b981;
    }

    .step-icon.pending[b-210ckpsilj] {
        font-size: 0.6rem;
        color: var(--app-text-muted);
    }

    .progress-status[b-210ckpsilj] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.75rem;
        color: #a855f7;
        font-size: 1rem;
        font-weight: 500;
    }

    .ai-spinner[b-210ckpsilj], [b-210ckpsilj] .ai-spinner {
        width: 20px;
        height: 20px;
        border: 3px solid rgba(168, 85, 247, 0.25);
        border-top-color: #a855f7;
        border-radius: 50%;
        animation: ai-spin-b-210ckpsilj 0.8s linear infinite;
    }

    @keyframes ai-spin-b-210ckpsilj {
        to { transform: rotate(360deg); }
    }

    /* ─── Skip AI Link ────────────────────────────── */
    .skip-ai-area[b-210ckpsilj] {
        margin-top: 1.5rem;
        padding-top: 1rem;
        border-top: 1px solid var(--app-border);
        text-align: center;
    }

    .skip-ai-link[b-210ckpsilj] {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.88rem;
        color: var(--app-text-muted);
        text-decoration: none;
        padding: 0.5rem 1rem;
        border-radius: 8px;
        transition: all 0.2s ease;
    }

    .skip-ai-link:hover[b-210ckpsilj] {
        color: var(--app-text);
        background: rgba(255, 255, 255, 0.06);
    }

    .alert-error[b-210ckpsilj] {
        padding: 0.5rem 1rem;
        background: rgba(239, 68, 68, 0.15);
        border: 1px solid rgba(239, 68, 68, 0.4);
        color: #ef4444;
        border-radius: 8px;
        font-size: 0.9rem;
    }

    /* ─── Summary Bar ─────────────────────────────── */
    .summary-bar[b-210ckpsilj] {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 1rem;
        padding: 0.75rem 1rem;
        background: var(--app-surface-alt);
        border-radius: 10px;
        border: 1px solid var(--app-border);
        font-size: 0.85rem;
    }

    .summary-stat[b-210ckpsilj] {
        color: var(--app-text-muted);
    }

    .action-divider[b-210ckpsilj] {
        color: var(--app-text-muted);
        margin: 0 0.15rem;
    }

    /* ─── Split Layout ────────────────────────────── */
    .wizard-split-layout[b-210ckpsilj] {
        display: grid;
        grid-template-columns: 1fr 340px;
        gap: 1.25rem;
        margin-top: 1rem;
    }

    /* ─── Review Table ────────────────────────────── */
    .review-table-container[b-210ckpsilj], [b-210ckpsilj] .review-table-container {
        overflow-x: auto;
    }

    .review-table[b-210ckpsilj], [b-210ckpsilj] .review-table {
        width: 100%;
        font-size: 0.85rem;
    }

    .review-table th[b-210ckpsilj], [b-210ckpsilj] .review-table th {
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--app-text-muted);
        border-bottom: 1px solid var(--app-border);
        padding: 0.5rem 0.5rem;
        white-space: nowrap;
    }

    .review-table td[b-210ckpsilj], [b-210ckpsilj] .review-table td {
        padding: 0.4rem 0.5rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        vertical-align: middle;
    }

    /* ─── Measure-Centric Table ────────────────────── */
    .assigned-row[b-210ckpsilj] {
        background: rgba(16, 185, 129, 0.04);
    }

    .unassigned-row td[b-210ckpsilj] {
        color: rgba(255, 255, 255, 0.5);
    }
    .unassigned-row .searchable-select[b-210ckpsilj], [b-210ckpsilj] .unassigned-row .searchable-select {
        opacity: 1; /* Keep dropdowns fully opaque */
    }

    .register-select-wrapper[b-210ckpsilj], [b-210ckpsilj] .register-select-wrapper {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        position: relative;
    }

    .conf-badge-inline[b-210ckpsilj], [b-210ckpsilj] .conf-badge-inline {
        cursor: help;
        font-size: 0.7rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        flex-shrink: 0;
        line-height: 1;
        padding: 0.2rem 0.45rem;
        border-radius: 4px;
    }

    .conf-badge-inline.conf-high[b-210ckpsilj], [b-210ckpsilj] .conf-badge-inline.conf-high {
        background: rgba(16, 185, 129, 0.15);
        color: #10b981;
        border: 1px solid rgba(16, 185, 129, 0.3);
    }

    .conf-badge-inline.conf-medium[b-210ckpsilj], [b-210ckpsilj] .conf-badge-inline.conf-medium {
        background: rgba(245, 158, 11, 0.15);
        color: #f59e0b;
        border: 1px solid rgba(245, 158, 11, 0.3);
    }

    .conf-badge-inline.conf-low[b-210ckpsilj], [b-210ckpsilj] .conf-badge-inline.conf-low {
        background: rgba(239, 68, 68, 0.15);
        color: #ef4444;
        border: 1px solid rgba(239, 68, 68, 0.3);
    }

    .register-select[b-210ckpsilj], [b-210ckpsilj] .register-select {
        flex: 1;
        height: 32px;
        font-size: 0.82rem;
        padding: 0.2rem 0.4rem;
        position: relative;
    }

    .register-select.has-assignment[b-210ckpsilj], [b-210ckpsilj] .register-select.has-assignment {
        border-color: rgba(16, 185, 129, 0.4);
        color: var(--app-text);
    }

    /* ─── Searchable Select ──────────────────────────── */
    .searchable-select[b-210ckpsilj], [b-210ckpsilj] .searchable-select {
        flex: 1;
        position: relative;
    }

    .searchable-select.open[b-210ckpsilj], [b-210ckpsilj] .searchable-select.open {
        z-index: 9999;
    }

    .ss-display[b-210ckpsilj], [b-210ckpsilj] .ss-display {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 32px;
        padding: 0.2rem 0.4rem 0.2rem 0.6rem;
        border: 1px solid var(--app-border);
        border-radius: 6px;
        background: var(--app-surface-alt);
        cursor: pointer;
        font-size: 0.82rem;
        transition: border-color 0.15s;
    }

    .searchable-select.has-assignment .ss-display[b-210ckpsilj], [b-210ckpsilj] .searchable-select.has-assignment .ss-display {
        border-color: rgba(16, 185, 129, 0.4);
    }

    .ss-display:hover[b-210ckpsilj], [b-210ckpsilj] .ss-display:hover {
        border-color: var(--app-accent);
    }

    .ss-value[b-210ckpsilj], [b-210ckpsilj] .ss-value {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        flex: 1;
    }

    .ss-chevron[b-210ckpsilj], [b-210ckpsilj] .ss-chevron {
        font-size: 0.65rem;
        color: var(--app-text-muted);
        margin-left: 0.4rem;
        transition: transform 0.15s;
    }

    .searchable-select.open .ss-chevron[b-210ckpsilj], [b-210ckpsilj] .searchable-select.open .ss-chevron {
        transform: rotate(180deg);
    }

    .ss-dropdown[b-210ckpsilj], [b-210ckpsilj] .ss-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        margin-top: 2px;
        background: #1e1e2e;
        border: 1px solid rgba(255, 255, 255, 0.15);
        border-radius: 8px;
        box-shadow: 0 12px 40px rgba(0, 0, 0, 0.8);
        z-index: 1003;
        overflow: hidden;
    }

    .ss-options[b-210ckpsilj], [b-210ckpsilj] .ss-options {
        background: #1e1e2e;
    }


    .ss-backdrop[b-210ckpsilj] {
        position: fixed;
        inset: 0;
        z-index: 999;
        background: transparent;
    }

    .ss-search[b-210ckpsilj], [b-210ckpsilj] .ss-search {
        width: 100%;
        padding: 0.5rem 0.6rem;
        border: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        background: transparent;
        color: var(--app-text);
        font-size: 0.82rem;
        outline: none;
    }

    .ss-search[b-210ckpsilj]::placeholder, [b-210ckpsilj] .ss-search::placeholder {
        color: var(--app-text-muted);
        font-style: italic;
    }

    .ss-options[b-210ckpsilj], [b-210ckpsilj] .ss-options {
        max-height: 220px;
        overflow-y: auto;
        padding: 4px 0;
    }

    .ss-option[b-210ckpsilj], [b-210ckpsilj] .ss-option {
        padding: 0.4rem 0.6rem;
        font-size: 0.82rem;
        cursor: pointer;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        transition: background 0.1s;
    }

    .ss-option:hover:not(.disabled)[b-210ckpsilj], [b-210ckpsilj] .ss-option:hover:not(.disabled) {
        background: rgba(255, 255, 255, 0.06);
    }

    .ss-option.selected[b-210ckpsilj], [b-210ckpsilj] .ss-option.selected {
        background: rgba(16, 185, 129, 0.12);
        color: #10b981;
        font-weight: 500;
    }

    .ss-option.disabled[b-210ckpsilj], [b-210ckpsilj] .ss-option.disabled {
        opacity: 0.35;
        cursor: not-allowed;
    }

    .ss-assigned-tag[b-210ckpsilj], [b-210ckpsilj] .ss-assigned-tag {
        font-size: 0.7rem;
        color: var(--app-text-muted);
        margin-left: 0.4rem;
        font-style: italic;
    }

    .monospace[b-210ckpsilj], [b-210ckpsilj] .monospace {
        font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
        font-size: 0.82rem;
    }

    .lock-btn[b-210ckpsilj], [b-210ckpsilj] .lock-btn {
        background: none;
        border: none;
        cursor: pointer;
        font-size: 1rem;
        padding: 0.2rem;
        color: var(--app-text-muted);
        opacity: 0.4;
        transition: all 0.15s;
    }

    .lock-btn:hover[b-210ckpsilj], [b-210ckpsilj] .lock-btn:hover {
        opacity: 0.8;
        transform: scale(1.1);
    }

    .lock-btn.locked[b-210ckpsilj], [b-210ckpsilj] .lock-btn.locked {
        color: #10b981;
        opacity: 1;
    }

    .lock-btn.locked:hover[b-210ckpsilj], [b-210ckpsilj] .lock-btn.locked:hover {
        opacity: 0.7;
    }

    /* ─── Unassigned Registers Section ────────────── */
    .unassigned-section[b-210ckpsilj], [b-210ckpsilj] .unassigned-section {
        margin-top: 1.25rem;
        padding: 1rem 1.25rem;
        background: var(--app-surface-alt);
        border: 1px solid var(--app-border);
        border-radius: 10px;
    }

    .unassigned-chips[b-210ckpsilj], [b-210ckpsilj] .unassigned-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .unassigned-chip[b-210ckpsilj], [b-210ckpsilj] .unassigned-chip {
        display: inline-block;
        padding: 0.3rem 0.6rem;
        background: rgba(168, 85, 247, 0.1);
        border: 1px solid rgba(168, 85, 247, 0.25);
        border-radius: 6px;
        font-size: 0.78rem;
        color: var(--app-text-muted);
        cursor: help;
    }

    .ai-note[b-210ckpsilj] {
        font-size: 0.8rem;
        color: #a855f7;
        padding: 0.35rem 0.5rem;
        background: rgba(168, 85, 247, 0.08);
        border-radius: 6px;
        margin-top: 0.5rem;
    }

    /* ─── Save Actions ────────────────────────────── */
    .save-actions[b-210ckpsilj], [b-210ckpsilj] .save-actions {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin-top: 1.25rem;
        padding-top: 1.25rem;
        border-top: 1px solid var(--app-border);
        justify-content: center;
    }

    .skip-ai-btn[b-210ckpsilj], [b-210ckpsilj] .skip-ai-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.6rem 1.5rem;
        background: rgba(255, 255, 255, 0.06);
        color: var(--app-text);
        border: 1px solid var(--app-border);
        border-radius: 10px;
        font-size: 0.9rem;
        font-weight: 500;
        text-decoration: none;
        cursor: pointer;
        transition: all 0.25s ease;
    }

    .skip-ai-btn:hover[b-210ckpsilj], [b-210ckpsilj] .skip-ai-btn:hover {
        background: rgba(255, 255, 255, 0.12);
        border-color: rgba(255, 255, 255, 0.2);
    }

    .skip-ai-btn i[b-210ckpsilj], [b-210ckpsilj] .skip-ai-btn i {
        font-size: 1rem;
        color: var(--app-text-muted);
    }

    .ai-create-btn[b-210ckpsilj], [b-210ckpsilj] .ai-create-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.65rem 1.5rem;
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        color: #fff;
        border: none;
        border-radius: 10px;
        font-size: 0.95rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.25s ease;
        box-shadow: 0 2px 12px rgba(124, 58, 237, 0.35);
    }

    .ai-create-btn:hover:not(:disabled)[b-210ckpsilj], [b-210ckpsilj] .ai-create-btn:hover:not(:disabled) {
        background: linear-gradient(135deg, #6d28d9, #9333ea);
        box-shadow: 0 4px 20px rgba(124, 58, 237, 0.5);
        transform: translateY(-1px);
    }

    .ai-create-btn:disabled[b-210ckpsilj], [b-210ckpsilj] .ai-create-btn:disabled {
        opacity: 0.4;
        cursor: not-allowed;
        box-shadow: none;
    }

    /* ─── Chat Panel ──────────────────────────────── */
    .chat-panel[b-210ckpsilj], [b-210ckpsilj] .chat-panel {
        display: flex;
        flex-direction: column;
        background: var(--app-surface-alt);
        border: 1px solid var(--app-border);
        border-radius: 12px;
        overflow: hidden;
        height: min(70vh, 700px);
    }

    .chat-header[b-210ckpsilj], [b-210ckpsilj] .chat-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.75rem 1rem;
        border-bottom: 1px solid var(--app-border);
        font-weight: 600;
        font-size: 0.9rem;
    }

    .chat-messages[b-210ckpsilj], [b-210ckpsilj] .chat-messages {
        flex: 1;
        overflow-y: auto;
        padding: 1rem;
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .chat-welcome[b-210ckpsilj], [b-210ckpsilj] .chat-welcome {
        text-align: center;
        padding: 1.5rem 0.5rem;
        color: var(--app-text-muted);
    }

    .chat-welcome p[b-210ckpsilj], [b-210ckpsilj] .chat-welcome p {
        margin: 0.75rem 0;
        font-size: 0.85rem;
    }

    .chat-suggestions[b-210ckpsilj], [b-210ckpsilj] .chat-suggestions {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        margin-top: 1rem;
    }

    .chat-suggestion[b-210ckpsilj], [b-210ckpsilj] .chat-suggestion {
        background: rgba(168, 85, 247, 0.1);
        border: 1px solid rgba(168, 85, 247, 0.25);
        color: #a855f7;
        border-radius: 8px;
        padding: 0.5rem 0.75rem;
        font-size: 0.8rem;
        cursor: pointer;
        text-align: left;
        transition: all 0.15s;
    }

    .chat-suggestion:hover[b-210ckpsilj], [b-210ckpsilj] .chat-suggestion:hover {
        background: rgba(168, 85, 247, 0.2);
        border-color: #a855f7;
    }

    .chat-msg[b-210ckpsilj], [b-210ckpsilj] .chat-msg {
        display: flex;
    }

    .chat-msg-user[b-210ckpsilj] {
        justify-content: flex-end;
    }

    .chat-msg-ai[b-210ckpsilj], [b-210ckpsilj] .chat-msg-ai {
        justify-content: flex-start;
    }

    .chat-bubble[b-210ckpsilj], [b-210ckpsilj] .chat-bubble {
        max-width: 90%;
        padding: 0.6rem 0.85rem;
        border-radius: 12px;
        font-size: 0.85rem;
        line-height: 1.5;
        word-break: break-word;
    }

    .user-bubble[b-210ckpsilj], [b-210ckpsilj] .user-bubble {
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        color: #fff;
        border-bottom-right-radius: 4px;
    }

    .ai-bubble[b-210ckpsilj], [b-210ckpsilj] .ai-bubble {
        background: var(--app-surface);
        border: 1px solid var(--app-border);
        color: var(--app-text);
        border-bottom-left-radius: 4px;
    }

    .chat-input-area[b-210ckpsilj], [b-210ckpsilj] .chat-input-area {
        display: flex;
        gap: 0.5rem;
        padding: 0.75rem;
        border-top: 1px solid var(--app-border);
    }

    .chat-input[b-210ckpsilj], [b-210ckpsilj] .chat-input {
        flex: 1;
        height: 38px;
        font-size: 0.85rem;
    }

    .chat-send-btn[b-210ckpsilj], [b-210ckpsilj] .chat-send-btn {
        width: 38px;
        height: 38px;
        border: none;
        border-radius: 8px;
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        color: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.15s;
    }

    .chat-send-btn:hover:not(:disabled)[b-210ckpsilj], [b-210ckpsilj] .chat-send-btn:hover:not(:disabled) {
        background: linear-gradient(135deg, #6d28d9, #9333ea);
    }

    .chat-send-btn:disabled[b-210ckpsilj], [b-210ckpsilj] .chat-send-btn:disabled {
        opacity: 0.3;
        cursor: not-allowed;
    }
/* /Components/Pages/AlarmLevelEditorDialog.razor.rz.scp.css */
.color-swatch[b-u93sr9m0yb] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid rgba(255,255,255,0.15);
    flex-shrink: 0;
}

.icon-preview-large[b-u93sr9m0yb] {
    width: 60px;
    height: 60px;
    min-width: 60px;
    background: rgba(255,255,255,0.03);
    border: 1px dashed var(--app-border);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* The SVG is injected as raw markup (SafeMarkup.Svg), so reach it with ::deep. */
.icon-preview-large[b-u93sr9m0yb]  svg {
    width: 48px;
    height: 48px;
    fill: currentColor;
}
/* /Components/Pages/CalcStepRows.razor.rz.scp.css */
/* Scoped styles for CalcStepRows — the step-row layout. These moved with the markup out of RegisterEditorDialog:
   a scoped selector only matches markup carrying this component's scope id. */

.calc-empty[b-81npions4k] {
    text-align: center;
    padding: 1.5rem;
    color: var(--app-text-muted);
    font-size: 0.85rem;
}

.calc-step-row[b-81npions4k] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

/* ::deep twins REQUIRED: these carry the flex sizing for the row's controls, passed to AderisSelect /
   AderisNumericInput via Class=, which lands the class on the wrapper the COMPONENT renders. */
.calc-op[b-81npions4k], [b-81npions4k] .calc-op {
    flex: 0 0 64px;
    text-align: center;
    font-weight: 700;
    font-size: 0.85rem;
}

.calc-type[b-81npions4k], [b-81npions4k] .calc-type {
    flex: 0 0 130px;
    font-size: 0.82rem;
}

.calc-picker[b-81npions4k], [b-81npions4k] .calc-picker {
    flex: 1;
    font-size: 0.82rem;
}

.calc-del[b-81npions4k] {
    flex: 0 0 28px;
    font-size: 0.75rem;
}
/* /Components/Pages/CommsDiagram.razor.rz.scp.css */
/* ::deep twins: this page's markup was split into child components (ADR-0005 size limit), and
   Blazor scoped CSS does not cross a component boundary. Every selector whose class is used by one
   of those children carries a ::deep twin so the rule still reaches it. Selectors used only by this
   component's own markup are left alone. */

/* Scoped styles for the Comms Diagram page. Lifted verbatim from its inline <style> block
   (ADR-0005 size limit; ADR-0028 keeps styling out of markup). */

/* The ::deep twins above compile to `[b-scope] .x`, which needs an ancestor THIS page renders — so the
   child dialogs are wrapped in .cd-scoped-host in the markup. `display: contents` makes that wrapper
   generate no box, so it adds no flex item and no gap while still anchoring the ::deep selectors.
   (`display: contents` affects box generation only; DOM ancestry and selector matching are unchanged.) */
.cd-scoped-host[b-u0ppun28l0] { display: contents; }

    /* ─── Layout (mirrors ConfigureFacilities sidebar pattern) ─────────── */
    .cd-layout[b-u0ppun28l0] {
        display: grid;
        grid-template-columns: 320px 1fr;
        min-height: calc(100vh - 160px);
        transition: grid-template-columns 0.3s ease;
    }
    .cd-layout.sidebar-collapsed[b-u0ppun28l0] { grid-template-columns: 48px 1fr; }

    .cd-sidebar[b-u0ppun28l0] {
        background: var(--app-surface-alt);
        border-right: 1px solid var(--app-border);
        padding: 1.25rem;
        transition: padding 0.3s ease, opacity 0.25s ease;
        overflow-y: auto;
        overflow-x: hidden;
    }
    .cd-sidebar.collapsed[b-u0ppun28l0] { padding: 0.5rem; display: flex; align-items: flex-start; justify-content: center; }

    .section-header[b-u0ppun28l0] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
    .section-header h3[b-u0ppun28l0] { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.04em; }
    .sidebar-field[b-u0ppun28l0] { margin-bottom: 1rem; }
    .sidebar-field .text-label[b-u0ppun28l0], [b-u0ppun28l0] .sidebar-field .text-label { display: block; margin-bottom: 0.35rem; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--app-text-muted); }

    .sidebar-toggle[b-u0ppun28l0] {
        background: none; border: 1px solid var(--app-border); border-radius: 6px;
        color: var(--app-text-muted); cursor: pointer; padding: 0.35rem 0.45rem;
        font-size: 0.85rem; transition: color 0.15s, border-color 0.15s; line-height: 1;
    }
    .sidebar-toggle:hover[b-u0ppun28l0] { color: var(--app-text); border-color: var(--app-text-muted); }

    /* ─── Typeahead (same as ConfigureFacilities) ─────────────────────── */
    .typeahead-wrap[b-u0ppun28l0] { position: relative; }
    .typeahead-input[b-u0ppun28l0] { width: 100%; padding-right: 2rem; }
    .typeahead-clear[b-u0ppun28l0] {
        position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
        background: none; border: none; color: var(--app-text-muted); cursor: pointer;
        padding: 2px 4px; font-size: 0.9rem; line-height: 1; opacity: 0.6; transition: opacity 0.15s;
    }
    .typeahead-clear:hover[b-u0ppun28l0] { opacity: 1; color: var(--app-danger); }
    .typeahead-dropdown[b-u0ppun28l0] {
        position: absolute; top: 100%; left: 0; right: 0; z-index: 100;
        max-height: 220px; overflow-y: auto; background: var(--app-surface);
        border: 1px solid var(--app-border); border-top: none;
        border-radius: 0 0 8px 8px; box-shadow: 0 6px 16px rgba(0,0,0,0.35);
    }
    .typeahead-option[b-u0ppun28l0] {
        display: flex; align-items: center; gap: 0.5rem; width: 100%;
        padding: 0.5rem 0.75rem; background: none; border: none;
        border-bottom: 1px solid rgba(255,255,255,0.04); color: var(--app-text);
        font-size: 0.85rem; text-align: left; cursor: pointer; transition: background 0.12s;
    }
    .typeahead-option:hover[b-u0ppun28l0] { background: rgba(0, 177, 118, 0.1); }
    .typeahead-option.active[b-u0ppun28l0] { background: rgba(0, 177, 118, 0.18); }
    .typeahead-code[b-u0ppun28l0] { font-weight: 700; color: var(--app-accent); font-size: 0.8rem; min-width: 40px; font-family: 'JetBrains Mono', monospace; }
    .typeahead-empty[b-u0ppun28l0] { padding: 0.75rem; text-align: center; color: var(--app-text-muted); font-size: 0.85rem; }
    .select-loading[b-u0ppun28l0] { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem; font-size: 0.85rem; color: var(--app-text-muted); }

    /* ─── Main Panel ──────────────────────────────────────────────────── */
    .cd-main[b-u0ppun28l0] { display: flex; flex-direction: column; overflow: hidden; }
    .empty-state[b-u0ppun28l0] { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; color: var(--app-text-muted); gap: 0.5rem; padding: 3rem; min-height: 400px; }
    .empty-state i[b-u0ppun28l0] { font-size: 3rem; opacity: 0.3; }
    .empty-state h3[b-u0ppun28l0] { margin: 0; font-size: 1.1rem; }
    .empty-state p[b-u0ppun28l0] { margin: 0; font-size: 0.85rem; }

    /* ─── Toolbar ─────────────────────────────────────────────────────── */
    .cd-toolbar[b-u0ppun28l0] {
        display: flex; align-items: center; justify-content: space-between;
        padding: 0.6rem 1rem; border-bottom: 1px solid var(--app-border);
        background: rgba(255,255,255,0.01); flex-wrap: wrap; gap: 0.5rem;
    }
    .cd-toolbar-left[b-u0ppun28l0] { display: flex; align-items: center; gap: 0.5rem; }
    .cd-toolbar-right[b-u0ppun28l0] { display: flex; align-items: center; gap: 0.5rem; margin-left: auto; }
    .cd-toolbar-header[b-u0ppun28l0] { padding: 0.5rem 1rem; }
    .toolbar-label[b-u0ppun28l0] { font-size: 0.68rem; color: var(--app-text-muted); }
    .segmented-control.compact button[b-u0ppun28l0] { padding: 0.25rem 0.6rem; }
    .link-mode-active[b-u0ppun28l0] { background: rgba(59,130,246,0.15) !important; border-color: #3b82f6 !important; color: #93c5fd !important; }

    /* ─── Add Device Row ──────────────────────────────────────────────── */
    .cd-add-device-row[b-u0ppun28l0] { display: flex; gap: 0.4rem; align-items: center; }
    .cd-add-device-row select[b-u0ppun28l0] { flex: 1; }
    .cd-add-device-row.compact select[b-u0ppun28l0] { font-size: 0.72rem; padding: 0.25rem 0.4rem; height: 28px; min-width: 160px; }
    .btn-add-device[b-u0ppun28l0] {
        display: flex; align-items: center; justify-content: center;
        width: 34px; height: 34px; border-radius: 6px; border: 1px solid var(--app-border);
        background: rgba(0,177,118,0.12); color: #34d399; cursor: pointer;
        font-size: 1rem; transition: all 0.15s; flex-shrink: 0;
    }
    .btn-add-device.compact[b-u0ppun28l0] { width: 28px; height: 28px; font-size: 0.82rem; border-radius: 5px; }
    .btn-add-device:hover:not(:disabled)[b-u0ppun28l0] { background: rgba(0,177,118,0.25); border-color: #34d399; }
    .btn-add-device:disabled[b-u0ppun28l0] { opacity: 0.3; cursor: not-allowed; }

    /* ─── Palette Items ───────────────────────────────────────────────── */
    .cd-palette-title[b-u0ppun28l0] { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--app-text-muted); margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.35rem; }
    .cd-palette-item[b-u0ppun28l0] {
        display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.5rem;
        border-radius: 8px; cursor: pointer; font-size: 0.78rem; transition: all 0.15s;
        border: 1px solid transparent;
    }
    .cd-palette-item:hover[b-u0ppun28l0] { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
    .cd-palette-item--active[b-u0ppun28l0] { background: rgba(59,130,246,0.12); border-color: #3b82f6; color: #93c5fd; }
    .cd-palette-icon[b-u0ppun28l0] { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; }
    .cd-palette-icon svg[b-u0ppun28l0] { width: 20px; height: 20px; }
    .cd-palette-code[b-u0ppun28l0] { margin-left: auto; font-size: 0.6rem; font-weight: 700; color: var(--app-text-muted); letter-spacing: 0.05em; }

    /* ─── Dialog Grid ────────────────────────────────────────────────── */
    .dialog-grid[b-u0ppun28l0], [b-u0ppun28l0] .dialog-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.5rem; }
    .toggle-label-dynamic[b-u0ppun28l0], [b-u0ppun28l0] .toggle-label-dynamic { font-size: 0.85rem; color: var(--app-text-muted); margin-left: 0.5rem; }

    /* ─── Port Editor Link ────────────────────────────────────────────── */
    /* ─── Port Edge Sections ──────────────────────────────────────────── */
    .port-edge-section[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-section {
        background: rgba(255,255,255,0.02); border: 1px solid rgba(255,255,255,0.06);
        border-radius: 8px; margin-bottom: 0.5rem; overflow: hidden;
    }
    .port-edge-header[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-header {
        display: flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0.75rem;
        background: rgba(255,255,255,0.04); font-size: 0.65rem; font-weight: 700;
        text-transform: uppercase; letter-spacing: 0.08em; color: var(--app-text-muted);
    }
    .port-edge-header i[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-header i,
    .port-edge-header .ac-icon[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-header .ac-icon { font-size: 0.8rem; opacity: 0.6; }
    .port-edge-count[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-count {
        margin-left: auto; background: rgba(255,255,255,0.08); border-radius: 8px;
        padding: 0.05rem 0.4rem; font-size: 0.6rem; min-width: 16px; text-align: center;
    }
    .port-edge-empty[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-empty {
        padding: 0.5rem 0.75rem; font-size: 0.7rem; color: var(--app-text-muted);
        font-style: italic; text-align: center;
    }
    .port-edge-drop-zone[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-drop-zone { min-height: 20px; transition: background 0.15s; border-radius: 0 0 8px 8px; }
    .port-edge-drop-zone:hover[b-u0ppun28l0], [b-u0ppun28l0] .port-edge-drop-zone:hover { background: rgba(0,177,118,0.08); }

    /* ─── Condensed Port Row ─────────────────────────────────────────── */
    .port-config-row[b-u0ppun28l0], [b-u0ppun28l0] .port-config-row {
        display: flex; align-items: center; gap: 0.4rem;
        padding: 0.3rem 0.75rem; border-bottom: 1px solid rgba(255,255,255,0.04);
        transition: background 0.1s;
    }
    .port-config-row:hover[b-u0ppun28l0], [b-u0ppun28l0] .port-config-row:hover { background: rgba(255,255,255,0.03); }
    .port-config-row:last-child[b-u0ppun28l0], [b-u0ppun28l0] .port-config-row:last-child { border-bottom: none; }
    .port-drag-handle[b-u0ppun28l0] { cursor: grab; color: var(--app-text-muted); font-size: 0.8rem; opacity: 0.5; }
    .port-drag-handle:hover[b-u0ppun28l0] { opacity: 1; }
    .port-name-input[b-u0ppun28l0], [b-u0ppun28l0] .port-name-input { width: 10% !important; min-width: 40px !important; font-size: 0.75rem !important; padding: 0.2rem 0.3rem !important; }

    /* ─── Compact Connector Multi-select ──────────────────────────────── */
    .port-connector-btn[b-u0ppun28l0], [b-u0ppun28l0] .port-connector-btn {
        display: inline-flex; align-items: center; gap: 0.3rem; background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,255,255,0.1); border-radius: 4px; padding: 0.2rem 0.5rem;
        color: var(--app-text-secondary, #ccc); font-size: 0.7rem; cursor: pointer;
        transition: border-color 0.15s; min-width: 80px; flex: 1;
    }
    .port-connector-btn:hover[b-u0ppun28l0], [b-u0ppun28l0] .port-connector-btn:hover { border-color: var(--app-accent, #00b176); }
    .port-ct-label[b-u0ppun28l0], [b-u0ppun28l0] .port-ct-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100px; }
    .port-max-conn[b-u0ppun28l0], [b-u0ppun28l0] .port-max-conn { display: flex; align-items: center; gap: 0.3rem; width: 15%; min-width: 70px; }
    .port-inline-label[b-u0ppun28l0], [b-u0ppun28l0] .port-inline-label { font-size: 0.6rem; color: var(--app-text-muted); text-transform: uppercase; }
    .connector-popover[b-u0ppun28l0], [b-u0ppun28l0] .connector-popover {
        background: var(--app-surface, #1a1a2e); border: 1px solid rgba(255,255,255,0.15);
        border-radius: 8px; padding: 0.6rem; margin: 0.25rem 0.75rem 0.5rem 2rem;
        box-shadow: 0 8px 24px rgba(0,0,0,0.4);
    }
    .connector-checkbox-grid[b-u0ppun28l0], [b-u0ppun28l0] .connector-checkbox-grid { display: flex; gap: 1rem; flex-wrap: wrap; }
    .connector-group[b-u0ppun28l0], [b-u0ppun28l0] .connector-group { display: flex; flex-direction: column; gap: 0.15rem; min-width: 110px; }
    .connector-group-label[b-u0ppun28l0], [b-u0ppun28l0] .connector-group-label {
        font-size: 0.6rem; font-weight: 700; text-transform: uppercase;
        color: var(--app-text-muted); letter-spacing: 0.08em; margin-bottom: 0.1rem;
    }
    .connector-check[b-u0ppun28l0], [b-u0ppun28l0] .connector-check {
        display: flex; align-items: center; gap: 0.3rem; font-size: 0.7rem;
        color: var(--app-text-secondary, #ccc); cursor: pointer;
    }
    .connector-check input[type="checkbox"][b-u0ppun28l0], [b-u0ppun28l0] .connector-check input[type="checkbox"] { accent-color: var(--app-accent, #00b176); }

    /* ─── Canvas ──────────────────────────────────────────────────────── */
    .cd-stage[b-u0ppun28l0] { flex: 1; position: relative; background: var(--app-surface, #1a1a2e); overflow: hidden; isolation: isolate; }
    .cd-grid[b-u0ppun28l0] {
        position: absolute; inset: 0; pointer-events: none;
        background-size: 30px 30px;
        background-image:
            linear-gradient(to right, rgba(255,255,255,0.03) 1px, transparent 1px),
            linear-gradient(to bottom, rgba(255,255,255,0.03) 1px, transparent 1px);
    }
    .cd-svg[b-u0ppun28l0] { position: absolute; inset: 0; width: 100%; height: 100%; transform-origin: 0 0; pointer-events: all; overflow: visible; }
    .cd-node-layer[b-u0ppun28l0] { position: absolute; inset: 0; transform-origin: 0 0; pointer-events: none; }

    /* ─── Nodes (rendered by JS, styled here) ─────────────────────────── */
    :global(.cd-node)[b-u0ppun28l0] {
        position: absolute; pointer-events: all; cursor: grab;
        display: flex; flex-direction: column; align-items: center;
        background: transparent; border: none;
        min-width: 100px; width: 120px;
        transition: filter 0.15s;
    }
    :global(.cd-node:hover)[b-u0ppun28l0] { filter: brightness(1.2); }

    :global(.cd-node-box)[b-u0ppun28l0] {
        width: 72px; height: 72px;
        display: flex; align-items: center; justify-content: center;
        border: 2px solid rgba(255,255,255,0.85); border-radius: 12px;
        background: rgba(30,35,50,0.95);
        box-shadow: 0 4px 16px rgba(0,0,0,0.3);
        font-size: 1.6rem; color: white;
        transition: border-color 0.15s, box-shadow 0.15s;
    }
    :global(.cd-node:hover .cd-node-box)[b-u0ppun28l0] { border-color: rgba(255,255,255,0.3); box-shadow: 0 8px 24px rgba(0,0,0,0.5); }
    :global(.cd-node-icon-svg)[b-u0ppun28l0] { display: flex; align-items: center; justify-content: center; }
    :global(.cd-node-icon-svg svg)[b-u0ppun28l0] { width: 32px; height: 32px; fill: white !important; }
    :global(.cd-node-icon-svg svg path)[b-u0ppun28l0] { fill: white !important; stroke: white; }
    :global(.cd-node-icon-svg svg circle)[b-u0ppun28l0] { fill: white !important; stroke: white; }
    :global(.cd-node-icon-svg svg rect)[b-u0ppun28l0] { fill: white !important; stroke: white; }
    :global(.cd-node-icon-svg svg line)[b-u0ppun28l0] { stroke: white !important; }
    :global(.cd-node-icon-svg svg polyline)[b-u0ppun28l0] { stroke: white !important; }
    :global(.cd-node-icon-svg svg polygon)[b-u0ppun28l0] { fill: white !important; stroke: white; }

    :global(.cd-node-label)[b-u0ppun28l0] {
        text-align: center; margin-top: 0.3rem;
        font-size: 0.65rem; font-weight: 600; color: var(--app-text, #e2e8f0);
        line-height: 1.2; width: 100%;
        overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }
    :global(.cd-node-sub)[b-u0ppun28l0] { text-align: center; margin-top: 0.15rem; }
    :global(.cd-node-supplier)[b-u0ppun28l0] { font-size: 0.38rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 0.05rem 0.25rem; border-radius: 3px; }
    :global(.cd-supplier--aderis)[b-u0ppun28l0] { background: rgba(0,177,118,0.15); color: #34d399; }
    :global(.cd-supplier--others)[b-u0ppun28l0] { background: rgba(245,158,11,0.15); color: #fbbf24; }

    /* ─── Ports ────────────────────────────────────────────────────────── */
    :global(.cd-port)[b-u0ppun28l0] {
        position: absolute; width: 12px; height: 12px; border-radius: 50%;
        border: 2px solid rgba(255,255,255,0.3); background: #1a1a2e;
        cursor: crosshair; transition: all 0.15s; z-index: 2;
    }
    :global(.cd-port:hover)[b-u0ppun28l0] { border-color: #c084fc; background: rgba(168,85,247,0.3); transform: scale(1.3); }
    :global(.cd-port--in)[b-u0ppun28l0] { left: 18px; top: 30px; transform: translateX(-50%); }
    :global(.cd-port--out)[b-u0ppun28l0] { right: 18px; top: 30px; transform: translateX(50%); }
    :global(.cd-port--in:hover)[b-u0ppun28l0] { transform: translateX(-50%) scale(1.3); }
    :global(.cd-port--out:hover)[b-u0ppun28l0] { transform: translateX(50%) scale(1.3); }

    /* ─── Wires ────────────────────────────────────────────────────────── */
    :global(.cd-wire)[b-u0ppun28l0] { transition: stroke 0.2s, stroke-width 0.15s; }
    :global(.cd-wire:hover)[b-u0ppun28l0] { stroke-width: 4 !important; filter: brightness(1.3); }
    :global(.cd-wire-label)[b-u0ppun28l0] { pointer-events: none; }
/* /Components/Pages/CompositeDeviceTypes.razor.rz.scp.css */
/* ::deep twins: this page's markup was split into child components (ADR-0005 size limit), and
   Blazor scoped CSS does not cross a component boundary. Every selector whose class is used by one
   of those children carries a ::deep twin so the rule still reaches it. Selectors used only by this
   component's own markup are left alone. */

/* Scoped styles for the Composite (META) Device Types editor. Lifted verbatim from its inline <style>
   block (ADR-0005 size limit; ADR-0028 keeps styling out of markup). */

/* The ::deep twins above compile to `[b-scope] .x`, which needs an ancestor THIS component renders — so
   the child panels are wrapped in .ctd-scoped-host in the markup. `display: contents` makes that wrapper
   generate no box, so it adds no flex item and no gap while still anchoring the ::deep selectors.
   (`display: contents` affects box generation only; DOM ancestry and selector matching are unchanged.) */
.ctd-scoped-host[b-vcsxrzhakn] { display: contents; }

    .composite-slot-section[b-vcsxrzhakn], [b-vcsxrzhakn] .composite-slot-section {
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 8px;
        margin-bottom: 1rem;
        overflow: hidden;
    }

    .composite-slot-header[b-vcsxrzhakn], [b-vcsxrzhakn] .composite-slot-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0.6rem 0.75rem;
        background: rgba(255, 255, 255, 0.03);
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }
    .toggle-row[b-vcsxrzhakn], [b-vcsxrzhakn] .toggle-row {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        font-size: 0.8rem;
        cursor: pointer;
        color: var(--app-text);
    }

    .toggle-label[b-vcsxrzhakn], [b-vcsxrzhakn] .toggle-label {
        user-select: none;
    }

    /* ── Calculation Editor ─────────── */
    .calc-editor-header[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-editor-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--acuity-clearsky-blue, #1e8bf7);
        margin-bottom: 0.75rem;
    }

    .calc-step-row[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-step-row {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
    }

    .calc-op[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-op {
        flex: 0 0 64px;
        text-align: center;
        font-weight: 700;
        font-size: 0.85rem;
    }

    .calc-type[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-type {
        flex: 0 0 130px;
        font-size: 0.82rem;
    }

    .calc-picker[b-vcsxrzhakn] {
        flex: 1;
        font-size: 0.82rem;
    }

    .calc-del[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-del {
        flex: 0 0 28px;
        font-size: 0.75rem;
    }

    .calc-add-btn[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-add-btn {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        margin-top: 0.5rem;
        padding: 0.3rem 0.75rem;
        font-size: 0.78rem;
        font-weight: 600;
        color: #fff;
        background: var(--acuity-green, #10b981);
        border: none;
        border-radius: 6px;
        cursor: pointer;
        transition: background 0.15s;
    }

    .calc-add-btn:hover[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-add-btn:hover {
        background: #0d9668;
    }

    .calc-equation-preview[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-equation-preview {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        margin-top: 0.75rem;
        padding: 0.6rem 0.75rem;
        background: rgba(30, 139, 247, 0.06);
        border: 1px solid rgba(30, 139, 247, 0.2);
        border-radius: 8px;
        font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
        font-size: 0.82rem;
        flex-wrap: wrap;
    }

    .calc-eq-label[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-eq-label {
        color: var(--acuity-clearsky-blue, #1e8bf7);
        font-weight: 600;
    }

    .calc-eq-equals[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-eq-equals {
        color: var(--app-text-muted);
        font-weight: 700;
    }

    .calc-eq-formula[b-vcsxrzhakn], [b-vcsxrzhakn] .calc-eq-formula {
        color: var(--app-text, #e0e0e0);
    }

    .dialog-overlay-top[b-vcsxrzhakn], [b-vcsxrzhakn] .dialog-overlay-top {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.6);
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2000;
    }
/* /Components/Pages/ConfigureFacilities/ConfigureFacilities.razor.rz.scp.css */
/* ::deep twins: this page's markup was split into child components (ADR-0005 size limit), and
   Blazor scoped CSS does not cross a component boundary. Every selector whose class is used by one
   of those children carries a ::deep twin so the rule still reaches it. Selectors used only by this
   component's own markup are left alone. */

/* Scoped styles for the Configure Facilities page. Lifted verbatim from its inline <style> block
   (ADR-0005 size limit; ADR-0028 keeps styling out of markup). */

    /* ─── Sidebar Layout (from ConfigureFacility) ──────────────────────── */
    .facility-layout[b-4lsp7za54f] {
        display: grid;
        grid-template-columns: 320px 1fr;
        gap: 2rem;
        min-height: 500px;
        transition: grid-template-columns 0.3s ease;
    }

    /* .facility-sidebar and everything inside it now live in OrgFacilitySidebar.razor.css — the
       component owns its own styles rather than borrowing the page's through ::deep. */

    .section-header[b-4lsp7za54f], [b-4lsp7za54f] .section-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1rem;
    }

    .section-header h3[b-4lsp7za54f], [b-4lsp7za54f] .section-header h3 {
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    /* Sidebar collapse — the page owns its own grid column; the sidebar styles its collapsed self. */
    .facility-layout.sidebar-collapsed[b-4lsp7za54f] {
        grid-template-columns: 48px 1fr;
    }

    .sidebar-toggle[b-4lsp7za54f], [b-4lsp7za54f] .sidebar-toggle {
        background: none;
        border: 1px solid var(--app-border);
        border-radius: 6px;
        color: var(--app-text-muted);
        cursor: pointer;
        padding: 0.35rem 0.45rem;
        font-size: 0.85rem;
        transition: color 0.15s, border-color 0.15s;
        line-height: 1;
    }
    .sidebar-toggle:hover[b-4lsp7za54f], [b-4lsp7za54f] .sidebar-toggle:hover {
        color: var(--app-text);
        border-color: var(--app-text-muted);
    }

    /* The typeahead controls, .facility-hint and .select-loading moved to
       OrgFacilitySidebar.razor.css with the markup that uses them. */

    .select-spinner[b-4lsp7za54f], [b-4lsp7za54f] .select-spinner {
        display: inline-block;
        width: 14px;
        height: 14px;
        border: 2px solid rgba(255,255,255,0.15);
        border-top-color: var(--app-accent);
        border-radius: 50%;
        animation: select-spin-b-4lsp7za54f 0.6s linear infinite;
    }

    @keyframes select-spin-b-4lsp7za54f {
        to { transform: rotate(360deg); }
    }

    /* ─── Config Toolbar ───────────────────────────────────────────────── */
    .config-toolbar[b-4lsp7za54f] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: var(--app-surface-alt);
        border-bottom: 1px solid var(--app-border);
        border-radius: 8px 8px 0 0;
    }
    .config-toolbar-left[b-4lsp7za54f] {
        display: flex;
        align-items: baseline;
        gap: 10px;
    }
    .config-toolbar-left h3[b-4lsp7za54f] {
        margin: 0;
        font-size: 1.1rem;
        color: var(--app-text);
    }
    .config-toolbar-right[b-4lsp7za54f] {
        display: flex;
        gap: 8px;
    }

    /* The bespoke tab strip (.config-tabs / .config-tab / .config-tab-content and their scrollbar
       rules) is gone: AderisTabs owns the strip, and it carries the overflow-x/overflow-y lesson
       in the library so the phantom-scrollbar bug cannot recur here. The panel region below keeps
       the box .config-tab-content carried — the class was dead, its spacing was load-bearing.
       ::deep because AderisTabs renders the element; it reaches via the page-scoped ancestors. */
    [b-4lsp7za54f] .aderis-tabs__content {
        padding: 20px 16px;
        max-height: calc(100vh - 320px);
        overflow-y: auto;
    }

    /* ─── Form ──────────────────────────────────────────────────────────── */
    .config-form[b-4lsp7za54f], [b-4lsp7za54f] .config-form {
        max-width: 720px;
    }
    .form-row[b-4lsp7za54f], [b-4lsp7za54f] .form-row {
        margin-bottom: 16px;
    }
    .form-row .text-label[b-4lsp7za54f], [b-4lsp7za54f] .form-row .text-label {
        display: block;
        margin-bottom: 4px;
        font-size: 0.8rem;
        color: var(--app-text-muted);
    }
    .form-row-pair[b-4lsp7za54f], [b-4lsp7za54f] .form-row-pair {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
        margin-bottom: 16px;
    }
    .form-row-pair .form-row[b-4lsp7za54f], [b-4lsp7za54f] .form-row-pair .form-row {
        margin-bottom: 0;
    }
    .form-divider[b-4lsp7za54f], [b-4lsp7za54f] .form-divider {
        border: none;
        border-top: 1px solid var(--app-border);
        margin: 20px 0;
    }
    .form-section-title[b-4lsp7za54f], [b-4lsp7za54f] .form-section-title {
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--app-text);
        margin: 0 0 12px 0;
    }

    /* ─── Toggle Grid ──────────────────────────────────────────────────── */
    .toggle-grid[b-4lsp7za54f], [b-4lsp7za54f] .toggle-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px 24px;
    }
    .toggle-row[b-4lsp7za54f], [b-4lsp7za54f] .toggle-row {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 6px 0;
    }
    .toggle-label-text[b-4lsp7za54f], [b-4lsp7za54f] .toggle-label-text {
        font-size: 0.78rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--app-text-muted);
        transition: color 0.25s ease;
    }
    .toggle-row.toggle-on .toggle-label-text[b-4lsp7za54f], [b-4lsp7za54f] .toggle-row.toggle-on .toggle-label-text {
        color: var(--app-accent);
    }
    .toggle-switch[b-4lsp7za54f], [b-4lsp7za54f] .toggle-switch {
        position: relative;
        display: inline-block;
        width: 44px;
        height: 24px;
        flex-shrink: 0;
    }
    .toggle-switch input[b-4lsp7za54f], [b-4lsp7za54f] .toggle-switch input { opacity: 0; width: 0; height: 0; }
    .toggle-slider[b-4lsp7za54f], [b-4lsp7za54f] .toggle-slider {
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        background: rgba(255,255,255,0.12);
        border-radius: 12px;
        cursor: pointer;
        transition: background 0.3s;
    }
    .toggle-slider[b-4lsp7za54f]::before, [b-4lsp7za54f] .toggle-slider::before {
        content: '';
        position: absolute;
        width: 18px; height: 18px;
        left: 3px; bottom: 3px;
        background: rgba(255,255,255,0.6);
        border-radius: 50%;
        transition: transform 0.3s, background 0.3s;
    }
    .toggle-switch input:checked + .toggle-slider[b-4lsp7za54f], [b-4lsp7za54f] .toggle-switch input:checked + .toggle-slider {
        background: rgba(0,177,118,0.35);
    }
    .toggle-switch input:checked + .toggle-slider[b-4lsp7za54f]::before, [b-4lsp7za54f] .toggle-switch input:checked + .toggle-slider::before {
        transform: translateX(20px);
        background: var(--app-accent);
    }
    .toggle-switch input:disabled + .toggle-slider[b-4lsp7za54f], [b-4lsp7za54f] .toggle-switch input:disabled + .toggle-slider {
        opacity: 0.5;
        cursor: not-allowed;
    }

    /* ─── Save Toast ───────────────────────────────────────────────────── */
    .save-toast[b-4lsp7za54f], [b-4lsp7za54f] .save-toast {
        padding: 8px 16px;
        margin: 0 16px;
        background: rgba(0, 177, 118, 0.1);
        border-left: 3px solid var(--app-accent);
        border-radius: 0 4px 4px 0;
        font-size: 0.85rem;
        color: var(--app-text);
    }
    .save-toast.error[b-4lsp7za54f], [b-4lsp7za54f] .save-toast.error {
        background: rgba(220, 53, 69, 0.1);
        border-left-color: var(--app-danger);
    }

    /* ─── Empty State ──────────────────────────────────────────────────── */
    .empty-state[b-4lsp7za54f], [b-4lsp7za54f] .empty-state {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 80px 20px;
        text-align: center;
        color: var(--app-text-muted);
    }
    .empty-state i[b-4lsp7za54f], [b-4lsp7za54f] .empty-state i {
        font-size: 3rem;
        margin-bottom: 16px;
        opacity: 0.4;
    }
    .empty-state h3[b-4lsp7za54f], [b-4lsp7za54f] .empty-state h3 {
        margin: 0 0 8px 0;
        color: var(--app-text);
    }

    /* ─── Buttons ──────────────────────────────────────────────────────── */
    .btn[b-4lsp7za54f], [b-4lsp7za54f] .btn {
        padding: 6px 16px;
        border-radius: 6px;
        font-size: 0.85rem;
        font-weight: 500;
        border: none;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 6px;
    }
    .btn-primary[b-4lsp7za54f], [b-4lsp7za54f] .btn-primary {
        background: var(--app-accent);
        color: #fff;
    }
    .btn-primary:hover[b-4lsp7za54f], [b-4lsp7za54f] .btn-primary:hover { filter: brightness(1.1); }
    .btn-primary:disabled[b-4lsp7za54f], [b-4lsp7za54f] .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
    .btn-secondary[b-4lsp7za54f], [b-4lsp7za54f] .btn-secondary {
        background: rgba(255,255,255,0.06);
        color: var(--app-text);
        border: 1px solid var(--app-border);
    }
    .btn-secondary:hover[b-4lsp7za54f], [b-4lsp7za54f] .btn-secondary:hover { background: rgba(255,255,255,0.1); }

    /* ─── Link Button ─────────────────────────────────────────────────── */
    .link-button[b-4lsp7za54f], [b-4lsp7za54f] .link-button {
        background: none;
        border: none;
        cursor: pointer;
        font-size: 0.9rem;
        font-weight: 500;
        padding: 2px 4px;
        text-decoration: none;
    }
    .link-button:hover[b-4lsp7za54f], [b-4lsp7za54f] .link-button:hover { text-decoration: underline; }

    /* ─── Modal ────────────────────────────────────────────────────────── */
    .modal-backdrop[b-4lsp7za54f], [b-4lsp7za54f] .modal-backdrop {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.6);
        z-index: 1000;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .modal-card[b-4lsp7za54f], [b-4lsp7za54f] .modal-card {
        background: var(--app-surface);
        border: 1px solid var(--app-border);
        border-radius: 12px;
        padding: 24px;
        width: 90%;
        box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    }

    /* ─── Time Zone Clock ─────────────────────────────────────────────── */
    .tz-clock[b-4lsp7za54f], [b-4lsp7za54f] .tz-clock {
        font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
        font-size: 0.95rem;
        color: var(--acuity-green, #2ecc71);
        background: rgba(46, 204, 113, 0.08);
        border: 1px solid rgba(46, 204, 113, 0.2);
        border-radius: 8px;
        padding: 8px 12px;
        letter-spacing: 0.5px;
    }

    /* ─── Form Section Title ──────────────────────────────────────────── */
    .form-section-title[b-4lsp7za54f], [b-4lsp7za54f] .form-section-title {
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--app-text-muted);
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin: 4px 0 12px 0;
    }

    /* ─── Calculated Value Display ────────────────────────────────────── */
    .calc-value[b-4lsp7za54f], [b-4lsp7za54f] .calc-value {
        font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', 'Consolas', monospace;
        font-size: 0.95rem;
        color: var(--acuity-green, #2ecc71);
        background: rgba(46, 204, 113, 0.08);
        border: 1px solid rgba(46, 204, 113, 0.2);
        border-radius: 8px;
        padding: 8px 12px;
        letter-spacing: 0.5px;
    }

    /* The Organization Summary dashboard — stat cards, the SVG map and the generation breakdown —
       moved to OrgSummaryPanel.razor.css with the markup that uses it. */

/* /Components/Pages/ConfigureFacilities/ConfigureFacilitiesBridgeTab.razor.rz.scp.css */
/* Scoped styles for the Acuity Data Bridge tab. Moved here from ConfigureFacilities.razor.css when the
   tab stopped reaching into its owning page: the component renders this markup, so it styles it — the
   ::deep twins these rules carried are no longer needed. Largest single cluster on the page (16 classes).

   The regenerate dialog's chrome (.modal-backdrop, .modal-card, .section-header, .sidebar-toggle) is
   NOT here: those are shared with other children and stay in the page sheet with their twins. */

.bridge-header[b-0zo595x46i] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--app-border);
}

.bridge-icon[b-0zo595x46i] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(30, 139, 247, 0.15), rgba(46, 204, 113, 0.15));
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bridge-icon i[b-0zo595x46i] {
    font-size: 1.5rem;
    background: linear-gradient(135deg, #1e8bf7, #2ecc71);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.bridge-empty-state[b-0zo595x46i] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 20px;
}

.bridge-generate-btn[b-0zo595x46i] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    padding: 10px 24px;
    font-size: 0.9rem;
}

.bridge-section[b-0zo595x46i] { margin-bottom: 16px; }

.bridge-status-badge[b-0zo595x46i] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 20px;
}

.bridge-status-badge.pending[b-0zo595x46i] {
    background: rgba(251, 191, 36, 0.12);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.3);
}

.bridge-status-badge.connected[b-0zo595x46i] {
    background: rgba(46, 204, 113, 0.12);
    color: #2ecc71;
    border: 1px solid rgba(46, 204, 113, 0.3);
}

.bridge-step[b-0zo595x46i] {
    display: flex;
    gap: 14px;
    margin-bottom: 20px;
}

.bridge-step-number[b-0zo595x46i] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(30, 139, 247, 0.15);
    color: #1e8bf7;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 2px;
}

.bridge-step-content[b-0zo595x46i] { flex: 1; }

.bridge-token-display[b-0zo595x46i] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--app-card);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 8px 12px;
}

.bridge-token-value[b-0zo595x46i] {
    flex: 1;
    font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
    font-size: 0.8rem;
    color: #1e8bf7;
    word-break: break-all;
}

.bridge-copy-btn[b-0zo595x46i] {
    background: transparent;
    border: 1px solid var(--app-border);
    border-radius: 6px;
    padding: 4px 8px;
    color: var(--app-text-muted);
    cursor: pointer;
    transition: all 0.2s;
}

.bridge-copy-btn:hover[b-0zo595x46i] {
    background: rgba(30, 139, 247, 0.1);
    color: #1e8bf7;
    border-color: rgba(30, 139, 247, 0.3);
}

.bridge-info-grid[b-0zo595x46i] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.bridge-info-item[b-0zo595x46i] {
    background: var(--app-card);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 12px;
}

.bridge-info-label[b-0zo595x46i] {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--app-text-muted);
    margin-bottom: 4px;
}

.bridge-info-value[b-0zo595x46i] {
    display: block;
    font-size: 0.85rem;
    color: var(--app-text);
    word-break: break-all;
}
/* /Components/Pages/ConfigureFacilities/OrgFacilitySidebar.razor.rz.scp.css */
/* Scoped styles for the org/facility selector. Moved here verbatim from ConfigureFacilities.razor.css
   when the sidebar became a component: a component owning its own styles needs no ::deep twin in its
   parent, which is the difference between styles that follow the markup and styles that merely reach it.

   Rules NOT moved, deliberately: .section-header, .sidebar-toggle, .text-label and .select-spinner are
   used by other children of the page too, so the page's sheet keeps them and their existing twins. */

.facility-sidebar[b-rcc9iy2q2w] {
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    padding: 1.25rem;
    transition: padding 0.3s ease, opacity 0.25s ease;
    overflow: hidden;
}

/* The page's grid narrows its own column to match — see .facility-layout.sidebar-collapsed there. */
.facility-sidebar.collapsed[b-rcc9iy2q2w] {
    padding: 0.5rem;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.sidebar-field[b-rcc9iy2q2w] {
    margin-bottom: 1rem;
}

.sidebar-field .text-label[b-rcc9iy2q2w] {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--app-text-muted);
}

/* ─── Typeahead Controls ───────────────────────────────────────────── */
.typeahead-wrap[b-rcc9iy2q2w] {
    position: relative;
}

.typeahead-input[b-rcc9iy2q2w] {
    width: 100%;
    padding-right: 2rem;
}

.typeahead-clear[b-rcc9iy2q2w] {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--app-text-muted);
    cursor: pointer;
    padding: 2px 4px;
    font-size: 0.9rem;
    line-height: 1;
    opacity: 0.6;
    transition: opacity 0.15s;
}

.typeahead-clear:hover[b-rcc9iy2q2w] {
    opacity: 1;
    color: var(--app-danger);
}

.typeahead-dropdown[b-rcc9iy2q2w] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 100;
    max-height: 220px;
    overflow-y: auto;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-top: none;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 6px 16px rgba(0,0,0,0.35);
}

.typeahead-option[b-rcc9iy2q2w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    background: none;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    color: var(--app-text);
    font-size: 0.85rem;
    text-align: left;
    cursor: pointer;
    transition: background 0.12s;
}

.typeahead-option:hover[b-rcc9iy2q2w] {
    background: rgba(0, 177, 118, 0.1);
}

.typeahead-option.active[b-rcc9iy2q2w] {
    background: rgba(0, 177, 118, 0.18);
}

.typeahead-code[b-rcc9iy2q2w] {
    font-weight: 700;
    color: var(--app-accent);
    font-size: 0.8rem;
    min-width: 40px;
    font-family: 'JetBrains Mono', monospace;
}

.typeahead-empty[b-rcc9iy2q2w] {
    padding: 0.75rem;
    text-align: center;
    color: var(--app-text-muted);
    font-size: 0.85rem;
}

.facility-hint[b-rcc9iy2q2w] {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    font-style: italic;
    color: var(--app-primary);
}

.select-loading[b-rcc9iy2q2w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    color: var(--app-text-muted);
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 8px;
}
/* /Components/Pages/ConfigureFacilities/OrgSummaryPanel.razor.rz.scp.css */
/* Scoped styles for the organization roll-up. Moved here verbatim from ConfigureFacilities.razor.css
   when the panel became a component, along with the two keyframe animations only these rules use. */

.org-summary[b-5o1g68cu6j] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
    animation: fadeIn-b-5o1g68cu6j 0.3s ease;
}

.org-summary-title[b-5o1g68cu6j] {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--app-text);
    margin: 0;
    letter-spacing: 0.3px;
}

@keyframes fadeIn-b-5o1g68cu6j { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.summary-stats[b-5o1g68cu6j] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
}

.stat-card[b-5o1g68cu6j] {
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    padding: 20px 16px;
    text-align: center;
    transition: border-color 0.2s, background 0.2s;
}

.stat-card:hover[b-5o1g68cu6j] {
    border-color: var(--acuity-green);
    background: rgba(46, 204, 113, 0.04);
}

.stat-value[b-5o1g68cu6j] {
    font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
    font-size: 2rem;
    font-weight: 700;
    color: var(--acuity-green);
    line-height: 1.1;
}

.stat-label[b-5o1g68cu6j] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--app-text-muted);
    margin-top: 6px;
}

/* ─── SVG Map ──────────────────────────────────────────────────── */

.svg-map-container[b-5o1g68cu6j] {
    background: linear-gradient(135deg, rgba(10,15,25,0.95), rgba(20,30,45,0.85));
    border: 1px solid rgba(46, 204, 113, 0.15);
    border-radius: 12px;
    padding: 0;
    overflow: hidden;
}

.facility-map[b-5o1g68cu6j] {
    width: 100%;
    height: auto;
}

.map-pin[b-5o1g68cu6j] {
    filter: drop-shadow(0 0 6px rgba(46, 204, 113, 0.6));
    transition: r 0.2s;
    cursor: pointer;
}

.map-pin:hover[b-5o1g68cu6j] { r: 7; }

@keyframes mapPulse-b-5o1g68cu6j {
    0% { r: 8; opacity: 0.5; }
    100% { r: 18; opacity: 0; }
}

.map-pulse[b-5o1g68cu6j] {
    animation: mapPulse-b-5o1g68cu6j 2.5s ease-out infinite;
}

.map-label[b-5o1g68cu6j] {
    font-size: 9px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    fill: rgba(255,255,255,0.85);
    letter-spacing: 0.8px;
    text-transform: uppercase;
    paint-order: stroke;
    stroke: rgba(0,0,0,0.6);
    stroke-width: 3px;
}

.map-empty[b-5o1g68cu6j] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 32px 20px;
    color: var(--app-text-muted);
    font-size: 0.85rem;
}

.map-empty i[b-5o1g68cu6j] {
    font-size: 1.4rem;
    opacity: 0.5;
}

/* ─── Generation Breakdown ─────────────────────────────────────── */

.generation-breakdown[b-5o1g68cu6j] {
    background: rgba(255,255,255,0.02);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    padding: 20px;
}

.gen-table[b-5o1g68cu6j] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.gen-table thead th[b-5o1g68cu6j] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--app-text-muted);
    padding: 0 12px 12px 12px;
    border-bottom: 1px solid var(--app-border);
    text-align: left;
}

.gen-table thead th.num[b-5o1g68cu6j], .gen-table tbody td.num[b-5o1g68cu6j] {
    text-align: right;
    font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
}

.gen-table tbody td[b-5o1g68cu6j] {
    padding: 12px;
    border-bottom: 1px solid rgba(255,255,255,0.03);
    font-size: 0.9rem;
}

.gen-table tbody tr:last-child td[b-5o1g68cu6j] { border-bottom: none; }

.gen-table tbody tr:hover[b-5o1g68cu6j] { background: rgba(255,255,255,0.02); }

.gen-icon[b-5o1g68cu6j] {
    width: 36px;
    text-align: center;
}

.gen-icon i[b-5o1g68cu6j] { font-size: 1.3rem; }

.gen-label[b-5o1g68cu6j] { font-weight: 500; }

.gen-table tbody td.num[b-5o1g68cu6j] {
    color: var(--acuity-green);
    font-weight: 500;
}
/* /Components/Pages/EditTagMap.razor.rz.scp.css */
/* Scoped styles for EditTagMap — the register LIST page. The register-DIALOG rules moved to
   RegisterEditorDialog.razor.css when that markup was extracted (ADR-0005): a scoped selector only matches markup
   stamped with THIS component's scope id, so a rule for markup the child now renders would silently stop matching.

   ⚠️ Scoping changes reachability, and this page renders AderisTableMaster, so the rule is:
     * Markup written HERE and passed into a child (cell templates, GroupHeader/GroupFooter, DetailRow) keeps THIS
       page's scope id, so its classes apply normally — no ::deep.
     * Anything the COMPONENT renders needs ::deep — the <tr> it stamps `tm-row--selected` on, for example. */

    .info-bar[b-nz0y7tsqh6] {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        padding: 1rem 1.25rem;
        background: var(--app-surface-alt);
        border-radius: 12px;
        border: 1px solid var(--app-border);
        margin-bottom: 2rem;
    }

    .info-item[b-nz0y7tsqh6] {
        display: flex;
        flex-direction: column;
        gap: 0.2rem;
    }

    .info-label[b-nz0y7tsqh6] {
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--app-text-muted);
    }

    .info-value[b-nz0y7tsqh6] {
        font-size: 0.95rem;
        color: var(--app-text);
    }

    .comms-badge[b-nz0y7tsqh6] {
        display: inline-flex;
        align-items: center;
        padding: 0.45rem 1.1rem;
        font-size: 0.82rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        color: #e8a817;
        background: transparent;
        border: 2px solid rgba(232, 168, 23, 0.6);
        border-radius: 24px;
        cursor: pointer;
        text-decoration: none;
        transition: all 0.2s ease;
        white-space: nowrap;
        font-family: inherit;
    }

    .comms-badge:hover[b-nz0y7tsqh6] {
        background: rgba(232, 168, 23, 0.12);
        border-color: #e8a817;
        color: #f0b830;
    }

    .comms-dropdown[b-nz0y7tsqh6] {
        position: absolute;
        top: calc(100% + 0.4rem);
        right: 0;
        min-width: 240px;
        background: var(--app-surface, #1e1e1e);
        border: 1px solid rgba(232, 168, 23, 0.35);
        border-radius: 10px;
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
        z-index: 100;
        overflow: hidden;
    }

    .comms-dropdown-item[b-nz0y7tsqh6] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.6rem 1rem;
        font-size: 0.85rem;
        color: var(--app-text, #e0e0e0);
        text-decoration: none;
        transition: background 0.15s;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    }

    .comms-dropdown-item:last-child[b-nz0y7tsqh6] {
        border-bottom: none;
    }

    .comms-dropdown-item:hover[b-nz0y7tsqh6] {
        background: rgba(232, 168, 23, 0.12);
        color: #e8a817;
    }

    .comms-dropdown-item i[b-nz0y7tsqh6] {
        color: #e8a817;
        font-size: 1rem;
    }

    .section-header[b-nz0y7tsqh6] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1.25rem;
    }

    .section-header h3[b-nz0y7tsqh6] {
        font-size: 1rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    /* ::deep twin so .monospace also reaches an <input> a component renders; the bare selector covers this page's
       own table cells (address/type/slope). */
    .monospace[b-nz0y7tsqh6], [b-nz0y7tsqh6] .monospace {
        font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
        font-size: 0.85rem;
    }

    .register-count[b-nz0y7tsqh6] {
        text-align: right;
        font-size: 0.8rem;
        color: var(--app-text-muted);
        margin-top: 0.5rem;
    }

    .bulk-import-panel[b-nz0y7tsqh6] {
        padding: 1.25rem;
        background: var(--app-surface-alt);
        border-radius: 12px;
        border: 1px solid var(--app-border);
        margin-bottom: 1.5rem;
    }

    .bulk-import-panel textarea[b-nz0y7tsqh6] {
        width: 100%;
        font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
        font-size: 0.85rem;
    }

    .action-divider[b-nz0y7tsqh6] {
        color: var(--app-text-muted);
        margin: 0 0.25rem;
    }

    /* Limits cell: a 2-column grid so MAX/MIN read as a pair — labels left, numbers right, digits lining up.
       ABSOLUTE font-size, not em: this <span> lives inside AderisTableMaster's <td>, so a relative size would
       compound the component's own 0.825rem into something illegible. */
    .limits-cell[b-nz0y7tsqh6] {
        display: inline-grid;
        grid-template-columns: auto auto;
        column-gap: 0.4rem;
        text-align: right;
        font-size: 0.7rem;
        line-height: 1.35;
        font-family: var(--font-mono);
        white-space: nowrap;
    }

    .limit-label[b-nz0y7tsqh6] {
        text-align: left;
        color: var(--app-text-muted);
    }

    /* ── Source Unit Badges ──────────────────────────── */
    .unit-badge[b-nz0y7tsqh6] {
        display: inline-block;
        padding: 0.15rem 0.5rem;
        border-radius: 4px;
        font-size: 0.78rem;
        font-weight: 600;
        font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
        cursor: help;
    }

    .unit-badge-green[b-nz0y7tsqh6] {
        background: rgba(16, 185, 129, 0.15);
        color: #10b981;
        border: 1px solid rgba(16, 185, 129, 0.3);
    }

    .unit-badge-red[b-nz0y7tsqh6] {
        background: rgba(239, 68, 68, 0.15);
        color: #ef4444;
        border: 1px solid rgba(239, 68, 68, 0.3);
    }

    /* Edit link — orange (the Actions cell). Global .link-edit exists; this keeps the page's colour. */
    .link-button.link-edit[b-nz0y7tsqh6] {
        color: #f59e0b;
    }

    .link-button.link-edit:hover[b-nz0y7tsqh6] {
        color: #fbbf24;
    }

    /* AI Grouping Button */
    .ai-grouping-btn[b-nz0y7tsqh6] {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.45rem 1rem;
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 0.82rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.25s ease;
        box-shadow: 0 2px 10px rgba(124, 58, 237, 0.3);
        white-space: nowrap;
    }

    .ai-grouping-btn:hover:not(:disabled)[b-nz0y7tsqh6] {
        background: linear-gradient(135deg, #6d28d9, #9333ea);
        box-shadow: 0 4px 16px rgba(124, 58, 237, 0.45);
        transform: translateY(-1px);
    }

    .ai-grouping-btn:disabled[b-nz0y7tsqh6] {
        opacity: 0.4;
        cursor: not-allowed;
        box-shadow: none;
    }

    .ai-grouping-btn i[b-nz0y7tsqh6] {
        font-size: 0.95rem;
    }

    .ai-create-registers-btn[b-nz0y7tsqh6] {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.45rem 1rem;
        background: linear-gradient(135deg, #7c3aed, #a855f7);
        color: #fff;
        border: none;
        border-radius: 8px;
        font-size: 0.82rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.25s ease;
        box-shadow: 0 2px 10px rgba(124, 58, 237, 0.3);
        white-space: nowrap;
    }

    .ai-create-registers-btn:hover:not(:disabled)[b-nz0y7tsqh6] {
        background: linear-gradient(135deg, #6d28d9, #9333ea);
        box-shadow: 0 4px 16px rgba(124, 58, 237, 0.45);
        transform: translateY(-1px);
    }

    .ai-create-registers-btn:disabled[b-nz0y7tsqh6] {
        opacity: 0.4;
        cursor: not-allowed;
        box-shadow: none;
    }

    .ai-create-registers-btn i[b-nz0y7tsqh6] {
        font-size: 0.95rem;
    }

    /* Polling-group bands. AderisTableMaster renders the band ROW; these style the content this page puts inside
       it, which keeps this page's scope id — so no ::deep is needed. */
    .polling-band[b-nz0y7tsqh6] {
        display: block;
        font-weight: 600;
    }

    .polling-band-start[b-nz0y7tsqh6] {
        text-align: left;
    }

    .polling-band-end[b-nz0y7tsqh6] {
        text-align: right;
    }

    .enum-row-badge[b-nz0y7tsqh6] {
        display: inline-flex;
        align-items: center;
        color: var(--acuity-green, #10b981);
        font-size: 0.9rem;
        margin-right: 0.35rem;
        cursor: pointer;
    }

    .enum-row-badge:hover[b-nz0y7tsqh6] {
        color: #0d9668;
    }

    /* Selected-row tint. AderisTableMaster applies its own `tm-row--selected`; this ::deep override makes selection
       actually VISIBLE over this app's near-black surface. ::deep is required because the <tr> is rendered by the
       component, not by this page. */
    [b-nz0y7tsqh6] .tm-table tbody tr.tm-row--selected {
        background-color: rgba(59, 130, 246, 0.22);
    }

    [b-nz0y7tsqh6] .tm-table tbody tr.tm-row--selected:hover {
        background-color: rgba(59, 130, 246, 0.30);
    }

    .bulk-action-bar[b-nz0y7tsqh6] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.55rem 1rem;
        background: rgba(59, 130, 246, 0.08);
        border: 1px solid rgba(59, 130, 246, 0.25);
        border-radius: 10px;
        margin-bottom: 1rem;
    }

    .bulk-count[b-nz0y7tsqh6] {
        font-size: 0.82rem;
        font-weight: 600;
        color: #93c5fd;
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .bulk-actions[b-nz0y7tsqh6] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .bulk-btn[b-nz0y7tsqh6] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        padding: 0.35rem 0.75rem;
        border: 1px solid rgba(255,255,255,0.15);
        border-radius: 7px;
        font-size: 0.78rem;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.2s;
        background: rgba(255,255,255,0.06);
        color: var(--app-text);
    }

    .bulk-btn:hover[b-nz0y7tsqh6] {
        background: rgba(255,255,255,0.12);
        border-color: rgba(255,255,255,0.25);
    }

    .bulk-btn-shift[b-nz0y7tsqh6] {
        color: #60a5fa;
        border-color: rgba(96,165,250,0.3);
    }

    .bulk-btn-shift:hover[b-nz0y7tsqh6] {
        background: rgba(96,165,250,0.15);
        border-color: rgba(96,165,250,0.5);
    }

    .bulk-btn-abs[b-nz0y7tsqh6] {
        color: #34d399;
        border-color: rgba(52,211,153,0.3);
    }

    .bulk-btn-abs:hover[b-nz0y7tsqh6] {
        background: rgba(52,211,153,0.15);
        border-color: rgba(52,211,153,0.5);
    }

    .bulk-left[b-nz0y7tsqh6] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .bulk-select-link[b-nz0y7tsqh6] {
        font-size: 0.78rem;
        color: var(--app-text-muted);
    }

    .bulk-select-link:hover[b-nz0y7tsqh6] {
        color: var(--app-text);
    }

    /* Equation preview — the calculated-row DetailRow written by this page (keeps this page's scope id). */
    .calc-equation-preview[b-nz0y7tsqh6] {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        margin-top: 0.75rem;
        padding: 0.6rem 0.75rem;
        background: rgba(30, 139, 247, 0.06);
        border: 1px solid rgba(30, 139, 247, 0.2);
        border-radius: 8px;
        font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
        font-size: 0.82rem;
        flex-wrap: wrap;
    }

    .calc-eq-label[b-nz0y7tsqh6] {
        color: var(--acuity-clearsky-blue, #1e8bf7);
        font-weight: 600;
    }

    .calc-eq-equals[b-nz0y7tsqh6] {
        color: var(--app-text-muted);
        font-weight: 700;
    }

    .calc-eq-formula[b-nz0y7tsqh6] {
        color: var(--app-text, #e0e0e0);
    }
/* /Components/Pages/EnergyModels.razor.rz.scp.css */
/* ─── Sidebar Layout ──────────────────────────────────────────────── */
.facility-layout[b-q84nsl8o31] {
    display: grid;
    grid-template-columns: 320px 1fr;
    gap: 2rem;
    min-height: 500px;
    transition: grid-template-columns 0.3s ease;
}

.facility-sidebar[b-q84nsl8o31] {
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    padding: 1.25rem;
    transition: padding 0.3s ease, opacity 0.25s ease;
    overflow: hidden;
}

.section-header[b-q84nsl8o31] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.section-header h3[b-q84nsl8o31] { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.04em; }

.sidebar-field[b-q84nsl8o31] { margin-bottom: 1rem; }

.sidebar-field .text-label[b-q84nsl8o31] {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--app-text-muted);
}

.facility-layout.sidebar-collapsed[b-q84nsl8o31] { grid-template-columns: 48px 1fr; }

.facility-sidebar.collapsed[b-q84nsl8o31] {
    padding: 0.5rem;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.sidebar-toggle[b-q84nsl8o31] {
    background: none;
    border: 1px solid var(--app-border);
    border-radius: 6px;
    color: var(--app-text-muted);
    cursor: pointer;
    padding: 0.35rem 0.45rem;
    font-size: 0.85rem;
    transition: color 0.15s, border-color 0.15s;
    line-height: 1;
}
.sidebar-toggle:hover[b-q84nsl8o31] { color: var(--app-text); border-color: var(--app-text-muted); }

/* ─── Typeahead Controls ───────────────────────────────────────────── */
.typeahead-wrap[b-q84nsl8o31] { position: relative; }
.typeahead-input[b-q84nsl8o31] { width: 100%; padding-right: 2rem; }

.typeahead-clear[b-q84nsl8o31] {
    position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
    background: none; border: none; color: var(--app-text-muted);
    cursor: pointer; padding: 2px 4px; font-size: 0.9rem;
    line-height: 1; opacity: 0.6; transition: opacity 0.15s;
}
.typeahead-clear:hover[b-q84nsl8o31] { opacity: 1; color: var(--app-danger); }

.typeahead-dropdown[b-q84nsl8o31] {
    position: absolute; top: 100%; left: 0; right: 0; z-index: 100;
    max-height: 220px; overflow-y: auto;
    background: var(--app-surface); border: 1px solid var(--app-border);
    border-top: none; border-radius: 0 0 8px 8px;
    box-shadow: 0 6px 16px rgba(0,0,0,0.35);
}

.typeahead-option[b-q84nsl8o31] {
    display: flex; align-items: center; gap: 0.5rem; width: 100%;
    padding: 0.5rem 0.75rem; background: none; border: none;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    color: var(--app-text); font-size: 0.85rem; text-align: left;
    cursor: pointer; transition: background 0.12s;
}
.typeahead-option:hover[b-q84nsl8o31] { background: rgba(0, 177, 118, 0.1); }
.typeahead-option.active[b-q84nsl8o31] { background: rgba(0, 177, 118, 0.18); }

.typeahead-code[b-q84nsl8o31] {
    font-weight: 700; color: var(--app-accent); font-size: 0.8rem;
    min-width: 40px; font-family: 'JetBrains Mono', monospace;
}

.typeahead-empty[b-q84nsl8o31] { padding: 0.75rem; text-align: center; color: var(--app-text-muted); font-size: 0.85rem; }

.facility-hint[b-q84nsl8o31] { margin-top: 0.5rem; font-size: 0.8rem; font-style: italic; color: var(--app-primary); }

.select-loading[b-q84nsl8o31] {
    display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem;
    font-size: 0.85rem; color: var(--app-text-muted);
    background: var(--app-surface-alt); border: 1px solid var(--app-border); border-radius: 8px;
}

.select-spinner[b-q84nsl8o31] {
    display: inline-block; width: 14px; height: 14px;
    border: 2px solid rgba(255,255,255,0.15); border-top-color: var(--app-accent);
    border-radius: 50%; animation: select-spin-b-q84nsl8o31 0.6s linear infinite;
}

@keyframes select-spin-b-q84nsl8o31 { to { transform: rotate(360deg); } }

/* ─── Config Header ───────────────────────────────────────────────── */
.config-header[b-q84nsl8o31] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 0 1rem 0; border-bottom: 1px solid var(--app-border); margin-bottom: 1.5rem;
}
.config-header h3[b-q84nsl8o31] { margin: 0; font-size: 1.2rem; font-weight: 600; color: var(--app-heading); }

.facility-code-badge[b-q84nsl8o31] {
    display: inline-block; font-size: 0.7rem; font-weight: 700;
    letter-spacing: 0.08em; color: var(--app-accent);
    background: rgba(0, 177, 118, 0.12); border: 1px solid rgba(0, 177, 118, 0.25);
    border-radius: 999px; padding: 0.15rem 0.55rem; vertical-align: middle; margin-right: 0.5rem;
}

/* ─── Timezone ─────────────────────────────────────────────────────── */
.tz-warning[b-q84nsl8o31] {
    display: flex; gap: 1rem; align-items: flex-start;
    padding: 1rem 1.25rem; border-radius: 10px;
    background: rgba(231, 76, 60, 0.1); border: 1px solid rgba(231, 76, 60, 0.3);
    color: var(--app-text); margin-bottom: 1.5rem;
}
.tz-warning i[b-q84nsl8o31] { font-size: 1.5rem; color: #e74c3c; flex-shrink: 0; margin-top: 2px; }
.tz-warning strong[b-q84nsl8o31] { color: #e74c3c; }
.tz-warning p[b-q84nsl8o31] { margin: 0.25rem 0 0; font-size: 0.88rem; color: var(--app-text-muted); }
.tz-warning a[b-q84nsl8o31] { color: var(--app-accent); }

.badge-row[b-q84nsl8o31] {
    display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center;
    margin-bottom: 1.25rem;
}

.tz-badge[b-q84nsl8o31] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em;
    color: var(--app-text-muted);
    padding: 3px 10px; border-radius: 6px;
}
.tz-badge.tz-set[b-q84nsl8o31] {
    color: var(--app-accent); background: rgba(0, 177, 118, 0.12);
    border: 1px solid rgba(0, 177, 118, 0.25);
}
.tz-badge.tz-warn[b-q84nsl8o31] {
    color: #e67e22; background: rgba(230, 126, 34, 0.1);
    border: 1px solid rgba(230, 126, 34, 0.25);
}
.tz-badge.tz-warn i[b-q84nsl8o31] { font-size: 0.7rem; }

/* ─── Empty State ──────────────────────────────────────────────────── */
.empty-state[b-q84nsl8o31] {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 4rem 2rem; text-align: center; color: var(--app-text-muted);
}
.empty-state i[b-q84nsl8o31] { font-size: 3rem; opacity: 0.3; margin-bottom: 1rem; color: var(--app-text-muted); }
.empty-state h3[b-q84nsl8o31] { margin: 0 0 0.5rem 0; font-size: 1.3rem; color: var(--app-heading); }
.empty-state p[b-q84nsl8o31] { margin: 0; font-size: 0.95rem; }

/* ─── Model Type Sections (grid wrapper; the sections themselves live in EnergyModelTypeSection) ─── */
.model-sections-grid[b-q84nsl8o31] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    margin-top: 1.25rem;
}

/* ─── Visualization Panel ─────────────────────────────────────────── */
.viz-panel[b-q84nsl8o31] {
    margin-top: 1.5rem; padding: 1.25rem;
    background: var(--app-surface-alt); border: 1px solid var(--app-border);
    border-radius: 12px;
}

.viz-header[b-q84nsl8o31] {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1px solid var(--app-border);
}
.viz-header h4[b-q84nsl8o31] { margin: 0; font-size: 1rem; font-weight: 600; color: var(--app-heading); display: flex; align-items: center; gap: 0.5rem; }
.viz-version[b-q84nsl8o31] { font-size: 0.75rem; font-weight: 400; color: var(--app-text-muted); }
.viz-controls[b-q84nsl8o31] { display: flex; align-items: center; gap: 0.75rem; }
.viz-metric-select[b-q84nsl8o31] { width: auto; min-width: 160px; font-size: 0.82rem; padding: 4px 8px; }
.viz-right-header[b-q84nsl8o31] { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 0.75rem; }

.viz-loading[b-q84nsl8o31] { display: flex; align-items: center; gap: 0.75rem; padding: 2rem; color: var(--app-text-muted); font-size: 0.9rem; }

.viz-content[b-q84nsl8o31] { display: grid; grid-template-columns: 1fr 2fr; gap: 1.5rem; }
.viz-left h5[b-q84nsl8o31], .viz-right h5[b-q84nsl8o31] {
    margin: 0 0 0.75rem 0; font-size: 0.82rem; font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.04em; color: var(--app-text-muted);
}

.viz-left canvas[b-q84nsl8o31], .viz-right canvas[b-q84nsl8o31] { width: 100%; border-radius: 6px; }

.monthly-table[b-q84nsl8o31] {
    width: 100%; border-collapse: collapse; font-size: 0.75rem; margin-top: 0.75rem;
}
.monthly-table th[b-q84nsl8o31] {
    text-align: left; padding: 4px 6px; font-size: 0.6rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.06em; color: var(--app-text-muted);
    border-bottom: 1px solid var(--app-border);
}
.monthly-table td[b-q84nsl8o31] {
    padding: 3px 6px; border-bottom: 1px solid rgba(255,255,255,0.03);
    color: var(--app-text); font-variant-numeric: tabular-nums;
}

/* ─── Modal ────────────────────────────────────────────────────────── */
.modal-backdrop[b-q84nsl8o31] {
    position: fixed; inset: 0; z-index: 1000;
    background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
    display: flex; align-items: flex-start; justify-content: center;
    padding-top: 8vh; overflow-y: auto;
}

.modal-dialog[b-q84nsl8o31] {
    width: 480px; max-width: 95vw;
    background: var(--app-surface); border: 1px solid var(--app-border);
    border-radius: 14px; box-shadow: 0 20px 60px rgba(0,0,0,0.4);
    overflow: hidden;
}

.modal-header[b-q84nsl8o31] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.25rem; border-bottom: 1px solid var(--app-border);
}
.modal-header h3[b-q84nsl8o31] { margin: 0; font-size: 1rem; font-weight: 600; color: var(--app-heading); display: flex; align-items: center; gap: 0.5rem; }

.modal-close[b-q84nsl8o31] { background: none; border: none; color: var(--app-text-muted); cursor: pointer; font-size: 1rem; padding: 4px; }
.modal-close:hover[b-q84nsl8o31] { color: var(--app-text); }

.modal-body[b-q84nsl8o31] { padding: 1.25rem; display: flex; flex-direction: column; gap: 1rem; }

.upload-format-hint[b-q84nsl8o31] {
    margin: 0.25rem 0 0 0; font-size: 0.72rem; line-height: 1.5;
    color: var(--app-text-muted); opacity: 0.8;
}
.upload-format-hint b[b-q84nsl8o31] { color: var(--app-text); font-weight: 600; }
.upload-format-hint code[b-q84nsl8o31] {
    font-size: 0.68rem; padding: 1px 4px; border-radius: 3px;
    background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.65);
}

.modal-footer[b-q84nsl8o31] {
    display: flex; justify-content: flex-end; gap: 0.75rem;
    padding: 1rem 1.25rem; border-top: 1px solid var(--app-border);
}

.form-row[b-q84nsl8o31] { display: flex; flex-direction: column; gap: 0.3rem; }

.toggle-row-wrap[b-q84nsl8o31] { flex-direction: row; align-items: center; gap: 0.75rem; }

.file-name[b-q84nsl8o31] { font-size: 0.78rem; color: var(--app-text-muted); margin-top: 4px; }

.btn-primary[b-q84nsl8o31] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    padding: 8px 18px; border-radius: 8px; font-size: 0.85rem; font-weight: 600;
    background: var(--app-accent); color: #fff; border: none; cursor: pointer;
    transition: all 0.15s;
}
.btn-primary:hover[b-q84nsl8o31] { filter: brightness(1.1); }
.btn-primary:disabled[b-q84nsl8o31] { opacity: 0.5; cursor: not-allowed; }

.btn-secondary[b-q84nsl8o31] {
    padding: 8px 18px; border-radius: 8px; font-size: 0.85rem; font-weight: 500;
    background: rgba(255,255,255,0.05); color: var(--app-text-muted); border: 1px solid var(--app-border);
    cursor: pointer; transition: all 0.15s;
}
.btn-secondary:hover[b-q84nsl8o31] { background: rgba(255,255,255,0.08); }

.save-toast[b-q84nsl8o31] {
    font-size: 0.82rem; padding: 8px 12px; border-radius: 8px;
    background: rgba(0, 177, 118, 0.12); color: var(--app-accent);
}
.save-toast.error[b-q84nsl8o31] { background: rgba(231, 76, 60, 0.12); color: #e74c3c; }

/* Toggle switch */
.toggle-switch[b-q84nsl8o31] { position: relative; display: inline-block; width: 38px; height: 20px; flex-shrink: 0; }
.toggle-switch input[b-q84nsl8o31] { opacity: 0; width: 0; height: 0; }
.toggle-slider[b-q84nsl8o31] {
    position: absolute; cursor: pointer; inset: 0;
    background: rgba(255,255,255,0.12); border-radius: 20px;
    transition: background 0.2s;
}
.toggle-slider[b-q84nsl8o31]::before {
    content: ''; position: absolute; height: 14px; width: 14px;
    left: 3px; bottom: 3px; background: #fff; border-radius: 50%;
    transition: transform 0.2s;
}
.toggle-switch input:checked + .toggle-slider[b-q84nsl8o31] { background: var(--app-accent); }
.toggle-switch input:checked + .toggle-slider[b-q84nsl8o31]::before { transform: translateX(18px); }

.toggle-label-text[b-q84nsl8o31] { font-size: 0.85rem; color: var(--app-text); }

.file-input[b-q84nsl8o31] { font-size: 0.85rem; }
/* /Components/Pages/EnergyModelTypeSection.razor.rz.scp.css */
/* Scoped styles for EnergyModelTypeSection. These rules moved out of EnergyModels' page-level <style> when
   the section was extracted into this component — scoped CSS does not cross the component boundary, so the
   markup here needs its own copy (the classes are used only by this component). */

.model-type-section[b-gblfru26iv] {
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    padding: 1rem;
}

.model-type-header[b-gblfru26iv] {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 0.5rem; padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--app-border);
}

.model-type-title[b-gblfru26iv] { display: flex; align-items: center; gap: 0.6rem; }
.model-type-title h4[b-gblfru26iv] { margin: 0; font-size: 0.95rem; font-weight: 600; color: var(--app-heading); }
.model-type-actions[b-gblfru26iv] { display: flex; gap: 6px; }

.model-card-icon[b-gblfru26iv] {
    display: flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; font-size: 1.1rem; flex-shrink: 0;
}

.model-interval[b-gblfru26iv] {
    font-size: 0.65rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--app-text-muted); opacity: 0.7; background: rgba(255,255,255,0.05);
    padding: 1px 6px; border-radius: 4px;
}

.model-empty[b-gblfru26iv] { padding: 0.5rem 0; color: var(--app-text-muted); font-size: 0.82rem; font-style: italic; }

/* Model Table */
.model-table[b-gblfru26iv] {
    width: 100%; border-collapse: collapse; font-size: 0.82rem;
}
.model-table thead th[b-gblfru26iv] {
    text-align: left; padding: 6px 10px; font-size: 0.65rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.08em; color: var(--app-text-muted);
    border-bottom: 1px solid var(--app-border);
}
.model-table tbody tr[b-gblfru26iv] {
    border-bottom: 1px solid rgba(255,255,255,0.03);
    transition: background 0.15s;
}
.model-table tbody tr:hover[b-gblfru26iv] { background: rgba(255,255,255,0.03); }
.model-table tbody tr.is-default[b-gblfru26iv] { background: rgba(0, 177, 118, 0.05); }
.model-table tbody tr.is-viewing[b-gblfru26iv] { background: rgba(52,152,219,0.08); border-left: 3px solid #3498db; }
.model-table td[b-gblfru26iv] { padding: 8px 10px; vertical-align: middle; }

.model-name[b-gblfru26iv] { display: block; font-weight: 500; color: var(--app-text); }
.model-meta[b-gblfru26iv] { display: block; font-size: 0.7rem; color: var(--app-text-muted); margin-top: 1px; }

.reporting-badge[b-gblfru26iv] {
    display: inline-flex; align-items: center; gap: 3px;
    font-size: 0.7rem; font-weight: 600; color: var(--app-accent);
    background: rgba(0, 177, 118, 0.12); border-radius: 999px; padding: 2px 8px;
}

/* Action links */
.action-link[b-gblfru26iv] {
    background: none; border: none; cursor: pointer; font-size: 0.78rem; font-weight: 500;
    padding: 2px 4px; transition: opacity 0.15s;
}
.action-link.view[b-gblfru26iv] { color: #3498db; }
.action-link.view:hover[b-gblfru26iv] { color: #5dade2; }
.action-link.edit[b-gblfru26iv] { color: #e67e22; }
.action-link.edit:hover[b-gblfru26iv] { color: #f0a04b; }
.action-link.delete[b-gblfru26iv] { color: #e74c3c; }
.action-link.delete:hover[b-gblfru26iv] { color: #f1756a; }
.action-sep[b-gblfru26iv] { color: var(--app-text-muted); opacity: 0.3; font-size: 0.75rem; margin: 0 1px; }
.actions-cell[b-gblfru26iv] { text-align: center; white-space: nowrap; }

/* Upload / Template buttons */
.btn-upload[b-gblfru26iv], .btn-template[b-gblfru26iv] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    padding: 4px 10px; border-radius: 6px; font-size: 0.72rem; font-weight: 600;
    cursor: pointer; transition: all 0.15s; border: none;
}
.btn-upload[b-gblfru26iv] {
    background: rgba(0, 177, 118, 0.15); color: var(--app-accent); border: 1px solid rgba(0, 177, 118, 0.25);
}
.btn-upload:hover[b-gblfru26iv] { background: rgba(0, 177, 118, 0.25); }
.btn-template[b-gblfru26iv] {
    background: rgba(255,255,255,0.04); color: var(--app-text-muted); border: 1px solid var(--app-border);
}
.btn-template:hover[b-gblfru26iv] { background: rgba(255,255,255,0.08); color: var(--app-text); }
/* /Components/Pages/FacilityDevices/ConfigureFacility.razor.rz.scp.css */
/* Scoped stylesheet for ConfigureFacility, hoisted verbatim from a 2367-line inline <style> block on 2026-08-17.

   ⚠️ Scoped CSS applies ONLY to elements this component itself renders. The inline <style> it replaced was
   global, so any class applied to a CHILD COMPONENT's tag silently stopped matching when it moved here.
   ScopedCssReachabilityTests guards this; see the ::deep twin at the .ai-file-input rule and the note there.

   Dialog chrome (.dialog-overlay, .dialog, .dialog-header, .dialog-body, .dialog-footer) is deliberately NOT
   here — it lives in wwwroot/css/app.css, is shared with other pages, and stays global. */
    .facility-layout[b-6p64gyf7pd] {
        display: grid;
        grid-template-columns: 320px 1fr;
        gap: 2rem;
        min-height: 500px;
        transition: grid-template-columns 0.3s ease;
    }

    .facility-sidebar[b-6p64gyf7pd] {
        background: var(--app-surface-alt);
        border: 1px solid var(--app-border);
        border-radius: 12px;
        padding: 1.25rem;
        transition: padding 0.3s ease, opacity 0.25s ease;
        overflow: hidden;
    }

    .section-header[b-6p64gyf7pd] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1rem;
    }

    .section-header h3[b-6p64gyf7pd] {
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .sidebar-field[b-6p64gyf7pd] {
        margin-bottom: 1rem;
    }

    .sidebar-field .text-label[b-6p64gyf7pd] {
        display: block;
        margin-bottom: 0.35rem;
        font-size: 0.8rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--app-text-muted);
    }

    .typeahead-wrap[b-6p64gyf7pd] {
        position: relative;
    }

    .typeahead-input[b-6p64gyf7pd] {
        width: 100%;
        padding-right: 2rem;
    }

    .typeahead-clear[b-6p64gyf7pd] {
        position: absolute;
        right: 6px;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        color: var(--app-text-muted);
        cursor: pointer;
        padding: 2px 4px;
        font-size: 0.9rem;
        line-height: 1;
        opacity: 0.6;
        transition: opacity 0.15s;
    }

    .typeahead-clear:hover[b-6p64gyf7pd] {
        opacity: 1;
        color: var(--app-danger);
    }

    .typeahead-dropdown[b-6p64gyf7pd] {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 100;
        max-height: 220px;
        overflow-y: auto;
        background: var(--app-surface);
        border: 1px solid var(--app-border);
        border-top: none;
        border-radius: 0 0 8px 8px;
        box-shadow: 0 6px 16px rgba(0,0,0,0.35);
    }

    .typeahead-option[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        width: 100%;
        padding: 0.5rem 0.75rem;
        background: none;
        border: none;
        border-bottom: 1px solid rgba(255,255,255,0.04);
        color: var(--app-text);
        font-size: 0.85rem;
        text-align: left;
        cursor: pointer;
        transition: background 0.12s;
    }

    .typeahead-option:hover[b-6p64gyf7pd] {
        background: rgba(0, 177, 118, 0.1);
    }

    .typeahead-option.active[b-6p64gyf7pd] {
        background: rgba(0, 177, 118, 0.18);
    }

    .typeahead-code[b-6p64gyf7pd] {
        font-weight: 700;
        color: var(--app-accent);
        font-size: 0.8rem;
        min-width: 40px;
        font-family: 'JetBrains Mono', monospace;
    }

    .typeahead-empty[b-6p64gyf7pd] {
        padding: 0.75rem;
        text-align: center;
        color: var(--app-text-muted);
        font-size: 0.85rem;
    }

    .facility-hint[b-6p64gyf7pd] {
        margin-top: 0.5rem;
        font-size: 0.8rem;
        font-style: italic;
        color: var(--app-primary);
    }

    .select-loading[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
        font-size: 0.85rem;
        color: var(--app-text-muted);
        background: var(--app-surface-alt);
        border: 1px solid var(--app-border);
        border-radius: 8px;
    }

    /* ::deep twin: SiteBackupMergeDialog.razor (SP4 Task 1) renders this class while a merge is in flight —
       the scoped-CSS reachability guard named it. @@keyframes are never scoped by Blazor's rewrite (see the
       .spin-icon comment above for why), so select-spin itself needs no twin. */
    .select-spinner[b-6p64gyf7pd], [b-6p64gyf7pd] .select-spinner {
        display: inline-block;
        width: 14px;
        height: 14px;
        border: 2px solid rgba(255,255,255,0.15);
        border-top-color: var(--app-accent);
        border-radius: 50%;
        animation: select-spin 0.6s linear infinite;
    }

    @@keyframes select-spin {
        to[b-6p64gyf7pd] { transform: rotate(360deg); }
    }

    .sidebar-empty[b-6p64gyf7pd],
    .tree-empty[b-6p64gyf7pd] {
        text-align: center;
        padding: 2rem;
        color: var(--app-text-muted);
    }

    .tree-empty i[b-6p64gyf7pd] {
        font-size: 3rem;
        opacity: 0.5;
        margin-bottom: 0.75rem;
    }

    .device-tree-panel[b-6p64gyf7pd] {
        display: flex;
        flex-direction: column;
        overflow: hidden;
        min-width: 0;
    }

    .tree-header[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        margin-bottom: 0;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .tree-header h3[b-6p64gyf7pd] {
        font-size: 1.1rem;
        flex: 1;
    }

    .tree-header-meta[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .import-badge[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        background: rgba(34, 197, 94, 0.15);
        color: rgb(34, 197, 94);
        padding: 0.2rem 0.6rem;
        border-radius: 999px;
        font-size: 0.78rem;
        font-weight: 500;
    }
    .import-badge-btn[b-6p64gyf7pd] {
        border: 1px solid rgba(34, 197, 94, 0.3);
        cursor: pointer;
        transition: background 0.15s, border-color 0.15s;
    }
    .import-badge-btn:hover[b-6p64gyf7pd] {
        background: rgba(34, 197, 94, 0.25);
        border-color: rgba(34, 197, 94, 0.5);
    }
    .import-dropdown[b-6p64gyf7pd] {
        position: absolute;
        top: 100%;
        right: 0;
        margin-top: 0.35rem;
        background: var(--app-surface, #1e1e2e);
        border: 1px solid var(--app-border, #333);
        border-radius: 8px;
        padding: 0.35rem 0;
        min-width: 200px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.4);
        z-index: 100;
    }
    .import-dropdown-item[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        width: 100%;
        padding: 0.5rem 0.85rem;
        background: none;
        border: none;
        color: var(--app-text, #ccc);
        font-size: 0.82rem;
        cursor: pointer;
        transition: background 0.12s;
        text-align: left;
    }
    .import-dropdown-item:hover[b-6p64gyf7pd] {
        background: rgba(255,255,255,0.07);
    }
    .import-dropdown-item i[b-6p64gyf7pd] {
        font-size: 0.9rem;
        opacity: 0.7;
    }

    .tree-header-rule[b-6p64gyf7pd] {
        border: none;
        border-top: 1px solid var(--app-border);
        margin: 0.75rem 0 1.25rem;
    }

    /* Large-site filter bar */
    .large-site-filter-bar[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.4rem 0.75rem;
        background: rgba(255, 255, 255, 0.03);
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 8px;
        margin-bottom: 1rem;
        flex-wrap: wrap;
    }
    .lsf-label[b-6p64gyf7pd] {
        font-size: 0.75rem;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.5);
        text-transform: uppercase;
        letter-spacing: 0.04em;
        white-space: nowrap;
    }
    .lsf-checkboxes[b-6p64gyf7pd] {
        display: flex;
        gap: 0.4rem;
        align-items: center;
        flex-wrap: wrap;
    }
    .lsf-check-label[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        font-size: 0.72rem;
        color: rgba(255, 255, 255, 0.45);
        cursor: pointer;
        padding: 0.2rem 0.5rem;
        border-radius: 4px;
        border: 1px solid transparent;
        transition: all 0.15s ease;
        white-space: nowrap;
    }
    .lsf-check-label:hover[b-6p64gyf7pd] {
        color: rgba(255, 255, 255, 0.7);
        background: rgba(255, 255, 255, 0.04);
    }
    .lsf-check-label.active[b-6p64gyf7pd] {
        color: #dc3545;
        background: rgba(220, 53, 69, 0.1);
        border-color: rgba(220, 53, 69, 0.25);
    }
    .lsf-check-label input[type="checkbox"][b-6p64gyf7pd] {
        accent-color: #dc3545;
        margin: 0;
    }
    .lsf-sep[b-6p64gyf7pd] {
        color: rgba(255, 255, 255, 0.15);
        font-size: 0.85rem;
        margin: 0 0.15rem;
    }
    .lsf-select[b-6p64gyf7pd] {
        background: var(--app-surface);
        color: var(--app-text);
        border: 1px solid var(--app-border);
        border-radius: 6px;
        padding: 0.25rem 0.5rem;
        font-size: 0.75rem;
        min-width: 180px;
        max-width: 250px;
    }
    .lsf-select:focus[b-6p64gyf7pd] {
        outline: none;
        border-color: var(--app-accent);
    }

    /* Import Progress Overlay */
    .import-progress[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
        min-height: 300px;
    }

    .import-progress-inner[b-6p64gyf7pd] {
        text-align: center;
        max-width: 360px;
    }

    .import-progress-inner i[b-6p64gyf7pd] {
        font-size: 2.5rem;
        color: var(--app-accent);
        margin-bottom: 0.75rem;
    }

    .import-progress-inner h3[b-6p64gyf7pd] {
        font-size: 1.15rem;
        margin-bottom: 0.5rem;
    }

    .import-status[b-6p64gyf7pd] {
        font-size: 0.88rem;
        color: var(--app-text-muted);
        margin-bottom: 0.75rem;
    }

    .import-bar-track[b-6p64gyf7pd] {
        height: 4px;
        background: var(--app-border);
        border-radius: 2px;
        overflow: hidden;
        margin-bottom: 0.75rem;
    }

    .import-bar-fill[b-6p64gyf7pd] {
        height: 100%;
        width: 40%;
        background: var(--app-accent);
        border-radius: 2px;
        animation: importPulse 1.5s ease-in-out infinite;
    }

    @@keyframes importPulse {
        0%[b-6p64gyf7pd] { transform: translateX(-100%); }
        100%[b-6p64gyf7pd] { transform: translateX(350%); }
    }

    .import-hint[b-6p64gyf7pd] {
        font-size: 0.78rem;
        color: var(--app-text-muted);
        opacity: 0.6;
    }

    /* Editor Tabs */
    .editor-tabs[b-6p64gyf7pd] {
        display: flex;
        border-bottom: 1px solid var(--app-border);
        padding: 0 1.25rem;
        gap: 0;
    }

    .editor-tab[b-6p64gyf7pd] {
        flex: 1;
        padding: 0.65rem 1rem;
        background: transparent;
        border: none;
        border-bottom: 2px solid transparent;
        color: var(--app-text-muted);
        cursor: pointer;
        font-size: 0.88rem;
        font-weight: 500;
        transition: all 0.15s;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
    }

    .editor-tab:hover[b-6p64gyf7pd] {
        color: var(--app-text);
    }

    .editor-tab.active[b-6p64gyf7pd] {
        color: var(--acuity-clean-green, var(--app-accent));
        border-bottom-color: var(--acuity-clean-green, var(--app-accent));
    }

    /* .editor-tab / .editor-tab.active (above) and .editor-tab:disabled (line ~798) are now DEAD: the tab
       strip's own <button> is AderisTabs' (its .aderis-tabs__tab / .is-active, not ours), so none of these
       selectors can match anything any more (SP2 Plan A Task 7). Left in place rather than deleted — out of
       that task's scope.

       🔴 FOLLOW-UP — THE COMMS/LEGACY ACCENT RULES THAT USED TO SIT HERE ARE DELETED. FOLLOW UP IF THE
       COLOUR CODING MATTERED. `.editor-tab-comms.active` was Acuity clearsky blue (#1e8bf7) and
       `.editor-tab-legacy.active` was Acuity purple (#a78bfa); each set BOTH the label colour and a 2px
       border-bottom-color underline on the tab button. Both died with the <button> in Task 7, and the
       label-only partial restore that briefly replaced them (`.editor-tab-header-comms` / `-legacy`, once
       just below `.editor-tab-header.is-locked`) is deleted along with them. The user chose a clean uniform
       strip over a half-effect in the Task 8 human pass, 2026-08-18. AderisTabs still draws its own
       indicator, so the active tab still reads as selected — only the per-tab colour coding is lost. Full
       reasoning and the revival recipe live on TabHeaderFragment in ConfigureFacility.razor; the proper fix
       is an accent parameter on AderisTabs in Aderis.Common, NOT a third consumer-side hack. The removal is
       pinned by Tab_headers_carry_no_accent_class_on_any_tab. */

    /* TabHeader's content span: mirrors .editor-tab's icon+label layout, and — while the tracker's edit mode
       locks the strip — .editor-tab:disabled's greyed appearance (opacity/pointer-events copied verbatim;
       AderisTabs' <button> still receives the click, so pointer-events alone would not stop it — the actual
       lock is OnEditorTabRequested declining to write the value back). */
    .editor-tab-header[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
    }

    .editor-tab-header.is-locked[b-6p64gyf7pd] {
        opacity: 0.35;
        pointer-events: none;
    }

    /* ─── Virtual Device Badge ─── */
    /* ::deep twins: .virtual-badge, .virtual-makemodel-badge, .config-status-banner (+ its .configured/
       .incomplete modifiers) are also used by EditorGeneralTab.razor (Plan A, Task 3) — each stays reachable
       from the page's own remaining usages (e.g. the config tab's banners, the device-tree VIRTUAL badge)
       while the ::deep twin lets the child component reach the same rule. */
    .virtual-badge[b-6p64gyf7pd], [b-6p64gyf7pd] .virtual-badge {
        display: inline-block;
        background: rgba(167, 139, 250, 0.18);
        color: var(--acuity-purple, #a78bfa);
        font-size: 0.68rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        padding: 2px 8px;
        border-radius: 4px;
        margin-left: 8px;
        vertical-align: middle;
    }
    .virtual-makemodel-badge[b-6p64gyf7pd], [b-6p64gyf7pd] .virtual-makemodel-badge {
        display: flex;
        align-items: center;
        height: 38px;
    }

    /* ─── Config Status Banner ─── */
    .config-status-banner[b-6p64gyf7pd], [b-6p64gyf7pd] .config-status-banner {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        padding: 0.6rem 1rem;
        border-radius: 6px;
        font-size: 0.82rem;
        font-weight: 500;
    }
    .config-status-banner.configured[b-6p64gyf7pd], [b-6p64gyf7pd] .config-status-banner.configured {
        background: rgba(46, 204, 113, 0.12);
        color: #2ecc71;
        border: 1px solid rgba(46, 204, 113, 0.25);
    }
    .config-status-banner.incomplete[b-6p64gyf7pd], [b-6p64gyf7pd] .config-status-banner.incomplete {
        background: rgba(241, 196, 15, 0.12);
        color: #f1c40f;
        border: 1px solid rgba(241, 196, 15, 0.25);
    }

    /* ─── Configuration Tab (Virtual) ─── */
    .virtual-config-tab[b-6p64gyf7pd] {
        padding: 0.5rem 0;
    }
    .virtual-config-header[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        font-size: 1rem;
        font-weight: 600;
        color: var(--app-text);
        margin-bottom: 0.5rem;
    }
    .virtual-config-header i[b-6p64gyf7pd] {
        color: var(--acuity-purple, #a78bfa);
        font-size: 1.15rem;
    }
    .virtual-config-desc[b-6p64gyf7pd] {
        color: var(--app-text-muted);
        font-size: 0.82rem;
        margin: 0 0 1rem 0;
        line-height: 1.5;
    }
    /* ::deep twins: .virtual-section-title, .formula-operator, .calc-steps-list, .calc-step-row, .calc-step-op,
       .calc-op-select, .calc-step-remove, .calc-add-step-btn, .calc-measure-mapping, .calc-type-mapping-row,
       .calc-type-label, .calc-type-measures and .device-code-badge (below) were added for CalcStepsPanel
       (SP2 Plan B Task 3) — named by ScopedCssReachabilityTests once the CalculatedMeter markup moved there. */
    .virtual-section-title[b-6p64gyf7pd], [b-6p64gyf7pd] .virtual-section-title {
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--app-text-muted);
        text-transform: uppercase;
        letter-spacing: 0.06em;
        margin: 0 0 0.6rem 0;
    }

    /* Formula steps */
    .virtual-formula-steps[b-6p64gyf7pd] {
        display: flex;
        flex-direction: column;
        gap: 0.3rem;
    }
    .virtual-formula-step[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.45rem 0.75rem;
        background: rgba(255, 255, 255, 0.03);
        border-radius: 5px;
        font-family: 'JetBrains Mono', 'Fira Code', monospace;
        font-size: 0.82rem;
    }
    .formula-operator[b-6p64gyf7pd], [b-6p64gyf7pd] .formula-operator {
        color: #f1c40f;
        font-weight: 700;
        min-width: 1.2rem;
        text-align: center;
    }
    .formula-aggregation[b-6p64gyf7pd] {
        color: var(--acuity-purple, #a78bfa);
        font-weight: 600;
    }
    .formula-paren[b-6p64gyf7pd] {
        color: var(--app-text-muted);
        opacity: 0.5;
    }
    .formula-device-type[b-6p64gyf7pd] {
        color: var(--acuity-clearsky-blue, #1e8bf7);
    }
    .formula-dot[b-6p64gyf7pd] {
        color: var(--app-text-muted);
    }
    .formula-measure[b-6p64gyf7pd] {
        color: var(--acuity-clean-green, #10b981);
    }

    /* Per-instance calc step builder */
    .calc-steps-list[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-steps-list {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        margin-bottom: 0.75rem;
    }
    .calc-step-row[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-step-row {
        display: grid;
        grid-template-columns: 48px 1fr 32px;
        gap: 0.5rem;
        align-items: center;
    }
    .calc-step-op[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-step-op {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .calc-op-select[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-op-select {
        width: 48px;
        padding: 4px !important;
        text-align: center;
        text-align-last: center;
        font-weight: 700;
        font-size: 1rem;
        -webkit-appearance: none;
        appearance: none;
        background-image: none;
    }
    .calc-step-remove[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-step-remove {
        font-size: 0.75rem;
        padding: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .calc-add-step-btn[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-add-step-btn {
        font-size: 0.8rem;
        padding: 6px 14px;
        display: inline-flex;
        align-items: center;
        gap: 0.4rem;
    }
    .calc-measure-mapping[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-measure-mapping {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }
    .calc-type-mapping-row[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-type-mapping-row {
        background: rgba(255,255,255,0.02);
        border: 1px solid rgba(255,255,255,0.06);
        border-radius: 8px;
        padding: 0.75rem;
    }
    .calc-type-label[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-type-label {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-bottom: 0.5rem;
        font-weight: 600;
        font-size: 0.85rem;
    }
    .calc-type-measures[b-6p64gyf7pd], [b-6p64gyf7pd] .calc-type-measures {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    /* Tracker Motion Profile settings */
    .tracker-header-row[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .tracker-edit-btn[b-6p64gyf7pd] {
        font-size: 1.1rem;
        padding: 4px 8px;
    }
    /* ::deep twins below: TrackerConfigPanel.razor renders BOTH the "Tracking Simulation Settings" card (SP2
       Plan B Task 4) and the "Simulation Preview" card + the type badge/description wrapper (Task 5) as a
       child component, so classes defined only in this page sheet need the ::deep twin to still reach them.
       The bare selector is KEPT alongside ::deep for every one of these — not because the page still renders
       any of them (it no longer does, post-Task 5), but for the same consistency-across-families reason every
       other family in this file keeps its bare selector too (e.g. .legacy-no-json).

       Twinned per SELECTOR, not per class (superseding note 5): ScopedCssReachabilityTests only checks
       class-level reachability, so .tracker-card-header:hover and the element-qualified descendants of
       .tracker-settings-table (th, td, tbody tr) are invisible to it and would have gone unstyled inside the
       child while the guard stayed green. */
    .tracker-settings-table[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-settings-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.82rem;
    }
    .tracker-settings-table th[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-settings-table th {
        text-align: left;
        padding: 6px 10px;
        font-weight: 600;
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        color: var(--app-text-muted);
        border-bottom: 1px solid rgba(255,255,255,0.08);
    }
    .tracker-settings-table td[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-settings-table td {
        padding: 7px 10px;
        border-bottom: 1px solid rgba(255,255,255,0.04);
    }
    .tracker-settings-table td:first-child[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-settings-table td:first-child {
        font-weight: 500;
        width: 45%;
    }
    .tracker-settings-table td:last-child[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-settings-table td:last-child {
        color: var(--app-text-muted);
        width: 15%;
        text-align: right;
    }
    .tracker-settings-table tbody tr:nth-child(even)[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-settings-table tbody tr:nth-child(even) {
        background: rgba(255,255,255,0.015);
    }
    .tracker-edit-form[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-edit-form {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }
    .tracker-edit-grid[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-edit-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }
    .tracker-facility-toggle[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-facility-toggle {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        padding: 0.5rem 0;
    }
    .tracker-edit-actions[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-edit-actions {
        display: flex;
        justify-content: flex-end;
        padding-top: 0.5rem;
    }
    .tracker-card[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-card {
        border: 1px solid rgba(255,255,255,0.06);
        border-radius: 6px;
        overflow: hidden;
    }
    .tracker-card.open[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-card.open {
        border-color: rgba(255,255,255,0.1);
    }
    .tracker-card-header[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-card-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0.4rem 0.65rem;
        background: rgba(255,255,255,0.03);
        cursor: pointer;
        font-size: 0.82rem;
        font-weight: 600;
        color: rgba(255,255,255,0.8);
        user-select: none;
    }
    .tracker-card-header:hover[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-card-header:hover {
        background: rgba(255,255,255,0.05);
    }
    .tracker-card-body[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-card-body {
        padding: 0.65rem;
        border-top: 1px solid rgba(255,255,255,0.04);
    }
    .tracker-type-badge[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-type-badge {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.85rem;
        font-weight: 600;
        color: rgba(255,255,255,0.85);
        margin-bottom: 0.25rem;
    }
    .tracker-preview-controls[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-preview-controls {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .tracker-preview-chart[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-preview-chart {
        width: 100%;
        max-width: 680px;
        height: auto;
        border-radius: 6px;
        margin-top: 0.25rem;
    }
    .tracker-preview-date-label[b-6p64gyf7pd], [b-6p64gyf7pd] .tracker-preview-date-label {
        text-align: center;
        font-size: 0.72rem;
        color: rgba(255,255,255,0.4);
        margin-top: 0.25rem;
    }
    /* @@keyframes are never scoped by Blazor's CSS isolation rewrite — it only rewrites SELECTORS, and a
       keyframes block's "selectors" are offset keywords/percentages, not elements — so spinIcon stays reachable
       by name from the child component with no ::deep equivalent needed. .spin-icon itself DOES need the twin:
       it is a pure class selector (no element qualifier), so per superseding note 4 it is not a conversion
       blocker, and TrackerConfigPanel's Generate button now renders it via AderisIcon's Class parameter. */
    @@keyframes spinIcon {
        from[b-6p64gyf7pd] { transform: rotate(0deg); }
        to[b-6p64gyf7pd] { transform: rotate(360deg); }
    }
    .spin-icon[b-6p64gyf7pd], [b-6p64gyf7pd] .spin-icon {
        display: inline-block;
        animation: spinIcon 0.8s linear infinite;
    }
    .editor-tab:disabled[b-6p64gyf7pd] {
        opacity: 0.35;
        pointer-events: none;
    }
    .virtual-config-placeholder[b-6p64gyf7pd] {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 0.8rem;
        padding: 2.5rem 1rem;
        text-align: center;
        color: var(--app-text-muted);
        font-size: 0.88rem;
    }
    .virtual-config-placeholder p[b-6p64gyf7pd] {
        margin: 0;
        line-height: 1.6;
    }

    /* ─── POA Config Form ─── */
    /* ::deep twins: .poa-config-form, .poa-config-row, .poa-info-icon (+ :hover), .poa-help-bubble were added
       by BomConfigPanel.razor (SP2 Plan B, Task 1) — the scoped-CSS reachability guard named those.
       .poa-mode-row, .poa-radio-label, .poa-input-unit and .poa-unit are added here by PoaConfigPanel.razor
       (Task 2) — BomConfigPanel does not use them, but PoaConfigPanel's radio pair and its azimuth/tilt/
       multiplier inputs do; the guard named all four. */
    .poa-config-form[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-config-form {
        display: flex;
        flex-direction: column;
        gap: 0.8rem;
        margin-top: 0.5rem;
    }
    .poa-config-row[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-config-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }
    .poa-mode-row[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-mode-row {
        display: flex;
        gap: 1.5rem;
        align-items: center;
        padding: 0.5rem 0;
    }
    .poa-radio-label[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-radio-label {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        cursor: pointer;
        color: var(--app-text);
        font-size: 0.88rem;
    }
    /* ::deep twin needed here even though .poa-radio-label already has one above: Blazor's scoped-CSS rewrite
       appends the scope attribute to the LAST simple selector in a rule, so this compound selector's own scope
       requirement is anchored on the <input>, not on .poa-radio-label — a per-selector concern the reachability
       guard cannot see because it only tracks class names, not full selectors (see the guard's own doc comment
       and Task 2's report). Without this twin the radio buttons keep their default accent color instead of
       green once rendered from PoaConfigPanel. */
    .poa-radio-label input[type="radio"][b-6p64gyf7pd], [b-6p64gyf7pd] .poa-radio-label input[type="radio"] {
        accent-color: var(--acuity-clean-green, #10b981);
    }
    .poa-input-unit[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-input-unit {
        display: flex;
        align-items: center;
        gap: 0.4rem;
    }
    .poa-unit[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-unit {
        color: var(--app-text-muted);
        font-size: 0.9rem;
        font-weight: 500;
    }
    .poa-info-icon[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-info-icon {
        color: #4a9eff;
        font-size: 0.75rem;
        margin-left: 0.3rem;
        cursor: help;
        opacity: 0.85;
    }
    .poa-info-icon:hover[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-info-icon:hover {
        opacity: 1;
    }
    .poa-help-bubble[b-6p64gyf7pd], [b-6p64gyf7pd] .poa-help-bubble {
        background: rgba(74, 158, 255, 0.1);
        border: 1px solid rgba(74, 158, 255, 0.3);
        border-radius: 6px;
        padding: 0.5rem 0.75rem;
        font-size: 0.8rem;
        line-height: 1.5;
        color: var(--app-text);
        margin-top: 0.25rem;
        margin-bottom: 0.25rem;
    }

    /* ::deep twin: EditorGeneralTab.razor (Plan A, Task 3) is now the only renderer of this class. */
    .editor-toggles-row[b-6p64gyf7pd], [b-6p64gyf7pd] .editor-toggles-row {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 0.5rem;
        padding: 0.75rem 0 0.25rem;
    }

    .form-row-2col[b-6p64gyf7pd] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    /* ::deep twins: EditorCommsTab.razor (Plan A, Task 4) is now the only renderer of these two classes. */
    .comms-row-4col[b-6p64gyf7pd], [b-6p64gyf7pd] .comms-row-4col {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 0.75rem;
        grid-column: 1 / -1;
    }

    .comms-row-2-1-1[b-6p64gyf7pd], [b-6p64gyf7pd] .comms-row-2-1-1 {
        display: grid;
        grid-template-columns: 2fr 1fr 1fr;
        gap: 0.75rem;
        grid-column: 1 / -1;
    }

    /* Legacy Detail Grid */
    /* ::deep twins below: EditorLegacyTab.razor renders this markup as a child component (Plan A, Task 1),
       so classes the page's own scoped sheet defines need the ::deep twin to still reach it. */
    .legacy-grid[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-grid {
        display: flex;
        flex-direction: column;
        gap: 0;
        max-height: 60vh;
        overflow-y: auto;
    }

    .legacy-section-label[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-section-label {
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
        font-weight: 600;
        padding: 0.75rem 0 0.35rem;
        border-bottom: 1px solid var(--app-border);
        margin-bottom: 0.25rem;
    }

    .legacy-section-label:first-child[b-6p64gyf7pd] {
        padding-top: 0;
    }

    .legacy-row[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-row {
        display: grid;
        grid-template-columns: 150px 1fr;
        gap: 0.5rem;
        padding: 0.4rem 0;
        font-size: 0.88rem;
    }

    .legacy-label[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-label {
        color: var(--app-text-muted);
        font-weight: 500;
    }

    .legacy-value[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-value {
        color: var(--app-text);
        font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
        font-size: 0.83rem;
    }

    .legacy-id[b-6p64gyf7pd] {
        color: var(--app-text-muted);
        font-size: 0.78rem;
        margin-left: 0.3rem;
    }

    .legacy-true[b-6p64gyf7pd] { color: #10b981; font-weight: 600; }
    .legacy-false[b-6p64gyf7pd] { color: var(--app-text-muted); }

    .legacy-json[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-json {
        background: rgba(0, 0, 0, 0.3);
        border: 1px solid var(--app-border);
        border-radius: 8px;
        padding: 1rem;
        margin: 0.5rem 0 0;
        font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
        font-size: 0.75rem;
        line-height: 1.5;
        color: var(--app-text);
        white-space: pre-wrap;
        word-break: break-word;
        overflow-x: auto;
    }

    .legacy-no-json[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-no-json {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 1rem;
        margin: 0.5rem 0 0;
        background: rgba(255, 193, 7, 0.08);
        border: 1px solid rgba(255, 193, 7, 0.2);
        border-radius: 8px;
        color: #fbbf24;
        font-size: 0.85rem;
    }

    .legacy-json-site[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-json-site {
        border-color: rgba(99, 102, 241, 0.3);
        background: rgba(99, 102, 241, 0.06);
    }

    .legacy-badge-site[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-badge-site {
        display: inline-block;
        padding: 0.15rem 0.5rem;
        border-radius: 4px;
        background: rgba(99, 102, 241, 0.15);
        color: #818cf8;
        font-size: 0.68rem;
        font-weight: 600;
        text-transform: none;
        letter-spacing: 0;
        margin-left: 0.4rem;
    }

    .legacy-split[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-split {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        overflow: hidden;
    }

    .legacy-split-pane[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-split-pane {
        display: flex;
        flex-direction: column;
        min-height: 60px;
        overflow: hidden;
    }

    .legacy-split-pane .legacy-json[b-6p64gyf7pd] {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        margin: 0;
    }

    .legacy-drag-handle[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-drag-handle {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 10px;
        min-height: 10px;
        cursor: row-resize;
        background: transparent;
        transition: background 0.15s;
        user-select: none;
        margin: 2px 0;
    }

    .legacy-drag-handle:hover[b-6p64gyf7pd],
    .legacy-drag-handle.dragging[b-6p64gyf7pd] {
        background: rgba(99, 102, 241, 0.15);
        border-radius: 4px;
    }

    .legacy-drag-dots[b-6p64gyf7pd], [b-6p64gyf7pd] .legacy-drag-dots {
        color: var(--app-text-muted);
        font-size: 1rem;
        line-height: 1;
        letter-spacing: 0.15em;
        opacity: 0.4;
    }

    .legacy-drag-handle:hover .legacy-drag-dots[b-6p64gyf7pd],
    .legacy-drag-handle.dragging .legacy-drag-dots[b-6p64gyf7pd] {
        opacity: 0.8;
        color: #818cf8;
    }

    .link-upload[b-6p64gyf7pd] {
        color: #818cf8 !important;
        font-size: 0.78rem;
    }

    .link-upload:hover[b-6p64gyf7pd] {
        color: #a5b4fc !important;
    }

    /* Parameters Tab */
    /* ::deep twins: EditorParamsTab.razor (Plan A, Task 6) is now the only renderer of .params-tab/.params-table
       and the classes inside it — nothing on the page itself uses them directly any more, but the bare selector
       is kept alongside ::deep for the same reason every other family in this file does (e.g. .legacy-no-json
       above), rather than special-casing this one family to ::deep-only. */
    .params-tab[b-6p64gyf7pd], [b-6p64gyf7pd] .params-tab {
        overflow-y: auto;
        max-height: 55vh;
    }

    .params-table[b-6p64gyf7pd], [b-6p64gyf7pd] .params-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.88rem;
    }

    .params-table thead th[b-6p64gyf7pd],
    [b-6p64gyf7pd] .params-table thead th {
        text-align: left;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
        font-weight: 600;
        padding: 0.4rem 0.5rem;
        border-bottom: 1px solid var(--app-border);
    }

    .params-col-name[b-6p64gyf7pd], [b-6p64gyf7pd] .params-col-name { width: 45%; }
    .params-col-value[b-6p64gyf7pd], [b-6p64gyf7pd] .params-col-value { width: 55%; }

    .params-table tbody tr[b-6p64gyf7pd],
    [b-6p64gyf7pd] .params-table tbody tr {
        border-bottom: 1px solid rgba(255,255,255,0.04);
    }

    .params-table tbody tr:hover[b-6p64gyf7pd],
    [b-6p64gyf7pd] .params-table tbody tr:hover {
        background: rgba(255,255,255,0.03);
    }

    .params-name[b-6p64gyf7pd], [b-6p64gyf7pd] .params-name {
        padding: 0.35rem 0.5rem;
        color: var(--app-text);
        font-weight: 500;
    }

    .params-required[b-6p64gyf7pd], [b-6p64gyf7pd] .params-required {
        color: #ef4444;
        font-weight: 700;
        margin-left: 0.2rem;
    }

    .params-unit[b-6p64gyf7pd], [b-6p64gyf7pd] .params-unit {
        color: var(--app-text-muted);
        font-size: 0.78rem;
        font-weight: 400;
        margin-left: 0.3rem;
    }

    .params-value-cell[b-6p64gyf7pd], [b-6p64gyf7pd] .params-value-cell {
        padding: 0.25rem 0.5rem;
    }

    /* ::deep twins: .params-select/.params-input are rendered only by EditorMeasuresPanel.razor (Plan A, Task 5)
       and EditorParamsTab.razor (Task 6) — the page itself no longer renders either class directly. */
    .params-input[b-6p64gyf7pd],
    .params-select[b-6p64gyf7pd],
    [b-6p64gyf7pd] .params-input,
    [b-6p64gyf7pd] .params-select {
        width: 100%;
        padding: 0.3rem 0.5rem;
        background: var(--app-bg-alt, #1e1e2e);
        border: 1px solid var(--app-border);
        border-radius: 6px;
        color: var(--app-text);
        font-size: 0.85rem;
        font-family: 'JetBrains Mono', 'Cascadia Code', monospace;
    }

    .params-input:focus[b-6p64gyf7pd],
    .params-select:focus[b-6p64gyf7pd],
    [b-6p64gyf7pd] .params-input:focus,
    [b-6p64gyf7pd] .params-select:focus {
        outline: none;
        border-color: var(--app-primary);
        box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.15);
    }

    .device-row[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0;
        padding: 0.5rem 0;
        border-bottom: 1px solid rgba(255,255,255,0.06);
        transition: background 0.12s;
        border-radius: 4px;
    }

    .device-row:hover[b-6p64gyf7pd] {
        background: rgba(59, 130, 246, 0.1);
    }

    .drag-handle[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        padding: 0 0.5rem;
        cursor: grab;
        color: var(--app-text-muted);
        opacity: 0.3;
        transition: opacity 0.15s;
        font-size: 1rem;
    }

    .drag-handle:hover[b-6p64gyf7pd] {
        opacity: 0.7;
    }

    .device-code-badge[b-6p64gyf7pd], [b-6p64gyf7pd] .device-code-badge {
        font-family: 'JetBrains Mono', monospace;
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        min-width: 3.2rem;
        text-align: center;
        justify-content: center;
        padding: 0.2rem 0.5rem;
        margin-right: 0.5rem;
        border-radius: 4px;
        background: rgba(255, 255, 255, 0.08);
        color: rgba(255, 255, 255, 0.7);
        white-space: nowrap;
        flex-shrink: 0;
    }

    .device-name-group[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .device-indent[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        color: var(--app-text-muted);
        opacity: 0.25;
        font-size: 0.85rem;
        margin-right: 0.35rem;
    }

    .device-svg-icon[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        width: 22px;
        height: 22px;
        flex-shrink: 0;
        color: rgba(255, 255, 255, 0.85);
    }

    .device-svg-icon svg[b-6p64gyf7pd] {
        width: 22px;
        height: 22px;
        fill: currentColor !important;
    }

    .device-svg-icon svg *[b-6p64gyf7pd] {
        fill: inherit !important;
        stroke: currentColor !important;
    }

    .device-filter-bar[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        padding: 0.4rem 0.5rem;
        margin-bottom: 0.25rem;
    }

    .filter-label[b-6p64gyf7pd], .info-label[b-6p64gyf7pd] {
        font-size: 0.78rem;
        font-weight: 600;
        color: var(--app-text-muted);
        white-space: nowrap;
    }

    .info-label[b-6p64gyf7pd] {
        margin-left: 1rem;
    }

    .device-filter-select[b-6p64gyf7pd] {
        background: rgba(255, 255, 255, 0.06);
        border: 1px solid rgba(255, 255, 255, 0.12);
        color: var(--app-text);
        font-size: 0.78rem;
        font-family: 'JetBrains Mono', monospace;
        padding: 0.25rem 0.5rem;
        border-radius: 4px;
        cursor: pointer;
        min-width: 140px;
    }

    .device-filter-select:focus[b-6p64gyf7pd] {
        outline: none;
        border-color: rgba(59, 130, 246, 0.5);
    }

    .segmented-buttons[b-6p64gyf7pd] {
        display: flex;
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 4px;
        overflow: hidden;
    }

    .seg-btn[b-6p64gyf7pd] {
        padding: 0.22rem 0.6rem;
        background: transparent;
        border: none;
        border-right: 1px solid rgba(255, 255, 255, 0.12);
        color: var(--app-text-muted);
        font-size: 0.72rem;
        font-weight: 500;
        cursor: pointer;
        white-space: nowrap;
        transition: all 0.15s;
    }

    .seg-btn:last-child[b-6p64gyf7pd] {
        border-right: none;
    }

    .seg-btn:hover:not(.disabled)[b-6p64gyf7pd] {
        background: rgba(255, 255, 255, 0.06);
        color: var(--app-text);
    }

    .seg-btn.active[b-6p64gyf7pd] {
        background: rgba(34, 197, 94, 0.2);
        color: #22c55e;
        font-weight: 600;
    }

    .seg-btn.disabled[b-6p64gyf7pd] {
        opacity: 0.3;
        cursor: not-allowed;
    }

    .device-detail-col[b-6p64gyf7pd] {
        font-size: 0.78rem;
        color: var(--app-text-muted);
        white-space: nowrap;
        min-width: 80px;
    }

    .v3-badge[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        font-size: 0.55rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        padding: 0.08rem 0.3rem;
        border-radius: 3px;
        background: rgba(234, 179, 8, 0.2);
        color: #eab308;
        margin-right: 0.25rem;
        vertical-align: middle;
        line-height: 1;
    }

    .device-header-row[b-6p64gyf7pd],
    .device-row.filtered[b-6p64gyf7pd],
    .device-row.info-grid[b-6p64gyf7pd] {
        display: table-row;
    }

    .device-header-row > span[b-6p64gyf7pd],
    .device-row.filtered > span[b-6p64gyf7pd],
    .device-row.info-grid > span[b-6p64gyf7pd] {
        display: table-cell;
        padding: 0.35rem 0.5rem;
        vertical-align: middle;
        white-space: nowrap;
    }

    .device-header-row.comms-header[b-6p64gyf7pd],
    .device-row.filtered.comms-row[b-6p64gyf7pd],
    .device-row.info-grid.comms-row[b-6p64gyf7pd] {
        /* table-row: column count determined by cell count, no template override needed */
    }

    .device-header-row.hierarchy-header[b-6p64gyf7pd],
    .device-row:not(.filtered):not(.info-grid)[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
    }

    /* Hierarchy comms header uses table-row */
    .device-header-row.comms-header[b-6p64gyf7pd] {
        display: table-row;
    }

    .device-header-row[b-6p64gyf7pd] {
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        margin-bottom: 0.15rem;
    }

    .device-header-row span[b-6p64gyf7pd] {
        font-size: 0.68rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
    }

    .dh-center[b-6p64gyf7pd] {
        text-align: center;
    }

    .device-header-row .dh-actions[b-6p64gyf7pd] {
        text-align: center;
        width: 140px;
        flex-shrink: 0;
    }

    /* Sidebar collapse */
    .facility-layout.sidebar-collapsed[b-6p64gyf7pd] {
        grid-template-columns: 48px 1fr;
    }

    .facility-sidebar.collapsed[b-6p64gyf7pd] {
        padding: 0.5rem;
        display: flex;
        align-items: flex-start;
        justify-content: center;
    }

    .sidebar-toggle[b-6p64gyf7pd] {
        background: none;
        border: 1px solid var(--app-border);
        border-radius: 6px;
        color: var(--app-text-muted);
        cursor: pointer;
        padding: 0.35rem 0.45rem;
        font-size: 0.85rem;
        transition: color 0.15s, border-color 0.15s;
        line-height: 1;
    }
    .sidebar-toggle:hover[b-6p64gyf7pd] {
        color: var(--app-text);
        border-color: var(--app-text-muted);
    }

    /* Bulk Edit buttons */
    .bulk-edit-btn[b-6p64gyf7pd] {
        background: rgba(245, 158, 11, 0.15);
        color: rgb(245, 158, 11);
        border: 1px solid rgba(245, 158, 11, 0.3);
        padding: 0.25rem 0.65rem;
        border-radius: 6px;
        font-size: 0.75rem;
        cursor: pointer;
        transition: background 0.15s;
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
    }
    .bulk-edit-btn:hover[b-6p64gyf7pd] {
        background: rgba(245, 158, 11, 0.25);
    }
    .bulk-cancel-btn[b-6p64gyf7pd] {
        background: rgba(255,255,255,0.05);
        color: var(--app-text-muted);
        border: 1px solid var(--app-border);
        padding: 0.25rem 0.65rem;
        border-radius: 6px;
        font-size: 0.75rem;
        cursor: pointer;
    }
    .bulk-save-btn[b-6p64gyf7pd] {
        background: rgba(34, 197, 94, 0.15);
        color: rgb(34, 197, 94);
        border: 1px solid rgba(34, 197, 94, 0.3);
        padding: 0.25rem 0.65rem;
        border-radius: 6px;
        font-size: 0.75rem;
        cursor: pointer;
    }
    .bulk-save-btn:hover[b-6p64gyf7pd] {
        background: rgba(34, 197, 94, 0.25);
    }

    /* Bulk Edit inline inputs */
    .bulk-input[b-6p64gyf7pd] {
        width: 100%;
        background: rgba(255,255,255,0.05);
        border: 1px solid var(--app-border);
        border-radius: 4px;
        color: var(--app-text);
        font-size: 0.78rem;
        padding: 0.2rem 0.4rem;
    }
    .bulk-input:focus[b-6p64gyf7pd] {
        outline: none;
        border-color: var(--app-accent);
    }
    .bulk-input.center[b-6p64gyf7pd] {
        text-align: center;
    }

    .device-row.filtered .drag-handle[b-6p64gyf7pd],
    .device-row.info-grid .drag-handle[b-6p64gyf7pd] {
        display: none;
    }

    .device-row.filtered .device-code-badge[b-6p64gyf7pd] {
        margin-right: 0.4rem;
    }

    .filtered-device-col[b-6p64gyf7pd] {
        white-space: nowrap;
        vertical-align: middle;
    }

    .filtered-device-col > *[b-6p64gyf7pd] {
        display: inline-flex;
        vertical-align: middle;
        margin-right: 0.35rem;
    }

    .filtered-device-col .device-name[b-6p64gyf7pd] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .device-detail-col[b-6p64gyf7pd] {
        font-size: 0.78rem;
        color: var(--app-text-muted);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0;
    }

    .device-detail-col.center[b-6p64gyf7pd] {
        text-align: center;
    }

    .resource-count-badge[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 1.8rem;
        padding: 0.15rem 0.5rem;
        border-radius: 10px;
        font-size: 0.75rem;
        font-weight: 600;
        border: none;
        cursor: pointer;
        transition: all 0.15s;
    }

    .resource-count-badge.badge-blue[b-6p64gyf7pd] {
        background: rgba(59, 130, 246, 0.2);
        color: #60a5fa;
    }

    .resource-count-badge.badge-blue:hover[b-6p64gyf7pd] {
        background: rgba(59, 130, 246, 0.35);
    }

    .resource-count-badge.badge-grey[b-6p64gyf7pd] {
        background: rgba(255, 255, 255, 0.06);
        color: rgba(255, 255, 255, 0.35);
    }

    .resource-count-badge.badge-grey:hover[b-6p64gyf7pd] {
        background: rgba(255, 255, 255, 0.12);
        color: rgba(255, 255, 255, 0.55);
    }

    /* ─── Device Resource Dialog ─── */
    .media-browser-dialog[b-6p64gyf7pd] {
        max-width: 800px;
        width: 90vw;
        max-height: 80vh;
        display: flex;
        flex-direction: column;
    }

    .media-tabs[b-6p64gyf7pd] {
        display: flex;
        border-bottom: 1px solid var(--app-border);
        background: var(--app-surface-alt);
    }

    .media-tab[b-6p64gyf7pd] {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.4rem;
        padding: 0.65rem 1rem;
        background: none;
        border: none;
        border-bottom: 2px solid transparent;
        color: var(--app-text-muted);
        font-size: 0.8rem;
        cursor: pointer;
        transition: all 0.15s;
    }

    .media-tab:hover[b-6p64gyf7pd] { color: var(--app-text); background: rgba(255,255,255,0.03); }
    .media-tab.active[b-6p64gyf7pd] { color: var(--acuity-purple); border-bottom-color: var(--acuity-purple); }

    .tab-count[b-6p64gyf7pd] {
        background: rgba(255,255,255,0.08);
        padding: 0.1rem 0.4rem;
        border-radius: 8px;
        font-size: 0.7rem;
        font-weight: 600;
    }

    .media-tab.active .tab-count[b-6p64gyf7pd] {
        background: rgba(139, 92, 246, 0.2);
        color: var(--acuity-purple);
    }

    .media-add-form[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.75rem 1rem;
        border-bottom: 1px solid var(--app-border);
        background: rgba(0,0,0,0.15);
    }

    .media-list[b-6p64gyf7pd] {
        overflow-y: auto;
        max-height: 50vh;
        padding: 0.5rem;
    }

    .media-empty[b-6p64gyf7pd] {
        text-align: center;
        padding: 2.5rem 1rem;
        color: var(--app-text-muted);
    }

    .media-item[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.6rem 0.75rem;
        border-radius: 8px;
        transition: background 0.12s;
    }

    .media-item:hover[b-6p64gyf7pd] { background: rgba(255,255,255,0.04); }
    .media-group-header[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.4rem;
        padding: 0.4rem 0.75rem;
        font-size: 0.65rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
        border-bottom: 1px solid var(--app-border);
        margin-top: 0.25rem;
    }

    .media-group-header:first-child[b-6p64gyf7pd] { margin-top: 0; }
    .media-group-header i[b-6p64gyf7pd] { font-size: 0.7rem; opacity: 0.6; }

    .media-item-icon[b-6p64gyf7pd] {
        flex: 0 0 40px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .media-thumbnail[b-6p64gyf7pd] {
        width: 40px;
        height: 40px;
        object-fit: cover;
        border-radius: 6px;
        border: 1px solid var(--app-border);
    }

    .media-item-info[b-6p64gyf7pd] { flex: 1; min-width: 0; }

    .media-item-name[b-6p64gyf7pd] {
        font-size: 0.85rem;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .media-item-meta[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        margin-top: 0.15rem;
        font-size: 0.7rem;
        color: var(--app-text-muted);
    }

    .media-item-right[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex-shrink: 0;
        margin-left: auto;
    }

    .media-item-details[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.72rem;
        color: var(--app-text-muted);
        white-space: nowrap;
    }

    .media-item-actions[b-6p64gyf7pd] {
        display: flex;
        gap: 0.35rem;
        flex-shrink: 0;
    }

    .device-actions[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.15rem;
        white-space: nowrap;
        margin-left: auto;
        width: 140px;
        flex-shrink: 0;
    }

    .device-actions .link-button[b-6p64gyf7pd] {
        font-size: 0.72rem;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0.1rem 0.2rem;
        transition: color 0.15s;
    }

    .device-actions .link-edit[b-6p64gyf7pd] {
        color: #f59e0b;
    }
    .device-actions .link-edit:hover[b-6p64gyf7pd] {
        color: #fbbf24;
    }

    .device-actions .link-clone[b-6p64gyf7pd] {
        color: #22c55e;
    }
    .device-actions .link-clone:hover[b-6p64gyf7pd] {
        color: #4ade80;
    }

    .device-actions .link-remove[b-6p64gyf7pd] {
        color: #ef4444;
    }
    .device-actions .link-remove:hover[b-6p64gyf7pd] {
        color: #f87171;
    }

    .device-actions .link-reactivate[b-6p64gyf7pd] {
        color: #22c55e;
    }
    .device-actions .link-reactivate:hover[b-6p64gyf7pd] {
        color: #4ade80;
    }

    .device-actions .action-sep[b-6p64gyf7pd] {
        color: rgba(255, 255, 255, 0.5);
        font-size: 0.65rem;
    }

    /* Inactive device styling */
    .device-row.inactive-device[b-6p64gyf7pd] {
        opacity: 0.5;
    }
    .device-row.inactive-device .device-name[b-6p64gyf7pd] {
        text-decoration: line-through;
    }
    .inactive-badge[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
        padding: 0.1rem 0.5rem;
        border-radius: 10px;
        background: rgba(239, 68, 68, 0.2);
        color: #f87171;
        font-size: 0.68rem;
        font-weight: 600;
        letter-spacing: 0.03em;
    }

    /* Inactive devices badge toggle */
    .inactive-badge-toggle[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        padding: 0.3rem 0.75rem;
        border-radius: 20px;
        border: 1px solid rgba(255, 255, 255, 0.15);
        background: rgba(255, 255, 255, 0.06);
        color: rgba(255, 255, 255, 0.45);
        font-size: 0.78rem;
        font-weight: 500;
        cursor: pointer;
        user-select: none;
        transition: all 0.2s ease;
        white-space: nowrap;
    }
    .inactive-badge-toggle:hover[b-6p64gyf7pd] {
        background: rgba(255, 255, 255, 0.1);
        color: rgba(255, 255, 255, 0.7);
        border-color: rgba(255, 255, 255, 0.25);
    }
    .inactive-badge-toggle.active[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.15);
        color: #5bb8ff;
        border-color: rgba(30, 139, 247, 0.35);
    }
    .inactive-badge-toggle.active:hover[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.25);
        color: #7ec8ff;
        border-color: rgba(30, 139, 247, 0.5);
    }

    /* Row selection */
    /* ::deep twin: AiReviewDialog.razor (SP4 Task 3) also renders a `.row-checkbox` per proposed-device row.
       The bare selector stays because the page's own device-tree rows (ConfigureFacility.razor's
       select-all-visible header checkboxes and its per-device row checkbox) still use this class directly. */
    .row-checkbox[b-6p64gyf7pd], [b-6p64gyf7pd] .row-checkbox {
        width: 15px;
        height: 15px;
        accent-color: #1e8bf7;
        cursor: pointer;
    }
    .row-select[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
        position: sticky;
        right: 0;
        background: var(--app-background, #1a1a2e);
        z-index: 1;
    }
    .dh-select[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 28px;
        position: sticky;
        right: 0;
        background: var(--app-background, #1a1a2e);
        z-index: 1;
    }
    .device-row.selected-row[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.08) !important;
    }
    .selection-toolbar[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }
    .selection-count[b-6p64gyf7pd] {
        display: inline-flex;
        align-items: center;
        padding: 0.25rem 0.65rem;
        border-radius: 12px;
        background: rgba(30, 139, 247, 0.15);
        color: #5bb8ff;
        font-size: 0.78rem;
        font-weight: 600;
        white-space: nowrap;
    }
    .selection-toolbar .action-sep[b-6p64gyf7pd] {
        color: rgba(255, 255, 255, 0.3);
        font-size: 0.65rem;
    }
    .selection-toolbar .link-button[b-6p64gyf7pd] {
        font-size: 0.82rem;
    }

    /* Assign parent dialog */
    .parent-pick-list[b-6p64gyf7pd] {
        max-height: 300px;
        overflow-y: auto;
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 8px;
        margin-top: 0.75rem;
    }
    .parent-pick-item[b-6p64gyf7pd] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem 0.75rem;
        cursor: pointer;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        transition: background 0.15s;
    }
    .parent-pick-item:hover[b-6p64gyf7pd] {
        background: rgba(255, 255, 255, 0.06);
    }
    .parent-pick-item.selected[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.12);
    }
    .parent-pick-item .pick-name[b-6p64gyf7pd] {
        font-weight: 500;
        font-size: 0.88rem;
    }
    .parent-pick-item .pick-type[b-6p64gyf7pd] {
        font-size: 0.72rem;
        color: rgba(255, 255, 255, 0.4);
    }

    /* META placeholder rows */
    .meta-placeholder-row[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.06);
        border: 1px dashed rgba(30, 139, 247, 0.25);
        border-radius: 8px;
        padding: 0.4rem 1rem;
        display: flex;
        align-items: center;
        gap: 0.75rem;
        margin: 0.2rem 0;
    }
    .meta-add-btn[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.12);
        color: rgba(30, 139, 247, 0.8);
        border: 1px solid rgba(30, 139, 247, 0.25);
        border-radius: 6px;
        padding: 0.25rem 0.7rem;
        font-size: 0.78rem;
        cursor: pointer;
        transition: all 0.15s ease;
    }
    .meta-add-btn:hover[b-6p64gyf7pd] {
        background: rgba(30, 139, 247, 0.22);
        color: #1e8bf7;
        border-color: rgba(30, 139, 247, 0.4);
    }
    .meta-add-btn i[b-6p64gyf7pd] {
        margin-right: 0.25rem;
    }

    /* Missing required parameters badges */
    .missing-params-badge[b-6p64gyf7pd] {
        background: rgba(220, 53, 69, 0.15);
        color: #dc3545;
        border: 1px solid rgba(220, 53, 69, 0.35);
        border-radius: 6px;
        padding: 0.25rem 0.7rem;
        font-size: 0.75rem;
        font-weight: 600;
        white-space: nowrap;
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        animation: pulse-red 2s ease-in-out infinite;
    }
    @@keyframes pulse-red {
        0%[b-6p64gyf7pd], 100%[b-6p64gyf7pd] { opacity: 1; }
        50%[b-6p64gyf7pd] { opacity: 0.7; }
    }
    .param-missing-required[b-6p64gyf7pd] {
        color: #dc3545 !important;
        font-weight: 600;
    }
    .bulk-input.param-missing-required[b-6p64gyf7pd] {
        border-color: #dc3545 !important;
        box-shadow: 0 0 0 1px rgba(220, 53, 69, 0.3);
    }

    /* Deactivation dialog */
    .deactivate-warning[b-6p64gyf7pd] {
        display: flex;
        align-items: flex-start;
        gap: 0.75rem;
        padding: 1rem;
        background: rgba(239, 68, 68, 0.08);
        border: 1px solid rgba(239, 68, 68, 0.2);
        border-radius: 8px;
        margin-bottom: 1rem;
    }
    .deactivate-warning i[b-6p64gyf7pd] {
        color: #ef4444;
        font-size: 1.25rem;
        margin-top: 2px;
    }
    .deactivate-warning p[b-6p64gyf7pd] {
        margin: 0;
        font-size: 0.88rem;
        line-height: 1.5;
    }

    .device-name[b-6p64gyf7pd] {
        font-weight: 600;
        font-size: 0.9rem;
        color: var(--app-text);
    }

    .device-meta[b-6p64gyf7pd] {
        font-size: 0.8rem;
        color: var(--app-text-muted);
        margin-left: auto;
        white-space: nowrap;
    }

    .device-id[b-6p64gyf7pd] {
        font-family: 'JetBrains Mono', monospace;
        font-size: 0.7rem;
        color: var(--app-text-muted);
        opacity: 0.4;
        margin-left: 0.5rem;
        white-space: nowrap;
    }

    .sidebar-divider[b-6p64gyf7pd] {
        border: none;
        border-top: 1px solid var(--app-border);
        margin: 1rem 0;
    }

    .sidebar-create-btn[b-6p64gyf7pd] {
        width: 100%;
        margin-top: 0.5rem;
    }

    .device-tree[b-6p64gyf7pd] {
        overflow: auto;
        max-height: calc(100vh - 280px);
        position: relative;
    }

    .device-tree-table[b-6p64gyf7pd] {
        display: table;
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Sticky header cells at top */
    .device-tree .device-header-row:not(.hierarchy-header) > span[b-6p64gyf7pd] {
        position: sticky;
        top: 0;
        z-index: 3;
        background: #12121f;
    }

    /* Sticky header row for hierarchy header */
    .device-tree .device-header-row.hierarchy-header[b-6p64gyf7pd] {
        position: sticky;
        top: 0;
        z-index: 3;
        background: #12121f;
    }

    /* Frozen first column (Device) — z-index 6 so scrollable cells go behind it */
    .device-row .filtered-device-col[b-6p64gyf7pd],
    .device-header-row:not(.hierarchy-header) > :first-child[b-6p64gyf7pd] {
        position: sticky;
        left: 0;
        z-index: 6;
        background: #12121f;
        border-right: 2px solid var(--app-border);
    }

    /* Frozen last column (Actions) — z-index 6 so scrollable cells go behind it */
    .device-row .device-actions[b-6p64gyf7pd],
    .device-header-row .dh-actions[b-6p64gyf7pd] {
        position: sticky;
        right: 0;
        z-index: 6;
        background: #12121f;
        border-left: 2px solid var(--app-border);
    }

    /* Header corners need highest z-index (both top + left/right) */
    .device-header-row:not(.hierarchy-header) > :first-child[b-6p64gyf7pd] {
        z-index: 7;
    }
    .device-header-row .dh-actions[b-6p64gyf7pd] {
        z-index: 7;
    }

    /* Bulk select styling */
    select.bulk-input[b-6p64gyf7pd] {
        width: 100%;
        background: rgba(255,255,255,0.05);
        border: 1px solid var(--app-border);
        border-radius: 4px;
        color: var(--app-text);
        font-size: 0.78rem;
        padding: 0.2rem 0.3rem;
    }

    .toggles-group[b-6p64gyf7pd] {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
    }

    /* ─── AI Device Extraction ──────────────────────── */
    /* ::deep twins below: AiExtractionPanel.razor (SP4 Task 2) is now the only renderer of this whole block —
       the "No Devices Found" PDF upload zone moved verbatim into a child component, so every class this page's
       own scoped sheet defines needs the ::deep twin to still reach it. The bare selector is kept alongside
       ::deep for every one of these, matching every other family in this file (e.g. the .tracker-* twins
       above), not because the page still renders any of them directly. ScopedCssReachabilityTests names the
       eleven base selectors below; the two `> i` child-combinator rules and the three `:hover` rules are
       twinned by hand per rule 8 — the guard only checks class-level reachability, and a rule whose last simple
       selector is a bare element or a pseudo-class variant is invisible to it. `.ai-file-input` already had its
       own twin from the SP4 foundations work and is unchanged here. */
    .ai-upload-zone[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-zone {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 3rem 2rem;
        text-align: center;
        gap: 0.75rem;
    }
    .ai-upload-zone h3[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-zone h3 {
        font-size: 1.1rem;
        margin: 0;
        color: rgba(255,255,255,0.9);
    }
    .ai-upload-icon[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-icon {
        font-size: 2.5rem;
        color: #a78bfa;
        margin-bottom: 0.25rem;
    }
    .ai-upload-desc[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-desc {
        color: var(--app-text-muted);
        font-size: 0.85rem;
        max-width: 500px;
        margin: 0;
    }
    .ai-upload-area[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-area {
        position: relative;
        border: 2px dashed rgba(167, 139, 250, 0.3);
        border-radius: 12px;
        padding: 2rem 2.5rem;
        margin-top: 0.75rem;
        background: rgba(167, 139, 250, 0.04);
        transition: all 0.2s;
        cursor: pointer;
        max-width: 520px;
        width: 100%;
    }
    .ai-upload-area:hover[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-area:hover {
        border-color: rgba(167, 139, 250, 0.5);
        background: rgba(167, 139, 250, 0.08);
    }
    .ai-upload-area > i[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-area > i {
        font-size: 2rem;
        color: #a78bfa;
        display: block;
        margin-bottom: 0.5rem;
    }
    .ai-upload-area p[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-area p {
        margin: 0.3rem 0;
        font-size: 0.88rem;
        color: rgba(255,255,255,0.8);
    }
    .ai-upload-hint[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-hint {
        font-size: 0.75rem !important;
        color: var(--app-text-muted) !important;
    }
    /* ::deep twin — .ai-file-input is applied to an <InputFile>, a CHILD COMPONENT, so the scope attribute is never
       stamped on the <input> it renders. Without this twin the rule is dead. ScopedCssReachabilityTests catches it.
       The twin reaches because <InputFile> is nested inside markup the page itself renders, so a scoped ancestor
       exists; if it is ever hoisted to the root of the page's markup this becomes a silent no-op and needs a
       `display: contents` host div, as CommsDiagram and CompositeDeviceTypes both needed. */
    .ai-file-input[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-file-input {
        position: absolute;
        inset: 0;
        opacity: 0;
        cursor: pointer;
        width: 100%;
        height: 100%;
    }
    .ai-upload-files[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-files {
        display: flex;
        flex-direction: column;
        gap: 0.4rem;
        margin-top: 0.5rem;
        max-width: 520px;
        width: 100%;
    }
    .ai-upload-file[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-file {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.4rem 0.75rem;
        background: rgba(167, 139, 250, 0.08);
        border: 1px solid rgba(167, 139, 250, 0.15);
        border-radius: 8px;
        font-size: 0.82rem;
    }
    .ai-upload-file > i[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-file > i { color: #ef4444; }
    .ai-file-size[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-file-size {
        margin-left: auto;
        color: var(--app-text-muted);
        font-size: 0.75rem;
    }
    .ai-file-remove[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-file-remove {
        background: none;
        border: none;
        color: rgba(255,255,255,0.4);
        cursor: pointer;
        padding: 0.1rem;
        font-size: 0.85rem;
    }
    .ai-file-remove:hover[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-file-remove:hover { color: var(--app-danger); }
    .ai-extract-btn[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-extract-btn {
        margin-top: 0.75rem;
        font-size: 0.88rem;
        gap: 0.4rem;
        background: #a78bfa !important;
    }
    .ai-extract-btn:hover[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-extract-btn:hover { background: #8b5cf6 !important; }
    .ai-upload-warn[b-6p64gyf7pd], [b-6p64gyf7pd] .ai-upload-warn {
        color: var(--app-warning);
        font-size: 0.78rem;
        margin-top: 0.5rem;
    }

    /* AI Review Dialog */
    /* ::deep-ONLY below (review fix round 1): AiReviewDialog.razor (SP4 Task 3) is the ONLY renderer of this
       table and its confidence badges — moved verbatim into a child component, so the bare (non-::deep) form
       of every one of these selectors can never match anything; ConfigureFacility itself renders none of
       these classes any more (verified by grep before removing each bare rule). This is the opposite case
       from `.row-checkbox` just above, which keeps its bare form because the page's own device-tree rows
       still use that class directly. `.ai-review-table thead th`, `.ai-review-table tbody td` and
       `.ai-review-table tbody tr:hover` are twinned by hand per rule 8: each one's last simple selector is a
       bare element or a `:hover` variant, invisible to ScopedCssReachabilityTests' class-level scan.
       `.confidence-high`/`.confidence-medium`/`.confidence-low` are likewise twinned by hand rather than left
       for the guard to name — the dialog builds that class name dynamically (`confidence-@device.Confidence`),
       so the guard's literal-class-token scan can never see the usage at all, flagged or not. */
    [b-6p64gyf7pd] .ai-review-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.82rem;
    }
    [b-6p64gyf7pd] .ai-review-table thead th {
        position: sticky;
        top: 0;
        background: var(--app-surface);
        padding: 0.5rem 0.6rem;
        text-align: left;
        font-weight: 600;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        color: var(--app-text-muted);
        border-bottom: 1px solid var(--app-border);
    }
    [b-6p64gyf7pd] .ai-review-table tbody td {
        padding: 0.45rem 0.6rem;
        border-bottom: 1px solid rgba(255,255,255,0.04);
        vertical-align: middle;
    }
    [b-6p64gyf7pd] .ai-review-table tbody tr:hover {
        background: rgba(167, 139, 250, 0.04);
    }
    [b-6p64gyf7pd] .ai-row-rejected {
        opacity: 0.35;
    }
    [b-6p64gyf7pd] .confidence-dot {
        display: inline-block;
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }
    [b-6p64gyf7pd] .confidence-high { background: #22c55e; }
    [b-6p64gyf7pd] .confidence-medium { background: #f59e0b; }
    [b-6p64gyf7pd] .confidence-low { background: #ef4444; }

    /* Measure Modifiers */
    /* ::deep twins below: EditorMeasuresPanel.razor and ModifierClonePanel.razor render this markup as child
       components (Plan A, Task 5), so classes this page's own scoped sheet defines need the ::deep twin to
       still reach them — including modifiers-title-icon/modifiers-empty-icon/clone-panel-title-icon, which
       replace the old bare-element `i` selectors below: those matched a Bootstrap <i> glyph, but AderisIcon
       renders an <svg class="ac-icon">, so an element selector can no longer find it — a Class="..." passed on
       the AderisIcon tag is itself an Axis-2 case (a class applied to a CHILD COMPONENT's tag), so it needs the
       same ::deep twin treatment as every other class here. */
    .modifiers-section[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-section {
        margin-top: 1.25rem;
        border-top: 1px solid var(--app-border);
        padding-top: 1rem;
        grid-column: 1 / -1;
    }

    .modifiers-header[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 0.75rem;
    }

    .modifiers-title[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-title {
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 0.4rem;
    }

    .modifiers-title-icon[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-title-icon {
        font-size: 0.85rem;
        color: #2dd4bf;
    }

    .modifiers-add-btn[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-add-btn {
        font-size: 0.75rem;
        padding: 0.2rem 0.6rem;
    }

    .modifiers-empty[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-empty {
        font-size: 0.8rem;
        color: var(--app-text-muted);
        padding: 0.5rem 0;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    .modifiers-empty-icon[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-empty-icon {
        font-size: 0.9rem;
    }

    .modifiers-table[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.85rem;
    }

    .modifiers-table thead th[b-6p64gyf7pd],
    [b-6p64gyf7pd] .modifiers-table thead th {
        text-align: left;
        font-size: 0.7rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
        font-weight: 600;
        padding: 0.3rem 0.4rem;
        border-bottom: 1px solid var(--app-border);
    }

    .modifiers-table tbody tr[b-6p64gyf7pd],
    [b-6p64gyf7pd] .modifiers-table tbody tr {
        border-bottom: 1px solid rgba(255,255,255,0.04);
    }

    .modifiers-table tbody tr:hover[b-6p64gyf7pd],
    [b-6p64gyf7pd] .modifiers-table tbody tr:hover {
        background: rgba(255,255,255,0.03);
    }

    .modifiers-table td[b-6p64gyf7pd],
    [b-6p64gyf7pd] .modifiers-table td {
        padding: 0.3rem 0.4rem;
        vertical-align: middle;
    }

    .modifier-pair-row[b-6p64gyf7pd], [b-6p64gyf7pd] .modifier-pair-row {
        background: rgba(45, 212, 191, 0.04);
    }

    .modifier-swap-indicator[b-6p64gyf7pd], [b-6p64gyf7pd] .modifier-swap-indicator {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        font-size: 1.1rem;
        font-weight: 700;
        color: #2dd4bf;
        letter-spacing: 0.1em;
    }

    /* Clone to Similar Devices */
    .modifiers-clone-row[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-clone-row {
        margin-top: 0.75rem;
        padding-top: 0.5rem;
    }

    .modifiers-clone-link[b-6p64gyf7pd], [b-6p64gyf7pd] .modifiers-clone-link {
        font-size: 0.8rem;
        color: var(--app-primary) !important;
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
    }

    .modifiers-clone-link:hover[b-6p64gyf7pd],
    [b-6p64gyf7pd] .modifiers-clone-link:hover {
        color: #a5b4fc !important;
    }

    .clone-panel[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel {
        background: rgba(255,255,255,0.03);
        border: 1px solid var(--app-border);
        border-radius: 8px;
        padding: 0.75rem;
    }

    .clone-panel-header[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 0.5rem;
    }

    .clone-panel-title[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-title {
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--app-text-muted);
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 0.35rem;
    }

    .clone-panel-title-icon[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-title-icon { color: var(--app-primary); }

    .clone-panel-empty[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-empty {
        font-size: 0.8rem;
        color: var(--app-text-muted);
        padding: 0.25rem 0;
    }

    .clone-panel-actions[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-actions {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        margin-bottom: 0.4rem;
        font-size: 0.75rem;
    }

    .clone-panel-divider[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-divider {
        color: var(--app-border);
    }

    .clone-panel-list[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-panel-list {
        display: flex;
        flex-direction: column;
        gap: 0.3rem;
        max-height: 180px;
        overflow-y: auto;
        margin-bottom: 0.6rem;
    }

    .clone-device-item[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-device-item {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 0.84rem;
        color: var(--app-text);
        cursor: pointer;
        padding: 0.2rem 0.3rem;
        border-radius: 4px;
    }

    .clone-device-item:hover[b-6p64gyf7pd],
    [b-6p64gyf7pd] .clone-device-item:hover {
        background: rgba(255,255,255,0.04);
    }

    .clone-device-item input[type="checkbox"][b-6p64gyf7pd],
    [b-6p64gyf7pd] .clone-device-item input[type="checkbox"] {
        accent-color: var(--app-primary);
    }

    .clone-device-badge[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-device-badge {
        font-size: 0.7rem;
        color: #f59e0b;
        margin-left: auto;
        font-weight: 500;
    }

    .clone-apply-btn[b-6p64gyf7pd], [b-6p64gyf7pd] .clone-apply-btn {
        font-size: 0.8rem;
        padding: 0.35rem 0.8rem;
        width: 100%;
    }
/* /Components/Pages/LookupTables.razor.rz.scp.css */
/* ── Layout ──────────────────────────────────────── */
.lookup-layout[b-mj6bs6lvjd] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1.5rem;
    min-height: 400px;
}

.lookup-sidebar[b-mj6bs6lvjd] {
    border-right: 1px solid var(--app-border);
    padding-right: 1rem;
}

.lookup-detail[b-mj6bs6lvjd] {
    min-width: 0;
}

/* ── Sidebar Items ───────────────────────────────── */
.lookup-item[b-mj6bs6lvjd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s ease;
    margin-bottom: 0.25rem;
}

.lookup-item:hover[b-mj6bs6lvjd] {
    background: rgba(255, 255, 255, 0.04);
}

.lookup-item.active[b-mj6bs6lvjd] {
    background: rgba(0, 177, 118, 0.12);
    border-left: 3px solid var(--app-accent);
}

.lookup-item-info[b-mj6bs6lvjd] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.lookup-item-name[b-mj6bs6lvjd] {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--app-heading);
}

.system-badge[b-mj6bs6lvjd] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    background: rgba(99, 102, 241, 0.15);
    color: #818cf8;
    width: fit-content;
}

.entry-count[b-mj6bs6lvjd] {
    font-size: 0.75rem;
    color: var(--app-text-muted);
}

/* ── Detail Header ───────────────────────────────── */
.detail-header[b-mj6bs6lvjd] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.detail-header h3[b-mj6bs6lvjd] {
    font-size: 1.1rem;
    margin: 0;
}

/* ── Filter Buttons ──────────────────────────────── */
.material-filter[b-mj6bs6lvjd] {
    display: flex;
    gap: 0.5rem;
}

.filter-btn[b-mj6bs6lvjd] {
    padding: 0.35rem 1rem;
    border-radius: 8px;
    border: 1px solid var(--app-border);
    background: transparent;
    color: var(--app-text-muted);
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.filter-btn:hover[b-mj6bs6lvjd] {
    border-color: var(--app-accent);
    color: var(--app-text);
}

.filter-btn.active[b-mj6bs6lvjd] {
    background: var(--app-accent);
    border-color: var(--app-accent);
    color: #fff;
}

.filter-btn.copper.active[b-mj6bs6lvjd] {
    background: #d97706;
    border-color: #d97706;
}

.filter-btn.aluminum.active[b-mj6bs6lvjd] {
    background: #6b7280;
    border-color: #6b7280;
}

/* ── Wire Table ──────────────────────────────────── */
.table-responsive[b-mj6bs6lvjd] { overflow-x: auto; }

.wire-table[b-mj6bs6lvjd] { width: 100%; border-collapse: collapse; }

.wire-table th[b-mj6bs6lvjd] {
    padding: 0.6rem 1rem;
    text-align: left;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--app-text-muted);
    border-bottom: 1px solid var(--app-border);
    white-space: nowrap;
}

.wire-table td[b-mj6bs6lvjd] {
    padding: 0.55rem 1rem;
    font-size: 0.88rem;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    white-space: nowrap;
}

.wire-table tbody tr:hover[b-mj6bs6lvjd] { background: rgba(255,255,255,0.03); }

.text-right[b-mj6bs6lvjd] { text-align: right; }

.mono[b-mj6bs6lvjd] {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    font-size: 0.82rem;
}

.size-label[b-mj6bs6lvjd] {
    font-weight: 600;
    color: var(--app-heading);
}

/* ── Material Badges ─────────────────────────────── */
.material-badge[b-mj6bs6lvjd] {
    display: inline-block;
    padding: 0.15rem 0.6rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.03em;
}

.badge-copper[b-mj6bs6lvjd]  { background: rgba(217,119,6,0.15);  color: #f59e0b; }
.badge-aluminum[b-mj6bs6lvjd] { background: rgba(107,114,128,0.2); color: #9ca3af; }

/* ── Row Accents ─────────────────────────────────── */
.row-copper td:first-child[b-mj6bs6lvjd]   { border-left: 3px solid rgba(217,119,6,0.4); }
.row-aluminum td:first-child[b-mj6bs6lvjd] { border-left: 3px solid rgba(107,114,128,0.4); }

/* ── Footer ──────────────────────────────────────── */
.table-footer[b-mj6bs6lvjd] {
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--app-border);
    display: flex;
    justify-content: flex-end;
}

.record-count[b-mj6bs6lvjd] {
    font-size: 0.78rem;
    color: var(--app-text-muted);
}

/* ── Empty State ─────────────────────────────────── */
.empty-state[b-mj6bs6lvjd] {
    text-align: center;
    color: var(--app-text-muted);
}

.empty-state i[b-mj6bs6lvjd] {
    display: block;
    margin-bottom: 0.5rem;
}

/* ── Action divider ──────────────────────────────── */
.action-divider[b-mj6bs6lvjd] {
    color: var(--app-text-muted);
    margin: 0 0.25rem;
}

/* ── Inline form ─────────────────────────────────── */
.inline-form[b-mj6bs6lvjd] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.inline-form .text-input[b-mj6bs6lvjd] {
    flex: 1;
    min-width: 150px;
}

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 768px) {
    .lookup-layout[b-mj6bs6lvjd] {
        grid-template-columns: 1fr;
    }

    .lookup-sidebar[b-mj6bs6lvjd] {
        border-right: none;
        border-bottom: 1px solid var(--app-border);
        padding-right: 0;
        padding-bottom: 1rem;
    }
}

/* ── Validation ──────────────────────────────────── */
.validation-warning[b-mj6bs6lvjd] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.35rem;
    font-size: 0.8rem;
    color: var(--app-danger, #ef4444);
    animation: fadeIn 0.2s ease;
}

.input-error[b-mj6bs6lvjd] {
    border-color: var(--app-danger, #ef4444) !important;
    box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.3);
}

/* ── Alarm Level Styles ──────────────────────────── */
.alarm-icon-preview[b-mj6bs6lvjd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    overflow: hidden;
    flex-shrink: 0;
    line-height: 0;
}

/* The SVG is injected as raw markup (SafeMarkup.Svg), so reach it with ::deep. */
.alarm-icon-preview[b-mj6bs6lvjd]  svg {
    width: 24px;
    height: 24px;
    max-width: 24px;
    max-height: 24px;
    fill: currentColor;
}

.color-swatch[b-mj6bs6lvjd] {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid rgba(255,255,255,0.15);
    flex-shrink: 0;
}

/* ── Pulse Animation ─────────────────────────────── */
.alarm-pulse[b-mj6bs6lvjd] {
    animation: alarm-pulse-anim-b-mj6bs6lvjd 1.5s ease-in-out infinite;
}

@keyframes alarm-pulse-anim-b-mj6bs6lvjd {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(1.15); }
}

/* ── Grouped Table Styles ────────────────────────── */
.group-section[b-mj6bs6lvjd] {
    margin-bottom: 1rem;
}

.group-header[b-mj6bs6lvjd] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid var(--app-border);
    margin-bottom: 0;
}

.group-name[b-mj6bs6lvjd] {
    font-weight: 600;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--app-text);
}

.drag-handle[b-mj6bs6lvjd] {
    cursor: grab;
    color: var(--app-text-muted);
    opacity: 0.4;
    font-size: 0.85rem;
    text-align: center;
    user-select: none;
    width: 28px;
    transition: opacity 0.15s;
}

.drag-handle:hover[b-mj6bs6lvjd] {
    opacity: 0.8;
}

tr.drag-active[b-mj6bs6lvjd],
tr.sortable-ghost[b-mj6bs6lvjd] {
    opacity: 0.4;
}

.sortable-chosen[b-mj6bs6lvjd] {
    background: rgba(0, 177, 118, 0.08);
}

.sortable-drag[b-mj6bs6lvjd] {
    opacity: 0.9;
    background: var(--app-bg) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.color-input[b-mj6bs6lvjd] {
    -webkit-appearance: none;
    appearance: none;
    width: 28px;
    height: 28px;
    border: 1px solid var(--app-border);
    border-radius: 4px;
    background: transparent;
    cursor: pointer;
    padding: 0;
}

.color-input[b-mj6bs6lvjd]::-webkit-color-swatch-wrapper {
    padding: 2px;
}

.color-input[b-mj6bs6lvjd]::-webkit-color-swatch {
    border: none;
    border-radius: 2px;
}
/* /Components/Pages/ManageTagMaps.razor.rz.scp.css */
.tab-navigation[b-5846z56q3n] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--app-border);
    padding-bottom: 0.5rem;
}

.tab-btn[b-5846z56q3n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    background: transparent;
    border: none;
    border-radius: 8px 8px 0 0;
    color: var(--app-text-muted);
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s ease;
}

.tab-btn:hover[b-5846z56q3n] {
    color: var(--app-text);
    background: rgba(255,255,255,0.05);
}

.tab-btn.active[b-5846z56q3n] {
    color: #10b981;
    background: rgba(16, 185, 129, 0.1);
    border-bottom: 2px solid #10b981;
    margin-bottom: -1px;
}

.inline-form[b-5846z56q3n] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.link-button.disabled[b-5846z56q3n] {
    opacity: 0.4;
    cursor: not-allowed;
    color: var(--app-text-muted) !important;
}

.filter-row[b-5846z56q3n] {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 2rem;
    padding: 1rem;
    background: var(--app-surface-alt);
    border-radius: 12px;
    border: 1px solid var(--app-border);
}

.filter-row .form-group[b-5846z56q3n] {
    flex: 1;
    min-width: 200px;
}

.section-header[b-5846z56q3n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
}

.section-header h3[b-5846z56q3n] {
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.protocol-group[b-5846z56q3n] {
    margin-bottom: 2rem;
}

.protocol-header[b-5846z56q3n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1rem;
    color: var(--app-primary);
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--app-border);
}

.empty-state[b-5846z56q3n] {
    text-align: center;
    padding: 3rem;
    color: var(--app-text-muted);
}

.empty-state i[b-5846z56q3n] {
    font-size: 3rem;
    opacity: 0.5;
    margin-bottom: 1rem;
}

.action-divider[b-5846z56q3n] {
    color: var(--app-text-muted);
    margin: 0 0.25rem;
}

.link-button.link-edit[b-5846z56q3n] {
    color: #f59e0b;
}

.link-button.link-edit:hover[b-5846z56q3n] {
    color: #fbbf24;
}

.count-badge[b-5846z56q3n] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    background: rgba(16, 185, 129, 0.15);
    color: #10b981;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: 600;
    min-width: 1.6rem;
    text-align: center;
    cursor: default;
}

.badge-green[b-5846z56q3n] {
    background: rgba(16, 185, 129, 0.15);
    color: #10b981;
}

.badge-grey[b-5846z56q3n] {
    background: rgba(255, 255, 255, 0.08);
    color: var(--app-text-muted);
}

.checkbox-list[b-5846z56q3n] {
    max-height: 160px;
    overflow-y: auto;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.2);
    padding: 0.25rem;
}

.checkbox-item[b-5846z56q3n] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.9rem;
    transition: background 0.15s ease;
    color: var(--app-text-muted);
}

.checkbox-item:hover[b-5846z56q3n] {
    background: rgba(255, 255, 255, 0.06);
}

.checkbox-item.checked[b-5846z56q3n] {
    background: rgba(16, 185, 129, 0.12);
    color: var(--app-text);
}

.checkbox-item input[type="checkbox"][b-5846z56q3n] {
    accent-color: #10b981;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.checkbox-empty[b-5846z56q3n] {
    padding: 1rem;
    text-align: center;
    color: var(--app-text-muted);
    font-size: 0.85rem;
}

/* AI Create Button */
.ai-create-btn[b-5846z56q3n] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1.5rem;
    background: linear-gradient(135deg, #7c3aed, #a855f7);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 2px 12px rgba(124, 58, 237, 0.35);
}

.ai-create-btn:hover:not(:disabled)[b-5846z56q3n] {
    background: linear-gradient(135deg, #6d28d9, #9333ea);
    box-shadow: 0 4px 20px rgba(124, 58, 237, 0.5);
    transform: translateY(-1px);
}

.ai-create-btn:disabled[b-5846z56q3n] {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.ai-create-btn i[b-5846z56q3n] {
    font-size: 1.1rem;
}

/* AI Processing Status */
.ai-processing-status[b-5846z56q3n] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #a855f7;
    font-size: 0.95rem;
    font-weight: 500;
    padding: 0.5rem 0;
}

.ai-spinner[b-5846z56q3n] {
    width: 20px;
    height: 20px;
    border: 3px solid rgba(168, 85, 247, 0.25);
    border-top-color: #a855f7;
    border-radius: 50%;
    animation: ai-spin-b-5846z56q3n 0.8s linear infinite;
}

@keyframes ai-spin-b-5846z56q3n {
    to { transform: rotate(360deg); }
}
/* /Components/Pages/RegisterDecodingEditor.razor.rz.scp.css */
/* Scoped styles for RegisterDecodingEditor. Moved here from RegisterEditorDialog with the markup that carries
   them — a scoped selector only matches markup with this component's scope id. ::deep twins are for classes passed
   to a child component via Class=/InputClass=, which land on an element that component renders. */

/* ::deep twin so .monospace also reaches the <input> AderisTextInput renders (the enum value / bit cells). */
.monospace[b-3oftnrebw9], [b-3oftnrebw9] .monospace {
    font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.85rem;
}

.register-count[b-3oftnrebw9] {
    text-align: right;
    font-size: 0.8rem;
    color: var(--app-text-muted);
    margin-top: 0.5rem;
}

/* Edit link — orange (the enum entries edit cell). Global .link-edit exists; this keeps the page's colour. */
.link-button.link-edit[b-3oftnrebw9] {
    color: #f59e0b;
}

.link-button.link-edit:hover[b-3oftnrebw9] {
    color: #fbbf24;
}

/* ── The two decoding tables ── */
.decoding-table-scroll[b-3oftnrebw9] {
    max-height: 340px;
    overflow-y: auto;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
}

.decoding-table-scroll-short[b-3oftnrebw9] {
    max-height: 250px;
}

/* ::deep REQUIRED: RowClass is a bare string AderisTableMaster stamps on the <tr> IT renders. Dims a bit position
   with no decoding entry. */
[b-3oftnrebw9] tr.bit-row-unassigned {
    opacity: 0.5;
}

/* decoding-select → AderisSelect via Class= (its wrapper); decoding-input → AderisTextInput via InputClass= (the
   <input> itself) — both land on elements those COMPONENTS render, hence ::deep. */
[b-3oftnrebw9] .decoding-select,
[b-3oftnrebw9] .decoding-input {
    font-size: 0.8rem;
}

[b-3oftnrebw9] .decoding-input {
    padding: 0.2rem 0.4rem;
    min-height: 0;
}
/* /Components/Pages/RegisterEditorDialog.razor.rz.scp.css */
/* Scoped styles for RegisterEditorDialog. Moved here from EditTagMap.razor.css during the ADR-0005 decomposition:
   every rule below targets markup this component now renders, so a scoped selector left on the page would silently
   stop matching (scope is lexical, not render-tree position). The register-LIST rules stayed on the page.

   ::deep notes preserved from the original: a class the page passes to a component via Class=/InputClass= lands on
   an element that COMPONENT renders, so this sheet cannot reach it with a bare selector — hence the ::deep twins. */

/* Title for the dialogs that pass Modal a HeaderContent fragment. It does NOT reuse Modal's own
   .aderis-modal-title (that is scoped to Modal); markup written here is stamped with THIS component's scope id,
   so a private class of Modal would match nothing. Values mirror Modal's title for a consistent look. */
.dialog-title-inline[b-i2rszsxwfg] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--aderis-text);
    display: inline-flex;
    align-items: center;
}

/* ::deep twin so .monospace also reaches the <input> AderisTextInput renders (the bitmask nibble fields and the
   device-value field pass it via InputClass). The bare selector covers this component's own cells. */
.monospace[b-i2rszsxwfg], [b-i2rszsxwfg] .monospace {
    font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.85rem;
}

.input-with-hint[b-i2rszsxwfg] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.hint-text[b-i2rszsxwfg] {
    font-size: 0.78rem;
    color: #10b981;
    font-family: 'JetBrains Mono', monospace;
}

/* Dialog form grids */
.form-grid-2[b-i2rszsxwfg] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.form-grid-3[b-i2rszsxwfg] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.slope-preview[b-i2rszsxwfg] {
    display: flex;
    align-items: center;
    height: 42px;
    padding: 0 0.75rem;
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.95rem;
    color: #10b981;
    letter-spacing: 0.02em;
}

/* SVG slope graph */
.slope-graph-container[b-i2rszsxwfg] {
    padding: 0.75rem;
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    margin-top: 0.25rem;
}

.slope-graph-container svg[b-i2rszsxwfg] {
    width: 100%;
    height: 160px;
}

/* ── Calculated Register: Disabled state ─── */
.calc-disabled[b-i2rszsxwfg] {
    opacity: 0.4;
}

.calc-disabled .text-input[b-i2rszsxwfg],
.calc-disabled .select-input[b-i2rszsxwfg] {
    pointer-events: none;
}

/* ── Calculation Editor ─────────────────── */
.calc-editor[b-i2rszsxwfg] {
    padding: 1rem;
    background: var(--app-surface-alt);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    margin-top: 0.25rem;
}

.calc-editor-header[b-i2rszsxwfg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--acuity-clearsky-blue, #1e8bf7);
    margin-bottom: 0.75rem;
}

/* The step-row layout (.calc-step-row/.calc-op/.calc-type/.calc-picker/.calc-del/.calc-empty) moved to
   CalcStepRows.razor.css with the markup that carries it. */

.calc-add-btn[b-i2rszsxwfg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 0.5rem;
    padding: 0.3rem 0.75rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #fff;
    background: var(--acuity-green, #10b981);
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s;
}

.calc-add-btn:hover[b-i2rszsxwfg] {
    background: #0d9668;
}

/* The decoding-table rules (.decoding-*, bit-row-unassigned, decoding-select/input) moved to
   RegisterDecodingEditor.razor.css with that editor. */

/* ── Enum-command mapping table ── */
.command-enum-table[b-i2rszsxwfg] {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    overflow: hidden;
}

/* Ours — written inside the Device Value cell template, so no ::deep. */
.nibble-row[b-i2rszsxwfg] {
    display: flex;
    gap: 4px;
    align-items: center;
}

/* ::deep: both go to AderisTextInput via InputClass=, landing on the <input> the component renders. */
[b-i2rszsxwfg] .device-value-input {
    width: 80px;
    font-size: 0.8rem;
    padding: 0.2rem 0.4rem;
    min-height: 0;
}

[b-i2rszsxwfg] .nibble-input {
    width: 52px;
    font-size: 0.8rem;
    padding: 0.2rem 0.3rem;
    min-height: 0;
    text-align: center;
    letter-spacing: 1px;
}

.calc-equation-preview[b-i2rszsxwfg] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.75rem;
    padding: 0.6rem 0.75rem;
    background: rgba(30, 139, 247, 0.06);
    border: 1px solid rgba(30, 139, 247, 0.2);
    border-radius: 8px;
    font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.82rem;
    flex-wrap: wrap;
}

.calc-eq-label[b-i2rszsxwfg] {
    color: var(--acuity-clearsky-blue, #1e8bf7);
    font-weight: 600;
}

.calc-eq-equals[b-i2rszsxwfg] {
    color: var(--app-text-muted);
    font-weight: 700;
}

.calc-eq-formula[b-i2rszsxwfg] {
    color: var(--app-text, #e0e0e0);
}
/* /Components/Pages/RegisterEnumStatesDialog.razor.rz.scp.css */
/* Rules this component's own markup needs.

   Blazor scoped CSS matches only elements the DECLARING component renders, so a child cannot inherit a parent's
   scoped rules — and a `::deep` twin in EditTagMap would not help either, because this dialog sits at the root of
   that page's markup and so has no scoped ancestor to match against (the trap recorded in docs/session.md that
   cost a regression across five page families).

   `.register-table` is deliberately gone: the table is AderisTableMaster now, which brings its own `.tm-*`
   styling. Only these two are still ours — both are used by markup written here (cell templates and the count
   line), which keeps this component's scope id, so no `::deep` is needed. */

.monospace[b-e9qcjfi9ci] {
    font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
    font-size: 0.85rem;
}

.register-count[b-e9qcjfi9ci] {
    text-align: right;
    font-size: 0.8rem;
    color: var(--app-text-muted);
    margin-top: 0.5rem;
}

/* Was an inline style on the old <td>. It has to be a class now because the <td> belongs to the component —
   only the content inside it is ours. max-width + ellipsis keep a long description from widening the dialog. */
.description-cell[b-e9qcjfi9ci] {
    display: inline-block;
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.82rem;
    vertical-align: bottom;
}
/* /Components/Pages/RevenueModels.razor.rz.scp.css */
.rm-filter-bar[b-oneb8x2b3f] { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.rm-filter-btn[b-oneb8x2b3f] {
    display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.5rem 1rem;
    border: 1px solid var(--app-border); border-radius: 8px; background: transparent;
    color: var(--app-text-muted); font-size: 0.82rem; cursor: pointer; transition: all 0.2s;
}
.rm-filter-btn:hover[b-oneb8x2b3f] { border-color: var(--app-accent); color: var(--app-heading); }
.rm-filter-btn.active[b-oneb8x2b3f] { background: rgba(0,177,118,0.12); border-color: var(--app-accent); color: var(--app-accent); font-weight: 600; }
.rm-filter--primary.active[b-oneb8x2b3f] { background: rgba(59,130,246,0.12); border-color: #3b82f6; color: #60a5fa; }
.rm-filter--overlay.active[b-oneb8x2b3f] { background: rgba(245,158,11,0.12); border-color: #f59e0b; color: #fbbf24; }
.rm-filter--savings.active[b-oneb8x2b3f] { background: rgba(16,185,129,0.12); border-color: #10b981; color: #34d399; }
.rm-count[b-oneb8x2b3f] { font-size: 0.7rem; background: rgba(255,255,255,0.06); padding: 0.1rem 0.4rem; border-radius: 4px; font-weight: 600; }
.rm-filter-btn.active .rm-count[b-oneb8x2b3f] { background: rgba(0,177,118,0.2); }
.rm-filter--primary.active .rm-count[b-oneb8x2b3f] { background: rgba(59,130,246,0.2); }
.rm-filter--overlay.active .rm-count[b-oneb8x2b3f] { background: rgba(245,158,11,0.2); }
.rm-filter--savings.active .rm-count[b-oneb8x2b3f] { background: rgba(16,185,129,0.2); }

.rm-grid[b-oneb8x2b3f] { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 1.25rem; }
.rm-card[b-oneb8x2b3f] { display: flex; flex-direction: column; border: 1px solid var(--app-border); border-radius: 14px; background: rgba(255,255,255,0.02); overflow: hidden; transition: all 0.2s; }
.rm-card:hover[b-oneb8x2b3f] { border-color: rgba(255,255,255,0.15); box-shadow: 0 8px 24px rgba(0,0,0,0.15); }
.rm-card--disabled[b-oneb8x2b3f] { opacity: 0.55; }
.rm-card-header[b-oneb8x2b3f] { display: flex; align-items: flex-start; gap: 1rem; padding: 1.25rem 1.25rem 0.75rem; cursor: pointer; transition: background 0.15s; }
.rm-card-header:hover[b-oneb8x2b3f] { background: rgba(255,255,255,0.02); }
.rm-chevron[b-oneb8x2b3f] { margin-left: auto; font-size: 0.9rem; opacity: 0.4; flex-shrink: 0; margin-top: 0.2rem; transition: transform 0.2s; }
.input-error-subtle[b-oneb8x2b3f] { border-color: rgba(239,68,68,0.3); }

.rm-type-icon[b-oneb8x2b3f] { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; }
.rm-cat-primary[b-oneb8x2b3f] { background: rgba(59,130,246,0.15); color: #60a5fa; }
.rm-cat-overlay[b-oneb8x2b3f] { background: rgba(245,158,11,0.15); color: #fbbf24; }
.rm-cat-savings[b-oneb8x2b3f] { background: rgba(16,185,129,0.15); color: #34d399; }

.rm-card-info h3[b-oneb8x2b3f] { margin: 0; font-size: 1rem; font-weight: 600; color: var(--app-heading); }
.rm-badges[b-oneb8x2b3f] { display: flex; gap: 0.35rem; margin-top: 0.35rem; flex-wrap: wrap; }
.rm-badge[b-oneb8x2b3f] { display: inline-block; font-size: 0.6rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.15rem 0.5rem; border-radius: 4px; }
.rm-badge--type[b-oneb8x2b3f] { background: rgba(255,255,255,0.06); color: var(--app-text-muted); }
.rm-badge--cat-primary[b-oneb8x2b3f] { background: rgba(59,130,246,0.15); color: #60a5fa; }
.rm-badge--cat-overlay[b-oneb8x2b3f] { background: rgba(245,158,11,0.15); color: #fbbf24; }
.rm-badge--cat-savings[b-oneb8x2b3f] { background: rgba(16,185,129,0.15); color: #34d399; }
.rm-badge--global[b-oneb8x2b3f] { background: rgba(0,177,118,0.15); color: #34d399; }
.rm-badge--org[b-oneb8x2b3f] { background: rgba(56,139,235,0.15); color: #60a5fa; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rm-badge--disabled[b-oneb8x2b3f] { background: rgba(239,68,68,0.15); color: #ef4444; }
.rm-badge--consumes[b-oneb8x2b3f] { background: rgba(245,158,11,0.15); font-size: 0.7rem; padding: 0.1rem 0.35rem; }

.rm-card-detail[b-oneb8x2b3f] { padding: 0 1.25rem 0.5rem; }
.rm-description[b-oneb8x2b3f] { font-size: 0.78rem; color: var(--app-text-muted); margin-bottom: 0.5rem; line-height: 1.5; font-style: italic; }
.rm-params[b-oneb8x2b3f] { margin-bottom: 0.25rem; }
.rm-detail-row[b-oneb8x2b3f] { display: flex; justify-content: space-between; padding: 0.25rem 0; font-size: 0.8rem; border-bottom: 1px solid rgba(255,255,255,0.03); }
.rm-detail-row:last-child[b-oneb8x2b3f] { border-bottom: none; }
.rm-tou-summary[b-oneb8x2b3f] { display: flex; justify-content: space-between; padding: 0.4rem 0; font-size: 0.8rem; border-top: 1px solid rgba(255,255,255,0.05); margin-top: 0.25rem; }
.rm-label[b-oneb8x2b3f] { color: var(--app-text-muted); }
.rm-value[b-oneb8x2b3f] { color: var(--app-heading); font-weight: 500; }

.rm-card-actions[b-oneb8x2b3f] { display: flex; border-top: 1px solid var(--app-border); margin-top: auto; }
.rm-action-btn[b-oneb8x2b3f] { flex: 1; display: flex; align-items: center; justify-content: center; gap: 0.35rem; padding: 0.65rem 0; border: none; background: transparent; font-size: 0.78rem; font-weight: 500; cursor: pointer; transition: all 0.15s; }
.rm-action-btn + .rm-action-btn[b-oneb8x2b3f] { border-left: 1px solid var(--app-border); }
.rm-action--edit[b-oneb8x2b3f] { color: #60a5fa; }
.rm-action--edit:hover[b-oneb8x2b3f] { background: rgba(59,130,246,0.08); }
.rm-action--delete[b-oneb8x2b3f] { color: #ef4444; }
.rm-action--delete:hover[b-oneb8x2b3f] { background: rgba(239,68,68,0.08); }

.rm-facilities[b-oneb8x2b3f] { padding: 0.5rem 1.25rem 0.75rem; border-top: 1px dashed rgba(255,255,255,0.06); }
.rm-fac-header[b-oneb8x2b3f] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.rm-fac-title[b-oneb8x2b3f] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.78rem; font-weight: 600; color: var(--app-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.rm-fac-add[b-oneb8x2b3f] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.25rem 0.65rem; border: 1px solid rgba(0,177,118,0.3); border-radius: 6px; background: transparent; color: #34d399; font-size: 0.72rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.rm-fac-add:hover[b-oneb8x2b3f] { background: rgba(0,177,118,0.1); }
.rm-fac-list[b-oneb8x2b3f] { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.rm-fac-chip[b-oneb8x2b3f] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.25rem 0.5rem; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 6px; font-size: 0.72rem; }
.rm-fac-code[b-oneb8x2b3f] { font-weight: 700; color: #60a5fa; font-family: monospace; letter-spacing: 0.04em; }
.rm-fac-name[b-oneb8x2b3f] { color: var(--app-text-muted); max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rm-fac-alloc[b-oneb8x2b3f] { color: #fbbf24; font-weight: 600; font-size: 0.68rem; }
.rm-fac-remove[b-oneb8x2b3f] { display: inline-flex; align-items: center; padding: 0; border: none; background: transparent; color: rgba(239,68,68,0.5); font-size: 0.8rem; cursor: pointer; transition: color 0.15s; }
.rm-fac-remove:hover[b-oneb8x2b3f] { color: #ef4444; }
.rm-fac-empty[b-oneb8x2b3f] { font-size: 0.75rem; color: var(--app-text-muted); opacity: 0.6; margin: 0; }

.assign-fac-list[b-oneb8x2b3f] { display: flex; flex-direction: column; gap: 0.35rem; }
.assign-fac-row[b-oneb8x2b3f] { display: flex; align-items: center; gap: 0.7rem; padding: 0.55rem 0.75rem; border: 1px solid var(--app-border); border-radius: 8px; cursor: pointer; transition: all 0.15s; }
.assign-fac-row:hover[b-oneb8x2b3f] { border-color: rgba(255,255,255,0.15); background: rgba(255,255,255,0.02); }
.assign-fac-row--selected[b-oneb8x2b3f] { border-color: rgba(0,177,118,0.4); background: rgba(0,177,118,0.06); }
.assign-fac-check[b-oneb8x2b3f] { font-size: 1rem; color: var(--app-text-muted); }
.assign-fac-row--selected .assign-fac-check[b-oneb8x2b3f] { color: #34d399; }
.assign-fac-info[b-oneb8x2b3f] { display: flex; align-items: center; gap: 0.6rem; }
.assign-fac-code[b-oneb8x2b3f] { font-weight: 700; font-family: monospace; color: #60a5fa; font-size: 0.85rem; }
.assign-fac-name[b-oneb8x2b3f] { color: var(--app-text-muted); font-size: 0.82rem; }
.assign-fac-org[b-oneb8x2b3f] { margin-left: auto; font-size: 0.68rem; color: var(--app-text-muted); opacity: 0.6; max-width: 100px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assign-toolbar[b-oneb8x2b3f] { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.assign-sel-btn[b-oneb8x2b3f] { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.25rem 0.6rem; border: 1px solid var(--app-border); border-radius: 6px; background: transparent; color: var(--app-text-muted); font-size: 0.72rem; cursor: pointer; transition: all 0.15s; }
.assign-sel-btn:hover[b-oneb8x2b3f] { border-color: var(--app-accent); color: var(--app-heading); }
.assign-sel-btn:disabled[b-oneb8x2b3f] { opacity: 0.3; cursor: not-allowed; }
.assign-sel-count[b-oneb8x2b3f] { margin-left: auto; font-size: 0.72rem; color: var(--app-accent); font-weight: 600; }

.rm-spinner[b-oneb8x2b3f] { display: inline-block; width: 14px; height: 14px; border: 2px solid rgba(52,211,153,0.3); border-top-color: #34d399; border-radius: 50%; animation: rm-spin-b-oneb8x2b3f 0.6s linear infinite; }
@keyframes rm-spin-b-oneb8x2b3f { to { transform: rotate(360deg); } }
/* /Components/Pages/SharedServices.razor.rz.scp.css */
/* ── Filter Bar ───────────────────────────────────────── */
.svc-filter-bar[b-0j37ownmfs] {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}
.svc-filter-btn[b-0j37ownmfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1rem;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: transparent;
    color: var(--app-text-muted);
    font-size: 0.82rem;
    cursor: pointer;
    transition: all 0.2s;
}
.svc-filter-btn:hover[b-0j37ownmfs] { border-color: var(--app-accent); color: var(--app-heading); }
.svc-filter-btn.active[b-0j37ownmfs] {
    background: rgba(0, 177, 118, 0.12);
    border-color: var(--app-accent);
    color: var(--app-accent);
    font-weight: 600;
}
.svc-count[b-0j37ownmfs] {
    font-size: 0.7rem;
    background: rgba(255,255,255,0.06);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-weight: 600;
}
.svc-filter-btn.active .svc-count[b-0j37ownmfs] {
    background: rgba(0, 177, 118, 0.2);
}

/* ── Service Card Grid ────────────────────────────────── */
.svc-grid[b-0j37ownmfs] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: 1.25rem;
}
.svc-card[b-0j37ownmfs] {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--app-border);
    border-radius: 14px;
    background: rgba(255,255,255,0.02);
    overflow: hidden;
    transition: all 0.2s;
}
.svc-card:hover[b-0j37ownmfs] {
    border-color: rgba(255,255,255,0.15);
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}
.svc-card--disabled[b-0j37ownmfs] { opacity: 0.55; }

.svc-card-header[b-0j37ownmfs] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem 1.25rem 0.75rem;
    cursor: pointer;
    transition: background 0.15s;
}
.svc-card-header:hover[b-0j37ownmfs] { background: rgba(255,255,255,0.02); }
.svc-chevron[b-0j37ownmfs] {
    margin-left: auto;
    font-size: 0.9rem;
    opacity: 0.4;
    flex-shrink: 0;
    margin-top: 0.2rem;
    transition: transform 0.2s;
}
.input-error-subtle[b-0j37ownmfs] {
    border-color: rgba(239, 68, 68, 0.3);
}
.svc-type-icon[b-0j37ownmfs] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}
.svc-type-icon.svc-smtp[b-0j37ownmfs] { background: rgba(59, 130, 246, 0.15); color: #60a5fa; }
.svc-type-icon.svc-twilio[b-0j37ownmfs] { background: rgba(236, 72, 153, 0.15); color: #f472b6; }
.svc-type-icon.svc-ftp[b-0j37ownmfs] { background: rgba(168, 85, 247, 0.15); color: #c084fc; }

.svc-card-info h3[b-0j37ownmfs] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--app-heading);
}
.svc-badges[b-0j37ownmfs] {
    display: flex;
    gap: 0.35rem;
    margin-top: 0.35rem;
    flex-wrap: wrap;
}
.svc-badge[b-0j37ownmfs] {
    display: inline-block;
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
}
.svc-badge--type[b-0j37ownmfs] { background: rgba(255,255,255,0.06); color: var(--app-text-muted); }
.svc-badge--global[b-0j37ownmfs] { background: rgba(0, 177, 118, 0.15); color: #34d399; }
.svc-badge--org[b-0j37ownmfs] { background: rgba(56, 139, 235, 0.15); color: #60a5fa; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.svc-badge--disabled[b-0j37ownmfs] { background: rgba(239, 68, 68, 0.15); color: #ef4444; }

/* ── Card Detail Rows ─────────────────────────────────── */
.svc-card-detail[b-0j37ownmfs] {
    padding: 0 1.25rem 0.5rem;
}
.svc-detail-row[b-0j37ownmfs] {
    display: flex;
    justify-content: space-between;
    padding: 0.25rem 0;
    font-size: 0.8rem;
    border-bottom: 1px solid rgba(255,255,255,0.03);
}
.svc-detail-row:last-child[b-0j37ownmfs] { border-bottom: none; }
.svc-label[b-0j37ownmfs] { color: var(--app-text-muted); }
.svc-value[b-0j37ownmfs] { color: var(--app-heading); font-weight: 500; }
.svc-mono[b-0j37ownmfs] { font-family: monospace; font-size: 0.75rem; }

/* ── Test Result Strip ─────────────────────────────────── */
.svc-test-result[b-0j37ownmfs] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 1.25rem;
    font-size: 0.75rem;
    font-weight: 600;
}
.svc-test--pass[b-0j37ownmfs] { color: #34d399; background: rgba(0, 177, 118, 0.06); }
.svc-test--fail[b-0j37ownmfs] { color: #ef4444; background: rgba(239, 68, 68, 0.06); }
.svc-test-msg[b-0j37ownmfs] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 280px; }

/* ── Card Actions ──────────────────────────────────────── */
.svc-card-actions[b-0j37ownmfs] {
    display: flex;
    border-top: 1px solid var(--app-border);
    margin-top: auto;
}
.svc-action-btn[b-0j37ownmfs] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.65rem 0;
    border: none;
    background: transparent;
    font-size: 0.78rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
}
.svc-action-btn + .svc-action-btn[b-0j37ownmfs] { border-left: 1px solid var(--app-border); }
.svc-action--test[b-0j37ownmfs] { color: #34d399; }
.svc-action--test:hover[b-0j37ownmfs] { background: rgba(0, 177, 118, 0.08); }
.svc-action--edit[b-0j37ownmfs] { color: #60a5fa; }
.svc-action--edit:hover[b-0j37ownmfs] { background: rgba(59, 130, 246, 0.08); }
.svc-action--delete[b-0j37ownmfs] { color: #ef4444; }
.svc-action--delete:hover[b-0j37ownmfs] { background: rgba(239, 68, 68, 0.08); }
.svc-action-btn:disabled[b-0j37ownmfs] { opacity: 0.4; cursor: not-allowed; }

/* ── Spinner ────────────────────────────────────────────── */
.svc-spinner[b-0j37ownmfs] {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(52, 211, 153, 0.3);
    border-top-color: #34d399;
    border-radius: 50%;
    animation: svc-spin-b-0j37ownmfs 0.6s linear infinite;
}
/* ── Facility Assignments Panel ───────────────────────── */
.svc-facilities[b-0j37ownmfs] {
    padding: 0.5rem 1.25rem 0.75rem;
    border-top: 1px dashed rgba(255,255,255,0.06);
}
.svc-fac-header[b-0j37ownmfs] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}
.svc-fac-title[b-0j37ownmfs] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--app-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.svc-fac-add[b-0j37ownmfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.65rem;
    border: 1px solid rgba(0, 177, 118, 0.3);
    border-radius: 6px;
    background: transparent;
    color: #34d399;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.svc-fac-add:hover[b-0j37ownmfs] { background: rgba(0, 177, 118, 0.1); }
.svc-fac-list[b-0j37ownmfs] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.svc-fac-chip[b-0j37ownmfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.5rem;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 6px;
    font-size: 0.72rem;
}
.svc-fac-code[b-0j37ownmfs] {
    font-weight: 700;
    color: #60a5fa;
    font-family: monospace;
    letter-spacing: 0.04em;
}
.svc-fac-name[b-0j37ownmfs] {
    color: var(--app-text-muted);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.svc-fac-path[b-0j37ownmfs] {
    color: rgba(168, 85, 247, 0.6);
    font-size: 0.7rem;
}
.svc-fac-remove[b-0j37ownmfs] {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border: none;
    background: transparent;
    color: rgba(239, 68, 68, 0.5);
    font-size: 0.8rem;
    cursor: pointer;
    transition: color 0.15s;
}
.svc-fac-remove:hover[b-0j37ownmfs] { color: #ef4444; }
.svc-fac-empty[b-0j37ownmfs] {
    font-size: 0.75rem;
    color: var(--app-text-muted);
    opacity: 0.6;
    margin: 0;
}

/* ── Assign Dialog Rows ───────────────────────────── */
.assign-fac-list[b-0j37ownmfs] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.assign-fac-row[b-0j37ownmfs] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s;
}
.assign-fac-row:hover[b-0j37ownmfs] { border-color: rgba(255,255,255,0.15); background: rgba(255,255,255,0.02); }
.assign-fac-row--selected[b-0j37ownmfs] {
    border-color: rgba(0, 177, 118, 0.4);
    background: rgba(0, 177, 118, 0.06);
}
.assign-fac-check[b-0j37ownmfs] {
    font-size: 1rem;
    color: var(--app-text-muted);
}
.assign-fac-row--selected .assign-fac-check[b-0j37ownmfs] { color: #34d399; }
.assign-fac-info[b-0j37ownmfs] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}
.assign-fac-code[b-0j37ownmfs] {
    font-weight: 700;
    font-family: monospace;
    color: #60a5fa;
    font-size: 0.85rem;
}
.assign-fac-name[b-0j37ownmfs] {
    color: var(--app-text-muted);
    font-size: 0.82rem;
}
.assign-fac-org[b-0j37ownmfs] {
    margin-left: auto;
    font-size: 0.68rem;
    color: var(--app-text-muted);
    opacity: 0.6;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Assign Toolbar ───────────────────────────── */
.assign-toolbar[b-0j37ownmfs] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}
.assign-sel-btn[b-0j37ownmfs] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.6rem;
    border: 1px solid var(--app-border);
    border-radius: 6px;
    background: transparent;
    color: var(--app-text-muted);
    font-size: 0.72rem;
    cursor: pointer;
    transition: all 0.15s;
}
.assign-sel-btn:hover[b-0j37ownmfs] { border-color: var(--app-accent); color: var(--app-heading); }
.assign-sel-btn:disabled[b-0j37ownmfs] { opacity: 0.3; cursor: not-allowed; }
.assign-sel-count[b-0j37ownmfs] {
    margin-left: auto;
    font-size: 0.72rem;
    color: var(--app-accent);
    font-weight: 600;
}

@keyframes svc-spin-b-0j37ownmfs { to { transform: rotate(360deg); } }
/* /Components/Pages/TouScheduleEditor.razor.rz.scp.css */
.rm-fac-add[b-npedfxwz8l] { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.25rem 0.65rem; border: 1px solid rgba(0,177,118,0.3); border-radius: 6px; background: transparent; color: #34d399; font-size: 0.72rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.rm-fac-add:hover[b-npedfxwz8l] { background: rgba(0,177,118,0.1); }

/* TOU Editor */
.tou-season-card[b-npedfxwz8l] { border: 1px solid rgba(59,130,246,0.25); border-radius: 10px; padding: 1rem; margin-bottom: 0.75rem; background: rgba(59,130,246,0.03); }
.tou-season-header[b-npedfxwz8l] { margin-bottom: 0.75rem; }
.tou-periods[b-npedfxwz8l] { border-top: 1px dashed rgba(255,255,255,0.08); padding-top: 0.5rem; }
.tou-period-row[b-npedfxwz8l] { border: 1px solid rgba(255,255,255,0.06); border-radius: 8px; padding: 0.65rem; margin-bottom: 0.5rem; background: rgba(255,255,255,0.015); }
.tou-hour-grid[b-npedfxwz8l] { display: grid; grid-template-columns: repeat(12, 1fr); gap: 2px; }
.tou-hour-btn[b-npedfxwz8l] { padding: 0.2rem 0; border: 1px solid rgba(255,255,255,0.08); border-radius: 4px; background: transparent; color: var(--app-text-muted); font-size: 0.62rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.tou-hour-btn:hover[b-npedfxwz8l] { border-color: rgba(59,130,246,0.4); }
.tou-hour--on[b-npedfxwz8l] { background: rgba(59,130,246,0.25); border-color: #3b82f6; color: #93c5fd; }
.tou-day-grid[b-npedfxwz8l] { display: flex; gap: 3px; }
.tou-day-btn[b-npedfxwz8l] { padding: 0.25rem 0.5rem; border: 1px solid rgba(255,255,255,0.08); border-radius: 4px; background: transparent; color: var(--app-text-muted); font-size: 0.65rem; font-weight: 600; cursor: pointer; transition: all 0.15s; }
.tou-day-btn:hover[b-npedfxwz8l] { border-color: rgba(16,185,129,0.4); }
.tou-day--on[b-npedfxwz8l] { background: rgba(16,185,129,0.25); border-color: #10b981; color: #6ee7b7; }
/* /Components/Pages/VirtualDeviceTypes.razor.rz.scp.css */
.icon-preview[b-uu1atqw9zx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

/* The SVG is injected as raw markup (SafeMarkup.Svg), so it never receives the CSS-isolation
   scope attribute — reach it with ::deep so these rules still match. */
.icon-preview[b-uu1atqw9zx]  svg {
    width: 100%;
    height: 100%;
    fill: #fff !important;
}

.icon-preview[b-uu1atqw9zx]  svg * {
    fill: inherit !important;
    stroke: #fff !important;
}

/* Learn More dialog */
.learn-more-section[b-uu1atqw9zx] {
    margin-bottom: 1.25rem;
}

.learn-more-section:last-child[b-uu1atqw9zx] {
    margin-bottom: 0;
}

.learn-more-section h4[b-uu1atqw9zx] {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--app-heading);
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.learn-more-section p[b-uu1atqw9zx] {
    font-size: 0.85rem;
    color: var(--app-text-muted);
    line-height: 1.5;
    margin: 0 0 0.4rem 0;
}

.learn-more-section ul[b-uu1atqw9zx] {
    margin: 0.3rem 0 0 1.2rem;
    padding: 0;
    font-size: 0.85rem;
    color: var(--app-text-muted);
    line-height: 1.6;
}

.learn-more-section ul li strong[b-uu1atqw9zx] {
    color: var(--app-text);
}

.learn-more-example[b-uu1atqw9zx] {
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin-top: 0.4rem;
}

.learn-more-example p[b-uu1atqw9zx] {
    margin-bottom: 0.5rem;
}

.learn-more-formula[b-uu1atqw9zx] {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    font-size: 0.82rem;
}

.formula-step[b-uu1atqw9zx] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0;
    color: var(--app-text);
}

.formula-op[b-uu1atqw9zx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 4px;
    background: rgba(0,177,118,0.15);
    color: var(--app-accent);
    font-weight: 700;
    font-size: 0.9rem;
    flex-shrink: 0;
}

.formula-op.op-minus[b-uu1atqw9zx] {
    background: rgba(239,68,68,0.15);
    color: #ef4444;
}

/* ── System Badge (shared) ─────────────────────── */
.system-badge[b-uu1atqw9zx] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    background: rgba(99, 102, 241, 0.15);
    color: #818cf8;
    width: fit-content;
}

/* ── Calculation Steps ─────────────────────────── */
.calc-steps-container[b-uu1atqw9zx] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.calc-step-row[b-uu1atqw9zx] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    padding: 0.75rem 0.85rem;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid var(--app-border);
    border-radius: 10px;
    transition: all 0.15s ease;
}

.calc-step-row:hover[b-uu1atqw9zx] {
    border-color: rgba(0, 177, 118, 0.3);
    background: rgba(0, 177, 118, 0.04);
}

.calc-step-row.first-step[b-uu1atqw9zx] {
    border-color: rgba(30, 139, 247, 0.3);
    background: rgba(30, 139, 247, 0.04);
}

.calc-step-number[b-uu1atqw9zx] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding-bottom: 0.15rem;
}

.step-num[b-uu1atqw9zx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--app-text-muted);
}

.calc-step-operator[b-uu1atqw9zx] {
    min-width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 0.15rem;
}

.operator-badge[b-uu1atqw9zx] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 1rem;
}

.op-equals[b-uu1atqw9zx] {
    background: rgba(30, 139, 247, 0.15);
    color: #1e8bf7;
}

.operator-select[b-uu1atqw9zx] {
    width: 48px !important;
    text-align: center;
    font-weight: 700;
    font-size: 1rem !important;
    padding: 0.3rem !important;
}

.calc-step-field[b-uu1atqw9zx] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.calc-field-label[b-uu1atqw9zx] {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--app-text-muted);
}

.calc-step-remove[b-uu1atqw9zx] {
    display: flex;
    align-items: center;
    padding-bottom: 0.15rem;
}

/* ── Equation Preview ──────────────────────────── */
.equation-preview[b-uu1atqw9zx] {
    margin-top: 1.25rem;
    padding: 0.85rem 1rem;
    background: rgba(30, 139, 247, 0.06);
    border: 1px solid rgba(30, 139, 247, 0.2);
    border-radius: 10px;
}

.equation-label[b-uu1atqw9zx] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #1e8bf7;
    margin-bottom: 0.35rem;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.equation-text[b-uu1atqw9zx] {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    font-size: 0.88rem;
    color: var(--app-heading);
    word-break: break-word;
}
/* /Components/Pages/WireReference.razor.rz.scp.css */
/* Scoped styles for the NEC Wire Reference page. Lifted verbatim from its inline <style> block
   (ADR-0028 keeps styling out of markup). Standalone @page with no child components, so no
   ::deep twins are needed - see docs/session.md, D3 recipe. */
/* ── Filter Buttons ──────────────────────────────── */
    .material-filter[b-myioxlv6vt] {
        display: flex;
        gap: 0.5rem;
    }

    .filter-btn[b-myioxlv6vt] {
        padding: 0.35rem 1rem;
        border-radius: 8px;
        border: 1px solid var(--app-border);
        background: transparent;
        color: var(--app-text-muted);
        font-size: 0.8rem;
        font-weight: 500;
        cursor: pointer;
        transition: all 0.2s ease;
    }

    .filter-btn:hover[b-myioxlv6vt] {
        border-color: var(--app-accent);
        color: var(--app-text);
    }

    .filter-btn.active[b-myioxlv6vt] {
        background: var(--app-accent);
        border-color: var(--app-accent);
        color: #fff;
    }

    .filter-btn.copper.active[b-myioxlv6vt] {
        background: #d97706;
        border-color: #d97706;
    }

    .filter-btn.aluminum.active[b-myioxlv6vt] {
        background: #6b7280;
        border-color: #6b7280;
    }

    /* ── Table ────────────────────────────────────────── */
    .table-responsive[b-myioxlv6vt] {
        overflow-x: auto;
    }

    .wire-table[b-myioxlv6vt] {
        width: 100%;
        border-collapse: collapse;
    }

    .wire-table th[b-myioxlv6vt] {
        padding: 0.6rem 1rem;
        text-align: left;
        font-size: 0.78rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--app-text-muted);
        border-bottom: 1px solid var(--app-border);
        white-space: nowrap;
    }

    .wire-table td[b-myioxlv6vt] {
        padding: 0.55rem 1rem;
        font-size: 0.88rem;
        border-bottom: 1px solid rgba(255,255,255,0.04);
        white-space: nowrap;
    }

    .wire-table tbody tr:hover[b-myioxlv6vt] {
        background: rgba(255,255,255,0.03);
    }

    .text-right[b-myioxlv6vt] {
        text-align: right;
    }

    .mono[b-myioxlv6vt] {
        font-family: 'JetBrains Mono', 'Fira Code', monospace;
        font-size: 0.82rem;
    }

    .size-label[b-myioxlv6vt] {
        font-weight: 600;
        color: var(--app-heading);
    }

    /* ── Material Badges ──────────────────────────────── */
    .material-badge[b-myioxlv6vt] {
        display: inline-block;
        padding: 0.15rem 0.6rem;
        border-radius: 6px;
        font-size: 0.75rem;
        font-weight: 600;
        letter-spacing: 0.03em;
    }

    .badge-copper[b-myioxlv6vt] {
        background: rgba(217, 119, 6, 0.15);
        color: #f59e0b;
    }

    .badge-aluminum[b-myioxlv6vt] {
        background: rgba(107, 114, 128, 0.2);
        color: #9ca3af;
    }

    /* ── Row Accents ──────────────────────────────────── */
    .row-copper td:first-child[b-myioxlv6vt] {
        border-left: 3px solid rgba(217, 119, 6, 0.4);
    }

    .row-aluminum td:first-child[b-myioxlv6vt] {
        border-left: 3px solid rgba(107, 114, 128, 0.4);
    }

    /* ── Footer ──────────────────────────────────────── */
    .table-footer[b-myioxlv6vt] {
        padding: 0.75rem 1rem;
        border-top: 1px solid var(--app-border);
        display: flex;
        justify-content: flex-end;
    }

    .record-count[b-myioxlv6vt] {
        font-size: 0.78rem;
        color: var(--app-text-muted);
    }