/* ============================================================
   骑遇骑行 · 设计令牌
   来源:ui-ux-pro-max 技能 --design-system 生成
   Style: Vibrant & Block-based | Palette: Success green 主色 + urgency orange CTA
   Type: Rubik(标题) / Nunito Sans(正文) — 中文回退 PingFang SC / Noto Sans SC
   ============================================================ */
:root {
  /* 调色板:山地车配色体系 — 深林绿主色 + 辙迹橙 CTA + 苔藓白底 */
  --color-primary: #15803d;
  --color-on-primary: #ffffff;
  --color-secondary: #16a34a;
  --color-accent: #ea580c;
  --color-on-accent: #ffffff;
  --color-background: #f2f6f0;
  --color-foreground: #12211a;
  --color-card: #ffffff;
  --color-card-fg: #12211a;
  --color-muted: #e6efe8;
  --color-muted-fg: #47555c;
  --color-border: #d5e3d8;
  --color-danger: #dc2626;
  --color-on-danger: #ffffff;
  --color-ring: #15803d;

  /* 语义别名(组件层引用) */
  --bg: var(--color-background);
  --text: var(--color-foreground);
  --sub: var(--color-muted-fg);
  --head-bg: #14532d;
  --head-text: #ecfdf5;
  --card: var(--color-card);
  --line: #d5e3d8;
  --price: #c2410c;
  --btn-bg: #14532d;
  --btn-text: #ecfdf5;
  --soft: var(--color-card-fg);
  --brand-soft: #dcf2e3;

  /* 字体(中文回退;西文优先技能指定字体) */
  --font-head: 'Rubik', 'Nunito Sans', -apple-system, 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
  --font-body: 'Nunito Sans', -apple-system, 'PingFang SC', 'Noto Sans SC', 'Microsoft YaHei', sans-serif;

  /* 间距(密度:标准 16-64) */
  --sp-1: 8px; --sp-2: 12px; --sp-3: 16px; --sp-4: 24px; --sp-5: 32px; --sp-6: 48px;
  --radius: 14px; --radius-lg: 22px;

  /* 动效(技能规范 200-300ms) */
  --t-fast: 180ms ease;
  --t-med: 260ms ease;

  /* Dock 玻璃 */
  --dock-bg: rgba(255, 255, 255, .62);
  --dock-border: rgba(255, 255, 255, .78);
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-primary: #22c55e;
    --color-accent: #f97316;
    --color-background: #0a120d;
    --color-foreground: #dcf2e3;
    --color-card: #101b13;
    --color-card-fg: #dcf2e3;
    --color-muted: #142317;
    --color-muted-fg: #8fa398;
    --color-border: #1e3a28;
    --color-danger: #ef4444;
    --color-ring: #22c55e;
    --bg: #0a120d; --text: #dcf2e3; --head-bg: #0d1f14; --head-text: #dcf2e3;
    --line: #1e3a28; --price: #fb923c; --btn-bg: #15803d; --btn-text: #ffffff;
    --soft: #dcf2e3; --brand-soft: #14301f;
    --dock-bg: rgba(10, 18, 13, .6); --dock-border: rgba(255, 255, 255, .12);
  }
}

/* 安全区域 */
:root { --safe-b: env(safe-area-inset-bottom, 0px); }

/* ============================================================
   Liquid Glass 材质层(ui-ux-pro-max · Liquid Glass 规范)
   规范要点:
   - 玻璃只用于导航与控件(--material-role: navigation-controls)
   - 内容独立分层,保持清晰
   - 自适应半透明 + 语义色调
   - 减弱透明度时回退为不透明
   ============================================================ */
:root {
  --glass-bg: rgba(255, 255, 255, .58);
  --glass-bg-strong: rgba(255, 255, 255, .72);
  --glass-border: rgba(255, 255, 255, .78);
  --glass-highlight: rgba(255, 255, 255, .95);
  --glass-blur: 26px;
  --glass-saturate: 180%;
  --glass-shadow: 0 10px 30px rgba(6, 40, 28, .16);
  --glass-tint: transparent;               /* 语义色调:默认不着色 */
  --ambient-opacity: .5;
}
@media (prefers-color-scheme: dark) {
  :root {
    --glass-bg: rgba(16, 26, 21, .55);
    --glass-bg-strong: rgba(16, 26, 21, .74);
    --glass-border: rgba(255, 255, 255, .14);
    --glass-highlight: rgba(255, 255, 255, .16);
    --glass-shadow: 0 10px 30px rgba(0, 0, 0, .5);
    --ambient-opacity: .3;
  }
}
/* 减弱透明度回退:材质变不透明 */
@media (prefers-reduced-transparency: reduce) {
  :root {
    --glass-bg: var(--card);
    --glass-bg-strong: var(--card);
    --glass-blur: 0px;
    --ambient-opacity: 0;
  }
}