.xava-topbar-start > .xava-ui-scope-switcher {
    flex: 0 1 16rem;
}

.xava-topbar-start > .xava-ui-scope-switcher .xava-ui-scope-control {
    width: 100%;
}

.xava-ui-context-banner,
.xava-connected-context {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--xava-ui-space-4);
    padding: var(--xava-ui-space-3) var(--xava-ui-space-4);
    border: 1px solid color-mix(in srgb, var(--xava-ui-primary) 40%, var(--xava-ui-border));
    border-radius: var(--xava-ui-radius-md);
    background:
        linear-gradient(110deg, color-mix(in srgb, var(--xava-ui-primary) 13%, var(--xava-ui-surface)), var(--xava-ui-surface) 55%);
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--xava-ui-primary) 72%, transparent);
}

.xava-connected-context-copy,
.xava-ui-context-copy {
    min-width: 0;
}

.xava-connected-context-label,
.xava-ui-context-label {
    display: block;
    margin-bottom: var(--xava-ui-space-1);
    color: color-mix(in srgb, var(--xava-ui-primary) 72%, var(--surux-hue-lift) 28%);
    font-size: .68rem;
    font-weight: 780;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.xava-connected-context strong,
.xava-ui-context-banner strong {
    display: block;
    color: var(--xava-ui-text);
    font-size: .9rem;
}

.xava-connected-context p,
.xava-ui-context-banner p {
    max-width: 72ch;
    margin: .2rem 0 0;
    color: var(--xava-ui-muted);
    font-size: .78rem;
    line-height: 1.45;
}

.xava-ui-data-table {
    min-width: 0;
    margin: 0;
}

.xava-ui-data-table > :not(caption) > * > * {
    border-color: var(--xava-ui-border);
    vertical-align: middle;
}

.xava-ui-data-table thead th {
    padding-block: .72rem;
    background: color-mix(in srgb, var(--xava-ui-surface-muted) 92%, transparent);
    color: var(--xava-ui-muted);
    font-size: .68rem;
    font-weight: 780;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.xava-ui-data-table tbody tr {
    transition:
        background-color var(--xava-ui-transition),
        box-shadow var(--xava-ui-transition);
}

.xava-ui-data-table tbody tr:hover {
    background: color-mix(in srgb, var(--xava-ui-primary) 5%, transparent);
}

.xava-ui-table-primary {
    color: var(--xava-ui-text);
    font-weight: 730;
    text-decoration: none;
}

.xava-ui-table-primary:hover {
    color: color-mix(in srgb, var(--xava-ui-primary) 76%, var(--surux-hue-lift) 24%);
    text-decoration: underline;
    text-underline-offset: .2rem;
}

.xava-ui-count {
    min-width: 1.75rem;
    display: inline-grid;
    place-items: center;
    padding: .2rem .5rem;
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-pill);
    background: var(--xava-ui-surface-raised);
    color: var(--xava-ui-text);
    font-size: .76rem;
    font-weight: 750;
}

.xava-ui-table-action {
    width: 1%;
    text-align: right;
    white-space: nowrap;
}

.xava-ui-workspace-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(18rem, .85fr);
    align-items: start;
    gap: var(--xava-ui-space-4);
}

.xava-ui-workspace-stack {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: var(--xava-ui-space-4);
}

.xava-ui-lifecycle {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-md);
    background: var(--xava-ui-border);
}

.xava-ui-lifecycle-step {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--xava-ui-space-3);
    padding: var(--xava-ui-space-4);
    background: var(--xava-ui-surface);
}

.xava-ui-lifecycle-index {
    width: 1.8rem;
    height: 1.8rem;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--xava-ui-primary) 42%, var(--xava-ui-border));
    border-radius: 50%;
    background: color-mix(in srgb, var(--xava-ui-primary) 12%, transparent);
    color: color-mix(in srgb, var(--xava-ui-primary) 76%, var(--surux-hue-lift) 24%);
    font-size: .72rem;
    font-weight: 800;
}

