/* SinCity client/admin shell polish */
aside.bg-bg-subtle {
  background: linear-gradient(180deg, var(--bg-subtle), var(--bg)) !important;
}

aside .nav-active {
  background: var(--elev) !important;
  color: var(--accent) !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05), inset 3px 0 var(--accent);
}

aside .nav-active svg {
  color: var(--accent) !important;
}

header.h-14 {
  background: var(--bg-subtle) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 1px 0 var(--border);
}

main .rounded-xl.border {
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.035);
}

main .border-dashed {
  border-radius: 16px !important;
}

main table tbody tr {
  transition: background 0.15s ease;
}

main table tbody tr:hover {
  background: var(--bg-subtle);
}

@media (max-width: 1023px) {
  aside .nav-active {
    box-shadow: none;
  }
}

.sidebar-brand {
  flex-wrap: wrap;
  row-gap: 2px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  margin-bottom: 14px !important;
}

.sidebar-brand-sub {
  flex-basis: 100%;
  padding-left: 2px;
  font-family: var(--font-mono, monospace);
  font-size: 7.5px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--text-faint);
}







.sidebar-label {
  display: block;
  padding-bottom: 3px;
}

aside nav > div + div {
  margin-top: 16px !important;
}

.sidebar-footer {
  margin-top: 10px;
  padding-bottom: 2px;
}

aside {
  position: relative;
  overflow: hidden;
}

aside::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 92px;
  height: 120px;
  background-image: radial-gradient(var(--border) 1px, transparent 1px);
  background-size: 15px 15px;
  opacity: 0.25;
  -webkit-mask-image: linear-gradient(transparent, black);
  mask-image: linear-gradient(transparent, black);
  pointer-events: none;
}

aside > div {
  position: relative;
  z-index: 1;
}

aside nav a {
  height: 40px !important;
  gap: 10px !important;
  padding-left: 6px !important;
  padding-right: 8px !important;
  border-radius: 9px;
}

aside .sidebar-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  border-radius: 8px;
  background: var(--elev);
  border: 1px solid var(--border);
  color: var(--text-dim);
  flex: 0 0 auto;
  transition: 0.15s;
}

aside .nav-active .sidebar-icon {
  background: var(--accent);
  color: var(--accent-fg);
  box-shadow: 0 6px 16px -9px var(--accent);
}

/* Clean standard sidebar */
aside::after {
  display: none !important;
}

.sidebar-brand-sub {
  display: none !important;
}

aside .sidebar-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  box-shadow: none !important;
}

aside .nav-active {
  background: var(--accent) !important;
  color: var(--accent-fg) !important;
  box-shadow: 0 10px 24px -20px var(--accent) !important;
}

aside .nav-active .sidebar-icon,
aside .nav-active svg {
  color: var(--accent-fg) !important;
  background: transparent !important;
}

/* Account subnav spacing/width (classes added post-build were not in compiled Tailwind) */
.account-nav {
  padding: 10px;
}
.account-nav a,
.account-nav button {
  gap: 10px;
  padding-left: 10px;
  padding-right: 10px;
}
.account-nav .font-mono {
  padding: 0 10px;
  font-size: 9px;
  letter-spacing: 0.14em;
}
@media (min-width: 768px) {
  .account-nav {
    width: 14rem;
    flex: 0 0 14rem;
  }
}

/* Utility classes added by post-build patches but absent from compiled Tailwind */
.-bottom-1 { bottom: -0.25rem; }
.-right-1 { right: -0.25rem; }
.-right-14 { right: -3.5rem; }
.-top-20 { top: -5rem; }
.-right-20 { right: -5rem; }
.-top-24 { top: -6rem; }
.-bottom-24 { bottom: -6rem; }
.-left-20 { left: -5rem; }
.border-0 { border-width: 0; }
.shadow-sm { box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); }
.p-2\.5 { padding: 0.625rem; }
.mb-7 { margin-bottom: 1.75rem; }
.w-auto { width: auto; }
.pr-14 { padding-right: 3.5rem; }
.text-\[8px\] { font-size: 8px; }
.tracking-\[\.16em\] { letter-spacing: 0.16em; }
.bg-accent\/\[0\.03\] { background-color: color-mix(in oklab, var(--accent) 3%, transparent); }
.bg-bad\/5 { background-color: color-mix(in oklab, var(--bad) 5%, transparent); }
.border-bad\/20 { border-color: color-mix(in oklab, var(--bad) 20%, transparent); }
.border-good\/20 { border-color: color-mix(in oklab, var(--good) 20%, transparent); }
.hover\:bg-accent\/10:hover { background-color: color-mix(in oklab, var(--accent) 10%, transparent); }
@media (min-width: 768px) {
  .md\:w-56 { width: 14rem; }
  .md\:px-10 { padding-left: 2.5rem; padding-right: 2.5rem; }
}

