/* PulseServer — a mixing desk. Graphite panels, LED meter segments, condensed panel labels in
   Big Shoulders Display, Manrope for prose, IBM Plex Mono for device names. */

:root {
  --page-bg: #16181b; --page-text: #e4e6e8; --page-muted: #a0a6ad; --page-line: #2b2f34;
  --page-accent: #f5b83d; --strong: #ffffff; --surface: #1d2024; --raise: #24282d;
  --code-bg: #111315; --code-text: #f1e2bf;
  --page-ui: "Manrope", system-ui, sans-serif;
  --display: "Big Shoulders Display", "Manrope", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;
  --led-g: #4fd67a; --led-a: #f5b83d; --led-r: #ff5d4f;
  --k-ink: #e4e6e8; --k-accent: #f5b83d; --k-b: #7cb7ff; --k-c: #c39bff; --k-ok: #4fd67a; --k-muted: #848b93; --k-file: #a0a6ad;
  color-scheme: dark;
}
.hero h1 { font: 800 clamp(56px, 8vw, 104px)/0.92 var(--display); text-transform: uppercase; letter-spacing: 0.01em; }
.vu { display: flex; gap: 4px; margin: 14px 0 22px; }
.vu i { width: 22px; height: 8px; border-radius: 2px; background: var(--led-g); box-shadow: 0 0 8px #4fd67a66; }
.vu i:nth-child(n+9) { background: var(--led-a); box-shadow: 0 0 8px #f5b83d66; }
.vu i:nth-child(n+12) { background: var(--led-r); box-shadow: 0 0 8px #ff5d4f66; }
.vu i:nth-child(n+13) { opacity: 0.25; box-shadow: none; }
.part > h2 { font: 700 clamp(28px, 3.4vw, 40px)/1 var(--display); text-transform: uppercase; letter-spacing: 0.02em; }
.part > h2::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 12px 4px 0;
  background: var(--led-g); box-shadow: 0 0 8px var(--led-g); vertical-align: middle; }
p.warn { padding: 12px 16px; border-left: 4px solid var(--led-r); background: #2a1c1b; border-radius: 0 6px 6px 0; max-width: 72ch; }
p.warn b { color: #ffb4ab; }
.fig { padding: 16px 12px; background: var(--surface); border: 1px solid var(--page-line); border-radius: 6px;
  box-shadow: inset 0 1px 0 #ffffff0a; }
.dg .lab-bg { fill: var(--surface); }
.dg .halo { stroke: var(--surface); }
ul.strips { list-style: none; padding: 0; display: grid; gap: 10px; }
ul.strips li { padding: 12px 16px; background: var(--surface); border: 1px solid var(--page-line); border-radius: 6px;
  border-top: 3px solid var(--led-a); }
table td:first-child { white-space: nowrap; }
