/* 站点 3 · dashboard：深色数据面板，等宽标签、荧光绿主色、紧凑网格与左侧数据条。 */

:root {
  --bg: #0c1013;
  --surface: #141a20;
  --surface-2: #1a222a;
  --text: #e9eef3;
  --muted: #8b98a6;
  --line: #263039;
  --accent: #c9f24d;
  --accent-2: #ff8452;
  --accent-contrast: #10160a;
  --radius: 8px;
  --radius-sm: 5px;
  --head-font: var(--font-sans);
}

body { background: var(--bg); }

h1, h2, h3 { letter-spacing: -0.01em; }
h1 { font-weight: 700; }

.site-head { background: rgba(12, 16, 19, 0.9); border-bottom: 1px solid #1f272e; }
.brand-mark { border-radius: 6px; }
.brand-text strong { font-family: var(--font-mono); font-size: 0.98rem; letter-spacing: 0.04em; }
.brand-text em { border-radius: 3px; border-color: #2b353e; color: var(--accent); font-family: var(--font-mono); }
.site-nav a { font-size: 0.84rem; font-family: var(--font-mono); color: #9aa8b5; }
.site-nav a.is-active { color: var(--accent); box-shadow: inset 0 -2px 0 var(--accent); }
.head-cta { border-radius: 4px; background: var(--accent); color: #0e1508; font-family: var(--font-mono); font-size: 0.8rem; }
.sub-nav { background: #10161a; }

.eyebrow { color: var(--accent); font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.22em; }
.hero--data { border-bottom: 1px solid var(--line); padding-bottom: 2.4rem; }
.hero--data h1 { font-size: clamp(2rem, 3.8vw, 3.1rem); }
.hero--data .lead { color: #a2aeba; }
.metric-strip { gap: 0.5rem; }
.metric-strip li {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 0.6rem 1rem;
  font-family: var(--font-mono);
  font-size: 0.82rem;
}
.metric-strip li:nth-child(odd) { border-left: 2px solid var(--accent); }
.metric-strip li:nth-child(even) { border-left: 2px solid var(--accent-2); }
.metric-no { color: var(--muted); }
.hero-stats { border-top: 1px solid var(--line); }
.hero-stats strong { color: var(--accent); font-family: var(--font-mono); }

.btn { border-radius: 4px; font-family: var(--font-mono); font-size: 0.84rem; letter-spacing: 0.02em; }
.btn--primary { background: var(--accent); color: #10160a; }
.btn--ghost { background: transparent; border-color: #2f3a43; color: #dbe4ec; }
.btn--ghost:hover { border-color: var(--accent); color: var(--accent); }

.section { padding-block: 2rem; }
.section-head h2 { font-family: var(--font-mono); font-size: 1.05rem; letter-spacing: 0.02em; text-transform: uppercase; }
.section-head { border-bottom: 1px solid var(--line); padding-bottom: 0.6rem; }
.section-head p { font-size: 0.84rem; }

.card { background: var(--surface); border-color: var(--line); }
.card:hover { border-color: rgba(201, 242, 77, 0.55); }
.card-state { border-radius: 3px; background: #0f1519; color: var(--accent); font-family: var(--font-mono); font-size: 0.68rem; }
.card-meta { font-family: var(--font-mono); font-size: 0.72rem; }
.card-note { font-size: 0.8rem; }
.chip { border-radius: 3px; font-family: var(--font-mono); font-size: 0.68rem; }

.rank-rows li { border-bottom: 1px solid #1e262d; position: relative; padding-left: 0.6rem; }
@media (min-width: 821px) {
  .rank-rows li { grid-template-columns: 2rem 2.6rem 1fr auto; }
}
.rank-rows li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5rem;
  bottom: 0.5rem;
  width: 2px;
  background: linear-gradient(var(--accent), transparent);
}
.rank-no { color: var(--accent); }
.rank-tag { font-family: var(--font-mono); border-color: #2c363f; border-radius: 3px; }
.rank-head h2 { font-family: var(--font-mono); text-transform: uppercase; font-size: 1rem; }
.rank-note { border-left: 2px solid var(--accent-2); padding-left: 0.7rem; }
.rank-block h3 { font-family: var(--font-mono); font-size: 0.9rem; }
.rank-block h3 small { font-size: 0.7rem; }
.rank-block li { border-bottom: 1px solid #1e262d; font-size: 0.86rem; }

.topic-grid a, .guide-grid a, .doc-cards a, details, .panel, .steps li, .detail-aside {
  background: var(--surface);
  border-color: var(--line);
  border-radius: 5px;
}
.topic-grid strong { font-family: var(--font-mono); font-size: 0.98rem; }
.topic-grid span { color: var(--accent); font-family: var(--font-mono); font-size: 0.72rem; }
.step-no, .row-index { color: var(--accent); }
.row-card { border-bottom-color: #1e262d; }
.article-card { border-top: 2px solid var(--accent); }
.article-meta { font-family: var(--font-mono); }
.info-table th { font-family: var(--font-mono); font-size: 0.76rem; color: #93a0ad; }
.info-table th, .info-table td { border-color: #222b33; }
details summary::after { color: var(--accent); }
.site-foot { background: #0a0e11; }
.foot-logo strong { font-family: var(--font-mono); }
.cover--fallback { background: linear-gradient(135deg, #1b242c, #101518); }