/* Panel v4 — "Instrument Console" identity, aligned with dbaas-enterprise
   (panel/DESIGN.md + panel-identity.css). Loaded last.
   Principles: instrument panel, not website. Neutrals carry the interface,
   one restrained teal accent for interaction, saturated colour only for
   status, density over whitespace, flat 3px surfaces, both themes designed.
   Logical properties only (RTL first). Vazirmatn comes from the existing sealed @font-face in styles.css; no CDN. */


:root{
  /* dbaas v3 neutral ground + teal accent (v3 tokens restated as authority) */
  --v3-canvas:#efefec;--v3-surface:#fafaf8;--v3-surface-2:#f4f4f1;--v3-surface-3:#e8e8e4;
  --v3-ink:#16191b;--v3-ink-2:#4a5054;--v3-ink-3:#7a8084;
  --v3-line:#dcddd8;--v3-line-strong:#c4c6c0;
  --v3-accent:#0a7c72;--v3-accent-strong:#075e57;--v3-accent-soft:#ddeeeb;
  --v3-r-sm:2px;--v3-r:3px;--v3-r-lg:3px;--radius:3px;--radius-sm:3px;
  --v3-e1:none;--v3-e2:0 8px 24px rgba(20,24,31,.10);
  --v3-sans:"Vazirmatn",system-ui,-apple-system,"Segoe UI",sans-serif;
  --v3-mono:ui-monospace,"Cascadia Mono",Consolas,monospace;
  --id-ctl:44px;--id-row:40px;
  --v4-side-w:248px;
  --v4-focus:0 0 0 2px var(--v3-surface),0 0 0 4px var(--v3-accent);
}
:root[data-theme="dark"]{
  --v3-canvas:#0f1113;--v3-surface:#15181b;--v3-surface-2:#1a1e21;--v3-surface-3:#22272b;
  --v3-ink:#e7e5e0;--v3-ink-2:#abafae;--v3-ink-3:#7c8283;
  --v3-line:#262b2f;--v3-line-strong:#343a3f;
  --v3-accent:#45c3b3;--v3-accent-strong:#6fd6c8;--v3-accent-soft:#102a27;
  --v3-e2:0 10px 30px rgba(0,0,0,.5);
}

