/* 组梦短剧 ZuMeng Drama - H5 前台样式（移动优先，红果式布局） */
:root{
  --red:#e5484d; --red-dark:#c73539; --ink:#1f2329; --ink2:#4e5969; --ink3:#86909c;
  --bg:#f7f8fa; --card:#fff; --line:#e5e6eb; --gold:#f7ba1e;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{font-family:"PingFang SC","Microsoft YaHei",-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;}
#app{max-width:520px;margin:0 auto;min-height:100%;padding-bottom:64px;position:relative;}
[dir="rtl"] #app{direction:rtl;}

/* ===== 底部导航 ===== */
.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;
  background:#fff;border-top:1px solid var(--line);display:flex;z-index:50;padding:4px 0 env(safe-area-inset-bottom);}
.tabbar .tab{flex:1;text-align:center;padding:6px 0;color:var(--ink3);font-size:11px;cursor:pointer;}
.tabbar .tab .ico{font-size:22px;line-height:1.2;}
.tabbar .tab.active{color:var(--red);font-weight:600;}
.tabbar .tab.welfare .ico{filter:none;}

/* ===== 通用 ===== */
.page{padding:12px;}
.muted{color:var(--ink3);font-size:12px;}
.chip{display:inline-block;padding:5px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);
  color:var(--ink2);font-size:13px;margin:0 8px 8px 0;cursor:pointer;}