.xava-ui-lifecycle-copy {
    min-width: 0;
}

.xava-ui-lifecycle-copy span {
    display: block;
    color: var(--xava-ui-muted);
    font-size: .68rem;
    font-weight: 720;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.xava-ui-lifecycle-copy strong {
    display: block;
    margin-top: .12rem;
    color: var(--xava-ui-text);
    font-size: .86rem;
    overflow-wrap: anywhere;
}

.xava-ui-fact-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--xava-ui-space-3);
}

.xava-ui-fact {
    min-width: 0;
    padding: var(--xava-ui-space-3);
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-sm);
    background: var(--xava-ui-surface-muted);
}

.xava-ui-fact > span {
    display: block;
    color: var(--xava-ui-muted);
    font-size: .68rem;
    line-height: 1.35;
}

.xava-ui-fact > strong,
.xava-ui-fact > code {
    display: block;
    margin-top: .24rem;
    color: var(--xava-ui-text);
    font-size: .82rem;
    overflow-wrap: anywhere;
}

.xava-ui-resource-list {
    min-width: 0;
    display: grid;
    gap: var(--xava-ui-space-2);
}

.xava-ui-resource-card {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--xava-ui-space-4);
    padding: var(--xava-ui-space-3);
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-sm);
    background: var(--xava-ui-surface-muted);
}

.xava-ui-resource-card:hover {
    border-color: color-mix(in srgb, var(--xava-ui-primary) 35%, var(--xava-ui-border));
}

.xava-ui-resource-copy {
    min-width: 0;
}

.xava-ui-resource-copy h3 {
    margin: 0;
    color: var(--xava-ui-text);
    font-size: .9rem;
    font-weight: 740;
}

.xava-ui-resource-copy p {
    margin: .25rem 0 0;
    color: var(--xava-ui-muted);
    font-size: .76rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.xava-ui-resource-meta,
.xava-ui-resource-actions {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--xava-ui-space-2);
}

.xava-ui-resource-meta {
    margin-top: var(--xava-ui-space-2);
}

.xava-ui-notice {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: var(--xava-ui-space-3);
    padding: var(--xava-ui-space-3) var(--xava-ui-space-4);
    border: 1px solid color-mix(in srgb, var(--xava-ui-info) 34%, var(--xava-ui-border));
    border-radius: var(--xava-ui-radius-md);
    background: color-mix(in srgb, var(--xava-ui-info) 9%, var(--xava-ui-surface));
    color: var(--xava-ui-text);
    font-size: .8rem;
    line-height: 1.55;
}

.xava-ui-detail-list {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(8rem, .4fr) minmax(0, 1fr);
    gap: .7rem var(--xava-ui-space-4);
    margin: 0;
}

.xava-ui-detail-list dt {
    color: var(--xava-ui-muted);
    font-size: .75rem;
    font-weight: 680;
}

.xava-ui-detail-list dd {
    min-width: 0;
    margin: 0;
    color: var(--xava-ui-text);
    font-size: .8rem;
    overflow-wrap: anywhere;
}

.xava-service-chain {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: var(--xava-ui-space-2);
}

.xava-service-chain-step {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: var(--xava-ui-space-3);
    min-height: 4.2rem;
    padding: var(--xava-ui-space-3);
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-md);
    background: var(--xava-ui-surface);
    color: var(--xava-ui-text);
    text-decoration: none;
}

a.xava-service-chain-step:hover {
    border-color: color-mix(in srgb, var(--xava-ui-primary) 42%, var(--xava-ui-border));
    background: color-mix(in srgb, var(--xava-ui-surface) 95%, var(--xava-ui-primary) 5%);
}

.xava-service-chain-step.is-current {
    border-color: color-mix(in srgb, var(--xava-ui-primary) 58%, var(--xava-ui-border));
    background:
        linear-gradient(115deg, color-mix(in srgb, var(--xava-ui-primary) 13%, var(--xava-ui-surface)), var(--xava-ui-surface));
    box-shadow: inset 3px 0 0 var(--xava-ui-primary);
}

