/* /Features/Auth/SelectTenantPage.razor.rz.scp.css */
.select-tenant[b-q8goafacvt] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--pcs-bg-canvas);
    padding: 24px;
}

.select-tenant__card[b-q8goafacvt] {
    width: calc(420px + 64px + 2px);
    max-width: 100%;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-lg);
    box-shadow: var(--pcs-shadow-1);
    padding: 32px;
}

.select-tenant__title[b-q8goafacvt] {
    margin: 0 0 8px;
    font: normal normal 600 18px/24px var(--pcs-font-display);
    color: var(--pcs-charcoal);
}

.select-tenant__description[b-q8goafacvt] {
    margin: 0 0 20px;
    font: normal normal 400 13px/19px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.select-tenant__list[b-q8goafacvt] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 24px;
}

[b-q8goafacvt] .select-tenant__option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-white);
    font: normal normal 500 14px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    text-align: left;
    transition: border-color var(--pcs-transition), background-color var(--pcs-transition);
}

[b-q8goafacvt] .select-tenant__option:hover {
    background: var(--pcs-light-grey-3);
}

[b-q8goafacvt] .select-tenant__option.is-selected {
    border-color: var(--pcs-atoll);
    background: var(--pcs-light-grey-3);
}

.select-tenant__option-mark[b-q8goafacvt] {
    width: calc(16px + 2px);
    height: calc(16px + 2px);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-pill);
    flex-shrink: 0;
}

[b-q8goafacvt] .select-tenant__option.is-selected .select-tenant__option-mark {
    border-color: var(--pcs-atoll);
    background: radial-gradient(circle, var(--pcs-atoll) 0 5px, transparent 6px);
}

/* /Features/Cables/CableInspector.razor.rz.scp.css */
/* Layout only — the spacing PcsCadPropertiesPanel keeps, so the two read as one panel. */
.cable-inspector[b-w2efhysatv] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: var(--pcs-sp-15) var(--pcs-sp-15) 0;
    min-width: 0;
}
/* /Features/Cables/ConnectionsPanel.razor.rz.scp.css */
/* Layout only — the head is a row, the grid fills what is left. */
.connections[b-rvewgf1btb] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10);
}

.connections__cables[b-rvewgf1btb] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    gap: var(--pcs-sp-10);
}

/* Under the tab strip the head sits inside the tab's card, so it keeps off the card's edge;
   the grid below it runs to the edges, as the Conductors grid does. */
.connections__cables--tabbed .connections__head[b-rvewgf1btb] {
    padding: var(--pcs-sp-10) var(--pcs-sp-10) 0;
}

.connections__head[b-rvewgf1btb] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
}

.connections__spacer[b-rvewgf1btb] {
    flex: 1;
}
/* /Features/ComponentPlacement/ComponentInspector.razor.rz.scp.css */
.cinsp[b-bkueac6831] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cinsp__head[b-bkueac6831] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 12px 10px;
    border-bottom: 1px solid var(--pcs-border-soft);
}

.cinsp__title[b-bkueac6831] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.cinsp__designation[b-bkueac6831] {
    font-family: var(--pcs-font-mono);
    font-size: 16px;
    font-weight: 700;
}

.cinsp__sub[b-bkueac6831],
.cinsp__note[b-bkueac6831] {
    font-size: 11.5px;
    color: var(--pcs-fg-2);
    line-height: 1.5;
}

/* Label/value, so the facts read as a table rather than a paragraph. */
.cinsp__facts[b-bkueac6831] {
    display: grid;
    grid-template-columns: 96px 1fr;
    row-gap: 7px;
    column-gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--pcs-border-soft);
    font-size: 11.5px;
}

.cinsp__facts > span[b-bkueac6831] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cinsp__label[b-bkueac6831] {
    color: var(--pcs-fg-2);
}

.cinsp__mono[b-bkueac6831] {
    font-family: var(--pcs-font-mono);
}

.cinsp__update[b-bkueac6831] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--pcs-border-soft);
}

.cinsp__section[b-bkueac6831] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--pcs-border-soft);
}

.cinsp__section:last-child[b-bkueac6831] {
    border-bottom: 0;
}

.cinsp__caption[b-bkueac6831] {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pcs-fg-2);
}

.cinsp__terminal[b-bkueac6831] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

[b-bkueac6831] .cinsp__terminal-name {
    inline-size: 78px;
    flex: none;
    font-family: var(--pcs-font-mono);
    font-size: 12px;
}

[b-bkueac6831] .cinsp__terminal-index {
    inline-size: 52px;
    flex: none;
    font-family: var(--pcs-font-mono);
    font-size: 12px;
}

.cinsp__terminal-role[b-bkueac6831] {
    flex: 1;
    min-width: 0;
    font-size: 11px;
    color: var(--pcs-fg-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* "catalog" until something is stored for this Device, then "terminal instance" —
   the visible difference between a definition and an override (ADR-0075 point 5). */
.cinsp__chip[b-bkueac6831] {
    flex: none;
    padding: 2px 7px;
    border-radius: 9px;
    background: var(--pcs-light-grey-2);
    color: var(--pcs-fg-2);
    font-size: 10px;
    white-space: nowrap;
}

.cinsp__chip--instance[b-bkueac6831] {
    background: color-mix(in srgb, var(--pcs-atoll) 12%, #fff);
    color: var(--pcs-atoll);
}

.cinsp__alternative[b-bkueac6831] {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 9px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm, 3px);
}

.cinsp__alternative-name[b-bkueac6831] {
    flex: 1;
    min-width: 0;
    font-size: 11.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cinsp__thumb[b-bkueac6831] {
    inline-size: 22px;
    block-size: 30px;
    flex: none;
    display: grid;
    place-items: center;
}

.cinsp__thumb[b-bkueac6831]  svg {
    max-inline-size: 100%;
    max-block-size: 100%;
}
/* /Features/ComponentPlacement/ComponentListPanel.razor.rz.scp.css */
.clist[b-wrw7vktbxu] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.clist__head[b-wrw7vktbxu] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 10px;
    border-bottom: 1px solid var(--pcs-border-soft);
}

.clist__head--lower[b-wrw7vktbxu] {
    border-top: 1px solid var(--pcs-border);
    background: var(--pcs-light-grey-3);
}

.clist__caption[b-wrw7vktbxu] {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pcs-fg-2);
}

/* The upper half is capped so the lower one is always visible: "what is still
   undrawn" is the question the panel exists to answer (ADR-0075 point 9). */
.clist__instances[b-wrw7vktbxu] {
    flex: 0 1 auto;
    max-height: 46%;
    overflow-y: auto;
}

.clist__unplaced[b-wrw7vktbxu] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.clist__instance[b-wrw7vktbxu] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    padding-right: 8px;
    border-bottom: 1px solid var(--pcs-border-soft);
    border-left: 3px solid transparent;
}

.clist__instance--selected[b-wrw7vktbxu] {
    border-left-color: var(--pcs-atoll);
    background: var(--pcs-light-grey-3);
}

[b-wrw7vktbxu] .clist__instance-main {
    flex: 1;
    min-width: 0;
    display: flex;
    gap: 9px;
    align-items: flex-start;
    padding: 9px 4px 9px 10px;
    text-align: left;
    font-family: var(--pcs-font-ui);
}

[b-wrw7vktbxu] .clist__glyph {
    flex: none;
    margin-top: 2px;
    opacity: 0.7;
}

.clist__instance-facts[b-wrw7vktbxu],
.clist__symbol-facts[b-wrw7vktbxu] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.clist__ident[b-wrw7vktbxu] {
    display: flex;
    align-items: baseline;
    gap: 7px;
    min-width: 0;
}

.clist__designation[b-wrw7vktbxu] {
    font-family: var(--pcs-font-mono);
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.clist__order[b-wrw7vktbxu] {
    font-family: var(--pcs-font-mono);
    font-size: 10.5px;
    color: var(--pcs-fg-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.clist__elements[b-wrw7vktbxu],
.clist__progress[b-wrw7vktbxu] {
    font-size: 11px;
    color: var(--pcs-fg-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.clist__progress--done[b-wrw7vktbxu] {
    color: var(--pcs-success);
}

.clist__orphan[b-wrw7vktbxu] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 2px;
    font-size: 10.5px;
    color: var(--pcs-warning);
}

[b-wrw7vktbxu] .clist__symbol {
    display: flex;
    width: 100%;
    gap: 10px;
    align-items: center;
    padding: 8px 10px;
    border-bottom: 1px solid var(--pcs-border-soft);
    background: var(--pcs-white);
    text-align: left;
    font-family: var(--pcs-font-ui);
}

[b-wrw7vktbxu] .clist__symbol:hover:not(:disabled) {
    background: var(--pcs-light-grey-3);
}

[b-wrw7vktbxu] .clist__symbol:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

/* The armed symbol — the canvas crosshair's origin. */
[b-wrw7vktbxu] .clist__symbol--armed {
    background: color-mix(in srgb, var(--pcs-atoll) 10%, #fff);
}

.clist__thumb[b-wrw7vktbxu] {
    inline-size: calc(26px + 2px);
    block-size: calc(34px + 2px);
    flex: none;
    display: grid;
    place-items: center;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: 2px;
}

.clist__thumb[b-wrw7vktbxu]  svg {
    max-inline-size: 100%;
    max-block-size: 100%;
}

.clist__symbol-name[b-wrw7vktbxu] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    min-width: 0;
}

.clist__symbol-name > span:last-child[b-wrw7vktbxu] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.clist__symbol-sub[b-wrw7vktbxu] {
    font-size: 10.5px;
    color: var(--pcs-fg-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.clist__place[b-wrw7vktbxu] {
    flex: none;
    font-size: 11px;
    font-weight: 600;
    color: var(--pcs-atoll);
}

.clist__foot[b-wrw7vktbxu] {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border-top: 1px solid var(--pcs-border);
}

[b-wrw7vktbxu] .clist__foot-button {
    flex: 1;
}
/* /Features/ComponentPlacement/ComponentPalette.razor.rz.scp.css */
.cpal[b-2v3evfdbcp] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
}

.cpal__head[b-2v3evfdbcp] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 10px 8px;
    border-bottom: 1px solid var(--pcs-border-soft);
}

.cpal__aspect[b-2v3evfdbcp] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11.5px;
    color: var(--pcs-fg-2);
    white-space: nowrap;
}

.cpal__aspect-code[b-2v3evfdbcp] {
    font-family: var(--pcs-font-mono);
    font-weight: 700;
}

.cpal__rows[b-2v3evfdbcp] {
    /* Take exactly the remaining panel height so only this list scrolls — the
       footnote below must stay put while the catalog moves. */
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

.cpal__loading[b-2v3evfdbcp] {
    display: grid;
    place-items: center;
    padding: 24px;
}

.cpal__group[b-2v3evfdbcp] {
    border-bottom: 1px solid var(--pcs-border-soft);
}

.cpal__row[b-2v3evfdbcp] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 8px 10px;
}

.cpal__row:hover[b-2v3evfdbcp] {
    background: var(--pcs-light-grey-3);
}

/* A part the catalog does not draw on this page's aspect. Dimmed rather than
   hidden: the user looked for it, and "not here" is the answer (ADR-0075 pt 3). */
.cpal__row--dimmed[b-2v3evfdbcp] {
    opacity: 0.55;
}

[b-2v3evfdbcp] .cpal__glyph {
    flex: none;
    margin-top: 1px;
    opacity: 0.75;
}

[b-2v3evfdbcp] .cpal__chevron {
    transition: transform 120ms ease;
}

[b-2v3evfdbcp] .cpal__chevron--open {
    transform: rotate(90deg);
}

.cpal__facts[b-2v3evfdbcp] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cpal__ident[b-2v3evfdbcp] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
}

.cpal__order[b-2v3evfdbcp] {
    font-family: var(--pcs-font-mono);
    font-size: 12.5px;
    font-weight: 700;
    color: var(--pcs-fg-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cpal__maker[b-2v3evfdbcp] {
    font-size: 11px;
    color: var(--pcs-fg-2);
    white-space: nowrap;
}

.cpal__desc[b-2v3evfdbcp] {
    font-size: 11.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cpal__meta[b-2v3evfdbcp] {
    font-size: 10.5px;
    color: var(--pcs-fg-2);
}

.cpal__meta--warn[b-2v3evfdbcp] {
    color: var(--pcs-warning);
}

[b-2v3evfdbcp] .cpal__grab {
    flex: none;
}

[b-2v3evfdbcp] .cpal__element {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 10px;
    padding: 7px 10px 7px 38px;
    border-left: 3px solid transparent;
    background: var(--pcs-light-grey-3);
    text-align: left;
    cursor: var(--pcs-cursor-grab);
    font-family: var(--pcs-font-ui);
}

[b-2v3evfdbcp] .cpal__element:hover:not(:disabled) {
    background: var(--pcs-light-grey-2);
}

[b-2v3evfdbcp] .cpal__element:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

/* The armed element, so the canvas crosshair has a visible origin. */
[b-2v3evfdbcp] .cpal__element--armed {
    border-left-color: var(--pcs-accent);
}

.cpal__thumb[b-2v3evfdbcp] {
    inline-size: calc(26px + 2px);
    block-size: calc(34px + 2px);
    flex: none;
    display: grid;
    place-items: center;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: 2px;
}

.cpal__thumb[b-2v3evfdbcp]  svg {
    max-inline-size: 100%;
    max-block-size: 100%;
}

.cpal__element-facts[b-2v3evfdbcp] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.cpal__element-name[b-2v3evfdbcp] {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cpal__delta[b-2v3evfdbcp] {
    font-family: var(--pcs-font-mono);
    font-weight: 700;
}

.cpal__element-sub[b-2v3evfdbcp] {
    font-size: 10.5px;
    color: var(--pcs-fg-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cpal__foot[b-2v3evfdbcp] {
    margin: 0;
    padding: 8px 10px;
    border-top: 1px solid var(--pcs-border);
    background: var(--pcs-light-grey-3);
    font-size: 10.5px;
    color: var(--pcs-fg-2);
    line-height: 1.5;
}
/* /Features/ComponentPlacement/DeviceDatasheet.razor.rz.scp.css */
.dsheet[b-3rsa5v8cir] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.dsheet__head[b-3rsa5v8cir],
.dsheet__bar[b-3rsa5v8cir] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dsheet__bar[b-3rsa5v8cir] {
    justify-content: space-between;
}

.dsheet__caption[b-3rsa5v8cir],
.dsheet__group-title[b-3rsa5v8cir] {
    flex: 1;
    min-width: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
}

/* One step darker than the section caption: a group is what the eye scans for. */
.dsheet__group-title[b-3rsa5v8cir] {
    color: var(--pcs-fg-1);
}

.dsheet__count[b-3rsa5v8cir] {
    font-size: 11px;
    color: var(--pcs-fg-2);
    white-space: nowrap;
}

.dsheet__group[b-3rsa5v8cir] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--pcs-border-soft);
    padding-top: 4px;
}

[b-3rsa5v8cir] .dsheet__group-head {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 2px 0;
    text-align: left;
}

.dsheet__row[b-3rsa5v8cir] {
    display: flex;
    align-items: flex-start;
    gap: 4px;
}

/* Label and value side by side, so the list reads as a table. */
[b-3rsa5v8cir] .dsheet__view {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
    padding: 3px 6px;
    margin: 0 -6px;
    border-radius: var(--pcs-radius-sm);
    text-align: left;
    font-size: 12px;
    line-height: 16px;
}

[b-3rsa5v8cir] .dsheet__view:hover:not(:disabled) {
    background: var(--pcs-bg-2);
}

.dsheet__label[b-3rsa5v8cir] {
    color: var(--pcs-fg-3);
}

.dsheet__value[b-3rsa5v8cir] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    color: var(--pcs-fg-1);
    overflow-wrap: anywhere;
}

.dsheet__value--empty[b-3rsa5v8cir] {
    color: var(--pcs-fg-2);
}

.dsheet__swatch[b-3rsa5v8cir] {
    flex: none;
    width: 14px;
    height: 14px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-xs);
}

.dsheet__note[b-3rsa5v8cir] {
    flex: 1;
    min-width: 0;
    font-size: 11px;
    color: var(--pcs-fg-3);
}

.dsheet__type[b-3rsa5v8cir] {
    font-family: var(--pcs-font-mono);
    font-size: 11px;
    color: var(--pcs-fg-2);
    white-space: nowrap;
}

/* Fixed and placed by pcs.pinPopover over its row; hidden until then. */
.dsheet__pop[b-3rsa5v8cir] {
    position: fixed;
    z-index: 20;
    visibility: hidden;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px 12px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-bg-1);
    box-shadow: var(--pcs-shadow-menu);
}

.dsheet__pop-head[b-3rsa5v8cir] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.dsheet__pop-label[b-3rsa5v8cir] {
    flex: 1;
    min-width: 0;
    font-size: 12px;
    font-weight: 600;
}

[b-3rsa5v8cir] .dsheet__pop-foot {
    padding-top: 8px;
    border-top: 1px solid var(--pcs-border-soft);
}

.dsheet__error[b-3rsa5v8cir] {
    font-size: 11px;
    line-height: 14px;
    color: var(--pcs-danger);
}
/* /Features/Components/ComponentDefinitionView.razor.rz.scp.css */
/* Layout only (cube-ui): the toolbar, its two pickers, the breadcrumb and status strips,
   and the panel an expanded row opens onto. Looks come from the Pcs* primitives; the rows
   and columns belong to PcsDataGrid. */

.cd-view[b-00xqtyc0t6] {
    position: relative;   /* the drawing-aspects PcsDrawer anchors to this box... */
    overflow-x: clip;     /* ...and its closed state is translated past the right edge */
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.cd-view__toolbar[b-00xqtyc0t6] {
    flex: none;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10) var(--pcs-sp-20);
}

/* ManufacturerPicker is its own component but still draws with these classes, so every
   rule it relies on reaches through `.cd-view ::deep` — a plain selector here carries
   this file's scope id, which the picker's markup does not, and its menu then rendered
   inline in the toolbar instead of floating. */

.cd-view[b-00xqtyc0t6]  .cd-view__spacer {
    flex: 1;
}

.cd-view[b-00xqtyc0t6]  .cd-view__grow {
    flex: 1;
    min-width: 0;
    text-align: left;
}

.cd-view[b-00xqtyc0t6]  .cd-view__ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cd-view__search[b-00xqtyc0t6] {
    width: 250px;
    min-width: 150px;
}

/* pickers */

.cd-view[b-00xqtyc0t6]  .cd-view__picker-wrap {
    position: relative;
    flex: none;
}

.cd-view[b-00xqtyc0t6]  .cd-view__picker-wrap--mfr {
    width: 230px;
    min-width: 170px;
}

.cd-view[b-00xqtyc0t6]  .cd-view__picker {
    width: 100%;
}

/* ponytail: the popover surface (ground, radius, shadow) stays here until a PcsPopover
   primitive exists — a transparent menu over the grid is unusable. Everything inside it
   is a primitive. */
.cd-view[b-00xqtyc0t6]  .cd-view__menu {
    position: absolute;
    z-index: 60;
    top: calc(100% + var(--pcs-sp-4));
    left: 0;
    min-width: calc(240px + 2 * var(--pcs-sp-4));
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: var(--pcs-sp-4);
    background: var(--pcs-bg-1);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu--right {
    left: auto;
    right: 0;
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu--wide {
    min-width: calc(300px + 2 * var(--pcs-sp-4));
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-scroll {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    max-height: 280px;
    overflow: auto;
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-foot {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-item {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    width: 100%;
}

/* A pick in the popover is a menu row, not a button: a stack of bordered buttons with the
   chosen one filled navy read as a toolbar that had fallen into the menu. Part of the
   ponytail above — it goes to the popover primitive with the surface. */
.cd-view[b-00xqtyc0t6]  .cd-view__menu-row {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    padding: 6px var(--pcs-sp-10);
    border-radius: var(--pcs-radius-sm);
    font-size: 13px;
    color: var(--pcs-fg-1);
    transition: background-color var(--pcs-transition);
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-row:hover:not(:disabled) {
    background: var(--pcs-bg-2);
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-row.is-selected {
    color: var(--pcs-accent);
    font-weight: 600;
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-row:disabled {
    opacity: 0.5;
    cursor: default;
}

.cd-view[b-00xqtyc0t6]  .cd-view__menu-note {
    font-size: 12px;
    color: var(--pcs-fg-2);
}

/* The action menu's trigger is positioned by its host (ADR-0044): the row is a flex row,
   so the trigger only needs to stop stretching. */
.cd-view[b-00xqtyc0t6]  .cd-view__menu-item .pcs-menu-button__dots {
    flex: none;
}

/* breadcrumbs */

.cd-view__crumbs[b-00xqtyc0t6] {
    flex: none;
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10) var(--pcs-sp-20);
}

/* the selected version's picture */

.cd-view__image[b-00xqtyc0t6] {
    flex: none;
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    padding: 0 var(--pcs-sp-20) var(--pcs-sp-10);
}

.cd-view[b-00xqtyc0t6]  .cd-view__image-open {
    flex: none;
    display: block;
    line-height: 0;
    cursor: zoom-in;
}

.cd-view[b-00xqtyc0t6]  .cd-view__image-thumb {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-bg-1);
}

.cd-view__image-none[b-00xqtyc0t6],
.cd-view__image-hint[b-00xqtyc0t6] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* the grid's picture column: a row-high thumbnail, the same zoom gesture as the strip */

.cd-view[b-00xqtyc0t6]  .cd-view__cell-image-open {
    display: block;
    line-height: 0;
    cursor: zoom-in;
}

.cd-view[b-00xqtyc0t6]  .cd-view__cell-image {
    width: 24px;
    height: 24px;
    object-fit: contain;
    background: var(--pcs-bg-1);
}

/* the grid */

.cd-view__body[b-00xqtyc0t6] {
    flex: 1 1 auto;
    min-height: 0;
}

.cd-view__grid[b-00xqtyc0t6] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    padding: 0 var(--pcs-sp-20);
}

/* The selected part's elements and its five tabs, under the grid. */
.cd-view__detail[b-00xqtyc0t6] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    height: 100%;
    min-height: 0;
    overflow: auto;
    padding: var(--pcs-sp-10) var(--pcs-sp-20);
}
/* /Features/Components/ComponentElementsPanel.razor.rz.scp.css */
/* Layout only (cube-ui): the elements panel inside an expanded grid row, and the inset an
   element's static sub-objects sit in. The rows are PcsTable's. */

.cd-elements[b-xohdme7230] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10) var(--pcs-sp-10) var(--pcs-sp-15) var(--pcs-sp-15);
}

.cd-elements__head[b-xohdme7230] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
}

.cd-elements__spacer[b-xohdme7230] {
    flex: 1;
}

.cd-elements__statics[b-xohdme7230] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10);
}
/* /Features/Components/ComponentImageDialog.razor.rz.scp.css */
/* Layout only: the picture fills the dialog's width at its own aspect ratio and the
   one action sits under it. The dialog shell supplies the chrome and padding. */
.component-image[b-ntoje07sax] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
}

.component-image[b-ntoje07sax]  .component-image__full {
    max-width: 100%;
    max-height: 70vh;
    object-fit: contain;
    align-self: center;
}

.component-image__actions[b-ntoje07sax] {
    display: flex;
    justify-content: flex-end;
}
/* /Features/Components/ComponentLifecycleDialog.razor.rz.scp.css */
.lc-dialog[b-xlw43x2u50] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-8);
}

.lc-dialog__successor[b-xlw43x2u50],
.lc-dialog[b-xlw43x2u50]  .lc-dialog__match {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-6);
}

.lc-dialog__matches[b-xlw43x2u50] {
    display: flex;
    flex-direction: column;
}

.lc-dialog__grow[b-xlw43x2u50] {
    flex: 1;
    min-width: 0;
}
/* /Features/Components/ComponentScopeTabs.razor.rz.scp.css */
/* Layout only (cube-ui): the sub-tab panel under an expanded row. The strip and its
   frame are PcsTabPanel's; the table is PcsTable's, and it brings its own horizontal
   scrolling — which is what the fifteen-column I/O tier needs. */

.cd-tabs[b-3bbo6tr1ls] {
    margin: 0 var(--pcs-sp-10) var(--pcs-sp-15) var(--pcs-sp-15);
}

.cd-tabs__body[b-3bbo6tr1ls] {
    display: flex;
    flex-direction: column;
}
/* /Features/Components/DrawingAspectsEditor.razor.rz.scp.css */
/* Layout only (cube-ui): a section per aspect, a row per symbol with its placement
   defaults, and the two pin-map lists with a lines column between them. Looks come from
   the Pcs* primitives; the lines and dots take the text colour (currentColor). */

.cd-aspects[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
}

.cd-aspects__head[b-gl2wwuuo7b] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10) var(--pcs-sp-20) 0;
}

.cd-aspects__spacer[b-gl2wwuuo7b] {
    flex: 1;
}

.cd-aspects__ellipsis[b-gl2wwuuo7b] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cd-aspects__code[b-gl2wwuuo7b] {
    font-weight: 600;
}

/* An aspect section: its head row, then its symbol rows. */
.cd-aspects__lane[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
    border-bottom: 1px solid var(--pcs-border);
}

.cd-aspects__lane-head[b-gl2wwuuo7b] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-10) var(--pcs-sp-20);
    background: var(--pcs-bg-2);
}

.cd-aspects__lane-name[b-gl2wwuuo7b] {
    font-weight: 500;
}

.cd-aspects__symbol[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--pcs-border-soft);
}

/* name + status | seq | scale | rotation | remove */
.cd-aspects__row[b-gl2wwuuo7b] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 64px 84px 96px 32px;
    gap: var(--pcs-sp-10);
    align-items: center;
    padding: var(--pcs-sp-10) var(--pcs-sp-20) var(--pcs-sp-10) var(--pcs-sp-30);
}

/* The row's identity is a button because it opens the pin map; it is chrome, not a
   control with its own look, so it stays borderless. */
[b-gl2wwuuo7b] .cd-aspects__row-main {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    min-width: 0;
    text-align: left;
}

/* The stored thumbnail is raw markup, so it carries no scope attribute of its own and has
   to be reached through ::deep — the same shape the symbol palette uses. */
.cd-aspects__thumb[b-gl2wwuuo7b] {
    flex: none;
    inline-size: 32px;
    block-size: 32px;
    display: grid;
    place-items: center;
}

.cd-aspects__thumb[b-gl2wwuuo7b]  svg {
    max-inline-size: 100%;
    max-block-size: 100%;
}

.cd-aspects__row-text[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--pcs-sp-4);
    min-width: 0;
}

.cd-aspects__row-name[b-gl2wwuuo7b] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    min-width: 0;
    max-width: 100%;
    font-weight: 500;
}

[b-gl2wwuuo7b] .cd-aspects__seq {
    text-align: center;
}

.cd-aspects__undrawn[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-15) var(--pcs-sp-20);
}

.cd-aspects__chips[b-gl2wwuuo7b] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--pcs-sp-10);
}

.cd-aspects__note[b-gl2wwuuo7b] {
    margin: 0;
    padding: var(--pcs-sp-10) var(--pcs-sp-20) var(--pcs-sp-15);
    color: var(--pcs-fg-3);
}

/* Pin map: two node lists and the lines column. Row pitch (44px node + 6px gap) is what
   DrawingAspectsEditor.PinRowPitch draws the lines against — change both together. The svg
   gets its height as a pixel attribute: a percentage would not resolve in the auto-sized
   grid row and the browser would size it from the viewBox aspect, stretching every line. */
.cd-pinmap[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: 0 var(--pcs-sp-20) var(--pcs-sp-15) var(--pcs-sp-30);
}

.cd-pinmap__head[b-gl2wwuuo7b] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
}

.cd-pinmap__cols[b-gl2wwuuo7b],
.cd-pinmap__grid[b-gl2wwuuo7b] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 140px minmax(0, 1fr);
}

.cd-pinmap__list[b-gl2wwuuo7b] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

[b-gl2wwuuo7b] .cd-pinmap__node {
    position: relative;
    height: 44px;
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    padding: 0 var(--pcs-sp-15);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-white);
    text-align: left;
    min-width: 0;
}

[b-gl2wwuuo7b] .cd-pinmap__node:disabled {
    cursor: default;
}

.cd-pinmap__node.is-pending[b-gl2wwuuo7b],
[b-gl2wwuuo7b] .cd-pinmap__node.is-target:not(:disabled):hover {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: -2px;
}

[b-gl2wwuuo7b] .cd-pinmap__node.is-invalid {
    outline: 2px solid var(--pcs-danger);
    outline-offset: -2px;
}

.cd-pinmap__index[b-gl2wwuuo7b] {
    font-weight: 600;
    min-width: 24px;
}

/* Two lines inside the 44px node: what it is called, then what it is. */
.cd-pinmap__text[b-gl2wwuuo7b] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
}

.cd-pinmap__dot[b-gl2wwuuo7b] {
    position: absolute;
    top: 50%;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: currentColor;
    transform: translateY(-50%);
}

.cd-pinmap__dot--end[b-gl2wwuuo7b] {
    right: -5px;
}

.cd-pinmap__dot--start[b-gl2wwuuo7b] {
    left: -5px;
}

.cd-pinmap__lines[b-gl2wwuuo7b] {
    display: block;
    width: 100%;
    overflow: visible;
}

.cd-pinmap__line[b-gl2wwuuo7b] {
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
    pointer-events: stroke;
    cursor: pointer;
}
/* /Features/Components/ReplacementSearchDialog.razor.rz.scp.css */
/* Replace component: candidates on the left, the comparison on the right (Claude Design,
   "Replace Component"). Layout here; type and colour from the tokens the design names. */
.rs[b-v0ubdehw98] {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    /* Fill the dialog body (a flex column), so both panes scroll the full height. */
    flex: 1;
    min-height: 0;
}

.rs__side[b-v0ubdehw98] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-right: 1px solid var(--pcs-border);
    background: var(--pcs-bg-2);
}

.rs__tabs[b-v0ubdehw98] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-15) var(--pcs-sp-20) var(--pcs-sp-10);
}

.rs__negotiable[b-v0ubdehw98] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
}

.rs__chips[b-v0ubdehw98] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--pcs-sp-4);
}

.rs__hint[b-v0ubdehw98] {
    margin: 0;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}

.rs__list[b-v0ubdehw98] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 0 12px 16px;
}

[b-v0ubdehw98] .rs__card {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: 12px 14px;
    border: 1px solid transparent;
    border-radius: var(--pcs-radius-md);
    text-align: left;
}

[b-v0ubdehw98] .rs__card.is-selected {
    border-color: var(--pcs-accent);
    background: var(--pcs-bg-1);
}

.rs__ident[b-v0ubdehw98] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
}

.rs__order[b-v0ubdehw98] {
    font-family: var(--pcs-font-mono);
    font-weight: 700;
    font-size: 13px;
}

.rs__maker[b-v0ubdehw98] {
    font-size: 12px;
    color: var(--pcs-fg-3);
}

.rs__desc[b-v0ubdehw98] {
    font-size: 13px;
    line-height: 18px;
}

.rs__match[b-v0ubdehw98] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--pcs-fg-3);
}

.rs__dot[b-v0ubdehw98] {
    inline-size: 6px;
    block-size: 6px;
    flex: none;
    border-radius: 50%;
    background: transparent;
}

.rs__dot--ok[b-v0ubdehw98] { background: var(--pcs-success); }
.rs__dot--warn[b-v0ubdehw98] { background: var(--pcs-warning); }
.rs__dot--none[b-v0ubdehw98] { background: var(--pcs-fg-3); }

.rs__main[b-v0ubdehw98] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-height: 0;
    min-width: 0;
    overflow-y: auto;
    padding: var(--pcs-sp-20) var(--pcs-sp-30);
}

.rs__pair[b-v0ubdehw98] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: stretch;
    gap: 12px;
}

.rs__part[b-v0ubdehw98] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: 12px 14px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
}

.rs__part--picked[b-v0ubdehw98] {
    border-color: var(--pcs-accent);
}

[b-v0ubdehw98] .rs__arrow {
    align-self: center;
    color: var(--pcs-fg-2);
}

.rs__attrs-head[b-v0ubdehw98] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.rs__grow[b-v0ubdehw98] {
    flex: 1;
}

.rs__table[b-v0ubdehw98] {
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
}

.rs__row[b-v0ubdehw98] {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
    border-bottom: 1px solid var(--pcs-border-soft);
    font-size: 13px;
    line-height: 18px;
}

.rs__row > span[b-v0ubdehw98] {
    padding: 8px 14px;
}

.rs__row--head[b-v0ubdehw98] {
    position: sticky;
    top: 0;
    background: var(--pcs-bg-2);
    font-size: 12px;
    font-weight: 600;
    color: var(--pcs-fg-3);
}

.rs__row--differs[b-v0ubdehw98] {
    background: color-mix(in srgb, var(--pcs-warning) 7%, transparent);
}

.rs__row--differs .rs__value[b-v0ubdehw98] {
    font-weight: 600;
}

.rs__value[b-v0ubdehw98] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.rs__all-match[b-v0ubdehw98] {
    margin: 0;
    padding: 28px 14px;
    text-align: center;
    font-size: 13px;
    color: var(--pcs-fg-3);
}

.rs__apply[b-v0ubdehw98] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rs__scopes[b-v0ubdehw98] {
    display: flex;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 6px;
    font-size: 13px;
}
/* /Features/Components/SymbolPickerDialog.razor.rz.scp.css */
/* Layout only (cube-ui): a filter and a scrolling list of PcsButtons, inside another dialog. */

.cd-picker[b-zbpsr281pq] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    min-width: 360px;
}

.cd-picker__list[b-zbpsr281pq] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    max-height: 340px;
    overflow: auto;
}

.cd-picker__list[b-zbpsr281pq]  .cd-picker__item {
    width: 100%;
}

.cd-picker__name[b-zbpsr281pq] {
    flex: 1;
    min-width: 0;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Features/Floorplans/Editor/DrawToolPanel.razor.rz.scp.css */
.fp-editor__dims[b-oayi8lo8sz] {
    margin-top: 12px;
}
/* /Features/Floorplans/Editor/PrepareCard.razor.rz.scp.css */
.fp-editor__prepare[b-1vkfbnit4d] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fp-editor__prepare-title[b-1vkfbnit4d] {
    font: normal normal 600 15px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

[b-1vkfbnit4d] .fp-editor__prepare-step {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    padding: 10px 12px;
    text-align: left;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-white);
}

[b-1vkfbnit4d] .fp-editor__prepare-step:hover:not(:disabled) {
    border-color: var(--pcs-atoll);
    background: var(--pcs-light-grey-3);
}

[b-1vkfbnit4d] .fp-editor__prepare-step:disabled {
    opacity: 0.55;
    cursor: default;
}

.fp-editor__prepare-step-name[b-1vkfbnit4d] {
    font: normal normal 600 13px/16px var(--pcs-font-ui);
    color: var(--pcs-atoll);
}

.fp-editor__prepare-step-desc[b-1vkfbnit4d] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}
/* /Features/Floorplans/Editor/RoomDetailsPanel.razor.rz.scp.css */
.fp-editor__rename[b-8oufycmx75] {
    display: flex;
    gap: 8px;
    margin-bottom: var(--pcs-sp-20);
}

.fp-editor__color-row[b-8oufycmx75] {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: var(--pcs-sp-20);
}

.fp-editor__dims[b-8oufycmx75] {
    margin-bottom: 8px;
}

.fp-editor__dim-hint[b-8oufycmx75] {
    margin: 0 0 var(--pcs-sp-20);
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.fp-editor__dims:last-of-type[b-8oufycmx75] {
    margin-bottom: var(--pcs-sp-20);
}

.fp-editor__facts[b-8oufycmx75] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px 12px;
    margin: 0;
}

