/* ============================================================
   灶台档案 · 站内推广样式（顶部跑马灯 + 登录后弹窗）
   新增文件；颜色/圆角/阴影全部取自 styles.css 的 CSS 变量，
   不硬编码色值，不覆盖任何现有规则（深色 / 浅色主题自动跟随）。
   ============================================================ */

/* ---------------- ① 顶部跑马灯横幅 ---------------- */
/* 注意：横幅是普通流（非 sticky），因此不会与 .top 的 sticky 头部抢位，
   也不会改变 app.js 里 stickyOffset()（头部高度）的计算口径。 */
.promo-bar{
  --promo-h:34px;
  position:relative;
  overflow:hidden;                 /* 轨道再宽也不会撑出页面横向滚动条 */
  height:var(--promo-h);
  background:linear-gradient(90deg,var(--goldsoft),var(--bg2) 46%,var(--goldsoft));
  border-bottom:1px solid var(--line);
  color:var(--ink2);
  font-size:13px;
  white-space:nowrap;
}
.promo-bar-in{display:block;height:100%;color:inherit;text-decoration:none;cursor:pointer}
.promo-bar-in:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.promo-run{
  display:flex;width:max-content;
  height:100%;
  will-change:transform;
  animation:promoScroll var(--promo-dur,28s) linear infinite;
}
@keyframes promoScroll{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(var(--promo-shift,-50%),0,0)}
}
.promo-seg{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:.55em;
  height:var(--promo-h);
  padding-right:4.5rem;
}
.promo-tag{
  display:inline-flex;align-items:center;
  background:var(--goldsoft);color:var(--gold);
  border:1px solid var(--goldsoft);border-radius:999px;
  padding:0 9px;font-size:12px;font-weight:600;letter-spacing:.02em;
}
.promo-word{color:var(--ink);font-weight:600;letter-spacing:.02em}
.promo-sep{color:var(--ink3);opacity:.6}
.promo-cta{color:var(--gold);font-weight:600}
.promo-bar-in:hover .promo-cta{text-decoration:underline}

@media (max-width:720px){
  .promo-bar{--promo-h:32px;font-size:12px}
  .promo-tag{font-size:11px;padding:0 7px}
  .promo-seg{padding-right:3rem;gap:.45em}
}

/* 降低动画（系统「减少动态效果」）：静止显示，文字不被裁走 */
@media (prefers-reduced-motion: reduce){
  .promo-run{animation:none!important;transform:none!important}
  .promo-seg{padding-right:1.4rem}
}

/* ---------------- ② 登录后弹窗 ---------------- */
.promo-mask{
  position:fixed;inset:0;z-index:80;
  display:grid;place-items:center;padding:22px;
  background:color-mix(in srgb, var(--bg) 74%, transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;transition:opacity .26s var(--ease);
}
/* 关键：display:grid 会盖掉 hidden 属性的 UA 样式，必须显式关掉 */
.promo-mask[hidden]{display:none}
.promo-mask.shown{opacity:1}
body.promo-open{overflow:hidden}

.promo-card{
  position:relative;width:min(432px,100%);min-width:0;
  background:var(--sheet);border:1px solid var(--line2);border-radius:22px;
  box-shadow:var(--shadow);padding:28px 26px 24px;text-align:center;
  overflow-wrap:anywhere;
  transform:translateY(10px) scale(.985);
  transition:transform .32s var(--ease);
}
.promo-mask.shown .promo-card{transform:none}
.promo-card::before{
  content:"";position:absolute;inset:-40% -20% auto -20%;height:180px;pointer-events:none;
  background:radial-gradient(60% 100% at 50% 100%,var(--goldsoft),transparent 70%);
}
.promo-card > *{position:relative}
.promo-x{
  position:absolute;top:11px;right:11px;width:34px;height:34px;
  display:grid;place-items:center;
  background:transparent;border:1px solid var(--line);border-radius:50%;
  color:var(--ink3);font-size:14px;line-height:1;cursor:pointer;font-family:inherit;
  transition:.2s var(--ease);
}
.promo-x:hover{color:var(--gold);border-color:var(--gold);background:var(--goldsoft)}
.promo-kicker{margin:0 0 10px;font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.promo-title{margin:0;font-size:clamp(23px,4vw,27px);letter-spacing:.01em}
.promo-en{margin:4px 0 0;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.promo-list{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:7px;text-align:left;font-size:13.5px;color:var(--ink2)}
.promo-list li{display:flex;gap:9px;align-items:flex-start}
.promo-list li::before{content:"";flex:0 0 auto;width:5px;height:5px;margin-top:8px;border-radius:50%;background:var(--gold);opacity:.75}
.promo-desc{margin:16px 0 0;font-size:13.5px;color:var(--ink3)}
.promo-desc b{color:var(--ink);font-variant-numeric:tabular-nums}
.promo-acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.promo-acts .btn{display:inline-flex;align-items:center;gap:2px;text-decoration:none;font-family:inherit;cursor:pointer}

/* ---------------- 打印 / 兜底 ---------------- */
@media print{
  .promo-bar,.promo-mask{display:none!important}
}