/* Network client pages — shared shell */
.net-page { max-width: 1120px; margin: 0 auto; }
.net-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 24px; border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 16px; background: linear-gradient(135deg, var(--elev), color-mix(in oklab, var(--accent) 6%, var(--bg-subtle))); box-shadow: 0 18px 44px -40px rgb(0 0 0 / 0.45); }
.net-hero::after { content: ""; position: absolute; right: -110px; top: -130px; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, var(--accent), transparent 65%); opacity: 0.08; pointer-events: none; }
.net-hero-copy { position: relative; z-index: 1; min-width: 0; }
.net-eyebrow { font-family: var(--font-mono), monospace; font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-faint); }
.net-hero h1 { margin: 7px 0 0; font-size: 28px; font-weight: 750; letter-spacing: -0.04em; line-height: 1.08; color: var(--text); }
.net-hero p { margin: 6px 0 0; max-width: 540px; font-size: 12.5px; line-height: 1.6; color: var(--text-dim); }
.net-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.net-chips span { display: inline-flex; height: 24px; align-items: center; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-subtle); padding: 0 9px; font-size: 10px; color: var(--text-dim); }
.net-hero-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; border-radius: 8px; background: var(--accent); color: var(--accent-fg); padding: 8px 13px; font-size: 12px; font-weight: 600; text-decoration: none; transition: 0.15s; }
.net-hero-cta:hover { opacity: 0.9; }
.net-visual { position: relative; z-index: 1; flex: 0 0 auto; width: 220px; height: 140px; display: flex; align-items: center; justify-content: center; }
.net-preview-chart { width: 100%; height: 100%; display: block; }
.net-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.net-stat-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.net-stat { position: relative; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--elev); padding: 14px 16px; }
.net-stat::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--accent); opacity: 0.55; }
.net-stat-label { font-family: var(--font-mono), monospace; font-size: 9px; letter-spacing: 0.13em; text-transform: uppercase; color: var(--text-faint); }
.net-stat-value { margin-top: 7px; font-size: 23px; font-weight: 720; letter-spacing: -0.03em; color: var(--text); font-variant-numeric: tabular-nums; }
.net-stat-sub { margin-top: 3px; font-size: 10.5px; color: var(--text-faint); }
.net-onboard { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); margin-top: 18px; overflow: hidden; border: 1px solid var(--border); border-radius: 16px; background: var(--elev); }
.net-onboard-copy { padding: 28px; }
.net-onboard h2 { margin: 8px 0 0; font-size: 23px; font-weight: 750; letter-spacing: -0.035em; color: var(--text); }
.net-onboard p { margin: 8px 0 0; max-width: 54ch; font-size: 12.5px; line-height: 1.65; color: var(--text-dim); }
.net-onboard-visual { display: flex; align-items: center; justify-content: center; padding: 24px; border-left: 1px solid var(--border); background: linear-gradient(160deg, var(--bg-subtle), color-mix(in oklab, var(--accent) 4%, var(--bg-subtle))); }
.net-steps { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; }
.net-step { display: flex; gap: 12px; align-items: flex-start; }
.net-step-num { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; flex: none; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-subtle); font-family: var(--font-mono), monospace; font-size: 10px; color: var(--text-dim); }
.net-step-title { font-size: 12.5px; font-weight: 650; color: var(--text); }
.net-step-text { margin-top: 2px; font-size: 11.5px; line-height: 1.5; color: var(--text-faint); }
.net-onboard-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.net-ghost-btn { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 8px; padding: 8px 13px; font-size: 12px; font-weight: 600; color: var(--text); text-decoration: none; transition: 0.15s; }
.net-ghost-btn:hover { border-color: var(--border-strong); background: var(--bg-subtle); }
.net-preview { width: 100%; max-width: 330px; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--elev); box-shadow: 0 18px 40px -30px rgb(0 0 0 / 0.5); }
.net-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--border); background: var(--bg-subtle); }
.net-preview-title { font-size: 11px; font-weight: 650; color: var(--text); }
.net-preview-pill { border: 1px solid var(--border); border-radius: 999px; padding: 3px 7px; font-family: var(--font-mono), monospace; font-size: 8px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-faint); }
.net-preview-pill.good { border-color: color-mix(in oklab, var(--good) 30%, var(--border)); background: color-mix(in oklab, var(--good) 8%, transparent); color: var(--good); }
.net-preview-body { padding: 14px; }
.net-preview-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px dashed var(--border); font-size: 11px; }
.net-preview-row:last-child { border-bottom: 0; }
.net-preview-label { font-family: var(--font-mono), monospace; font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-faint); }
.net-preview-value { font-family: var(--font-mono), monospace; font-size: 10.5px; color: var(--text); }
.net-topology { display: flex; align-items: center; width: 100%; max-width: 330px; }
.net-node { flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 10px; background: var(--elev); padding: 12px 10px; text-align: center; }
.net-node small { display: block; font-family: var(--font-mono), monospace; font-size: 8px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-faint); }
.net-node b { display: block; margin-top: 4px; font-size: 11px; font-weight: 650; color: var(--text); }
.net-node code { display: block; margin-top: 3px; font-family: var(--font-mono), monospace; font-size: 8.5px; color: var(--text-faint); }
.net-link { position: relative; flex: 0 0 56px; height: 1px; border-top: 1px dashed var(--border-strong); }
.net-link::after { content: ""; position: absolute; left: 50%; top: -3.5px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); transform: translateX(-50%); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 15%, transparent); }
@media (max-width: 860px) {
  .net-hero { flex-direction: column; align-items: flex-start; }
  .net-visual { position: absolute; right: -20px; top: -30px; opacity: 0.5; width: 170px; height: 120px; }
  .net-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .net-onboard { grid-template-columns: 1fr; }
  .net-onboard-visual { border-left: 0; border-top: 1px solid var(--border); }
}
@media (max-width: 520px) {
  .net-stat-grid, .net-stat-grid.cols-3 { grid-template-columns: 1fr; }
  .net-hero h1 { font-size: 24px; }
}
.net-stat.is-warn::before { background: var(--warn); opacity: 0.8; }
.net-stat.is-warn .net-stat-value { color: var(--warn); }

