/* 威软助手 H5 · 热点资讯（暖金编辑风 · 榜单优先）
   局部作用域 .mh{}，复用与会员中心一致的暖金 OKLCH token，不污染全局 --brand 靛蓝紫。
   避免 AI slop：禁纯黑纯白、禁紫蓝渐变、禁霓虹点缀；中性色带极淡暖偏色。 */
.mh{
  --mh-gold: oklch(76% 0.12 80);
  --mh-gold-deep: oklch(58% 0.13 66);
  --mh-gold-soft: oklch(95% 0.045 82);
  --mh-ink: oklch(26% 0.018 65);
  --mh-ink-2: oklch(47% 0.014 65);
  --mh-ink-3: oklch(64% 0.012 65);
  --mh-line: oklch(92% 0.012 78);
  --mh-bg: oklch(97% 0.01 80);
  --mh-card: #fff;
  --mh-fire: oklch(60% 0.19 32);      /* 深红橙：热度，非 AI 红 */
  --mh-fire-soft: oklch(94% 0.045 38);
  --mh-ease: cubic-bezier(0.22,1,0.36,1);
  --mh-ease-out: cubic-bezier(0.16,1,0.3,1);
}
.mh :focus-visible{outline:2px solid var(--mh-gold-deep);outline-offset:2px;border-radius:6px;}

/* ── 头部条：标题 + 副标题 + 刷新 ── */
.mh-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:2px 0 10px;}
.mh-head-main{min-width:0;}
.mh-head-title{font-size:22px;font-weight:800;letter-spacing:-.3px;color:var(--mh-ink);line-height:1.2;}
.mh-head-title .mh-fire-dot{color:var(--mh-fire);}
.mh-head-sub{font-size:12px;color:var(--mh-ink-3);margin-top:3px;letter-spacing:.2px;}
.mh-refresh{flex-shrink:0;border:1px solid var(--mh-line);background:var(--mh-card);color:var(--mh-ink-2);
  border-radius:11px;padding:9px 13px;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:5px;
  transition:background .15s var(--mh-ease),transform .1s var(--mh-ease),border-color .15s;}
.mh-refresh:active{transform:scale(.95);}
.mh-refresh.is-loading{opacity:.6;pointer-events:none;}
.mh-refresh .mh-spin{display:inline-block;width:13px;height:13px;border:2px solid var(--mh-line);border-top-color:var(--mh-gold-deep);
  border-radius:50%;animation:mhSpin .7s linear infinite;}

/* ── 搜索栏 ── */
.mh-search{position:relative;margin-bottom:12px;}
.mh-search .mh-ico{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:14px;color:var(--mh-ink-3);pointer-events:none;}
.mh-search input{
  width:100%;box-sizing:border-box;border:1px solid var(--mh-line);background:var(--mh-bg);
  border-radius:13px;padding:12px 14px 12px 36px;font-size:14px;color:var(--mh-ink);
  transition:border-color .15s var(--mh-ease),background .15s var(--mh-ease);
}
.mh-search input::placeholder{color:var(--mh-ink-3);}
.mh-search input:focus{outline:none;border-color:var(--mh-gold);background:var(--mh-card);}

/* ── 筛选：分类下拉 + 平台下拉（并排，省占位） ── */
.mh-filters{display:flex;gap:8px;margin-bottom:9px;}
.mh-select{
  flex:1;min-width:0;box-sizing:border-box;appearance:none;-webkit-appearance:none;
  border:1px solid var(--mh-line);background:var(--mh-card);color:var(--mh-ink);
  border-radius:11px;padding:10px 28px 10px 12px;font-size:13.5px;font-weight:700;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23888' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
  transition:border-color .15s var(--mh-ease),background .15s;
}
.mh-select:focus{outline:none;border-color:var(--mh-gold);}
.mh-select option{font-weight:600;}

/* ── 日期快捷 chips（今天/近7天/近30天） ── */
.mh-dates{display:flex;gap:6px;margin-bottom:4px;}
.mh-dates .mh-chip{border:1px solid var(--mh-line);background:var(--mh-card);color:var(--mh-ink-2);
  border-radius:16px;padding:6px 11px;font-size:12px;font-weight:700;cursor:pointer;line-height:1.3;
  display:inline-flex;align-items:center;gap:3px;min-height:28px;
  transition:background .12s var(--mh-ease),color .12s,border-color .12s,transform .08s var(--mh-ease);}
