:root {
  /* ===== QUICK THEME: edit these values to retheme the whole kiosk ===== */
  --color-primary: #ff7a45;
  --color-primary-dark: #e96330;
  --color-primary-soft: #fff0e9;
  --color-primary-border: rgba(255, 122, 69, 0.35);
  --color-primary-glow: rgba(255, 122, 69, 0.18);
  --color-background: #f7f5f2;
  --color-canvas-bg: #dedbd7;
  --color-surface: #ffffff;
  --color-surface-soft: #fbfaf8;
  --color-text: #171717;
  --color-text-muted: #77736e;
  --color-border: #eae6e1;
  --color-success: #2e9b68;
  --color-danger: #d9534f;

  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --radius-pill: 999px;

  --shadow-soft: 0 18px 50px rgba(37, 29, 23, 0.08);
  --shadow-card: 0 8px 24px rgba(37, 29, 23, 0.06);
  --shadow-card-hover: 0 14px 32px rgba(37, 29, 23, 0.10);
  --shadow-primary: 0 8px 20px rgba(255, 122, 69, 0.28);
  --shadow-primary-hover: 0 12px 28px rgba(255, 122, 69, 0.38);
  --shadow-button-active: 0 3px 8px rgba(255, 122, 69, 0.20);

  /* Transitions (Snappy & subtle 150ms-280ms range) */
  --transition-fast: 160ms cubic-bezier(0.2, 0, 0, 1);
  --transition-normal: 220ms cubic-bezier(0.2, 0, 0, 1);
  --transition-smooth: 280ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-screen: 220ms cubic-bezier(0.16, 1, 0.3, 1);

  /* Touch guidelines & Focus */
  --touch-target-min: 48px;
  --focus-ring: 3px solid rgba(255, 122, 69, 0.55);
  --focus-offset: 3px;

  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 20px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;
  --space-9: 64px;

  --kiosk-width: 1920px;
  --kiosk-height: 1080px;
  --content-max-width: 1720px;

  --font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}