/* Theme: retro-classic — late-80s / early-90s pixel-art interface.
   A theme only defines custom properties (and optional font-face);
   layout.css and components.css never contain raw colors.
   To add a theme, copy this file, change the values, and swap the <link>. */

@font-face {
  font-family: "Press Start 2P";
  src: url("../../fonts/press-start-2p.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Typography */
  --font-heading: "Press Start 2P", "Courier New", ui-monospace, monospace;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Page: clean white canvas */
  --color-page: #ffffff;
  --color-text: #171717;
  --color-text-muted: #444444;

  /* Panels (warm ivory with beveled edges) */
  --color-panel: #fff8e7;
  --color-panel-hi: #ffffff;
  --color-panel-lo: #c9b88a;
  --color-frame: #222222;

  /* Title bars */
  --color-titlebar: #2455a4;
  --color-titlebar-text: #ffffff;

  /* Accents */
  --color-accent: #f4c542;
  --color-emphasis: #a52a2a;

  /* Pixel geometry */
  --px: 4px;
  --border-width: 4px;
  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --mascot-size: 40px;
}