/* Märchenland / Fairypedia – gemeinsame Design-Tokens (lokal, keine externen Fonts) */
:root {
    --ml-font-serif: Georgia, "Times New Roman", Times, serif;
    --ml-font-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    --ml-color-bg: #faf8f5;
    --ml-color-bg-elevated: #ffffff;
    --ml-color-bg-muted: #f5f0ea;
    --ml-color-bg-sidebar: #2c1810;
    --ml-color-bg-sidebar-hover: #3d2418;

    --ml-color-text: #1a1a1a;
    --ml-color-text-muted: #666666;
    --ml-color-text-inverse: #f5e6d3;
    --ml-color-text-inverse-dim: #c9b8a8;

    --ml-color-accent: #8b4513;
    --ml-color-accent-hover: #6d3610;
    --ml-color-accent-soft: #efe8e0;

    --ml-color-border: #e8e0d8;
    --ml-color-border-strong: #d4ccc4;

    --ml-color-danger: #b33a3a;
    --ml-color-danger-hover: #922e2e;
    --ml-color-danger-bg: #fdf0f0;
    --ml-color-success: #2d6a4f;
    --ml-color-success-bg: #e8f5ee;
    --ml-color-warning-bg: #fff8e6;

    --ml-radius-sm: 6px;
    --ml-radius: 10px;
    --ml-radius-lg: 14px;

    --ml-shadow-sm: 0 1px 3px rgba(44, 24, 16, 0.06);
    --ml-shadow: 0 2px 12px rgba(44, 24, 16, 0.08);
    --ml-shadow-lg: 0 8px 28px rgba(44, 24, 16, 0.12);

    --ml-space-xs: 0.25rem;
    --ml-space-sm: 0.5rem;
    --ml-space-md: 1rem;
    --ml-space-lg: 1.5rem;
    --ml-space-xl: 2rem;
    --ml-space-2xl: 2.5rem;

    --ml-content-max: 1040px;
    --ml-sidebar-width: 260px;

    --ml-transition: 0.18s ease;
}