.chip.active{background:var(--red);border-color:var(--red);color:#fff;}
.btn{display:inline-block;border:none;border-radius:8px;padding:10px 18px;font-size:14px;cursor:pointer;background:var(--red);color:#fff;}
.btn:disabled{opacity:.5;}
.btn.ghost{background:#fff;border:1px solid var(--line);color:var(--ink);}
.btn.gold{background:var(--gold);color:#5c3c00;}
.badge{display:inline-block;font-size:10px;padding:1px 6px;border-radius:4px;margin-right:4px;color:#fff;}
.badge.hot{background:var(--red);} .badge.new{background:#3491fa;} .badge.free{background:#00b42a;} .badge.lock{background:#86909c;}
.tag-pill{display:inline-block;font-size:11px;color:var(--red-dark);background:#fdf0f0;border-radius:4px;padding:1px 6px;margin-right:4px;}

/* ===== 剧集卡片 ===== */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.grid3 > *{min-width:0;}   /* 防止长标签/长单词把 1fr 轨道撑爆导致列表溢出错位 */
.dcard{cursor:pointer;min-width:0;}
.dcard .cover{position:relative;border-radius:10px;overflow:hidden;aspect-ratio:3/4;display:flex;
  align-items:flex-end;padding:8px;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.08);}
.dcard .cover .shine{position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.25),transparent 50%);}
.dcard .cover .emoji{position:absolute;top:12%;left:50%;transform:translateX(-50%);font-size:44px;opacity:.85;}
.dcard .cover .t{position:relative;font-size:13px;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.4);line-height:1.3;}
.dcard .cover .epsn{position:absolute;top:8px;right:8px;font-size:10px;background:rgba(0,0,0,.45);border-radius:4px;padding:1px 6px;}
.dcard .meta{font-size:11px;color:var(--ink3);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* ===== 首页沉浸式刷剧流（红果式：推荐/剧场/中文剧 + 竖滑自动播放） ===== */
.htabs{position:fixed;top:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;z-index:60;
  display:flex;justify-content:center;gap:24px;padding:13px 0 10px;
  background:linear-gradient(180deg,rgba(0,0,0,.5),transparent);pointer-events:none;}
.htabs .htab{pointer-events:auto;color:rgba(255,255,255,.78);font-size:16px;cursor:pointer;position:relative;
  padding-bottom:4px;text-shadow:0 1px 4px rgba(0,0,0,.5);user-select:none;}
.htabs .htab.active{color:#fff;font-weight:700;}
.htabs .htab.active::after{content:'';position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:18px;height:3px;border-radius:3px;background:var(--red);}

.vfeed{height:calc(100vh - 64px);overflow-y:scroll;scroll-snap-type:y mandatory;background:#000;}
.vfeed::-webkit-scrollbar{display:none;}
.vslide{height:100%;scroll-snap-align:start;scroll-snap-stop:always;position:relative;
  display:flex;align-items:center;justify-content:center;overflow:hidden;background:#000;}
.vbg{position:absolute;inset:0;}
.vbg img{width:100%;height:100%;object-fit:cover;filter:blur(26px) brightness(.45);transform:scale(1.12);}
.vbg-grad{position:absolute;inset:0;}
.vstage{position:relative;height:100%;aspect-ratio:9/16;max-width:100%;overflow:hidden;}
.vstage .vvid{width:100%;height:100%;object-fit:contain;background:transparent;}
.vshine{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.28),transparent 20%,transparent 60%,rgba(0,0,0,.62));pointer-events:none;z-index:3;}
.vpause{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;
  background:rgba(0,0,0,.45);color:#fff;display:none;align-items:center;justify-content:center;font-size:26px;pointer-events:none;z-index:5;}

/* 右侧互动按钮栏（点赞/收藏/评论/分享） */
.vstage .vrail{position:absolute;right:8px;bottom:100px;display:flex;flex-direction:column;gap:16px;align-items:center;z-index:6;}
.vstage .rbtn{color:#fff;text-align:center;cursor:pointer;text-shadow:0 1px 6px rgba(0,0,0,.7);user-select:none;}
.vstage .rbtn .ric{display:block;font-size:27px;line-height:1.1;filter:drop-shadow(0 1px 4px rgba(0,0,0,.6));}
.vstage .rbtn.active .ric{transform:scale(1.1);}
.vstage .rbtn .rn{display:block;margin-top:2px;font-size:11px;opacity:.95;min-width:34px;}

/* 左下：剧名一行 + 简介一行（超长省略号） */
.vinfo{position:absolute;left:12px;right:64px;bottom:46px;z-index:6;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7);cursor:pointer;}
.vinfo .vtitle{font-size:16px;font-weight:700;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vinfo .vdesc{font-size:12.5px;opacity:.88;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px;}
.vinfo .vstats{font-size:11.5px;opacity:.75;}

/* 广告门控覆盖层（刷剧流内嵌激励广告：前10集免广告，之后按服务端计划插门） */
.adgate{position:absolute;inset:0;z-index:20;background:rgba(8,8,12,.92);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;color:#fff;text-align:center;padding:24px;}
.adgate .ag-tag{font-size:10px;letter-spacing:1px;border:1px solid rgba(255,255,255,.4);border-radius:3px;padding:1px 6px;opacity:.85;}
.adgate .ag-net{font-size:12px;color:#9aa0a6;}
.adgate .ag-count{font-size:56px;font-weight:800;color:var(--gold);line-height:1.1;text-shadow:0 2px 18px rgba(0,0,0,.6);}
.adgate .ag-tip{font-size:13.5px;color:#e8eaed;}
.adgate .ag-sub{font-size:12px;color:#9aa0a6;}

/* 开启声音引导（自动播放策略：先静音播） */
.unmute{position:fixed;top:54px;right:14px;z-index:70;width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;font-size:18px;cursor:pointer;}
.vloading{color:#aaa;text-align:center;padding-top:45vh;font-size:13px;}
.adbox{width:100%;min-height:110px;border-radius:12px;background:repeating-linear-gradient(45deg,#f2f3f5,#f2f3f5 12px,#e8eaed 12px,#e8eaed 24px);
  display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:12px;overflow:hidden;position:relative;}
.adbox .tagpos{position:absolute;top:4px;left:8px;font-size:10px;color:var(--ink3);border:1px solid var(--ink3);border-radius:3px;padding:0 4px;}

/* ===== 播放器（竖屏舞台：手机 9:16 画幅居中，PC 上也是竖屏体验） ===== */
.player{position:fixed;inset:0;background:#000;z-index:100;display:flex;align-items:center;justify-content:center;}
/* 竖屏舞台：高度撑满、宽=高×9/16（PC 上呈现为居中竖屏，手机上铺满全屏） */
.player .pstage{position:relative;height:100%;aspect-ratio:9/16;max-width:100vw;background:#000;overflow:hidden;
  user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;}
@media (min-width:521px){ .player .pstage{border-radius:0;} }
.player video{width:100%;height:100%;object-fit:contain;background:#000;}
.player .top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:10px;padding:12px 16px;
  background:linear-gradient(180deg,rgba(0,0,0,.6),transparent);color:#fff;z-index:5;}
.player .top .back{font-size:22px;cursor:pointer;}
.player .top .title{font-size:15px;font-weight:600;}
.player .top .setlink{margin-left:auto;font-size:14px;cursor:pointer;padding:2px 4px;opacity:.95;text-shadow:0 1px 4px rgba(0,0,0,.6);}
.player .top .setlink:active{opacity:.6;}
/* 暂停时居中的半透明圆形播放按钮 */
.player .ppause{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:74px;height:74px;border-radius:50%;
  background:rgba(255,255,255,.3);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;
  font-size:30px;color:#fff;padding-left:6px;box-sizing:border-box;z-index:6;pointer-events:none;text-shadow:0 1px 6px rgba(0,0,0,.3);}
/* 竖滑切集提示浮层（拖动时短暂浮现） */
.player .swipe-hint{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.9);
  background:rgba(0,0,0,.62);color:#fff;border-radius:999px;padding:12px 26px;font-size:16px;font-weight:600;
  letter-spacing:1px;z-index:7;pointer-events:none;opacity:0;transition:opacity .15s,transform .15s;backdrop-filter:blur(4px);}
.player .swipe-hint.on{opacity:1;transform:translate(-50%,-50%) scale(1);}

/* 右侧互动栏（抖音/红果式竖排） */
.player .rail{position:absolute;right:10px;bottom:130px;display:flex;flex-direction:column;gap:18px;align-items:center;z-index:6;}
.player .rbtn{color:#fff;text-align:center;cursor:pointer;text-shadow:0 1px 6px rgba(0,0,0,.7);user-select:none;}
.player .rbtn .ric{display:block;font-size:28px;line-height:1.1;filter:drop-shadow(0 1px 4px rgba(0,0,0,.6));}
.player .rbtn.active .ric{transform:scale(1.08);}
.player .rbtn .rn{display:block;margin-top:2px;font-size:11px;opacity:.95;min-width:36px;}

/* 左下信息（标题 + 播放次数） */
.player .pinfo{position:absolute;left:14px;right:70px;bottom:60px;z-index:6;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7);}
.player .pinfo .ptitle{font-size:15.5px;font-weight:600;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.player .pinfo .pstats{font-size:12px;opacity:.85;}

/* 底部小进度条（常驻显示：实时进度 + 拖动快进/快退 + 缓冲显示；位于原 EP 按钮区域） */
.player .pbar{position:absolute;left:16px;right:16px;bottom:18px;z-index:7;}
.player .pbar .pbar-time{position:absolute;bottom:16px;left:0;background:rgba(0,0,0,.62);color:#fff;font-size:11px;
  padding:2px 8px;border-radius:999px;opacity:0;transition:opacity .15s;pointer-events:none;white-space:nowrap;}
.player .pbar.show .pbar-time,.player .pbar:hover .pbar-time{opacity:1;}
.player .pbar-hit{padding:9px 0;cursor:pointer;touch-action:none;}
.player .pbar-track{position:relative;height:3px;border-radius:3px;background:rgba(255,255,255,.28);transition:height .15s;}
.player .pbar.drag .pbar-track{height:5px;}
.player .pbar-buf{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.35);border-radius:3px;}
.player .pbar-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--red);border-radius:3px;}
.player .pbar-thumb{position:absolute;top:50%;left:0;width:11px;height:11px;border-radius:50%;background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.5);transform:translate(-50%,-50%);opacity:0;transition:opacity .15s;pointer-events:none;}
.player .pbar.show .pbar-thumb,.player .pbar:hover .pbar-thumb{opacity:1;}

/* 弹幕滚动层（顶部 60% 区域，4 轨道循环） */
.player .danmu-layer{position:absolute;top:0;left:0;right:0;height:60%;z-index:5;overflow:hidden;pointer-events:none;}
.player .danmu-layer .dm{position:absolute;left:100%;white-space:nowrap;color:#fff;font-size:14.5px;font-weight:600;
  text-shadow:0 1px 3px rgba(0,0,0,.85);padding:2px 6px;border-radius:4px;
  animation:dmfly 7s linear forwards;will-change:transform;}
.player .danmu-layer .dm.mine{background:rgba(229,72,77,.78);border:1px solid rgba(255,255,255,.55);}
@keyframes dmfly{to{transform:translateX(var(--dm-end,-120vw));}}

/* 播放设置弹窗（长按视频空白 / 右键呼出，bottom sheet 同款） */
.ssheet{max-height:78%;}
.ssheet .sbody{overflow-y:auto;padding:0 16px calc(16px + env(safe-area-inset-bottom));}
.ssheet .ssec{padding:12px 0;border-bottom:1px solid #f2f3f5;}
.ssheet .ssec:last-child{border-bottom:none;}
.ssheet .ssec>b{display:block;font-size:14px;margin-bottom:9px;}
.sopts{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.sopt{padding:7px 14px;border:1px solid var(--line);border-radius:999px;font-size:13px;cursor:pointer;background:#fff;color:var(--ink);white-space:nowrap;}
.sopt.active{background:var(--red);border-color:var(--red);color:#fff;font-weight:600;}
.sopt.disabled{opacity:.4;cursor:not-allowed;}
.ssheet .stip{font-size:12px;color:var(--ink3);margin-top:8px;}
.ssheet .stip:empty{display:none;}
.ssheet .srow{display:flex;gap:8px;align-items:center;}
.ssheet .stoggle{position:relative;width:40px;height:22px;background:#ccc;border-radius:999px;cursor:pointer;transition:.2s;flex:none;}
.ssheet .stoggle.on{background:var(--red);}
.ssheet .stoggle i{position:absolute;top:2px;left:2px;width:18px;height:18px;background:#fff;border-radius:50%;transition:.2s;}
.ssheet .stoggle.on i{left:20px;}
.ssheet #s-dm-input{flex:1;min-width:0;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:13.5px;outline:none;}
.ssheet #s-dm-input:focus{border-color:var(--red);}

/* ===== 评论抽屉（半屏 bottom sheet） ===== */
.csheet-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:220;}
.csheet{position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;max-height:72%;  background:#fff;border-radius:16px 16px 0 0;display:flex;flex-direction:column;}
/* 播放设置弹窗比视频窄（竖屏舞台宽 = min(100vw, 100vh*9/16)，再收 24px） */
.csheet.ssheet{max-width:calc(min(100vw, 56.25vh) - 24px);}
.csheet .chead{padding:14px 16px 8px;font-weight:600;display:flex;justify-content:space-between;align-items:center;font-size:15px;}
.csheet .clist{flex:1;overflow-y:auto;padding:0 16px;min-height:120px;}
.citem{padding:10px 0;border-bottom:1px solid var(--line);display:flex;gap:10px;font-size:13.5px;}
.citem:last-child{border-bottom:none;}
.citem .cavatar{width:34px;height:34px;border-radius:50%;background:#f2f3f5;display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;color:var(--ink2);}
.citem .cbody{flex:1;word-break:break-word;}
.citem .cname{color:var(--ink3);font-size:12px;margin-bottom:2px;}
.csheet .cinput{display:flex;gap:8px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--line);}
.csheet .cinput input{flex:1;border:1px solid var(--line);border-radius:999px;padding:9px 14px;font-size:14px;outline:none;}

/* ===== 选集弹窗（与评论抽屉同款 bottom-sheet） ===== */
.esheet{max-height:80%;}
.esheet .einfo{display:flex;gap:12px;padding:14px 16px 10px;}
.esheet .einfo .ecover{width:84px;height:112px;border-radius:8px;overflow:hidden;flex-shrink:0;position:relative;background:#222;}
.esheet .einfo .ecover img{width:100%;height:100%;object-fit:cover;}
.esheet .einfo .emeta{flex:1;min-width:0;}
.esheet .einfo .etitle{font-weight:600;font-size:15px;margin-bottom:4px;}
.esheet .einfo .edesc{font-size:12.5px;color:var(--ink3);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.esheet .einfo .estats{margin-top:6px;font-size:12px;color:var(--ink3);}
.esheet .egrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px;padding:4px 16px 12px;}
.esheet .eg{height:36px;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;cursor:pointer;background:#fff;color:var(--ink);}
.esheet .eg.active{background:var(--red);border-color:var(--red);color:#fff;font-weight:600;}
.esheet .eg.lock{color:var(--ink3);background:#f7f8fa;}
.esheet .esec{padding:10px 16px 6px;font-weight:600;font-size:14px;border-top:1px solid #f2f3f5;}
.esheet .reclist{display:flex;gap:10px;overflow-x:auto;padding:2px 16px calc(14px + env(safe-area-inset-bottom));}
.esheet .reclist .empty{padding:6px 0 14px;color:var(--ink3);}
.esheet .reccard{width:86px;flex-shrink:0;cursor:pointer;}
.esheet .reccard .rcover{width:86px;height:115px;border-radius:8px;overflow:hidden;position:relative;background:#222;}
.esheet .reccard .rcover img{width:100%;height:100%;object-fit:cover;}
.esheet .reccard .rcover .rgrad{position:absolute;inset:0;}
.esheet .reccard .rcover .rno{position:absolute;bottom:4px;left:6px;color:#fff;font-size:11px;text-shadow:0 1px 2px rgba(0,0,0,.5);}
.esheet .reccard .rname{font-size:12px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink);}

/* ===== 详情页互动操作行 ===== */
.d-actions{display:flex;gap:16px;margin-top:10px;position:relative;z-index:2;}
.d-actions .dact{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:rgba(255,255,255,.92);cursor:pointer;
  text-shadow:0 1px 4px rgba(0,0,0,.4);}
.d-actions .dact.on{color:#ffd7d9;font-weight:600;}
.d-actions .dact .ic{font-size:16px;}

/* ===== 弹层 ===== */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:200;display:flex;align-items:center;justify-content:center;padding:24px;}
.modal{background:#fff;border-radius:16px;max-width:360px;width:100%;padding:22px;text-align:center;}
.modal h3{font-size:17px;margin-bottom:10px;}
.modal .desc{color:var(--ink2);font-size:13.5px;margin-bottom:16px;}
.modal .adstage{border-radius:12px;min-height:150px;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;
  background:#111;color:#fff;margin-bottom:14px;}
.modal .adstage .count{font-size:34px;font-weight:700;color:var(--gold);}
.modal .actions{display:flex;gap:10px;}
.modal .actions .btn{flex:1;}

/* ===== 福利中心 ===== */
.welfare-top{background:linear-gradient(135deg,#7a0d10,#e5484d);border-radius:16px;color:#fff;padding:20px;text-align:center;}
.welfare-top .big{font-size:32px;font-weight:700;}
.welfare-top .usd{opacity:.85;font-size:13px;margin-top:2px;}
.sign-strip{display:flex;gap:6px;margin-top:14px;}
.sign-strip .d{flex:1;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);border-radius:8px;
  padding:6px 2px;font-size:11px;text-align:center;}
.sign-strip .d.done{opacity:.55;}
.sign-strip .d .c{color:var(--gold);font-weight:700;}
.wcard{background:#fff;border-radius:12px;padding:16px;margin-top:12px;display:flex;align-items:center;gap:14px;}
.wcard .ico{font-size:30px;}
.wcard .info{flex:1;}
.wcard .info b{font-size:15px;}
.wcard .info .muted{display:block;margin-top:2px;}
.coinlog{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.coinlog:last-child{border-bottom:none;}
.coinlog .plus{color:var(--red);font-weight:600;} .coinlog .minus{color:#86909c;}

/* ===== 我的 ===== */
.me-card{background:linear-gradient(135deg,#7a0d10,#e5484d);border-radius:16px;color:#fff;padding:20px;display:flex;align-items:center;gap:14px;}
.me-card .avatar{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:26px;}
.me-card .coins-mini{margin-left:auto;text-align:center;}
.me-card .coins-mini b{font-size:20px;display:block;}
.hlist{display:flex;gap:10px;overflow-x:auto;padding:4px 0;}
.hlist .hitem{width:90px;flex-shrink:0;cursor:pointer;}
.hlist .hitem .cover{border-radius:8px;aspect-ratio:3/4;color:#fff;display:flex;align-items:flex-end;padding:6px;font-size:11px;}
.section-title{font-size:16px;font-weight:600;margin:18px 0 10px;display:flex;justify-content:space-between;align-items:center;}

/* 语言选择 */
.langsel{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;}
.langsel .opt{padding:10px;border:1px solid var(--line);border-radius:8px;text-align:center;font-size:13px;cursor:pointer;background:#fff;}
.langsel .opt.active{border-color:var(--red);color:var(--red);font-weight:600;}

/* 详情页 */
.detail-hero{color:#fff;padding:24px 20px 18px;position:relative;}
.detail-hero .back{position:absolute;top:14px;left:14px;font-size:22px;cursor:pointer;z-index:5;}
.detail-hero h2{font-size:22px;margin-bottom:8px;text-shadow:0 2px 6px rgba(0,0,0,.4);}
.detail-hero p{font-size:13px;opacity:.92;max-width:90%;}
.epgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px;}
.epgrid .ep{border:1px solid var(--line);background:#fff;border-radius:8px;text-align:center;padding:8px 2px;font-size:13px;cursor:pointer;}
.epgrid .ep.active{background:var(--red);color:#fff;border-color:var(--red);}
.epgrid .ep.lock{color:var(--ink3);}

/* 加载/空态 */
.empty{text-align:center;color:var(--ink3);padding:48px 0;font-size:13px;}
.toast{position:fixed;top:18%;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.78);color:#fff;
  border-radius:8px;padding:10px 20px;font-size:14px;z-index:300;max-width:80%;text-align:center;}
.searchbar{display:flex;gap:8px;margin-bottom:12px;}
.searchbar input{flex:1;border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:14px;outline:none;background:#fff;}

/* ---------- 原生化体验（v1.30） ---------- */
/* 禁浏览器橡皮筋/长按选中（输入框除外），页面像 App 一样稳 */
html,body{overscroll-behavior:none;}
body{-webkit-user-select:none;-webkit-touch-callout:none;}
input,textarea,select{-webkit-user-select:text;-webkit-touch-callout:default;}

/* 安全区：刘海屏/手势条不顶内容 */
.htabs{padding-top:calc(env(safe-area-inset-top,0px) + 13px);}
.unmute{top:calc(env(safe-area-inset-top,0px) + 54px);}
.player .top{padding-top:calc(env(safe-area-inset-top,0px) + 12px);}
.detail-hero .back{top:calc(env(safe-area-inset-top,0px) + 14px);}

/* 触控按压反馈（原生 App 手感） */
.btn,.chip,.sopt,.eg,.ep,.tab,.dcard .cover,.reccard,.hitem,.dact{transition:transform .12s ease;}
@media (hover:none){
  .btn:active,.chip:active,.sopt:active,.eg:active,.ep:active{transform:scale(.93);}
  .dcard:active .cover,.reccard:active,.hitem:active{transform:scale(.96);}
  .tab:active .ico{transform:scale(.85);}
  .dact:active{transform:scale(.92);}
}
.tab .ico{transition:transform .15s cubic-bezier(.2,.8,.3,1.4);}
.tab.active .ico{animation:tabBounce .28s ease;}
@keyframes tabBounce{0%{transform:scale(.7);}55%{transform:scale(1.18);}100%{transform:scale(1);}}

/* 页面进入转场 */
@keyframes pageIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.page-enter{animation:pageIn .22s ease-out;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.player{animation:fadeIn .18s ease-out;}

/* 弹层转场：遮罩淡入 + 面板自下而上滑入（原生 bottom-sheet 手感） */
.csheet-mask,.modal-mask{animation:maskIn .18s ease-out;}
@keyframes maskIn{from{opacity:0;}to{opacity:1;}}
.csheet{animation:sheetUp .26s cubic-bezier(.2,.8,.3,1);}
@keyframes sheetUp{from{transform:translate(-50%,55%);}to{transform:translate(-50%,0);}}
.modal{animation:modalIn .2s cubic-bezier(.2,.8,.3,1);}
@keyframes modalIn{from{opacity:0;transform:scale(.88);}to{opacity:1;transform:scale(1);}}

/* toast 原生化：下滑入场 + 淡出 */
.toast{animation:toastIn .22s cubic-bezier(.2,.8,.3,1);border-radius:999px;box-shadow:0 4px 18px rgba(0,0,0,.25);}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,-16px);}to{opacity:1;transform:translate(-50%,0);}}

/* 骨架屏（列表首屏加载） */
.skc{min-width:0;}
.skc .cover{aspect-ratio:3/4;border-radius:10px;
  background:linear-gradient(90deg,#eceef1 25%,#f7f8fa 45%,#eceef1 65%);
  background-size:200% 100%;animation:skShimmer 1.1s infinite linear;}
.skc .meta{height:12px;border-radius:6px;margin-top:6px;width:70%;
  background:linear-gradient(90deg,#eceef1 25%,#f7f8fa 45%,#eceef1 65%);
  background-size:200% 100%;animation:skShimmer 1.1s infinite linear;}
@keyframes skShimmer{to{background-position:-200% 0;}}

/* 品牌闪屏（启动即品牌色满屏，boot 后淡出） */
#splash{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(160deg,#7a0d10,#e5484d);color:#fff;transition:opacity .35s ease;}
#splash.hide{opacity:0;pointer-events:none;}
#splash .sp-logo{font-size:64px;animation:spPop .5s cubic-bezier(.2,.8,.3,1.4);}
#splash .sp-name{font-size:22px;font-weight:800;margin-top:14px;letter-spacing:.5px;}
#splash .sp-sub{font-size:13px;opacity:.85;margin-top:4px;}
#splash .sp-dots{display:flex;gap:8px;margin-top:26px;}
#splash .sp-dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.85);animation:spDot 1s infinite ease-in-out;}
#splash .sp-dots i:nth-child(2){animation-delay:.15s;}
#splash .sp-dots i:nth-child(3){animation-delay:.3s;}
@keyframes spPop{from{transform:scale(.5);opacity:0;}to{transform:scale(1);opacity:1;}}
@keyframes spDot{0%,100%{transform:translateY(0);opacity:.5;}50%{transform:translateY(-7px);opacity:1;}}

/* ---------- 采集内容：图片封面支持 ---------- */
.cover{position:relative;overflow:hidden;}
.cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.cover .shine,.cover .emoji,.cover .epsn,.cover .t{position:relative;z-index:1;}
.cover-img + .shine{background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.65));}
.slide{position:relative;overflow:hidden;}
.slide-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
.slide .shine,.slide .inner{position:relative;z-index:1;}
.detail-hero{position:relative;overflow:hidden;}
.detail-hero .back,.detail-hero h2,.detail-hero p{position:relative;z-index:2;}