:root {
  color-scheme: light;

  /* Marca e papeis semanticos */
  --color-primary: #d31324;
  --color-primary-strong: #a90c19;
  --color-secondary: #0959c7;
  --color-secondary-strong: #064293;
  --color-accent: #ffd323;
  --color-background: #f7f3e8;
  --color-surface: #ffffff;
  --color-surface-strong: #ece5d5;
  --color-foreground: #101014;
  --color-muted: #514f57;
  --color-border: #101014;
  --color-on-primary: #ffffff;
  --color-on-secondary: #ffffff;
  --color-on-accent: #101014;
  --color-success: #177245;
  --color-warning: #8a5900;
  --color-error: #b42318;
  --color-focus: #ffd323;

  /* Tipografia sem dependencia externa */
  --font-display: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  --font-heading: "Arial Black", Arial, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --font-label: "Arial Narrow", Arial, sans-serif;
  --font-caption: Arial, Helvetica, sans-serif;
  --font-mono: Consolas, monospace;
  --step--1: 0.875rem;
  --step-0: 1rem;
  --step-1: clamp(1.125rem, 1.05rem + 0.3vw, 1.35rem);
  --step-2: clamp(1.5rem, 1.3rem + 0.8vw, 2rem);
  --step-3: clamp(2rem, 1.45rem + 2vw, 3.5rem);
  --step-4: clamp(3rem, 1.8rem + 5vw, 6.75rem);
  --leading-display: 0.9;
  --leading-heading: 1.05;
  --leading-body: 1.6;
  --leading-label: 1.2;
  --leading-caption: 1.35;

  /* Ritmo */
  --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;
  --space-9: 6rem;

  /* Layout e forma */
  --shell: 76rem;
  --gutter: 1rem;
  --measure: 68ch;
  --measure-narrow: 48ch;
  --header-height: 4.75rem;
  --touch-target: 44px;
  --radius-control: 6px;
  --border-control: 2px;
  --border-panel: 3px;
  --shadow-hard: 4px 4px 0 var(--color-foreground);
  --shadow-hard-raised: 7px 7px 0 var(--color-foreground);
  --focus-ring: 3px;
  --focus-offset: 3px;

  /* Movimento */
  --duration-fast: 140ms;
  --duration-base: 240ms;
  --duration-slow: 480ms;
  --duration-story: 720ms;
  --ease-main: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-enter: cubic-bezier(0.16, 1, 0.3, 1);

  /* Camadas */
  --z-base: 0;
  --z-sticky: 20;
  --z-drawer: 40;
  --z-overlay: 50;
  --z-toast: 60;

  /* Valores escritos por JavaScript */
  --scroll-progress: 0;
  --hero-shift: 0px;
}

@media (min-width: 48rem) {
  :root { --gutter: 1.5rem; }
}

@media (min-width: 64rem) {
  :root { --gutter: 2rem; }
}