
            [x-cloak] {
                display: none !important;
            }

            .ai-server-manage {
                gap: 1rem;
            }

            .ai-server-breadcrumbs {
                display: flex;
                align-items: center;
                gap: 0.55rem;
                color: var(--ai-text-muted);
                font-size: 0.85rem;
            }

            .ai-server-breadcrumbs__link {
                display: inline-flex;
                align-items: center;
                gap: 0.35rem;
                color: inherit;
                text-decoration: none;
            }

            .ai-server-breadcrumbs__link:hover {
                color: var(--ai-text);
            }

            .ai-server-breadcrumbs__link svg {
                width: 0.95rem;
                height: 0.95rem;
                flex: 0 0 auto;
            }

            .ai-server-header {
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                gap: 1rem;
            }

            .ai-server-header__side {
                display: grid;
                gap: 0.3rem;
                justify-items: end;
                align-self: start;
                width: min(100%, 24rem);
            }

            .ai-server-header__identity {
                display: flex;
                align-items: flex-start;
                gap: 0.85rem;
                min-width: 0;
            }

            .ai-server-header__back,
            .ai-inline-copy {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: auto;
                height: auto;
                border: 0;
                color: var(--ai-text-soft);
                text-decoration: none;
                cursor: pointer;
                padding: 0;
                flex: 0 0 auto;
            }

            .ai-server-header__back:hover,
            .ai-inline-copy:hover {
                color: var(--ai-text);
            }

            .ai-inline-copy.is-copied {
                color: var(--ai-success);
            }

            .ai-server-header__back svg,
            .ai-inline-copy svg {
                width: var(--ai-icon-size);
                height: var(--ai-icon-size);
            }

            .ai-server-header__copy {
                min-width: 0;
                display: grid;
                gap: 0.18rem;
            }

            .ai-server-header__title-row,
            .ai-server-header__meta-row,
            .ai-server-chip-row,
            .ai-server-header__actions {
                display: flex;
                flex-wrap: wrap;
                gap: 0.55rem;
                align-items: center;
            }

            .ai-server-header__actions {
                justify-content: flex-end;
                gap: 0.7rem;
            }

            .ai-server-maintenance {
                width: 100%;
                padding: 0;
                border: 0;
                border-radius: 0;
                background: transparent;
                box-shadow: none;
            }

            .ai-server-maintenance__actions {
                display: flex;
                flex-wrap: wrap;
                justify-content: flex-end;
                gap: 0.35rem;
            }

            .ai-server-maintenance__action {
                display: inline-flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 0.28rem;
                min-width: 4.5rem;
                min-height: 3.15rem;
                border: 0;
                border-radius: 0.45rem;
                background: transparent;
                padding: 0.25rem 0.35rem;
                color: var(--ai-text-soft);
                cursor: pointer;
            }

            .ai-server-maintenance__action:hover {
                color: var(--ai-text);
                background: color-mix(in srgb, var(--ai-surface-soft) 82%, white);
            }

            .ai-server-maintenance__action.is-emphasis {
                color: var(--ai-accent);
            }

            .ai-server-maintenance__action[disabled] {
                opacity: 0.45;
                cursor: wait;
            }

            .ai-server-maintenance__action span {
                font-size: 0.63rem;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
            }

            .ai-server-meta-token {
                position: relative;
                padding-right: 0.7rem;
                color: var(--ai-text-muted);
                font-size: 0.78rem;
                font-weight: 600;
            }

            .ai-server-meta-token:not(:last-child)::after {
                content: '•';
                position: absolute;
                right: 0;
                top: 50%;
                transform: translateY(-50%);
                color: var(--ai-border-strong);
            }

            .ai-server-header__title-row {
                gap: 0.7rem;
            }

            .ai-server-header__title {
                margin: 0;
                color: var(--ai-text);
                font-size: 1.9rem;
                font-weight: 400;
                line-height: 1.1;
                letter-spacing: -0.04em;
            }

            .ai-status-dot {
                width: 0.8rem;
                height: 0.8rem;
                border-radius: 999px;
                border: 2px solid color-mix(in srgb, var(--ai-border-strong) 86%, white);
                background: var(--ai-border-strong);
                box-shadow: 0 0 0 4px color-mix(in srgb, var(--ai-success-soft) 30%, transparent);
            }

            .ai-status-dot.is-active {
                background: var(--ai-success);
                border-color: color-mix(in srgb, var(--ai-success-border) 80%, white);
            }

            .ai-server-header__subline {
                color: var(--ai-text-soft);
                font-size: 0.98rem;
            }

            .ai-mini-badge {
                display: inline-flex;
                align-items: center;
                min-height: 1.55rem;
                padding: 0 0.55rem;
                border: 1px solid var(--ai-border);
                border-radius: 0.35rem;
                background: var(--ai-surface);
                color: var(--ai-text-soft);
                font-size: 0.74rem;
                font-weight: 600;
            }

            .ai-mini-badge.is-success {
                background: color-mix(in srgb, var(--ai-success-soft) 72%, var(--ai-surface));
                border-color: var(--ai-success-border);
                color: var(--ai-success);
            }

            .ai-mini-badge.is-danger {
                background: color-mix(in srgb, var(--ai-danger-soft) 62%, var(--ai-surface));
                border-color: color-mix(in srgb, var(--ai-danger) 28%, var(--ai-border));
                color: var(--ai-danger);
            }

            .ai-card--flat {
                border-radius: 0.5rem;
                box-shadow: 0 2px 10px rgba(16, 24, 40, 0.05);
            }

            .ai-toolbar-link {
                display: inline-flex;
                align-items: center;
                gap: 0.4rem;
                border: 0;
                background: transparent;
                padding: 0;
                color: var(--ai-text-soft);
                font-size: 0.84rem;
                font-weight: 700;
                letter-spacing: 0.03em;
                text-decoration: none;
                cursor: pointer;
            }

            .ai-toolbar-link:hover {
                color: var(--ai-text);
            }

            .ai-toolbar-link.is-emphasis {
                color: var(--ai-danger);
            }

            .ai-toolbar-link[disabled] {
                opacity: 0.45;
                cursor: wait;
            }

            .ai-toolbar-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                border: 0;
                background: transparent;
                padding: 0.08rem;
                color: var(--ai-text-soft);
                cursor: pointer;
                line-height: 1;
            }

            .ai-toolbar-icon svg,
            .ai-toolbar-fa {
                width: 1.48rem;
                height: 1.48rem;
                font-size: 1.48rem;
            }

            .ai-toolbar-icon:hover {
                color: var(--ai-text);
            }

            .ai-toolbar-icon.is-emphasis {
                color: var(--ai-danger);
            }

            .ai-toolbar-icon[disabled] {
                opacity: 0.45;
                cursor: wait;
            }

            .ai-system-row {
                display: grid;
                grid-template-columns: minmax(0, 0.44fr) minmax(0, 0.36fr) minmax(0, 0.32fr) minmax(0, 0.34fr) minmax(0, 0.68fr) minmax(0, 0.56fr);
                gap: 0.18rem;
                align-items: stretch;
            }

            .ai-system-item {
                display: flex;
                align-items: center;
                gap: 0.62rem;
                min-width: 0;
                padding: 0.34rem 0.18rem;
                border: 0;
                border-radius: 0;
                background: transparent;
            }

            .ai-system-item:not(:first-child) {
                border-left: 1px solid var(--ai-border);
                padding-left: 0.48rem;
            }

            .ai-system-item--cpu {
                grid-column: auto;
            }

            .ai-system-item--cpu:not(:first-child) {
                border-left: 1px solid var(--ai-border);
                padding-left: 0.48rem;
            }

            .ai-system-item__icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 2.08rem;
                height: 2.08rem;
                color: var(--ai-text-soft);
                flex: 0 0 auto;
            }

            .ai-system-item__icon svg {
                width: 100%;
                height: 100%;
            }

            .ai-system-item__copy {
                min-width: 0;
                display: grid;
                gap: 0.08rem;
            }

            .ai-system-item__label {
                color: var(--ai-text-muted);
                font-size: 0.56rem;
                font-weight: 700;
                letter-spacing: 0.08em;
                text-transform: uppercase;
            }

            .ai-system-item__value {
                display: block;
                min-width: 0;
                color: var(--ai-text);
                font-size: 1rem;
                font-weight: 600;
                line-height: 1.15;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .ai-system-item--cpu .ai-system-item__value {
                white-space: normal;
                overflow: visible;
                text-overflow: clip;
            }

            .ai-system-item--network {
                align-items: flex-start;
            }

            .ai-system-item--network .ai-system-item__icon {
                align-self: center;
            }

            .ai-system-item__meta {
                color: var(--ai-text-soft);
                font-size: 0.62rem;
                line-height: 1.14;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .ai-system-network {
                display: grid;
                gap: 0.3rem;
                width: 100%;
            }

            .ai-system-network__lane {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 0.4rem;
                width: 100%;
                border: 0;
                background: transparent;
                padding: 0;
                color: var(--ai-text-soft);
                text-align: left;
                cursor: pointer;
            }

            .ai-system-network__lane.is-copied {
                color: var(--ai-success);
            }

            .ai-system-network__lane.is-missing {
                color: var(--ai-danger);
                cursor: default;
            }

            .ai-system-network__lane svg {
                flex: 0 0 auto;
            }

            .ai-system-network__lane-copy {
                display: grid;
                gap: 0;
                min-width: 0;
            }

            .ai-system-network__lane-value {
                color: var(--ai-text);
                font-size: 0.78rem;
                font-weight: 600;
                line-height: 1.2;
                word-break: break-word;
            }

            .ai-system-network__lane.is-missing .ai-system-network__lane-value {
                color: currentColor;
            }

            .ai-server-metrics {
                display: grid;
                gap: 0.75rem;
                grid-template-columns: minmax(0, 1.7fr) minmax(280px, 0.95fr);
                align-items: stretch;
            }

            .ai-metric-card {
                min-height: 100%;
            }

            .ai-metric-card--load {
                grid-column: 1;
                grid-row: 1;
            }

            .ai-metric-card--swap {
                grid-column: 1;
                grid-row: 2;
            }

            .ai-metric-card--disk {
                grid-column: 2;
                grid-row: 1;
            }

            .ai-metric-card--memory {
                grid-column: 2;
                grid-row: 2;
            }

            .ai-metric-card__head {
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                gap: 0.75rem;
            }

            .ai-metric-card__title {
                margin: 0;
                color: var(--ai-text);
                font-size: 0.98rem;
                font-weight: 500;
            }

            .ai-metric-card__meta {
                color: var(--ai-text-muted);
                font-size: 0.78rem;
                font-weight: 600;
            }

            .ai-load-dual {
                margin-top: 1rem;
                display: grid;
                gap: 0.9rem;
                grid-template-columns: minmax(0, 1fr);
            }

            .ai-load-dual__chart {
                height: 340px;
                width: 100%;
                max-width: none;
                margin-right: 0;
            }

            .ai-load-dual__chart canvas {
                width: 100%;
                height: 100%;
                display: block;
            }

            .ai-gauge-shell {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 0.8rem;
                padding-top: 0.75rem;
            }

            .ai-gauge-shell.is-compact {
                padding-top: 0.5rem;
            }

            .ai-gauge {
                position: relative;
                width: 200px;
                height: 200px;
                border-radius: 50%;
                background: conic-gradient(#55b75a 0deg var(--ai-gauge-angle), #eef1f4 var(--ai-gauge-angle) 360deg);
            }

            .ai-gauge--compact {
                width: 120px;
                height: 120px;
            }

            .ai-gauge__inner {
                position: absolute;
                inset: 12px;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                border-radius: 50%;
                background: var(--ai-surface);
                text-align: center;
            }

            .ai-gauge__eyebrow {
                color: var(--ai-text-muted);
                font-size: 0.82rem;
                font-weight: 500;
            }

            .ai-gauge__inner strong {
                color: var(--ai-text);
                font-size: 1.05rem;
                font-weight: 700;
            }

            .ai-gauge__foot {
                margin: 0;
                color: var(--ai-text);
                font-size: 0.95rem;
                font-weight: 600;
            }

            .ai-metric-empty {
                display: grid;
                gap: 0.2rem;
                min-height: 200px;
                align-content: center;
                justify-items: center;
                text-align: center;
                color: var(--ai-text-soft);
            }

            .ai-metric-empty strong {
                color: var(--ai-text);
                font-size: 0.95rem;
                font-weight: 600;
            }

            .ai-metric-empty span {
                max-width: 24rem;
                font-size: 0.82rem;
                line-height: 1.45;
            }

            .ai-metric-empty.is-compact {
                min-height: 120px;
            }

            .ai-metric-empty.is-inline {
                min-height: 0;
                align-content: start;
                justify-items: start;
                text-align: left;
            }

            .ai-network-health {
                grid-column: 1 / -1;
            }

            .ai-network-health .ai-card-body {
                display: grid;
                gap: 0.8rem;
                grid-template-columns: 120px minmax(0, 1fr);
                align-items: center;
            }

            .ai-network-health__title {
                color: var(--ai-text);
                font-size: 0.98rem;
                font-weight: 500;
            }

            .ai-network-health__stats {
                display: grid;
                gap: 0.75rem;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .ai-network-health__label {
                display: block;
                color: var(--ai-text-muted);
                font-size: 0.72rem;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
            }

            .ai-network-health__stats strong {
                display: block;
                margin-top: 0.2rem;
                color: var(--ai-text);
                font-size: 1.15rem;
                font-weight: 500;
            }

            .ai-section-head {
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                gap: 1rem;
            }

            .ai-section-title {
                margin: 0;
                color: var(--ai-text);
                font-size: 0.98rem;
                font-weight: 500;
            }

            .ai-section-copy {
                margin: 0.2rem 0 0;
                color: var(--ai-text-soft);
                font-size: 0.86rem;
                line-height: 1.55;
            }

            .ai-address-grid {
                display: flex;
                flex-wrap: wrap;
                gap: 0.7rem;
                margin-top: 1rem;
            }

            .ai-address-lane {
                display: inline-flex;
                align-items: center;
                gap: 0.45rem;
                border: 0;
                background: transparent;
                padding: 0;
                color: var(--ai-success);
                text-align: left;
                cursor: pointer;
            }

            .ai-address-lane.is-missing {
                color: var(--ai-danger);
                cursor: default;
            }

            .ai-address-lane.is-copied {
                color: var(--ai-success);
            }

            .ai-address-lane::before {
                content: "";
                width: 0.46rem;
                height: 0.46rem;
                border-radius: 999px;
                background: currentColor;
                flex: 0 0 auto;
            }

            .ai-address-lane.is-optional {
                color: var(--ai-text-muted);
            }

            .ai-address-lane__label,
            .ai-detail-row__label {
                color: var(--ai-text-muted);
                font-size: 0.72rem;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
            }

            .ai-address-lane__value {
                color: var(--ai-text);
                font-size: 0.9rem;
                font-weight: 600;
                line-height: 1.45;
                word-break: break-word;
            }

            .ai-capacity-row {
                display: grid;
                grid-template-columns: auto auto 1fr;
                align-items: center;
                gap: 0.75rem;
                margin-top: 0.9rem;
                padding: 0.85rem 0.9rem;
                border: 1px solid var(--ai-border);
                border-radius: 0.45rem;
                background: var(--ai-surface-soft);
            }

            .ai-capacity-row__label {
                color: var(--ai-text-muted);
                font-size: 0.72rem;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
            }

            .ai-capacity-row__value {
                color: var(--ai-text);
                font-size: 0.98rem;
                font-weight: 700;
            }

            .ai-capacity-row__value.is-success {
                color: var(--ai-success);
            }

            .ai-capacity-row__value.is-warning {
                color: var(--ai-warning);
            }

            .ai-capacity-row__meta {
                color: var(--ai-text-soft);
                font-size: 0.82rem;
            }

            .ai-detail-list,
            .ai-warning-stack {
                display: flex;
                flex-direction: column;
                gap: 0.55rem;
                margin-top: 1rem;
            }

            .ai-detail-row,
            .ai-warning-row {
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                gap: 0.9rem;
                padding: 0.75rem 0.9rem;
                border: 1px solid var(--ai-border);
                border-radius: 0.45rem;
                background: var(--ai-surface-soft);
            }

            .ai-detail-row__value {
                color: var(--ai-text);
                font-size: 0.92rem;
                font-weight: 500;
                text-align: right;
                word-break: break-word;
            }

            .ai-warning-row {
                justify-content: flex-start;
                border-color: color-mix(in srgb, var(--ai-danger) 28%, var(--ai-border));
                background: color-mix(in srgb, var(--ai-danger-soft) 34%, var(--ai-surface));
                color: var(--ai-danger);
            }

            .ai-warning-row svg {
                flex: 0 0 auto;
                width: 1rem;
                height: 1rem;
                margin-top: 0.1rem;
            }

            .ai-role-state-badge {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-height: 1.7rem;
                padding: 0 0.65rem;
                border-radius: 0.35rem;
                font-size: 0.72rem;
                font-weight: 700;
                letter-spacing: 0.06em;
                text-transform: uppercase;
            }

            .ai-role-state-badge.is-success {
                background: color-mix(in srgb, var(--ai-success) 14%, var(--ai-surface));
                color: var(--ai-success);
            }

            .ai-role-state-badge.is-warning {
                background: color-mix(in srgb, var(--ai-warning) 14%, var(--ai-surface));
                color: var(--ai-warning);
            }

            .ai-role-state-badge.is-danger {
                background: color-mix(in srgb, var(--ai-danger) 14%, var(--ai-surface));
                color: var(--ai-danger);
            }

            .ai-role-state-badge.is-gray {
                background: var(--ai-surface);
                color: var(--ai-text-soft);
            }

            .ai-role-layout {
                display: grid;
                gap: 0;
                margin-top: 1rem;
                grid-template-columns: 180px minmax(0, 1fr);
                border: 1px solid var(--ai-border);
                border-radius: 0.45rem;
                overflow: hidden;
            }

            .ai-role-tabs {
                display: flex;
                flex-direction: column;
                background: var(--ai-surface-soft);
                border-right: 1px solid var(--ai-border);
            }

            .ai-role-tab {
                display: flex;
                align-items: center;
                gap: 0.6rem;
                width: 100%;
                padding: 0.8rem 0.9rem;
                border: 0;
                border-left: 3px solid transparent;
                border-bottom: 1px solid var(--ai-border);
                background: transparent;
                color: var(--ai-text);
                text-align: left;
                cursor: pointer;
            }

            .ai-role-tab:last-child {
                border-bottom: 0;
            }

            .ai-role-tab.is-active {
                border-left-color: var(--ai-accent);
                background: var(--ai-surface);
            }

            .ai-role-tab strong {
                display: block;
                font-size: 0.9rem;
                font-weight: 600;
            }

            .ai-role-tab span {
                display: block;
                margin-top: 0.15rem;
                color: var(--ai-text-muted);
                font-size: 0.74rem;
            }

            .ai-role-tab__dot,
            .ai-role-tab__plus {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 0.9rem;
                height: 0.9rem;
                border-radius: 999px;
                background: #55b75a;
                flex: 0 0 auto;
            }

            .ai-role-tab__plus {
                width: auto;
                height: auto;
                background: transparent;
                color: var(--ai-text);
                font-size: 1.8rem;
                font-weight: 300;
                line-height: 1;
            }

            .ai-role-panel-wrap {
                padding: 0.95rem 1rem 1rem;
                background: var(--ai-surface);
            }

            .ai-role-panel-head {
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                gap: 0.75rem;
            }

            .ai-role-panel__title {
                margin: 0;
                color: var(--ai-text);
                font-size: 1rem;
                font-weight: 600;
            }

            .ai-role-panel__copy {
                margin: 0.28rem 0 0;
                color: var(--ai-text-soft);
                font-size: 0.85rem;
                line-height: 1.5;
            }

            .ai-role-summary {
                display: flex;
                flex-wrap: wrap;
                gap: 1rem 1.5rem;
                margin-top: 0.85rem;
                padding-bottom: 0.75rem;
                border-bottom: 1px solid var(--ai-border);
            }

            .ai-role-summary__stat {
                min-width: 10rem;
            }

            .ai-role-summary__stat span {
                display: block;
                color: var(--ai-text-muted);
                font-size: 0.68rem;
                font-weight: 700;
                letter-spacing: 0.08em;
                text-transform: uppercase;
            }

            .ai-role-summary__stat strong {
                display: block;
                margin-top: 0.2rem;
                color: var(--ai-text);
                font-size: 0.92rem;
                font-weight: 600;
            }

            .ai-role-service-list {
                margin-top: 0.5rem;
            }

            .ai-role-service-row {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 1rem;
                padding: 0.7rem 0;
                border-bottom: 1px solid var(--ai-border);
            }

            .ai-role-service-row__name {
                display: flex;
                align-items: center;
                gap: 0.55rem;
                color: var(--ai-text);
                font-size: 0.9rem;
                font-weight: 500;
            }

            .ai-role-service-row__indicator {
                width: 0.8rem;
                height: 0.8rem;
                border-radius: 999px;
                background: #55b75a;
                flex: 0 0 auto;
            }

            .ai-role-service-row__detail {
                color: var(--ai-text-soft);
                font-size: 0.82rem;
            }

            .ai-role-option-list {
                display: flex;
                flex-direction: column;
                gap: 0.75rem;
                margin-top: 0.85rem;
            }

            .ai-role-option {
                display: block;
                padding: 0.65rem 0;
                border-bottom: 1px solid var(--ai-border);
            }

            .ai-role-option__main {
                display: flex;
                align-items: flex-start;
                gap: 0.8rem;
            }

            .ai-role-option input {
                width: 1.15rem;
                height: 1.15rem;
                margin-top: 0.15rem;
            }

            .ai-role-option__label-row {
                display: flex;
                align-items: center;
                gap: 0.45rem;
            }

            .ai-role-option__label {
                color: var(--ai-text);
                font-size: 0.96rem;
                font-weight: 500;
            }

            .ai-role-option__detail,
            .ai-role-save-note {
                margin-top: 0.2rem;
                color: var(--ai-text-soft);
                font-size: 0.86rem;
            }

            .ai-role-inline-note {
                margin: 0.75rem 0 0;
                color: var(--ai-text-soft);
                font-size: 0.82rem;
                line-height: 1.5;
            }

            .ai-role-save-row {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 1rem;
                margin-top: 0.9rem;
                flex-wrap: wrap;
            }

            .ai-role-save-row .ai-role-save-note {
                margin-top: 0;
                max-width: 40rem;
            }

            .ai-role-save-actions {
                display: flex;
                align-items: center;
                gap: 0.75rem;
            }

            .ai-role-help {
                position: relative;
                display: inline-flex;
            }

            .ai-role-help__button {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 1rem;
                height: 1rem;
                border: 0;
                border-radius: 999px;
                background: #111827;
                color: #fff;
                font-size: 0.68rem;
                font-weight: 700;
                cursor: help;
                padding: 0;
            }

            .ai-role-help__tooltip {
                position: absolute;
                left: 1.4rem;
                top: 50%;
                z-index: 20;
                width: 280px;
                padding: 0.7rem 0.8rem;
                border-radius: 0.35rem;
                background: #111827;
                color: #fff;
                font-size: 0.8rem;
                line-height: 1.5;
                transform: translateY(-50%);
                box-shadow: 0 12px 24px rgba(0, 0, 0, 0.28);
            }

            .ai-empty-state {
                margin-top: 1rem;
                padding: 1rem;
                border: 1px dashed var(--ai-border-strong);
                border-radius: 0.45rem;
                color: var(--ai-text-soft);
                background: var(--ai-surface-soft);
            }

            .ai-empty-state strong {
                display: block;
                margin-bottom: 0.25rem;
                color: var(--ai-text);
            }

            .ai-server-form {
                margin-top: 1rem;
            }

            .ai-server-form__actions {
                margin-top: 1rem;
            }

            .ai-collapsible-card,
            .ai-advanced-settings {
                overflow: hidden;
            }

            .ai-collapsible-card__summary,
            .ai-advanced-settings__summary {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 1rem;
                padding: 1rem 1.25rem;
                cursor: pointer;
                list-style: none;
            }

            .ai-collapsible-card__summary::-webkit-details-marker,
            .ai-advanced-settings__summary::-webkit-details-marker {
                display: none;
            }

            .ai-collapsible-card__summary::after,
            .ai-advanced-settings__summary::after {
                content: '+';
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 1.6rem;
                height: 1.6rem;
                border-radius: 999px;
                border: 1px solid var(--ai-border);
                color: var(--ai-text-soft);
                font-size: 1rem;
                font-weight: 500;
                flex: 0 0 auto;
            }

            .ai-collapsible-card[open] .ai-collapsible-card__summary::after,
            .ai-advanced-settings[open] .ai-advanced-settings__summary::after {
                content: '−';
            }

            @media (max-width: 1100px) {
                .ai-server-metrics {
                    grid-template-columns: 1fr;
                }

                .ai-load-dual {
                    grid-template-columns: 1fr;
                }

                .ai-load-dual__stats {
                    grid-template-columns: 1fr;
                }

                .ai-metric-card--load,
                .ai-metric-card--swap,
                .ai-metric-card--disk,
                .ai-metric-card--memory,
                .ai-network-health {
                    grid-column: auto;
                    grid-row: auto;
                }

                .ai-network-health .ai-card-body,
                .ai-role-layout {
                    grid-template-columns: 1fr;
                }

                .ai-system-row {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }

                .ai-system-item:not(:first-child) {
                    border-left: 0;
                    padding-left: 0.35rem;
                }

                .ai-system-item--cpu {
                    grid-column: 1 / -1;
                    border-left: 0;
                    padding-left: 0.35rem;
                }

                .ai-role-tabs {
                    border-right: 0;
                    border-bottom: 1px solid var(--ai-border);
                }
            }

            @media (max-width: 768px) {
                .ai-server-header {
                    flex-direction: column;
                }

                .ai-server-header__side {
                    width: 100%;
                    justify-items: stretch;
                }

                .ai-server-maintenance {
                    width: 100%;
                }

                .ai-server-maintenance__actions {
                    justify-content: flex-start;
                }

                .ai-system-row,
                .ai-address-grid,
                .ai-network-health__stats {
                    grid-template-columns: 1fr;
                }

                .ai-system-item {
                    padding-inline: 0;
                }

                .ai-system-item--cpu {
                    grid-column: auto;
                    border-top: 0;
                    padding-top: 0.55rem;
                }

                .ai-detail-row,
                .ai-role-service-row,
                .ai-network-health .ai-card-body {
                    flex-direction: column;
                    align-items: flex-start;
                }

                .ai-capacity-row {
                    grid-template-columns: 1fr;
                    gap: 0.2rem;
                }

                .ai-role-summary {
                    display: grid;
                    grid-template-columns: 1fr;
                    gap: 0.75rem;
                }

                .ai-detail-row__value {
                    text-align: left;
                }
            }
        