.mh-dates .mh-chip:active{transform:scale(.95);}
.mh-dates .mh-chip.active{background:var(--mh-ink);color:#fff;border-color:var(--mh-ink);}

/* ── 排序条 ── */
.mh-sort{display:flex;gap:6px;margin:12px 0 10px;}
.mh-sort-btn{border:none;background:transparent;color:var(--mh-ink-3);font-size:12.5px;font-weight:700;cursor:pointer;padding:5px 10px;
  border-radius:9px;transition:color .12s,background .12s;}
.mh-sort-btn.active{color:var(--mh-ink);background:var(--mh-gold-soft);}

/* ── 卡片列表 ── */
.mh-list{display:flex;flex-direction:column;gap:9px;}
.mh-card{position:relative;display:flex;gap:12px;background:var(--mh-card);border:1px solid var(--mh-line);
  border-radius:14px;padding:13px 14px;cursor:pointer;overflow:hidden;
  animation:mhUp .4s var(--mh-ease-out) backwards;animation-delay:calc(var(--i,0)*45ms);
  transition:border-color .15s var(--mh-ease),background .12s;}
.mh-card:active{background:var(--mh-bg);}
.mh-card[data-rank="1"],.mh-card[data-rank="2"],.mh-card[data-rank="3"]{border-color:oklch(88% 0.05 80);}
.mh-card[data-rank="1"]{box-shadow:0 6px 20px oklch(92% 0.05 80 / .35);}

/* 排名徽章 */
.mh-rank{flex-shrink:0;width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:-.5px;
  background:var(--mh-bg);color:var(--mh-ink-3);}
.mh-rank.r1{background:linear-gradient(135deg,oklch(82% 0.14 80),oklch(66% 0.14 66));color:#3a2a00;box-shadow:0 3px 10px oklch(70% 0.12 72 / .4);}
.mh-rank.r2{background:linear-gradient(135deg,oklch(86% 0.025 70),oklch(74% 0.03 72));color:oklch(34% 0.02 70);box-shadow:0 3px 9px oklch(78% 0.025 72 / .35);}
.mh-rank.r3{background:linear-gradient(135deg,oklch(82% 0.07 65),oklch(70% 0.08 60));color:oklch(32% 0.03 55);box-shadow:0 3px 9px oklch(75% 0.06 60 / .32);}

/* 卡片主体 */
.mh-main{flex:1;min-width:0;}
.mh-title{font-size:15px;font-weight:700;line-height:1.4;color:var(--mh-ink);letter-spacing:-.1px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.mh-card[data-rank="1"] .mh-title,.mh-card[data-rank="2"] .mh-title,.mh-card[data-rank="3"] .mh-title{font-size:15.5px;}
.mh-sum{font-size:12.5px;color:var(--mh-ink-3);margin-top:5px;line-height:1.55;
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}

/* 卡片底部 meta 行 */
.mh-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:9px;font-size:11.5px;color:var(--mh-ink-3);}
.mh-cat{display:inline-flex;align-items:center;font-size:11px;font-weight:700;color:var(--mh-gold-deep);
  background:var(--mh-gold-soft);border-radius:7px;padding:2.5px 8px;letter-spacing:.2px;}
.mh-src{display:inline-flex;align-items:center;gap:3px;min-width:0;}
.mh-src b{color:var(--mh-ink-2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:84px;}
.mh-time{margin-left:auto;white-space:nowrap;}

/* 热度 + 趋势 + 改写按钮 */
.mh-bottom{display:flex;align-items:center;gap:9px;margin-top:9px;}
.mh-heat{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:800;color:var(--mh-fire);
  font-variant-numeric:tabular-nums;}
.mh-trend{font-size:10.5px;font-weight:700;padding:2px 6px;border-radius:6px;letter-spacing:.2px;}
.mh-trend.hot{color:var(--mh-fire);background:var(--mh-fire-soft);}
.mh-trend.rising{color:oklch(58% 0.15 50);background:oklch(95% 0.04 55);}
.mh-trend.cooling{color:oklch(50% 0.1 200);background:oklch(94% 0.03 205);}
.mh-trend.stable{color:var(--mh-ink-3);background:var(--mh-bg);}
.mh-rewrite{margin-left:auto;border:none;background:var(--mh-ink);color:#fff;
  border-radius:9px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer;min-height:30px;
  transition:transform .08s var(--mh-ease),opacity .12s;}
.mh-rewrite:active{transform:scale(.94);}
.mh-rewrite:disabled{opacity:.5;pointer-events:none;}

/* ── 加载/空/错误/底部 ── */
.mh-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.4rem 1rem;color:var(--mh-ink-3);gap:10px;}
.mh-spinner{width:30px;height:30px;border:3px solid var(--mh-line);border-top-color:var(--mh-gold-deep);
  border-radius:50%;animation:mhSpin .8s linear infinite;}
.mh-empty{text-align:center;color:var(--mh-ink-3);padding:2.6rem 1rem;font-size:13px;line-height:1.8;}
.mh-empty b{color:var(--mh-ink-2);font-weight:700;display:block;margin-bottom:4px;font-size:15px;}
.mh-error{color:oklch(55% 0.18 32);background:var(--mh-fire-soft);border:1px solid oklch(88% 0.05 38);
  border-radius:12px;padding:1rem;font-size:13px;text-align:center;}
.mh-foot-more{margin-top:6px;border:1px solid var(--mh-line);background:var(--mh-card);color:var(--mh-ink-2);
  border-radius:12px;padding:12px;font-size:13.5px;font-weight:700;cursor:pointer;width:100%;
  transition:background .12s,transform .08s var(--mh-ease);}
.mh-foot-more:active{transform:scale(.98);background:var(--mh-bg);}
.mh-foot-more.is-loading{opacity:.65;pointer-events:none;}
.mh-foot-more .mh-spin{width:13px;height:13px;border:2px solid var(--mh-line);border-top-color:var(--mh-gold-deep);
  border-radius:50%;animation:mhSpin .7s linear infinite;display:inline-block;vertical-align:-2px;margin-right:6px;}
.mh-foot-end{text-align:center;color:var(--mh-ink-3);font-size:11.5px;padding:1rem;letter-spacing:.3px;}

/* ── 详情抽屉（暖金排版） ── */
.mh-detail{padding:2px 1px 8px;}
.mh-d-title{font-size:19px;font-weight:800;line-height:1.4;color:var(--mh-ink);letter-spacing:-.3px;}
.mh-d-meta{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:11px 0 4px;font-size:12px;color:var(--mh-ink-3);}
.mh-d-sum{font-size:14.5px;line-height:1.85;color:var(--mh-ink);white-space:pre-wrap;word-break:break-word;margin-top:12px;}
.mh-d-tags{margin-top:13px;display:flex;flex-wrap:wrap;gap:6px;}
.mh-d-tag{font-size:12px;color:var(--mh-gold-deep);background:var(--mh-gold-soft);border-radius:8px;padding:3px 9px;font-weight:700;}
.mh-d-link{display:inline-flex;align-items:center;gap:4px;margin-top:14px;font-size:13px;font-weight:700;
  color:var(--mh-gold-deep);text-decoration:none;border-bottom:1.5px solid var(--mh-gold-soft);padding-bottom:1px;}
.mh-d-actions{margin-top:18px;display:flex;flex-direction:column;gap:8px;}
.mh-d-rewrite{border:none;background:linear-gradient(135deg,var(--mh-gold),var(--mh-gold-deep));color:#3a2a00;
  border-radius:13px;padding:14px;font-size:15px;font-weight:800;cursor:pointer;
  transition:transform .08s var(--mh-ease),opacity .12s;letter-spacing:.3px;}
.mh-d-rewrite:active{transform:scale(.98);}

@keyframes mhUp{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@keyframes mhSpin{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){
  .mh-card{animation:none;}
  .mh-refresh,.mh-foot-more,.mh-rewrite,.mh-d-rewrite{transition:none;}
}