/* Compact dashboard shell */
.net-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 0 0 18px; border-bottom: 1px solid var(--border); }
.net-page-head h1 { margin: 6px 0 0; font-size: 26px; font-weight: 750; letter-spacing: -0.04em; line-height: 1.1; color: var(--text); }
.net-page-head p { margin: 5px 0 0; max-width: 620px; font-size: 12.5px; line-height: 1.6; color: var(--text-dim); }
.net-page-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.net-dash-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, 0.9fr); gap: 16px; margin-top: 16px; align-items: stretch; }
.net-dash-grid > .net-panel { display: flex; flex-direction: column; }
.net-dash-grid .net-panel-empty { flex: 1; align-items: center; }
.net-panel { overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: var(--elev); }
.net-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--border); background: var(--bg-subtle); }
.net-panel-head h2 { margin: 4px 0 0; font-size: 15px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.net-panel-empty { display: flex; align-items: flex-start; gap: 14px; padding: 22px 18px; }
.net-empty-icon { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex: none; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-subtle); color: var(--accent); }
.net-empty-title { font-size: 13px; font-weight: 650; color: var(--text); }
.net-empty-text { margin-top: 3px; max-width: 48ch; font-size: 11.5px; line-height: 1.55; color: var(--text-faint); }
.net-empty-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.net-table-wrap { overflow-x: auto; }
.net-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.net-table th { padding: 9px 14px; border-bottom: 1px solid var(--border); background: var(--bg-subtle); text-align: left; white-space: nowrap; font-family: var(--font-mono), monospace; font-size: 8.5px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-faint); }
.net-table td { padding: 11px 14px; border-bottom: 1px solid var(--border); vertical-align: middle; color: var(--text-dim); }
.net-table tr:last-child td { border-bottom: 0; }
.net-table tbody tr:hover td { background: var(--bg-subtle); }
.net-service-name { font-size: 12.5px; font-weight: 650; color: var(--text); }
.net-service-sub { margin-top: 2px; font-size: 10.5px; color: var(--text-faint); }
.net-manage { font-size: 10.5px; font-weight: 650; color: var(--accent); white-space: nowrap; }
.net-plan-list { padding: 4px 0; }
.net-plan-row { display: block; padding: 12px 18px; border-bottom: 1px solid var(--border); text-decoration: none; transition: 0.15s; }
.net-plan-row:last-child { border-bottom: 0; }
.net-plan-row:hover { background: var(--bg-subtle); }
.net-plan-row-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.net-plan-name { font-size: 12.5px; font-weight: 650; color: var(--text); }
.net-plan-price { font-family: var(--font-mono), monospace; font-size: 11px; font-weight: 650; color: var(--accent); }
.net-plan-blurb { margin: 3px 0 0; font-size: 11px; line-height: 1.5; color: var(--text-faint); }
.net-plan-meta { margin-top: 6px; font-family: var(--font-mono), monospace; font-size: 8.5px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-faint); }
.net-plan-cta { display: inline-flex; margin-top: 8px; font-size: 10.5px; font-weight: 650; color: var(--accent); }
.net-plan-all { display: block; padding: 12px 18px; border-top: 1px solid var(--border); font-size: 11px; font-weight: 650; color: var(--text); text-decoration: none; }
.net-plan-all:hover { color: var(--accent); }
@media (max-width: 860px) {
  .net-page-head { flex-direction: column; align-items: flex-start; }
  .net-dash-grid { grid-template-columns: 1fr; }
}
.net-spec-list { padding: 4px 0; }
.net-spec-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 10px 18px; border-bottom: 1px solid var(--border); }
.net-spec-row:last-child { border-bottom: 0; }
.net-spec-label { white-space: nowrap; font-family: var(--font-mono), monospace; font-size: 8.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-faint); }
.net-spec-value { text-align: right; font-size: 11.5px; color: var(--text-dim); }
.net-chart-empty { position: relative; min-height: 340px; padding: 18px; }
.net-empty-chart { display: block; width: 100%; height: 300px; }
.net-chart-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; text-align: center; background: radial-gradient(circle at center, color-mix(in oklab, var(--elev) 90%, transparent) 0 28%, transparent 64%); }
.net-chart-overlay .net-empty-text { max-width: 44ch; }
.net-chart-overlay .net-empty-actions { justify-content: center; }

