/* cachemoney: the design tokens both faces read.

   The landing page at / and the wallet at /app are one origin and one look, so the palette,
   the type and the fonts are defined once here and neither redefines them. Design's handoff
   for the wallet and the handoff for the landing page carry the same values; where they named
   them differently, the wallet's names won, being the larger surface.

   Fonts: Geist and Geist Mono, the latin subsets Google Fonts serves, vendored into
   media/fonts with their licence (SIL OFL 1.1, media/fonts/OFL.txt) and loaded from this
   origin, because a hosted page of ours loads nothing from a third party (D-078). Both are
   variable, so one file per family covers 400 and 500. */

@font-face {
  font-family: "Geist";
  src: url("/media/fonts/geist-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist Mono";
  src: url("/media/fonts/geist-mono-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #0a0a0a;
  --surface: #111111;
  --surface-hover: #161616;

  --text: #f2f2f0;
  --muted: #a3a39c;
  --faint: #8f8f88;
  --placeholder: #6b6b66;

  --line: rgba(255, 255, 255, 0.1);
  --line-strong: rgba(255, 255, 255, 0.14);
  --line-btn: rgba(255, 255, 255, 0.2);

  --accent: #9184d9;
  --accent-text: #c9c2fb;
  --accent-dim: #5c5488;
  --accent-border: rgba(145, 132, 217, 0.45);
  --accent-bg: rgba(145, 132, 217, 0.07);

  --banner-bg: #1c1830;
  --banner-text: #d2cefd;
  --banner-line: rgba(145, 132, 217, 0.35);

  --danger: #f2a4a4;
  --danger-border: rgba(242, 164, 164, 0.4);
  --danger-bg: rgba(242, 120, 120, 0.07);

  /* The outcome nobody chose: a submission whose answer was lost, and the landing page's
     linkability warning. One amber, two places, because they mean the same thing. */
  --warn: #e9c46a;
  --warn-border: rgba(233, 196, 106, 0.45);
  --warn-bg: rgba(233, 196, 106, 0.07);

  --font-sans: "Geist", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --radius: 2px;
  --tap: 44px;
  --content-max: 1040px;
  --gutter: clamp(16px, 4vw, 40px);
}

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

html {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
body { margin: 0; }
