.theme {
  --color-accent:         #2196F3;
  --color-accent-dark:    #1976D2;
  --color-highlight:      #FFC107;
  --color-text-primary:   #000;
  --color-text-muted:     #9E9E9E;
  --color-background:     #FAFAFA;
  --color-surface:        #FFFFFF;
  --color-border:         #E0E0E0;
  --font-family-display:  'Montserrat', sans-serif;
  --font-family-body:     -apple-system, BlinkMacSystemFont, 'Segoe UI',
                            Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-weight-regular:  400;
  --font-weight-bold:     600;
  --font-size-hero:       36px;
  --font-size-title:      32px;
  --font-size-heading:    16px;
  --font-size-body:       18px;
  --font-size-small:      14px;
  --line-height-tight:    1.2;
  --line-height-base:     1.5;
  --letter-spacing-tight: 0.5px;
  --letter-spacing-wide:  2px;
  --space-2xs:            2px;
  --space-xs:             4px;
  --space-sm:             8px;
  --space-md:             16px;
  --space-lg:             24px;
  --space-xl:             32px;
  --space-2xl:            40px;
  --space-3xl:            48px;
  --space-4xl:            64px;
  --size-container-max:   850px;
  --size-photo:           160px;
  --size-tile-width:      250px;
  --size-tile-min-height: 200px;
  --size-nav-height:      40px;
  --border-width:         1px;
  --border-radius-button: 3px;
  --border-radius-circle: 50%;
  --shadow-card-hover:    0 6px 18px rgba(0, 0, 0, 0.1);
  --transition-quick:     150ms ease;
  --transition-medium:    200ms ease;
  font-family: var(--font-family-body);
  font-size: var(--font-size-body);
  line-height: var(--line-height-base);
  color: var(--color-text-primary);
  background: var(--color-background); }