.fp-editor__facts dt[b-8oufycmx75] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.fp-editor__facts dd[b-8oufycmx75] {
    margin: 0;
    font: normal normal 500 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    text-align: right;
}

.fp-editor__delete[b-8oufycmx75] {
    margin-top: var(--pcs-sp-20);
}

.fp-editor__delete-confirm[b-8oufycmx75] {
    margin: var(--pcs-sp-20) 0 8px;
    font: normal normal 500 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}
/* /Features/Floorplans/Editor/RoomListPanel.razor.rz.scp.css */
.fp-editor__rooms[b-itrj7nuz60] {
    display: flex;
    flex-direction: column;
    min-height: 80px;
    max-height: 45%;
    border-bottom: 1px solid var(--pcs-border);
}

.fp-editor__rooms-head[b-itrj7nuz60] {
    flex-shrink: 0;
    padding: 12px var(--pcs-sp-20) 6px;
    font: normal normal 600 12px/16px var(--pcs-font-ui);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--pcs-mid-grey);
}

.fp-editor__rooms .fp-editor__hint[b-itrj7nuz60] {
    padding: 0 var(--pcs-sp-20) 8px;
}

.fp-editor__room-list[b-itrj7nuz60] {
    list-style: none;
    margin: 0;
    padding: 0 0 8px;
    overflow: auto;
    flex: 1;
    min-height: 0;
}

.fp-editor__room-item[b-itrj7nuz60] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px var(--pcs-sp-20) 6px 8px;
    cursor: pointer;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.fp-editor__room-item:hover[b-itrj7nuz60] {
    background: var(--pcs-light-grey-3);
}

.fp-editor__room-item.is-selected[b-itrj7nuz60] {
    background: rgba(0, 187, 203, 0.14);
    font-weight: 600;
}

.fp-editor__room-swatch[b-itrj7nuz60] {
    flex-shrink: 0;
    width: calc(12px + 2px);
    height: calc(12px + 2px);
    border-radius: 3px;
    border: 1px solid rgba(0, 0, 0, 0.15);
}

.fp-editor__room-name[b-itrj7nuz60] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fp-editor__room-name.is-untitled[b-itrj7nuz60] {
    color: var(--pcs-mid-grey);
    font-style: italic;
}

.fp-editor__room-area[b-itrj7nuz60] {
    flex-shrink: 0;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
    white-space: nowrap;
}

.fp-editor__room-item.is-selected .fp-editor__room-area[b-itrj7nuz60] {
    color: var(--pcs-charcoal);
}

[b-itrj7nuz60] .fp-editor__room-edit {
    flex: 1;
    min-width: 0;
    height: 24px;
    padding: 0 6px;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    background: var(--pcs-white);
    border: 1px solid var(--pcs-atoll);
    border-radius: var(--pcs-radius-sm);
    outline: none;
}
/* /Features/Floorplans/Editor/ScaleToolPanel.razor.rz.scp.css */
/* Controls are .pcs-input .pcs-input--sm (app.css baseline). */
.fp-editor__scale-guide[b-2bpjemiku5] {
    margin: 0 0 8px;
    padding-left: 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.fp-editor__scale-guide li.is-current[b-2bpjemiku5] {
    color: var(--pcs-charcoal);
    font-weight: 600;
}

.fp-editor__scale-guide li.is-done[b-2bpjemiku5] {
    text-decoration: line-through;
}

.fp-editor__scale-row[b-2bpjemiku5] {
    display: flex;
    gap: 8px;
    margin-bottom: var(--pcs-sp-15);
}
/* /Features/Floorplans/FloorplanEditor.razor.rz.scp.css */
.fp-editor[b-exdh15lhbv] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.fp-editor__bar[b-exdh15lhbv] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-15);
    padding: 10px var(--pcs-sp-20);
    /* 32px tool buttons + padding: fixed so the bar doesn't jump when a tool
       hides the buttons while it is active. */
    min-height: 53px;
    border-bottom: 1px solid var(--pcs-border);
    flex-shrink: 0;
}

.fp-editor__scale-done[b-exdh15lhbv] {
    margin: 0;
    font: normal normal 600 13px/18px var(--pcs-font-ui);
    color: var(--pcs-success);
}

.fp-editor__count[b-exdh15lhbv] {
    font: normal normal 400 13px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.fp-editor__spacer[b-exdh15lhbv] {
    flex: 1;
}

.fp-editor__zoom[b-exdh15lhbv] {
    display: flex;
    align-items: center;
    gap: 6px;
}

/* PcsButtonGroup's default gap is the 8px of a dialog action row; the two
   history squares sit tighter than that. ::deep because the class lands on the
   group's own root, which carries its scope id and not this file's. */
.fp-editor__bar[b-exdh15lhbv]  .fp-editor__history {
    gap: 4px;
}

.fp-editor__zoom-label[b-exdh15lhbv] {
    min-width: 44px;
    text-align: center;
    font: normal normal 400 13px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* The top-bar ⋮ lives inside the ActionMenu child component — ::deep reaches it. */
.fp-editor__bar[b-exdh15lhbv]  .pcs-menu-button__dots {
    margin-left: 8px;
}

/* The scale readout is PcsBadge (Accent). */

[b-exdh15lhbv] .fp-editor__toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    white-space: nowrap;
}

[b-exdh15lhbv] .fp-editor__toggle input {
    cursor: pointer;
    accent-color: var(--pcs-atoll);
}

.fp-editor__body[b-exdh15lhbv] {
    display: flex;
    flex: 1;
    min-height: 0;
}

.fp-editor__canvas[b-exdh15lhbv] {
    flex: 1;
    min-width: 0;
    position: relative;
    /* Fixed viewport: it clips; pan/zoom happens by transforming the scene
       inside it (JS, GPU-composited) — never by resizing or scrolling. */
    overflow: hidden;
    /* Clip the scene's painting to the canvas. Without this, the transformed
       scene's compositing layer can desync from the modal and paint over the
       app shell behind it. */
    contain: paint;
    cursor: var(--pcs-cursor-grab);
    /* No text/image selection or native drag — those hijack the pan gesture
       (the browser starts a native image drag and shows the no-drop cursor). */
    user-select: none;
    -webkit-user-select: none;
    background: var(--pcs-off-white);
    /* Subtle checkerboard so plan margins read as canvas. */
    background-image:
        linear-gradient(45deg, var(--pcs-light-grey-3) 25%, transparent 25%),
        linear-gradient(-45deg, var(--pcs-light-grey-3) 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, var(--pcs-light-grey-3) 75%),
        linear-gradient(-45deg, transparent 75%, var(--pcs-light-grey-3) 75%);
    background-size: 20px 20px;
    background-position: 0 0, 0 10px, 10px -10px, -10px 0;
}

.fp-editor__canvas:active[b-exdh15lhbv] {
    cursor: var(--pcs-cursor-grabbing);
}

/* Pan/zoom target for the SVG overlay (the plan raster is canvas-drawn, see
   .fp-editor__plan). JS owns `transform`. will-change keeps the overlay on its
   own compositor layer so a transform tick never repaints (profiled: without
   it, every pan/zoom tick repainted a viewport-sized region). This was harmful
   only while the layer carried the ~90 MP <img> — as sparse vectors it
   rasterizes in ~1 ms. */
.fp-editor__scene[b-exdh15lhbv] {
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(0.08);
    transform-origin: 0 0;
    will-change: transform;
}

/* Viewport-sized plan raster, drawn by JS from ImageBitmaps (fetched once,
   GPU-resident). Sits under the transformed scene, which carries the SVG
   overlay; all interaction happens on the container/SVG, never on the canvas. */
.fp-editor__plan[b-exdh15lhbv] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.fp-editor__overlay[b-exdh15lhbv] {
    position: absolute;
    top: 0;
    left: 0;
    /* Empty areas pass pointer events through to the canvas (for pan); only the
       room polygons are interactive. */
    pointer-events: none;
}

/* The fill/stroke colour is set inline per room (auto palette or custom), so
   CSS only owns the opacity + stroke width. */
.fp-room[b-exdh15lhbv] {
    fill-opacity: 0.18;
    stroke-width: 2;
    cursor: pointer;
    pointer-events: auto;
    /* No transition on fill-opacity, deliberately: Blink repaints the whole
       image-sized SVG layer for any change inside it, so animating a large
       room's opacity means ~15 consecutive full-layer repaints — a visible
       raster-storm flicker on rooms that span much of the plan. One instant
       repaint is cheap; fifteen are not. */
    /* Stroke width stays visually constant regardless of zoom. */
    vector-effect: non-scaling-stroke;
}

.fp-room:hover[b-exdh15lhbv] {
    fill-opacity: 0.30;
}

.fp-room.is-selected[b-exdh15lhbv] {
    fill-opacity: 0.40;
    stroke-width: 3;
    cursor: move;
}

/* Room name labels (.fp-room-label) are real SVG <text> built via the render
   tree, which doesn't receive this component's scoped-CSS attribute — their
   style lives in the global app.css instead.

   Draw preview + edit handles are JS-created and styled inline (Blazor scoped
   CSS can't reach them). */
.fp-editor__canvas.is-drawing[b-exdh15lhbv],
.fp-editor__canvas.is-ruler[b-exdh15lhbv] {
    cursor: crosshair;
}

/* While a crop/erase is committing, freeze the canvas so the rectangle can't be
   moved/resized after the user pressed Crop/Erase. */
.fp-editor__canvas.is-busy[b-exdh15lhbv] {
    pointer-events: none;
}

.fp-editor__inspector[b-exdh15lhbv] {
    width: 260px;
    flex-shrink: 0;
    border-left: 1px solid var(--pcs-border);
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.fp-editor__context[b-exdh15lhbv] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: var(--pcs-sp-20);
}

/* ── Primitives shared by the inspector's child panels (Editor/) ──────────
   They render inside this component, so ::deep reaches them; each panel's own
   scoped css carries only its panel-specific rules. */

.fp-editor[b-exdh15lhbv]  .fp-editor__hint {
    margin: 0;
    font: normal normal 400 13px/19px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* Tool panels stack their hint/inputs/actions vertically (no top toolbar →
   no canvas shift when a tool opens). */
.fp-editor[b-exdh15lhbv]  .fp-editor__draw-panel {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
}

.fp-editor[b-exdh15lhbv]  .fp-editor__draw-hint {
    margin: 0;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.fp-editor[b-exdh15lhbv]  .fp-editor__field-label {
    display: block;
    margin-bottom: 6px;
    font: normal normal 500 12px/16px var(--pcs-font-ui);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--pcs-mid-grey);
}

/* Base look comes from the shared .pcs-input rules (app.css). */
.fp-editor[b-exdh15lhbv]  .fp-editor__name-input {
    flex: 1;
    min-width: 0;
}

.fp-editor[b-exdh15lhbv]  .fp-editor__scale-current {
    margin: 0 0 var(--pcs-sp-10);
    font: normal normal 500 13px/18px var(--pcs-font-ui);
    color: var(--pcs-atoll);
}

/* PcsNumberField owns the label and the control; these only say the boxes share
   the row. ::deep because the class lands on the field's own root. Shared by the
   draw and room-details panels, which both render inside .fp-editor. */
.fp-editor[b-exdh15lhbv]  .fp-editor__dims {
    display: flex;
    align-items: flex-end;
    gap: 6px;
}

.fp-editor[b-exdh15lhbv]  .fp-editor__dim {
    flex: 1;
    min-width: 0;
}

.fp-editor[b-exdh15lhbv]  .fp-editor__dim-times,
.fp-editor[b-exdh15lhbv]  .fp-editor__dim-unit {
    padding-bottom: 8px;
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}
/* /Features/Floorplans/FloorplanLocationDialog.razor.rz.scp.css */
.fp-location[b-3z7k9hmnya] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-12);
    min-width: 360px;
}

.fp-location__current[b-3z7k9hmnya] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 8px 12px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-light-grey-3);
}

.fp-location__current-label[b-3z7k9hmnya] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.fp-location__current-value[b-3z7k9hmnya] {
    font: normal normal 600 14px/18px var(--pcs-font-mono, var(--pcs-font-ui));
    color: var(--pcs-charcoal);
}

.fp-location__hint[b-3z7k9hmnya] {
    margin: -6px 0 0;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.fp-location__alert[b-3z7k9hmnya] {
    margin-top: 4px;
}
/* /Features/Floorplans/FloorplansView.razor.rz.scp.css */
.floorplans[b-rp6qehfxne] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-20);
    padding: var(--pcs-sp-24);
    height: 100%;
    overflow: auto;
}

.floorplans__toolbar[b-rp6qehfxne] {
    display: flex;
    justify-content: flex-end;
}

.floorplans__grid[b-rp6qehfxne] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--pcs-sp-20);
}

/* ::deep — the img is rendered by the ApiImage child component. */
.floorplans__grid[b-rp6qehfxne]  .floorplans__img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}
/* /Features/Floorplans/FloorplanUploadDialog.razor.rz.scp.css */
/* Upload form content — hosted inside the modal PcsDialog shell (which supplies
   the card chrome + padding). Field, error and buttons are design-system
   components; only the drop-zone is bespoke. */
.upload[b-has0zbfg7z] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
}

/* Click-or-drop file picker — the native file input is stretched invisibly over
   the styled box so both clicking and dropping land on it. */
.upload__dropzone[b-has0zbfg7z] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: calc(130px + 40px + 4px);
    padding: 20px;
    text-align: center;
    border: 2px dashed var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-off-white);
    color: var(--pcs-mid-grey);
    cursor: pointer;
    transition: border-color var(--pcs-transition), background-color var(--pcs-transition);
}

.upload__dropzone:hover[b-has0zbfg7z] {
    border-color: var(--pcs-atoll);
    background: var(--pcs-light-grey-3);
}

.upload__dropzone.is-disabled[b-has0zbfg7z] {
    opacity: 0.6;
    pointer-events: none;
}

/* ::deep — the file input is rendered by the InputFile child component, so the
   parent's scoped attribute never reaches it; ::deep pierces that boundary. The
   native input is stretched invisibly over the whole drop-zone. */
.upload__dropzone[b-has0zbfg7z]  input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

[b-has0zbfg7z] .upload__dropzone-icon {
    color: var(--pcs-atoll);
}

.upload__dropzone-text[b-has0zbfg7z] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    word-break: break-word;
}

/* The stack's gap provides the spacing — cancel the alert's own margin. */
.upload[b-has0zbfg7z]  .upload__alert {
    margin: 0;
}

.upload__actions[b-has0zbfg7z] {
    display: flex;
    gap: 8px;
}
/* /Features/Home/HomePage.razor.rz.scp.css */
/* ─── Page scaffold ─────────────────────────────────────────────── */
.dashboard[b-t5qozx6d8z] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    background: var(--pcs-white);
    padding: 28px 36px 48px;
}

.dashboard__heading[b-t5qozx6d8z] {
    margin: 0 0 18px;
    font: normal normal 600 22px/28px var(--pcs-font-display);
    color: var(--pcs-charcoal);
}

.dashboard__subheading[b-t5qozx6d8z] {
    margin: 40px 0 16px;
    font: normal normal 600 18px/24px var(--pcs-font-display);
    color: var(--pcs-charcoal);
}

/* The guided rail action sits under the plain one. */
.new-project__wizard[b-t5qozx6d8z] {
    margin-top: 8px;
}

/* ─── Template cards ────────────────────────────────────────────── */
.template-grid[b-t5qozx6d8z] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 220px));
    gap: 20px;
}

[b-t5qozx6d8z] .template-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    text-align: left;
}

.template-card__thumb[b-t5qozx6d8z] {
    height: calc(110px + 2px);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-light-grey-3);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color var(--pcs-transition), border-color var(--pcs-transition);
}

[b-t5qozx6d8z] .template-card:hover .template-card__thumb {
    background: var(--pcs-white);
    border-color: var(--pcs-mid-grey);
}

.template-card__plus[b-t5qozx6d8z] {
    opacity: 0.5;
}

.template-card__label[b-t5qozx6d8z] {
    margin-top: 8px;
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.template-card__sub[b-t5qozx6d8z] {
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    color: var(--pcs-mid-grey);
}

/* ─── Projects toolbar ──────────────────────────────────────────── */
.projects-toolbar[b-t5qozx6d8z] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 8px;
}

.projects-toolbar__right[b-t5qozx6d8z] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ─── Search box (ADR-0026) ─────────────────────────────────────── */
/* Base look comes from the shared .pcs-input rules (app.css). */
[b-t5qozx6d8z] .projects-search {
    min-width: 220px;
}

/* ─── Projects table (list view) ────────────────────────────────── */
.projects-table[b-t5qozx6d8z] {
    border-top: 1px solid var(--pcs-border);
}

.projects-table__head[b-t5qozx6d8z],
.projects-row[b-t5qozx6d8z] {
    display: grid;
    grid-template-columns: minmax(0, 2.4fr) 1.4fr 1fr 1fr 1.4fr 72px;
    align-items: center;
    gap: 12px;
    padding: 0 8px;
}

/* No project on the page names a customer — the tenant hides the field, or has not
   filled it in — so the column is left out rather than drawn empty. */
.projects-table--no-customer .projects-table__head[b-t5qozx6d8z],
.projects-table--no-customer .projects-row[b-t5qozx6d8z] {
    grid-template-columns: minmax(0, 2.4fr) 1fr 1fr 1.4fr 72px;
}

.projects-table__head[b-t5qozx6d8z] {
    height: 40px;
    border-bottom: 1px solid var(--pcs-border);
}

.projects-table__head[b-t5qozx6d8z]  .projects-col {
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

/* Sortable header cells are buttons — strip the native chrome and add a
   click affordance + the active-sort caret. */
[b-t5qozx6d8z] .projects-sort {
    display: flex;
    align-items: center;
    gap: 6px;
}

[b-t5qozx6d8z] .projects-sort:hover {
    color: var(--pcs-charcoal);
}

.projects-sort__icon[b-t5qozx6d8z] {
    font-size: 9px;
    line-height: 1;
    color: var(--pcs-charcoal);
}

.projects-row[b-t5qozx6d8z] {
    height: 56px;
    border-bottom: 1px solid var(--pcs-light-grey-2);
    cursor: pointer;
    font-family: var(--pcs-font-ui);
    font-size: 13px;
    color: var(--pcs-charcoal);
    transition: background-color var(--pcs-transition);
}

.projects-row:hover[b-t5qozx6d8z] {
    background: var(--pcs-light-grey-3);
}

[b-t5qozx6d8z] .projects-col {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-t5qozx6d8z] .projects-col--name {
    display: flex;
    align-items: center;
    gap: 10px;
}

.projects-row__doc[b-t5qozx6d8z] {
    flex-shrink: 0;
}

.projects-row__name[b-t5qozx6d8z] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.projects-col--modified[b-t5qozx6d8z],
.projects-col--customer[b-t5qozx6d8z],
[b-t5qozx6d8z] .projects-col--created {
    color: var(--pcs-medium-grey);
}

[b-t5qozx6d8z] .projects-col--owner {
    display: flex;
    align-items: center;
    gap: 8px;
}

.owner-avatar[b-t5qozx6d8z] {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    border-radius: var(--pcs-radius-pill);
    background: var(--pcs-light-grey-2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.owner-name[b-t5qozx6d8z] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.projects-col--actions[b-t5qozx6d8z] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
}

/* ─── Row icon buttons (star + overflow) ────────────────────────── */
/* Star: outline by default (PcsSvgIcon bakes fill:none), gold fill when
   starred. The svg renders inside PcsSvgIcon, outside this component's
   CSS scope — hence ::deep. */
[b-t5qozx6d8z] .row-star.is-starred {
    color: #E8A23D;
}

[b-t5qozx6d8z] .row-star.is-starred path {
    fill: currentColor;
}

/* ─── Projects grid (grid view) ─────────────────────────────────── */
.projects-grid[b-t5qozx6d8z] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 18px;
}

/* ─── Pager (server-side offset paging, ADR-0026) ───────────────── */
.projects-pager[b-t5qozx6d8z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 16px;
}

.projects-pager__info[b-t5qozx6d8z] {
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-mid-grey);
}

.projects-pager__controls[b-t5qozx6d8z] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* /Features/PageFrames/FrameBlockEditDialog.razor.rz.scp.css */
/* The editor needs room: the dialog's body is the editor, at most of the
   window. Layout only — the dialog shell draws the card. */
.block-edit[b-cb4an73vsi] {
    display: flex;
    width: min(1200px, 86vw);
    height: min(760px, 78vh);
}
/* /Features/PageFrames/FrameBlockPreview.razor.rz.scp.css */
.block-preview[b-07jcc9zal6] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.block-preview[b-07jcc9zal6]  svg {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}
/* /Features/PageFrames/FrameCellCard.razor.rz.scp.css */
/* The card: 372 px — wide enough for its four commands on one row (Insert ▾,
   Merge, Split ▾, Delete ▾ at Small; 350 px wrapped Delete) — padding
   10/12/14/14, menu shadow. */
.cell-card[b-ty4t53p9p8] {
    width: 372px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 10px 12px 14px 14px;
    background: var(--pcs-white);
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    font-family: var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.cell-card__head[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    gap: 2px;
    min-height: 32px;
    margin: -6px -4px 0 -10px;
}

/* What the card is dragged by: the grip, the heading and the space beside them. */
.cell-card__head [data-pcs-float-grip][b-ty4t53p9p8] {
    cursor: var(--pcs-cursor-grab);
    user-select: none;
}

.cell-card__grip[b-ty4t53p9p8] {
    display: inline-flex;
    align-self: stretch;
    align-items: center;
    padding: 0 2px;
    color: var(--pcs-fg-1);
}

.cell-card__heading[b-ty4t53p9p8] {
    padding: 0 4px;
    font: 600 12px/16px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cell-card__commands[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 6px;
    padding-bottom: 12px;
    border-bottom: var(--pcs-hairline) solid var(--pcs-light-grey-2);
}

.cell-card__spacer[b-ty4t53p9p8] {
    flex: 1;
}

.cell-card__repeat[b-ty4t53p9p8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: -4px;
    padding: 10px 12px;
    background: var(--pcs-bg-2);
    border-radius: var(--pcs-radius-sm);
}

.cell-card__repeat-label[b-ty4t53p9p8] {
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
}

.cell-card__row[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cell-card__row[b-ty4t53p9p8]  .cell-card__text {
    flex: 1;
    min-width: 0;
}

.cell-card[b-ty4t53p9p8]  .cell-card__height {
    flex: none;
    width: 92px;
}

.cell-card[b-ty4t53p9p8]  .cell-card__count {
    flex: none;
    width: 96px;
}

.cell-card[b-ty4t53p9p8]  .cell-card__format {
    min-width: 0;
}

.cell-card[b-ty4t53p9p8]  .cell-card__digits {
    width: 64px;
}

.cell-card__section[b-ty4t53p9p8] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cell-card__section-head[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 24px;
}

.cell-card__line[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 24px;
}

.cell-card__line-controls[b-ty4t53p9p8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.cell-card__help[b-ty4t53p9p8],
.cell-card__note[b-ty4t53p9p8] {
    margin: 0;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}

/* Equal columns for the labelled fields; the anchor picker keeps its own width. */
.cell-card__heights[b-ty4t53p9p8] {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    align-items: end;
    gap: 8px;
}

.cell-card__heights--anchor[b-ty4t53p9p8] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
}

.cell-card__image[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cell-card__thumb[b-ty4t53p9p8] {
    flex: none;
    width: 46px;
    height: var(--pcs-control-h-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-bg-2);
}

.cell-card__image-name[b-ty4t53p9p8] {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 13px;
}

.cell-card__retype[b-ty4t53p9p8] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    background: var(--pcs-bg-2);
    border-radius: var(--pcs-radius-sm);
    font-size: 12px;
    line-height: 17px;
}

.cell-card__retype-actions[b-ty4t53p9p8] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* The suggestion list hangs under the caption field, over what follows. */
.cell-card__suggestions[b-ty4t53p9p8] {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% - 4px);
    z-index: 3;
    display: flex;
    flex-direction: column;
    padding: 6px 0;
    background: var(--pcs-white);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
}

.cell-card__suggestions-head[b-ty4t53p9p8] {
    padding: 4px 16px 6px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
}

.cell-card__suggestions[b-ty4t53p9p8]  .cell-card__suggestion {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 7px 16px;
    text-align: left;
}

.cell-card__suggestions[b-ty4t53p9p8]  .cell-card__suggestion:hover {
    background: var(--pcs-light-grey-3);
}

.cell-card__suggestion-words[b-ty4t53p9p8] {
    font-size: 13px;
}

.cell-card__suggestion-meta[b-ty4t53p9p8] {
    font-size: 11px;
    color: var(--pcs-fg-3);
}

.cell-card__suggestions-foot[b-ty4t53p9p8] {
    margin-top: 4px;
    padding: 6px 16px 2px;
    border-top: var(--pcs-hairline) solid var(--pcs-border-soft);
    font-size: 11px;
    color: var(--pcs-fg-3);
}

.cell-card__link[b-ty4t53p9p8] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cell-card__link[b-ty4t53p9p8]  .cell-card__link-field {
    flex: 1;
    max-width: none;
}
/* /Features/PageFrames/FrameDeleteBlockedDialog.razor.rz.scp.css */
.delete-blocked__lead[b-ykme4hgcpy] {
    margin: 0 0 12px;
}

.delete-blocked__list[b-ykme4hgcpy] {
    margin: 0;
    padding: 0;
    list-style: none;
    max-height: 240px;
    overflow-y: auto;
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
}

.delete-blocked__row[b-ykme4hgcpy] {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 12px;
}

.delete-blocked__row + .delete-blocked__row[b-ykme4hgcpy] {
    border-top: var(--pcs-hairline) solid var(--pcs-border);
}

.delete-blocked__name[b-ykme4hgcpy] {
    min-width: 0;
    overflow-wrap: anywhere;
}

.delete-blocked__count[b-ykme4hgcpy] {
    flex: none;
    color: var(--pcs-fg-3);
}
/* /Features/PageFrames/FrameEditor.razor.rz.scp.css */
.fe-view[b-zo7oz6n711] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 480px;
    flex: 1;
    min-width: 0;
}

.fe-view__toolbar[b-zo7oz6n711] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
    flex-wrap: wrap;
}

.fe-view__name[b-zo7oz6n711],
[b-zo7oz6n711] .fe-view__name {
    font-weight: 700;
    margin-right: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 320px;
}

/* Clickable-to-rename reads as clickable: a wash on hover, not a button's
   box — the toolbar already has enough chrome. */
[b-zo7oz6n711] .fe-view__name--editable {
    border-radius: var(--pcs-radius-xs);
    padding: 2px 4px;
    margin-left: -4px;
}

[b-zo7oz6n711] .fe-view__name--editable:hover,
[b-zo7oz6n711] .fe-view__name--editable:focus-visible {
    background: var(--pcs-light-grey-3);
}

[b-zo7oz6n711] .fe-view__name-input {
    font-weight: 700;
    max-width: 320px;
}

.fe-view__sep[b-zo7oz6n711] {
    width: var(--pcs-hairline);
    align-self: stretch;
    background: var(--pcs-border);
    margin: 0 4px;
}

.fe-view__spacer[b-zo7oz6n711] {
    flex: 1;
}

.fe-view__unsaved[b-zo7oz6n711] {
    font-size: 12px;
    color: var(--pcs-fg-3);
    white-space: nowrap;
}

.fe-view__notice[b-zo7oz6n711] {
    margin: 0;
    padding: 6px 12px;
    font-size: 12px;
    color: var(--pcs-fg-2);
    background: var(--pcs-bg-2);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
}

.fe-view__body[b-zo7oz6n711] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
}

.fe-view__surface[b-zo7oz6n711] {
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
    background: var(--pcs-bg-canvas);
}

/* The card rides the canvas: JS sets left/top in its render loop (pcs.cadViewPin). */
.fe-view__card[b-zo7oz6n711] {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
}

/* The sheet's own text box: exactly over the slot being typed in, font sized
   to the slot at the live zoom (both by JS). Transparent ground, so the cell
   under it still reads; the field's own chrome is dropped to a caret line. */
.fe-view__sheet-input[b-zo7oz6n711] {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    display: flex;
}

.fe-view__sheet-input[b-zo7oz6n711]  .fe-view__sheet-field {
    flex: 1;
    min-width: 0;
    height: 100%;
}

.fe-view__coords[b-zo7oz6n711] {
    /* mm readouts jitter per pixel — a fixed slot keeps neighbours still. */
    min-inline-size: 11rem;
    font-variant-numeric: tabular-nums;
}

/* ── Blocks panel ─────────────────────────────────────────── */

.fe-blocks__context[b-zo7oz6n711] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 10px;
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-bg-2);
}

.fe-blocks__context-title[b-zo7oz6n711] {
    font: 600 12px/16px var(--pcs-font-ui);
}

.fe-blocks__context-hint[b-zo7oz6n711] {
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-fg-3);
}

.fe-blocks__head[b-zo7oz6n711] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    margin-top: 6px;
}

.fe-blocks__head-meta[b-zo7oz6n711] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--pcs-fg-3);
}

.fe-blocks__grid[b-zo7oz6n711] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.fe-blocks__list[b-zo7oz6n711] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fe-block-slot[b-zo7oz6n711] {
    display: flex;
    min-width: 0;
}

.fe-blocks__grid[b-zo7oz6n711]  .fe-block,
.fe-blocks__list[b-zo7oz6n711]  .fe-block {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 6px;
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-white);
    text-align: left;
    cursor: var(--pcs-cursor-grab);
}

.fe-blocks__grid[b-zo7oz6n711]  .fe-block:hover,
.fe-blocks__list[b-zo7oz6n711]  .fe-block:hover {
    border-color: var(--pcs-blue-mid);
    background: var(--pcs-light-grey-3);
}

/* A piece that cannot go where a click would put it: dimmed, still draggable onto the sheet. */
.fe-blocks__grid[b-zo7oz6n711]  .fe-block.is-dimmed,
.fe-blocks__list[b-zo7oz6n711]  .fe-block.is-dimmed {
    opacity: 0.45;
}

.fe-view__body[b-zo7oz6n711]  .fe-block__preview {
    height: 34px;
}

.fe-blocks__list[b-zo7oz6n711]  .fe-block__preview {
    height: 40px;
}

.fe-block__text[b-zo7oz6n711] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    min-width: 0;
}

.fe-block__name[b-zo7oz6n711] {
    min-width: 0;
    font: 500 11px/15px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
    overflow-wrap: anywhere;
}

.fe-block__meta[b-zo7oz6n711] {
    flex: none;
    font-size: 10px;
    color: var(--pcs-fg-3);
}

.fe-blocks__empty[b-zo7oz6n711],
.fe-blocks__foot[b-zo7oz6n711] {
    margin: 0;
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-fg-3);
}

.fe-blocks__foot[b-zo7oz6n711] {
    margin-top: 6px;
}

/* ── Frame panel ──────────────────────────────────────── */

.fe-frame__stack[b-zo7oz6n711] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fe-frame__row[b-zo7oz6n711] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.fe-frame__row--start[b-zo7oz6n711] {
    justify-content: flex-start;
}

.fe-frame__pair[b-zo7oz6n711] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}

.fe-frame__pair--end[b-zo7oz6n711] {
    align-items: end;
}

.fe-frame__sides[b-zo7oz6n711] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 8px;
}

.fe-frame__result[b-zo7oz6n711] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-top: 8px;
    border-top: var(--pcs-hairline) solid var(--pcs-border-soft);
}

.fe-frame__result-size[b-zo7oz6n711] {
    font: 600 12px/16px var(--pcs-font-ui);
}

.fe-frame__help[b-zo7oz6n711] {
    margin: 0;
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-fg-3);
}

.fe-frame__stack[b-zo7oz6n711]  .fe-frame__footer {
    width: 72px;
}

/* ── The floating bar's content ────────────────────────────── */

.fe-bar__name[b-zo7oz6n711] {
    font-weight: 600;
    white-space: nowrap;
}

.fe-bar__changed[b-zo7oz6n711] {
    font-weight: 400;
}

.fe-bar__sep[b-zo7oz6n711] {
    flex: none;
    width: var(--pcs-hairline);
    height: 22px;
    background: var(--pcs-border);
    margin: 0 4px;
}

.fe-view__surface[b-zo7oz6n711]  .fe-bar__height {
    flex: none;
    width: 92px;
}

.fe-bar__field[b-zo7oz6n711] {
    display: inline-flex;
    width: 200px;
}

.fe-bar__pop[b-zo7oz6n711],
.fe-bar__size[b-zo7oz6n711] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 220px;
}

.fe-bar__size[b-zo7oz6n711] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
/* /Features/PageFrames/FrameImageUploadDialog.razor.rz.scp.css */
/* Upload form content — hosted inside the modal PcsDialog shell (which supplies
   the card chrome + padding). Error and buttons are design-system components;
   only the drop-zone is bespoke, mirroring FloorplanUploadDialog. */
.frame-image[b-1i0h1ubbyg] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
}

/* Click-or-drop file picker — the native file input is stretched invisibly over
   the styled box so both clicking and dropping land on it. */
.frame-image__dropzone[b-1i0h1ubbyg] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: calc(130px + 40px + 4px);
    padding: 20px;
    text-align: center;
    border: 2px dashed var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-off-white);
    color: var(--pcs-mid-grey);
    cursor: pointer;
    transition: border-color var(--pcs-transition), background-color var(--pcs-transition);
}

.frame-image__dropzone:hover[b-1i0h1ubbyg] {
    border-color: var(--pcs-atoll);
    background: var(--pcs-light-grey-3);
}

.frame-image__dropzone.is-disabled[b-1i0h1ubbyg] {
    opacity: 0.6;
    pointer-events: none;
}

/* ::deep — the file input is rendered by the InputFile child component, so the
   parent's scoped attribute never reaches it; ::deep pierces that boundary. */
.frame-image__dropzone[b-1i0h1ubbyg]  input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

[b-1i0h1ubbyg] .frame-image__dropzone-icon {
    color: var(--pcs-atoll);
}

.frame-image__dropzone-text[b-1i0h1ubbyg] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    word-break: break-word;
}

/* The stack's gap provides the spacing — cancel the alert's own margin. */
.frame-image[b-1i0h1ubbyg]  .frame-image__alert {
    margin: 0;
}

.frame-image__actions[b-1i0h1ubbyg] {
    display: flex;
    gap: 8px;
}
/* /Features/PageFrames/FrameManageBlocksDialog.razor.rz.scp.css */
.manage-blocks__list[b-8lfbbivgjf] {
    display: flex;
    flex-direction: column;
    border: var(--pcs-hairline) solid var(--pcs-border-soft);
    border-radius: var(--pcs-radius-sm);
}

.manage-blocks__row[b-8lfbbivgjf] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
}

.manage-blocks__row + .manage-blocks__row[b-8lfbbivgjf] {
    border-top: var(--pcs-hairline) solid var(--pcs-border-soft);
}

.manage-blocks__row[b-8lfbbivgjf]  .manage-blocks__preview {
    flex: none;
    width: 96px;
    height: 32px;
}

.manage-blocks__text[b-8lfbbivgjf] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.manage-blocks__name[b-8lfbbivgjf] {
    font-weight: 600;
    font-size: 13px;
}

.manage-blocks__meta[b-8lfbbivgjf] {
    font-size: 11px;
    color: var(--pcs-fg-3);
}

.manage-blocks__note[b-8lfbbivgjf] {
    margin: 10px 0 0;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}
