/* ============================================================
   ui.css · 后台界面精修 v2
   原则：保留原有浅色蓝调设计语言，只提升质感与顺滑度
   加载位置：nav.php 末尾（晚于各页自带样式 -> 全局生效）
   ============================================================ */
:root{
  --pri:#3b82f6; --pri-d:#2563eb; --pri-l:#eff6ff; --pri-b:#dbeafe;
  --ink:#1e293b; --txt:#334155; --muted:#64748b; --dim:#94a3b8;
  --bg:#f5f7fb; --panel:#ffffff; --line:#e8edf5; --line-2:#dbe3ee;
  --ok:#10b981; --warn:#f59e0b; --danger:#ef4444; --purple:#8b5cf6;
  --r:12px; --r-lg:14px;
  --sh1:0 1px 2px rgba(15,23,42,.04);
  --sh2:0 2px 10px rgba(15,23,42,.05);
  --sh3:0 10px 26px rgba(15,23,42,.09);
  --ease:cubic-bezier(.4,0,.2,1);
  --t:.2s var(--ease);
  --top:56px; --side:260px;
}

/* ---------- 基础 ---------- */
body{
  font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei','Segoe UI',sans-serif;
  background:var(--bg); color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
a,*{ -webkit-tap-highlight-color:transparent }

::-webkit-scrollbar{ width:8px;height:8px }
::-webkit-scrollbar-thumb{ background:#cbd5e1;border-radius:8px }
::-webkit-scrollbar-thumb:hover{ background:#b6c2d4 }
::-webkit-scrollbar-track{ background:transparent }
.side-nav::-webkit-scrollbar{ width:4px }

/* 内容容器 */
.app-container,.main-content,.content-wrap,.container,.wrap{
  max-width:1180px;margin:0 auto;padding:20px 16px 64px;
  animation:fadeUp .3s var(--ease) both;
}
@keyframes fadeUp{ from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

/* ---------- 顶栏（保持原白底 56px） ---------- */
.top-bar{
  height:var(--top);
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(180%) blur(12px);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 3px rgba(15,23,42,.03);
}
.top-bar .menu-btn{ transition:background var(--t),color var(--t),transform var(--t) }
.top-bar .menu-btn:hover{ background:var(--pri-l);color:var(--pri) }
.top-bar .menu-btn:active{ transform:scale(.94) }
.top-bar .top-bar-brand img{ width:32px;height:32px;border-radius:9px;border:1px solid var(--line) }
.top-bar .top-bar-brand span{ color:var(--ink);font-weight:700 }

/* ---------- 侧栏（白底 + 蓝色高亮，图标保持原色） ---------- */
.side-nav{
  top:var(--top);width:var(--side);
  background:#fff;border-right:1px solid var(--line);
  padding:12px 0 16px;
  transition:transform .28s var(--ease),box-shadow .28s var(--ease);
}
.side-nav.open{ box-shadow:4px 0 24px rgba(15,23,42,.08) }
.nav-group-title{
  font-size:11px;font-weight:700;color:var(--dim);
  letter-spacing:1px;padding:10px 24px 6px;
}
.nav-group + .nav-group{ border-top:1px solid #f1f5f9;margin-top:4px }
.side-nav a.nav-item{
  padding:11px 20px;margin:2px 10px;border-radius:9px;position:relative;
  color:var(--muted);font-size:14px;font-weight:500;
  transition:background var(--t),color var(--t);
}
.side-nav a.nav-item .nav-icon{
  width:22px;height:22px;object-fit:contain;opacity:.72;flex-shrink:0;
  filter:none;                     /* 关键：不加反色，保持原图标配色 */
  transition:opacity var(--t),transform var(--t);
}
.side-nav a.nav-item:hover{ background:var(--pri-l);color:var(--pri) }
.side-nav a.nav-item:hover .nav-icon{ opacity:1;transform:scale(1.06) }
.side-nav a.nav-item.active{ background:var(--pri-l);color:var(--pri);font-weight:600 }
.side-nav a.nav-item.active .nav-icon{ opacity:1 }
.side-nav a.nav-item.active::before{
  content:'';position:absolute;left:-10px;top:50%;transform:translateY(-50%);
  width:3px;height:20px;border-radius:0 3px 3px 0;background:var(--pri);
}
.side-nav .nav-footer{ border-top:1px solid var(--line) }
.side-nav .nav-footer a{ color:var(--danger);transition:opacity var(--t) }
.side-nav .nav-footer a:hover{ opacity:.7 }

/* ---------- 遮罩 ---------- */
.nav-overlay{ top:var(--top);background:rgba(15,23,42,.3);transition:opacity .28s var(--ease) }

/* 无障碍 */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms!important;transition-duration:.01ms!important }
}

/* ============================================================
   卡片
   ============================================================ */
.card,.info-card,.form-card,.panel,.section-card,
.agent-card,.scheme-card,.file-item,.feedback-item{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh2);
  transition:box-shadow var(--t),transform var(--t),border-color var(--t);
}
.card{padding:22px}
.card:hover{ border-color:var(--line-2);box-shadow:var(--sh3);transform:translateY(-1px) }
.card h2,.card h3,.card .card-title{ color:var(--ink);font-weight:700 }

/* ============================================================
   表单
   ============================================================ */
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),
select,textarea{
  width:100%;padding:11px 14px;
  background:#f8fafc;border:1px solid var(--line);border-radius:10px;
  font-size:14px;font-family:inherit;color:var(--ink);outline:none;
  transition:border-color var(--t),box-shadow var(--t),background var(--t);
}
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):hover,
select:hover,textarea:hover{ border-color:var(--line-2) }
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):focus,
select:focus,textarea:focus{
  background:#fff;border-color:var(--pri);
  box-shadow:0 0 0 3px rgba(59,130,246,.12);
}
input::placeholder,textarea::placeholder{ color:#a8b3c4 }
textarea{ min-height:96px;resize:vertical;line-height:1.65 }
select{
  cursor:pointer;appearance:none;-webkit-appearance:none;padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;
}
label{ color:var(--txt);font-size:13px;font-weight:600 }
.form-group,.field{ margin-bottom:16px }
.form-row{ display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px }
.help,.form-hint,.hint{ font-size:12px;color:var(--dim);margin-top:6px }
input[type=checkbox],input[type=radio]{ width:17px;height:17px;accent-color:var(--pri);cursor:pointer;vertical-align:-2px }

/* ============================================================
   按钮（保持原蓝色主色）
   ============================================================ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border:1px solid var(--line);border-radius:10px;
  background:#fff;color:var(--txt);
  font-size:13.5px;font-weight:600;font-family:inherit;line-height:1.2;
  cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background var(--t),border-color var(--t),color var(--t),
             box-shadow var(--t),transform var(--t);
}
.btn:hover{ border-color:var(--line-2);background:#fbfcfe;transform:translateY(-1px);box-shadow:var(--sh2) }
.btn:active{ transform:translateY(0) scale(.985) }
.btn:disabled,.btn.disabled{ opacity:.55;cursor:not-allowed;transform:none;box-shadow:none }

.btn-primary,.btn.primary,.btn.blue{
  background:var(--pri);border-color:var(--pri);color:#fff;
  box-shadow:0 1px 2px rgba(59,130,246,.25);
}
.btn-primary:hover,.btn.primary:hover,.btn.blue:hover{
  background:var(--pri-d);border-color:var(--pri-d);color:#fff;
  box-shadow:0 6px 16px rgba(59,130,246,.28);
}
.btn-danger,.btn.red{ background:var(--danger);border-color:var(--danger);color:#fff }
.btn-danger:hover,.btn.red:hover{ background:#dc2626;border-color:#dc2626;color:#fff;
  box-shadow:0 6px 16px rgba(239,68,68,.28) }
.btn-success,.btn.green{ background:var(--ok);border-color:var(--ok);color:#fff }
.btn-success:hover,.btn.green:hover{ background:#059669;border-color:#059669;color:#fff;
  box-shadow:0 6px 16px rgba(16,185,129,.28) }
.btn-warning,.btn.orange{ background:var(--warn);border-color:var(--warn);color:#fff }
.btn-warning:hover,.btn.orange:hover{ background:#d97706;border-color:#d97706;color:#fff;
  box-shadow:0 6px 16px rgba(245,158,11,.28) }
.btn-ghost,.btn.light{ background:var(--pri-l);border-color:var(--pri-b);color:var(--pri-d) }
.btn-ghost:hover,.btn.light:hover{ background:var(--pri-b);border-color:#bfdbfe }
.btn-sm{ padding:8px 14px;font-size:12.5px;border-radius:9px }
.btn-xs{ padding:6px 11px;font-size:12px;border-radius:8px }
.btn-lg{ padding:13px 24px;font-size:15px }
.btn-block{ width:100% }

/* ============================================================
   提示 / 徽章
   ============================================================ */
.msg,.alert,.notice,.tip-box{
  padding:12px 16px;border-radius:11px;margin-bottom:14px;
  font-size:13.5px;font-weight:500;border:1px solid transparent;
}
.msg-ok,.alert-success{ background:#ecfdf5;color:#065f46;border-color:#a7f3d0 }
.msg-err,.alert-error,.alert-danger{ background:#fef2f2;color:#991b1b;border-color:#fecaca }
.msg-warn,.alert-warning{ background:#fffbeb;color:#92400e;border-color:#fde68a }
.msg-info,.alert-info{ background:var(--pri-l);color:#1e40af;border-color:var(--pri-b) }

.badge,.tag,.pill,.status{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.7;
  background:#f1f5f9;color:var(--muted);
}
.badge-success,.status.active,.tag.green{ background:#ecfdf5;color:#059669 }
.badge-error,.status.banned,.tag.red{ background:#fef2f2;color:#dc2626 }
.badge-warning,.status.expired,.tag.orange{ background:#fffbeb;color:#d97706 }
.badge-info,.status.used,.tag.blue{ background:var(--pri-l);color:var(--pri-d) }
.badge-purple,.tag.purple{ background:#f5f3ff;color:#7c3aed }

/* ============================================================
   表格
   ============================================================ */
.table-wrap,.table-container{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh2);overflow:auto;-webkit-overflow-scrolling:touch;
}
table{ width:100%;border-collapse:collapse;font-size:13.5px }
table th{
  background:#f8fafc;color:var(--muted);font-size:12px;font-weight:700;
  text-align:left;letter-spacing:.3px;padding:12px 15px;
  border-bottom:1px solid var(--line);white-space:nowrap;
}
table td{ padding:13px 15px;border-bottom:1px solid #f1f5f9;color:var(--txt);vertical-align:middle }
table tbody tr{ transition:background var(--t) }
table tbody tr:hover{ background:#f8fbff }
table tbody tr:last-child td{ border-bottom:none }

/* ============================================================
   统计卡 / 空态
   ============================================================ */
.stat-card{ background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:18px;box-shadow:var(--sh2);
  transition:box-shadow var(--t),transform var(--t),border-color var(--t) }

.stat-card:hover{ transform:translateY(-2px);box-shadow:var(--sh3);border-color:var(--line-2) }
.stat-number,.stat-value{ display:block;font-size:26px;font-weight:700;line-height:1.15;
  letter-spacing:-.5px;color:var(--ink) }
.stat-label{ display:block;font-size:12px;color:var(--dim);margin-top:5px }

.empty,.empty-state,.no-data{ text-align:center;padding:52px 20px;color:var(--dim);font-size:13.5px }
.empty-icon{ font-size:38px;display:block;margin-bottom:12px;opacity:.35 }

/* 统计网格（通用） */
.stat-grid,.stats-grid{ display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:14px;margin-bottom:16px }

/* ============================================================
   弹窗 / 抽屉 / Toast
   ============================================================ */
dialog,.modal{ border:none;border-radius:16px;padding:0;box-shadow:0 24px 64px rgba(15,23,42,.18) }
dialog::backdrop,.modal-backdrop{ background:rgba(15,23,42,.42);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px) }
dialog[open]{ animation:dlgIn .22s var(--ease) both }
@keyframes dlgIn{ from{opacity:0;transform:translateY(10px) scale(.985)} to{opacity:1;transform:none} }

.toast,.toast-item{
  border-radius:12px;padding:13px 17px;font-size:13.5px;font-weight:600;
  background:#fff;border:1px solid var(--line);color:var(--ink);box-shadow:var(--sh3);
}
.toast-item.success{border-left:3px solid var(--ok)}
.toast-item.error{border-left:3px solid var(--danger)}
.toast-item.info{border-left:3px solid var(--pri)}

/* 代码 / 进度 */
code,kbd{ background:#f1f5f9;border:1px solid var(--line);border-radius:6px;
  padding:2px 6px;font-size:12.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#0f172a }
pre{ background:#0f172a;color:#e2e8f0;padding:16px;border-radius:12px;overflow:auto;
  font-size:12.5px;line-height:1.7 }
progress,.progress-bar{ appearance:none;width:100%;height:7px;border:none;border-radius:99px;
  background:#e8edf5;overflow:hidden }
progress::-webkit-progress-bar{ background:#e8edf5 }
progress::-webkit-progress-value{ background:linear-gradient(90deg,#60a5fa,var(--pri));border-radius:99px }

/* 小工具 */
.mt-0{margin-top:0!important} .mt-8{margin-top:8px!important} .mt-16{margin-top:16px!important}
.mb-0{margin-bottom:0!important} .mb-8{margin-bottom:8px!important} .mb-16{margin-bottom:16px!important}
.text-muted{color:var(--dim)!important} .text-center{text-align:center!important}
.text-right{text-align:right!important} .nowrap{white-space:nowrap!important}
.flex{display:flex} .flex-between{display:flex;align-items:center;justify-content:space-between;gap:12px}
.flex-center{display:flex;align-items:center;gap:8px} .flex-wrap{flex-wrap:wrap}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}

/* ============================================================
   仪表盘
   ============================================================ */
.dash-head{ display:flex;align-items:flex-end;justify-content:space-between;gap:16px;
  flex-wrap:wrap;margin:0 0 20px }
.dash-head h1{ font-size:24px;font-weight:700;letter-spacing:-.5px;color:var(--ink);
  margin:0;line-height:1.2 }
.dash-head p{ font-size:13px;color:var(--muted);margin-top:6px }
.dash-hd-r{ display:flex;gap:8px;flex-wrap:wrap }
article.appcard p.meta{ font-size:12px;color:var(--dim);margin-top:7px }

/* 指标卡：图标 + 数值 + 标签 */
section.stat-grid{ display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));
  gap:14px;margin-bottom:16px }
article.stat{ display:flex;flex-direction:column;padding:18px 17px }
article.stat b.num{ margin-top:0 }
article.stat span.lb{ margin-top:5px }
.stat-ico{ width:36px;height:36px;border-radius:10px;display:flex;align-items:center;
  justify-content:center;margin-bottom:14px;transition:transform var(--t) }
.stat-ico svg{ width:18px;height:18px }
article.stat:hover .stat-ico{ transform:scale(1.07) }
.stat-ico.c1{ background:#eff6ff;color:#3b82f6 }
.stat-ico.c2{ background:#ecfdf5;color:#10b981 }
.stat-ico.c3{ background:#fffbeb;color:#f59e0b }
.stat-ico.c4{ background:#fef2f2;color:#ef4444 }
.stat-ico.c5{ background:#f5f3ff;color:#8b5cf6 }
.stat-ico.c6{ background:#f0f9ff;color:#0ea5e9 }
article.stat b.num.c1{ color:#3b82f6 }
article.stat b.num.c2{ color:#10b981 }
article.stat b.num.c3{ color:#f59e0b }
article.stat b.num.c4{ color:#ef4444 }
article.stat b.num.c5{ color:#8b5cf6 }
article.stat b.num.c6{ color:#0ea5e9 }

/* 近 14 天趋势（纯 CSS 柱状图，蓝色系） */
.trend{ display:flex;gap:6px;height:196px;align-items:stretch;padding-top:22px }
.trend-col{ flex:1;display:flex;flex-direction:column;min-width:0 }
.trend-plot{ flex:1;display:flex;align-items:flex-end;justify-content:center }
.trend-bar{ position:relative;width:100%;max-width:34px;min-height:4px;border-radius:6px 6px 3px 3px;
  background:linear-gradient(180deg,#93c5fd,var(--pri));
  box-shadow:0 2px 8px rgba(59,130,246,.18);
  transition:filter var(--t),box-shadow var(--t) }
.trend-bar b{ position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
  font-size:11px;font-weight:700;color:var(--muted);white-space:nowrap;
  opacity:0;transition:opacity var(--t) }
.trend-col:hover .trend-bar{ filter:brightness(1.06);box-shadow:0 4px 14px rgba(59,130,246,.32) }
.trend-col:hover .trend-bar b{ opacity:1 }
.trend-x{ font-style:normal;font-size:10.5px;color:var(--dim);text-align:center;
  margin-top:9px;white-space:nowrap }

/* 底部双列 */
.dash-cols{ display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;align-items:start }
.dash-cols .block{ margin-bottom:0 }
.dash-cols .shortcuts{ grid-template-columns:repeat(auto-fit,minmax(132px,1fr)) }
.dash-cols ul.sys{ grid-template-columns:1fr;gap:0 }
.dash-cols ul.sys li{ display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 4px;background:transparent;border-bottom:1px solid #f1f5f9;border-radius:0;
  transition:background var(--t) }
.dash-cols ul.sys li:hover{ background:#f8fbff }
.dash-cols ul.sys li:last-child{ border-bottom:none }
.dash-cols ul.sys li span.k{ margin:0;font-size:12.5px;color:var(--muted) }
.dash-cols ul.sys li b.v{ font-size:13px;color:var(--ink) }

/* ============================================================
   桌面端布局（≥1024px）：侧栏常驻 + 充分利用宽度
   —— 解决"大屏上侧栏是抽屉、大片留白"的问题
   ============================================================ */
@media (min-width:1024px){
  body{ padding-left:var(--side)!important; padding-top:var(--top)!important }

  /* 侧栏常驻，不再隐藏 */
  .side-nav{
    transform:none!important;
    box-shadow:none!important;
    border-right:1px solid var(--line);
    width:var(--side);
  }
  .side-nav.open{ box-shadow:none!important }

  /* 顶栏横跨整宽；汉堡与遮罩在桌面端无意义 */
  .top-bar{ padding-left:20px;padding-right:20px }
  .top-bar .menu-btn{ display:none }
  .nav-overlay{ display:none!important }

  /* 内容区在侧栏右侧居中，宽度放宽 */
  .app-container,.main-content,.content-wrap,.container,.wrap{ max-width:1240px }

  /* 仪表盘在宽屏上更舒展 */
  .trend{ height:212px }
  .dash-cols{ gap:18px }
}

/* ============================================================
   登录页（浅色，保持原风格）
   ============================================================ */
body.auth-page{
  padding:0!important;display:flex;align-items:center;justify-content:center;min-height:100vh;
  background:linear-gradient(160deg,#f7f9ff 0%,#eaf1ff 55%,#e3ecfd 100%);
}
body.auth-page .logo-row .logo{
  background:linear-gradient(135deg,#60a5fa,var(--pri));color:#fff;
  box-shadow:0 10px 26px rgba(59,130,246,.3);
}
body.auth-page .card,body.auth-page .login-box{
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;
  box-shadow:0 20px 50px rgba(15,23,42,.09);
}
body.auth-page .card:hover{ transform:none;box-shadow:0 20px 50px rgba(15,23,42,.09) }
body.auth-page .foot,body.auth-page .footer{ color:var(--dim) }
body.auth-page .foot a{ color:var(--muted);transition:color var(--t) }
body.auth-page .foot a:hover{ color:var(--pri) }
body.auth-page .err,body.auth-page .error{
  background:#fef2f2;color:#b23a3a;border:1px solid #fecaca;border-radius:11px;
  padding:10px 13px;font-size:13px;text-align:center;margin-bottom:14px;
}
body.auth-page .btn,body.auth-page input[type=submit]{
  width:100%;padding:12px;border-radius:11px;font-size:14.5px;
}
body.auth-page input[type=submit]{
  background:var(--pri);color:#fff;border:none;font-weight:700;font-family:inherit;
  cursor:pointer;transition:background var(--t),box-shadow var(--t);
}
body.auth-page input[type=submit]:hover{
  background:var(--pri-d);box-shadow:0 6px 18px rgba(59,130,246,.3);
}
body.auth-page .back-link{
  color:var(--muted);background:rgba(255,255,255,.8);border:1px solid var(--line);
  border-radius:10px;transition:color var(--t),background var(--t);
}
body.auth-page .back-link:hover{ color:var(--pri);background:#fff }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width:980px){
  .dash-cols{ grid-template-columns:1fr;gap:14px }
  .dash-head h1{ font-size:21px }
}
@media (max-width:768px){
  .app-container,.main-content,.content-wrap,.container,.wrap{ padding:16px 13px 56px }
  .form-row{ grid-template-columns:1fr }
  .stat-grid,.stats-grid{ grid-template-columns:repeat(2,1fr);gap:11px }
  .card{ padding:18px }
}
@media (max-width:560px){
  .trend{ height:154px;gap:4px;padding-top:20px }
  .trend-col:nth-child(even) .trend-x{ display:none }
  .trend-bar{ max-width:26px }
  .trend-bar b{ font-size:10px }
  .dash-head{ margin-bottom:16px }
  .dash-hd-r{ width:100% }
  .dash-hd-r .btn{ flex:1 }
  table{ font-size:13px }
  table th,table td{ padding:10px 11px }
}

/* ============================================================
   仪表盘紧凑化：收紧间距、去掉虚高的行高
   ============================================================ */
.dash-head{ align-items:center;margin:0 0 14px }
.dash-head h1{ font-size:19px;letter-spacing:-.3px }
.dash-head p{ font-size:12.5px;margin-top:3px }
.dash-hd-r .btn{ padding:7px 13px;font-size:12.5px;border-radius:9px }

article.appcard{ margin-bottom:12px }

section.stat-grid{ grid-template-columns:repeat(auto-fit,minmax(116px,1fr));
  gap:11px;margin-bottom:12px }
article.stat{ padding:14px 13px }
article.stat b.num{ font-size:23px;letter-spacing:-.6px }
article.stat span.lb{ font-size:11.5px;margin-top:3px }

.dash-cols{ gap:12px }
.dash-cols .block{ padding:16px }
.dash-cols ul.sys li{ padding:9px 2px }
.dash-cols .shortcuts{ grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px }
.dash-cols .shortcuts a{ padding:10px 8px;font-size:12.5px }

@media (max-width:560px){
  .dash-head h1{ font-size:18px }
  section.stat-grid{ grid-template-columns:repeat(3,1fr) }
}

/* ============================================================
   快捷操作（真图标磁贴）/ 系统信息（横向信息条）
   ============================================================ */
section.block nav.shortcuts{ display:grid;
  grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:9px }
section.block nav.shortcuts a{
  display:flex;align-items:center;gap:9px;padding:11px 13px;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  color:var(--txt);font-size:13px;font-weight:600;text-decoration:none;
  transition:background var(--t),border-color var(--t),color var(--t),
             transform var(--t),box-shadow var(--t);
}
section.block nav.shortcuts a img{
  width:18px;height:18px;object-fit:contain;opacity:.8;flex-shrink:0;
  transition:opacity var(--t),transform var(--t);
}
section.block nav.shortcuts a:hover{
  background:var(--pri-l);border-color:var(--pri-b);color:var(--pri);
  transform:translateY(-1px);box-shadow:0 4px 12px rgba(59,130,246,.12);
}
section.block nav.shortcuts a:hover img{ opacity:1;transform:scale(1.08) }
section.block nav.shortcuts a:active{ transform:translateY(0) scale(.99) }

section.block-sys ul.sys{
  display:flex;flex-wrap:wrap;list-style:none;gap:0;margin:0;padding:0;
}
section.block-sys ul.sys li{
  display:flex;flex-direction:column;gap:3px;
  flex:1 1 150px;min-width:0;padding:2px 20px;
  background:transparent;border-radius:0;border-left:1px solid var(--line);
}
section.block-sys ul.sys li:first-child{ border-left:none;padding-left:0 }
section.block-sys ul.sys li span.k{
  display:block;font-size:12px;color:var(--dim);font-weight:500;margin:0;
}
section.block-sys ul.sys li b.v{
  display:block;font-size:14px;font-weight:700;color:var(--ink);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
@media (max-width:640px){
  section.block nav.shortcuts{ grid-template-columns:1fr 1fr }
  section.block-sys ul.sys{ flex-direction:column;gap:11px }
  section.block-sys ul.sys li{ padding:0;border-left:none }
}

/* ============================================================
   快捷操作 + 系统信息：横向并排、等高对齐
   ============================================================ */
.dash-row{ display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);
  gap:12px;align-items:stretch;margin:0 0 14px }
.dash-row .block{ margin-bottom:0;display:flex;flex-direction:column }
.dash-row .shortcuts,.dash-row .sys{ flex:1 }

/* 左：8 个磁贴 -> 4 列 2 行 */
.dash-row section.block nav.shortcuts{
  grid-template-columns:repeat(auto-fit,minmax(148px,1fr));
  align-content:start;
}

/* 右：4 条信息竖向排开，随高度均分 */
.dash-row .block-sys ul.sys{
  display:flex;flex-direction:column;justify-content:space-between;
  list-style:none;gap:0;margin:0;padding:0;
}
.dash-row .block-sys ul.sys li{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  flex:none;padding:8px 0;background:transparent;border-radius:0;
  border-left:none;border-bottom:1px solid #f1f5f9;
}
.dash-row .block-sys ul.sys li:last-child{ border-bottom:none }
.dash-row .block-sys ul.sys li span.k{
  display:block;font-size:12.5px;color:var(--muted);margin:0;font-weight:500;
}
.dash-row .block-sys ul.sys li b.v{
  font-size:13px;font-weight:700;color:var(--ink);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap;
}

@media (max-width:980px){
  .dash-row{ grid-template-columns:1fr;gap:12px }
}

/* ============================================================
   快捷操作：整宽，8 个磁贴横排一行
   ============================================================ */
section.block-quick nav.shortcuts{ grid-template-columns:repeat(8,1fr);gap:10px }
section.block-quick nav.shortcuts a{ padding:10px 11px;font-size:12.5px;gap:8px }
section.block-quick nav.shortcuts a img{ width:17px;height:17px }
section.block-quick nav.shortcuts a:hover{ transform:translateY(-2px) }
@media (max-width:1200px){
  section.block-quick nav.shortcuts{ grid-template-columns:repeat(4,1fr) }
}
@media (max-width:640px){
  section.block-quick nav.shortcuts{ grid-template-columns:repeat(2,1fr) }
}