:root{
  --ui-bg:var(--c-bg);
  --ui-surface:var(--c-surface-1);
  --ui-surface-raised:color-mix(in srgb,var(--c-surface-1) 92%,var(--c-bg));
  --ui-surface-muted:var(--c-surface-2);
  --ui-line:var(--c-line);
  --ui-line-strong:var(--c-line-strong);
  --ui-text:var(--c-ink-1);
  --ui-text-muted:var(--c-ink-3);
  --ui-text-soft:var(--c-ink-4);
  --ui-brand:var(--c-brand);
  --ui-brand-bg:var(--c-brand-bg);
  --ui-focus:var(--c-focus-ring);
  --ui-success:var(--c-success);
  --ui-warning:var(--c-warning);
  --ui-danger:var(--c-danger);
  --ui-success-bg:var(--c-success-bg);
  --ui-warning-bg:var(--c-warning-bg);
  --ui-danger-bg:var(--c-danger-bg);
  --ui-radius:8px;
  --ui-radius-lg:10px;
  --ui-shadow:var(--e-1);
  --ui-shadow-pop:var(--e-3);
}

html{
  background:var(--ui-bg);
}

body{
  font-family:var(--ff-sans);
  color:var(--ui-text);
  background:var(--ui-bg);
  font-size:var(--fs-md);
  line-height:var(--lh-md);
}

body:not(.page-login):not(.page-setup) .bg-flow{
  opacity:.44;
  filter:saturate(92%) blur(0);
}

:root[data-theme="light"] body:not(.page-login):not(.page-setup) .bg-flow{
  opacity:.36;
}

.container{
  max-width:var(--container-max);
  padding:var(--s-5) var(--s-6) calc(var(--s-6) + var(--safe-bottom));
}

.page-content{
  gap:var(--s-4);
}

.footer{
  max-width:var(--container-max);
  padding:var(--s-3) var(--s-6) calc(var(--s-4) + var(--safe-bottom));
  color:var(--ui-text-soft);
  font-size:var(--fs-xs);
}

.topbar{
  min-height:58px;
  padding:calc(var(--s-2) + var(--safe-top)) var(--s-5) var(--s-2);
  background:color-mix(in srgb,var(--ui-surface) 94%,transparent);
  border-bottom:1px solid var(--ui-line);
  box-shadow:var(--ui-shadow);
}

.brand{
  gap:var(--s-2);
}

.logo{
  width:32px;
  height:32px;
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line);
  box-shadow:none;
}

.logo-img{
  width:25px;
  height:25px;
}

.brand-name{
  color:var(--ui-text);
  font-size:15px;
  line-height:18px;
  font-weight:var(--fw-bold);
  letter-spacing:0;
}

.brand-sub{
  color:var(--ui-text-muted);
  font-size:10px;
  line-height:12px;
}

.top-actions,
.nav,
.nav-desktop{
  gap:var(--s-2);
}

.nav-link,
.nav-segment > summary.nav-link,
.nav-logout{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:var(--s-1);
  padding:0 var(--s-3);
  border:1px solid transparent;
  border-radius:var(--ui-radius);
  color:var(--ui-text-muted);
  background:transparent;
  font-size:var(--fs-sm);
  line-height:var(--lh-sm);
  font-weight:var(--fw-semibold);
}

.nav-link:hover,
.nav-segment > summary.nav-link:hover,
.nav-segment[open] > summary.nav-link,
.nav-link.active,
.nav-segment > summary.nav-link.active{
  transform:none;
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:var(--ui-line);
  box-shadow:none;
}

.nav-link:focus-visible,
.nav-segment > summary.nav-link:focus-visible{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

.page-head{
  margin:0;
  padding:var(--s-4);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s-3);
}

.page-head::before{
  display:none;
}

.page-head > *{
  position:relative;
  z-index:1;
}

.page-title{
  gap:var(--s-1);
}

.h1,
.page-title .h1{
  color:var(--ui-text);
  font-size:var(--fs-xl);
  line-height:var(--lh-xl);
  font-weight:var(--fw-bold);
  letter-spacing:0;
}

.h2{
  color:var(--ui-text);
  font-size:var(--fs-lg);
  line-height:var(--lh-lg);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
}

.muted,
.meta-item,
.card-sub,
.section-sub,
.help{
  color:var(--ui-text-muted);
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-hero,
.settings-card,
.settings-side,
.um-hero,
.um-table-card,
.wm-card,
.wm-fav-card,
.rs-list-card,
.tg-board-shell,
.tg-rule-shell,
.log-console-hero,
.netmon-toolbar,
.netmon-empty,
.site-card,
.site-tile,
.node-lite,
.wm-site-row,
.wm-fav-item,
.rs-item,
.tg-group-card,
.tg-rule-item,
.dcv2-ob-card,
.dcv2-rule-row,
.rule-card,
.node-item-row,
.netmon-node,
.log-row{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
  backdrop-filter:none;
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-card,
.wm-card,
.rs-list-card{
  padding:var(--s-4);
}

.card.compact,
.wm-card{
  padding:var(--s-3);
}

.card:hover,
.site-card:hover,
.site-tile:hover,
.wm-site-row:hover,
.wm-fav-item:hover,
.rs-item:hover,
.tg-group-card:hover,
.tg-rule-item:hover,
.dcv2-ob-card:hover,
.dcv2-rule-row:hover{
  transform:none;
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:var(--e-2);
}

.site-card::before,
.site-tile::before,
.wm-site-row::before,
.rs-item::before,
.tg-group-card::before,
.tg-rule-item::before,
.rule-card::before{
  box-shadow:none;
}

.card-title,
.wm-card-title,
.section-title,
.settings-hero-title,
.tg-health-title{
  color:var(--ui-text);
  font-size:var(--fs-lg);
  line-height:var(--lh-lg);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
}

.card-header,
.page-section-head,
.wm-card-head,
.section-head{
  margin:0 0 var(--s-3);
  gap:var(--s-3);
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.dash-filters,
.log-toggle-group{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar{
  padding:var(--s-2);
  gap:var(--s-2);
}

.dash-filters,
.log-toggle-group{
  padding:var(--s-1);
  gap:var(--s-1);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.btn,
.chip,
.log-toggle,
.site-nav a,
.site-tabs a,
.menu-item{
  border-radius:var(--ui-radius);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
  transition:
    color var(--motion-2) var(--ease-out),
    background var(--motion-2) var(--ease-out),
    border-color var(--motion-2) var(--ease-out),
    box-shadow var(--motion-2) var(--ease-out);
}

.btn{
  min-height:36px;
  padding:0 var(--s-4);
  border:1px solid color-mix(in srgb,var(--ui-brand) 44%,var(--ui-line));
  color:var(--c-brand-on);
  background:var(--ui-brand);
  box-shadow:none;
}

.btn:hover{
  transform:none;
  box-shadow:none;
  filter:brightness(1.02);
}

.btn:active{
  transform:none;
  filter:brightness(.98);
}

.btn.primary{
  color:var(--c-brand-on);
  background:var(--ui-brand);
  border-color:var(--ui-brand);
}

.btn.secondary,
.btn.ghost{
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
  box-shadow:none;
}

.btn.secondary:hover,
.btn.ghost:hover{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 34%,var(--ui-line));
}

.btn.danger{
  color:#fff;
  background:var(--ui-danger);
  border-color:var(--ui-danger);
}

.btn.sm{
  min-height:32px;
  padding:0 var(--s-3);
  border-radius:var(--ui-radius);
  font-size:var(--fs-sm);
}

.btn.xs{
  min-height:28px;
  padding:0 var(--s-2);
  border-radius:var(--ui-radius);
  font-size:var(--fs-xs);
}

.btn.icon{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  justify-content:center;
}

.btn.icon.xs{
  width:30px;
  min-width:30px;
  height:30px;
  min-height:30px;
}

.btn:disabled,
.btn.disabled{
  opacity:.52;
  cursor:not-allowed;
  filter:none;
}

.chip,
.log-toggle{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  gap:var(--s-1);
  padding:0 var(--s-3);
  border:1px solid transparent;
  color:var(--ui-text-muted);
  background:transparent;
  box-shadow:none;
  cursor:pointer;
}

.chip:hover,
.log-toggle:hover{
  transform:none;
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.chip.active,
.chip[aria-selected="true"],
.log-toggle.active,
.settings-nav-chip.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 36%,var(--ui-line));
  box-shadow:none;
}

.chip strong{
  color:inherit;
  font-weight:var(--fw-bold);
}

.pill{
  min-height:24px;
  display:inline-flex;
  align-items:center;
  gap:var(--s-1);
  padding:0 var(--s-2);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  color:var(--ui-text-muted);
  background:var(--ui-surface-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
  font-weight:var(--fw-semibold);
}

.pill.xs{
  min-height:22px;
  padding:0 7px;
  font-size:var(--fs-xs);
}

.pill.ghost{
  color:var(--ui-text-muted);
  border-color:var(--ui-line);
  background:transparent;
}

.pill.ok{
  color:var(--ui-success);
  border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-line));
  background:var(--ui-success-bg);
}

.pill.warn{
  color:var(--ui-warning);
  border-color:color-mix(in srgb,var(--ui-warning) 36%,var(--ui-line));
  background:var(--ui-warning-bg);
}

.pill.bad{
  color:var(--ui-danger);
  border-color:color-mix(in srgb,var(--ui-danger) 36%,var(--ui-line));
  background:var(--ui-danger-bg);
}

.input,
.select,
textarea,
.textarea{
  min-height:38px;
  width:100%;
  padding:0 var(--s-3);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  color:var(--ui-text);
  font-size:var(--fs-sm);
  line-height:var(--lh-sm);
  box-shadow:none;
}

textarea,
.textarea{
  padding:var(--s-2) var(--s-3);
  line-height:var(--lh-md);
}

.input.sm,
.select.sm{
  min-height:32px;
  padding:0 var(--s-2);
}

.input::placeholder,
.select::placeholder,
textarea::placeholder,
.textarea::placeholder{
  color:var(--ui-text-soft);
}

.label{
  display:block;
  margin:0 0 var(--s-1);
  color:var(--ui-text-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
  font-weight:var(--fw-semibold);
}

.help{
  margin-top:var(--s-1);
  font-size:var(--fs-xs);
  line-height:var(--lh-sm);
}

.input:focus,
.select:focus,
textarea:focus,
.textarea:focus,
.btn:focus-visible,
.chip:focus-visible,
.log-toggle:focus-visible,
.menu-item:focus-visible,
.dash-search-clear:focus-visible,
.site-nav a:focus-visible,
.site-tabs a:focus-visible{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

.menu-pop,
.menu-portal .menu-pop{
  padding:var(--s-1);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
}

.menu-item{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-3);
  padding:0 var(--s-3);
  color:var(--ui-text);
  border:1px solid transparent;
  background:transparent;
}

.menu-item:hover,
.menu-item.active{
  transform:none;
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:var(--ui-line);
}

.menu-item.danger{
  color:var(--ui-danger);
}

.menu-label{
  color:var(--ui-text-soft);
}

.table-wrap,
.table-shell,
.um-table-wrap,
.fm-table-wrap,
.netmon-ab-tablewrap{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  overflow:auto;
}

.table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}

.table th,
.table td{
  padding:9px var(--s-3);
  border-bottom:1px solid var(--ui-line);
  color:var(--ui-text);
  font-size:var(--fs-sm);
  line-height:var(--lh-sm);
  vertical-align:top;
}

.table.dense th,
.table.dense td,
.table.compact th,
.table.compact td{
  padding:7px var(--s-2);
  font-size:var(--fs-xs);
  line-height:var(--lh-sm);
}

.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th{
  background:var(--ui-surface-muted);
  color:var(--ui-text-muted);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
  text-transform:none;
}

.table tbody tr:last-child td{
  border-bottom:0;
}

.table tbody tr:hover td,
.dcv2-table tbody tr:hover td{
  background:var(--ui-brand-bg);
}

.flash{
  margin:0 0 var(--s-3);
  padding:var(--s-3);
  border:1px solid color-mix(in srgb,var(--ui-warning) 36%,var(--ui-line));
  border-radius:var(--ui-radius);
  background:var(--ui-warning-bg);
  color:var(--ui-warning);
  font-size:var(--fs-sm);
}

.flash.ok{
  border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-line));
  background:var(--ui-success-bg);
  color:var(--ui-success);
}

.flash.bad{
  border-color:color-mix(in srgb,var(--ui-danger) 36%,var(--ui-line));
  background:var(--ui-danger-bg);
  color:var(--ui-danger);
}

.modal{
  padding:var(--s-6);
  background:rgba(15,23,42,.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

:root[data-theme="dark"] .modal{
  background:rgba(2,6,23,.68);
}

.modal-inner,
.modal-inner.modal-pro,
.um-form-modal,
.rs-form-modal-inner,
.dcv2-modal-inner{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
  backdrop-filter:none;
}

.modal-head,
.modal-pro .modal-head{
  margin:0;
  padding:var(--s-4);
  border-bottom:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg) var(--ui-radius-lg) 0 0;
  background:var(--ui-surface);
}

.modal .modal-body,
.modal-body{
  color:var(--ui-text);
}

.toast{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:var(--ui-shadow-pop);
}

.toast.success{
  border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-line));
}

.toast.error{
  border-color:color-mix(in srgb,var(--ui-danger) 40%,var(--ui-line));
  background:var(--ui-surface);
  color:var(--ui-danger);
}

.dashboard-toolbar .dash-search,
.dash-search,
.site-search{
  min-height:36px;
  display:grid;
  grid-template-columns:18px minmax(0,1fr) 28px;
  align-items:center;
  gap:var(--s-2);
  padding:0 var(--s-2) 0 var(--s-3);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  box-shadow:none;
}

.dashboard-toolbar .dash-search:focus-within,
.dash-search:focus-within,
.site-search:focus-within{
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

.dash-search-input,
.site-search input{
  width:100%;
  min-height:32px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--ui-text);
  font-size:var(--fs-sm);
}

.dash-search-input::placeholder,
.site-search input::placeholder{
  color:var(--ui-text-soft);
}

.dash-search-clear{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:var(--ui-radius);
  background:transparent;
  color:var(--ui-text-soft);
  cursor:pointer;
}

.dash-search-clear:hover{
  color:var(--ui-text);
  background:var(--ui-surface-muted);
}

.page-head > *,
.card-header > *,
.page-section-head > *,
.toolbar-panel > *,
.dashboard-toolbar > *,
.node-left,
.node-main,
.node-info,
.site-left,
.wm-card-head > *,
.table td,
.table th{
  min-width:0;
}

.truncate,
.node-name,
.node-host,
.site-name,
.site-domain,
.wm-card-title{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.mono{
  font-family:var(--ff-mono);
}

input[type="checkbox"],
input[type="radio"]{
  accent-color:var(--ui-brand);
}

@media (max-width:1100px){
  .nav-desktop{
    display:none;
  }

  .nav-mobile{
    display:inline-block;
  }
}

@media (max-width:720px){
  .container{
    padding:var(--s-3) var(--s-3) calc(var(--s-4) + var(--safe-bottom));
  }

  .topbar{
    padding:calc(var(--s-2) + var(--safe-top)) var(--s-3) var(--s-2);
  }

  .brand-sub{
    display:none;
  }

  .page-head{
    padding:var(--s-3);
    flex-direction:column;
  }

  .page-head .right,
  .page-head .action-group{
    width:100%;
    justify-content:flex-start;
  }

  .page-head .right > .btn,
  .page-head .right > a.btn,
  .page-head .right > details.menu,
  .page-head .right > details.menu > summary{
    width:100%;
    justify-content:center;
  }

  .card,
  .page-section-shell:not(.dashboard-content-shell),
  .settings-card,
  .wm-card,
  .rs-list-card{
    padding:var(--s-3);
  }

  .modal{
    padding:var(--s-2);
    align-items:stretch;
  }

  .modal-inner,
  .modal-inner.modal-pro{
    width:100%;
    max-width:100%;
    max-height:calc(100dvh - 16px);
  }

  .modal-head,
  .modal-pro .modal-head{
    padding:var(--s-3);
  }
}

/* Nexus unified control-plane layer. This file loads last and is the visual source of truth. */
:root{
  --surface:var(--ui-surface);
  --surface-elevated:var(--ui-surface);
  --surface-strong:var(--ui-surface-raised);
  --surface-2:var(--ui-surface-muted);
  --glass-bg:var(--ui-surface);
  --glass-bg-hover:var(--ui-surface-raised);
  --glass-border:var(--ui-line);
  --glass-border-highlight:var(--ui-line-strong);
  --text:var(--ui-text);
  --text-strong:var(--ui-text);
  --text-muted:var(--ui-text-muted);
  --text-soft:var(--ui-text-soft);
  --line:var(--ui-line);
  --border-subtle:var(--ui-line);
  --border-strong:color-mix(in srgb,var(--ui-brand) 34%,var(--ui-line));
  --accent:var(--ui-brand);
  --accent2:color-mix(in srgb,var(--ui-brand) 70%,var(--ui-success));
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
  --radius:var(--ui-radius-lg);
  --radius-xs:var(--ui-radius);
  --radius-sm:var(--ui-radius);
  --radius-md:var(--ui-radius-lg);
  --radius-lg:var(--ui-radius-lg);
  --shadow-sm:var(--ui-shadow);
  --shadow-md:var(--e-2);
  --shadow:var(--ui-shadow);
  --glow:var(--ui-shadow);
  --hover-lift:0px;
  --press-lift:0px;
}

:root[data-theme="dark"]{
  --shadow-sm:var(--ui-shadow);
  --shadow-md:var(--e-2);
  --shadow:var(--ui-shadow);
  --glow:var(--ui-shadow);
}

html{
  color-scheme:light;
  scrollbar-color:color-mix(in srgb,var(--ui-text-soft) 48%,transparent) transparent;
}

html[data-theme="dark"]{
  color-scheme:dark;
}

body{
  color:var(--ui-text);
  background:var(--ui-bg);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

body:not(.page-login):not(.page-setup) .bg-flow{
  opacity:.18;
  filter:saturate(88%);
}

:root[data-theme="dark"] body:not(.page-login):not(.page-setup) .bg-flow{
  opacity:.24;
}

.bg-noise{
  opacity:.018;
}

.app-shell,
.page-shell,
.app-body,
.page-frame,
.app-content,
.page-content{
  min-width:0;
}

.page-content{
  gap:var(--s-4);
  min-height:calc(100vh - 150px);
}

.container{
  width:100%;
  max-width:min(var(--container-max), calc(100vw - 24px));
  padding:var(--s-4) var(--s-5) calc(var(--s-5) + var(--safe-bottom));
}

.footer{
  max-width:min(var(--container-max), calc(100vw - 24px));
}

.topbar{
  min-height:56px;
  padding:calc(var(--s-2) + var(--safe-top)) var(--s-5) var(--s-2);
  background:color-mix(in srgb,var(--ui-surface) 94%,transparent);
  border-bottom:1px solid var(--ui-line);
  box-shadow:var(--ui-shadow);
  backdrop-filter:blur(14px);
}

.brand,
.top-actions,
.nav,
.nav-desktop{
  min-width:0;
}

.brand{
  flex:0 1 auto;
}

.brand-sub{
  max-width:190px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.nav-link,
.nav-segment > summary.nav-link,
.nav-logout,
.theme-toggle{
  white-space:nowrap;
}

.page-head,
.dash-page-head{
  position:relative;
  min-height:0;
  margin:0;
  padding:var(--s-4);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s-4);
  overflow:hidden;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.page-head::before,
.dash-page-head::before{
  display:none;
}

.page-title,
.dash-page-title{
  min-width:0;
  gap:var(--s-1);
}

.page-head .h1,
.h1,
.dash-page-title h1{
  margin:0;
  color:var(--ui-text);
  font-family:var(--ff-sans);
  font-size:var(--fs-xl);
  line-height:var(--lh-xl);
  font-weight:var(--fw-bold);
  letter-spacing:0;
}

.page-head .h2,
.h2{
  margin:0;
  color:var(--ui-text);
  font-size:var(--fs-lg);
  line-height:var(--lh-lg);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
}

.dash-page-title p,
.page-title > p,
.page-head .meta,
.meta,
.page-head-status{
  margin:var(--s-1) 0 0;
}

.meta,
.page-head .meta,
.page-head-status{
  display:flex;
  align-items:center;
  gap:var(--s-2);
  flex-wrap:wrap;
  min-width:0;
}

.meta-item,
.page-head .meta-item{
  min-height:24px;
  display:inline-flex;
  align-items:center;
  gap:var(--s-1);
  padding:0;
  border:0;
  color:var(--ui-text-muted);
  background:transparent;
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
}

.page-head .right,
.page-head .action-group,
.dash-page-actions,
.action-group,
.right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:var(--s-2);
  flex-wrap:wrap;
  min-width:0;
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-hero,
.settings-card,
.settings-side,
.um-hero,
.um-table-card,
.wm-card,
.wm-fav-card,
.rs-list-card,
.tg-board-shell,
.tg-rule-shell,
.log-console-hero,
.log-stream-card,
.log-detail-card,
.netmon-toolbar,
.netmon-empty,
.netmon-chart-card,
.site-card,
.site-tile,
.node-lite,
.node-sidebar,
.node-item-row,
.rule-card,
.wm-site-row,
.wm-fav-item,
.wm-node-row,
.rs-item,
.tg-group-card,
.tg-rule-item,
.tg-member-card,
.tg-rule-kpi-card,
.dcv2-card,
.dcv2-overview-card,
.dcv2-ob-card,
.dcv2-rule-row,
.dcv2-log-stream-card,
.dcv2-log-detail-card,
.log-row{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
  backdrop-filter:none;
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-card,
.settings-side,
.wm-card,
.rs-list-card,
.log-stream-card,
.log-detail-card{
  padding:var(--s-4);
}

.card.compact,
.wm-card.compact,
.page-section-shell.compact{
  padding:var(--s-3);
}

.card::before,
.page-head::before,
.site-card::before,
.site-tile::before,
.wm-site-row::before,
.wm-fav-item::before,
.rs-item::before,
.tg-group-card::before,
.tg-rule-item::before,
.rule-card::before{
  display:none;
}

.card:hover,
.site-card:hover,
.site-tile:hover,
.wm-site-row:hover,
.wm-fav-item:hover,
.wm-node-row:hover,
.rs-item:hover,
.tg-group-card:hover,
.tg-rule-item:hover,
.tg-member-card:hover,
.dcv2-ob-card:hover,
.dcv2-rule-row:hover{
  transform:none;
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:var(--e-2);
}

.card-title,
.wm-card-title,
.section-title,
.settings-hero-title,
.tg-health-title,
.panel-title{
  color:var(--ui-text);
  font-size:var(--fs-lg);
  line-height:var(--lh-lg);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
}

.card-sub,
.wm-card-sub,
.section-sub,
.settings-hero-sub,
.panel-sub,
.help,
.muted,
.muted.sm{
  color:var(--ui-text-muted);
}

.card-header,
.page-section-head,
.wm-card-head,
.section-head,
.panel-head{
  margin:0 0 var(--s-3);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s-3);
  flex-wrap:wrap;
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar,
.dcv2-rule-toolbar,
.dcv2-log-toolbar,
.remote-upload-panel{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar{
  padding:var(--s-2);
  gap:var(--s-2);
}

.dashboard-toolbar,
.toolbar-panel.dashboard-toolbar,
.settings-toolbar,
.wm-toolbar,
.rs-toolbar{
  background:color-mix(in srgb,var(--ui-surface) 95%,transparent);
  backdrop-filter:blur(14px);
}

.dash-filters,
.log-toggle-group,
.segmented{
  min-width:0;
  display:flex;
  align-items:center;
  gap:var(--s-1);
  padding:var(--s-1);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface-muted);
  box-shadow:none;
  overflow-x:auto;
  scrollbar-width:none;
}

.dash-filters::-webkit-scrollbar,
.log-toggle-group::-webkit-scrollbar,
.segmented::-webkit-scrollbar{
  display:none;
}

.btn,
.chip,
.log-toggle,
.tab,
.site-nav a,
.site-tabs a,
.settings-nav-chip,
.segmented button,
.menu-item{
  border-radius:var(--ui-radius);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
}

.btn{
  min-height:36px;
  padding:0 var(--s-4);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--s-2);
  border:1px solid var(--ui-brand);
  color:var(--c-brand-on);
  background:var(--ui-brand);
  box-shadow:none;
  cursor:pointer;
  text-decoration:none;
}

.btn:hover,
.btn:active{
  transform:none;
  box-shadow:none;
  filter:brightness(1.02);
}

.btn.ghost,
.btn.secondary,
.btn.icon.ghost{
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.btn.ghost:hover,
.btn.secondary:hover,
.btn.icon.ghost:hover{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 34%,var(--ui-line));
}

.btn.primary{
  color:var(--c-brand-on);
  background:var(--ui-brand);
  border-color:var(--ui-brand);
}

.btn.danger,
.btn.bad{
  color:#fff;
  background:var(--ui-danger);
  border-color:var(--ui-danger);
}

.btn.sm{
  min-height:32px;
  padding:0 var(--s-3);
  font-size:var(--fs-sm);
}

.btn.xs{
  min-height:28px;
  padding:0 var(--s-2);
  font-size:var(--fs-xs);
}

.btn.icon{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
}

.btn.icon.xs{
  width:30px;
  min-width:30px;
  height:30px;
  min-height:30px;
}

.btn:disabled,
.btn.disabled,
button:disabled,
select:disabled,
input:disabled,
textarea:disabled{
  opacity:.55;
  cursor:not-allowed;
  filter:none;
}

.chip,
.log-toggle,
.settings-nav-chip,
.segmented button,
.tab{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--s-1);
  padding:0 var(--s-3);
  border:1px solid transparent;
  color:var(--ui-text-muted);
  background:transparent;
  box-shadow:none;
  cursor:pointer;
  text-decoration:none;
  white-space:nowrap;
}

.chip:hover,
.log-toggle:hover,
.settings-nav-chip:hover,
.segmented button:hover,
.tab:hover{
  transform:none;
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.chip.active,
.chip[aria-selected="true"],
.log-toggle.active,
.settings-nav-chip.active,
.segmented button.active,
.tab.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 36%,var(--ui-line));
  box-shadow:none;
}

.pill,
.status-pill,
.tg-chip{
  min-height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--s-1);
  padding:0 var(--s-2);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  color:var(--ui-text-muted);
  background:var(--ui-surface-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
  font-weight:var(--fw-semibold);
  white-space:nowrap;
}

.pill.ok,
.status-pill.ok,
.tg-chip.active,
.tg-chip.ok{
  color:var(--ui-success);
  border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-line));
  background:var(--ui-success-bg);
}

.pill.warn,
.status-pill.warn,
.tg-chip.warn{
  color:var(--ui-warning);
  border-color:color-mix(in srgb,var(--ui-warning) 36%,var(--ui-line));
  background:var(--ui-warning-bg);
}

.pill.bad,
.status-pill.bad,
.tg-chip.bad{
  color:var(--ui-danger);
  border-color:color-mix(in srgb,var(--ui-danger) 36%,var(--ui-line));
  background:var(--ui-danger-bg);
}

.input,
.select,
textarea,
.textarea,
input[type="text"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="email"],
select{
  min-height:38px;
  width:100%;
  padding:0 var(--s-3);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  color:var(--ui-text);
  font-family:inherit;
  font-size:var(--fs-sm);
  line-height:var(--lh-sm);
  box-shadow:none;
}

textarea,
.textarea{
  padding:var(--s-2) var(--s-3);
  line-height:var(--lh-md);
  resize:vertical;
}

.input.sm,
.select.sm,
select.sm{
  min-height:32px;
  padding:0 var(--s-2);
}

.input::placeholder,
textarea::placeholder,
.textarea::placeholder{
  color:var(--ui-text-soft);
}

.label{
  display:block;
  margin:0 0 var(--s-1);
  color:var(--ui-text-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
  font-weight:var(--fw-semibold);
}

.form,
.settings-form,
.form-grid,
.settings-field-grid,
.wm-create-grid,
.rs-form-grid{
  min-width:0;
}

.settings-field-grid,
.form-grid,
.wm-create-grid,
.rs-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s-3);
}

.settings-field.full,
.form-grid .full,
.wm-create-grid .full,
.rs-form-grid .full{
  grid-column:1 / -1;
}

