/* ShortVideo list/page styles. Extracted from index.html during frontend split stage 1. */

/* ── 喜欢页空状态 ── */
.liked-empty-feed {
  height: 100dvh; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 10px; color: rgba(255,255,255,.4); font-size: 13px; text-align: center;
}
.liked-empty-feed i { font-size: 44px; color: rgba(255,255,255,.12); display: block; margin-bottom: 4px; }
.feed.liked-grid-feed {
  scroll-snap-type: none; overflow-y: auto; padding: 56px 4px 30px;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px;
  align-content: start; align-items: start; grid-auto-flow: row;
}
.liked-card {
  position: relative; display: block; width: 100%; min-width: 0;
  height: 0; padding-top: 133.333%; background: #111;
  overflow: hidden; border-radius: 4px; cursor: pointer; isolation: isolate;
}
.liked-card::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: var(--thumb); background-size: cover; background-position: center;
  filter: blur(14px); transform: scale(1.14); opacity: 0;
}
.liked-card.is-landscape::before { opacity: .58; }
.liked-card img {
  position: absolute; inset: 0; z-index: 1;
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform .18s ease, opacity .18s ease;
}
.liked-card.is-landscape img { object-fit: contain; }
.liked-card-heart {
  position: absolute; z-index: 2; top: 6px; right: 6px; color: #ff4757;
  font-size: 15px; padding: 3px; border-radius: 999px; background: rgba(0,0,0,.35);
  filter: drop-shadow(0 1px 3px rgba(0,0,0,.7));
}
@media (min-width: 768px) {
  .feed.liked-grid-feed {
    width: min(100%, 720px); margin: 0 auto; padding: 64px 10px 40px; gap: 8px;
  }
  .liked-card { border-radius: 8px; }
  .liked-card:hover img { transform: scale(1.035); }
  .liked-card.is-landscape:hover img { transform: scale(1.02); }
  .liked-card-heart { top: 8px; right: 8px; font-size: 18px; }
}
/* ── 发布人页：返回按钮 ── */
.nav-back { position:absolute; left:14px; top:10px; color:rgba(255,255,255,.85);
  font-size:20px; cursor:pointer; display:none; pointer-events:all; }
