:root {
    --jc-red: #E31B23;
    --jc-red-deep: #B8141B;
    --jc-orange: #F47A20;
    --jc-orange-warm: #FF9B42;
    --jc-black: #171717;
    --jc-charcoal: #333333;
    --jc-cream: #FFF8F1;
    --jc-grey-soft: #F6F5F3;
    --jc-white: #FFFFFF;
    --jc-success: #278A4B;
    --jc-warning: #C76A00;
    --jc-danger: #B8141B;
    --jc-border: #E7E4E1;
    --jc-muted: #6E6A67;

    --jc-space-1: 4px;
    --jc-space-2: 8px;
    --jc-space-3: 12px;
    --jc-space-4: 16px;
    --jc-space-5: 20px;
    --jc-space-6: 24px;
    --jc-space-8: 32px;
    --jc-space-10: 40px;
    --jc-space-12: 48px;
    --jc-space-16: 64px;
    --jc-space-20: 80px;

    --jc-radius-chip: 8px;
    --jc-radius-control: 12px;
    --jc-radius-card: 16px;
    --jc-radius-large: 20px;
    --jc-radius-sheet: 24px;

    --jc-font-body: 16px;
    --jc-font-meta: 14px;
    --jc-font-product: 17px;
    --jc-font-h3: 22px;
    --jc-font-h2: 30px;
    --jc-font-h1: 38px;
    --jc-font-display: 48px;
    --jc-line-body: 1.55;

    --jc-touch-min: 44px;
    --jc-shell-mobile-header: 126px;
    --jc-shell-mobile-nav: 72px;
    --jc-shell-desktop-header: 84px;

    --jc-shadow-soft: 0 8px 24px rgba(23, 23, 23, 0.08);
    --jc-shadow-float: 0 14px 36px rgba(23, 23, 23, 0.14);
    --jc-transition-fast: 160ms ease;
    --jc-transition-base: 240ms ease;
}