/* ═══════════════════════════════════════════════════
   Diet & Keep — 品牌级视觉令牌（唯一来源）

   所有页面级 CSS（styles.css / rating.css / landing.css）
   的品牌色、语义色、间距、圆角、字体等基础令牌从此文件继承，
   各页面只保留自己的语义别名与组件样式。
   ═══════════════════════════════════════════════════ */

:root {
    /* ── 品牌色 ── */
    --color-accent-primary: #d97757; /* Terracotta Red */
    --color-accent-secondary: #c86b4e;
    --color-accent-gradient: linear-gradient(135deg, #d97757 0%, #e08e73 100%);

    /* ── 语义色 ── */
    --color-success: #6b8e23; /* Olive Green */
    --color-warning: #cd853f; /* Peru */
    --color-error: #cd5c5c; /* Indian Red */

    /* ── 文本色 ── */
    --color-text-primary: #382e28; /* Deep Coffee */
    --color-text-secondary: #6e5d50; /* Medium Brown */
    --color-text-muted: #948171; /* Readable Light Brown */

    /* ── 背景色 ── */
    --color-bg-primary: #fdfbf7; /* Creamy paper */
    --color-bg-secondary: #f4f0e6; /* Thick paper / Cardboard */
    --color-bg-tertiary: #ebe6da; /* Darker paper / Tape */
    --color-bg-surface: #ffffff; /* Pure white for overlays/cards */
    --color-bg-glass: rgba(255, 255, 255, 0.65); /* Frosted tracing paper */

    /* ── 边框 ── */
    --color-border: rgba(92, 85, 78, 0.15);
    --color-border-hover: rgba(92, 85, 78, 0.3);

    /* ── 间距 ── */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-2xl: 48px;

    /* ── 圆角 ── */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 18px;
    --radius-xl: 26px;
    --radius-full: 9999px;

    /* ── 阴影 ── */
    --shadow-sm: 0 2px 4px rgba(74, 62, 53, 0.05);
    --shadow-md: 0 4px 12px rgba(74, 62, 53, 0.08);
    --shadow-lg: 0 8px 24px rgba(74, 62, 53, 0.12);
    --shadow-glow: 0 0 15px rgba(217, 119, 87, 0.3);

    /* ── 过渡 ── */
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
    --transition-slow: 400ms ease;

    /* ── 落地页专属专属别名 ── */
    --color-bg-landing-primary: #f8f4ec;
    --color-bg-landing-secondary: #f3ede4;
    --radius-landing: 16px;
}