.xava-service-chain-index {
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--xava-ui-primary) 46%, var(--xava-ui-border));
    border-radius: 50%;
    background: color-mix(in srgb, var(--xava-ui-primary) 12%, transparent);
    color: color-mix(in srgb, var(--xava-ui-primary) 76%, var(--surux-hue-lift) 24%);
    font-size: .7rem;
    font-weight: 800;
}

.xava-service-chain-step small,
.xava-service-chain-step strong {
    display: block;
}

.xava-service-chain-step small {
    color: var(--xava-ui-muted);
    font-size: .66rem;
    font-weight: 730;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.xava-service-chain-step strong {
    margin-top: .15rem;
    font-size: .82rem;
    overflow-wrap: anywhere;
}

.xava-service-chain-connector {
    width: 1.25rem;
    height: 1px;
    background: var(--xava-ui-border-strong);
}

.xava-service-chain-connector::after {
    content: "";
    display: block;
    width: .35rem;
    height: .35rem;
    margin: -.19rem 0 0 auto;
    border-top: 1px solid var(--xava-ui-border-strong);
    border-right: 1px solid var(--xava-ui-border-strong);
    transform: rotate(45deg);
}

.xava-service-workbench {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(18rem, .72fr);
    align-items: start;
    gap: var(--xava-ui-space-4);
}

.xava-service-workbench-main,
.xava-service-workbench-aside {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: var(--xava-ui-space-4);
}

.xava-service-workbench-aside {
    position: sticky;
    top: var(--xava-ui-space-3);
}

.xava-service-state-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--xava-ui-space-3);
}

.xava-service-state {
    min-width: 0;
    min-height: 8rem;
    display: flex;
    flex-direction: column;
    padding: var(--xava-ui-space-3);
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-sm);
    background:
        linear-gradient(145deg, color-mix(in srgb, var(--xava-ui-primary) 5%, var(--xava-ui-surface-muted)), var(--xava-ui-surface-muted));
}

.xava-service-state > span,
.xava-service-state > small {
    color: var(--xava-ui-muted);
    font-size: .72rem;
    line-height: 1.45;
}

.xava-service-state > span {
    font-weight: 710;
}

.xava-service-state > strong {
    margin: .45rem 0;
    color: var(--xava-ui-text);
    font-size: 1rem;
}

.xava-service-state > small {
    margin-top: auto;
}

.xava-service-fact-grid,
.xava-publishing-facts,
.xava-runtime-facts {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--xava-ui-space-3);
    margin: var(--xava-ui-space-4) 0 0;
}

.xava-service-fact-grid > div,
.xava-publishing-facts > div,
.xava-runtime-facts > div {
    min-width: 0;
    padding-top: var(--xava-ui-space-3);
    border-top: 1px solid var(--xava-ui-border);
}

.xava-service-fact-grid dt,
.xava-publishing-facts dt,
.xava-runtime-facts dt {
    color: var(--xava-ui-muted);
    font-size: .68rem;
    font-weight: 690;
}

.xava-service-fact-grid dd,
.xava-publishing-facts dd,
.xava-runtime-facts dd {
    min-width: 0;
    margin: .25rem 0 0;
    color: var(--xava-ui-text);
    font-size: .78rem;
    overflow-wrap: anywhere;
}

.xava-service-locked {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: var(--xava-ui-space-3);
    padding: var(--xava-ui-space-4);
    border: 1px dashed color-mix(in srgb, var(--xava-ui-warning) 44%, var(--xava-ui-border));
    border-radius: var(--xava-ui-radius-md);
    background: color-mix(in srgb, var(--xava-ui-warning) 8%, var(--xava-ui-surface));
}

.xava-service-locked-icon {
    width: 1.8rem;
    height: 1.8rem;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--xava-ui-warning) 15%, transparent);
    color: var(--xava-ui-warning);
    font-weight: 850;
}