/* ------------------------------------------------------------ base type */
html body,button,input,select,textarea{font-family:var(--v3-sans)!important}
body{background:var(--v3-canvas)!important;color:var(--v3-ink);font-size:14px;line-height:1.75;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
code,kbd,pre,samp,.mono{font-family:var(--v3-mono)!important}
h1,h2,h3{letter-spacing:0!important}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:none!important;box-shadow:var(--v4-focus)!important;border-radius:3px}
.sr-only{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
dialog:not([open]){display:none!important}

/* --------------------------------------------------------------- layout */
.layout{display:grid!important;grid-template-columns:var(--v4-side-w) minmax(0,1fr)!important;min-block-size:calc(100vh - 56px)}
#app-main{min-inline-size:0;padding:20px 24px 40px!important;max-inline-size:1480px}

/* ---------------------------------------------------------------- topbar */
.topbar{display:flex!important;align-items:center;flex-wrap:nowrap;gap:10px;block-size:56px;min-block-size:56px!important;padding:0 16px!important;
  background:var(--v3-surface)!important;border-block-end:1px solid var(--v3-line)!important;box-shadow:none!important;backdrop-filter:none!important;position:sticky;inset-block-start:0;z-index:40}
.topbar .brand{display:none!important}
.topbar .top-actions{display:flex;flex:1 1 auto;min-inline-size:0;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:nowrap}
.topbar .top-actions>*{flex:none}
.topbar .top-actions button,.topbar .user-context,.topbar .health{border-radius:3px!important}
.topbar .ghost.command-trigger,.topbar .command-trigger{order:-1;margin-inline-end:auto;min-inline-size:min(340px,32vw);justify-content:flex-start!important;gap:8px;
  border:1px solid var(--v3-line)!important;background:var(--v3-canvas)!important;color:var(--v3-ink-3)!important;block-size:36px;padding-inline:10px!important}
.topbar .command-trigger kbd{margin-inline-start:auto;border:1px solid var(--v3-line);border-radius:3px;padding:0 6px;font-size:11px;color:var(--v3-ink-3);background:var(--v3-surface)}
.topbar .ghost.compact,.topbar .ghost{border:1px solid transparent!important;background:transparent!important;color:var(--v3-ink-2)!important;block-size:34px}
.topbar .ghost:hover{background:var(--v3-surface-2)!important;color:var(--v3-ink)!important}
.topbar .v3-chip{border:1px solid var(--v3-line)!important;background:transparent!important;border-radius:3px!important;block-size:30px;font-size:12px;color:var(--v3-ink-2)!important}
.topbar .health{max-inline-size:170px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px}
.topbar .user-context{max-inline-size:170px;overflow:hidden;padding-inline:10px;border-inline-start:1px solid var(--v3-line)}
.topbar .user-context strong,.topbar .user-context small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.topbar .user-context small{font-family:var(--v3-mono);font-size:10.5px;color:var(--v3-ink-3)}
#logout{color:var(--v3-bad)!important}
/* Workspace scope (organisation › project) — compact control like dbaas, popover when narrow. */
.topbar .scope-toggle{border:1px solid var(--v3-line)!important;background:var(--v3-surface)!important}
.workspace-scope{display:none!important}
body.scope-open .workspace-scope{display:flex!important;position:absolute;inset-block-start:calc(100% + 4px);inset-inline-start:16px;z-index:60;flex-wrap:wrap;gap:10px;
  padding:14px;inline-size:min(560px,calc(100vw - 32px));background:var(--v3-surface);border:1px solid var(--v3-line-strong);border-radius:3px;box-shadow:var(--v3-e2)}
body.scope-open .workspace-scope label{flex:1 1 160px;min-inline-size:0}
body.scope-open .workspace-scope select,body.scope-open .workspace-scope input{inline-size:100%;max-inline-size:none}

/* --------------------------------------------------------------- sidebar */
.sidebar{inline-size:auto!important;min-inline-size:0;background:var(--v3-surface)!important;color:var(--v3-ink)!important;border-inline-end:1px solid var(--v3-line)!important;
  padding:0 0 12px!important;display:flex;flex-direction:column;gap:0;position:sticky;inset-block-start:56px;block-size:calc(100vh - 56px);overflow-y:auto;box-shadow:none!important}
.sidebar .v4-side-brand{display:flex!important;align-items:center;gap:10px;padding:14px 16px!important;margin:0!important;border:0!important;border-block-end:1px solid var(--v3-line)!important;background:transparent!important}
.v4-side-brand .brand-mark{inline-size:34px;block-size:34px;display:grid;place-items:center;border-radius:3px;background:var(--v3-ink);color:var(--v3-surface);font-weight:800;font-size:12px;flex:none}
.v4-side-brand strong{display:block;font-size:14.5px;color:var(--v3-ink)!important;line-height:1.3}
.v4-side-brand small{display:block;font-size:11.5px;color:var(--v3-ink-3)!important}
.sidebar .primary-create{margin:14px 14px 6px!important;inline-size:auto!important;min-block-size:38px;border-radius:3px!important;background:var(--v3-accent)!important;color:#fff!important;border:0!important;box-shadow:none!important;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px}
.sidebar .primary-create:hover{background:var(--v3-accent-strong)!important}
.v4-nav{display:flex;flex-direction:column;gap:2px;padding:0 8px}
.v4-nav .v3-nav-group{margin:0;padding:0;border:0}
.v4-nav .v3-nav-caption,.v4-nav .v3-nav-toggle{display:flex;align-items:center;justify-content:space-between;inline-size:100%;padding:14px 10px 4px!important;margin:0;
  font-size:11.5px!important;font-weight:600!important;color:var(--v3-ink-3)!important;background:none!important;border:0!important;text-transform:none;letter-spacing:0}
.v4-nav .v3-nav-toggle:hover{color:var(--v3-ink)!important}
.v4-nav .v3-nav-group.collapsed .v3-nav-items{display:none}
.v4-nav .v3-nav-items{display:flex;flex-direction:column;gap:1px}
.sidebar .v4-nav .nav-item{position:relative;display:flex!important;align-items:center;gap:10px;inline-size:100%;min-block-size:36px;padding:6px 10px!important;margin:0!important;
  border:0!important;border-radius:3px!important;background:transparent!important;color:var(--v3-ink-2)!important;box-shadow:none!important;font-size:13.5px;font-weight:500;text-align:start;text-decoration:none;opacity:1!important}
.sidebar .v4-nav .nav-item::before,.sidebar .v4-nav .nav-item::after{content:none!important;display:none!important}
.sidebar .v4-nav .nav-item:hover{background:var(--v3-surface-2)!important;color:var(--v3-ink)!important}
.sidebar .v4-nav .nav-item.active{background:var(--v3-accent-soft)!important;color:var(--v3-ink)!important;font-weight:600}
.sidebar .v4-nav .nav-item.active::after{content:""!important;display:block!important;position:absolute;inset-block:6px;inset-inline-start:-8px;inline-size:2px;background:var(--v3-accent)}
.sidebar .v4-nav .v3-nav-icon{inline-size:20px;block-size:20px;display:inline-grid;place-items:center;background:transparent!important;border:0!important;flex:none}
.sidebar .v4-nav .v3-nav-label{color:inherit!important}
.v4-ico{inline-size:17px;block-size:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.sidebar .v4-nav .nav-item.active .v4-ico{color:var(--v3-accent)}
.sidebar-footer{margin-block-start:auto;padding:10px 16px 0!important;border-block-start:1px solid var(--v3-line)!important;color:var(--v3-ink-3);font-size:11px;display:flex;align-items:center;gap:8px;background:transparent!important}
.sidebar-footer .v3-rail-toggle{color:var(--v3-ink-2)!important;background:transparent!important;border:1px solid var(--v3-line)!important;border-radius:3px}
html.v3-rail .layout{grid-template-columns:64px minmax(0,1fr)!important}
html.v3-rail .sidebar .v3-nav-label,html.v3-rail .sidebar .v3-nav-caption,html.v3-rail .sidebar .v3-nav-toggle,html.v3-rail .v4-side-brand div:not(.brand-mark),html.v3-rail .sidebar-footer span,html.v3-rail .sidebar .primary-create span:last-child{display:none!important}
html.v3-rail .sidebar .v4-nav .nav-item{justify-content:center}
html.v3-rail .sidebar .primary-create{margin-inline:10px!important}

/* ----------------------------------------------------- page header (flat) */
.v4-breadcrumb{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11.5px;color:var(--v3-ink-3);margin:0 0 6px}
.v4-breadcrumb strong{color:var(--v3-ink-2);font-weight:500}
.page-hero{display:flex!important;align-items:flex-end!important;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 16px!important;padding:0 0 14px!important;
  background:transparent!important;border:0!important;border-block-end:1px solid var(--v3-line)!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important}
.page-hero::before,.page-hero::after{content:none!important;display:none!important}
.page-hero h1{font-size:24px!important;font-weight:700!important;line-height:1.35!important;margin:0!important;color:var(--v3-ink)!important}
.page-hero p{margin:4px 0 0!important;color:var(--v3-ink-2)!important;font-size:13px!important;max-inline-size:78ch}
.page-hero .eyebrow{display:none!important}
.page-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ------------------------------------------------------------- surfaces */
.panel,section.panel,.panel-card,.card,.metric-card,.quick-hub-btn,.workflow-guide{background:var(--v3-surface)!important;border:1px solid var(--v3-line)!important;border-radius:3px!important;box-shadow:none!important}
:root[data-theme="dark"] .panel,:root[data-theme="dark"] section.panel{border-color:var(--v3-line)!important}
.panel,section.panel{padding:16px 18px!important;margin-block-end:14px}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:0 0 12px!important;margin:0 0 12px!important;border-block-end:1px solid var(--v3-line)!important}
.panel-head h2,.section-head h2,.panel h2{font-size:15.5px!important;font-weight:600!important;margin:0!important;color:var(--v3-ink)!important}
.panel-head p{font-size:12.5px!important;color:var(--v3-ink-2)!important;margin:3px 0 0!important}
.panel.v4-flash{box-shadow:0 0 0 2px var(--v3-accent)!important}
.v4-tab-off{display:none!important}

/* -------------------------------------------------------------- buttons */
button.primary,.primary:not(.primary-create){background:var(--v3-accent)!important;border:1px solid var(--v3-accent)!important;color:#fff!important;border-radius:3px!important;box-shadow:none!important;min-block-size:var(--id-ctl);font-weight:600}
button.primary:hover{background:var(--v3-accent-strong)!important;border-color:var(--v3-accent-strong)!important}
button.secondary,.button.secondary{background:var(--v3-surface)!important;border:1px solid var(--v3-line-strong)!important;color:var(--v3-ink)!important;border-radius:3px!important;box-shadow:none!important;min-block-size:var(--id-ctl)}
button.secondary:hover{background:var(--v3-surface-2)!important;border-color:var(--v3-ink-3)!important}
button.danger,.danger-button{border-radius:3px!important}
input,select,textarea{border-radius:3px!important;border:1px solid var(--v3-line-strong)!important;background:var(--v3-surface)!important;color:var(--v3-ink)!important;min-block-size:var(--id-ctl)}
input:focus,select:focus,textarea:focus{border-color:var(--v3-accent)!important}

/* ---------------------------------------------------------------- tables */
.table-wrap{border:1px solid var(--v3-line);border-radius:3px;overflow:auto;background:var(--v3-surface)}
.panel .table-wrap{border:0}
table{border-collapse:collapse;inline-size:100%}
table thead th{background:transparent!important;color:var(--v3-ink-3)!important;font-size:12px!important;font-weight:600!important;text-align:start;border-block-end:1px solid var(--v3-line)!important;padding:8px 10px!important;white-space:nowrap}
table tbody td{border-block-end:1px solid var(--v3-line)!important;padding:9px 10px!important;block-size:var(--id-row)}
table tbody tr:hover{background:var(--v3-surface-2)!important}

/* --------------------------------------------------------- overview KPIs */
.cards.overview-metrics{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;gap:0!important;border:1px solid var(--v3-line);border-radius:3px;background:var(--v3-surface);overflow:hidden;margin-block-end:14px}
.overview-metrics .metric-card{border:0!important;border-inline-start:1px solid var(--v3-line)!important;border-radius:0!important;padding:12px 16px!important;min-block-size:0!important}
.overview-metrics .metric-card:first-child{border-inline-start:0!important}
.overview-metrics .metric-icon{display:none!important}
.overview-metrics .metric-card strong,.overview-metrics .metric-card .metric-value{font-family:var(--v3-mono)!important;font-size:26px!important;font-weight:500!important;line-height:1.15}
.quick-hub-grid{gap:10px!important}
.quick-hub-btn{text-align:start!important;padding:12px 14px!important;display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center}
.quick-hub-btn:hover{border-color:var(--v3-ink-3)!important;background:var(--v3-surface-2)!important}
.quick-hub-icon{grid-row:1/3;inline-size:34px;block-size:34px;display:grid;place-items:center;border:1px solid var(--v3-line);border-radius:3px;font-size:16px;filter:grayscale(1);opacity:.75}
.quick-hub-btn strong{font-size:13.5px}.quick-hub-btn small{color:var(--v3-ink-3);font-size:12px}
.workflow-guide{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:10px 14px!important;margin-block-end:14px;border-inline-start:2px solid var(--v3-accent)!important}
.workflow-guide ol{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;padding:0;list-style:none;min-inline-size:0}
.workflow-guide,.workflow-guide *{box-sizing:border-box;max-inline-size:100%}
.workflow-guide li,.workflow-guide p{min-inline-size:0;overflow-wrap:anywhere;white-space:normal}

/* ------------------------------------------------------- workspace tabs */
.v4-tabs{display:flex;flex-wrap:wrap;gap:2px;border-block-end:1px solid var(--v3-line);margin:0 0 14px;padding:0}
.v4-tabs button{flex:none;background:transparent!important;border:0!important;border-block-end:2px solid transparent!important;border-radius:0!important;box-shadow:none!important;
  padding:9px 14px!important;color:var(--v3-ink-2)!important;font-size:13px;font-weight:500;white-space:nowrap;min-block-size:0;cursor:pointer}
.v4-tabs button:hover{color:var(--v3-ink)!important}
.v4-tabs button[aria-selected="true"]{color:var(--v3-ink)!important;font-weight:600;border-block-end-color:var(--v3-accent)!important}
/* site workspace tab bar wraps like .v4-tabs instead of clipping (1440 and 375) */
.site-workspace-tabs{flex-wrap:wrap!important;overflow:visible!important;gap:2px!important;padding:0!important;border-block-end:1px solid var(--v3-line)!important;margin:0 0 14px!important}
.site-workspace-tab-btn{flex:none;padding:9px 12px!important;font-size:13px!important;margin-block-end:-1px!important;border-block-end-width:2px!important;min-block-size:0;border-radius:0!important}
.site-workspace-tab-btn .tab-icon{font-size:14px!important}
.site-workspace-tab-btn.active{color:var(--v3-ink)!important;border-block-end-color:var(--v3-accent)!important}
.site-role-notice,.site-provisioning-callout{margin-block-end:14px}
.site-provisioning-callout{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.site-provisioning-callout p{margin:4px 0 0}
.site-lifecycle-actions-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr))!important}
.site-lifecycle-actions-grid .action-tile{min-inline-size:0;overflow-wrap:anywhere;box-sizing:border-box}
@media (max-width:640px){.site-workspace-tab-btn{flex:1 1 auto;justify-content:center;padding:8px 10px!important}}

/* ---------------------------------------------- create-site step wizard */
.wizard-stepper{display:flex!important;gap:0!important;border-block-end:1px solid var(--v3-line);background:transparent!important;padding:0!important;margin:0 0 16px!important;overflow-x:auto}
.wizard-step-tab{flex:1 1 0;display:flex!important;align-items:center;gap:8px;justify-content:center;background:transparent!important;border:0!important;border-block-end:2px solid transparent!important;border-radius:0!important;
  padding:10px 12px!important;color:var(--v3-ink-3)!important;box-shadow:none!important;white-space:nowrap}
.wizard-step-tab.active{color:var(--v3-ink)!important;border-block-end-color:var(--v3-accent)!important;font-weight:600}
.wizard-step-tab .step-num{inline-size:auto!important;block-size:auto!important;background:transparent!important;border:0!important;color:inherit!important;font-family:var(--v3-mono);font-size:12px}
.wizard-actions{border-block-start:1px solid var(--v3-line);padding-block-start:12px!important;margin-block-start:16px}
dialog{border-radius:3px!important;border:1px solid var(--v3-line-strong)!important;background:var(--v3-surface)!important;color:var(--v3-ink)!important;box-shadow:var(--v3-e2)!important}
dialog::backdrop{background:rgba(15,17,19,.45)}

/* ------------------------------------------------------- status language */
.badge,.v3-chip,.status{border-radius:3px!important}
.status-dot,.health-dot{border-radius:50%}

/* ------------------------------------------------ Control Center (settings) */
.v4-hub-search input{min-inline-size:min(320px,80vw);border-radius:3px!important}
.v4-hub-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0;border:1px solid var(--v3-line);border-radius:3px;background:var(--v3-surface);margin-block-end:18px;overflow:hidden}
.v4-hub-stats>div{padding:12px 16px;border-inline-start:1px solid var(--v3-line);display:flex;align-items:baseline;gap:8px}
.v4-hub-stats>div:first-child{border-inline-start:0}
.v4-hub-stats strong{font-family:var(--v3-mono);font-size:24px;font-weight:500;color:var(--v3-ink)}
.v4-hub-stats span{color:var(--v3-ink-3);font-size:12.5px}
.v4-hub-group{margin-block-end:20px}
.v4-hub-group>h2{display:flex;align-items:center;gap:10px;font-size:12px!important;font-weight:600!important;color:var(--v3-ink-3)!important;margin:0 0 8px!important}
.v4-hub-group>h2::after{content:"";flex:1;block-size:1px;background:var(--v3-line)}
.v4-hub-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px}
.v4-hub-card{background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:3px;padding:12px;display:flex;flex-direction:column;gap:8px}
.v4-hub-card:hover{border-color:var(--v3-line-strong)}
.v4-hub-card-head{display:flex;align-items:center;gap:10px;background:none!important;border:0!important;padding:0!important;color:var(--v3-ink)!important;text-align:start;cursor:pointer;text-decoration:none;font:inherit;box-shadow:none!important;min-block-size:0}
.v4-hub-card-head .v4-ico{inline-size:32px;block-size:32px;padding:7px;border:1px solid var(--v3-line);border-radius:3px;color:var(--v3-accent)}
.v4-hub-card-head span{display:flex;flex-direction:column}
.v4-hub-card-head small{color:var(--v3-ink-3);font-size:11.5px}
.v4-hub-sections{list-style:none;margin:0;padding:0;border-block-start:1px solid var(--v3-line)}
.v4-hub-sections li{border-block-end:1px solid var(--v3-line)}
.v4-hub-sections li:last-child{border-block-end:0}
.v4-hub-sections button{inline-size:100%;text-align:start;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:6px 2px!important;color:var(--v3-ink-2)!important;font-size:13px;cursor:pointer;display:flex;justify-content:space-between;gap:8px;min-block-size:0}
.v4-hub-sections button:hover{color:var(--v3-accent)!important}
.v4-tag{font-size:10.5px;padding:0 6px;border:1px solid var(--v3-line-strong);border-radius:3px;color:var(--v3-ink-3);flex:none}
.v4-hub-actions{display:flex;flex-wrap:wrap;gap:6px}
.v4-chip-btn{border:1px solid var(--v3-line-strong)!important;background:var(--v3-surface)!important;color:var(--v3-ink-2)!important;border-radius:3px!important;padding:3px 9px!important;font-size:12px;cursor:pointer;min-block-size:0;box-shadow:none!important}
.v4-chip-btn:hover{border-color:var(--v3-accent)!important;color:var(--v3-accent)!important}

