/* Waylandroid — a tiling desktop at night. Deep indigo, windows outlined with Hyprland's own
   cyan-to-green border gradient; Anybody (wide) for headings, IBM Plex Sans for prose,
   JetBrains Mono for code. */

:root {
  --page-bg: #0b0f17; --page-text: #dde3f0; --page-muted: #98a2b8; --page-line: #1e2636;
  --page-accent: #7aa2f7; --strong: #ffffff; --surface: #111827; --raise: #182033;
  --code-bg: #0e1424; --code-text: #d6e2ff;
  --page-ui: "IBM Plex Sans", system-ui, sans-serif;
  --display: "Anybody", "IBM Plex Sans", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;
  --hypr: linear-gradient(135deg, #33ccff, #00ff99);
  --k-ink: #dde3f0; --k-accent: #33ccff; --k-b: #7aa2f7; --k-c: #b392f0; --k-ok: #00e08a; --k-muted: #7d879c; --k-file: #98a2b8;
  color-scheme: dark;
}
.hero h1 { font: 800 clamp(38px, 4.4vw, 60px)/1 var(--display); letter-spacing: -0.02em; }
.part > h2 { font: 700 clamp(26px, 3vw, 36px)/1.1 var(--display); font-stretch: 112%; }
.shot { margin: 0; }
.shot img { display: block; width: 100%; height: auto; border-radius: 10px; padding: 2px; background: var(--hypr); }
.shot figcaption { margin-top: 8px; font-size: 13.5px; color: var(--page-muted); }
.phones { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.shot.phone img { border-radius: 18px; }
.fig { padding: 16px 12px; background: var(--surface); border-radius: 10px; border: 1px solid var(--page-line); }
.fig.small { padding: 10px 6px; }
.dg .lab-bg { fill: var(--surface); }
.dg .halo { stroke: var(--surface); }
table td.num { font-family: var(--mono); text-align: right; white-space: nowrap; }
ul.facts { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
ul.facts li { margin: 0; padding: 12px 14px; border-radius: 8px; background: var(--surface); border: 1px solid var(--page-line); }
ul.facts li b { display: block; color: var(--strong); margin-bottom: 2px; }
p.note { font-size: 14px; color: var(--page-muted); }
