/* ==========================================================
   TEEMEE 添蜜 · 二期高级美化 · Design Tokens  v2.0
   用法：整块替换旧的颜色/阴影/圆角/动效变量，不在旧变量上层层覆盖。
   ========================================================== */
:root{
  /* ---- 底色（沿用现状 #0F0A14 / #181120，向下加一级更深的夜色） ---- */
  --tm-bg-0:#0A0610;          /* 播放器四周、最深底 */
  --tm-bg-1:#0F0A14;          /* 页面底（= 现状） */
  --tm-surface-1:#181120;     /* 卡片/盒子（= 现状） */
  --tm-surface-1b:#1B1324;    /* 次一级盒子/占位封面（= v010） */
  --tm-surface-2:#201729;     /* 悬停/面板 */
  --tm-surface-3:#2B2036;     /* 选中/输入框 */
  --tm-tabbar:#140E1A;        /* H5 底栏（= v010 §6.1） */
  --tm-scrim:rgba(10,6,16,.72);
  --tm-line:rgba(255,255,255,.08);
  --tm-line-2:rgba(255,255,255,.14);
  --tm-line-honey:rgba(246,211,138,.28);

  /* ---- 文字 ---- */
  --tm-text-1:#FFFFFF;        /* 标题 */
  --tm-text-body:#F4EFF1;     /* 长正文：微暖米白，不刺眼（侦察_海外 元素M） */
  --tm-text-2:rgba(255,255,255,.74);
  --tm-text-3:rgba(255,255,255,.52);
  --tm-text-4:rgba(255,255,255,.32);
  --tm-text-champagne:rgba(243,226,189,.86);

  /* ---- 品牌：蜜桃玫红（主行动色，= 现状 #E8577A） ---- */
  --tm-rose-300:#F59AB1;
  --tm-rose-400:#F07595;
  --tm-rose-500:#E8577A;
  --tm-rose-600:#CC3F64;
  --tm-rose-700:#9E2C4C;
  --tm-rose-rgb:232,87,122;
  --tm-magenta-500:#FB3084;   /* LOGO / 原创角标 / 代理大卡（= v010 §11） */

  /* ---- 品牌：蜂蜜金（会员/金币/排行前三，= 现状 #FFC83D 的高级化） ---- */
  --tm-honey-200:#FBE7BC;
  --tm-honey-300:#F6D38A;
  --tm-honey-400:#FFC83D;
  --tm-honey-500:#E6A93A;
  --tm-honey-700:#8A5A14;
  --tm-honey-rgb:246,195,90;
  --tm-on-honey:#2A1A00;
  --tm-cream-100:#FFF3DE;     /* 奶油金会员卡底（实色，不用渐变；侦察_短剧App 元素3） */
  --tm-cream-300:#F3D9A8;     /* 会员卡下沿权益条 */
  --tm-on-cream:#3A2608;      /* 奶油金上的深棕字 */

  /* ---- 渐变（定稿方案 B：Finn 11-11 20:38 授权小黑豆拍板方案 B（UI设计 已核实），对齐 v010 §13）----
         全站唯一允许的渐变 = 底部渐隐，开关 html.fx-fade，默认开（页面 <html class="fx-fade">）。
         作用于 .tm-fade（封面 / 轮播底部）和 .tm-fade-bar（播放器底部操作区）：透明 → #0F0A14，最多盖住底部 40%，不加模糊、不做装饰色带。
         html.is-grad 已移除，VIP 不用渐变：.tm-vip-badge / .tm-btn--vip = 纯金 #FFC83D + 扫光，按下 #F2C64F，字 #2A1A00。
         其余一律禁止渐变：页面背景、卡片、普通按钮和胶囊、标签、分割线、文字、粉色操作色。 */
  --tm-vip-press:#F2C64F;                  /* VIP 按下态，纯色 */
  --tm-fade-end:#0F0A14;                   /* 渐隐终点 = 页面底色 --tm-bg-1 */
  --tm-fade-start:60%;                     /* 从 60% 处开始 → 最多盖住底部 40% */
  --tm-fade-img:none;                      /* 仅当 html.fx-fade 不在时生效（兜底 = 纯色压暗） */
  --tm-fade-bar-img:none;

  /* ---- 状态 ---- */
  --tm-success:#3DD68C;
  --tm-warning:#FFB547;
  --tm-danger:#FF7A45;        /* 错误色用橙红，避开主按钮玫红，免得报错像按钮（侦察_海外 元素B） */
  --tm-info:#7AA7FF;

  /* ---- 圆角 ---- */
  --tm-r-xs:4px; --tm-r-sm:8px; --tm-r-md:10px; --tm-r-lg:14px; --tm-r-xl:20px; --tm-r-pill:999px;

  /* ---- 间距（4 的倍数） ---- */
  --tm-s-1:4px; --tm-s-2:8px; --tm-s-3:12px; --tm-s-4:16px; --tm-s-5:20px; --tm-s-6:24px; --tm-s-8:32px;

  /* ---- 阴影（静态，绝不对 box-shadow 做动画） ---- */
  --tm-shadow-1:0 1px 2px rgba(0,0,0,.35);
  --tm-shadow-2:0 4px 12px rgba(0,0,0,.38);
  --tm-shadow-3:0 12px 24px rgba(0,0,0,.70);   /* 深底用「硬阴影」，浅阴影在暗底上看不见（侦察_海外 元素P） */
  --tm-shadow-inset:inset 0 1px 0 rgba(255,255,255,.18);

  /* ---- 光晕等级（G1 小 / G2 中 / G3 主角）：模糊半径上限 32px ---- */
  --tm-glow-rose-1:0 2px 10px rgba(var(--tm-rose-rgb),.28);
  --tm-glow-rose-2:0 6px 20px rgba(var(--tm-rose-rgb),.40);
  --tm-glow-rose-3:0 10px 32px rgba(var(--tm-rose-rgb),.52);
  --tm-glow-honey-1:0 2px 10px rgba(var(--tm-honey-rgb),.24);
  --tm-glow-honey-2:0 6px 20px rgba(var(--tm-honey-rgb),.34);
  --tm-glow-honey-3:0 10px 32px rgba(var(--tm-honey-rgb),.46);

  /* ---- 动效时长 ---- */
  --tm-d-instant:80ms;   /* 按下 */
  --tm-d-fast:120ms;     /* 颜色/透明度 */
  --tm-d-base:200ms;     /* 悬停、开关 */
  --tm-d-slow:320ms;     /* 弹回、面板 */
  --tm-d-sheet:420ms;    /* 底部弹层 */
  --tm-d-breath:2800ms;  /* 光晕呼吸一周期 */

  /* ---- 动效曲线 ---- */
  --tm-ease-standard:cubic-bezier(.2,0,0,1);        /* 通用 */
  --tm-ease-out:cubic-bezier(.16,1,.3,1);           /* 进入/展开 */
  --tm-ease-in:cubic-bezier(.4,0,1,1);              /* 离开/收起 */
  --tm-ease-press:cubic-bezier(.3,0,.5,1);          /* 按下 */
  --tm-ease-spring:cubic-bezier(.34,1.56,.64,1);    /* 松手轻弹（约 6% 过冲） */
  --tm-ease-linear:linear;                          /* 弹幕匀速 */

  /* ---- 交互位移 ---- */
  --tm-lift:-2px; --tm-hover-scale:1.02; --tm-press-scale:.96;

  /* ---- 层级 ---- */
  --tm-z-danmaku:10; --tm-z-controls:20; --tm-z-toast:40; --tm-z-sheet:50; --tm-z-modal:60;
}