/* ------------------------------------------------------------ responsive */
/* Keep the queue/controllers/notifications labels readable on common laptop widths;
   below this they collapse to their dot/icon and keep the title as the name. */
@media (max-width:1400px){
  .topbar .ghost.command-trigger,.topbar .command-trigger{min-inline-size:200px}
}
@media (max-width:1180px){
  #topbar-queue-text,#topbar-autopilot-text,.notification-trigger [data-i18n="notifications"]{display:none}
}
@media (max-width:1240px){
  .topbar .health>span:not(.health-dot),.topbar .user-context small,.command-trigger kbd{display:none}
  .topbar .command-trigger{min-inline-size:180px}
}
@media (max-width:960px){
  .layout{grid-template-columns:1fr!important}
  .sidebar{position:fixed!important;inset-block:56px 0;inset-inline-start:0;inline-size:min(300px,86vw)!important;block-size:auto;z-index:80;transform:translateX(110%);transition:transform .2s ease}
  [dir="ltr"] .sidebar{transform:translateX(-110%)}
  body.sidebar-open .sidebar{transform:none}
  .topbar .top-actions{justify-content:flex-start;overflow-x:auto;scrollbar-width:none}
  .topbar .command-trigger{min-inline-size:0;margin-inline-end:0}
  .command-trigger [data-i18n="quickSearch"]{display:none}
  .topbar .mode-toggle,.topbar .user-context{display:none}
  #topbar-autopilot-chip,#topbar-queue-chip{flex:none;min-block-size:44px}
  .sidebar .v4-nav .nav-item{min-block-size:44px}
  .v4-tabs button{min-block-size:44px}
  #app-main{padding:14px 14px 32px!important}
  .page-hero h1{font-size:20px!important}
}
@media (prefers-reduced-motion:reduce){.sidebar{transition:none}}
/* Quick search reads as a search field (id selector beats legacy .ghost rules). */
.topbar #command-trigger{border:1px solid var(--v3-line)!important;background:var(--v3-canvas)!important;color:var(--v3-ink-3)!important;display:flex!important;align-items:center;gap:8px;justify-content:flex-start!important}
.topbar #command-trigger:hover{border-color:var(--v3-line-strong)!important}
.topbar #command-trigger kbd{margin-inline-start:auto}
@media (max-width:960px){.sidebar-scrim{z-index:70}}
/* Touch targets (WCAG 2.5.8 / repo gate): icon controls inside forms stay ≥44px. */
.toggle-password-btn{min-inline-size:44px;min-block-size:44px}
#toggle-password-btn,#btn-alt-totp,#btn-alt-token,#btn-autofill-admin{min-block-size:44px!important;min-inline-size:44px;block-size:auto!important}
dialog button,dialog select,dialog input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]){min-block-size:44px!important}

/* ------------------------------------------------------------ login (v4)
   dbaas-enterprise login anatomy: brand/pitch half + flat sign-in card. */
dialog.v4-login[open]{position:fixed;inset:0;inline-size:100vw;block-size:100dvh;max-inline-size:none!important;max-block-size:none!important;margin:0;padding:0!important;
  border:0!important;border-radius:0!important;box-shadow:none!important;background:var(--v3-canvas)!important;display:block!important;overflow:auto}