.settings-check,
.um-switch,
.help label,
label.help{
  display:inline-flex;
  align-items:flex-start;
  gap:var(--s-2);
  color:var(--ui-text-muted);
  line-height:var(--lh-sm);
}

.input:focus,
.select:focus,
textarea:focus,
.textarea:focus,
select:focus,
.btn:focus-visible,
.chip:focus-visible,
.log-toggle:focus-visible,
.settings-nav-chip:focus-visible,
.segmented button:focus-visible,
.menu-item:focus-visible,
.site-nav a:focus-visible,
.site-tabs a:focus-visible,
.tab:focus-visible{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

.table-wrap,
.table-shell,
.um-table-wrap,
.fm-table-wrap,
.netmon-ab-tablewrap,
.tg-rule-member-table-wrap,
.trace-route-table-wrap{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.table,
.um-table,
.dcv2-table,
.netmon-ab-table,
.tg-rule-member-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}

.table th,
.table td,
.um-table th,
.um-table td,
.dcv2-table th,
.dcv2-table td,
.netmon-ab-table th,
.netmon-ab-table td,
.tg-rule-member-table th,
.tg-rule-member-table td{
  padding:9px var(--s-3);
  border-bottom:1px solid var(--ui-line);
  color:var(--ui-text);
  font-size:var(--fs-sm);
  line-height:var(--lh-sm);
  text-align:left;
  vertical-align:top;
}

.table.dense th,
.table.dense td,
.table.compact th,
.table.compact td{
  padding:7px var(--s-2);
  font-size:var(--fs-xs);
}

.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th,
.tg-rule-member-table thead th{
  position:static;
  background:var(--ui-surface-muted);
  color:var(--ui-text-muted);
  font-weight:var(--fw-semibold);
  letter-spacing:0;
  text-transform:none;
  white-space:nowrap;
}

.table tbody tr:last-child td,
.um-table tbody tr:last-child td,
.dcv2-table tbody tr:last-child td,
.netmon-ab-table tbody tr:last-child td,
.tg-rule-member-table tbody tr:last-child td{
  border-bottom:0;
}

.table tbody tr:hover td,
.um-table tbody tr:hover td,
.dcv2-table tbody tr:hover td,
.netmon-ab-table tbody tr:hover td,
.tg-rule-member-table tbody tr:hover td{
  background:var(--ui-brand-bg);
}

.menu-pop,
.menu-portal .menu-pop{
  padding:var(--s-1);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
}

.menu-item{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s-3);
  padding:0 var(--s-3);
  color:var(--ui-text);
  border:1px solid transparent;
  background:transparent;
}

.menu-item:hover,
.menu-item.active{
  transform:none;
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:var(--ui-line);
}

.modal{
  position:fixed;
  inset:0;
  z-index:60;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--s-6);
  background:rgba(15,23,42,.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

:root[data-theme="dark"] .modal{
  background:rgba(2,6,23,.68);
}

.modal.is-hidden,
.is-hidden{
  display:none !important;
}

.modal-inner,
.modal-inner.modal-pro,
.um-form-modal,
.rs-form-modal-inner,
.dcv2-modal-inner,
.fm-upload-modal,
.fm-share-modal,
.wm-create-inner,
.wm-favorite-modal-inner,
.trace-route-modal-inner{
  width:min(100%, 720px);
  max-height:calc(100vh - 48px);
  max-height:calc(100dvh - 48px);
  overflow:auto;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
  backdrop-filter:none;
}

.modal-inner.maxw-520{width:min(100%,520px);}
.modal-inner.maxw-560{width:min(100%,560px);}
.modal-inner.maxw-720{width:min(100%,720px);}
.modal-inner.maxw-760{width:min(100%,760px);}
.modal-inner.maxw-860{width:min(100%,860px);}

.modal-head,
.modal-pro .modal-head{
  position:sticky;
  top:0;
  z-index:3;
  margin:0;
  padding:var(--s-4);
  border-bottom:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg) var(--ui-radius-lg) 0 0;
  background:var(--ui-surface);
}

.modal-body,
.modal .modal-body{
  padding:var(--s-4);
  color:var(--ui-text);
}

.modal-inner > .row:first-child{
  position:sticky;
  top:0;
  z-index:3;
  margin:0;
  padding:var(--s-4);
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface);
}

.modal-inner > .form,
.modal-inner > form,
.modal-inner > .mt-10,
.modal-inner > .table-wrap{
  padding:var(--s-4);
}

.modal .card,
.modal .panel,
.modal .um-section,
.modal .advanced-details,
.modal .dcv2-conflict-diff,
.modal .trace-route-chart-card{
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.row-end,
.row-end-sm,
.row-end-12,
.dcv2-modal-actions,
.rs-form-modal-foot,
.wm-create-actions{
  display:flex;
  justify-content:flex-end;
  gap:var(--s-2);
  flex-wrap:wrap;
}

.modal .row-end,
.modal .row-end-sm,
.modal .row-end-12,
.modal .dcv2-modal-actions,
.modal .rs-form-modal-foot,
.modal .wm-create-actions{
  position:sticky;
  bottom:0;
  z-index:2;
  padding-top:var(--s-3);
  background:linear-gradient(180deg, transparent, var(--ui-surface) 34%);
}

.toast{
  position:fixed;
  right:var(--s-5);
  bottom:calc(var(--s-5) + var(--safe-bottom));
  z-index:90;
  max-width:min(420px, calc(100vw - 32px));
  padding:var(--s-3) var(--s-4);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:var(--ui-shadow-pop);
}

.toast.success{
  border-color:color-mix(in srgb,var(--ui-success) 34%,var(--ui-line));
}

.toast.error{
  border-color:color-mix(in srgb,var(--ui-danger) 40%,var(--ui-line));
  color:var(--ui-danger);
}

.settings-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);
  align-items:center;
  gap:var(--s-4);
}

.settings-hero-right{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--s-2);
}

.settings-hero-stat,
.page-kpi,
.log-kpi,
.rs-meta-row,
.dcv2-situation-item,
.dcv2-health-item,
.dcv2-health-metric,
.tg-rule-kpi-card,
.tg-focus-item,
.kvline,
.site-kpi,
.stat-card{
  padding:var(--s-3);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.settings-hero-stat .k,
.page-kpi-k,
.log-kpi-label,
.rs-meta-k,
.kvline .k,
.site-kpi .k,
.stat-label{
  color:var(--ui-text-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
  font-weight:var(--fw-semibold);
}

.settings-hero-stat .v,
.page-kpi-v,
.log-kpi-value,
.site-kpi .v,
.stat-value{
  margin-top:var(--s-1);
  color:var(--ui-text);
  font-size:var(--fs-lg);
  line-height:var(--lh-lg);
  font-weight:var(--fw-bold);
  letter-spacing:0;
}

.settings-console{
  display:grid;
  grid-template-columns:280px minmax(0,1fr);
  gap:var(--s-4);
  align-items:start;
}

.settings-side{
  position:sticky;
  top:calc(58px + var(--safe-top) + var(--s-4));
}

.settings-side-nav{
  display:flex;
  flex-direction:column;
  gap:var(--s-1);
}

.settings-nav-chip{
  justify-content:flex-start;
}

.settings-action-bar{
  position:sticky;
  bottom:var(--s-3);
  z-index:12;
}

.settings-action-inner{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:color-mix(in srgb,var(--ui-surface) 95%,transparent);
  box-shadow:var(--ui-shadow-pop);
  backdrop-filter:blur(14px);
}

.wm-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,360px);
  gap:var(--s-4);
  align-items:start;
}

.wm-sites,
.wm-node-list,
.rs-list,
.tg-board,
.tg-rule-list,
.log-list{
  display:flex;
  flex-direction:column;
  gap:var(--s-2);
}

.wm-site-row,
.rs-item,
.tg-group-card,
.tg-rule-item{
  padding:var(--s-3);
}

.wm-site-line1,
.wm-site-line2,
.wm-site-right,
.wm-site-kpis,
.wm-site-actions,
.site-top,
.site-meta,
.site-right,
.node-acc-right,
.tg-group-top,
.tg-rule-head{
  min-width:0;
  display:flex;
  align-items:center;
  gap:var(--s-2);
  flex-wrap:wrap;
}

.wm-site-left,
.site-left,
.node-acc-title,
.node-acc-sub,
.wm-site-name,
.wm-site-domain,
.site-name,
.site-domain{
  min-width:0;
  overflow-wrap:anywhere;
}

.wm-site-actions,
.site-right,
.tg-group-actions,
.tg-rule-actions{
  justify-content:flex-end;
}

.wm-fav-grid,
.site-cards,
.site-grid,
.stat-grid,
.netmon-charts,
.tg-health-grid,
.dcv2-health-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:var(--s-2);
}

.site-layout{
  display:grid;
  grid-template-columns:minmax(220px,280px) minmax(0,1fr);
  gap:var(--s-4);
  align-items:start;
}

.site-layout.site-layout-detail,
.site-layout.site-layout-diagnose{
  grid-template-columns:minmax(0,1fr);
}

.site-nav,
.site-tabs{
  display:flex;
  align-items:center;
  gap:var(--s-1);
  flex-wrap:wrap;
}

.site-nav a,
.site-tabs a{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  padding:0 var(--s-3);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  color:var(--ui-text-muted);
  text-decoration:none;
}

.site-nav a:hover,
.site-tabs a:hover,
.site-nav a.active,
.site-tabs a.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 34%,var(--ui-line));
}

.log-console-layout,
.dcv2-log-console-layout{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);
  gap:var(--s-4);
  align-items:start;
}

.log-row{
  padding:var(--s-2) var(--s-3);
  box-shadow:none;
}

.log-row-msg,
.log-detail-text,
.log-detail-context,
.pre,
pre{
  overflow-wrap:anywhere;
  white-space:pre-wrap;
}

.netmon-toolbar .row,
.log-toolbar-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:var(--s-2);
  align-items:end;
}

.netmon-toolbar .row > .col{
  min-width:0;
}

.netmon-chart-card{
  position:relative;
  padding:var(--s-3);
}

.netmon-chart-card.is-busy,
.netmon-chart-card[aria-busy="true"]{
  border-color:color-mix(in srgb,var(--ui-brand) 34%,var(--ui-line));
  box-shadow:var(--ui-shadow), inset 0 0 0 1px color-mix(in srgb,var(--ui-brand) 18%,transparent);
}

.tg-board-shell,
.tg-rule-shell{
  overflow:hidden;
}

.tg-rule-toolbar,
.dcv2-rule-toolbar{
  display:flex;
  align-items:center;
  gap:var(--s-2);
  flex-wrap:wrap;
}

.tg-group-config-scroll,
.tg-rule-member-table-scroll{
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.um-table-toolbar{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  align-items:end;
}

.um-mode-card,
.mode-card{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:none;
}

.um-mode-card:hover,
.mode-card:hover,
.mode-card.active,
.mode-card[aria-checked="true"],
.mode-card[aria-selected="true"]{
  border-color:color-mix(in srgb,var(--ui-brand) 36%,var(--ui-line));
  background:var(--ui-brand-bg);
}

.page-remote-control{
  --ui-bg:#05070a;
  --ui-surface:#101720;
  --ui-surface-raised:#151f2c;
  --ui-surface-muted:#0f172a;
  --ui-line:rgba(148,163,184,.22);
  --ui-line-strong:rgba(148,163,184,.36);
  --ui-text:#e5edf7;
  --ui-text-muted:#9fb0c3;
  --ui-text-soft:#718096;
  --ui-brand:#38bdf8;
  --ui-brand-bg:rgba(56,189,248,.16);
  --ui-focus:rgba(56,189,248,.24);
  --ui-shadow:0 14px 34px rgba(0,0,0,.28);
  --ui-shadow-pop:0 18px 50px rgba(0,0,0,.35);
}

.page-remote-control .remote-title,
.page-remote-control .remote-actions{
  min-width:0;
}

.page-remote-control .remote-title span{
  min-height:24px;
  display:inline-flex;
  align-items:center;
  padding:0 var(--s-2);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  color:var(--ui-text-muted);
  background:var(--ui-surface-muted);
  font-size:var(--fs-xs);
}

.page-remote-control .btn.ghost,
.page-remote-control .remote-actions .select,
.page-remote-control .remote-upload-controls .select,
.page-remote-control .remote-upload-controls .input,
.page-remote-control .remote-mobile-controls .input{
  color:var(--ui-text);
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
}

.page-remote-control .btn.ghost:hover,
.page-remote-control .remote-mobile-controls .segmented button.active{
  color:var(--ui-text);
  border-color:color-mix(in srgb,var(--ui-brand) 42%,var(--ui-line));
  background:var(--ui-brand-bg);
}

.flash{
  margin:0;
  padding:var(--s-3);
  border:1px solid color-mix(in srgb,var(--ui-warning) 36%,var(--ui-line));
  border-radius:var(--ui-radius);
  background:var(--ui-warning-bg);
  color:var(--ui-warning);
}

.empty-state{
  color:var(--ui-text-muted);
}

.danger-panel,
.site-danger-card{
  border-color:color-mix(in srgb,var(--ui-danger) 36%,var(--ui-line));
  background:color-mix(in srgb,var(--ui-danger-bg) 42%,var(--ui-surface));
}

.dashboard-toolbar .dash-search,
.dash-search,
.site-search{
  min-height:36px;
  display:grid;
  grid-template-columns:18px minmax(0,1fr) 28px;
  align-items:center;
  gap:var(--s-2);
  padding:0 var(--s-2) 0 var(--s-3);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  box-shadow:none;
}

.dash-search-input,
.site-search input{
  width:100%;
  min-height:32px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--ui-text);
}

.dash-search-clear,
.site-search .clear{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:var(--ui-radius);
  background:transparent;
  color:var(--ui-text-soft);
}