.xava-service-locked strong {
    display: block;
    color: var(--xava-ui-text);
    font-size: .84rem;
}

.xava-service-locked p {
    margin: .25rem 0 0;
    color: var(--xava-ui-muted);
    font-size: .77rem;
    line-height: 1.5;
}

.xava-service-warnings {
    display: grid;
    gap: var(--xava-ui-space-2);
    margin-bottom: var(--xava-ui-space-3);
}

.xava-service-warnings p {
    margin: 0;
    padding: var(--xava-ui-space-2) var(--xava-ui-space-3);
    border-left: 2px solid var(--xava-ui-warning);
    border-radius: 0 var(--xava-ui-radius-sm) var(--xava-ui-radius-sm) 0;
    background: color-mix(in srgb, var(--xava-ui-warning) 8%, transparent);
    color: color-mix(in srgb, var(--xava-ui-warning) 76%, var(--surux-hue-lift) 24%);
    font-size: .76rem;
}

.xava-publishing-list {
    min-width: 0;
    display: grid;
    gap: var(--xava-ui-space-3);
}

.xava-publishing-target {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-md);
    background: var(--xava-ui-surface-muted);
}

.xava-publishing-target-heading {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--xava-ui-space-4);
    padding: var(--xava-ui-space-4);
}

.xava-publishing-target-heading h3 {
    margin: 0;
    color: var(--xava-ui-text);
    font-size: .95rem;
    font-weight: 750;
}

.xava-publishing-target-heading p {
    margin: .2rem 0 0;
    color: var(--xava-ui-muted);
    font-size: .72rem;
    overflow-wrap: anywhere;
}

.xava-publishing-target-statuses {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--xava-ui-space-2);
}

.xava-publishing-facts {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    padding: 0 var(--xava-ui-space-4) var(--xava-ui-space-4);
}

.xava-publishing-target-footer {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--xava-ui-space-4);
    padding: var(--xava-ui-space-3) var(--xava-ui-space-4);
    border-top: 1px solid var(--xava-ui-border);
    background: color-mix(in srgb, var(--xava-ui-surface-raised) 78%, transparent);
}

.xava-publishing-target-footer p {
    min-width: 0;
    margin: 0;
    color: var(--xava-ui-muted);
    font-size: .72rem;
    line-height: 1.45;
}

.xava-runtime-summary > strong {
    display: block;
    padding: var(--xava-ui-space-3);
    border-radius: var(--xava-ui-radius-sm);
    background: var(--xava-ui-surface-muted);
    color: var(--xava-ui-text);
    font-size: .84rem;
    line-height: 1.5;
}

.xava-runtime-facts {
    grid-template-columns: 1fr;
}

.xava-service-ownership-list {
    display: grid;
    gap: var(--xava-ui-space-3);
    margin: 0;
    padding: 0;
    counter-reset: xava-ownership;
    list-style: none;
}

.xava-service-ownership-list li {
    position: relative;
    min-width: 0;
    padding-left: 2.35rem;
    counter-increment: xava-ownership;
}

.xava-service-ownership-list li::before {
    content: counter(xava-ownership);
    position: absolute;
    inset: 0 auto auto 0;
    width: 1.6rem;
    height: 1.6rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--xava-ui-border);
    border-radius: 50%;
    background: var(--xava-ui-surface-raised);
    color: var(--xava-ui-muted);
    font-size: .68rem;
    font-weight: 800;
}

.xava-service-ownership-list strong,
.xava-service-ownership-list span {
    display: block;
}

.xava-service-ownership-list strong {
    color: var(--xava-ui-text);
    font-size: .8rem;
}

.xava-service-ownership-list span {
    margin-top: .2rem;
    color: var(--xava-ui-muted);
    font-size: .72rem;
    line-height: 1.5;
}

