/* =============================================================
   theme.css — 全站单一设计令牌源（Single Source of Truth）
   牛马1号 2026-08-14 · P0#1
   规则：设计令牌只在这里定义一次；各页面一律 var(--xxx) 引用，
   不再本地重复定义（历史页面的旧变量名以别名保留兼容）。
   视觉方向：克制、专业、电商粉点缀。主色统一 #D83F78。
   ============================================================= */
:root{
  /* —— 品牌主色（唯一主色，全站统一）—— */
  --brand:        #d83f78;
  --brand-rgb:    216, 63, 120;
  --brand-dark:   #b32d63;
  --brand-hover:  #c1315f;
  --brand-soft:   #f8dce7;   /* 选中底/浅色块 */
  --brand-tint:   #fceff4;   /* 更浅 hover 底 */
  --brand-line:   #f8cad9;   /* 品牌色描边 */

  /* —— 中性色阶 —— */
  --ink:          #1f2530;   /* 主文字 */
  --ink-soft:     #46505f;   /* 次文字 */
  --muted:        #737d8c;   /* 弱文字/占位 */
  --line:         #e3e7ed;   /* 描边 */
  --line-strong:  #cfd5de;
  --paper:        #ffffff;   /* 卡片底 */
  --paper-soft:   #f7f8fa;   /* 次级底 */
  --bg:           #f4f6f8;   /* 页面底 */
  --graphite:     #222832;   /* 深底/大 CTA 条 */
  --graphite-2:   #394250;

  /* —— 语义色 —— */
  --success:      #218a65;
  --success-soft: #eafaf1;
  --danger:       #c63f4f;
  --danger-soft:  #fdecec;
  --warning:      #b9770e;
  --warning-soft: #fef5e7;
  --info:         #338a98;

  /* —— 辅助点缀色（图表/类目标签等，勿滥用）—— */
  --rose:         #c9366e;
  --blue:         #3978c8;
  --teal:         #27877f;
  --amber:        #b97722;
  --violet:       #7257a7;

  /* —— 圆角 —— */
  --radius-sm:    8px;
  --radius:       12px;
  --radius-lg:    16px;

  /* —— 阴影 —— */
  --shadow-soft:  0 8px 22px rgba(29,35,45,.07);
  --shadow:       0 16px 42px rgba(29,35,45,.09);
  --elevated:     0 18px 48px rgba(28,35,45,.11);
  --shadow-sm:    0 2px 8px rgba(24,28,40,.04);
  --shadow-md:    0 8px 26px rgba(24,28,40,.06);
  --shadow-lg:    0 20px 60px rgba(0,0,0,.25);

  /* —— 兼容别名：历史页面沿用的旧变量名，统一指向上面的规范值 —— */
  --gold:         var(--brand);
  --gold-soft:    var(--brand-soft);
  --gold-tint:    var(--brand-tint);
  --green:        var(--success);
  --green-soft:   var(--success-soft);
  --red:          var(--danger);
  --red-soft:     var(--danger-soft);
  --amber-soft:   var(--warning-soft);
  --cyan:         var(--info);
}

/* —— 统一轻提示 toast（P0#3，替代原生 alert）—— */
#toastHost{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%);
  display:flex; flex-direction:column; gap:10px; z-index:9999; pointer-events:none;
  width:max-content; max-width:min(92vw,420px);
}
.toast{
  pointer-events:auto; padding:11px 16px; border-radius:10px;
  font-size:14px; font-weight:600; line-height:1.5; color:#fff;
  background:var(--graphite); box-shadow:var(--shadow);
  opacity:0; transform:translateY(8px); transition:opacity .22s ease,transform .22s ease;
}
.toast.show{ opacity:1; transform:none; }
.toast-warn{ background:#8a5a12; }
.toast-error{ background:var(--danger); }
.toast-success{ background:var(--success); }
.error-retry{
  display:inline-flex; align-items:center; justify-content:center;
  margin-left:10px; padding:5px 9px; border:1px solid currentColor; border-radius:7px;
  color:var(--danger); background:var(--paper); font:inherit; font-weight:700; cursor:pointer;
}
.error-retry:hover{ background:var(--danger-soft); }
.error-retry:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){
  .toast{ transition:none; transform:none; }
}