/* === vx-update-watch.css === */
.vxUpdateNotice{position:fixed;right:18px;top:18px;z-index:20000;display:flex;align-items:center;gap:14px;max-width:min(440px,calc(100vw - 28px));padding:11px 12px;border:1px solid rgba(224,177,62,.42);border-radius:11px;background:#0c1118;box-shadow:0 18px 60px rgba(0,0,0,.55);color:#edf2f7}
.vxUpdateNotice[hidden]{display:none!important}.vxUpdateNotice>div{display:flex;align-items:center;gap:9px;min-width:0}.vxUpdateNotice>div>span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(224,177,62,.12);color:#e7c364;font-size:18px}.vxUpdateNotice section{display:grid;gap:2px}.vxUpdateNotice b{font-size:11px}.vxUpdateNotice small{font-size:9px;line-height:1.35;color:#8996a7}.vxUpdateNotice button{border:1px solid rgba(224,177,62,.38);border-radius:7px;background:rgba(224,177,62,.10);color:#efd47e;padding:7px 10px;font-weight:700;cursor:pointer;white-space:nowrap}
.vxAuthRecovery{margin-top:8px;padding:10px;border:1px solid rgba(224,177,62,.20);border-radius:9px;background:rgba(224,177,62,.055);display:grid;gap:6px}.vxAuthRecovery[hidden]{display:none!important}.vxAuthResetButton{width:100%;border:1px solid rgba(224,177,62,.32);border-radius:8px;background:rgba(224,177,62,.10);color:#efd47e;padding:9px 10px;font-weight:700;cursor:pointer}.vxAuthRecovery small{font-size:9px;color:#8794a4;line-height:1.4}

/* === vx-public-trial.css === */

/* VX public trial notice — shared by landing and pricing */
.vx-public-trial{
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:center;
  margin-top:22px;
  margin-bottom:22px;
  padding:22px 24px;
  border:1px solid rgba(139,92,246,.42);
  border-radius:18px;
  background:
    radial-gradient(circle at 10% 0%,rgba(124,58,237,.20),transparent 38%),
    linear-gradient(135deg,rgba(34,25,66,.92),rgba(15,21,31,.96));
  box-shadow:0 18px 50px rgba(20,12,50,.18),inset 0 0 0 1px rgba(255,255,255,.025);
}
.vx-public-trial[hidden]{display:none!important}

.vx-public-trial .vx-public-kicker{
  display:inline-flex;padding:7px 11px;border:1px solid rgba(255,209,32,.33);
  border-radius:999px;background:rgba(255,196,0,.08);color:#ffd43b;
  font-size:12px;font-weight:850;letter-spacing:.13em;text-transform:uppercase
}
.vx-public-trial h2,.vx-public-trial h3{margin:5px 0 7px;color:#f4edff}
.vx-public-trial h2{font-size:clamp(24px,3vw,38px)}
.vx-public-trial h3{font-size:24px}
.vx-public-trial p{margin:0;color:#cbd5e1;line-height:1.55}
.vx-public-trial__facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.vx-public-trial__facts span{
  display:inline-flex;align-items:center;gap:4px;
  padding:6px 9px;border:1px solid rgba(196,181,253,.18);
  border-radius:999px;background:rgba(255,255,255,.045);
  color:#d8d3e8;font-size:12px;font-weight:650
}
.vx-public-trial__facts b{color:#fff}
.vx-public-trial__action{
  display:grid;gap:8px;justify-items:stretch;
  width:min(100%,310px)
}
.vx-public-trial__action .primary{
  display:flex;align-items:center;justify-content:center;
  min-height:42px;padding:10px 15px;border-radius:11px;
  text-align:center;text-decoration:none;font-weight:850;white-space:normal
}
.vx-public-trial__action small{
  color:#8f9bad;font-size:11px;line-height:1.4;text-align:center
}
.vx-public-trial--catalog{
  width:100%;margin:12px 0 20px;padding:18px 20px
}
@media(max-width:760px){
  .vx-public-trial{grid-template-columns:1fr;padding:18px}
  .vx-public-trial__action{width:100%}
}

/* === vx-product-design-v27.css === */
/* VX Product UX #27 — unified cabinet design system. Scoped to body.vx-ds-v27. */
body.vx-ds-v27 {
  --vx27-bg: #08111d;
  --vx27-bg-soft: #0c1726;
  --vx27-panel: #101d2d;
  --vx27-panel-2: #142235;
  --vx27-panel-hover: #182a40;
  --vx27-line: rgba(154, 179, 211, .14);
  --vx27-line-strong: rgba(154, 179, 211, .24);
  --vx27-text: #edf5ff;
  --vx27-muted: #91a4bd;
  --vx27-primary: #2f80ed;
  --vx27-primary-strong: #3b8cff;
  --vx27-success: #22c55e;
  --vx27-warning: #f59e0b;
  --vx27-danger: #ef4444;
  --vx27-info: #06b6d4;
  --vx27-watch: #8b5cf6;
  --vx27-radius-sm: 8px;
  --vx27-radius: 12px;
  --vx27-radius-lg: 16px;
  --vx27-shadow: 0 14px 40px rgba(0,0,0,.22);
  --vx27-control-h: 38px;
  --vx27-gap: 12px;
  color: var(--vx27-text);
}

/* predictable sizing / focus */
body.vx-ds-v27 *, body.vx-ds-v27 *::before, body.vx-ds-v27 *::after { box-sizing: border-box; }
body.vx-ds-v27 :where(button, input, select, textarea, a, [tabindex]):focus-visible {
  outline: 2px solid rgba(59,140,255,.9) !important;
  outline-offset: 2px;
}

/* page hierarchy */
body.vx-ds-v27 :where(.page-title, .vxPageTitle, .vxOpsTitle, .vxOwnerDashboardTitle, h1) {
  letter-spacing: -.02em;
}
body.vx-ds-v27 :where(.muted, .hint, .subtle, .vx-muted, .vxMutedish) { color: var(--vx27-muted) !important; }
body.vx-ds-v27 :where(.card, .panel, .vxCard, .vx-card, .vxPanel, .vx-panel, .vxOpsCard, .vxOwnerDashboardCard) {
  border-color: var(--vx27-line) !important;
  border-radius: var(--vx27-radius) !important;
}

/* Controls */
body.vx-ds-v27 :where(button, .btn, .button, .vxBtn, .vx-button, a.primary, button.primary) {
  min-height: var(--vx27-control-h);
  border-radius: var(--vx27-radius-sm) !important;
  font-weight: 650;
  letter-spacing: 0;
  transition: background-color .15s ease, border-color .15s ease, transform .12s ease, opacity .15s ease;
}
body.vx-ds-v27 :where(button, .btn, .button, .vxBtn, .vx-button):not(:disabled):active { transform: translateY(1px); }
body.vx-ds-v27 :where(button, .btn, .button, .vxBtn, .vx-button):disabled { opacity: .48; cursor: not-allowed; }
body.vx-ds-v27 :where(.primary, .btn-primary, .vxBtnPrimary, .vx-button--primary) {
  background: linear-gradient(180deg, var(--vx27-primary-strong), var(--vx27-primary)) !important;
  border-color: rgba(89,159,255,.42) !important;
  color: #fff !important;
}
body.vx-ds-v27 :where(.danger, .btn-danger, .vxBtnDanger, .vx-button--danger) {
  background: rgba(239,68,68,.14) !important;
  border-color: rgba(239,68,68,.35) !important;
  color: #ffb6b6 !important;
}

/* Inputs / filters */
body.vx-ds-v27 :where(input:not([type=checkbox]):not([type=radio]), select, textarea) {
  min-height: var(--vx27-control-h);
  border-radius: var(--vx27-radius-sm) !important;
  border-color: var(--vx27-line-strong) !important;
  background-color: rgba(6,14,24,.52) !important;
  color: var(--vx27-text) !important;
}
body.vx-ds-v27 :where(input, select, textarea)::placeholder { color: #6f839e; }
body.vx-ds-v27 :where(.filters, .filterbar, .filter-bar, .vxFilters, .vx-filterbar, .vxOpsFilters) {
  gap: 10px !important;
}

/* Tables */
body.vx-ds-v27 :where(table, .vxTable, .vx-table) {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
body.vx-ds-v27 :where(table, .vxTable, .vx-table) thead th {
  color: #a9bad0;
  font-size: 12px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: .01em;
  border-bottom-color: var(--vx27-line-strong) !important;
}
body.vx-ds-v27 :where(table, .vxTable, .vx-table) tbody tr { transition: background-color .12s ease; }
body.vx-ds-v27 :where(table, .vxTable, .vx-table) tbody tr:hover { background: rgba(59,140,255,.055); }
body.vx-ds-v27 :where(table, .vxTable, .vx-table) td { border-bottom-color: var(--vx27-line) !important; }

/* Tabs */
body.vx-ds-v27 :where(.tabs, .vxTabs, .vx-tabs, [role=tablist]) {
  gap: 4px;
  border-bottom-color: var(--vx27-line) !important;
}
body.vx-ds-v27 :where(.tab, .vxTab, .vx-tab, [role=tab]) {
  border-radius: 8px 8px 0 0 !important;
  color: var(--vx27-muted);
}
body.vx-ds-v27 :where(.tab.active, .tab.is-active, .vxTab.active, .vx-tab.active, [role=tab][aria-selected=true]) {
  color: var(--vx27-text) !important;
  background: rgba(47,128,237,.11) !important;
}

/* Status pills: use existing semantic class names without requiring markup migrations. */
body.vx-ds-v27 :where(.badge, .pill, .chip, .tag, .status, .vxBadge, .vx-badge, .vxPill) {
  border-radius: 999px !important;
  font-weight: 650;
}
body.vx-ds-v27 :where(.online, .success, .is-online, .is-success, .status-ok) { color: #72e59b !important; }
body.vx-ds-v27 :where(.warning, .warn, .is-warning) { color: #ffc768 !important; }
body.vx-ds-v27 :where(.error, .danger-text, .is-error, .offline, .is-offline) { color: #ff8d8d !important; }
body.vx-ds-v27 :where(.watch, .vxWatchBadge, .is-watch) { color: #c5adff !important; }

/* Modals / drawers */
body.vx-ds-v27 :where(.modal, .vxModal, .vx-modal, [role=dialog]) {
  border-radius: var(--vx27-radius-lg) !important;
}
body.vx-ds-v27 :where(.modal-content, .vxModalContent, .vx-modal__content, .drawer, .vxDrawer) {
  border: 1px solid var(--vx27-line-strong) !important;
  box-shadow: var(--vx27-shadow) !important;
}
body.vx-ds-v27 :where(.modal-header, .modal-footer, .vxModalHeader, .vxModalFooter, .vx-modal__header, .vx-modal__footer) {
  border-color: var(--vx27-line) !important;
}

/* Empty / loading states */
body.vx-ds-v27 :where(.empty, .empty-state, .vxEmpty, .vx-empty, .no-data) {
  min-height: 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
  color: var(--vx27-muted);
}
body.vx-ds-v27 :where(.skeleton, .vxSkeleton, .vx-skeleton) {
  background: linear-gradient(90deg, rgba(255,255,255,.035), rgba(255,255,255,.075), rgba(255,255,255,.035));
  background-size: 220% 100%;
  animation: vx27Skeleton 1.35s linear infinite;
  border-radius: 8px;
}
@keyframes vx27Skeleton { to { background-position: -220% 0; } }

/* Compact density for administration surfaces. */
body.vx-ds-v27 :where(.vxOwnerDashboard, .vxOperations, .vxMapShell, .vxLogsWorkspace, .vxSAConsole) {
  --vx27-control-h: 36px;
}

/* Utility classes available to all new product work. */
body.vx-ds-v27 .vx27-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; }
body.vx-ds-v27 .vx27-page-head__title { margin:0; font-size:24px; line-height:1.15; }
body.vx-ds-v27 .vx27-page-head__sub { margin-top:5px; color:var(--vx27-muted); font-size:13px; }
body.vx-ds-v27 .vx27-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
body.vx-ds-v27 .vx27-status { display:inline-flex; align-items:center; gap:6px; min-height:26px; padding:3px 9px; border:1px solid var(--vx27-line); border-radius:999px; font-size:12px; font-weight:700; }
body.vx-ds-v27 .vx27-status--ok { color:#72e59b; background:rgba(34,197,94,.09); border-color:rgba(34,197,94,.22); }
body.vx-ds-v27 .vx27-status--warning { color:#ffc768; background:rgba(245,158,11,.09); border-color:rgba(245,158,11,.22); }
body.vx-ds-v27 .vx27-status--danger { color:#ff9898; background:rgba(239,68,68,.09); border-color:rgba(239,68,68,.22); }
body.vx-ds-v27 .vx27-status--watch { color:#c5adff; background:rgba(139,92,246,.09); border-color:rgba(139,92,246,.22); }
body.vx-ds-v27 .vx27-grid { display:grid; gap:12px; }
body.vx-ds-v27 .vx27-card { border:1px solid var(--vx27-line); background:linear-gradient(180deg, rgba(20,34,53,.92), rgba(13,25,40,.92)); border-radius:var(--vx27-radius); padding:14px; }
body.vx-ds-v27 .vx27-card:hover { border-color:var(--vx27-line-strong); }
body.vx-ds-v27 .vx27-kbd { display:inline-flex; align-items:center; min-height:22px; padding:1px 6px; border:1px solid var(--vx27-line-strong); border-bottom-color:rgba(154,179,211,.36); border-radius:5px; color:#b9c8da; background:rgba(255,255,255,.035); font-size:11px; }

/* Responsive behavior: tables stay usable and action bars wrap rather than crush. */
@media (max-width: 980px) {
  body.vx-ds-v27 .vx27-page-head { flex-direction:column; }
  body.vx-ds-v27 .vx27-actions { width:100%; }
  body.vx-ds-v27 :where(.table-wrap, .vxTableWrap, .vx-table-wrap) { overflow-x:auto; -webkit-overflow-scrolling:touch; }
}
@media (max-width: 640px) {
  body.vx-ds-v27 { --vx27-control-h: 42px; }
  body.vx-ds-v27 :where(button, .btn, .button, .vxBtn, .vx-button) { min-height:42px; }
  body.vx-ds-v27 :where(.modal-content, .vxModalContent, .vx-modal__content) { max-width:calc(100vw - 20px) !important; }
}

/* === vx-product-polish-v35.css === */
/* VX Product UX #35 — final working polish */
:root{--vx35-hit:36px}
.vxTableScroll{max-width:100%;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:inherit}
.vxTableScroll>table{min-width:680px}

/* Make all working modals predictable and prevent content from disappearing below the viewport. */
.vxOpsModal,.vxServerCenterCard,.vxNotifySettingsDialog,.vxOwnerRenewalModalPanel{overscroll-behavior:contain}
.vxOpsModalOverlay,.vxDossierOverlay,.vxServerCenterModal,.vxNotifySettingsModal{overscroll-behavior:none}

/* Server cards: keep actions readable instead of becoming tiny pills. */
.vxSrvQuickActions button,.vxSrvActionsGrid button,.vxSrvProblem button{min-height:var(--vx35-hit)}
.vxSrvPanelHead h4,.vxSrvIdentity b{overflow-wrap:anywhere}

/* Notifications: better density on normal screens and safe drawer height. */
#notify-panel.vxNotifyDrawer{max-height:min(78vh,720px)!important}
.vxNotifyDrawerList{overscroll-behavior:contain}
.vxNotifyRow button{min-height:32px}
.vxNotifyDetailActions button,.vxNotifySettingsOpen{min-height:36px}

/* Dossier: hero stays compact, actions do not push identity out. */
.vxDossier2HeroActions .vxOpsButton{min-height:34px}
.vxDossier2Identity{min-width:0}.vxDossier2Title h3{min-width:0;overflow-wrap:anywhere}

/* Consistent touch/focus behavior for the daily admin surfaces. */
.vxSrvCard button,.vxNotifyShell button,.vxOpsShell button,.vxDashShell button{touch-action:manipulation}
.vxSrvCard button:focus-visible,.vxNotifyShell button:focus-visible,.vxOpsShell button:focus-visible,.vxDashShell button:focus-visible{outline:2px solid rgba(85,145,255,.8);outline-offset:2px}

@media(max-width:900px){
  /* Reduce visual noise and preserve content width on tablets. */
  .vxSrvDetails,.vxOpsContent,.vxNotifyMain,.vxNotifySide{scrollbar-width:thin}
  .vxServerCenterModal,.vxOpsModalOverlay,.vxDossierOverlay,.vxNotifySettingsModal{padding:10px!important}
  .vxServerCenterCard,.vxOpsModal,.vxNotifySettingsDialog{max-height:calc(100dvh - 20px)!important}
}
@media(max-width:720px){
  /* Servers */
  .vxSrvCardHead{padding:12px!important}.vxSrvDetails{padding:10px!important}
  .vxSrvHeadlineStats{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
  .vxSrvHeadlineStats span{padding:8px;border:1px solid rgba(120,145,180,.13);border-radius:9px;background:rgba(255,255,255,.02)}
  .vxSrvQuickActions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .vxSrvQuickActions button{white-space:normal;line-height:1.15}
  .vxSrvConfig label{grid-template-columns:1fr!important;gap:4px!important}.vxSrvToken{width:100%}
  .vxSrvConfigActions{display:grid!important;grid-template-columns:1fr}.vxSrvConfigActions button{width:100%}
  /* Notifications */
  body.vx-authenticated #notify-panel.vxNotifyDrawer{top:58px!important;max-height:calc(100dvh - 70px)!important}
  .vxNotifyDrawerList{max-height:calc(100dvh - 132px)!important}
  .vxNotifyRow{padding:9px!important}.vxNotifyTitle{white-space:normal!important}.vxNotifyMessage{white-space:normal!important}
  .vxNotifyDetailHead{display:grid!important}.vxNotifyDetailGrid{grid-template-columns:78px minmax(0,1fr)!important}
  /* Dossier */
  .vxDossierOverlay .vxOpsModal{width:100%!important;max-height:calc(100dvh - 20px)!important;border-radius:14px!important}
  .vxDossier2Hero{gap:10px!important}.vxDossier2HeroActions{display:grid!important;grid-template-columns:1fr 1fr;width:100%}
  .vxDossier2HeroActions .vxOpsButton{width:100%;justify-content:center}
  .vxDossier2Tabs{margin-inline:-4px;padding-inline:4px}.vxDossier2Tabs button{min-height:36px}
}
@media(max-width:520px){
  .vxSrvQuickActions{grid-template-columns:1fr 1fr!important}.vxSrvQuickActions button:last-child{grid-column:1/-1}
  .vxDossier2HeroActions{grid-template-columns:1fr!important}
  .vxNotifyMain,.vxNotifySide{padding:10px!important}
  .vxNotifyFilters{gap:7px!important}.vxNotifyCategories{overflow:auto;flex-wrap:nowrap!important;padding-bottom:3px}
  .vxNotifyCategories button{white-space:nowrap}
  .vxServerCenterActions{grid-template-columns:1fr!important}
}

/* === vx-servers-v2.css === */
.vxServersV2Page{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}.vxServersV2Page>h3{font-size:24px;margin:0 0 6px}.vxServersV2Page>.row{margin:0 0 18px;padding:14px;border:1px solid var(--vx-border,#243247);border-radius:14px;background:var(--vx-surface,#101a29);gap:10px;align-items:center}.vxServersV2Page>.row input,.vxServersV2Page>.row select{min-height:40px}.vxSrvListHead{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:12px}.vxSrvListHead span,.vxSrvPanelHead span{display:block;font-size:10px;letter-spacing:.12em;color:#6f829b;font-weight:800}.vxSrvListHead h4,.vxSrvPanelHead h4{margin:3px 0 0;font-size:16px}.vxSrvListHead p{margin:5px 0 0;color:#8495aa;font-size:12px}.vxSrvListHead>button{white-space:nowrap}.vxSrvList{display:grid;gap:12px}.vxSrvCard{border:1px solid #253246;border-radius:15px;background:linear-gradient(180deg,#111c2b,#0d1724);overflow:hidden;box-shadow:0 8px 30px rgba(0,0,0,.13);transition:border-color .15s,box-shadow .15s}.vxSrvCard.is-ok{border-left:3px solid #28c76f}.vxSrvCard.is-warn{border-left:3px solid #f3a712}.vxSrvCard.is-bad{border-left:3px solid #ef4b50}.vxSrvCard.is-expanded{box-shadow:0 12px 36px rgba(0,0,0,.22)}.vxSrvCardHead{display:grid;grid-template-columns:minmax(260px,1.5fr) auto auto auto;gap:18px;align-items:center;padding:15px 16px}.vxSrvIdentity{display:flex!important;align-items:center!important;gap:11px!important;text-align:left!important;background:none!important;border:0!important;padding:0!important;color:inherit!important;min-width:0}.vxSrvIdentity>span:last-child{min-width:0}.vxSrvIdentity b{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vxSrvIdentity small{display:block;margin-top:4px;color:#8192a7;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vxSrvDot{width:10px;height:10px;border-radius:50%;background:#66758a;box-shadow:0 0 0 4px rgba(100,115,138,.12);flex:0 0 auto}.vxSrvDot.is-ok{background:#28c76f;box-shadow:0 0 0 4px rgba(40,199,111,.13)}.vxSrvDot.is-warn{background:#f3a712;box-shadow:0 0 0 4px rgba(243,167,18,.13)}.vxSrvDot.is-bad{background:#ef4b50;box-shadow:0 0 0 4px rgba(239,75,80,.13)}.vxSrvHeadlineStats{display:flex;gap:18px}.vxSrvHeadlineStats span{display:grid;min-width:55px}.vxSrvHeadlineStats b{font-size:15px}.vxSrvHeadlineStats small{font-size:10px;color:#74859b}.vxSrvStatus{display:grid;min-width:150px}.vxSrvStatus b{font-size:12px}.vxSrvStatus small{font-size:10px;color:#718198;margin-top:3px}.vxSrvStatus .is-ok,.vxSrvHeadlineStats .is-ok,.vxSrvHealthRow .is-ok{color:#35d17b}.vxSrvStatus .is-warn,.vxSrvHeadlineStats .is-warn,.vxSrvHealthRow .is-warn{color:#f5ae24}.vxSrvStatus .is-bad,.vxSrvHealthRow .is-bad{color:#ff6268}.vxSrvQuickActions{display:flex;gap:7px}.vxSrvQuickActions button{min-height:34px;padding:0 11px;font-size:11px}.vxSrvDetails{border-top:1px solid #202d40;padding:15px;background:rgba(7,13,22,.28)}.vxSrvOverviewGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.vxSrvPanel{border:1px solid #223047;border-radius:13px;background:#101a28;padding:14px;min-width:0}.vxSrvPanelHead{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.vxSrvPanelHead button{width:32px;height:30px;padding:0}.vxSrvHealth{display:grid}.vxSrvHealthRow{display:grid;grid-template-columns:minmax(110px,1fr) auto;column-gap:12px;row-gap:2px;padding:9px 0;border-bottom:1px solid rgba(86,104,129,.18)}.vxSrvHealthRow:last-child{border-bottom:0}.vxSrvHealthRow span{font-size:12px}.vxSrvHealthRow b{font-size:11px;text-transform:none}.vxSrvHealthRow small{grid-column:1/-1;color:#74859b;font-size:10px}.vxSrvProblems{display:grid;gap:7px}.vxSrvProblem{display:grid;grid-template-columns:24px 1fr auto;gap:9px;align-items:center;padding:9px 10px;border-radius:9px;border:1px solid #2a374b;background:#0d1724}.vxSrvProblem>span{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#283347;font-weight:900}.vxSrvProblem div{min-width:0}.vxSrvProblem b,.vxSrvProblem small{display:block}.vxSrvProblem b{font-size:11px}.vxSrvProblem small{font-size:10px;color:#7c8ca0;margin-top:2px}.vxSrvProblem.is-warn{border-color:rgba(243,167,18,.28)}.vxSrvProblem.is-warn>span{color:#f3a712;background:rgba(243,167,18,.12)}.vxSrvProblem.is-bad{border-color:rgba(239,75,80,.3)}.vxSrvProblem.is-bad>span{color:#ef4b50;background:rgba(239,75,80,.12)}.vxSrvProblem button{font-size:10px;min-height:30px}.vxSrvConfig{display:grid;align-content:start}.vxSrvConfig label{display:grid;grid-template-columns:110px 1fr;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid rgba(86,104,129,.17)}.vxSrvConfig label>span:first-child{font-size:10px;color:#788aa0}.vxSrvConfig label b,.vxSrvConfig code{font-size:11px;overflow:hidden;text-overflow:ellipsis}.vxSrvConfig select{min-height:34px}.vxSrvToken{display:flex;align-items:center;gap:8px;min-width:0}.vxSrvToken code{flex:1;white-space:nowrap}.vxSrvToken button{font-size:10px}.vxSrvConfigActions{display:flex;gap:8px;margin-top:12px}.vxSrvReadonly{margin-top:10px;font-size:11px;color:#788aa0}.vxSrvActionsGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.vxSrvActionsGrid button{text-align:left;display:grid!important;gap:3px;padding:10px 11px!important;min-height:52px}.vxSrvActionsGrid b{font-size:11px}.vxSrvActionsGrid small{font-size:9px;color:#7e8fa4}.vxSrvDanger{display:flex;justify-content:flex-end;padding-top:12px}.vxSrvDanger button{color:#ff6268;border-color:rgba(239,75,80,.35);background:rgba(239,75,80,.07)}.vxSrvEmpty,.vxSrvLoading{min-height:120px;border:1px dashed #2b3a50;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:#8393a7;text-align:center;padding:24px}.vxSrvEmpty b{color:#d6dfeb}.vxSrvEmpty.is-good{min-height:80px;color:#5abb83;border-color:rgba(40,199,111,.2)}.vxSrvEmpty.is-error{color:#ff777b;border-color:rgba(239,75,80,.3)}.vxSrvLoading{flex-direction:row;text-align:left}.vxSrvLoading>span{width:22px;height:22px;border-radius:50%;border:2px solid #29405c;border-top-color:#3682f6;animation:vxSrvSpin .8s linear infinite}.vxSrvLoading b,.vxSrvLoading small{display:block}.vxSrvLoading small{font-size:10px;margin-top:3px}@keyframes vxSrvSpin{to{transform:rotate(360deg)}}
@media(max-width:1100px){.vxSrvCardHead{grid-template-columns:1fr auto}.vxSrvHeadlineStats{order:3}.vxSrvStatus{order:4}.vxSrvQuickActions{grid-column:1/-1}.vxSrvOverviewGrid{grid-template-columns:1fr}}@media(max-width:720px){.vxServersV2Page>.row{display:grid;grid-template-columns:1fr 1fr}.vxServersV2Page>.row input,.vxServersV2Page>.row select{grid-column:1/-1}.vxSrvListHead{display:grid}.vxSrvListHead>button{justify-self:start}.vxSrvCardHead{display:flex;flex-direction:column;align-items:stretch;gap:11px}.vxSrvHeadlineStats{justify-content:flex-start}.vxSrvQuickActions{display:grid;grid-template-columns:1fr 1fr 1fr}.vxSrvQuickActions button{padding:0 6px}.vxSrvConfig label{grid-template-columns:90px 1fr}.vxSrvActionsGrid{grid-template-columns:1fr}.vxSrvProblem{grid-template-columns:24px 1fr}.vxSrvProblem button{grid-column:2}.vxSrvOverviewGrid{grid-template-columns:1fr}}


/* V24 — lifetime totals per project / server */
.vxSrvLifetime{
  border:1px solid rgba(78,99,130,.24);
  border-radius:12px;
  background:rgba(8,14,23,.34);
  overflow:hidden;
}
.vxSrvLifetime.is-project{
  margin:0 0 12px;
  background:linear-gradient(145deg,rgba(18,27,42,.78),rgba(11,18,29,.82));
}
.vxSrvLifetime.is-server{
  margin:0 14px 12px;
}
.vxSrvLifetimeHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px 6px;
  border-bottom:1px solid rgba(78,99,130,.16);
}
.vxSrvLifetimeHead>span{
  color:#8ea0b7;
  font-size:9px;
  font-weight:850;
  letter-spacing:.10em;
}
.vxSrvLifetimeHead>small{
  color:#66778e;
  font-size:9px;
}
.vxSrvLifetimeGrid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
}
.vxSrvLifetimeGrid>div{
  min-width:0;
  padding:9px 10px 10px;
  border-right:1px solid rgba(78,99,130,.14);
}
.vxSrvLifetimeGrid>div:last-child{border-right:0}
.vxSrvLifetimeGrid span{
  display:block;
  color:#73849a;
  font-size:9px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.vxSrvLifetimeGrid b{
  display:block;
  margin-top:4px;
  color:#edf3fb;
  font-size:15px;
  line-height:1.1;
}
.vxSrvLifetime.is-project .vxSrvLifetimeGrid b{
  font-size:17px;
}
@media(max-width:900px){
  .vxSrvLifetimeGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vxSrvLifetimeGrid>div:nth-child(3){border-right:0}
  .vxSrvLifetimeGrid>div:nth-child(n+4){border-top:1px solid rgba(78,99,130,.14)}
}
@media(max-width:560px){
  .vxSrvLifetime.is-server{margin-left:10px;margin-right:10px}
  .vxSrvLifetimeHead{align-items:flex-start;flex-direction:column;gap:2px}
  .vxSrvLifetimeGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vxSrvLifetimeGrid>div{border-top:1px solid rgba(78,99,130,.12)!important;border-right:1px solid rgba(78,99,130,.12)!important}
  .vxSrvLifetimeGrid>div:nth-child(odd){border-right:1px solid rgba(78,99,130,.12)!important}
  .vxSrvLifetimeGrid>div:nth-child(even){border-right:0!important}
  .vxSrvLifetimeGrid>div:first-child,.vxSrvLifetimeGrid>div:nth-child(2){border-top:0!important}
  .vxSrvLifetimeGrid>div:last-child{grid-column:1/-1;border-right:0!important}
}

.vxSrvTrend{margin:0 14px 12px;border:1px solid rgba(80,105,145,.18);border-radius:11px;background:rgba(7,13,22,.26)}.vxSrvTrendHead,.vxSrvCompareHead{display:flex;justify-content:space-between;align-items:center;padding:8px 10px}.vxSrvTrendHead span,.vxSrvCompareHead span{font-size:9px;font-weight:900;letter-spacing:.09em;color:#8293aa}.vxSrvTrendHead small{font-size:9px;color:#65768d}.vxSrvTrendGrid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid rgba(80,105,145,.12)}.vxSrvTrendGrid>div{padding:8px 9px;border-right:1px solid rgba(80,105,145,.1)}.vxSrvTrendGrid span,.vxSrvTrendGrid em{display:block;font-size:9px;color:#6e7f96}.vxSrvTrendGrid b{display:block;margin:3px 0;font-size:13px}.vxSrvCompare{margin:0 0 12px;border:1px solid rgba(80,105,145,.22);border-radius:12px;overflow:hidden;background:rgba(10,17,28,.45)}.vxSrvComparePeriods{display:flex;gap:4px}.vxSrvComparePeriods button{min-height:28px!important;padding:0 8px!important}.vxSrvComparePeriods .is-active{border-color:#7792ff!important;color:#dbe3ff!important}.vxSrvCompareTable{overflow:auto}.vxSrvCompareTable>div{display:grid;grid-template-columns:minmax(170px,1.4fr) repeat(5,minmax(80px,.7fr));gap:8px;padding:8px 10px;border-top:1px solid rgba(80,105,145,.1);font-size:11px}.vxSrvCompareTable .head{color:#7e8da2;font-size:9px;text-transform:uppercase}@media(max-width:700px){.vxSrvTrendGrid{grid-template-columns:repeat(2,1fr)}.vxSrvCompareTable>div{min-width:680px}}

/* === vx-cabinet-fixes.css === */
/* Cabinet fixes: one stylesheet, in the original cascade order. */
/* VX Product #48 — service/outage health */
.vxSrvServiceStrip{display:flex;flex-wrap:wrap;gap:7px;padding:0 18px 13px}.vxSrvServicePill{display:inline-flex;align-items:center;gap:6px;min-height:27px;padding:4px 9px;border:1px solid rgba(148,163,184,.14);border-radius:999px;background:rgba(255,255,255,.025);font-size:11px;white-space:nowrap}.vxSrvServicePill i{width:7px;height:7px;border-radius:50%;background:#94a3b8;box-shadow:0 0 0 3px rgba(148,163,184,.08)}.vxSrvServicePill b{font-size:11px;font-weight:700}.vxSrvServicePill small{font-size:10px;opacity:.72}.vxSrvServicePill.is-ok i{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.12)}.vxSrvServicePill.is-warn i{background:#f59e0b;box-shadow:0 0 0 3px rgba(245,158,11,.12)}.vxSrvServicePill.is-bad i{background:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.12)}.vxSrvAvailabilityNotice{margin:0 18px 13px;padding:10px 12px;border:1px solid rgba(245,158,11,.23);border-radius:10px;background:rgba(245,158,11,.055);display:flex;gap:8px;align-items:flex-start;flex-direction:column}.vxSrvAvailabilityNotice b{font-size:12px}.vxSrvAvailabilityNotice span{font-size:11px;line-height:1.45;opacity:.76}.vxSrvAvailabilityNotice.is-api-down{border-color:rgba(239,68,68,.24);background:rgba(239,68,68,.055)}.vxDashError.is-api-down{border-color:rgba(239,68,68,.28)!important;background:rgba(239,68,68,.045)!important}.vxDashError.is-api-down small{max-width:680px;line-height:1.5}@media(max-width:720px){.vxSrvServiceStrip{padding:0 12px 11px;gap:5px}.vxSrvServicePill{padding:4px 7px}.vxSrvAvailabilityNotice{margin:0 12px 11px}}


.vxIntelPlayerNameLine{align-items:flex-start!important;flex-wrap:wrap!important}
.vxIntelPlayerNameLine .vxIntelPresenceBadge{max-width:100%!important}
.vxIntelIdentityNameRow .vxIntelPresenceBadge{max-width:100%!important}
.vxIntelOverviewCard>b{overflow-wrap:anywhere}