dialog.v4-login::backdrop{background:var(--v3-canvas)}
.v4-login-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-block-size:100dvh}
.v4-login-pitch{order:2;display:flex;flex-direction:column;gap:32px;padding:44px clamp(24px,6vw,88px);background:var(--v3-surface);border-inline-start:1px solid var(--v3-line)}
.v4-login-brand{display:flex;align-items:center;gap:12px}
.v4-login-brand .brand-mark{inline-size:42px;block-size:42px;display:grid;place-items:center;border-radius:3px;background:var(--v3-ink);color:var(--v3-surface);font-weight:800;font-size:13px}
.v4-login-brand strong{display:block;font-size:16px}
.v4-login-brand small{display:block;color:var(--v3-ink-3);font-size:12px}
.v4-login-pitch-copy{margin-block:auto;max-inline-size:560px}
.v4-login-pitch-copy h1{font-size:clamp(24px,2.6vw,32px);font-weight:700;margin:0 0 8px;line-height:1.4}
.v4-login-pitch-copy>p{color:var(--v3-ink-2);margin:0 0 24px}
.v4-login-caps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:24px;border-block-start:1px solid var(--v3-line)}
.v4-login-caps li{display:flex;align-items:center;gap:10px;padding:10px 0;border-block-end:1px solid var(--v3-line);font-size:13.5px}
.v4-login-cap-code{inline-size:30px;block-size:24px;display:grid;place-items:center;border:1px solid var(--v3-line);border-radius:3px;background:var(--v3-surface-2);font-family:var(--v3-mono);font-size:11px;color:var(--v3-ink-3)}
.v4-login-foot{margin:0;color:var(--v3-ink-3);font-size:12px}
.v4-login-panel{order:1;display:grid;place-items:center;padding:32px 20px}
.v4-login-card{inline-size:min(420px,100%);background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:3px;padding:24px 28px 20px;display:flex;flex-direction:column;gap:6px}
.v4-login-toggles{display:flex;gap:6px;justify-content:flex-start;margin-block-end:14px}
.v4-login-toggles button{min-inline-size:44px;min-block-size:44px;border:1px solid var(--v3-line)!important;border-radius:3px!important;background:transparent!important;color:var(--v3-ink-2)!important}
.v4-login-card h2{font-size:22px!important;font-weight:700!important;margin:0!important}
.v4-login-card>p{margin:0 0 10px;color:var(--v3-ink-2);font-size:13px}
.v4-login-health{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--v3-ink-2);padding:8px 10px;border:1px solid var(--v3-line);border-radius:3px;background:var(--v3-surface-2);margin-block-end:12px}
.v4-login-health i{inline-size:8px;block-size:8px;border-radius:50%;background:var(--v3-ink-3);flex:none}
.v4-login-health[data-state="ok"] i{background:var(--v3-ok)}
.v4-login-health[data-state="bad"]{border-color:color-mix(in srgb,var(--v3-bad) 40%,var(--v3-line));color:var(--v3-bad)}
.v4-login-health[data-state="bad"] i{background:var(--v3-bad);border-radius:1px}
#bootstrap-auth-form{display:flex;flex-direction:column;gap:12px}
#bootstrap-auth-form .field-stack{display:flex;flex-direction:column;gap:6px;font-size:12.5px;color:var(--v3-ink-2);font-weight:600}
.v4-input{direction:ltr;position:relative;display:flex;align-items:center;border:1px solid var(--v3-line-strong);border-radius:3px;background:var(--v3-surface)}
.v4-input:focus-within{border-color:var(--v3-accent);box-shadow:0 0 0 3px var(--v3-accent-soft)}
.v4-input>.v4-ico{position:absolute;left:12px;color:var(--v3-ink-3);pointer-events:none}
.v4-input input{flex:1;min-inline-size:0;border:0!important;background:transparent!important;box-shadow:none!important;padding:0 12px 0 40px!important;text-align:left;direction:ltr;min-block-size:44px;font-size:14px;color:var(--v3-ink)}
.v4-input input:focus{outline:none}
.v4-input-btn{flex:none;min-inline-size:44px;min-block-size:44px;display:grid;place-items:center;border:0!important;border-left:1px solid var(--v3-line)!important;background:transparent!important;color:var(--v3-ink-3)!important;border-radius:0!important}
.v4-input-btn[aria-pressed="true"]{color:var(--v3-accent)!important}
.v4-login-remember{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--v3-ink-2);min-block-size:44px}
.v4-login-remember input{inline-size:18px;block-size:18px;min-block-size:0!important;accent-color:var(--v3-accent)}
.v4-login-submit{inline-size:100%;min-block-size:44px!important;font-size:14px}
.v4-login-switch{align-self:center;background:none!important;border:0!important;color:var(--v3-accent)!important;font-size:13px;min-block-size:44px!important;box-shadow:none!important}
.v4-login-switch:hover{text-decoration:underline}
.v4-login-users{margin-block-start:10px;border-block-start:1px solid var(--v3-line);padding-block-start:10px;font-size:12.5px;color:var(--v3-ink-2)}
.v4-login-users summary{cursor:pointer;min-block-size:44px;display:flex;align-items:center;color:var(--v3-ink)}
.v4-login-users p{margin:0;line-height:1.9}
#bootstrap-auth-error:empty{display:none}
#bootstrap-auth-error{color:var(--v3-bad);font-size:13px;border-inline-start:2px solid var(--v3-bad);padding-inline-start:8px}
@media (max-width:900px){
  .v4-login-shell{grid-template-columns:1fr}
  .v4-login-pitch{order:1;gap:16px;padding:20px;border-inline-start:0;border-block-end:1px solid var(--v3-line)}
  .v4-login-pitch-copy{margin:0}
  .v4-login-caps,.v4-login-foot,.v4-login-pitch-copy>p{display:none}
  .v4-login-pitch-copy h1{font-size:20px;margin:0}
  .v4-login-panel{order:2;place-items:start center;padding:20px 16px}
}
.v4-login-card,.v4-login-card *{box-sizing:border-box}
.v4-login-brand .brand-mark::before,.v4-login-brand .brand-mark::after,.v4-side-brand .brand-mark::before,.v4-side-brand .brand-mark::after{content:none!important;display:none!important}
/* Theme toggles: icon drawn in CSS (the ◐/☀ glyphs are missing from Vazirmatn). */
#login-theme-toggle,#theme-toggle{font-size:0!important;position:relative}
#login-theme-toggle::before,#theme-toggle::before{content:"";inline-size:16px;block-size:16px;border-radius:50%;border:1.6px solid currentColor;background:linear-gradient(90deg,currentColor 50%,transparent 50%);display:block;margin:auto}
#theme-toggle{min-inline-size:44px}
.v4-login-panel{grid-template-columns:minmax(0,1fr);justify-items:center}.v4-login-card{max-inline-size:100%;min-inline-size:0}

/* Error presentation: human message first, exact technical detail on demand. */
.toast-details,.error-technical{margin-block-start:6px;font-size:12px}
.toast-details summary,.error-technical summary{cursor:pointer;color:inherit;opacity:.85;min-block-size:28px;display:flex;align-items:center}
.toast-details code,.error-technical code{display:block;direction:ltr;text-align:start;unicode-bidi:isolate;white-space:pre-wrap;word-break:break-word;font-size:11.5px;padding:6px 8px;margin-block-start:4px;border-radius:3px;background:color-mix(in srgb,currentColor 8%,transparent)}
.toast.error{max-inline-size:min(560px,calc(100vw - 32px))}
.toast{display:flex!important;flex-direction:column;align-items:stretch!important;gap:4px;background:var(--v3-surface)!important;color:var(--v3-ink)!important;border:1px solid var(--v3-line-strong)!important;border-inline-start:3px solid var(--v3-accent)!important;border-radius:3px!important;box-shadow:var(--v3-e2)!important;max-inline-size:min(520px,calc(100vw - 32px))}
.toast.error{border-inline-start-color:var(--v3-bad)!important}
.toast.error .toast-message::before{content:"";display:inline-block;inline-size:8px;block-size:8px;border-radius:1px;background:var(--v3-bad);margin-inline-end:8px;vertical-align:middle}
.toast.hidden{display:none!important}
.toast-details code{background:var(--v3-surface-2)!important;border:1px solid var(--v3-line)}

/* Until authentication resolves, render only the neutral canvas (and any
   dialog such as sign-in), so a reload never flashes the panel first. */
