@font-face{
  font-family:Inter;
  src:url("/assets/fonts/InterVariable.woff2") format("woff2");
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
@font-face{
  font-family:Inter;
  src:url("/assets/fonts/InterVariable-Italic.woff2") format("woff2");
  font-style:italic;
  font-weight:100 900;
  font-display:swap;
}

:root{
  color-scheme:light;
  --blue:#216fed;
  --blue2:#175cc8;
  --blue-soft:#edf4ff;
  --blue-line:#c9dcfb;
  --line:#dfe5ec;
  --line-strong:#cbd5e1;
  --muted:#64748b;
  --muted2:#94a3b8;
  --green:#07875f;
  --green-bg:#eaf8f2;
  --amber:#a55b09;
  --amber-bg:#fff7e8;
  --red:#b42318;
  --red-bg:#fff0ef;
  --surface:#fff;
  --surface-raised:#fff;
  --soft:#f7f9fc;
  --canvas:#f3f6fa;
  --text:#172033;
  --text-strong:#101828;
  --text-soft:#344054;
  --sidebar:#fff;
  --topbar:rgba(255,255,255,.96);
  --shadow:0 10px 28px rgba(15,23,42,.06);
  --shadow-float:0 18px 44px rgba(15,23,42,.16);
  font-family:Inter,"Segoe UI",Arial,sans-serif;
}

html[data-theme="dark"]{
  color-scheme:dark;
  --blue:#69a3ff;
  --blue2:#8bb7ff;
  --blue-soft:#172b49;
  --blue-line:#294c7d;
  --line:#2c3748;
  --line-strong:#3a485d;
  --muted:#a9b4c4;
  --muted2:#7f8ba0;
  --green:#45d6a3;
  --green-bg:#14372e;
  --amber:#f7b955;
  --amber-bg:#3b2c16;
  --red:#ff8b81;
  --red-bg:#42221f;
  --surface:#171d27;
  --surface-raised:#1b2330;
  --soft:#111722;
  --canvas:#0d121b;
  --text:#e7edf6;
  --text-strong:#f8fafc;
  --text-soft:#cad4e3;
  --sidebar:#111722;
  --topbar:rgba(17,23,34,.96);
  --shadow:0 10px 28px rgba(0,0,0,.22);
  --shadow-float:0 18px 44px rgba(0,0,0,.38);
}

html,body{background:var(--canvas);color:var(--text)}
body{font-family:Inter,"Segoe UI",Arial,sans-serif;overflow-x:hidden}
.hidden{display:none!important}
.brand-mark{display:none}
.brand-logo{width:40px;height:40px;display:block;flex:none}
.brand-copy b{color:var(--text-strong);font-size:14px;font-weight:760}
.brand-copy span{color:var(--muted2);font-size:9px;font-weight:700;letter-spacing:1.2px}
.internal-tag{
  margin-left:auto;
  height:21px;
  padding:0 7px;
  border:1px solid #f3d19b;
  background:var(--amber-bg);
  color:var(--amber);
  font-size:9px;
  letter-spacing:.5px;
}

.btn{
  border-color:var(--line);
  background:var(--surface-raised);
  color:var(--text-soft);
  box-shadow:0 1px 1px rgba(15,23,42,.02);
}
.btn:hover{background:var(--soft);border-color:var(--line-strong);color:var(--text-strong)}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.primary:hover{background:var(--blue2);border-color:var(--blue2)}
.btn.ghost{background:transparent;box-shadow:none}
.btn.danger{background:var(--surface-raised);color:var(--red);border-color:color-mix(in srgb,var(--red) 35%,var(--line))}
.btn.danger:hover{background:var(--red-bg)}
.input,.select,.textarea{
  border-color:var(--line-strong);
  background:var(--surface-raised);
  color:var(--text);
}
.input:focus,.select:focus,.textarea:focus{
  border-color:var(--blue);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 16%,transparent);
}
.field label{color:var(--text-soft)}
.check{color:var(--text-soft)}
.secret{background:var(--soft);border-color:var(--line);color:var(--text)}

