@import url("https://cdn.jsdelivr.net/gh/0builddotdev/0build@0.4.5/dist/css/kit.min.css");
@import url("https://cdn.jsdelivr.net/gh/0builddotdev/0build@0.4.5/dist/css/chart.min.css");

/* Baguette — light mode
   Navy #002157  ≈  oklch(22% 0.11 263)
   Red  #E2001A  ≈  oklch(49% 0.27 27)
*/
:root {
    --z-bg:     oklch(96% 0.005 260);
    --z-bg-f:   oklch(14% 0.06 263);
    --z-card:   oklch(93% 0.007 260);
    --z-card-f: oklch(14% 0.06 263);
    --z-drop:   oklch(94% 0.007 260);
    --z-drop-f: oklch(14% 0.06 263);

    --z-primary:   oklch(28% 0.12 263);
    --z-primary-f: oklch(98% 0.005 260);

    --z-secondary:   oklch(70% 0.01 260);
    --z-secondary-o: 12%;
    --z-secondary-f: oklch(22% 0.05 263);

    --z-muted:   oklch(74% 0.008 260);
    --z-muted-o: 7%;
    --z-muted-f: oklch(44% 0.04 263);

    --z-accent:   oklch(52% 0.25 27);
    --z-accent-o: 8%;
    --z-accent-f: oklch(98% 0.008 27);

    --z-danger:   oklch(52% 0.25 27);
    --z-danger-f: oklch(98% 0.008 27);
    --z-success:   oklch(56% 0.17 155);
    --z-success-f: oklch(98% 0.01 155);
    --z-warning:   oklch(74% 0.18 72);
    --z-warning-f: oklch(18% 0.05 72);
    --z-info:   oklch(50% 0.18 258);
    --z-info-f: oklch(98% 0.01 258);

    --z-border:   oklch(84% 0.01 260);
    --z-border-o: 65%;
    --z-input:    oklch(84% 0.01 260);
    --z-input-o:  65%;
    --z-focus:    oklch(28% 0.12 263 / 0.35);
}

/* Baguette — dark mode */
html.dark {
    --z-bg:     oklch(12% 0.06 263);
    --z-bg-f:   oklch(95% 0.01 260);
    --z-card:   oklch(17% 0.07 263);
    --z-card-f: oklch(95% 0.01 260);
    --z-drop:   oklch(20% 0.08 263);
    --z-drop-f: oklch(95% 0.01 260);

    --z-primary:   oklch(62% 0.17 258);
    --z-primary-f: oklch(98% 0.005 260);

    --z-secondary:   oklch(28% 0.09 263);
    --z-secondary-o: 20%;
    --z-secondary-f: oklch(88% 0.04 260);

    --z-muted:   oklch(30% 0.07 263);
    --z-muted-o: 15%;
    --z-muted-f: oklch(72% 0.06 260);

    --z-accent:   oklch(58% 0.26 27);
    --z-accent-o: 15%;
    --z-accent-f: oklch(98% 0.01 27);

    --z-danger:   oklch(58% 0.26 27);
    --z-danger-f: oklch(98% 0.01 27);
    --z-success:   oklch(60% 0.18 155);
    --z-success-f: oklch(10% 0.05 155);
    --z-warning:   oklch(78% 0.19 72);
    --z-warning-f: oklch(12% 0.05 72);
    --z-info:   oklch(64% 0.18 258);
    --z-info-f: oklch(10% 0.04 258);

    --z-border:   oklch(30% 0.09 263);
    --z-border-o: 85%;
    --z-input:    oklch(30% 0.09 263);
    --z-input-o:  85%;
    --z-focus:    oklch(62% 0.17 258 / 0.5);
}