/* Brand alignment: marketing site uses a green accent on near-black. */
[data-theme="light"] {
  --accent: #16a34a;
  --accent-fg: #ffffff;
  --good: #16a34a;
}
.net-page-head h1 { font-size: 30px; }
.net-page-head p { font-size: 13.5px; }
.net-eyebrow { font-size: 10px; }
.net-chips span { height: 26px; padding: 0 10px; font-size: 11px; }
.net-stat-label { font-size: 9.5px; }
.net-stat-value { font-size: 26px; }
.net-stat-sub { font-size: 11px; }
.net-panel-head h2 { font-size: 16px; }
.net-empty-title { font-size: 14px; }
.net-empty-text { font-size: 12.5px; }
.net-table { font-size: 12.5px; }
.net-table th { font-size: 9px; }
.net-service-name { font-size: 13px; }
.net-service-sub { font-size: 11px; }
.net-plan-name { font-size: 13px; }
.net-plan-blurb { font-size: 11.5px; }
.net-plan-meta { font-size: 9px; }
.net-spec-value { font-size: 12px; }
main.min-h-0.flex-1.overflow-y-auto { display: flex; flex-direction: column; }
main.min-h-0.flex-1.overflow-y-auto > div { flex: 1 0 auto; width: 100%; }
main.min-h-0.flex-1.overflow-y-auto > footer { margin-top: auto; width: 100%; }

