:root {
    --green-50:   #F0FFF4;
    --green-100:  #DCFCE7;
    --green-200:  #BBF7D0;
    --green-300:  #86EFAC;
    --green-400:  #4ADE80;
    --green-500:  #52B788;
    --green-600:  #40916C;
    --green-700:  #2D6A4F;
    --green-800:  #1B4332;
    --green-900:  #0D2818;

    --color-primary:       #124223;
    --color-primary-dark:  #0f311a;
    --color-accent:        var(--green-500);
    --color-accent-hover:  var(--green-600);

    --color-text:          #111827;
    --color-text-secondary:#374151;
    --color-text-muted:    #6B7280;

    --color-bg:            #FFFFFF;
    --color-bg-gray:       #F4F4F4;
    --color-bg-dark:       var(--green-800);

    --color-border:        #E5E7EB;
    --color-border-focus:  var(--green-600);

    --color-error:         #E63946;
    --color-warning:       #F4A261;
    --color-success:       var(--green-600);

    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --text-xs:   0.75rem;
    --text-sm:   0.875rem;
    --text-base: 1rem;
    --text-lg:   1.125rem;
    --text-xl:   1.25rem;
    --text-2xl:  1.5rem;
    --text-3xl:  1.875rem;
    --text-4xl:  2.25rem;
    --text-5xl:  3rem;
    --text-6xl:  3.75rem;

    --radius-sm:  4px;
    --radius-md:  8px;
    --radius-lg:  16px;
    --radius-xl:  24px;
    --radius-full: 9999px;

    --shadow-sm:  0 1px 2px rgba(0,0,0,0.05);
    --shadow-md:  0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
    --shadow-lg:  0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
    --shadow-xl:  0 24px 38px -18px rgba(0,0,0,0.2);

    --transition: 200ms ease;

    --container-max: 1280px;
    --container-px:  1.5rem;
}