/* MemeGPT — caption-bar black, highlighter yellow, impact-font energy. */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Archivo:wght@400;500;600;700&family=Inter:wght@300;400;500;600&display=swap');

:root {
  /* Surfaces */
  --color-bg:             #ffd60a;
  --color-bg-alt:         #fff3b8;
  --color-ink:            #101010;
  --color-ink-soft:       #1c1c1c;
  --color-surface:        #ffffff;
  --color-border:         #101010;

  /* Accents */
  --color-magenta:        #e4007c;
  --color-cyan:           #00b7c7;

  /* Text */
  --color-text:           #101010;
  --color-text-secondary: #3c3a2e;
  --color-text-muted:     #6b6857;
  --color-text-invert:    #fffdf2;

  /* Typography */
  --font-display: 'Archivo Black', 'Archivo', system-ui, sans-serif;
  --font-ui:      'Inter', system-ui, -apple-system, sans-serif;

  /* Type scale */
  --text-hero:       clamp(2.5rem, 6.5vw, 4.5rem);
  --text-display-lg: clamp(1.75rem, 3.5vw, 2.5rem);
  --text-display-md: 1.375rem;
  --text-body-lg:    1.125rem;
  --text-body-md:    1rem;
  --text-label:      0.75rem;

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1.25rem;
  --space-lg: 2rem;
  --space-xl: 3.5rem;
  --space-2xl: 5.5rem;

  /* Shape */
  --radius:    0px;
  --radius-lg: 0px;
  --shadow:    6px 6px 0 var(--color-ink);
  --shadow-lg: 12px 12px 0 var(--color-ink);
  --maxw:      1080px;
}