.xava-traffic-notice {
    border-color: color-mix(in srgb, var(--xava-ui-info) 38%, var(--xava-ui-border));
    background:
        linear-gradient(110deg, color-mix(in srgb, var(--xava-ui-info) 11%, var(--xava-ui-surface)), var(--xava-ui-surface) 62%);
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--xava-ui-info) 68%, transparent);
}

.xava-traffic-notice p {
    color: color-mix(in srgb, var(--xava-ui-text) 88%, var(--xava-ui-muted));
    font-size: .8rem;
    line-height: 1.55;
}

.xava-traffic-filters .form-label {
    color: var(--xava-ui-text);
    font-size: .75rem;
    font-weight: 720;
}

.xava-traffic-results > .xava-ui-surface-header {
    align-items: center;
}

.xava-traffic-table {
    min-width: 74rem;
    margin: 0;
    table-layout: fixed;
}

.xava-traffic-table th:nth-child(1) {
    width: 12%;
}

.xava-traffic-table th:nth-child(2) {
    width: 13%;
}

.xava-traffic-table th:nth-child(3) {
    width: 12%;
}

.xava-traffic-table th:nth-child(4) {
    width: 20%;
}

.xava-traffic-table th:nth-child(5) {
    width: 15%;
}

.xava-traffic-table th:nth-child(6) {
    width: 20%;
}

.xava-traffic-table th:nth-child(7) {
    width: 8%;
}

.xava-traffic-table td,
.xava-traffic-table code,
.xava-traffic-drawer code,
.xava-traffic-drawer pre {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.xava-traffic-table td {
    vertical-align: top;
}

.xava-traffic-drawer dl {
    min-width: 0;
    row-gap: .2rem;
}

.xava-traffic-drawer dt,
.xava-traffic-drawer dd {
    min-width: 0;
    padding-block: .42rem;
    border-bottom: 1px solid var(--xava-ui-border);
}

.xava-traffic-drawer dt {
    color: var(--xava-ui-muted);
    font-size: .74rem;
}

.xava-traffic-drawer dd {
    color: var(--xava-ui-text);
    font-size: .78rem;
}

.xava-traffic-drawer details {
    margin-top: var(--xava-ui-space-3);
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-sm);
    background: var(--xava-ui-surface-muted);
}

.xava-traffic-drawer summary {
    padding: var(--xava-ui-space-3);
    color: var(--xava-ui-text);
    font-size: .78rem;
    font-weight: 720;
    cursor: pointer;
}

.xava-traffic-failure {
    margin-bottom: var(--xava-ui-space-3);
    padding: var(--xava-ui-space-3);
    border: 1px solid color-mix(in srgb, var(--xava-ui-danger) 34%, var(--xava-ui-border));
    border-radius: var(--xava-ui-radius-sm);
    background: color-mix(in srgb, var(--xava-ui-danger) 8%, var(--xava-ui-surface-muted));
}

.xava-traffic-failure-stage {
    margin: 0;
    color: var(--xava-ui-text);
    font-size: .8rem;
    font-weight: 720;
    line-height: 1.5;
}

.xava-traffic-failure-chain {
    margin: var(--xava-ui-space-3) 0 0;
    padding-left: 1.15rem;
    color: var(--xava-ui-text);
    font-family: var(--bs-font-monospace);
    font-size: .74rem;
    line-height: 1.55;
}

.xava-traffic-failure-chain li {
    padding-block: .18rem;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.xava-traffic-failure-empty {
    margin: var(--xava-ui-space-3) 0 0;
    color: var(--xava-ui-muted);
    font-size: .76rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.xava-traffic-stages {
    padding: var(--xava-ui-space-3);
}

.xava-traffic-attachments {
    margin-top: var(--xava-ui-space-3);
}

.xava-traffic-attachment-list {
    display: grid;
    gap: var(--xava-ui-space-3);
    margin: 0;
    padding: 0;
    list-style: none;
}

.xava-traffic-attachment-list li {
    display: grid;
    gap: .4rem;
    padding: var(--xava-ui-space-3);
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-sm);
    background: var(--xava-ui-surface-muted);
}

.xava-traffic-attachment-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .4rem;
    color: var(--xava-ui-text);
    font-size: .78rem;
}

