/* ================================================
   Design Tokens - Generated from 'warm' profile
   ================================================
   DO NOT EDIT - This file is auto-generated.
   Run: python manage.py generate_tokens
   ================================================ */

:root {

    /* Brand Colors */
    --pw-brand-primary: #E85D4C;
    --pw-brand-secondary: #D4915C;
    --pw-brand-primary-light: #F06B5A;
    --pw-brand-primary-dark: #D24A3A;

    /* Neutrals */
    --pw-black: #1E1D1B;
    --pw-gray-900: #262523;
    --pw-gray-800: #2E2D2A;
    --pw-gray-700: #3A3935;
    --pw-gray-600: #4A4842;
    --pw-gray-500: #605D55;
    --pw-gray-400: #7A756A;
    --pw-gray-300: #A8A295;
    --pw-gray-200: #D6CFC4;
    --pw-gray-100: #EFEBE4;
    --pw-gray-50: #FAF7F0;
    --pw-white: #F5EFD9;
    --pw-ink: #2C2925;
    --pw-pencil: #6B665C;
    --pw-accent-light: #D4624A;

    /* Semantic Colors (Dark Mode Default) */
    --pw-bg: var(--pw-black);
    --pw-bg-chrome: var(--pw-gray-900);
    --pw-bg-elevated: var(--pw-gray-800);
    --pw-bg-surface: var(--pw-gray-800);
    --pw-bg-subtle: var(--pw-gray-700);
    --pw-text: var(--pw-white);
    --pw-text-muted: rgba(253, 252, 249, 0.72);
    --pw-text-subtle: rgba(253, 252, 249, 0.55);
    --pw-text-faint: rgba(253, 252, 249, 0.40);
    --pw-text-disabled: rgba(253, 252, 249, 0.25);
    --pw-border: rgba(253, 252, 249, 0.08);
    --pw-border-subtle: rgba(253, 252, 249, 0.04);
    --pw-border-strong: rgba(253, 252, 249, 0.15);
    --pw-accent: var(--pw-brand-primary);
    --pw-accent-hover: var(--pw-brand-primary-light);
    --pw-accent-muted: rgba(232, 93, 76, 0.12);
    --pw-accent-text: var(--pw-brand-primary);
    --pw-hover: rgba(253, 252, 249, 0.04);
    --pw-active: rgba(253, 252, 249, 0.08);
    --pw-success: #4A9D7C;
    --pw-success-muted: rgba(74, 157, 124, 0.12);
    --pw-error: #D94F4F;
    --pw-error-muted: rgba(217, 79, 79, 0.12);
    --pw-warning: #D4915C;
    --pw-warning-muted: rgba(212, 145, 92, 0.12);
    --pw-info: #6B8FA3;
    --pw-info-muted: rgba(107, 143, 163, 0.12);

    /* Typography */
    --pw-font-display: 'DM Sans', system-ui, sans-serif;
    --pw-font-body: 'DM Sans', system-ui, sans-serif;
    --pw-text-display-size: 3.75rem;
    --pw-text-display-weight: 700;
    --pw-text-display-line-height: 1.05;
    --pw-text-display-letter-spacing: -0.02em;
    --pw-text-h1-size: 2.75rem;
    --pw-text-h1-weight: 700;
    --pw-text-h1-line-height: 1.15;
    --pw-text-h1-letter-spacing: -0.015em;
    --pw-text-h2-size: 2rem;
    --pw-text-h2-weight: 700;
    --pw-text-h2-line-height: 1.2;
    --pw-text-h2-letter-spacing: -0.01em;
    --pw-text-h3-size: 1.5rem;
    --pw-text-h3-weight: 600;
    --pw-text-h3-line-height: 1.3;
    --pw-text-h3-letter-spacing: -0.005em;
    --pw-text-h4-size: 1.25rem;
    --pw-text-h4-weight: 600;
    --pw-text-h4-line-height: 1.4;
    --pw-text-h4-letter-spacing: 0;
    --pw-text-body-lg-size: 1.125rem;
    --pw-text-body-lg-weight: 400;
    --pw-text-body-lg-line-height: 1.7;
    --pw-text-body-lg-letter-spacing: 0.005em;
    --pw-text-body-size: 1rem;
    --pw-text-body-weight: 400;
    --pw-text-body-line-height: 1.65;
    --pw-text-body-letter-spacing: 0.005em;
    --pw-text-body-sm-size: 0.875rem;
    --pw-text-body-sm-weight: 400;
    --pw-text-body-sm-line-height: 1.55;
    --pw-text-body-sm-letter-spacing: 0.01em;
    --pw-text-label-size: 0.75rem;
    --pw-text-label-weight: 500;
    --pw-text-label-line-height: 1.4;
    --pw-text-label-letter-spacing: 0.03em;

    /* Spacing */
    --pw-space-xs: 0.25rem;
    --pw-space-sm: 0.5rem;
    --pw-space-md: 1rem;
    --pw-space-lg: 1.5rem;
    --pw-space-xl: 2rem;
    --pw-space-2xl: 3rem;
    --pw-space-3xl: 4rem;
    --pw-space-4xl: 6rem;

    /* Border Radius */
    --pw-radius-none: 0;
    --pw-radius-sm: 0.25rem;
    --pw-radius: 0.375rem;
    --pw-radius-md: 0.5rem;
    --pw-radius-lg: 0.75rem;
    --pw-radius-xl: 1rem;
    --pw-radius-2xl: 1.5rem;
    --pw-radius-full: 9999px;

    /* Shadows */
    --pw-shadow-sm: 0 1px 3px rgba(18, 18, 16, 0.1);
    --pw-shadow: 0 2px 6px rgba(18, 18, 16, 0.12);
    --pw-shadow-md: 0 4px 12px rgba(18, 18, 16, 0.14);
    --pw-shadow-lg: 0 8px 24px rgba(18, 18, 16, 0.18);
    --pw-shadow-xl: 0 16px 48px rgba(18, 18, 16, 0.22);
    --pw-shadow-glow: 0 0 40px rgba(232, 93, 76, 0.18);
    --pw-shadow-glow-sm: 0 0 24px rgba(232, 93, 76, 0.12);
    --pw-shadow-glow-amber: 0 0 40px rgba(212, 145, 92, 0.15);

    /* Effects */
    --pw-gradient: linear-gradient(135deg, #E85D4C 0%, #D4915C 100%);
    --pw-gradient-primary: linear-gradient(135deg, #E85D4C 0%, #F06B5A 100%);
    --pw-grid-line: rgba(212, 145, 92, 0.02);
    --pw-grid-line-light: rgba(212, 145, 92, 0.04);
}

/* Light Mode - System Preference */
@media (prefers-color-scheme: light) {
    :root:not(.dark) {
        --pw-bg: #FAF6EA;
        --pw-bg-chrome: #EDE5C8;
        --pw-bg-elevated: #FEFCF6;
        --pw-bg-surface: var(--pw-gray-100);
        --pw-bg-subtle: var(--pw-gray-200);
        --pw-text: var(--pw-ink);
        --pw-text-muted: #4F4A40;
        --pw-text-subtle: #5F594E;
        --pw-text-faint: #716B5E;
        --pw-text-disabled: #C4BEB4;
        --pw-border: rgba(44, 41, 37, 0.12);
        --pw-border-subtle: rgba(44, 41, 37, 0.06);
        --pw-border-strong: rgba(44, 41, 37, 0.20);
        --pw-accent: var(--pw-accent-light);
        --pw-accent-hover: #C4573F;
        --pw-accent-muted: rgba(212, 98, 74, 0.12);
        --pw-accent-secondary-muted: rgba(212, 145, 92, 0.12);
        --pw-hover: rgba(44, 41, 37, 0.04);
        --pw-active: rgba(44, 41, 37, 0.08);
        --pw-success: #5A8F70;
        --pw-success-muted: rgba(90, 143, 112, 0.12);
        --pw-error: #C54D4D;
        --pw-error-muted: rgba(197, 77, 77, 0.12);
        --pw-warning: #C4854A;
        --pw-warning-muted: rgba(196, 133, 74, 0.12);
        --pw-info: #5A7A8A;
        --pw-info-muted: rgba(90, 122, 138, 0.12);
        --pw-grid-line: rgba(212, 145, 92, 0.04);
    }
}

/* Light Mode - Manual Override */
:root.light {
    --pw-bg: #FAF6EA;
    --pw-bg-chrome: #EDE5C8;
    --pw-bg-elevated: #FEFCF6;
    --pw-bg-surface: var(--pw-gray-100);
    --pw-bg-subtle: var(--pw-gray-200);
    --pw-text: var(--pw-ink);
    --pw-text-muted: #4F4A40;
    --pw-text-subtle: #5F594E;
    --pw-text-faint: #716B5E;
    --pw-text-disabled: #C4BEB4;
    --pw-border: rgba(44, 41, 37, 0.12);
    --pw-border-subtle: rgba(44, 41, 37, 0.06);
    --pw-border-strong: rgba(44, 41, 37, 0.20);
    --pw-accent: var(--pw-accent-light);
    --pw-accent-hover: #C4573F;
    --pw-accent-muted: rgba(212, 98, 74, 0.12);
    --pw-accent-secondary-muted: rgba(212, 145, 92, 0.12);
    --pw-hover: rgba(44, 41, 37, 0.04);
    --pw-active: rgba(44, 41, 37, 0.08);
    --pw-success: #5A8F70;
    --pw-success-muted: rgba(90, 143, 112, 0.12);
    --pw-error: #C54D4D;
    --pw-error-muted: rgba(197, 77, 77, 0.12);
    --pw-warning: #C4854A;
    --pw-warning-muted: rgba(196, 133, 74, 0.12);
    --pw-info: #5A7A8A;
    --pw-info-muted: rgba(90, 122, 138, 0.12);
    --pw-grid-line: rgba(212, 145, 92, 0.04);
}

/* ================================================
   Utility Classes
   ================================================ */

/* Typography */
.text-pw-display {
    font-size: var(--pw-text-display-size);
    font-weight: var(--pw-text-display-weight);
    line-height: var(--pw-text-display-line-height);
    letter-spacing: var(--pw-text-display-letter-spacing);
}

.text-pw-h1 {
    font-size: var(--pw-text-h1-size);
    font-weight: var(--pw-text-h1-weight);
    line-height: var(--pw-text-h1-line-height);
    letter-spacing: var(--pw-text-h1-letter-spacing);
}

.text-pw-h2 {
    font-size: var(--pw-text-h2-size);
    font-weight: var(--pw-text-h2-weight);
    line-height: var(--pw-text-h2-line-height);
    letter-spacing: var(--pw-text-h2-letter-spacing);
}

.text-pw-h3 {
    font-size: var(--pw-text-h3-size);
    font-weight: var(--pw-text-h3-weight);
    line-height: var(--pw-text-h3-line-height);
    letter-spacing: var(--pw-text-h3-letter-spacing);
}

.text-pw-h4 {
    font-size: var(--pw-text-h4-size);
    font-weight: var(--pw-text-h4-weight);
    line-height: var(--pw-text-h4-line-height);
    letter-spacing: var(--pw-text-h4-letter-spacing);
}

.text-pw-body-lg {
    font-size: var(--pw-text-body-lg-size);
    font-weight: var(--pw-text-body-lg-weight);
    line-height: var(--pw-text-body-lg-line-height);
    letter-spacing: var(--pw-text-body-lg-letter-spacing);
}

.text-pw-body {
    font-size: var(--pw-text-body-size);
    font-weight: var(--pw-text-body-weight);
    line-height: var(--pw-text-body-line-height);
    letter-spacing: var(--pw-text-body-letter-spacing);
}

.text-pw-body-sm {
    font-size: var(--pw-text-body-sm-size);
    font-weight: var(--pw-text-body-sm-weight);
    line-height: var(--pw-text-body-sm-line-height);
    letter-spacing: var(--pw-text-body-sm-letter-spacing);
}

.text-pw-label {
    font-size: var(--pw-text-label-size);
    font-weight: var(--pw-text-label-weight);
    line-height: var(--pw-text-label-line-height);
    letter-spacing: var(--pw-text-label-letter-spacing);
}

/* Spacing - Gap */
.gap-pw-xs { gap: var(--pw-space-xs); }
.gap-pw-sm { gap: var(--pw-space-sm); }
.gap-pw-md { gap: var(--pw-space-md); }
.gap-pw-lg { gap: var(--pw-space-lg); }
.gap-pw-xl { gap: var(--pw-space-xl); }
.gap-pw-2xl { gap: var(--pw-space-2xl); }
.gap-pw-3xl { gap: var(--pw-space-3xl); }
.gap-pw-4xl { gap: var(--pw-space-4xl); }

/* Spacing - Padding */
.p-pw-xs { padding: var(--pw-space-xs); }
.px-pw-xs { padding-left: var(--pw-space-xs); padding-right: var(--pw-space-xs); }
.py-pw-xs { padding-top: var(--pw-space-xs); padding-bottom: var(--pw-space-xs); }
.p-pw-sm { padding: var(--pw-space-sm); }
.px-pw-sm { padding-left: var(--pw-space-sm); padding-right: var(--pw-space-sm); }
.py-pw-sm { padding-top: var(--pw-space-sm); padding-bottom: var(--pw-space-sm); }
.p-pw-md { padding: var(--pw-space-md); }
.px-pw-md { padding-left: var(--pw-space-md); padding-right: var(--pw-space-md); }
.py-pw-md { padding-top: var(--pw-space-md); padding-bottom: var(--pw-space-md); }
.p-pw-lg { padding: var(--pw-space-lg); }
.px-pw-lg { padding-left: var(--pw-space-lg); padding-right: var(--pw-space-lg); }
.py-pw-lg { padding-top: var(--pw-space-lg); padding-bottom: var(--pw-space-lg); }
.p-pw-xl { padding: var(--pw-space-xl); }
.px-pw-xl { padding-left: var(--pw-space-xl); padding-right: var(--pw-space-xl); }
.py-pw-xl { padding-top: var(--pw-space-xl); padding-bottom: var(--pw-space-xl); }
.p-pw-2xl { padding: var(--pw-space-2xl); }
.px-pw-2xl { padding-left: var(--pw-space-2xl); padding-right: var(--pw-space-2xl); }
.py-pw-2xl { padding-top: var(--pw-space-2xl); padding-bottom: var(--pw-space-2xl); }
.p-pw-3xl { padding: var(--pw-space-3xl); }
.px-pw-3xl { padding-left: var(--pw-space-3xl); padding-right: var(--pw-space-3xl); }
.py-pw-3xl { padding-top: var(--pw-space-3xl); padding-bottom: var(--pw-space-3xl); }
.p-pw-4xl { padding: var(--pw-space-4xl); }
.px-pw-4xl { padding-left: var(--pw-space-4xl); padding-right: var(--pw-space-4xl); }
.py-pw-4xl { padding-top: var(--pw-space-4xl); padding-bottom: var(--pw-space-4xl); }

/* Spacing - Margin */
.m-pw-xs { margin: var(--pw-space-xs); }
.mx-pw-xs { margin-left: var(--pw-space-xs); margin-right: var(--pw-space-xs); }
.my-pw-xs { margin-top: var(--pw-space-xs); margin-bottom: var(--pw-space-xs); }
.m-pw-sm { margin: var(--pw-space-sm); }
.mx-pw-sm { margin-left: var(--pw-space-sm); margin-right: var(--pw-space-sm); }
.my-pw-sm { margin-top: var(--pw-space-sm); margin-bottom: var(--pw-space-sm); }
.m-pw-md { margin: var(--pw-space-md); }
.mx-pw-md { margin-left: var(--pw-space-md); margin-right: var(--pw-space-md); }
.my-pw-md { margin-top: var(--pw-space-md); margin-bottom: var(--pw-space-md); }
.m-pw-lg { margin: var(--pw-space-lg); }
.mx-pw-lg { margin-left: var(--pw-space-lg); margin-right: var(--pw-space-lg); }
.my-pw-lg { margin-top: var(--pw-space-lg); margin-bottom: var(--pw-space-lg); }
.m-pw-xl { margin: var(--pw-space-xl); }
.mx-pw-xl { margin-left: var(--pw-space-xl); margin-right: var(--pw-space-xl); }
.my-pw-xl { margin-top: var(--pw-space-xl); margin-bottom: var(--pw-space-xl); }
.m-pw-2xl { margin: var(--pw-space-2xl); }
.mx-pw-2xl { margin-left: var(--pw-space-2xl); margin-right: var(--pw-space-2xl); }
.my-pw-2xl { margin-top: var(--pw-space-2xl); margin-bottom: var(--pw-space-2xl); }
.m-pw-3xl { margin: var(--pw-space-3xl); }
.mx-pw-3xl { margin-left: var(--pw-space-3xl); margin-right: var(--pw-space-3xl); }
.my-pw-3xl { margin-top: var(--pw-space-3xl); margin-bottom: var(--pw-space-3xl); }
.m-pw-4xl { margin: var(--pw-space-4xl); }
.mx-pw-4xl { margin-left: var(--pw-space-4xl); margin-right: var(--pw-space-4xl); }
.my-pw-4xl { margin-top: var(--pw-space-4xl); margin-bottom: var(--pw-space-4xl); }

/* Border Radius */
.rounded-pw-none { border-radius: var(--pw-radius-none); }
.rounded-pw-sm { border-radius: var(--pw-radius-sm); }
.rounded-pw { border-radius: var(--pw-radius); }
.rounded-pw-md { border-radius: var(--pw-radius-md); }
.rounded-pw-lg { border-radius: var(--pw-radius-lg); }
.rounded-pw-xl { border-radius: var(--pw-radius-xl); }
.rounded-pw-2xl { border-radius: var(--pw-radius-2xl); }
.rounded-pw-full { border-radius: var(--pw-radius-full); }

/* Shadows */
.shadow-pw-sm { box-shadow: var(--pw-shadow-sm); }
.shadow-pw { box-shadow: var(--pw-shadow); }
.shadow-pw-md { box-shadow: var(--pw-shadow-md); }
.shadow-pw-lg { box-shadow: var(--pw-shadow-lg); }
.shadow-pw-xl { box-shadow: var(--pw-shadow-xl); }
.shadow-pw-glow { box-shadow: var(--pw-shadow-glow); }
.shadow-pw-glow-sm { box-shadow: var(--pw-shadow-glow-sm); }
.shadow-pw-glow-amber { box-shadow: var(--pw-shadow-glow-amber); }
