/* =====================================================================
   NeuroPulse 神经脉冲 · 内部控制台 v4  ── 视觉冲击力加强版
   ===================================================================== */

:root {
  --bg:          #f8f9ff;
  --bg-login:    linear-gradient(135deg,#eef2ff 0%,#f0f4ff 50%,#e8f0fe 100%);
  --bg-grad:     linear-gradient(135deg,#f0f4ff 0%,#fafbff 50%,#f0f8ff 100%);
  --card:        rgba(255,255,255,0.92);
  --card-border: rgba(229,231,235,0.6);
  --line:        rgba(229,231,235,0.6);
  --text:        #1e1b4b;
  --body:        #374151;
  --muted:       #64748b;
  --faint:       #94a3b8;
  --brand:       #6366f1;
  --brand-dk:    #4338ca;
  --brand-sky:   #0ea5e9;
  --brand-grad:  linear-gradient(135deg,#6366f1,#4338ca);
  --title-grad:  linear-gradient(135deg,#1e1b4b 0%,#4338ca 45%,#0ea5e9 100%);
  --logo-grad:   linear-gradient(135deg,#4338ca,#0ea5e9);
  --green:       #10b981;
  --yellow:      #f59e0b;
  --red:         #ef4444;
  --purple:      #8b5cf6;
  --shadow-brand: 0 4px 16px rgba(99,102,241,0.35);
  --shadow-card:  0 4px 24px rgba(0,0,0,0.07);
  --shadow-hover: 0 12px 40px rgba(99,102,241,0.18);
  --r-card: 16px;
  --r-btn:  10px;
}

/* ── 关键帧 ───────────────────────────────────────────────────────── */
@keyframes pageEnter {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes iconPulse {
  0%,100% { box-shadow: 0 4px 14px var(--ic-shadow,rgba(99,102,241,0.4)); }
  50%     { box-shadow: 0 6px 22px var(--ic-shadow,rgba(99,102,241,0.65)); transform:scale(1.07); }
}
@keyframes pulseDot {
  0%,100% { opacity:0.45; transform:scale(0.9); }
  50%     { opacity:1;    transform:scale(1.15); }
}
@keyframes bandBreathe {
  0%,100% { opacity:0.4; }
  50%     { opacity:1;   }
}
@keyframes blink {
  0%,100% { opacity:1; }
  50%     { opacity:0.2; }
}
@keyframes ft1 {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-12px); }
}
@keyframes ft2 {
  0%,100% { transform:translateY(0); }
  50%     { transform:translateY(-16px); }
}

/* ── 基础重置 ─────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html,body,#app { min-height:100%; }
body {
  background:var(--bg-grad);
  color:var(--body);
  font-family:'PingFang SC','Microsoft YaHei','Segoe UI',sans-serif;
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea { font:inherit; }
a { color:var(--brand); text-decoration:none; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; opacity:0.5; }

/* ── 页面入场动画 ─────────────────────────────────────────────────── */
.page > * { animation:pageEnter 0.22s ease both; }
.page > *:nth-child(2) { animation-delay:0.05s; }
.page > *:nth-child(3) { animation-delay:0.10s; }
.page > *:nth-child(4) { animation-delay:0.15s; }

/* ── 登录页 ───────────────────────────────────────────────────────── */
.login-screen {
  position:relative; min-height:100vh;
  display:grid; place-items:center;
  padding:32px; overflow:hidden;
  background:var(--bg-login);
}
.login-panel {
  position:relative; z-index:10;
  width:min(440px,100%);
  padding:42px 40px;
  border:1px solid rgba(229,231,235,0.7);
  border-radius:20px;
  background:rgba(255,255,255,0.95);
  backdrop-filter:blur(24px);
  box-shadow:0 20px 60px rgba(99,102,241,0.15),0 4px 20px rgba(0,0,0,0.06);
  animation:pageEnter 0.35s ease both;
}
.login-brand { display:flex; align-items:center; gap:14px; margin-bottom:32px; }
.login-brand h1 {
  font-size:24px; font-weight:800; margin:0;
  background:var(--title-grad);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.login-brand p { color:var(--muted); font-size:13px; margin:4px 0 0; }
.login-form { display:grid; gap:18px; }

/* ── Floating tags ────────────────────────────────────────────────── */
.ftag {
  position:absolute;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(14px);
  border:1px solid rgba(229,231,235,0.8);
  border-radius:99px; padding:8px 16px;
  font-size:12px; font-weight:600; color:#374151;
  display:flex; align-items:center; gap:7px;
  box-shadow:0 4px 20px rgba(0,0,0,0.08);
  white-space:nowrap; z-index:10;
}
.ftag .dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.ftag.t1 { top:14%;left:6%;  animation:ft1 5s ease-in-out infinite; }
.ftag.t2 { top:18%;right:7%; animation:ft2 6s ease-in-out infinite; }
.ftag.t3 { top:55%;left:4%;  animation:ft1 7s ease-in-out infinite reverse; }
.ftag.t4 { top:60%;right:5%; animation:ft2 5.5s ease-in-out infinite reverse; }

/* ── 表单 ─────────────────────────────────────────────────────────── */
label { display:grid; gap:7px; font-size:13px; font-weight:500; color:#374151; }
input,select,textarea {
  width:100%; padding:11px 14px;
  border:1.5px solid #e5e7eb; border-radius:10px;
  background:rgba(255,255,255,0.95); color:var(--text);
  outline:none; transition:border-color .15s,box-shadow .15s;
}
textarea { resize:vertical; min-height:110px; }
input:focus,select:focus,textarea:focus {
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(99,102,241,0.15);
}

/* ── 按钮 ─────────────────────────────────────────────────────────── */
.primary-button {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  min-height:44px; padding:0 24px;
  border:none; border-radius:var(--r-btn);
  background:var(--brand-grad);
  color:#fff; font-weight:700; font-size:15px;
  box-shadow:0 8px 30px rgba(99,102,241,0.45);
  transition:transform .18s,box-shadow .18s;
}
.primary-button:hover:not(:disabled) {
  transform:translateY(-2px);
  box-shadow:0 12px 40px rgba(99,102,241,0.55);
}
.primary-button:active:not(:disabled) { transform:translateY(0); }

.secondary-button {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:38px; padding:0 16px;
  border:1.5px solid var(--brand); border-radius:var(--r-btn);
  background:#fff; color:var(--brand);
  font-weight:500; font-size:13px;
  transition:background .15s,box-shadow .15s;
}
.secondary-button:hover:not(:disabled) { background:rgba(99,102,241,0.06); }

.danger-button {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:38px; padding:0 16px;
  border:none; border-radius:var(--r-btn);
  background:linear-gradient(135deg,#ef4444,#dc2626);
  color:#fff; font-weight:600; font-size:13px;
  box-shadow:0 4px 14px rgba(239,68,68,0.35);
  transition:transform .15s;
}
.danger-button:hover:not(:disabled) { transform:translateY(-1px); }

.logout-button {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  width:100%; min-height:38px; padding:0 16px;
  border:1.5px solid rgba(239,68,68,0.28);
  border-radius:var(--r-btn);
  background:rgba(239,68,68,0.06);
  color:#dc2626; font-weight:500; font-size:13px;
  transition:background .15s;
}
.logout-button:hover:not(:disabled) { background:rgba(239,68,68,0.12); }

.small-button {
  display:inline-flex; align-items:center; gap:4px;
  padding:5px 12px;
  border:1.5px solid #e5e7eb; border-radius:8px;
  background:#fff; color:#374151;
  font-size:12px; font-weight:500; white-space:nowrap;
  transition:all .14s;
}
.small-button:hover:not(:disabled) {
  border-color:var(--brand); color:var(--brand);
  background:rgba(99,102,241,0.05);
}

.form-error   { color:var(--red);   font-size:12px; margin:0; min-height:18px; }
.form-success { color:var(--green); font-size:12px; margin:0; }
.form-hint    { color:var(--muted); font-size:12px; margin:0; text-align:center; }

/* ── Shell ────────────────────────────────────────────────────────── */
.shell {
  min-height:100vh;
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
}

/* ── 侧边栏 ───────────────────────────────────────────────────────── */
.sidebar {
  position:sticky; top:0; height:100vh;
  display:flex; flex-direction:column;
  border-right:1px solid rgba(229,231,235,0.55);
  background:rgba(255,255,255,0.97);
  backdrop-filter:blur(20px);
  overflow-y:auto; overflow-x:hidden;
  z-index:10; /* 确保在 np-bg canvas 之上 */
}
.sidebar-top {
  padding:22px 18px 16px;
  border-bottom:1px solid var(--line);
}
/* 呼吸光带 */
.sidebar-band {
  height:3px;
  background:linear-gradient(90deg,#6366f1,#4338ca,#0ea5e9,#6366f1);
  background-size:200% 100%;
  animation:bandBreathe 3s ease-in-out infinite;
}
.sidebar-nav { padding:10px 10px; flex:1; display:grid; gap:2px; align-content:start; }
.sidebar-footer { padding:8px 10px 16px; border-top:1px solid var(--line); }

.nav-section-label {
  padding:14px 10px 5px;
  font-size:10px; font-weight:700; color:var(--muted);
  text-transform:uppercase; letter-spacing:0.12em;
}
.nav-link {
  display:flex; align-items:center; gap:9px;
  padding:9px 11px; border-radius:10px;
  color:#6b7280; font-size:13px; font-weight:500;
  text-decoration:none; position:relative;
  border-left:4px solid transparent;
  transition:background .14s,color .14s,border-color .14s;
}
.nav-link svg { flex-shrink:0; color:#9ca3af; transition:color .14s; }
.nav-link:hover { background:rgba(99,102,241,0.05); color:var(--brand); }
.nav-link:hover svg { color:var(--brand); }
.nav-link.active {
  background:rgba(99,102,241,0.09);
  color:var(--brand); font-weight:700;
  border-left-color:var(--brand);
}
.nav-link.active svg { color:var(--brand); }

/* ── Brand ────────────────────────────────────────────────────────── */
.brand { display:flex; align-items:center; gap:14px; }
.brand-mark {
  width:48px; height:48px; flex:0 0 48px;
  display:grid; place-items:center;
  border-radius:14px;
  background:linear-gradient(135deg,#6366f1,#4338ca);
  box-shadow:0 6px 18px rgba(99,102,241,0.45);
}
.brand strong {
  display:block; font-size:18px; font-weight:800;
  background:var(--logo-grad);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.brand small { display:block; font-size:11px; color:var(--muted); margin-top:2px; }

/* ── 主内容 ───────────────────────────────────────────────────────── */
.main { min-width:0; padding:24px 28px; }

/* ── 顶栏 ─────────────────────────────────────────────────────────── */
.topbar {
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; margin-bottom:24px;
  padding-bottom:18px; border-bottom:1px solid var(--line);
}
.topbar h1 {
  font-size:28px; font-weight:800; margin:0;
  background:var(--title-grad);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.topbar p { margin:4px 0 0; font-size:12px; color:var(--muted); }
.topbar-right { display:flex; align-items:center; gap:12px; flex-shrink:0; }

.role-badge {
  display:inline-flex; align-items:center;
  padding:5px 14px;
  border-radius:99px;
  background:linear-gradient(135deg,#6366f1,#4338ca);
  color:#fff; font-size:11px; font-weight:600;
  box-shadow:0 2px 8px rgba(99,102,241,0.35);
  white-space:nowrap;
}
.user-avatar {
  width:36px; height:36px; border-radius:50%;
  background:linear-gradient(135deg,#6366f1,#4338ca);
  display:grid; place-items:center;
  font-size:14px; font-weight:700; color:#fff;
  flex-shrink:0;
  box-shadow:0 3px 10px rgba(99,102,241,0.38);
}

/* ── 页面容器 ─────────────────────────────────────────────────────── */
.page { display:grid; gap:20px; position:relative; z-index:1; }
.main { position:relative; z-index:1; }
.grid { display:grid; gap:18px; }
.grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.diagnose-grid {
  grid-template-columns:minmax(300px,0.9fr) minmax(340px,1.1fr);
  align-items:start;
}

/* ── 卡片 ─────────────────────────────────────────────────────────── */
.panel,.np-card {
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(14px);
  border:1px solid rgba(229,231,235,0.6);
  border-radius:var(--r-card);
  padding:20px 24px;
  box-shadow:var(--shadow-card);
  min-width:0;
  transition:box-shadow .2s,transform .2s;
}
.panel:hover,.np-card:hover {
  box-shadow:var(--shadow-hover);
}

.panel-heading,.np-card-header {
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
  margin-bottom:18px;
}
.panel-heading h2,.np-card-header h2 {
  font-size:14px; font-weight:700; color:var(--text);
  display:flex; align-items:center; gap:8px; margin:0;
}
.panel-heading h2 svg,.np-card-header h2 svg { color:var(--brand); flex-shrink:0; }
.panel-heading p,.np-card-header p { font-size:12px; color:var(--muted); margin:5px 0 0; }

/* 所有页面主标题（.topbar h1）已经是 28px 渐变 */

/* ── 统计卡片 ─────────────────────────────────────────────────────── */
.stats-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(175px,1fr));
  gap:16px;
}
.stat-card {
  position:relative; overflow:hidden;
  background:rgba(255,255,255,0.95);
  border:1px solid rgba(229,231,235,0.7);
  border-radius:var(--r-card);
  padding:22px 20px;
  box-shadow:0 4px 16px rgba(0,0,0,0.06);
  display:flex; flex-direction:column; gap:4px;
  transition:box-shadow .22s,transform .22s;
  cursor:default;
}
.stat-card:hover {
  transform:translateY(-4px);
  box-shadow:0 14px 40px rgba(99,102,241,0.18);
}
.stat-card::after {
  content:'';
  position:absolute; top:-24px; right:-24px;
  width:100px; height:100px; border-radius:50%;
  background:radial-gradient(circle,rgba(99,102,241,0.07) 0%,transparent 70%);
  pointer-events:none;
}
.stat-card.c-success::after { background:radial-gradient(circle,rgba(16,185,129,0.09) 0%,transparent 70%); }
.stat-card.c-danger::after  { background:radial-gradient(circle,rgba(239,68,68,0.08) 0%,transparent 70%); }
.stat-card.c-yellow::after  { background:radial-gradient(circle,rgba(245,158,11,0.09) 0%,transparent 70%); }
.stat-card.c-sky::after     { background:radial-gradient(circle,rgba(14,165,233,0.09) 0%,transparent 70%); }
.stat-card.c-purple::after  { background:radial-gradient(circle,rgba(139,92,246,0.09) 0%,transparent 70%); }

/* 图标圆圈 48px，各渠道实色 */
.stat-icon {
  width:48px; height:48px; border-radius:14px;
  display:grid; place-items:center;
  flex-shrink:0; margin-bottom:14px;
  --ic-shadow: rgba(99,102,241,0.45);
  background:#6366f1;
  box-shadow:0 4px 14px rgba(99,102,241,0.45);
  animation:iconPulse 2.2s ease-in-out infinite;
}
.stat-card.c-success .stat-icon { background:#10b981; --ic-shadow:rgba(16,185,129,0.45); box-shadow:0 4px 14px rgba(16,185,129,0.45); }
.stat-card.c-danger  .stat-icon { background:#ef4444; --ic-shadow:rgba(239,68,68,0.45);  box-shadow:0 4px 14px rgba(239,68,68,0.45);  }
.stat-card.c-sky     .stat-icon { background:#0ea5e9; --ic-shadow:rgba(14,165,233,0.45);  box-shadow:0 4px 14px rgba(14,165,233,0.45);  }
.stat-card.c-purple  .stat-icon { background:#8b5cf6; --ic-shadow:rgba(139,92,246,0.45);  box-shadow:0 4px 14px rgba(139,92,246,0.45);  }
.stat-card.c-yellow  .stat-icon { background:#f59e0b; --ic-shadow:rgba(245,158,11,0.45);  box-shadow:0 4px 14px rgba(245,158,11,0.45);  }

.stat-value {
  font-size:32px; font-weight:800; line-height:1;
  background:var(--title-grad);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.stat-card.c-success .stat-value { background:linear-gradient(135deg,#059669,#10b981); -webkit-background-clip:text; background-clip:text; }
.stat-card.c-danger  .stat-value { background:linear-gradient(135deg,#dc2626,#ef4444); -webkit-background-clip:text; background-clip:text; }
.stat-label { font-size:12px; color:var(--muted); font-weight:500; margin-top:5px; }
.stat-trend {
  position:absolute; bottom:16px; right:16px;
  font-size:12px; font-weight:700; color:var(--green);
  display:flex; align-items:center; gap:2px;
}
.stat-trend.down { color:var(--red); }

/* ── 徽章 ─────────────────────────────────────────────────────────── */
.badge {
  display:inline-flex; align-items:center; gap:5px;
  padding:2px 10px; min-height:22px;
  border-radius:99px; font-size:11px; font-weight:600;
  border:1px solid rgba(99,102,241,0.25);
  background:rgba(99,102,241,0.08); color:var(--brand-dk);
  white-space:nowrap;
}
.badge.success  { border:none; background:#10b981; color:#fff; }
.badge.muted    { border-color:#e5e7eb; background:rgba(100,116,139,0.08); color:var(--muted); }
.badge.danger   { border:none; background:#ef4444; color:#fff; }
.badge.warning  { border:none; background:#f59e0b; color:#fff; }
.badge.default  { border:none; background:#6366f1; color:#fff; }

/* ── 状态点（10px，呼吸动画） ─────────────────────────────────────── */
.pulse-dot {
  display:inline-block; width:10px; height:10px; border-radius:50%;
  background:var(--green);
  animation:pulseDot 2s ease-in-out infinite;
  flex-shrink:0;
}
.pulse-dot.red    { background:var(--red);    }
.pulse-dot.yellow { background:var(--yellow); }
.pulse-dot.gray   { background:var(--muted); animation:none; opacity:0.5; }

/* ── 表格 ─────────────────────────────────────────────────────────── */
.table-wrap {
  width:100%; overflow-x:auto;
  border-radius:12px; border:1px solid var(--line);
  background:rgba(255,255,255,0.7);
}
table { width:100%; min-width:720px; border-collapse:collapse; }
th,td { padding:0 14px; text-align:left; border-bottom:1px solid rgba(229,231,235,0.5); vertical-align:middle; }
th { background:#f8f9ff; height:40px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); white-space:nowrap; }
td { height:48px; font-size:13px; color:#374151; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:rgba(99,102,241,0.03); }
code {
  font-family:'Consolas','SFMono-Regular',monospace; font-size:12px;
  color:var(--brand-dk); background:rgba(99,102,241,0.09);
  padding:2px 7px; border-radius:5px;
}
.empty-cell { color:var(--muted); text-align:center; font-size:13px; }
.empty-state {
  display:grid; gap:8px; padding:40px 12px;
  border:1px dashed #d1d5db; border-radius:12px;
  background:rgba(248,249,255,0.7);
  color:var(--muted); text-align:center; font-size:13px;
}

/* ── 过滤栏 ───────────────────────────────────────────────────────── */
.filter-bar {
  display:flex; gap:10px; align-items:center; flex-wrap:wrap;
  margin-bottom:16px; padding:12px 16px;
  border-radius:12px; border:1px solid var(--line);
  background:rgba(255,255,255,0.75);
}
.filter-bar select,.filter-bar input { width:auto; min-width:130px; padding:7px 12px; font-size:13px; }

/* ── 渠道行 ───────────────────────────────────────────────────────── */
.channel-row {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 16px;
  border-radius:12px; border:1px solid rgba(229,231,235,0.6);
  background:rgba(255,255,255,0.88);
  margin-bottom:8px;
  position:relative; overflow:hidden;
  transition:border-color .15s,box-shadow .15s;
}
.channel-row:last-child { margin-bottom:0; }
.channel-row:hover { border-color:rgba(99,102,241,0.3); box-shadow:0 3px 14px rgba(99,102,241,0.08); }
/* 主渠道 DeepSeek 左侧紫色竖条 */
.channel-row.is-default::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:4px; background:#6366f1; border-radius:12px 0 0 12px;
}

/* ── 健康行 ───────────────────────────────────────────────────────── */
.health-row-item {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px;
  border-radius:12px; border:1px solid rgba(229,231,235,0.5);
  background:rgba(255,255,255,0.88);
  margin-bottom:8px;
  transition:border-color .15s;
}
.health-row-item:last-child { margin-bottom:0; }
.health-row-item.ok    { border-color:rgba(16,185,129,0.35); background:rgba(16,185,129,0.04); }
.health-row-item.error { border-color:rgba(239,68,68,0.35);  background:rgba(239,68,68,0.04);  }
.health-row-item.warn  { border-color:rgba(245,158,11,0.35); background:rgba(245,158,11,0.04); }
.health-left { display:flex; align-items:center; gap:12px; }
.health-icon {
  width:40px; height:40px; border-radius:11px;
  display:grid; place-items:center;
  flex-shrink:0;
}
.health-icon.ok    { background:rgba(16,185,129,0.12); color:#059669; }
.health-icon.error { background:rgba(239,68,68,0.12);  color:#dc2626; }
.health-icon.warn  { background:rgba(245,158,11,0.12); color:#b45309; }
.health-icon.brand { background:rgba(99,102,241,0.12); color:var(--brand); }
.health-name { font-size:14px; font-weight:600; color:var(--text); }
.health-sub  { font-size:12px; color:var(--muted); margin-top:2px; }
.health-section-title {
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.1em;
  color:var(--muted); margin:0 0 10px;
  padding-bottom:6px; border-bottom:1px solid var(--line);
}

/* ── 分页 ─────────────────────────────────────────────────────────── */
.pager {
  display:flex; align-items:center; justify-content:flex-end; gap:12px;
  margin-top:16px; color:var(--muted); font-size:13px;
}

/* ── 表单 ─────────────────────────────────────────────────────────── */
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.form-section {
  padding:18px 16px; border:1px solid var(--line);
  border-radius:14px; background:rgba(248,249,255,0.85);
  margin-bottom:18px; display:grid; gap:14px;
}
.form-row { display:flex; gap:18px; align-items:center; flex-wrap:wrap; }
.form-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.check-label { display:flex; align-items:center; gap:8px; cursor:pointer; color:#374151; font-size:13px; flex-direction:row; }
.check-label input[type="checkbox"] { width:auto; border:none; padding:0; accent-color:var(--brand); }
.action-cell { display:flex; gap:6px; flex-wrap:wrap; }

/* ── 智能体卡片网格 ────────────────────────────────────────────────── */
.agents-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
  gap:16px;
}
.agent-card {
  background:rgba(255,255,255,0.92);
  border:1px solid var(--card-border);
  border-radius:var(--r-card);
  padding:18px 20px;
  display:flex; flex-direction:column; gap:12px;
  position:relative; overflow:hidden;
  transition:box-shadow .15s,border-color .15s;
}
.agent-card:hover { box-shadow:var(--shadow-hover); border-color:rgba(99,102,241,0.3); }
.agent-card.is-enabled::before {
  content:''; position:absolute; left:0; top:16px; bottom:16px;
  width:3px; background:var(--brand-grad); border-radius:99px;
}
.agent-card-header { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.agent-card-name { font-size:15px; font-weight:700; color:var(--text); line-height:1.3; }
.agent-card-badges { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.agent-meta { display:grid; gap:6px; font-size:12px; }
.agent-meta-row { display:flex; align-items:flex-start; gap:8px; }
.agent-meta-label { color:var(--muted); font-size:11px; flex-shrink:0; min-width:56px; line-height:1.9; }
.agent-endpoint {
  font-family:'Consolas','SFMono-Regular',monospace; font-size:11px;
  color:var(--brand-dk); white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis; max-width:240px; cursor:default;
}
.agent-stats {
  display:flex; gap:14px; flex-wrap:wrap; align-items:flex-start;
  padding:10px 12px;
  background:rgba(248,249,255,0.85);
  border-radius:10px; border:1px solid var(--line); font-size:12px;
}
.agent-stat-item { display:flex; flex-direction:column; gap:2px; }
.agent-stat-item .val { font-weight:700; font-size:14px; color:var(--text); line-height:1.2; }
.agent-stat-item .lbl { font-size:10px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; }
.agent-card-actions { display:flex; gap:7px; align-items:center; flex-wrap:wrap; margin-top:2px; }
/* ── 更多菜单 ──────────────────────────────────────── */
.more-menu-wrap { position:relative; }
.more-menu {
  position:absolute; bottom:calc(100% + 6px); right:0;
  background:#fff; border:1px solid var(--line);
  border-radius:10px; box-shadow:0 6px 24px rgba(0,0,0,0.12);
  min-width:120px; z-index:200; display:none; flex-direction:column; padding:4px;
}
.more-menu-wrap.open .more-menu { display:flex; }
.more-menu button {
  text-align:left; padding:8px 12px; border:none; background:transparent;
  color:var(--body); font-size:13px; border-radius:7px; cursor:pointer; white-space:nowrap;
  width:100%;
}
.more-menu button:hover { background:rgba(99,102,241,0.07); color:var(--brand); }
.more-menu button:disabled { opacity:.5; cursor:not-allowed; }
@media (max-width:600px) { .agents-grid { grid-template-columns:1fr; } }

/* ── 结果块 ───────────────────────────────────────────────────────── */
.result-card { display:grid; gap:12px; }
.result-block { padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,0.8); }
.result-block > span { display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); margin-bottom:6px; }
.result-block p  { margin:0; line-height:1.75; color:#374151; }
.result-block ul { margin:0; padding-left:20px; line-height:1.75; color:#374151; }
.result-row {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 14px; border:1px solid var(--line); border-radius:10px;
  background:rgba(255,255,255,0.8);
}
.result-row > span { font-size:12px; color:var(--muted); }
.result-empty {
  display:grid; gap:8px; padding:40px 12px;
  border:1px dashed #d1d5db; border-radius:12px;
  background:rgba(248,249,255,0.7);
  color:var(--muted); text-align:center; font-size:13px;
}

/* ── Metric 列表 ──────────────────────────────────────────────────── */
.metric-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.metric-list div { padding:14px 12px; border-radius:12px; border:1px solid var(--line); background:rgba(255,255,255,0.8); }
.metric-list strong {
  display:block; font-size:22px; font-weight:700;
  background:var(--title-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.metric-list span { display:block; margin-top:4px; color:var(--muted); font-size:12px; }

/* ── Provider items ───────────────────────────────────────────────── */
.provider-grid { display:grid; gap:10px; margin-top:14px; }
.provider-grid.wide { grid-template-columns:repeat(3,minmax(0,1fr)); }
.provider-item {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,0.8);
}
.gateway-detail { display:grid; gap:14px; }
.gateway-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.gateway-summary div {
  padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:rgba(255,255,255,0.8);
  display:flex; align-items:center; justify-content:space-between; gap:8px;
}
.gateway-summary span { font-size:12px; color:var(--muted); }

/* ── 提示 ─────────────────────────────────────────────────────────── */
.muted-note   { color:var(--muted); font-size:12px; margin:8px 0 0; line-height:1.6; }
.stage-note   { color:var(--muted); font-size:13px; margin:0; line-height:1.7; }
.error-note   { color:var(--red);   font-size:12px; margin:0; }
.text-link    { color:var(--brand); }
.warning-note {
  color:#b45309; background:rgba(245,158,11,0.08);
  border:1px solid rgba(245,158,11,0.25); border-radius:10px;
  padding:9px 14px; font-size:13px; margin:0; display:block;
}

/* ── 仪表盘 canvas 背景 ───────────────────────────────────────────── */
.dash-canvas-wrap {
  position:fixed; inset:0; pointer-events:none; z-index:0;
}
.dash-canvas-wrap canvas { width:100%; height:100%; }
.page { position:relative; z-index:1; }

/* ── 调用日志紧凑行 ───────────────────────────────────────────────── */
.log-compact-row {
  display:grid;
  grid-template-columns:6rem 7rem 1fr auto 5rem 9rem;
  gap:10px; align-items:center;
  padding:10px 14px;
  border-bottom:1px solid rgba(229,231,235,0.4);
  font-size:12px; color:#374151;
  transition:background .12s;
}
.log-compact-row:hover { background:rgba(99,102,241,0.04); }
.log-compact-row:last-child { border-bottom:none; }
.log-compact-id   { font-family:monospace; color:var(--muted); }
.log-compact-time { color:var(--muted); white-space:nowrap; }

/* ── detail cell ──────────────────────────────────────────────────── */
.detail-cell { max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ── 响应式 ───────────────────────────────────────────────────────── */
@media(max-width:1100px) { .shell { grid-template-columns:230px minmax(0,1fr); } }
@media(max-width:900px) {
  .shell { grid-template-columns:1fr; }
  .sidebar { position:static; height:auto; }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .grid.two,.grid.three,.diagnose-grid,.provider-grid.wide,.gateway-summary,.metric-list,.form-grid { grid-template-columns:1fr; }
  .topbar { flex-direction:column; align-items:flex-start; gap:10px; }
}
@media(max-width:600px) {
  .main { padding:16px; }
  .login-screen { padding:20px; }
  .panel,.np-card { padding:18px 16px; }
  .stats-grid { grid-template-columns:1fr; }
  .log-compact-row { grid-template-columns:1fr 1fr; }
}

/* ── 模态弹窗 ─────────────────────────────────────────────────────── */
.np-modal-overlay {
  position:fixed; inset:0; z-index:2000;
  display:flex; align-items:center; justify-content:center;
  background:rgba(30,27,75,0.38);
  backdrop-filter:blur(6px);
  padding:16px;
}
.np-modal-panel {
  background:#fff;
  border-radius:18px;
  box-shadow:0 24px 80px rgba(99,102,241,0.22), 0 4px 24px rgba(0,0,0,0.1);
  border:1px solid rgba(229,231,235,0.7);
  width:min(760px,100%);
  max-height:88vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.np-modal-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 22px 14px;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
}
.np-modal-header h3 {
  font-size:16px; font-weight:700; color:var(--text); margin:0;
}
.np-modal-close {
  background:rgba(100,116,139,0.1); border:none;
  border-radius:8px; color:var(--muted);
  width:28px; height:28px; font-size:14px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; flex-shrink:0;
  transition:background .15s,color .15s;
}
.np-modal-close:hover { background:rgba(239,68,68,0.1); color:var(--red); }
.np-modal-body {
  padding:20px 22px;
  overflow-y:auto;
  flex:1;
}

/* ── 按钮变体 ─────────────────────────────────────────────────────── */
.small-button.primary-small {
  background:linear-gradient(135deg,#6366f1,#4338ca);
  color:#fff; border-color:transparent;
}
.small-button.primary-small:hover { opacity:0.88; }
.small-button.success-small {
  background:linear-gradient(135deg,#10b981,#059669);
  color:#fff; border-color:transparent;
}
.small-button.success-small:hover { opacity:0.88; }
.small-button.danger-small {
  background:rgba(239,68,68,0.1);
  color:var(--red); border-color:rgba(239,68,68,0.3);
}
.small-button.danger-small:hover { background:rgba(239,68,68,0.18); }

/* ── 结果块 ───────────────────────────────────────────────────────── */
.result-block {
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(99,102,241,0.03);
}
.result-block span {
  display:block; font-size:11px; font-weight:600;
  color:var(--muted); margin-bottom:6px; text-transform:uppercase; letter-spacing:.05em;
}

/* ── 版本卡片 ─────────────────────────────────────────────────────── */
.version-card + .version-card { margin-top:10px; }