/* UnTrap 2027 public website. Semantic tokens; app/extension themes are separate. */
:root {
  --ut-page: #f8fafd;
  --ut-page-alt: #f0f3f8;
  --ut-surface: #fff;
  --ut-surface-muted: #f5f7fa;
  --ut-text: #111722;
  --ut-text-muted: #606e83;
  /* Essential small text and interactive outlines use stronger AA values. */
  --ut-text-subtle: #606e83;
  --ut-divider: #dfe5ed;
  --ut-control-border: #7b8799;
  --ut-primary: #20252d;
  --ut-primary-hover: #303741;
  --ut-primary-active: #15191f;
  --ut-on-primary: #fff;
  --ut-control-hover: #f0f3f8;
  --ut-control-active: #e4e9f0;
  --ut-focus: #617fa7;
  --ut-disabled: #e4e9f0;
  --ut-danger: #a42636;
  --ut-danger-surface: #fcebed;
  --ut-danger-active: #f8d8de;
  --ut-radius-control: 10px;
  --ut-radius-card: 16px;
  --ut-space-1: 4px;
  --ut-space-2: 8px;
  --ut-space-3: 12px;
  --ut-space-4: 16px;
  --ut-space-6: 24px;
  --ut-space-8: 32px;
  --ut-space-12: 48px;
  --ut-space-16: 64px;
  --ut-space-20: 80px;
  --ut-space-30: 120px;
  --ut-container: 1200px;
  --ut-gutter: clamp(20px, 5vw, 80px);
  --ut-font: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
  --ut-motion: 160ms;
}
[data-ut-theme="dark"] {
  --ut-page: #111820;
  --ut-page-alt: #151c25;
  --ut-surface: #1b242e;
  --ut-surface-muted: #151c25;
  --ut-text: #f5f7fa;
  --ut-text-muted: #aab5c4;
  --ut-text-subtle: #aab5c4;
  --ut-divider: #35404d;
  --ut-control-border: #8795a8;
  --ut-primary: #f5f7fa;
  --ut-primary-hover: #fff;
  --ut-primary-active: #dfe5ed;
  --ut-on-primary: #111820;
  --ut-control-hover: #26313d;
  --ut-control-active: #35404d;
  --ut-focus: #9db6d8;
  --ut-disabled: #26313d;
  --ut-danger: #ffb5bd;
  --ut-danger-surface: #45262f;
  --ut-danger-active: #5b2d37;
}
/* Existing offer component API maps to the same semantic palette. */
:root, [data-ut-theme] {
  --ut-action: var(--ut-primary);
  --ut-action-hover: var(--ut-primary-hover);
  --ut-action-active: var(--ut-primary-active);
  --ut-action-text: var(--ut-on-primary);
  --ut-border: var(--ut-control-border);
  --ut-ink: var(--ut-text);
  --ut-hover: var(--ut-control-hover);
  --ut-pressed: var(--ut-control-active);
  --ut-muted: var(--ut-text-muted);
}
@media (prefers-reduced-motion: reduce) {
  :root { --ut-motion: 0ms; }
}