/* 公共资源库访客页（科技风） */
[hidden]{display:none!important}
:root {
  /* R29：对齐全站默认主题 graphite「钢墨」（本页不加载 base.css，自带 token） */
  --bg:#0b0d0e; --text:#e7ebec; --dim:#9da7ab;
  --accent:#37d6a8; --accent2:#1f6f5c;
  --card:#16191b; --border:#232a2d; --glow:none;
  --line:#1e2426; --panel:#16191b; --grid-line:#14181a; --code-bg:#14181a; --code-text:#cfd6d7;
  --radius-sm:4px; --radius:6px; --radius-pill:999px;
  --dur-fast:120ms; --dur-base:180ms; --ease:cubic-bezier(0.2,0.7,0.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column}
.mono{font-family:var(--font-mono,Consolas,monospace);font-variant-numeric:tabular-nums} /* R29 密度纪律 */
.grid-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 20%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 20%,transparent 100%)}
body::after{content:"";position:fixed;inset:0;z-index:-2;
  background:radial-gradient(700px 400px at 20% -10%,color-mix(in srgb,var(--accent) 12%,transparent),transparent),radial-gradient(700px 400px at 90% 10%,color-mix(in srgb,var(--accent) 12%,transparent),transparent)}
.glass{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);}
.container{width:min(1080px,94%);margin:0 auto;flex:1;padding:26px 0 60px}

.top{position:sticky;top:0;z-index:20;background:var(--panel);border-bottom:1px solid var(--border)}
.top-inner{width:min(1080px,94%);margin:0 auto;display:flex;align-items:center;gap:18px;padding:14px 0}
.logo{font-weight:800;letter-spacing:1px;text-decoration:none;color:var(--text)}
.logo span{color:var(--accent)}
.top h1{flex:1;font-size:18px;letter-spacing:2px}
.top h1 em{font-style:normal;font-size:11px;color:var(--dim);letter-spacing:4px}
.btn-ghost-sm{padding:7px 16px;border-radius:var(--radius);border:1px solid var(--accent);color:var(--accent);font-size:12.5px;text-decoration:none;transition:background-color .3s}, border-color .3s}, color .3s}, opacity .3s}, transform .3s}@media (hover: hover) and (pointer: fine) {

.btn-ghost-sm:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
}
.btn-primary{display:inline-block;padding:11px 26px;border-radius:var(--radius);background:var(--accent);color:#fff;font-weight:600;border:none;cursor:pointer;text-decoration:none;transition:transform .3s, background-color .3s}@media (hover: hover) and (pointer: fine) {

.btn-primary:hover{transform:translateY(-2px)}
}