/* /Features/PageFrames/FrameSaveBlockDialog.razor.rz.scp.css */
.save-block__preview[b-yv2c5ifohf] {
    display: flex;
    justify-content: center;
    height: 72px;
    margin-bottom: 14px;
    padding: 8px;
    border: var(--pcs-hairline) solid var(--pcs-border-soft);
    border-radius: var(--pcs-radius-sm);
}

.save-block__note[b-yv2c5ifohf] {
    margin: 8px 0 0;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}
/* /Features/PageFrames/FrameTermDialog.razor.rz.scp.css */
.term-dialog__head[b-pa7gikv1id] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.term-dialog__words[b-pa7gikv1id] {
    font: 600 15px/20px var(--pcs-font-ui);
}

.term-dialog__spacer[b-pa7gikv1id] {
    flex: 1;
}

.term-dialog__used[b-pa7gikv1id] {
    font-size: 12px;
    color: var(--pcs-fg-3);
}

.term-dialog__section[b-pa7gikv1id] {
    display: block;
    margin: 14px 0 8px;
}

/* Language · field · aside: a grid so the fields line up whatever the
   language names are called — Danish ones run longer. */
.term-dialog__rows[b-pa7gikv1id] {
    display: grid;
    grid-template-columns: minmax(80px, auto) minmax(0, 1fr) minmax(0, auto);
    align-items: center;
    gap: 8px 12px;
    margin-bottom: 12px;
}

.term-dialog__language[b-pa7gikv1id] {
    font-size: 13px;
}

.term-dialog__aside[b-pa7gikv1id] {
    display: inline-flex;
    justify-content: flex-start;
}
/* /Features/PageFrames/FrameTermRetypeDialog.razor.rz.scp.css */
.term-retype__question[b-a4mt4h2ql5] {
    margin: 0 0 14px;
}

.term-retype__choices[b-a4mt4h2ql5] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.term-retype__choice[b-a4mt4h2ql5] {
    padding: 12px 14px;
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
}

.term-retype__choice.is-chosen[b-a4mt4h2ql5] {
    border-color: var(--pcs-atoll);
    background: var(--pcs-bg-2);
}

.term-retype__title[b-a4mt4h2ql5] {
    display: block;
    font-weight: 600;
}

.term-retype__detail[b-a4mt4h2ql5] {
    display: block;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}
/* /Features/PageFrames/NewPageFrameDialog.razor.rz.scp.css */
.new-frame__form[b-5kvtc54ra0] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 420px;
}

.new-frame__row[b-5kvtc54ra0] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
    align-items: end;
}

.new-frame__warning[b-5kvtc54ra0] {
    margin: 0;
    font-size: 12px;
    color: var(--pcs-fg-2);
}
/* /Features/PageFrames/PageFramesView.razor.rz.scp.css */
.pf-lib[b-bmhu0iy02i] {
    display: flex;
    flex-direction: column;
    min-height: 320px;
    /* Both, deliberately: height:100% is what the settings dialog's body gives
       it, and flex:1 is what keeps it filling a column whose height is not
       definite. The inner scroller needs one of them to resolve or the grid
       clips instead of scrolling. */
    height: 100%;
    flex: 1 1 auto;
    /* The view itself does not scroll — .pf-lib__scroll does, so the default
       frame row and the toolbar stay put above the cards. */
    overflow: hidden;
}

/* PcsSettingsRow draws the row; this only closes it off from the toolbar
   below, which the primitive cannot know about (it borders between adjacent
   rows, and this one has no neighbour). */
.pf-lib__default[b-bmhu0iy02i] {
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
}

/* 300 px. */
[b-bmhu0iy02i] .pf-lib__default-field {
    inline-size: 300px;
    max-inline-size: 100%;
}

.pf-lib__bar[b-bmhu0iy02i] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 14px 32px;
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
}

[b-bmhu0iy02i] .pf-lib__search {
    inline-size: 260px;
    max-inline-size: 100%;
}

.pf-lib__size[b-bmhu0iy02i] {
    inline-size: 200px;
}

.pf-lib__spacer[b-bmhu0iy02i] {
    flex: 1;
}

/* The only scroller. overflow-y: scroll rather than auto on purpose: a gutter
   that appears the moment the grid outgrows the fold takes a scrollbar's width
   out of the row, which re-flows the cards and shifts everything sideways. */
.pf-lib__scroll[b-bmhu0iy02i] {
    flex: 1;
    min-height: 0;
    overflow-y: scroll;
    padding: 0 32px 28px;
}

.pf-lib__section + .pf-lib__section[b-bmhu0iy02i] {
    margin-top: 8px;
    border-top: var(--pcs-hairline) solid var(--pcs-border);
}

.pf-lib__section-title[b-bmhu0iy02i] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 18px 0 12px;
    font: 600 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.pf-lib__section-meta[b-bmhu0iy02i] {
    font-weight: 400;
    font-size: 12px;
    color: var(--pcs-fg-3);
}

.pf-lib__note[b-bmhu0iy02i] {
    margin: -6px 0 12px;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}

/* Four columns, 16 px gap, a 150 px preview. Narrower dialogs drop columns. */
.pf-lib__grid[b-bmhu0iy02i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 16px;
}

.pf-lib__list[b-bmhu0iy02i] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
/* /Features/PageFrames/TextSourceChip.razor.rz.scp.css */
/* Layout and the state dot. The chip itself is PcsChip; the dot is the state,
   in the redesign's three inks: atoll for linked, orange for a gap or a
   change, a hollow ring for plain words. */
.text-source[b-9b6fkkpcah]  .text-source__chip {
    gap: 6px;
    padding: 0 8px;
}

.text-source[b-9b6fkkpcah]  .text-source__dot {
    flex: none;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    border: 1.5px solid var(--pcs-mid-grey);
    background: transparent;
}

.text-source[b-9b6fkkpcah]  .text-source__chip--term .text-source__dot {
    border-color: var(--pcs-atoll);
    background: var(--pcs-atoll);
}

.text-source[b-9b6fkkpcah]  .text-source__chip--missing .text-source__dot,
.text-source[b-9b6fkkpcah]  .text-source__chip--changed .text-source__dot {
    border-color: var(--pcs-warning);
    background: var(--pcs-warning);
}

.text-source[b-9b6fkkpcah]  .text-source__chip--shipped .text-source__dot {
    border-color: var(--pcs-atoll);
}

.text-source[b-9b6fkkpcah]  .text-source__chip--reworded .text-source__dot {
    border-color: var(--pcs-warning);
}

.text-source[b-9b6fkkpcah]  .text-source__chip--term,
.text-source[b-9b6fkkpcah]  .text-source__chip--shipped {
    border-color: var(--pcs-blue-mid);
}

.text-source[b-9b6fkkpcah]  .text-source__chip--changed {
    border-color: var(--pcs-warning);
}

/* /Features/Pages/DeleteCableDialog.razor.rz.scp.css */
/* Layout only — PcsCheckbox owns the box, the gap and the label type. */
.delete-cable__remember[b-xihltmo3ed] {
    margin-top: var(--pcs-sp-10);
}
/* /Features/Pages/DeleteDeviceDialog.razor.rz.scp.css */
/* Layout only — PcsCheckbox owns the box, the gap and the label type. */
.delete-device__remember[b-xr9z1mma2q] {
    margin-top: var(--pcs-sp-10);
}
/* /Features/Pages/LayersPanel.razor.rz.scp.css */
.layers-panel[b-whtr9mhr7v] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 15px;
    font-size: 0.85rem;
}

.layers-panel__list[b-whtr9mhr7v] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.layers-panel__list li[b-whtr9mhr7v] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 4px;
    border-radius: 4px;
}

.layers-panel__row--active[b-whtr9mhr7v] {
    background: var(--pcs-surface-hover, rgba(0, 0, 0, 0.05));
}

.layers-panel__row--active[b-whtr9mhr7v]  .layers-panel__name {
    font-weight: 600;
}

[b-whtr9mhr7v] .layers-panel__name {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    cursor: pointer;
}

.layers-panel__actions[b-whtr9mhr7v] {
    align-self: flex-start;
    white-space: nowrap;
}
/* /Features/Pages/PageEditorPane.razor.rz.scp.css */
.page-pane[b-6r6hedkpbl] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.page-pane__surface[b-6r6hedkpbl] {
    flex: 1;
    min-height: 0;
    position: relative;
    /* The ground the page sheet sits on — white, matching the sheet the JS
       draws on top (border + shadow keep the paper metaphor readable), so a
       tab switch doesn't flash grey while the incoming pane loads and paints. */
    background: #fff;
}

.page-pane__coords[b-6r6hedkpbl] {
    /* mm readouts jitter per pixel — a fixed slot keeps neighbours still. */
    min-inline-size: 11rem;
    font-variant-numeric: tabular-nums;
}

.page-pane__hint[b-6r6hedkpbl] {
    /* The prompt is the widest thing in the strip and grows/shrinks per tool
       state; a fixed slot stops the readouts to its right from shuffling. */
    min-inline-size: 9rem;
}

.page-pane__conflict[b-6r6hedkpbl] {
    color: #c33;
}

.page-pane__retrying[b-6r6hedkpbl] {
    color: #b5651d;
    font-weight: 600;
}

[b-6r6hedkpbl] .page-pane__rooms-toggle {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}

/* F-011 C17: the snap readout is emphasised whenever the live step is not the
   normal one (a held Alt, or snapping off) — B13's rule as a theme token
   instead of its literal red background. */
.page-pane__snap--alt[b-6r6hedkpbl] {
    color: var(--pcs-color-accent, #0a7d33);
    font-weight: 600;
}

.page-pane__snap-kind[b-6r6hedkpbl] {
    color: var(--pcs-color-accent, #0a7d33);
}

/* The armed component placement (ADR-0075 point 2): what the next click drops,
   floating over the drawing so it is readable wherever the pointer is. */
.page-pane__armed[b-6r6hedkpbl] {
    position: absolute;
    left: 50%;
    bottom: 14px;
    transform: translateX(-50%);
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 14px;
    border-radius: 6px;
    background: var(--pcs-charcoal, #293132);
    color: #fff;
    font-size: 12.5px;
    box-shadow: 0 6px 20px rgb(0 0 0 / 28%);
}

.page-pane__armed-dot[b-6r6hedkpbl] {
    inline-size: 8px;
    block-size: 8px;
    flex: none;
    border-radius: 50%;
    background: var(--pcs-accent);
}

.page-pane__armed-designation[b-6r6hedkpbl] {
    font-family: var(--pcs-font-mono);
}

.page-pane__armed-hint[b-6r6hedkpbl] {
    color: #c8c6c4;
}

[b-6r6hedkpbl] .page-pane__armed-cancel {
    border-radius: 3px;
    padding: 3px 9px;
    background: rgb(255 255 255 / 14%);
    color: #fff;
    font-family: var(--pcs-font-ui);
    font-size: 12px;
}

[b-6r6hedkpbl] .page-pane__armed-cancel:hover {
    background: rgb(255 255 255 / 24%);
}

/* The page's drawing aspect in the status strip — mono so the two-letter code
   reads as the code it is. */
.page-pane__aspect[b-6r6hedkpbl] {
    font-family: var(--pcs-font-mono);
}


/* The connection point picked inside the selected symbol (ADR-0101), named in the bar. */
.page-pane__sub-selection[b-6r6hedkpbl] {
    font-weight: 600;
    white-space: nowrap;
}
/* /Features/Pages/PageObjectsList.razor.rz.scp.css */
/* The object list in the right panel. Layout only — the row is a PcsPressable
   and every control's size and intent is a parameter (ADR-0044).

   Every class the markup hands to a Pcs* component lands on THAT component's
   root and carries its scope id, so those rules go through ::deep — a plain
   selector here would match nothing. The spans inside a PcsPressable's child
   content are compiled in this file's scope and need no ::deep. */

.objects[b-0l1q61biag] {
    display: flex;
    flex-direction: column;
    border-top: 1px solid var(--pcs-border-soft);
}

.objects__head[b-0l1q61biag] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px 6px;
}

.objects__caption[b-0l1q61biag] {
    flex: 1;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.objects__section-head[b-0l1q61biag] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 8px 0 12px;
}

[b-0l1q61biag] .objects__toggle {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
}

.objects__heading[b-0l1q61biag] {
    font-weight: 600;
}

[b-0l1q61biag] .objects__count {
    padding: 2px;
}

/* The section keeps its own height: as a flex item it was shrinkable, so a
   panel shorter than its content squeezed every list and each one grew a
   scrollbar it did not need. */
.objects__section[b-0l1q61biag] {
    flex: none;
}

/* A short section is plain markup — no bound, no overflow, so no browser
   draws it a scroll track. */
.objects__rows[b-0l1q61biag] {
    overflow: visible;
}

/* Past the cap the list is bounded and virtualized, and only then does a
   scrollbar mean something. The height comes inline from
   MaxRowsBeforeScroll × RowHeightPx — a whole number of rows, from the same
   two constants Virtualize and the reveal scroll count in, so the fold never
   cuts a row in half and there is no third place to keep in step. */
.objects__rows--scrolls[b-0l1q61biag] {
    overflow-y: auto;
}

/* Must match RowHeightPx in the code-behind: Virtualize places rows by
   arithmetic, so a row that draws taller scrolls the list to the wrong place. */
.objects__row[b-0l1q61biag] {
    display: flex;
    align-items: center;
    height: 26px;
    padding-left: 22px;
    padding-right: 8px;
}

[b-0l1q61biag] .objects__entry {
    flex: 1;
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    padding: 0 6px;
    border-radius: var(--pcs-radius-sm);
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
    line-height: 26px;
}

[b-0l1q61biag] .objects__entry:hover {
    background: var(--pcs-light-grey-3);
}

[b-0l1q61biag] .objects__entry.is-selected {
    background: var(--pcs-accent);
    color: var(--pcs-fg-inverse);
}

.objects__label[b-0l1q61biag] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.objects__layer[b-0l1q61biag] {
    flex-shrink: 0;
    font-size: 11px;
    color: var(--pcs-mid-grey);
}

[b-0l1q61biag] .objects__entry.is-selected .objects__layer {
    color: var(--pcs-fg-inverse);
}

/* Hidden: listed, greyed, still selectable. A list that omitted what a layer
   toggle hid could not answer "what have I got". */
[b-0l1q61biag] .objects__entry--hidden {
    color: var(--pcs-mid-grey);
    font-style: italic;
}

/* Locked: selectable so its properties can be read and its box seen, never
   editable — every selection command refuses while it is in the selection.
   The padlock is a PcsGlyph, so it takes the row's own colour and needs
   nothing here beyond keeping it from being squeezed. */
[b-0l1q61biag] .objects__entry--locked svg {
    flex-shrink: 0;
}

[b-0l1q61biag] .objects__show {
    flex-shrink: 0;
    padding: 0 6px;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    color: var(--pcs-link);
    text-decoration: underline;
}
/* /Features/Pages/PlacedFieldEditor.razor.rz.scp.css */
.placed-field[b-zoqvboku6l] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.placed-field__name[b-zoqvboku6l] {
    margin: 0;
    font-size: inherit;
    font-weight: 600;
    white-space: nowrap;
}

.placed-field--stacked[b-zoqvboku6l] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 8px 12px;
}

[b-zoqvboku6l] .placed-field__num {
    width: 72px;
}
/* /Features/Pages/PlaceFloorplanDialog.razor.rz.scp.css */
.place-floorplan__list[b-616te3mx18] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

[b-616te3mx18] .place-floorplan__item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 4px;
    cursor: pointer;
}

[b-616te3mx18] .place-floorplan__item:hover {
    background: var(--pcs-surface-hover, rgba(0, 0, 0, 0.04));
}

[b-616te3mx18] .place-floorplan__item--disabled {
    opacity: 0.5;
    cursor: default;
}

.place-floorplan__name[b-616te3mx18] {
    flex: 1;
}

.place-floorplan__note[b-616te3mx18] {
    font-size: 0.85em;
    opacity: 0.75;
}
/* /Features/Pages/RoomsPanel.razor.rz.scp.css */
.rooms-panel[b-ebe42dfhu3] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 15px;
    font-size: 0.85rem;
}

.rooms-panel__empty[b-ebe42dfhu3] {
    margin: 0;
    opacity: 0.7;
}

.rooms-panel__list[b-ebe42dfhu3] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.rooms-panel__list li[b-ebe42dfhu3] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 4px;
    border-radius: 4px;
}

.rooms-panel__swatch[b-ebe42dfhu3] {
    width: 10px;
    height: 10px;
    border-radius: 2px;
    flex-shrink: 0;
}

.rooms-panel__name[b-ebe42dfhu3] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Features/Pages/SelectFrameDialog.razor.rz.scp.css */
.select-frame__list[b-5ml05s1kc6] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 320px;
}

[b-5ml05s1kc6] .select-frame__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 8px;
    border-radius: 4px;
    cursor: pointer;
}

[b-5ml05s1kc6] .select-frame__item:hover {
    background: var(--pcs-surface-hover, rgba(0, 0, 0, 0.04));
}

.select-frame__name[b-5ml05s1kc6] {
    flex: 1;
}

.select-frame__note[b-5ml05s1kc6] {
    color: var(--pcs-text-muted, #777);
    font-size: 0.85em;
}

.select-frame__empty[b-5ml05s1kc6] {
    color: var(--pcs-text-muted, #777);
    padding: 6px 8px;
}

/* A fixed slot so the rows line up whatever the sheet's aspect ratio, and so
   the list does not reflow as previews arrive. */
.select-frame__thumb[b-5ml05s1kc6] {
    flex: 0 0 auto;
    inline-size: 56px;
    block-size: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* The svg comes from a MarkupString, which carries no scope attribute of its
   own — ::deep is the only way to reach it, and it is markup this component
   injected rather than another component's chrome. */
.select-frame__thumb[b-5ml05s1kc6]  svg {
    max-inline-size: 100%;
    max-block-size: 100%;
}

.select-frame__thumb--none[b-5ml05s1kc6] {
    border: 1px dashed var(--pcs-border);
    border-radius: 2px;
}
/* /Features/Pages/SymbolPalette.razor.rz.scp.css */
.sym-palette[b-lk8c5nn1ss] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 15px;
    min-height: 0;
    height: 100%;
}

.sym-palette__items[b-lk8c5nn1ss] {
    /* Take exactly the remaining panel height so only this list scrolls. */
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    overflow-y: auto;
    min-height: 0;
}

.sym-palette__item[b-lk8c5nn1ss] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.4rem;
    cursor: var(--pcs-cursor-grab);
    border-radius: 4px;
}

.sym-palette__item:hover[b-lk8c5nn1ss] {
    background: rgba(128, 128, 128, 0.12);
}

.sym-palette__thumb[b-lk8c5nn1ss] {
    inline-size: 2.25rem;
    block-size: 2.25rem;
    flex: none;
    display: grid;
    place-items: center;
}

.sym-palette__thumb[b-lk8c5nn1ss]  svg {
    max-inline-size: 100%;
    max-block-size: 100%;
}

.sym-palette__name[b-lk8c5nn1ss] {
    font-size: 0.85rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sym-palette__empty[b-lk8c5nn1ss] {
    font-size: 0.85rem;
    opacity: 0.7;
}

.sym-palette__loading[b-lk8c5nn1ss] {
    display: flex;
    justify-content: center;
    padding: 1.5rem 0;
}
/* /Features/ProjectSettings/GeneralSection.razor.rz.scp.css */
/* Layout only — control/button/badge styling comes from the design-system
   primitives (.pcs-input, PcsIconButton, PcsBadge). */

.pset__langs[b-hzhnxjfjkz] {
    display: flex;
    flex-direction: column;
    padding: 0 0 12px;
}

.pset__lang[b-hzhnxjfjkz] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px 6px 0;
    border-top: 1px solid var(--pcs-light-grey-2);
}

.pset__lang-name[b-hzhnxjfjkz] {
    flex: 1;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}
/* /Features/ProjectSettings/PlaceholderSection.razor.rz.scp.css */
/* Layout only — control styling comes from the shared .pcs-input rules. */

[b-0hqy8r732d] .pset__num {
    width: 220px;
    text-align: right;
}

[b-0hqy8r732d] .pset__unit {
    width: 96px;
}

.pset__placeholder[b-0hqy8r732d] {
    margin: 0;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}
/* /Features/ProjectWizard/ProjectWizardDialog.razor.rz.scp.css */
.wiz[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

/* Minimal nav: the step readout lives in the dialog title; this bar under the
   header is the only other progress cue. */
.wiz__progress[b-uzdfl74xrd] {
    height: 3px;
    background: var(--pcs-light-grey-3);
    flex-shrink: 0;
}

.wiz__progress-bar[b-uzdfl74xrd] {
    height: 100%;
    background: var(--pcs-atoll);
    transition: width .3s;
}

.wiz__body[b-uzdfl74xrd] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.wiz__center[b-uzdfl74xrd] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.wiz__name[b-uzdfl74xrd] {
    width: 520px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.wiz__scroll[b-uzdfl74xrd] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: 30px 36px;
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.wiz__heading[b-uzdfl74xrd] {
    margin: 0 0 6px;
    font: normal normal 600 22px/28px var(--pcs-font-display, var(--pcs-font-ui));
    color: var(--pcs-charcoal);
}

.wiz__intro[b-uzdfl74xrd] {
    margin: 0;
    font: normal normal 400 14px/20px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.wiz__field[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wiz__field-label[b-uzdfl74xrd] {
    font: normal normal 500 11px/14px var(--pcs-font-ui);
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

/* Layout only — the look and the height come from PcsTextField at the Large
   rung, which this used to restate at 42px, off the 32/38/46 scale. */
[b-uzdfl74xrd] .wiz__name-input {
    width: 100%;
}

/* ── Floorplans step ─────────────────────────────────────────────────── */
.wiz__drop[b-uzdfl74xrd] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: calc(260px + 3px);
    border: 1.5px dashed var(--pcs-light-grey-1);
    border-radius: 8px;
    background: var(--pcs-bg-2, var(--pcs-light-grey-3));
    cursor: pointer;
    transition: background-color var(--pcs-transition), border-color var(--pcs-transition);
}

.wiz__drop--compact[b-uzdfl74xrd] {
    min-height: 120px;
}

.wiz__drop:hover[b-uzdfl74xrd] {
    border-color: var(--pcs-atoll);
}

.wiz__drop.is-disabled[b-uzdfl74xrd] {
    cursor: progress;
    opacity: .7;
}

/* InputFile renders the <input> from another component, so the scope attribute
   isn't on it — ::deep is what actually hides the native "Choose files" control. */
.wiz__drop[b-uzdfl74xrd]  .wiz__drop-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.wiz__drop[b-uzdfl74xrd]  .wiz__drop-icon {
    color: var(--pcs-atoll);
}

.wiz__drop-text[b-uzdfl74xrd] {
    font: normal normal 500 14px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.wiz__drop-sub[b-uzdfl74xrd] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.wiz__fp-list[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.wiz__count[b-uzdfl74xrd] {
    font: normal normal 500 11px/14px var(--pcs-font-ui);
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.wiz__fp-row[b-uzdfl74xrd] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 14px;
    border: 1px solid var(--pcs-border);
    border-radius: 8px;
    background: var(--pcs-white);
}

.wiz__fp-thumb[b-uzdfl74xrd] {
    width: calc(96px + 2px);
    height: calc(68px + 2px);
    flex-shrink: 0;
    border: 1px solid var(--pcs-border);
    border-radius: 4px;
    overflow: hidden;
    background: var(--pcs-light-grey-3);
}

.wiz__fp-row[b-uzdfl74xrd]  .wiz__fp-img,
.wiz__preview-plan[b-uzdfl74xrd]  .wiz__preview-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.wiz__fp-meta[b-uzdfl74xrd] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wiz__fp-meta .pcs-input[b-uzdfl74xrd] {
    max-width: 520px;
}

.wiz__fp-sub[b-uzdfl74xrd] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wiz__status[b-uzdfl74xrd] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: normal normal 500 12px/16px var(--pcs-font-ui);
    white-space: nowrap;
}

.wiz__status--ok[b-uzdfl74xrd] {
    color: var(--pcs-success);
}

.wiz__status--warn[b-uzdfl74xrd] {
    color: var(--pcs-warning);
}

.wiz__status-dot[b-uzdfl74xrd] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

.wiz__status-dot--ok[b-uzdfl74xrd] {
    background: var(--pcs-success);
}

.wiz__status-dot--warn[b-uzdfl74xrd] {
    background: var(--pcs-warning);
}

/* ── Scale / Rooms steps ─────────────────────────────────────────────── */
.wiz__tabs[b-uzdfl74xrd] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px var(--pcs-sp-20);
    border-bottom: 1px solid var(--pcs-border);
    background: var(--pcs-bg-2, var(--pcs-light-grey-3));
    flex-shrink: 0;
    overflow-x: auto;
}

.wiz__tab-sub[b-uzdfl74xrd] {
    font: normal normal 400 11px/14px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.wiz__spacer[b-uzdfl74xrd] {
    flex: 1;
}

.wiz__tabs-note[b-uzdfl74xrd] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
    white-space: nowrap;
}

.wiz__editor[b-uzdfl74xrd] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* ── Review step (preview summary) ───────────────────────────────────── */
.wiz__warn[b-uzdfl74xrd] {
    display: flex;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--pcs-warning);
    border-radius: 8px;
    background: #fff7ee;
}

.wiz__warn-mark[b-uzdfl74xrd] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--pcs-warning);
    color: var(--pcs-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: normal normal 700 13px/16px var(--pcs-font-ui);
    flex-shrink: 0;
}

.wiz__warn-body[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* A column child stretches, and a stretched link button centres its label. */
.wiz__warn-body[b-uzdfl74xrd]  .wiz__map-now {
    align-self: flex-start;
}

.wiz__warn-title[b-uzdfl74xrd] {
    font: normal normal 600 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.wiz__warn-text[b-uzdfl74xrd] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.wiz__review[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    gap: 18px;
    max-width: 900px;
}

.wiz__review-project[b-uzdfl74xrd] {
    max-width: 520px;
}

.wiz__page-card[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid var(--pcs-border);
    border-radius: 8px;
    background: var(--pcs-white);
}

.wiz__page-head[b-uzdfl74xrd] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.wiz__page-no[b-uzdfl74xrd] {
    font: normal normal 500 11px/14px var(--pcs-font-ui);
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
    white-space: nowrap;
}

[b-uzdfl74xrd] .wiz__page-name {
    flex: 1;
    min-width: 0;
    font-weight: 600;
}

.wiz__page-scale[b-uzdfl74xrd] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
    white-space: nowrap;
}

.wiz__page-empty[b-uzdfl74xrd] {
    margin: 0;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-warning);
}

.wiz__rooms[b-uzdfl74xrd] {
    width: 100%;
    border-collapse: collapse;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.wiz__rooms th[b-uzdfl74xrd],
.wiz__rooms td[b-uzdfl74xrd] {
    padding: 6px 8px;
    border-bottom: 1px solid var(--pcs-border);
    text-align: left;
}

.wiz__rooms th[b-uzdfl74xrd] {
    font: normal normal 500 11px/14px var(--pcs-font-ui);
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.wiz__rooms tfoot td[b-uzdfl74xrd] {
    border-bottom: 0;
    font-weight: 600;
}

.wiz__num[b-uzdfl74xrd] {
    text-align: right !important;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.wiz__summary-block[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.wiz__summary-row[b-uzdfl74xrd] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.wiz__summary-text[b-uzdfl74xrd] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.wiz__summary-name[b-uzdfl74xrd] {
    font: normal normal 600 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wiz__summary-sub[b-uzdfl74xrd] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* ── Footer ──────────────────────────────────────────────────────────── */
.wiz__footer[b-uzdfl74xrd] {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 60px;
    padding: 0 var(--pcs-sp-20);
    border-top: 1px solid var(--pcs-border);
    flex-shrink: 0;
}

.wiz__footer-hint[b-uzdfl74xrd] {
    flex: 1;
    text-align: right;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* The floorplan picker is a PcsSegmentedControl; its cells hold a name that has
   to ellipsize rather than push the row wide. ::deep because the cells are the
   control's own markup. */
.wiz__tabs[b-uzdfl74xrd]  .pcs-segmented__cell {
    max-width: 320px;
}

.wiz__tabs[b-uzdfl74xrd]  .wiz__tab-name {
    overflow: hidden;
    text-overflow: ellipsis;
}
/* /Features/Project/ProjectLanguagePicker.razor.rz.scp.css */
/* Layout only — the select is a .pcs-input .pcs-input--sm. */
.project-lang[b-qxds5wrmpy] {
    display: inline-flex;
    align-items: center;
    margin-right: 8px;
}

[b-qxds5wrmpy] .project-lang__select {
    min-width: 130px;
}
/* /Features/Project/ProjectPage.razor.rz.scp.css */
/* Page-specific styles for Project land here. The shell layout
   (.app-shell, .app-shell__body, .app-shell__main) lives in
   AppShell.razor.css and applies to every page. */

/* Divider between the fixed left-nav items (Settings / Floorplan diagrams)
   and the project tree below. */
.left-nav-fixed-divider[b-pdg6a9hbru] {
    margin: 6px 0 2px;
    border: 0;
    border-top: 1px solid var(--pcs-border);
}

/* The ribbon's zoom selector (between Delete and the language picker).
   Sizing/typography come from .pcs-input--sm, same as the language picker;
   only layout lives here. */
[b-pdg6a9hbru] .ribbon-zoom {
    min-width: 120px;
    align-self: center;
}

/* Right-side toolbox column (Symbols | Layers tabs) — same width as the
   left navigation panel, never wider. Collapses to nothing (width 0, no
   rail) — the toggle lives in the page-tab strip's trailing slot, which
   stays visible either way.

   The tab panel stays mounted across collapse (recreating it re-runs the
   SymbolPalette's virtualized render, ~300ms per IntersectionObserver
   callback) but must have NO layout box while the width animates: the tab
   strip's overflow observer would measure the squeezed strip, and once its
   scroll chevrons appear they eat enough width to keep the strip
   overflowed at full size. Hence the separate --panel-hidden class, which
   the code-behind holds through the expand transition (see
   ToggleToolboxCollapsedAsync). The double class beats the equal-specificity
   `.right-toolbox ::deep .tab-panel` display:flex below. */
.right-toolbox[b-pdg6a9hbru] {
    width: 280px;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    /* Matches the tab strip/frame surround, so the shrinking column reads
       as one solid surface during the transition. */
    background: var(--pcs-light-grey-2);
    transition: var(--pcs-panel-transition);
}

.right-toolbox--collapsed[b-pdg6a9hbru] {
    width: 0;
}

.right-toolbox.right-toolbox--panel-hidden[b-pdg6a9hbru]  .tab-panel {
    display: none;
}

.right-toolbox[b-pdg6a9hbru]  .tab-panel {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.right-toolbox__scroll[b-pdg6a9hbru] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* A 280px column cannot spare a full-width gutter. */
    scrollbar-width: thin;
    scrollbar-color: var(--pcs-border) transparent;
}

.right-toolbox__datasheet[b-pdg6a9hbru] {
    padding: 10px 12px 16px;
    border-top: 1px solid var(--pcs-border-soft);
}

/* RDS tree header inside the left nav's scrolling block. */
.rds-tree-header[b-pdg6a9hbru] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 4px 8px;
    font: normal normal 600 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.rds-tree-header[b-pdg6a9hbru]  .rds-tree-header__icon {
    width: 15px;
    height: 15px;
    color: var(--pcs-mid-grey);
}

/* The show-designations toggle, pinned in the left nav's footer slot. */
[b-pdg6a9hbru] .rds-designation-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    font: normal normal 400 13px/16px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
    cursor: pointer;
    user-select: none;
}

[b-pdg6a9hbru] .rds-designation-toggle input {
    cursor: pointer;
}

/* The toolbox column hugs the browser's right edge and leaves the divider gap
   to the pages panel — which already pads its own right side 4px, so the
   toolbox contributes none or the gap doubles. */
.right-toolbox[b-pdg6a9hbru]  .tab-panel__frame {
    padding-left: 0;
    padding-right: 0;
}

.right-toolbox[b-pdg6a9hbru]  .tabs {
    padding-left: 0;
    padding-right: 0;
}

/* /Features/Reports/ReportDesigner.razor.rz.scp.css */
.rd[b-pfku508d0l] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    height: 100%;
    min-height: 480px;
    min-width: 0;
    background: var(--pcs-white);
    outline: none;
}

.rd__toolbar[b-pfku508d0l] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--pcs-border);
    flex-wrap: wrap;
}

.rd__crumb[b-pfku508d0l] {
    font: 500 12px var(--pcs-font-ui);
    color: var(--pcs-fg-2);
    white-space: nowrap;
}

[b-pfku508d0l] .rd__crumb-sep {
    color: var(--pcs-fg-3);
}

.rd__name[b-pfku508d0l] {
    font-weight: 700;
    margin-right: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 320px;
}

.rd__sep[b-pfku508d0l] {
    width: var(--pcs-hairline);
    align-self: stretch;
    background: var(--pcs-border);
    margin: 0 4px;
}

.rd__spacer[b-pfku508d0l] {
    flex: 1;
}

/* The readout changes width as the digits do; a fixed width keeps Save still. */
.rd__toolbar[b-pfku508d0l]  .rd__zoom {
    min-width: 64px;
    font-variant-numeric: tabular-nums;
}

.rd__body[b-pfku508d0l] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    background: var(--pcs-bg-1);
}

.rd__pane[b-pfku508d0l] {
    flex: 0 0 75%;
    min-width: 0;
    overflow: auto;
    background: var(--pcs-bg-canvas);
}

.rd__panel[b-pfku508d0l] {
    flex: 1 1 0;
    min-width: 0;
    overflow: auto;
    border-left: 1px solid var(--pcs-border);
    background: var(--pcs-white);
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ----- the property panel's vocabulary, shared by every inspector -----
   Inspectors are child components, so these reach them through ::deep. */

.rd-panel[b-pfku508d0l]  .rd-tabs {
    display: flex;
    margin: -4px -12px 4px;
    padding: 0 6px;
    border-bottom: 1px solid var(--pcs-border);
}

.rd-panel[b-pfku508d0l]  .rd-tabs--compact {
    margin: 0 0 4px;
}

.rd-panel[b-pfku508d0l]  .rd-tab {
    flex: 1 1 auto;
    min-width: 0;
    height: 32px;
    padding: 0 2px;
    margin-bottom: -1px;
    border-bottom: 2px solid transparent;
    font: 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rd-panel[b-pfku508d0l]  .rd-tabs--compact .rd-tab {
    height: 28px;
    padding: 0 4px;
}

.rd-panel[b-pfku508d0l]  .rd-tab:hover {
    color: var(--pcs-fg-1);
}

.rd-panel[b-pfku508d0l]  .rd-tab--active {
    border-bottom-color: var(--pcs-accent);
    color: var(--pcs-fg-1);
    font-weight: 600;
}

.rd-panel[b-pfku508d0l]  .rd-section {
    font: 500 11px/14px var(--pcs-font-ui);
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--pcs-fg-2);
    margin-top: 4px;
}

.rd-panel[b-pfku508d0l]  .rd-help {
    margin: 0;
    font-size: 12px;
    line-height: 16px;
    color: var(--pcs-fg-3);
}

.rd-panel[b-pfku508d0l]  .rd-help--break {
    word-break: break-all;
}

.rd-panel[b-pfku508d0l]  .rd-hr {
    width: 100%;
    height: 0;
    margin: 6px 0;
    border: 0;
    border-top: 1px solid var(--pcs-border);
}

.rd-panel[b-pfku508d0l]  .rd-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}

.rd-panel[b-pfku508d0l]  .rd-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

.rd-panel[b-pfku508d0l]  .rd-row--indent {
    padding-left: 18px;
    gap: 2px;
}

.rd-panel[b-pfku508d0l]  .rd-row--head {
    margin-top: 8px;
}

.rd-panel[b-pfku508d0l]  .rd-grow {
    flex: 1 1 auto;
    min-width: 0;
}

.rd-panel[b-pfku508d0l]  .rd-size {
    width: 78px;
    flex: none;
}

.rd-panel[b-pfku508d0l]  .rd-wrap {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.rd-panel[b-pfku508d0l]  .rd-actions {
    display: flex;
}

.rd-panel[b-pfku508d0l]  .rd-actions--bottom {
    padding-top: 4px;
}

.rd-panel[b-pfku508d0l]  .rd-self-start {
    align-self: flex-start;
}

.rd-panel[b-pfku508d0l]  .rd-link {
    align-self: flex-start;
    padding: 0;
}

.rd-panel[b-pfku508d0l]  .rd-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 8px;
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-bg-2);
}

.rd-panel[b-pfku508d0l]  .rd-card--tight {
    gap: 2px;
    padding: 6px;
}

.rd-panel[b-pfku508d0l]  .rd-card__title {
    font: 600 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.rd-panel[b-pfku508d0l]  .rd-ordinal {
    flex: none;
    font: 500 12px var(--pcs-font-mono);
    color: var(--pcs-fg-3);
}

.rd-panel[b-pfku508d0l]  .rd-dir {
    padding: 0 6px;
}

.rd-panel[b-pfku508d0l]  .rd-flip {
    transform: rotate(180deg);
}

.rd-panel[b-pfku508d0l]  .rd-swatches {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.rd-panel[b-pfku508d0l]  .rd-swatch {
    width: 22px;
    height: 22px;
    border-radius: var(--pcs-radius-control);
    border: 1px solid var(--pcs-border);
}

.rd-panel[b-pfku508d0l]  .rd-swatch--round {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid var(--pcs-white);
    box-shadow: 0 0 0 1px var(--pcs-border);
}

.rd-panel[b-pfku508d0l]  .rd-swatch--on {
    box-shadow: 0 0 0 2px var(--pcs-accent);
}

.rd-panel[b-pfku508d0l]  .rd-list-row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 6px 8px;
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-bg-2);
    text-align: left;
}

.rd-panel[b-pfku508d0l]  .rd-list-row:hover {
    background: var(--pcs-light-grey-2);
}

.rd-panel[b-pfku508d0l]  .rd-list-row__text {
    flex: 1;
    min-width: 0;
    font: 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* /Features/Reports/ReportPage.razor.rz.scp.css */
/* The page is a drawing surface: what it paints is the document's own
   styling (fonts, bands, borders from the design), not interface chrome, so
   colour and type here describe the printout, not the app. Handles and
   selection marks are the one piece of chrome, and they use the tokens. */
.rp[b-04qrb8rxly] {
    padding: 24px 0;
    width: fit-content;
    margin: 0 auto;
}

.rp__ruler[b-04qrb8rxly] {
    position: sticky;
    top: 0;
    z-index: 6;
    height: 22px;
    margin-bottom: 6px;
    background-color: var(--pcs-white);
    background-image:
        linear-gradient(to right, var(--pcs-mid-grey) 0 1px, transparent 1px),
        linear-gradient(to right, var(--pcs-mid-grey) 0 1px, transparent 1px),
        linear-gradient(to right, var(--pcs-mid-grey) 0 1px, transparent 1px);
    /* 10 mm, 5 mm and 1 mm ticks at the page's 640 px / 210 mm scale. */
    background-size: 30.476px 10px, 15.238px 6px, 3.0476px 3px;
    background-position: left bottom;
    background-repeat: repeat-x;
    box-shadow: var(--pcs-shadow-1);
    overflow: hidden;
    user-select: none;
    position: relative;
}

.rp__ruler-mark[b-04qrb8rxly] {
    position: absolute;
    top: 0;
    bottom: 0;
    background: color-mix(in oklch, var(--pcs-accent) 18%, transparent);
    border-left: 1px solid var(--pcs-accent);
    border-right: 1px solid var(--pcs-accent);
}

.rp__ruler-label[b-04qrb8rxly] {
    position: absolute;
    top: 1px;
    padding-left: 2px;
    font: 400 9px/10px var(--pcs-font-mono);
    color: var(--pcs-fg-3);
}

.rp__ruler-tag[b-04qrb8rxly] {
    position: absolute;
    top: 1px;
    padding: 0 3px;
    background: var(--pcs-accent);
    color: var(--pcs-white);
    font: 500 9px/10px var(--pcs-font-mono);
    white-space: nowrap;
}

.rp__page[b-04qrb8rxly] {
    position: relative;
    flex: none;
    background: var(--pcs-white);
    box-shadow: var(--pcs-shadow-1);
    display: flex;
    flex-direction: column;
    overflow: visible;
}

.rp__page--clip[b-04qrb8rxly] {
    overflow: hidden;
}

/* The drawing frame the template prints on, at the page's scale: the SVG's viewBox
   is the sheet, so its mm land where the body's mm do. */
.rp__sheet[b-04qrb8rxly] {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    color: var(--pcs-charcoal);
    z-index: 1;
}

.rp__sheet[b-04qrb8rxly]  svg {
    display: block;
    width: 100%;
    height: 100%;
}

.rp__guide[b-04qrb8rxly] {
    position: absolute;
    top: 0;
    bottom: 0;
    border-left: 1px dashed var(--pcs-accent);
    pointer-events: none;
    z-index: 4;
}

.rp__wm-clip[b-04qrb8rxly] {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 3;
}

.rp__wm[b-04qrb8rxly] {
    position: absolute;
    transform-origin: center;
    white-space: nowrap;
    line-height: 1;
    user-select: none;
    outline-offset: 4px;
}

.rp__wm--selected[b-04qrb8rxly] {
    outline: 1.5px dashed var(--pcs-accent);
}

.rp__content[b-04qrb8rxly] {
    display: flex;
    flex-direction: column;
}

.rp__band[b-04qrb8rxly] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 2px 8px;
    border-bottom: 1px solid var(--pcs-border);
    cursor: pointer;
}

.rp__band--design[b-04qrb8rxly] {
    outline: 1px dashed var(--pcs-silver);
    outline-offset: -1px;
}

.rp__band--selected[b-04qrb8rxly] {
    outline: 1.5px solid var(--pcs-accent);
    outline-offset: -1px;
}

.rp__band-parts[b-04qrb8rxly] {
    display: flex;
    align-items: center;
    gap: 4px 16px;
    flex-wrap: wrap;
    min-width: 0;
}

.rp__band-part[b-04qrb8rxly] {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    white-space: nowrap;
    line-height: 1.3;
}

.rp__band-count[b-04qrb8rxly] {
    margin-left: auto;
    font: 400 11px/16px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
    white-space: nowrap;
}

.rp__grid[b-04qrb8rxly] {
    position: relative;
    display: grid;
    align-items: center;
}

.rp__grid--head[b-04qrb8rxly] {
    align-items: stretch;
    margin-top: 4px;
}

.rp__cell[b-04qrb8rxly] {
    padding: 3px 6px;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: anywhere;
}

.rp__cell--head[b-04qrb8rxly] {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 8px 0 6px;
    line-height: 1.3;
    cursor: pointer;
}

.rp__cell--head:hover[b-04qrb8rxly] {
    background: var(--pcs-light-grey-3);
}

.rp__cell--selected:hover[b-04qrb8rxly] {
    background: var(--pcs-accent);
}

.rp__cell--tint[b-04qrb8rxly] {
    background: color-mix(in oklch, var(--pcs-accent) 10%, transparent);
}

.rp__cell--drop-left[b-04qrb8rxly] {
    box-shadow: inset 2px 0 0 var(--pcs-accent);
}

.rp__cell--drop-right[b-04qrb8rxly] {
    box-shadow: inset -2px 0 0 var(--pcs-accent);
}

.rp__sort[b-04qrb8rxly] {
    margin-left: 4px;
    font-weight: 700;
}

.rp__img[b-04qrb8rxly] {
    flex: none;
    background-repeat: no-repeat;
}

.rp__pic[b-04qrb8rxly] {
    display: block;
    max-width: 100%;
    object-fit: contain;
}

.rp__pic--empty[b-04qrb8rxly] {
    width: 100%;
    border: 1px dashed var(--pcs-border, #bbb);
}

.rp__handle-x[b-04qrb8rxly] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 6px;
    cursor: var(--pcs-cursor-col-resize);
    border-right: 1px solid var(--pcs-silver);
}

.rp__handle-x:hover[b-04qrb8rxly] {
    border-right: 2px solid var(--pcs-accent);
}

.rp__handle-y[b-04qrb8rxly] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -3px;
    height: 6px;
    cursor: var(--pcs-cursor-row-resize);
    z-index: 2;
}

.rp__handle-y:hover[b-04qrb8rxly] {
    background: color-mix(in oklch, var(--pcs-accent) 40%, transparent);
}

.rp__empty[b-04qrb8rxly] {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 32px 16px;
    border: 1px dashed var(--pcs-silver);
    border-radius: var(--pcs-radius-md);
    text-align: center;
}

.rp__empty-text[b-04qrb8rxly] {
    font: 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
}

.rp__frame[b-04qrb8rxly] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
}

.rp__area[b-04qrb8rxly] {
    position: absolute;
    border: 1px dashed var(--pcs-silver);
}
/* /Features/Reports/ReportTemplatesView.razor.rz.scp.css */
/* Layout only: the panel and the tree (PcsTreeView) bring their own looks. */
.rt[b-4mw384sxlv] {
    display: flex;
    height: 100%;
    min-height: 480px;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

/* The fold, the width and the head are PcsCollapsiblePanel's; this is the
   navigation's own ground. */
.rt__nav[b-4mw384sxlv] {
    flex-shrink: 0;
    display: flex;
    background: var(--pcs-light-grey-3);
    border-right: 1px solid var(--pcs-border);
}

.rt__nav-top[b-4mw384sxlv] {
    padding: 4px 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rt__nav-items[b-4mw384sxlv] {
    padding: 12px;
    overflow: auto;
    flex: 1;
}

.rt__nav-footer[b-4mw384sxlv] {
    padding: 8px 16px;
    border-top: 1px solid var(--pcs-border);
    font: 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
}

.rt__dirty[b-4mw384sxlv] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--pcs-warning);
    flex: none;
    display: inline-block;
}

[b-4mw384sxlv] .rt__add-one {
    padding: 0;
}

.rt__no-match[b-4mw384sxlv] {
    margin: 8px 10px;
    font: 400 12px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
}

.rt__main[b-4mw384sxlv] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--pcs-white);
}

[b-4mw384sxlv] .rt__empty-icon {
    opacity: 0.5;
}

.rt__empty-title[b-4mw384sxlv] {
    font: 600 15px/20px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.rt__empty-hint[b-4mw384sxlv] {
    font: 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
    max-width: 320px;
    text-wrap: pretty;
}
/* /Features/SingleGuidingObjects/SingleGuidingObjectInspector.razor.rz.scp.css */
/* Layout only — the spacing PcsCadPropertiesPanel keeps, as CableInspector does. */
.sgo-inspector[b-6ft17ma13u] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: var(--pcs-sp-15) var(--pcs-sp-15) 0;
    min-width: 0;
}
/* /Features/Symbols/SymbolEditorView.razor.rz.scp.css */
.se-view[b-aia8myh82n] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 480px;
}

.se-view__toolbar[b-aia8myh82n] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-bottom: 1px solid var(--pcs-border);
    flex-wrap: wrap;
}

.se-view__name[b-aia8myh82n] {
    font-weight: 700;
    margin-right: 8px;
}

/* The class lands on PcsFormField's own root, so it carries that component's
   scope id — ::deep from an element this file owns. */
.se-view__toolbar[b-aia8myh82n]  .se-view__type {
    margin-right: 8px;
}

/* Only a claim boundary for Escape; its children stay toolbar items. */
.se-view__tools[b-aia8myh82n] {
    display: contents;
}

.se-view__sep[b-aia8myh82n] {
    width: var(--pcs-hairline);
    align-self: stretch;
    background: var(--pcs-border);
    margin: 0 4px;
}

/* Type is the shared .pcs-mono preset, set on the element. */
.se-view__coords[b-aia8myh82n] {
    color: var(--pcs-fg-2);
}

.se-view__body[b-aia8myh82n] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
}

.se-view__surface[b-aia8myh82n] {
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
    outline: none;
}

.se-view__panel[b-aia8myh82n] {
    width: calc(240px + 24px + 1px);
    flex: 0 0 auto;
    border-left: 1px solid var(--pcs-border);
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.se-view__panel h3[b-aia8myh82n] {
    font-size: 14px;
    margin: 0;
}

/* /Features/Symbols/SymbolsView.razor.rz.scp.css */
/* Symbols view — 1A three-pane library layout.
   Tokens follow the PC Schematic styleguide (navy #2E4B6A, atoll #30597C,
   accent var(--pcs-accent), hairline #DEDEDE, sidenav #F4F4F4). */

.sym-view[b-e276glvmy8] {
    /* MainLayout adds no height chain, so a percentage height would resolve to
       auto and let the group tree grow the document instead of scrolling inside
       its own pane. Pin the page to the viewport and let the panes scroll. */
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    min-height: 0;
    background: var(--pcs-white, #fff);
    color: var(--pcs-charcoal, #293132);
    font-family: var(--pcs-font-ui, 'Inter', sans-serif);
    font-size: 14px;
}

/* The panes carry no height of their own content — each pane's single child
   fills it, or the inner flex column collapses to content height and its scroll
   container never engages. */
.sym-view__main[b-e276glvmy8] {
    height: 100%;
}

/* Inside a PcsCollapsiblePanel the body is a flex column; fill it. */
.sym-view__side[b-e276glvmy8],
.sym-view__props[b-e276glvmy8] {
    flex: 1;
}

/* ── shared bits ─────────────────────────────────────────────────────────── */
.sym-view__eyebrow[b-e276glvmy8] {
    font-weight: 500;
    font-size: 11px;
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey, #8E9292);
}

.sym-view__mono[b-e276glvmy8] {
    font-family: var(--pcs-font-mono, 'Courier New', monospace);
    font-size: 11px;
    color: var(--pcs-atoll, #30597C);
}

.sym-view__meta[b-e276glvmy8] {
    font-size: 12px;
    color: var(--pcs-mid-grey, #8E9292);
}

.sym-view__spacer[b-e276glvmy8] { flex: 1; }

[b-e276glvmy8] .sym-view__rename {
    width: 100%;
    height: var(--pcs-control-h-sm);
    border: 1px solid var(--pcs-focus-color);
    border-radius: var(--pcs-radius-control);
    padding: 0 8px;
    font-size: 13px;
    outline: none;
}

/* ── left: standard + group tree ─────────────────────────────────────────── */
/* No border-right: the splitter bar is the divider now, and a border beside it
   reads as a double rule. Same for __props' border-left. */
.sym-view__side[b-e276glvmy8] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: var(--pcs-white, #fff);
}

.sym-view__side-head[b-e276glvmy8] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 16px 10px;
}
.sym-view__side-head--divided[b-e276glvmy8] {
    border-top: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    padding-top: 12px;
}

.sym-view__std[b-e276glvmy8] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 16px 16px;
}

/* Look comes from the shared .pcs-input classes (same control as the ribbon
   zoom select); only layout lives here. */
[b-e276glvmy8] .sym-view__std-select {
    flex: 1;
    min-width: 0;
    cursor: pointer;
}

/* Scroll pane for PcsTreeView: vertical only — the tree clips its own rows and
   ellipsizes long labels, so a horizontal bar here would only appear on a
   miscalculated row width. */
.sym-view__groups[b-e276glvmy8] {
    flex: 1;
    min-height: 0;
    overflow: hidden auto;
    padding: 0 10px 16px;
}

/* ── middle: browser ─────────────────────────────────────────────────────── */
.sym-view__main[b-e276glvmy8] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* Single row: search + view toggle + count on the left, Import/New pushed to
   the right edge; wraps when the pane gets too narrow. */
.sym-view__toolbar[b-e276glvmy8] {
    flex: none;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--pcs-light-grey-1, #DEDEDE);
}

.sym-view__search-wrap[b-e276glvmy8] { width: 260px; max-width: 100%; min-width: 150px; }

/* Layout only — the import control is a PcsFilePickerButton, so its look, its
   focus ring and the clip on its inner input are the primitive's. The class
   lands on that component's root and carries its scope id, hence ::deep. */
[b-e276glvmy8] .sym-view__import { margin-left: auto; }

.sym-view__count[b-e276glvmy8] { flex: none; white-space: nowrap; font-size: 12px; color: var(--pcs-mid-grey, #8E9292); }

.sym-view__crumbs[b-e276glvmy8] {
    flex: none;
    height: 38px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 20px;
    background: var(--pcs-light-grey-3, #F4F4F4);
    border-bottom: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    font-size: 12px;
    color: var(--pcs-mid-grey, #8E9292);
}
.sym-view__crumb-sep[b-e276glvmy8] { color: var(--pcs-silver, #C8C6C4); }
.sym-view__crumb-current[b-e276glvmy8] { font-weight: 600; color: var(--pcs-atoll, #30597C); }

.sym-view__results[b-e276glvmy8] { flex: 1; min-height: 0; overflow: auto; padding: 20px; }

.sym-view__grid[b-e276glvmy8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
    gap: 14px;
}

.sym-view__thumb[b-e276glvmy8] { display: block; height: 62px; }
.sym-view__thumb[b-e276glvmy8]  svg { width: 100%; height: 100%; }
.sym-view__thumb--sm[b-e276glvmy8] { height: 26px; width: 46px; }

.sym-view__name[b-e276glvmy8] {
    font-weight: 500;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sym-view__table[b-e276glvmy8] { border: 1px solid var(--pcs-light-grey-1, #DEDEDE); border-radius: 4px; overflow: hidden; }

.sym-view__row[b-e276glvmy8] {
    display: grid;
    grid-template-columns: 64px 1.4fr .8fr 1fr .7fr .9fr;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 42px;
    padding: 0 12px;
    border: none;
    border-bottom: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition: background .15s;
}
.sym-view__row:hover[b-e276glvmy8] { background: var(--pcs-light-grey-3, #F4F4F4); }
.sym-view__row--active[b-e276glvmy8] { background: var(--pcs-light-grey-3, #F4F4F4); }
.sym-view__row--head[b-e276glvmy8] {
    height: 34px;
    background: var(--pcs-light-grey-3, #F4F4F4);
    cursor: default;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey, #8E9292);
}

.sym-view__empty[b-e276glvmy8] {
    height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px dashed var(--pcs-light-grey-1, #DEDEDE);
    border-radius: 4px;
    text-align: center;
}
.sym-view__empty span[b-e276glvmy8] { font-size: 13px; color: var(--pcs-mid-grey, #8E9292); }
.sym-view__empty--panel[b-e276glvmy8] { height: 100%; border: none; padding: 24px; }

/* ── right: property panel ───────────────────────────────────────────────── */
.sym-view__props[b-e276glvmy8] {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.sym-view__props-title[b-e276glvmy8] {
    margin: 0;
    font-family: var(--pcs-font-display, 'Inter', sans-serif);
    font-weight: 700;
    font-size: 18px;
    line-height: 1.25;
}

.sym-view__props-body[b-e276glvmy8] { flex: 1; min-height: 0; overflow: auto; }

.sym-view__section[b-e276glvmy8] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--pcs-light-grey-1, #DEDEDE);
}
.sym-view__section:last-child[b-e276glvmy8] { border-bottom: none; padding-bottom: 28px; }

.sym-view__section-head[b-e276glvmy8] { display: flex; align-items: center; gap: 8px; }

.sym-view__preview[b-e276glvmy8] {
    background: var(--pcs-light-grey-3, #F4F4F4);
    border: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    border-radius: 8px;
    padding: 18px;
}
/* CadSvgWriter emits a viewBox and no width/height, so the SVG's aspect ratio is
   the geometry's. height:auto lets the box follow it — the old fixed height forced
   a 1.74 aspect viewport, and preserveAspectRatio letterboxed tall symbols into a
   narrow column of a mostly empty box. max-height then caps a very tall symbol;
   the replaced-element min/max rules shrink the width with it, so the ratio holds
   and margin:auto keeps it centred. */
.sym-view__preview[b-e276glvmy8]  svg {
    display: block;
    width: 100%;
    height: auto;
    max-height: 320px;
    margin: 0 auto;
}

.sym-view__preview-meta[b-e276glvmy8] { display: flex; align-items: center; justify-content: space-between; gap: 10px; }

.sym-view__pill[b-e276glvmy8] {
    display: inline-flex;
    align-items: center;
    height: calc(22px + 2px);
    padding: 0 10px;
    border: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    border-radius: 20px;
    font-size: 11px;
    color: var(--pcs-atoll, #30597C);
}

.sym-view__desc[b-e276glvmy8] { margin: 0; font-size: 13px; line-height: 1.55; }

.sym-view__deflist[b-e276glvmy8] {
    display: grid;
    grid-template-columns: 132px 1fr;
    gap: 10px;
    margin: 0;
}
.sym-view__deflist dt[b-e276glvmy8] { font-size: 12.5px; color: var(--pcs-mid-grey, #8E9292); }
.sym-view__deflist dd[b-e276glvmy8] { margin: 0; font-weight: 500; font-size: 13px; }

.sym-view__chips[b-e276glvmy8] { position: relative; display: flex; flex-wrap: wrap; gap: 6px; }

.sym-view__chip[b-e276glvmy8] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    height: calc(26px + 2px);
    padding: 0 3px 0 11px;
    border: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    border-radius: 20px;
    background: #fff;
    font-size: 12.5px;
    transition: border-color .15s;
}
.sym-view__chip:hover[b-e276glvmy8] { border-color: var(--pcs-accent); }
.sym-view__chip-label[b-e276glvmy8] { cursor: pointer; }
.sym-view__conn[b-e276glvmy8] {
    display: grid;
    grid-template-columns: 36px 1fr 78px 72px;
    gap: 8px;
    align-items: center;
    height: calc(28px + 1px);
    border-top: 1px solid var(--pcs-light-grey-1, #DEDEDE);
    font-size: 12.5px;
}
.sym-view__conn--head[b-e276glvmy8] {
    border-top: none;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: .6px;
    text-transform: uppercase;
    color: var(--pcs-silver, #C8C6C4);
}

.sym-view__version[b-e276glvmy8] { display: flex; align-items: baseline; gap: 8px; }

/* ── menus, confirm ──────────────────────────────────────────────────────── */
.sym-view__menu[b-e276glvmy8] {
    position: fixed;
    z-index: 200;
    width: calc(232px + 12px);
    max-height: calc(260px + 12px);
    overflow: auto;
    padding: 6px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 4px 20px rgba(0,0,0,.12);
}
.sym-view__menu--inline[b-e276glvmy8] { position: absolute; top: 32px; left: 0; width: calc(250px + 12px); }

.sym-view__menu button[b-e276glvmy8] {
    display: block;
    width: 100%;
    height: 32px;
    padding: 0 10px;
    border: none;
    border-radius: 4px;
    background: transparent;
    text-align: left;
    font-size: 13px;
    color: inherit;
    cursor: pointer;
    transition: background .15s;
}
.sym-view__menu button:hover[b-e276glvmy8] { background: var(--pcs-light-grey-3, #F4F4F4); }
.sym-view__menu button:disabled[b-e276glvmy8] { color: var(--pcs-silver, #C8C6C4); cursor: not-allowed; }
.sym-view__menu-danger:not(:disabled)[b-e276glvmy8] { color: var(--pcs-danger); }
.sym-view__menu-title[b-e276glvmy8] { padding: 6px 10px 8px; font-weight: 500; font-size: 11px; letter-spacing: .6px; text-transform: uppercase; color: var(--pcs-mid-grey, #8E9292); }
.sym-view__menu-sep[b-e276glvmy8] { height: var(--pcs-hairline); margin: 5px 0; background: var(--pcs-light-grey-1, #DEDEDE); }

.sym-view__confirm[b-e276glvmy8] {
    position: fixed;
    z-index: 210;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(300px + 40px);
    padding: 20px;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 8px 32px rgba(0,0,0,.12);
}
.sym-view__confirm-title[b-e276glvmy8] { font-weight: 600; font-size: 14px; }
.sym-view__confirm-body[b-e276glvmy8] { margin-top: 6px; font-size: 12.5px; line-height: 1.45; color: var(--pcs-mid-grey, #8E9292); }
/* Layout only — the group is a PcsButtonGroup, so the class lands on its own
   root and needs ::deep to reach from here. */
.sym-view__confirm[b-e276glvmy8]  .sym-view__confirm-actions { margin-top: 16px; }
/* Blazor-scoped additions for the Cube page */
/* Takes the slack so Edit and Delete sit together at the right edge, and shrinks
   below its title's width rather than pushing them out of a narrowed pane. */
.sym-view__props-ident[b-e276glvmy8] { min-width: 0; flex: 1; }

.sym-view__scrim[b-e276glvmy8] {
    position: fixed;
    inset: 0;
    z-index: 205;
    background: rgba(0,0,0,.35);
}

.sym-view__row[b-e276glvmy8] { user-select: none; }


.sym-view__more[b-e276glvmy8] {
    display: flex;
    justify-content: center;
    padding: var(--pcs-sp-15) 0;
}
/* /Features/TenantSettings/SubSettings/ComponentClassesSection.razor.rz.scp.css */
.cc[b-cz34m3vvlb] {
    display: grid;
    grid-template-columns: minmax(200px, 280px) minmax(0, 1fr);
    gap: var(--pcs-sp-15);
    flex: 1 1 auto;
    min-height: 0;
}

.cc__tree[b-cz34m3vvlb],
.cc__detail[b-cz34m3vvlb] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    min-width: 0;
    min-height: 0;
}

.cc__head[b-cz34m3vvlb],
.cc__title[b-cz34m3vvlb] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-4);
}

.cc__spacer[b-cz34m3vvlb] {
    flex: 1;
}

.cc__nodes[b-cz34m3vvlb] {
    overflow: auto;
    max-height: 60vh;
}
/* /Features/TenantSettings/SubSettings/ProjectFieldsSection.razor.rz.scp.css */
/* Layout only. */
.pfields__actions[b-fikan52jsx] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;
}

.pfields__add[b-fikan52jsx] {
    padding: 8px 0 12px;
}
/* /Features/UserSettings/KeyboardMapView.razor.rz.scp.css */
.kbmap[b-69j3awllk6] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: var(--pcs-sp-20) var(--pcs-sp-30) var(--pcs-sp-24);
}

.kbmap__bar[b-69j3awllk6] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-15);
    flex-wrap: wrap;
}

.kbmap__spacer[b-69j3awllk6] {
    flex: 1;
}

.kbmap__label[b-69j3awllk6] {
    font: normal normal 500 11px/14px var(--pcs-font-ui);
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.kbmap__layers[b-69j3awllk6],
.kbmap__chips[b-69j3awllk6] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--pcs-sp-4);
}

.kbmap__legend[b-69j3awllk6] {
    display: flex;
    gap: var(--pcs-sp-15);
    font-size: 11.5px;
    color: var(--pcs-fg-3);
}

.kbmap__legend > span[b-69j3awllk6] {
    display: inline-flex;
    align-items: center;
    gap: var(--pcs-sp-4);
}

.kbmap__swatch[b-69j3awllk6] {
    width: 12px;
    height: 12px;
    border-radius: var(--pcs-radius-xs);
}

.kbmap__swatch--bound[b-69j3awllk6] {
    background: var(--pcs-atoll);
}

.kbmap__swatch--free[b-69j3awllk6] {
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
}

.kbmap__swatch--reserved[b-69j3awllk6] {
    background: var(--pcs-light-grey-2);
    border: 1px solid var(--pcs-danger);
}

.kbmap__swatch--fixed[b-69j3awllk6] {
    background: var(--pcs-light-grey-2);
}

.kbmap__fallback[b-69j3awllk6] {
    margin: 0;
    font-size: 12px;
    color: var(--pcs-fg-3);
}

/* ── The board ────────────────────────────────────────────────────────── */
.kbmap__board[b-69j3awllk6] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: var(--pcs-sp-20);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-light-grey-3);
    overflow-x: auto;
}

.kbmap__row[b-69j3awllk6] {
    display: flex;
    gap: var(--pcs-sp-4);
}

[b-69j3awllk6] .kbmap__key {
    flex: none;
    height: 44px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 6px 7px;
    border: 1px solid var(--pcs-border);
    border-bottom-width: 2px;
    border-radius: var(--pcs-radius-xs);
    background: var(--pcs-white);
    color: var(--pcs-charcoal);
    text-align: left;
    overflow: hidden;
}

[b-69j3awllk6] .kbmap__key:focus-visible {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

[b-69j3awllk6] .kbmap__key--bound {
    background: var(--pcs-atoll);
    border-color: var(--pcs-atoll);
    color: var(--pcs-white);
}

/* Hatched rather than merely red: "the browser gets this one first" is a
   different kind of unavailable from "someone already took it", and the
   texture says so without needing the legend. */
[b-69j3awllk6] .kbmap__key--reserved {
    background: repeating-linear-gradient(135deg,
            var(--pcs-light-grey-2) 0 3px,
            var(--pcs-light-grey-1) 3px 6px);
    border-color: var(--pcs-danger);
    color: var(--pcs-danger);
}

[b-69j3awllk6] .kbmap__key--fixed {
    background: var(--pcs-light-grey-2);
    color: var(--pcs-mid-grey);
    cursor: default;
}

[b-69j3awllk6] .kbmap__key.is-selected {
    box-shadow: 0 0 0 2px var(--pcs-white), 0 0 0 4px var(--pcs-focus-color);
}

.kbmap__cap[b-69j3awllk6] {
    font: normal normal 600 11px/1 var(--pcs-font-ui);
}

.kbmap__cmd[b-69j3awllk6] {
    max-width: 100%;
    font: normal normal 400 9px/1.1 var(--pcs-font-ui);
    opacity: 0.85;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── The two panes under the board ────────────────────────────────────── */
.kbmap__panes[b-69j3awllk6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--pcs-sp-15);
    align-items: stretch;
}

.kbmap__pane[b-69j3awllk6] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-15) var(--pcs-sp-20);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
}

.kbmap__pane-head[b-69j3awllk6] {
    display: flex;
    align-items: baseline;
    gap: var(--pcs-sp-10);
}

.kbmap__pane-keys[b-69j3awllk6] {
    display: flex;
    gap: var(--pcs-sp-4);
}

/* The title takes the slack and the note sits against the right edge. The
   title is the only thing here that may grow, which is why the head carries no
   separate spacer: two flex:1 children split the row and squeezed a two-word
   heading onto two lines. */
.kbmap__pane-title[b-69j3awllk6] {
    flex: 1;
    min-width: 0;
    font: normal normal 600 14px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kbmap__pane-head .kbmap__note[b-69j3awllk6] {
    flex: none;
}

.kbmap__pane-desc[b-69j3awllk6] {
    margin: 0;
    font-size: 12.5px;
    line-height: 18px;
    color: var(--pcs-fg-3);
    text-wrap: pretty;
}

.kbmap__pane-actions[b-69j3awllk6] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: var(--pcs-sp-4);
}

[b-69j3awllk6] .kbmap__picker {
    width: 230px;
}

.kbmap__note[b-69j3awllk6] {
    font-size: 11.5px;
    color: var(--pcs-fg-3);
}

[b-69j3awllk6] .kbmap__tier--safe {
    border-color: var(--pcs-success);
    color: var(--pcs-success);
}

[b-69j3awllk6] .kbmap__tier--costly {
    border-color: var(--pcs-warning);
    color: var(--pcs-warning);
}

[b-69j3awllk6] .kbmap__tier--reserved {
    border-color: var(--pcs-danger);
    color: var(--pcs-danger);
}
/* /Features/UserSettings/KeyboardSection.razor.rz.scp.css */
/* Layout only — colour, type and borders come from the primitives and the
   tokens (ADR-0044). The panel fills the settings detail pane and scrolls
   internally: the command list and the detail pane scroll independently, so
   picking a command near the bottom of a long list does not move the list. */
.kbset[b-1a5ok11ann] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    min-width: 0;
}

.kbset__scope[b-1a5ok11ann] {
    margin: 0;
    padding: var(--pcs-sp-10) var(--pcs-sp-24);
    color: var(--pcs-fg-2);
}

.kbset__toolbar[b-1a5ok11ann] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    flex: none;
    padding: var(--pcs-sp-10) var(--pcs-sp-24);
    border-bottom: 1px solid var(--pcs-border);
}

.kbset__spacer[b-1a5ok11ann] {
    flex: 1;
}

.kbset__hint[b-1a5ok11ann],
.kbset__tally[b-1a5ok11ann],
.kbset__note[b-1a5ok11ann] {
    font-size: 12px;
    color: var(--pcs-fg-3);
}

.kbset__alert[b-1a5ok11ann] {
    margin: var(--pcs-sp-10) var(--pcs-sp-24) 0;
}

/* ── Master / detail ──────────────────────────────────────────────────── */
.kbset__split[b-1a5ok11ann] {
    display: flex;
    flex: 1;
    min-height: 0;
}

.kbset__list[b-1a5ok11ann] {
    width: 380px;
    flex: none;
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-right: 1px solid var(--pcs-border);
}

.kbset__filters[b-1a5ok11ann] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    padding: var(--pcs-sp-15);
    border-bottom: 1px solid var(--pcs-light-grey-2);
}

.kbset__chips[b-1a5ok11ann] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--pcs-sp-4);
}

.kbset__rows[b-1a5ok11ann] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    padding: var(--pcs-sp-4) var(--pcs-sp-10) var(--pcs-sp-15);
}

.kbset__eyebrow[b-1a5ok11ann] {
    padding: var(--pcs-sp-10) var(--pcs-sp-4) var(--pcs-sp-4);
    font: normal normal 600 10.5px/14px var(--pcs-font-ui);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pcs-fg-2);
}

[b-1a5ok11ann] .kbset__row {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-4);
    width: 100%;
    height: 34px;
    padding: 0 var(--pcs-sp-10);
    border-radius: var(--pcs-radius-sm);
    font: normal normal 400 13px/34px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
    text-align: left;
    transition: background var(--pcs-transition);
}

[b-1a5ok11ann] .kbset__row:hover {
    background: var(--pcs-light-grey-3);
}

[b-1a5ok11ann] .kbset__row.is-selected {
    background: var(--pcs-light-grey-3);
    font-weight: 600;
}

[b-1a5ok11ann] .kbset__row:focus-visible {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: -2px;
}

.kbset__row-name[b-1a5ok11ann] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* A changed binding, and the louder mark for one that two commands share. */
.kbset__dot[b-1a5ok11ann] {
    width: 6px;
    height: 6px;
    flex: none;
    border-radius: var(--pcs-radius-pill);
    background: var(--pcs-accent);
}

.kbset__dot--conflict[b-1a5ok11ann] {
    background: var(--pcs-warning);
}

.kbset__notset[b-1a5ok11ann] {
    font-size: 11px;
    color: var(--pcs-fg-3);
}

/* ── Detail ───────────────────────────────────────────────────────────── */
/* The search anchor wraps the detail pane, so it is the flex child now and has
   to carry the sizing the pane used to. */
.kbset__split[b-1a5ok11ann]  .kbset__detail-anchor {
    display: flex;
    flex: 1;
    min-width: 0;
}

/* PcsSettingsAnchor's reveal flash defaults to a negative horizontal inset, so
   it bleeds 8px past its element — right, for a narrow row sitting inside a
   padded container. These two anchors are full width, so that bleed reached
   past the dialog's content edge and gave the settings body a horizontal
   scrollbar for the 1.8s the flash lasted. Inset it instead: there is already
   padding to flash within. */
.kbset[b-1a5ok11ann]  .kbset__toolbar-anchor,
.kbset__split[b-1a5ok11ann]  .kbset__detail-anchor {
    --pcs-settings-flash-inset: var(--pcs-sp-4) var(--pcs-sp-10);
}

.kbset__detail[b-1a5ok11ann] {
    flex: 1;
    min-width: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-20);
    padding: var(--pcs-sp-24) var(--pcs-sp-30);
}

.kbset__detail-head[b-1a5ok11ann] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
}

.kbset__detail-head .kbset__eyebrow[b-1a5ok11ann] {
    padding: 0;
}

.kbset__title[b-1a5ok11ann] {
    margin: 0;
    font: normal normal 600 20px/26px var(--pcs-font-display);
    color: var(--pcs-charcoal);
}

.kbset__desc[b-1a5ok11ann] {
    margin: 0;
    font-size: 13px;
    line-height: 19px;
    color: var(--pcs-fg-3);
    text-wrap: pretty;
}

.kbset__field[b-1a5ok11ann] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
}

.kbset__label[b-1a5ok11ann] {
    font: normal normal 500 11px/14px var(--pcs-font-ui);
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.kbset__box[b-1a5ok11ann] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-15);
    min-height: 56px;
    padding: 0 var(--pcs-sp-20);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-white);
}

.kbset__box--capture[b-1a5ok11ann] {
    border-color: var(--pcs-focus-color);
    cursor: default;
}

.kbset__box--capture:focus-visible[b-1a5ok11ann] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

.kbset__box-keys[b-1a5ok11ann] {
    display: flex;
    flex: 1;
    gap: var(--pcs-sp-4);
    min-width: 0;
}

.kbset__capturing[b-1a5ok11ann] {
    display: inline-flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    flex: 1;
    font-size: 13px;
    color: var(--pcs-atoll);
}

.kbset__pulse[b-1a5ok11ann] {
    width: 7px;
    height: 7px;
    border-radius: var(--pcs-radius-pill);
    background: var(--pcs-atoll);
    animation: pcs-kbset-pulse-b-1a5ok11ann 1.4s ease-in-out infinite;
}

@keyframes pcs-kbset-pulse-b-1a5ok11ann {
    50% {
        opacity: 0.25;
    }
}

@media (prefers-reduced-motion: reduce) {
    .kbset__pulse[b-1a5ok11ann] {
        animation: none;
    }
}

.kbset__banner[b-1a5ok11ann] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
}

.kbset__banner-text[b-1a5ok11ann] {
    display: inline;
}

.kbset__banner-actions[b-1a5ok11ann] {
    display: flex;
    gap: var(--pcs-sp-10);
}

.kbset__meta-row[b-1a5ok11ann] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-15);
    font-size: 12px;
    color: var(--pcs-fg-3);
}

/* ── Facts grid ───────────────────────────────────────────────────────── */
.kbset__facts[b-1a5ok11ann] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--pcs-sp-10) var(--pcs-sp-24);
    margin: 0;
    padding-top: var(--pcs-sp-20);
    border-top: 1px solid var(--pcs-light-grey-2);
    font-size: 13px;
    line-height: 18px;
}

.kbset__facts dt[b-1a5ok11ann] {
    color: var(--pcs-fg-3);
}

.kbset__facts dd[b-1a5ok11ann] {
    margin: 0;
    color: var(--pcs-charcoal);
}

/* The tier chip borrows PcsBadge's outline shape and recolours it — the three
   tiers are a scale, and a neutral chip would not carry that. */
.kbset__tier--safe[b-1a5ok11ann] {
    border-color: var(--pcs-success);
    color: var(--pcs-success);
}

.kbset__tier--costly[b-1a5ok11ann] {
    border-color: var(--pcs-warning);
    color: var(--pcs-warning);
}

.kbset__tier--reserved[b-1a5ok11ann] {
    border-color: var(--pcs-danger);
    color: var(--pcs-danger);
}

.kbset__actions[b-1a5ok11ann] {
    display: flex;
    gap: var(--pcs-sp-10);
    flex: none;
    padding: var(--pcs-sp-15) var(--pcs-sp-24);
    border-top: 1px solid var(--pcs-border);
}
/* /Features/UserSettings/LanguageRegionSection.razor.rz.scp.css */
/* Layout only — control styling comes from the shared .pcs-input rules. */

.uset-lang__scope[b-mj4ok3x69i] {
    margin: 0;
    padding: 14px 32px 0;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

[b-mj4ok3x69i] .uset-lang__select {
    width: 320px;
}

.uset-lang__preview[b-mj4ok3x69i] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 24px;
    margin: 0;
    padding: 8px 0 12px;
}

.uset-lang__preview dt[b-mj4ok3x69i] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.uset-lang__preview dd[b-mj4ok3x69i] {
    margin: 0;
    font: normal normal 500 14px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    font-variant-numeric: tabular-nums;
}

.uset-lang__actions[b-mj4ok3x69i] {
    padding: 4px 0 12px;
}
/* /Features/UserSettings/ProfileSection.razor.rz.scp.css */
/* Layout only — control styling comes from the design-system primitives. */

[b-toatmbqivl] .uset__input {
    width: 320px;
}

.uset__memberships[b-toatmbqivl] {
    display: flex;
    flex-direction: column;
    padding: 8px 0 12px;
}

.uset__membership[b-toatmbqivl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 8px 8px 0;
    border-bottom: 1px solid var(--pcs-light-grey-2);
}

.uset__membership-tenant[b-toatmbqivl] {
    font: normal normal 500 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.uset__membership-meta[b-toatmbqivl] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.uset__export[b-toatmbqivl] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 0 12px;
}

.uset__export-hint[b-toatmbqivl] {
    margin: 0;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* Raw JSON dump — mono, scrollable, hairline-framed (a future PcsCodeBlock
   primitive candidate). */
.uset__export-json[b-toatmbqivl] {
    margin: 0;
    max-width: 100%;
    max-height: calc(320px + 24px + 2px);
    overflow: auto;
    padding: 12px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-light-grey-3);
    font-family: var(--pcs-font-mono);
    font-size: 12px;
    white-space: pre-wrap;
    word-break: break-all;
}
/* /Layout/AdminLayout.razor.rz.scp.css */
/* ── Shell ─────────────────────────────────────────────────────────── */

.admin-shell[b-t9c4rbfnq1] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: var(--pcs-bg-canvas);
}

.admin-shell__body[b-t9c4rbfnq1] {
    flex: 1;
    display: flex;
    min-height: 0;
}

/* ── Sidebar ───────────────────────────────────────────────────────── */

.admin-sidebar[b-t9c4rbfnq1] {
    width: calc(240px + 24px + 1px);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    background: var(--pcs-white);
    border-right: 1px solid var(--pcs-border);
    padding: 20px 12px;
}

.admin-sidebar__section[b-t9c4rbfnq1] {
    padding: 0 12px 8px;
    font-family: var(--pcs-font-ui);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.admin-sidebar__nav[b-t9c4rbfnq1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* NavLink renders its own <a>, so the link styling must pierce the scope. */
.admin-sidebar[b-t9c4rbfnq1]  .admin-sidebar__link {
    display: block;
    padding: 9px 12px;
    border-radius: var(--pcs-radius-md);
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
    text-decoration: none;
    transition: background-color var(--pcs-transition);
}

.admin-sidebar[b-t9c4rbfnq1]  .admin-sidebar__link:hover {
    background: var(--pcs-light-grey-3);
}

.admin-sidebar[b-t9c4rbfnq1]  .admin-sidebar__link.is-active {
    background: var(--pcs-light-grey-2);
    color: var(--pcs-atoll);
    font-weight: 600;
}

.admin-sidebar__footer[b-t9c4rbfnq1] {
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid var(--pcs-border-soft);
}

/* ── Content region + shared admin design system (pierces into pages) ── */

.admin-content[b-t9c4rbfnq1] {
    flex: 1;
    min-width: 0;
    overflow: auto;
    padding: 28px 36px 48px;
    background: var(--pcs-white);
}

.admin-content[b-t9c4rbfnq1]  .admin-page {
    max-width: 980px;
}

.admin-content[b-t9c4rbfnq1]  .admin-page__head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
}

.admin-content[b-t9c4rbfnq1]  .admin-page__head h1 {
    margin: 0;
    font: normal normal 600 20px/26px var(--pcs-font-display);
    color: var(--pcs-charcoal);
}

.admin-content[b-t9c4rbfnq1]  .admin-page__head-spacer {
    flex: 1;
}

.admin-content[b-t9c4rbfnq1]  h2 {
    margin: 28px 0 12px;
    font: normal normal 600 15px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

/* Buttons are PcsButton (design system) — no admin-specific button styling. */

/* Tables — same flat list style as the projects table on the home page */
.admin-content[b-t9c4rbfnq1]  .admin-table {
    width: 100%;
    border-collapse: collapse;
    border-top: 1px solid var(--pcs-border);
}

.admin-content[b-t9c4rbfnq1]  .admin-table th {
    height: 40px;
    text-align: left;
    padding: 0 8px;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
    border-bottom: 1px solid var(--pcs-border);
}

.admin-content[b-t9c4rbfnq1]  .admin-table td {
    height: 56px;
    padding: 0 8px;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    border-bottom: 1px solid var(--pcs-light-grey-2);
    vertical-align: middle;
}

.admin-content[b-t9c4rbfnq1]  .admin-table tbody tr.is-clickable {
    cursor: pointer;
    transition: background-color var(--pcs-transition);
}

.admin-content[b-t9c4rbfnq1]  .admin-table tbody tr.is-clickable:hover {
    background: var(--pcs-light-grey-3);
}

.admin-content[b-t9c4rbfnq1]  .admin-table .admin-table__actions {
    text-align: right;
    white-space: nowrap;
}

/* Table/toolbar selects are .pcs-input .pcs-input--sm (app.css baseline). */

/* Forms */
.admin-content[b-t9c4rbfnq1]  .admin-form {
    max-width: calc(480px + 48px + 2px);
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    padding: 24px;
}

/* A bare checkbox is one more row in the stack, and PcsFormField's rows carry
   the same 16px. The control itself carries none — it is also used inline. */
.admin-content[b-t9c4rbfnq1]  .admin-form .pcs-checkbox {
    margin-bottom: 16px;
}

.admin-content[b-t9c4rbfnq1]  .admin-form__actions {
    display: flex;
    gap: 10px;
    margin-top: 8px;
}

.admin-content[b-t9c4rbfnq1]  .admin-field-error {
    display: block;
    margin: -10px 0 14px;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-danger);
}

.admin-content[b-t9c4rbfnq1]  .validation-message {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-danger);
}

/* Alerts are PcsAlert (design system). */

/* Cards (seat usage etc.) */
.admin-content[b-t9c4rbfnq1]  .admin-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 24px;
}

.admin-content[b-t9c4rbfnq1]  .admin-card {
    min-width: calc(220px + 40px + 2px);
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    padding: 16px 20px;
}

.admin-content[b-t9c4rbfnq1]  .admin-card__title {
    font: normal normal 600 14px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    margin-bottom: 6px;
}

.admin-content[b-t9c4rbfnq1]  .admin-card__line {
    font: normal normal 400 12px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* Danger zone */
.admin-content[b-t9c4rbfnq1]  .admin-danger-zone {
    max-width: calc(480px + 40px + 2px);
    margin-top: 32px;
    border: 1px solid var(--pcs-danger);
    border-radius: var(--pcs-radius-md);
    padding: 16px 20px;
    background: var(--pcs-white);
}

.admin-content[b-t9c4rbfnq1]  .admin-danger-zone h2 {
    margin: 0 0 10px;
    color: var(--pcs-danger);
}

/* Misc — empty/loading placeholders are PcsEmptyState (design system). */
.admin-content[b-t9c4rbfnq1]  .admin-link {
    font: normal normal 500 13px/18px var(--pcs-font-ui);
    color: var(--pcs-link);
    text-decoration: none;
}

.admin-content[b-t9c4rbfnq1]  .admin-link:hover {
    color: var(--pcs-link-hover);
    text-decoration: underline;
}

.admin-content[b-t9c4rbfnq1]  .admin-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.admin-content[b-t9c4rbfnq1]  .admin-meta {
    display: flex;
    gap: 24px;
    margin: 0 0 20px;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.admin-content[b-t9c4rbfnq1]  .admin-pre {
    max-width: calc(720px + 32px + 2px);
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    padding: 16px;
    font-family: var(--pcs-font-mono);
    font-size: 12px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-all;
}

/* Base textarea look comes from the form-control baseline (app.css); this
   keeps only the token-dump specifics. */
.admin-content[b-t9c4rbfnq1]  .admin-token {
    max-width: 720px;
    min-height: 140px;
    font-family: var(--pcs-font-mono);
    font-size: 12px;
}

/* Claims editor */
.admin-content[b-t9c4rbfnq1]  .claims-editor {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 16px;
}

.admin-content[b-t9c4rbfnq1]  .claims-editor__row {
    display: grid;
    grid-template-columns: 180px 1fr auto;
    align-items: center;
    gap: 12px;
}

.admin-content[b-t9c4rbfnq1]  .claims-editor__label {
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

/* Controls are .pcs-input .pcs-input--sm (app.css baseline); the grid cell
   just needs them to fill. */
.admin-content[b-t9c4rbfnq1]  .claims-editor__row input,
.admin-content[b-t9c4rbfnq1]  .claims-editor__row select {
    width: 100%;
}

.admin-content[b-t9c4rbfnq1]  .claims-editor__error {
    grid-column: 2 / 4;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-danger);
}

.admin-content[b-t9c4rbfnq1]  .claims-editor__add {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 4px;
    border-top: 1px solid var(--pcs-border-soft);
}
/* /Layout/AppShell.razor.rz.scp.css */
.app-shell[b-hj1ouyizct] {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background: var(--pcs-bg-canvas);
    /* The host contract for a PcsDrawer in the Dialogs slot: the drawer anchors to this
       box, and its closed state is translated past the right edge — which widens the
       document unless the overflow is clipped. A widened document scrolls horizontally the
       moment anything inside takes focus, and an absolutely positioned drawer scrolls away
       with it while a fixed popover stays put. The shell already spans the viewport, so
       becoming a containing block moves nothing that was anchored to it before. */
    position: relative;
    overflow-x: clip;
}

.app-shell__body[b-hj1ouyizct] {
    flex: 1;
    display: flex;
    min-height: 0;
}

.app-shell__main[b-hj1ouyizct] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 480px;
    min-height: 0;
    background: var(--pcs-light-grey-2);
}
/* /Layout/UserMenu.razor.rz.scp.css */
.user-menu[b-vlgv5lrq8m] {
    position: relative;
}

/* Anonymous fallback — a plain sign-in link where the trigger would sit. */
.user-menu__signin[b-vlgv5lrq8m] {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: var(--pcs-radius-pill);
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-atoll);
    text-decoration: none;
    transition: background-color var(--pcs-transition);
}

.user-menu__signin:hover[b-vlgv5lrq8m] {
    background: var(--pcs-light-grey-3);
}

.user-menu__trigger[b-vlgv5lrq8m] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--pcs-radius-pill);
    padding: 4px 10px 4px 4px;
    cursor: pointer;
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    transition: background-color var(--pcs-transition), border-color var(--pcs-transition);
}

.user-menu__trigger:hover[b-vlgv5lrq8m],
.user-menu__trigger.is-open[b-vlgv5lrq8m] {
    background: var(--pcs-light-grey-3);
    border-color: var(--pcs-border);
}

.user-menu__avatar[b-vlgv5lrq8m] {
    width: 30px;
    height: 30px;
    border-radius: var(--pcs-radius-pill);
    background: var(--pcs-light-grey-2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.user-menu__name[b-vlgv5lrq8m] {
    white-space: nowrap;
}

.user-menu__chevron[b-vlgv5lrq8m] {
    width: calc(7px + 1.5px);
    height: calc(7px + 1.5px);
    margin-left: 2px;
    border-right: 1.5px solid var(--pcs-mid-grey);
    border-bottom: 1.5px solid var(--pcs-mid-grey);
    transform: rotate(45deg) translate(-1px, -1px);
    transition: transform var(--pcs-transition);
}

.user-menu__trigger.is-open .user-menu__chevron[b-vlgv5lrq8m] {
    transform: rotate(-135deg) translate(-1px, -1px);
}

/* Click-trap behind the dropdown so an outside click closes it. */
.user-menu__scrim[b-vlgv5lrq8m] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}

.user-menu__dropdown[b-vlgv5lrq8m] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 220px;
    background: var(--pcs-white);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    padding: 6px 0;
    z-index: 60;
    display: flex;
    flex-direction: column;
}

.user-menu__identity[b-vlgv5lrq8m] {
    padding: 8px 16px 10px;
}

.user-menu__identity-name[b-vlgv5lrq8m] {
    font: normal normal 600 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.user-menu__identity-mail[b-vlgv5lrq8m] {
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    color: var(--pcs-mid-grey);
    margin-top: 2px;
}

.user-menu__sep[b-vlgv5lrq8m] {
    height: var(--pcs-hairline);
    background: var(--pcs-border);
    margin: 4px 0;
}

.user-menu__item[b-vlgv5lrq8m] {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 7px 16px;
    text-align: left;
    cursor: pointer;
    font-family: var(--pcs-font-ui);
    font-size: 13px;
    color: var(--pcs-fg-1);
    transition: background-color var(--pcs-transition);
    display: flex;
    align-items: center;
}

.user-menu__item:hover[b-vlgv5lrq8m] {
    background: var(--pcs-light-grey-3);
}

.user-menu__section-label[b-vlgv5lrq8m] {
    padding: 6px 16px 2px;
    font-family: var(--pcs-font-ui);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.user-menu__item.is-active[b-vlgv5lrq8m] {
    color: var(--pcs-atoll);
    font-weight: 600;
}

.user-menu__item.is-active[b-vlgv5lrq8m]::after {
    content: "\2713";
    margin-left: auto;
    padding-left: 12px;
}

.user-menu__item--danger[b-vlgv5lrq8m] {
    color: var(--pcs-danger);
}

.user-menu__item--danger:hover[b-vlgv5lrq8m] {
    background: var(--pcs-danger);
    color: var(--pcs-white);
}
/* /Shared/Cad/CadCanvas.razor.rz.scp.css */
.cad-canvas[b-1kuy5wyn8j] {
    display: block;
    width: 100%;
    height: 100%;
    touch-action: none; /* pointer events own the gestures */
    background: #fff;
}
/* /Shared/Cad/CadFloatingBar.razor.rz.scp.css */
/* Floats over the drawing: centred at the top until the user drags it, then
   wherever pcs.floatDrag put it (left/top written, transform cleared).
   Above the canvas, below the context menu and the picker. */
.cad-bar[b-y3f8lwkp24] {
    --pcs-control-h-sm: var(--pcs-control-h-dense-md);
    --pcs-control-pad-sm: var(--pcs-control-pad-dense);

    position: absolute;
    left: 50%;
    top: 12px;
    transform: translateX(-50%);
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 44px;
    padding: 0 8px 0 2px;
    background: var(--pcs-white);
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-lg);
    box-shadow: var(--pcs-shadow-menu);
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
    white-space: nowrap;
}

.cad-bar__grip[b-y3f8lwkp24] {
    display: inline-flex;
    align-items: center;
    align-self: stretch;
    padding: 0 4px;
    color: var(--pcs-fg-2);
    cursor: var(--pcs-cursor-grab);
    touch-action: none;
    user-select: none;
}

/* Hairline between kinds of control, on the row's own scale — 22px against a
   44px bar, the way the ribbon's divider is 28 against 46. */
.cad-bar__sep[b-y3f8lwkp24] {
    flex: none;
    width: var(--pcs-hairline);
    height: 22px;
    background: var(--pcs-border);
    margin: 0 4px;
}
/* /Shared/Cad/CadSelectionToolbar.razor.rz.scp.css */
/* The toolbar is the content of a CadFloatingBar, which owns where it sits. */
.cad-sel__kind[b-l1ssv6sift] {
    font-weight: 600;
}

/* Hairline between kinds of control, on the row's own scale — 22px against a
   44px bar, the way the ribbon's divider is 28 against 46. */
.cad-sel__sep[b-l1ssv6sift] {
    flex: none;
    width: var(--pcs-hairline);
    height: 22px;
    background: var(--pcs-border);
    margin: 0 4px;
}

.cad-sel__field[b-l1ssv6sift] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.cad-sel__key[b-l1ssv6sift] {
    font-weight: 600;
    color: var(--pcs-fg-2);
}

.cad-sel__unit[b-l1ssv6sift] {
    color: var(--pcs-fg-3);
}

.cad-sel__more[b-l1ssv6sift] {
    display: inline-flex;
}

/* Layout only; the heights come from the dense scale above. Wide enough for
   a millimetre reading at the precision the document keeps it — 104,142 was
   clipping at 74px and running under the unit beside it. */
[b-l1ssv6sift] .cad-sel__num {
    flex: none;
    width: 92px;
}

[b-l1ssv6sift] .cad-sel__dash {
    flex: none;
    width: 96px;
}

[b-l1ssv6sift] .cad-sel__layer {
    flex: none;
    width: 112px;
}
/* /Shared/Cad/CadTextDialog.razor.rz.scp.css */
.text-note[b-dmch0vhypu] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
    min-width: 360px;
}

/* Both modes render into the same box so the dialog never resizes on toggle:
   label + textarea (free text) ≈ label + select + hint (value). */
.text-note__content[b-dmch0vhypu] {
    min-height: 132px;
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
}

.text-note textarea[b-dmch0vhypu] {
    resize: vertical;
    min-height: 76px;
}

/* ── Advanced display settings (collapsed by default) ─────────────────── */
/* Rule separating the content from the display settings. */
.text-note__divider[b-dmch0vhypu] {
    border-top: 1px solid var(--pcs-border);
}

.text-note__advanced[b-dmch0vhypu] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
}

/* Font · style · colour on one row; the font select takes the slack. */
.text-note__row[b-dmch0vhypu] {
    display: flex;
    align-items: flex-start;
    gap: var(--pcs-sp-15);
}

.text-note__row-grow[b-dmch0vhypu] {
    flex: 1;
    min-width: 0;
}

.text-note__row[b-dmch0vhypu]  .form-field {
    margin-bottom: 0;
}

.text-note__color[b-dmch0vhypu] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.text-note__hint[b-dmch0vhypu] {
    margin: 0;
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.text-note__intro[b-dmch0vhypu] {
    margin: 0;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* The sample renders on the page's paper white so the chosen colour reads as
   it will on the canvas; the font/weight/colour themselves are inline data. */
.text-note__preview[b-dmch0vhypu] {
    padding: 12px 14px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-white);
    color: var(--pcs-charcoal);
    font-size: 18px;
    line-height: 24px;
    overflow-wrap: anywhere;
    white-space: pre-wrap; /* the note's line breaks show as on the page */
}

/* The B/I/U marks: PcsIconButton owns the box and the pressed state, this file
   only says what the letter looks like. The spans are ChildContent, so they are
   compiled here and carry this file's scope id. */
.text-note__emphasis-mark[b-dmch0vhypu] {
    font-family: var(--pcs-font-ui);
    font-size: 13px;
}

.text-note__emphasis-mark--bold[b-dmch0vhypu] {
    font-weight: 700;
}

.text-note__emphasis-mark--italic[b-dmch0vhypu] {
    font-style: italic;
}

.text-note__emphasis-mark--underline[b-dmch0vhypu] {
    text-decoration: underline;
}

/* The mapping picker spans the dialog, like the text area it replaces. */
.text-note[b-dmch0vhypu]  .text-note__mapping {
    max-width: none;
}
/* /Shared/Components/Chrome/PcsRibbon.razor.rz.scp.css */
.ribbon[b-wtns899gce] {
    height: 60px;
    background: var(--pcs-white);
    border-bottom: 1px solid var(--pcs-border);
    display: flex;
    align-items: center;
    padding: 0 16px;
    gap: 4px;
    flex-shrink: 0;
}

.ribbon__group[b-wtns899gce] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* flex: none because as a real flex item it would otherwise carry the default
   flex-shrink: 1; --pcs-hairline because a 1px rule is 1.5 device pixels at
   150% scaling and snaps to 2 or to 1 depending on where it lands, which is
   why these rendered at two different thicknesses in one row. The heights are
   deliberate: 28px against a 46px tool cell, 20px against a 36px action cell. */
.ribbon__divider[b-wtns899gce] {
    flex: none;
    width: var(--pcs-hairline);
    background: var(--pcs-border);
    height: 28px;
    margin: 0 12px;
}

.ribbon__spacer[b-wtns899gce] {
    flex: 1;
}

/* Right-aligned action button (e.g. undo/redo) injected via the
   Ribbon's ChildContent slot. The ::deep selector is required because
   the consumer component (e.g. Project) renders these buttons —
   without ::deep their CSS isolation scope wouldn't match Ribbon's
   stylesheet. Smaller than a tool button (36 px cell, the 16 px library
   file): app-level actions, not tool selectors — same vocabulary, native
   size (ADR-0067, amended). */
/* .ribbon__action / .ribbon__action-icon / .ribbon__tip are GLOBAL
   (wwwroot/css/app.css), not scoped here: the page-frame editor's toolbar
   offers the same undo, redo and delete, and an action has to look the same
   wherever it is offered. Scoped ::deep rules would have stopped at this
   component and the second toolbar would have re-declared them. */

/* /Shared/Components/Chrome/PcsStatusStrip.razor.rz.scp.css */
.status[b-iokxnjn5r3] {
    height: 22px;
    background: var(--pcs-charcoal);
    color: var(--pcs-blue-mid);
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 0 14px;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
}

/* Editor surfaces (page editor, frame editor) sit on the light panel ground;
   the charcoal default is app chrome. */
.status--light[b-iokxnjn5r3] {
    background: var(--pcs-light-grey-3);
    color: var(--pcs-charcoal);
    border-top: 1px solid var(--pcs-border);
}

/* Segments come from the host component (its own CSS scope), so the strip's
   layout helpers must reach through ::deep. */
.status[b-iokxnjn5r3]  .status__spacer {
    flex: 1;
}
/* /Shared/Components/Chrome/PcsToolOptionsBar.razor.rz.scp.css */
/* 36 px, with the ribbon's 60 px above it: 96 px of chrome, and 4 px of air
   above and below every 28 px control in the row. Chrome geometry, like the
   ribbon's own height and the status strip's.

   The row runs its Small controls one step down the scale, so a 36 px strip
   holds a field with air around it. Re-pointed at the dense token rather than
   given a height of its own: every control in here still resolves to
   pcs-tokens.css, so the row cannot drift from the rest of the app. */
.tool-options[b-thi9n8vghm] {
    --pcs-control-h-sm: var(--pcs-control-h-dense-md);
    --pcs-control-pad-sm: var(--pcs-control-pad-dense);

    height: 36px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 16px;
    background: var(--pcs-white);
    border-top: var(--pcs-hairline) solid var(--pcs-border-soft);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
    white-space: nowrap;
    overflow: hidden;
}

.tool-options__tool[b-thi9n8vghm] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 600;
    color: var(--pcs-fg-1);
}

.tool-options__spacer[b-thi9n8vghm] {
    flex: 1;
}

.tool-options__hint[b-thi9n8vghm] {
    color: var(--pcs-fg-3);
}

/* The row's field widths. They live here rather than in the CAD content that
   uses them because the content is nothing but components — it owns no element
   for its own scope id to land on, so a ::deep rule written there would match
   nothing. The bar's own <div> is the ancestor that makes these resolve, and a
   numeric field left unsized takes a form's width in a 36 px strip. */
.tool-options[b-thi9n8vghm]  .tool-options__width {
    flex: none;
    width: 72px;
}

/* A small whole number — the table tool's rows and columns. */
.tool-options[b-thi9n8vghm]  .tool-options__count {
    flex: none;
    width: 56px;
}

.tool-options[b-thi9n8vghm]  .tool-options__dash {
    flex: none;
    width: 104px;
}

.tool-options[b-thi9n8vghm]  .tool-options__layer {
    flex: none;
    width: 120px;
}
/* /Shared/Components/Chrome/PcsToolOptionsGroup.razor.rz.scp.css */
.tool-options-group[b-awy6mihz4g] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.tool-options-group__label[b-awy6mihz4g] {
    color: var(--pcs-fg-2);
}

/* The bar's own 14px gap sits before the rule; this pays the other side. */
.tool-options-group--separated[b-awy6mihz4g] {
    border-left: var(--pcs-hairline) solid var(--pcs-border);
    padding-left: 14px;
}
/* /Shared/Components/Chrome/PcsTopMenu.razor.rz.scp.css */
.top-menu[b-osyxvfk0gd] {
    height: 60px;
    background: var(--pcs-white);
    border-bottom: 1px solid var(--pcs-border);
    display: flex;
    align-items: center;
    padding: 0 24px;
    gap: 4px;
    flex-shrink: 0;
    position: relative;
    z-index: 50;
}

.brand-block[b-osyxvfk0gd] {
    display: flex;
    flex-direction: column;
    margin-right: 12px;
    line-height: 1;
}

.brand__logo-link[b-osyxvfk0gd] {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.brand__logo[b-osyxvfk0gd] {
    height: 26px;
    width: auto;
    display: block;
    user-select: none;
}

.brand__sub[b-osyxvfk0gd] {
    margin-top: 4px;
    font-family: var(--pcs-font-ui);
    font-weight: 500;
    font-size: 10px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

/* Flexible gap that pushes whatever follows it to the right edge of the
   bar. Placed before the entries when AlignEntriesEnd is set (landing
   page), otherwise before the trailing content so it sits far-right. */
.top-menu__spacer[b-osyxvfk0gd] {
    flex: 1;
}

/* Right-hand cluster (e.g. the user-account menu). */
.top-menu__trailing[b-osyxvfk0gd] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Full-screen click-trap behind any open dropdown so clicking outside closes it. */
.top-menu__scrim[b-osyxvfk0gd] {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: transparent;
}
/* /Shared/Components/Chrome/PcsTopMenuItem.razor.rz.scp.css */
.menu-item-wrapper[b-3f07mxaw0d] {
    position: relative;
}

.top-menu__item[b-3f07mxaw0d] {
    background: transparent;
    border: 0;
    font: normal normal 500 13px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    cursor: pointer;
    padding: 6px 8px;
    border-radius: var(--pcs-radius-control);
    transition: color var(--pcs-transition), background-color var(--pcs-transition);
}

.top-menu__item:hover[b-3f07mxaw0d] {
    color: var(--pcs-atoll);
}

.top-menu__item.is-open[b-3f07mxaw0d] {
    background: var(--pcs-light-grey-3);
    color: var(--pcs-charcoal);
}

.submenu[b-3f07mxaw0d] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    min-width: 220px;
    background: var(--pcs-white);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    padding: 6px 0;
    z-index: 60;
    display: flex;
    flex-direction: column;
}

.submenu__item[b-3f07mxaw0d] {
    display: flex;
    align-items: center;
    width: 100%;
    background: transparent;
    border: 0;
    padding: 7px 16px;
    cursor: pointer;
    font-family: var(--pcs-font-ui);
    font-size: 13px;
    color: var(--pcs-fg-1);
    text-align: left;
    transition: background-color var(--pcs-transition);
}

.submenu__item:hover:not(:disabled)[b-3f07mxaw0d] {
    background: var(--pcs-light-grey-3);
}

/* A command whose preconditions are not met stays visible and reads as
   unavailable — Paste with an empty buffer (F-007 C10). */
.submenu__item:disabled[b-3f07mxaw0d] {
    color: var(--pcs-fg-3);
    cursor: default;
}

/* Fixed-width icon slot — keeps labels aligned whether or not an icon
   is supplied, with a 15px gap to the text. */
.submenu__item-icon[b-3f07mxaw0d] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-right: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.submenu__label[b-3f07mxaw0d] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.submenu__shortcut[b-3f07mxaw0d] {
    margin-left: 24px;
    font-family: var(--pcs-font-mono);
    font-size: 11px;
    color: var(--pcs-mid-grey);
    white-space: nowrap;
}

.submenu__sep[b-3f07mxaw0d] {
    height: var(--pcs-hairline);
    background: var(--pcs-border);
    margin: 4px 0;
}
/* /Shared/Components/Chrome/PcsUnhandledErrorBanner.razor.rz.scp.css */
#blazor-error-ui[b-4hlo4h0vdv] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-4hlo4h0vdv] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Shared/Components/DataManagement/Editors/PcsLanguageTextsEditor.razor.rz.scp.css */
.pcs-language-texts[b-u0r7njax3m] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
}

.pcs-language-texts__row[b-u0r7njax3m] {
    display: grid;
    grid-template-columns: 3.5em minmax(0, 1fr);
    align-items: center;
    gap: var(--pcs-sp-10);
}

.pcs-language-texts__code[b-u0r7njax3m] {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
}
/* /Shared/Components/DataManagement/Editors/PcsPropertyValueEditor.razor.rz.scp.css */
.pcs-property-value-editor[b-vtq7ssb1q0] {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 100%;
}

/* ::deep throughout: a bare PcsTextField/PcsSelect puts Class on its own <input>/<select>,
   which carries that component's scope, not this one's — without it none of these matched,
   every input kept the browser's default width, and a range ran out of its container. */
.pcs-property-value-editor[b-vtq7ssb1q0]  .pcs-input {
    flex: 1 1 auto;
    width: 0;
    min-width: 0;
}

.pcs-property-value-editor[b-vtq7ssb1q0]  .pcs-range,
.pcs-property-value-editor[b-vtq7ssb1q0]  .pcs-spatial {
    flex: 1 1 30%;
}

.pcs-property-value-editor[b-vtq7ssb1q0]  .pcs-unit-select {
    flex: 0 0 auto;
    width: auto;
    max-width: 6em;
}

.pcs-property-value-editor[b-vtq7ssb1q0]  .pcs-colour {
    flex: 0 0 auto;
    width: 3em;
    padding: 0;
}

.pcs-property-value-editor .pcs-binary-size[b-vtq7ssb1q0] {
    white-space: nowrap;
    opacity: .7;
}
/* /Shared/Components/DataManagement/PcsDataGrid.razor.rz.scp.css */
/* Style A from the grid styles canvas, with style B's tinted read-only cells:
   hairline rows, an uppercase header that stays put, the active row tinted and
   its active cell ringed in the focus colour. Sizes to its rows; scrolls once its
   parent runs out of height. Everything the grid draws stays inside it, so it
   never shows a scrollbar for nothing. */
.pcs-grid-host[b-f8javfrmy7] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
    max-height: 100%;
    min-height: 0;
}

/* Design I: an editable grid says so, once, in its footer. */
.pcs-grid-hint[b-f8javfrmy7] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-10);
    flex: 1 1 auto;
    min-width: 0;
    min-height: 30px;
    margin-right: auto;
    padding: 0 var(--pcs-sp-10);
    border-left: 3px solid var(--pcs-accent);
    border-radius: var(--pcs-radius-control);
    background: color-mix(in srgb, var(--pcs-accent) 10%, var(--pcs-bg-1));
    color: var(--pcs-bg-brand);
    font-size: 12px;
}

.pcs-grid-hint strong[b-f8javfrmy7] {
    font-weight: 600;
}

/* A read-only grid is a list: no row lines, every other row banded. */
.pcs-grid.is-list > .pcs-grid__table > tbody > tr > td[b-f8javfrmy7] {
    border-bottom: 0;
    background: transparent;
}

.pcs-grid.is-list > .pcs-grid__table > tbody > tr.is-band > td[b-f8javfrmy7] {
    background: var(--pcs-bg-readonly);
}

/* The open row's arrow, and what it opens onto: a raised panel under it (design N). */
.pcs-grid__col-toggle[b-f8javfrmy7] {
    width: 32px;
}

.pcs-grid__toggle[b-f8javfrmy7] {
    padding: 0;
    cursor: pointer;
    color: var(--pcs-fg-3);
}

.pcs-grid__toggle[b-f8javfrmy7]  .pcs-nav-chevron,
.pcs-grid__toggle .pcs-nav-chevron[b-f8javfrmy7] {
    margin: 0 auto;
}

.pcs-grid__row.is-expanded > td[b-f8javfrmy7] {
    font-weight: 600;
    border-bottom-color: transparent;
}

.pcs-grid__detail > td[b-f8javfrmy7] {
    height: auto;
    padding: 0 var(--pcs-sp-15) var(--pcs-sp-10);
    white-space: normal;
}

/* The detail is the open row's: the same ground, the shared rows' edge running on. */
.pcs-grid__detail.is-readonly-row > td[b-f8javfrmy7],
.pcs-grid.is-list > .pcs-grid__table > tbody > .pcs-grid__detail.is-band > td[b-f8javfrmy7] {
    background: var(--pcs-bg-readonly);
}

.pcs-grid__detail.is-active-row:not(.is-readonly-row) > td[b-f8javfrmy7] {
    background: color-mix(in srgb, var(--pcs-accent) 5%, var(--pcs-bg-1));
}

.pcs-grid__detail.is-shared > td[b-f8javfrmy7] {
    box-shadow: inset 3px 0 0 var(--pcs-border);
}

.pcs-grid__detail-panel[b-f8javfrmy7] {
    --pcs-scroll-bleed: 0px;
    overflow: hidden;
    padding: var(--pcs-sp-10);
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-bg-1);
    box-shadow: var(--pcs-shadow-1);
}

/* Text with a badge after it: the text gives way, the badge stays whole. */
.pcs-grid__badged[b-f8javfrmy7] {
    display: flex;
    align-items: center;
    gap: var(--pcs-sp-4);
    min-width: 0;
}

.pcs-grid__badged > .pcs-grid__text[b-f8javfrmy7] {
    min-width: 0;
}

.pcs-grid__badged[b-f8javfrmy7]  .pcs-badge {
    flex: none;
}

.pcs-grid__detail-heading[b-f8javfrmy7] {
    padding: 0 0 var(--pcs-sp-10);
    font-size: 12px;
    font-weight: 600;
    color: var(--pcs-fg-2);
}

/* Under the grid at its end: the save status, then Add. */
.pcs-grid-foot[b-f8javfrmy7] {
    display: flex;
    padding-top: var(--pcs-sp-10);
    align-items: center;
    justify-content: flex-end;
    gap: var(--pcs-sp-10);
}

/* Reserves its line so nothing jumps. */
.pcs-grid-status[b-f8javfrmy7] {
    min-height: 16px;
    font-size: 12px;
    line-height: 16px;
    color: var(--pcs-fg-3);
}

.pcs-grid-status.is-failed[b-f8javfrmy7] {
    color: var(--pcs-danger);
}

/* The padding, taken back by the margin, is room for the lifted editor at the grid's
   edges — 4 px of lift, its 2 px ring and the shadow — which the scroll container
   would otherwise clip. */
.pcs-grid[b-f8javfrmy7] {
    position: relative;
    flex: 0 1 auto;
    min-height: 0;
    /* A host whose scrollbar belongs at its own edge (a settings page) sets
       --pcs-scroll-bleed to its padding: the scroll area reaches through it. */
    margin: -8px calc(-1 * max(8px, var(--pcs-scroll-bleed, 0px))) -8px -8px;
    padding: 8px max(8px, var(--pcs-scroll-bleed, 0px)) 8px 8px;
    /* The scrollbar's room is kept whether it shows or not, so a grid and a table end at
       the same place beside it. */
    scrollbar-gutter: stable;
    overflow: auto;
    outline: none;
}

.pcs-grid__table[b-f8javfrmy7] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    font: normal normal 400 13px/normal var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.pcs-grid__col-gutter[b-f8javfrmy7] {
    width: 4px;
}

.pcs-grid__col-actions[b-f8javfrmy7] {
    width: 36px;
}

th[b-f8javfrmy7] {
    position: sticky;
    top: 0;
    z-index: 2;
    height: var(--pcs-control-h-sm);
    padding: 0 var(--pcs-sp-10);
    background: var(--pcs-bg-1);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
    box-shadow: 0 -8px 0 var(--pcs-bg-1);
    text-align: left;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

td[b-f8javfrmy7] {
    position: relative;
    height: var(--pcs-control-h-sm);
    padding: 0 var(--pcs-sp-10);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border-soft);
    white-space: nowrap;
}

.is-num[b-f8javfrmy7] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Read-only: the whole row when the row cannot change (gutter and actions too),
   else the cell. */
.pcs-grid__cell.is-readonly[b-f8javfrmy7],
.pcs-grid__row.is-readonly-row > td[b-f8javfrmy7] {
    background: var(--pcs-bg-readonly);
    color: var(--pcs-fg-3);
}

/* The row the active cell is on, and a whole row picked to delete. */
.pcs-grid__row.is-active-row:not(.is-readonly-row) > td:not(.is-readonly)[b-f8javfrmy7] {
    background: color-mix(in srgb, var(--pcs-accent) 5%, var(--pcs-bg-1));
}

.pcs-grid__row.is-selected > td[b-f8javfrmy7] {
    background: color-mix(in srgb, var(--pcs-accent) 14%, var(--pcs-bg-1));
}

/* The first column beside the gutter (or the arrow) takes back its width, so its text starts
   where a read-only table's does. */
.pcs-grid__gutter + td[b-f8javfrmy7],
th.pcs-grid__head-gutter + th[b-f8javfrmy7] {
    padding-left: calc(var(--pcs-sp-10) - 4px);
}

.pcs-grid__gutter + td > .pcs-grid__editor:not(.is-popover)[b-f8javfrmy7]  .pcs-input {
    padding-left: var(--pcs-sp-10);
}

/* The gutter: a click picks the whole row. */
.pcs-grid__gutter[b-f8javfrmy7] {
    padding: 0;
    cursor: pointer;
}

.pcs-grid__row:hover > .pcs-grid__gutter[b-f8javfrmy7] {
    box-shadow: inset 3px 0 0 var(--pcs-border);
}

.pcs-grid__row.is-selected > .pcs-grid__gutter[b-f8javfrmy7] {
    box-shadow: inset 3px 0 0 var(--pcs-accent);
}

.pcs-grid__text[b-f8javfrmy7] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* The shared rows: one divider says what they are, an edge marks each of them. */
.pcs-grid__divider > td[b-f8javfrmy7] {
    height: var(--pcs-control-h-sm);
    padding: 0 var(--pcs-sp-10);
    background: var(--pcs-bg-2);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
}

.pcs-grid__divider-label[b-f8javfrmy7] {
    display: inline-flex;
    align-items: center;
    gap: var(--pcs-sp-4);
}

.pcs-grid__row.is-shared > td:first-child[b-f8javfrmy7] {
    box-shadow: inset 3px 0 0 var(--pcs-border);
}

/* The blank last row says what it is for. */
.pcs-grid__row.is-new > td[b-f8javfrmy7] {
    border-bottom-style: dashed;
}

.pcs-grid__placeholder[b-f8javfrmy7] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--pcs-fg-3);
    font-style: italic;
}

/* The active cell: a ring inside it, so it never covers a neighbour or the header. */
.pcs-grid:focus-within > .pcs-grid__table > tbody > tr > .pcs-grid__cell.is-active[b-f8javfrmy7] {
    box-shadow: inset 0 0 0 2px var(--pcs-focus-color);
}

/* The one editor: always in the active cell, invisible until the user edits, and
   never wider than the cell, so nothing it holds makes the grid scroll. */
.pcs-grid__editor[b-f8javfrmy7] {
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

/* Editing, it lifts out of the row: a little larger than the cell, rounded, ringed and
   shadowed, above the sticky header so the first row's editor is never under it. The
   input's padding makes up the 4 px, so the text stays exactly where it was. */
.pcs-grid.is-editing > .pcs-grid__table > tbody > tr > td > .pcs-grid__editor[b-f8javfrmy7],
.pcs-grid.is-typing > .pcs-grid__table > tbody > tr > td > .pcs-grid__editor[b-f8javfrmy7] {
    inset: -4px;
    z-index: 3;
    opacity: 1;
    pointer-events: auto;
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-bg-1);
    box-shadow: 0 0 0 2px var(--pcs-focus-color), var(--pcs-shadow-1);
}

.pcs-grid__editor:not(.is-popover)[b-f8javfrmy7]  .pcs-autocomplete {
    height: 100%;
}

.pcs-grid__editor:not(.is-popover)[b-f8javfrmy7]  .pcs-input {
    width: 100%;
    height: 100%;
    padding: 0 calc(var(--pcs-sp-10) + 4px);
    border: 0;
    border-radius: inherit;
    background: transparent;
    font: inherit;
    line-height: normal;
}

.pcs-grid__cell.is-num .pcs-grid__editor[b-f8javfrmy7]  .pcs-input {
    text-align: right;
}

/* A cell whose editor opens under it lifts like any edited cell — the same white,
   rounded, ringed box a text editor draws — while the editor floats below. Its text
   stays on top of the box, where it was. */
.pcs-grid__cell.is-lifted[b-f8javfrmy7]::after {
    content: "";
    position: absolute;
    inset: -4px;
    z-index: 3;
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-bg-1);
    box-shadow: 0 0 0 2px var(--pcs-focus-color), var(--pcs-shadow-1);
    pointer-events: none;
}

.pcs-grid__cell.is-lifted > .pcs-grid__text[b-f8javfrmy7],
.pcs-grid__cell.is-lifted > .pcs-grid__placeholder[b-f8javfrmy7] {
    position: relative;
    z-index: 4;
}

.pcs-grid:focus-within > .pcs-grid__table > tbody > tr > .pcs-grid__cell.is-active.is-lifted[b-f8javfrmy7] {
    box-shadow: none;
}

/* An editor with parts opens under its cell, at least wide enough for its fields.
   pcs.grid pins it to the window there (or above, without room below), so the grid's
   scrolling cannot clip it; the place below is where it sits before it is pinned. */
.pcs-grid.is-editing > .pcs-grid__table > tbody > tr > td > .pcs-grid__editor.is-popover[b-f8javfrmy7],
.pcs-grid.is-typing > .pcs-grid__table > tbody > tr > td > .pcs-grid__editor.is-popover[b-f8javfrmy7] {
    inset: auto;
    top: calc(100% + 6px);
    left: -4px;
    z-index: 3;
    overflow: visible;
    min-width: max(100%, 280px);
    overflow: auto;
    padding: var(--pcs-sp-10);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    white-space: normal;
}

.pcs-grid__box[b-f8javfrmy7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    vertical-align: middle;
    border: 1px solid var(--pcs-silver);
    border-radius: var(--pcs-radius-xs);
    background: var(--pcs-bg-1);
    color: var(--pcs-fg-inverse);
}

.pcs-grid__box.is-on[b-f8javfrmy7] {
    border-color: var(--pcs-accent);
    background: var(--pcs-accent);
}

/* Save state on the cell: a turning arc while saving; once saved, the cell flashes
   green and a check fades out with it, so a save is seen without being announced. */
.pcs-grid__cell.is-saved[b-f8javfrmy7] {
    animation: pcs-grid-saved-b-f8javfrmy7 var(--pcs-feedback-duration) ease-out;
}

@keyframes pcs-grid-saved-b-f8javfrmy7 {
    from {
        background: color-mix(in srgb, var(--pcs-success) 22%, var(--pcs-bg-1));
    }
}

.pcs-grid__mark[b-f8javfrmy7] {
    position: absolute;
    top: 50%;
    right: var(--pcs-sp-10);
    width: 12px;
    height: 12px;
    margin-top: -6px;
}

.pcs-grid__cell.is-num .pcs-grid__mark[b-f8javfrmy7] {
    right: auto;
    left: var(--pcs-sp-10);
}

.pcs-grid__mark.is-saving[b-f8javfrmy7] {
    border: 1.5px solid var(--pcs-border);
    border-top-color: var(--pcs-accent);
    border-radius: 50%;
    animation: pcs-grid-spin-b-f8javfrmy7 var(--pcs-spin-duration) linear infinite;
}

.pcs-grid__mark.is-saved[b-f8javfrmy7] {
    border-right: 1.6px solid var(--pcs-success);
    border-bottom: 1.6px solid var(--pcs-success);
    width: 5px;
    height: 9px;
    transform: rotate(45deg);
    animation: pcs-grid-fade-b-f8javfrmy7 var(--pcs-feedback-duration) ease-in forwards;
}

.pcs-grid__mark.is-dirty[b-f8javfrmy7] {
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-radius: 50%;
    background: var(--pcs-accent);
}

@keyframes pcs-grid-spin-b-f8javfrmy7 {
    to {
        transform: rotate(360deg);
    }
}

@keyframes pcs-grid-fade-b-f8javfrmy7 {
    to {
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pcs-grid__mark.is-saving[b-f8javfrmy7],
    .pcs-grid__cell.is-saved[b-f8javfrmy7] {
        animation: none;
    }
}

/* An error: the value stays, underlined, with a corner flag; the reason and its
   way out show on hover, or while the cell is the active one. */
.pcs-grid__cell.is-error[b-f8javfrmy7] {
    box-shadow: inset 0 -2px 0 var(--pcs-danger);
}

.pcs-grid__corner[b-f8javfrmy7] {
    position: absolute;
    top: 0;
    right: 0;
    border-top: 7px solid var(--pcs-danger);
    border-left: 7px solid transparent;
}

.pcs-grid__error[b-f8javfrmy7] {
    display: none;
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    z-index: 3;
    width: 260px;
    padding: 8px 10px;
    border: 1px solid var(--pcs-danger);
    border-radius: var(--pcs-radius-sm);
    background: var(--pcs-bg-1);
    color: var(--pcs-fg-1);
    box-shadow: var(--pcs-shadow-menu);
    font-size: 12px;
    line-height: 1.4;
    white-space: normal;
    text-align: left;
}

.pcs-grid__cell:nth-last-child(-n + 2) .pcs-grid__error[b-f8javfrmy7] {
    left: auto;
    right: 0;
}

/* The last rows (Virtualize's trailing spacer is the last child) open it upwards,
   so it never makes the grid scroll. */
.pcs-grid__row:nth-last-child(-n + 3) .pcs-grid__error[b-f8javfrmy7] {
    top: auto;
    bottom: calc(100% + 2px);
}

.pcs-grid__cell.is-error:hover .pcs-grid__error[b-f8javfrmy7],
.pcs-grid:focus-within > .pcs-grid__table > tbody > tr > .pcs-grid__cell.is-error.is-active .pcs-grid__error[b-f8javfrmy7] {
    display: block;
}

.pcs-grid__error-actions[b-f8javfrmy7] {
    display: flex;
    gap: var(--pcs-sp-10);
    margin-top: 4px;
}

.pcs-grid__cell.is-refused[b-f8javfrmy7] {
    animation: pcs-grid-refuse-b-f8javfrmy7 var(--pcs-nudge-duration) ease;
}

@keyframes pcs-grid-refuse-b-f8javfrmy7 {
    50% {
        background: color-mix(in srgb, var(--pcs-danger) 12%, var(--pcs-bg-1));
    }
}

.pcs-grid__actions[b-f8javfrmy7] {
    padding: 0;
    text-align: center;
}

/* Heard, never seen, and inside the host so it cannot make anything scroll. */
.pcs-grid__live[b-f8javfrmy7] {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}
/* /Shared/Components/DataManagement/PcsPropertyBagEditor.razor.rz.scp.css */
.pcs-bag-editor[b-ztypki8obd] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-15);
}

.pcs-bag-editor__bar[b-ztypki8obd] {
    display: flex;
    justify-content: flex-end;
}

.pcs-bag-editor__group[b-ztypki8obd] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-10);
}

/* The type is the .pcs-ui-label preset the markup also wears; only the h3 margin is ours. */
.pcs-bag-editor__title[b-ztypki8obd] {
    margin: 0;
}
/* /Shared/Components/DataManagement/PcsTable.razor.rz.scp.css */
/* Style A (the grid styles canvas): quiet rows divided by hairlines, an
   uppercase header that stays put while the rows scroll. The table sizes to its
   rows and scrolls only once its parent runs out of height. */
.pcs-table[b-wmynpp2ggg] {
    max-height: 100%;
    min-height: 0;
    /* As the grid: reaches through a host's padding so the scrollbar sits at its edge. */
    margin-right: calc(-1 * var(--pcs-scroll-bleed, 0px));
    padding-right: var(--pcs-scroll-bleed, 0px);
    scrollbar-gutter: stable;
    overflow: auto;
}

.pcs-table__table[b-wmynpp2ggg] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    font: normal normal 400 13px/1 var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

/* The table shows focus on its current row, not around itself. */
.pcs-table__table:focus-visible[b-wmynpp2ggg] {
    outline: none;
}

.pcs-table__col-toggle[b-wmynpp2ggg] {
    width: 28px;
}

.pcs-table__col-actions[b-wmynpp2ggg] {
    width: 40px;
}

th[b-wmynpp2ggg] {
    position: sticky;
    top: 0;
    z-index: 1;
    height: var(--pcs-control-h-sm);
    padding: 0 var(--pcs-sp-10);
    background: var(--pcs-bg-1);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
    text-align: left;
    font-weight: 500;
    font-size: 11px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Read-only rows read as a list (design B): no row lines, every other row banded. */
td[b-wmynpp2ggg] {
    height: var(--pcs-control-h-sm);
    padding: 0 var(--pcs-sp-10);
    white-space: nowrap;
    overflow: hidden;
}

.pcs-table__row.is-band > td[b-wmynpp2ggg] {
    background: var(--pcs-bg-readonly);
}

.is-num[b-wmynpp2ggg] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

[b-wmynpp2ggg] .pcs-table__text {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

[role=grid] > tbody > .pcs-table__row[b-wmynpp2ggg] {
    cursor: pointer;
}

[role=grid] > tbody > .pcs-table__row:hover > td[b-wmynpp2ggg] {
    background: var(--pcs-bg-2);
}

.pcs-table__row.is-selected > td[b-wmynpp2ggg] {
    background: color-mix(in srgb, var(--pcs-accent) 10%, var(--pcs-bg-1));
}

.pcs-table__table:focus-visible > tbody > .pcs-table__row.is-current > td[b-wmynpp2ggg] {
    box-shadow: inset 0 2px 0 var(--pcs-focus-color), inset 0 -2px 0 var(--pcs-focus-color);
}

.pcs-table__table:focus-visible > tbody > .pcs-table__row.is-current > td:first-child[b-wmynpp2ggg] {
    box-shadow: inset 2px 2px 0 var(--pcs-focus-color), inset 0 -2px 0 var(--pcs-focus-color);
}

.pcs-table__table:focus-visible > tbody > .pcs-table__row.is-current > td:last-child[b-wmynpp2ggg] {
    box-shadow: inset -2px 2px 0 var(--pcs-focus-color), inset 0 -2px 0 var(--pcs-focus-color);
}

.pcs-table__toggle[b-wmynpp2ggg] {
    padding: 0 0 0 var(--pcs-sp-10);
    color: var(--pcs-fg-2);
}

.pcs-table__actions[b-wmynpp2ggg] {
    padding: 0 var(--pcs-sp-4);
    text-align: center;
}

.pcs-table__detail > td[b-wmynpp2ggg] {
    height: auto;
    padding: var(--pcs-sp-10) var(--pcs-sp-10) var(--pcs-sp-15) 38px;
    background: var(--pcs-bg-2);
    white-space: normal;
    overflow: visible;
}
/* /Shared/Components/DataManagement/PcsTreeView.razor.rz.scp.css */
/* The rows are built in code-behind (they recurse), so they carry no scope id of
   their own: everything below reaches them through ::deep from the tree's <ul>.
   The row's look — height, type, hover, selected — is the shared .pcs-nav-row in
   app.css, the same row PcsSideNavItem draws. */
.pcs-tree[b-3nypnm9g3o] {
    list-style: none;
    margin: 0;
    padding: 0;
    /* Long labels ellipsize; the tree never scrolls sideways. */
    overflow-x: hidden;
}

/* The tree shows focus on its current row, not around itself. */
.pcs-tree:focus-visible[b-3nypnm9g3o] {
    outline: none;
}

.pcs-tree:focus-visible[b-3nypnm9g3o]  .pcs-tree__row.is-current {
    box-shadow: inset 0 0 0 2px var(--pcs-focus-color);
}

[b-3nypnm9g3o] .pcs-tree__group {
    list-style: none;
    margin: 0;
    padding: 0;
}

[b-3nypnm9g3o] .pcs-tree__row {
    gap: 6px;
    padding-right: 4px;
    min-width: 0;
}

/* A fixed gutter for the chevron, so leaf and parent rows keep their icons aligned. */
[b-3nypnm9g3o] .pcs-tree__toggle {
    flex: none;
    width: 16px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-3nypnm9g3o] .pcs-tree__icon {
    flex: none;
}

[b-3nypnm9g3o] .pcs-tree__label {
    display: block;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Per-node ⋮ menu: hidden until the row is hovered, the trigger is focused or its
   menu is open — otherwise every row carries a permanent dot column. Sized down so
   it fits the 32px row. */
[b-3nypnm9g3o] .pcs-tree__actions {
    flex: none;
    display: flex;
    align-items: center;
}

[b-3nypnm9g3o] .pcs-tree__actions .pcs-menu-button__dots {
    width: 22px;
    height: 22px;
    opacity: 0;
    transition: opacity var(--pcs-transition), background-color var(--pcs-transition);
}

[b-3nypnm9g3o] .pcs-tree__row:hover .pcs-menu-button__dots,
[b-3nypnm9g3o] .pcs-tree__actions .pcs-menu-button__dots:focus-visible,
[b-3nypnm9g3o] .pcs-tree__actions .pcs-menu-button__dots.is-open {
    opacity: 1;
}

/* Host content at the row's end (RowEnd): a count, a status mark. */
[b-3nypnm9g3o] .pcs-tree__end {
    flex: none;
    display: flex;
    align-items: center;
    gap: 6px;
    font: 500 12px/1 var(--pcs-font-ui);
    color: var(--pcs-fg-3);
}

[b-3nypnm9g3o] .pcs-tree__rename {
    flex: 1;
    min-width: 0;
    display: flex;
}

/* An open node with nothing in it yet (EmptyChildren). */
[b-3nypnm9g3o] .pcs-tree__empty {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding-right: 8px;
    font: 400 12px/20px var(--pcs-font-ui);
    color: var(--pcs-fg-3);
}

/* The chevron gutter a row has, so the text lines up with the children's labels. */
[b-3nypnm9g3o] .pcs-tree__empty::before {
    content: "";
    flex: none;
    width: 16px;
}
/* /Shared/Components/Feedback/PcsAlert.razor.rz.scp.css */
.pcs-alert[b-pbd7nrnum1] {
    margin: 0 0 16px;
    padding: 10px 14px;
    border-radius: var(--pcs-radius-sm);
    font: normal normal 400 13px/18px var(--pcs-font-ui);
}

.pcs-alert--error[b-pbd7nrnum1] {
    background: #fdecea;
    border: 1px solid var(--pcs-danger);
    color: var(--pcs-danger);
}

.pcs-alert--success[b-pbd7nrnum1] {
    background: #e8f6ee;
    border: 1px solid var(--pcs-success);
    color: #11703a;
}

.pcs-alert--warning[b-pbd7nrnum1] {
    background: #fdf4e3;
    border: 1px solid #b58900;
    color: #7a5b00;
}

.pcs-alert--info[b-pbd7nrnum1] {
    background: color-mix(in srgb, var(--pcs-atoll) 8%, var(--pcs-white));
    border: 1px solid var(--pcs-atoll);
    color: var(--pcs-atoll);
}
/* /Shared/Components/Feedback/PcsEmptyState.razor.rz.scp.css */
.pcs-empty[b-9gpbjzmwh9] {
    padding: 24px 0;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.pcs-empty--centered[b-9gpbjzmwh9] {
    padding: 40px;
    text-align: center;
    font-size: 14px;
    line-height: 20px;
}
/* /Shared/Components/Feedback/PcsErrorBoundary.razor.rz.scp.css */
.app-error[b-8psaxqowma] {
    margin: 2rem auto;
    max-width: calc(56rem + 3rem + 2px);
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--pcs-color-danger, #c0392b);
    border-radius: 4px;
    background: #fff5f5;
}

.app-error__title[b-8psaxqowma] {
    margin-top: 0;
    color: var(--pcs-color-danger, #c0392b);
}

.app-error__details[b-8psaxqowma] {
    overflow: auto;
    max-height: calc(24rem + 1.5rem);
    padding: 0.75rem;
    background: #2b2b2b;
    color: #f8f8f2;
    font-size: 0.8rem;
    white-space: pre-wrap;
    word-break: break-word;
}

.app-error__retry[b-8psaxqowma] {
    cursor: pointer;
    padding: 0.4rem 1rem;
}
/* /Shared/Components/Feedback/PcsSnackbarHost.razor.rz.scp.css */
/* Vertically matches a 65px dialog header: an ~38px snackbar centres on the
   same line as the header titles. */
.pcs-snackbar-host[b-9uqnm8zusf] {
    position: absolute;
    top: 13px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 30;
    width: max-content;
    max-width: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--pcs-sp-4);
    pointer-events: none;
}
/* /Shared/Components/Feedback/PcsSnackbarProvider.razor.rz.scp.css */
/* Top-centre of the screen, above the dialog layer (z 600) so snackbars show
   over open dialogs; the 13px offset centres a ~38px alert on the same line
   as a dialog header's title. */
.pcs-snackbars[b-uc23dxegz7] {
    position: fixed;
    left: 50%;
    top: 13px;
    transform: translateX(-50%);
    z-index: 700;
    /* max-content, or a box pinned at left: 50% may only grow into the right
       half of the viewport and wraps a message long before the screen is full. */
    width: max-content;
    max-width: 90vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--pcs-sp-4);
    pointer-events: none;
}
/* /Shared/Components/Feedback/PcsSnackbars.razor.rz.scp.css */
/* Filled, MudBlazor-style snackbar: severity colour, white content, slightly
   translucent like MudBlazor's toasts (fully opaque on hover for reading). */
.pcs-snackbar[b-pvwr2f2i68] {
    pointer-events: auto;
    display: flex;
    align-items: center;
    gap: 12px;
    /* Sized by its message: as wide as the text up to the stack's limit, so a
       short toast has no empty tail and a long one wraps only when it must. */
    max-width: 100%;
    padding: 10px 8px 10px 14px;
    border-radius: var(--pcs-radius-sm);
    color: var(--pcs-white);
    font: normal normal 500 14px/20px var(--pcs-font-ui);
    box-shadow: var(--pcs-shadow-modal);
    opacity: 0.85;
    backdrop-filter: blur(6px);
    animation: pcs-snackbar-in-b-pvwr2f2i68 0.18s ease-out;
    transition: opacity var(--pcs-transition);
}

.pcs-snackbar:hover[b-pvwr2f2i68] {
    opacity: 1;
}

/* Keyframe names are not scoped by CSS isolation — pcs- prefixed to stay unique. */
@keyframes pcs-snackbar-in-b-pvwr2f2i68 {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pcs-snackbar[b-pvwr2f2i68] {
        animation: none;
    }
}

.pcs-snackbar--success[b-pvwr2f2i68] {
    background: var(--pcs-success);
}

.pcs-snackbar--error[b-pvwr2f2i68] {
    background: var(--pcs-danger);
}

.pcs-snackbar--info[b-pvwr2f2i68] {
    background: var(--pcs-atoll);
}

[b-pvwr2f2i68] .pcs-snackbar__icon {
    flex: none;
}

.pcs-snackbar__message[b-pvwr2f2i68] {
    flex: 1;
}

/* Inverse chrome, like the close button beside it: the toast's own ground is a
   severity colour, so the shared Link variant's blue would be unreadable on it. */
.pcs-snackbar__action[b-pvwr2f2i68] {
    flex: none;
    border: 0;
    background: transparent;
    padding: 0 var(--pcs-sp-4);
    color: var(--pcs-white);
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
    border-radius: var(--pcs-radius-sm);
}

.pcs-snackbar__action:hover[b-pvwr2f2i68] {
    background: color-mix(in srgb, var(--pcs-white) 18%, transparent);
}

.pcs-snackbar__close[b-pvwr2f2i68] {
    flex: none;
    width: 28px;
    height: 28px;
    border: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--pcs-white);
    border-radius: var(--pcs-radius-sm);
    cursor: pointer;
    opacity: 0.8;
    transition: opacity var(--pcs-transition), background-color var(--pcs-transition);
}

.pcs-snackbar__close:hover[b-pvwr2f2i68] {
    opacity: 1;
    background: color-mix(in srgb, var(--pcs-white) 18%, transparent);
}

/* The message's one action — Undo. Outlined in the message's own ink, so it
   reads as part of the message rather than a second, competing control. */
.pcs-snackbar__action[b-pvwr2f2i68] {
    flex: none;
    height: 28px;
    padding: 0 10px;
    border: var(--pcs-hairline) solid currentColor;
    background: transparent;
    color: var(--pcs-white);
    border-radius: var(--pcs-radius-control);
    font: normal normal 600 13px/1 var(--pcs-font-ui);
    cursor: pointer;
    transition: background-color var(--pcs-transition);
}

.pcs-snackbar__action:hover[b-pvwr2f2i68] {
    background: rgba(255, 255, 255, 0.16);
}

.pcs-snackbar__action:focus-visible[b-pvwr2f2i68] {
    outline: 2px solid var(--pcs-white);
    outline-offset: 1px;
}
/* /Shared/Components/Feedback/PcsSpinner.razor.rz.scp.css */
.pcs-spinner[b-dtm365ne75] {
    flex: none;
    display: inline-block;
    border-radius: 50%;
    border-style: solid;
    border-color: color-mix(in srgb, currentColor 35%, transparent);
    border-top-color: currentColor;
    animation: pcs-spin-b-dtm365ne75 0.7s linear infinite;
}

.pcs-spinner--brand[b-dtm365ne75] {
    border-color: var(--pcs-light-grey-1);
    border-top-color: var(--pcs-atoll);
}

/* Keyframe names are not scoped by CSS isolation — pcs- prefixed to stay unique. */
@keyframes pcs-spin-b-dtm365ne75 {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pcs-spinner[b-dtm365ne75] {
        animation: none;
    }
}
/* /Shared/Components/Forms/PcsAnchorPicker.razor.rz.scp.css */
/* The button's glyph: nine dots, the current one filled. */
.pcs-anchor__dots[b-u8d3rw89s4] {
    display: grid;
    grid-template-columns: repeat(3, 4px);
    grid-template-rows: repeat(3, 4px);
    gap: 2px;
}

.pcs-anchor__dot[b-u8d3rw89s4] {
    width: 4px;
    height: 4px;
    border-radius: 1px;
    background: var(--pcs-silver);
}

.pcs-anchor__dot.is-on[b-u8d3rw89s4] {
    width: 6px;
    height: 6px;
    margin: -1px;
    background: var(--pcs-atoll);
}

.pcs-anchor__grid[b-u8d3rw89s4] {
    display: grid;
    grid-template-columns: repeat(3, var(--pcs-control-h-sm));
    grid-template-rows: repeat(3, var(--pcs-control-h-sm));
    gap: 4px;
    outline: none;
}

.pcs-anchor__grid[b-u8d3rw89s4]  .pcs-anchor__cell {
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    padding: 7px;
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-white);
}

.pcs-anchor__grid[b-u8d3rw89s4]  .pcs-anchor__cell.is-focused,
.pcs-anchor__grid[b-u8d3rw89s4]  .pcs-anchor__cell:hover {
    background: var(--pcs-bg-2);
}

.pcs-anchor__grid[b-u8d3rw89s4]  .pcs-anchor__cell[aria-pressed="true"],
.pcs-anchor__grid[b-u8d3rw89s4]  .pcs-anchor__cell.is-selected {
    border-color: var(--pcs-atoll);
    box-shadow: inset 0 0 0 1px var(--pcs-atoll);
}

/* Two short rules standing for a line of text at the cell's position. */
.pcs-anchor__lines[b-u8d3rw89s4] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.pcs-anchor__lines > span[b-u8d3rw89s4] {
    height: 2px;
    border-radius: 1px;
    background: var(--pcs-fg-2);
}

.pcs-anchor__lines > span:first-child[b-u8d3rw89s4] {
    width: 100%;
}

.pcs-anchor__lines > span:last-child[b-u8d3rw89s4] {
    width: 60%;
}

.pcs-anchor__lines--top[b-u8d3rw89s4] {
    justify-content: flex-start;
}

.pcs-anchor__lines--middle[b-u8d3rw89s4] {
    justify-content: center;
}

.pcs-anchor__lines--bottom[b-u8d3rw89s4] {
    justify-content: flex-end;
}

.pcs-anchor__lines--center[b-u8d3rw89s4] {
    align-items: center;
}

.pcs-anchor__lines--right[b-u8d3rw89s4] {
    align-items: flex-end;
}

.pcs-anchor__caption[b-u8d3rw89s4] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: 112px;
}

.pcs-anchor__name[b-u8d3rw89s4] {
    font-weight: 600;
}

.pcs-anchor__hint[b-u8d3rw89s4] {
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-fg-3);
}
/* /Shared/Components/Forms/PcsAutocomplete.razor.rz.scp.css */
.pcs-autocomplete[b-0hz8so3jbq] {
    position: relative;
    max-width: 360px;
}

/* Base look comes from the shared .pcs-input rules (app.css). */
.pcs-autocomplete__input[b-0hz8so3jbq] {
    width: 100%;
}

/* Transparent scrim below the list catches the outside click that closes it. */
.pcs-autocomplete__scrim[b-0hz8so3jbq] {
    position: fixed;
    inset: 0;
    z-index: 9;
}

/* Fixed to the viewport at the place pcs.anchorDropdown measured (left, width,
   top or bottom, max-height arrive inline), so a dialog's scrolling body cannot
   clip it. */
/* At least as wide as its input and as wide as its options need, up to a limit, so a
   narrow field (a grid cell) does not squeeze its list into a sideways scroll. */
.pcs-autocomplete__list[b-0hz8so3jbq] {
    position: fixed;
    z-index: 10;
    width: max-content;
    max-width: min(420px, calc(100vw - 16px));
    margin: 0;
    padding: 4px;
    list-style: none;
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    box-shadow: var(--pcs-shadow-1);
}

.pcs-autocomplete__option[b-0hz8so3jbq] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: var(--pcs-radius-sm);
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    cursor: pointer;
}

.pcs-autocomplete__text[b-0hz8so3jbq] {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* The typed text, where it matched. */
.pcs-autocomplete__text strong[b-0hz8so3jbq] {
    font-weight: 600;
}

.pcs-autocomplete__detail[b-0hz8so3jbq] {
    flex: none;
    max-width: 45%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: var(--pcs-fg-3);
}

.pcs-autocomplete__option.is-current[b-0hz8so3jbq] {
    font-weight: 600;
}

/* A group heads its run of options; the options under it indent. */
.pcs-autocomplete__group[b-0hz8so3jbq] {
    display: flex;
    justify-content: space-between;
    padding: 8px 10px 4px;
    font: normal normal 600 11px/16px var(--pcs-font-ui);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pcs-fg-3);
    cursor: default;
}

.pcs-autocomplete__count[b-0hz8so3jbq] {
    font-weight: 400;
}

.pcs-autocomplete__option--grouped[b-0hz8so3jbq] {
    padding-left: 18px;
}

/* Select mode: the clear button sits inside the input's right edge. */
.pcs-autocomplete[b-0hz8so3jbq]  .pcs-autocomplete__clear {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
}

.pcs-autocomplete__option:hover[b-0hz8so3jbq],
.pcs-autocomplete__option.is-highlighted[b-0hz8so3jbq] {
    background: var(--pcs-light-grey-3);
}
/* /Shared/Components/Forms/PcsFilePickerButton.razor.rz.scp.css */
/* Only the clip lives here; the button look is .pcs-btn in app.css, global, so
   this component and PcsButton draw the same control. The positioning context
   hangs off this component's own class rather than .pcs-btn, so it cannot end
   up tying with a caller's rule over which one owns the root. */
.pcs-file-picker[b-8pbqdpfrma] {
    position: relative;
}

/* The <input> comes from the InputFile child component, so ::deep is required
   to reach it. The visually-hidden clip trick: still focusable, still in the
   tab order, and the label shows the focus ring for it. */
.pcs-file-picker[b-8pbqdpfrma]  input[type=file] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}
/* /Shared/Components/Forms/PcsFormField.razor.rz.scp.css */
/* Control styling (input/select/textarea inside .form-field__control) lives
   in app.css as the shared design-system baseline — this file keeps only the
   field's own layout. */
.form-field[b-qw7hl67ggr] {
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
}

/* Dense fields sit in toolbars, inspector grids and table rows, where the
   container owns the spacing; only the standalone form sizes carry a margin. */
.form-field--sm[b-qw7hl67ggr] {
    margin-bottom: 0;
}

/* The type comes from the .pcs-ui-label preset (pcs-tokens.css) the markup also
   carries; only the spacing is this component's. */
.form-field__label[b-qw7hl67ggr] {
    margin-bottom: 6px;
}

/* /Shared/Components/Forms/PcsIconInput.razor.rz.scp.css */
/* The glyph sits at the input's own horizontal padding and the text starts one
   padding past it, so the space before the glyph and the space after it are the
   same measure. Both were em-based against a px padding before, which is why
   the glyph sat too far in and crowded the text. */
.pcs-icon-input[b-dt7ck3lzyl] {
    --pcs-icon-input-pad: var(--pcs-control-pad-md);
    --pcs-icon-input-glyph: 1.2em;
    position: relative;
    display: inline-flex;
    min-width: 0;
}

.pcs-icon-input--sm[b-dt7ck3lzyl] {
    --pcs-icon-input-pad: var(--pcs-control-pad-sm);
}

.pcs-icon-input--lg[b-dt7ck3lzyl] {
    --pcs-icon-input-pad: var(--pcs-control-pad-lg);
}

.pcs-icon-input input[b-dt7ck3lzyl] {
    width: 100%;
    padding-left: calc(var(--pcs-icon-input-pad) * 2 + var(--pcs-icon-input-glyph));
}

/* The clear button's lane is reserved unconditionally: reserving it only once
   the button appears would shift the text sideways on the first keystroke. */
.pcs-icon-input input[b-dt7ck3lzyl] {
    padding-right: calc(var(--pcs-icon-input-pad) * 2 + var(--pcs-icon-input-glyph));
}

/* No leading glyph: the text starts at the field's own padding. */
.pcs-icon-input--no-glyph input[b-dt7ck3lzyl] {
    padding-left: var(--pcs-icon-input-pad);
}

[b-dt7ck3lzyl] .pcs-icon-input__icon {
    position: absolute;
    left: var(--pcs-icon-input-pad);
    top: 50%;
    transform: translateY(-50%);
    width: var(--pcs-icon-input-glyph);
    height: var(--pcs-icon-input-glyph);
    color: var(--pcs-mid-grey, #8E9292);
    pointer-events: none;
}

/* The button's box is larger than its glyph (24px square around a 12px cross),
   so it is inset by half that difference to put the glyph's edge on the same
   padding line the leading glyph starts from. */
[b-dt7ck3lzyl] .pcs-icon-input__clear {
    position: absolute;
    right: calc(var(--pcs-icon-input-pad) - 6px);
    top: 50%;
    transform: translateY(-50%);
}
/* /Shared/Components/Forms/PcsInspectorField.razor.rz.scp.css */
.field[b-xyqanzt6g7] {
    margin-bottom: 12px;
    min-width: 0;
}

.field__label[b-xyqanzt6g7] {
    margin-bottom: 4px;
}

.field__value[b-xyqanzt6g7] {
    height: var(--pcs-control-h-sm);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-control);
    padding: 0 10px;
    display: flex;
    align-items: center;
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
    background: var(--pcs-white);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.field__value--mono[b-xyqanzt6g7] {
    font-family: var(--pcs-font-mono);
}
/* /Shared/Components/Forms/PcsMarginBox.razor.rz.scp.css */
/* Inputs on the sides they set, the miniature in the middle. */
.pcs-margin-box[b-21ioilav2q] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas:
        ". top ."
        "left sheet right"
        ". bottom .";
    align-items: center;
    justify-items: center;
    gap: 8px;
}

.pcs-margin-box__top[b-21ioilav2q] {
    grid-area: top;
}

.pcs-margin-box__left[b-21ioilav2q] {
    grid-area: left;
    justify-self: end;
}

.pcs-margin-box__right[b-21ioilav2q] {
    grid-area: right;
    justify-self: start;
}

.pcs-margin-box__bottom[b-21ioilav2q] {
    grid-area: bottom;
}

.pcs-margin-box[b-21ioilav2q]  .pcs-margin-box__input {
    width: 56px;
    text-align: center;
}

.pcs-margin-box__sheet[b-21ioilav2q] {
    grid-area: sheet;
    position: relative;
    background: var(--pcs-white);
    border: var(--pcs-hairline) solid var(--pcs-border);
    box-shadow: var(--pcs-shadow-1);
}

.pcs-margin-box__border[b-21ioilav2q] {
    position: absolute;
    border: 1.5px solid var(--pcs-fg-1);
}

/* The binding margin: a band along its edge, inside the sheet. */
.pcs-margin-box__binding[b-21ioilav2q] {
    position: absolute;
    background: var(--pcs-atoll);
}

.pcs-margin-box__binding--left[b-21ioilav2q] {
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
}

.pcs-margin-box__binding--right[b-21ioilav2q] {
    right: 0;
    top: 0;
    bottom: 0;
    width: 3px;
}

.pcs-margin-box__binding--top[b-21ioilav2q] {
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
}

.pcs-margin-box__binding--bottom[b-21ioilav2q] {
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
}
/* /Shared/Components/Forms/PcsSlider.razor.rz.scp.css */
.pcs-slider[b-57hk350ayn] {
    flex: 1;
    min-width: 0;
    height: var(--pcs-control-h-sm);
    accent-color: var(--pcs-atoll);
    cursor: pointer;
}

.pcs-slider:disabled[b-57hk350ayn] {
    cursor: default;
    opacity: 0.5;
}

.pcs-slider:focus-visible[b-57hk350ayn] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 2px;
}
/* /Shared/Components/Forms/PcsToggleSwitch.razor.rz.scp.css */
/* The switch look, promoted from the tabletop palette's one-off so that the
   next setting-that-takes-effect-immediately does not draw its own. The native
   checkbox is visually hidden but stays keyboard-focusable; the track and thumb
   are decoration driven by its :checked state. */
.pcs-switch[b-a8epmzy8zv] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.pcs-switch__input[b-a8epmzy8zv] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.pcs-switch__track[b-a8epmzy8zv] {
    width: calc(28px + 2px);
    height: calc(16px + 2px);
    background: var(--pcs-light-grey-3);
    border: 1px solid var(--pcs-border);
    border-radius: 9px;
    position: relative;
    flex-shrink: 0;
    transition: background-color var(--pcs-transition), border-color var(--pcs-transition);
}

.pcs-switch__thumb[b-a8epmzy8zv] {
    position: absolute;
    top: 1.6px;
    left: 1.7px;
    width: 12px;
    height: 12px;
    background: var(--pcs-white);
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    transition: left var(--pcs-transition);
}

/* Atoll, not cyan: "on" has one ink across the design system — it is what
   the segmented control's active cell is inked in, and what a held-down
   toolbar toggle fills with. The teal here was the switch's own answer. */
.pcs-switch__input:checked ~ .pcs-switch__track[b-a8epmzy8zv] {
    background: var(--pcs-atoll);
    border-color: var(--pcs-atoll);
}

/* Mirrors the 1.7px off-state inset on the right (28px inside the border − 12px thumb − 1.7px). */
.pcs-switch__input:checked ~ .pcs-switch__track .pcs-switch__thumb[b-a8epmzy8zv] {
    left: 14.3px;
}

.pcs-switch__input:focus-visible ~ .pcs-switch__track[b-a8epmzy8zv] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 2px;
}

.pcs-switch__input:disabled ~ .pcs-switch__track[b-a8epmzy8zv] {
    opacity: 0.5;
}

.pcs-switch:has(.pcs-switch__input:disabled)[b-a8epmzy8zv] {
    cursor: default;
    color: var(--pcs-mid-grey);
}
/* /Shared/Components/Layout/PcsCollapsiblePanel.razor.rz.scp.css */
/* The one panel fold (ADR-0044 amendment 2026-10-13): the strip, the transition and
   the head, measured from LeftNavPanel, where the fold first looked right. */
.pcs-collapsible-panel[b-p11e7f41ug] {
    flex: none;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    overflow: hidden;
    transition: var(--pcs-panel-transition);
}

@media (prefers-reduced-motion: reduce) {
    .pcs-collapsible-panel[b-p11e7f41ug] {
        transition: none;
    }
}

.pcs-collapsible-panel__head[b-p11e7f41ug] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 58px;
    padding: 10px 16px 0;
}

/* Folded to the strip: the toggle alone, centred. */
.pcs-collapsible-panel.is-collapsed:not(.pcs-collapsible-panel--no-strip) .pcs-collapsible-panel__head[b-p11e7f41ug] {
    padding: 12px 4px;
    justify-content: center;
}

.pcs-collapsible-panel.is-collapsed:not(.pcs-collapsible-panel--no-strip) .pcs-collapsible-panel__header[b-p11e7f41ug] {
    display: none;
}

.pcs-collapsible-panel__header[b-p11e7f41ug] {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.pcs-collapsible-panel__titles[b-p11e7f41ug] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    margin-left: 8px;
}

.pcs-collapsible-panel__title[b-p11e7f41ug] {
    font: normal normal 600 17px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pcs-collapsible-panel__subtitle[b-p11e7f41ug] {
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-fg-3);
}

.pcs-collapsible-panel__body[b-p11e7f41ug] {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* Hidden only when the fold has finished, so the content is seen leaving rather
   than vanishing. */
.pcs-collapsible-panel.is-collapsed .pcs-collapsible-panel__body[b-p11e7f41ug],
.pcs-collapsible-panel--no-strip.is-collapsed .pcs-collapsible-panel__head[b-p11e7f41ug] {
    visibility: hidden;
    transition: visibility 0s linear var(--pcs-panel-duration);
}
/* /Shared/Components/Layout/PcsResizeHandle.razor.rz.scp.css */
.pcs-resize-handle[b-bt1pgfehym] {
    flex: none;
    width: 6px;
    cursor: var(--pcs-cursor-col-resize);
    background: var(--pcs-bg-2);
    border-right: 1px solid var(--pcs-border-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    touch-action: none;
}

.pcs-resize-handle--vertical[b-bt1pgfehym] {
    width: auto;
    height: 6px;
    cursor: var(--pcs-cursor-row-resize);
    border-right: none;
    border-bottom: 1px solid var(--pcs-border-soft);
}

.pcs-resize-handle__grip[b-bt1pgfehym] {
    width: 2px;
    height: 28px;
    border-radius: 1px;
    background: var(--pcs-silver);
}

.pcs-resize-handle--vertical .pcs-resize-handle__grip[b-bt1pgfehym] {
    width: 28px;
    height: 2px;
}
/* /Shared/Components/Layout/PcsSplitter.razor.rz.scp.css */
.pcs-splitter[b-55oae5fwu9] {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.pcs-splitter--vertical[b-55oae5fwu9] {
    flex-direction: column;
}
/* /Shared/Components/Layout/PcsSplitterPane.razor.rz.scp.css */
.pcs-splitter__pane[b-qqmaksi113] {
    flex: 0 1 auto;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    /* A pane folds and opens like a collapsible panel; pcs.resizeDrag turns this
       off while a drag writes the width, or the pane would trail the pointer. */
    transition: var(--pcs-panel-transition);
}

@media (prefers-reduced-motion: reduce) {
    .pcs-splitter__pane[b-qqmaksi113] {
        transition: none;
    }
}

.pcs-splitter__pane--collapsed-start[b-qqmaksi113] {
    border-right: 1px solid var(--pcs-border-soft);
}

.pcs-splitter__pane--collapsed-end[b-qqmaksi113] {
    border-left: 1px solid var(--pcs-border-soft);
}

.pcs-splitter__pane--fill[b-qqmaksi113] {
    flex: 1 1 0;
}

.pcs-splitter__pane--vertical[b-qqmaksi113] {
    height: auto;
    width: 100%;
}
/* /Shared/Components/Menu/PcsMenu.razor.rz.scp.css */
/* The unified cursor-anchored menu (D-030) — one shell for the tab context
   menu, a row's action menu and F-006's ambiguous-click picker.
   Layer 800/801, the top of the interactive stack:
   - above dialogs (600), since a row's ⋮ can be opened inside one and must not
     be swallowed by its backdrop;
   - above the snackbar provider (700) — the open menu is what the user is
     interacting with;
   - below the unhandled-error banner (1000), which outranks everything.
   Both values move together: the scrim has to stay directly under the menu it
   closes, or the first click lands on the menu's own backdrop. */
.pcs-menu__scrim[b-fgc3j76hvm] {
    position: fixed;
    inset: 0;
    z-index: 800;
    background: transparent;
}

.pcs-menu[b-fgc3j76hvm] {
    position: fixed;
    z-index: 801;
    min-width: 200px;
    max-width: 320px;
    background: var(--pcs-white);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    padding: 6px 0;
    display: flex;
    flex-direction: column;
}

.pcs-menu__item[b-fgc3j76hvm] {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 7px 16px;
    text-align: left;
    cursor: pointer;
    font-family: var(--pcs-font-ui);
    font-size: 13px;
    color: var(--pcs-fg-1);
    display: flex;
    align-items: center;
    transition: background-color var(--pcs-transition);
}

.pcs-menu__item:hover[b-fgc3j76hvm] {
    background: var(--pcs-light-grey-3);
}

.pcs-menu__item-icon[b-fgc3j76hvm] {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pcs-menu__item-text[b-fgc3j76hvm] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.pcs-menu__item-label[b-fgc3j76hvm] {
    line-height: 18px;
}

/* What the command does, under its name — "Shape only · texts inside stay as
   they are". Quieter than the label, and wraps rather than widening the menu. */
.pcs-menu__item-description[b-fgc3j76hvm] {
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-fg-3);
    white-space: normal;
}

/* A consequence worth seeing before the pick — "Crosses the border by 14 mm".
   Not an error: the command still runs. */
.pcs-menu__item-note[b-fgc3j76hvm] {
    font-size: 11px;
    line-height: 15px;
    color: var(--pcs-warning);
    white-space: normal;
}

.pcs-menu__item-kbd[b-fgc3j76hvm] {
    margin-left: 16px;
    flex: none;
}

.pcs-menu__item[b-fgc3j76hvm]  .pcs-menu__item-chevron {
    margin-left: 12px;
    flex: none;
    color: var(--pcs-fg-3);
}

/* A row that opens a submenu holds it: the submenu sits beside the row, in
   the row's own box, so the pointer can travel into it without leaving. */
.pcs-menu__row[b-fgc3j76hvm] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.pcs-menu--sub[b-fgc3j76hvm] {
    position: absolute;
    left: 100%;
    top: -6px;
    margin-left: 2px;
}

.pcs-menu__item--open[b-fgc3j76hvm] {
    background: var(--pcs-light-grey-3);
}

/* Destructive variant — Destructive=true on the item (typically Delete).
   It rests in the ordinary row colour and turns red only under the pointer or
   the keyboard walk: a row that is red the whole time it is on screen reads as
   a warning about the menu rather than as one command's consequence, and it
   was the loudest thing in a menu whose other rows are routine. The icon
   follows because PcsSvgIcon strokes with currentColor. */
.pcs-menu__item--danger:hover[b-fgc3j76hvm] {
    background: var(--pcs-danger);
    color: var(--pcs-white);
}

/* The caption naming what the menu acts on. Not a row: no hover, no focus, no
   pick — PcsMenu's walk steps over it. */
.pcs-menu__header[b-fgc3j76hvm] {
    padding: 4px 16px 6px;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
    white-space: nowrap;
}

/* The rule between two groups of commands. */
.pcs-menu__rule[b-fgc3j76hvm] {
    height: 1px;
    margin: 5px 0;
    background: var(--pcs-border-soft);
}

/* Disabled state — the caller sets Enabled=false; the menu greys the row and
   ignores clicks. Every conversion and vertex command in F-006's context menu
   arrives this way rather than as a missing row: a command a user cannot find
   is a command they cannot learn. */
.pcs-menu__item.is-disabled[b-fgc3j76hvm],
.pcs-menu__item.is-disabled:hover[b-fgc3j76hvm] {
    color: var(--pcs-mid-grey);
    background: transparent;
    cursor: not-allowed;
}

/* The keyboard walk's highlight. Same weight as :hover, because the two are
   the same state reached two ways — the row that Enter would commit. */
.pcs-menu__item--focused[b-fgc3j76hvm],
.pcs-menu__item--focused:hover[b-fgc3j76hvm] {
    background: var(--pcs-light-grey-3);
}

.pcs-menu__item--danger.pcs-menu__item--focused[b-fgc3j76hvm] {
    background: var(--pcs-danger);
    color: var(--pcs-white);
}

.pcs-menu__item:focus-visible[b-fgc3j76hvm] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: -2px;
}
/* /Shared/Components/Menu/PcsMenuButton.razor.rz.scp.css */
.pcs-menu-button[b-ugwvs3icwh] {
    display: inline-flex;
}
/* /Shared/Components/Navigation/PcsRail.razor.rz.scp.css */
.pcs-rail[b-xlvbhr5f6f] {
    flex: none;
    width: 76px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 8px 6px;
    background: var(--pcs-white);
    border-right: var(--pcs-hairline) solid var(--pcs-border);
}

.pcs-rail[b-xlvbhr5f6f]  .pcs-rail__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 8px 2px;
    border-radius: var(--pcs-radius-control);
    color: var(--pcs-fg-2);
    font: 500 11px/14px var(--pcs-font-ui);
    text-align: center;
    transition: background-color var(--pcs-transition);
}

.pcs-rail[b-xlvbhr5f6f]  .pcs-rail__item:hover {
    background: var(--pcs-light-grey-3);
}

.pcs-rail[b-xlvbhr5f6f]  .pcs-rail__item.is-active {
    background: var(--pcs-bg-2);
    color: var(--pcs-fg-1);
}

/* Danish labels run about a third longer: wrap rather than clip. */
.pcs-rail__label[b-xlvbhr5f6f] {
    overflow-wrap: anywhere;
}
/* /Shared/Components/Navigation/PcsRailPanel.razor.rz.scp.css */
.pcs-rail-panel[b-3ywiidzt4i] {
    flex: none;
    display: flex;
    min-height: 0;
    background: var(--pcs-white);
    border-right: var(--pcs-hairline) solid var(--pcs-border);
}

/* Folded to nothing, it keeps no border either. */
.pcs-rail-panel--closed[b-3ywiidzt4i] {
    border-right-color: transparent;
}

.pcs-rail-panel__body[b-3ywiidzt4i] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0 14px 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
/* /Shared/Components/Navigation/PcsSideNavItem.razor.rz.scp.css */
/* Layout only: the row's look is the shared .pcs-nav-row (app.css), the same
   row PcsTreeView draws. */
.side-nav-item-wrapper[b-rbgac5a0ur] {
    margin-bottom: 2px;
}

.side-nav-item[b-rbgac5a0ur] {
    width: 100%;
    /* Left padding reserves a gutter for the expand chevron (absolutely placed
       below), so leaf and parent rows keep their icons aligned — same as the
       tree's toggle gutter. */
    padding: 0 14px 0 10px;
    position: relative;
}

.side-nav-item.is-disabled[b-rbgac5a0ur] {
    color: var(--pcs-mid-grey);
    cursor: not-allowed;
    opacity: 0.55;
}

[b-rbgac5a0ur] .side-nav-item__icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.side-nav-item__icon-slot[b-rbgac5a0ur] {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.side-nav-item__label[b-rbgac5a0ur] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The expand indicator sits in the left gutter, like the tree's toggle. */
.side-nav-item__chevron[b-rbgac5a0ur] {
    position: absolute;
    left: 14px;
    top: 50%;
    margin-top: -4px;
}

.side-nav-item__children[b-rbgac5a0ur] {
    display: flex;
    flex-direction: column;
    padding: 4px 0 6px;
}

.side-nav-subitem[b-rbgac5a0ur] {
    width: 100%;
    /* Indent text to align with parent label: 26px left padding (gutter+edge)
       + 20px icon + 8px gap = 54px. */
    padding: 0 14px 0 54px;
}
/* /Shared/Components/Overlays/PcsConfirmDialog.razor.rz.scp.css */
.pcs-confirm__detail[b-zxr2pybta9] {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 17px;
    color: var(--pcs-fg-3);
}
/* /Shared/Components/Overlays/PcsDialog.razor.rz.scp.css */
/* The backdrop, and placement on whole pixels, are .pcs-modal-backdrop / .pcs-modal-card (app.css). */
.dialog[b-qftxsmgg1x] {
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-modal);
    --pcs-modal-w: 640px;
    max-height: calc(100vh - 48px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* The card is a programmatic focus target only (tabindex="-1", the focus
   trap's fallback when the body has no focusable element) — a keypress must
   not paint the browser's focus ring around the whole dialog. */
.dialog:focus[b-qftxsmgg1x] {
    outline: none;
}

/* Near-full-screen variant for workspace content (floorplans manager, future
   editor) — wide and tall, capped so a backdrop margin always shows. */
.dialog--large[b-qftxsmgg1x] {
    --pcs-modal-w: min(1700px, 95vw);
    --pcs-modal-h: calc(100vh - 40px);
    max-height: none;
}

/* Sized by the user from the bottom-right corner (the browser's own handle);
   the inline size it sets wins over the width/height above, within the floors
   here and the viewport caps the card already has. The height floor is the
   header plus the smallest workspace a CAD editor lays out (480 px): a lower
   floor let the card shrink past its own content, which then scrolled inside
   the body. Capped by the viewport like the large card's own height: a floor
   taller than a short window would push the header, and its close button, off
   screen, because min-height outranks max-height. */
.dialog--resizable[b-qftxsmgg1x] {
    resize: both;
    min-width: 560px;
    min-height: min(560px, calc(100vh - 40px));
}

/* The browser window less a 10 px margin: still a card over a backdrop, so it
   reads as a modal, not a page. The whole-pixel placement (.pcs-modal-card) and
   the card's size caps give way. A user resize leaves an inline size on the card,
   which would outrank these, hence !important. */
.dialog--maximized[b-qftxsmgg1x] {
    position: fixed;
    inset: 10px;
    margin: 0;
    width: auto !important;
    height: auto !important;
    max-width: none;
    max-height: none;
}

.dialog__header[b-qftxsmgg1x] {
    height: 65px;
    display: flex;
    align-items: center;
    padding: 0 21px 0 30px;
    gap: 8px;
    border-bottom: 1px solid var(--pcs-border);
    flex-shrink: 0;
}

.dialog__title[b-qftxsmgg1x] {
    margin: 0;
    flex: 1;
    font: normal normal 600 17px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

/* Header icon buttons are PcsIconButton — no local button styling. */

/* Dialog body — a plain content holder. Padded by default for simple
   form dialogs; pass Padded=false when the body's child manages its own
   layout (e.g. TabPanel) and should fill edge-to-edge. */
.dialog__body[b-qftxsmgg1x] {
    overflow: auto;
    flex: 1;
    min-height: 0;
    background: var(--pcs-white);
    display: flex;
    flex-direction: column;
}

.dialog__body.is-padded[b-qftxsmgg1x] {
    padding: 24px 30px;
}

/* Default footer — right-aligned Cancel / Save action row. */
.dialog__footer[b-qftxsmgg1x] {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 0 30px;
    border-top: 1px solid var(--pcs-border);
    flex-shrink: 0;
    background: var(--pcs-white);
}

/* Footer buttons are PcsButton — no local button styling. */
/* /Shared/Components/Overlays/PcsDrawer.razor.rz.scp.css */
/* Anchored to the right edge of the positioned host. MudDrawer's temporary variant, with
   a scrim light enough that the page stays readable behind the drawer. Above the grids and
   the page's own popovers (60), below dialogs (600). */
.pcs-drawer__scrim[b-qmtftmyywm] {
    position: absolute;
    inset: 0;
    z-index: 65;
    background: rgba(0, 0, 0, 0.12);
}

.pcs-drawer[b-qmtftmyywm] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 70;
    max-width: 100%;
    display: flex;
    background: var(--pcs-white);
    border-left: 1px solid var(--pcs-border);
    box-shadow: -10px 0 28px rgba(0, 0, 0, 0.14);
}

/* MudDrawer's easing pair: decelerate in, accelerate out. Visibility flips after the
   closing transition so the hidden drawer takes no focus and no clicks. */
.pcs-drawer--open[b-qmtftmyywm] {
    transform: translateX(0);
    transition: transform 225ms cubic-bezier(0, 0, 0.2, 1);
}

.pcs-drawer--closed[b-qmtftmyywm] {
    transform: translateX(100%);
    visibility: hidden;
    transition: transform 195ms cubic-bezier(0.4, 0, 0.6, 1), visibility 0s linear 195ms;
}

@media (prefers-reduced-motion: reduce) {
    .pcs-drawer--open[b-qmtftmyywm],
    .pcs-drawer--closed[b-qmtftmyywm] {
        transition: none;
    }
}

.pcs-drawer__panel[b-qmtftmyywm] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.pcs-drawer__header[b-qmtftmyywm] {
    flex: none;
    height: 56px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 16px 0 20px;
    background: var(--pcs-white);
    color: var(--pcs-fg-1);
    border-bottom: 1px solid var(--pcs-border);
}

.pcs-drawer__title[b-qmtftmyywm] {
    font: normal normal 600 15px/20px var(--pcs-font-display);
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.pcs-drawer__sep[b-qmtftmyywm] {
    opacity: 0.5;
}

.pcs-drawer__meta[b-qmtftmyywm] {
    color: var(--pcs-fg-2);
    font-weight: 500;
    font-size: 13px;
    line-height: 18px;
    white-space: nowrap;
}

.pcs-drawer__desc[b-qmtftmyywm] {
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pcs-drawer__spacer[b-qmtftmyywm] {
    flex: 1;
}

.pcs-drawer__body[b-qmtftmyywm] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.pcs-drawer__footer[b-qmtftmyywm] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-top: 1px solid var(--pcs-border);
    background: var(--pcs-white);
}
/* /Shared/Components/Overlays/PcsPopover.razor.rz.scp.css */
.pcs-popover-anchor[b-p7qf3h3hd4] {
    display: inline-flex;
}

/* Same layers as PcsMenu (see its stylesheet): above dialogs, so a popover
   opened inside the settings dialog is not swallowed by its backdrop. */
.pcs-popover__scrim[b-p7qf3h3hd4] {
    position: fixed;
    inset: 0;
    z-index: 800;
    background: transparent;
}

.pcs-popover[b-p7qf3h3hd4] {
    position: fixed;
    z-index: 801;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;
    background: var(--pcs-white);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
}
/* /Shared/Components/PcsBadge.razor.rz.scp.css */
.pcs-badge[b-gfl85p5uu1] {
    display: inline-flex;
    align-items: center;
    border-radius: var(--pcs-radius-pill);
    white-space: nowrap;
}

.pcs-badge--neutral[b-gfl85p5uu1] {
    padding: 2px 10px;
    background: var(--pcs-light-grey-2);
    font: normal normal 500 11px/16px var(--pcs-font-ui);
    letter-spacing: 0.3px;
    text-transform: uppercase;
    color: var(--pcs-charcoal);
}

.pcs-badge--outline[b-gfl85p5uu1] {
    padding: 3px 9px;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    font: normal normal 400 11px/16px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.pcs-badge--accent[b-gfl85p5uu1] {
    padding: 4px 10px;
    background: var(--pcs-light-grey-3);
    font: normal normal 500 12px/16px var(--pcs-font-ui);
    color: var(--pcs-atoll);
}
/* /Shared/Components/PcsButtonGroup.razor.rz.scp.css */
.pcs-btn-group[b-gnc58fwkrk] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pcs-btn-group--start[b-gnc58fwkrk] {
    justify-content: flex-start;
}

.pcs-btn-group--end[b-gnc58fwkrk] {
    justify-content: flex-end;
}

.pcs-btn-group--stretch[b-gnc58fwkrk]  > * {
    flex: 1;
    min-width: 0;
}

/* Joined: one control made of several buttons. The gap goes, the inner borders
   collapse onto each other, and only the outer ends stay rounded. */
.pcs-btn-group--joined[b-gnc58fwkrk] {
    gap: 0;
}

.pcs-btn-group--joined[b-gnc58fwkrk]  > *:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -1px;
}

.pcs-btn-group--joined[b-gnc58fwkrk]  > *:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/* The hovered/active member has to paint its border over its neighbour's. */
.pcs-btn-group--joined[b-gnc58fwkrk]  > *:hover,
.pcs-btn-group--joined[b-gnc58fwkrk]  > *:focus-visible,
.pcs-btn-group--joined[b-gnc58fwkrk]  > *.is-active {
    position: relative;
    z-index: 1;
}
/* /Shared/Components/PcsCadPropertiesPanel.razor.rz.scp.css */
.pcs-cad-properties[b-swyynkgmwh] {
    display: flex;
    flex-direction: column;
    gap: var(--pcs-sp-4);
    padding: var(--pcs-sp-15);
    min-width: 0;
}

.pcs-cad-properties__header[b-swyynkgmwh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--pcs-sp-4);
    min-width: 0;
}

.pcs-cad-properties__kind[b-swyynkgmwh] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Label column fixed, control column takes the rest — every row lines up
   whichever shape's fields are showing. */
.pcs-cad-properties__row[b-swyynkgmwh] {
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    align-items: center;
    gap: var(--pcs-sp-4);
    min-width: 0;
}

.pcs-cad-properties__label[b-swyynkgmwh] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Layout only: the swatch spans its grid cell here. Its look and height come
   from the shared .pcs-color / --sm class. */
[b-swyynkgmwh] .pcs-cad-properties__color {
    width: 100%;
}
/* /Shared/Components/PcsCard.razor.rz.scp.css */
.pcs-card[b-wte7z603k5] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: var(--pcs-hairline) solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-white);
    text-align: left;
    transition: border-color var(--pcs-transition), box-shadow var(--pcs-transition);
}

.pcs-card--clickable[b-wte7z603k5] {
    cursor: pointer;
}

.pcs-card--clickable:hover[b-wte7z603k5],
.pcs-card--clickable:focus-visible[b-wte7z603k5],
.pcs-card:focus-within[b-wte7z603k5] {
    border-color: var(--pcs-blue-mid);
    box-shadow: var(--pcs-shadow-1);
}

.pcs-card--clickable:focus-visible[b-wte7z603k5] {
    outline: none;
}

/* Picked: the accent border and a soft halo in the muted brand blue. */
.pcs-card.is-selected[b-wte7z603k5] {
    border-color: var(--pcs-accent);
    box-shadow: 0 0 0 2px var(--pcs-blue-mid);
}

.pcs-card__media[b-wte7z603k5] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    background: var(--pcs-bg-2);
    border-bottom: var(--pcs-hairline) solid var(--pcs-border);
    color: var(--pcs-mid-grey);
}

.pcs-card__media[b-wte7z603k5]  :is(svg, img) {
    max-width: 100%;
    max-height: 100%;
}

/* Over the preview, on hover or keyboard focus. The layer itself lets a
   click through — it covers the whole preview, and a card that only opened
   from its text strip looked clickable and was not. Only its buttons catch. */
.pcs-card__actions[b-wte7z603k5] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--pcs-transition);
}

.pcs-card__actions[b-wte7z603k5] >  * {
    pointer-events: auto;
}

.pcs-card:hover .pcs-card__actions[b-wte7z603k5],
.pcs-card__actions:focus-within[b-wte7z603k5] {
    opacity: 1;
}

/* The corner menu; no opacity on the container — the menu's fixed popover is
   a DOM descendant and would fade with it. The trigger fades instead. */
.pcs-card__menu[b-wte7z603k5] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 1;
}

.pcs-card__menu[b-wte7z603k5]  .pcs-menu-button__dots {
    opacity: 0;
    background: color-mix(in srgb, var(--pcs-white) 85%, transparent);
}

.pcs-card:hover .pcs-card__menu[b-wte7z603k5]  .pcs-menu-button__dots,
.pcs-card__menu:focus-within[b-wte7z603k5]  .pcs-menu-button__dots,
.pcs-card__menu[b-wte7z603k5]  .pcs-menu-button__dots.is-open {
    opacity: 1;
}

.pcs-card__body[b-wte7z603k5] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    padding: 10px 12px 12px;
}

.pcs-card__head[b-wte7z603k5] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.pcs-card__title[b-wte7z603k5] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font: 600 13px/18px var(--pcs-font-ui);
    color: var(--pcs-fg-1);
}

.pcs-card__extra[b-wte7z603k5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: none;
}

/* As a list row. */
.pcs-card--row[b-wte7z603k5] {
    flex-direction: row;
    align-items: center;
}

.pcs-card--row .pcs-card__media[b-wte7z603k5] {
    flex: none;
    width: 88px;
    height: 62px;
    padding: 6px;
    border-bottom: none;
    border-right: var(--pcs-hairline) solid var(--pcs-border);
}

.pcs-card--row .pcs-card__actions[b-wte7z603k5] {
    display: none;
}

.pcs-card--row .pcs-card__body[b-wte7z603k5] {
    flex: 1;
}

/* The quiet meta line, for the caller's ChildContent. */
.pcs-card__body[b-wte7z603k5]  .pcs-card__meta {
    font-size: 12px;
    line-height: 16px;
    color: var(--pcs-fg-2);
}
/* /Shared/Components/PcsChip.razor.rz.scp.css */
.pcs-chip[b-v08hw2wq46] {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 10px;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    background: var(--pcs-white);
    font: normal normal 500 11px/22px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
    white-space: nowrap;
    cursor: pointer;
    transition: background var(--pcs-transition), border-color var(--pcs-transition);
}

/* Scoped away from the active chip on purpose. Plain `.pcs-chip:hover` is
   (0,3,0) and the active rule below is (0,2,0), so hovering a selected chip
   repainted its background white and left the white label on it. */
.pcs-chip:not(.is-active):hover:not(:disabled)[b-v08hw2wq46] {
    background: var(--pcs-light-grey-3);
}

.pcs-chip:focus-visible[b-v08hw2wq46] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

.pcs-chip:disabled[b-v08hw2wq46] {
    cursor: default;
    opacity: 0.5;
}

.pcs-chip--neutral.is-active[b-v08hw2wq46] {
    background: var(--pcs-atoll);
    border-color: var(--pcs-atoll);
    color: var(--pcs-white);
}

/* Warning chips read as a problem before they are picked, and as the problem
   being looked at once they are. */
.pcs-chip--warning[b-v08hw2wq46] {
    color: var(--pcs-warning);
}

.pcs-chip--warning.is-active[b-v08hw2wq46] {
    background: var(--pcs-warning);
    border-color: var(--pcs-warning);
    color: var(--pcs-white);
}

.pcs-chip--neutral.is-active:hover:not(:disabled)[b-v08hw2wq46],
.pcs-chip--warning.is-active:hover:not(:disabled)[b-v08hw2wq46] {
    filter: brightness(1.08);
}
/* /Shared/Components/PcsIcon.razor.rz.scp.css */
.pcs-icon[b-atrb6hmlhf] {
    display: block;
    user-select: none;
    pointer-events: none;
}

/* The library file as a mask, painted in the host's text colour. This is what
   lets a button's icon be the same colour as its label — an <img> cannot, and
   the per-feature `filter: brightness(0) invert(1)` workarounds it bred are
   what left a secondary button showing a white glyph on white. */
.pcs-icon--mono[b-atrb6hmlhf] {
    background-color: currentColor;
    mask-image: var(--pcs-icon-src);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-image: var(--pcs-icon-src);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    flex-shrink: 0;
}
/* /Shared/Components/PcsIconButton.razor.rz.scp.css */
.pcs-icon-btn[b-di79jhagyj] {
    border: 0;
    padding: 0;
    background: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--pcs-charcoal);
    border-radius: var(--pcs-radius-control);
    cursor: pointer;
    transition: background-color var(--pcs-transition), color var(--pcs-transition);
}

/* Squares on the shared control scale: a Small icon button is as tall as a
   Small button or field, so a toolbar row lines up. */
.pcs-icon-btn--sm[b-di79jhagyj] {
    width: var(--pcs-control-h-sm);
    height: var(--pcs-control-h-sm);
}

.pcs-icon-btn--md[b-di79jhagyj] {
    width: var(--pcs-control-h-md);
    height: var(--pcs-control-h-md);
}

.pcs-icon-btn--lg[b-di79jhagyj] {
    width: var(--pcs-control-h-lg);
    height: var(--pcs-control-h-lg);
}

/* Dense: one step down, for rows, chips, card actions and panel chrome, where
   a full-height square reads as a wall. */
.pcs-icon-btn--dense.pcs-icon-btn--sm[b-di79jhagyj] {
    width: var(--pcs-control-h-dense-sm);
    height: var(--pcs-control-h-dense-sm);
}

.pcs-icon-btn--dense.pcs-icon-btn--md[b-di79jhagyj] {
    width: var(--pcs-control-h-dense-md);
    height: var(--pcs-control-h-dense-md);
}

.pcs-icon-btn--dense.pcs-icon-btn--lg[b-di79jhagyj] {
    width: var(--pcs-control-h-dense-lg);
    height: var(--pcs-control-h-dense-lg);
}

.pcs-icon-btn--muted[b-di79jhagyj] {
    color: var(--pcs-mid-grey);
}

.pcs-icon-btn:hover:not(:disabled)[b-di79jhagyj] {
    background: var(--pcs-light-grey-3);
}

.pcs-icon-btn--muted:hover:not(:disabled)[b-di79jhagyj] {
    color: var(--pcs-charcoal);
}

.pcs-icon-btn--danger:hover:not(:disabled)[b-di79jhagyj] {
    color: var(--pcs-danger);
}

/* Bordered chrome: a Secondary button shrunk to a square, for a toolbar where
   the icon button carries the same weight as the text buttons around it. */
.pcs-icon-btn--outlined[b-di79jhagyj] {
    border: 1px solid var(--pcs-border);
    background: var(--pcs-white);
}

/* Panel chrome. The transparent border is held from the start so hovering
   changes its colour rather than its box, and the square does not jump — which
   is also why it is a literal 1px and not --pcs-hairline: it is reserving
   layout, not drawing a rule, and it has to reserve exactly what the hover
   border will occupy. */
.pcs-icon-btn--chrome[b-di79jhagyj] {
    border: 1px solid transparent;
    color: var(--pcs-mid-grey);
}

/* White, not the Ghost wash: this sits on a panel header that is already grey,
   where a grey hover says nothing. */
.pcs-icon-btn--chrome:hover:not(:disabled)[b-di79jhagyj] {
    background: var(--pcs-white);
    border-color: var(--pcs-border);
    color: var(--pcs-fg-1);
}

.pcs-icon-btn--chrome.is-active[b-di79jhagyj] {
    background: var(--pcs-light-grey-3);
    border-color: var(--pcs-border);
    color: var(--pcs-fg-1);
}

.pcs-icon-btn:focus-visible[b-di79jhagyj] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

.pcs-icon-btn.is-active[b-di79jhagyj] {
    background: var(--pcs-light-grey-3);
    color: var(--pcs-atoll);
}

/* An outlined square is a toggle (B/I/U, angle lock) and already sits on a
   light ground with a grey border, so the tint alone left pressed and
   unpressed a shade apart. The border is what says "on". */
.pcs-icon-btn--outlined.is-active[b-di79jhagyj] {
    border-color: var(--pcs-accent);
    box-shadow: inset 0 0 0 1px var(--pcs-accent);
}

/* The no-entry cursor a disabled ribbon tool shows (.ribbon__tip): a disabled
   icon button still gets pointer events — its tip says why it is off — so the
   cursor can say it too. */
.pcs-icon-btn:disabled[b-di79jhagyj] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Shared/Components/PcsSegmentedControl.razor.rz.scp.css */
/* One look for every one-of-many switch: a recessed grey track, the selected
   cell raised to white and inked atoll. The six versions this replaced each
   answered "what does selected look like?" differently — filled atoll, filled
   grey, raised white — which is exactly the drift a primitive exists to stop. */
.pcs-segmented[b-63mxfpv9d8] {
    display: inline-flex;
    flex: none;
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-control);
    background: var(--pcs-light-grey-3);
    overflow: hidden;
}

.pcs-segmented--stretch[b-63mxfpv9d8] {
    display: flex;
    flex: 1 1 auto;
}

.pcs-segmented--stretch .pcs-segmented__cell[b-63mxfpv9d8] {
    flex: 1;
}

.pcs-segmented__cell[b-63mxfpv9d8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: var(--pcs-mid-grey);
    font-family: var(--pcs-font-ui);
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color var(--pcs-transition), color var(--pcs-transition);
}

.pcs-segmented__cell + .pcs-segmented__cell[b-63mxfpv9d8] {
    border-left: 1px solid var(--pcs-border);
}

.pcs-segmented__cell:hover:not(:disabled):not(.is-active)[b-63mxfpv9d8] {
    color: var(--pcs-charcoal);
}

.pcs-segmented__cell.is-active[b-63mxfpv9d8] {
    background: var(--pcs-white);
    color: var(--pcs-atoll);
}

.pcs-segmented__cell:disabled[b-63mxfpv9d8] {
    opacity: 0.5;
    cursor: default;
}

.pcs-segmented__cell:focus-visible[b-63mxfpv9d8] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: -2px;
}

/* ─── Size ───────────────────────────────────────────────────────────────────
   The height is the track's and the cells stretch into it — not the scale
   minus 2px on each cell, which a 1px border only makes exact at 100% scaling. */
.pcs-segmented--sm[b-63mxfpv9d8] {
    height: var(--pcs-control-h-sm);
}

.pcs-segmented--sm .pcs-segmented__cell[b-63mxfpv9d8] {
    min-width: var(--pcs-control-h-sm);
    padding: 0 12px;
    font-size: 12px;
}

.pcs-segmented--md[b-63mxfpv9d8] {
    height: var(--pcs-control-h-md);
}

.pcs-segmented--md .pcs-segmented__cell[b-63mxfpv9d8] {
    min-width: var(--pcs-control-h-md);
    padding: 0 16px;
    font-size: 13px;
}

.pcs-segmented--lg[b-63mxfpv9d8] {
    height: var(--pcs-control-h-lg);
}

.pcs-segmented--lg .pcs-segmented__cell[b-63mxfpv9d8] {
    min-width: var(--pcs-control-h-lg);
    padding: 0 20px;
    font-size: 14px;
}

/* An icon-only cell is square, not padded like a labelled one. */
.pcs-segmented__cell--icon[b-63mxfpv9d8] {
    padding: 0;
}
/* /Shared/Components/PcsToolButton.razor.rz.scp.css */


.tool-button[b-d6hmvoaqsp] {
    width: 46px;
    height: 46px;
    border-radius: var(--pcs-radius-control);
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--pcs-charcoal);
    padding: 0;
    transition: background-color var(--pcs-transition), border-color var(--pcs-transition);
}

.tool-button:hover[b-d6hmvoaqsp] {
    background: var(--pcs-light-grey-3);
}

.tool-button:focus-visible[b-d6hmvoaqsp] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

.tool-button.is-active[b-d6hmvoaqsp] {
    background: var(--pcs-light-grey-3);
}

/* A tool that cannot be armed here (a read-only frame): faded like a disabled
   ribbon action — an <img> ignores currentColor, so opacity and grayscale. */
.tool-button:disabled[b-d6hmvoaqsp] {
    opacity: 0.4;
    filter: grayscale(1);
    cursor: default;
    pointer-events: none;
}
/* /Shared/Components/PcsTooltip.razor.rz.scp.css */
/* Host stays layout-transparent: an inline wrapper that inherits whatever the
   consumer's class (via CssClass) dictates — including flex/ellipsis roles. */
.pcs-tooltip-host[b-yku8xhznai] {
    display: inline;
}
/* /Shared/Components/Settings/PcsSettingsAnchor.razor.rz.scp.css */
/* Anchored feature markup sits nested inside a section's rows block, so the
   flash hugs the wrapped row (slight horizontal bleed for breathing room)
   instead of using the root-level inset sized for 32px-padded rows. */
.settings-anchor[b-cg3w102942] {
    --pcs-settings-flash-inset: 2px -8px;
}
/* /Shared/Components/Settings/PcsSettingsDialog.razor.rz.scp.css */
/* The backdrop, and placement on whole pixels, are .pcs-modal-backdrop / .pcs-modal-card (app.css). */
.settings-dialog[b-peta4jae6i] {
    display: flex;
    --pcs-modal-w: min(1200px, 94vw);
    --pcs-modal-h: 880px;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-modal);
    overflow: hidden;
}

/* The card is a programmatic focus target only (tabindex="-1", the focus
   trap's fallback when the body has no focusable element) — a keypress must
   not paint the browser's focus ring around the whole dialog. */
.settings-dialog:focus[b-peta4jae6i] {
    outline: none;
}

/* ── Sidebar: LeftNavPanel (project-page component) supplies its own width,
      background, collapse behaviour and title styling. ─────────────────── */

/* ── Detail pane ─────────────────────────────────────────────────────── */

.settings-dialog__content[b-peta4jae6i] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--pcs-white);
}

.settings-dialog__header[b-peta4jae6i] {
    height: 65px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 21px 0 32px;
    border-bottom: 1px solid var(--pcs-border);
}

.settings-dialog__detail-title[b-peta4jae6i] {
    margin: 0;
    flex: 1;
    font: normal normal 600 17px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

/* White all the way through — blocks separate with hairlines (the sections'
   top borders), not gaps. */
.settings-dialog__body[b-peta4jae6i] {
    flex: 1;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
    background: var(--pcs-white);
}

/* Keep-alive wrappers around visited sections: layout-neutral when active,
   fully hidden (but mounted) otherwise. */
.settings-dialog__section[b-peta4jae6i] {
    display: contents;
}

.settings-dialog__section.is-hidden[b-peta4jae6i] {
    display: none;
}
/* /Shared/Components/Settings/PcsSettingsExpander.razor.rz.scp.css */
.settings-expander[b-e5a5tzhnf1] {
    border-bottom: 1px solid var(--pcs-light-grey-2);
}

.settings-expander:last-child[b-e5a5tzhnf1] {
    border-bottom: 0;
}

.settings-expander__header[b-e5a5tzhnf1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 14px 8px 14px 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.settings-expander__header:focus-visible[b-e5a5tzhnf1] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

.settings-expander__text[b-e5a5tzhnf1] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

/* Like the section headline, but regular weight — the bold headline leads. */
.settings-expander__title[b-e5a5tzhnf1] {
    font: normal normal 400 14px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.settings-expander__title--strong[b-e5a5tzhnf1] {
    font-weight: 600;
}

.settings-expander__meta[b-e5a5tzhnf1] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

[b-e5a5tzhnf1] .settings-expander__chevron {
    flex: none;
    color: var(--pcs-charcoal);
    transition: transform var(--pcs-transition);
}

[b-e5a5tzhnf1] .settings-expander__chevron.is-open {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    [b-e5a5tzhnf1] .settings-expander__chevron {
        transition: none;
    }
}

.settings-expander__content[b-e5a5tzhnf1] {
    padding: 0 8px 16px 0;
}
/* /Shared/Components/Settings/PcsSettingsRow.razor.rz.scp.css */
.settings-row[b-kcvu7e9pzh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 32px;
    background: var(--pcs-white);
}

/* Adjacent rows separate with the same hairline the sections use. */
.settings-row + .settings-row[b-kcvu7e9pzh] {
    border-top: 1px solid var(--pcs-light-grey-2);
}

.settings-row__text[b-kcvu7e9pzh] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.settings-row__label[b-kcvu7e9pzh] {
    font: normal normal 600 15px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.settings-row__meta[b-kcvu7e9pzh] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

/* Dense: the PcsSettingsExpander rhythm — 14px regular title over a 12px meta,
   tight vertical padding, no strip — for a list of like rows. */
.settings-row--dense[b-kcvu7e9pzh] {
    padding: 8px 8px 8px 0;
    background: transparent;
    /* The search flash's default inset is sized for the 32px-padded strip; a dense
       row has no left padding, so the flash hugs it with a little bleed instead,
       as a nested anchor's does. */
    --pcs-settings-flash-inset: 2px -8px;
}

.settings-row--dense .settings-row__label[b-kcvu7e9pzh] {
    font: normal normal 400 14px/20px var(--pcs-font-ui);
}

/* One control column for every row in the list, so a record's inputs line up
   whatever control each row holds; the control fills it (::deep — it is rendered
   by the caller's component), and a hint or error under it wraps at that width
   instead of pushing the column wider. */
.settings-row--dense .settings-row__controls[b-kcvu7e9pzh] {
    flex: none;
    width: 320px;
}

.settings-row--dense .settings-row__controls[b-kcvu7e9pzh]  > * {
    flex: 1;
    min-width: 0;
}

.settings-row__controls[b-kcvu7e9pzh] {
    display: flex;
    align-items: center;
    gap: 10px;
}
/* /Shared/Components/Settings/PcsSettingsSearch.razor.rz.scp.css */
/* Fills the header slot the detail title normally occupies. */
.settings-search[b-gzftknrziz] {
    flex: 1;
    min-width: 0;
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* The field fills the header slot; everything else about it — the clear
   button, its lane, the focus behaviour — belongs to PcsIconInput. */
.settings-search[b-gzftknrziz]  .settings-search__input {
    flex: 1;
    min-width: 0;
}

/* Dropdown overlays the dialog body below the header. */
.settings-search__results[b-gzftknrziz],
.settings-search__empty[b-gzftknrziz] {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    right: 0;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-modal);
    z-index: 20;
}

.settings-search__results[b-gzftknrziz] {
    margin: 0;
    padding: 6px;
    list-style: none;
    max-height: calc(420px + 12px);
    overflow: auto;
}

.settings-search__result[b-gzftknrziz] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: var(--pcs-radius-sm);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.settings-search__result.is-active[b-gzftknrziz] {
    background: var(--pcs-light-grey-3);
}

.settings-search__result-title[b-gzftknrziz] {
    font: normal normal 500 13px/18px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.settings-search__result-meta[b-gzftknrziz] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

.settings-search__empty[b-gzftknrziz] {
    padding: 12px 14px;
    font: normal normal 400 13px/18px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}
/* /Shared/Components/Settings/PcsSettingsSection.razor.rz.scp.css */
/* The top border is the hr-style separator to whatever sits above (the
   Drawing-Module-Size row, the previous section). */
.settings-section[b-ubiqtur2kr] {
    background: var(--pcs-white);
    padding: 24px 32px 12px;
    border-top: 1px solid var(--pcs-light-grey-2);
}

.settings-section__header[b-ubiqtur2kr] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0 0 10px;
}

/* The collapsible variant: the whole header is the disclosure button —
   headline + meta left, expander-style chevron right. */
.settings-section__header--toggle[b-ubiqtur2kr] {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.settings-section__header--toggle:focus-visible[b-ubiqtur2kr] {
    outline: 2px solid var(--pcs-focus-color);
    outline-offset: 1px;
}

.settings-section__text[b-ubiqtur2kr] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.settings-section__headline[b-ubiqtur2kr] {
    margin: 0;
    font: normal normal 600 14px/20px var(--pcs-font-ui);
    color: var(--pcs-charcoal);
}

.settings-section__meta[b-ubiqtur2kr] {
    font: normal normal 400 12px/16px var(--pcs-font-ui);
    color: var(--pcs-mid-grey);
}

[b-ubiqtur2kr] .settings-section__chevron {
    flex: none;
    color: var(--pcs-charcoal);
    transition: transform var(--pcs-transition);
}

[b-ubiqtur2kr] .settings-section__chevron.is-open {
    transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    [b-ubiqtur2kr] .settings-section__chevron {
        transition: none;
    }
}

/* Rows are indented from the headline; the hairline under the headline
   follows the indent. The rows (PcsSettingsExpander) draw their own
   separators below each entry. */
.settings-section__rows[b-ubiqtur2kr] {
    border-top: 1px solid var(--pcs-light-grey-2);
    margin-left: 30px;
}

.settings-section__rows--flush[b-ubiqtur2kr] {
    border-top: 0;
    margin-left: 0;
}

/* The page's one block: its grid's scrollbar sits at the dialog's edge, through the
   section's 32 px right padding. */
.settings-section--fill[b-ubiqtur2kr] {
    --pcs-scroll-bleed: 32px;
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.settings-section--fill > .settings-section__rows[b-ubiqtur2kr] {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

/* /Shared/Components/Tabs/PcsTabList.razor.rz.scp.css */
.tabs[b-suim9dai81] {
    padding: 4px 4px 0;
    background: var(--pcs-light-grey-2);
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.tabs__row[b-suim9dai81] {
    display: flex;
    align-items: flex-end;
    height: 56px;
    margin-bottom: -1px;
}

.tabs__filler[b-suim9dai81] {
    flex: 1 0 0;
    align-self: stretch;
    border-bottom: 1px solid var(--pcs-border);
}

/* Scroll viewport for the tab list. Tabs keep their natural width and
   overflow horizontally; scrollbar is hidden, the chevron buttons drive
   navigation. */
.tabs__scroll[b-suim9dai81] {
    flex: 0 1 auto;
    min-width: 0;
    align-self: stretch;
    display: flex;
    align-items: flex-end;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    /* The edge belongs to the strip, not to whichever tab happens to be at it.
       A tab only carries a left border when it starts a group, so scrolling to
       the middle of one put a tab's bare background against the panel's own
       border below — no line, and a square corner where the panel is round.
       Drawn here it is always present and always in the same place, and the
       radius clips whatever has scrolled under it to the same corner. */
    border-left: var(--pcs-hairline) solid var(--pcs-border);
    border-top-left-radius: var(--pcs-radius-sm);
}

/* Mid-pan: 1:1 with the pointer, so the smooth scrolling that carries a tab
   into view is suspended, and no text is selected by the sweep. */
.tabs__scroll.is-panning[b-suim9dai81] {
    scroll-behavior: auto;
    cursor: var(--pcs-cursor-grabbing);
    user-select: none;
}

/* Reorder mode. The strip says so: every tab takes the move cursor, and the
   one being dragged and its drop edge are already drawn by .tab--dragging /
   .tab--drop-before. */
.tabs__scroll[data-reorder="true"][b-suim9dai81]  .tab {
    cursor: move;
}

.tabs__scroll[b-suim9dai81]::-webkit-scrollbar {
    display: none;
}


/* Action group on the right: scroll chevrons (when overflow exists)
   and the add-tab button. The wrapper stretches the row height so the
   bottom border line stays continuous. */
.tabs__actions[b-suim9dai81] {
    align-self: stretch;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border-bottom: 1px solid var(--pcs-border);
    flex-shrink: 0;
}

/* Anchor for the all-tabs dropdown. The dropdown component is rendered
   as a child of this wrapper so its position: absolute resolves against
   the trigger button. */
.tabs__overflow[b-suim9dai81] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

/* Individual tab button in the strip. Borders are applied conditionally
   so adjacent tabs in the same group share an edge. */
.tab[b-suim9dai81] {
    height: 57px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 18px;
    border-top: 1px solid var(--pcs-border);
    border-right: 1px solid var(--pcs-border);
    border-left: none;
    border-bottom: 1px solid var(--pcs-border);
    background: var(--pcs-light-grey-3);
    font-family: var(--pcs-font-ui);
    font-size: 14px;
    font-weight: 500;
    color: var(--pcs-fg-1);
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    white-space: nowrap;
}

.tab.tab--starts[b-suim9dai81] {
    border-left: 1px solid var(--pcs-border);
    border-top-left-radius: var(--pcs-radius-sm);
    margin-left: 4px;
}

/* The first tab on the row sits flush at the left of the wrapper and gives up
   only its border — the strip draws that, so two would land on the same pixel
   and read as 2px. It keeps its own radius: that is the corner you actually
   see when the strip is at the start, and the strip's radius (which clips a
   tab scrolled under the edge) sits on exactly the same 4px. A later group's
   --starts keeps its border too — that one divides two groups mid-row, a
   different line doing a different job. */
.tab.tab--starts:first-child[b-suim9dai81],
.tab--editing.tab--starts:first-child[b-suim9dai81] {
    margin-left: 0;
    border-left: none;
}

.tab.tab--ends[b-suim9dai81] {
    border-top-right-radius: var(--pcs-radius-sm);
}

.tab.is-active[b-suim9dai81] {
    background: var(--pcs-white);
    border-bottom-color: var(--pcs-white);
}

.tab__icon[b-suim9dai81] {
    width: 14px;
    height: 14px;
    border-radius: 1.5px;
}

/* The editing variant of a tab — same chrome as a regular tab so the
   strip doesn't visually jump while renaming. */
.tab--editing[b-suim9dai81] {
    height: 57px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 18px;
    border-top: 1px solid var(--pcs-border);
    border-right: 1px solid var(--pcs-border);
    border-left: none;
    border-bottom: 1px solid var(--pcs-border);
    background: var(--pcs-white);
    font-family: var(--pcs-font-ui);
    font-size: 14px;
    font-weight: 500;
    color: var(--pcs-fg-1);
    position: relative;
    flex-shrink: 0;
    white-space: nowrap;
}

.tab--editing.tab--starts[b-suim9dai81] {
    border-left: 1px solid var(--pcs-border);
    border-top-left-radius: var(--pcs-radius-sm);
    margin-left: 4px;
}

.tab--editing.tab--starts:first-child[b-suim9dai81] {
    margin-left: 0;
}

.tab--editing.tab--ends[b-suim9dai81] {
    border-top-right-radius: var(--pcs-radius-sm);
}

[b-suim9dai81] .tab__rename-input {
    appearance: none;
    border: 0;
    outline: none;
    background: transparent;
    font: inherit;
    color: inherit;
    padding: 0;
    margin: 0;
}

[b-suim9dai81] .tab__rename-input:focus {
    outline: 1px solid var(--pcs-focus-color);
    outline-offset: 2px;
    border-radius: 1px;
}

/* Drag-reorder affordances: the insertion edge on the hovered tab, and a
   dimmed source while it is in flight. */
.tab--drop-before[b-suim9dai81] {
    box-shadow: inset 3px 0 0 var(--pcs-blue, #2962ff);
}

/* Appending past the last tab: the insertion edge sits at the filler's
   left border, i.e. right after the final tab. */
.tabs__filler--drop[b-suim9dai81] {
    box-shadow: inset 3px 0 0 var(--pcs-blue, #2962ff);
}

.tab--dragging[b-suim9dai81] {
    opacity: 0.5;
}
/* /Shared/Components/Tabs/PcsTabOverflowMenu.razor.rz.scp.css */
.tab-overflow__scrim[b-r7480y4h2e] {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: transparent;
}

.tab-overflow[b-r7480y4h2e] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    min-width: 220px;
    max-height: calc(360px + 12px);
    overflow-y: auto;
    background: var(--pcs-white);
    border-radius: var(--pcs-radius-md);
    box-shadow: var(--pcs-shadow-menu);
    padding: 6px 0;
    z-index: 62;
    display: flex;
    flex-direction: column;
}

.tab-overflow__header[b-r7480y4h2e] {
    padding: 8px 16px 4px;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.tab-overflow__sep[b-r7480y4h2e] {
    height: var(--pcs-hairline);
    background: var(--pcs-border);
    margin: 4px 0;
}

/* Group divider — mirrors the "ALL TABS" header styling so the popup
   reads as a series of titled sections; the top border doubles as the
   group separator line. */
.tab-overflow__group-label[b-r7480y4h2e] {
    padding: 8px 16px 4px;
    margin-top: 4px;
    border-top: 1px solid var(--pcs-border);
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
}

.tab-overflow__item[b-r7480y4h2e] {
    appearance: none;
    background: transparent;
    border: 0;
    padding: 7px 16px;
    text-align: left;
    cursor: pointer;
    font-family: var(--pcs-font-ui);
    font-size: 13px;
    color: var(--pcs-fg-1);
    display: flex;
    align-items: center;
    transition: background-color var(--pcs-transition);
}

.tab-overflow__item:hover[b-r7480y4h2e] {
    background: var(--pcs-light-grey-3);
}

.tab-overflow__item.is-active[b-r7480y4h2e] {
    background: var(--pcs-light-grey-2);
    font-weight: 600;
}

.tab-overflow__item-icon[b-r7480y4h2e] {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    margin-right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.tab-overflow__item-label[b-r7480y4h2e] {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The mode item. Its icon sits in the same column the tab icons use, so the
   two kinds of row line up instead of the label stepping left and right. */
.tab-overflow__item--mode .tab-overflow__item-icon[b-r7480y4h2e] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    color: var(--pcs-fg-2);
}

/* While the mode is on the item says so twice: the wording changes to "Done
   rearranging", and the row holds the accent — a menu item that still reads as
   an invitation while you are already in the mode tells you nothing. */
.tab-overflow__item--mode.is-on[b-r7480y4h2e] {
    color: var(--pcs-atoll);
    font-weight: 600;
}

.tab-overflow__item--mode.is-on .tab-overflow__item-icon[b-r7480y4h2e] {
    color: var(--pcs-atoll);
}
/* /Shared/Components/Tabs/PcsTabPanel.razor.rz.scp.css */
.tab-panel[b-c7qnbqgu34] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* === Dialog variant ====================================================
   Shorter tab strip; the content area inherits the white card styling
   from .tab-panel__border below. */

.tab-panel--dialog[b-c7qnbqgu34]  .tabs__row {
    height: 40px;
}

.tab-panel--dialog[b-c7qnbqgu34]  .tab {
    height: 41px;
}

/* === Frame & content ===================================================
   The frame paints the light-grey-2 surround above/around the bordered
   white card. The border is the white card itself — its children stack
   vertically (e.g. sub-tabs above a form). */

.tab-panel__frame[b-c7qnbqgu34] {
    flex: 1;
    padding: 0 4px 4px;
    min-height: 0;
    display: flex;
    background: var(--pcs-light-grey-2);
}

/* Page variant runs to the bottom edge: the side gaps between panels stay
   (they match the strip's 4px side padding, keeping the first tab aligned
   with the content), but nothing floats above the browser's bottom edge. */
.tab-panel--page .tab-panel__frame[b-c7qnbqgu34] {
    padding-bottom: 0;
}

/* Flat: the host already owns the ground, so neither the strip nor the frame paints one.
   ::deep reaches the child PcsTabList's chrome, as the compact variant does. */
.tab-panel--flat .tab-panel__frame[b-c7qnbqgu34],
.tab-panel--flat[b-c7qnbqgu34]  .tabs {
    background: none;
}

.tab-panel__border[b-c7qnbqgu34] {
    background: var(--pcs-white);
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    border: 1px solid var(--pcs-border);
}

.tab-panel__content[b-c7qnbqgu34] {
    padding: 15px;
}
/* Compact: side-panel toolboxes shrink the strip to ~70% height. ::deep
   reaches the child PcsTabList's scoped chrome. The tabs themselves must
   shrink with the row — a 57px tab in a 40px row clips its rounded top
   corners and pushes the label off-centre. */
.tab-panel--compact[b-c7qnbqgu34]  .tabs__row {
    height: 40px;
}

.tab-panel--compact[b-c7qnbqgu34]  .tab,
.tab-panel--compact[b-c7qnbqgu34]  .tab--editing {
    height: 40px;
    padding: 0 14px;
}

.tab-panel--compact[b-c7qnbqgu34]  .tabs {
    padding-top: 2px;
    font-size: 0.9em;
}
/* /Shared/Project/Canvas/GridCanvas.razor.rz.scp.css */
.canvas[b-3h0mo1dplx] {
    flex: 1;
    background: var(--pcs-white);
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.canvas__svg[b-3h0mo1dplx] {
    display: block;
    width: 100%;
    height: 100%;
    flex: 1;
    min-height: 0;
}
/* /Shared/Project/Canvas/ProjectCanvas.razor.rz.scp.css */
.room[b-zs3opgugl6] {
    cursor: pointer;
}

/* Placed-item glyph — the draggable icon. touch-action: none stops
   mobile/trackpad pan-zoom from competing with the drag gesture, and
   user-select: none stops a pointerdown on the glyph turning into a
   text-selection sweep across nearby room labels / RDS codes. */
.placed-item[b-zs3opgugl6] {
    cursor: var(--pcs-cursor-grab);
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
}

.placed-item:active[b-zs3opgugl6] {
    cursor: var(--pcs-cursor-grabbing);
}
/* /Shared/Project/Info/InfoFieldEditor.razor.rz.scp.css */
/* Layout only: the control fills whatever width the host gives the field — the
   dense settings row's control column, or a dialog's form stack. */
.info-field[b-qoilvukgd4]  .pcs-input {
    width: 100%;
}
/* /Shared/Project/Panels/LeftNavPanel.razor.rz.scp.css */
/* The fold, the width and the head are PcsCollapsiblePanel's; this is the
   navigation's own ground and spacing. */
.left-nav-panel[b-5rt7bic5jm] {
    flex-shrink: 0;
    display: flex;
    background: var(--pcs-light-grey-3);
    border-right: 1px solid var(--pcs-border);
}

/* Same horizontal inset as the items block below, so top-slot content (the
   New-project button, fixed nav items) starts and ends at the same X as the
   nav items. */
.left-nav-panel__top[b-5rt7bic5jm] {
    padding: 4px 12px 8px;
}

.left-nav-panel__items[b-5rt7bic5jm] {
    padding: 12px;
    overflow: auto;
    flex: 1;
}

.left-nav-panel__footer[b-5rt7bic5jm] {
    padding: 8px 16px;
    border-top: 1px solid var(--pcs-border);
    flex-shrink: 0;
}
/* /Shared/Project/Panels/TabletopPalette.razor.rz.scp.css */
.palette[b-hshoj39rwc] {
    padding: 12px 16px 14px;
    border-bottom: 1px solid var(--pcs-border);
}

.palette__header[b-hshoj39rwc] {
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
    margin-bottom: 10px;
}

.palette__tiles[b-hshoj39rwc] {
    display: flex;
    gap: 8px;
}

/* Tile chrome modelled on ToolButton — 60x60 squares with an icon on
   top and a short label below. cursor: grab + user-select: none keep
   the drag gesture clean. */
.palette-tile[b-hshoj39rwc] {
    width: calc(60px + 2px);
    height: calc(60px + 2px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    background: var(--pcs-light-grey-3);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-sm);
    cursor: var(--pcs-cursor-grab);
    user-select: none;
    transition: background-color var(--pcs-transition);
}

.palette-tile:hover[b-hshoj39rwc] {
    background: var(--pcs-white);
}

.palette-tile:active[b-hshoj39rwc] {
    cursor: var(--pcs-cursor-grabbing);
}

.palette-tile__label[b-hshoj39rwc] {
    font-family: var(--pcs-font-ui);
    font-size: 9px;
    line-height: 1.1;
    color: var(--pcs-mid-grey);
    text-align: center;
    max-width: 56px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Auto-fill button row — each button aligns 1:1 with the tile above it
   so the action's target type is unambiguous from position. */
.palette__autofill[b-hshoj39rwc] {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

[b-hshoj39rwc] .palette-autofill {
    width: 60px;
    height: var(--pcs-control-h-sm);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: var(--pcs-white);
    border: 1px solid var(--pcs-border);
    border-radius: var(--pcs-radius-control);
    font-family: var(--pcs-font-ui);
    font-size: 10px;
    color: var(--pcs-fg-1);
    cursor: pointer;
    padding: 0 4px;
    transition: background-color var(--pcs-transition), color var(--pcs-transition);
}

[b-hshoj39rwc] .palette-autofill:hover:not(:disabled) {
    background: var(--pcs-light-grey-3);
}

[b-hshoj39rwc] .palette-autofill:disabled {
    color: var(--pcs-mid-grey);
    cursor: not-allowed;
    background: transparent;
}

[b-hshoj39rwc] .palette-autofill__icon {
    flex-shrink: 0;
}

[b-hshoj39rwc] .palette-autofill:disabled .palette-autofill__icon {
    opacity: 0.4;
    filter: grayscale(1);
}

/* iOS-style toggle. The native checkbox is visually hidden but stays
   keyboard-focusable; the track + thumb are decorative and driven by
   the input's :checked state. */
[b-hshoj39rwc] .palette__toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    cursor: pointer;
    user-select: none;
}

/* Per-room summary section. One row per room with a name on the left
   and per-type count chips on the right. The selected room gets a
   subtle highlight so it ties visually to the canvas selection. */
.palette__rooms[b-hshoj39rwc] {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--pcs-border);
}

.palette__rooms-header[b-hshoj39rwc] {
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--pcs-mid-grey);
    margin-bottom: 6px;
}

.palette__room-list[b-hshoj39rwc] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.palette__room-row[b-hshoj39rwc] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 4px 6px;
    border-radius: var(--pcs-radius-sm);
    transition: background-color var(--pcs-transition);
}

.palette__room-row.is-selected[b-hshoj39rwc] {
    background: var(--pcs-light-grey-3);
}

.palette__room-name[b-hshoj39rwc] {
    font-family: var(--pcs-font-ui);
    font-size: 12px;
    color: var(--pcs-fg-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
}

.palette__room-row.is-selected .palette__room-name[b-hshoj39rwc] {
    font-weight: 600;
}

.palette__room-counts[b-hshoj39rwc] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.palette__room-count[b-hshoj39rwc] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-family: var(--pcs-font-ui);
    font-size: 11px;
    color: var(--pcs-fg-1);
}

.palette__room-count--empty[b-hshoj39rwc] {
    color: var(--pcs-mid-grey);
}