body.auth-pending > *:not(dialog):not(.toast):not(#toast){visibility:hidden!important}

/* Platform branding (web/modules/branding.js): uploaded logos render inside the brand mark. */
.brand-mark.has-logo{background:transparent!important;padding:0;overflow:hidden}
.brand-mark.has-logo img.brand-logo{inline-size:100%;block-size:100%;object-fit:contain;display:block}
.brand-footer-line{display:block;color:var(--v3-ink-3);font-size:12px;margin-block-start:4px;overflow-wrap:anywhere}
.brand-footer-line a{color:var(--v3-accent)}

/* Platform settings (web/modules/route-platform-settings.js) inside the settings hub. */
.platform-settings{margin-block-end:18px}
.ps-tabs{display:flex;gap:2px;overflow-x:auto;border-block-end:1px solid var(--v3-line);margin:8px 0 14px}
.ps-tabs button{flex:none;background:transparent!important;border:0!important;border-block-end:2px solid transparent!important;border-radius:0!important;box-shadow:none!important;color:var(--v3-ink-3)!important;padding:8px 12px;min-block-size:44px}
.ps-tabs button[aria-selected="true"]{color:var(--v3-ink)!important;font-weight:600;border-block-end-color:var(--v3-accent)!important}
.ps-state:empty{display:none}
.ps-state{padding:8px 12px;border:1px solid var(--v3-line);border-radius:3px;margin-block-end:12px;background:var(--v3-surface-2)}
.ps-state[data-state="error"],.ps-state[data-state="forbidden"],.ps-state[data-state="unavailable"]{border-inline-start:3px solid var(--v3-bad)}
.ps-brand-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:18px;align-items:start}
.ps-form{margin-block-end:18px}
.ps-form h3{margin:0 0 4px;font-size:15px}
.ps-check{display:flex;align-items:center;gap:8px;min-block-size:44px}
.ps-color{display:flex;gap:8px;align-items:center}
.ps-color input[type="color"]{inline-size:44px;block-size:40px;padding:2px}
.ps-meta,.ps-status{color:var(--v3-ink-3);font-size:12px;margin:6px 0}
.ps-contrast{font-size:13px;margin:6px 0;padding:6px 10px;border-radius:3px;border-inline-start:3px solid var(--v3-line)}
.ps-contrast[data-state="ok"]{border-inline-start-color:var(--v3-ok);background:var(--v3-ok-soft)}
.ps-contrast[data-state="error"]{border-inline-start-color:var(--v3-bad)}
.ps-actions{display:flex;gap:8px;justify-content:flex-end}
.ps-preview{position:sticky;inset-block-start:12px;display:grid;gap:10px}
.ps-preview h3{margin:0;font-size:14px}
.ps-preview-stage{border:1px solid var(--v3-line);border-radius:3px;padding:14px;background:#fafaf8;color:#1d2125;display:grid;gap:8px}
.ps-preview-dark{background:#15181b;color:#e7e9ea;border-color:#2c3136}
.ps-pv-brand{display:flex;align-items:center;gap:10px}
.ps-pv-mark{inline-size:36px;block-size:36px;display:grid;place-items:center;border-radius:3px;background:#1d2125;font-weight:800;font-size:11px;overflow:hidden}
.ps-pv-mark,.ps-pv-mark *{color:#fafaf8}
.ps-preview-dark .ps-pv-mark{background:#e7e9ea}
.ps-preview-dark .ps-pv-mark,.ps-preview-dark .ps-pv-mark *{color:#15181b}
.ps-pv-mark img{inline-size:100%;block-size:100%;object-fit:contain;background:#fff}
.ps-pv-head{margin:0;font-weight:600}
.ps-pv-button{display:inline-block;justify-self:start;background:var(--ps-accent);color:#fff;padding:6px 14px;border-radius:3px;font-weight:600}
.ps-preview-dark .ps-pv-button{color:#15181b}
.ps-pv-link{color:var(--ps-accent);text-decoration:underline}
.ps-pv-foot{font-size:11px;opacity:.8}
.ps-asset-current{display:flex;flex-wrap:wrap;gap:12px;margin:8px 0}
.ps-asset{margin:0;display:grid;gap:4px;justify-items:start}
.ps-asset img{max-inline-size:160px;max-block-size:64px;object-fit:contain;border:1px solid var(--v3-line);background:#fff;padding:4px}
.ps-asset figcaption,.ps-asset-empty{font-size:12px;color:var(--v3-ink-3);margin:0}
#ps-security-table td{vertical-align:top}
@media (max-width:900px){.ps-brand-layout{grid-template-columns:1fr}.ps-preview{position:static}}
.stress-card.active{border-color:var(--primary)!important;background:var(--primary-soft)!important;box-shadow:0 0 0 1px var(--primary)}

/* ------------------------------------------------------------ on-call shell signals */
/* Topbar chip: danger tone only when firing critical alerts are read from the API. */
.topbar .health.danger{color:var(--v3-bad)!important;border-color:color-mix(in srgb,var(--v3-bad) 35%,var(--v3-line))!important;cursor:pointer}
.topbar .health.danger .health-dot{background:var(--v3-bad)}
.topbar .health.danger:focus-visible{outline:2px solid var(--v3-accent);outline-offset:2px}
/* Firing-alert count on the Alerts nav item. */
.sidebar .v3-nav-badge{margin-inline-start:auto;min-inline-size:20px;block-size:20px;padding:0 6px;border-radius:999px;display:inline-grid;place-items:center;font-size:11px;font-weight:600;background:var(--v3-warn);color:#fff;flex:none}
.sidebar .v3-nav-badge.danger{background:var(--v3-bad)}
html.v3-rail .sidebar .v3-nav-badge{position:absolute;inset-block-start:2px;inset-inline-end:2px;min-inline-size:16px;block-size:16px;font-size:10px;padding:0 4px}
/* Simple mode: advanced-only nav items carry .hidden; beat the nav-item display rule. */
.sidebar .v4-nav .nav-item.hidden{display:none!important}
/* Mode toggle states its state with aria-pressed and one stable label. */
#mode-toggle[aria-pressed="true"]{color:var(--v3-accent)!important;border-color:var(--v3-accent)!important}
/* Mobile drawer: account, theme, language and mode controls moved here by ui-primitives.js. */
.sidebar-shell-controls{display:flex;flex-wrap:wrap;gap:6px;inline-size:100%;padding-block:8px}
.sidebar-shell-controls[hidden]{display:none}
@media (max-width:960px){
  /* 375px: the search trigger collapses to its icon so the bell and status chip stay on screen. */
  .topbar .ghost.command-trigger,.topbar #command-trigger{min-inline-size:0}
  .sidebar-footer{flex-wrap:wrap}
  .sidebar-shell-controls .user-context{display:block;flex:1 1 100%;max-inline-size:none;overflow:hidden;padding:4px 0;border:0}
  .sidebar-shell-controls .user-context strong,.sidebar-shell-controls .user-context small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .sidebar-shell-controls .user-context small{font-size:11px;color:var(--v3-ink-3)}
  .sidebar-shell-controls button{min-block-size:40px;flex:1 1 auto}
  .sidebar-shell-controls .mode-toggle{display:inline-flex;inline-size:auto;min-inline-size:0;font-size:13px;padding-inline:10px}
  .sidebar-shell-controls .mode-toggle::before{content:none}
  .sidebar-shell-controls .hidden{display:none!important}
}

/* Customer panel: wizard facts, DNS record details, onboarding, mobile table cards */
.wizard-facts{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:10px}
.wizard-facts li{border:1px solid var(--v3-line);border-radius:10px;padding:10px 12px;line-height:1.7}
.wizard-facts li strong{display:block;margin-block-end:2px}
.preflight-checks-list li[data-review="warn"] .pf-icon{color:var(--v3-warn)}
.preflight-checks-list li[data-review="ok"] .pf-icon{color:var(--v3-ok)}
.dns-record-details{margin-block-start:6px}
.dns-record-details summary{cursor:pointer;font-size:13px}
.dns-record{display:grid;grid-template-columns:max-content 1fr;gap:4px 10px;margin:6px 0 0;font-size:13px}
.dns-record dt{color:var(--v3-ink-3,#64748b)}
.dns-record dd{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;word-break:break-all}
.onboarding-steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;counter-reset:onb}
.onboarding-steps li{counter-increment:onb;border:1px solid var(--v3-line);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.onboarding-steps li strong::before{content:counter(onb) ". "}
[dir="rtl"] .onboarding-steps li strong::before{content:counter(onb, persian) ". "}
.onboarding-steps li small{color:var(--v3-ink-3,#64748b);line-height:1.7}
.field-help{display:block;font-size:12px;color:var(--v3-ink-3,#64748b);margin-block-start:4px;line-height:1.6}
@media (max-width:640px){
  .table-wrap:has(> table.mobile-cards){border:0;background:transparent;overflow:visible}
  table.mobile-cards,table.mobile-cards tbody,table.mobile-cards tr,table.mobile-cards td{display:block;inline-size:100%;min-inline-size:0!important;max-inline-size:100%;box-sizing:border-box}
  table.mobile-cards td{position:static!important;box-shadow:none!important;background:transparent!important;height:auto!important;max-height:none!important}
  table.mobile-cards tr{height:auto!important;overflow:hidden}
  table.mobile-cards thead{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  table.mobile-cards tr{border:1px solid var(--v3-line);border-radius:10px;padding:10px 12px;margin-block-end:10px;background:var(--v3-surface)}
  table.mobile-cards td{border:0!important;padding:4px 0!important;min-inline-size:0;overflow-wrap:anywhere;white-space:normal}
  table.mobile-cards td[data-label]::before{content:attr(data-label);display:block;font-size:11px;color:var(--v3-ink-3,#64748b)}
  table.mobile-cards td:first-child strong{font-size:15px}
  table.mobile-cards td .row-actions,table.mobile-cards td.row-actions{display:flex;flex-wrap:wrap;gap:6px;padding-block-start:8px!important}
  table.sites-cards td:nth-child(4){display:none}
}
/* Operator-only surfaces stay hidden for customers even when a renderer resets className. */
body.customer-view [data-operator-only]{display:none!important}

/* Tabs scroll sideways instead of wrapping into many rows (Services has 11). */
.v4-tabs{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.v4-tabs button{flex:none}
.v4-group-tabs{margin-block-start:4px}
@media (pointer:coarse){.sidebar .v4-nav .nav-item,.v4-tabs button{min-block-size:44px}}
/* Platform settings are for platform admins; owners get the management map below. */
body.customer-view #platform-settings{display:none!important}
.v4-tabs[hidden]{display:none}

/* Commercial invoices: statement dialog and clean print layout. */
.invoice-dialog{inline-size:min(760px,calc(100vw - 32px));max-block-size:calc(100dvh - 32px);overflow:auto}
.invoice-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.invoice-head h2{margin:0;font-size:1.4rem}
.invoice-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:12px 0}
.invoice-meta dt{color:var(--muted,#667);font-size:.85rem}
.invoice-meta dd{margin:2px 0 0;font-weight:600}
.invoice-lines tfoot th{border-block-start:2px solid currentColor}
.invoice-note{color:var(--muted,#667);font-size:.9rem}
.invoice-print{display:none}
@media print{
body.printing-invoice>*:not(#invoice-print){display:none!important}
body.printing-invoice #invoice-print{display:block!important;padding:24px;color:#000;background:#fff}
body.printing-invoice #invoice-print table{inline-size:100%;border-collapse:collapse}
body.printing-invoice #invoice-print th,body.printing-invoice #invoice-print td{border:1px solid #444;padding:6px 8px;text-align:start}
body.printing-invoice #invoice-print .badge{border:1px solid #000;padding:2px 8px;background:none;color:#000}
}

/* Utility classes replacing former inline style="" attributes (CSP style-src 'self'). */
body .u-background-238636_color-fff{background:#238636;color:#fff}
body .u-background-3fb950{background:#3fb950}
body .u-background-8957e5_color-fff{background:#8957e5;color:#fff}
body .u-background-e3b341{background:#e3b341}
body .u-background-var--v3-surface-2_border-radius-6px-169kpt0{background:var(--v3-surface-2);border-radius:6px;padding:12px;margin-bottom:12px}
body .u-border-1pxsolid1f6feb_background-rgba311112350_04{border:1px solid #1f6feb;background:rgba(31,111,235,0.04)}
body .u-border-bottom-1pxsolidrgba2552552550_04{border-bottom:1px solid rgba(255,255,255,0.04)}
body .u-border-bottom-1pxsolidrgba2552552550_08_color--1r9gmd1{border-bottom:1px solid rgba(255,255,255,0.08);color:var(--text-muted,#8b949e)}
body .u-color-58a6ff{color:#58a6ff}
body .u-color-var--text-muted8b949e{color:var(--text-muted,#8b949e)}
body .u-color-var--v3-bad{color:var(--v3-bad)}
body .u-color-var--v3-ink-dim{color:var(--v3-ink-dim)}
body .u-cursor-pointer_padding-12px_border-1pxsolidvar-139mrfa{cursor:pointer;padding:12px;border:1px solid var(--line,#d0d7de);border-radius:8px;background:var(--surface,#fff)}
body .u-display-block_color-var--v3-ink-dim{display:block;color:var(--v3-ink-dim)}
body .u-display-flex_align-items-center_gap-6px{display:flex;align-items:center;gap:6px}
body .u-display-flex_align-items-center_gap-6px_cursor-pointer{display:flex;align-items:center;gap:6px;cursor:pointer}
body .u-display-flex_align-items-center_gap-8px{display:flex;align-items:center;gap:8px}
body .u-display-flex_align-items-center_gap-8px_font-s-17rzgkg{display:flex;align-items:center;gap:8px;font-size:13px;opacity:0.85}
body .u-display-flex_align-items-center_gap-8px_font-s-1hzy0mn{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer}
body .u-display-flex_align-items-center_justify-conten-1wcg5eo{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
body .u-display-flex_align-items-center_justify-conten-q5q6we{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
body .u-display-flex_align-items-center_padding-top-20px_gap-8px{display:flex;align-items:center;padding-top:20px;gap:8px}
body .u-display-flex_flex-direction-column_gap-10px_margin-top-8px{display:flex;flex-direction:column;gap:10px;margin-top:8px}
body .u-display-flex_flex-direction-column_gap-8px_margin-top-12px{display:flex;flex-direction:column;gap:8px;margin-top:12px}
body .u-display-flex_flex-wrap-wrap_gap-6px{display:flex;flex-wrap:wrap;gap:6px}
body .u-display-flex_flex-wrap-wrap_gap-6px_margin-bottom-14px{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
body .u-display-flex_gap-16px_flex-wrap-wrap_margin-top-6px{display:flex;gap:16px;flex-wrap:wrap;margin-top:6px}
body .u-display-flex_gap-8px_flex-wrap-wrap{display:flex;gap:8px;flex-wrap:wrap}
body .u-display-flex_justify-content-space-between_ali-1n6iz3m{display:flex;justify-content:space-between;align-items:center}
body .u-display-flex_justify-content-space-between_fon-1et87qe{display:flex;justify-content:space-between;font-size:0.8rem;margin-bottom:3px}
body .u-display-flex_justify-content-space-between_mar-14th4op{display:flex;justify-content:space-between;margin-bottom:6px;font-size:0.88rem}
body .u-display-grid_grid-template-columns-repeat21fr_gap-10px{display:grid;grid-template-columns:repeat(2, 1fr);gap:10px}
body .u-display-grid_grid-template-columns-repeatauto--16ufteq{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:20px}
body .u-display-grid_grid-template-columns-repeatauto--1a9vm02{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:16px 0}
body .u-display-grid_grid-template-columns-repeatauto--1pozwup{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
body .u-display-grid_grid-template-columns-repeatauto--1s01zdi{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:10px}
body .u-display-grid_grid-template-columns-repeatauto--1vp542y{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
body .u-display-grid_grid-template-columns-repeatauto--7mj5u8{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:16px}
body .u-display-inline-flex_align-items-center_gap-6px-14olq8f{display:inline-flex;align-items:center;gap:6px;background:#1f6feb;color:#fff;border:none}
body .u-display-none{display:none}
body .u-font-family-var--v3-mono_font-size-11_5px{font-family:var(--v3-mono);font-size:11.5px}
body .u-font-size-0_75rem_color-3fb950{font-size:0.75rem;color:#3fb950}
body .u-font-size-0_75rem_color-var--text-muted8b949e{font-size:0.75rem;color:var(--text-muted,#8b949e)}
body .u-font-size-0_78rem_color-var--text-muted8b949e_-1j88z12{font-size:0.78rem;color:var(--text-muted,#8b949e);display:block}
body .u-font-size-0_82rem{font-size:0.82rem}
body .u-font-size-0_82rem_color-var--text-muted8b949e_margin-6px00{font-size:0.82rem;color:var(--text-muted,#8b949e);margin:6px 0 0}
body .u-font-size-0_8rem_color-var--text-muted8b949e_d-kv42ya{font-size:0.8rem;color:var(--text-muted,#8b949e);display:block;margin-bottom:6px}
body .u-font-size-11px_color-var--v3-ink-dim{font-size:11px;color:var(--v3-ink-dim)}
body .u-font-size-12_5px_color-var--v3-ink-dim_margin-0010px{font-size:12.5px;color:var(--v3-ink-dim);margin:0 0 10px}
body .u-font-size-13px_font-weight-700_margin-bottom-6px{font-size:13px;font-weight:700;margin-bottom:6px}
body .u-font-size-1_35rem_display-block_margin-top-4px{font-size:1.35rem;display:block;margin-top:4px}
body .u-font-size-1_4rem_display-block_margin-top-4px{font-size:1.4rem;display:block;margin-top:4px}
body .u-grid-column-1-1{grid-column:1 / -1}
body .u-height-100p_width-0p_background-238636_transit-98hvr0{height:100%;width:0%;background:#238636;transition:width 0.3s ease}
body .u-height-10px_background-rgba2552552550_08_borde-xhu7gn{height:10px;background:rgba(255,255,255,0.08);border-radius:5px;overflow:hidden}
body .u-height-6px_background-rgba2552552550_06_border-11rd3d2{height:6px;background:rgba(255,255,255,0.06);border-radius:3px;overflow:hidden}
body .u-margin-0{margin:0}
body .u-margin-0012px_font-size-0_95rem_color-var--tex-1aq7zqz{margin:0 0 12px;font-size:0.95rem;color:var(--text-muted,#8b949e)}
body .u-margin-0_cursor-pointer{margin:0;cursor:pointer}
body .u-margin-0_font-size-12_5px{margin:0;font-size:12.5px}
body .u-margin-0_font-size-12_5px_color-var--v3-ink-dim{margin:0;font-size:12.5px;color:var(--v3-ink-dim)}
body .u-margin-0_font-size-13px{margin:0;font-size:13px}
body .u-margin-0_font-size-13px_color-var--v3-ink-dim{margin:0;font-size:13px;color:var(--v3-ink-dim)}
body .u-margin-0_font-size-18px_font-weight-800_color-var--v3-ink{margin:0;font-size:18px;font-weight:800;color:var(--v3-ink)}
body .u-margin-0_padding-inline-start-20px_font-size-0-10mqp35{margin:0;padding-inline-start:20px;font-size:0.86rem;line-height:1.7;color:#e6edf3}
body .u-margin-0_padding-inline-start-20px_font-size-1-obh5b3{margin:0;padding-inline-start:20px;font-size:12px;line-height:1.8}
body .u-margin-12px016px{margin:12px 0 16px}
body .u-margin-2px00_font-size-12px{margin:2px 0 0;font-size:12px}
body .u-margin-4px00{margin:4px 0 0}
body .u-margin-4px00_font-size-12px{margin:4px 0 0;font-size:12px}
body .u-margin-6px00_font-size-12px{margin:6px 0 0;font-size:12px}
body .u-margin-6px00_padding-inline-start-18px_font-size-12px{margin:6px 0 0;padding-inline-start:18px;font-size:12px}
body .u-margin-8px00{margin:8px 0 0}
body .u-margin-8px00_font-size-12px_color-var--v3-ink-dim{margin:8px 0 0;font-size:12px;color:var(--v3-ink-dim)}
body .u-margin-8px00_font-size-12px_color-var--v3-text-muted{margin:8px 0 0;font-size:12px;color:var(--v3-text-muted)}
body .u-margin-8px00_padding-right-20px_font-size-0_88-rwhlre{margin:8px 0 0;padding-right:20px;font-size:0.88rem;line-height:1.6}
body .u-margin-bottom-12px{margin-bottom:12px}
body .u-margin-bottom-12px_font-size-12px_display-flex-1ycg2q{margin-bottom:12px;font-size:12px;display:flex;gap:16px;flex-wrap:wrap}
body .u-margin-bottom-16px_display-flex_align-items-ce-18bs7t{margin-bottom:16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
body .u-margin-bottom-6px_display-flex_align-items-fle-1852g4n{margin-bottom:6px;display:flex;align-items:flex-start;gap:8px}
body .u-margin-inline-start-6px{margin-inline-start:6px}
body .u-margin-top-0_font-size-1rem_color-58a6ff_displ-484jg{margin-top:0;font-size:1rem;color:#58a6ff;display:flex;align-items:center;gap:8px}
body .u-margin-top-0_font-size-1rem_display-flex_align-ezghyr{margin-top:0;font-size:1rem;display:flex;align-items:center;gap:8px}
body .u-margin-top-10px{margin-top:10px}
body .u-margin-top-10px_color-var--v3-warn{margin-top:10px;color:var(--v3-warn)}
body .u-margin-top-10px_font-size-13px{margin-top:10px;font-size:13px}
body .u-margin-top-12px{margin-top:12px}
body .u-margin-top-14px{margin-top:14px}
body .u-margin-top-14px_display-flex_align-items-center_gap-8px{margin-top:14px;display:flex;align-items:center;gap:8px}
body .u-margin-top-14px_padding-12px_border-1pxsolidva-pjj36e{margin-top:14px;padding:12px;border:1px solid var(--v3-line);border-radius:6px}
body .u-margin-top-16px{margin-top:16px}
body .u-margin-top-16px_padding-16px_background-rgba56-ifp180{margin-top:16px;padding:16px;background:rgba(56,139,253,0.05);border:1px solid rgba(56,139,253,0.2);border-radius:8px}
body .u-margin-top-20px_justify-content-center_gap-12px{margin-top:20px;justify-content:center;gap:12px}
body .u-margin-top-4px{margin-top:4px}
body .u-margin-top-8px{margin-top:8px}
body .u-max-height-360px_overflow-y-auto{max-height:360px;overflow-y:auto}
body .u-max-height-400px_overflow-y-auto_margin-12px0{max-height:400px;overflow-y:auto;margin:12px 0}
body .u-max-height-460px_overflow-y-auto_margin-14px0_-yl03ow{max-height:460px;overflow-y:auto;margin:14px 0;background:var(--v3-surface-2);padding:12px;border-radius:var(--v3-r-sm)}
body .u-max-height-70vh_max-width-min90vw960px_overflo-1b6v8xt{max-height:70vh;max-width:min(90vw,960px);overflow:auto;margin:0;white-space:pre}
body .u-min-width-180px{min-width:180px}
body .u-padding-06px_font-weight-700{padding:0 6px;font-weight:700}
body .u-padding-12px0{padding:12px 0}
body .u-padding-12px16px_background-var--v3-surface-2_-ylbum5{padding:12px 16px;background:var(--v3-surface-2);border-radius:6px}
body .u-padding-12px_background-rgba2552552550_03_bord-83nq7g{padding:12px;background:rgba(255,255,255,0.03);border-radius:6px}
body .u-padding-12px_background-var--v3-surface-2_bord-1d6kntk{padding:12px;background:var(--v3-surface-2);border-radius:6px}
body .u-padding-12px_background-var--v3-surface-2_bord-6wp6om{padding:12px;background:var(--v3-surface-2);border-radius:6px;display:flex;justify-content:space-between;align-items:center}
body .u-padding-14px_background-rgba2552552550_03_bord-m0w21u{padding:14px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-radius:8px}
body .u-padding-16px{padding:16px}
body .u-padding-16px_background-rgba2552552550_02_bord-16pe1dx{padding:16px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.06);border-radius:8px}
body .u-padding-16px_background-rgba2552552550_02_bord-t6kzsz{padding:16px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.08);border-radius:8px}
body .u-padding-16px_text-align-center{padding:16px;text-align:center}
body .u-padding-16px_text-align-center_color-var--text-muted8b949e{padding:16px;text-align:center;color:var(--text-muted,#8b949e)}
body .u-padding-24px_text-align-center_color-var--text-muted8b949e{padding:24px;text-align:center;color:var(--text-muted,#8b949e)}
body .u-padding-6px_text-align-center{padding:6px;text-align:center}
body .u-padding-6px_text-align-end{padding:6px;text-align:end}
body .u-padding-6px_text-align-start{padding:6px;text-align:start}
body .u-padding-8px6px_font-weight-600{padding:8px 6px;font-weight:600}
body .u-padding-8px6px_text-align-center_color-var--te-14rr2n4{padding:8px 6px;text-align:center;color:var(--text-muted,#8b949e)}
body .u-padding-8px6px_text-align-center_font-weight-bold{padding:8px 6px;text-align:center;font-weight:bold}
body .u-padding-8px6px_text-align-left{padding:8px 6px;text-align:left}
body .u-width-100p_font-size-0_88rem_border-collapse-collapse{width:100%;font-size:0.88rem;border-collapse:collapse}
body .u-width-100p_max-width-520px_background-var--v3--cfg9b3{width:100%;max-width:520px;background:var(--v3-canvas);border:1px solid var(--v3-line);border-radius:6px;padding:14px;margin-top:10px;text-align:start}
body .u-width-14px_height-14px_border-2pxsolidfff_bord-mhui7q{width:14px;height:14px;border:2px solid #fff;border-top-color:transparent;border-radius:50%;display:inline-block;animation:spin 0.8s linear infinite}
body .u-width-18px_height-18px{width:18px;height:18px}
body .u-width-60p{width:60%}
body .u-width-auto{width:auto}

/* Dynamic-value helpers (were inline style with interpolated values). */
body .u-text-align-left{text-align:left}
body .u-text-align-right{text-align:right}
body .stress-grade-chip{display:flex;align-items:center;gap:10px;padding:8px 14px;background:rgba(255,255,255,0.04);border:1px solid;border-radius:8px}
body .stress-grade-letter{font-size:1.6rem;font-weight:800}
body .stress-grade-title{display:block;font-size:0.88rem}
body .stress-bar-fill{height:100%;border-radius:3px}
body .stress-badge-bold{font-weight:bold}
body .stc-238636{color:#238636}
body .stb-238636{background:#238636}
body .stbd-238636{border-color:#238636}
body .stc-2ea043{color:#2ea043}
body .stb-2ea043{background:#2ea043}
body .stbd-2ea043{border-color:#2ea043}
body .stc-1f6feb{color:#1f6feb}
body .stb-1f6feb{background:#1f6feb}
body .stbd-1f6feb{border-color:#1f6feb}
body .stc-d29922{color:#d29922}
body .stb-d29922{background:#d29922}
body .stbd-d29922{border-color:#d29922}
body .stc-db6d28{color:#db6d28}
body .stb-db6d28{background:#db6d28}
body .stbd-db6d28{border-color:#db6d28}
body .stc-da3633{color:#da3633}
body .stb-da3633{background:#da3633}
body .stbd-da3633{border-color:#da3633}
body .stc-8b949e{color:#8b949e}
body .stb-8b949e{background:#8b949e}
body .stbd-8b949e{border-color:#8b949e}
body .stc-3fb950{color:#3fb950}
body .stb-3fb950{background:#3fb950}
body .stbd-3fb950{border-color:#3fb950}
body .stc-f85149{color:#f85149}
body .stb-f85149{background:#f85149}
body .stbd-f85149{border-color:#f85149}
body .stc-fff{color:#fff}
body .stb-fff{background:#fff}
body .stbd-fff{border-color:#fff}
body .stb-neutral{background:rgba(255,255,255,0.08)}
body .stbd-neutral{border-color:rgba(255,255,255,0.08)}
/* Progress widths in whole percent. */
body .pct-w-0{width:0%}
body .pct-w-1{width:1%}
body .pct-w-2{width:2%}
body .pct-w-3{width:3%}
body .pct-w-4{width:4%}
body .pct-w-5{width:5%}
body .pct-w-6{width:6%}
body .pct-w-7{width:7%}
body .pct-w-8{width:8%}
body .pct-w-9{width:9%}
body .pct-w-10{width:10%}
body .pct-w-11{width:11%}
body .pct-w-12{width:12%}
body .pct-w-13{width:13%}
body .pct-w-14{width:14%}
body .pct-w-15{width:15%}
body .pct-w-16{width:16%}
body .pct-w-17{width:17%}
body .pct-w-18{width:18%}
body .pct-w-19{width:19%}
body .pct-w-20{width:20%}
body .pct-w-21{width:21%}
body .pct-w-22{width:22%}
body .pct-w-23{width:23%}
body .pct-w-24{width:24%}
body .pct-w-25{width:25%}
body .pct-w-26{width:26%}
body .pct-w-27{width:27%}
body .pct-w-28{width:28%}
body .pct-w-29{width:29%}
body .pct-w-30{width:30%}
body .pct-w-31{width:31%}
body .pct-w-32{width:32%}
body .pct-w-33{width:33%}
body .pct-w-34{width:34%}
body .pct-w-35{width:35%}
body .pct-w-36{width:36%}
body .pct-w-37{width:37%}
body .pct-w-38{width:38%}
body .pct-w-39{width:39%}
body .pct-w-40{width:40%}
body .pct-w-41{width:41%}
body .pct-w-42{width:42%}
body .pct-w-43{width:43%}
body .pct-w-44{width:44%}
body .pct-w-45{width:45%}
body .pct-w-46{width:46%}
body .pct-w-47{width:47%}
body .pct-w-48{width:48%}
body .pct-w-49{width:49%}
body .pct-w-50{width:50%}
body .pct-w-51{width:51%}
body .pct-w-52{width:52%}
body .pct-w-53{width:53%}
body .pct-w-54{width:54%}
body .pct-w-55{width:55%}
body .pct-w-56{width:56%}
body .pct-w-57{width:57%}
body .pct-w-58{width:58%}
body .pct-w-59{width:59%}
body .pct-w-60{width:60%}
body .pct-w-61{width:61%}
body .pct-w-62{width:62%}
body .pct-w-63{width:63%}
body .pct-w-64{width:64%}
body .pct-w-65{width:65%}
body .pct-w-66{width:66%}
body .pct-w-67{width:67%}
body .pct-w-68{width:68%}
body .pct-w-69{width:69%}
body .pct-w-70{width:70%}
body .pct-w-71{width:71%}
body .pct-w-72{width:72%}
body .pct-w-73{width:73%}
body .pct-w-74{width:74%}
body .pct-w-75{width:75%}
body .pct-w-76{width:76%}
body .pct-w-77{width:77%}
body .pct-w-78{width:78%}
body .pct-w-79{width:79%}
body .pct-w-80{width:80%}
body .pct-w-81{width:81%}
body .pct-w-82{width:82%}
body .pct-w-83{width:83%}
body .pct-w-84{width:84%}
body .pct-w-85{width:85%}
body .pct-w-86{width:86%}
body .pct-w-87{width:87%}
body .pct-w-88{width:88%}
body .pct-w-89{width:89%}
body .pct-w-90{width:90%}
body .pct-w-91{width:91%}
body .pct-w-92{width:92%}
body .pct-w-93{width:93%}
body .pct-w-94{width:94%}
body .pct-w-95{width:95%}
body .pct-w-96{width:96%}
body .pct-w-97{width:97%}
body .pct-w-98{width:98%}
body .pct-w-99{width:99%}
body .pct-w-100{width:100%}

/* Plain-language text for customers; the technical original stays behind data-operator-only. */
body:not(.customer-view) [data-customer-only]{display:none}
.v4-breadcrumb [hidden]{display:none!important}

/* Browser UX pass: action cells stay table cells so borders line up with the header row. */
table td.row-actions{display:table-cell;white-space:normal}
table td.row-actions>*{margin-inline-end:6px;margin-block:3px;vertical-align:middle}
table td.row-actions>*:last-child{margin-inline-end:0}
/* Inline action buttons in content read as buttons, not loose text next to bordered siblings. */
.view button.ghost.small,.view button.ghost.compact,dialog button.ghost.small{border-color:var(--line,#d9dcd6)}
/* Raw controller detail stays available but folded, LTR, under a Persian label. */
.tech-detail{margin-block-start:4px;font-size:12px;color:var(--ink-soft)}
.tech-detail>summary{cursor:pointer;inline-size:max-content}
.tech-detail>code{display:block;direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word;margin-block-start:4px;padding:6px 8px;border-radius:6px;background:var(--surface-subtle,#f4f5f2)}
/* Home: healthy readiness items fold into one line; only items that need action stay open. */
#readiness>.readiness-ok{grid-column:1/-1}
#readiness>.readiness-ok>summary{cursor:pointer;color:var(--ink-soft);padding:6px 2px}
#readiness>.readiness-ok>.readiness-grid{margin-block-start:8px}
/* Row overflow menu: one visible action per row, the rest behind "More". */
.row-menu{position:relative;display:inline-block}
.row-menu>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line,#d9dcd6);border-radius:8px;padding:5px 10px;font-size:13px}
.row-menu>summary::-webkit-details-marker{display:none}
.row-menu[open]>.row-menu-list{position:absolute;inset-inline-end:0;top:calc(100% + 4px);z-index:20;display:flex;flex-direction:column;align-items:stretch;gap:2px;min-inline-size:190px;padding:6px;background:var(--surface,#fff);border:1px solid var(--line,#d9dcd6);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.row-menu-list>button{justify-content:flex-start;text-align:start;border-color:transparent!important;inline-size:100%}
.row-menu-list>button.danger,.row-menu-list>button[data-node-action="remove"]{color:var(--danger,#b42318)}
table.node-list td small{display:block}
.table-wrap:has(.row-menu[open]),table:has(.row-menu[open]){overflow:visible!important}
/* Operation detail: summary first, key facts at normal size, trace folded. */
.op-summary{display:flex;align-items:center;gap:10px;font-size:15px;margin-block:4px 6px}
.op-next{color:var(--ink-soft);margin:0 0 12px}
.op-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 16px;margin:0 0 12px}
.op-facts>div{padding:8px 10px;border:1px solid var(--line,#d9dcd6);border-radius:8px;min-inline-size:0}
.op-facts dt{font-size:12px;color:var(--ink-soft)}
.op-facts dd{margin:2px 0 0;font-size:14px;overflow-wrap:anywhere}
.op-tech h4{margin:14px 0 6px;font-size:13px}
.op-tech>code{margin-block-end:8px}
/* Activity history: one row per run of identical entries, in aligned columns. */
.activity-timeline-list{list-style:none;padding:0;margin:0}
.activity-row{display:grid;grid-template-columns:minmax(150px,auto) minmax(0,1.4fr) auto minmax(0,1.6fr) auto;gap:6px 14px;align-items:center;padding:8px 4px;border-block-end:1px solid var(--line,#e3e8f1)}
.activity-row:last-child{border-block-end:0}
.activity-when{font-size:12px;color:var(--ink-soft);white-space:nowrap}
.activity-what strong{display:block;font-weight:600}
.activity-what small{display:block;color:var(--ink-soft);font-size:12px}
.activity-repeat{display:inline-block;margin-block-start:2px;padding:1px 8px;border-radius:999px;background:var(--surface-subtle,#f1f3ef);color:var(--ink,#1f2937);font-size:12px}
.activity-msg{font-size:13px;color:var(--ink-soft);min-inline-size:0}
@media (max-width:640px){.activity-row{grid-template-columns:1fr auto}.activity-when,.activity-msg{grid-column:1/-1}}
[data-activity-more][hidden]{display:none!important}
/* Phones: long tab bars (Services has 11 sections) collapse into one scrollable row
   instead of wrapping into many rows; every tab stays a 44px touch target. */
@media (max-width:960px){
  .site-workspace-tab-btn{min-block-size:44px}
}
@media (max-width:640px){
  .v4-tabs,.site-workspace-tabs{flex-wrap:nowrap!important;overflow-x:auto!important;overscroll-behavior-x:contain;scrollbar-width:thin;scroll-snap-type:x proximity}
  .v4-tabs button,.site-workspace-tab-btn{scroll-snap-align:start;max-inline-size:70vw;overflow:hidden;text-overflow:ellipsis}
}
.link-button{background:none;border:0;padding:0;color:inherit;cursor:pointer;text-align:start;font:inherit}
.link-button:hover strong,.link-button:focus-visible strong{text-decoration:underline}
details.capacity-details>summary,details.tech-details>summary{cursor:pointer;padding:12px 4px;display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
details.capacity-details>summary small,details.tech-details>summary small{color:var(--muted,#666)}
/* Global operations drawer: active operations stay visible across pages. */
.ops-drawer-trigger{display:inline-flex;align-items:center;gap:6px;min-block-size:44px}
.ops-drawer-dot{inline-size:8px;block-size:8px;border-radius:50%;background:var(--v3-ink-3)}
.ops-drawer-trigger.busy .ops-drawer-dot{background:var(--v3-accent);box-shadow:0 0 0 3px var(--v3-accent-soft)}
dialog.ops-drawer{margin:0;margin-inline-start:auto;block-size:100dvh;max-block-size:100dvh;inline-size:min(420px,100vw);max-inline-size:100vw;border:0;border-inline-start:1px solid var(--v3-line);background:var(--v3-surface);color:var(--v3-ink);padding:16px;overflow:auto}
dialog.ops-drawer::backdrop{background:rgba(15,17,19,.35)}
.ops-drawer .dialog-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-block-end:12px}
.ops-drawer-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ops-drawer-item{display:grid;gap:6px;inline-size:100%;min-block-size:44px;padding:10px 12px;text-align:start;background:var(--v3-surface-2);border:1px solid var(--v3-line);border-radius:var(--v3-r);color:inherit;cursor:pointer}
.ops-drawer-item:hover{border-color:var(--v3-line-strong)}
.ops-drawer-item:focus-visible{outline:none;box-shadow:var(--v4-focus)}
.ops-drawer-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ops-drawer-target{color:var(--v3-ink-2);font-size:13px;overflow-wrap:anywhere}
.ops-drawer-progress{display:block;block-size:4px;background:var(--v3-surface-3);border-radius:2px;overflow:hidden}
.ops-drawer-progress>i{display:block;block-size:100%;background:var(--v3-accent)}
.ops-drawer-foot{margin-block-start:12px}
.metric-link{cursor:pointer}
.metric-link:focus-visible{outline:none;box-shadow:var(--v4-focus)}
@media (prefers-reduced-motion:reduce){.ops-drawer-progress>i{transition:none}}
/* Cluster health verdict above the infrastructure counters. */
.cluster-health{display:grid;gap:10px;margin-block-end:12px;padding:14px 16px;background:var(--v3-surface);border:1px solid var(--v3-line);border-radius:var(--v3-r)}
.cluster-health-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cluster-health-head strong{font-size:16px}
.cluster-health-facts{display:flex;flex-wrap:wrap;gap:8px 24px;margin:0}
.cluster-health-facts div{display:grid;gap:2px}
.cluster-health-facts dt{color:var(--v3-ink-2);font-size:12px}
.cluster-health-facts dd{margin:0;font-weight:600}
/* Site health items open the tab that manages them. */
button.health-strip-item{font:inherit;color:inherit;text-align:start;cursor:pointer;inline-size:100%;min-block-size:44px}
button.health-strip-item:hover{border-color:var(--v3-line-strong)}
button.health-strip-item:focus-visible{outline:none;box-shadow:var(--v4-focus)}
.health-strip-item .health-item-text{display:flex;flex-direction:column}
/* Needs attention: resource first, then problem, then the action. */
.action-card .action-card-resource{display:block;color:var(--v3-ink-2);font-size:12px;overflow-wrap:anywhere}
.action-card .action-card-cta{display:block;margin-block-start:6px;color:var(--v3-accent);font-weight:600;font-size:13px}
/* PITR header facts: long LTR identifiers wrap instead of overlapping. */
.pitr-meta-item{min-inline-size:0}
.pitr-meta-item .mono{display:block;direction:ltr;text-align:start;unicode-bidi:isolate;overflow-wrap:anywhere;word-break:break-word}
/* Node list grouped by role: core (control plane) vs scale vs waiting. */
.node-list .node-group-row th{background:var(--v3-surface-2);text-align:start;padding:10px 12px;font-weight:400}
.node-list .node-group-row strong{margin-inline-end:6px}
.node-list .node-group-row small{display:block;color:var(--v3-ink-2);margin-block-start:2px}

/* Add-server wizard (ops request register-node) */
[data-ops-register] .reg-progress{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:12px 0}
[data-ops-register] .reg-progress li{padding:4px 10px;border-radius:999px;border:1px solid var(--v3-line);font-size:.85em;color:var(--v3-muted,inherit)}
[data-ops-register] .reg-progress li[aria-current="step"]{border-color:var(--v3-accent);color:var(--v3-accent);font-weight:600}
[data-ops-register] .reg-progress li.done{background:var(--v3-surface)}
[data-ops-register] .reg-role{display:block;margin:6px 0}
[data-ops-register] .reg-role small{display:block;margin-inline-start:24px;opacity:.8}
[data-ops-register] .reg-review{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px}
[data-ops-register] .reg-review dd{margin:0;overflow-wrap:anywhere;text-align:start}
/* A button with the hidden attribute stays hidden even when a class sets display. */
button[hidden]{display:none!important}