.nav-back.show { display:block; }
.nav-back:hover { color:#fff; }

/* ── 普通页容器（发布人列表 / 详情），可纵向滚动 ── */
.page { position:absolute; inset:0; overflow-y:auto; -webkit-overflow-scrolling:touch;
  padding:56px 14px 30px; background:#000; }
.page.hidden { display:none; }
.page::-webkit-scrollbar { display:none; }
.pub-loading { text-align:center; color:rgba(255,255,255,.45); font-size:14px; padding:60px 0; }

/* ── 发布人列表网格 ── */
.pub-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.pub-card { background:#141414; border-radius:12px; padding:18px 10px; text-align:center;
  cursor:pointer; transition:background .2s; border:1px solid rgba(255,255,255,.05); }
.pub-card:hover { background:#1e1e1e; }
.pub-card-avatar { width:64px; height:64px; border-radius:50%; object-fit:cover;
  margin:0 auto 10px; display:flex; align-items:center; justify-content:center; }
.pub-avatar-fallback { background:linear-gradient(135deg,#58d7c7,#3a8fff); color:#fff;
  font-size:26px; font-weight:600; }
.pub-card-name { font-size:14px; font-weight:600; color:#fff; margin-bottom:4px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pub-card-stat { font-size:11px; color:rgba(255,255,255,.4); }

/* ── 发布人详情头部（头像 / 名 / 简介 / 编辑） ── */
.pub-header { display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:8px; padding:10px 0 18px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:16px; }
.pub-header-avatar { width:84px; height:84px; border-radius:50%; object-fit:cover;
  display:flex; align-items:center; justify-content:center; font-size:34px; }
.pub-header-name { font-size:19px; font-weight:700; color:#fff; }
.pub-header-stat { font-size:12px; color:rgba(255,255,255,.45); }
.pub-header-bio { font-size:13px; color:rgba(255,255,255,.7); line-height:1.5; max-width:520px;
  white-space:pre-wrap; }
.pub-edit-btn { margin-top:4px; background:rgba(255,255,255,.1); color:#fff; border:none;
  border-radius:16px; padding:6px 18px; font-size:12px; cursor:pointer; }
.pub-edit-btn:hover { background:rgba(255,255,255,.2); }

/* ── 合集网格 ── */
.coll-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px; }
.coll-card { cursor:pointer; }

.pub-refresh-status {
  margin: 0 16px 12px; padding: 8px 12px; border-radius: 8px;
  background: rgba(88,215,199,.12); color: #58d7c7; font-size: 12px;
  display: flex; align-items: center; gap: 8px;
}
.pub-refresh-status.error { background: rgba(255,71,87,.15); color: #ff8a98; }
.pub-refresh-status .ti { font-size: 14px; }

/* ── 标签页 ── */
.tag-header {
  display: flex; align-items: center; gap: 12px;
  padding: 16px; color: #fff;
}
.tag-header .ti-tag { font-size: 20px; color: #58d7c7; }
.tag-header-title { font-size: 16px; font-weight: 600; }
.tag-header-count { font-size: 13px; color: rgba(255,255,255,.5); }
.tag-feed { flex: 1; overflow-y: scroll; scroll-snap-type: y mandatory; scrollbar-width: none; }
.tag-feed::-webkit-scrollbar { display: none; }

/* ── 统计栏 + 刷新按钮 ── */
.stats-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 16px 10px; color: rgba(255,255,255,.65);
  font-size: 13px;
}
.stats-bar .stats-text { font-weight: 500; }
.stats-bar .stats-count { color: #58d7c7; font-weight: 600; }
.refresh-btn {
  display: flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.7); padding: 6px 14px; border-radius: 18px;
  cursor: pointer; font-size: 12px; transition: all .2s;
  user-select: none;
}
.refresh-btn:hover { background: rgba(255,255,255,.15); color: #fff; }
.refresh-btn:active { transform: scale(.95); }
.refresh-btn.spinning i { animation: spin .8s linear infinite; }
.refresh-btn .ti-check { color: #58d7c7; }
.stats-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.refresh-btn.danger { border-color: rgba(255,120,90,.45); color: #ffb39f; }
.refresh-btn.danger:hover { background: rgba(255,120,90,.16); color: #fff; }
@keyframes spin { to { transform: rotate(360deg); } }
.coll-cover { position:relative; width:100%; aspect-ratio:3/4; border-radius:10px; overflow:hidden;
  background:#141414; }
.coll-cover img { width:100%; height:100%; object-fit:cover; }
.coll-badge { position:absolute; right:6px; top:6px; background:rgba(0,0,0,.65); color:#fff;
  font-size:11px; padding:2px 7px; border-radius:10px; display:flex; align-items:center; gap:3px; }
.coll-episode-btn {
  position:absolute; left:6px; bottom:6px; z-index:3;
  border:none; border-radius:999px; padding:3px 8px;
  background:rgba(0,0,0,.68); color:#fff; font-size:11px; cursor:pointer;
  display:flex; align-items:center; gap:3px;
}
.coll-episode-btn:hover { background:rgba(88,215,199,.25); }
.coll-play { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  font-size:34px; color:rgba(255,255,255,.85); filter:drop-shadow(0 1px 4px rgba(0,0,0,.6)); }
.coll-title { font-size:12px; color:rgba(255,255,255,.85); margin-top:6px; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ── 推荐页合集角标（折叠后的分集数提示） ── */
.coll-flag { display:inline-flex; align-items:center; gap:3px; background:rgba(88,215,199,.18);
  color:#58d7c7; font-size:11px; padding:2px 8px; border-radius:10px; margin-left:8px;
  cursor:pointer; pointer-events:auto; vertical-align:middle; }

/* ── 开发模式弹窗 ── */
.dev-modal { position:fixed; inset:0; z-index:520; display:none; align-items:center; justify-content:center;
  padding:24px; background:rgba(0,0,0,.58); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.dev-modal.show { display:flex; }
.dev-modal-box { width:min(92vw, 420px); min-height:280px; padding:18px; border-radius:24px;
  background:linear-gradient(145deg, rgba(28,28,32,.96), rgba(12,12,16,.94)); border:1px solid rgba(255,255,255,.14);
  box-shadow:0 22px 70px rgba(0,0,0,.48); display:flex; flex-direction:column; gap:16px; }
.dev-modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.dev-modal-title { display:flex; align-items:center; gap:8px; font-size:18px; font-weight:700; color:#fff; }
.dev-modal-title i { color:#58d7c7; }
.dev-modal-sub { margin-top:5px; font-size:12px; color:rgba(255,255,255,.45); }
.dev-modal-close { width:34px; height:34px; border:none; border-radius:999px; background:rgba(255,255,255,.09);
  color:rgba(255,255,255,.82); display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.dev-setting-card { border-radius:18px; padding:14px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.09); }
.dev-setting-title { font-size:15px; font-weight:700; color:#fff; margin-bottom:6px; }
.dev-setting-desc { font-size:12px; line-height:1.5; color:rgba(255,255,255,.55); margin-bottom:12px; }
.privacy-levels { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px; }
.privacy-levels button { min-height:72px; border-radius:15px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.07);
  color:rgba(255,255,255,.76); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer; }
.privacy-levels button span { font-size:15px; font-weight:700; }
.privacy-levels button small { font-size:10px; line-height:1.25; color:rgba(255,255,255,.48); }
.privacy-levels button.active { color:#06110f; background:#58d7c7; border-color:#58d7c7; box-shadow:0 10px 28px rgba(88,215,199,.22); }
.privacy-levels button.active small { color:rgba(0,0,0,.58); }
.privacy-blur-overlay { position:fixed; inset:0; z-index:360; display:none; pointer-events:none;
  background:rgba(0,0,0,.22); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); }
body.privacy-locked .privacy-blur-overlay { display:block; z-index:390; pointer-events:auto; background:rgba(0,0,0,.48); }
body.privacy-locked .pin-overlay { display:flex; z-index:620; }

/* ── 发布人资料编辑弹窗 ── */
.pub-modal { position:fixed; inset:0; background:rgba(0,0,0,.7); z-index:500;
  display:none; align-items:center; justify-content:center; padding:24px; }
.pub-modal.show { display:flex; }
.pub-modal-box { background:#1a1a1a; border-radius:14px; padding:20px; width:100%; max-width:380px;
  display:flex; flex-direction:column; gap:12px; }
.pub-modal-title { font-size:16px; font-weight:600; color:#fff; }
.pub-modal label { font-size:12px; color:rgba(255,255,255,.55); margin-bottom:4px; display:block; }
.pub-modal input, .pub-modal textarea { width:100%; background:rgba(255,255,255,.08);
  border:1px solid transparent; color:#fff; padding:9px; border-radius:8px; font-size:13px; outline:none; }
.pub-modal input:focus, .pub-modal textarea:focus { border-color:rgba(88,215,199,.5); }
.pub-modal textarea { resize:vertical; min-height:70px; }
.pub-modal-preview { width:60px; height:60px; border-radius:50%; object-fit:cover; align-self:center;
  border:1px solid rgba(255,255,255,.15); }
.pub-modal-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:4px; }
.pub-modal-actions .btn-save { background:#58d7c7; color:#000; border:none; padding:7px 18px;
  border-radius:16px; font-weight:600; cursor:pointer; font-size:13px; }
.pub-modal-actions .btn-cancel { background:transparent; color:rgba(255,255,255,.6); border:none;
  cursor:pointer; font-size:13px; }
.pub-modal-actions button:disabled { opacity:.48; cursor:not-allowed; }
.scan-path-modal { z-index:540; }
.scan-path-box { max-width:560px; max-height:min(78vh, 680px); }
.scan-path-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.scan-path-head .pub-modal-title { display:flex; align-items:center; gap:7px; }
.scan-path-sub { margin-top:5px; color:rgba(255,255,255,.48); font-size:12px; line-height:1.45; }
.scan-path-close { width:32px; height:32px; border:none; border-radius:999px; background:rgba(255,255,255,.08);
  color:rgba(255,255,255,.78); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.scan-path-warning { padding:10px 12px; border-radius:12px; background:rgba(255,193,7,.11);
  border:1px solid rgba(255,193,7,.22); color:rgba(255,255,255,.72); font-size:12px; line-height:1.5; }
.scan-path-current { color:rgba(255,255,255,.62); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.scan-path-list { min-height:180px; max-height:42vh; overflow:auto; border-radius:12px; border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04); padding:6px; }
.scan-path-empty, .scan-path-loading { padding:18px 12px; color:rgba(255,255,255,.48); font-size:13px; text-align:center; }
.scan-path-row { width:100%; border:none; border-radius:10px; background:transparent; color:rgba(255,255,255,.84);
  display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:8px; padding:9px 8px; cursor:pointer; text-align:left; }
.scan-path-row:hover { background:rgba(255,255,255,.08); }
.scan-path-row.is-disabled { opacity:.48; cursor:not-allowed; }
.scan-path-row.is-disabled .scan-path-check { visibility:hidden; }
.scan-path-row.is-selected { background:rgba(88,215,199,.13); color:#fff; }
.scan-path-row .scan-path-check { width:22px; height:22px; border-radius:7px; border:1px solid rgba(255,255,255,.22);
  display:flex; align-items:center; justify-content:center; color:transparent; }
.scan-path-row.is-selected .scan-path-check { background:#58d7c7; border-color:#58d7c7; color:#06110f; }
.scan-path-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.scan-path-open { border:none; border-radius:9px; background:rgba(255,255,255,.08); color:rgba(255,255,255,.78);
  padding:6px 8px; cursor:pointer; }
.scan-path-open:disabled { opacity:.28; cursor:default; }
.scan-path-selected { color:rgba(255,255,255,.6); font-size:12px; line-height:1.45; }
.scan-path-actions { align-items:center; flex-wrap:wrap; }
@media (max-width:640px) {
  .scan-path-box { max-width:100%; max-height:86vh; }
  .scan-path-list { max-height:48vh; }
}