/**
 * Pukiebook design tokens.
 * Source of truth: rosa #f5245f + navy #1c1f2f (donations-board / skin).
 *
 * This file ONLY defines CSS custom properties.
 * It does not restyle existing components.
 * New UI (progress bars, donation board, live timing) must consume these variables.
 */
:root {
    --pkb-color-primary: #f5245f;
    --pkb-color-primary-hover: #ff6b93;
    --pkb-color-primary-deep: #c2184a;
    --pkb-color-primary-rgb: 245, 36, 95;
    --pkb-color-primary-hover-rgb: 255, 107, 147;
    --pkb-color-black: #1c1f2f;
    --pkb-color-white: #ffffff;
    --pkb-color-gray-dark: #2c2f33;

    --pkb-color-bg: #ffffff;
    --pkb-color-surface: #ffffff;
    --pkb-color-surface-2: #f7f8f9;
    --pkb-color-text: #1a1d22;
    --pkb-color-muted: #6b7385;
    --pkb-color-border: rgba(28, 31, 47, 0.08);
    --pkb-color-glow: rgba(245, 36, 95, 0.28);

    --pkb-brand: var(--pkb-color-primary);
    --pkb-navy: var(--pkb-color-black);
}

body.dark-mode {
    --pkb-color-bg: #121212;
    --pkb-color-surface: #24272b;
    --pkb-color-surface-2: #2a2d36;
    --pkb-color-text: #ffffff;
    --pkb-color-muted: #9aa3b5;
    --pkb-color-border: rgba(255, 255, 255, 0.08);
    --pkb-color-glow: rgba(245, 36, 95, 0.4);
}