.toolbar{display:flex;flex-direction:column;gap:14px;padding:18px;margin-bottom:24px}
.tb-input{padding:11px 16px;border-radius:var(--radius);background:var(--panel-2, #0a0e1a);border:1px solid var(--border);color:var(--text);outline:none;font-size:14px;transition:border-color .3s}
.tb-input:focus{border-color:var(--accent)}
.cats{display:flex;gap:8px;flex-wrap:wrap}
.chip{font-size:12.5px;padding:5px 14px;border-radius:var(--radius-pill);background:var(--panel-2, #0a0e1a);border:1px solid var(--border);color:var(--dim);cursor:pointer;transition:background-color .25s, border-color .25s, color .25s, opacity .25s, transform .25s;user-select:none}@media (hover: hover) and (pointer: fine) {

.chip:hover{color:var(--accent)}
}
.chip.active{background:var(--accent);color:#fff;border-color:transparent}
.count{color:var(--dim);font-size:12px;margin-left:auto}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.card{padding:18px;cursor:pointer;transition:transform .3s}@media (hover: hover) and (pointer: fine) {

.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}
}
.card .ico{font-size:34px;display:block;margin-bottom:10px}
/* 卡片预览图：照片缩略图 / 视频首帧；图标垫底，媒体加载成功后淡入盖住 */
.card-media{position:relative;height:140px;margin-bottom:12px;border-radius:var(--radius);overflow:hidden;background:rgba(255,255,255,.03);display:flex;align-items:center;justify-content:center}
.card-media .ico{font-size:34px}
.card-media .card-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .25s ease}
.card-media .card-thumb.ok{opacity:1}
.card-media video.card-thumb{background:transparent}
.card b{font-size:14px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .meta{margin-top:10px;display:flex;justify-content:space-between;font-size:11.5px;color:var(--dim)}
.f-tag{display:inline-block;font-size:10.5px;padding:2px 9px;border-radius:var(--radius-pill);border:1px solid var(--border);color:var(--dim)}
.empty{text-align:center;color:var(--dim);padding:60px 0;font-size:14px}

.mwrap{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}
.mmask{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(4px)}
.mbox{position:relative;width:min(880px,96vw);max-height:92vh;overflow:auto;padding:26px;background:var(--panel-2, #0a0f1e);animation:rise .3s ease both}
/* 媒体预览时弹窗自动加宽，播放器更大气 */
.mbox:has(.mp-wrap){width:min(1200px,96vw)}
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
.mbox h3{color:var(--accent);font-size:16px;margin-bottom:14px;letter-spacing:1px}
.m-close{position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:var(--radius);background:none;border:1px solid var(--border);color:var(--dim);cursor:pointer}@media (hover: hover) and (pointer: fine) {

.m-close:hover{color:var(--accent);border-color:var(--accent)}
}
.pbox{text-align:center;margin-bottom:12px}
.pbox img,.pbox video{max-width:100%;max-height:72vh;border-radius:var(--radius);box-shadow:0 0 30px color-mix(in srgb,var(--accent) 15%,transparent)}
.pbox audio{width:100%}

/* 增强媒体播放器样式已抽取到 ../css/media-player.css（三端共用） */

/* ---------- 资源库：公共 / 我的 资源切换 ---------- */
.vault-tabs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 14px;margin-bottom:16px;border-radius:var(--radius)}
.vt-btn{
  min-height:44px; /* R22-3 命中区 */
  padding:7px 16px;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-meta,13px);
  border:1px solid transparent;background:transparent;color:var(--dim);transition:color var(--dur-base),background var(--dur-base),border-color var(--dur-base);
}@media (hover: hover) and (pointer: fine) {

.vt-btn:hover{color:var(--text)}
}
.vt-btn.active{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
.vt-count{font-size:11px;opacity:.8}
.vt-hint{margin-left:auto;font-size:11.5px;color:var(--dim)}

.card-owner-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px dashed var(--border)}
.mini-act{
  padding:4px 10px;border-radius:var(--radius-sm);cursor:pointer;font-size:11.5px;
  border:1px solid var(--border);background:transparent;color:var(--dim);transition:background-color .2s, border-color .2s, color .2s, opacity .2s, transform .2s;
}@media (hover: hover) and (pointer: fine) {

.mini-act:hover{color:var(--accent);border-color:var(--accent)}
}@media (hover: hover) and (pointer: fine) {

.mini-act.danger:hover{color:var(--danger);border-color:var(--danger)}
}
.meta.dim{color:var(--dim);font-size:11px}
.pframe{width:100%;height:58vh;border:none;border-radius:var(--radius);background:#fff}
.pmeta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;color:var(--dim);font-size:12px;margin-top:10px}
.pacts{display:flex;gap:12px;justify-content:flex-end;margin-top:16px}
.pnote{color:var(--dim);font-size:11.5px;text-align:center;margin-top:8px}

.foot{text-align:center;color:var(--dim);font-size:12px;padding:20px;border-top:1px solid var(--border)}
@media(max-width:768px){.top h1 em{display:none}}

/* ---------- 登录 / 上传 / 预览增强 ---------- */
.badges{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap}
.mine-badge,.pub-badge,.priv-badge{font-size:10px;padding:2px 8px;border-radius:var(--radius-pill);border:1px solid var(--border)}
.mine-badge{color:var(--accent);border-color:var(--accent)}
.pub-badge{color:#22c55e;border-color:#22c55e}
.priv-badge{color:#f59e0b;border-color:#f59e0b}
.lock-badge{color:#e8b339;border-color:rgba(232,179,57,.5)}
.v-auth-box{width:min(560px,94vw)}
.v-auth-box form{display:flex;flex-direction:column;gap:12px}
.v-auth-box input[type="text"],.v-auth-box input:not([type]),.v-auth-box input[type="password"]{
  padding:10px 12px;border-radius:var(--radius);background:var(--panel-2, #0a0e1a);border:1px solid var(--border);color:var(--text);outline:none;font-size:14px
}
.v-auth-box input:focus{border-color:var(--accent)}
.v-auth-actions{display:flex;gap:8px}
.v-file{position:relative;padding:12px;border:1px dashed var(--accent);border-radius:var(--radius);color:var(--accent);text-align:center;cursor:pointer;font-size:13px}
.v-file input{position:absolute;inset:0;opacity:0;cursor:pointer}

/* ---------- 上传插件：拖拽区 + 进度条 ---------- */
.v-dropzone{
  position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:26px 14px;border:1.5px dashed var(--border);border-radius:var(--radius);
  color:var(--dim);text-align:center;cursor:pointer;transition:background-color .18s ease, border-color .18s ease, color .18s ease, opacity .18s ease, transform .18s ease;
  outline:none;user-select:none;background:rgba(255,255,255,.02);
}
.v-dropzone b{color:var(--text);font-size:14px}
.v-dropzone small{font-size:11px}
.v-dropzone .dz-ico{font-size:30px;filter:grayscale(.2)}
.v-dropzone .dz-file{color:var(--accent);font-size:12px;min-height:1em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v-dropzone:hover,.v-dropzone:focus-visible{border-color:var(--accent)}
.v-dropzone.drag{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 6%,transparent);transform:scale(1.015)}
.v-dropzone.has-file{border-style:solid;border-color:rgba(34,197,94,.55)}
.v-prog{display:flex;align-items:center;gap:10px}
.v-prog-track{flex:1;height:7px;border-radius:var(--radius);background:rgba(255,255,255,.07);overflow:hidden}
.v-prog-bar{height:100%;width:0;border-radius:var(--radius);background:var(--accent);transition:width .15s ease;box-shadow:0 0 8px color-mix(in srgb,var(--accent) 50%,transparent)}
.v-prog .mono{font-size:12px;min-width:52px;text-align:right}
.top .cta{border-color:var(--accent);color:var(--accent);box-shadow:0 0 10px color-mix(in srgb,var(--accent) 18%,transparent)}@media (hover: hover) and (pointer: fine) {

.top .cta:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
}
.v-check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dim)}
.v-check input{width:auto}

/* ---------- 上传：可见性三态 + 访问密码 + 跨页面实时动态 ----------
   与主页上传弹窗、后台上传卡片同一套组件（UploadKit），类名前缀不同但视觉语言一致 */
.v-vis{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.v-vis .vv-label{font-size:12.5px;color:var(--dim)}
.v-seg{
  position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));flex:1 1 260px;
  padding:3px;border-radius:var(--radius);border:1px solid var(--border);background:var(--panel-2,#0a0e1a);
}
.v-seg .up-seg-slider{
  position:absolute;top:3px;bottom:3px;left:3px;width:calc((100% - 6px)/3);
  border-radius:var(--radius);transition:transform .3s cubic-bezier(.22,1,.36,1),width .3s ease;
  background:color-mix(in srgb,var(--accent) 28%,transparent);
  box-shadow:0 0 14px color-mix(in srgb,var(--accent) 22%,transparent);
}
/* 脚本还没量之前的兜底位置 */
.v-seg[data-on="1"] .up-seg-slider{transform:translateX(0)}
.v-seg[data-on="2"] .up-seg-slider{transform:translateX(100%)}
.v-seg[data-on="0"] .up-seg-slider{transform:translateX(200%)}
.v-seg .up-seg-opt{
  position:relative;z-index:1;padding:8px 6px;border:none;background:transparent;min-width:0;
  font-size:12.5px;font-family:inherit;color:var(--dim);cursor:pointer;text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .25s
}
.v-seg .up-seg-opt.active{color:var(--text)}
.v-pw{
  display:flex;flex-direction:column;gap:7px;padding:12px;border-radius:var(--radius);
  border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent) 6%,transparent)
}
.v-pw input{width:100%}
.v-pw .vp-note{font-size:11.5px;line-height:1.6;color:var(--dim)}
.v-live{
  display:flex;flex-direction:column;gap:6px;padding:9px 11px;border-radius:var(--radius);font-size:11.5px;
  border:1px dashed var(--border);background:rgba(255,255,255,.03)
}
.v-live .vl-k{color:var(--dim);letter-spacing:.04em}
.v-live .vl-list{display:flex;flex-direction:column;gap:4px;min-width:0}
.v-live .vl-row{display:flex;align-items:center;gap:7px;color:var(--text);min-width:0}
.v-live .vl-row b{
  flex:0 0 auto;font-size:10px;font-weight:600;padding:1px 7px;border-radius:var(--radius-pill);color:var(--accent);
  border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent) 10%,transparent)
}
.v-live .vl-row{overflow:hidden;text-overflow:ellipsis}
.v-live .vl-row .mono{margin-left:auto;color:var(--accent);font-size:10.5px;flex:0 0 auto}
.v-live .vl-row.ok{color:var(--dim)}
@media (max-width:480px){
  .v-vis{gap:6px}
  .v-seg{flex:1 1 100%}
  .v-seg .up-seg-opt{font-size:11px;padding:8px 3px;white-space:normal}
}
.table-scroll{max-height:58vh;overflow:auto;border-radius:var(--radius);border:1px solid var(--border);background:var(--code-bg, #05070f)}
.data-table{width:100%;border-collapse:collapse;font-size:12px}
.data-table th,.data-table td{padding:7px 10px;border-bottom:1px solid var(--border);text-align:left;white-space:nowrap;color:var(--text)}
.data-table th{color:var(--accent);position:sticky;top:0;background:var(--panel-2, #0a0e1a)}
.text-view{max-height:58vh;overflow:auto;background:var(--code-bg, #05070f);border:1px solid var(--border);border-radius:var(--radius);padding:14px;font-family:var(--font-mono,Consolas,monospace);font-size:12px;white-space:pre-wrap;word-break:break-word;color:var(--code-text,#c9d6ff)}
.data-table tbody tr:nth-child(even){background:rgba(255,255,255,.02)}@media (hover: hover) and (pointer: fine) {

.data-table tbody tr:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}
}
.pv-note{margin:10px 0 0;font-size:11px;color:var(--dim);text-align:center}
.pv-md{width:100%;max-height:58vh;overflow:auto;padding:18px 22px;border:1px solid var(--border);border-radius:var(--radius);background:var(--code-bg, #05070f);line-height:1.8}
.pv-md h2,.pv-md h3,.pv-md h4,.pv-md h5{margin:16px 0 8px;color:var(--accent)}
.pv-md p{margin:8px 0;font-size:14px}
.pv-md li{margin:4px 0 4px 20px;font-size:14px}
.pv-md pre{margin:10px 0;padding:12px 14px;overflow:auto;border-radius:var(--radius);background:var(--panel-2, #0a0e1a);border:1px solid var(--border);font-family:var(--font-mono,Consolas,monospace);font-size:12px;line-height:1.6}
.pv-md code{font-family:var(--font-mono,Consolas,monospace);font-size:.92em;color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);padding:1px 5px;border-radius:4px}
.pv-md pre code{background:none;padding:0;color:inherit}
.pv-md a{color:var(--accent);text-decoration:underline}

/* ============================================================
   批量操作工具栏（对齐后台能力：全选 / 连播 / 下载 / 公开私有 / 分类 / 删除）
   ============================================================ */
.bulk-bar{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:10px 14px;margin-bottom:16px;border-radius:var(--radius);position:relative;overflow:hidden;
}
.bulk-bar::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--accent);opacity:.7;
}
.bulk-bar.has-sel::before{box-shadow:0 0 14px color-mix(in srgb,var(--accent) 80%,transparent)}
.bulk-check{
  display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--dim);
  cursor:pointer;user-select:none;padding:4px 6px;
}
.bulk-check input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}
.bulk-btn{
  padding:6px 13px;border-radius:var(--radius);cursor:pointer;font-size:12px;
  border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--dim);
  transition:background-color .22s ease, border-color .22s ease, color .22s ease, opacity .22s ease, transform .22s ease;white-space:nowrap;
}@media (hover: hover) and (pointer: fine) {

.bulk-btn:hover{color:var(--accent);border-color:var(--accent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 22%,transparent);transform:translateY(-1px)}
}@media (hover: hover) and (pointer: fine) {

.bulk-btn.danger:hover{color:#f87171;border-color:#f87171;box-shadow:0 0 12px rgba(248,113,113,.25)}
}
.bulk-btn.pl-toggle{margin-left:auto;color:var(--accent);border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.bulk-sep{width:1px;height:20px;background:var(--border);margin:0 2px}
.bulk-count{font-size:11.5px;color:var(--dim);min-width:64px}
.bulk-bar.has-sel .bulk-count{color:var(--accent)}

/* 卡片勾选框 */
.card{position:relative}
.card-check{
  position:absolute;top:10px;right:10px;z-index:2;
  width:24px;height:24px;display:grid;place-items:center;
  border-radius:var(--radius);border:1px solid var(--border);
  background:rgba(5,7,15,.7);cursor:pointer;transition:background-color .2s, border-color .2s, color .2s, opacity .2s, transform .2s;
  opacity:.55;
}@media (hover: hover) and (pointer: fine) {

.card:hover .card-check{opacity:1}
}
.card-check input{width:14px;height:14px;accent-color:var(--accent);cursor:pointer;margin:0}
.card.selected{
  border-color:var(--accent);
}
.card.selected::after{
  content:"✓";position:absolute;top:12px;left:12px;
  width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  font-size:12px;font-weight:700;color:#04121a;
  background:var(--accent);
  box-shadow:0 0 12px color-mix(in srgb,var(--accent) 60%,transparent);
}

/* ============================================================
   悬浮播放列表（与播放器/迷你播放器联动）
   ============================================================ */
.playlist{
  position:fixed;right:18px;bottom:18px;z-index:90;
  width:min(360px,92vw);max-height:min(60vh,520px);
  display:flex;flex-direction:column;
  border-radius:var(--radius);overflow:hidden;
  background:rgba(8,12,24,.92);
  box-shadow:0 18px 50px rgba(0,0,0,.55), 0 0 30px color-mix(in srgb,var(--accent) 8%,transparent);
  animation:plRise .25s ease both;
}
@keyframes plRise{from{opacity:0;transform:translateY(14px)}}
.pl-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:12px 14px;border-bottom:1px solid var(--border);
  background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 8%,transparent),transparent);
}
.pl-title{font-size:13.5px;letter-spacing:1px;color:var(--accent);font-weight:600}
.pl-count{font-size:11px;color:var(--dim);font-weight:400}
.pl-actions{display:flex;gap:6px}
.pl-list{overflow:auto;padding:6px}
.pl-item{
  display:flex;align-items:center;gap:9px;
  padding:8px 10px;border-radius:var(--radius);cursor:pointer;
  transition:background .18s;border:1px solid transparent;
}@media (hover: hover) and (pointer: fine) {

.pl-item:hover{background:color-mix(in srgb,var(--accent) 7%,transparent);border-color:var(--border)}
}
.pl-item.now{
  background:color-mix(in srgb,var(--accent) 14%,transparent);
  border-color:color-mix(in srgb,var(--accent) 40%,transparent);
}
.pl-item.now .pl-name{color:var(--accent)}
.pl-idx{flex:0 0 24px;text-align:center;font-size:11px;color:var(--dim)}
.pl-item.now .pl-idx{color:var(--accent);animation:plPulse 1.2s ease-in-out infinite}
@keyframes plPulse{50%{opacity:.4}}
.pl-name{flex:1;min-width:0;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.pl-tag{flex:0 0 auto;font-size:10.5px;color:var(--dim)}
.pl-empty{padding:26px 14px;text-align:center;font-size:12px;color:var(--dim);line-height:1.8}

/* 轻量 toast 提示 */
#vtToast{
  position:fixed;left:50%;bottom:34px;transform:translate(-50%,16px);z-index:200;
  max-width:min(560px,90vw);padding:10px 20px;border-radius:var(--radius);
  font-size:13px;color:#dff6ff;
  background:rgba(8,12,24,.94);border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);
  box-shadow:0 10px 34px rgba(0,0,0,.5), 0 0 18px color-mix(in srgb,var(--accent) 15%,transparent);
  opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;
}
#vtToast.show{opacity:1;transform:translate(-50%,0)}

@media(max-width:768px){
  .bulk-btn{padding:5px 9px;font-size:11px}
  .playlist{right:10px;left:10px;bottom:10px;width:auto}
}

/* ---------- R03 标签云 / 卡片标签 chips ---------- */
.tag-cloud{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border, rgba(255,255,255,.1))}
.tag-cloud .chip{display:inline-flex;align-items:center;gap:5px}
.tag-cloud .tag-n{font-style:normal;font-size:10.5px;opacity:.65;line-height:1}
.card-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.card-tags .chip-tag{font-size:11px;padding:2px 9px;cursor:pointer}@media (hover: hover) and (pointer: fine) {

.card-tags .chip-tag:hover{color:var(--accent);border-color:var(--accent)}
}

/* ---------------- R06 收藏星标 ---------------- */
.fav-btn {
  margin-left: auto;
  padding: 2px 6px;
  border: none;
  border-radius:var(--radius);
  background: transparent;
  color: var(--text-dim, #8b93a5);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  transition: transform 0.15s ease, color 0.15s ease;
}@media (hover: hover) and (pointer: fine) {

.fav-btn:hover{ color: #ffc83d; transform: scale(1.15); }
}
.fav-btn.on { color: #ffc83d; text-shadow: 0 0 8px rgba(255, 200, 61, 0.45); }

/* ---------------- R06 专辑管理 ---------------- */
.alb-bar { margin-top: 10px; flex-wrap: wrap; gap: 8px; align-items: center; }
.alb-label { font-size: 12px; color: var(--dim); }
.alb-none { font-size: 12px; color: var(--dim); }
.alb-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 12px; border-radius:var(--radius); cursor: pointer; font-size: 12.5px;
  border: 1px solid var(--border); background: transparent; color: var(--text);
  transition: border-color 0.2s, color 0.2s;
}@media (hover: hover) and (pointer: fine) {

.alb-chip:hover{ border-color: var(--accent); color: var(--accent); }
}
.alb-chip .mono { font-size: 11px; color: var(--dim); }
.alb-new {
  padding: 5px 12px; border-radius:var(--radius); cursor: pointer; font-size: 12.5px;
  border: 1px dashed var(--accent); background: transparent; color: var(--accent);
}@media (hover: hover) and (pointer: fine) {

.alb-new:hover{ background: color-mix(in srgb, var(--accent) 8%, transparent); }
}
#albumDialog .alb-mask { position: fixed; inset: 0; z-index: 80; background: rgba(0, 0, 0, 0.6); }
#albumDialog .alb-panel {
  position: fixed; z-index: 81; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: min(560px, 94vw); max-height: 86vh; overflow: auto;
  background: var(--bg, #12161f); border: 1px solid var(--border); border-radius:var(--radius); padding: 16px;
}
.alb-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; font-size: 14px; }
.alb-head .mono { font-size: 11.5px; color: var(--dim); }
.alb-x { border: none; background: rgba(255, 255, 255, 0.06); color: var(--text); width: 28px; height: 28px; border-radius: 50%; cursor: pointer; }
.alb-actions, .alb-add { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; align-items: center; }
.alb-act {
  padding: 5px 12px; border-radius:var(--radius); cursor: pointer; font-size: 12px;
  border: 1px solid var(--border); background: transparent; color: var(--text); text-decoration: none;
}@media (hover: hover) and (pointer: fine) {

.alb-act:hover{ border-color: var(--accent); color: var(--accent); }
}@media (hover: hover) and (pointer: fine) {

.alb-act.danger:hover{ border-color: var(--danger); color: var(--danger); }
}
.alb-add select {
  flex: 1; min-width: 160px; padding: 6px 10px; border-radius:var(--radius); font-size: 12px;
  border: 1px solid var(--border); background: var(--bg, #12161f); color: var(--text);
}
.alb-items { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.alb-row {
  display: flex; align-items: center; gap: 8px; padding: 7px 10px;
  border: 1px solid var(--border); border-radius:var(--radius); cursor: grab; background: rgba(255, 255, 255, 0.02);
}
.alb-row:active { cursor: grabbing; }
.alb-idx { font-size: 11px; color: var(--dim); width: 22px; }
.alb-name { flex: 1; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.alb-op {
  border: 1px solid var(--border); background: transparent; color: var(--dim);
  width: 26px; height: 26px; border-radius:var(--radius-sm); cursor: pointer; font-size: 12px; line-height: 1;
}@media (hover: hover) and (pointer: fine) {

.alb-op:hover{ color: var(--accent); border-color: var(--accent); }
}
.alb-op:disabled { opacity: 0.3; cursor: default; }
.alb-empty { font-size: 12.5px; color: var(--dim); text-align: center; padding: 16px 0; }
.alb-tip { font-size: 11px; color: var(--dim); margin: 4px 0 0; }

/* ---------- T08 R22-2/6：底部动作栏 + 可见选择文件按钮 ---------- */
.v-actionbar { display: none; }
@media (max-width: 1024px) {
  .v-actionbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
    gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
    background: var(--panel, #16191b); border-top: 1px solid var(--border);
  }
  body { padding-bottom: 64px; } /* 给动作栏让位，不遮内容 */
}
.v-ab-btn {
  flex: 1; min-height: 44px; border-radius: var(--radius-sm); cursor: pointer;
  border: 1px solid var(--border); background: transparent; color: var(--text);
  font-size: var(--fs-meta, 13px); font-weight: 600;
}
.v-ab-btn:active { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.v-pick-btn {
  min-height: 44px; padding: 10px 22px; margin-top: 4px; cursor: pointer;
  border-radius: var(--radius-sm); border: 1px solid var(--accent);
  background: var(--accent); color: #fff; font-weight: 700; font-size: var(--fs-meta, 13px);
}
/* 取消按钮吸底可见（手机上「看进度→取消」全程可达） */
.v-prog .v-cancel { position: sticky; bottom: 72px; min-height: 44px; }