.dash-search:focus-within,
.site-search:focus-within{
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

.truncate,
.node-name,
.node-host,
.site-name,
.site-domain,
.wm-card-title,
.wm-site-name,
.wm-site-domain,
.rs-title,
.log-row-msg{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.wrap,
.mono.wrap,
.table td,
.table th,
.modal-body,
.help{
  overflow-wrap:anywhere;
}

@media (max-width:1180px){
  .settings-console,
  .wm-layout,
  .log-console-layout,
  .dcv2-log-console-layout{
    grid-template-columns:minmax(0,1fr);
  }

  .settings-side{
    position:static;
  }
}

@media (max-width:920px){
  .settings-hero,
  .site-layout{
    grid-template-columns:minmax(0,1fr);
  }

  .settings-hero-right,
  .settings-field-grid,
  .form-grid,
  .wm-create-grid,
  .rs-form-grid{
    grid-template-columns:minmax(0,1fr);
  }

  .settings-field.full,
  .form-grid .full,
  .wm-create-grid .full,
  .rs-form-grid .full{
    grid-column:auto;
  }

  .remote-actions{
    justify-content:flex-start;
  }
}

@media (max-width:720px){
  .container{
    max-width:100%;
    padding:var(--s-3) var(--s-3) calc(var(--s-4) + var(--safe-bottom));
  }

  .topbar{
    min-height:52px;
    padding:calc(var(--s-2) + var(--safe-top)) var(--s-3) var(--s-2);
  }

  .brand-sub,
  .theme-toggle-text{
    display:none;
  }

  .page-head,
  .dash-page-head{
    padding:var(--s-3);
    flex-direction:column;
    align-items:stretch;
  }

  .page-head .right,
  .page-head .action-group,
  .dash-page-actions{
    width:100%;
    justify-content:flex-start;
  }

  .page-head .right > .btn,
  .page-head .right > a.btn,
  .page-head .right > details.menu,
  .page-head .right > details.menu > summary,
  .dash-page-actions > .btn{
    width:100%;
  }

  .card,
  .page-section-shell:not(.dashboard-content-shell),
  .settings-card,
  .settings-side,
  .wm-card,
  .rs-list-card,
  .log-stream-card,
  .log-detail-card{
    padding:var(--s-3);
  }

  .toolbar-panel,
  .dashboard-toolbar,
  .wm-toolbar,
  .settings-toolbar,
  .rs-toolbar,
  .log-filter-bar,
  .audit-toolbar,
  .um-table-toolbar,
  .sites-toolbar,
  .fm-toolbar{
    align-items:stretch;
  }

  .dash-filters,
  .log-toggle-group,
  .segmented{
    width:100%;
  }

  .toolbar-panel > *,
  .dashboard-toolbar > *,
  .wm-toolbar > *,
  .settings-toolbar > *,
  .rs-toolbar > *,
  .log-filter-bar > *,
  .audit-toolbar > *,
  .sites-toolbar > *,
  .fm-toolbar > *,
  .remote-actions > *,
  .remote-upload-controls > *{
    min-width:0;
  }

  .wm-site-row,
  .rs-item,
  .tg-group-card,
  .tg-rule-item{
    padding:var(--s-3);
  }

  .wm-site-right,
  .wm-site-actions,
  .site-right,
  .tg-group-actions,
  .tg-rule-actions{
    width:100%;
    justify-content:flex-start;
  }

  .wm-site-actions > .btn,
  .site-right > .btn,
  .tg-group-actions > .btn,
  .tg-rule-actions > .btn{
    flex:1 1 120px;
  }

  .modal{
    padding:var(--s-2);
    align-items:stretch;
  }

  .modal-inner,
  .modal-inner.modal-pro,
  .um-form-modal,
  .rs-form-modal-inner,
  .dcv2-modal-inner,
  .fm-upload-modal,
  .fm-share-modal,
  .wm-create-inner,
  .wm-favorite-modal-inner,
  .trace-route-modal-inner{
    width:100%;
    max-width:100%;
    max-height:calc(100dvh - 16px);
  }

  .modal-body,
  .modal-inner > .form,
  .modal-inner > form,
  .modal-inner > .mt-10,
  .modal-inner > .table-wrap{
    padding:var(--s-3);
  }

  .modal-head,
  .modal-pro .modal-head,
  .modal-inner > .row:first-child{
    padding:var(--s-3);
  }

  .row-end,
  .row-end-sm,
  .row-end-12,
  .dcv2-modal-actions,
  .rs-form-modal-foot,
  .wm-create-actions{
    justify-content:stretch;
  }

  .row-end > .btn,
  .row-end-sm > .btn,
  .row-end-12 > .btn,
  .dcv2-modal-actions > .btn,
  .rs-form-modal-foot > .btn,
  .wm-create-actions > .btn{
    flex:1 1 120px;
  }

  .toast{
    right:var(--s-3);
    bottom:calc(var(--s-3) + var(--safe-bottom));
  }
}

/* Terminal-minimal reference layer. Loaded last to align all panel surfaces. */
:root{
  --ui-bg:var(--c-bg);
  --ui-surface:var(--c-surface-1);
  --ui-surface-raised:#ffffff;
  --ui-surface-muted:var(--c-surface-2);
  --ui-line:var(--c-line);
  --ui-line-strong:var(--c-line-strong);
  --ui-text:var(--c-ink-1);
  --ui-text-muted:var(--c-ink-3);
  --ui-text-soft:var(--c-ink-4);
  --ui-brand:var(--c-brand);
  --ui-brand-bg:var(--c-brand-bg);
  --ui-focus:var(--c-focus-ring);
  --ui-success:var(--c-success);
  --ui-warning:var(--c-warning);
  --ui-danger:var(--c-danger);
  --ui-success-bg:var(--c-success-bg);
  --ui-warning-bg:var(--c-warning-bg);
  --ui-danger-bg:var(--c-danger-bg);
  --ui-radius:var(--r-md);
  --ui-radius-lg:var(--r-lg);
  --ui-shadow:none;
  --ui-shadow-pop:var(--e-3);
  --font-sans:var(--ff-sans);
  --font-title:var(--ff-sans);
  --font-mono:var(--ff-mono);
  --bg:var(--ui-bg);
  --bg2:var(--ui-bg);
  --surface:var(--ui-surface);
  --surface-elevated:var(--ui-surface);
  --surface-strong:var(--ui-surface);
  --surface-2:var(--ui-surface-muted);
  --glass-bg:var(--ui-surface);
  --glass-bg-hover:var(--ui-surface-raised);
  --glass-border:var(--ui-line);
  --glass-border-highlight:var(--ui-line-strong);
  --text:var(--ui-text);
  --text-strong:var(--ui-text);
  --text-muted:var(--ui-text-muted);
  --text-soft:var(--ui-text-soft);
  --line:var(--ui-line);
  --line-strong:var(--ui-line-strong);
  --border-subtle:var(--ui-line);
  --border-strong:var(--ui-line-strong);
  --accent:var(--ui-brand);
  --accent2:var(--ui-brand);
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
  --radius:var(--ui-radius-lg);
  --radius-xs:var(--ui-radius);
  --radius-sm:var(--ui-radius);
  --radius-md:var(--ui-radius-lg);
  --radius-lg:var(--ui-radius-lg);
  --shadow-sm:none;
  --shadow-md:none;
  --shadow:none;
  --glow:none;
  --hover-lift:0px;
  --press-lift:0px;
}

:root[data-theme="dark"]{
  --ui-surface-raised:#121920;
  --ui-shadow-pop:var(--e-3);
}

*,
*::before,
*::after{
  letter-spacing:0;
}

html{
  background:var(--ui-bg);
}

body{
  color:var(--ui-text);
  background:var(--ui-bg);
  font-family:var(--ff-sans);
  font-variant-numeric:tabular-nums;
  text-rendering:geometricPrecision;
}

.skip-link{
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:none;
}

body .bg-flow,
body .bg-noise{
  display:none;
}

.route-embed .topbar,
.route-embed .terminal-ribbon,
.route-embed .footer,
.route-embed .bg-flow,
.route-embed .bg-noise{
  display:none !important;
}

.route-embed .container{
  max-width:none;
  padding:10px 12px 12px;
}

.route-embed .page-content{
  min-height:auto;
  gap:12px;
}

.topbar{
  min-height:72px;
  padding:calc(14px + var(--safe-top)) 40px 14px;
  background:var(--ui-surface);
  border-bottom:1px solid var(--ui-line);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.brand{
  gap:14px;
}

.logo{
  width:40px;
  height:40px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.logo-img{
  width:29px;
  height:29px;
}

.brand-name{
  color:var(--ui-text);
  font-size:22px;
  line-height:24px;
  font-weight:700;
}

.brand-sub{
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:14px;
}

.top-actions,
.nav,
.nav-desktop{
  gap:8px;
}

.nav-link,
.nav-segment > summary.nav-link,
.nav-logout,
.theme-toggle,
.perf-toggle{
  min-height:36px;
  border:1px solid transparent;
  border-radius:var(--ui-radius);
  color:var(--ui-text);
  background:transparent;
  box-shadow:none;
  font-size:12px;
  line-height:18px;
  font-weight:500;
}

.theme-toggle{
  width:36px;
  min-width:36px;
  padding:0;
}

.theme-toggle-text{
  display:none;
}

.nav-link:hover,
.nav-segment > summary.nav-link:hover,
.nav-segment[open] > summary.nav-link,
.nav-link.active,
.nav-segment > summary.nav-link.active,
.perf-toggle:hover,
.theme-toggle:hover{
  color:var(--ui-brand);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line);
  box-shadow:none;
}

.terminal-ribbon{
  position:relative;
  z-index:10;
  width:min(var(--container-max), calc(100vw - 64px));
  min-height:58px;
  margin:22px auto 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:0 20px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:none;
}

.terminal-command,
.terminal-status{
  min-width:0;
  display:flex;
  align-items:center;
  gap:14px;
}

.terminal-command{
  flex:1 1 auto;
}

.terminal-prompt{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  color:var(--ui-text);
  font-size:18px;
  line-height:22px;
  font-weight:600;
}

.terminal-command-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ui-text);
  font-size:13px;
  line-height:18px;
}

.terminal-status{
  flex:0 0 auto;
  color:var(--ui-text);
  font-size:12px;
  line-height:16px;
  text-transform:uppercase;
  white-space:nowrap;
}

.terminal-status > span,
.terminal-status > time{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.terminal-status > span + span,
.terminal-status > time{
  padding-left:16px;
  border-left:1px solid var(--ui-line);
}

.terminal-dot{
  width:8px;
  height:8px;
  border-radius:var(--r-pill);
  background:var(--ui-success);
}

.terminal-refresh{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid transparent;
  border-radius:var(--ui-radius);
  background:transparent;
  color:var(--ui-text);
  cursor:pointer;
}

.terminal-refresh:hover,
.terminal-refresh:focus-visible{
  color:var(--ui-brand);
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
  outline:0;
}

.page-remote-control .terminal-ribbon{
  display:none;
}

.container{
  width:100%;
  max-width:min(var(--container-max), calc(100vw - 64px));
  padding:22px 0 calc(28px + var(--safe-bottom));
}

.footer{
  max-width:min(var(--container-max), calc(100vw - 64px));
  padding:0 0 calc(20px + var(--safe-bottom));
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:16px;
}

.footer span{
  display:flex;
  align-items:center;
  min-height:40px;
  padding:0 16px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
}

.page-content{
  gap:16px;
  min-height:calc(100vh - 210px);
}

.page-head,
.dash-page-head{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.page-head .h1,
.h1,
.dash-page-title h1{
  color:var(--ui-text);
  font-family:var(--ff-sans);
  font-size:24px;
  line-height:32px;
  font-weight:700;
}

.page-head .h2,
.h2,
.card-title,
.wm-card-title,
.section-title,
.settings-hero-title,
.tg-health-title,
.panel-title{
  color:var(--ui-text);
  font-family:var(--ff-sans);
  font-size:14px;
  line-height:20px;
  font-weight:700;
}

.dash-page-title p,
.page-title > p,
.page-head .meta,
.card-sub,
.wm-card-sub,
.section-sub,
.settings-hero-sub,
.panel-sub,
.help,
.muted,
.muted.sm{
  color:var(--ui-text-muted);
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-hero,
.settings-card,
.settings-side,
.um-hero,
.um-table-card,
.wm-card,
.wm-fav-card,
.rs-list-card,
.tg-board-shell,
.tg-rule-shell,
.log-console-hero,
.log-stream-card,
.log-detail-card,
.netmon-toolbar,
.netmon-empty,
.netmon-chart-card,
.site-card,
.site-tile,
.node-lite,
.node-sidebar,
.node-item-row,
.rule-card,
.wm-site-row,
.wm-fav-item,
.wm-node-row,
.rs-item,
.tg-group-card,
.tg-rule-item,
.tg-member-card,
.tg-rule-kpi-card,
.dcv2-card,
.dcv2-overview-card,
.dcv2-ob-card,
.dcv2-rule-row,
.dcv2-log-stream-card,
.dcv2-log-detail-card,
.log-row{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
}

.card:hover,
.site-card:hover,
.site-tile:hover,
.wm-site-row:hover,
.wm-fav-item:hover,
.wm-node-row:hover,
.rs-item:hover,
.tg-group-card:hover,
.tg-rule-item:hover,
.tg-member-card:hover,
.dcv2-ob-card:hover,
.dcv2-rule-row:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:none;
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar,
.dcv2-rule-toolbar,
.dcv2-log-toolbar,
.remote-upload-panel{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
}

.settings-action-inner{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
}

.btn,
.chip,
.log-toggle,
.tab,
.site-nav a,
.site-tabs a,
.settings-nav-chip,
.segmented button,
.menu-item{
  border-radius:var(--ui-radius);
  font-family:var(--ff-sans);
  font-weight:500;
}

.btn{
  min-height:36px;
  padding:0 14px;
  border:1px solid var(--ui-line);
  color:var(--ui-text);
  background:var(--ui-surface);
  box-shadow:none;
}

.btn.primary{
  color:var(--c-brand-on);
  background:var(--ui-brand);
  border-color:var(--ui-brand);
}

.btn.toolbar-main-cta,
.btn.toolbar-main-cta:hover,
.btn.primary.toolbar-main-cta,
.btn.primary.toolbar-main-cta:hover{
  box-shadow:none;
  filter:none;
  transform:none;
}

.btn.ghost,
.btn.secondary,
.btn.icon.ghost{
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.btn:hover,
.btn.ghost:hover,
.btn.secondary:hover,
.btn.icon.ghost:hover{
  color:var(--ui-brand);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line-strong);
  filter:none;
}

.btn.primary:hover{
  color:var(--c-brand-on);
  background:color-mix(in srgb, var(--ui-brand) 92%, #000);
  border-color:color-mix(in srgb, var(--ui-brand) 92%, #000);
}

.btn:disabled,
.btn.disabled,
.btn[aria-disabled="true"],
button:disabled,
button[aria-disabled="true"],
select:disabled,
select[aria-disabled="true"],
input:disabled,
input[aria-disabled="true"],
textarea:disabled,
textarea[aria-disabled="true"],
.chip[aria-disabled="true"],
.menu-item[aria-disabled="true"],
.settings-nav-chip[aria-disabled="true"],
.tab[aria-disabled="true"]{
  opacity:.52;
  cursor:not-allowed;
  filter:none;
}

a.btn.disabled,
a.btn[aria-disabled="true"],
.menu-item[aria-disabled="true"],
.chip[aria-disabled="true"]{
  pointer-events:none;
}

.btn[aria-busy="true"],
.btn.is-loading,
button[aria-busy="true"],
button.is-loading{
  cursor:progress;
  border-style:dashed;
  color:var(--ui-text-muted);
  background:var(--ui-surface-muted);
}

.btn[aria-busy="true"],
.btn.is-loading{
  pointer-events:none;
}

.chip,
.log-toggle,
.settings-nav-chip,
.segmented button,
.tab{
  min-height:32px;
  padding:0 12px;
  border:1px solid transparent;
  color:var(--ui-text-muted);
  background:transparent;
}

.chip:hover,
.log-toggle:hover,
.settings-nav-chip:hover,
.segmented button:hover,
.tab:hover{
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.chip.active,
.chip[aria-selected="true"],
.log-toggle.active,
.settings-nav-chip.active,
.segmented button.active,
.tab.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb, var(--ui-brand) 32%, var(--ui-line));
}

.pill,
.status-pill,
.tg-chip,
.node-state{
  border-radius:var(--ui-radius);
  font-family:var(--ff-sans);
  font-size:11px;
  font-weight:500;
}

.input,
.select,
textarea,
.textarea,
input[type="text"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="email"],
select{
  min-height:38px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  color:var(--ui-text);
  font-family:var(--ff-sans);
  box-shadow:none;
}

.input:focus,
.select:focus,
textarea:focus,
.textarea:focus,
select:focus,
.btn:focus-visible,
.chip:focus-visible,
.log-toggle:focus-visible,
.settings-nav-chip:focus-visible,
.segmented button:focus-visible,
.menu-item:focus-visible,
.site-nav a:focus-visible,
.site-tabs a:focus-visible,
.tab:focus-visible{
  outline:2px solid var(--ui-brand);
  outline-offset:2px;
  border-color:var(--ui-brand);
  box-shadow:none;
}

.label,
.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th,
.tg-rule-member-table thead th,
.dash-status-cell dt,
.log-kpi-label,
.page-kpi-k,
.settings-hero-stat .k,
.rs-meta-k,
.kvline .k,
.site-kpi .k,
.stat-label{
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:14px;
  font-weight:600;
  text-transform:uppercase;
}

.table-wrap,
.table-shell,
.um-table-wrap,
.fm-table-wrap,
.netmon-ab-tablewrap,
.tg-rule-member-table-wrap,
.trace-route-table-wrap{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.table th,
.table td,
.um-table th,
.um-table td,
.dcv2-table th,
.dcv2-table td,
.netmon-ab-table th,
.netmon-ab-table td,
.tg-rule-member-table th,
.tg-rule-member-table td{
  border-bottom:1px solid var(--ui-line);
  color:var(--ui-text);
  font-size:12px;
}

.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th,
.tg-rule-member-table thead th{
  border-radius:0;
  background:var(--ui-surface-muted);
}

.table tbody tr:hover td,
.um-table tbody tr:hover td,
.dcv2-table tbody tr:hover td,
.netmon-ab-table tbody tr:hover td,
.tg-rule-member-table tbody tr:hover td{
  background:var(--ui-surface-muted);
}

.um-table tbody tr{
  border-radius:var(--ui-radius-lg);
  box-shadow:none;
}

.menu-pop,
.menu-portal .menu-pop{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
}

.menu-item:hover,
.menu-item.active{
  color:var(--ui-brand);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line);
}

.modal{
  background:rgba(17,24,39,.18);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

:root[data-theme="dark"] .modal{
  background:rgba(0,0,0,.58);
}

.modal-inner,
.modal-inner.modal-pro,
.um-form-modal,
.rs-form-modal-inner,
.dcv2-modal-inner,
.fm-upload-modal,
.fm-share-modal,
.wm-create-inner,
.wm-favorite-modal-inner,
.trace-route-modal-inner{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
}

.modal-head,
.wm-create-head,
.modal-pro .modal-head,
.modal-inner > .row:first-child{
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.modal .card,
.modal .panel,
.modal .um-section,
.modal .advanced-details,
.modal .dcv2-conflict-diff,
.modal .trace-route-chart-card{
  background:var(--ui-surface-muted);
}

.modal .row-end,
.modal .row-end-sm,
.modal .row-end-12,
.modal .dcv2-modal-actions,
.modal .rs-form-modal-foot,
.modal .wm-create-actions{
  border-top:1px solid var(--ui-line);
  background:var(--ui-surface);
}

.toast{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:var(--ui-shadow-pop);
}

.settings-hero-stat,
.page-kpi,
.log-kpi,
.rs-meta-row,
.dcv2-situation-item,
.dcv2-health-item,
.dcv2-health-metric,
.tg-rule-kpi-card,
.tg-focus-item,
.kvline,
.site-kpi,
.stat-card{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.kv-lines,
.kvline{
  min-width:0;
  max-width:100%;
}

.kvline .k{
  flex:0 1 auto;
  min-width:0;
}

.kvline .v{
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  text-align:right;
}

.dash-page-head{
  min-height:0;
  padding:0;
}

.dash-status-strip{
  gap:12px;
}

.dash-status-cell{
  position:relative;
  min-height:112px;
  padding:22px;
  overflow:hidden;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.dash-status-cell::after{
  content:"";
  position:absolute;
  right:18px;
  bottom:18px;
  width:112px;
  height:30px;
  opacity:.72;
  background:
    linear-gradient(115deg, transparent 0 22%, color-mix(in srgb, var(--ui-brand) 48%, transparent) 22% 24%, transparent 24% 38%, color-mix(in srgb, var(--ui-brand) 68%, transparent) 38% 40%, transparent 40%),
    repeating-linear-gradient(90deg, transparent 0 8px, color-mix(in srgb, var(--ui-brand) 52%, transparent) 8px 10px, transparent 10px 14px);
  mask-image:linear-gradient(to top, #000 0 78%, transparent 78% 100%);
  pointer-events:none;
}

.dash-status-cell.is-danger::after{
  background:
    linear-gradient(115deg, transparent 0 22%, color-mix(in srgb, var(--ui-danger) 48%, transparent) 22% 24%, transparent 24% 38%, color-mix(in srgb, var(--ui-danger) 68%, transparent) 38% 40%, transparent 40%),
    repeating-linear-gradient(90deg, transparent 0 8px, color-mix(in srgb, var(--ui-danger) 52%, transparent) 8px 10px, transparent 10px 14px);
}

.dash-status-cell dt,
.dash-status-cell dd,
.dash-status-cell p{
  position:relative;
  z-index:1;
}

.dash-status-cell dd{
  margin-top:20px;
  color:var(--ui-text);
  font-size:28px;
  line-height:38px;
  font-weight:700;
  overflow:visible;
}

.dash-status-cell p{
  color:var(--ui-text-muted);
  font-size:12px;
}

.dash-sync-state{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  color:var(--ui-text);
}

.dashboard-toolbar,
.toolbar-panel.dashboard-toolbar{
  top:calc(72px + var(--safe-top));
  grid-template-columns:minmax(0,auto) minmax(280px,1fr) auto;
  padding:12px;
  background:var(--ui-surface);
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  box-shadow:none;
  backdrop-filter:none;
}

.dash-filters,
.log-toggle-group,
.segmented{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface-muted);
}

.dashboard-toolbar .dash-search,
.dash-search,
.site-search{
  min-height:38px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
}

.node-tile{
  min-height:132px;
  padding:16px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.node-tile:hover,
.node-tile:focus-visible{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:none;
}

.node-name{
  color:var(--ui-text);
  font-size:14px;
  line-height:20px;
  font-weight:700;
}

.node-host,
.node-meta,
.node-meta-item.mono,
.node-meta-item .mono,
.mbar .head,
.mbar .head .mono{
  color:var(--ui-text-muted);
}

.node-state{
  min-height:24px;
  border:1px solid var(--ui-line);
  background:var(--ui-surface);
  color:var(--ui-text-muted);
}

.node-state.online{
  color:var(--ui-success);
  background:transparent;
  border-color:color-mix(in srgb, var(--ui-success) 34%, var(--ui-line));
}

.mini-progress{
  height:4px;
  background:var(--ui-surface-muted);
}

.mini-fill{
  background:var(--ui-brand);
}

.au-progress,
.progress,
.tg-rule-kpi-track,
.tg-util-track,
.tg-rule-top3-util-track{
  height:6px;
  overflow:hidden;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.au-progress-fill,
.progress-fill,
.tg-rule-kpi-track > i,
.tg-util-track > span,
.tg-rule-top3-util-track > span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--ui-brand);
  box-shadow:none;
}

.panel-update-log-pretty,
.panel-update-log,
.backup-full-events,
.backup-full-steps,
.restore-full-summary,
.tg-rule-snapshot,
.code-block,
.log-detail-text,
.log-detail-context{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  color:var(--ui-text);
  box-shadow:none;
}

.settings-check,
.form-section,
.wm-create-section,
.advanced-details,
.diag-feed-item,
.log-stream-wrap,
.log-detail-item,
.log-source-meta,
.node-group-head,
.node-item,
.auto-restart-card,
.hist-head,
.hist-chart,
.hist-canvas,
.empty-state,
.empty-state.compact,
.tg-board-empty,
.tg-rule-empty,
.wm-fav-empty,
.btn.sm,
summary.btn.sm,
.btn.icon.xs,
a.btn.icon.xs.secondary,
.input.sm{
  border-radius:var(--ui-radius-lg);
}

.dashboard-live-dot,
.dot,
.node-sidebar .dot,
.node-sidebar .dot.online,
.node-sidebar .dot.offline,
.hist-leg .dot,
.auto-restart-card,
.hist-head,
.hist-chart,
.hist-canvas{
  box-shadow:none;
  filter:none;
}

.node-tools details.menu > summary.btn.sm.ghost,
.hist-panel > summary.hist-head,
.hist-panel[open] > summary.hist-head{
  border-radius:var(--ui-radius-lg);
  box-shadow:none;
}

.subnav-bar{
  max-width:100%;
  min-width:0;
}

.subnav{
  width:100%;
  max-width:100%;
  min-width:0;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.subnav a,
.subnav a.active,
.subnav a:hover{
  border-radius:var(--ui-radius);
  box-shadow:none;
}

.subnav a{
  color:var(--ui-text-muted);
}

.subnav a.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb, var(--ui-brand) 32%, var(--ui-line));
}

.form-section,
.wm-create-section,
.advanced-details,
.diag-feed-item{
  background:var(--ui-surface);
  border-color:var(--ui-line);
  box-shadow:none;
  backdrop-filter:none;
}

.advanced-details[open] > summary{
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface-muted);
}

body.netmon-wall .container{
  max-width:none;
  overflow-x:hidden;
  padding:12px;
}

.netmon-wallbar{
  width:100%;
  max-width:100%;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.netmon-wall-clock{
  line-height:34px;
  overflow:visible;
}

body.netmon-ro,
body.netmon-wall{
  overflow-x:hidden;
}

body.netmon-ro .page-content,
body.netmon-ro .netmon-charts,
body.netmon-ro .netmon-toolbar{
  max-width:100%;
  min-width:0;
  overflow-x:hidden;
}

body:not(.netmon-wall) .netmon-charts{
  display:grid;
  grid-template-columns:minmax(0,1fr);
}

body.netmon-wall .netmon-charts{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(420px,1fr));
}

.log-row{
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  box-shadow:none;
  filter:none;
  transform:none;
}

.log-row.active,
.log-row:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-muted);
  box-shadow:none;
  filter:none;
  transform:none;
}

.log-row-level{
  text-transform:uppercase;
}

.page-remote-control{
  --ui-bg:#05070a;
  --ui-surface:#0b1015;
  --ui-surface-raised:#111820;
  --ui-surface-muted:#101720;
  --ui-line:rgba(148,163,184,.20);
  --ui-line-strong:rgba(148,163,184,.34);
  --ui-text:#e6edf3;
  --ui-text-muted:#98a6b3;
  --ui-text-soft:#697784;
  --ui-brand:#58a6ff;
  --ui-brand-bg:rgba(88,166,255,.14);
  --ui-focus:rgba(88,166,255,.22);
}

.remote-workspace,
.remote-topbar,
.remote-shortcuts,
.remote-mobile-controls,
.remote-upload-panel{
  font-family:var(--ff-sans);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.remote-stage{
  background:#030507;
}

@media (max-width:1100px){
  .terminal-ribbon{
    width:calc(100vw - 32px);
  }

  .container,
  .footer{
    max-width:calc(100vw - 32px);
  }
}

@media (max-width:720px){
  .topbar{
    min-height:60px;
    padding:calc(10px + var(--safe-top)) 14px 10px;
  }

  .brand-name{
    font-size:18px;
    line-height:22px;
  }

  .terminal-ribbon{
    width:calc(100vw - 24px);
    min-height:0;
    margin-top:12px;
    align-items:stretch;
    flex-direction:column;
    padding:12px;
  }

  .terminal-status{
    width:100%;
    overflow:auto;
    padding-top:10px;
    border-top:1px solid var(--ui-line);
  }

  .terminal-status > span + span,
  .terminal-status > time{
    padding-left:12px;
  }

  .container,
  .footer{
    max-width:calc(100vw - 24px);
  }

  .container{
    padding-top:14px;
  }

  .page-head .h1,
  .h1,
  .dash-page-title h1{
    font-size:20px;
    line-height:28px;
  }

  .dash-status-cell{
    min-height:92px;
    padding:16px;
  }

  .dash-status-cell::after{
    display:none;
  }

  .dashboard-toolbar,
  .toolbar-panel.dashboard-toolbar{
    top:calc(60px + var(--safe-top));
    grid-template-columns:minmax(0,1fr);
  }

  .kvline{
    align-items:flex-start;
  }

  .kvline .v{
    white-space:normal;
    overflow-wrap:anywhere;
  }
}

/* Minimal data terminal layer. Mirrors the white, line-based reference UI. */
:root{
  --ui-bg:#f1f3f4;
  --ui-surface:#ffffff;
  --ui-surface-raised:#f8f9f8;
  --ui-surface-muted:#e8edf1;
  --ui-line:rgba(31,41,55,.14);
  --ui-line-strong:rgba(31,41,55,.24);
  --ui-text:#151a20;
  --ui-text-muted:#626c78;
  --ui-text-soft:#929ba6;
  --ui-brand:#435a6e;
  --ui-brand-bg:rgba(67,90,110,.12);
  --ui-focus:rgba(67,90,110,.22);
  --ui-success:#2d7d54;
  --ui-warning:#956b24;
  --ui-danger:#b64b55;
  --ui-success-bg:rgba(45,125,84,.09);
  --ui-warning-bg:rgba(149,107,36,.10);
  --ui-danger-bg:rgba(182,75,85,.08);
  --ui-radius:6px;
  --ui-radius-lg:8px;
  --ui-shadow:none;
  --ui-shadow-pop:0 14px 34px rgba(17,23,32,.08);
  --bg:var(--ui-bg);
  --bg2:var(--ui-bg);
  --surface:var(--ui-surface);
  --surface-elevated:var(--ui-surface);
  --surface-strong:var(--ui-surface);
  --surface-2:var(--ui-surface-muted);
  --glass-bg:var(--ui-surface);
  --glass-bg-hover:var(--ui-surface-raised);
  --glass-border:var(--ui-line);
  --glass-border-highlight:var(--ui-line-strong);
  --text:var(--ui-text);
  --text-strong:var(--ui-text);
  --text-muted:var(--ui-text-muted);
  --text-soft:var(--ui-text-soft);
  --line:var(--ui-line);
  --line-strong:var(--ui-line-strong);
  --border-subtle:var(--ui-line);
  --border-strong:var(--ui-line-strong);
  --accent:var(--ui-brand);
  --accent2:var(--ui-brand);
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
  --radius:var(--ui-radius-lg);
  --radius-xs:var(--ui-radius);
  --radius-sm:var(--ui-radius);
  --radius-md:var(--ui-radius-lg);
  --radius-lg:var(--ui-radius-lg);
  --shadow-sm:none;
  --shadow-md:none;
  --shadow:none;
  --glow:none;
  --hover-lift:0px;
  --press-lift:0px;
}

:root[data-theme="dark"]{
  --ui-bg:#090b0e;
  --ui-surface:#10151a;
  --ui-surface-raised:#131a20;
  --ui-surface-muted:#151b21;
  --ui-line:#2a333c;
  --ui-line-strong:#3b4752;
  --ui-text:#edf2f6;
  --ui-text-muted:#8f9aa5;
  --ui-text-soft:#68727c;
  --ui-brand:#58a6ff;
  --ui-brand-bg:rgba(88,166,255,.12);
  --ui-focus:rgba(88,166,255,.22);
  --ui-success:#43d18d;
  --ui-warning:#d19a38;
  --ui-danger:#ff6570;
  --ui-success-bg:rgba(67,209,141,.12);
  --ui-warning-bg:rgba(209,154,56,.12);
  --ui-danger-bg:rgba(255,101,112,.12);
  --ui-shadow-pop:0 18px 42px rgba(0,0,0,.42);
}

html{
  background:var(--ui-bg);
}

body{
  color:var(--ui-text);
  background:var(--ui-bg);
  font-family:var(--ff-sans);
  font-size:13px;
  line-height:20px;
  font-variant-numeric:tabular-nums;
}

body .bg-flow,
body .bg-noise{
  display:none !important;
}

.route-embed .topbar,
.route-embed .terminal-ribbon,
.route-embed .footer,
.route-embed .bg-flow,
.route-embed .bg-noise{
  display:none !important;
}

.topbar{
  min-height:72px;
  padding:calc(14px + var(--safe-top)) 42px 14px;
  background:var(--ui-surface);
  border-bottom:1px solid var(--ui-line);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.brand{
  gap:14px;
}

.logo{
  position:relative;
  width:40px;
  height:40px;
  border:1px solid var(--ui-line-strong);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.logo-img{
  display:none;
}

.logo::before{
  content:"N_";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:var(--ui-text);
  font-family:var(--ff-mono);
  font-size:18px;
  line-height:1;
  font-weight:700;
}

.brand-name{
  color:var(--ui-text);
  font-size:22px;
  line-height:24px;
  font-weight:700;
}

.brand-sub{
  max-width:240px;
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:14px;
}

.nav-link,
.nav-segment > summary.nav-link,
.nav-logout,
.theme-toggle,
.perf-toggle{
  min-height:36px;
  border:1px solid transparent;
  border-radius:var(--ui-radius);
  color:var(--ui-text);
  background:transparent;
  box-shadow:none;
  font-size:12px;
  line-height:18px;
  font-weight:500;
}

.theme-toggle,
.perf-toggle{
  width:36px;
  min-width:36px;
  padding:0;
}

.theme-toggle-text{
  display:none;
}

.nav-link:hover,
.nav-segment > summary.nav-link:hover,
.nav-segment[open] > summary.nav-link,
.nav-link.active,
.nav-segment > summary.nav-link.active,
.perf-toggle:hover,
.theme-toggle:hover{
  color:var(--ui-brand);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line);
  box-shadow:none;
}

.terminal-ribbon{
  position:relative;
  z-index:10;
  width:min(var(--container-max), calc(100vw - 84px));
  min-height:58px;
  margin:22px auto 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:0 18px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:none;
}

.terminal-command,
.terminal-status{
  min-width:0;
  display:flex;
  align-items:center;
  gap:14px;
}

.terminal-command{
  flex:1 1 auto;
}

.terminal-prompt{
  min-width:20px;
  color:var(--ui-text);
  font-size:19px;
  line-height:22px;
  font-weight:500;
}

.terminal-command-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ui-text);
  font-size:13px;
  line-height:18px;
}

.terminal-status{
  flex:0 0 auto;
  color:var(--ui-text);
  font-size:12px;
  line-height:16px;
  text-transform:uppercase;
  white-space:nowrap;
}

.terminal-status > span,
.terminal-status > time{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.terminal-status > span + span,
.terminal-status > time{
  padding-left:18px;
  border-left:1px solid var(--ui-line);
}

.terminal-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--ui-success);
}

.terminal-refresh{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid transparent;
  border-radius:var(--ui-radius);
  background:transparent;
  color:var(--ui-text);
  cursor:pointer;
}

.terminal-refresh:hover,
.terminal-refresh:focus-visible{
  color:var(--ui-brand);
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
  outline:0;
}

.page-remote-control .terminal-ribbon{
  display:none;
}

.container{
  width:100%;
  max-width:min(var(--container-max), calc(100vw - 84px));
  padding:22px 0 calc(28px + var(--safe-bottom));
}

.footer{
  max-width:min(var(--container-max), calc(100vw - 84px));
  padding:0 0 calc(20px + var(--safe-bottom));
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:16px;
}

.footer span{
  display:flex;
  align-items:center;
  min-height:40px;
  padding:0 16px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
}

.page-content{
  gap:16px;
  min-height:calc(100vh - 210px);
}

.page-head,
.dash-page-head{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.h1,
.page-head .h1,
.dash-page-title h1{
  color:var(--ui-text);
  font-size:24px;
  line-height:32px;
  font-weight:700;
}

.h2,
.card-title,
.wm-card-title,
.section-title,
.settings-hero-title,
.tg-health-title,
.panel-title{
  color:var(--ui-text);
  font-size:14px;
  line-height:20px;
  font-weight:700;
}

.muted,
.muted.sm,
.meta-item,
.card-sub,
.wm-card-sub,
.section-sub,
.settings-hero-sub,
.panel-sub,
.help,
.page-head .meta,
.dash-page-title p{
  color:var(--ui-text-muted);
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-hero,
.settings-card,
.settings-side,
.um-hero,
.um-table-card,
.wm-card,
.wm-fav-card,
.rs-list-card,
.tg-board-shell,
.tg-rule-shell,
.log-console-hero,
.log-stream-card,
.log-detail-card,
.netmon-toolbar,
.netmon-empty,
.netmon-chart-card,
.site-card,
.site-tile,
.node-lite,
.node-sidebar,
.node-item-row,
.rule-card,
.wm-site-row,
.wm-fav-item,
.wm-node-row,
.rs-item,
.tg-group-card,
.tg-rule-item,
.tg-member-card,
.tg-rule-kpi-card,
.dcv2-card,
.dcv2-overview-card,
.dcv2-ob-card,
.dcv2-rule-row,
.dcv2-log-stream-card,
.dcv2-log-detail-card,
.log-row{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.card:hover,
.site-card:hover,
.site-tile:hover,
.wm-site-row:hover,
.wm-fav-item:hover,
.wm-node-row:hover,
.rs-item:hover,
.tg-group-card:hover,
.tg-rule-item:hover,
.tg-member-card:hover,
.dcv2-ob-card:hover,
.dcv2-rule-row:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:none;
  transform:none;
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar,
.dcv2-rule-toolbar,
.dcv2-log-toolbar,
.remote-upload-panel,
.settings-action-inner{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.btn,
.chip,
.log-toggle,
.tab,
.site-nav a,
.site-tabs a,
.settings-nav-chip,
.segmented button,
.menu-item{
  border-radius:var(--ui-radius);
  font-family:var(--ff-sans);
  font-weight:500;
  box-shadow:none;
  transform:none;
}

.btn{
  min-height:36px;
  padding:0 14px;
  border:1px solid var(--ui-line);
  color:var(--ui-text);
  background:var(--ui-surface);
}

.btn.primary{
  color:var(--c-brand-on);
  background:var(--ui-brand);
  border-color:var(--ui-brand);
}

.btn.toolbar-main-cta,
.btn.toolbar-main-cta:hover,
.btn.primary.toolbar-main-cta,
.btn.primary.toolbar-main-cta:hover{
  box-shadow:none;
  filter:none;
  transform:none;
}

.btn.ghost,
.btn.secondary,
.btn.icon.ghost{
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.btn:hover,
.btn.ghost:hover,
.btn.secondary:hover,
.btn.icon.ghost:hover{
  color:var(--ui-brand);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line-strong);
  filter:none;
}

.btn.primary:hover{
  color:var(--c-brand-on);
  background:color-mix(in srgb, var(--ui-brand) 92%, #000);
  border-color:color-mix(in srgb, var(--ui-brand) 92%, #000);
}

.btn:disabled,
.btn.disabled,
.btn[aria-disabled="true"],
button:disabled,
button[aria-disabled="true"],
select:disabled,
select[aria-disabled="true"],
input:disabled,
input[aria-disabled="true"],
textarea:disabled,
textarea[aria-disabled="true"],
.chip[aria-disabled="true"],
.menu-item[aria-disabled="true"],
.settings-nav-chip[aria-disabled="true"],
.tab[aria-disabled="true"]{
  opacity:.52;
  cursor:not-allowed;
  filter:none;
}

a.btn.disabled,
a.btn[aria-disabled="true"],
.menu-item[aria-disabled="true"],
.chip[aria-disabled="true"]{
  pointer-events:none;
}

.btn[aria-busy="true"],
.btn.is-loading,
button[aria-busy="true"],
button.is-loading{
  cursor:progress;
  pointer-events:none;
  border-style:dashed;
  color:var(--ui-text-muted);
  background:var(--ui-surface-muted);
}

.chip,
.log-toggle,
.settings-nav-chip,
.segmented button,
.tab{
  min-height:32px;
  padding:0 12px;
  border:1px solid transparent;
  color:var(--ui-text-muted);
  background:transparent;
}

.chip:hover,
.log-toggle:hover,
.settings-nav-chip:hover,
.segmented button:hover,
.tab:hover{
  color:var(--ui-text);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.chip.active,
.chip[aria-selected="true"],
.log-toggle.active,
.settings-nav-chip.active,
.segmented button.active,
.tab.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb, var(--ui-brand) 32%, var(--ui-line));
}

.pill,
.status-pill,
.tg-chip,
.node-state{
  border-radius:var(--ui-radius);
  font-family:var(--ff-sans);
  font-size:11px;
  font-weight:500;
}

.input,
.select,
textarea,
.textarea,
input[type="text"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="email"],
select{
  min-height:38px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  color:var(--ui-text);
  font-family:var(--ff-sans);
  box-shadow:none;
}

.input:focus,
.select:focus,
textarea:focus,
.textarea:focus,
select:focus,
.btn:focus-visible,
.chip:focus-visible,
.log-toggle:focus-visible,
.settings-nav-chip:focus-visible,
.segmented button:focus-visible,
.menu-item:focus-visible,
.site-nav a:focus-visible,
.site-tabs a:focus-visible,
.tab:focus-visible{
  outline:2px solid var(--ui-brand);
  outline-offset:2px;
  border-color:var(--ui-brand);
  box-shadow:none;
}

.label,
.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th,
.tg-rule-member-table thead th,
.dash-status-cell dt,
.log-kpi-label,
.page-kpi-k,
.settings-hero-stat .k,
.rs-meta-k,
.kvline .k,
.site-kpi .k,
.stat-label{
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:14px;
  font-weight:600;
  text-transform:uppercase;
}

.table-wrap,
.table-shell,
.um-table-wrap,
.fm-table-wrap,
.netmon-ab-tablewrap,
.tg-rule-member-table-wrap,
.trace-route-table-wrap{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.table th,
.table td,
.um-table th,
.um-table td,
.dcv2-table th,
.dcv2-table td,
.netmon-ab-table th,
.netmon-ab-table td,
.tg-rule-member-table th,
.tg-rule-member-table td{
  border-bottom:1px solid var(--ui-line);
  color:var(--ui-text);
  font-size:12px;
}

.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th,
.tg-rule-member-table thead th{
  border-radius:0;
  background:var(--ui-surface-muted);
}

.table tbody tr:hover td,
.um-table tbody tr:hover td,
.dcv2-table tbody tr:hover td,
.netmon-ab-table tbody tr:hover td,
.tg-rule-member-table tbody tr:hover td{
  background:var(--ui-surface-muted);
}

.um-table tbody tr{
  border-radius:var(--ui-radius-lg);
  box-shadow:none;
}

.menu-pop,
.menu-portal .menu-pop{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
}

.menu-item:hover,
.menu-item.active{
  color:var(--ui-brand);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line);
}

.modal{
  background:rgba(17,24,39,.18);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

:root[data-theme="dark"] .modal{
  background:rgba(0,0,0,.58);
}

.modal-inner,
.modal-inner.modal-pro,
.um-form-modal,
.rs-form-modal-inner,
.dcv2-modal-inner,
.fm-upload-modal,
.fm-share-modal,
.wm-create-inner,
.wm-favorite-modal-inner,
.trace-route-modal-inner{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow-pop);
}

.modal-head,
.wm-create-head,
.modal-pro .modal-head,
.modal-inner > .row:first-child{
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.modal .card,
.modal .panel,
.modal .um-section,
.modal .advanced-details,
.modal .dcv2-conflict-diff,
.modal .trace-route-chart-card{
  background:var(--ui-surface-muted);
}

.modal .row-end,
.modal .row-end-sm,
.modal .row-end-12,
.modal .dcv2-modal-actions,
.modal .rs-form-modal-foot,
.modal .wm-create-actions{
  border-top:1px solid var(--ui-line);
  background:var(--ui-surface);
}

.toast{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:var(--ui-shadow-pop);
}

.settings-hero-stat,
.page-kpi,
.log-kpi,
.rs-meta-row,
.dcv2-situation-item,
.dcv2-health-item,
.dcv2-health-metric,
.tg-rule-kpi-card,
.tg-focus-item,
.kvline,
.site-kpi,
.stat-card{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.kv-lines,
.kvline{
  min-width:0;
  max-width:100%;
}

.kvline .v{
  min-width:0;
  max-width:100%;
  text-align:right;
}

.dash-filters,
.log-toggle-group,
.segmented{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface-muted);
}

.dashboard-toolbar .dash-search,
.dash-search,
.site-search{
  min-height:38px;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  box-shadow:none;
}

.node-tile{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
}

.node-tile:hover,
.node-tile:focus-visible{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:none;
}

.node-name{
  color:var(--ui-text);
  font-size:14px;
  line-height:20px;
  font-weight:700;
}

.node-host,
.node-meta,
.node-meta-item.mono,
.node-meta-item .mono,
.mbar .head,
.mbar .head .mono{
  color:var(--ui-text-muted);
}

.mini-progress{
  background:var(--ui-surface-muted);
}

.mini-fill{
  background:var(--ui-brand);
}

.au-progress,
.progress,
.tg-rule-kpi-track,
.tg-util-track,
.tg-rule-top3-util-track{
  height:6px;
  overflow:hidden;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  box-shadow:none;
}

.au-progress-fill,
.progress-fill,
.tg-rule-kpi-track > i,
.tg-util-track > span,
.tg-rule-top3-util-track > span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--ui-brand);
  box-shadow:none;
}

.panel-update-log-pretty,
.panel-update-log,
.backup-full-events,
.backup-full-steps,
.restore-full-summary,
.tg-rule-snapshot,
.code-block,
.log-detail-text,
.log-detail-context{
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius);
  background:var(--ui-surface-muted);
  color:var(--ui-text);
  box-shadow:none;
}

.settings-check,
.form-section,
.wm-create-section,
.advanced-details,
.diag-feed-item,
.log-stream-wrap,
.log-detail-item,
.log-source-meta,
.node-group-head,
.node-item,
.auto-restart-card,
.hist-head,
.hist-chart,
.hist-canvas,
.empty-state,
.empty-state.compact,
.tg-board-empty,
.tg-rule-empty,
.wm-fav-empty,
.btn.sm,
summary.btn.sm,
.btn.icon.xs,
a.btn.icon.xs.secondary,
.input.sm{
  border-radius:var(--ui-radius-lg);
}

.dashboard-live-dot,
.dot,
.node-sidebar .dot,
.node-sidebar .dot.online,
.node-sidebar .dot.offline,
.hist-leg .dot,
.auto-restart-card,
.hist-head,
.hist-chart,
.hist-canvas{
  box-shadow:none;
  filter:none;
}

.node-tools details.menu > summary.btn.sm.ghost,
.hist-panel > summary.hist-head,
.hist-panel[open] > summary.hist-head{
  border-radius:var(--ui-radius-lg);
  box-shadow:none;
}

.subnav{
  width:100%;
  max-width:100%;
  min-width:0;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.subnav a,
.subnav a.active,
.subnav a:hover{
  border-radius:var(--ui-radius);
  box-shadow:none;
}

.subnav a{
  color:var(--ui-text-muted);
}

.subnav a.active{
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb, var(--ui-brand) 32%, var(--ui-line));
}

.advanced-details[open] > summary{
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface-muted);
}

.netmon-wallbar{
  width:100%;
  max-width:100%;
  border:1px solid var(--ui-line);
  border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.log-row{
  border-radius:var(--ui-radius);
  background:var(--ui-surface);
  box-shadow:none;
  filter:none;
  transform:none;
}

.log-row.active,
.log-row:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-muted);
  box-shadow:none;
  filter:none;
  transform:none;
}

.log-row-level{
  text-transform:uppercase;
}

.page-remote-control{
  --ui-bg:#05070a;
  --ui-surface:#0b1015;
  --ui-surface-raised:#111820;
  --ui-surface-muted:#101720;
  --ui-line:rgba(148,163,184,.20);
  --ui-line-strong:rgba(148,163,184,.34);
  --ui-text:#e6edf3;
  --ui-text-muted:#98a6b3;
  --ui-text-soft:#697784;
  --ui-brand:#58a6ff;
  --ui-brand-bg:rgba(88,166,255,.14);
  --ui-focus:rgba(88,166,255,.22);
}

.remote-workspace,
.remote-topbar,
.remote-shortcuts,
.remote-mobile-controls,
.remote-upload-panel{
  font-family:var(--ff-sans);
  background:var(--ui-surface);
  border-color:var(--ui-line);
}

.remote-stage{
  background:#030507;
}

@media (max-width:1100px){
  .terminal-ribbon,
  .container,
  .footer{
    width:auto;
    max-width:calc(100vw - 32px);
  }
}

@media (max-width:720px){
  .topbar{
    min-height:60px;
    padding:calc(10px + var(--safe-top)) 14px 10px;
  }

  .brand-name{
    font-size:18px;
    line-height:22px;
  }

  .brand-sub{
    display:none;
  }

  .terminal-ribbon{
    max-width:calc(100vw - 24px);
    min-height:0;
    margin-top:12px;
    align-items:stretch;
    flex-direction:column;
    padding:12px;
  }

  .terminal-status{
    width:100%;
    overflow:auto;
    padding-top:10px;
    border-top:1px solid var(--ui-line);
  }

  .terminal-status > span + span,
  .terminal-status > time{
    padding-left:12px;
  }

  .container,
  .footer{
    max-width:calc(100vw - 24px);
  }

  .container{
    padding-top:14px;
  }

  .page-head .h1,
  .h1,
  .dash-page-title h1{
    font-size:20px;
    line-height:28px;
  }
}

/* Dark operations layer. Neutral control-room theme with restrained hierarchy. */
:root[data-theme="dark"]{
  --ui-bg:#111214;
  --ui-surface:#17191d;
  --ui-surface-raised:#20242a;
  --ui-surface-muted:#131519;
  --ui-surface-pop:#1f2228;
  --ui-line:rgba(230,234,240,.10);
  --ui-line-strong:rgba(230,234,240,.18);
  --ui-text:#eef0f3;
  --ui-text-muted:#939ba6;
  --ui-text-soft:#69717c;
  --ui-brand:#8997a6;
  --ui-brand-2:#9aa7b4;
  --ui-brand-bg:rgba(137,151,166,.13);
  --ui-brand-bg-strong:rgba(137,151,166,.18);
  --ui-action:#3a4652;
  --ui-action-hover:#465564;
  --ui-action-border:#5b6a78;
  --ui-action-text:#f6f8fb;
  --ui-focus:rgba(137,151,166,.30);
  --ui-success:#7fb982;
  --ui-warning:#c9a45d;
  --ui-danger:#d36f75;
  --ui-success-bg:rgba(127,185,130,.12);
  --ui-warning-bg:rgba(201,164,93,.12);
  --ui-danger-bg:rgba(211,111,117,.12);
  --ui-radius:7px;
  --ui-radius-lg:8px;
  --ui-shadow:0 1px 0 rgba(255,255,255,.025);
  --ui-shadow-pop:0 24px 60px rgba(0,0,0,.42),0 0 0 1px rgba(245,247,250,.06);
  --bg:var(--ui-bg);
  --bg2:#15171b;
  --surface:var(--ui-surface);
  --surface-elevated:var(--ui-surface-raised);
  --surface-strong:var(--ui-surface-pop);
  --surface-2:var(--ui-surface-muted);
  --glass-bg:var(--ui-surface);
  --glass-bg-hover:var(--ui-surface-raised);
  --glass-border:var(--ui-line);
  --glass-border-highlight:var(--ui-line-strong);
  --text:var(--ui-text);
  --text-strong:var(--ui-text);
  --text-muted:var(--ui-text-muted);
  --text-soft:var(--ui-text-soft);
  --line:var(--ui-line);
  --line-strong:var(--ui-line-strong);
  --border-subtle:var(--ui-line);
  --border-strong:var(--ui-line-strong);
  --accent:var(--ui-brand);
  --accent2:var(--ui-brand-2);
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
  --shadow-sm:var(--ui-shadow);
  --shadow-md:var(--ui-shadow);
  --shadow:var(--ui-shadow);
  --glow:var(--ui-shadow);
}

html[data-theme="dark"]{
  background:var(--ui-bg);
  scrollbar-color:rgba(150,160,172,.38) transparent;
}

:root[data-theme="dark"] body{
  color:var(--ui-text);
  background:var(--ui-bg);
}

:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .terminal-ribbon,
:root[data-theme="dark"] .footer span,
:root[data-theme="dark"] .page-head,
:root[data-theme="dark"] .dash-page-head,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .page-section-shell:not(.dashboard-content-shell),
:root[data-theme="dark"] .settings-hero,
:root[data-theme="dark"] .settings-card,
:root[data-theme="dark"] .settings-side,
:root[data-theme="dark"] .um-hero,
:root[data-theme="dark"] .um-table-card,
:root[data-theme="dark"] .wm-card,
:root[data-theme="dark"] .wm-fav-card,
:root[data-theme="dark"] .rs-list-card,
:root[data-theme="dark"] .tg-board-shell,
:root[data-theme="dark"] .tg-rule-shell,
:root[data-theme="dark"] .log-console-hero,
:root[data-theme="dark"] .log-stream-card,
:root[data-theme="dark"] .log-detail-card,
:root[data-theme="dark"] .netmon-toolbar,
:root[data-theme="dark"] .netmon-empty,
:root[data-theme="dark"] .netmon-chart-card,
:root[data-theme="dark"] .site-card,
:root[data-theme="dark"] .site-tile,
:root[data-theme="dark"] .node-lite,
:root[data-theme="dark"] .node-sidebar,
:root[data-theme="dark"] .node-item-row,
:root[data-theme="dark"] .rule-card,
:root[data-theme="dark"] .wm-site-row,
:root[data-theme="dark"] .wm-fav-item,
:root[data-theme="dark"] .wm-node-row,
:root[data-theme="dark"] .rs-item,
:root[data-theme="dark"] .tg-group-card,
:root[data-theme="dark"] .tg-rule-item,
:root[data-theme="dark"] .tg-member-card,
:root[data-theme="dark"] .tg-rule-kpi-card,
:root[data-theme="dark"] .dcv2-card,
:root[data-theme="dark"] .dcv2-overview-card,
:root[data-theme="dark"] .dcv2-ob-card,
:root[data-theme="dark"] .dcv2-rule-row,
:root[data-theme="dark"] .dcv2-log-stream-card,
:root[data-theme="dark"] .dcv2-log-detail-card,
:root[data-theme="dark"] .log-row,
:root[data-theme="dark"] .subnav,
:root[data-theme="dark"] .toolbar-panel,
:root[data-theme="dark"] .dashboard-toolbar,
:root[data-theme="dark"] .wm-toolbar,
:root[data-theme="dark"] .settings-toolbar,
:root[data-theme="dark"] .rs-toolbar,
:root[data-theme="dark"] .log-filter-bar,
:root[data-theme="dark"] .audit-toolbar,
:root[data-theme="dark"] .um-table-toolbar,
:root[data-theme="dark"] .sites-toolbar,
:root[data-theme="dark"] .fm-toolbar,
:root[data-theme="dark"] .dcv2-rule-toolbar,
:root[data-theme="dark"] .dcv2-log-toolbar,
:root[data-theme="dark"] .remote-upload-panel,
:root[data-theme="dark"] .settings-action-inner{
  border-color:var(--ui-line);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

:root[data-theme="dark"] .page-head,
:root[data-theme="dark"] .dash-page-head{
  padding:10px 0 16px;
  border:0;
  border-bottom:1px solid var(--ui-line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

:root[data-theme="dark"] .topbar{
  background:#15171b;
  box-shadow:0 1px 0 var(--ui-line);
}

:root[data-theme="dark"] .logo{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-muted);
}

:root[data-theme="dark"] .logo::before{
  color:var(--ui-brand);
}

:root[data-theme="dark"] .nav-link:hover,
:root[data-theme="dark"] .nav-segment > summary.nav-link:hover,
:root[data-theme="dark"] .nav-segment[open] > summary.nav-link,
:root[data-theme="dark"] .nav-link.active,
:root[data-theme="dark"] .nav-segment > summary.nav-link.active,
:root[data-theme="dark"] .perf-toggle:hover,
:root[data-theme="dark"] .theme-toggle:hover{
  color:var(--ui-text);
  background:var(--ui-surface-raised);
  border-color:var(--ui-line-strong);
}

:root[data-theme="dark"] .terminal-ribbon{
  color:var(--ui-text);
  background:var(--ui-surface);
  background-image:none;
}

:root[data-theme="dark"] .terminal-prompt,
:root[data-theme="dark"] .terminal-ok{
  color:var(--ui-success);
}

:root[data-theme="dark"] .card:hover,
:root[data-theme="dark"] .site-card:hover,
:root[data-theme="dark"] .site-tile:hover,
:root[data-theme="dark"] .wm-site-row:hover,
:root[data-theme="dark"] .wm-fav-item:hover,
:root[data-theme="dark"] .wm-node-row:hover,
:root[data-theme="dark"] .rs-item:hover,
:root[data-theme="dark"] .tg-group-card:hover,
:root[data-theme="dark"] .tg-rule-item:hover,
:root[data-theme="dark"] .tg-member-card:hover,
:root[data-theme="dark"] .dcv2-ob-card:hover,
:root[data-theme="dark"] .dcv2-rule-row:hover,
:root[data-theme="dark"] .log-row.active,
:root[data-theme="dark"] .log-row:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:0 1px 0 rgba(255,255,255,.035);
}

:root[data-theme="dark"] .btn{
  border-color:var(--ui-line);
  color:var(--ui-text);
  background:var(--ui-surface-raised);
}

:root[data-theme="dark"] .btn.primary,
:root[data-theme="dark"] .btn.toolbar-main-cta,
:root[data-theme="dark"] .btn.primary.toolbar-main-cta{
  color:var(--ui-action-text);
  border-color:var(--ui-action-border);
  background:var(--ui-action);
  box-shadow:none;
}

:root[data-theme="dark"] .btn:hover,
:root[data-theme="dark"] .btn.ghost:hover,
:root[data-theme="dark"] .btn.secondary:hover,
:root[data-theme="dark"] .btn.icon.ghost:hover{
  color:var(--ui-brand);
  border-color:color-mix(in srgb, var(--ui-brand) 42%, var(--ui-line));
  background:var(--ui-brand-bg);
}

:root[data-theme="dark"] .btn.primary:hover{
  color:var(--ui-action-text);
  border-color:color-mix(in srgb, var(--ui-action-border) 72%, #fff);
  background:var(--ui-action-hover);
}

:root[data-theme="dark"] .btn.danger,
:root[data-theme="dark"] .btn.bad{
  color:#19070a;
  border-color:var(--ui-danger);
  background:var(--ui-danger);
}

:root[data-theme="dark"] .chip,
:root[data-theme="dark"] .log-toggle,
:root[data-theme="dark"] .settings-nav-chip,
:root[data-theme="dark"] .segmented button,
:root[data-theme="dark"] .tab{
  color:var(--ui-text-muted);
}

:root[data-theme="dark"] .chip:hover,
:root[data-theme="dark"] .log-toggle:hover,
:root[data-theme="dark"] .settings-nav-chip:hover,
:root[data-theme="dark"] .segmented button:hover,
:root[data-theme="dark"] .tab:hover{
  color:var(--ui-text);
  background:var(--ui-surface-raised);
  border-color:var(--ui-line);
}

:root[data-theme="dark"] .chip.active,
:root[data-theme="dark"] .chip[aria-selected="true"],
:root[data-theme="dark"] .log-toggle.active,
:root[data-theme="dark"] .settings-nav-chip.active,
:root[data-theme="dark"] .segmented button.active,
:root[data-theme="dark"] .tab.active,
:root[data-theme="dark"] .subnav a.active,
:root[data-theme="dark"] .site-nav a.active,
:root[data-theme="dark"] .site-tabs a.active{
  color:#dbe4ee;
  background:#20242a;
  border-color:rgba(137,151,166,.34);
}

:root[data-theme="dark"] .dashboard-toolbar,
:root[data-theme="dark"] .toolbar-panel.dashboard-toolbar{
  background:var(--ui-surface);
  background-image:none;
  border-color:var(--ui-line);
}

:root[data-theme="dark"] .dash-filters,
:root[data-theme="dark"] .dashboard-toolbar .dash-filters,
:root[data-theme="dark"] .toolbar-panel.dashboard-toolbar .dash-filters{
  background:#191c21;
  border-color:var(--ui-line);
}

:root[data-theme="dark"] .dashboard-toolbar .dash-filters .chip.active,
:root[data-theme="dark"] .dashboard-toolbar .dash-filters .chip[aria-selected="true"],
:root[data-theme="dark"] .toolbar-panel.dashboard-toolbar .dash-filters .chip.active,
:root[data-theme="dark"] .toolbar-panel.dashboard-toolbar .dash-filters .chip[aria-selected="true"]{
  color:#dbe4ee;
  background:#20242a;
  border-color:rgba(137,151,166,.34);
  box-shadow:inset 0 -2px 0 rgba(137,151,166,.58);
}

:root[data-theme="dark"] .pill,
:root[data-theme="dark"] .status-pill,
:root[data-theme="dark"] .tg-chip,
:root[data-theme="dark"] .node-state{
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
  color:var(--ui-text-muted);
}

:root[data-theme="dark"] .pill.ok,
:root[data-theme="dark"] .status-pill.ok,
:root[data-theme="dark"] .tg-chip.ok,
:root[data-theme="dark"] .tg-chip.active,
:root[data-theme="dark"] .node-state.online{
  color:var(--ui-success);
  background:var(--ui-success-bg);
  border-color:color-mix(in srgb, var(--ui-success) 42%, var(--ui-line));
}

:root[data-theme="dark"] .pill.warn,
:root[data-theme="dark"] .status-pill.warn,
:root[data-theme="dark"] .tg-chip.warn{
  color:var(--ui-warning);
  background:var(--ui-warning-bg);
  border-color:color-mix(in srgb, var(--ui-warning) 42%, var(--ui-line));
}

:root[data-theme="dark"] .pill.bad,
:root[data-theme="dark"] .status-pill.bad,
:root[data-theme="dark"] .tg-chip.bad{
  color:var(--ui-danger);
  background:var(--ui-danger-bg);
  border-color:color-mix(in srgb, var(--ui-danger) 42%, var(--ui-line));
}

:root[data-theme="dark"] .input,
:root[data-theme="dark"] .select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .textarea,
:root[data-theme="dark"] input[type="text"],
:root[data-theme="dark"] input[type="number"],
:root[data-theme="dark"] input[type="password"],
:root[data-theme="dark"] input[type="search"],
:root[data-theme="dark"] input[type="url"],
:root[data-theme="dark"] input[type="email"],
:root[data-theme="dark"] select,
:root[data-theme="dark"] .dashboard-toolbar .dash-search,
:root[data-theme="dark"] .dash-search,
:root[data-theme="dark"] .site-search{
  border-color:var(--ui-line);
  color:var(--ui-text);
  background:#121419;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

:root[data-theme="dark"] .input:focus,
:root[data-theme="dark"] .select:focus,
:root[data-theme="dark"] textarea:focus,
:root[data-theme="dark"] .textarea:focus,
:root[data-theme="dark"] select:focus,
:root[data-theme="dark"] .dashboard-toolbar .dash-search:focus-within,
:root[data-theme="dark"] .dash-search:focus-within,
:root[data-theme="dark"] .site-search:focus-within{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus), inset 0 1px 0 rgba(255,255,255,.03);
}

:root[data-theme="dark"] .btn:focus-visible,
:root[data-theme="dark"] .chip:focus-visible,
:root[data-theme="dark"] .log-toggle:focus-visible,
:root[data-theme="dark"] .settings-nav-chip:focus-visible,
:root[data-theme="dark"] .segmented button:focus-visible,
:root[data-theme="dark"] .menu-item:focus-visible,
:root[data-theme="dark"] .site-nav a:focus-visible,
:root[data-theme="dark"] .site-tabs a:focus-visible,
:root[data-theme="dark"] .tab:focus-visible{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

:root[data-theme="dark"] .table-wrap,
:root[data-theme="dark"] .table-shell,
:root[data-theme="dark"] .um-table-wrap,
:root[data-theme="dark"] .fm-table-wrap,
:root[data-theme="dark"] .netmon-ab-tablewrap,
:root[data-theme="dark"] .tg-rule-member-table-wrap,
:root[data-theme="dark"] .trace-route-table-wrap{
  border-color:var(--ui-line);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

:root[data-theme="dark"] .table thead th,
:root[data-theme="dark"] .um-table thead th,
:root[data-theme="dark"] .dcv2-table thead th,
:root[data-theme="dark"] .netmon-ab-table thead th,
:root[data-theme="dark"] .tg-rule-member-table thead th{
  color:var(--ui-text-muted);
  background:#14161b;
}

:root[data-theme="dark"] .table th,
:root[data-theme="dark"] .table td,
:root[data-theme="dark"] .um-table th,
:root[data-theme="dark"] .um-table td,
:root[data-theme="dark"] .dcv2-table th,
:root[data-theme="dark"] .dcv2-table td,
:root[data-theme="dark"] .netmon-ab-table th,
:root[data-theme="dark"] .netmon-ab-table td,
:root[data-theme="dark"] .tg-rule-member-table th,
:root[data-theme="dark"] .tg-rule-member-table td{
  border-bottom-color:var(--ui-line);
}

:root[data-theme="dark"] .table tbody tr:hover td,
:root[data-theme="dark"] .um-table tbody tr:hover td,
:root[data-theme="dark"] .dcv2-table tbody tr:hover td,
:root[data-theme="dark"] .netmon-ab-table tbody tr:hover td,
:root[data-theme="dark"] .tg-rule-member-table tbody tr:hover td{
  background:rgba(255,255,255,.035);
}

:root[data-theme="dark"] .menu-pop,
:root[data-theme="dark"] .menu-portal .menu-pop,
:root[data-theme="dark"] .modal-inner,
:root[data-theme="dark"] .modal-inner.modal-pro,
:root[data-theme="dark"] .um-form-modal,
:root[data-theme="dark"] .rs-form-modal-inner,
:root[data-theme="dark"] .dcv2-modal-inner,
:root[data-theme="dark"] .fm-upload-modal,
:root[data-theme="dark"] .fm-share-modal,
:root[data-theme="dark"] .wm-create-inner,
:root[data-theme="dark"] .wm-favorite-modal-inner,
:root[data-theme="dark"] .trace-route-modal-inner,
:root[data-theme="dark"] .toast{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-pop);
  box-shadow:var(--ui-shadow-pop);
}

:root[data-theme="dark"] .menu-item:hover,
:root[data-theme="dark"] .menu-item.active{
  color:var(--ui-brand);
  border-color:color-mix(in srgb, var(--ui-brand) 34%, var(--ui-line));
  background:var(--ui-brand-bg);
}

:root[data-theme="dark"] .modal{
  background:rgba(3,6,12,.78);
}

:root[data-theme="dark"] .modal-head,
:root[data-theme="dark"] .wm-create-head,
:root[data-theme="dark"] .modal-pro .modal-head,
:root[data-theme="dark"] .modal-inner > .row:first-child,
:root[data-theme="dark"] .modal .row-end,
:root[data-theme="dark"] .modal .row-end-sm,
:root[data-theme="dark"] .modal .row-end-12,
:root[data-theme="dark"] .modal .dcv2-modal-actions,
:root[data-theme="dark"] .modal .rs-form-modal-foot,
:root[data-theme="dark"] .modal .wm-create-actions{
  border-color:var(--ui-line);
  background:transparent;
}

:root[data-theme="dark"] .modal .card,
:root[data-theme="dark"] .modal .panel,
:root[data-theme="dark"] .modal .um-section,
:root[data-theme="dark"] .modal .advanced-details,
:root[data-theme="dark"] .modal .dcv2-conflict-diff,
:root[data-theme="dark"] .modal .trace-route-chart-card,
:root[data-theme="dark"] .settings-hero-stat,
:root[data-theme="dark"] .page-kpi,
:root[data-theme="dark"] .log-kpi,
:root[data-theme="dark"] .rs-meta-row,
:root[data-theme="dark"] .dcv2-situation-item,
:root[data-theme="dark"] .dcv2-health-item,
:root[data-theme="dark"] .dcv2-health-metric,
:root[data-theme="dark"] .tg-rule-kpi-card,
:root[data-theme="dark"] .tg-focus-item,
:root[data-theme="dark"] .kvline,
:root[data-theme="dark"] .site-kpi,
:root[data-theme="dark"] .stat-card,
:root[data-theme="dark"] .form-section,
:root[data-theme="dark"] .wm-create-section,
:root[data-theme="dark"] .advanced-details,
:root[data-theme="dark"] .diag-feed-item,
:root[data-theme="dark"] .log-stream-wrap,
:root[data-theme="dark"] .log-detail-item,
:root[data-theme="dark"] .log-source-meta,
:root[data-theme="dark"] .node-group-head,
:root[data-theme="dark"] .node-item,
:root[data-theme="dark"] .auto-restart-card,
:root[data-theme="dark"] .hist-head,
:root[data-theme="dark"] .hist-chart,
:root[data-theme="dark"] .hist-canvas,
:root[data-theme="dark"] .empty-state,
:root[data-theme="dark"] .empty-state.compact,
:root[data-theme="dark"] .tg-board-empty,
:root[data-theme="dark"] .tg-rule-empty,
:root[data-theme="dark"] .wm-fav-empty{
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
}

:root[data-theme="dark"] .toast.success{
  border-color:color-mix(in srgb, var(--ui-success) 46%, var(--ui-line));
}

:root[data-theme="dark"] .toast.error{
  border-color:color-mix(in srgb, var(--ui-danger) 50%, var(--ui-line));
  color:var(--ui-danger);
}

:root[data-theme="dark"] .panel-update-log-pretty,
:root[data-theme="dark"] .panel-update-log,
:root[data-theme="dark"] .backup-full-events,
:root[data-theme="dark"] .backup-full-steps,
:root[data-theme="dark"] .restore-full-summary,
:root[data-theme="dark"] .tg-rule-snapshot,
:root[data-theme="dark"] .code-block,
:root[data-theme="dark"] .log-detail-text,
:root[data-theme="dark"] .log-detail-context,
:root[data-theme="dark"] pre,
:root[data-theme="dark"] .pre{
  border-color:var(--ui-line);
  background:#0f1115;
  color:var(--ui-text);
}

:root[data-theme="dark"] .au-progress,
:root[data-theme="dark"] .progress,
:root[data-theme="dark"] .tg-rule-kpi-track,
:root[data-theme="dark"] .tg-util-track,
:root[data-theme="dark"] .tg-rule-top3-util-track,
:root[data-theme="dark"] .mini-progress{
  border-color:var(--ui-line);
  background:#111318;
}

:root[data-theme="dark"] .au-progress-fill,
:root[data-theme="dark"] .progress-fill,
:root[data-theme="dark"] .tg-rule-kpi-track > i,
:root[data-theme="dark"] .tg-util-track > span,
:root[data-theme="dark"] .tg-rule-top3-util-track > span,
:root[data-theme="dark"] .mini-fill{
  background:var(--ui-brand);
}

:root[data-theme="dark"] .danger-panel,
:root[data-theme="dark"] .site-danger-card{
  border-color:color-mix(in srgb, var(--ui-danger) 48%, var(--ui-line));
  background:color-mix(in srgb, var(--ui-danger-bg) 42%, var(--ui-surface));
}

:root[data-theme="dark"] .flash{
  border-color:color-mix(in srgb, var(--ui-warning) 46%, var(--ui-line));
  background:var(--ui-warning-bg);
  color:var(--ui-warning);
}

:root[data-theme="dark"] .flash.ok{
  border-color:color-mix(in srgb, var(--ui-success) 44%, var(--ui-line));
  background:var(--ui-success-bg);
  color:var(--ui-success);
}

:root[data-theme="dark"] .flash.bad{
  border-color:color-mix(in srgb, var(--ui-danger) 48%, var(--ui-line));
  background:var(--ui-danger-bg);
  color:var(--ui-danger);
}

:root[data-theme="dark"] .dash-status-cell{
  min-height:118px;
  background:var(--ui-surface);
}

:root[data-theme="dark"] .dash-status-cell.is-danger{
  border-color:color-mix(in srgb, var(--ui-danger) 44%, var(--ui-line));
  background:color-mix(in srgb, var(--ui-danger-bg) 34%, var(--ui-surface));
}

:root[data-theme="dark"] .dash-status-cell::after{
  display:none;
}

:root[data-theme="dark"] .dash-status-cell dt{
  color:var(--ui-text-muted);
}

:root[data-theme="dark"] .dash-status-cell dt::before{
  border-color:color-mix(in srgb, var(--ui-brand) 46%, var(--ui-line));
  background:transparent;
}

:root[data-theme="dark"] .dashboard-toolbar .chip:hover,
:root[data-theme="dark"] .dashboard-toolbar .chip.active,
:root[data-theme="dark"] .dashboard-toolbar .chip[aria-selected="true"]{
  color:#dbe4ee;
  background:#20242a;
  box-shadow:inset 0 -2px 0 rgba(137,151,166,.58);
}

:root[data-theme="dark"] .card.page-section-shell.dashboard-content-shell{
  border-color:var(--ui-line);
  background:#12151a;
  box-shadow:var(--ui-shadow);
}

:root[data-theme="dark"] .dash-group + .dash-group,
:root[data-theme="dark"] .dash-group-head{
  border-color:var(--ui-line);
}

:root[data-theme="dark"] .node-tile{
  border-color:var(--ui-line);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

:root[data-theme="dark"] .node-tile[data-online="1"]{
  border-color:color-mix(in srgb, var(--ui-success) 30%, var(--ui-line));
}

:root[data-theme="dark"] .node-tile[data-online="0"]{
  opacity:1;
  background:var(--ui-surface);
}

:root[data-theme="dark"] .node-tile:hover,
:root[data-theme="dark"] .node-tile:focus-visible{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
}

:root[data-theme="dark"] .node-state{
  border:1px solid var(--ui-line);
}

:root[data-theme="dark"] .node-state.online{
  border:1px solid color-mix(in srgb, var(--ui-success) 42%, var(--ui-line));
}

:root[data-theme="dark"] .dashboard-empty,
:root[data-theme="dark"] .dashboard-empty-node{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-muted);
}

:root[data-theme="dark"] .netmon-wallbar{
  background:rgba(18,20,25,.92);
}

:root[data-theme="dark"] body.netmon-wall .container{
  background:transparent;
}

:root[data-theme="dark"] .page-remote-control{
  --ui-bg:#0f1012;
  --ui-surface:#16181c;
  --ui-surface-raised:#1f2329;
  --ui-surface-muted:#121419;
  --ui-surface-pop:#20242a;
  --ui-line:rgba(230,234,240,.11);
  --ui-line-strong:rgba(230,234,240,.19);
  --ui-text:#eef0f3;
  --ui-text-muted:#939ba6;
  --ui-text-soft:#69717c;
  --ui-brand:#8997a6;
  --ui-brand-2:#9aa7b4;
  --ui-brand-bg:rgba(137,151,166,.13);
  --ui-focus:rgba(137,151,166,.30);
  --ui-shadow:0 1px 0 rgba(255,255,255,.025);
  --ui-shadow-pop:0 24px 60px rgba(0,0,0,.44),0 0 0 1px rgba(245,247,250,.06);
}

:root[data-theme="dark"] .page-remote-control .remote-workspace,
:root[data-theme="dark"] .page-remote-control .remote-topbar,
:root[data-theme="dark"] .page-remote-control .remote-shortcuts,
:root[data-theme="dark"] .page-remote-control .remote-mobile-controls,
:root[data-theme="dark"] .page-remote-control .remote-upload-panel{
  background:var(--ui-surface);
  border-color:var(--ui-line);
  box-shadow:var(--ui-shadow);
}

:root[data-theme="dark"] .page-remote-control .remote-stage{
  background:#0b0c0f;
}

@media (max-width:720px){
  :root[data-theme="dark"] .page-head,
  :root[data-theme="dark"] .dash-page-head{
    padding:14px;
  }

  :root[data-theme="dark"] .dash-status-cell{
    min-height:100px;
  }
}

/* Light operations layer. Keeps the panel neutral and removes template-blue ornament. */
:root[data-theme="light"]{
  --ui-bg:#f1f3f4;
  --ui-surface:#ffffff;
  --ui-surface-raised:#f8f9f8;
  --ui-surface-muted:#e8edf1;
  --ui-surface-pop:#ffffff;
  --ui-line:rgba(31,41,55,.14);
  --ui-line-strong:rgba(31,41,55,.24);
  --ui-text:#151a20;
  --ui-text-muted:#626c78;
  --ui-text-soft:#929ba6;
  --ui-brand:#435a6e;
  --ui-brand-2:#5f7588;
  --ui-brand-bg:rgba(67,90,110,.12);
  --ui-brand-bg-strong:rgba(67,90,110,.18);
  --ui-action:#435a6e;
  --ui-action-hover:#34495b;
  --ui-action-border:#3d5265;
  --ui-action-text:#ffffff;
  --ui-focus:rgba(67,90,110,.22);
  --ui-success:#2d7d54;
  --ui-warning:#956b24;
  --ui-danger:#b64b55;
  --ui-success-bg:rgba(45,125,84,.09);
  --ui-warning-bg:rgba(149,107,36,.10);
  --ui-danger-bg:rgba(182,75,85,.08);
  --ui-shadow:0 1px 2px rgba(18,24,32,.06),0 1px 0 rgba(255,255,255,.70) inset;
  --ui-shadow-pop:0 18px 42px rgba(18,24,32,.14),0 0 0 1px rgba(18,24,32,.05);
  --bg:var(--ui-bg);
  --surface:var(--ui-surface);
  --surface-elevated:var(--ui-surface-raised);
  --surface-strong:var(--ui-surface-pop);
  --surface-2:var(--ui-surface-muted);
  --text:var(--ui-text);
  --text-strong:var(--ui-text);
  --text-muted:var(--ui-text-muted);
  --text-soft:var(--ui-text-soft);
  --line:var(--ui-line);
  --line-strong:var(--ui-line-strong);
  --border-subtle:var(--ui-line);
  --border-strong:var(--ui-line-strong);
  --accent:var(--ui-brand);
  --accent2:var(--ui-brand-2);
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
}

html[data-theme="light"]{
  background:var(--ui-bg);
  scrollbar-color:rgba(98,108,120,.35) transparent;
}

:root[data-theme="light"] body{
  color:var(--ui-text);
  background:var(--ui-bg);
}

:root[data-theme="light"] body:not(.page-login):not(.page-setup) .bg-flow,
:root[data-theme="light"] body:not(.page-login):not(.page-setup) .bg-noise{
  opacity:0;
}

:root[data-theme="light"] .topbar{
  background:#fbfbfa;
  border-bottom-color:var(--ui-line);
  box-shadow:0 1px 0 rgba(18,24,32,.05);
}

:root[data-theme="light"] .logo{
  background:#f7f8f9;
  border-color:var(--ui-line-strong);
}

:root[data-theme="light"] .logo::before{
  color:var(--ui-brand);
}

:root[data-theme="light"] .nav-link:hover,
:root[data-theme="light"] .nav-segment > summary.nav-link:hover,
:root[data-theme="light"] .nav-segment[open] > summary.nav-link,
:root[data-theme="light"] .nav-link.active,
:root[data-theme="light"] .nav-segment > summary.nav-link.active,
:root[data-theme="light"] .perf-toggle:hover,
:root[data-theme="light"] .theme-toggle:hover{
  color:var(--ui-text);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line);
}

:root[data-theme="light"] .terminal-ribbon,
:root[data-theme="light"] .footer span,
:root[data-theme="light"] .card,
:root[data-theme="light"] .page-section-shell:not(.dashboard-content-shell),
:root[data-theme="light"] .settings-hero,
:root[data-theme="light"] .settings-card,
:root[data-theme="light"] .settings-side,
:root[data-theme="light"] .um-hero,
:root[data-theme="light"] .um-table-card,
:root[data-theme="light"] .wm-card,
:root[data-theme="light"] .wm-fav-card,
:root[data-theme="light"] .rs-list-card,
:root[data-theme="light"] .tg-board-shell,
:root[data-theme="light"] .tg-rule-shell,
:root[data-theme="light"] .log-console-hero,
:root[data-theme="light"] .log-stream-card,
:root[data-theme="light"] .log-detail-card,
:root[data-theme="light"] .netmon-toolbar,
:root[data-theme="light"] .netmon-empty,
:root[data-theme="light"] .netmon-chart-card,
:root[data-theme="light"] .site-card,
:root[data-theme="light"] .site-tile,
:root[data-theme="light"] .node-lite,
:root[data-theme="light"] .node-sidebar,
:root[data-theme="light"] .node-item-row,
:root[data-theme="light"] .rule-card,
:root[data-theme="light"] .wm-site-row,
:root[data-theme="light"] .wm-fav-item,
:root[data-theme="light"] .wm-node-row,
:root[data-theme="light"] .rs-item,
:root[data-theme="light"] .tg-group-card,
:root[data-theme="light"] .tg-rule-item,
:root[data-theme="light"] .tg-member-card,
:root[data-theme="light"] .tg-rule-kpi-card,
:root[data-theme="light"] .dcv2-card,
:root[data-theme="light"] .dcv2-overview-card,
:root[data-theme="light"] .dcv2-ob-card,
:root[data-theme="light"] .dcv2-rule-row,
:root[data-theme="light"] .dcv2-log-stream-card,
:root[data-theme="light"] .dcv2-log-detail-card,
:root[data-theme="light"] .log-row,
:root[data-theme="light"] .subnav,
:root[data-theme="light"] .toolbar-panel,
:root[data-theme="light"] .dashboard-toolbar,
:root[data-theme="light"] .wm-toolbar,
:root[data-theme="light"] .settings-toolbar,
:root[data-theme="light"] .rs-toolbar,
:root[data-theme="light"] .log-filter-bar,
:root[data-theme="light"] .audit-toolbar,
:root[data-theme="light"] .um-table-toolbar,
:root[data-theme="light"] .sites-toolbar,
:root[data-theme="light"] .fm-toolbar,
:root[data-theme="light"] .dcv2-rule-toolbar,
:root[data-theme="light"] .dcv2-log-toolbar,
:root[data-theme="light"] .remote-upload-panel,
:root[data-theme="light"] .settings-action-inner{
  border-color:var(--ui-line);
  background:var(--ui-surface);
  background-image:none;
  box-shadow:var(--ui-shadow);
}

:root[data-theme="light"] .terminal-ribbon{
  background:#fbfbfa;
  border-color:var(--ui-line-strong);
}

:root[data-theme="light"] .page-head,
:root[data-theme="light"] .dash-page-head{
  padding:10px 0 16px;
  border:0;
  border-bottom:1px solid rgba(31,41,55,.18);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

:root[data-theme="light"] .card:hover,
:root[data-theme="light"] .site-card:hover,
:root[data-theme="light"] .site-tile:hover,
:root[data-theme="light"] .wm-site-row:hover,
:root[data-theme="light"] .wm-fav-item:hover,
:root[data-theme="light"] .wm-node-row:hover,
:root[data-theme="light"] .rs-item:hover,
:root[data-theme="light"] .tg-group-card:hover,
:root[data-theme="light"] .tg-rule-item:hover,
:root[data-theme="light"] .tg-member-card:hover,
:root[data-theme="light"] .dcv2-ob-card:hover,
:root[data-theme="light"] .dcv2-rule-row:hover,
:root[data-theme="light"] .log-row.active,
:root[data-theme="light"] .log-row:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:0 1px 2px rgba(18,24,32,.06);
}

:root[data-theme="light"] .btn{
  border-color:var(--ui-line-strong);
  color:var(--ui-text);
  background:var(--ui-surface);
}

:root[data-theme="light"] .btn.primary,
:root[data-theme="light"] .btn.toolbar-main-cta,
:root[data-theme="light"] .btn.primary.toolbar-main-cta{
  color:var(--ui-action-text);
  border-color:var(--ui-action-border);
  background:var(--ui-action);
  box-shadow:none;
}

:root[data-theme="light"] .btn:hover,
:root[data-theme="light"] .btn.ghost:hover,
:root[data-theme="light"] .btn.secondary:hover,
:root[data-theme="light"] .btn.icon.ghost:hover{
  color:var(--ui-text);
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-muted);
}

:root[data-theme="light"] .btn.primary:hover{
  color:var(--ui-action-text);
  border-color:var(--ui-action-hover);
  background:var(--ui-action-hover);
}

:root[data-theme="light"] .btn.toolbar-main-cta,
:root[data-theme="light"] .btn.primary.toolbar-main-cta{
  box-shadow:0 1px 2px rgba(18,24,32,.10);
}

:root[data-theme="light"] .chip,
:root[data-theme="light"] .log-toggle,
:root[data-theme="light"] .settings-nav-chip,
:root[data-theme="light"] .segmented button,
:root[data-theme="light"] .tab{
  color:var(--ui-text-muted);
}

:root[data-theme="light"] .chip.active,
:root[data-theme="light"] .chip[aria-selected="true"],
:root[data-theme="light"] .log-toggle.active,
:root[data-theme="light"] .settings-nav-chip.active,
:root[data-theme="light"] .segmented button.active,
:root[data-theme="light"] .tab.active,
:root[data-theme="light"] .subnav a.active,
:root[data-theme="light"] .site-nav a.active,
:root[data-theme="light"] .site-tabs a.active{
  color:var(--ui-text);
  background:#dfe6eb;
  border-color:rgba(67,90,110,.32);
}

:root[data-theme="light"] .dashboard-toolbar,
:root[data-theme="light"] .toolbar-panel.dashboard-toolbar{
  background:var(--ui-surface);
  background-image:none;
  border-color:var(--ui-line);
}

:root[data-theme="light"] .dash-filters,
:root[data-theme="light"] .dashboard-toolbar .dash-filters,
:root[data-theme="light"] .toolbar-panel.dashboard-toolbar .dash-filters{
  background:#e4e9ee;
  border-color:var(--ui-line);
}

:root[data-theme="light"] .dashboard-toolbar .dash-filters .chip.active,
:root[data-theme="light"] .dashboard-toolbar .dash-filters .chip[aria-selected="true"],
:root[data-theme="light"] .toolbar-panel.dashboard-toolbar .dash-filters .chip.active,
:root[data-theme="light"] .toolbar-panel.dashboard-toolbar .dash-filters .chip[aria-selected="true"]{
  color:var(--ui-text);
  background:#ffffff;
  border-color:rgba(67,90,110,.34);
  box-shadow:inset 0 -2px 0 rgba(67,90,110,.48),0 1px 1px rgba(18,24,32,.04);
}

:root[data-theme="light"] .input,
:root[data-theme="light"] .select,
:root[data-theme="light"] textarea,
:root[data-theme="light"] .textarea,
:root[data-theme="light"] input[type="text"],
:root[data-theme="light"] input[type="number"],
:root[data-theme="light"] input[type="password"],
:root[data-theme="light"] input[type="search"],
:root[data-theme="light"] input[type="url"],
:root[data-theme="light"] input[type="email"],
:root[data-theme="light"] select,
:root[data-theme="light"] .dashboard-toolbar .dash-search,
:root[data-theme="light"] .dash-search,
:root[data-theme="light"] .site-search{
  border-color:var(--ui-line);
  color:var(--ui-text);
  background:#ffffff;
  box-shadow:inset 0 1px 0 rgba(18,24,32,.025);
}

:root[data-theme="light"] .input:focus,
:root[data-theme="light"] .select:focus,
:root[data-theme="light"] textarea:focus,
:root[data-theme="light"] .textarea:focus,
:root[data-theme="light"] select:focus,
:root[data-theme="light"] .dashboard-toolbar .dash-search:focus-within,
:root[data-theme="light"] .dash-search:focus-within,
:root[data-theme="light"] .site-search:focus-within{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus), inset 0 1px 0 rgba(18,24,32,.025);
}

:root[data-theme="light"] .table-wrap,
:root[data-theme="light"] .table-shell,
:root[data-theme="light"] .um-table-wrap,
:root[data-theme="light"] .fm-table-wrap,
:root[data-theme="light"] .netmon-ab-tablewrap,
:root[data-theme="light"] .tg-rule-member-table-wrap,
:root[data-theme="light"] .trace-route-table-wrap{
  border-color:var(--ui-line);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

:root[data-theme="light"] .table thead th,
:root[data-theme="light"] .um-table thead th,
:root[data-theme="light"] .dcv2-table thead th,
:root[data-theme="light"] .netmon-ab-table thead th,
:root[data-theme="light"] .tg-rule-member-table thead th{
  color:var(--ui-text-muted);
  background:#edf1f4;
}

:root[data-theme="light"] .table tbody tr:hover td,
:root[data-theme="light"] .um-table tbody tr:hover td,
:root[data-theme="light"] .dcv2-table tbody tr:hover td,
:root[data-theme="light"] .netmon-ab-table tbody tr:hover td,
:root[data-theme="light"] .tg-rule-member-table tbody tr:hover td{
  background:#f3f5f6;
}

:root[data-theme="light"] .menu-pop,
:root[data-theme="light"] .menu-portal .menu-pop,
:root[data-theme="light"] .modal-inner,
:root[data-theme="light"] .modal-inner.modal-pro,
:root[data-theme="light"] .um-form-modal,
:root[data-theme="light"] .rs-form-modal-inner,
:root[data-theme="light"] .dcv2-modal-inner,
:root[data-theme="light"] .fm-upload-modal,
:root[data-theme="light"] .fm-share-modal,
:root[data-theme="light"] .wm-create-inner,
:root[data-theme="light"] .wm-favorite-modal-inner,
:root[data-theme="light"] .trace-route-modal-inner,
:root[data-theme="light"] .toast{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-pop);
  background-image:none;
  box-shadow:var(--ui-shadow-pop);
}

:root[data-theme="light"] .modal{
  background:rgba(31,37,45,.32);
}

:root[data-theme="light"] .modal-head,
:root[data-theme="light"] .wm-create-head,
:root[data-theme="light"] .modal-pro .modal-head,
:root[data-theme="light"] .modal-inner > .row:first-child,
:root[data-theme="light"] .modal .row-end,
:root[data-theme="light"] .modal .row-end-sm,
:root[data-theme="light"] .modal .row-end-12,
:root[data-theme="light"] .modal .dcv2-modal-actions,
:root[data-theme="light"] .modal .rs-form-modal-foot,
:root[data-theme="light"] .modal .wm-create-actions{
  border-color:var(--ui-line);
  background:transparent;
}

:root[data-theme="light"] .settings-hero-stat,
:root[data-theme="light"] .page-kpi,
:root[data-theme="light"] .log-kpi,
:root[data-theme="light"] .rs-meta-row,
:root[data-theme="light"] .dcv2-situation-item,
:root[data-theme="light"] .dcv2-health-item,
:root[data-theme="light"] .dcv2-health-metric,
:root[data-theme="light"] .tg-rule-kpi-card,
:root[data-theme="light"] .tg-focus-item,
:root[data-theme="light"] .kvline,
:root[data-theme="light"] .site-kpi,
:root[data-theme="light"] .stat-card,
:root[data-theme="light"] .form-section,
:root[data-theme="light"] .wm-create-section,
:root[data-theme="light"] .advanced-details,
:root[data-theme="light"] .diag-feed-item,
:root[data-theme="light"] .log-stream-wrap,
:root[data-theme="light"] .log-detail-item,
:root[data-theme="light"] .log-source-meta,
:root[data-theme="light"] .node-group-head,
:root[data-theme="light"] .node-item,
:root[data-theme="light"] .auto-restart-card,
:root[data-theme="light"] .hist-head,
:root[data-theme="light"] .hist-chart,
:root[data-theme="light"] .hist-canvas,
:root[data-theme="light"] .empty-state,
:root[data-theme="light"] .empty-state.compact,
:root[data-theme="light"] .tg-board-empty,
:root[data-theme="light"] .tg-rule-empty,
:root[data-theme="light"] .wm-fav-empty{
  border-color:var(--ui-line);
  background:var(--ui-surface-raised);
}

:root[data-theme="light"] .panel-update-log-pretty,
:root[data-theme="light"] .panel-update-log,
:root[data-theme="light"] .backup-full-events,
:root[data-theme="light"] .backup-full-steps,
:root[data-theme="light"] .restore-full-summary,
:root[data-theme="light"] .tg-rule-snapshot,
:root[data-theme="light"] .code-block,
:root[data-theme="light"] .log-detail-text,
:root[data-theme="light"] .log-detail-context,
:root[data-theme="light"] pre,
:root[data-theme="light"] .pre{
  border-color:var(--ui-line);
  background:#edf1f4;
  color:var(--ui-text);
}

:root[data-theme="light"] .au-progress,
:root[data-theme="light"] .progress,
:root[data-theme="light"] .tg-rule-kpi-track,
:root[data-theme="light"] .tg-util-track,
:root[data-theme="light"] .tg-rule-top3-util-track,
:root[data-theme="light"] .mini-progress{
  border-color:var(--ui-line);
  background:#dfe6eb;
}

:root[data-theme="light"] .au-progress-fill,
:root[data-theme="light"] .progress-fill,
:root[data-theme="light"] .tg-rule-kpi-track > i,
:root[data-theme="light"] .tg-util-track > span,
:root[data-theme="light"] .tg-rule-top3-util-track > span,
:root[data-theme="light"] .mini-fill{
  background:var(--ui-brand);
}

:root[data-theme="light"] .dash-status-cell{
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow), inset 0 2px 0 rgba(67,90,110,.16);
}

:root[data-theme="light"] .dash-status-cell::after{
  display:none;
}

:root[data-theme="light"] .dash-status-cell dt::before{
  border-color:rgba(67,90,110,.36);
  background:transparent;
}

:root[data-theme="light"] .dash-status-cell.is-danger{
  border-color:color-mix(in srgb, var(--ui-danger) 38%, var(--ui-line));
  background:color-mix(in srgb, var(--ui-danger-bg) 36%, var(--ui-surface));
  box-shadow:var(--ui-shadow), inset 0 2px 0 color-mix(in srgb, var(--ui-danger) 44%, transparent);
}

:root[data-theme="light"] .card.page-section-shell.dashboard-content-shell{
  border-color:var(--ui-line);
  background:#fbfbfa;
  box-shadow:var(--ui-shadow);
}

:root[data-theme="light"] .node-tile{
  border-color:var(--ui-line);
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

:root[data-theme="light"] .node-tile[data-online="0"]{
  opacity:1;
  background:var(--ui-surface);
}

:root[data-theme="light"] .danger-panel,
:root[data-theme="light"] .site-danger-card{
  border-color:color-mix(in srgb, var(--ui-danger) 40%, var(--ui-line));
  background:color-mix(in srgb, var(--ui-danger-bg) 38%, var(--ui-surface));
}

:root[data-theme="light"] .flash{
  border-color:color-mix(in srgb, var(--ui-warning) 40%, var(--ui-line));
  background:var(--ui-warning-bg);
  color:var(--ui-warning);
}

:root[data-theme="light"] .flash.ok{
  border-color:color-mix(in srgb, var(--ui-success) 38%, var(--ui-line));
  background:var(--ui-success-bg);
  color:var(--ui-success);
}

:root[data-theme="light"] .flash.bad{
  border-color:color-mix(in srgb, var(--ui-danger) 40%, var(--ui-line));
  background:var(--ui-danger-bg);
  color:var(--ui-danger);
}

@media (max-width:720px){
  :root[data-theme="light"] .page-head,
  :root[data-theme="light"] .dash-page-head{
    padding:14px 0;
  }
}

/* Product operations layer. Loaded last so the panel reads as one mature product. */
:root{
  --ff-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --ff-mono:"JetBrains Mono","SFMono-Regular","SF Mono","Cascadia Code","Consolas","PingFang SC","Microsoft YaHei",monospace;
  --ui-bg:#f5f6f7;
  --ui-surface:#ffffff;
  --ui-surface-raised:#fbfcfd;
  --ui-surface-muted:#eef2f5;
  --ui-surface-pop:#ffffff;
  --ui-line:rgba(24,32,42,.12);
  --ui-line-strong:rgba(24,32,42,.22);
  --ui-text:#18202a;
  --ui-text-muted:#637083;
  --ui-text-soft:#94a0ad;
  --ui-brand:#2563eb;
  --ui-brand-2:#0f766e;
  --ui-brand-bg:rgba(37,99,235,.09);
  --ui-brand-bg-strong:rgba(37,99,235,.14);
  --ui-action:#2563eb;
  --ui-action-hover:#1d4ed8;
  --ui-action-border:#1d4ed8;
  --ui-action-text:#ffffff;
  --ui-focus:rgba(37,99,235,.24);
  --ui-success:#15803d;
  --ui-warning:#b45309;
  --ui-danger:#b91c1c;
  --ui-success-bg:rgba(21,128,61,.10);
  --ui-warning-bg:rgba(180,83,9,.11);
  --ui-danger-bg:rgba(185,28,28,.10);
  --ui-radius:6px;
  --ui-radius-lg:8px;
  --ui-shadow:0 1px 2px rgba(15,23,42,.05),0 1px 0 rgba(255,255,255,.70) inset;
  --ui-shadow-pop:0 24px 64px rgba(15,23,42,.18),0 0 0 1px rgba(15,23,42,.05);
  --container-max:1760px;
  --bg:var(--ui-bg);
  --surface:var(--ui-surface);
  --surface-elevated:var(--ui-surface-raised);
  --surface-strong:var(--ui-surface-pop);
  --surface-2:var(--ui-surface-muted);
  --text:var(--ui-text);
  --text-strong:var(--ui-text);
  --text-muted:var(--ui-text-muted);
  --text-soft:var(--ui-text-soft);
  --line:var(--ui-line);
  --line-strong:var(--ui-line-strong);
  --accent:var(--ui-brand);
  --accent2:var(--ui-brand-2);
  --ok:var(--ui-success);
  --warn:var(--ui-warning);
  --bad:var(--ui-danger);
}

:root[data-theme="dark"]{
  --ui-bg:#0f1115;
  --ui-surface:#161a20;
  --ui-surface-raised:#1d232b;
  --ui-surface-muted:#11161d;
  --ui-surface-pop:#1c222a;
  --ui-line:rgba(226,232,240,.10);
  --ui-line-strong:rgba(226,232,240,.18);
  --ui-text:#eef2f7;
  --ui-text-muted:#9aa7b5;
  --ui-text-soft:#6e7a89;
  --ui-brand:#60a5fa;
  --ui-brand-2:#5eead4;
  --ui-brand-bg:rgba(96,165,250,.12);
  --ui-brand-bg-strong:rgba(96,165,250,.18);
  --ui-action:#315f98;
  --ui-action-hover:#3b73b7;
  --ui-action-border:#4d83c4;
  --ui-action-text:#f8fbff;
  --ui-focus:rgba(96,165,250,.30);
  --ui-success:#4ade80;
  --ui-warning:#fbbf24;
  --ui-danger:#fb7185;
  --ui-success-bg:rgba(74,222,128,.12);
  --ui-warning-bg:rgba(251,191,36,.12);
  --ui-danger-bg:rgba(251,113,133,.13);
  --ui-shadow:0 1px 0 rgba(255,255,255,.035);
  --ui-shadow-pop:0 28px 70px rgba(0,0,0,.50),0 0 0 1px rgba(226,232,240,.06);
}

html{
  background:var(--ui-bg);
  color-scheme:light;
}

html[data-theme="dark"]{
  color-scheme:dark;
}

body{
  min-width:0;
  overflow-x:hidden;
  color:var(--ui-text);
  background:var(--ui-bg);
  font-family:var(--ff-sans);
  font-size:14px;
  line-height:1.5;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
}

.mono,
code,
kbd,
samp,
pre,
.pre,
.terminal-command-text,
.kvline .v.mono,
.node-meta .mono,
.panel-update-log-pretty,
.panel-update-log,
.backup-full-events,
.backup-full-steps,
.restore-full-summary,
.tg-rule-snapshot,
.code-block,
.log-detail-text,
.log-detail-context{
  font-family:var(--ff-mono);
  letter-spacing:0;
}

.topbar{
  position:sticky;
  top:0;
  z-index:60;
  min-height:64px;
  padding:calc(10px + var(--safe-top)) clamp(16px,2.4vw,34px) 10px;
  display:flex;
  align-items:center;
  gap:20px;
  background:color-mix(in srgb,var(--ui-surface) 96%,transparent);
  border-bottom:1px solid var(--ui-line);
  box-shadow:0 1px 0 rgba(15,23,42,.03);
  backdrop-filter:saturate(120%) blur(10px);
  -webkit-backdrop-filter:saturate(120%) blur(10px);
}

.brand{
  flex:0 0 auto;
  gap:12px;
}

.logo{
  width:36px;
  height:36px;
  border-radius:8px;
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 28%,var(--ui-line));
}

.logo::before{
  color:var(--ui-brand);
}

.brand-name{
  font-size:20px;
  line-height:22px;
  font-weight:750;
}

.brand-sub{
  max-width:260px;
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:14px;
}

.topbar-meta{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.product-env-chip,
.product-user{
  min-height:28px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 10px;
  border:1px solid var(--ui-line);
  border-radius:999px;
  color:var(--ui-text-muted);
  background:var(--ui-surface-raised);
  font-size:12px;
  line-height:16px;
  white-space:nowrap;
}

.product-env-chip .terminal-dot{
  width:7px;
  height:7px;
  background:var(--ui-success);
}

.top-actions{
  flex:0 1 auto;
  min-width:0;
  gap:10px;
}

.nav-link,
.nav-segment > summary.nav-link,
.nav-logout,
.theme-toggle,
.perf-toggle{
  min-height:36px;
  gap:7px;
  border-radius:8px;
  color:var(--ui-text-muted);
  font-size:13px;
  font-weight:650;
}

.nav-link [class^="icon-"],
.nav-link [class*=" icon-"]{
  color:currentColor;
}

.nav-link:hover,
.nav-segment > summary.nav-link:hover,
.nav-segment[open] > summary.nav-link,
.nav-link.active,
.nav-segment > summary.nav-link.active{
  color:var(--ui-text);
  background:var(--ui-brand-bg);
  border-color:color-mix(in srgb,var(--ui-brand) 28%,var(--ui-line));
}

.menu-pop,
.menu-portal .menu-pop{
  min-width:190px;
  padding:6px;
  border-color:var(--ui-line-strong);
  border-radius:10px;
  background:var(--ui-surface-pop);
  box-shadow:var(--ui-shadow-pop);
}

.menu-item{
  min-height:34px;
  padding:0 10px;
  border:1px solid transparent;
  border-radius:7px;
  color:var(--ui-text);
}

.menu-label{
  color:var(--ui-text-soft);
  font-size:11px;
  letter-spacing:0;
}

.terminal-ribbon.product-ribbon{
  width:min(var(--container-max), calc(100vw - 48px));
  min-height:54px;
  margin:16px auto 0;
  padding:8px 14px;
  display:flex;
  align-items:center;
  gap:16px;
  border-color:var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.product-ribbon-main{
  gap:10px;
}

.product-ribbon-copy{
  min-width:0;
  display:grid;
  gap:1px;
}

.product-ribbon-eyebrow{
  color:var(--ui-text-soft);
  font-size:10px;
  line-height:12px;
  font-weight:700;
  text-transform:uppercase;
}

.terminal-prompt,
.terminal-ok{
  color:var(--ui-success);
}

.terminal-status{
  gap:10px;
  color:var(--ui-text-muted);
  font-size:11px;
  text-transform:none;
}

.terminal-status > span + span,
.terminal-status > time{
  padding-left:12px;
}

.terminal-refresh{
  width:30px;
  height:30px;
}

.container{
  width:100%;
  max-width:min(var(--container-max), calc(100vw - 48px));
  margin:0 auto;
  padding:18px 0 calc(28px + var(--safe-bottom));
}

.page-content{
  gap:18px;
  min-width:0;
}

.footer{
  max-width:min(var(--container-max), calc(100vw - 48px));
}

.footer span{
  min-height:36px;
  color:var(--ui-text-muted);
  background:transparent;
}

.page-head,
.dash-page-head{
  min-width:0;
  padding:0 0 16px;
  border:0;
  border-bottom:1px solid var(--ui-line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.page-head .h1,
.h1,
.dash-page-title h1{
  color:var(--ui-text);
  font-size:25px;
  line-height:32px;
  font-weight:760;
}

.h2,
.card-title,
.wm-card-title,
.section-title,
.settings-hero-title,
.tg-health-title,
.panel-title,
.um-section-title{
  color:var(--ui-text);
  font-size:15px;
  line-height:21px;
  font-weight:720;
}

.page-head .meta,
.meta,
.meta-item,
.card-sub,
.wm-card-sub,
.section-sub,
.settings-hero-sub,
.panel-sub,
.help,
.muted,
.muted.sm{
  color:var(--ui-text-muted);
}

.page-head .right,
.page-head .action-group,
.dash-page-actions,
.action-group{
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-hero,
.settings-card,
.settings-side,
.um-hero,
.um-table-card,
.wm-card,
.wm-fav-card,
.rs-list-card,
.tg-board-shell,
.tg-rule-shell,
.log-console-hero,
.log-stream-card,
.log-detail-card,
.netmon-toolbar,
.netmon-empty,
.netmon-chart-card,
.site-card,
.site-tile,
.node-lite,
.node-sidebar,
.node-item-row,
.rule-card,
.wm-site-row,
.wm-fav-item,
.wm-node-row,
.rs-item,
.tg-group-card,
.tg-rule-item,
.tg-member-card,
.tg-rule-kpi-card,
.dcv2-card,
.dcv2-overview-card,
.dcv2-ob-card,
.dcv2-rule-row,
.dcv2-log-stream-card,
.dcv2-log-detail-card,
.log-row,
.fm-card,
.diag-mini-card{
  border:1px solid var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.card:hover,
.site-card:hover,
.site-tile:hover,
.wm-site-row:hover,
.wm-fav-item:hover,
.wm-node-row:hover,
.rs-item:hover,
.tg-group-card:hover,
.tg-rule-item:hover,
.tg-member-card:hover,
.dcv2-ob-card:hover,
.dcv2-rule-row:hover,
.node-tile:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
  box-shadow:0 3px 10px rgba(15,23,42,.06);
  transform:none;
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar,
.dcv2-rule-toolbar,
.dcv2-log-toolbar,
.remote-upload-panel,
.settings-action-inner{
  min-width:0;
  border:1px solid var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.btn,
.chip,
.log-toggle,
.tab,
.site-nav a,
.site-tabs a,
.settings-nav-chip,
.segmented button,
.menu-item,
button{
  letter-spacing:0;
}

.btn{
  min-height:36px;
  padding:0 13px;
  border:1px solid var(--ui-line-strong);
  border-radius:8px;
  color:var(--ui-text);
  background:var(--ui-surface);
  font-weight:650;
  box-shadow:none;
}

.btn.primary,
.btn.toolbar-main-cta,
.btn.primary.toolbar-main-cta,
.btn:not(.ghost):not(.secondary):not(.danger):not(.bad){
  color:var(--ui-action-text);
  border-color:var(--ui-action-border);
  background:var(--ui-action);
}

.btn:hover,
.btn.ghost:hover,
.btn.secondary:hover,
.btn.icon.ghost:hover{
  color:var(--ui-text);
  border-color:color-mix(in srgb,var(--ui-brand) 36%,var(--ui-line-strong));
  background:var(--ui-brand-bg);
  box-shadow:none;
  filter:none;
  transform:none;
}

.btn.primary:hover,
.btn.toolbar-main-cta:hover,
.btn:not(.ghost):not(.secondary):not(.danger):not(.bad):hover{
  color:var(--ui-action-text);
  border-color:var(--ui-action-hover);
  background:var(--ui-action-hover);
}

.btn.ghost,
.btn.secondary,
.btn.icon.ghost{
  color:var(--ui-text);
  background:var(--ui-surface);
}

.btn.danger,
.btn.bad,
.fm-act-danger{
  color:#fff;
  border-color:var(--ui-danger);
  background:var(--ui-danger);
}

.btn.sm{
  min-height:34px;
}

.btn.xs{
  min-height:30px;
  padding:0 10px;
  font-size:12px;
}

.btn.icon,
.btn.icon.xs,
.btn.icon.sm{
  padding:0;
}

.chip,
.log-toggle,
.settings-nav-chip,
.segmented button,
.tab{
  min-height:32px;
  padding:0 11px;
  border:1px solid transparent;
  border-radius:8px;
  color:var(--ui-text-muted);
  background:transparent;
  font-weight:650;
}

.chip:hover,
.log-toggle:hover,
.settings-nav-chip:hover,
.segmented button:hover,
.tab:hover{
  color:var(--ui-text);
  border-color:var(--ui-line);
  background:var(--ui-surface-raised);
}

.chip.active,
.chip[aria-selected="true"],
.chip[aria-pressed="true"],
.log-toggle.active,
.settings-nav-chip.active,
.segmented button.active,
.segmented button[aria-selected="true"],
.tab.active,
.site-nav a.active,
.site-tabs a.active,
.subnav a.active{
  color:var(--ui-brand);
  border-color:color-mix(in srgb,var(--ui-brand) 35%,var(--ui-line));
  background:var(--ui-brand-bg);
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--ui-brand) 48%,transparent);
}

.pill,
.status-pill,
.tg-chip,
.node-state{
  min-height:24px;
  border-radius:999px;
  font-size:12px;
  font-weight:650;
}

.pill.ok,
.status-pill.ok,
.tg-chip.ok,
.tg-chip.active,
.node-state.online{
  color:var(--ui-success);
  border-color:color-mix(in srgb,var(--ui-success) 36%,var(--ui-line));
  background:var(--ui-success-bg);
}

.pill.warn,
.status-pill.warn,
.tg-chip.warn{
  color:var(--ui-warning);
  border-color:color-mix(in srgb,var(--ui-warning) 38%,var(--ui-line));
  background:var(--ui-warning-bg);
}

.pill.bad,
.status-pill.bad,
.tg-chip.bad,
.node-state.offline{
  color:var(--ui-danger);
  border-color:color-mix(in srgb,var(--ui-danger) 38%,var(--ui-line));
  background:var(--ui-danger-bg);
}

.form,
.settings-form,
.form-grid,
.settings-field-grid,
.wm-create-grid,
.rs-form-grid,
.task-form-grid{
  gap:14px;
}

.label{
  margin-bottom:6px;
  color:var(--ui-text);
  font-size:12px;
  line-height:16px;
  font-weight:700;
  text-transform:none;
}

.input,
.select,
textarea,
.textarea,
input[type="text"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="email"],
select{
  min-height:40px;
  border:1px solid var(--ui-line);
  border-radius:8px;
  background:var(--ui-surface);
  color:var(--ui-text);
  font-family:var(--ff-sans);
  font-size:14px;
  box-shadow:inset 0 1px 0 rgba(15,23,42,.025);
}

textarea,
.textarea{
  min-height:92px;
}

.input:focus,
.select:focus,
textarea:focus,
.textarea:focus,
select:focus,
.dash-search:focus-within,
.site-search:focus-within,
.btn:focus-visible,
.chip:focus-visible,
.log-toggle:focus-visible,
.settings-nav-chip:focus-visible,
.segmented button:focus-visible,
.menu-item:focus-visible,
.site-nav a:focus-visible,
.site-tabs a:focus-visible,
.tab:focus-visible,
.terminal-refresh:focus-visible{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

input[type="checkbox"],
input[type="radio"]{
  accent-color:var(--ui-brand);
}

.settings-check,
.um-switch,
label.help{
  align-items:flex-start;
  gap:9px;
  color:var(--ui-text);
}

.table-wrap,
.table-shell,
.um-table-wrap,
.fm-table-wrap,
.netmon-ab-tablewrap,
.tg-rule-member-table-wrap,
.trace-route-table-wrap{
  max-width:100%;
  overflow:auto;
  border:1px solid var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.table,
.um-table,
.dcv2-table,
.netmon-ab-table,
.tg-rule-member-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}

.table th,
.table td,
.um-table th,
.um-table td,
.dcv2-table th,
.dcv2-table td,
.netmon-ab-table th,
.netmon-ab-table td,
.tg-rule-member-table th,
.tg-rule-member-table td{
  padding:11px 12px;
  border-bottom:1px solid var(--ui-line);
  color:var(--ui-text);
  font-size:13px;
  vertical-align:middle;
}

.table thead th,
.um-table thead th,
.dcv2-table thead th,
.netmon-ab-table thead th,
.tg-rule-member-table thead th{
  position:sticky;
  top:0;
  z-index:2;
  color:var(--ui-text-muted);
  background:var(--ui-surface-muted);
  font-size:11px;
  line-height:14px;
  font-weight:750;
  text-transform:uppercase;
}

.table tbody tr:hover td,
.um-table tbody tr:hover td,
.dcv2-table tbody tr:hover td,
.netmon-ab-table tbody tr:hover td,
.tg-rule-member-table tbody tr:hover td{
  background:var(--ui-brand-bg);
}

.modal{
  padding:24px;
  align-items:center;
  justify-content:center;
  background:rgba(15,23,42,.42);
  backdrop-filter:saturate(115%) blur(4px);
  -webkit-backdrop-filter:saturate(115%) blur(4px);
}

.modal-inner,
.modal-inner.modal-pro,
.um-form-modal,
.rs-form-modal-inner,
.dcv2-modal-inner,
.fm-upload-modal,
.fm-share-modal,
.wm-create-inner,
.wm-favorite-modal-inner,
.trace-route-modal-inner{
  width:min(100%,720px);
  max-height:calc(100dvh - 48px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--ui-line-strong);
  border-radius:12px;
  background:var(--ui-surface-pop);
  box-shadow:var(--ui-shadow-pop);
}

.modal-inner.maxw-520{width:min(100%,520px);}
.modal-inner.maxw-560{width:min(100%,560px);}
.modal-inner.maxw-640{width:min(100%,640px);}
.modal-inner.maxw-620{width:min(100%,620px);}
.modal-inner.maxw-720{width:min(100%,720px);}
.modal-inner.maxw-760{width:min(100%,760px);}
.modal-inner.maxw-860{width:min(100%,860px);}
.modal-inner.maxw-960{width:min(100%,960px);}

.modal-head,
.wm-create-head,
.modal-pro .modal-head,
.modal-inner > .row:first-child{
  flex:0 0 auto;
  min-height:56px;
  padding:14px 16px;
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface-pop);
}

.modal-body,
.modal .modal-body,
.modal-inner > .form,
.modal-inner > form,
.modal-inner > .mt-10,
.modal-inner > .table-wrap{
  min-height:0;
  overflow:auto;
  padding:16px;
}

.modal-inner > .form.mt-10,
.modal-inner > .mt-10{
  margin-top:0;
}

.modal .card,
.modal .panel,
.modal .um-section,
.modal .advanced-details,
.modal .dcv2-conflict-diff,
.modal .trace-route-chart-card,
.modal .form-section{
  background:var(--ui-surface-raised);
}

.modal .row-end,
.modal .row-end-sm,
.modal .row-end-12,
.modal .dcv2-modal-actions,
.modal .rs-form-modal-foot,
.modal .wm-create-actions{
  flex:0 0 auto;
  margin:14px -16px -16px;
  padding:12px 16px;
  border-top:1px solid var(--ui-line);
  background:var(--ui-surface-pop);
}

.toast{
  max-width:min(420px,calc(100vw - 32px));
  border-color:var(--ui-line-strong);
  border-radius:10px;
  background:var(--ui-surface-pop);
  box-shadow:var(--ui-shadow-pop);
}

.empty-state,
.empty-state.compact,
.tg-board-empty,
.tg-rule-empty,
.wm-fav-empty,
.dashboard-empty,
.dashboard-empty-node{
  border:1px dashed var(--ui-line-strong);
  border-radius:10px;
  background:var(--ui-surface-raised);
  color:var(--ui-text-muted);
}

.dash-status-cell,
.settings-hero-stat,
.page-kpi,
.log-kpi,
.rs-meta-row,
.dcv2-situation-item,
.dcv2-health-item,
.dcv2-health-metric,
.tg-rule-kpi-card,
.tg-focus-item,
.kvline,
.site-kpi,
.stat-card{
  border:1px solid var(--ui-line);
  border-radius:9px;
  background:var(--ui-surface-raised);
  box-shadow:none;
}

.dash-status-cell dt{
  display:flex;
  align-items:center;
  gap:8px;
}

.dash-status-cell dt::before{
  content:"";
  width:7px;
  height:7px;
  flex:0 0 7px;
  border:0;
  border-radius:999px;
  background:var(--ui-brand);
}

.dash-status-cell.is-danger dt::before{
  background:var(--ui-danger);
}

.dash-status-cell dd{
  font-size:30px;
  line-height:36px;
  font-weight:780;
}

.dashboard-toolbar,
.toolbar-panel.dashboard-toolbar{
  top:calc(64px + var(--safe-top));
  grid-template-columns:minmax(0,auto) minmax(260px,1fr) auto;
  gap:10px;
}

.dash-search,
.site-search,
.um-search{
  min-width:0;
}

.dash-search-input,
.site-search input{
  font-family:var(--ff-sans);
}

.node-tile{
  min-height:136px;
  border-radius:10px;
}

.node-name,
.wm-site-name,
.rs-title,
.log-row-msg{
  font-weight:720;
}

.node-state{
  border-radius:999px;
}

.mini-progress,
.au-progress,
.progress,
.tg-rule-kpi-track,
.tg-util-track,
.tg-rule-top3-util-track{
  height:6px;
  border-color:var(--ui-line);
  background:var(--ui-surface-muted);
}

.mini-fill,
.au-progress-fill,
.progress-fill,
.tg-rule-kpi-track > i,
.tg-util-track > span,
.tg-rule-top3-util-track > span{
  background:linear-gradient(90deg,var(--ui-brand),var(--ui-brand-2));
}

.settings-console,
.wm-layout,
.log-console-layout,
.dcv2-log-console-layout,
.site-layout.site-layout-detail{
  gap:18px;
}

.settings-side{
  position:sticky;
  top:calc(82px + var(--safe-top));
}

.subnav,
.site-nav,
.site-tabs{
  border:1px solid var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface);
  box-shadow:var(--ui-shadow);
}

.subnav a,
.site-nav a,
.site-tabs a{
  min-height:34px;
  border-radius:8px;
}

.task-shell,
.task-grid,
.task-preview-list{
  gap:14px;
}

.task-filter-bar,
.task-inline-meta{
  gap:8px;
}

.task-command{
  min-height:180px;
  resize:vertical;
}

.task-preview-empty,
.task-warning,
.task-readonly{
  border-color:var(--ui-line);
  background:var(--ui-surface-raised);
}

body.page-login,
body.page-setup{
  background:
    linear-gradient(90deg,rgba(24,32,42,.045) 1px,transparent 1px),
    linear-gradient(rgba(24,32,42,.045) 1px,transparent 1px),
    var(--ui-bg);
  background-size:32px 32px;
}

body.page-login .container,
body.page-setup .container{
  max-width:min(1040px,calc(100vw - 32px));
  min-height:calc(100dvh - 56px);
  display:grid;
  align-items:center;
  padding:clamp(24px,8vh,72px) 0;
}

body.page-login .page-content,
body.page-setup .page-content{
  gap:16px;
}

body.page-login .page-head,
body.page-setup .page-head,
body.page-login .footer,
body.page-setup .footer{
  display:none;
}

body.page-login .center-wrap.page-section-shell,
body.page-setup .center-wrap.page-section-shell{
  max-width:480px;
  margin:0 auto;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

body.page-login .auth-head,
body.page-setup .auth-head{
  margin-bottom:14px;
  text-align:left;
}

body.page-login .auth-head::before,
body.page-setup .auth-head::before{
  width:42px;
  height:42px;
  margin:0 0 14px;
  border:1px solid color-mix(in srgb,var(--ui-brand) 30%,var(--ui-line));
  border-radius:10px;
  background:var(--ui-brand-bg);
  box-shadow:none;
}

body.page-login .card.center-card,
body.page-setup .card.center-card{
  padding:22px;
  border-radius:12px;
}

.page-remote-control{
  --ff-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
}

@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    transition-duration:0ms !important;
    animation-duration:0ms !important;
    scroll-behavior:auto !important;
  }
}

@media (max-width:1100px){
  .topbar{
    gap:12px;
  }

  .topbar-meta{
    display:none;
  }

  .terminal-ribbon.product-ribbon,
  .container,
  .footer{
    max-width:calc(100vw - 32px);
    width:auto;
  }

  .settings-side,
  .settings-action-inner{
    position:static;
  }
}

@media (max-width:760px){
  body{
    font-size:14px;
  }

  .topbar{
    min-height:58px;
    padding:calc(8px + var(--safe-top)) 12px 8px;
  }

  .brand{
    min-width:0;
  }

  .brand-name{
    font-size:18px;
    line-height:22px;
  }

  .brand-sub{
    display:none;
  }

  .terminal-ribbon.product-ribbon{
    max-width:calc(100vw - 20px);
    margin-top:10px;
    align-items:stretch;
    flex-direction:column;
    gap:8px;
  }

  .terminal-status{
    width:100%;
    flex-wrap:wrap;
    overflow:visible;
    padding-top:8px;
    border-top:1px solid var(--ui-line);
    white-space:normal;
  }

  .terminal-status > span + span,
  .terminal-status > time{
    padding-left:0;
    border-left:0;
  }

  .terminal-refresh{
    margin-left:auto;
  }

  .container,
  .footer{
    max-width:calc(100vw - 20px);
  }

  .container{
    padding-top:12px;
  }

  .page-head,
  .dash-page-head{
    gap:10px;
  }

  .page-head .right,
  .dash-page-actions,
  .action-group{
    width:100%;
  }

  .page-head .right > .btn,
  .page-head .right > a.btn,
  .page-head .right > details.menu,
  .page-head .right > details.menu > summary{
    flex:1 1 auto;
  }

  .page-head .h1,
  .h1,
  .dash-page-title h1{
    font-size:21px;
    line-height:28px;
  }

  .dashboard-toolbar,
  .toolbar-panel.dashboard-toolbar,
  .wm-toolbar,
  .settings-toolbar,
  .rs-toolbar,
  .log-filter-bar,
  .audit-toolbar,
  .um-table-toolbar,
  .sites-toolbar,
  .fm-toolbar{
    grid-template-columns:minmax(0,1fr);
    align-items:stretch;
  }

  .dash-filters,
  .log-toggle-group,
  .segmented{
    max-width:100%;
    overflow:auto;
  }

  .modal{
    padding:10px;
    align-items:flex-end;
  }

  .modal-inner,
  .modal-inner.modal-pro,
  .um-form-modal,
  .rs-form-modal-inner,
  .dcv2-modal-inner,
  .fm-upload-modal,
  .fm-share-modal,
  .wm-create-inner,
  .wm-favorite-modal-inner,
  .trace-route-modal-inner{
    width:100%;
    max-height:calc(100dvh - 20px);
    border-radius:12px 12px 0 0;
  }

  .modal-body,
  .modal .modal-body,
  .modal-inner > .form,
  .modal-inner > form,
  .modal-inner > .mt-10,
  .modal-inner > .table-wrap{
    padding:14px;
  }

  .modal .row-end,
  .modal .row-end-sm,
  .modal .row-end-12,
  .modal .dcv2-modal-actions,
  .modal .rs-form-modal-foot,
  .modal .wm-create-actions{
    margin:12px -14px -14px;
    padding:12px 14px calc(12px + var(--safe-bottom));
  }

  .modal .row-end > .btn,
  .modal .row-end-sm > .btn,
  .modal .row-end-12 > .btn,
  .modal .dcv2-modal-actions > .btn,
  .modal .rs-form-modal-foot > .btn,
  .modal .wm-create-actions > .btn{
    flex:1 1 auto;
  }

  .input,
  .select,
  textarea,
  .textarea,
  input[type="text"],
  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="url"],
  input[type="email"],
  select{
    font-size:16px;
  }

  .table th,
  .table td,
  .um-table th,
  .um-table td,
  .dcv2-table th,
  .dcv2-table td,
  .netmon-ab-table th,
  .netmon-ab-table td,
  .tg-rule-member-table th,
  .tg-rule-member-table td{
    padding:10px;
    white-space:nowrap;
  }
}

/* Mature product finish layer. Keep this final: it removes the last half-finished spacing and mobile-density leaks. */
:root{
  --ui-bg:#f4f6f8;
  --ui-surface-muted:#edf2f6;
  --ui-brand:#315f80;
  --ui-brand-2:#12756d;
  --ui-brand-bg:rgba(49,95,128,.10);
  --ui-brand-bg-strong:rgba(49,95,128,.16);
  --ui-action:#3f5f79;
  --ui-action-hover:#344f65;
  --ui-action-border:#344f65;
  --ui-focus:rgba(49,95,128,.24);
}

:root[data-theme="dark"]{
  --ui-bg:#0f1216;
  --ui-surface:#171c22;
  --ui-surface-raised:#1d242c;
  --ui-surface-muted:#111820;
  --ui-surface-pop:#1b222a;
  --ui-brand:#89a9c2;
  --ui-brand-2:#62c8b7;
  --ui-brand-bg:rgba(137,169,194,.13);
  --ui-brand-bg-strong:rgba(137,169,194,.19);
  --ui-action:#496b84;
  --ui-action-hover:#557d99;
  --ui-action-border:#5f88a4;
  --ui-focus:rgba(137,169,194,.28);
}

body:not(.page-login):not(.page-setup){
  background:
    linear-gradient(180deg, color-mix(in srgb,var(--ui-surface-muted) 52%,transparent) 0, transparent 220px),
    var(--ui-bg);
}

.route-display .topbar,
.route-display .terminal-ribbon,
.route-display .footer,
.route-display .bg-flow,
.route-display .bg-noise{
  display:none !important;
}

.route-display .container{
  width:auto;
  max-width:none;
  padding:12px;
}

.route-display .page-content{
  gap:12px;
}

.topbar{
  min-height:62px;
  padding:calc(9px + var(--safe-top)) clamp(18px,2.3vw,32px) 9px;
  border-bottom-color:color-mix(in srgb,var(--ui-line) 80%,transparent);
  background:var(--ui-surface);
  box-shadow:0 1px 0 rgba(15,23,42,.04);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

.logo{
  width:34px;
  height:34px;
  border-radius:8px;
  background:linear-gradient(180deg,var(--ui-surface),var(--ui-surface-muted));
}

.brand-name{
  font-size:19px;
  line-height:22px;
}

.nav-link,
.nav-segment > summary.nav-link,
.nav-logout,
.theme-toggle,
.perf-toggle{
  min-height:34px;
  padding-inline:11px;
}

.product-page-chip{
  min-height:28px;
  display:inline-flex;
  align-items:center;
  max-width:180px;
  padding:0 10px;
  border:1px solid color-mix(in srgb,var(--ui-brand) 26%,var(--ui-line));
  border-radius:999px;
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  font-size:12px;
  line-height:16px;
  font-weight:650;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.terminal-ribbon.product-ribbon{
  min-height:48px;
  margin-top:14px;
  padding:7px 12px;
  border-radius:9px;
}

.terminal-command-text{
  font-size:12px;
}

.terminal-status{
  gap:8px;
}

.terminal-status > span + span,
.terminal-status > time{
  padding-left:10px;
}

.container{
  padding-top:16px;
}

.page-head,
.dash-page-head{
  padding-bottom:14px;
}

.card,
.page-section-shell:not(.dashboard-content-shell),
.wm-card,
.wm-fav-card,
.settings-card,
.rs-list-card{
  border-radius:9px;
}

.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar{
  border-radius:9px;
}

.dash-status-cell{
  position:relative;
  overflow:hidden;
}

.page-kpi,
.stat-card{
  position:relative;
  overflow:hidden;
}

.dash-status-cell::after,
.page-kpi::after,
.stat-card::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  bottom:auto;
  width:auto;
  height:3px;
  background:linear-gradient(90deg,var(--ui-brand),var(--ui-brand-2));
}

.dash-status-cell.is-danger::after{
  background:var(--ui-danger);
}

.dash-group-name{
  border-radius:7px;
}

.dash-group-name:focus-visible,
.node-tile:focus-visible{
  outline:0;
  border-color:var(--ui-brand);
  box-shadow:0 0 0 3px var(--ui-focus);
}

.dash-group-name:focus-visible{
  background:var(--ui-brand-bg);
}

.dashboard-toolbar,
.toolbar-panel.dashboard-toolbar{
  position:sticky;
  top:calc(62px + var(--safe-top));
  z-index:18;
}

.dashboard-empty,
.dashboard-empty-node,
.wm-fav-empty,
.tg-board-empty,
.tg-rule-empty,
.empty-state.compact{
  min-height:132px;
  padding:22px;
  display:grid;
  place-items:center;
  text-align:center;
  border-style:dashed;
  background:
    linear-gradient(135deg, color-mix(in srgb,var(--ui-surface-muted) 68%,transparent) 0 25%, transparent 25% 50%, color-mix(in srgb,var(--ui-surface-muted) 68%,transparent) 50% 75%, transparent 75%) 0 0 / 18px 18px,
    var(--ui-surface);
}

.wm-site-row,
.wm-fav-item,
.rs-item,
.tg-group-card,
.tg-rule-item,
.node-tile{
  transition:
    background var(--motion-2) var(--ease-out),
    border-color var(--motion-2) var(--ease-out),
    box-shadow var(--motion-2) var(--ease-out);
}

.btn,
.chip,
.menu-item,
.nav-link,
.nav-segment > summary.nav-link,
.site-nav a,
.site-tabs a,
.settings-nav-chip{
  transition:
    color var(--motion-2) var(--ease-out),
    background var(--motion-2) var(--ease-out),
    border-color var(--motion-2) var(--ease-out),
    box-shadow var(--motion-2) var(--ease-out);
}

button,
summary,
.btn,
.chip,
.menu-item,
.node-card,
.wm-fav-main,
.wm-site-row,
.rs-item,
.tg-group-card,
.tg-rule-item,
[role="button"]{
  cursor:pointer;
}

.btn:disabled,
.btn.disabled,
.chip[aria-disabled="true"],
.menu-item[aria-disabled="true"],
button:disabled,
summary[aria-disabled="true"]{
  cursor:not-allowed;
}

.form{
  gap:12px;
}

.task-shell,
.task-grid,
.task-preview-list,
.task-detail-side{
  display:grid;
  gap:12px;
  min-width:0;
}

.task-filter-bar,
.task-detail-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.task-search{
  max-width:320px;
}

.task-form-grid,
.task-config-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  min-width:0;
}

.task-form-grid .full{
  grid-column:1 / -1;
}

.task-node-select{
  min-height:156px;
}

.task-node-tools{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 8px;
}

.task-node-tools .pill{
  margin-left:auto;
}

.task-form-error{
  margin-top:12px;
  padding:10px 12px;
  border:1px solid color-mix(in srgb,var(--ui-danger) 34%,var(--ui-line));
  border-radius:8px;
  background:var(--ui-danger-bg);
  color:var(--ui-danger);
}

.task-command{
  min-height:160px;
  resize:vertical;
}

.task-preview-empty{
  padding:10px 12px;
  border:1px dashed var(--ui-line);
  border-radius:8px;
}

.task-summary-cell{
  display:grid;
  gap:4px;
}

.task-summary-cell .meta{
  margin:0;
}

.task-grid{
  grid-template-columns:minmax(0,1fr);
}

.task-readonly{
  padding:12px 14px;
}

.task-warning{
  padding:10px 12px;
  border-radius:8px;
  border:1px solid color-mix(in srgb,var(--ui-warning) 32%,var(--ui-line));
  background:var(--ui-warning-bg);
}

.task-inline-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.task-detail-layout{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);
  gap:12px;
  min-width:0;
}

.task-detail-layout > *,
.task-detail-side > *,
.task-config-grid > *{
  min-width:0;
}

.task-config-item{
  padding:12px;
  border:1px solid var(--ui-line);
  border-radius:8px;
  background:var(--ui-surface);
  min-width:0;
}

.task-config-item .k{
  margin-bottom:6px;
  color:var(--ui-text-muted);
  font-size:12px;
  line-height:16px;
}

.task-config-item .v{
  word-break:break-word;
  overflow-wrap:anywhere;
  min-width:0;
}

.task-detail-command{
  min-height:180px;
  max-height:360px;
  overflow:auto;
  max-width:100%;
  min-width:0;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.task-detail-pre{
  margin:0;
  min-height:120px;
  max-height:280px;
  overflow:auto;
  max-width:100%;
  min-width:0;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.task-detail-empty{
  padding:16px;
}

.task-list-table-wrap,
.task-exec-table-wrap{
  overflow:auto;
}

.task-list-table td,
.task-exec-table td{
  vertical-align:top;
}

.site-cert-table td{
  vertical-align:top;
}

.site-cert-error-details pre{
  max-width:100%;
  overflow:auto;
}

.task-row-actions,
.task-exec-actions{
  justify-content:flex-end;
}

.label{
  display:block;
  margin:0;
  margin-bottom:6px;
  color:var(--ui-text);
  font-size:12px;
  line-height:16px;
  font-weight:650;
}

.label + .input,
.label + .select,
.label + textarea,
.label + .textarea,
.label + input[type="text"],
.label + input[type="number"],
.label + input[type="password"],
.label + input[type="search"],
.label + input[type="url"],
.label + input[type="email"],
.label + select{
  margin-top:0;
}

.help{
  max-width:76ch;
  line-height:18px;
}

.input,
.select,
textarea,
.textarea,
input[type="text"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="email"],
select{
  display:block;
  min-height:38px;
  width:100%;
  box-sizing:border-box;
}

.input:disabled,
.select:disabled,
textarea:disabled,
.textarea:disabled,
input:disabled,
select:disabled{
  opacity:1;
  color:var(--ui-text-soft);
  background:color-mix(in srgb,var(--ui-surface-muted) 76%,var(--ui-surface));
  border-color:color-mix(in srgb,var(--ui-line) 78%,transparent);
  cursor:not-allowed;
}

.modal-head [data-modal-close].btn.xs.ghost,
.modal-inner > .row:first-child .col.right .btn.xs.ghost,
.modal-inner > .row:first-child .right .btn.xs.ghost{
  position:relative;
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border-radius:8px;
  font-size:0;
  line-height:0;
  color:var(--ui-text-muted);
  background:transparent;
}

.modal-head [data-modal-close].btn.xs.ghost::before,
.modal-head [data-modal-close].btn.xs.ghost::after,
.modal-inner > .row:first-child .col.right .btn.xs.ghost::before,
.modal-inner > .row:first-child .col.right .btn.xs.ghost::after,
.modal-inner > .row:first-child .right .btn.xs.ghost::before,
.modal-inner > .row:first-child .right .btn.xs.ghost::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:14px;
  height:2px;
  border-radius:2px;
  background:currentColor;
}

.modal-head [data-modal-close].btn.xs.ghost::before,
.modal-inner > .row:first-child .col.right .btn.xs.ghost::before,
.modal-inner > .row:first-child .right .btn.xs.ghost::before{
  transform:translate(-50%,-50%) rotate(45deg);
}

.modal-head [data-modal-close].btn.xs.ghost::after,
.modal-inner > .row:first-child .col.right .btn.xs.ghost::after,
.modal-inner > .row:first-child .right .btn.xs.ghost::after{
  transform:translate(-50%,-50%) rotate(-45deg);
}

  .modal-head [data-modal-close].btn.xs.ghost:hover,
  .modal-inner > .row:first-child .col.right .btn.xs.ghost:hover,
  .modal-inner > .row:first-child .right .btn.xs.ghost:hover{
  color:var(--ui-text);
  background:var(--ui-surface-muted);
  border-color:var(--ui-line-strong);
}

.modal-inner > .row:first-child{
  min-height:38px;
}

.modal-inner > .row:first-child .h2,
.modal-head .h2,
.modal-title{
  min-width:0;
  overflow-wrap:anywhere;
}

.empty-state,
.empty-state.compact,
.dashboard-empty,
.dashboard-empty-node,
.wm-fav-empty,
.tg-board-empty,
.tg-rule-empty{
  color:var(--ui-text-muted);
}

.empty-state.compact strong,
.empty-state-title,
.dashboard-empty-title,
.dashboard-empty-node .card-title{
  color:var(--ui-text);
}

.empty-state-title{
  font-size:14px;
  line-height:20px;
  font-weight:700;
}

.empty-state-sub{
  max-width:52ch;
  margin-top:4px;
  color:var(--ui-text-muted);
  font-size:12px;
  line-height:18px;
}

.empty-state-actions{
  justify-content:center;
  margin-top:12px;
}

.rule-empty-state{
  margin-top:10px;
}

.confirm-modal-inner{
  gap:0;
}

.confirm-modal-message{
  padding:2px 0 14px;
  color:var(--ui-text);
  font-size:14px;
  line-height:21px;
  overflow-wrap:anywhere;
}

.confirm-modal-actions{
  justify-content:flex-end;
  gap:8px;
}

.um-filter-summary,
.um-page-msg,
.task-exec-hint,
.audit-hint{
  margin:10px 0 0;
  padding:9px 11px;
  border:1px solid var(--ui-line);
  border-radius:8px;
  background:var(--ui-surface-muted);
  color:var(--ui-text-muted);
}

.um-page-msg.bad,
.task-exec-hint.bad,
.audit-hint.bad{
  border-color:color-mix(in srgb,var(--ui-danger) 40%,var(--ui-line));
  background:var(--ui-danger-bg);
  color:var(--ui-danger);
}

.audit-workbench{
  display:grid;
  gap:12px;
}

.audit-kpi-grid{
  margin-bottom:2px;
}

.audit-kpi .log-kpi-value{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.audit-toolbar-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.audit-empty-state{
  min-height:118px;
}

@media (min-width:981px){
  .settings-main > .settings-toolbar{
    display:none;
  }
}

.toolbar-panel > *,
.dashboard-toolbar > *,
.wm-toolbar > *,
.settings-toolbar > *,
.rs-toolbar > *,
.log-filter-bar > *,
.audit-toolbar > *,
.um-table-toolbar > *,
.sites-toolbar > *,
.fm-toolbar > *{
  min-width:0;
}

@media (max-width:1120px){
  .dashboard-toolbar,
  .toolbar-panel.dashboard-toolbar{
    grid-template-columns:minmax(0,1fr);
  }

  .node-grid.view-compact .node-tile,
  .node-grid.view-table .node-tile{
    grid-template-columns:minmax(0,1fr);
    gap:10px;
  }
}

@media (max-width:980px){
  .settings-side{
    display:none;
  }

  .task-detail-layout,
  .task-form-grid,
  .task-config-grid{
    grid-template-columns:minmax(0,1fr);
  }

  .task-node-tools .btn{
    flex:1 1 112px;
    min-height:40px;
  }

  .task-node-tools .pill{
    width:100%;
    margin-left:0;
    justify-content:center;
  }
}

@media (max-width:760px){
  .topbar{
    min-height:54px;
    padding:calc(8px + var(--safe-top)) 12px 8px;
  }

  .brand{
    gap:10px;
  }

  .logo{
    width:32px;
    height:32px;
  }

  .logo-img{
    width:24px;
    height:24px;
  }

  .brand-name{
    font-size:17px;
    line-height:20px;
  }

  .top-actions{
    gap:7px;
  }

  .theme-toggle-text{
    display:none;
  }

  .product-page-chip{
    display:none;
  }

  .nav-link,
  .nav-segment > summary.nav-link,
  .nav-logout,
  .theme-toggle,
  .perf-toggle,
  .nav-mobile > summary.btn.icon{
    width:38px;
    min-width:38px;
    height:38px;
    min-height:38px;
    padding:0;
  }

  .terminal-ribbon.product-ribbon{
    width:auto;
    max-width:calc(100vw - 24px);
    min-height:0;
    margin-top:10px;
    padding:11px 12px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 34px;
    gap:10px 12px;
  }

  .product-ribbon-main{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:22px minmax(0,1fr);
    align-items:center;
    gap:9px;
    padding-bottom:9px;
    border-bottom:1px solid var(--ui-line);
  }

  .terminal-status{
    grid-column:1 / 2;
    grid-row:2;
    min-width:0;
    width:auto;
    padding-top:0;
    border-top:0;
    gap:12px;
    overflow:hidden;
    white-space:nowrap;
  }

  .terminal-status > span + span,
  .terminal-status > time{
    padding-left:0;
    border-left:0;
  }

  .terminal-status > span:not(.terminal-ok),
  .terminal-status .product-user{
    display:none;
  }

  .terminal-refresh{
    grid-column:2 / 3;
    grid-row:2;
    justify-self:end;
    margin-left:0;
  }

  .container,
  .footer{
    max-width:calc(100vw - 24px);
  }

  .page-head,
  .dash-page-head{
    padding-bottom:12px;
  }

  .dash-page-actions{
    display:grid;
    grid-template-columns:minmax(0,1fr) 42px;
    gap:8px;
  }

  .dash-sync-state{
    grid-column:1 / -1;
    width:max-content;
    max-width:100%;
  }

  .dash-page-actions > .btn.primary,
  .dash-page-actions > .btn:not(.ghost):not(.secondary):not(.danger):not(.bad){
    grid-column:1 / 2;
    width:100%;
    min-height:42px;
  }

  .dash-more-actions{
    grid-column:2 / 3;
  }

  .dash-more-actions > summary{
    width:42px;
    min-width:42px;
    height:42px;
    min-height:42px;
  }

  .dash-status-strip{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .dash-status-cell{
    min-height:96px;
    padding:12px;
  }

  .dash-status-cell dt,
  .dash-status-cell p{
    font-size:11px;
    line-height:15px;
  }

  .dash-status-cell dd{
    margin-top:8px;
    font-size:24px;
    line-height:30px;
  }

  .dashboard-toolbar,
  .toolbar-panel.dashboard-toolbar{
    position:static;
  }

  .dashboard-empty,
  .dashboard-empty-node,
  .wm-fav-empty,
  .empty-state.compact{
    min-height:112px;
    padding:16px;
  }

  .confirm-modal-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .modal-head .btn.xs.ghost,
  .modal-inner > .row:first-child .col.right .btn.xs.ghost,
  .modal-inner > .row:first-child .right .btn.xs.ghost{
    width:38px;
    min-width:38px;
    height:38px;
    min-height:38px;
  }

  .task-list-table-wrap,
  .task-exec-table-wrap,
  .site-cert-table-wrap{
    overflow:visible;
    border:0;
    background:transparent;
  }

  .task-list-table,
  .task-exec-table,
  .site-cert-table{
    display:block;
    min-width:0;
    border-spacing:0;
  }

  .task-list-table thead,
  .task-exec-table thead,
  .site-cert-table thead{
    display:none;
  }

  .task-list-table tbody,
  .task-exec-table tbody,
  .site-cert-table tbody{
    display:grid;
    gap:10px;
  }

  .task-list-table tr[data-task-row],
  .task-exec-table tr[data-execution-id],
  .site-cert-table tbody tr{
    display:grid;
    gap:8px;
    padding:12px;
    border:1px solid var(--ui-line);
    border-radius:10px;
    background:var(--ui-surface);
    box-shadow:var(--ui-shadow-soft);
  }

  .task-list-table tr.is-hidden,
  .task-exec-table tr.is-hidden{
    display:none;
  }

  .task-list-table td,
  .task-exec-table td,
  .site-cert-table td{
    display:grid;
    grid-template-columns:minmax(84px,.38fr) minmax(0,1fr);
    gap:8px;
    width:auto;
    min-width:0;
    padding:0;
    border:0;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .task-list-table td::before,
  .task-exec-table td::before,
  .site-cert-table td::before{
    content:attr(data-label);
    color:var(--ui-text-muted);
    font-size:12px;
    line-height:20px;
    font-weight:650;
  }

  .task-list-table .task-primary-cell,
  .task-exec-table td:first-child{
    grid-template-columns:minmax(0,1fr);
    gap:4px;
  }

  .task-list-table .task-primary-cell::before,
  .task-exec-table td:first-child::before{
    display:none;
  }

  .task-actions-cell{
    display:block !important;
    padding-top:4px !important;
  }

  .task-actions-cell::before{
    display:none;
  }

  .task-row-actions,
  .task-exec-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    justify-content:stretch;
    gap:8px;
    width:100%;
  }

  .task-row-actions > .btn,
  .task-row-actions > a.btn,
  .task-exec-actions > .btn{
    width:100%;
    min-height:36px;
  }

  .task-summary-cell .meta{
    display:grid;
    gap:4px;
  }

  .task-summary-cell .meta-item{
    min-width:0;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .task-exec-empty-row{
    display:block;
  }

  .task-exec-empty-row td{
    display:block;
  }

  .task-exec-empty-row td::before{
    display:none;
  }
}

@media (max-width:380px){
  .dash-status-strip{
    grid-template-columns:minmax(0,1fr);
  }
}

@media (max-width:390px){
  body.netmon-wall .netmon-wall-right{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    align-items:stretch;
    width:100%;
    gap:8px;
  }

  body.netmon-wall .netmon-wall-right > *,
  body.netmon-wall .netmon-wall-ctrl,
  body.netmon-wall .netmon-wall-ctrl input,
  body.netmon-wall .netmon-wall-ctrl select{
    min-width:0 !important;
    width:100% !important;
    max-width:100%;
  }

  body.netmon-wall #netmonRefreshBtn,
  body.netmon-wall #netmonWallFullscreen,
  body.netmon-wall .netmon-wall-right a.btn.secondary{
    width:100%;
  }
}

.product-input-modal{
  z-index:9998;
}

.product-input-modal-inner{
  display:flex;
  flex-direction:column;
  max-height:min(520px, calc(100vh - 32px));
  max-height:min(520px, calc(100dvh - 32px));
  overflow:hidden;
}

.product-input-modal-message{
  max-width:48ch;
  margin-top:4px;
  line-height:18px;
}

.product-input-form{
  display:grid;
  gap:10px;
}

.product-input-form .input,
.product-input-form .textarea{
  width:100%;
}

.product-input-form .textarea{
  min-height:118px;
  resize:vertical;
}

.product-input-error{
  min-height:18px;
  padding:8px 10px;
  border:1px solid color-mix(in srgb, var(--ui-danger) 34%, var(--ui-line));
  border-radius:8px;
  background:var(--ui-danger-bg);
  color:var(--ui-danger);
  font-size:12px;
  line-height:18px;
}

.product-input-error.is-hidden{
  display:none;
}

.product-input-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

@media (max-width:560px){
  .product-input-modal{
    padding:10px;
  }

  .product-input-modal-inner{
    width:100%;
    max-height:calc(100dvh - 20px);
  }

  .product-input-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .product-input-actions > .btn{
    width:100%;
  }
}

.modal.netmon-ab-modal{
  z-index:9999;
  align-items:stretch;
  padding:12px;
  overflow:hidden;
}

.netmon-ab-inner{
  display:flex;
  flex-direction:column;
  width:min(1120px, calc(100vw - 24px));
  max-width:1120px;
  height:calc(100vh - 24px);
  height:calc(100dvh - 24px);
  max-height:none;
  padding:14px;
  overflow:hidden;
}

.netmon-ab-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

.netmon-ab-title-wrap{
  min-width:0;
}

.netmon-ab-title-target{
  max-width:min(760px, 70vw);
  margin-top:4px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.netmon-ab-head-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.netmon-ab-summary{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.netmon-ab-body{
  display:grid;
  grid-template-columns:minmax(320px, 420px) minmax(0, 1fr);
  flex:1;
  min-height:0;
  gap:12px;
  align-items:stretch;
}

.netmon-ab-list,
.netmon-ab-detail{
  min-height:0;
  border:1px solid var(--ui-line);
  border-radius:12px;
  background:var(--ui-surface-muted);
  box-shadow:var(--ui-shadow-soft);
}

.netmon-ab-list{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.netmon-ab-tools{
  display:flex;
  gap:8px;
  padding:10px;
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface);
}

.netmon-ab-tools .input.sm{
  flex:1;
  min-width:0;
  height:32px;
}

.netmon-ab-tools .select.sm{
  width:124px;
  max-width:38%;
  height:32px;
}

.netmon-ab-listbox{
  flex:1;
  min-height:0;
  overflow:auto;
}

.netmon-ab-listbox:focus-visible{
  outline:0;
  box-shadow:inset 0 0 0 3px var(--ui-focus);
}

.netmon-ab-row{
  display:grid;
  grid-template-columns:56px minmax(96px, 1.2fr) 64px minmax(0, 1fr);
  gap:10px;
  align-items:center;
  width:100%;
  padding:8px 10px;
  border-bottom:1px solid var(--ui-line);
  color:var(--ui-text);
  cursor:pointer;
  user-select:none;
}

.netmon-ab-row:last-child{
  border-bottom:0;
}

.netmon-ab-row:hover{
  background:var(--ui-brand-bg);
}

.netmon-ab-row:focus-visible{
  outline:0;
  box-shadow:inset 0 0 0 3px var(--ui-focus);
}

.netmon-ab-row.sel,
.netmon-ab-row[aria-selected="true"]{
  border-left:3px solid var(--ui-brand);
  padding-left:7px;
  background:var(--ui-brand-bg-strong);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ui-brand) 30%, var(--ui-line));
}

.netmon-ab-row .lv{
  font-weight:800;
  letter-spacing:0;
}

.netmon-ab-row .lv.crit{
  color:var(--ui-danger);
}

.netmon-ab-row .lv.warn{
  color:var(--ui-warning);
}

.netmon-ab-row .time,
.netmon-ab-row .meta{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.netmon-ab-detail{
  padding:10px;
  overflow:auto;
}

.netmon-ab-detail-title{
  margin-bottom:8px;
  color:var(--ui-text);
  font-size:12px;
  line-height:18px;
  font-weight:800;
}

.netmon-ab-node-col{
  width:240px;
}

.netmon-ab-empty{
  padding:12px;
}

@media (max-width:900px){
  .netmon-ab-body{
    grid-template-columns:minmax(0, 1fr);
    grid-template-rows:minmax(190px, .9fr) minmax(220px, 1.1fr);
  }

  .netmon-ab-row{
    grid-template-columns:56px minmax(0, 1fr) 64px;
  }

  .netmon-ab-row .meta{
    display:none;
  }
}

@media (max-width:720px){
  .modal.netmon-ab-modal{
    padding:0;
  }

  .netmon-ab-inner{
    width:100vw;
    height:100vh;
    height:100dvh;
    border-radius:16px 16px 0 0;
  }

  .netmon-ab-title-target{
    max-width:calc(100vw - 112px);
  }

  .netmon-ab-tablewrap{
    overflow:visible;
    border:0;
    background:transparent;
    box-shadow:none;
  }

  .netmon-ab-table,
  .netmon-ab-table tbody,
  .netmon-ab-table tr,
  .netmon-ab-table td{
    display:block;
    width:100%;
  }

  .netmon-ab-table thead{
    display:none;
  }

  .netmon-ab-table tbody tr{
    margin-bottom:8px;
    padding:8px 10px;
    border:1px solid var(--ui-line);
    border-radius:10px;
    background:var(--ui-surface);
  }

  .netmon-ab-table tbody tr:last-child{
    margin-bottom:0;
  }

  .netmon-ab-table tbody td{
    display:grid;
    grid-template-columns:minmax(72px, 34%) minmax(0, 1fr);
    gap:10px;
    align-items:center;
    padding:6px 0;
    border-bottom:1px solid var(--ui-line);
    white-space:normal;
  }

  .netmon-ab-table tbody td:last-child,
  .netmon-ab-table tbody td[colspan]{
    border-bottom:0;
  }

  .netmon-ab-table tbody td::before{
    content:attr(data-label);
    color:var(--ui-text-muted);
    font-size:11px;
    line-height:14px;
    font-weight:800;
  }

  .netmon-ab-table tbody td[colspan]::before{
    display:none;
    content:"";
  }

  .netmon-ab-table tbody tr:hover td{
    background:transparent;
  }
}

.rule-owner-panel{
  margin:8px 0 10px;
  padding:10px;
  border:1px solid var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface-muted);
  box-shadow:var(--ui-shadow-soft);
}

.rule-owner-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}

.rule-owner-title{
  color:var(--ui-text);
  font-size:12px;
  line-height:18px;
  font-weight:760;
}

.rule-owner-summary{
  flex:0 0 auto;
  font-variant-numeric:tabular-nums;
}

.rule-owner-chips{
  display:flex;
  gap:8px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  padding-bottom:2px;
  scrollbar-width:thin;
}

.rule-owner-chip{
  appearance:none;
  flex:0 0 auto;
  min-width:136px;
  max-width:220px;
  min-height:54px;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  grid-template-rows:auto auto;
  gap:2px 8px;
  align-items:center;
  padding:8px 10px;
  border:1px solid var(--ui-line);
  border-radius:9px;
  color:var(--ui-text);
  background:var(--ui-surface);
  text-align:left;
  cursor:pointer;
}

.rule-owner-chip:hover{
  border-color:var(--ui-line-strong);
  background:var(--ui-surface-raised);
}

.rule-owner-chip:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px var(--ui-focus);
}

.rule-owner-chip.active,
.rule-owner-chip[aria-pressed="true"]{
  border-color:color-mix(in srgb, var(--ui-brand) 42%, var(--ui-line));
  background:var(--ui-brand-bg);
  box-shadow:inset 0 -2px 0 color-mix(in srgb, var(--ui-brand) 52%, transparent);
}

.rule-owner-chip-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  line-height:17px;
  font-weight:740;
}

.rule-owner-chip strong{
  justify-self:end;
  font-size:14px;
  line-height:18px;
  font-weight:800;
  font-variant-numeric:tabular-nums;
}

.rule-owner-chip-sub{
  grid-column:1 / -1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:15px;
}

.rules-grid.has-owner-sections{
  gap:12px;
}

.rule-owner-section{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  padding:9px 10px;
  border:1px solid var(--ui-line);
  border-radius:10px;
  background:var(--ui-surface-muted);
}

.rule-owner-section-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
}

.rule-owner-avatar{
  flex:0 0 auto;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid color-mix(in srgb, var(--ui-brand) 32%, var(--ui-line));
  border-radius:8px;
  color:var(--ui-brand);
  background:var(--ui-brand-bg);
  font-size:12px;
  font-weight:800;
}

.rule-owner-section-text{
  min-width:0;
}

.rule-owner-section-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ui-text);
  font-size:13px;
  line-height:18px;
  font-weight:780;
}

.rule-owner-section-sub{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ui-text-muted);
  font-size:11px;
  line-height:15px;
}

.rule-owner-section-stats{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}

.rule-owner-pill{
  max-width:190px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.rule-owner-pill.unknown{
  color:var(--ui-warning);
  border-color:color-mix(in srgb, var(--ui-warning) 32%, var(--ui-line));
  background:var(--ui-warning-bg);
}

.rule-topline .rule-owner-pill{
  min-width:0;
}

@media (max-width:760px){
  .rule-owner-panel{
    padding:9px;
  }

  .rule-owner-panel-head,
  .rule-owner-section{
    align-items:stretch;
    flex-direction:column;
  }

  .rule-owner-summary,
  .rule-owner-section-stats{
    justify-content:flex-start;
  }

  .rule-owner-chip{
    min-width:148px;
  }

  .rule-owner-pill{
    max-width:100%;
  }
}

/* Tunnel group mobile table contracts: keep dense desktop tables, but make narrow views self-labeled. */
@media (max-width:760px){
  .tg-member-editor-table,
  .tg-refs-table,
  .tg-rule-member-table{
    min-width:0;
  }

  .tg-member-editor-table thead,
  .tg-refs-table thead,
  .tg-rule-member-table thead{
    display:none;
  }

  .tg-member-editor-table tbody,
  .tg-refs-table tbody,
  .tg-rule-member-table tbody{
    display:block;
    padding:8px;
  }

  .tg-member-editor-table tbody tr,
  .tg-refs-table tbody tr,
  .tg-rule-member-table tbody tr{
    display:block;
    padding:10px;
    border:1px solid var(--ui-line);
    border-radius:10px;
    background:var(--ui-surface);
  }

  .tg-member-editor-table tbody tr + tr,
  .tg-refs-table tbody tr + tr,
  .tg-rule-member-table tbody tr + tr{
    margin-top:8px;
  }

  .tg-member-editor-table tbody td,
  .tg-refs-table tbody td,
  .tg-rule-member-table tbody td{
    display:grid;
    grid-template-columns:92px minmax(0, 1fr);
    gap:10px;
    align-items:start;
    max-width:none;
    padding:7px 0;
    border-bottom:1px dashed var(--ui-line);
    white-space:normal;
  }

  .tg-member-editor-table tbody td:last-child,
  .tg-refs-table tbody td:last-child,
  .tg-rule-member-table tbody td:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .tg-member-editor-table tbody td::before,
  .tg-refs-table tbody td::before,
  .tg-rule-member-table tbody td::before{
    content:attr(data-label);
    color:var(--ui-text-muted);
    font-size:11px;
    line-height:1.45;
    padding-top:2px;
  }

  .tg-member-editor-table tbody td[colspan],
  .tg-refs-table tbody td[colspan],
  .tg-rule-member-table tbody td[colspan]{
    display:block;
    text-align:center;
    border-bottom:none;
  }

  .tg-member-editor-table tbody td[colspan]::before,
  .tg-refs-table tbody td[colspan]::before,
  .tg-rule-member-table tbody td[colspan]::before{
    content:none;
  }

  .tg-rule-member-table-scroll{
    overflow:visible;
    border:none;
    background:transparent;
  }

  .tg-rule-member-table tbody td.name{
    white-space:normal;
  }
}

/* Route trace mobile table contract: keep all diagnostic columns visible on narrow screens. */
@media (max-width:760px){
  .trace-route-table-wrap{
    overflow:visible;
    border:none;
    background:transparent;
  }

  .trace-route-table{
    display:block;
    width:100%;
    min-width:0;
  }

  .trace-route-table thead{
    display:none;
  }

  .trace-route-table tbody{
    display:block;
    padding:8px;
  }

  .trace-route-table tbody tr{
    display:block;
    padding:10px;
    border:1px solid var(--ui-line);
    border-radius:10px;
    background:var(--ui-surface);
  }

  .trace-route-table tbody tr + tr{
    margin-top:8px;
  }

  .trace-route-table tbody td,
  .trace-route-table tbody td:nth-child(2),
  .trace-route-table tbody td:nth-child(3),
  .trace-route-table tbody td:nth-child(8){
    display:grid;
    grid-template-columns:92px minmax(0, 1fr);
    gap:10px;
    align-items:start;
    min-width:0;
    max-width:none;
    padding:7px 0;
    border-bottom:1px dashed var(--ui-line);
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }

  .trace-route-table tbody td:last-child{
    border-bottom:none;
    padding-bottom:0;
  }

  .trace-route-table tbody td::before{
    content:attr(data-label);
    color:var(--ui-text-muted);
    font-size:11px;
    line-height:1.45;
    padding-top:2px;
  }

  .trace-route-table tbody td[colspan]{
    display:block;
    text-align:center;
    border-bottom:none;
  }

  .trace-route-table tbody td[colspan]::before{
    content:none;
  }

  .trace-route-host,
  .trace-route-samples{
    max-width:100%;
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
  }
}

/* Coarse-pointer finish pass: keep dense desktop controls, but make touch views usable. */
@media (pointer:coarse), (max-width:720px){
  .btn,
  .btn.sm,
  .btn.xs,
  .chip,
  .log-toggle,
  .settings-nav-chip,
  .segmented button,
  .tab,
  .menu-item,
  .pagination a,
  .pagination button,
  .dash-search-clear,
  .rule-card .btn.xs,
  .rule-card .btn.icon,
  .rule-select,
  .page-remote-control .remote-shortcuts .btn{
    min-height:44px;
    touch-action:manipulation;
  }

  .btn.icon,
  .btn.icon.xs,
  .modal-head [data-modal-close].btn.xs.ghost,
  .modal-inner > .row:first-child .col.right .btn.xs.ghost,
  .modal-inner > .row:first-child .right .btn.xs.ghost{
    width:44px;
    min-width:44px;
    height:44px;
    min-height:44px;
  }

  .dash-filters,
  .log-toggle-group,
  .rs-toolbar .dash-filters,
  .wm-filter-row,
  .task-filter-bar,
  .task-inline-meta,
  .action-group,
  .rules-actions,
  .page-remote-control .remote-shortcuts{
    flex-wrap:wrap;
    overflow:visible;
    scrollbar-width:auto;
  }

  .dash-filters > *,
  .log-toggle-group > *,
  .rs-toolbar .dash-filters > *,
  .wm-filter-row > *,
  .task-filter-bar > *,
  .action-group > *,
  .rules-actions > *,
  .page-remote-control .remote-shortcuts > *{
    flex:0 1 auto;
  }

  .task-row-actions > .btn,
  .task-row-actions > a.btn,
  .task-exec-actions > .btn{
    min-height:44px;
  }

  .rule-select{
    width:44px;
    min-width:44px;
    height:44px;
  }

  .page-remote-control .remote-shortcuts .btn{
    flex:1 1 calc(25% - 8px);
  }
}

/* UI hardening pass: keep portaled menus and dialogs above sticky shells, and
   let narrow surfaces wrap locally instead of hiding overflow at body level. */
:root{
  --z-topbar:60;
  --z-menu-portal:70;
  --z-modal:100;
  --z-toast:110;
}

body{
  overflow-x:visible;
}

.topbar{
  z-index:var(--z-topbar);
}

.menu-portal{
  z-index:var(--z-menu-portal) !important;
}

.modal{
  z-index:var(--z-modal);
}

.rule-modal-inner{
  width:min(100%,960px);
  max-height:calc(100vh - 48px);
  max-height:min(920px,calc(100dvh - 48px));
}

.rule-modal-head{
  flex:0 0 auto;
}

.rule-modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.rule-modal-body > *{
  flex:0 0 auto;
}

.rule-modal-actions{
  flex:0 0 auto;
  margin:0;
  padding:12px 16px calc(12px + var(--safe-bottom));
  border-top:1px solid var(--ui-line);
  background:var(--ui-surface-pop,var(--ui-surface));
}

.modal .rule-modal-actions{
  position:static;
  bottom:auto;
  z-index:2;
}

.rule-modal .mode-switch{
  grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr));
}

.rule-modal .mode-card,
.rule-modal .form-section,
.rule-modal .advanced-details,
.rule-modal .adv-body,
.rule-modal .base-top-row > .col{
  min-width:0;
}

.rule-modal .base-top-row{
  flex-wrap:wrap;
}

.rule-modal .base-top-row > .col{
  flex:1 1 220px;
}

.rule-modal .base-top-row > .listen-col{
  flex-basis:260px;
}

.rule-modal .base-top-row > .peer-col{
  flex-basis:240px;
}

.rule-modal .adv-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));
}

