/* Structural only. Brand color lives in CSS variables set by Theme.apply(). */
:root {
  --primary: #0abab5;
  --primary-deep: #007a7c;
  --primary-light: #81d8d0;
  --canvas: #ffffff;
  --canvas-elevated: #f4fbfa;
  --ink: #000000;
  --body: #4a4a4a;
  --muted: #a8a9ad;
  --hairline: #d8e8e8;
  --on-primary: #ffffff;
  --shadow: none;
  --font: Calibri, "Segoe UI", system-ui, sans-serif;
  --radius: 0px;
  --radius-button: 0px;
  --voltage: var(--primary);
  --track: 0.22em;
  --display-track: 0.01em;
  --font-display: var(--font);
  --font-mono: var(--font);
  --max: 720px;
  --tap: 48px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.5;
  color: var(--body);
  background: var(--canvas);
  overflow-x: clip;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--primary-deep); }
button, input, select, textarea { font: inherit; }
#app { min-height: 100vh; }