:root {
    --color-bg: #FAFAFA;
    --color-surface: #FFFFFF;
    --color-surface-alt: #F1F5F9;
    --color-border: #E5E7EB;
    --color-border-strong: #CBD5E1;

    --color-text: #0F172A;
    --color-text-2: #475569;
    --color-text-3: #94A3B8;
    --color-text-inverse: #FFFFFF;

    --color-primary: #0F172A;
    --color-primary-hover: #1E293B;
    --color-primary-fg: #FFFFFF;
    --color-accent: #84CC16;
    --color-accent-hover: #65A30D;
    --color-accent-fg: #1A2E05;
    --color-accent-soft: rgba(132, 204, 22, 0.14);

    --color-on: #16A34A;
    --color-on-bg: #DCFCE7;
    --color-off: #94A3B8;
    --color-off-bg: #F1F5F9;
    --color-danger: #DC2626;
    --color-danger-bg: #FEE2E2;
    --color-warning: #D97706;
    --color-warning-bg: #FEF3C7;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 48px;
    --space-8: 64px;

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-pill: 999px;

    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06);
    --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.10);

    --font-display: 'Space Grotesk', 'Noto Sans JP', system-ui, sans-serif;
    --font-body: 'Inter Tight', 'Noto Sans JP', system-ui, sans-serif;
    --font-num: 'Inter Tight', ui-monospace, monospace;

    --sidebar-width: 240px;
    --header-height: 56px;

    --z-sidebar: 20;
    --z-header: 30;
    --z-overlay: 40;
    --z-modal: 50;

    --t-fast: 150ms ease;
    --t-base: 200ms ease;
    --t-slow: 300ms ease;
}