/*
 * Minimal runtime token seed values for SSR/no-JS mode.
 * The remote design-system tokens.css stays the source of truth and overrides
 * these values when it loads successfully. This file only prevents layout and
 * icon geometry from collapsing when external tokens are temporarily missing.
 */
:root {
  --app-font-family-base:
    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --app-font-family-mono:
    ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  --font-size-body-default: 16px;
  --font-weight-regular: 400;

  --border-width-default: 1px;
  --border-radius-button: 12px;
  --border-radius-layout: 24px;
  --border-radius-pill: 9999px;

  --motion-duration-default: 200ms;
  --motion-easing-default: ease;

  --opacity-low: 0.45;

  --spacing-2: 2px;
  --spacing-4: 4px;
  --spacing-6: 6px;
  --spacing-8: 8px;
  --spacing-10: 10px;
  --spacing-12: 12px;
  --spacing-14: 14px;
  --spacing-16: 16px;
  --spacing-18: 18px;
  --spacing-20: 20px;
  --spacing-24: 24px;
  --spacing-32: 32px;

  --size-icon-small: 16px;
  --size-icon-default: 20px;
  --size-icon-medium: 20px;
  --size-icon-large: 24px;

  --size-button-small: 32px;
  --size-button-default: 40px;
  --size-button-large: 48px;
  --size-button-height-default: 40px;

  --color-surface-0: #f5f5f6;
  --color-surface-1: #ffffff;
  --color-surface-2: #f1f1f2;
  --color-border-primary: #e5e5e7;
  --color-text-primary: #2f3034;
  --color-text-secondary: #878b94;
}

html,
body {
  min-height: 100%;
  margin: 0;
}

body {
  background: var(--color-surface-0);
  color: var(--color-text-primary);
  font-family: var(--app-font-family-base);
  font-size: var(--font-size-body-default);
}

#app {
  min-height: 100vh;
}