/* Authentication */
.login{grid-template-columns:minmax(480px,1fr) minmax(420px,520px);background:var(--surface)}
.login-aside{
  position:relative;
  overflow:hidden;
  border-right:0;
  background:#112421;
  color:#fff;
  padding:44px 56px;
}
.login-aside:before{
  content:none;
}
.login-aside>*{position:relative}
.login-aside .brand-copy b{color:#fff}
.login-aside .brand-copy span{color:#a9c0bb}
.login-aside .internal-tag{border-color:#55736d;background:#203b36;color:#a9e8d4}
.login-context{max-width:620px}
.login-kicker{
  display:block;
  margin-bottom:15px;
  color:#83ddc3;
  font-size:11px;
  font-weight:800;
  letter-spacing:1.5px;
}
.login-context h1{max-width:590px;color:#fff;font-size:38px;line-height:1.17;font-weight:710}
.login-context p{max-width:580px;color:#bdcec9;font-size:14px;line-height:1.7}
.login-signals{color:#bed0cb;flex-wrap:wrap}
.login-main{background:var(--surface);padding:48px}
.login-form{width:min(100%,370px)}
.login-form h2{color:var(--text-strong);font-size:23px}
.login-form>p{color:var(--muted);line-height:1.5}
.login-form .input{height:42px}
.login-form .btn{height:42px}
.login-mobile-brand{display:none;align-items:center;gap:10px;margin-bottom:34px}
.login-note{border-color:var(--line);color:var(--muted)}

/* Main shell */
.shell{grid-template-columns:252px minmax(0,1fr);background:var(--canvas)}
.sidebar{
  position:sticky;
  top:0;
  height:100vh;
  min-height:0;
  overflow:hidden;
  padding:18px 13px 14px;
  background:var(--sidebar);
  border-color:var(--line);
  z-index:12;
  transition:width .18s ease,padding .18s ease;
}
.brand{height:50px;padding:1px 8px 10px;gap:10px}
.brand .brand-logo{width:38px;height:38px}
.nav{display:block;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:2px}
.nav-group{display:grid;gap:3px;margin-top:15px}
.nav-group:first-child{margin-top:8px}
.nav-label{
  display:block;
  height:24px;
  padding:5px 10px 4px;
  color:var(--muted2);
  font-size:9px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
  white-space:nowrap;
}
.nav-btn{
  position:relative;
  height:39px;
  color:var(--muted);
  font-size:12px;
  font-weight:620;
}
.nav-btn:hover{background:var(--soft);color:var(--text-strong)}
.nav-btn.active{
  background:var(--blue-soft);
  color:var(--blue);
}
.nav-btn.active:before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  width:3px;
  height:21px;
  border-radius:0 3px 3px 0;
  background:var(--blue);
}
.nav-count{background:var(--red-bg);color:var(--red)}
.side-bottom{border-color:var(--line)}
.user-mini{padding:3px}
.user-mini .avatar{background:var(--blue-soft);color:var(--blue)}
.user-mini b{color:var(--text-strong)}
.user-mini span{color:var(--muted)}

.main{min-width:0;min-height:100vh;background:var(--canvas)}
.topbar{
  height:66px;
  padding:0 22px;
  border-color:var(--line);
  background:var(--topbar);
  backdrop-filter:blur(10px);
  z-index:10;
}
.sidebar-toggle{display:none}
.topbar-context{display:grid;gap:2px;min-width:160px}
.topbar-context span{color:var(--muted2);font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:.7px}
.topbar-context b{color:var(--text-strong);font-size:13px;font-weight:700}
.environment{display:none}
.health-chip{
  border:1px solid color-mix(in srgb,var(--green) 25%,var(--line));
  background:var(--green-bg);
  color:var(--green);
}
.health-chip.warn{border-color:color-mix(in srgb,var(--amber) 32%,var(--line))}
.global-search{
  position:relative;
  width:min(330px,28vw);
  height:36px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 9px;
  border:1px solid var(--line);
  border-radius:7px;
  background:var(--soft);
}
.global-search>.ico{width:15px;height:15px;color:var(--muted2)}
.global-search>input{
  min-width:0;
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font-size:11px;
}
.global-search>input::placeholder{color:var(--muted2)}
.global-search>span{
  border:1px solid var(--line);
  border-radius:5px;
  background:var(--surface);
  color:var(--muted2);
  padding:2px 5px;
  font-size:8px;
  white-space:nowrap;
}
.global-results{
  position:absolute;
  top:43px;
  left:0;
  right:0;
  max-height:390px;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface-raised);
  box-shadow:var(--shadow-float);
  padding:6px;
  z-index:30;
}
.global-result-label{
  padding:8px 9px 5px;
  color:var(--muted2);
  font-size:9px;
  font-weight:800;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.global-result{
  width:100%;
  min-height:46px;
  border:0;
  border-radius:6px;
  padding:7px 9px;
  background:transparent;
  color:var(--text);
  display:flex;
  align-items:center;
  gap:9px;
  text-align:left;
}
.global-result:hover,.global-result.active{background:var(--blue-soft)}
.global-result .result-icon{
  width:30px;
  height:30px;
  border-radius:7px;
  display:grid;
  place-items:center;
  background:var(--soft);
  color:var(--muted);
}
.global-result b,.global-result small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.global-result b{color:var(--text-strong);font-size:11px}
.global-result small{margin-top:2px;color:var(--muted);font-size:9.5px}
.global-empty{padding:24px 12px;text-align:center;color:var(--muted);font-size:11px}

.page{max-width:1640px;padding:24px 26px 42px}
.page-head{margin-bottom:17px;align-items:center}
.page-head h1{color:var(--text-strong);font-size:20px}
.page-head p{color:var(--muted);font-size:11px;line-height:1.45}
.page-actions{flex-wrap:wrap}

/* Shared operational surfaces */
.surface{
  border-color:var(--line);
  background:var(--surface);
  box-shadow:0 1px 2px rgba(15,23,42,.015);
}
.surface-head{border-color:var(--line)}
.surface-head h2{color:var(--text-strong)}
.surface-head span{color:var(--muted)}
.surface-body{color:var(--text)}
.toolbar{background:var(--soft);border-color:var(--line)}
.toolbar-note,.table-count{color:var(--muted);font-size:11px;white-space:nowrap}
.search .ico{color:var(--muted2)}
.table-wrap{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}
table{color:var(--text)}
th,td{border-color:var(--line);height:52px}
th{background:var(--soft);color:var(--muted);font-size:9px;letter-spacing:.35px}
tbody tr:hover{background:color-mix(in srgb,var(--blue-soft) 45%,var(--surface))}
.entity b,.cell-primary{color:var(--text-strong)}
.entity span,.subline{color:var(--muted)}
.avatar{background:var(--blue-soft);color:var(--blue)}
.badge{background:var(--soft);color:var(--muted);border:1px solid transparent}
.badge.active,.badge.online,.badge.resolved,.badge.paid{background:var(--green-bg);color:var(--green)}
.badge.locked,.badge.suspended,.badge.disabled,.badge.expired,.badge.cancelled,.badge.urgent{background:var(--red-bg);color:var(--red)}
.badge.trialing,.badge.maintenance,.badge.past_due,.badge.in_progress,.badge.high{background:var(--amber-bg);color:var(--amber)}
.badge.owner,.badge.superadmin,.badge.open{background:var(--blue-soft);color:var(--blue)}
.badge.waiting_user{background:#f1edff;color:#6941c6}
html[data-theme="dark"] .badge.waiting_user{background:#30264c;color:#c9b7ff}
.kv{border-color:var(--line)}
.kv dt{color:var(--muted)}
.kv dd{color:var(--text-soft)}
.empty{color:var(--muted)}
.empty b{color:var(--text-soft)}

/* Dashboard */
.ops-status{
  min-height:46px;
  margin-bottom:14px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface);
  padding:9px 12px;
  display:flex;
  align-items:center;
  gap:10px;
}
.ops-status-mark{
  width:28px;
  height:28px;
  border-radius:7px;
  display:grid;
  place-items:center;
  background:var(--green-bg);
  color:var(--green);
}
.ops-status.has-alerts .ops-status-mark{background:var(--amber-bg);color:var(--amber)}
.ops-status-copy{min-width:0;flex:1}
.ops-status-copy b,.ops-status-copy span{display:block}
.ops-status-copy b{color:var(--text-strong);font-size:11.5px}
.ops-status-copy span{margin-top:2px;color:var(--muted);font-size:9.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ops-status-meta{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:9.5px;white-space:nowrap}
.ops-status-meta strong{color:var(--text-soft)}
.overview-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(170px,1fr));
  gap:12px;
  margin-bottom:14px;
}
.metric-card{
  min-width:0;
  min-height:108px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface);
  padding:14px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  gap:10px;
}
.metric-card-label{color:var(--muted);font-size:10px;font-weight:650}
.metric-card-value{display:block;margin-top:9px;color:var(--text-strong);font-size:24px;line-height:1;font-weight:730}
.metric-card-note{display:block;margin-top:8px;color:var(--muted2);font-size:9.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.metric-card-icon{
  width:34px;
  height:34px;
  border-radius:8px;
  display:grid;
  place-items:center;
  background:var(--blue-soft);
  color:var(--blue);
}
.metric-card-icon.green{background:var(--green-bg);color:var(--green)}
.metric-card-icon.amber{background:var(--amber-bg);color:var(--amber)}
.metric-card-icon.red{background:var(--red-bg);color:var(--red)}
.overview-main{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);
  gap:14px;
  align-items:start;
}
.overview-secondary{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:14px;
}
.attention-list{display:grid}
.attention-item{
  min-height:58px;
  padding:9px 14px;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:30px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}
.attention-item:last-child{border-bottom:0}
.attention-icon{
  width:30px;
  height:30px;
  border-radius:7px;
  display:grid;
  place-items:center;
  background:var(--amber-bg);
  color:var(--amber);
}
.attention-icon.red{background:var(--red-bg);color:var(--red)}
.attention-icon.blue{background:var(--blue-soft);color:var(--blue)}
.attention-copy b,.attention-copy span{display:block}
.attention-copy b{color:var(--text-strong);font-size:11px}
.attention-copy span{margin-top:2px;color:var(--muted);font-size:9.5px}
.distribution{padding:14px;display:grid;gap:12px}
.distribution-row{display:grid;grid-template-columns:90px minmax(80px,1fr) 34px;gap:8px;align-items:center;font-size:10px}
.distribution-row>span{color:var(--text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.distribution-row>b{text-align:right;color:var(--muted)}
.distribution-track{height:7px;border-radius:4px;background:var(--soft);overflow:hidden}
.distribution-track i{display:block;height:100%;border-radius:4px;background:var(--blue)}
.distribution-row:nth-child(2n) .distribution-track i{background:var(--green)}
.distribution-row:nth-child(3n) .distribution-track i{background:#8b5cf6}
.activity-list{display:grid}
.activity-row{
  min-height:54px;
  padding:9px 14px;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:26px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
}
.activity-row:last-child{border-bottom:0}
.activity-dot{
  width:26px;
  height:26px;
  border-radius:7px;
  background:var(--soft);
  color:var(--muted);
  display:grid;
  place-items:center;
}
.activity-row b,.activity-row span{display:block}
.activity-row b{color:var(--text-strong);font-size:10.5px}
.activity-row span{margin-top:2px;color:var(--muted);font-size:9px}
.activity-row time{color:var(--muted2);font-size:9px;white-space:nowrap}

/* Page controls and detail views */
.page-summary{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
  color:var(--muted);
  font-size:10px;
}
.summary-item{display:flex;align-items:center;gap:6px}
.summary-item i{width:7px;height:7px;border-radius:50%;background:var(--muted2)}
.summary-item i.good{background:var(--green)}
.summary-item i.warn{background:var(--amber)}
.summary-item i.bad{background:var(--red)}
.section-tabs{
  display:flex;
  align-items:center;
  gap:3px;
  min-height:42px;
  padding:5px 6px;
  border-bottom:1px solid var(--line);
  background:var(--soft);
}
.section-tab{
  height:31px;
  border:0;
  border-radius:6px;
  padding:0 10px;
  background:transparent;
  color:var(--muted);
  font-size:10.5px;
  font-weight:650;
}
.section-tab:hover{background:var(--surface);color:var(--text)}
.section-tab.active{background:var(--surface);color:var(--blue);box-shadow:0 1px 2px rgba(15,23,42,.08)}
.detail-hero{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  padding-bottom:14px;
  border-bottom:1px solid var(--line);
  margin-bottom:14px;
}
.detail-avatar{
  width:44px;
  height:44px;
  border-radius:8px;
  background:var(--blue-soft);
  color:var(--blue);
  display:grid;
  place-items:center;
  font-size:13px;
  font-weight:760;
}
.detail-hero h3,.detail-hero p{margin:0}
.detail-hero h3{color:var(--text-strong);font-size:14px}
.detail-hero p{margin-top:3px;color:var(--muted);font-size:10.5px}
.detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  border:1px solid var(--line);
  border-radius:8px;
  overflow:hidden;
  margin-bottom:14px;
}
.detail-field{min-width:0;padding:10px 12px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.detail-field:nth-child(2n){border-right:0}
.detail-field:nth-last-child(-n+2){border-bottom:0}
.detail-field span,.detail-field b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.detail-field span{color:var(--muted);font-size:9px;font-weight:700;text-transform:uppercase}
.detail-field b{margin-top:4px;color:var(--text-soft);font-size:11px}
.quota-line{display:grid;grid-template-columns:90px minmax(80px,1fr) 62px;gap:8px;align-items:center;margin:9px 0;font-size:10px}
.quota-line>span{color:var(--muted)}
.quota-line>b{text-align:right;color:var(--text-soft)}
.quota-track{height:6px;border-radius:3px;background:var(--soft);overflow:hidden}
.quota-track i{display:block;height:100%;background:var(--blue);border-radius:3px}
.quota-track i.warn{background:var(--amber)}
.quota-track i.bad{background:var(--red)}

.plan-name{display:flex;align-items:center;gap:7px}
.plan-default{width:7px;height:7px;border-radius:50%;background:var(--blue)}
.price-stack b,.price-stack span{display:block}
.price-stack span{margin-top:2px;color:var(--muted);font-size:9px}
.inline-quota{display:flex;align-items:center;gap:6px;white-space:nowrap}
.inline-quota .ico{color:var(--muted2)}

.node-health{display:flex;align-items:center;gap:8px;min-width:170px}
.node-health-dot{width:8px;height:8px;border-radius:50%;background:var(--muted2);box-shadow:0 0 0 3px var(--soft)}
.node-health-dot.online{background:var(--green)}
.node-health-dot.offline{background:var(--red)}
.node-health-dot.maintenance{background:var(--amber)}
.node-health b,.node-health span{display:block}
.node-health b{color:var(--text-strong);font-size:11px}
.node-health span{margin-top:2px;color:var(--muted);font-size:9px}

.operator-permissions{display:grid;gap:7px;margin-top:12px}
.permission-row{display:flex;align-items:flex-start;gap:8px;color:var(--muted);font-size:10.5px;line-height:1.45}
.permission-row .ico{margin-top:1px;color:var(--green)}
.temporary-password{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
}

/* Billing, support and security */
.metrics{
  border-color:var(--line);
  background:var(--surface);
}
.metric{border-color:var(--line)}
.metric span{color:var(--muted)}
.metric b{color:var(--text-strong)}
.metric small{color:var(--muted2)}
.billing-detail{border-color:var(--line);background:var(--soft)}
.coin-balance{color:var(--text-strong)}
.support-admin-meta,.support-admin-thread,.support-admin-message-body,.support-description{border-color:var(--line)}
.support-admin-meta,.support-admin-thread{background:var(--soft)}
.support-admin-message-body,.support-description{background:var(--surface)}
.support-admin-message.admin .support-admin-message-body{border-color:var(--blue-line);background:var(--blue-soft)}
.support-admin-message.internal .support-admin-message-body{background:var(--amber-bg)}
.support-admin-reply{border-color:var(--line)}
.factor-mark{background:var(--blue-soft);color:var(--blue)}
.factor-copy b{color:var(--text-strong)}
.factor-copy span{color:var(--muted)}
.security-note{border-color:color-mix(in srgb,var(--amber) 38%,var(--line))}
.totp-qr{border-color:var(--line)}

/* Dialogs and feedback */
.modal-wrap{background:rgba(9,14,23,.54);backdrop-filter:blur(2px)}
.modal{background:var(--surface-raised);box-shadow:var(--shadow-float)}
.modal-head,.modal-foot{border-color:var(--line)}
.modal-head h2{color:var(--text-strong)}
.toast{display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;align-items:start;background:#172033}
.toast:before{content:"";width:8px;height:8px;margin:3px 0 0 4px;border-radius:50%;background:#9aa7b8}
.toast.success:before{background:#4ade80}
.toast.error:before{background:#fda29b}
.toast.success{background:#123c31}
.toast.error{background:#5d211d}

/* Collapsed and responsive navigation */
body.sidebar-collapsed .shell{grid-template-columns:76px minmax(0,1fr)}
body.sidebar-collapsed .sidebar{padding-left:10px;padding-right:10px}
body.sidebar-collapsed .brand{justify-content:center;padding-left:0;padding-right:0}
body.sidebar-collapsed .brand-copy,
body.sidebar-collapsed .internal-tag,
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .nav-btn>span,
body.sidebar-collapsed .side-bottom .user-copy{display:none}
body.sidebar-collapsed .nav-btn{justify-content:center;padding:0}
body.sidebar-collapsed .nav-btn.active:before{left:-10px}
body.sidebar-collapsed .nav-count{position:absolute;margin:0 0 24px 25px}
body.sidebar-collapsed .user-mini{display:block}
body.sidebar-collapsed .user-mini>.btn{display:none}

@media(max-width:1360px){
  .overview-metrics{grid-template-columns:repeat(2,minmax(170px,1fr))}
  .overview-main{grid-template-columns:minmax(0,1fr) minmax(300px,.72fr)}
}

@media(max-width:1120px){
  .shell{grid-template-columns:76px minmax(0,1fr)}
  .sidebar{padding-left:10px;padding-right:10px}
  .brand{justify-content:center;padding-left:0;padding-right:0}
  .brand-copy,.internal-tag,.nav-label,.nav-btn>span,.side-bottom .user-copy{display:none}
  .nav-btn{justify-content:center;padding:0}
  .nav-btn.active:before{left:-10px}
  .nav-count{position:absolute;margin:0 0 24px 25px}
  .side-bottom{padding-left:5px;padding-right:5px}
  .user-mini{display:block}
  .user-mini>.btn{display:none}
  .sidebar-toggle{display:none}
  .global-search{width:min(300px,34vw)}
  .overview-main,.overview-secondary{grid-template-columns:1fr}
}

@media(max-width:820px){
  .global-search{display:none}
  .page{padding:18px 14px 34px}
  .overview-metrics{grid-template-columns:1fr 1fr}
  .ops-status-meta{display:none}
  .support-admin-meta{grid-template-columns:1fr 1fr}
}

@media(max-width:720px){
  .login{display:block;min-height:100vh}
  .login-aside{display:none}
  .login-main{min-height:100vh;padding:28px 22px}
  .login-mobile-brand{display:flex}
  .shell{display:block}
  .sidebar{
    position:sticky;
    top:0;
    width:100%;
    height:56px;
    padding:8px 9px;
    border-right:0;
    border-bottom:1px solid var(--line);
    display:block;
    overflow:visible;
  }
  .sidebar .brand,.side-bottom,.nav-label{display:none}
  .nav{display:flex;overflow-x:auto;overflow-y:hidden;padding:0}
  .nav-group{display:flex;margin:0}
  .nav-btn{min-width:44px;height:39px;padding:0 12px}
  .nav-btn.active:before{left:8px;right:8px;top:auto;bottom:-8px;width:auto;height:2px}
  .nav-count{position:absolute;margin:0 0 23px 24px}
  .topbar{top:56px;height:58px;padding:0 10px}
  .sidebar-toggle,.topbar-context span{display:none}
  .topbar-context{min-width:0}
  .topbar-context b{font-size:12px}
  .health-chip span{display:none}
  .page{padding-top:15px}
  .page-head{align-items:flex-start}
  .page-actions{width:100%}
  .overview-metrics{grid-template-columns:1fr}
  .metric-card{min-height:96px}
  .overview-main,.overview-secondary{display:block}
  .overview-main>.surface,.overview-secondary>.surface{margin-bottom:12px}
  .detail-grid{grid-template-columns:1fr}
  .detail-field{border-right:0}
  .detail-field:nth-last-child(2){border-bottom:1px solid var(--line)}
  .detail-hero{grid-template-columns:40px minmax(0,1fr)}
  .detail-hero>.badge{grid-column:1/-1;justify-self:start}
  .ops-status-copy span{white-space:normal}
  .section-tabs{overflow:auto}
}

@media(max-width:460px){
  .login-main{padding:24px 17px}
  .page-head h1{font-size:18px}
  .metric-card-value{font-size:21px}
  .toolbar{padding:9px}
  .filter-select{min-width:130px}
  .modal-wrap{padding:7px}
  .modal-body{padding:14px}
  .modal-foot{padding:9px 12px}
  .temporary-password{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
}
.ai-settings-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:16px;align-items:start}.ai-settings-form{padding:18px}.ai-settings-form .form-grid{margin-top:16px}.ai-provider-status{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:7px;background:var(--soft)}.ai-provider-status>span{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(217,45,32,.1)}.ai-provider-status.ready>span{background:var(--green);box-shadow:0 0 0 4px rgba(18,183,106,.1)}.ai-provider-status b,.ai-provider-status small{display:block}.ai-provider-status small{margin-top:3px;color:var(--muted)}.ai-key-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.ai-key-state{margin-top:6px;color:var(--muted);font-size:11px}.ai-settings-help{padding:18px}.ai-settings-help h3{margin:0 0 10px}.ai-settings-help ul{margin:0;padding-left:18px;color:var(--muted);font-size:12px;line-height:1.7}@media(max-width:900px){.ai-settings-grid{grid-template-columns:1fr}}