@media (max-width:720px){
  .rule-modal-inner{
    width:100%;
    max-height:calc(100vh - 20px);
    max-height:calc(100dvh - 20px);
  }

  .rule-modal .mode-switch,
  .rule-modal .adv-grid{
    grid-template-columns:minmax(0,1fr);
  }

  .rule-modal-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    padding:12px 14px calc(12px + var(--safe-bottom));
  }

  .rule-modal-actions > .btn{
    width:100%;
    justify-content:center;
  }
}

.toast,
#toast,
#dcToast{
  z-index:var(--z-toast);
}

button.dash-group-name,
button.node-group-name{
  appearance:none;
  -webkit-appearance:none;
  max-width:100%;
  border:0;
  background:transparent;
  font:inherit;
  text-align:left;
}

.settings-bottom-pad{
  height:16px;
}

.settings-action-dock{
  position:static !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
  z-index:auto;
  width:min(var(--container, 1180px), calc(100vw - 48px)) !important;
  margin:16px auto 0;
  padding:0 !important;
  pointer-events:auto;
}

.settings-action-inner{
  width:100% !important;
  min-width:0 !important;
  max-width:none;
  border-radius:10px;
}

@media (max-width:760px){
  .settings-action-dock{
    width:calc(100vw - 24px) !important;
    margin-top:12px;
  }

  .settings-action-inner{
    flex-direction:column;
    align-items:stretch;
  }

  .settings-action-buttons,
  .settings-action-buttons .btn{
    width:100%;
  }
}