/* Services table (populated) */
.net-table { width: 100%; min-width: 760px; border-collapse: collapse; table-layout: fixed; font-size: 13px; }
.net-table th { padding: 10px 16px; }
.net-table td { padding: 14px 16px; }
.net-table th:nth-child(1), .net-table td:nth-child(1) { width: 34%; }
.net-table th:nth-child(2), .net-table td:nth-child(2) { width: 22%; }
.net-table th:nth-child(3), .net-table td:nth-child(3) { width: 12%; }
.net-table th:nth-child(4), .net-table td:nth-child(4) { width: 13%; }
.net-table th:nth-child(5), .net-table td:nth-child(5) { width: 10%; }
.net-table th:nth-child(6), .net-table td:nth-child(6) { width: 9%; }
.net-table tbody tr:hover td { background: color-mix(in oklab, var(--accent) 4%, var(--bg-subtle)); }
.net-service-cell { display: flex; align-items: center; gap: 11px; min-width: 0; }
.net-service-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex: none; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-subtle); color: var(--accent); }
.net-service-name { font-size: 13px; font-weight: 650; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.net-service-sub { margin-top: 2px; font-size: 10.5px; color: var(--text-faint); }
.net-location { display: flex; align-items: center; gap: 7px; min-width: 0; font-size: 12px; color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.net-manage { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--border); border-radius: 7px; padding: 5px 9px; font-size: 10.5px; font-weight: 650; color: var(--text); text-decoration: none; transition: 0.15s; white-space: nowrap; }
.net-manage:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in oklab, var(--accent) 7%, transparent); }
.net-service-mono { font-family: var(--font-mono), monospace; font-size: 8.5px; font-weight: 700; letter-spacing: 0.03em; color: var(--accent); }

/* Proxmox node card */
.pve-node-card { border-radius: 16px; background: linear-gradient(180deg, var(--elev), var(--bg-subtle)); box-shadow: 0 18px 40px -36px rgb(0 0 0 / 0.55); }
.pve-node-card > div:nth-child(2) { padding: 16px 18px; }
.pve-node-card > .grid { gap: 12px; padding: 16px 18px; }
.pve-node-card > .grid > div { border: 1px solid var(--border); border-radius: 12px; background: var(--bg-subtle); padding: 14px 16px; }
.pve-node-card > .grid > div > div:first-child { font-size: 9px; letter-spacing: 0.14em; color: var(--text-faint); }
.pve-node-card > .grid > div > div:nth-child(2) { margin-top: 6px; font-size: 20px; font-weight: 720; letter-spacing: -0.03em; color: var(--text); }
.pve-node-card > .grid > div > div:nth-child(3) { margin-top: 3px; font-size: 10.5px; color: var(--text-faint); }
.pve-node-card > .grid > div > div:nth-child(4) { height: 5px; margin-top: 10px; background: var(--border); }
.pve-node-card > .grid > div > div:nth-child(4) > div { background: linear-gradient(90deg, var(--accent), var(--good)); }
.pve-node-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid var(--border); padding: 12px 18px; font-family: var(--font-mono), monospace; font-size: 9px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-faint); }

nav[aria-label="Main"] > div + div{border-top:1px solid var(--border);padding-top:16px}

nav[aria-label="Main"] .sidebar-label{display:flex;align-items:center;gap:8px;font-size:9px!important;letter-spacing:.14em!important;color:var(--text-faint)!important;margin-bottom:8px!important}
nav[aria-label="Main"] .sidebar-label::after{content:"";flex:1;height:1px;background:var(--border);opacity:.7}
nav[aria-label="Main"] a{position:relative;height:34px!important;border-radius:8px!important;transition:background .15s,color .15s}
nav[aria-label="Main"] a:hover{background:var(--elev)!important;color:var(--text)!important}
nav[aria-label="Main"] a.nav-active{background:color-mix(in oklab,var(--accent) 9%,transparent)!important;color:var(--text)!important;font-weight:600!important}
nav[aria-label="Main"] a.nav-active::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--accent)}
nav[aria-label="Main"] a .sidebar-icon{transition:color .15s}
nav[aria-label="Main"] a.nav-active .sidebar-icon{color:var(--accent)}
nav[aria-label="Main"] a:hover .sidebar-icon{color:var(--text)}
nav[aria-label="Main"] a:focus-visible{outline:2px solid color-mix(in oklab,var(--accent) 55%,transparent);outline-offset:2px}

