/* Streamea design tokens — generated from tokens.json. Fonts resolve relative to this file. */
@font-face { font-family: 'Inter'; src: url('fonts/Inter-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('fonts/Inter-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('fonts/Inter-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Streamea Glagolitic'; src: url('fonts/StreameaGlagolitic-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
:root {
  --paper: #ffffff;
  --paper-2: #f4f4f5;
  --ink: #0b0b0c;
  --ink-2: #3d3d40;
  --ink-muted: #5e5e62;
  --line-strong: #8a8a8e;
  --line: #dcdcde;
  --rain-head: var(--ink-muted);
  --rain-trail: #c6c6c9;
  --rain-fade: #e6e6e8;
  --ink-surface: var(--ink);
  --ink-surface-2: #1c1c1e;
  --on-ink: #ffffff;
  --on-ink-muted: #a3a3a7;
  --on-ink-line: #3d3d40;
  --focus-ring: var(--ink);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --space-32: 128px;
  --space-48: 192px;
  --radius-0: 0;
  --radius-2: 2px;
  --radius-full: 9999px;
  --container-max: 1440px;
  --measure: 68ch;
  --header-height: 64px;
  --hairline: 1px;
  --control-height: 44px;
  --control-height-lg: 56px;
  --font-display: Inter, "Helvetica Neue", Arial, sans-serif;
  --font-text: Arial, Arimo, "Liberation Sans", "Helvetica Neue", Helvetica, sans-serif;
  --font-glag: "Streamea Glagolitic", "Noto Sans Glagolitic", "Segoe UI Historic", serif;
}
.display-xl { font-family: var(--font-display); font-size: 96px; line-height: 0.95; font-weight: 500; letter-spacing: -0.025em; }
.display-l { font-family: var(--font-display); font-size: 64px; line-height: 1; font-weight: 500; letter-spacing: -0.025em; }
.heading-1 { font-family: var(--font-display); font-size: 40px; line-height: 1.1; font-weight: 500; letter-spacing: -0.025em; }
.heading-2 { font-family: var(--font-display); font-size: 28px; line-height: 1.2; font-weight: 500; letter-spacing: -0.02em; }
.heading-3 { font-family: var(--font-display); font-size: 20px; line-height: 1.3; font-weight: 500; letter-spacing: -0.01em; }
.label { font-family: var(--font-display); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.button { font-family: var(--font-display); font-size: 15px; line-height: 20px; font-weight: 500; letter-spacing: -0.01em; }
.body-l { font-family: var(--font-text); font-size: 20px; line-height: 30px; font-weight: 400; letter-spacing: normal; }
.body { font-family: var(--font-text); font-size: 16px; line-height: 24px; font-weight: 400; letter-spacing: normal; }
.body-s { font-family: var(--font-text); font-size: 14px; line-height: 20px; font-weight: 400; letter-spacing: normal; }
.body-inter { font-family: var(--font-display); font-size: 16px; line-height: 24px; font-weight: 400; letter-spacing: -0.011em; }
.glyph-display { font-family: var(--font-glag); font-size: 96px; line-height: 1; font-weight: 400; letter-spacing: normal; }
.glyph-body { font-family: var(--font-glag); font-size: 16px; line-height: 24px; font-weight: 400; letter-spacing: normal; }
.glyph-rain { font-family: var(--font-glag); font-size: 18px; line-height: 22px; font-weight: 400; letter-spacing: normal; }