.xava-traffic-attachment-head span {
    color: var(--xava-ui-muted);
    font-size: .72rem;
}

.xava-traffic-attachment-preview {
    max-width: 100%;
    max-height: 16rem;
    border: 1px solid var(--xava-ui-border);
    border-radius: var(--xava-ui-radius-sm);
    object-fit: contain;
}

.xava-traffic-drawer details .xava-code-block {
    max-height: 20rem;
    margin: 0;
    border: 0;
    border-top: 1px solid var(--xava-ui-border);
    border-radius: 0;
}

@media (max-width: 960px) {
    .xava-ui-workspace-grid {
        grid-template-columns: 1fr;
    }

    .xava-ui-fact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .xava-service-workbench {
        grid-template-columns: 1fr;
    }

    .xava-service-workbench-aside {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .xava-topbar-start {
        flex: 1 1 auto;
    }

    .xava-topbar-start > .xava-ui-scope-switcher {
        min-width: 0;
        flex: 1 1 auto;
    }

    .xava-topbar-start > .xava-ui-scope-switcher .xava-ui-scope-control {
        min-width: 0;
    }

    .xava-ui-table-action {
        width: auto;
        text-align: left;
    }

    .xava-responsive-table .xava-ui-table-action::before {
        content: none;
    }

    .xava-responsive-table .xava-ui-table-action > * {
        width: 100%;
    }

    .xava-ui-lifecycle {
        grid-template-columns: 1fr;
    }

    .xava-ui-resource-card {
        grid-template-columns: 1fr;
    }

    .xava-ui-resource-actions {
        justify-content: stretch;
    }

    .xava-ui-resource-actions > * {
        flex: 1 1 auto;
    }

    .xava-service-chain {
        grid-template-columns: 1fr;
    }

    .xava-service-chain-connector {
        width: 1px;
        height: .8rem;
        margin-left: 1.6rem;
    }

    .xava-service-chain-connector::after {
        width: .35rem;
        height: .35rem;
        margin: auto 0 0 -.17rem;
        transform: rotate(135deg);
    }

    .xava-service-state-grid,
    .xava-service-workbench-aside {
        grid-template-columns: 1fr;
    }

    .xava-service-state {
        min-height: 0;
    }

    .xava-publishing-target-heading,
    .xava-publishing-target-footer {
        display: grid;
    }

    .xava-publishing-target-statuses {
        justify-content: flex-start;
    }

    .xava-publishing-facts,
    .xava-service-fact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .xava-traffic-table {
        min-width: 0;
        table-layout: auto;
    }

    .xava-traffic-table td[data-label="Actions"] {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .xava-traffic-table td[data-label="Actions"]::before {
        flex: 0 0 100%;
    }

    .xava-traffic-table td[data-label="Actions"] > * {
        margin-right: var(--xava-ui-space-2);
    }
}

@media (max-width: 560px) {
    .xava-topbar-brand .xava-topbar-wordmark {
        display: none;
    }

    .xava-topbar-start > .xava-ui-scope-switcher {
        max-width: 9.5rem;
    }

    .xava-connected-context,
    .xava-ui-context-banner {
        display: grid;
        padding: var(--xava-ui-space-3);
    }

    .xava-connected-context .xava-actions,
    .xava-ui-context-banner .xava-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .xava-ui-fact-grid {
        grid-template-columns: 1fr;
    }

    .xava-ui-detail-list {
        grid-template-columns: 1fr;
        gap: .18rem;
    }

    .xava-ui-detail-list dd + dt {
        margin-top: var(--xava-ui-space-2);
    }

    .xava-publishing-facts,
    .xava-service-fact-grid {
        grid-template-columns: 1fr;
    }

    .xava-publishing-target-footer .xava-ui-button {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .xava-ui-data-table tbody tr {
        transition: none;
    }
}