nav[aria-label="Admin"]{display:flex;flex-direction:column;gap:2px}
nav[aria-label="Admin"] .admin-nav-label{display:flex;align-items:center;gap:8px;margin:18px 0 6px 10px!important;font-size:9px!important;letter-spacing:.14em!important;text-transform:uppercase;color:var(--text-faint)!important}
nav[aria-label="Admin"] .admin-nav-label:first-child{margin-top:0!important}
nav[aria-label="Admin"] .admin-nav-label::after{content:"";flex:1;height:1px;background:var(--border);opacity:.7;margin-right:10px}
nav[aria-label="Admin"] a{position:relative;height:34px!important;border-radius:8px!important;transition:background .15s,color .15s}
nav[aria-label="Admin"] a:hover{background:var(--elev)!important;color:var(--text)!important}
nav[aria-label="Admin"] a.nav-active{background:color-mix(in oklab,var(--accent) 9%,transparent)!important;color:var(--text)!important;font-weight:600!important}
nav[aria-label="Admin"] a.nav-active::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--accent)}
nav[aria-label="Admin"] a.nav-active svg{color:var(--accent)}
nav[aria-label="Admin"] a:hover svg{color:var(--text)}
nav[aria-label="Admin"] a:focus-visible{outline:2px solid color-mix(in oklab,var(--accent) 55%,transparent);outline-offset:2px}

/* Network client pages — actionable empty states */
.net-primary-btn { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--accent); border-radius: 8px; background: var(--accent); color: var(--accent-fg); padding: 8px 13px; font-size: 12px; font-weight: 600; text-decoration: none; transition: 0.15s; }
.net-primary-btn:hover { opacity: 0.9; }
.net-empty-icon { position: relative; }
.net-empty-icon:empty::before { content: ""; width: 14px; height: 14px; border: 1px solid currentColor; border-radius: 50%; opacity: 0.7; }
.net-empty-icon:empty::after { content: ""; position: absolute; top: 50%; left: 50%; width: 4px; height: 4px; border-radius: 50%; background: currentColor; transform: translate(-50%, -50%); }
.net-empty-actions .net-primary-btn, .net-empty-actions .net-ghost-btn { padding: 7px 12px; font-size: 11.5px; }

.asn-how { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
.asn-how ol { margin: 10px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 8px; font-size: 11.5px; line-height: 1.55; color: var(--text-faint); }
.asn-how li::marker { color: var(--accent); font-family: var(--font-mono), monospace; }

.prox-table { table-layout: fixed; }
.prox-table th:nth-child(1), .prox-table td:nth-child(1) { width: 64px; }
.prox-table th:nth-child(3), .prox-table td:nth-child(3) { width: 56px; }
.prox-table th:nth-child(4), .prox-table td:nth-child(4) { width: 86px; }
.prox-table th:nth-child(5), .prox-table td:nth-child(5) { width: 56px; }
.prox-table th:nth-child(6), .prox-table td:nth-child(6) { width: 76px; }
.prox-table th:nth-child(7), .prox-table td:nth-child(7) { width: 76px; }
.prox-table td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.prox-server-table { table-layout: fixed; }
.prox-server-table th:nth-child(1), .prox-server-table td:nth-child(1) { width: 150px; }
.prox-server-table th:nth-child(3), .prox-server-table td:nth-child(3) { width: 110px; }
.prox-server-table th:nth-child(4), .prox-server-table td:nth-child(4) { width: 64px; }
.prox-server-table th:nth-child(5), .prox-server-table td:nth-child(5) { width: 64px; }
.prox-server-table th:nth-child(6), .prox-server-table td:nth-child(6) { width: 90px; }
.prox-server-table th:nth-child(7), .prox-server-table td:nth-child(7) { width: 92px; }
.prox-server-table td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }