/* ====== Honor10 监控面板 · 全站共享布局与组件样式（唯一来源） ======
 * 目标：消除各页重复的 reset/body/.app/.nav/header/card/btn 等样式，杜绝切页“布局漂移”。
 * 各页面 <link> 引入本文件后，仅保留“本页专有”样式；同名选择器若在本页 <style> 再声明则就近覆盖。
 * 载入顺序约定：config.js → site.css(link) → 页面 <style>（页内可覆盖 site.css）。
 */
*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,sans-serif}
html{overflow-y:scroll}
body{background:#0b1120;color:#e2e8f0;display:flex;align-items:center;justify-content:center}
.app{width:100%;max-width:1200px;padding:20px}

/* —— 顶部导航（严格统一） —— */
.nav{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:20px;background:#131c31;border-radius:10px;padding:4px;border:1px solid #1e293b}
.nav a{padding:8px 20px;border-radius:6px;text-decoration:none;color:#94a3b8;font-size:.85rem;transition:.2s;white-space:nowrap;line-height:1.5}
.nav a:hover,.nav a.active{background:#2563eb;color:#fff}

/* —— 页头 —— */
.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:8px}
.header h1{font-size:1.4rem;font-weight:600;background:linear-gradient(135deg,#38bdf8,#818cf8);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.header .meta{font-size:.8rem;color:#64748b}

/* —— 卡片 —— */
.card{background:#131c31;border:1px solid #1e293b;border-radius:12px;padding:16px;margin-bottom:12px}
.card:last-child{margin-bottom:0}
.card-h{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px;gap:8px;flex-wrap:wrap}
.card-h label{font-size:.65rem;text-transform:uppercase;color:#64748b;letter-spacing:.5px;font-weight:500}

/* —— 按钮 —— */
.btn{padding:6px 16px;border-radius:6px;border:none;font-size:.8rem;cursor:pointer;color:#fff;transition:opacity .2s;background:#1e293b;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
.btn:hover{opacity:.8}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:#2563eb}.btn-warn{background:#d97706}.btn-rst{background:#059669}.btn-danger{background:#dc2626}.btn-kill{background:#7c3aed}
.btn-xs{padding:3px 10px;font-size:.72rem;border-radius:4px}

/* —— 徽标 / 状态点 —— */
.badge{display:inline-flex;align-items:center;gap:4px;background:#1e293b;padding:4px 12px;border-radius:20px;font-size:.75rem;color:#94a3b8}
.badge .dot{width:6px;height:6px;border-radius:50%;background:#22c55e;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}

/* —— 表格 —— */
table{width:100%;border-collapse:collapse;font-size:.85rem}
th{color:#64748b;font-weight:500;padding:5px 8px;text-align:left;border-bottom:1px solid #1e293b;white-space:nowrap}
td{padding:5px 8px;border-bottom:1px solid #131c31;font-family:ui-monospace,monospace;font-size:.85rem;white-space:nowrap}
tr:hover td{background:rgba(56,189,248,.03)}
.right{text-align:right}

/* —— 页内标签 / Tab —— */
.tabs{display:flex;gap:2px;margin-bottom:8px;flex-wrap:wrap}
.tab{padding:5px 14px;border-radius:6px;border:1px solid #1e293b;background:transparent;color:#64748b;font-size:.78rem;cursor:pointer;transition:.2s}
.tab:hover{border-color:#38bdf8;color:#e2e8f0}
.tab.active{background:#2563eb;border-color:#2563eb;color:#fff}

/* —— 轻提示 —— */
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#1e293b;color:#e2e8f0;padding:10px 24px;border-radius:8px;font-size:.85rem;z-index:99;transition:opacity .3s;opacity:0;pointer-events:none}
.toast.show{opacity:1}