.dash-status-cell,
.dash-status-cell dd,
.dash-status-cell p,
.node-meta,
.table td,
.table th,
.um-table td,
.um-table th,
.dcv2-table td,
.dcv2-table th{
  min-width:0;
}

.dash-status-cell dd,
.dash-status-cell p,
.node-meta,
.table td,
.um-table td,
.dcv2-table td{
  overflow-wrap:anywhere;
}

@media (max-width:1120px){
  .dash-filters,
  .rs-toolbar .dash-filters,
  .wm-filter-row,
  .task-filter-bar{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
}

@media (max-width:760px){
  .table-wrap,
  .table-shell{
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .table td,
  .table th,
  .um-table td,
  .um-table th,
  .dcv2-table td,
  .dcv2-table th{
    white-space:normal;
    overflow-wrap:anywhere;
  }
}

@media (max-width:760px){
  .oci-table{
    display:block;
    width:100%;
    min-width:0;
  }

  .oci-table thead{
    display:none;
  }

  .oci-table tbody{
    display:block;
  }

  .oci-table tbody tr{
    display:block;
    padding:10px;
    border:1px solid var(--ui-line);
    border-radius:10px;
    background:var(--ui-surface);
  }

  .oci-table tbody tr + tr{
    margin-top:8px;
  }

  .oci-table tbody td{
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    gap:10px;
    align-items:start;
    max-width:none;
    padding:7px 0;
    border-bottom:1px dashed var(--ui-line);
    white-space:normal;
  }

  .oci-table tbody td:last-child{
    border-bottom:none;
  }

  .oci-table tbody td::before{
    content:attr(data-label);
    color:var(--ui-text-muted);
    font-size:11px;
    line-height:1.45;
    padding-top:2px;
  }

  .oci-table tbody td[colspan]{
    display:block;
    text-align:center;
  }

  .oci-table tbody td[colspan]::before{
    content:none;
  }

  .oci-actions,
  .oci-compact-form{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    width:100%;
  }

  .oci-actions > *,
  .oci-compact-form > *,
  .oci-compact-form .input,
  .oci-compact-form .select,
  .oci-compact-form .name-input,
  .oci-compact-form .num-input,
  .oci-attach-select{
    width:100%;
    max-width:none;
    min-width:0;
  }
}

/* Final modal contract: legacy dialogs keep actions in normal flow.
   Sticky action rows inside scrollable forms were covering later fields on
   node/websites/netmon dialogs, and could collapse open details on mobile. */
.modal-inner:not(.rule-modal-inner){
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.modal-inner:not(.rule-modal-inner) > .modal-head,
.modal-inner:not(.rule-modal-inner) > .row:first-child{
  flex:0 0 auto;
}

.modal-inner:not(.rule-modal-inner) > .modal-body,
.modal-inner:not(.rule-modal-inner) > .form,
.modal-inner:not(.rule-modal-inner) > form,
.modal-inner:not(.rule-modal-inner) > .mt-10,
.modal-inner:not(.rule-modal-inner) > .table-wrap{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
}

.modal-inner:not(.rule-modal-inner) > .form,
.modal-inner:not(.rule-modal-inner) > form,
.modal .modal-body > .form{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.modal-inner:not(.rule-modal-inner) > .form > *,
.modal-inner:not(.rule-modal-inner) > form > *,
.modal .modal-body > .form > *,
.modal .modal-body > *{
  flex:0 0 auto;
  min-width:0;
}

.modal .row-end,
.modal .row-end-sm,
.modal .row-end-12,
.modal .dcv2-modal-actions,
.modal .rs-form-modal-foot,
.modal .wm-create-actions{
  position:static;
  bottom:auto;
  z-index:auto;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--ui-line);
  background:var(--ui-surface);
}

.modal .advanced-details,
.modal details.advanced-details{
  flex:0 0 auto;
  min-height:auto;
}

@media (max-width:720px){
  .modal-inner:not(.rule-modal-inner) > .form,
  .modal-inner:not(.rule-modal-inner) > form,
  .modal .modal-body > .form{
    gap:12px;
  }

  .modal .row-end,
  .modal .row-end-sm,
  .modal .row-end-12,
  .modal .dcv2-modal-actions,
  .modal .rs-form-modal-foot,
  .modal .wm-create-actions{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:10px;
    padding-top:12px;
  }
}

/* Final overflow contract: shared shells must absorb long OCI/resource names
   locally instead of letting min-content widths push outside card borders. */
html,
body{
  max-width:100%;
  overflow-x:clip;
}

.terminal-ribbon.product-ribbon,
.terminal-command,
.terminal-status,
.product-ribbon-main,
.product-ribbon-copy,
.container,
.footer,
.app-shell,
.page-shell,
.app-body,
.page-frame,
.app-content,
.page-content,
.page-head,
.dash-page-head,
.card,
.page-section-shell:not(.dashboard-content-shell),
.settings-card,
.settings-side,
.um-table-card,
.wm-card,
.wm-fav-card,
.rs-list-card,
.toolbar-panel,
.dashboard-toolbar,
.wm-toolbar,
.settings-toolbar,
.rs-toolbar,
.log-filter-bar,
.audit-toolbar,
.um-table-toolbar,
.sites-toolbar,
.fm-toolbar,
.table-wrap,
.table-shell{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

.container,
.footer{
  width:100%;
  max-width:min(var(--container-max), calc(100vw - 48px));
  margin-left:auto;
  margin-right:auto;
}

@media (max-width:760px){
  .container,
  .footer{
    max-width:calc(100vw - 24px);
  }
}

.terminal-ribbon.product-ribbon > *,
.terminal-command > *,
.terminal-status > *,
.product-ribbon-main > *,
.product-ribbon-copy > *{
  min-width:0;
  max-width:100%;
}

.product-user,
.terminal-command-text{
  min-width:0;
  max-width:min(100%, 36ch);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.page-head > *,
.dash-page-head > *,
.card > *,
.page-section-shell:not(.dashboard-content-shell) > *,
.card-header > *,
.page-section-head > *,
.toolbar-panel > *,
.dashboard-toolbar > *,
.wm-toolbar > *,
.settings-toolbar > *,
.rs-toolbar > *,
.log-filter-bar > *,
.audit-toolbar > *,
.um-table-toolbar > *,
.sites-toolbar > *,
.fm-toolbar > *,
.form-grid > *,
.settings-field-grid > *,
.wm-create-grid > *,
.rs-form-grid > *,
.oci-form-grid > *,
.oci-template-grid > *,
.oci-hook-grid > *,
.oci-overview > *,
.oci-split > *,
.oci-storage-secondary > *{
  min-width:0;
  max-width:100%;
}

.page-title,
.dash-page-title,
.card-title,
.card-sub,
.section-title,
.section-sub,
.panel-title,
.panel-sub,
.meta,
.meta-item,
.help,
.label,
.mono,
.empty-state-title,
.empty-state-sub,
.table td,
.table th,
.um-table td,
.um-table th,
.dcv2-table td,
.dcv2-table th{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

.btn:not(.icon),
.pill,
.chip,
.tab,
.settings-nav-chip,
.segmented button,
.menu-item{
  min-width:0;
  max-width:100%;
}

.btn:not(.icon),
.menu-item{
  white-space:normal;
  overflow-wrap:anywhere;
}

.pill,
.chip,
.tab,
.settings-nav-chip,
.segmented button{
  overflow:hidden;
  text-overflow:ellipsis;
}

.table,
.um-table,
.dcv2-table{
  max-width:100%;
}

.table td > *,
.table th > *,
.um-table td > *,
.um-table th > *,
.dcv2-table td > *,
.dcv2-table th > *{
  min-width:0;
  max-width:100%;
}

.table thead th,
.um-table thead th,
.dcv2-table thead th{
  white-space:normal;
}

.input,
.select,
textarea,
.textarea,
select{
  min-width:0;
  max-width:100%;
}

.page-oracle .oci-shell,
.page-oracle .oci-workbench,
.page-oracle .oci-workspace,
.page-oracle .oci-pane,
.page-oracle .oci-pane-head,
.page-oracle .oci-context-bar,
.page-oracle .oci-context-copy,
.page-oracle .oci-rail-head,
.page-oracle .oci-card-head,
.page-oracle .oci-card-copy,
.page-oracle .oci-card-actions,
.page-oracle .oci-editor,
.page-oracle .oci-details,
.page-oracle .oci-config-actions,
.page-oracle .oci-hook-stack,
.page-oracle .oci-render-section,
.page-oracle .oci-precheck-result,
.page-oracle .oci-job-detail,
.page-oracle .oci-network-assets-panel,
.page-oracle .oci-resource-selector,
.page-oracle .oci-resource-grid,
.page-oracle .oci-resource-option,
.page-oracle .oci-resource-meta,
.page-oracle .oci-resource-tags,
.page-oracle .oci-result-meta,
.page-oracle .oci-detail-drawer,
.page-oracle .oci-drawer-head,
.page-oracle .oci-drawer-body,
.page-oracle .oci-drawer-grid,
.page-oracle .oci-drawer-footer{
  min-width:0;
  max-width:100%;
}

.page-oracle .oci-rail-head{
  flex-wrap:wrap;
  align-items:flex-start;
}

.page-oracle .oci-rail-head > *{
  min-width:0;
  max-width:100%;
}

.page-oracle .oci-rail-head > :first-child{
  flex:1 1 140px;
}

.page-oracle .oci-rail-title,
.page-oracle .oci-rail-sub{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

.page-oracle .oci-details > summary{
  min-width:0;
  max-width:100%;
  overflow:hidden;
}

.page-oracle .oci-details > summary > span{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

.page-oracle .oci-details > summary > .pill{
  flex:0 1 auto;
}

.page-oracle .oci-resource-meta > *,
.page-oracle .oci-resource-tags > *,
.page-oracle .oci-result-meta > *,
.page-oracle .oci-inline-chips > *{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

.page-oracle .oci-render-section > *,
.page-oracle .oci-job-detail > *,
.page-oracle .oci-precheck-result > *,
.page-oracle .oci-network-assets-panel > *,
.page-oracle .oci-inline-chips,
.page-oracle .oci-result-meta{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

.page-oracle .oci-inline-chips{
  overflow:hidden;
  align-items:flex-start;
}

.page-oracle .oci-inline-chips > .pill,
.page-oracle .oci-result-meta > .pill{
  flex:0 1 auto;
  white-space:normal;
  overflow-wrap:anywhere;
}

.page-oracle .oci-card-actions > .pill,
.page-oracle .oci-pane-meta > .pill,
.page-oracle .oci-details > summary > .pill,
.page-oracle .oci-editor > summary > .pill,
.page-oracle .oci-table .pill,
.page-oracle .empty-state-title > .pill{
  white-space:normal;
  overflow-wrap:anywhere;
}

.page-oracle .oci-drawer-head > :first-child{
  min-width:0;
  max-width:100%;
  flex:1 1 auto;
}

.page-oracle .oci-drawer-title,
.page-oracle .oci-drawer-subtitle{
  min-width:0;
  max-width:100%;
}

.page-oracle .oci-drawer-subtitle{
  overflow-wrap:anywhere;
}

.page-oracle .oci-split{
  grid-template-columns:minmax(0,1.1fr) minmax(min(320px,100%),.72fr);
}

.page-oracle .oci-storage-secondary{
  grid-template-columns:minmax(min(320px,100%),.72fr) minmax(0,1fr);
}

@media (max-width:900px){
  .page-oracle .oci-split,
  .page-oracle .oci-split.equal,
  .page-oracle .oci-storage-secondary,
  .page-oracle .oci-form-grid,
  .page-oracle .oci-template-grid,
  .page-oracle .oci-hook-grid{
    grid-template-columns:minmax(0,1fr);
  }

  .page-oracle .oci-rail{
    overflow:visible;
  }

  .page-oracle .oci-rail-list{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));
    overflow:visible;
    padding-bottom:0;
  }

  .page-oracle .oci-rail-tab{
    width:100%;
    flex:1 1 auto;
  }
}

.page-oracle .oci-table{
  max-width:100%;
  table-layout:fixed;
}

.page-oracle .oci-network-table,
.page-oracle .oci-security-table,
.page-oracle .oci-object-storage-table,
.page-oracle .oci-audit-table{
  width:100%;
  min-width:0;
  max-width:100%;
  table-layout:fixed;
}

.page-oracle .oci-table td,
.page-oracle .oci-table th{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

.page-oracle .oci-table td > *,
.page-oracle .oci-table th > *{
  min-width:0;
  max-width:100%;
}

.page-oracle .oci-table .mono,
.page-oracle .oci-table .meta,
.page-oracle .oci-primary-cell,
.page-oracle .oci-primary-cell > strong{
  overflow-wrap:anywhere;
  word-break:break-word;
}

.page-oracle .oci-primary-cell,
.page-oracle .oci-config-status,
.page-oracle .oci-compact-form > *,
.page-oracle .oci-compact-form .input,
.page-oracle .oci-compact-form .select,
.page-oracle .oci-compact-form .name-input,
.page-oracle .oci-compact-form .num-input,
.page-oracle .oci-attach-select{
  min-width:0;
  max-width:100%;
}

.page-oracle .oci-ocid,
.page-oracle .oci-object-path,
.page-oracle .oci-audit-detail{
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.page-oracle .oci-details pre,
.page-oracle .oci-job-detail pre,
.page-oracle .oci-precheck-result pre{
  min-width:0;
  max-width:100%;
  overflow:auto;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.page-oracle .oci-job-timeline p.oci-dynamic-long{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:4;
}

.page-oracle .oci-job-detail .card-title{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.page-oracle .oci-job-detail .card-sub > .pill{
  white-space:normal;
  overflow-wrap:anywhere;
}

@media (max-width:760px){
  .page-oracle .oci-rail{
    overflow:visible;
  }

  .page-oracle .oci-rail-list{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));
    overflow:visible;
  }

  .page-oracle .oci-rail-tab{
    width:100%;
    flex:1 1 auto;
  }

  .page-oracle .oci-table,
  .page-oracle .oci-table tbody,
  .page-oracle .oci-table tr,
  .page-oracle .oci-table td{
    min-width:0;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    overflow:hidden;
  }

  .page-oracle .oci-table tbody td{
    grid-template-columns:minmax(82px,.34fr) minmax(0,1fr);
  }

  .page-oracle .oci-ocid:not(td):not(th),
  .page-oracle .oci-object-path,
  .page-oracle .oci-audit-detail,
  .page-oracle .oci-kv-row dd.oci-dynamic-long{
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
  }

  .page-oracle .oci-nowrap{
    white-space:normal;
    overflow-wrap:anywhere;
  }
}

/* Layout rescue pass for dense resource cards and long config labels. */
button.dash-group-name,
button.node-group-name{
  max-width:min(420px, 52vw);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.rs-item-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--s-3);
  min-width:0;
}

.rs-item-main{
  flex:1 1 auto;
  min-width:0;
  display:grid;
  gap:var(--s-1);
}

.rs-title-line{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--s-1);
  min-width:0;
}

.rs-name,
.rs-endpoint{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.rs-name{
  color:var(--ui-text);
  font-size:var(--fs-sm);
  line-height:var(--lh-sm);
  font-weight:var(--fw-semibold);
}

.rs-endpoint{
  color:var(--ui-text-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
}

.rs-item-badges{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:var(--s-1);
  min-width:0;
}

.rs-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(min(260px,100%),360px);
  gap:var(--s-3);
  align-items:start;
  min-width:0;
  margin-top:var(--s-3);
}

.rs-main,
.rs-side,
.rs-meta-grid{
  display:grid;
  gap:var(--s-2);
  min-width:0;
}

.rs-meta-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));
}

.rs-meta-row{
  display:grid;
  grid-template-columns:minmax(0,clamp(72px,32%,160px)) minmax(0,1fr);
  gap:8px;
  align-items:start;
  min-width:0;
  max-width:100%;
}

.rs-meta-k{
  min-width:0;
  color:var(--ui-text-muted);
  font-size:var(--fs-xs);
  line-height:var(--lh-xs);
  font-weight:var(--fw-semibold);
}

.rs-meta-v,
.rs-note{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.rs-meta-v{
  color:var(--ui-text);
  font-size:var(--fs-sm);
  line-height:1.45;
}

.rs-note{
  color:var(--ui-text-muted);
  font-size:var(--fs-xs);
  line-height:1.45;
}

@media (max-width:960px){
  .rs-body{
    grid-template-columns:minmax(0,1fr);
  }
}

@media (max-width:560px){
  .rs-item-top{
    flex-direction:column;
  }

  .rs-item-badges{
    justify-content:flex-start;
  }

  .rs-meta-row{
    grid-template-columns:minmax(0,1fr);
  }

  .rs-name,
  .rs-endpoint{
    white-space:normal;
  }
}

/* Cross-page dense resource overflow fixes discovered by long-name audits. */
@media (max-width:720px){
  .node-grid.view-compact .node-tile,
  .node-grid.view-table .node-tile{
    grid-template-columns:minmax(0,1fr);
  }

  .node-grid.view-table .node-bars{
    grid-template-columns:minmax(0,1fr);
  }

  .node-grid.view-table .node-meta{
    justify-content:flex-start;
  }
}

.rs-item{
  container-type:inline-size;
}

@container (max-width:640px){
  .rs-body{
    grid-template-columns:minmax(0,1fr);
  }

  .rs-meta-grid{
    grid-template-columns:minmax(0,1fr);
  }

  .rs-meta-row{
    grid-template-columns:minmax(0,1fr);
  }

  .rs-side{
    grid-template-columns:minmax(0,1fr);
  }

  .rs-action-row{
    justify-content:flex-start;
  }

  .rs-action-row form,
  .rs-action-row .btn{
    flex:1 1 auto;
    min-width:0;
  }

  .rs-action-row form .btn{
    width:100%;
  }
}

.rule-actions{
  flex-wrap:wrap;
  min-width:0;
}

.rule-actions > *{
  min-width:0;
}

@media (pointer:coarse), (max-width:720px){
  .rule-actions{
    justify-content:flex-start;
  }

  .rule-actions .btn:not(.icon){
    flex:1 1 auto;
  }
}

.summary-pill{
  min-width:0;
  max-width:100%;
  flex-wrap:wrap;
  overflow-wrap:anywhere;
}

.summary-pill strong,
.summary-pill .muted{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}

.dash-view-tools{
  min-width:0;
  max-width:100%;
}

.dash-tool-menu{
  flex:0 0 30px;
  width:30px;
  min-width:30px;
  max-width:30px;
  overflow:visible;
}

.dash-tool-menu > summary.btn.icon{
  width:30px;
  min-width:30px;
  max-width:30px;
}

@media (max-width:720px){
  .dash-tool-menu{
    width:38px;
    min-width:38px;
    max-width:38px;
  }

  .dash-tool-menu > summary.btn.icon{
    width:38px;
    min-width:38px;
    max-width:38px;
  }
}
