html {
    font-size: 15px;
    height: 100%;
}

body {
    background: var(--px-bg);
    color: var(--px-text);
    display: flex;
    flex-direction: column;
    margin: 0;
    min-height: 100vh;
}

.app-header {
    background: var(--px-surface);
    flex-shrink: 0;
    position: sticky;
    top: 0;
    z-index: 1030;
}

.px-admin-access-banner {
    background: var(--px-warning-surface);
    border-bottom: 1px solid var(--px-warning-border);
    color: var(--px-warning-text);
    flex-shrink: 0;
}

.table.px-admin-table > thead > tr > th {
    background-color: var(--px-surface);
    border-bottom: 1px solid var(--px-border-subtle);
    color: var(--px-text-muted);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.px-admin-table thead th a {
    color: inherit;
}

.px-admin-table thead th a:hover {
    color: var(--px-text-secondary);
}

.table-responsive:has(.dropdown-menu.show) {
    overflow: visible;
}

.px-admin-tenant-row--loading {
    color: var(--px-text-muted);
    opacity: 0.55;
    pointer-events: none;
}

.px-admin-tenant-row--loading .px-remote-pending {
    color: var(--px-text-faint);
}

.px-admin-tenant-row--server-inactive {
    color: var(--px-text-muted);
    opacity: 0.7;
}

.px-admin-tenant-row--server-unreachable {
    background: var(--px-warning-surface);
    box-shadow: inset 3px 0 0 var(--px-warning-border-strong);
    color: var(--px-text);
    opacity: 1;
    pointer-events: auto;
}

.px-admin-tenant-row--server-unreachable .px-remote-pending {
    color: var(--px-text-muted);
}

.px-server-unreachable-badge {
    vertical-align: middle;
}

.app-header .navbar {
    box-shadow: var(--px-shadow-header);
    margin-bottom: 0 !important;
}

.app-header .navbar-collapse {
    align-items: center;
}

.app-navbar-brand {
    align-items: center;
    display: inline-flex;
    margin-right: 1rem;
    padding: 0;
}

.navbar-brand-logo {
    display: block;
    height: 2rem;
    width: auto;
}

.app-header .navbar-nav .nav-link {
    border-radius: var(--px-radius-sm);
    color: var(--px-text-secondary);
    padding: 0.5rem 0.75rem;
    transition: background-color .15s ease, color .15s ease;
}

.app-header .navbar-nav .nav-link:hover,
.app-header .navbar-nav .nav-link:focus-visible {
    background: var(--px-surface-muted);
    color: var(--px-text);
}

.app-header .navbar-nav .nav-link.active {
    background: var(--px-accent-subtle);
    color: var(--px-accent-emphasis);
    font-weight: 600;
}

.app-breadcrumb {
    font-size: .875rem;
    margin-bottom: var(--px-space-4);
}

.app-breadcrumb .breadcrumb {
    --bs-breadcrumb-divider: "›";
    margin-bottom: 0;
}

.app-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: var(--px-text-faint);
}

.app-breadcrumb .breadcrumb-item a {
    color: var(--px-text-muted);
    text-decoration: none;
}

.app-breadcrumb .breadcrumb-item a:hover {
    color: var(--px-accent);
}

.app-breadcrumb .breadcrumb-item.active {
    color: var(--px-text-body);
}

@media (max-width: 991.98px) {
    .app-header .navbar-collapse {
        border-top: 1px solid var(--px-border);
        margin-top: 0.5rem;
        padding-top: 0.5rem;
    }

    .app-header .navbar-nav .nav-link {
        padding: 0.45rem 0;
    }
}

.app-content {
    flex: 1 0 auto;
    padding-bottom: 1.5rem;
    width: 100%;
}

.app-content--wide {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 0;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.app-main--wide {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 0;
    padding-top: .75rem;
}

.layout-full-width {
    height: 100%;
    min-height: 100vh;
    overflow: hidden;
}

.layout-full-width .app-footer {
    display: none;
}

.layout-full-width .app-breadcrumb {
    flex-shrink: 0;
    margin-bottom: .35rem;
}

.app-footer {
    background: var(--px-surface);
    border-top: 1px solid var(--px-border);
    color: var(--px-text-muted);
    flex-shrink: 0;
    font-size: .875rem;
    padding: .75rem 0;
}

.page-title {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1.25rem;
}

.page-title-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.sync-task-reorder-toggle {
    align-items: center;
    color: var(--px-text-secondary);
    cursor: pointer;
    display: inline-flex;
    flex-direction: row;
    font-size: .9rem;
    font-weight: 500;
    gap: .65rem;
    margin: 0 0 0 auto;
    min-height: 0;
    padding: 0;
    padding-left: 0;
    user-select: none;
}

.sync-task-reorder-toggle .form-check-input {
    cursor: pointer;
    float: none;
    height: 1.2rem;
    margin: 0;
    width: 2.25rem;
}

.sync-task-reorder-toggle .form-check-label {
    cursor: pointer;
    font-weight: 500;
    margin: 0;
}

.sync-task-tree-toolbar {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    font-size: .875rem;
    font-weight: 400;
    gap: 1.25rem;
    justify-content: flex-start;
    letter-spacing: normal;
    margin-bottom: 0;
    min-width: 0;
    text-transform: none;
}

.sync-task-scheduler-form {
    margin: 0;
}

.sync-task-scheduler-toggle {
    align-items: center;
    display: inline-flex;
    gap: .45rem;
    margin: 0;
    min-height: 0;
    padding-left: 0;
}

.sync-task-scheduler-toggle .form-check-input {
    cursor: pointer;
    float: none;
    height: 1.2rem;
    margin: 0;
    width: 2.25rem;
}

.sync-task-scheduler-toggle .form-check-label {
    font-size: .9rem;
    font-weight: 500;
    margin: 0;
}

.sync-task-tree-panel.is-reorder-enabled {
    box-shadow: var(--px-shadow-inset-accent);
}

h1 {
    font-size: 1.75rem;
    margin: 0;
}

h2 {
    font-size: 1.05rem;
    margin: 0 0 1rem;
}

.panel {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    box-shadow: var(--px-shadow-panel);
    margin-bottom: 1rem;
    padding: 1rem;
}

.narrow {
    max-width: 440px;
}

.auth-shell {
    display: grid;
    gap: var(--px-space-6);
    grid-template-columns: minmax(0, 1fr);
    margin: var(--px-space-8) auto;
    max-width: 440px;
    padding: 0 var(--px-space-4);
    width: 100%;
}

.auth-shell-intro {
    text-align: center;
}

.auth-shell-intro h1 {
    margin-bottom: var(--px-space-2);
}

.auth-shell-intro p {
    margin-bottom: 0;
}

.auth-shell .panel {
    margin-bottom: 0;
    padding: var(--px-space-6);
}

.auth-shell label,
.form-grid label {
    font-weight: 600;
    margin-top: 0;
    margin-bottom: .35rem;
}

.metric-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.metric {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    padding: 1rem;
}

.metric span {
    color: var(--px-text-muted);
    display: block;
    font-size: .86rem;
}

.metric strong {
    display: block;
    font-size: 1.5rem;
    margin-top: .25rem;
}

a.metric-link {
    color: inherit;
    display: block;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

a.metric-link:hover,
a.metric-link:focus-visible {
    background: var(--px-surface-muted);
    border-color: var(--px-accent-border);
    box-shadow: var(--px-shadow-panel);
    color: inherit;
    outline: none;
    text-decoration: none;
    transform: translateY(-1px);
}

a.metric-link strong {
    color: var(--px-text-heading);
}

a.metric-link:hover strong,
a.metric-link:focus-visible strong {
    color: var(--px-accent-emphasis);
}

.content-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr 1fr;
}

.section-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: .5rem;
}

.btn-icon {
    align-items: center;
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    line-height: 1;
    padding: 0;
    width: 2rem;
}

.btn-icon svg {
    display: block;
    height: 1.35rem;
    width: 1.35rem;
}

.ref-list-delete {
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--bs-danger);
}

.ref-list-delete:hover,
.ref-list-delete:focus,
.ref-list-delete:active {
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--bs-danger);
}

#connection-reference-list-modal .modal-body {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ref-list-modal-scroll {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: auto;
    padding-right: 0.625rem;
}

.ref-list-modal-scroll > * {
    flex: 0 0 auto;
}

.ref-list-modal-scroll .table-responsive {
    overflow: visible;
}

.dashboard-task-create.dropdown-toggle::after {
    display: none;
}

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

.connection-form.form-grid {
    gap: 0;
    grid-template-columns: 1fr;
    max-width: none;
}

.connection-editor-page {
    margin: 0 auto;
    max-width: 68.75rem;
}

.connection-editor-page .page-title {
    margin-bottom: 1rem;
}

.connection-editor-shell {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: 17rem minmax(0, 1fr);
}

.connection-editor-sidebar {
    align-self: start;
    background: var(--px-surface-muted);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-md);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    position: sticky;
    top: 1rem;
}

.connection-editor-sidebar-identity {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    text-align: center;
}

.connection-editor-sidebar-logo {
    align-items: center;
    background: var(--px-surface);
    border-radius: var(--px-radius-sm);
    display: inline-flex;
    height: 3rem;
    justify-content: center;
    overflow: hidden;
    width: 3rem;
}

.connection-editor-sidebar-logo .connection-card-logo {
    height: 2.25rem;
    width: 2.25rem;
}

.connection-editor-sidebar-title {
    color: var(--px-text-heading);
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    word-break: break-word;
}

.connection-editor-type-chip {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    color: var(--px-text-secondary);
    font-size: .75rem;
    font-weight: 600;
}

.connection-editor-validation-badge {
    font-size: .7rem;
    line-height: 1.15;
    padding: calc(.15em + 3px) calc(.45em + 3px);
}

.connection-editor-sidebar-fields {
    display: grid;
    gap: .75rem;
}

.connection-editor-sidebar-field label {
    display: block;
    font-weight: 600;
    margin-bottom: .35rem;
}

.connection-editor-sidebar-actions {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-top: auto;
}

.connection-editor-sidebar-actions .btn {
    width: 100%;
}

.connection-editor-main {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.connection-editor-tabs {
    margin-bottom: 0;
}

.connection-field-group {
    margin-bottom: 0;
}

.connection-field-grid {
    display: grid;
    gap: .85rem;
    grid-template-columns: minmax(0, 1fr);
}

.connection-field-row {
    margin-bottom: 0;
    text-align: left;
}

.connection-setting-changed {
    border-left: 3px solid var(--bs-primary);
    padding-left: .75rem;
}

.connection-setting-changed-badge {
    display: inline-block;
    margin-left: .5rem;
    padding: .12rem .45rem;
    border-radius: .25rem;
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .04em;
    line-height: 1.4;
    text-transform: uppercase;
    vertical-align: middle;
    color: #fff;
    background: var(--bs-primary);
}

.connection-field-row > label,
.connection-field-label {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
    font-weight: 600;
    margin-bottom: .35rem;
    text-align: left;
}

.connection-field-label-text {
    display: inline;
}

.connection-field-help-btn {
    align-items: center;
    background: transparent;
    border: 1px solid #c5ccd3;
    border-radius: 50%;
    color: #6b7280;
    cursor: pointer;
    display: inline-flex;
    flex-shrink: 0;
    font-family: inherit;
    font-size: .625rem;
    font-weight: 600;
    height: .95rem;
    justify-content: center;
    line-height: 1;
    margin-left: .2rem;
    padding: 0;
    vertical-align: middle;
    width: .95rem;
}

.connection-field-help-btn:hover,
.connection-field-help-btn:focus,
.connection-field-help-btn[aria-describedby] {
    background: #f8f9fb;
    border-color: #9aa3ad;
    color: #4b5563;
    outline: none;
}

.connection-field-help-popover {
    --bs-popover-max-width: 22rem;
    --bs-popover-border-color: #d7dde5;
    --bs-popover-box-shadow: 0 4px 16px rgba(15, 23, 42, .12);
    z-index: 1200;
}

.connection-field-help-popover .popover-body {
    color: var(--px-text-body, #374151);
    font-size: .8125rem;
    line-height: 1.45;
    padding: .65rem .75rem;
}

.connection-field-help-popover .popover-body a {
    color: var(--px-accent-strong);
}

.connection-field-description {
    margin-top: .35rem;
}

.connection-field-row-toggle .connection-field-description,
.connection-form .field-row-toggle .connection-field-description {
    margin-top: 0;
}

.connection-field-row-toggle .connection-field-label,
.connection-form .field-row-toggle .form-check-label {
    align-items: center;
}

.px-field-required-mark {
    color: var(--bs-danger, #dc3545);
    font-weight: 700;
    margin-left: .15rem;
}

.connection-editor-sidebar-field > label.px-field-label-required,
.connection-field-row > label.px-field-label-required,
.connection-field-row .form-check-label.px-field-label-required {
    display: inline-flex;
    align-items: baseline;
    gap: .1rem;
}

.connection-field-row .form-control,
.connection-field-row .form-select,
.connection-field-row textarea {
    text-align: left;
}

.connection-password-wrap {
    position: relative;
}

.connection-password-wrap .form-control {
    padding-right: 2.5rem;
}

.connection-password-toggle {
    position: absolute;
    top: 50%;
    right: .4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    padding: 0;
    border: 0;
    border-radius: var(--px-radius-sm, .375rem);
    background: transparent;
    color: var(--px-text-muted);
    transform: translateY(-50%);
    cursor: pointer;
}

.connection-password-toggle:hover,
.connection-password-toggle:focus-visible {
    color: var(--px-text);
}

.connection-password-toggle:focus-visible {
    outline: 2px solid var(--px-accent);
    outline-offset: 1px;
}

.connection-password-icon {
    width: 1.1rem;
    height: 1.1rem;
    display: block;
}

.connection-multiselect {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .9rem;
    padding: .4rem .55rem;
    border: 1px solid var(--px-border-subtle, #d9dee4);
    border-radius: .4rem;
    background: var(--px-surface, #fff);
}

.connection-multiselect-option {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    margin: 0;
    font-weight: 500;
    color: var(--px-text);
    cursor: pointer;
}

.connection-multiselect-option .form-check-input {
    margin: 0;
    float: none;
}

.connection-field-row-toggle {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .35rem;
}

.connection-more {
    display: grid;
    gap: .85rem;
}

.connection-more-toggle {
    justify-self: start;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--px-accent);
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
}

.connection-more-toggle:hover,
.connection-more-toggle:focus-visible {
    color: var(--px-accent-strong);
    text-decoration: underline;
}

.connection-more-fields {
    display: grid;
    gap: .85rem;
}

.connection-advanced-toggle {
    margin-top: var(--px-space-4, 1rem);
    padding-top: var(--px-space-3, .75rem);
    border-top: 1px solid var(--px-border-subtle, var(--px-border));
}

.connection-advanced-section {
    margin-top: var(--px-space-3, .75rem);
    display: grid;
    gap: .85rem;
}

.connection-settings-fields-host {
    display: grid;
    gap: .85rem;
}

.connection-field-row-advanced.d-none,
.connection-field-group.d-none {
    display: none !important;
}

.task-mapping-meta-group-row td,
.task-mapping-meta-group-cell {
    background: var(--px-surface-muted);
    color: var(--px-text-secondary);
    font-size: .8125rem;
    font-weight: 600;
    padding: .45rem .75rem;
}

.task-mapping-row-advanced.d-none {
    display: none !important;
}

.precondition-filter-group {
    grid-column: 1 / -1;
    display: grid;
    gap: .75rem 1rem;
    grid-template-columns: 1fr;
    margin: .15rem 0 .5rem;
    padding: .75rem 1rem .95rem;
    background: var(--px-surface-subtle);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-md);
}

.precondition-filter-group-title {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: .7rem;
    margin: 0 0 .1rem;
    padding: 0;
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .1em;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--px-text-secondary);
}

.precondition-filter-group-title::before {
    content: "";
    flex: 0 0 auto;
    width: 3px;
    height: .8em;
    border-radius: 2px;
    background: var(--px-accent);
}

.precondition-filter-group-title::after {
    content: "";
    flex: 1 1 auto;
    min-width: 1.25rem;
    height: 1px;
    background: linear-gradient(to right, var(--px-border), transparent);
}

.precondition-filter-group .full {
    grid-column: 1 / -1;
}

.storage-filter-fields-host.form-grid {
    grid-template-columns: 1fr;
}

.precondition-filter-group .formula-args-formula-row .form-control {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
}

.precondition-advanced-section {
    grid-column: 1 / -1;
}

.precondition-advanced-title {
    letter-spacing: normal;
    text-transform: none;
}

.precondition-advanced-section > .field-group-title {
    margin-top: .85rem;
}

.precondition-advanced-section:not(.is-enabled) > .field-group-title {
    border-bottom: 0;
    margin-bottom: 0;
}

.precondition-advanced-section > .precondition-advanced-toggle {
    grid-column: 1 / -1;
    margin: 0;
    padding: 0;
    border-top: 0;
}

.precondition-advanced-section > .precondition-filter-group,
.precondition-advanced-groups > .precondition-filter-group {
    background: transparent;
    border: 0;
    border-radius: 0;
    margin: 0;
    padding: .35rem 0 0;
}

.precondition-advanced-section.d-none {
    display: none !important;
}

.task-lookup-caches-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    margin-bottom: .5rem;
}

.task-lookup-caches-table th,
.task-lookup-caches-table td {
    white-space: nowrap;
}

.task-lookup-caches-filter-cell {
    max-width: 16rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.connection-agent-intro {
    font-size: .875rem;
    margin-bottom: 1rem;
}

.connection-agent-subtitle {
    font-size: .875rem;
    font-weight: 700;
    margin: 1rem 0 .5rem;
}

.connection-oauth-authorize {
    justify-self: end;
}

@media (max-width: 991px) {
    .connection-editor-shell {
        grid-template-columns: 1fr;
    }

    .connection-editor-sidebar {
        position: static;
    }

    .connection-editor-sidebar-identity {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        text-align: left;
    }

    .connection-editor-sidebar-title {
        flex: 1 1 100%;
    }

    .connection-editor-sidebar-actions {
        flex-direction: row;
        justify-content: flex-end;
    }

    .connection-editor-sidebar-actions .btn {
        width: auto;
    }
}

.field-group {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    box-shadow: var(--px-shadow-card);
    margin-bottom: 1rem;
    overflow: hidden;
    padding: 0 1.25rem 1.1rem;
}

.field-group-title {
    background: var(--px-surface-muted);
    border-bottom: 1px solid var(--px-border-subtle);
    border-left: 3px solid var(--px-accent);
    color: var(--px-text-strong);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .07em;
    margin: 0 -1.25rem .95rem;
    padding: .65rem 1.25rem .65rem calc(1.25rem - 3px);
    text-align: left;
    text-transform: uppercase;
}

#server-info-modal .modal-body {
    max-height: min(24rem, 60vh);
    overflow-y: auto;
}

#server-info-modal .field-group-title {
    margin-left: -1rem;
    margin-right: -1rem;
}

#server-info-modal .field-group-title:first-child {
    margin-top: -1rem;
}

.panel:has(> .field-group-title) {
    padding: 0 1.25rem 1.1rem;
}

.panel > .field-group-title:first-of-type {
    border-top-left-radius: calc(var(--px-radius-md) - 1px);
    border-top-right-radius: calc(var(--px-radius-md) - 1px);
}

.panel > form > .field-group-title {
    margin-bottom: 0;
}

.panel-title-bar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem .75rem;
    justify-content: space-between;
    padding-bottom: .4rem;
    padding-top: .4rem;
}

.panel-title-bar > h2 {
    color: inherit;
    flex: 0 1 auto;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: 1.2;
    margin: 0;
    min-width: 0;
    text-transform: inherit;
}

.panel-title-bar-meta {
    color: var(--px-text-muted);
    font-size: .875rem;
    font-weight: 400;
    letter-spacing: normal;
    margin-left: .75rem;
    text-transform: none;
}

.panel-title-bar-actions {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    font-size: .875rem;
    font-weight: 400;
    gap: .5rem;
    justify-content: flex-end;
    letter-spacing: normal;
    min-width: 0;
    text-transform: none;
}

.panel-title-bar-actions > a {
    font-weight: 600;
}

.panel-title-bar .dropdown-menu {
    font-size: .875rem;
    font-weight: 400;
    letter-spacing: normal;
    text-transform: none;
}

.panel-title-bar-actions .run-details-section-tools {
    flex: 1 1 auto;
    min-width: 0;
}

.delivery-group > .field-group-title {
    margin-bottom: 0;
}

.delivery-settings-title {
    gap: .85rem;
    justify-content: flex-start;
    padding-bottom: .65rem;
    padding-top: .65rem;
}

.delivery-settings-title .task-scheduler-enable .form-check-input {
    height: 1.02rem;
    width: 1.86rem;
}

.delivery-settings-panel:not(.is-enabled) > .delivery-settings-title {
    margin-bottom: 0;
}

.delivery-settings-panel.is-enabled > [data-delivery-body] {
    margin-bottom: .95rem;
}

.delivery-group > .delivery-settings-panel:last-child.is-enabled > [data-delivery-body] {
    margin-bottom: 0;
}

.delivery-group:not(:has(.is-enabled)) {
    padding-bottom: 0;
}

.delivery-group:not(:has(.is-enabled)) > .delivery-settings-panel:last-child > .delivery-settings-title {
    border-bottom: 0;
}

.connection-form .field-row {
    margin-bottom: .85rem;
    text-align: left;
}

.field-row:last-child {
    margin-bottom: 0;
}

.connection-form .field-row > label {
    display: block;
    margin-bottom: .35rem;
    text-align: left;
}

.connection-form .field-row .form-control,
.connection-form .field-row .form-select,
.connection-form .field-row textarea {
    text-align: left;
}

.connection-form .field-row-toggle {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .35rem;
}

.connection-form .toggle-field.form-check {
    margin-bottom: 0;
    min-height: 0;
    padding-left: 0;
}

.connection-form .toggle-field.form-switch {
    padding-left: 0;
}

.agent-token-text {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-all;
    white-space: pre-wrap;
}

.agent-token-hint-wrap,
.agent-token-reveal {
    max-width: 100%;
    overflow: hidden;
}

.agent-token-full {
    padding: .5rem .65rem;
    background: var(--px-surface-overlay);
    border-radius: .25rem;
}

.agent-log-table-wrap {
    max-height: 320px;
    overflow: auto;
}

.agent-log-table td {
    vertical-align: top;
    white-space: pre-wrap;
    word-break: break-word;
}

.agent-log-table td:last-child {
    min-width: 240px;
}

.toggle-field {
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: .65rem;
    justify-content: flex-start;
    min-height: 2rem;
}

.toggle-field .form-check-input {
    cursor: pointer;
    flex-shrink: 0;
    float: none;
    height: 1.15rem;
    margin: 0;
    width: 2.1rem;
}

.toggle-field .form-check-label {
    cursor: pointer;
    font-weight: 600;
    margin: 0;
    user-select: none;
}

.form-grid .full,
.actions {
    grid-column: 1 / -1;
}

.actions {
    display: flex;
    gap: .75rem;
    justify-content: flex-end;
    margin-top: .5rem;
}

.row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    justify-content: flex-end;
}

.icon-action-btn {
    align-items: center;
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    padding: 0;
    width: 2rem;
}

.icon-action-btn svg {
    height: 1rem;
    width: 1rem;
}

.checkline {
    align-items: center;
    display: flex;
    gap: .5rem;
}

.empty {
    color: var(--px-text-muted);
    margin: .5rem 0;
}

.badge.run-succeeded {
    background: var(--px-success-bg);
    color: var(--px-success-text);
}

.badge.run-partiallysucceeded {
    background: var(--px-warning-bg);
    color: var(--px-warning-text);
}

.badge.run-skipped {
    background: var(--px-warning-bg);
    color: var(--px-warning-text);
}

.badge.run-failed {
    background: var(--px-danger-bg);
    color: var(--px-danger-text);
}

.badge.run-running,
.badge.run-queued {
    background: var(--px-accent-soft);
    color: var(--px-accent-strong);
}

.badge.run-cancelled {
    background: var(--px-surface-muted);
    color: var(--px-text-muted);
}

table {
    font-size: .94rem;
}

.entity-browser-toolbar {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    margin-bottom: 0;
}

.entity-browse-route {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.entity-browse-route-connection {
    align-items: center;
    color: inherit;
    display: inline-flex;
    gap: .35rem;
    text-decoration: none;
}

a.entity-browse-route-connection:hover,
a.entity-browse-route-connection:focus-visible {
    color: var(--px-accent);
    text-decoration: underline;
}

.entity-browse-route .connection-card-logo {
    height: 1.125rem;
    width: 1.125rem;
}

.entity-browse-page {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .75rem;
    min-height: 0;
}

.entity-browse-page .page-title {
    align-items: flex-end;
    flex-shrink: 0;
    margin-bottom: 0;
}

.entity-browse-page .page-title h1 {
    font-size: 1.35rem;
    margin-bottom: .15rem;
}

.entity-browse-workspace {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    box-shadow: var(--px-shadow-panel);
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.entity-browse-workspace .entity-browser-toolbar-wrap {
    background: var(--px-surface-muted);
    border-bottom: 1px solid var(--px-border-subtle);
    flex-shrink: 0;
    margin-bottom: 0;
    padding: .75rem 1rem;
}

.entity-browse-workspace .px-list-state,
.entity-browse-workspace > .alert {
    flex-shrink: 0;
    margin: .75rem 1rem 0;
}

.entity-browse-workspace .px-list-state--empty,
.entity-browse-workspace .px-list-state--loading {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .75rem;
    justify-content: center;
    margin: 0;
    padding: 2rem 1rem;
}

.entity-browse-workspace .px-list-state--loading .sync-task-progress {
    max-width: 22rem;
}

.entity-browse-workspace .entity-browser-results {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    margin: 0;
    min-height: 0;
    padding: .75rem 1rem 1rem;
}

.entity-browse-workspace .entity-browser-list-meta {
    flex-shrink: 0;
}

.entity-browse-workspace .entity-browse-list-panel {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.entity-browse-workspace .entity-browse-list-header {
    background: var(--px-surface);
    position: sticky;
    top: 0;
    z-index: 2;
}

.entity-browser-toolbar-wrap {
    margin-bottom: 1rem;
    overflow: visible;
    position: relative;
}

.entity-browser--locked .entity-browser-toolbar,
.entity-browser--locked .entity-browser-results,
.entity-browser--locked .entity-browser-empty,
.entity-browser--locked .px-list-state--empty,
.entity-browser--locked > .alert[data-px-list-error] {
    opacity: .68;
    pointer-events: none;
}

.entity-browser-empty,
.px-list-state--empty {
    padding: 1rem 0;
}

.px-list-state--loading {
    align-items: center;
    color: var(--px-text-muted);
    display: flex;
    gap: var(--px-space-2);
    padding: 1rem 0;
}

.px-list-content--refreshing {
    opacity: .72;
    pointer-events: none;
    transition: opacity .15s ease;
}

@media (prefers-reduced-motion: reduce) {
    .px-list-content--refreshing {
        transition: none;
    }
}

.px-list-state--error {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--px-space-2);
}

.px-toast-stack {
    display: flex;
    flex-direction: column;
    gap: var(--px-space-2);
    max-width: min(28rem, calc(100vw - 2rem));
    pointer-events: none;
    position: fixed;
    right: 1rem;
    top: calc(var(--app-header-height) + .75rem);
    z-index: 1080;
}

.px-toast {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-left-width: 3px;
    border-radius: var(--px-radius-md);
    box-shadow: var(--px-shadow-panel);
    display: grid;
    gap: .55rem .75rem;
    grid-template-areas:
        "body close"
        "action action";
    grid-template-columns: 1fr auto;
    min-width: min(22rem, calc(100vw - 2rem));
    opacity: 0;
    padding: .85rem 1rem;
    pointer-events: auto;
    transform: translateY(-.35rem);
    transition: opacity .18s ease, transform .18s ease;
}

.px-toast:not(:has([data-px-toast-action]:not(.d-none))) {
    grid-template-areas: "body close";
}

.px-toast--visible {
    opacity: 1;
    transform: translateY(0);
}

.px-toast--dismissing {
    opacity: 0;
    transform: translateY(-.35rem);
}

.px-toast-body {
    color: var(--px-text-body);
    display: flex;
    align-items: flex-start;
    font-size: .9rem;
    gap: var(--px-space-2);
    grid-area: body;
    line-height: 1.45;
    min-width: 0;
    padding-right: .25rem;
}

.px-toast-action {
    align-items: center;
    border-top: 1px solid var(--px-border-muted);
    display: flex;
    flex-wrap: wrap;
    gap: .65rem 1rem;
    grid-area: action;
    justify-content: flex-start;
    padding-top: .55rem;
}

.px-toast-action-link {
    color: var(--px-accent);
    font-size: .85rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.px-toast-action-link:hover {
    color: var(--px-accent-strong);
    text-decoration: underline;
}

.px-toast-close {
    align-self: start;
    flex-shrink: 0;
    grid-area: close;
    margin: .1rem 0 0;
    opacity: .55;
}

.px-toast-close:hover {
    opacity: .85;
}

.px-toast--success {
    border-color: var(--px-border);
    border-left-color: var(--px-success-text);
}

.px-toast--warning {
    border-color: var(--px-border);
    border-left-color: var(--px-warning-border-strong);
}

.px-toast--danger {
    border-color: var(--px-border);
    border-left-color: var(--px-danger-text-strong);
}

.px-toast--info {
    border-color: var(--px-border);
    border-left-color: var(--px-accent-border);
}

.px-toast--loading {
    border-color: var(--px-border);
    border-left-color: var(--px-border-muted);
}

@media (prefers-reduced-motion: reduce) {
    .px-toast,
    .px-toast--visible,
    .px-toast--dismissing {
        transition: none;
        transform: none;
    }
}

@media (max-width: 575.98px) {
    .px-toast-stack {
        left: 1rem;
        max-width: none;
        right: 1rem;
    }

    .px-toast {
        min-width: 0;
    }
}

.entity-browser-toolbar-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1rem;
}

.entity-browser-toolbar-row-primary {
    justify-content: space-between;
}

.entity-browser-toolbar-row-secondary {
    align-items: center;
    gap: .75rem;
}

.entity-browser-toolbar-tools {
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: .5rem;
    min-width: 0;
}

.entity-browser-toolbar-group.entity-browser-toolbar-tools {
    flex-direction: row;
    min-width: 0;
}

.entity-browser-toolbar-group {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    min-width: 10rem;
}

.entity-browser-toolbar-group-inline {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    min-width: 0;
}

.entity-browser-toolbar-group-actions {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .5rem;
    margin-left: auto;
    min-width: 0;
}

.entity-browser-toolbar-group .form-control {
    min-width: 12rem;
}

.entity-browser-toolbar-search {
    flex: 1 1 14rem;
    max-width: none;
    min-width: 12rem;
}

.entity-browser-toolbar-actions {
    align-items: end;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .75rem;
    margin-left: auto;
}

.entity-browser-counter {
    font-size: .9rem;
    margin-left: auto;
    white-space: nowrap;
}

.entity-table-select {
    width: 2.5rem;
}

.entity-table th.sortable {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.entity-table th.sortable::after {
    color: var(--px-text-faint);
    content: " ↕";
    font-size: .75rem;
}

.entity-table th.sortable .btn-link {
    color: inherit;
    font-weight: inherit;
    text-decoration: none;
}

.entity-table th.sortable.sort-asc::after {
    color: var(--px-accent);
    content: " ↑";
}

.entity-table th.sortable.sort-desc::after {
    color: var(--px-accent);
    content: " ↓";
}

.entity-row-selected {
    background: var(--px-accent-subtle);
}

.entity-browser-results {
    margin-top: .25rem;
}

.entity-browser-list-meta {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: .65rem;
    min-height: 2rem;
}

.entity-browser-selection-meta {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    min-width: 0;
}

.entity-browser-list-meta .entity-browser-counter {
    margin-left: 0;
}

.entity-browser-list-meta .entity-pager-toolbar {
    margin-bottom: 0;
}

.entity-browser-pager-cluster {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: .65rem;
}

.entity-browse-pager-loading {
    align-items: center;
    color: var(--px-text-muted);
    display: inline-flex;
    font-size: .8rem;
    gap: .35rem;
    white-space: nowrap;
}

.entity-pager-toolbar {
    display: flex;
    flex-shrink: 0;
    justify-content: flex-end;
    overflow: visible;
    position: relative;
    z-index: 20;
}

.entity-pager-bar {
    align-items: stretch;
    background: var(--px-surface);
    border: 1px solid var(--px-border-muted);
    border-radius: .5rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    display: inline-flex;
    gap: 1px;
    overflow: visible;
    padding: 1px;
    position: relative;
}

.entity-pager-btn,
.entity-pager-indicator {
    align-items: center;
    background: var(--px-surface);
    border: 0;
    border-radius: .35rem;
    color: var(--px-accent);
    cursor: pointer;
    display: inline-flex;
    font-size: .8125rem;
    font-weight: 500;
    height: 2rem;
    justify-content: center;
    line-height: 1;
    min-height: 2rem;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
    user-select: none;
}

.entity-pager-btn {
    flex-shrink: 0;
    padding: 0;
    width: 2rem;
}

.entity-pager-btn svg {
    display: block;
    height: .9rem;
    width: .9rem;
}

.entity-pager-btn:hover:not(:disabled),
.entity-pager-indicator:hover {
    background: var(--px-surface-muted);
    color: var(--px-accent-strong);
}

.entity-pager-btn:disabled {
    background: var(--px-surface);
    color: var(--px-text-disabled);
    cursor: not-allowed;
}

.entity-pager-btn:focus-visible,
.entity-pager-indicator:focus-visible,
.entity-pager-menu-item:focus-visible {
    box-shadow: inset 0 0 0 2px rgba(37, 99, 235, .35);
    outline: none;
}

.entity-pager-center {
    position: relative;
}

.entity-pager-indicator {
    color: var(--px-text-secondary);
    font-variant-numeric: tabular-nums;
    min-width: 7rem;
    padding: 0 .9rem;
    white-space: nowrap;
}

.entity-pager-indicator.is-open {
    background: var(--px-accent-subtle);
    box-shadow: inset 0 0 0 1px var(--px-accent);
    color: var(--px-accent-emphasis);
}

.entity-pager-menu {
    background: var(--px-surface);
    border: 1px solid var(--px-border-muted);
    border-radius: .5rem;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .1);
    display: none;
    flex-direction: column;
    min-width: 10rem;
    overflow: hidden;
    padding: .25rem;
    position: absolute;
    right: 0;
    top: calc(100% + .4rem);
    z-index: 30;
}

.entity-pager-menu.is-open {
    display: flex;
}

.entity-pager-menu-item {
    background: transparent;
    border: 0;
    border-radius: .35rem;
    color: var(--px-text-body);
    cursor: pointer;
    font-size: .8125rem;
    padding: .5rem .75rem;
    text-align: left;
    transition: background .12s ease, color .12s ease;
}

.entity-pager-menu-item:hover {
    background: var(--px-surface-muted);
    color: var(--px-text-heading);
}

.entity-pager-menu-item.is-selected {
    background: var(--px-accent-subtle);
    color: var(--px-accent);
    font-weight: 600;
}

.entity-table-frame {
    border: 1px solid var(--px-border);
    border-radius: .5rem;
    overflow: hidden;
}

.entity-table-frame .entity-table thead th {
    background: var(--px-surface-subtle);
    border-bottom-width: 1px;
}

.entity-table tbody tr {
    cursor: pointer;
}

.entity-table tbody tr.entity-row-active {
    background: var(--px-accent-subtle);
}

.entity-detail-offcanvas {
    --entity-detail-width: 420px;
    --bs-offcanvas-width: var(--entity-detail-width);
    max-width: 100vw;
    z-index: 1045;
}

.entity-detail-offcanvas .entity-detail-offcanvas-header {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.entity-detail-header-main {
    flex: 1 1 auto;
    min-width: 0;
}

.entity-detail-header-meta {
    align-items: center;
    display: flex;
    gap: .5rem;
    margin-top: .25rem;
}

.entity-detail-offcanvas-header > .btn-close {
    flex-shrink: 0;
    margin-left: auto;
}

.entity-detail-refresh-btn.is-busy svg {
    animation: entity-detail-refresh-spin .8s linear infinite;
}

@keyframes entity-detail-refresh-spin {
    to {
        transform: rotate(360deg);
    }
}

.entity-detail-offcanvas.is-resizing {
    transition: none;
    user-select: none;
}

.entity-detail-resize-handle {
    bottom: 0;
    cursor: col-resize;
    left: 0;
    position: absolute;
    top: 0;
    width: 8px;
    z-index: 2;
}

.entity-detail-resize-handle:hover,
.entity-detail-offcanvas.is-resizing .entity-detail-resize-handle {
    background: rgba(37, 99, 235, .12);
}

body.entity-detail-resizing {
    cursor: col-resize;
    user-select: none;
}

.entity-detail-loading {
    align-items: center;
    color: var(--px-text-muted);
    display: flex;
    gap: .5rem;
    padding: .5rem 0;
}

.entity-detail-summary {
    display: grid;
    gap: .35rem .75rem;
    grid-template-columns: auto 1fr;
    margin: 0;
}

.entity-detail-summary dt {
    color: var(--px-text-muted);
    font-size: .8125rem;
    font-weight: 500;
    margin: 0;
}

.entity-detail-summary dd {
    font-size: .875rem;
    margin: 0;
}

.entity-detail-offcanvas .offcanvas-body {
    overflow-y: auto;
}

.entity-detail-content {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.entity-detail-fields-shell {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    min-height: 0;
}

.entity-detail-content.formula-fields-panel.is-property-viewer {
    flex: none;
    height: auto;
    max-height: none;
    max-width: none;
    min-width: 0;
    min-height: 0;
    overflow: visible;
    border-left: 0;
    padding: 0;
    background: transparent;
    gap: 0;
}

.entity-detail-content.formula-fields-panel.is-property-viewer .formula-property-grid,
.entity-detail-content.formula-fields-panel.is-property-viewer .formula-property-rows {
    flex: none;
    height: auto;
    max-height: none;
    min-height: auto;
    overflow: visible;
}

.entity-detail-fields-toolbar {
    background: var(--px-surface);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .5rem .65rem;
    position: sticky;
    top: 0;
    z-index: 1;
}

.entity-detail-fields-toolbar-options {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1rem;
}

.entity-detail-fields-check {
    font-size: .8125rem;
}

.entity-detail-field-label-wrap {
    align-items: flex-start;
    display: flex;
    gap: .25rem;
    min-width: 0;
}

.entity-detail-field-label-wrap > span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.entity-detail-field-label-wrap .connection-field-help-btn {
    flex-shrink: 0;
    margin-left: .05rem;
}

.entity-detail-table tbody tr[data-detail-field-row][hidden],
.entity-detail-section[hidden],
.entity-detail-group[hidden],
.entity-detail-list-item[hidden],
details.entity-detail-section-collapsible[hidden] {
    display: none !important;
}

.entity-detail-section-title {
    color: var(--px-text-body);
    font-size: .8125rem;
    font-weight: 600;
    margin-bottom: .35rem;
}

.entity-detail-group,
.entity-detail-section-collapsible,
.entity-detail-list-item {
    border: 1px solid var(--px-border-subtle);
    border-radius: .5rem;
    margin: 0;
    padding: 0;
}

.entity-detail-group > summary,
.entity-detail-section-collapsible > summary,
.entity-detail-list-item > summary {
    color: var(--px-text-secondary);
    cursor: pointer;
    font-size: .8125rem;
    font-weight: 600;
    list-style: none;
    padding: .55rem .75rem;
    user-select: none;
}

.entity-detail-group > summary::-webkit-details-marker,
.entity-detail-section-collapsible > summary::-webkit-details-marker,
.entity-detail-list-item > summary::-webkit-details-marker {
    display: none;
}

.entity-detail-group > summary::before,
.entity-detail-section-collapsible > summary::before,
.entity-detail-list-item > summary::before {
    color: var(--px-text-muted);
    content: "▸";
    display: inline-block;
    margin-right: .4rem;
    transition: transform .15s ease;
    width: .75rem;
}

.entity-detail-group[open] > summary::before,
.entity-detail-section-collapsible[open] > summary::before,
.entity-detail-list-item[open] > summary::before {
    transform: rotate(90deg);
}

.entity-detail-group-body,
.entity-detail-section-collapsible-body,
.entity-detail-list-item-body {
    border-top: 1px solid var(--px-border-faint);
    display: flex;
    flex-direction: column;
    gap: .65rem;
    padding: .65rem .75rem .75rem;
}

.entity-detail-content > details.entity-detail-section-collapsible {
    border-color: var(--px-accent-border);
    box-shadow: var(--px-shadow-card);
    overflow: hidden;
}

.entity-detail-content > details.entity-detail-section-collapsible > summary {
    background: linear-gradient(90deg, var(--px-accent-subtle) 0%, var(--px-surface-muted) 72%);
    border-bottom: 1px solid transparent;
    border-left: 3px solid var(--px-accent);
    color: var(--px-accent-emphasis);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .05em;
    padding: .6rem .75rem .6rem calc(.75rem - 3px);
    text-transform: uppercase;
}

.entity-detail-content > details.entity-detail-section-collapsible[open] > summary {
    border-bottom-color: var(--px-accent-border);
}

.entity-detail-content > details.entity-detail-section-collapsible > summary::before {
    color: var(--px-accent);
}

.entity-detail-content > details.entity-detail-section-collapsible .entity-detail-section-collapsible-body {
    background: var(--px-surface);
    gap: 0;
    padding: 0;
}

.entity-detail-content > details.entity-detail-section-collapsible .entity-detail-table tbody tr:last-child td {
    border-bottom: none;
}

.entity-detail-content > details.entity-detail-group > summary {
    background: var(--px-surface-muted);
    border-left: 3px solid var(--px-border);
    color: var(--px-text-secondary);
    font-size: .75rem;
    letter-spacing: .04em;
    padding-left: calc(.75rem - 3px);
    text-transform: uppercase;
}

.entity-detail-content > details.entity-detail-group .entity-detail-group-body {
    background: var(--px-surface-alt);
}

.entity-detail-list {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.entity-detail-list-item {
    background: var(--px-surface-alt);
}

.entity-detail-list-item-leaf > summary {
    cursor: default;
}

.entity-detail-list-item-leaf > summary::before {
    visibility: hidden;
}

.entity-detail-table {
    font-size: .8125rem;
}

.entity-detail-table thead th {
    background: var(--px-surface-subtle);
    color: var(--px-text-muted);
    font-weight: 600;
    white-space: nowrap;
}

.entity-detail-table td,
.entity-detail-table th {
    vertical-align: top;
}

.entity-detail-table tbody td:first-child {
    color: var(--px-text-muted);
    font-weight: 500;
    white-space: nowrap;
    width: 38%;
}

.entity-detail-table tbody td:last-child {
    word-break: break-word;
}

.entity-detail-table:not(:has(thead)) tbody td:first-child {
    width: 38%;
}

.entity-detail-value-wrap {
    align-items: flex-start;
    display: flex;
    gap: .35rem;
    min-width: 0;
}

.entity-detail-copy-btn {
    align-items: center;
    color: var(--px-text-muted);
    display: inline-flex;
    flex: 0 0 auto;
    height: 1.35rem;
    justify-content: center;
    line-height: 1;
    margin: .05rem 0 0;
    opacity: .55;
    padding: 0;
    text-decoration: none;
    width: 1.35rem;
}

.entity-detail-copy-btn:hover,
.entity-detail-copy-btn:focus-visible {
    color: var(--px-accent);
    opacity: 1;
}

.entity-detail-copy-btn:hover + .entity-detail-value,
.entity-detail-copy-btn:focus-visible + .entity-detail-value {
    background: color-mix(in srgb, var(--px-accent) 14%, transparent);
    border-radius: .3rem;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--px-accent) 14%, transparent);
    color: var(--px-text);
}

.entity-detail-copy-btn.is-copied {
    color: var(--px-success-text, #198754);
    opacity: 1;
}

.entity-detail-copy-btn svg {
    display: block;
    height: .95rem;
    width: .95rem;
}

.entity-detail-value {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.task-mapping-tab {
    display: grid;
    gap: 1rem;
}

.task-mapping-groups {
    display: grid;
    gap: 1rem;
}

.task-mapping-field-group {
    --task-mapping-check-col-width: 4.75rem;
    --task-mapping-edge-padding: 1.25rem;
    --task-mapping-notes-col-width: 20%;
    margin-bottom: 0;
    overflow: hidden;
    padding-bottom: 0;
}

.task-mapping-field-group .task-mapping-group-colhead-panel,
.task-mapping-field-group .task-mapping-table-scroll {
    margin: 0 calc(-1 * var(--task-mapping-edge-padding));
}

.task-mapping-group-headbar {
    align-items: center;
    background: var(--px-surface-muted);
    border-bottom: 1px solid var(--px-border-subtle);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.task-mapping-field-group .field-group-toggle {
    padding: .65rem 0 .65rem var(--task-mapping-edge-padding);
}

.task-mapping-group-actions {
    display: flex;
    flex-shrink: 0;
    gap: 0.5rem;
    padding-right: var(--task-mapping-edge-padding);
}

.task-mapping-col-head-wrap {
    background: var(--px-surface-subtle);
    border-bottom: 1px solid var(--px-border-subtle);
    overflow: hidden;
}

.task-mapping-col-head {
    display: grid;
    font-size: 0.875rem;
    font-weight: 600;
    grid-template-columns:
        var(--task-mapping-check-col-width)
        var(--task-mapping-check-col-width)
        minmax(0, 1fr)
        var(--task-mapping-notes-col-width)
        minmax(0, 1fr);
    min-width: 48rem;
    width: 100%;
}

.task-mapping-col-head > div {
    overflow: hidden;
    padding: 0.55rem 0.5rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.task-mapping-col-head > .task-mapping-map-col,
.task-mapping-col-head > .task-mapping-update-col {
    text-align: center;
}

.task-mapping-col-head > div:first-child {
    padding-left: calc(var(--task-mapping-edge-padding) + 0.5rem);
}

.task-mapping-col-head > div:last-child {
    padding-right: var(--task-mapping-edge-padding);
}

.task-mapping-table-scroll {
    overflow-x: auto;
}

.task-mapping-field-group .task-mapping-table {
    margin-bottom: 0;
    min-width: 48rem;
    table-layout: fixed;
    width: 100%;
    --bs-table-bg: transparent;
    --bs-table-color: var(--px-text);
    --bs-table-border-color: var(--px-border-subtle);
    --bs-table-striped-bg: transparent;
    --bs-table-hover-bg: var(--px-surface-muted);
    --bs-table-hover-color: var(--px-text);
    background: transparent;
    color: var(--px-text);
}

.task-mapping-field-group .task-mapping-table > :not(caption) > * > * {
    background-color: transparent;
    border-bottom-color: var(--px-border-subtle);
    box-shadow: none;
    color: inherit;
}

.task-mapping-field-group .task-mapping-table tbody tr:hover > * {
    background-color: var(--px-surface-muted);
}

.task-mapping-field-group .task-mapping-table tbody td:first-child {
    padding-left: calc(var(--task-mapping-edge-padding) + 0.5rem);
}

.task-mapping-field-group .task-mapping-table tbody td:last-child {
    padding-right: var(--task-mapping-edge-padding);
}

.task-mapping-field-group .task-mapping-table col.task-mapping-map-col,
.task-mapping-field-group .task-mapping-table col.task-mapping-update-col {
    width: var(--task-mapping-check-col-width);
}

.task-mapping-field-group .task-mapping-table col.task-mapping-target-col,
.task-mapping-field-group .task-mapping-table col.task-mapping-formula-col {
    width: auto;
}

.task-mapping-field-group .task-mapping-table col.task-mapping-notes-col {
    width: var(--task-mapping-notes-col-width);
}

.task-mapping-map-col,
.task-mapping-update-col,
.task-mapping-map-cell,
.task-mapping-update-cell {
    box-sizing: border-box;
    max-width: var(--task-mapping-check-col-width);
    min-width: var(--task-mapping-check-col-width);
    text-align: center;
    vertical-align: middle;
    width: var(--task-mapping-check-col-width);
}

.task-mapping-target-col,
.task-mapping-target-cell {
    min-width: 0;
    overflow: hidden;
    width: auto;
}

.task-mapping-group-row td {
    background: var(--px-surface-subtle);
    border-top: 1px solid var(--px-border-subtle);
    padding: 0.45rem 0.75rem;
}

.task-mapping-table th.task-mapping-notes-col {
    min-width: 0;
}

.task-mapping-notes-cell {
    min-width: 0;
    vertical-align: middle;
}

.task-mapping-notes {
    font-size: 0.8rem;
    line-height: 1.35;
    color: var(--bs-secondary-color, var(--px-text-muted));
    white-space: normal;
}

.task-mapping-table th.task-mapping-formula-col,
.task-mapping-formula-cell {
    min-width: 0;
}

.task-mapping-row-inactive .task-mapping-target-name {
    color: var(--bs-secondary-color, var(--px-text-muted));
}

.task-mapping-row-inactive .task-mapping-formula-preview {
    color: var(--bs-secondary-color, var(--px-text-muted));
}

.task-mapping-formula-preview {
    flex: 1;
    min-width: 0;
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.85rem;
    word-break: break-all;
}

.task-mapping-formula-preview--editable {
    cursor: pointer;
}

.task-mapping-target-name-wrap {
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    gap: .1rem;
}

.task-mapping-target-name-wrap .connection-field-help-btn {
    flex-shrink: 0;
    margin-left: .05rem;
}

.task-mapping-formula-controls {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
}

.task-mapping-inline-preview {
    font-size: 0.78rem;
    line-height: 1.2;
    margin-top: 3px;
    color: #6c757d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 280px;
}

.formula-edit-btn {
    flex-shrink: 0;
}

.sync-task-form {
    overflow-anchor: none;
}

.sync-task-form-chrome-sentinel {
    height: 1px;
    margin-bottom: -1px;
    pointer-events: none;
    visibility: hidden;
}

.sync-task-form-chrome {
    background: var(--px-surface);
    border-bottom: 1px solid var(--px-border);
    box-shadow: 0 10px 18px -16px rgba(15, 23, 42, .35);
    margin: 0 -1rem 0;
    overflow-anchor: none;
    padding: 0 1rem 0;
    position: sticky;
    top: var(--app-header-height);
    z-index: 1020;
}

.sync-task-form-header,
.sync-task-form-name-row,
.sync-task-form-active-field {
    transition: margin-bottom .2s ease, padding-bottom .2s ease;
}

.sync-task-form-chrome.is-stuck .sync-task-form-header {
    padding-bottom: 0.35rem;
}

.sync-task-form-chrome.is-stuck .sync-task-form-name-row {
    align-items: center;
    margin-bottom: 0.35rem;
}

.sync-task-form-chrome.is-stuck .sync-task-form-active-field {
    padding-bottom: 0;
}

.sync-task-form-header {
    margin-bottom: 0;
    padding-bottom: 0.75rem;
}

.sync-task-form-name-row {
    align-items: end;
    display: flex;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.sync-task-form-name-field {
    flex: 1;
    min-width: 0;
}

.sync-task-form-active-field {
    flex-shrink: 0;
    padding-bottom: 0.35rem;
}

.sync-task-form-toolbar-actions {
    display: flex;
    flex-shrink: 0;
    gap: 0.5rem;
}

.sync-task-form-save-group .dropdown-toggle-split {
    padding-left: .45rem;
    padding-right: .45rem;
}

.sync-task-form-route-fields {
    margin-top: 0;
}

.sync-task-template-picker {
    display: grid;
    gap: var(--px-space-3);
    grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
}

.sync-task-template-tile {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    display: flex;
    flex-direction: column;
    gap: var(--px-space-2);
    margin: 0;
    padding: var(--px-space-3);
}

.webhook-setup-tile {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    padding: var(--px-space-3);
}

.webhook-setup-tile p {
    margin: 0 0 .5rem;
}

.webhook-setup-tile p:last-child {
    margin-bottom: 0;
}

.webhook-url-tile {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    display: flex;
    flex-direction: column;
    gap: .35rem;
    padding: var(--px-space-3);
}

.webhook-url-tile-label {
    color: var(--px-text-muted);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.webhook-url-tile-row {
    align-items: center;
    display: flex;
    gap: var(--px-space-2);
    min-width: 0;
}

.webhook-url-tile-value {
    flex: 1 1 auto;
    min-width: 0;
}

.webhook-entity-group + .webhook-entity-group {
    margin-top: 1rem;
}

.webhook-registration-table {
    table-layout: fixed;
    width: 100%;
}

.webhook-registration-table col.webhook-col-event {
    width: 7rem;
}

.webhook-registration-table col.webhook-col-active {
    width: 5.5rem;
}

.webhook-registration-table col.webhook-col-created {
    width: 7rem;
}

.webhook-registration-table col.webhook-col-task {
    width: 9rem;
}

.webhook-registration-table col.webhook-col-delete {
    width: 2.25rem;
}

.webhook-registration-table th:nth-child(3),
.webhook-registration-table td:nth-child(3),
.webhook-registration-delete-cell {
    text-align: center;
}

.webhook-registration-table th,
.webhook-registration-table td {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.webhook-entity-callback {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.webhook-registration-delete {
    color: var(--px-text-strong);
}

.webhook-registration-table tr.webhook-registration-inactive > td,
.webhook-registration-table tr.webhook-registration-inactive > td a,
.webhook-registration-table tr.webhook-registration-inactive .entity-browse-datetime,
.webhook-registration-table tr.webhook-registration-inactive .entity-browse-datetime-date,
.webhook-registration-table tr.webhook-registration-inactive .entity-browse-datetime-time,
.webhook-registration-table tr.webhook-registration-inactive .webhook-registration-delete {
    color: var(--px-text-muted);
}

.sync-task-template-route {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--px-space-2);
}

.sync-task-template-route-name {
    font-weight: 600;
}

.sync-task-template-arrow {
    color: var(--px-text-muted);
}

.sync-task-form-field {
    min-width: 0;
}

.connection-select {
    position: relative;
}

.connection-select-native {
    border: 0;
    height: 0;
    margin: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0;
    pointer-events: none;
    position: absolute;
    width: 0;
}

.connection-select-trigger {
    align-items: center;
    display: flex;
    gap: 0.55rem;
    justify-content: flex-start;
    text-align: left;
    width: 100%;
}

.connection-select-trigger:disabled {
    background-color: var(--bs-secondary-bg);
    cursor: not-allowed;
    opacity: 1;
}

.connection-select-logo {
    display: block;
    flex-shrink: 0;
    height: 1.25rem;
    object-fit: contain;
    width: 1.25rem;
}

.connection-select-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.connection-select-placeholder {
    color: var(--px-text-muted);
}

.connection-select-menu {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .12);
    left: 0;
    margin-top: 0.25rem;
    max-height: 16rem;
    overflow: auto;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 30;
}

.connection-select-option {
    align-items: center;
    background: transparent;
    border: 0;
    display: flex;
    gap: 0.55rem;
    padding: 0.55rem 0.75rem;
    text-align: left;
    width: 100%;
}

.connection-select-option:hover,
.connection-select-option.is-selected {
    background: var(--px-accent-subtle);
}

.sync-task-form-label {
    display: block;
    margin-bottom: 0.35rem;
    max-height: 2.5rem;
    overflow: hidden;
    transition: max-height .2s ease, margin-bottom .2s ease, opacity .2s ease;
}

.sync-task-form-chrome.is-measuring,
.sync-task-form-chrome.is-measuring .sync-task-form-header,
.sync-task-form-chrome.is-measuring .sync-task-form-name-row,
.sync-task-form-chrome.is-measuring .sync-task-form-active-field,
.sync-task-form-chrome.is-measuring .sync-task-form-label {
    transition: none;
}

.sync-task-form-chrome.is-stuck .sync-task-form-label {
    margin-bottom: 0;
    max-height: 0;
    opacity: 0;
}

.sync-task-form-check-text {
    vertical-align: middle;
    white-space: nowrap;
}

.sync-task-editor-page .page-title {
    margin-bottom: 1rem;
}

.sync-task-form-tabs {
    background: var(--px-surface);
    margin-bottom: 0;
    margin-top: 0;
}

.sync-task-form-tab-content {
    padding-top: 1rem;
}

.sync-task-form-tab-content .field-group {
    overflow: hidden;
}

.sync-task-form-tab-content .field-group.is-collapsible {
    padding: 0;
}

.connection-form .field-group.is-collapsible {
    padding: 0;
}

.connection-form .field-group.is-collapsible .field-group-body {
    padding-top: 1rem;
}

.field-group-headbar {
    align-items: center;
    background: var(--px-surface-muted);
    border-bottom: 1px solid var(--px-border-subtle);
    border-left: 3px solid var(--px-accent);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.field-group-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--px-text-strong);
    display: inline-flex;
    flex: 1 1 auto;
    font-size: .8125rem;
    font-weight: 700;
    gap: 0.35rem;
    letter-spacing: .07em;
    margin: 0;
    min-width: 0;
    padding: .65rem 1.25rem;
    text-align: left;
    text-transform: uppercase;
}

.field-group-toggle:hover {
    color: var(--px-accent);
}

.field-group-toggle .field-group-title {
    background: transparent;
    border: 0;
    flex: 1 1 auto;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    margin: 0;
    min-width: 0;
    padding: 0;
    position: static;
    text-transform: inherit;
}

.field-group-chevron,
.task-mapping-storage-group-chevron {
    color: var(--px-text-muted);
    display: inline-block;
    font-size: 0.72rem;
    transform: rotate(0deg);
    transition: transform 0.28s ease;
}

.task-mapping-storage-group-chevron {
    flex-shrink: 0;
    font-size: 1.25rem;
    line-height: 1;
    width: 1.25rem;
    text-align: center;
}

.field-group-chevron::before,
.task-mapping-storage-group-chevron::before {
    content: "▸";
}

.field-group-toggle.is-expanded .field-group-chevron,
.task-mapping-groupbox-toggle.is-expanded .task-mapping-storage-group-chevron,
.task-mapping-storage-group-toggle.is-expanded .task-mapping-storage-group-chevron {
    transform: rotate(90deg);
}

.field-group-collapsible-content {
    display: grid;
    grid-template-rows: 1fr;
    opacity: 1;
    overflow: hidden;
    transition: grid-template-rows 0.28s ease, opacity 0.28s ease, visibility 0.28s ease;
    visibility: visible;
}

.field-group-collapsible-content > .field-group-collapsible-content-inner,
.field-group-collapsible-content > .field-group-body {
    min-height: 0;
    overflow: hidden;
}

.field-group.is-collapsed .field-group-collapsible-content,
.task-mapping-field-group.is-collapsed .field-group-collapsible-content {
    grid-template-rows: 0fr;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
}

.field-group.is-collapsed .field-group-headbar > :not(.field-group-toggle):not(.connection-settings-override):not(.connection-settings-group-title),
.task-mapping-field-group.is-collapsed .field-group-headbar > :not(.field-group-toggle) {
    display: none;
}

.field-group-headbar > .connection-settings-override.form-switch {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    margin: 0;
    min-height: 0;
    padding: 0;
}

.connection-settings-group-title {
    color: var(--px-text-strong);
    font-size: .8125rem;
    font-weight: 700;
    letter-spacing: .07em;
    line-height: 1.2;
    margin: 0;
    padding: 0;
    text-transform: uppercase;
}

.field-group-headbar:has(.connection-settings-group-title) {
    align-items: center;
    justify-content: flex-start;
    gap: .45rem;
    padding: .65rem 1.25rem .65rem calc(1.25rem - 3px);
}

.field-group-headbar > .connection-settings-override .form-check-input {
    cursor: pointer;
    float: none;
    height: 1.2rem;
    margin: 0;
    width: 2.25rem;
}

.field-group.is-collapsed .field-group-headbar > .connection-settings-override {
    display: inline-flex;
}

.field-group.is-collapsed .field-group-headbar,
.task-mapping-field-group.is-collapsed .field-group-headbar {
    border-bottom: none;
}

.field-group-body {
    padding: 0 1.25rem 1.1rem;
}

.sync-task-form-tab-content .field-group.is-collapsible .field-group-body {
    padding-top: 1rem;
}

.sync-task-form-tab-content .field-group.is-collapsible .field-group-collapsible-content-inner {
    padding-top: 1rem;
}

.sync-task-form-tab-content .task-mapping-field-group .field-group-title {
    position: static;
}

.sync-task-form-placeholder {
    padding: 1rem 0;
    color: var(--px-text-muted);
}

.task-use-defaults-host .task-use-defaults-toggle.form-check,
.task-use-defaults-host .task-use-defaults-toggle.form-switch {
    margin-bottom: 0;
    min-height: 0;
    padding-left: 0;
}

.task-use-defaults-host .form-check-label {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    margin: 0;
}

.task-use-defaults-description {
    margin-top: .35rem;
}

.task-history-summary {
    font-size: 0.95rem;
}

.entity-browser-precondition-toggle {
    margin-top: 0.15rem;
    white-space: nowrap;
}

.entity-row-precondition-excluded {
    opacity: 0.72;
    background: var(--px-warning-highlight);
}

.entity-row-precondition-excluded.entity-row-active {
    background: var(--px-warning-highlight-strong);
}

.entity-precondition-excluded-badge {
    display: inline-block;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    background: var(--px-warning-bg);
    color: var(--px-warning-text);
}

.entity-browser-since-input {
    width: auto;
    min-width: 10.5rem;
}

.task-mapping-formula-editor {
    font-family: Consolas, "Courier New", monospace;
}

.formula-editor-layout {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    min-height: 16rem;
}

.formula-editor-modal .formula-editor-layout {
    min-height: 20rem;
}

.formula-palette {
    flex: 0 0 17.5rem;
    max-width: 17.5rem;
    border-right: 1px solid var(--px-border);
    overflow: auto;
    padding: 0 0.75rem 0.75rem;
    background: var(--px-surface-muted);
    --bs-nav-link-color: var(--bs-link-color);
    /* form-control-sm: 1.5 * 0.875rem + vertical padding + borders, plus search margin-bottom */
    --formula-palette-search-offset: calc(1.5 * 0.875rem + 0.5rem + (var(--bs-border-width, 1px) * 2) + 0.5rem);
}

.formula-palette-search {
    margin-bottom: 0.5rem;
}

.formula-palette > .formula-palette-search {
    position: sticky;
    top: 0;
    z-index: 4;
    box-sizing: border-box;
    height: calc(1.5 * 0.875rem + 0.5rem + (var(--bs-border-width, 1px) * 2));
    background-color: var(--px-surface-muted);
    box-shadow: 0 0.5rem 0 0 var(--px-surface-muted);
}

.formula-palette > .formula-palette-search:focus {
    box-shadow:
        0 0 0 0.25rem var(--bs-focus-ring-color),
        0 0.5rem 0 0 var(--px-surface-muted);
}

.formula-palette-hint {
    line-height: 1.35;
    margin-bottom: 0.5rem;
}

.formula-fields-toolbar .formula-palette-hint {
    margin-top: 0.35rem;
}

.formula-palette-body {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.formula-palette-category {
    border: 1px solid var(--px-border-tree);
    border-radius: 0.5rem;
    background: var(--px-surface);
    overflow: visible;
    box-shadow: var(--px-shadow-card);
}

.formula-palette-category-header {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    border: 0;
    border-bottom: 1px solid var(--px-border);
    background: var(--px-surface-tree-header);
    padding: 0.5rem 0.65rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    text-align: left;
    color: var(--bs-nav-link-color);
    position: sticky;
    top: var(--formula-palette-search-offset);
    z-index: 3;
    border-radius: calc(0.5rem - 1px) calc(0.5rem - 1px) 0 0;
}

.formula-palette-category > .formula-palette-category-header:only-child {
    border-radius: calc(0.5rem - 1px);
}

.formula-palette-category-header:hover {
    background: var(--px-surface-tree-hover);
    color: var(--px-accent);
}

.formula-palette-category-chevron {
    font-size: 0.7rem;
    color: var(--px-text-muted);
}

.formula-palette-category-body {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.45rem;
    background: var(--px-surface-alt);
    border-radius: 0 0 calc(0.5rem - 1px) calc(0.5rem - 1px);
    overflow: hidden;
}

.formula-palette-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    width: 100%;
    border: 1px solid var(--px-border);
    border-radius: 0.3rem;
    background: var(--px-surface);
    padding: 0.35rem 0.45rem;
    text-align: left;
    font-size: 0.78rem;
}

.formula-palette-item-row {
    align-items: flex-start;
    display: flex;
    gap: 0.2rem;
    width: 100%;
}

.formula-palette-item-insert-target {
    cursor: pointer;
    flex: 1 1 auto;
    min-width: 0;
}

.formula-palette-item-insert-target:hover {
    color: var(--px-accent);
}

.formula-palette-item:hover {
    border-color: var(--px-accent-border);
    background: var(--px-accent-subtle);
}

.formula-palette-item-header {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    width: 100%;
}

.formula-palette-item-value {
    color: var(--px-text-muted);
    font-size: 0.75rem;
    font-weight: 400;
    margin-left: auto;
    max-width: 12rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formula-palette-item-label {
    font-weight: 500;
}

.formula-palette-item-header .connection-field-help-btn,
.formula-palette-help-btn {
    flex-shrink: 0;
    margin-left: 0.05rem;
    position: relative;
    z-index: 2;
}

.formula-palette-item-meta {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    width: 100%;
}

.formula-palette-item-notes {
    color: var(--px-text-muted);
    font-size: 0.72rem;
    line-height: 1.35;
    width: 100%;
}

.formula-palette-item-preview {
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.72rem;
    color: var(--px-text-body);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.formula-palette-item-type {
    font-size: 0.68rem;
    color: var(--px-text-muted);
}

.formula-palette-group {
    border: 1px solid var(--px-border-code);
    border-radius: 0.35rem;
    background: var(--px-surface);
    overflow: hidden;
}

.formula-palette-group-header {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    border: 0;
    background: var(--px-surface-code);
    padding: 0.35rem 0.45rem;
    font-size: 0.74rem;
    font-weight: 600;
    text-align: left;
    color: var(--px-text-body);
}

.formula-palette-group.is-expanded > .formula-palette-group-header {
    background: var(--px-accent-subtle);
}

.formula-palette-group-header:hover {
    background: var(--px-surface-code-hover);
    color: var(--px-accent);
}

.formula-palette-group.is-expanded > .formula-palette-group-header:hover {
    background: var(--px-accent-soft);
}

.formula-palette-group-title-wrap {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.formula-palette-group-title {
    flex: 1 1 auto;
}

.formula-palette-group-insert-preview {
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.68rem;
    font-weight: 500;
    color: var(--px-text-muted);
}

.formula-palette-group-header--insertable .formula-palette-group-title {
    text-decoration: underline;
    text-decoration-style: dotted;
    text-underline-offset: 0.15rem;
}

.formula-palette-group-chevron {
    font-size: 0.85rem;
    color: var(--px-text-muted);
}

.formula-palette-group-items {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.3rem 0.35rem 0.35rem;
}

.formula-palette-group-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--px-text-muted);
    margin: 0.25rem 0 0.15rem;
}

.formula-editor-main {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 0.75rem;
}

.formula-editor-main textarea {
    flex: 1 1 auto;
    min-height: 10rem;
    font-family: Consolas, "Courier New", monospace;
    resize: vertical;
}

.formula-editor-inline {
    width: 100%;
    border: 1px solid var(--px-border);
    border-radius: 0.375rem;
    overflow: hidden;
}

.formula-editor-resizable.formula-editor-layout {
    min-height: 18rem;
    height: 43.2rem;
    max-height: 43.2rem;
}

.formula-editor-modal .formula-editor-resizable.formula-editor-layout {
    min-height: 20rem;
    height: min(43.2rem, 70vh);
    max-height: 70vh;
}

.formula-editor-resizable .formula-palette {
    border-right: none;
    flex: 0 0 17.5rem;
    max-width: 40rem;
    min-width: 12rem;
    overflow: auto;
}

.formula-fields-panel.is-empty,
.formula-editor-resize-handle[data-formula-fields-resize-handle].is-empty {
    display: none;
}

.formula-fields-panel {
    flex: 0 0 17.5rem;
    max-width: 17.5rem;
    border-left: 1px solid var(--px-border);
    overflow: auto;
    padding: 0.75rem;
    background: var(--px-surface-muted);
}

.formula-fields-toolbar {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.formula-fields-caches,
.formula-fields-sync-context,
.formula-fields-task {
    margin-bottom: 0.75rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--px-border);
}

.formula-fields-panel.is-property-viewer {
    display: flex;
    flex-direction: column;
    padding: 0;
    background: var(--px-surface);
    min-width: 16rem;
    max-width: 28rem;
}

.formula-fields-panel.is-property-viewer .formula-fields-toolbar {
    padding: 0.5rem 0.6rem 0.35rem;
    margin-bottom: 0;
    border-bottom: 1px solid var(--px-border);
}

.formula-fields-panel.is-property-viewer .formula-palette-search {
    margin-bottom: 0;
}

.formula-property-header {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
}

.formula-property-caption {
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.formula-property-view-mode {
    display: flex;
    flex: 0 0 auto;
    gap: 0;
}

.formula-property-view-mode-btn {
    align-items: center;
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    color: var(--px-text-muted);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.65rem;
    font-weight: 600;
    height: 1.45rem;
    justify-content: center;
    line-height: 1;
    min-width: 1.45rem;
    padding: 0 0.35rem;
}

.formula-property-view-mode-btn + .formula-property-view-mode-btn {
    border-left: 0;
}

.formula-property-view-mode-btn svg {
    display: block;
    height: 0.85rem;
    width: 0.85rem;
}

.formula-property-view-mode-btn.is-active,
.formula-property-view-mode-btn[aria-pressed="true"] {
    background: var(--px-surface-code-hover);
    color: var(--px-text);
}

.formula-property-grid {
    --formula-col-name: 148px;
    --formula-col-type: 72px;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: visible;
    position: relative;
    border-bottom: 1px solid var(--px-border);
}

.formula-property-colhead {
    background: var(--px-surface-muted);
    border-bottom: 1px solid var(--px-border);
    display: grid;
    flex: 0 0 auto;
    font-size: 0.7rem;
    font-weight: 700;
    grid-template-columns: var(--formula-col-name) var(--formula-col-type) minmax(64px, 1fr);
    letter-spacing: 0.03em;
    min-height: 1.45rem;
    position: sticky;
    top: 0;
    text-transform: uppercase;
    user-select: none;
    z-index: 3;
}

.formula-property-collection-mode {
    display: inline-flex;
    flex: 0 0 auto;
}

.formula-property-collection-mode-btn {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    color: var(--px-text-muted);
    cursor: pointer;
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1;
    padding: 0.15rem 0.35rem;
}

.formula-property-collection-mode-btn + .formula-property-collection-mode-btn {
    border-left: 0;
}

.formula-property-collection-mode-btn.is-active,
.formula-property-collection-mode-btn[aria-pressed="true"] {
    background: var(--px-surface-code-hover);
    color: var(--px-text);
}

.formula-property-colhead.is-resizing {
    cursor: col-resize;
}

.formula-property-colhead-cell {
    align-items: center;
    color: var(--px-text-muted);
    display: flex;
    min-width: 0;
    overflow: hidden;
    padding: 0.2rem 0.35rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formula-property-colhead-cell.formula-property-name {
    padding-left: 0.35rem;
}

.formula-property-rows {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.formula-property-col-sizer {
    cursor: col-resize;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 6px;
    z-index: 4;
}

.formula-property-col-sizer:hover,
.formula-property-col-sizer.is-dragging {
    background: var(--px-border-focus, #4c8bf5);
}

.formula-property-category {
    background: var(--px-surface-muted);
    color: var(--px-text-muted);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.25rem 0.5rem;
    text-transform: uppercase;
}

.formula-property-row {
    align-items: stretch;
    border-bottom: 1px solid var(--px-border);
    cursor: default;
    display: grid;
    grid-template-columns: var(--formula-col-name) var(--formula-col-type) minmax(64px, 1fr);
    min-height: 1.4rem;
    padding: 0;
}

.formula-property-row:hover {
    background: var(--px-surface-muted);
}

.formula-property-row.is-selected {
    background: var(--px-surface-code-hover);
    outline: 1px solid var(--px-border-focus, #4c8bf5);
    outline-offset: -1px;
}

.formula-property-row.is-category {
    background: var(--px-surface-muted);
}

.formula-property-row.is-category .formula-property-label {
    color: var(--px-text-muted);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.formula-property-row.is-storage-item {
    background: var(--px-surface-muted);
}

.formula-property-row.is-storage-item .formula-property-label {
    font-family: var(--bs-font-sans-serif, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.formula-property-name {
    align-items: center;
    border-right: 1px solid var(--px-border);
    display: flex;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.15rem 0.35rem 0.15rem calc(0.28rem + (var(--formula-property-depth, 0) * 0.75rem));
}

.formula-property-toggle,
.formula-property-toggle-spacer {
    box-sizing: border-box;
    flex: 0 0 14px;
    height: 14px;
    width: 14px;
}

.formula-property-toggle {
    align-items: center;
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    color: var(--px-text);
    cursor: pointer;
    display: inline-flex;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 10px;
    justify-content: center;
    line-height: 1;
    padding: 0;
}

.formula-property-label {
    flex: 1 1 auto;
    font-size: 0.8rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formula-property-help-btn {
    margin-left: auto;
}

.formula-property-name > .formula-property-copy-btn {
    margin-left: auto;
}

.formula-property-name > .formula-property-help-btn + .formula-property-copy-btn {
    margin-left: 0.15rem;
}

.formula-property-type-cell {
    align-items: center;
    border-right: 1px solid var(--px-border);
    display: flex;
    min-width: 0;
    overflow: hidden;
    padding: 0 0.3rem;
}

.formula-property-type {
    color: var(--px-text-muted);
    font-size: 0.7rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formula-property-value {
    align-items: center;
    color: var(--px-text);
    display: flex;
    font-size: 0.75rem;
    gap: 0.15rem;
    line-height: 1.4rem;
    min-width: 0;
    overflow: hidden;
    padding: 0 0.3rem;
}

.formula-property-value-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formula-property-description {
    flex: 0 0 auto;
    max-height: 8rem;
    min-height: 3.25rem;
    overflow-y: auto;
    padding: 0.45rem 0.6rem 0.6rem;
}

.formula-property-description-title {
    font-size: 0.8rem;
    font-weight: 600;
}

.formula-property-description-text {
    color: var(--px-text-muted);
    font-size: 0.75rem;
    margin-top: 0.15rem;
}

.connection-field-help-btn.irb-hint-btn {
    background: transparent;
    border: 1px solid var(--px-text-muted);
    border-radius: 0.15rem;
    box-sizing: border-box;
    color: var(--px-text-muted);
    flex-shrink: 0;
    height: 0.8rem;
    margin-left: 0.15rem;
    width: 0.8rem;
}

.connection-field-help-btn.irb-hint-btn:focus,
.connection-field-help-btn.irb-hint-btn[aria-describedby] {
    background: transparent;
    border-color: var(--px-text-muted);
    color: var(--px-text-muted);
    outline: none;
}

.connection-field-help-btn.irb-hint-btn:hover {
    background: var(--px-accent-subtle);
    border-color: var(--px-accent-strong);
    color: var(--px-accent-strong);
}

.irb-hint-btn svg {
    display: block;
    height: 0.55rem;
    width: 0.55rem;
}

.irb-hint-popover {
    --bs-popover-bg: var(--px-surface);
    --bs-popover-body-color: var(--px-text);
    --bs-popover-body-padding-x: 0.5rem;
    --bs-popover-body-padding-y: 0.5rem;
    --bs-popover-border-color: var(--px-text-secondary);
    --bs-popover-border-width: 2px;
    --bs-popover-header-bg: var(--px-surface-muted);
    --bs-popover-header-color: var(--px-text);
    --bs-popover-max-width: 36rem;
    z-index: 2000;
}

.irb-hint-popover .popover-header {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
}

.irb-hint-popover-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.irb-hint-popover-close {
    background: transparent;
    border: 0;
    color: var(--px-text-muted);
    flex: 0 0 auto;
    font-size: 1.15rem;
    line-height: 1;
    padding: 0 0.15rem;
}

.irb-hint-popover-close:hover,
.irb-hint-popover-close:focus-visible {
    color: var(--px-text);
}

.irb-hint-message {
    margin: 0;
}

.task-mapping-target-line {
    align-items: center;
    display: flex;
    gap: 0.35rem;
    width: 100%;
}

.task-mapping-target-main {
    flex: 1 1 auto;
    min-width: 0;
}

.task-mapping-target-line > .connection-field-help-btn {
    flex: 0 0 auto;
    margin-left: auto;
}

.irb-hint-stage {
    max-height: 24rem;
    overflow: auto;
}

.irb-hint-frame {
    position: relative;
    width: max-content;
    max-width: 100%;
}

.irb-hint-frame img,
.irb-hint-stage img {
    display: block;
    height: auto;
    max-width: 100%;
}

.irb-hint-box {
    background-color: color-mix(in srgb, var(--px-accent-strong) 22%, transparent);
    background-image: repeating-linear-gradient(
        -45deg,
        color-mix(in srgb, var(--px-accent-strong) 55%, transparent) 0 1px,
        transparent 1px 7px
    );
    border: 2px solid var(--px-accent-strong);
    pointer-events: none;
    position: absolute;
}

.formula-editor-resizable .formula-fields-panel.is-property-viewer {
    max-width: 32rem;
    min-width: 16rem;
}

.formula-editor-resize-handle {
    align-self: stretch;
    background: var(--px-surface-code-hover);
    cursor: col-resize;
    flex: 0 0 6px;
}

.formula-editor-resize-handle:hover,
.formula-editor-resize-handle.is-dragging {
    background: var(--px-text-disabled);
}

.formula-editor-resizable .formula-editor-main {
    flex: 1 1 auto;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.formula-editor-resizable .formula-editor-main textarea {
    flex: 1 1 auto;
    min-height: 9.375rem;
    max-height: none;
    resize: none;
    overflow: auto;
}

.formula-editor-value-preview {
    background: var(--px-accent-subtle);
    border-radius: var(--px-radius-sm);
    color: var(--px-text-strong);
    flex-shrink: 0;
    font-weight: 700;
    margin-top: 0.5rem;
    min-height: 2.25rem;
    overflow-wrap: anywhere;
    padding: 0.45rem 0.75rem;
    white-space: pre-wrap;
}

.formula-editor-annotation {
    border: 1px solid var(--px-border-code);
    border-radius: 0.35rem;
    background: var(--px-surface-code);
    flex-shrink: 0;
    margin-top: 0.5rem;
    max-height: min(12rem, 35%);
    overflow-y: auto;
    padding: 0.55rem 0.65rem;
}

.formula-editor-annotation-header {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.6rem;
    margin-bottom: 0.25rem;
}

.formula-editor-annotation-title {
    font-size: 0.82rem;
}

.formula-editor-annotation-type {
    font-size: 0.72rem;
}

.formula-editor-annotation-description {
    color: var(--px-text-body);
    line-height: 1.4;
    margin-top: 0.15rem;
}

.formula-editor-annotation-help {
    line-height: 1.45;
    margin-top: 0.35rem;
    white-space: pre-line;
}

.formula-editor-annotation-help.is-collapsed {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    white-space: pre-line;
}

.formula-editor-annotation-lookups {
    display: grid;
    gap: 0.45rem;
    margin-top: 0.5rem;
}

.formula-editor-annotation-lookup-group {
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    padding: 0.4rem 0.5rem;
}

.formula-editor-annotation-lookup-group.is-emphasized {
    background: var(--px-accent-subtle);
    border-color: var(--px-accent-border);
}

.formula-editor-annotation-lookup-title {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--px-text-heading);
}

.formula-editor-annotation-lookup-hint {
    margin-top: 0.1rem;
}

.formula-editor-annotation-lookup-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-top: 0.35rem;
}

.formula-editor-annotation-lookup-chip {
    background: var(--px-surface);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    color: var(--px-text-body);
    cursor: pointer;
    font-size: 0.75rem;
    line-height: 1.2;
    padding: 0.15rem 0.45rem;
}

.formula-editor-annotation-lookup-chip:hover,
.formula-editor-annotation-lookup-chip:focus-visible {
    background: var(--px-accent-subtle);
    border-color: var(--px-accent-border);
    color: var(--px-text-strong);
}

.formula-editor-annotation-toggle {
    line-height: 1.2;
    margin-top: 0.15rem;
    min-height: auto;
    padding-bottom: 0;
    padding-top: 0;
}

.formula-editor-completion {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: 0.35rem;
    box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.12);
    list-style: none;
    margin: 0;
    max-height: 14rem;
    overflow: auto;
    padding: 0.25rem 0;
    position: fixed;
    z-index: 1200;
}

.formula-editor-completion-item {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 0.5rem;
    justify-content: space-between;
    padding: 0.35rem 0.65rem;
}

.formula-editor-completion-item:hover,
.formula-editor-completion-item.is-active {
    background: var(--px-surface-code-hover);
}

.formula-editor-completion-label {
    font-size: 0.82rem;
}

.formula-editor-completion-value {
    color: var(--px-text-muted);
    font-size: 0.72rem;
}

.formula-editor-resizable .formula-editor-main [data-formula-status] {
    flex-shrink: 0;
    margin-top: 0.5rem;
}

.formula-editor-modal-footer {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    width: 100%;
}

.formula-editor-insert-hint {
    flex: 1 1 auto;
    line-height: 1.35;
    min-width: 0;
}

.formula-editor-modal-footer-actions {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: 0.75rem;
}

.formula-editor-skip-validation {
    margin-right: 0.25rem;
    white-space: nowrap;
}

.formula-editor-modal {
    z-index: 1070;
}

.formula-function-args-modal {
    z-index: 1065;
}

body.formula-modal-args-on-top .formula-function-args-modal.show {
    z-index: 1100;
}

body.formula-modal-args-on-top .formula-editor-modal.show {
    z-index: 1090;
}

body.formula-modal-editor-on-top .formula-editor-modal.show {
    z-index: 1100;
}

body.formula-modal-editor-on-top .formula-function-args-modal.show {
    z-index: 1090;
}

.formula-editor-modal .modal-body {
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.formula-editor-modal-dialog.is-resizable {
    width: min(75vw, 1140px);
    height: min(80vh, 900px);
    max-width: 95vw;
    max-height: 90vh;
    margin: 1.75rem auto;
    display: flex;
}

.formula-editor-modal-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 0;
    position: relative;
}

.formula-editor-modal.is-resizing,
body.formula-editor-modal-resizing {
    user-select: none;
}

.formula-editor-modal .formula-editor-resizable.formula-editor-layout {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    max-height: none;
}

.formula-modal-resize-handle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 16px;
    height: 16px;
    cursor: nwse-resize;
    z-index: 2;
}

.formula-modal-resize-handle::after {
    content: "";
    position: absolute;
    right: 4px;
    bottom: 4px;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--bs-secondary-color);
    border-bottom: 2px solid var(--bs-secondary-color);
    opacity: 0.7;
}

.formula-modal-resize-handle:hover::after,
.formula-modal-resize-handle.is-dragging::after {
    opacity: 1;
}

.formula-args-field {
    margin-bottom: 1rem;
}

.formula-args-field-label {
    font-weight: 600;
    margin-bottom: 0.35rem;
}

.formula-args-formula-row {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.connection-field-options-row .form-select {
    flex: 1;
    min-width: 0;
}

.storage-filter-field-row {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.storage-filter-field-label {
    flex: 0 0 12rem;
    width: 12rem;
    min-height: 2rem;
    font-weight: 600;
}

.storage-filter-field-control {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.storage-filter-field-control .formula-args-formula-row {
    width: 100%;
    justify-content: space-between;
}

.storage-filter-field-hint {
    margin: 0;
}

.storage-field-editor-row .storage-field-native,
.storage-field-editor-row .storage-field-multi,
.storage-field-editor-row > .form-control,
.storage-field-editor-row > .form-select {
    flex: 1;
    min-width: 0;
}

.storage-field-editor-row .form-control,
.storage-field-editor-row .form-select {
    background-color: var(--px-surface);
    border-color: var(--px-border);
    color: var(--px-text);
}

.storage-field-editor-row .storage-field-formula-preview {
    background-color: var(--px-surface-muted);
    color: var(--px-text-secondary);
    cursor: default;
}

.storage-field-editor-row .storage-field-switch {
    flex: 0 0 auto;
    min-height: 2rem;
    margin: 0;
    padding-left: 0;
}

.storage-field-editor-row .storage-field-switch .form-check-input {
    margin-left: 0;
}

.storage-field-multi {
    position: relative;
}

.storage-field-multi-menu {
    position: absolute;
    z-index: 5;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    max-height: 12rem;
    overflow: auto;
    padding: 0.35rem;
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-sm);
    box-shadow: var(--px-shadow-panel);
}

.storage-field-multi-option {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.2rem 0.35rem;
    margin: 0;
}

.storage-field-multi-toggle {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.formula-args-formula-row:not(.storage-field-editor-row) .form-control,
.storage-field-editor-row .storage-field-formula-preview {
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.85rem;
}

.form-control::placeholder,
textarea.form-control::placeholder {
    color: var(--px-text-placeholder);
    opacity: 1;
}

.formula-args-pairs-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.formula-args-pair-row {
    display: grid;
    grid-template-columns: minmax(8rem, 12rem) 1fr auto;
    gap: 0.5rem;
    align-items: center;
}

.formula-args-pair-value .formula-args-formula-row {
    width: 100%;
}

.formula-editor-error + .formula-editor-preview,
.formula-editor-preview + .formula-editor-type-hint {
    margin-top: 0.25rem;
}

.task-mapping-formula-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.task-mapping-target-cell {
    min-width: 0;
    vertical-align: middle;
}

.task-mapping-target-name {
    font-weight: 600;
}

.task-mapping-target-meta {
    font-size: 0.75rem;
    margin-top: 0.15rem;
}

.task-mapping-formula-cell {
    vertical-align: middle;
}

.task-mapping-formula-input {
    font-family: Consolas, "Courier New", monospace;
}

.task-mapping-insert-field {
    max-width: 16rem;
}

.task-mapping-id-row {
    background: var(--px-surface-muted);
}

.task-mapping-storage-group-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    border: 0;
    background: transparent;
    padding: 0.15rem 0;
    min-height: 1.6rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--px-text-body);
}

.task-mapping-storage-group-toggle:hover {
    color: var(--px-accent);
}

.task-mapping-collection-badge {
    font-size: 0.65rem;
    font-weight: 600;
    vertical-align: middle;
}

/* Nested storage group headers: base padding matches other group rows; extra
   indent comes from margin-left on the toggle (set in JS from data-depth). */
.task-mapping-group-row.task-mapping-storage-group-row > td {
    padding-left: 0.75rem;
}

.task-mapping-storage-group-row.is-expanded > td {
    background: var(--px-accent-subtle);
}

.task-mapping-storage-row,
.task-mapping-storage-header-row {
    transition: opacity 0.28s ease, transform 0.28s ease;
}

.task-mapping-storage-row.storage-row-visible,
.task-mapping-storage-header-row.storage-row-visible {
    opacity: 1;
    transform: translateY(0);
}

.task-mapping-storage-row.storage-row-collapsed,
.task-mapping-storage-header-row.storage-row-collapsed,
.task-mapping-storage-row.storage-row-collapsing,
.task-mapping-storage-header-row.storage-row-collapsing {
    opacity: 0;
    transform: translateY(-0.35rem);
}

.task-mapping-storage-row.storage-row-expanding,
.task-mapping-storage-header-row.storage-row-expanding {
    opacity: 0;
    transform: translateY(-0.35rem);
}

@media (prefers-reduced-motion: reduce) {
    .field-group-chevron,
    .field-group-collapsible-content,
    .task-mapping-storage-group-chevron,
    .task-mapping-storage-row,
    .task-mapping-storage-header-row {
        transition: none;
    }
}

/* Destination tree nesting
   -------------------------------------------------------------------------
   The destination side is rendered as a recursive tree: every row carries
   data-depth="N" plus, for N > 0, the class task-mapping-depth-N (N capped
   at 5). Depth is expressed purely inside the target cell via indent
   (--px-space-4 per level) so the map, update and formula columns stay
   aligned across the whole table. Collection rows share the same indent
   geometry and a subtle surface tint to separate a collection header from
   the element rows underneath it. */

.task-mapping-collection-row,
.task-mapping-depth-1,
.task-mapping-depth-2,
.task-mapping-depth-3,
.task-mapping-depth-4,
.task-mapping-depth-5 {
    --task-mapping-depth: 0;
}

.task-mapping-depth-1 {
    --task-mapping-depth: 1;
}

.task-mapping-depth-2 {
    --task-mapping-depth: 2;
}

.task-mapping-depth-3 {
    --task-mapping-depth: 3;
}

.task-mapping-depth-4 {
    --task-mapping-depth: 4;
}

.task-mapping-depth-5 {
    --task-mapping-depth: 5;
}

.task-mapping-collection-row > .task-mapping-target-cell,
.task-mapping-depth-1 > .task-mapping-target-cell,
.task-mapping-depth-2 > .task-mapping-target-cell,
.task-mapping-depth-3 > .task-mapping-target-cell,
.task-mapping-depth-4 > .task-mapping-target-cell,
.task-mapping-depth-5 > .task-mapping-target-cell {
    padding-left: calc(var(--px-space-3) + var(--px-space-4) * var(--task-mapping-depth));
}

.task-mapping-collection-row {
    background: var(--px-surface-subtle);
}

.task-mapping-row-toggle {
    align-self: center;
    flex-shrink: 0;
    line-height: 1;
    margin-right: var(--px-space-1);
}

.task-mapping-row-blocked .task-mapping-target-name,
.task-mapping-row-blocked .task-mapping-formula-preview {
    color: var(--px-text-muted);
}

.task-mapping-row-blocked .task-mapping-formula-preview {
    cursor: not-allowed;
}

.task-mapping-bool-helpers {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.entity-sync-badge {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}

.entity-sync-badge-notlinked {
    background: var(--px-surface-code);
    color: var(--px-text-body);
}

.entity-sync-badge-insync {
    background: var(--px-success-bg);
    color: var(--px-success-text-bright);
}

.entity-sync-badge-updaterequired {
    background: var(--px-warning-highlight-strong);
    color: var(--px-warning-text);
}

.entity-sync-badge-unknown {
    background: var(--px-info-bg);
    color: var(--px-info-text);
}

.entity-link-status,
.entity-mapping-preview {
    background: var(--px-surface-alt);
    border: 1px solid var(--px-border);
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
}

.entity-link-status-title,
.entity-mapping-preview-title {
    color: var(--px-text-muted);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-bottom: 0.35rem;
    text-transform: uppercase;
}

.entity-link-status-grid {
    display: grid;
    gap: 0.15rem 0.65rem;
    grid-template-columns: max-content minmax(0, 1fr);
    margin: 0;
}

.entity-link-status-grid dt {
    color: var(--px-text-muted);
    font-size: 0.8125rem;
    font-weight: 500;
    margin: 0;
}

.entity-link-status-grid dd {
    font-size: 0.8125rem;
    margin: 0;
    min-width: 0;
    word-break: break-all;
}

.entity-link-actions {
    justify-content: flex-start;
    margin-top: 0.45rem;
}

.entity-mapping-preview-loading {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    color: var(--px-text-muted);
    font-size: 0.875rem;
}

.entity-mapping-table {
    --bs-table-bg: transparent;
    font-size: 0.8125rem;
}

.entity-mapping-table thead th {
    background: transparent;
    border-bottom-color: var(--px-border);
    color: var(--px-text-muted);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding-bottom: 0.4rem;
    text-transform: uppercase;
}

.entity-mapping-table tbody td {
    border-bottom-color: var(--px-border-subtle, var(--px-border));
    padding-bottom: 0.42rem;
    padding-top: 0.42rem;
    vertical-align: top;
}

.mapping-preview-target {
    color: var(--px-text);
    font-weight: 600;
}

.mapping-preview-formula {
    color: var(--px-text-muted);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.78rem;
    font-style: italic;
}

.entity-mapping-table td:last-child {
    white-space: nowrap;
}

.entity-mapping-table .mapping-preview-status {
    white-space: normal;
}

.mapping-status-ok {
    color: var(--px-success-text-bright);
}

.mapping-status-truncated {
    color: var(--px-warning-text);
}

.mapping-status-error {
    color: var(--px-danger-text-bright);
}

.mapping-status-skipped {
    color: var(--px-text-faint);
}

.mapping-line-group-header td {
    background: var(--px-surface-code);
    border-top: 1px solid var(--px-border);
    padding: 0.35rem 0.5rem;
}

.mapping-line-group-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 0;
    background: transparent;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--px-text-body);
    cursor: pointer;
}

.mapping-line-group-toggle:hover,
.mapping-line-group-toggle:focus {
    color: var(--px-info-text);
}

.mapping-line-group-chevron {
    display: inline-block;
    width: 0.75rem;
    font-size: 0.75rem;
    line-height: 1;
    transition: transform 0.15s ease;
}

.mapping-line-group-toggle.is-expanded .mapping-line-group-chevron {
    transform: rotate(90deg);
}

.mapping-line-group-meta {
    font-weight: 500;
    color: var(--px-text-faint);
}

.mapping-line-detail td:first-child {
    padding-left: 1.5rem;
}

.mapping-preview-status {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.mapping-preview-status-text {
    min-width: 0;
    white-space: normal;
}

.mapping-preview-link-btn {
    flex-shrink: 0;
}

.mapping-preview-value {
    color: var(--px-text-body);
    font-weight: 500;
    word-break: break-word;
}

.mapping-status-ok .mapping-preview-status-text {
    font-size: 0.75rem;
    font-weight: 600;
}

.mapping-preview-value--has-tooltip {
    cursor: help;
    text-decoration: underline dotted var(--px-text-muted, #888);
}

.mapping-preview-truncated-tail {
    color: var(--px-danger-text-bright);
}

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

    .page-title {
        align-items: stretch;
        flex-direction: column;
    }

    .sync-task-tree-table {
        column-gap: 0;
        display: block;
    }

    .sync-task-tree-header {
        display: none;
    }

    .sync-task-tree-root,
    .sync-task-tree-list,
    .sync-task-tree-list-shell,
    .sync-task-tree-item,
    .sync-task-tree-group-frame,
    .sync-task-tree-group-frame > .sync-task-tree-list-shell {
        display: block;
        grid-column: auto;
        grid-template-columns: none;
        grid-template-rows: none;
    }

    .sync-task-tree-group-header {
        display: flex;
        grid-column: auto;
        grid-row: auto;
    }

    .sync-task-tree-row {
        display: grid;
        grid-column: auto;
        grid-template-columns: 1fr;
        row-gap: .35rem;
    }

    .sync-task-tree-col-schedule {
        grid-column: 2;
    }

    .sync-task-tree-col-next-start {
        grid-column: 2;
    }

    .sync-task-tree-col-modified-since {
        grid-column: 2;
    }

    .sync-task-tree-col-actions {
        grid-column: 2;
        justify-content: flex-start;
    }
}

.sync-task-tree-panel {
    overflow-x: auto;
}

.sync-task-tree-table {
    --tree-grid: minmax(14rem, 2fr) 7rem 7.5rem 5rem 7.5rem minmax(11rem, auto);
    --tree-grid-gap: .75rem;
    column-gap: var(--tree-grid-gap);
    display: grid;
    grid-template-columns: var(--tree-grid);
    min-width: 61rem;
}

.template-tree .sync-task-tree-table {
    --tree-grid: 2.25rem minmax(14rem, 2.2fr) minmax(12rem, 1.8fr) 7.5rem 2.75rem;
    min-width: 46rem;
}

.template-tree-col-select {
    align-items: center;
    display: flex;
    justify-content: center;
}

.template-group-select {
    flex-shrink: 0;
    margin: 0 .35rem 0 .65rem;
}

.template-selection-bar {
    align-items: center;
    display: flex;
    gap: .5rem;
}

.template-selection-bar[hidden] {
    display: none !important;
}

.template-tree .empty {
    grid-column: 1 / -1;
}

.template-tree.is-reorder-enabled .sync-task-tree-list {
    min-height: 2.25rem;
}

.sync-task-tree-col-next-start .entity-browse-datetime,
.sync-task-tree-col-last-run .entity-browse-datetime,
.sync-task-tree-col-modified-since .entity-browse-datetime,
.template-tree-col-updated .entity-browse-datetime {
    color: var(--px-text-muted);
    font-size: .875rem;
    font-variant-numeric: tabular-nums;
}


.sync-task-tree-header,
.sync-task-tree-root,
.sync-task-tree-list,
.sync-task-tree-list-shell,
.sync-task-tree-item,
.sync-task-tree-row {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: subgrid;
}

.sync-task-tree-group-frame {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: subgrid;
    grid-template-rows: auto auto;
}

.sync-task-tree-header,
.sync-task-tree-row {
    align-items: center;
    column-gap: var(--tree-grid-gap);
}

.sync-task-tree-header {
    border-bottom: 1px solid var(--px-border);
    color: var(--px-text-muted);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .02em;
    margin-bottom: .35rem;
    padding: 0 .25rem .65rem;
    text-transform: uppercase;
}

.sync-task-tree-list {
    list-style: none;
    margin: 0;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

.sync-task-tree-list-shell {
    grid-template-rows: 1fr;
    min-height: 0;
    overflow: hidden;
    transition: grid-template-rows .24s ease;
}

.sync-task-tree-list-shell.is-collapsed {
    grid-template-rows: 0fr;
}

.sync-task-tree-list-shell.sync-task-collapse-instant {
    transition: none;
}

@media (prefers-reduced-motion: reduce) {
    .sync-task-tree-list-shell,
    .sync-task-tree-group-toggle .field-group-chevron {
        transition: none;
    }
}

.sync-task-tree-item {
    margin: 0;
}

.sync-task-tree-item[data-node-type="group"] {
    padding-left: calc(var(--tree-depth, 0) * 1.25rem);
}

.sync-task-tree-group-frame {
    background: var(--px-surface-alt);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-md);
    margin: .4rem 0 .55rem;
    overflow: hidden;
    padding: 0;
    position: relative;
}

.sync-task-tree-group-header {
    grid-column: 1 / -1;
    grid-row: 1;
    position: relative;
    z-index: 0;
}

.sync-task-tree-group-header .sync-task-drag-handle {
    align-self: center;
    display: none;
    flex-shrink: 0;
    margin-left: .35rem;
}

.sync-task-tree-panel.is-reorder-enabled .sync-task-tree-group-header .sync-task-drag-handle {
    display: inline-flex;
}

.sync-task-tree-group-header .sync-task-tree-group-toggle {
    border-left: 0;
    flex: 1 1 auto;
    min-width: 0;
    padding-left: .85rem;
}

.sync-task-tree-group-header .sync-task-group-header-actions {
    align-self: center;
    flex-shrink: 0;
    margin-right: .35rem;
}

.sync-task-tree-group-frame > .sync-task-tree-list-shell {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: subgrid;
}

.sync-task-tree-group-frame > .sync-task-tree-list-shell > .sync-task-tree-list {
    grid-column: 1 / -1;
    padding: .15rem .35rem .35rem;
}

.sync-task-tree-group-frame .sync-task-tree-group-frame {
    margin: .35rem 0 .15rem;
}

.sync-task-tree-item.is-collapsed > .sync-task-tree-group-frame.field-group .field-group-collapsible-content,
.sync-task-tree-item.is-collapsed > .sync-task-tree-group-frame > .sync-task-tree-list-shell {
    grid-template-rows: 0fr;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
}

.sync-task-tree-col-name {
    padding-left: calc(var(--tree-depth, 0) * 1.25rem);
}

.sync-task-tree-item[data-depth]:not([data-depth="0"]) > .sync-task-tree-row .sync-task-tree-col-name {
    padding-left: calc(var(--tree-depth, 0) * 1.25rem + .15rem);
}

.sync-task-tree-row {
    border-radius: var(--px-radius-md);
    margin: .1rem 0;
    min-height: 2.5rem;
    padding: .3rem .15rem;
    transition: background-color .15s ease;
}

.sync-task-tree-row:hover {
    background: var(--px-surface-subtle);
}

.sync-task-tree-group-frame > .sync-task-tree-list-shell.field-group-collapsible-content > .sync-task-tree-list {
    min-height: 0;
    overflow: hidden;
}

.sync-task-tree-row-task {
    align-items: center;
    padding-top: .3rem;
    padding-bottom: .3rem;
}

.sync-task-tree-row-task .sync-task-tree-col-modified-since,
.sync-task-tree-row-task .sync-task-tree-col-last-run,
.sync-task-tree-row-task .sync-task-tree-col-schedule,
.sync-task-tree-row-task .sync-task-tree-col-next-start,
.sync-task-tree-row-task .sync-task-tree-col-actions {
    align-self: center;
    padding-top: 0;
}

.sync-task-modified-since-date {
    font-variant-numeric: tabular-nums;
}

.sync-task-tree-label.sync-task-tree-label-task {
    align-items: center;
    display: flex;
    gap: .65rem;
    min-width: 0;
    padding-left: 0;
}

.sync-task-tree-label-task .sync-task-drag-handle {
    display: none;
    flex-shrink: 0;
    height: 1.85rem;
    margin-right: -.15rem;
    opacity: 1;
    pointer-events: none;
    width: 1.85rem;
}

.sync-task-tree-panel.is-reorder-enabled .sync-task-tree-label-task .sync-task-drag-handle {
    display: inline-flex;
    pointer-events: auto;
}

.sync-task-status-icon {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    height: 1.54rem;
    justify-content: center;
    width: 1.54rem;
}

.sync-task-status-icon svg {
    height: 1.54rem;
    width: 1.54rem;
}

.sync-task-status-icon--succeeded {
    color: color-mix(in srgb, var(--px-success-text) 42%, var(--px-text-muted));
}

.sync-task-status-icon--failed {
    color: color-mix(in srgb, var(--px-danger-text) 42%, var(--px-text-muted));
}

.sync-task-status-icon--cancelled {
    color: color-mix(in srgb, var(--px-text-secondary) 55%, var(--px-text-muted));
}

.sync-task-status-icon--partial,
.sync-task-status-icon--skipped {
    color: color-mix(in srgb, var(--px-warning-border-strong) 82%, var(--px-warning-text));
}

.sync-task-status-icon--running {
    color: color-mix(in srgb, var(--px-accent) 45%, var(--px-text-muted));
}

.sync-task-status-icon--inactive,
.sync-task-status-icon--idle {
    color: color-mix(in srgb, var(--px-text-faint) 70%, var(--px-text-muted));
}

.sync-task-status-dot {
    background: currentColor;
    border-radius: 999px;
    display: block;
    height: .63rem;
    width: .63rem;
}

.sync-task-status-spinner {
    animation: sync-task-status-spin .8s linear infinite;
    border: 2px solid currentColor;
    border-radius: 999px;
    border-top-color: transparent;
    display: block;
    height: 1.33rem;
    width: 1.33rem;
}

@keyframes sync-task-status-spin {
    to {
        transform: rotate(360deg);
    }
}

.sync-task-actions-primary {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    margin-right: .25rem;
}

.sync-task-run-host {
    display: inline-flex;
}

.sync-task-run-dropdown .dropdown-toggle.sync-task-run-toggle::after {
    margin-left: .35rem;
}

.sync-task-run-dropdown .dropdown-menu {
    z-index: 1080;
}

.sync-task-more-dropdown .dropdown-toggle::after {
    display: none;
}

.sync-task-more-dropdown .dropdown-menu {
    z-index: 1080;
}

.sync-task-more-menu .dropdown-item {
    align-items: center;
    display: flex;
    gap: .5rem;
}

.sync-task-more-menu .dropdown-item svg {
    flex-shrink: 0;
    height: 1rem;
    width: 1rem;
}

.sync-task-more-delete {
    color: var(--px-danger-text-strong);
}

.sync-task-more-delete:hover,
.sync-task-more-delete:focus {
    background: var(--px-danger-surface);
    color: var(--px-danger-text-strong);
}

.sync-task-run-toggle {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    justify-content: center;
    min-width: 6.75rem;
}

.sync-task-run-icon {
    flex-shrink: 0;
    height: .8rem;
    width: .8rem;
}

.sync-task-tree-header .sync-task-tree-col-modified-since,
.sync-task-tree-col-modified-since,
.sync-task-tree-header .sync-task-tree-col-last-run,
.sync-task-tree-col-last-run,
.sync-task-tree-header .sync-task-tree-col-schedule,
.sync-task-tree-col-schedule,
.sync-task-tree-header .sync-task-tree-col-next-start,
.sync-task-tree-col-next-start {
    align-items: center;
    display: flex;
    justify-content: flex-start;
    text-align: left;
}

.sync-task-tree-label {
    align-items: flex-start;
    display: flex;
    gap: .4rem;
    min-width: 0;
    padding-left: 1.25rem;
    position: relative;
}

.sync-task-tree-col {
    min-width: 0;
    text-align: left;
}

.sync-task-tree-col-actions {
    display: flex;
    justify-content: flex-end;
}

.sync-task-drag-handle {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--px-text-faint);
    cursor: grab;
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    opacity: 0;
    padding: 0;
    pointer-events: none;
    transition: opacity .15s ease, background-color .15s ease, color .15s ease;
    width: 2rem;
}

.sync-task-tree-panel.is-reorder-enabled .sync-task-drag-handle {
    opacity: 1;
    pointer-events: auto;
}

.sync-task-tree-panel.is-reorder-enabled .sync-task-drag-handle:hover {
    background: var(--px-border-faint);
    color: var(--px-text-muted);
}

.sync-task-drag-handle svg {
    height: 1rem;
    width: 1rem;
}

.sync-task-tree-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 4px;
    color: var(--px-text-muted);
    display: inline-flex;
    height: 1.25rem;
    justify-content: center;
    left: -1.25rem;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 1.25rem;
}

.sync-task-tree-toggle svg {
    height: .9rem;
    transition: transform .24s ease;
    width: .9rem;
}

.sync-task-tree-item.is-collapsed .sync-task-tree-toggle svg {
    transform: rotate(-90deg);
}

.sync-task-tree-icon {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    height: 1.125rem;
    justify-content: center;
    width: 1.125rem;
}

.sync-task-ui-icon {
    display: block;
    height: 1rem;
    object-fit: contain;
    width: 1rem;
}

.sync-task-tree-icon .sync-task-ui-icon {
    height: 1.125rem;
    width: 1.125rem;
}

.action-toolbar .sync-task-ui-icon {
    height: 1.05rem;
    width: 1.05rem;
}

.btn-with-icon {
    align-items: center;
    display: inline-flex;
    gap: .45rem;
}

.btn-with-icon .sync-task-ui-icon {
    height: 1rem;
    width: 1rem;
}

.sync-task-tree-name-block {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.sync-task-tree-meta {
    color: var(--px-text-muted);
    font-size: .8rem;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.entity-unlink-progress.sync-task-progress {
    margin-top: 0;
    max-width: none;
}

.sync-task-progress {
    align-items: center;
    display: flex;
    gap: .5rem;
    margin-top: .2rem;
    max-width: 18rem;
    width: 100%;
}

.sync-task-progress-track {
    background: var(--px-border-subtle);
    border-radius: 999px;
    flex: 1 1 auto;
    height: .35rem;
    min-width: 4rem;
    overflow: hidden;
    position: relative;
}

.sync-task-progress-bar {
    background: color-mix(in srgb, var(--px-accent) 55%, var(--px-text-muted));
    border-radius: inherit;
    height: 100%;
    width: var(--progress, 0%);
    transition: width .25s ease;
}

.sync-task-progress--indeterminate .sync-task-progress-bar {
    animation: sync-task-progress-slide 1.1s ease-in-out infinite alternate;
    position: absolute;
    width: 38%;
}

@keyframes sync-task-progress-slide {
    from {
        left: -38%;
    }

    to {
        left: 100%;
    }
}

.sync-task-progress-label {
    color: var(--px-text-muted);
    flex: 0 0 auto;
    font-size: .75rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.sync-task-tree-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sync-task-tree-ghost {
    opacity: .45;
}

.sync-task-tree-chosen .sync-task-tree-row {
    background: var(--px-accent-subtle);
}

.sync-task-tree-chosen > .sync-task-tree-group-frame {
    border-color: var(--px-accent-emphasis);
    box-shadow: 0 0 0 1px var(--px-accent-border);
}

.sync-task-tree-chosen > .sync-task-tree-group-frame > .sync-task-tree-group-header.field-group-headbar {
    border-left-width: 4px;
}

.sync-task-tree-drag > .sync-task-tree-group-frame {
    box-shadow: none;
}

.sync-task-tree-drag .sync-task-tree-row {
    box-shadow: none;
}

.sync-task-row-actions {
    align-items: center;
    display: inline-flex;
    gap: .15rem;
}

.sync-task-row-actions-secondary {
    align-items: center;
    display: inline-flex;
    gap: .15rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
}

.sync-task-tree-row:hover .sync-task-row-actions-secondary,
.sync-task-tree-row:focus-within .sync-task-row-actions-secondary {
    opacity: 1;
    pointer-events: auto;
}

.sync-task-row-action {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--px-text-faint);
    display: inline-flex;
    height: 1.85rem;
    justify-content: center;
    text-decoration: none;
    transition: background .15s ease, color .15s ease;
    width: 1.85rem;
}

.sync-task-row-action svg {
    height: 1rem;
    width: 1rem;
}

.sync-task-row-action:hover {
    background: var(--px-surface-subtle);
    color: var(--px-text-secondary);
}

.sync-task-row-action--delete:hover:not(:disabled) {
    background: var(--px-danger-surface);
    color: var(--px-danger-text-strong);
}

.sync-task-row-action:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.action-toolbar {
    align-items: center;
    background: var(--px-surface-subtle);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-md);
    display: inline-flex;
    gap: 2px;
    padding: 2px;
}

.action-toolbar .action-btn {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--px-text-muted);
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    text-decoration: none;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
    width: 2rem;
}

.action-toolbar .action-btn svg {
    height: 1rem;
    width: 1rem;
}

.action-toolbar .action-btn:hover {
    background: var(--px-surface);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.action-toolbar .action-btn--browse:hover {
    color: var(--px-accent);
}

.action-toolbar .action-btn--edit:hover {
    color: var(--px-text-secondary);
}

.action-toolbar .action-btn--delete:hover:not(:disabled) {
    background: var(--px-danger-surface);
    color: var(--px-danger-text-strong);
}

.action-toolbar .action-btn:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.action-toolbar form {
    display: inline-flex;
    margin: 0;
}

.action-toolbar .action-btn--validate:hover {
    color: var(--px-accent);
}

.action-toolbar .action-btn--revalidate:hover {
    color: var(--px-success-text-strong);
}

.connection-list-panel {
    overflow-x: auto;
}

.connection-list-table {
    --connection-grid: minmax(11rem, 1.35fr) minmax(8rem, .9fr) minmax(10rem, 1.1fr) minmax(9rem, 1fr) 5.5rem 6.75rem;
    --connection-grid-gap: .75rem;
    column-gap: var(--connection-grid-gap);
    display: grid;
    grid-template-columns: var(--connection-grid);
    min-width: 48rem;
}

.connection-list-header,
.connection-list-root,
.connection-list-item,
.connection-list-row {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: subgrid;
}

.connection-list-header,
.connection-list-row {
    align-items: center;
    column-gap: var(--connection-grid-gap);
}

.connection-list-header {
    border-bottom: 1px solid var(--px-border);
    color: var(--px-text-muted);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .02em;
    margin-bottom: .35rem;
    padding: 0 .25rem .65rem;
    text-transform: uppercase;
}

.connection-list-root {
    list-style: none;
    margin: 0;
    padding: 0;
}

.connection-list-item {
    margin: 0;
}

.connection-list-row {
    border-radius: var(--px-radius-md);
    margin: .15rem 0;
    min-height: 2.75rem;
    padding: .35rem .25rem;
    transition: background-color .15s ease;
}

.connection-list-row:hover {
    background: var(--px-surface-subtle);
}

.connection-list-label {
    align-items: center;
    display: flex;
    gap: .4rem;
    min-width: 0;
}

.connection-list-icon {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    height: 1.125rem;
    justify-content: center;
    width: 1.125rem;
}

.connection-list-icon .sync-task-ui-icon {
    height: 1.125rem;
    width: 1.125rem;
}

.connection-list-col {
    min-width: 0;
    text-align: left;
}

.connection-list-col-url,
.connection-list-col-credentials {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.connection-list-header .connection-list-col-status,
.connection-list-col-status {
    align-items: center;
    display: flex;
    justify-content: center;
    text-align: center;
}

.connection-list-col-actions {
    display: flex;
    justify-content: flex-end;
}

.connection-list-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .connection-list-table {
        column-gap: 0;
        display: block;
    }

    .connection-list-header {
        display: none;
    }

    .connection-list-root,
    .connection-list-item,
    .connection-list-row {
        display: block;
        grid-column: auto;
        grid-template-columns: none;
    }

    .connection-list-row {
        display: grid;
        grid-template-columns: 1fr;
        row-gap: .35rem;
    }

    .connection-list-col-system,
    .connection-list-col-url,
    .connection-list-col-credentials,
    .connection-list-col-status {
        grid-column: 1;
    }

    .connection-list-col-actions {
        grid-column: 1;
        justify-content: flex-start;
    }
}

.entity-browse-list-panel {
    overflow-x: auto;
}

.entity-browse-list-panel .entity-browse-list-header {
    background: var(--px-surface);
    position: sticky;
    top: 0;
    z-index: 2;
}

.entity-matching .entity-browse-list-table {
    --entity-browse-grid: minmax(5rem, .9fr) minmax(8rem, 1.4fr) 7.25rem minmax(5.5rem, 6.5rem);
    min-width: 28rem;
}

.entity-matching {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    margin-bottom: 0;
    min-height: 0;
    overflow: hidden;
}

.page-title:has(+ .entity-matching) {
    flex-shrink: 0;
    margin-bottom: .75rem;
}

.entity-matching > .entity-browser-toolbar-wrap,
.entity-matching > .px-list-state {
    flex-shrink: 0;
}

.entity-matching-columns {
    align-items: stretch;
    display: grid;
    flex: 1 1 auto;
    gap: 0;
    grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
    min-height: 0;
}

.entity-matching-divider {
    background: var(--px-border);
    cursor: col-resize;
    position: relative;
    touch-action: none;
}

.entity-matching-divider::before {
    content: "";
    inset: 0 -4px;
    position: absolute;
}

.entity-matching-columns.is-resizing .entity-matching-divider,
.entity-matching-divider:hover {
    background: var(--px-accent-border);
}

body.entity-matching-resizing {
    cursor: col-resize;
    user-select: none;
}

.entity-matching-connection-logo {
    flex: 0 0 auto;
    height: 1.1rem;
    object-fit: contain;
    width: 1.1rem;
}

.entity-matching-pane-settings-summary {
    align-items: center;
    display: inline-flex;
    gap: .4rem;
    min-width: 0;
}

.entity-matching-pane {
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    padding: 0 var(--px-space-4);
}

.entity-matching-pane:first-child {
    padding-left: 0;
}

.entity-matching-pane:last-child {
    padding-right: 0;
}

.entity-matching-pane-head {
    align-items: baseline;
    cursor: pointer;
    display: flex;
    gap: var(--px-space-3);
    list-style: none;
}

.entity-matching-pane-head::-webkit-details-marker {
    display: none;
}

.entity-matching-pane-title {
    font-size: 1rem;
    margin: 0;
}

.entity-matching-pane-title::before {
    content: "";
    display: inline-block;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid currentColor;
    margin-right: .4rem;
    transform: rotate(-90deg);
    vertical-align: middle;
}

.entity-matching-pane-settings[open] .entity-matching-pane-title::before {
    transform: none;
}

.entity-matching-pane-settings[open] [data-matching-settings-summary] {
    display: none;
}

.entity-matching-pane-head .entity-browser-counter {
    margin-left: auto;
}

.entity-matching-pane-settings {
    flex-shrink: 0;
    margin-bottom: var(--px-space-2);
}

.entity-matching-pane-settings-summary {
    font-size: .875rem;
    font-weight: 400;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.entity-matching-pane-route {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: var(--px-space-3);
    margin-bottom: var(--px-space-2);
}

.entity-matching-pane-query-editor {
    margin-top: var(--px-space-3);
    min-width: 0;
}

.entity-matching-pane-query-editor .form-grid {
    grid-template-columns: 1fr;
}

.entity-matching-pane-route .entity-browser-toolbar-group {
    flex: 1 1 10rem;
    min-width: 0;
}

.entity-matching-pane .entity-browser-list-meta {
    flex-shrink: 0;
}

.entity-matching-pane .entity-browser-results {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.entity-matching-pane .entity-browse-list-panel {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.entity-matching-pane .entity-browser-toolbar-row-secondary {
    align-items: center;
    margin-bottom: var(--px-space-3);
}

.entity-matching-pane .entity-browse-list-row {
    cursor: pointer;
}

.entity-matching-pane .entity-browse-list-row.is-selected {
    background: var(--px-accent-subtle);
    box-shadow: inset 3px 0 0 var(--px-accent);
}

.entity-matching-pane .entity-browse-list-row.is-peer {
    background: var(--px-surface-muted);
}

.entity-matching-row-actions {
    align-items: center;
    display: inline-flex;
    gap: .15rem;
}

.entity-matching-row-action {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--px-accent);
    display: inline-flex;
    height: 1.5rem;
    justify-content: center;
    padding: 0;
    width: 1.5rem;
}

.entity-matching-row-action:disabled {
    color: var(--px-text-muted);
    opacity: .4;
}

.entity-matching-row-action-icon {
    height: 1rem;
    width: 1rem;
}

.entity-matching-auto-link-banner {
    align-items: center;
    display: flex;
    gap: var(--px-space-3);
    justify-content: space-between;
    margin: 0 0 var(--px-space-3);
}

.entity-matching-auto-link-banner-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--px-space-2);
    min-width: 0;
}

.entity-matching-auto-link-banner .sync-task-progress {
    margin-top: 0;
    max-width: 24rem;
}

.entity-matching-auto-link-row {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    white-space: nowrap;
}

.entity-matching-pane.is-auto-link-aligned [data-sort],
.entity-matching-pane.is-auto-link-aligned [data-browse-filters-toggle] {
    pointer-events: none;
}

.entity-matching-pane.is-auto-link-aligned .entity-browser-pager-cluster {
    visibility: hidden;
}

.entity-matching-pinned {
    background: var(--px-accent-subtle);
    border: 1px solid var(--px-accent-border);
    border-radius: var(--px-radius-md);
    margin-bottom: var(--px-space-3);
    padding: var(--px-space-3);
}

.entity-matching-pinned-title {
    font-weight: 600;
}

.entity-matching-pinned-detail {
    color: var(--px-text-secondary);
    margin-top: var(--px-space-1);
}

.entity-matching-actions {
    display: flex;
    gap: var(--px-space-2);
    margin-top: var(--px-space-4);
}

@media (max-width: 1200px) {
    .entity-matching {
        overflow: auto;
    }

    .entity-matching-columns {
        grid-template-columns: minmax(0, 1fr);
        height: auto;
    }

    .entity-matching-pane .entity-browse-list-panel {
        max-height: 70vh;
    }

    .entity-matching-divider {
        cursor: default;
        height: 1px;
        margin: var(--px-space-4) 0;
        width: 100%;
    }

    .entity-matching-pane,
    .entity-matching-pane:first-child,
    .entity-matching-pane:last-child {
        padding: 0;
    }
}

.entity-matching .entity-browser-toolbar-row-primary {
    align-items: flex-end;
}

.entity-matching-toolbar-route {
    align-items: flex-end;
    display: flex;
    flex: 1 1 24rem;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    min-width: 0;
}

.entity-matching-toolbar-route .entity-browser-toolbar-group {
    flex: 1 1 10rem;
    max-width: 14rem;
    min-width: 10rem;
}

.entity-matching-toolbar-load {
    flex-shrink: 0;
}

.entity-browse-list-table {
    --entity-browse-grid: 2.5rem minmax(6rem, .8fr) minmax(10rem, 1.4fr) minmax(12rem, 14rem) 7.25rem minmax(5.5rem, 6.5rem) minmax(5.5rem, 6.5rem) 7.25rem minmax(8rem, 1fr);
    --entity-browse-grid-gap: .75rem;
    column-gap: var(--entity-browse-grid-gap);
    display: grid;
    grid-template-columns: var(--entity-browse-grid);
    min-width: 56rem;
}

.entity-browse-list-header,
.entity-browse-list-root,
.entity-browse-list-item,
.entity-browse-list-row {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: subgrid;
}

.entity-browse-list-header,
.entity-browse-list-row {
    align-items: center;
    column-gap: var(--entity-browse-grid-gap);
}

.entity-browse-list-header {
    align-items: end;
    border-bottom: 1px solid var(--px-border);
    color: var(--px-text-muted);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .02em;
    margin-bottom: .35rem;
    min-height: 2rem;
    padding: 0 .25rem .65rem;
    text-transform: uppercase;
}

.entity-browse-list-header > .entity-browse-list-col {
    align-items: center;
    display: flex;
    line-height: 1.2;
    min-width: 0;
    overflow: hidden;
    position: relative;
}

.entity-browse-col-header-content {
    align-items: center;
    display: inline-flex;
    gap: .35rem;
    max-width: calc(100% - 10px);
    min-width: 0;
}

.entity-browse-col-drag-handle {
    color: var(--px-text-faint);
    cursor: grab;
    flex-shrink: 0;
    font-size: .72rem;
    letter-spacing: -.08em;
    line-height: 1;
    padding: 0 .1rem;
    user-select: none;
}

.entity-browse-col-drag-handle::before {
    content: "⋮⋮";
    display: block;
}

.entity-browse-col-drag-handle:active {
    cursor: grabbing;
}

.entity-browse-list-col.is-dragging {
    opacity: .55;
}

.entity-browse-list-col.is-drag-over {
    box-shadow: inset 0 -2px 0 var(--px-primary, #2563eb);
}

.entity-browse-header--dragging .entity-browse-list-col:not(.is-dragging) {
    transition: box-shadow .12s ease;
}

.entity-browse-col-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.entity-browse-col-sortable {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    gap: .2rem;
    max-width: 100%;
    min-width: 0;
    user-select: none;
    white-space: nowrap;
}

.entity-browse-col-sortable .entity-browse-col-label {
    flex: 0 1 auto;
}

.entity-browse-col-resize-handle {
    bottom: 0;
    cursor: col-resize;
    position: absolute;
    right: -4px;
    top: 0;
    width: 10px;
    z-index: 3;
}

.entity-browse-list-header > .entity-browse-list-col:hover .entity-browse-col-resize-handle,
.entity-browse-list-col.is-resizing .entity-browse-col-resize-handle {
    background: rgba(37, 99, 235, .18);
}

body.entity-browse-col-resizing {
    cursor: col-resize;
    user-select: none;
}

.entity-browser-column-toggle {
    cursor: pointer;
}

[data-browse-columns-menu] {
    max-height: min(24rem, 70vh);
    overflow-y: auto;
}

.entity-browse-filters-menu {
    min-width: min(36rem, calc(100vw - 2rem));
    padding: var(--px-space-4);
}

.entity-browse-filters-header {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: space-between;
    margin-bottom: var(--px-space-3);
}

.entity-browse-filters-title {
    color: var(--px-text-strong);
    font-size: .9rem;
    font-weight: 600;
    margin: 0;
}

.entity-browse-filters-rules {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-bottom: var(--px-space-3);
    max-height: 18rem;
    overflow: auto;
}

.entity-browse-filters-rule {
    align-items: center;
    display: grid;
    gap: .35rem;
    grid-template-columns: minmax(7rem, 1.2fr) minmax(6rem, 1fr) minmax(7rem, 1.2fr) auto;
}

.entity-browse-filters-rule .form-select,
.entity-browse-filters-rule .form-control {
    font-size: .85rem;
    min-width: 0;
}

.entity-browse-filters-rule-remove {
    color: var(--px-text-muted);
    line-height: 1;
    padding: .2rem .35rem;
}

.entity-browse-filters-rule-remove:hover {
    color: var(--px-danger-emphasis);
}

.entity-browse-filters-footer {
    align-items: center;
    display: flex;
    gap: .5rem;
    justify-content: space-between;
}

.entity-browse-filters-empty {
    color: var(--px-text-muted);
    font-size: .85rem;
    margin: 0 0 var(--px-space-3);
}

.entity-browse-filters-toggle {
    position: relative;
}

.entity-browse-toolbar-icon {
    flex-shrink: 0;
    height: 1rem;
    width: 1rem;
}

.entity-browse-filters-badge {
    align-items: center;
    background: var(--px-accent);
    border-radius: 50%;
    color: var(--px-surface);
    display: inline-flex;
    font-size: .65rem;
    font-weight: 600;
    height: 1.1rem;
    justify-content: center;
    line-height: 1;
    min-width: 1.1rem;
    padding: 0 .2rem;
    position: absolute;
    right: -.4rem;
    top: -.4rem;
}

.entity-browse-filters-value-combobox {
    position: relative;
}

.entity-browse-filters-suggestions {
    background: var(--px-surface, #fff);
    border: 1px solid var(--px-border, #dee2e6);
    border-radius: .25rem;
    box-shadow: 0 .25rem .5rem rgba(0, 0, 0, .08);
    left: 0;
    list-style: none;
    margin: 0;
    max-height: 12rem;
    overflow-y: auto;
    padding: .25rem 0;
    position: fixed;
    right: auto;
    top: 0;
    z-index: 2000;
}

.entity-browse-filters-suggestion {
    cursor: pointer;
    font-size: .875rem;
    overflow: hidden;
    padding: .25rem .5rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.entity-browse-filters-suggestion:hover,
.entity-browse-filters-suggestion:focus {
    background: var(--px-surface-muted, #f8f9fa);
}

.entity-browse-list-col-wrapper {
    white-space: nowrap;
}

.entity-browse-list-header .entity-browse-col-sortable.sortable::after {
    color: var(--px-text-faint);
    content: "↕";
    flex-shrink: 0;
    font-size: .7rem;
    line-height: 1;
}

.entity-browse-list-header .entity-browse-col-sortable.sortable.sort-asc::after {
    color: var(--px-text-body);
    content: "↑";
}

.entity-browse-list-header .entity-browse-col-sortable.sortable.sort-desc::after {
    color: var(--px-text-body);
    content: "↓";
}

.entity-browse-list-root {
    list-style: none;
    margin: 0;
    padding: 0;
}

.entity-browse-list-item {
    margin: 0;
}

.entity-browse-list-row {
    border-radius: var(--px-radius-md);
    cursor: pointer;
    margin: .15rem 0;
    min-height: 2.75rem;
    padding: .35rem .25rem;
    transition: background-color .15s ease;
}

.entity-browse-list-row:hover {
    background: var(--px-surface-subtle);
}

.entity-browse-list-row.entity-row-active {
    background: var(--px-accent-subtle);
}

.entity-browse-list-row.entity-row-selected {
    background: var(--px-accent-subtle);
}

.entity-browse-list-row.entity-row-precondition-excluded {
    opacity: .72;
}

.entity-browse-list-col {
    align-items: center;
    display: flex;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.entity-browse-list-col-select {
    display: flex;
    justify-content: center;
}

.entity-browse-list-header .entity-browse-list-col-id,
.entity-browse-list-header .entity-browse-list-col-name,
.entity-browse-list-col-id,
.entity-browse-list-col-name {
    justify-content: flex-start;
    text-align: left;
}

.entity-browse-list-header .entity-browse-list-col-modified,
.entity-browse-list-header .entity-browse-list-col-last-synced,
.entity-browse-list-col-modified,
.entity-browse-list-col-last-synced {
    justify-content: center;
    text-align: center;
}

.entity-browse-list-header .entity-browse-list-col-status,
.entity-browse-list-col-status {
    justify-content: center;
    text-align: center;
}

.entity-browse-list-header .entity-browse-list-col-sync,
.entity-browse-list-col-sync {
    justify-content: center;
    text-align: center;
}

.entity-browse-datetime {
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: .78rem;
    gap: .1rem;
    justify-self: start;
    line-height: 1.2;
    width: fit-content;
}

time.entity-browse-datetime[data-time-style="precise"] {
    display: inline;
    font-size: inherit;
}

.entity-browse-datetime-centered {
    align-items: center;
    text-align: center;
}

.entity-browse-datetime-time {
    font-size: .7rem;
}

.entity-browse-list-header .entity-browse-list-col-error,
.entity-browse-list-col-error {
    font-size: .85rem;
    justify-content: center;
    text-align: center;
}

.entity-browse-error-link {
    color: var(--px-danger-text-strong);
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-decoration: underline;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.entity-browse-error-link:hover {
    color: var(--px-danger-text);
}

.entity-browse-list-col-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    justify-content: flex-end;
    overflow: visible;
}

.entity-browse-action-group {
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    gap: .35rem;
    justify-content: flex-end;
}

.entity-browse-list-header .entity-browse-list-col-actions {
    justify-content: center;
    text-align: center;
}

.entity-browse-list-header .entity-browse-list-col-actions .entity-browse-col-header-content {
    justify-content: center;
}

.entity-browse-action-btn {
    align-items: center;
    display: inline-flex;
    gap: .3rem;
    white-space: nowrap;
}

.entity-browse-action-btn-update {
    border-color: var(--px-warning-border-strong);
    color: var(--px-warning-text-dark);
}

.entity-browse-action-btn-update:hover,
.entity-browse-action-btn-update:focus-visible {
    background-color: var(--px-warning-surface);
    border-color: var(--px-warning-border-strong);
    color: var(--px-warning-text);
}

.entity-browse-action-btn-update:active,
.entity-browse-action-btn-update.active {
    background-color: var(--px-warning-bg);
    border-color: var(--px-warning-border-strong);
    color: var(--px-warning-text);
}

.entity-browse-action-icon {
    flex-shrink: 0;
}

.entity-browse-action-btn.is-syncing,
[data-sync-selected].is-syncing {
    gap: .35rem;
}

.entity-browser-precondition-toggle {
    cursor: pointer;
}

@media (max-width: 991.98px) {
    .entity-browse-list-table {
        column-gap: 0;
        display: block;
        min-width: 0;
    }

    .entity-browse-list-header {
        display: none;
    }

    .entity-browse-list-root,
    .entity-browse-list-item,
    .entity-browse-list-row {
        display: block;
        grid-column: auto;
        grid-template-columns: none;
    }

    .entity-browse-list-row {
        display: grid;
        grid-template-columns: 1fr;
        row-gap: .35rem;
    }

    .entity-browse-list-col-actions {
        justify-content: flex-start;
    }
}

/* Theme toggle */
.theme-toggle-btn {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    padding: .35rem .5rem;
}

.theme-toggle-icon {
    display: none;
    line-height: 0;
}

[data-bs-theme="light"] .theme-toggle-icon--dark,
[data-bs-theme="dark"] .theme-toggle-icon--light {
    display: inline-flex;
}

/* User menu */
.user-menu-shell {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    min-width: 0;
}

.user-menu-clock {
    color: var(--px-text-secondary);
    font-size: .9rem;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    white-space: nowrap;
}

.user-menu-clock [data-user-clock-time] {
    color: var(--px-text);
}

.user-menu-company {
    color: var(--px-text-heading);
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    max-width: 12rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-menu-company-form {
    display: inline-flex;
    max-width: 14rem;
    min-width: 0;
}

.user-menu-org {
    max-width: 14rem;
    min-width: 0;
}

.user-menu-org-form {
    margin: 0;
}

.user-menu-org-form .dropdown-item {
    width: 100%;
}

.user-menu-company-select {
    background-color: transparent;
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-sm);
    color: var(--px-text-heading);
    font-size: 0.9rem;
    font-weight: 600;
    max-width: 14rem;
    min-width: 0;
    padding: 0.25rem 1.75rem 0.25rem 0.5rem;
}

.user-menu {
    position: relative;
}

.user-menu-btn {
    align-items: center;
    background: transparent;
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-sm);
    color: var(--px-text-secondary);
    display: inline-flex;
    gap: 0.5rem;
    padding: 0.35rem 0.65rem;
}

.user-menu-btn:hover,
.user-menu-btn:focus-visible,
.user-menu-btn.show {
    background: var(--px-surface-muted);
    border-color: var(--px-border-muted);
    color: var(--px-text);
}

.user-menu-avatar {
    align-items: center;
    color: var(--px-text-muted);
    display: inline-flex;
    line-height: 0;
}

.user-menu-text {
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
    line-height: 1.15;
    max-width: 14rem;
    min-width: 0;
    text-align: left;
}

.user-menu-name {
    font-size: 0.9rem;
    font-weight: 500;
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-menu-sub {
    color: var(--px-text-muted);
    font-size: 0.75rem;
    font-weight: 400;
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-menu-meta-company {
    color: var(--px-text);
    font-size: 0.9rem;
    font-weight: 600;
}

.user-menu-meta-user {
    color: var(--px-text-muted);
    font-size: 0.8rem;
}

.user-menu-dropdown {
    min-width: 14rem;
}

.user-menu-dropdown .dropdown-item.active {
    background: var(--px-accent-subtle);
    color: var(--px-accent-emphasis);
}

.user-menu-logout-form {
    margin: 0;
}

.user-menu-logout-form .dropdown-item {
    width: 100%;
}

/* Account pages */
.account-page-grid {
    display: grid;
    gap: var(--px-space-4);
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-profile {
    margin: 0 auto;
    max-width: 760px;
}

.account-settings {
    display: flex;
    flex-direction: column;
    gap: var(--px-space-4);
    max-width: 760px;
}

.account-settings-form {
    display: flex;
    flex-direction: column;
    gap: var(--px-space-4);
}

.account-settings-section {
    display: flex;
    flex-direction: column;
    gap: var(--px-space-4);
    margin-bottom: 0;
    overflow: hidden;
    padding: 0 1.25rem 1.1rem;
    scroll-margin-top: calc(var(--app-header-height) + var(--px-space-4));
}

.account-settings-section > .field-group-title {
    margin-bottom: 0;
}

.account-settings-section > .text-muted,
.account-settings-field .text-muted,
.account-settings-reset .text-muted,
.account-settings-landing .text-muted {
    margin-bottom: 0;
}

.account-settings-field {
    display: flex;
    flex-direction: column;
    gap: var(--px-space-2);
}

.account-settings-field .form-label {
    margin-bottom: 0;
}

.account-settings-reset {
    align-items: flex-start;
    border-top: 1px solid var(--px-border-subtle);
    display: flex;
    flex-direction: column;
    gap: var(--px-space-3);
    padding-top: var(--px-space-4);
}

.account-settings-landing {
    border: 0;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    margin: 0;
    min-width: 0;
    padding: 0;
}

.account-settings-landing legend {
    color: var(--px-text);
    float: none;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    margin: 0;
    padding: 0;
    width: auto;
}

.account-settings-landing .form-check {
    margin: 0;
    min-height: 0;
}

.account-settings-scheduler.form-check {
    align-items: center;
    display: inline-flex;
    gap: .65rem;
    margin: 0;
    min-height: 0;
    padding-left: 0;
}

.account-settings-scheduler .form-check-input {
    cursor: pointer;
    float: none;
    height: 1.35rem;
    margin: 0;
    width: 2.5rem;
}

.account-settings-scheduler .form-check-label {
    cursor: pointer;
    margin: 0;
}

.account-settings-actions {
    display: flex;
    justify-content: flex-end;
}

.settings-theme-segmented {
    background: var(--px-surface-muted);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    display: inline-flex;
    gap: .2rem;
    max-width: 100%;
    padding: .2rem;
    width: fit-content;
}

.settings-theme-segment {
    cursor: pointer;
    margin: 0;
    position: relative;
    user-select: none;
}

.settings-theme-segment input {
    opacity: 0;
    pointer-events: none;
    position: absolute;
}

.settings-theme-segment span {
    border-radius: calc(var(--px-radius-sm) - 2px);
    color: var(--px-text-secondary);
    display: inline-flex;
    font-size: .86rem;
    font-weight: 600;
    justify-content: center;
    line-height: 1;
    min-width: 5.5rem;
    padding: .5rem 1rem;
    text-align: center;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.settings-theme-segment:has(input:checked) span {
    background: var(--px-surface);
    box-shadow: var(--px-shadow-panel);
    color: var(--px-text-heading);
}

.settings-theme-segment:has(input:focus-visible) span {
    outline: 2px solid var(--px-accent);
    outline-offset: 2px;
}

.account-profile-tabs {
    border-bottom: 1px solid var(--px-border);
    gap: var(--px-space-1);
    margin-bottom: 0;
}

.account-profile-tabs .nav-link {
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--px-text-secondary);
    font-weight: 600;
    margin-bottom: -1px;
    padding: var(--px-space-3) var(--px-space-4);
}

.account-profile-tabs .nav-link:hover {
    border-color: transparent;
    color: var(--px-text-strong);
}

.account-profile-tabs .nav-link.active {
    background: transparent;
    border-bottom-color: var(--px-accent);
    color: var(--px-text-strong);
}

.account-profile-tab-content {
    margin-top: var(--px-space-4);
}

.account-profile-panel {
    margin-bottom: 0;
}

.account-profile-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-details--inline {
    border-top: 1px solid var(--px-border-subtle);
    padding-top: var(--px-space-4);
}

.account-details {
    display: grid;
    gap: 0.85rem;
    margin: 0;
}

.account-details-row {
    display: grid;
    gap: 0.2rem;
}

.account-details-row dt {
    color: var(--px-text-muted);
    font-size: 0.8rem;
    font-weight: 600;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.account-details-row dd {
    margin: 0;
}

.account-details-row--meta dd {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.8rem;
}

.account-code {
    background: var(--px-surface-code);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    color: var(--px-text-body);
    font-size: 0.9rem;
    padding: 0.15rem 0.4rem;
}

.account-password-fields {
    display: grid;
    gap: var(--px-space-4);
    grid-template-columns: minmax(0, 1fr);
    max-width: 28rem;
}

.account-password-fields label {
    font-weight: 600;
    margin-bottom: 0.35rem;
    margin-top: 0;
}

.account-password-form .form-grid {
    display: grid;
    gap: 1rem;
}

@media (max-width: 991.98px) {
    .account-page-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .account-profile-form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .user-menu-shell {
        width: 100%;
    }

    .user-menu {
        width: 100%;
    }

    .user-menu-btn {
        justify-content: space-between;
        width: 100%;
    }
}

/* Block 2.4 — key screens */

.badge.px-task-active {
    background: var(--px-success-bg);
    color: var(--px-success-text);
}

.badge.px-task-inactive {
    background: var(--px-surface-muted);
    color: var(--px-text-muted);
}

.badge.px-task-scheduled {
    background: transparent;
    border: 1px solid var(--px-border-subtle);
    color: var(--px-text-secondary);
    font-weight: 500;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.badge.px-task-scheduler-off {
    background: var(--px-danger-bg);
    color: var(--px-danger-text);
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .01em;
}

.sync-task-tree-badges {
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    gap: var(--px-space-1);
}

.sync-task-tree-item--inactive > .sync-task-tree-row {
    opacity: .72;
}

.sync-task-tree-name-link {
    color: inherit;
    font-weight: 600;
    text-decoration: none;
}

.sync-task-tree-name-link:hover,
.sync-task-tree-name-link:focus-visible {
    color: var(--px-accent-emphasis);
    text-decoration: underline;
}

.sync-task-toggle-icon.is-off {
    opacity: .45;
}

.badge.run-item-succeeded {
    background: var(--px-success-bg);
    color: var(--px-success-text);
}

.badge.run-item-failed {
    background: var(--px-danger-bg);
    color: var(--px-danger-text);
}

.badge.run-item-skipped {
    background: var(--px-surface-muted);
    color: var(--px-text-secondary);
}

.badge.run-item-creating,
.badge.run-item-updating,
.badge.run-item-progress {
    background: var(--px-accent-soft);
    color: var(--px-accent-strong);
}

.badge.run-log-debug {
    background: var(--px-surface-code);
    color: var(--px-text-muted);
}

.badge.run-log-info {
    background: var(--px-surface-muted);
    color: var(--px-text-secondary);
}

.badge.run-log-warning {
    background: var(--px-warning-bg);
    color: var(--px-warning-text);
}

.badge.run-log-error {
    background: var(--px-danger-bg);
    color: var(--px-danger-text);
}

tr.run-log-row--follow-up {
    background: var(--px-info-bg);
}

tr.run-log-row--follow-up td {
    box-shadow: inset 3px 0 0 var(--px-accent);
}

.badge.run-log-follow-up {
    background: var(--px-accent-soft);
    color: var(--px-accent-strong);
}

.run-log-follow-up-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--px-space-2);
    margin-bottom: var(--px-space-1);
}

.run-log-follow-up-link {
    font-size: .8125rem;
}

.run-details-tree-actions {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: .15rem;
}

.run-details-tree-btn {
    color: var(--px-text-secondary);
    padding: .15rem .35rem;
    text-decoration: none;
}

.run-details-tree-btn:hover,
.run-details-tree-btn:focus-visible {
    color: var(--px-accent-emphasis);
}

.run-details-logs-table tr.d-none,
.run-details-logs-table tr[hidden] {
    display: none !important;
}

.run-log-line {
    align-items: flex-start;
    display: flex;
    gap: .45rem;
    min-width: 0;
    padding-left: calc(var(--run-log-depth, 0) * 1.35rem);
    position: relative;
}

.run-details-logs-table td.run-log-severity-cell,
.run-details-items-table td.run-item-status-cell {
    overflow: hidden;
    vertical-align: top;
    white-space: nowrap;
}

.run-details-logs-table thead th[data-col-key="message"] {
    text-align: center;
}

.run-details-logs-table .run-log-select-col {
    width: 2.25rem;
}

.run-details-logs-table .run-log-select-cell {
    text-align: center;
    vertical-align: top;
}

.run-details-logs-table td.run-log-subject-cell {
    overflow: hidden;
    vertical-align: middle;
    white-space: normal;
}

.run-log-subject {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: .4rem;
    min-width: 0;
    padding-top: .12rem;
}

.run-log-subject .run-details-message {
    flex: 1 1 auto;
    min-width: 0;
}

.run-log-tree-toggle,
.run-log-tree-spacer {
    flex: 0 0 2.65rem;
    width: 2.65rem;
}

.run-log-tree-toggle {
    align-items: center;
    background: var(--px-surface);
    border: 1px solid var(--px-border-tree);
    border-radius: var(--px-radius-sm);
    color: var(--px-text-secondary);
    display: inline-flex;
    gap: .2rem;
    height: 1.45rem;
    justify-content: center;
    margin-top: .05rem;
    padding: 0 .25rem;
}

.run-log-tree-toggle:hover {
    background: var(--px-surface-tree-hover);
    color: var(--px-text);
}

.run-log-tree-toggle-icon {
    border-color: transparent transparent transparent currentColor;
    border-style: solid;
    border-width: .28rem 0 .28rem .4rem;
    display: inline-block;
    height: 0;
    width: 0;
}

.run-log-row--group.is-collapsed .run-log-tree-toggle-icon,
.run-log-tree-toggle[aria-expanded="false"] .run-log-tree-toggle-icon {
    transform: none;
}

.run-log-tree-toggle[aria-expanded="true"] .run-log-tree-toggle-icon {
    transform: rotate(90deg);
}

.run-log-tree-count {
    font-size: .7rem;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.run-log-subject-title {
    color: var(--px-text-heading);
    font-weight: 600;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

.run-log-row--group {
    cursor: pointer;
}

.run-log-row--group td {
    background: var(--px-surface-tree-header);
}

.run-log-row--group:not(.is-collapsed) td {
    border-top: 1px solid var(--px-border-tree);
}

.run-log-row--nested:not(.run-log-row--group) td {
    background: var(--px-surface-tree-child);
}

.run-log-row--nested .run-log-line::before {
    background: var(--px-border-tree);
    bottom: -.45rem;
    content: "";
    left: calc((var(--run-log-depth, 1) - 1) * 1.35rem + .7rem);
    position: absolute;
    top: -.45rem;
    width: 2px;
}

.run-log-row--tree-end td {
    border-bottom: 2px solid var(--px-border-tree);
}

.run-log-row--tree-end .run-log-line::before {
    bottom: .2rem;
}

.run-log-row--has-error td.run-log-severity-cell,
.run-item-row--failed td.run-item-status-cell {
    box-shadow: inset 3px 0 0 var(--px-danger-text);
}

.run-log-row--has-warning:not(.run-log-row--has-error) td.run-log-severity-cell {
    box-shadow: inset 3px 0 0 var(--px-warning-text);
}

.run-log-row--has-error .run-log-subject-title,
.run-log-row--has-error .run-details-message {
    color: var(--px-danger-text);
}

.run-log-row--has-warning:not(.run-log-row--has-error) .run-log-subject-title,
.run-log-row--has-warning:not(.run-log-row--has-error) .run-details-message {
    color: var(--px-warning-text-dark);
}

.run-log-row--debug .run-log-subject-title,
.run-log-row--debug .run-details-message {
    color: var(--px-text-muted);
}

.page-title:has(+ .run-details-summary) {
    margin-bottom: .75rem;
}

.page-title:has(+ .run-details-summary) .text-muted {
    margin-bottom: 0;
}

body:has(.run-details-page) {
    height: 100%;
    overflow: hidden;
}

body:has(.run-details-page) .app-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 0;
}

body:has(.run-details-page) .app-content > main {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding-bottom: .75rem;
}

body:has(.run-details-page) .app-breadcrumb,
body:has(.run-details-page) .app-footer {
    flex-shrink: 0;
}

.run-details-page {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: .75rem;
    min-height: 0;
}

.run-details-page .page-title {
    flex-shrink: 0;
    margin-bottom: 0;
}

/* Out of layout but still in the DOM, so keyboard focus brings it back. */
.px-scroll-collapsed [data-scroll-collapse-target]:not(:focus-within) {
    border: 0;
    clip-path: inset(50%);
    height: 1px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.run-details-summary {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-shrink: 0;
    flex-wrap: wrap;
    gap: var(--px-space-3);
    justify-content: space-between;
    margin-bottom: 0;
}

.run-details-summary-actions {
    align-items: center;
    align-self: center;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: flex-end;
    margin-left: auto;
}

.run-details-tabs {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.run-details-tablist {
    border-bottom: 1px solid var(--px-border);
    flex-shrink: 0;
    gap: .25rem;
    margin-bottom: 0;
}

.run-details-tablist .nav-link {
    border-color: transparent;
    color: var(--px-text-secondary);
    font-size: .875rem;
    margin-bottom: -1px;
}

.run-details-tablist .nav-link:hover,
.run-details-tablist .nav-link:focus-visible {
    border-color: transparent;
    color: var(--px-accent);
}

.run-details-tablist .nav-link.active {
    background: var(--px-surface);
    border-color: var(--px-border) var(--px-border) var(--px-surface);
    color: var(--px-text-heading);
}

.run-details-tab-panels {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.run-details-tab-panels > .run-details-panel {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    margin-bottom: 0;
    min-height: 0;
    overflow: hidden;
    position: relative;
}

.run-details-tab-panels > .run-details-panel[hidden] {
    display: none !important;
}

.run-details-tab-panels .run-details-section-head,
.run-details-tab-panels > .run-details-panel > .panel-title-bar {
    flex-shrink: 0;
    margin-bottom: var(--px-space-3);
}

.run-details-tab-panels .run-details-panel .table-responsive {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.run-details-tab-panels .run-details-table--fixed thead th {
    background: var(--px-surface);
    position: sticky;
    top: 0;
    z-index: 1;
}

.run-details-panel.is-loading {
    pointer-events: none;
}

.run-details-panel.is-loading > :not(.run-details-loading) {
    opacity: .55;
}

.run-details-loading {
    align-items: center;
    background: color-mix(in srgb, var(--px-surface) 92%, transparent);
    color: var(--px-text-muted);
    display: none;
    gap: .5rem;
    inset: 0;
    justify-content: center;
    position: absolute;
    z-index: 4;
}

.run-details-panel.is-loading .run-details-loading {
    display: flex;
}

.run-details-summary .metric-grid {
    gap: .5rem;
    margin-bottom: 0;
}

.run-details-metrics {
    display: grid;
    flex: 1 1 32rem;
    gap: .5rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin: 0;
    min-width: min(100%, 20rem);
}

.run-details-metrics .metric {
    min-width: 0;
    padding: .35rem .6rem;
}

.run-details-metrics .metric span {
    font-size: .72rem;
}

.run-details-metrics .metric strong {
    font-size: 1.05rem;
    line-height: 1.2;
    margin-top: 0;
}

.run-details-summary-actions form {
    display: inline-flex;
    margin: 0;
}

.run-details-summary-actions .btn {
    align-items: center;
    display: inline-flex;
    margin: 0;
}

.metric--run-status {
    border-color: transparent;
}

.metric--run-status span {
    color: inherit;
    opacity: .78;
}

.metric--run-status-succeeded {
    background: var(--px-success-bg);
    color: var(--px-success-text);
}

.metric--run-status-partiallysucceeded,
.metric--run-status-skipped {
    background: var(--px-warning-bg);
    color: var(--px-warning-text);
}

.metric--run-status-failed {
    background: var(--px-danger-bg);
    color: var(--px-danger-text);
}

.metric--run-status-running,
.metric--run-status-queued {
    background: var(--px-accent-soft);
    color: var(--px-accent-strong);
}

.metric--run-status-cancelled {
    background: var(--px-surface-muted);
    color: var(--px-text-muted);
}

.metric--success strong {
    color: var(--px-success-text);
}

.metric--danger strong {
    color: var(--px-danger-text);
}

.metric--muted strong {
    color: var(--px-text-muted);
}

.run-details-section-head {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--px-space-3);
    justify-content: flex-start;
    margin-bottom: var(--px-space-4);
}

.run-details-section-head .h5 {
    flex: 0 0 auto;
    margin: 0;
}

.run-details-section-tools {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    justify-content: flex-start;
    min-width: 0;
    padding-top: 2px;
}

.run-details-table-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    justify-content: flex-start;
    min-width: 0;
    width: 100%;
}

.run-details-table-toolbar .entity-pager-toolbar {
    flex: 0 0 auto;
    margin-left: auto;
}

.run-details-filter-dropdown {
    flex: 0 0 auto;
}

.run-details-filter-toggle {
    position: relative;
}

.run-details-filter-badge {
    align-items: center;
    background: var(--px-accent);
    border-radius: 50%;
    color: var(--px-surface);
    display: inline-flex;
    font-size: .65rem;
    font-weight: 600;
    height: 1.1rem;
    justify-content: center;
    line-height: 1;
    min-width: 1.1rem;
    padding: 0 .2rem;
    position: absolute;
    right: -.4rem;
    top: -.4rem;
}

.run-details-filter-menu {
    min-width: 11rem;
    padding: .35rem 0;
}

.run-details-filter-option {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: .5rem;
    margin: 0;
}

.run-details-filter-option input {
    margin: 0;
}

.run-details-filter-chips {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: .35rem;
    min-width: 0;
}

.run-details-chip {
    align-items: center;
    background: transparent;
    border: 1px solid var(--px-border-muted);
    border-radius: 999px;
    color: var(--px-text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 600;
    gap: .35rem;
    line-height: 1.2;
    margin: 0;
    padding: .2rem .55rem;
    position: relative;
    white-space: nowrap;
}

.run-details-chip input {
    height: 1px;
    margin: 0;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
}

.run-details-chip-count {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
}

.run-details-chip.is-empty:not(:has(input:checked)) {
    opacity: .55;
}

.run-details-chip:has(input:focus-visible) {
    outline: 2px solid var(--px-accent);
    outline-offset: 2px;
}

.run-details-chip:has(input:checked) {
    background: var(--px-accent-soft);
    border-color: var(--px-accent-strong);
    color: var(--px-accent-strong);
}

.run-details-chip--succeeded:has(input:checked) {
    background: var(--px-success-bg);
    border-color: var(--px-success-text);
    color: var(--px-success-text);
}

.run-details-chip--info:has(input:checked) {
    background: var(--px-info-bg);
    border-color: var(--px-info-text);
    color: var(--px-info-text);
}

.run-details-chip--skipped:has(input:checked),
.run-details-chip--debug:has(input:checked) {
    background: var(--px-surface);
    border-color: var(--px-text-secondary);
    color: var(--px-text);
}

.run-details-chip--failed:has(input:checked),
.run-details-chip--error:has(input:checked) {
    background: var(--px-danger-bg);
    border-color: var(--px-danger-text);
    color: var(--px-danger-text);
}

.run-details-chip--warning:has(input:checked) {
    background: var(--px-warning-bg);
    border-color: var(--px-warning-text);
    color: var(--px-warning-text);
}

.run-details-search {
    flex: 0 1 16rem;
    max-width: 16rem;
    min-width: 10rem;
    width: 16rem;
}

.run-details-search--end {
    margin-left: auto;
}

.run-details-search--end + .entity-pager-toolbar {
    margin-left: 0;
}

.run-details-table--fixed {
    --bs-table-bg: transparent;
    --bs-table-color: var(--px-text);
    --bs-table-border-color: var(--px-border);
    --bs-table-striped-bg: transparent;
    --bs-table-hover-bg: var(--px-surface-muted);
    --bs-table-hover-color: var(--px-text);
    background: transparent;
    color: var(--px-text);
    margin-bottom: 0;
    table-layout: fixed;
    width: 100%;
}

.run-details-panel .table-responsive {
    background: transparent;
}

.run-details-table--fixed > :not(caption) > * > * {
    background-color: transparent;
    border-bottom-color: var(--px-border);
    color: inherit;
}

.run-details-table--fixed thead th {
    background: transparent;
    color: var(--px-text-secondary);
}

.run-details-table--fixed th,
.run-details-table--fixed td {
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
}

.run-details-table--fixed td.text-break {
    white-space: nowrap;
}

.run-details-table--fixed td.run-details-message-cell {
    overflow: hidden;
    vertical-align: top;
    white-space: normal;
}

.run-details-col-resizable {
    position: relative;
}

.run-details-col-resize-handle {
    bottom: 0;
    cursor: col-resize;
    position: absolute;
    right: -4px;
    top: 0;
    width: 10px;
    z-index: 3;
}

.run-details-col-resizable:hover .run-details-col-resize-handle,
.run-details-col-resizable.is-resizing .run-details-col-resize-handle {
    background: color-mix(in srgb, var(--px-accent) 22%, transparent);
}

body.run-details-col-resizing {
    cursor: col-resize;
    user-select: none;
}

.run-details-items-table th.sortable,
.run-details-logs-table th.sortable {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.run-details-items-table th.sortable::after,
.run-details-logs-table th.sortable::after {
    color: var(--px-text-muted);
    content: " ↕";
    font-size: .75em;
}

.run-details-items-table th.sortable.sort-asc::after,
.run-details-logs-table th.sortable.sort-asc::after {
    color: var(--px-accent);
    content: " ↑";
}

.run-details-items-table th.sortable.sort-desc::after,
.run-details-logs-table th.sortable.sort-desc::after {
    color: var(--px-accent);
    content: " ↓";
}

.run-details-message {
    -webkit-box-orient: vertical;
    color: var(--px-text-secondary);
    display: -webkit-box;
    font-size: .9rem;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    overflow-wrap: anywhere;
    white-space: normal;
    word-break: break-word;
}

.run-details-message--empty {
    display: inline;
    -webkit-line-clamp: unset;
    line-clamp: unset;
}

.run-details-message.is-expandable {
    cursor: pointer;
}

.run-details-message.is-expandable:hover {
    color: var(--px-text);
}

.run-details-message.is-expanded {
    -webkit-line-clamp: unset;
    display: block;
    line-clamp: unset;
    white-space: pre-wrap;
}

.run-details-message-hint {
    background: none;
    border: 0;
    color: var(--px-accent);
    cursor: pointer;
    display: inline-block;
    font-size: .75rem;
    font-weight: 600;
    margin-top: .2rem;
    padding: 0;
}

.run-details-message-hint:hover,
.run-details-message-hint:focus-visible {
    color: var(--px-accent-emphasis);
    text-decoration: underline;
}

.run-details-logs-table td.run-log-severity-cell,
.run-details-items-table td.run-item-status-cell,
.run-details-logs-table td.text-nowrap {
    vertical-align: top;
}

.run-details-logs-table td.run-log-severity-cell .badge,
.run-details-items-table td.run-item-status-cell .badge {
    margin-top: .12rem;
}

.run-details-logs-table td.text-nowrap {
    padding-top: .55rem;
}

.run-log-subject .run-details-message-hint,
.run-log-subject-title {
    flex: 1 1 auto;
}

.run-log-subject .run-details-message-hint {
    flex-basis: 100%;
}

@media (max-width: 900px) {
    .run-details-metrics {
        flex-basis: 100%;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .run-details-summary-actions {
        margin-left: 0;
    }

    .run-details-section-tools,
    .run-details-table-toolbar {
        width: 100%;
    }

    .run-details-table-toolbar {
        flex-wrap: wrap;
    }

    .run-details-search {
        flex: 1 1 12rem;
        max-width: none;
        min-width: 0;
        width: auto;
    }
}

.connection-card-grid {
    display: grid;
    gap: var(--px-space-4);
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
}

.connection-card {
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-md);
    box-shadow: var(--px-shadow-panel);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: var(--px-space-3);
    min-height: 11rem;
    padding: var(--px-space-4);
    padding-bottom: calc(var(--px-space-4) + 1.35rem);
    position: relative;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.connection-card:hover {
    border-color: var(--px-border-muted);
    box-shadow: var(--px-shadow-elevated);
}

.connection-card-dismiss-form {
    position: absolute;
    right: var(--px-space-2);
    top: var(--px-space-2);
    z-index: 1;
}

.connection-card-dismiss {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: var(--px-radius-sm);
    color: var(--px-text-muted);
    cursor: pointer;
    display: inline-flex;
    height: 1.75rem;
    justify-content: center;
    padding: 0;
    width: 1.75rem;
}

.connection-card-dismiss:hover {
    background: var(--px-surface-muted);
    color: var(--px-text-secondary);
}

.connection-card-dismiss:focus-visible {
    box-shadow: 0 0 0 2px var(--px-surface), 0 0 0 4px var(--px-accent-emphasis);
    outline: none;
}

.connection-card-header {
    align-items: flex-start;
    display: flex;
    gap: var(--px-space-3);
    padding-right: var(--px-space-5);
}

.connection-card-agent-badge {
    flex-shrink: 0;
    font-size: .68rem;
    font-weight: 600;
    line-height: 1.15;
    margin-left: auto;
    margin-top: .1rem;
    padding: .2em .5em;
}

.connection-card-heading {
    flex: 1 1 auto;
    min-width: 0;
}

.connection-card-logo-wrap {
    align-items: center;
    background: var(--px-surface-muted);
    border-radius: var(--px-radius-sm);
    display: inline-flex;
    flex-shrink: 0;
    height: 2.5rem;
    justify-content: center;
    overflow: hidden;
    width: 2.5rem;
}

.connection-card-logo {
    display: block;
    height: 2rem;
    object-fit: contain;
    width: 2rem;
}

.connection-card-title {
    font-size: 1rem;
    margin: 0;
}

.connection-card-title a {
    color: var(--px-text-heading);
    text-decoration: none;
}

.connection-card-title a:hover,
.connection-card-title a:focus-visible {
    color: var(--px-accent-emphasis);
    text-decoration: underline;
}

.connection-card-subtitle {
    color: var(--px-text-muted);
    font-size: .875rem;
    margin: .15rem 0 0;
}

.connection-card-meta {
    display: grid;
    gap: var(--px-space-2);
    margin: 0;
}

.connection-card-meta dt {
    color: var(--px-text-faint);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .02em;
    margin: 0;
    text-transform: uppercase;
}

.connection-card-meta dd {
    color: var(--px-text-secondary);
    font-size: .875rem;
    margin: 0;
    word-break: break-word;
}

.connection-card-status {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: var(--px-space-2);
    margin-top: auto;
}

.connection-card-status .badge {
    font-size: .7rem;
    line-height: 1.15;
    padding: .15em .45em;
}

.badge.px-connection-validated {
    background: var(--px-success-bg);
    color: var(--px-success-text);
}

.badge.px-connection-pending {
    background: var(--px-warning-bg);
    color: var(--px-warning-text);
}

.badge.px-agent-status--online {
    background: var(--px-success-bg);
    color: var(--px-success-text);
}

.badge.px-agent-status--offline {
    background: var(--px-danger-bg);
    color: var(--px-danger-text);
}

.badge.px-agent-status--unknown {
    background: var(--px-surface-muted);
    color: var(--px-text-muted);
}

.connection-card-validate-badge {
    border: 0;
    bottom: var(--px-space-3);
    cursor: pointer;
    font-size: .7rem;
    font-weight: 600;
    line-height: 1.15;
    padding: calc(.15em + 3px) calc(.45em + 3px);
    position: absolute;
    right: var(--px-space-3);
    transition: opacity .15s ease, box-shadow .15s ease;
    z-index: 1;
}

.connection-card-validate-badge:hover:not(:disabled) {
    filter: brightness(.97);
}

.connection-card-validate-badge:focus-visible {
    box-shadow: 0 0 0 2px var(--px-surface), 0 0 0 4px var(--px-accent-emphasis);
    outline: none;
}

.connection-card-validate-badge.is-validating {
    cursor: wait;
    opacity: .65;
}

.connection-card-validate-badge:disabled {
    cursor: wait;
}

.task-mapping-summary {
    background: var(--px-accent-subtle);
    border: 1px solid var(--px-accent-border);
    border-radius: var(--px-radius-sm);
    color: var(--px-accent-emphasis);
    font-size: .875rem;
    padding: .6rem .85rem;
}

.task-mapping-help-hint {
    display: block;
    margin-top: .35rem;
}

.task-mapping-group-summary {
    color: var(--px-text-muted);
    font-size: .8rem;
    font-weight: 500;
    margin-left: .5rem;
}

.task-mapping-formula-preview {
    background: var(--px-surface-code);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .78rem;
    line-height: 1.35;
    max-height: 3.2rem;
    overflow: hidden;
    padding: .35rem .5rem;
    word-break: break-word;
}

.sync-task-form-tab-content .field-group-body.task-scheduler-layout {
    padding: 1rem 1.35rem 1.15rem;
}

/* Task scheduler tab */
.task-scheduler-layout {
    padding: 0;
}

.task-scheduler-panel {
    --task-scheduler-block-width: 24.5rem;
    --task-scheduler-interval-width: 8.45rem;
    --task-scheduler-time-width: 9.45rem;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: 0;
}

.task-scheduler-header {
    align-items: center;
    background: var(--px-surface-muted);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-md);
    display: flex;
    flex-direction: row;
    gap: .85rem;
    justify-content: flex-start;
    padding: .85rem 1.1rem;
}

.task-scheduler-header-text {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-width: 0;
}

.task-scheduler-title {
    color: var(--px-text-heading);
    font-size: .95rem;
    font-weight: 700;
}

.task-scheduler-subtitle {
    font-size: .82rem;
    line-height: 1.35;
}

.task-scheduler-next-run {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .5rem;
    margin-top: .35rem;
}

.task-scheduler-next-run-label {
    color: var(--px-text-muted);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.task-scheduler-next-run-value {
    color: var(--px-accent-emphasis);
    font-size: .88rem;
    font-weight: 600;
}

.task-scheduler-next-run-sep {
    color: var(--px-text-muted);
    font-size: .82rem;
}

.task-scheduler-skip-link {
    background: none;
    border: 0;
    color: var(--px-accent);
    cursor: pointer;
    font-size: .82rem;
    font-weight: 500;
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.task-scheduler-skip-link:hover {
    color: var(--px-accent-emphasis);
}

.task-scheduler-enable.form-switch {
    align-items: center;
    display: inline-flex;
    flex-shrink: 0;
    margin: 0;
    min-height: 0;
    padding-left: 0;
}

.task-scheduler-enable .form-check-input {
    cursor: pointer;
    float: none;
    height: 1.35rem;
    margin: 0;
    width: 2.5rem;
}

.task-scheduler-body {
    display: flex;
    flex-direction: column;
    gap: 1.35rem;
    padding: .1rem 0 0;
}

.task-scheduler-panel:not(.is-enabled) .task-scheduler-body,
[data-task-scheduler-tab]:not(.is-enabled) .task-scheduler-body {
    opacity: .55;
}

.task-scheduler-section {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.task-scheduler-section-label,
.task-scheduler-section > label {
    color: var(--px-text-secondary);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .04em;
    margin: 0;
    text-transform: uppercase;
}

.task-scheduler-section--timezone .form-select {
    max-width: var(--task-scheduler-block-width);
    width: var(--task-scheduler-block-width);
}

.task-scheduler-day-pills {
    display: grid;
    gap: .4rem;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    max-width: var(--task-scheduler-block-width);
    width: var(--task-scheduler-block-width);
}

.task-scheduler-day-pill {
    cursor: pointer;
    margin: 0;
    min-width: 0;
    user-select: none;
}

.task-scheduler-day-pill input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.task-scheduler-day-pill span {
    align-items: center;
    background: var(--px-surface);
    border: 1px solid var(--px-border);
    border-radius: 999px;
    color: var(--px-text-secondary);
    display: flex;
    font-size: .82rem;
    font-weight: 600;
    justify-content: center;
    line-height: 1;
    min-width: 0;
    padding: .45rem .2rem;
    text-align: center;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    width: 100%;
}

.task-scheduler-day-pill:hover span {
    border-color: var(--px-border-strong, var(--px-border));
    color: var(--px-text);
}

.task-scheduler-day-pill:has(input:checked) span,
.task-scheduler-day-pill.is-selected span {
    background: var(--px-accent-subtle);
    border-color: var(--px-accent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--px-accent) 25%, transparent);
    color: var(--px-accent-emphasis);
}

.task-scheduler-day-pill:has(input:focus-visible) span {
    outline: 2px solid var(--px-accent);
    outline-offset: 2px;
}

.task-scheduler-segmented {
    background: var(--px-surface-muted);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    display: inline-flex;
    gap: .2rem;
    max-width: 100%;
    padding: .2rem;
    width: fit-content;
}

.task-scheduler-segment {
    cursor: pointer;
    margin: 0;
    user-select: none;
}

.task-scheduler-segment input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.task-scheduler-segment span {
    border-radius: calc(var(--px-radius-sm) - 2px);
    color: var(--px-text-secondary);
    display: inline-flex;
    font-size: .86rem;
    font-weight: 600;
    line-height: 1;
    min-width: 5.5rem;
    padding: .5rem 1rem;
    text-align: center;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.task-scheduler-segment:has(input:checked) span,
.task-scheduler-segment.is-selected span {
    background: var(--px-surface);
    box-shadow: var(--px-shadow-panel);
    color: var(--px-text-heading);
}

.task-scheduler-segment:has(input:focus-visible) span {
    outline: 2px solid var(--px-accent);
    outline-offset: 1px;
}

.task-scheduler-timing {
    align-items: end;
    display: flex;
    flex-wrap: wrap;
    gap: .85rem 1.25rem;
}

.task-scheduler-timing--daily {
    display: block;
}

.task-scheduler-field {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    min-width: 0;
}

.task-scheduler-field--interval .task-scheduler-input-suffix {
    width: var(--task-scheduler-interval-width);
}

.task-scheduler-field--time {
    max-width: var(--task-scheduler-time-width);
    width: var(--task-scheduler-time-width);
}

.task-scheduler-field--time .form-control {
    width: 100%;
}

.task-scheduler-field > label {
    font-size: .86rem;
    font-weight: 600;
    margin: 0;
}

.task-scheduler-input-suffix {
    align-items: stretch;
    display: flex;
}

.task-scheduler-input-suffix .form-control {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.task-scheduler-suffix {
    align-items: center;
    background: var(--px-surface-muted);
    border: 1px solid var(--px-border);
    border-left: 0;
    border-radius: 0 var(--px-radius-sm) var(--px-radius-sm) 0;
    color: var(--px-text-muted);
    display: inline-flex;
    font-size: .82rem;
    font-weight: 600;
    padding: 0 .65rem;
    white-space: nowrap;
}

.task-scheduler-validation {
    font-size: .86rem;
}

@media (max-width: 767.98px) {
    .sync-task-form-tab-content .field-group-body.task-scheduler-layout {
        padding: .85rem 1rem 1rem;
    }

    .task-scheduler-header {
        align-items: center;
        flex-direction: row;
    }

    .task-scheduler-panel {
        --task-scheduler-block-width: 100%;
        --task-scheduler-interval-width: 100%;
        --task-scheduler-time-width: 100%;
    }

    .task-scheduler-day-pills {
        max-width: 100%;
        width: 100%;
    }

    .task-scheduler-field--interval .task-scheduler-input-suffix {
        max-width: 10rem;
        width: 100%;
    }

    .task-scheduler-section--timezone .form-select {
        max-width: 100%;
        width: 100%;
    }
}

/* Dashboard */
.dashboard-page .metric-grid {
    background: var(--px-bg);
    border-bottom: 1px solid var(--px-border-subtle);
    box-shadow: 0 10px 18px -16px rgba(15, 23, 42, .35);
    margin-bottom: 1rem;
    padding: .35rem 0 .85rem;
    position: sticky;
    top: var(--app-header-height);
    z-index: 1020;
}

.dashboard-panel {
    min-width: 0;
}

.dashboard-panel > .panel-title-bar,
.dashboard-runs-panel > .panel-title-bar,
.sync-task-tree-panel > .panel-title-bar {
    min-height: calc(2rem + .8rem + 1px);
}

.dashboard-connection-list {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.dashboard-connection-row {
    align-items: center;
    background: var(--px-surface);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    color: inherit;
    display: flex;
    gap: .75rem;
    padding: .55rem .7rem;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.dashboard-connection-row:hover,
.dashboard-connection-row:focus-visible {
    background: var(--px-surface-muted);
    border-color: var(--px-accent-border);
    box-shadow: var(--px-shadow-panel);
    color: inherit;
    outline: none;
    text-decoration: none;
}

.dashboard-connection-logo {
    align-items: center;
    background: var(--px-surface-muted);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    display: inline-flex;
    flex-shrink: 0;
    height: 2.25rem;
    justify-content: center;
    width: 2.25rem;
}

.dashboard-connection-logo .connection-card-logo {
    height: 1.35rem;
    width: 1.35rem;
}

.dashboard-connection-text {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: .1rem;
    min-width: 0;
}

.dashboard-connection-name {
    color: var(--px-text-heading);
    font-size: .9rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-connection-type {
    color: var(--px-text-muted);
    font-size: .78rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-connection-status {
    flex-shrink: 0;
    font-size: .68rem;
    font-weight: 600;
    line-height: 1.15;
    padding: .2em .5em;
}

.dashboard-task-tree {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dashboard-task-tree-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dashboard-task-tree-item {
    margin: 0;
}

.dashboard-task-tree-group {
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    margin-bottom: .5rem;
    overflow: hidden;
}

.dashboard-task-tree-group-summary {
    align-items: center;
    background: var(--px-surface-muted);
    cursor: pointer;
    display: flex;
    font-weight: 600;
    gap: .5rem;
    list-style: none;
    padding: .55rem .75rem;
}

.dashboard-task-tree-group-summary::-webkit-details-marker {
    display: none;
}

.dashboard-task-tree-group[open] > .dashboard-task-tree-group-summary .field-group-chevron {
    transform: rotate(90deg);
}

.dashboard-task-tree-group-title {
    color: var(--px-text-heading);
    font-size: .9rem;
}

.dashboard-task-tree-group .dashboard-task-tree-list {
    padding: .35rem .5rem .5rem;
}

.dashboard-task-tree-row {
    align-items: center;
    border: 1px solid transparent;
    border-radius: var(--px-radius-sm);
    color: inherit;
    display: flex;
    gap: .75rem;
    justify-content: space-between;
    margin-bottom: .25rem;
    padding: .5rem .65rem;
    padding-left: calc(.65rem + var(--tree-depth, 0) * 1rem);
    transition: background-color .15s ease, border-color .15s ease;
}

.dashboard-task-tree-link {
    align-items: flex-start;
    color: inherit;
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    text-decoration: none;
}

.dashboard-task-tree-link:hover,
.dashboard-task-tree-link:focus-visible {
    color: inherit;
    outline: none;
    text-decoration: none;
}

.dashboard-task-tree-row:hover,
.dashboard-task-tree-row:focus-within {
    background: var(--px-surface-muted);
    border-color: var(--px-border-subtle);
}

.dashboard-task-tree-side {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: .5rem;
}

.dashboard-task-tree-main {
    align-items: flex-start;
    display: flex;
    gap: .5rem;
    min-width: 0;
}

.dashboard-task-tree-main .sync-task-tree-name {
    color: var(--px-text-heading);
    font-weight: 600;
}

.dashboard-task-tree-schedule {
    flex-shrink: 0;
}

.dashboard-runs-block {
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.dashboard-runs-frame {
    background: var(--px-surface);
    border: 1px solid var(--px-border-subtle);
    border-radius: var(--px-radius-sm);
    overflow: hidden;
}

.dashboard-runs-frame > .empty {
    margin: 0;
    padding: .75rem 1rem;
}

.dashboard-runs-frame .runs-table {
    margin-bottom: 0;
}

.dashboard-runs-frame .runs-table thead th {
    background: var(--px-surface-muted);
    border-bottom: 1px solid var(--px-border-subtle);
    color: var(--px-text-muted);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.dashboard-runs-frame .runs-table tbody td {
    background: var(--px-surface);
    border-bottom: 1px solid var(--px-border-subtle);
    color: var(--px-text-secondary);
    font-size: .84rem;
}

.dashboard-runs-frame .runs-table tbody tr:last-child td {
    border-bottom: 0;
}

.dashboard-runs-frame .runs-table tbody tr:hover td,
.dashboard-runs-frame .runs-table tbody tr:hover + tr.runs-log-hits td,
.dashboard-runs-frame .runs-table tbody tr:has(+ tr.runs-log-hits:hover) td {
    background: var(--px-surface-muted);
}

.dashboard-runs-frame .runs-table tbody tr:has(+ tr.runs-log-hits) td {
    border-bottom-color: transparent;
}

.dashboard-runs-frame .runs-table tbody tr.runs-log-hits td {
    padding-bottom: .65rem;
    padding-top: 0;
}

.runs-log-hit-list {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.runs-log-hit-list li {
    align-items: baseline;
    display: flex;
    gap: .4rem;
    min-width: 0;
}

.runs-log-hit-message {
    color: var(--px-text);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-section {
    min-height: 5rem;
    position: relative;
}

.dashboard-runs-body {
    min-height: 10rem;
}

.dashboard-runs-loading {
    align-items: center;
    color: var(--px-text-muted);
    display: flex;
    gap: .5rem;
    justify-content: center;
    min-height: 10rem;
    padding: 2rem 0;
}

.dashboard-section--loading .dashboard-runs-loading {
    display: flex;
}

.dashboard-section:not(.dashboard-section--loading) .dashboard-runs-loading {
    display: none;
}

.dashboard-section--loading .dashboard-section-skeleton {
    display: block;
}

.dashboard-section-skeleton {
    background: linear-gradient(
        90deg,
        var(--px-surface-muted) 0%,
        color-mix(in srgb, var(--px-border-subtle) 55%, var(--px-surface-muted)) 50%,
        var(--px-surface-muted) 100%
    );
    background-size: 200% 100%;
    border-radius: var(--px-radius-sm);
    display: none;
    min-height: 5rem;
    animation: dashboard-skeleton-shimmer 1.2s ease-in-out infinite;
}

.dashboard-section-skeleton--tall {
    min-height: 10rem;
}

@keyframes dashboard-skeleton-shimmer {
    0% {
        background-position: 100% 0;
    }

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

.runs-history-panel {
    position: relative;
}

.runs-history-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    justify-content: space-between;
    margin-bottom: .75rem;
}

.runs-history-toolbar-filters {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: .65rem .85rem;
    min-width: 0;
}

.runs-history-filter-group {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .65rem;
}

.runs-history-date-controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.runs-history-date-input {
    max-width: 15rem;
    min-width: 12rem;
}

.runs-history-counter {
    font-size: .84rem;
    white-space: nowrap;
}

.runs-history-filter-menu {
    min-width: 11rem;
    padding: .35rem 0;
}

.runs-history-filter-option {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: .5rem;
    margin: 0;
}

.runs-history-filter-option input {
    margin: 0;
}

.runs-history-table-wrap {
    position: relative;
}

.runs-history-loading {
    align-items: center;
    background: color-mix(in srgb, var(--px-surface) 88%, transparent);
    color: var(--px-text-muted);
    display: none;
    gap: .5rem;
    inset: 0;
    justify-content: center;
    position: absolute;
    z-index: 3;
}

.runs-history-panel--loading .runs-history-loading {
    display: flex;
}

.runs-history-panel--loading .runs-history-table-wrap {
    opacity: .55;
    pointer-events: none;
}

.runs-history-empty {
    color: var(--px-text-muted);
    padding: 1rem 0;
}

.runs-table th.sortable {
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

.runs-table th.sortable::after {
    color: var(--px-text-faint);
    content: " ↕";
    font-size: .75rem;
}

.runs-table th.sortable.sort-asc::after {
    color: var(--px-accent);
    content: " ↑";
}

.runs-table th.sortable.sort-desc::after {
    color: var(--px-accent);
    content: " ↓";
}

.runs-list-panel,
.runs-history-panel {
    position: relative;
}

.runs-list-toolbar,
.runs-history-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    justify-content: space-between;
    margin-bottom: .75rem;
}

.runs-list-toolbar:not(:has(.runs-list-toolbar-filters)) {
    justify-content: flex-end;
}

.runs-list-toolbar-filters,
.runs-history-toolbar-filters {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: .65rem .85rem;
    min-width: 0;
}

.runs-list-filter-group,
.runs-history-filter-group {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .65rem;
}

.runs-list-date-controls,
.runs-history-date-controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.runs-list-date-field {
    display: inline-flex;
    position: relative;
}

.runs-list-date-field .runs-list-date-input,
.runs-list-date-field .runs-history-date-input {
    padding-right: 2.35rem;
}

.runs-list-date-input::-webkit-calendar-picker-indicator {
    cursor: pointer;
    margin: 0 .2rem 0 0;
    padding: 0;
}

.runs-list-date-clear {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: var(--px-radius-sm);
    bottom: 1px;
    color: var(--px-text-muted);
    display: inline-flex;
    height: auto;
    justify-content: center;
    line-height: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 1.35rem;
    top: 1px;
    width: 1.15rem;
}

.runs-list-date-clear svg {
    display: block;
    height: .7rem;
    width: .7rem;
}

.runs-list-date-clear:hover,
.runs-list-date-clear:focus-visible {
    background: var(--px-surface-subtle);
    color: var(--px-text);
}

.runs-list-date-input,
.runs-history-date-input {
    max-width: 11rem;
    min-width: 9rem;
}

.runs-list-counter,
.runs-history-counter {
    font-size: .84rem;
    white-space: nowrap;
}

.runs-list-search {
    flex: 0 1 20rem;
    min-width: 12rem;
}

.runs-cell-actions {
    white-space: nowrap;
}

.runs-cell-actions .sync-task-row-action {
    margin-left: var(--px-space-1);
    vertical-align: middle;
}

.runs-list-filter-toggle {
    position: relative;
}

.runs-list-filter-badge {
    align-items: center;
    background: var(--px-accent);
    border-radius: 50%;
    color: var(--px-surface);
    display: inline-flex;
    font-size: .65rem;
    font-weight: 600;
    height: 1.1rem;
    justify-content: center;
    line-height: 1;
    min-width: 1.1rem;
    padding: 0 .2rem;
    position: absolute;
    right: -.4rem;
    top: -.4rem;
}

.runs-list-filter-menu,
.runs-history-filter-menu {
    min-width: 11rem;
    padding: .35rem 0;
}

.runs-list-filter-option,
.runs-history-filter-option {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: .5rem;
    margin: 0;
}

.runs-list-filter-option input,
.runs-history-filter-option input {
    margin: 0;
}

.runs-list-table-wrap,
.runs-history-table-wrap {
    min-height: 8rem;
    position: relative;
}

.runs-list-loading,
.runs-history-loading {
    align-items: center;
    background: color-mix(in srgb, var(--px-surface) 92%, transparent);
    color: var(--px-text-muted);
    display: none;
    gap: .5rem;
    inset: 0;
    justify-content: center;
    position: absolute;
    z-index: 3;
}

.runs-list--loading .runs-list-loading,
.runs-history-panel--loading .runs-history-loading,
.runs-list-table-wrap--loading .runs-list-loading {
    display: flex;
}

.runs-list--loading .runs-list-table-wrap,
.runs-history-panel--loading .runs-history-table-wrap,
.runs-list-table-wrap--loading {
    opacity: .55;
    pointer-events: none;
}

.runs-list-empty,
.runs-history-empty {
    color: var(--px-text-muted);
    padding: 1rem 0;
}

.runs-table--fixed {
    table-layout: fixed;
    width: 100%;
}

.runs-table--fixed .runs-col-started {
    width: 11rem;
}

.runs-table--fixed .runs-col-task {
    width: 14rem;
}

.runs-table--fixed .runs-col-mode {
    width: 8.5rem;
}

.runs-table--fixed .runs-col-status {
    width: 7.5rem;
}

.runs-table--fixed .runs-col-counts {
    width: 12rem;
}

.runs-table--fixed .runs-col-actions {
    width: 7rem;
}

.runs-table--fixed .runs-cell-started,
.runs-table--fixed .runs-cell-mode,
.runs-table--fixed .runs-cell-counts {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.runs-table--fixed .runs-cell-task,
.runs-table--fixed .runs-cell-status {
    max-width: 0;
}

[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: var(--px-accent);
    --bs-btn-border-color: var(--px-accent);
    --bs-btn-hover-bg: var(--px-accent-border);
    --bs-btn-hover-border-color: var(--px-accent-border);
    --bs-btn-active-bg: var(--px-accent-border);
    --bs-btn-active-border-color: var(--px-accent-border);
    --bs-btn-disabled-bg: var(--px-accent);
    --bs-btn-disabled-border-color: var(--px-accent);
    --bs-btn-focus-shadow-rgb: 232, 148, 26;
}

[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: var(--px-accent-strong);
    --bs-btn-border-color: var(--px-accent);
    --bs-btn-hover-bg: var(--px-accent);
    --bs-btn-hover-border-color: var(--px-accent);
    --bs-btn-active-bg: var(--px-accent);
    --bs-btn-active-border-color: var(--px-accent);
    --bs-btn-disabled-color: var(--px-accent-strong);
    --bs-btn-disabled-border-color: var(--px-accent);
    --bs-btn-focus-shadow-rgb: 232, 148, 26;
}

[data-bs-theme="dark"] .form-check-input:checked,
[data-bs-theme="dark"] .form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--px-accent);
    border-color: var(--px-accent);
}

[data-bs-theme="dark"] .form-check-input:focus {
    border-color: var(--px-accent-strong);
    box-shadow: 0 0 0 .25rem rgba(232, 148, 26, .25);
}

[data-bs-theme="dark"] .nav-pills {
    --bs-nav-pills-link-active-bg: var(--px-accent);
}

.runs-cell-truncate {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.px-server-toggle-col { width: 1.55rem; }

.px-server-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.085rem;
    height: 1.085rem;
    min-width: 1.085rem;
    padding: 0;
    font-size: 0.775rem;
    line-height: 1;
    font-family: Consolas, monospace;
}

.px-server-branch {
    margin-left: 1.75rem;
    padding-left: var(--px-space-3);
    border-left: 1px solid var(--px-border-subtle);
}

[data-server-error] {
    white-space: normal;
    overflow-wrap: anywhere;
}

.px-maintenance-banner {
    background: var(--px-warning-subtle, var(--px-surface-muted));
    color: var(--px-text);
    border-bottom: 1px solid var(--px-warning-border, var(--px-border));
}

body.px-maintenance-active .app-header {
    position: relative;
    z-index: 2001;
}

.px-maintenance-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--px-bg) 55%, transparent);
}

.px-maintenance-dialog {
    max-width: 28rem;
    margin: var(--px-space-4);
    padding: var(--px-space-6);
    text-align: center;
    background: var(--px-surface);
    color: var(--px-text);
    border: 1px solid var(--px-border);
    border-radius: var(--px-radius-lg);
    box-shadow: var(--px-shadow-panel);
}

.px-error-alert-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--px-space-2);
    margin-top: var(--px-space-2);
}

.px-error-report-message {
    color: var(--px-text-body);
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.px-error-details-pre {
    background: var(--px-surface-code);
    border: 1px solid var(--px-border-code);
    border-radius: var(--px-radius-sm);
    color: var(--px-text);
    margin-bottom: 0;
    max-height: 24rem;
    overflow: auto;
    overflow-wrap: anywhere;
    padding: var(--px-space-3);
    white-space: pre-wrap;
}

button.px-toast-action-link {
    background: transparent;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    padding: 0;
}

.px-error-details-pre {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}