/* Generated by tools/poc-builder from design/tokens/studio810/tokens.json.
 * Do not edit by hand — regenerate instead. Every value below resolves to a
 * published Figma variable (docs/drift-gate.md). */

:root {
  --border-focus-offset: 4px;
  --border-focus-ring: 2px;
  --border-hairline: 1px;
  --color-action-fill-disabled: #ddab97;
  --color-action-fill-hover: #ddab97;
  --color-action-fill-text: #ffffff;
  --color-action-fill: #d4967d;
  --color-action-inverse-fill-disabled: #f6eae5;
  --color-action-inverse-fill-hover: #f6eae5;
  --color-action-inverse-fill: #ffffff;
  --color-action-inverse-text: #d4967d;
  --color-border-focus-inverse: #ffffff;
  --color-border-focus: #303636;
  --color-surface-1: #495a58;
  --color-surface-2: #d4967d;
  --color-surface-3: #ffffff;
  --color-surface-4: #e5e3dc;
  --color-text-accent: #495a58;
  --color-text-ink: #303636;
  --color-text-inverse: #ffffff;
  --radius-control: 15px;
  --space-control-x: 35.2px;
  --space-control-y: 24px;
  --type-family-body: 'PT Serif';
  --type-family-display: 'Marcellus';
  --type-size-body: 16px;
  --type-size-h1: 66.4px;
  --type-size-h2: 46.24px;
  --type-size-h3: 36.16px;
  --type-size-h4: 26.08px;
  --type-size-hero: 232px;
  --type-size-wordmark: 24.4px;
  --type-weight-bold: 700;
  --type-weight-regular: 400;
}

* { box-sizing: border-box; margin: 0; }

body {
  font-family: var(--type-family-body), serif;
  font-size: var(--type-size-body);
  font-weight: var(--type-weight-regular);
  background: var(--color-surface-1);
  color: var(--color-text-inverse);
  padding: var(--space-control-x);
}

.caption {
  margin-bottom: var(--space-control-y);
}

/* Button/Primary, State=Default — Figma set 13:3, variant node 1:5.
 * Fill = studio810/color/action-fill, label = studio810/color/action-fill-text,
 * radius = studio810/radius/control, padding = studio810/space/control-y
 * and control-x, type = studio810/type/*. Mirrors the variant's own
 * variable bindings one-for-one. */
.btn--primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  background: var(--color-action-fill);
  color: var(--color-action-fill-text);
  border-radius: var(--radius-control);
  padding: var(--space-control-y) var(--space-control-x);
  font-family: var(--type-family-body), serif;
  font-size: var(--type-size-body);
  font-weight: var(--type-weight-regular);
}