/* 底部渐隐开关（默认开：演示页与正式页 <html> 默认带 fx-fade；去掉即回退纯色压暗） */
html.fx-fade{
  --tm-fade-img:linear-gradient(to bottom,rgba(15,10,20,0) var(--tm-fade-start),var(--tm-fade-end) 100%);
  --tm-fade-bar-img:linear-gradient(to bottom,rgba(15,10,20,0) 0%,var(--tm-fade-end) 100%); /* 底部操作区自身高度 ≤ 播放器 40% */
}

/* 系统「减少动态效果」：动效时长归零级别、位移关闭 */
@media (prefers-reduced-motion: reduce){
  :root{ --tm-d-base:1ms; --tm-d-slow:1ms; --tm-d-sheet:1ms; --tm-lift:0px; --tm-hover-scale:1; --tm-press-scale:1; }
}
/* 运行时降级档：html[data-fx="lite"|"off"]，由 tm-fx.js 判定 */
html[data-fx="off"]{ --tm-d-base:1ms; --tm-d-slow:1ms; --tm-d-sheet:1ms; --tm-lift:0px; --tm-hover-scale:1; --tm-press-scale:1; }
html[data-fx="lite"]{ --tm-glow-rose-3:var(--tm-glow-rose-2); --tm-glow-honey-3:var(--tm-glow-honey-2); }
