:root {
    --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-sans-ar: "Segoe UI", Tahoma, "Noto Sans Arabic", sans-serif;
    --font-display: var(--font-sans);

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-7: 2rem;
    --space-8: 2.5rem;
    --space-9: 3rem;
    --space-10: 4rem;

    --radius-xs: 0.5rem;
    --radius-sm: 0.875rem;
    --radius-md: 1.25rem;
    --radius-lg: 1.75rem;
    --radius-pill: 999px;

    --shadow-1: 0 10px 30px rgba(15, 23, 42, 0.05);
    --shadow-2: 0 18px 48px rgba(15, 23, 42, 0.09);
    --shadow-3: 0 30px 60px rgba(15, 23, 42, 0.12);

    --layout-sidebar: 17rem;
    --layout-content-max: 88rem;
    --layout-public-max: 76rem;

    --transition-fast: 140ms ease;
    --transition-base: 220ms ease;

    --color-bg: #f4f5f1;
    --color-canvas: #fbfbf8;
    --color-surface: #ffffff;
    --color-surface-muted: #edf2f4;
    --color-surface-strong: #dfe7ec;
    --color-sidebar: #101827;
    --color-sidebar-muted: #8da0bf;
    --color-sidebar-muted-rgb: 141, 160, 191;
    --color-sidebar-border: rgba(235, 241, 255, 0.09);
    --color-text: #101723;
    --color-text-soft: #606a7c;
    --color-text-faint: #8791a3;
    --color-border: #d8e1e7;
    --color-border-strong: #c0ccd5;
    --color-accent: #0da678;
    --color-accent-rgb: 13, 166, 120;
    --color-accent-strong: #08765f;
    --color-accent-soft: #dff6ee;
    --color-brand-secondary: #8da0bf;
    --color-brand-secondary-rgb: 141, 160, 191;
    --color-brand-secondary-soft: #adbcd1;
    --color-gold: #b38a20;
    --color-gold-soft: #f6ecd1;
    --color-success: #0d9964;
    --color-success-soft: #dcf5ea;
    --color-warning: #bc7d18;
    --color-warning-soft: #fff0d7;
    --color-danger: #cb4e4d;
    --color-danger-soft: #fdecea;
    --color-info: #4467cf;
    --color-info-soft: #e8efff;
    --color-black-panel: #0b111b;
    --color-overlay: rgba(5, 10, 20, 0.52);

    --gradient-app: linear-gradient(180deg, #f8fafb 0%, #f4f5f1 100%);
    --gradient-public: radial-gradient(circle at top left, rgba(13, 166, 120, 0.09), transparent 40%), linear-gradient(180deg, #f8faf8 0%, #f2f3ef 100%);
}