/* Audio detail page styles; keep page-only detail styles out of the HTML template. */
html{font-size:62.5%;overflow-x:clip}
body.dt-page{--m:var(--m-audio)}

/* ============================================================
     有声详情 · NOIR 页面专属层
     沿用 noir.css/cine.css 的 token（暗红 #FF3B5C / 金 #E6B873 / 暖炭底 / 大圆角 / 发光）
     本模块强调色用 body 上的 --m(=有声紫 #C9A0FF) 经 .cine 的 --mc 暴露。
     仅本页生效，不动共享文件。重塑：沉浸 Hero / 简介块 / 单集列表 / 评论 / 相关 /
     常驻迷你播放器 / 全屏播放覆盖层（发光波形），全部 noir 化。
     ============================================================ */
  .dt-page{padding-bottom:env(safe-area-inset-bottom)}   /* 播放器已内联到简介上方，移除原贴底播放器留白补偿 */

  /* —— 顶部被固定 cn-nav 压住，Hero 自身满出顶部，无需额外 padding —— */

  /* ============================================================
     1 · 沉浸暗色 Hero（封面作模糊 backdrop + 暗角 + 红/金辉光）
     ============================================================ */
  /* 紧凑 padding 型 Hero(与小说/漫画详情一致,非满屏沉浸) */
  .dt-hero{position:relative;overflow:hidden;isolation:isolate;
    padding:clamp(74px,11vw,128px) 0 0}   /* 底部不留白：统计条到主体的间距统一由 .dt-cols 的 padding-top 负责，避免两段相加空一大块 */
  .dt-hero__bg{position:absolute;inset:0;z-index:0;pointer-events:none}
  .dt-hero__photo{position:absolute;inset:0;background-size:cover;background-position:center;
    transform:scale(1.18);filter:blur(34px) saturate(1.25) brightness(.78)}
  .dt-hero__photo--mock{background-image:url(https://cdn.uameta.ai/file/bucket-media/image/cover/a2f9069f53c04d28beffe51e9a39ee0f.jpg)}
  /* 暗角 + 顶/底渐隐到页底色(电影感,图上恒暗白字),与 cd-hero 同款 */
  .dt-hero__veil{position:absolute;inset:0;z-index:1;pointer-events:none;
    background:
      radial-gradient(120% 96% at 50% 0%,transparent 38%,var(--vignette) 100%),
      linear-gradient(180deg,var(--hero-veil-top) 0%,var(--hero-veil-mid) 36%,var(--hero-veil-bot) 78%,var(--paper) 100%)}
  .dt-hero__veil::after{content:"";position:absolute;inset:0;
    background:radial-gradient(680px 420px at 16% 8%,var(--hero-glow),transparent 62%)}

  .dt-hero__top{position:absolute;z-index:5;top:calc(var(--top-h) + 16px);left:50%;
    width:100%;max-width:var(--maxw);box-sizing:border-box;padding:0 clamp(16px,5vw,72px);
    transform:translateX(-50%);pointer-events:none;display:flex;align-items:center;gap:10px}
  .dt-back{position:static;pointer-events:auto;
    width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;
    background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(8px);transition:.2s}
  .dt-back:hover{background:var(--mc);border-color:var(--mc);box-shadow:0 0 26px -4px var(--mc)}
  /* 圆钮右边的「返回」二字：钮本身不变，只是后面跟一个同样可点的文字标签 */
  .dt-back__t{pointer-events:auto;cursor:pointer;color:#fff;font-size:15px;font-weight:600;
    letter-spacing:.02em;text-shadow:0 1px 8px rgba(0,0,0,.55)}


  .dt-hero__in{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0 auto;
    padding:0 clamp(16px,5vw,72px);
    display:flex;gap:clamp(20px,3.5vw,44px);align-items:stretch}
  .dt-hero__cover{position:relative;flex-shrink:0;align-self:flex-start;width:clamp(140px,24vw,232px)}
  /* 封面状态角标:直接复用列表页同款 .cn-stwrap/.cn-st(连载中=红 / 已完结=金),与列表封面一致 */
  .dt-hero__cover .ds-cover{aspect-ratio:2/3;border-radius:14px;box-shadow:var(--glow-red)}
  /* 信息列拉伸到封面高度,各块等距均分(与小说详情一致) */
  .dt-hero__info{min-width:0;flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:clamp(12px,1.6vw,18px);padding-bottom:4px}
  .dt-hero__info h1{font-family:var(--font-serif);font-weight:900;color:var(--on-cover);
    font-size:clamp(28px,5vw,56px);line-height:1.1;letter-spacing:-.01em;text-shadow:0 8px 40px rgba(0,0,0,.6);
  /* 标题恒完整显示，不夹行、不省略：cine-core.js 的 fitDetailTitle 只按宽度缩字号，
     缩到下限还放不下就多换几行。overflow-wrap 兜住没有断点的超长串（与小说详情 .nd-info h1 一致）。 */
    overflow-wrap:anywhere}
  /* 标题按字数分档收敛(有声标题常很长,避免 H5 过大) */
  .dt-hero__info h1.dt-t1{font-size:clamp(24px,4.4vw,52px)}
  .dt-hero__info h1.dt-t2{font-size:clamp(21px,3.6vw,40px)}
  /* 三个详情页(小说/漫画/有声)标题字号统一；视频详情页是影院版式，标题另算(.vd-title) */
  .dt-hero__info h1.dt-t3{font-size:clamp(20px,3.2vw,32px);line-height:1.25}
  .dt-hero__info h1.dt-t4{font-size:clamp(16px,2.3vw,25px);line-height:1.28}
  /* —— 信息列各行：层级化排版(标题>共N集/最新>作者/类型),H5 字号、颜色、间距统一收敛 —— */
  /* 作者/CV：次级署名,弱化 */
  .dt-author{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;
    color:rgba(255,255,255,.82);text-shadow:0 2px 10px rgba(0,0,0,.5)}
  .dt-author .av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;
    font-family:var(--font-serif);font-weight:800;font-size:13px;color:#fff;
    background:linear-gradient(140deg,var(--mc),var(--crimson));box-shadow:0 0 16px -5px var(--mc)}
  /* CV 可点：a 直接顶替 .dt-author 当 flex 容器,尺寸/排版全部沿用,只补交互反馈。
     width:fit-content 是必须的——不加的话 a 会撑满整行,右边一大片空白也能点 */
  .dt-author--lk{width:fit-content;text-decoration:none;color:rgba(255,255,255,.82);transition:color .15s}
  .dt-author--lk:hover{color:#fff}
  .dt-author--lk:hover .av{box-shadow:0 0 18px -3px var(--mc)}
  /* 类型(有声小说)：分类标签,最弱 */
  .dt-type{font-size:13px;font-weight:600;letter-spacing:.02em;color:rgba(255,255,255,.64);text-shadow:0 2px 10px rgba(0,0,0,.5)}
  /* 最新：可点击收听最新一集 —— 参考小说详情，白字正文 + 尾随进入图标 */
  .dt-latest{display:flex;align-items:baseline;min-width:0;white-space:nowrap;overflow:hidden;cursor:pointer;
    font-size:13.5px;color:rgba(255,255,255,.72);text-shadow:0 2px 10px rgba(0,0,0,.5)}
  .dt-latest b{flex-shrink:1;min-width:0;max-width:16em;overflow:hidden;text-overflow:ellipsis;font-weight:700;color:rgba(255,255,255,.94);
    margin:0 6px 0 5px;transition:.15s}
  .dt-latest .tm{flex-shrink:0;color:rgba(255,255,255,.55);font-size:12.5px}
  .dt-latest .dt-go{flex-shrink:0;display:inline-flex;color:#FF8095;opacity:.85;transition:.15s;margin-left:2px}
  .dt-latest:hover .dt-go{color:#FFB3BE;opacity:1;transform:translateX(2px)}
  /* 共N集 + 时长：作品规模,主白字 */
  /* 第4行 评分：五星 + 数值。PC 钉到信息栏右上角(标题右侧空白处)，H5 回落成正常的第 4 行 —— 与小说/漫画详情同构 */
  .dt-score{display:flex;align-items:center;gap:8px;line-height:1}
  .dt-score__s{color:var(--gold);font-size:15px;letter-spacing:2px}
  .dt-score__s i{font-style:normal}
  .dt-score__s i.off{color:rgba(255,255,255,.26)}
  .dt-score b{font-family:var(--font-latin);font-weight:900;font-size:19px;color:var(--gold)}
  .dt-score em{font-style:normal;font-size:12.5px;color:rgba(255,255,255,.55)}
  @media(min-width:1000px){
    .dt-hero__info{position:relative}
    .dt-score{position:absolute;top:0;right:0;margin:0}
  }
  .dt-total{font-size:13.5px;font-weight:700;color:rgba(255,255,255,.92);text-shadow:0 2px 10px rgba(0,0,0,.5);white-space:nowrap}
  /* 评分 / 观看 / 收藏：固定单行不换行 */
  .dt-badges{display:flex;flex-wrap:nowrap;gap:8px;min-width:0}
  .dt-badges .tag{flex-shrink:0;white-space:nowrap;padding:4px 12px;border-radius:var(--r-pill);font-size:12px;font-weight:700;letter-spacing:.02em;
    color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(6px)}
  .dt-badges .tag--done{background:rgba(230,184,115,.92);color:#1a1a22;border-color:transparent;
    box-shadow:0 6px 18px -6px rgba(230,184,115,.7)}
  .dt-badges .tag--live{background:color-mix(in srgb,var(--mc) 24%,transparent);
    border-color:color-mix(in srgb,var(--mc) 50%,transparent);color:#fff}
  /* ===== H5（≤768px）：返回独占一行、不遮封面;信息列顶对齐、各行单行紧凑 ===== */
  @media(max-width:768px){
    .dt-hero{padding-top:calc(var(--top-h) + 12px)}
    .dt-hero__top{display:flex;position:relative;top:auto;left:auto;z-index:5;width:auto;max-width:var(--maxw);
      margin:0 auto 12px;padding:0 clamp(16px,5vw,72px);transform:none;pointer-events:auto}
    .dt-back{position:static;width:40px;height:40px}
    .dt-hero__info{justify-content:space-between;gap:6px;padding-bottom:0}   /* 各行等距均分,撑满到封面高度,与封面高度搭配 */
    .dt-hero__in{gap:clamp(12px,3vw,28px);align-items:stretch}
    .dt-hero__cover{width:clamp(116px,30vw,150px)}
    .dt-badges{gap:6px}
    .dt-badges .tag{padding:3px 9px;font-size:11px}
  }
  /* 手机窄屏:封面放大到与右侧文字等高(高度搭配);药丸收紧确保 评分/观看/收藏 仍 1 行不溢出 */
  @media(max-width:430px){
    .dt-hero__cover{width:clamp(118px,35vw,150px)}
    .dt-badges{gap:5px}
    .dt-badges .tag{padding:3px 6px;font-size:10px;letter-spacing:0}
  }
  /* 极窄屏(≤389,如 iPhone SE/mini、360 安卓)兜底:评分行允许折行,优先保证字号可读不挤压 */
  @media(max-width:389px){.dt-badges{flex-wrap:wrap}}
  .dt-hero__cta{margin-top:24px;display:flex;flex-wrap:wrap;gap:12px}
  .dt-hero__cta .ds-btn--ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);color:#fff;backdrop-filter:blur(8px)}
  .dt-hero__cta .ds-btn--ghost:hover{background:rgba(255,255,255,.2);border-color:#fff;color:#fff}
  .dt-hero__cta .ds-btn--ghost.ds-btn--on{background:color-mix(in srgb,var(--crimson) 22%,transparent);
    border-color:rgba(255,59,92,.55);color:#fff;box-shadow:0 0 22px -6px var(--crimson)}
  .dt-hero__cta .ds-btn svg{flex-shrink:0}

  /* 统计条(玻璃单块·与小说/漫画详情同款:1px 分隔的圆角整块) */
  .dt-stats{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0 auto;
    padding:clamp(22px,3vw,34px) clamp(16px,5vw,72px) 0}
  .dt-stats__row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;overflow:hidden;
    border-radius:var(--r-card);background:var(--line);border:1px solid rgba(255,255,255,.1)}
  .dt-stat{background:rgba(12,12,16,.42);backdrop-filter:blur(12px);padding:16px 12px;text-align:center}
  :root[data-theme="light"] .dt-stat{background:rgba(20,16,12,.42)}
  .dt-stat .n{font-family:var(--font-serif);font-weight:900;font-size:clamp(18px,2.4vw,26px);color:#fff;line-height:1;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dt-stat .n.rate,.dt-stat .n.gold{color:var(--gold);text-shadow:0 0 24px rgba(230,184,115,.5)}
  /* 无人评分：数值位显示「暂无」(配下方「听众评分」标签合读)，去掉金色高光、字号收一档 */
  .dt-stat .n.rate.is-none{color:rgba(255,255,255,.66);text-shadow:none;font-weight:700;font-size:clamp(14px,1.6vw,17px)}
  .dt-stat .l{margin-top:7px;font-size:11.5px;color:rgba(255,255,255,.62);letter-spacing:.06em}
  /* H5 曾折成 2×2，与小说/漫画详情的一行 4 格不一致；统一成一行，窄屏靠字号收缩兜底 */
  @media(max-width:560px){.dt-stat{padding:13px 4px}.dt-stat .n{font-size:15px}.dt-stat .l{margin-top:5px;font-size:10.5px;letter-spacing:.02em}}

  /* ============================================================
     2 · 主体两栏
     ============================================================ */
  .dt-cols{max-width:var(--maxw);margin:0 auto;padding:clamp(14px,2vw,22px) clamp(16px,5vw,72px) 40px;   /* 顶部留白收窄(原 22~40px)，仍随屏幕缩放 */
    display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,3vw,34px)}
  /* PC 两栏：播放器与主内容同宽(只占左列)，右侧「听了还听」提到第一行、与播放器顶对齐并跨两行 */
  @media(min-width:1000px){
    .dt-cols{grid-template-columns:minmax(0,1fr) 360px}
    .dt-cols>#miniMount{grid-column:1;grid-row:1}
    .dt-cols>.dt-main{grid-column:1;grid-row:2}
    .dt-cols>.dt-side{grid-column:2;grid-row:1/span 2}
  }

  .dt-block{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);
    padding:clamp(18px,2.4vw,26px);box-shadow:var(--shadow-s);margin-bottom:clamp(16px,2vw,22px)}
  .dt-block:last-child{margin-bottom:0}
  .dt-block__t{font-family:var(--font-serif);font-weight:900;font-size:clamp(18px,2.2vw,22px);color:var(--title);
    margin-bottom:15px;display:flex;align-items:center;gap:11px}
  .dt-block__t::before{content:"";width:4px;height:18px;border-radius:3px;
    background:linear-gradient(180deg,var(--mc),var(--crimson));box-shadow:0 0 12px -2px var(--mc)}

  /* 简介恒完整显示，不折叠——四个详情页统一。
     保留数据里的换行：简介在后台是多段文本，直接输出到 HTML 里换行会被折叠成空格，整段挤成一坨。pre-line 只保留换行、连续空格仍折叠，正好适合正文。 */
  .dt-synopsis{font-size:14.5px;line-height:1.95;color:var(--ink-2);white-space:pre-line}
  .dt-tagline{margin-top:18px;display:flex;flex-wrap:wrap;gap:9px}
  .dt-pill{display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:var(--r-pill);
    font-size:12.5px;font-weight:600;letter-spacing:.02em;color:var(--ink-2);
    background:var(--fill-1);border:1px solid var(--line);transition:.18s;text-decoration:none}
  .dt-pill:hover{border-color:color-mix(in srgb,var(--mc) 45%,transparent);color:var(--mc)}

  /* —— 单集列表 —— */
  .dt-chaphead{display:flex;align-items:baseline;gap:12px;margin-bottom:14px;flex-wrap:wrap}
  .dt-chaphead .dt-block__t{margin:0}
  .dt-chaphead .total{font-size:12.5px;color:var(--ink-3);font-family:var(--font-latin);letter-spacing:.04em}
  /* 整块规格 1:1 对齐小说详情目录(.ndc-list/.ndc-row/.ndc-name/.ndc-time/.ndc-acc)：
     行距 1px、行内无底色只靠 hover、11px/12px 内距、10px 圆角、hover 标题转主色。
     有声独有的只剩右侧播放图标与「正在播放」高亮(.dt-li--on)。
     text-align:left 必须显式写：本行是 <button>，UA 默认 center 会把标题推到中间(同 .ndc-vol__h) */
  .dt-list{display:flex;flex-direction:column;gap:1px}
  .dt-li{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;cursor:pointer;text-align:left;
    border:1px solid transparent;transition:.15s;position:relative}
  .dt-li:hover{background:var(--fill-hover);border-color:var(--line)}
  .dt-li__name{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--ink);line-height:1.43;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dt-li:hover .dt-li__name{color:var(--mc)}
  /* 权限标：规格与小说详情页目录的 .ndc-acc 完全一致(11px/500/淡)，不指定颜色，
     跟随目录行默认字色；只有「已购买」由共享的 .acc-own 标绿 */
  .dt-li__lim{font-size:11px;font-weight:500;white-space:nowrap;flex-shrink:0;opacity:.62;line-height:18px}
  /* 同 .ndc-time，但不设 min-width：后端目录不下发时长，这一列恒为空，占宽只会在权限标右边留个空洞 */
  .dt-li__time{font-family:var(--font-latin);font-size:12px;color:var(--ink-3);flex-shrink:0;
    text-align:right;line-height:20px}
  .dt-li__time:empty{display:none}
  .dt-li__play{flex-shrink:0;color:var(--ink-3);display:grid;place-items:center;transition:.18s}
  .dt-li:hover .dt-li__play{color:var(--mc)}
  .dt-li--on{background:color-mix(in srgb,var(--mc) 14%,transparent);border-color:color-mix(in srgb,var(--mc) 40%,transparent);
    box-shadow:0 0 20px -8px var(--mc)}
  .dt-li--on .dt-li__name{color:var(--title)}
  .dt-li--on .dt-li__play{color:var(--mc)}

  /* —— 动作条：独立一栏(位于简介与目录之间) —— */
  .dt-actions{display:flex;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);overflow:hidden;
    border-radius:var(--r-card);box-shadow:var(--shadow-s);margin-bottom:clamp(16px,2vw,22px)}
  .dt-actb{flex:1 1 0;min-width:84px;display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 10px;
    cursor:pointer;border:none;background:none;color:var(--ink-2);font-size:13px;font-weight:700;transition:.15s}
  .dt-actb svg{flex-shrink:0}
  .dt-actb+.dt-actb{box-shadow:-1px 0 0 var(--line)}
  .dt-actb:hover{color:var(--mc);background:var(--fill-1)}
  .dt-actb--warn:hover{color:#fff;background:color-mix(in srgb,var(--crimson) 72%,transparent)}
  @media(max-width:560px){.dt-actb{min-width:0;flex-direction:column;gap:5px;padding:13px 4px;font-size:11.5px}}

  /* —— 打赏榜 —— */
  .dt-gfhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
  .dt-gfhead .dt-block__t{margin:0}
  .dt-gf-note{font-size:12px;color:var(--ink-3);font-weight:400;white-space:nowrap}
  .dt-gfbtn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 16px;border-radius:var(--r-pill);flex-shrink:0;
    font-size:13px;font-weight:800;color:#241a08;background:linear-gradient(135deg,#f3d6a0,var(--gold));cursor:pointer;transition:.18s}
  .dt-gfbtn:hover{filter:brightness(1.06);transform:translateY(-1px)}
  .dt-gflist{display:flex;flex-direction:column;gap:2px}
  .dt-gf{display:flex;align-items:flex-start;gap:11px;padding:11px 10px;border-radius:12px;transition:.15s}
  .dt-gf:hover{background:var(--fill-1)}
  .dt-gf__rk{flex:0 0 18px;align-self:center;font-family:var(--font-latin);font-weight:900;font-size:15px;color:var(--ink-3);text-align:center}
  .dt-gf--top .dt-gf__rk{color:var(--gold)}
  .dt-gf__in{flex:1;min-width:0}
  .dt-gf__h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;row-gap:4px}
  /* 昵称长度用户自己说了算：flex 子项默认 min-width:auto 不肯收缩，再叠 white-space:nowrap 就会
     直接顶出打赏榜的右边框。改成允许折行，超长(含无空格的连续字符)最多 2 行省略。 */
  .dt-gf__h b{font-size:14px;font-weight:700;color:var(--ink);min-width:0;overflow-wrap:anywhere;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .dt-gf__h .vip{align-self:center}
  .dt-gf__coin{margin-left:auto;flex-shrink:0;font-family:var(--font-latin);font-weight:800;font-size:14px;color:var(--gold)}
  /* 打赏的礼物名(玫瑰/香槟/火箭…)，跟在金额前面 */
  .dt-gf__gift{font-family:inherit;font-weight:700;font-size:13px;color:var(--ink-2)}
  .dt-gf__gift::after{content:"·";margin:0 5px;font-weight:400;color:var(--ink-3)}
  .dt-gf__msg{margin-top:3px;font-size:12.5px;color:var(--ink-3);line-height:1.6;word-break:break-word}

  /* —— 评论：头像 / 主条 —— */
  .cm-av{position:relative;overflow:hidden;width:40px;height:40px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-family:var(--font-serif);font-weight:800;font-size:15px;color:#fff;cursor:pointer}
  .cm-av--demo{background:linear-gradient(140deg,rgba(255,255,255,.45),#FF6177)}
  .cm-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .cm-n{font-family:var(--font-latin);font-weight:800;font-size:13px;color:var(--mc);margin-left:6px}
  /* 评论排序：最新 / 最热 —— 靠右,与"全部评论"标题同一行 */
  .cm-sortbar{margin-left:auto;display:flex;gap:8px;flex-shrink:0}
  .cm-sortb{font-family:var(--font-sans);padding:5px 13px;border-radius:var(--r-pill);font-size:12.5px;font-weight:700;cursor:pointer;
    color:var(--ink-3);background:var(--fill-1);border:1px solid var(--line);transition:.15s}
  .cm-sortb:hover{color:var(--ink);border-color:var(--line-2)}
  .cm-sortb.is-on{color:#fff;background:var(--mc);border-color:transparent}
  @media(max-width:480px){.cm-sortb{padding:5px 11px;font-size:12px}}
  .cm-list{display:flex;flex-direction:column}
  .cm{display:flex;gap:12px;padding:18px 0;border-top:1px solid var(--line)}
  .cm:first-child{border-top:none;padding-top:6px}
  .cm__in{flex:1;min-width:0}
  .cm__h{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
  .cm__h b{font-size:14px;font-weight:700;color:var(--ink)}
  /* —— VIP 徽章 · J 全息典藏（定稿） —— */
  .vip{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 8px;border-radius:7px;flex-shrink:0;
    font-size:10px;font-weight:800;line-height:1;letter-spacing:.3px;white-space:nowrap;color:#fff}
  .vip svg{flex-shrink:0;display:block;width:11px;height:11px}
  .vip0,.vip1,.vip2,.vip3{background:linear-gradient(110deg,var(--m1),var(--m2),var(--m1));background-size:200% 100%;animation:vipFlow 7s linear infinite}
  .vip0{--m1:#FF5E78;--m2:#E02649}
  .vip1{--m1:#D69468;--m2:#9C5F2B;color:#33190A}
  .vip2{--m1:#EDF2F8;--m2:#9FAEBE;color:#222B34}
  .vip3{--m1:#FFE39B;--m2:#DCA52F;color:#3D2B04}
  .vip4{background:linear-gradient(150deg,#2A1D33,#0E0A13 70%);color:#F4D79B;
    box-shadow:inset 0 0 0 1px rgba(244,215,155,.5),0 3px 16px -5px rgba(244,215,155,.4)}
  .vip4 svg{color:#FFD36B}
  .vip4::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;
    background:linear-gradient(115deg,transparent 18%,rgba(255,210,150,.5) 34%,rgba(255,140,200,.34) 50%,rgba(150,200,255,.42) 66%,transparent 82%);
    background-size:300% 100%;animation:vipFoil 5.5s linear infinite}
  @keyframes vipFlow{from{background-position:200% 0}to{background-position:0% 0}}
  @keyframes vipFoil{from{background-position:150% 0}to{background-position:0% 0}}
  [data-theme="light"] :is(.vip0,.vip1,.vip2,.vip3){box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
  @media (prefers-reduced-motion:reduce){.vip0,.vip1,.vip2,.vip3,.vip4::after{animation:none}.vip4::after{opacity:.55}}
  .cm-stars{color:var(--gold);font-size:12.5px;letter-spacing:1px;line-height:1}
  .cm-stars i{font-style:normal}
  .cm-stars i.off{color:var(--line-2)}
  /* 星星前面的评分数值。letter-spacing 要归零——.cm-stars 那 1px 是给星星之间留缝的，数字跟着撑会散 */
  .cm-stars b{margin-right:5px;font-family:var(--font-latin);font-weight:800;font-size:12.5px;letter-spacing:0}
  .cm-time{font-size:11.5px;color:var(--ink-3)}
  .cm-time--r{margin-left:auto}
  .cm__b{margin-top:7px;font-size:14px;line-height:1.75;color:var(--ink-2);word-break:break-word}
  .cm__img{margin-top:9px}
  .cm__img img{max-width:200px;max-height:200px;border-radius:10px;border:1px solid var(--line);display:block}
  .cm-acts{display:flex;align-items:center;gap:18px;margin-top:9px}
  .cm-act{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--ink-3);cursor:pointer;transition:.15s}
  .cm-act:hover{color:var(--ink)}
  .cm-act.on{color:var(--mc)}
  .cm-act svg{width:15px;height:15px}

  /* —— 评论：回复区（折叠/展开） —— */
  .cm-reps{margin-top:12px;padding:4px 12px;border-radius:12px;background:var(--fill-1)}
  .cm-rep{display:flex;gap:10px;padding:10px 0}
  .cm-rep+.cm-rep{border-top:1px solid var(--line)}
  .cm-rep .cm-av{width:30px;height:30px;font-size:12px}
  .cm-rep__in{flex:1;min-width:0}
  .cm-rep__h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .cm-rep__h b{font-size:13px;font-weight:700;color:var(--ink)}
  .cm-author{color:var(--mc)}
  .cm-tag{font-size:10px;font-weight:800;color:#fff;background:var(--mc);padding:1px 6px;border-radius:5px}
  .cm-rep__b{margin-top:4px;font-size:13.5px;line-height:1.65;color:var(--ink-2);word-break:break-word}
  .cm-rep .cm-acts{gap:16px;margin-top:6px}
  .cm-more{display:inline-flex;align-items:center;gap:4px;margin:8px 0 4px;padding:6px 10px;border-radius:999px;
    font-size:12.5px;font-weight:800;color:var(--ink);background:var(--fill-2);border:1px solid var(--line);cursor:pointer}
  .cm-more:hover{border-color:var(--line-2);background:var(--fill-1)}
  .cm-more svg{width:13px;height:13px}

  /* —— 评论：底部提示行 + 评分发布按钮 —— */
  .cm-notice{margin-top:12px;text-align:center;font-size:12px;color:var(--ink-3)}
  .cm-launch{margin:12px 0 4px}
  .cm-launch__btn{display:block;width:100%;height:42px;border-radius:12px;font-size:13.5px;font-weight:800;cursor:pointer;
    color:#fff;background:var(--mc);box-shadow:0 0 18px -6px var(--mc);transition:.15s}
  .cm-launch__btn:hover{filter:brightness(1.08)}
  /* 评分弹窗：PC 居中 / H5 底部 sheet */
  .cm-dialog{position:fixed;inset:0;z-index:1200;display:none}
  .cm-dialog.open{display:block}
  .cm-dialog__veil{position:absolute;inset:0;background:rgba(8,8,12,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
  .cm-dialog__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,92vw);max-height:84vh;overflow:auto;
    background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px 18px;
    box-shadow:0 40px 100px -30px rgba(0,0,0,.8);animation:cmDlgIn .2s ease both}
  .cm-dialog__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
  .cm-dialog__head b{font-family:var(--font-serif);font-size:16px;color:var(--title)}
  .cm-dialog__x{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--ink-3);background:var(--fill-1);border:1px solid var(--line);cursor:pointer;transition:.15s}
  .cm-dialog__x:hover{color:var(--ink);border-color:var(--line-2)}
  @keyframes cmDlgIn{from{opacity:0;transform:translate(-50%,calc(-50% + 10px))}to{opacity:1;transform:translate(-50%,-50%)}}
  @media(max-width:760px){
    .cm-dialog__panel{left:0;right:0;top:auto;bottom:0;transform:none;width:auto;max-height:86vh;
      border-radius:18px 18px 0 0;border-left:none;border-right:none;border-bottom:none;
      padding:16px 16px calc(16px + env(safe-area-inset-bottom));animation:cmSheetIn .26s cubic-bezier(.2,.7,.2,1)}
  }
  @keyframes cmSheetIn{from{transform:translateY(100%)}to{transform:none}}
  @media (prefers-reduced-motion:reduce){.cm-dialog__panel{animation:none}}
  /* —— 评论：输入框（评分/表情/图片/发布） —— */
  .cm-cmp{margin:0 0 4px;padding:12px;border-radius:14px;background:var(--fill-1);border:1px solid var(--line)}
  .cm-cmpwrap .cm-cmp{margin-top:10px;background:var(--surface)}
  /* 评分弹窗主角区：大号星标居中 + 随分数评语 */
  .cm-ratebig{text-align:center;padding:4px 0 14px}
  .cm-ratebig__stars{display:flex;justify-content:center;gap:10px;touch-action:none}
  .cm-ratebig__stars i{font-style:normal;font-size:34px;line-height:1;color:var(--line-2);cursor:pointer;
    transition:transform .12s,color .12s;text-shadow:none}
  .cm-ratebig__stars i:hover{transform:scale(1.15)}
  .cm-ratebig__stars i.on{color:var(--gold);text-shadow:0 0 16px color-mix(in srgb,var(--gold) 55%,transparent)}
  .cm-ratebig__cap{margin-top:9px;min-height:18px;font-size:13px;font-weight:700;color:var(--gold)}
  .cm-cmp__to{font-size:12.5px;color:var(--ink-2);margin-bottom:8px}
  .cm-cmp__x{margin-left:8px;font-size:12px;color:var(--ink-3);cursor:pointer}
  .cm-cmp__ta{width:100%;min-height:56px;resize:vertical;border:none;background:none;color:var(--ink);font-family:inherit;font-size:14px;line-height:1.7;outline:none}
  .cm-cmp__prev{display:flex;gap:8px;flex-wrap:wrap}
  .cm-thumb{position:relative;width:72px;height:72px;border-radius:8px;overflow:hidden;border:1px solid var(--line)}
  .cm-thumb img{width:100%;height:100%;object-fit:cover}
  .cm-thumb button{position:absolute;top:2px;right:2px;width:18px;height:18px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:12px;line-height:1;cursor:pointer;display:grid;place-items:center}
  .cm-cmp__bar{display:flex;align-items:center;gap:10px;margin-top:8px;border-top:1px solid var(--line);padding-top:9px}
  .cm-cmp__emo{display:flex;gap:2px;flex-wrap:wrap;flex:1;min-width:0}
  .cm-cmp__emo button{font-size:18px;line-height:1;padding:2px 3px;cursor:pointer;border-radius:6px}
  .cm-cmp__emo button:hover{background:var(--fill-2)}
  .cm-cmp__att{display:inline-flex;align-items:center;cursor:pointer;color:var(--ink-3);flex-shrink:0;transition:.15s}
  .cm-cmp__att:hover{color:var(--mc)}
  .cm-cmp__send{flex-shrink:0;height:34px;padding:0 20px;border-radius:9px;font-size:13px;font-weight:800;color:#fff;background:linear-gradient(135deg,#ff6178,#ff2d52);cursor:pointer}
  .cm-cmp__send:hover{filter:brightness(1.06)}

  /* —— 右栏：听了还听（cine 海报小卡 · 固定 1 行 2 个）—— */
  .dt-side .dt-block{position:sticky;top:74px}
  /* PC 维持 cine 海报小卡(2列)不变；H5 改用频道筛选列表同款 .cn-lcard(1行1个) */
  /* PC 用海报小卡(2列) .dt-recgrid；H5 用 .cn-lcard 列表 .dt-reclist（复用 list/rank 页组件） */
  .dt-recgrid{display:none}
  .dt-reclist{display:flex;flex-direction:column;gap:14px}
  @media(min-width:1000px){.dt-recgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 14px;align-items:start}.dt-recgrid .cn-poster{width:100%;min-width:0}.dt-reclist{display:none}}
  /* H5：每张 .cn-lcard 已自带卡片背景，外层「听了还听」再套一层 .dt-block 边框显得多余——去掉外框,标题单独展示 */
  @media(max-width:999px){.dt-side .dt-block--bare{background:none;border:0;box-shadow:none;padding:0}}

  /* ============================================================
     3 · 常驻迷你播放器（贴底玻璃 · 发光进度）
     ============================================================ */
  /* —— 内联播放器卡：去封面/标题。H5 三行堆叠居中(时长 / 走带 / 工具)，且整卡上移到听众评分上方；PC 单行(时间|走带|工具) —— */
  .dt-mini{position:relative;display:grid;align-items:center;row-gap:12px;
    grid-template-columns:1fr;
    grid-template-areas:"prog" "id" "transport" "utils";
    margin:0;padding:clamp(13px,2.4vw,17px) clamp(14px,3vw,20px);
    background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
  @media(min-width:768px){
    .dt-mini{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"prog prog prog" "id transport utils";row-gap:10px;column-gap:18px}
    .dt-mini__id{justify-self:start}
    .dt-mini__utils{justify-self:end}
    .dt-mini__transport{gap:clamp(16px,4.5vw,28px)}
    .dt-mini__name{max-width:clamp(120px,18vw,260px)}
  }
  /* H5：播放器移入 Hero、置于听众评分(dt-stats)之上；与 Hero 内容同宽同边距 */
  #miniMountH5{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:clamp(16px,3vw,26px) clamp(16px,5vw,72px) 0}
  #miniMountH5:empty,#miniMount:empty{display:none}
  /* 单列(768~999px)：#miniMount 是唯一列，默认就占满；≥1000px 的列/行归位见「2 · 主体两栏」的媒体查询 */
  .dt-mini__id{grid-area:id;justify-self:center;min-width:0;display:flex;align-items:center;gap:7px;cursor:pointer}   /* H5 时长居中 */
  .dt-mini__id::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--mc);box-shadow:0 0 8px var(--mc)}   /* 正在播放指示点(替代原封面占位) */
  .dt-mini__transport{grid-area:transport;justify-self:center;display:flex;align-items:center;justify-content:center;gap:clamp(14px,4vw,20px)}
  .dt-mini__trio{display:flex;align-items:center;gap:clamp(10px,3vw,14px)}
  .dt-mini__utils{grid-area:utils;justify-self:center;display:flex;align-items:center;gap:14px}   /* H5 工具行(收藏/设置)居中,独占一行 */
  /* —— 独立整行进度条：轨道 + 跟随播放头的当前时间气泡 + 尾部固定总时长 —— */
  .dt-mini__prog{grid-area:prog;position:relative;display:flex;align-items:center;gap:10px;padding-bottom:13px}
  .dt-mini__track{position:relative;flex:1 1 auto;height:4px;border-radius:2px;background:var(--line);cursor:pointer}
  .dt-mini__track::after{content:"";position:absolute;left:0;right:0;top:50%;height:18px;transform:translateY(-50%)}   /* 放大点击/拖动热区 */
  .dt-mini__fill{position:absolute;left:0;top:0;height:100%;width:0;border-radius:2px;background:linear-gradient(90deg,var(--mc),var(--crimson));box-shadow:0 0 12px var(--mc);transition:width .08s linear}
  .dt-mini__fill::after{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);width:9px;height:9px;border-radius:50%;background:var(--mc);box-shadow:0 0 8px var(--mc)}   /* 播放头圆点 */
  .dt-mini__cur{position:absolute;left:0;top:calc(100% + 4px);transform:translateX(-50%);font-family:var(--font-latin);font-size:10px;line-height:1;color:var(--mc);white-space:nowrap;pointer-events:none;transition:left .08s linear}   /* 当前时间，随播放头移动（在进度条下方） */
  .dt-mini__tot{flex:none;font-family:var(--font-latin);font-size:12px;color:var(--ink-2);letter-spacing:.03em;white-space:nowrap}
  .dt-mini__s{display:flex;align-items:center;gap:8px;min-width:0}
  .dt-mini__time{font-family:var(--font-latin);font-size:12px;color:var(--ink-2);letter-spacing:.03em;white-space:nowrap;flex:none}
  .dt-mini__name{font-size:12px;color:var(--ink-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:66vw}   /* 手机端集名独占一行，放宽显示；PC 下另有窄限宽(见 @media≥768) */
  .dt-mini__nav{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);
    background:var(--fill-1);border:1px solid var(--line);transition:.18s;flex-shrink:0}
  .dt-mini__nav:hover{border-color:var(--mc);color:var(--mc)}
  /* 快退/快进(带步长数字) + 设置齿轮：与导航钮同款圆钮 */
  .dt-mini__skip,.dt-mini__set{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);
    background:var(--fill-1);border:1px solid var(--line);transition:.18s;flex-shrink:0;cursor:pointer}
  .dt-mini__skip{position:relative}
  .dt-mini__skip:hover,.dt-mini__set:hover{border-color:var(--mc);color:var(--mc)}
  .dt-mini__skipn{position:absolute;top:50%;left:50%;transform:translate(-50%,-42%);font-family:var(--font-latin);font-weight:800;font-size:8px;pointer-events:none}
  .dt-mini__fav{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);flex-shrink:0;background:var(--fill-1);border:1px solid var(--line);cursor:pointer;transition:.15s}
  .dt-mini__fav svg{width:17px;height:17px}
  .dt-mini__fav:hover{color:var(--mc);border-color:var(--mc)}
  .dt-mini__fav.on{color:var(--crimson);border-color:rgba(255,59,92,.45);background:rgba(255,59,92,.1)}
  .dt-mini__play{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:#fff;flex-shrink:0;
    background:linear-gradient(135deg,var(--crimson),#FF6177);box-shadow:var(--shadow-primary);transition:.18s}
  .dt-mini__play:hover{transform:translateY(-1px);box-shadow:var(--shadow-primary-h)}
  .dt-mini__play:active{transform:scale(.95)}

  /* ============================================================
     4 · 全屏「正在播放」覆盖层（自下而上滑入 · 发光波形）
     ============================================================ */
  /* 全屏播放器须低于登录/付费弹层(--z-modal)，否则试听 60 秒触发的登录/确认框会被本层(不透明背景)完全盖住，表现为"按钮全部无效"；仍高于导航/tabbar(≤600) */
  .ap-ov{position:fixed;inset:0;z-index:calc(var(--z-modal) - 50);display:flex;flex-direction:column;
    background:var(--paper);transform:translateY(100%);transition:transform .42s cubic-bezier(.2,.8,.2,1);
    overflow:hidden;visibility:hidden}
  /* 关闭且滑出动画结束后彻底移出布局(由 JS 在 transitionend 时加 [hidden])。
     否则这层 fixed + translateY(100%) 的满屏盒子在 iOS Safari 上会被计入文档可滚动高度，
     表现为"页面已到底却还能继续上滑，露出一整屏纯黑空白"。visibility:hidden 不会移除盒子占位，
     必须 display:none 才能收回这段被撑出的滚动空间。 */
  .ap-ov[hidden]{display:none}
  .ap-ov.open{transform:none;visibility:visible}
  .ap-ov::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
    background:radial-gradient(900px 600px at 50% -10%,var(--hero-glow),transparent 62%),
              radial-gradient(700px 500px at 50% 120%,rgba(230,184,115,.10),transparent 60%),var(--paper)}
  .ap-top{position:relative;z-index:2;display:flex;align-items:center;gap:12px;
    padding:calc(env(safe-area-inset-top) + 14px) clamp(16px,5vw,40px) 8px}
  .ap-top__lab{flex:1;text-align:center;font-family:var(--font-latin);font-style:italic;font-size:12px;
    letter-spacing:.16em;text-transform:uppercase;color:var(--mc)}
  .ap-ic{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);
    background:var(--fill-1);border:1px solid var(--line);transition:.18s;flex-shrink:0}
  .ap-ic:hover{border-color:var(--mc);color:var(--mc)}
  .ap-body{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:clamp(16px,3vh,30px);padding:10px clamp(20px,6vw,40px) clamp(28px,5vh,48px);overflow-y:auto}
  .ap-art{position:relative;width:min(74vw,300px);aspect-ratio:1;border-radius:22px;overflow:hidden;flex-shrink:0;
    box-shadow:var(--glow-red);background:var(--surface-2);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
  .ap-art img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
  .ap-art__fb{position:absolute;inset:0;z-index:0;display:grid;place-items:center;text-align:center;padding:16px;
    font-family:var(--font-serif);font-weight:700;font-size:17px;color:var(--cover-fb-ink);background:var(--cover-fb)}
  .ap-art.playing{animation:apPulse 4s ease-in-out infinite}
  @keyframes apPulse{0%,100%{transform:scale(1);box-shadow:var(--glow-red)}
    50%{transform:scale(1.018);box-shadow:0 0 0 1px rgba(255,59,92,.5),0 24px 70px -18px rgba(255,59,92,.75)}}
  .ap-meta{text-align:center;max-width:520px}
  .ap-meta__t{font-family:var(--font-serif);font-weight:900;font-size:clamp(20px,3.4vw,28px);color:var(--title);line-height:1.2}
  .ap-meta__cv{margin-top:8px;font-size:13.5px;color:var(--mc);font-weight:600;letter-spacing:.02em}

  /* 发光波形 */
  .ap-wave-wrap{width:100%;max-width:560px}
  .ap-wave{display:flex;align-items:center;justify-content:space-between;gap:2px;height:62px;cursor:pointer;
    padding:0 2px;touch-action:none}
  .ap-wave__bar{flex:1;min-width:2px;border-radius:3px;background:var(--line-2);transition:background .12s,box-shadow .12s,transform .12s}
  .ap-wave__bar.on{background:linear-gradient(180deg,var(--mc),var(--crimson));
    box-shadow:0 0 10px -1px var(--mc);transform:scaleY(1.04)}
  .ap-times{margin-top:8px;display:flex;justify-content:space-between;font-family:var(--font-latin);font-size:12px;
    color:var(--ink-3);letter-spacing:.04em}

  .ap-ctrl{display:flex;align-items:center;justify-content:center;gap:clamp(8px,3.2vw,26px)}
  .ap-ctrl__nav{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:var(--ink);
    background:var(--fill-2);border:1px solid var(--line);transition:.18s}
  .ap-ctrl__nav:hover{border-color:var(--mc);color:var(--mc)}
  /* 快退/快进（圆形描边 + 步长数字居中） */
  .ap-ctrl__skip{position:relative;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
    color:var(--ink);background:var(--fill-1);border:1px solid var(--line);cursor:pointer;transition:.18s}
  .ap-ctrl__skip:hover{border-color:var(--mc);color:var(--mc)}
  .ap-ctrl__skipn{position:absolute;top:50%;left:50%;transform:translate(-50%,-42%);
    font-family:var(--font-latin);font-weight:800;font-size:9.5px;pointer-events:none}
  .ap-ctrl__play{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:#fff;
    background:linear-gradient(135deg,var(--crimson),#FF6177);box-shadow:var(--shadow-primary);transition:.18s}
  .ap-ctrl__play:hover{transform:translateY(-2px);box-shadow:var(--shadow-primary-h)}
  .ap-ctrl__play:active{transform:scale(.96)}

  .ap-tools{display:flex;align-items:center;gap:14px}
  .ap-rate{height:38px;min-width:54px;padding:0 16px;border-radius:var(--r-pill);font-family:var(--font-latin);
    font-weight:700;font-size:13px;color:var(--ink-2);background:var(--fill-1);border:1px solid var(--line);transition:.18s}
  .ap-rate:hover{border-color:var(--mc);color:var(--mc)}
  .ap-listbtn{height:38px;padding:0 18px;border-radius:var(--r-pill);display:inline-flex;align-items:center;gap:8px;
    font-size:13px;font-weight:700;color:var(--ink-2);background:var(--fill-1);border:1px solid var(--line);transition:.18s}
  .ap-listbtn:hover{border-color:var(--mc);color:var(--mc)}

  /* 覆盖层内播放列表（自底升起 sheet） */
  .ap-sheet{position:absolute;inset:0;z-index:5;display:none}
  .ap-sheet.open{display:block}
  .ap-sheet__bd{position:absolute;inset:0;background:var(--mask);backdrop-filter:blur(4px)}
  .ap-sheet__panel{position:absolute;left:0;right:0;bottom:0;max-height:74vh;display:flex;flex-direction:column;
    background:var(--surface);border-top:1px solid var(--line-2);border-radius:22px 22px 0 0;box-shadow:var(--shadow-m);
    padding:10px clamp(14px,4vw,24px) calc(env(safe-area-inset-bottom) + 18px);animation:apSheetUp .3s cubic-bezier(.2,.8,.2,1)}
  @keyframes apSheetUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
  .ap-sheet__grip{width:42px;height:4px;border-radius:4px;background:var(--line-2);margin:6px auto 12px}
  .ap-sheet__hd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
  .ap-sheet__hd b{font-family:var(--font-serif);font-weight:900;font-size:17px;color:var(--title)}
  .ap-sheet__hd span{font-size:12px;color:var(--ink-3);font-family:var(--font-latin)}
  .ap-sheet__list{overflow-y:auto;display:flex;flex-direction:column;gap:4px}
  .ap-sheet__list::-webkit-scrollbar{width:6px}
  .ap-sheet__list::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:6px}
  .ap-epi{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:11px;cursor:pointer;transition:.16s}
  .ap-epi:hover{background:var(--fill-hover)}
  .ap-epi__name{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--ink);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ap-epi__dur{font-family:var(--font-latin);font-size:12px;color:var(--ink-3);flex-shrink:0}
  .ap-epi__eq{display:none;align-items:flex-end;gap:2px;height:14px;flex-shrink:0}
  .ap-epi__eq i{width:3px;border-radius:2px;background:var(--mc);box-shadow:0 0 6px var(--mc)}
  .ap-epi--on .ap-epi__name{color:var(--title)}
  .ap-epi--on{background:color-mix(in srgb,var(--mc) 12%,transparent)}
  .ap-epi--on .ap-epi__eq{display:flex}
  .ap-epi--on .ap-epi__eq i{height:5px}
  .ap-epi--playing .ap-epi__eq i:nth-child(1){animation:apEq1 .7s ease-in-out infinite}
  .ap-epi--playing .ap-epi__eq i:nth-child(2){animation:apEq2 .55s ease-in-out infinite}
  .ap-epi--playing .ap-epi__eq i:nth-child(3){animation:apEq3 .65s ease-in-out infinite}

  /* 播放设置 sheet（与 ap-sheet 共用外壳，内容为分组 chips） */
  .ap-set__body{display:flex;flex-direction:column;gap:18px;padding:2px 2px 8px}
  .ap-set__grp{display:flex;flex-direction:column;gap:10px}
  .ap-set__lab{font-size:13px;font-weight:700;color:var(--ink-2);letter-spacing:.02em}
  .ap-set__lab b{float:right;color:var(--ink);font-family:var(--font-latin);font-weight:800}
  /* 倍速吸附滑条(与视频设置统一,按弹层主题取色) */
  .ap-rng input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:3px;background:var(--line);outline:none;margin:8px 0 7px}
  .ap-rng input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--mc);box-shadow:0 0 10px -1px var(--mc);cursor:pointer;border:2px solid var(--surface)}
  .ap-rng input[type=range]::-moz-range-thumb{width:14px;height:14px;border:2px solid var(--surface);border-radius:50%;background:var(--mc);box-shadow:0 0 10px -1px var(--mc);cursor:pointer}
  .ap-rng__ticks{display:flex;justify-content:space-between}
  .ap-rng__ticks span{font-family:var(--font-latin);font-size:10.5px;color:var(--ink-3);cursor:pointer;transition:.15s}
  .ap-rng__ticks span.on{color:var(--mc);font-weight:800}
  .ap-set__chips{display:flex;flex-wrap:wrap;gap:8px}
  .ap-chip{height:36px;padding:0 16px;border-radius:var(--r-pill);font-family:var(--font-sans);font-size:13px;font-weight:700;
    color:var(--ink-2);background:var(--fill-1);border:1px solid var(--line);cursor:pointer;transition:.16s;display:inline-flex;align-items:center}
  .ap-chip:hover{border-color:var(--mc);color:var(--mc)}
  .ap-chip.on{color:#fff;background:var(--mc);border-color:transparent;box-shadow:0 6px 18px -8px var(--mc)}
  .ap-set__hint{font-size:12px;color:var(--ink-3);line-height:1.55}
  /* 播放设置：body 级独立居中弹窗（迷你条 / 全屏播放器齿轮共用，层级高于全屏覆盖层）
     PC 与 H5 统一为居中弹窗，不再用贴底 sheet —— 听书场景只需「点一下改完就走」，不需要上滑浏览 */
  .ap-setm{position:fixed;inset:0;z-index:calc(var(--z-modal) + 100);visibility:hidden;opacity:0;transition:opacity .22s}
  .ap-setm.open{visibility:visible;opacity:1}
  .ap-setm__veil{position:absolute;inset:0;background:var(--mask)}
  .ap-setm__panel{position:absolute;left:50%;top:50%;width:min(440px,88vw);max-height:80vh;overflow:auto;
    background:var(--surface);border-radius:18px;box-shadow:0 24px 60px -20px rgba(0,0,0,.55);
    padding:18px clamp(16px,4vw,22px) 22px;transform:translate(-50%,-46%);transition:transform .28s}
  .ap-setm.open .ap-setm__panel{transform:translate(-50%,-50%)}
  /* 居中弹窗没有上滑手势，隐藏 sheet 的拖拽提示条 */
  .ap-setm .ap-sheet__grip{display:none}
  @keyframes apEq1{0%,100%{height:5px}50%{height:14px}}
  @keyframes apEq2{0%,100%{height:9px}50%{height:4px}}
  @keyframes apEq3{0%,100%{height:6px}50%{height:13px}}

  /* —— 键盘可达：聚焦描边（noir 暗红，与频道色一致）—— */
  .dt-back:focus-visible,.dt-actb:focus-visible,.dt-cols a:focus-visible,
  .dt-hero__cta .ds-btn:focus-visible,.dt-mini__nav:focus-visible,.dt-mini__play:focus-visible,
  .ap-ic:focus-visible,.ap-ctrl__nav:focus-visible,.ap-ctrl__play:focus-visible,.ap-ctrl__skip:focus-visible,
  .ap-rate:focus-visible,.ap-listbtn:focus-visible,.ap-chip:focus-visible{
    outline:2px solid var(--crimson);outline-offset:3px;border-radius:12px}

  @media (prefers-reduced-motion:reduce){
    .ap-art.playing{animation:none}
    .ap-epi--playing .ap-epi__eq i{animation:none!important}
  }

/* 评分/评论提交按钮 — 提交中锁定并显示转圈图标 */
.cm-cmp__send.is-sending{opacity:.72;cursor:default;filter:none;pointer-events:none}
.cm-cmp__send{min-width:62px}
.cm-cmp__send .cm-cmp__spin{display:inline-block;width:15px;height:15px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:cm-send-spin .6s linear infinite;vertical-align:-3px}
@keyframes cm-send-spin{to{transform:rotate(360deg)}}
