/* Shared design tokens and base reset for the public GOAT surfaces
   (landing, SSR list, SSR details). See /DESIGN.md for the semantic
   meaning of each token. */

:root {
  color-scheme: light;

  --background: #f4f6f2;
  --surface: #ffffff;
  --surface-elevated: #ffffff;
  --surface-subtle: #edf1eb;
  --border: #d5ddd4;
  --border-strong: #aebbad;

  --text: #18231c;
  --text-muted: #526055;
  --text-subtle: #6c786e;

  --primary: #176447;
  --primary-hover: #0f5339;
  --primary-active: #0d432f;
  --focus: #247a5a;
  --success: #166b4a;
  --warning: #996b11;
  --danger: #aa3f34;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;

  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;
  --control-height: 2.5rem;

  --layout-max: 70rem;
  --layout-gutter: clamp(var(--space-4), 3.5vw, var(--space-6));
  --layout-prose: 62ch;
  --layout-hero-space: clamp(var(--space-6), 5vw, var(--space-8));
  --layout-section-space: clamp(var(--space-7), 7vw, var(--space-8));
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  font-family: "Segoe UI Variable", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--text);
  background: var(--background);
}

.shell {
  width: min(var(--layout-max), 100%);
  margin: 0 auto;
}