/* Shared page chrome for every SMS 1984 HTML page: CSS reset, design tokens
   (light + dark), text-selection color, and the skip-to-content link. Loaded via
   <link rel="stylesheet" href="shared/page-chrome.css"> before each page's inline
   <style>. This is the single source of truth for the design tokens — do not
   re-declare :root/[data-theme="dark"] token blocks in individual pages. */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --cream: #f5f0e8;
  --cream-dark: #e8e0d0;
  --ink: #1a1a1a;
  --ink-light: #444;
  --ink-faint: #666;
  /* Darkened from #b85c38 (4.00:1, failed WCAG AA-normal on --cream) to 4.5:1+
     on both --cream (5.39:1) and --cream-dark (4.66:1) for body-size text. */
  --rust: #9f482b;
  --rust-light: rgba(159, 72, 43, 0.15);
  --rust-dark: #8a3f24;
  --teal: #2a6b6b;
  --warn: #c0392b;
  --font-title: 'Bebas Neue', Impact, 'Arial Narrow', sans-serif;
  --font-label: 'IBM Plex Mono', 'Courier New', Courier, monospace;
  --font-body: Helvetica, 'Helvetica Neue', Arial, sans-serif;
}

[data-theme="dark"] {
  --cream: #0f1923;
  --cream-dark: #162230;
  --ink: #e0dfe6;
  --ink-light: #a0a8b8;
  --ink-faint: #7a8598;
  --rust: #ff3c8f;
  --rust-light: rgba(255, 60, 143, 0.15);
  --rust-dark: #ff6aaa;
  --teal: #00e5ff;
  --warn: #ff4757;
}

::selection {
  background: var(--rust);
  color: var(--cream);
}

.skip-link {
  position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden;
  font-family: var(--font-label); font-size: 13px; padding: 8px 16px;
  background: var(--rust); color: #fff; text-decoration: none; z-index: 9999;
}
.skip-link:focus { position: fixed; left: 8px; top: 8px; width: auto; height: auto; overflow: visible; }

/* Visually hidden but exposed to assistive tech — e.g. polite live-status regions. */
.sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}