/* 仙人掌 · nopal PWA v5（10-16 品牌定案：仙人掌綠 t6 為 :root 預設，logo＝23_brand V1 綠圓白掌）。t1 科技藍搬到 ?theme=t1 可切；舊外觀 v4 備份 static_v7_backup/。
   只按 390 寬設計；>520px 置中成 430 寬手機框（frame 帶 transform，fixed 子元素以框為準）。
   視覺系統 v3（出處：ui_bench/04_design_system.md「v3 品牌」＋ 23_brand/23_BRAND_GUIDE.md）：骨架同 v2（t1）：
   底 #F2F3F5、卡白、字 #1D2129／#4E5969／#60646C；綠 #2A7E3B 只做五種語義＝主鈕／底部選中／進度／金額／可點字（＋品牌圖形）；
   「已完成」近黑籤、時間軸完成點近黑、「待審核」綠描邊、「失敗」#B3261E 深紅字＋「!」圖標；表單選中框用近黑（--sel）；
   圓角 卡 8／輸入 6／鈕 8；蘋方＋DIN 數字；髮絲線不用陰影；無漸層。全站文字對比 ≥4.5:1（selfcheck/brand_shoot.py 量）。
   深色 t5 只能手動 ?theme=t5，不跟系統 prefers-color-scheme 自動切（白底商品照在深色下會突兀）。 */
:root{
  color-scheme:light;
  --bg:#F2F3F5; --card:#FFFFFF; --ink:#1D2129; --ink2:#4E5969; --ink3:#60646C;
  --line:#E5E6EB; --line2:#C9CDD4; --soft:#F2F3F5; --accent:#2A7E3B; --accent-press:#236A31; --accent-soft:#E9F6E9;
  --danger:#B3261E; --danger-soft:#FFECE8;
  --r-card:8px; --r-input:6px; --pad:16px; --tab:60px; --gap:20px;
  --btn:var(--accent); --on-btn:#fff; --btn-dis:#E5E6EB; --on-dis:#4E5969; --r-btn:8px; --r-thumb:6px; --r-sheet:12px; --r-fab:999px; --r-chip:8px;
  --tab-on:var(--accent); --tl-ok:var(--ink); --done-bg:var(--ink); --sel:var(--ink); --link:var(--accent);
  --font-num:"DIN Alternate","Roboto Condensed",-apple-system,sans-serif;
  --fs-h2:20px; --fs-h3:16px; --fs-body:14px; --fs-cap:12px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
}
/* 舊 v3 暖白橘（10-16 前現行）：?theme=orange 可切回對照 */
[data-theme="orange"]{
  --bg:#F5F4F1; --card:#FFFFFF; --ink:#161616; --ink2:#5B5955; --ink3:#8B8884;
  --line:#E6E3DE; --line2:#D9D5CF; --accent:#E5532B; --accent-press:#C4441F; --soft:#EFEBE6; --danger:#9A2B1E;
  --r-card:16px; --r-input:12px;
  --btn:var(--ink); --on-btn:#fff; --btn-dis:#CFCCC6; --on-dis:#fff; --r-btn:999px; --r-thumb:10px; --r-sheet:20px; --r-fab:999px; --r-chip:999px;
  --accent-soft:#FCEDE8; --danger-soft:#F6E9E6; --tab-on:var(--ink); --font-num:"Figtree",sans-serif; --tl-ok:var(--ink); --done-bg:var(--ink); --sel:var(--accent); --link:var(--accent);
  --font:"Figtree","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
}
[data-theme="orange"] .shoot-h{font-weight:900}
[data-theme="orange"] .more,[data-theme="orange"] .shoot-how{color:var(--ink2)}
[data-theme="orange"] .tag.fail::before{display:none}
[data-theme="orange"] .tag.review{background:var(--accent-soft);color:var(--accent-press);box-shadow:none}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font-family:var(--font);font-size:var(--fs-body);line-height:1.5;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;min-height:100dvh;-webkit-text-size-adjust:100%}
h1,h2,h3,p,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
button,input{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
img:not([src]){visibility:hidden}
.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.hidden{display:none!important}
b,strong{font-weight:700}

/* 字級：h2 20／h3 16／正文 14／說明 12 */
.h2{font-size:var(--fs-h2);font-weight:700;line-height:1.3;letter-spacing:-.01em}
.h3{font-size:var(--fs-h3);font-weight:700;line-height:1.3}
.sub{font-size:var(--fs-body);color:var(--ink2)}
.cap{font-size:var(--fs-cap);color:var(--ink3);line-height:1.45}
.lbl{font-size:13px;font-weight:700;color:var(--ink)}
.num-accent{color:var(--accent)}
.link{background:none;border:0;padding:0;color:var(--link);font-weight:700;font-size:inherit;cursor:pointer;white-space:nowrap}
.col{display:flex;flex-direction:column;gap:10px}
.row{display:flex;align-items:center;gap:10px}
.grow{flex:1;min-width:0}
.ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp44{width:44px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-card)}

/* 框：手機＝普通文檔流；>520px＝置中 430 手機框 */
.frame{position:relative;min-height:100dvh}
.desk-note{display:none}
@media (min-width:521px){
  html,body{height:100%;overflow:hidden}
  .frame{width:430px;height:min(900px,calc(100dvh - 64px));min-height:0;margin:24px auto 0;border:1px solid var(--line2);border-radius:36px;overflow:hidden;transform:translateZ(0);background:var(--bg)}
  .scroller{height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
  .scroller::-webkit-scrollbar{display:none}
  .desk-note{display:block;text-align:center;font-size:12px;color:var(--ink3);margin:12px 0 0}
}

/* 按鈕 */
.btn{height:52px;border-radius:var(--r-btn);border:0;padding:0 20px;font-weight:700;font-size:16px;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;width:100%;transition:transform .15s ease-out;white-space:nowrap}
.btn-primary{background:var(--btn);color:var(--on-btn)}
.btn-primary:disabled{background:var(--btn-dis);color:var(--on-dis);cursor:default}
input::placeholder{color:var(--ink3);opacity:1}
.btn-secondary{background:var(--card);color:var(--ink);border:1px solid var(--line2)}
.icon-btn{width:44px;height:44px;border-radius:999px;border:0;background:transparent;display:inline-flex;align-items:center;justify-content:center;color:var(--ink);cursor:pointer}
.icon-btn .ic{width:24px;height:24px}
.btn:active:not(:disabled),.excard:active,.chip:active,.mitem:active,.jrow:active,.livebar:active,.pk:active,.tabbar .fab:active,.code-pill:active,.bell:active,.seg button:active{transform:scale(.98)}
.excard,.chip,.mitem,.jrow,.livebar,.pk{transition:transform .15s ease-out}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.view.on{animation:fadein .15s ease-out}
@media (prefers-reduced-motion:reduce){.view.on{animation:none}.btn,.excard,.chip{transition:none}}

/* 骨架 */
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.55}}
.sk{background:var(--soft);border-radius:10px;animation:pulse 1.2s ease-in-out infinite}
.sk-line{height:12px;border-radius:6px;background:var(--soft);animation:pulse 1.2s ease-in-out infinite}

/* 頂欄（tab 頁） */
.topbar{position:sticky;top:0;z-index:20;background:var(--bg);padding:env(safe-area-inset-top) 8px 0 var(--pad);height:calc(52px + env(safe-area-inset-top));display:flex;align-items:center;gap:8px;border-bottom:1px solid transparent}
.topbar.scrolled{border-bottom-color:var(--line)}
.tb-left{flex:1;min-width:0}
.greet{font-size:18px;font-weight:700;letter-spacing:-.01em}
.code-pill{height:32px;border-radius:999px;border:1px solid var(--line);background:var(--card);padding:0 10px 0 3px;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;cursor:pointer;max-width:150px}
.code-pill span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avatar{width:26px;height:26px;border-radius:999px;background:var(--ink);color:#fff;font-size:10.5px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;letter-spacing:.02em}
.avatar.empty{background:var(--soft);color:var(--ink3)}
.avatar-lg{width:44px;height:44px;font-size:14px}
.bell{position:relative;width:40px;height:40px;border:0;background:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink)}
.bell .ic{width:22px;height:22px}
.bell i{position:absolute;top:9px;right:10px;width:7px;height:7px;border-radius:999px;background:var(--ink);border:1.5px solid var(--bg)}
.no-tab .topbar{display:none}

/* 版面 */
.app{padding-bottom:calc(var(--tab) + 28px + env(safe-area-inset-bottom))}
.no-tab .app{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.view{display:none;flex-direction:column}
.view.on{display:flex}
.pagepad{padding:4px var(--pad) 16px;display:flex;flex-direction:column;gap:16px}
.blk{padding:0 var(--pad);margin-top:var(--gap);display:flex;flex-direction:column;gap:10px}
.blk-h{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.more{font-size:13px;color:var(--link);font-weight:500}
.more::after{content:" ›"}

/* 首頁：主操作卡 */
.shoot{margin:4px var(--pad) 0;padding:16px;display:grid;grid-template-columns:1fr 92px;grid-template-areas:"txt vf" "btns btns" "how how";gap:14px 12px}
.shoot-txt{grid-area:txt;display:flex;flex-direction:column;gap:4px;min-width:0;align-self:center}
.shoot-h{font-size:22px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.shoot-p{font-size:15px;color:var(--ink);font-weight:500}
.shoot-meta{font-size:var(--fs-cap);color:var(--ink3)}
.vf{grid-area:vf;position:relative;width:92px;height:92px;background:#fff;border-radius:12px;padding:10px}
.vf img{width:100%;height:100%;object-fit:contain}
.vf i{position:absolute;width:14px;height:14px;border-color:var(--ink);border-style:solid;border-width:0}
.vf .c1{top:0;left:0;border-top-width:2px;border-left-width:2px;border-top-left-radius:8px}
.vf .c2{top:0;right:0;border-top-width:2px;border-right-width:2px;border-top-right-radius:8px}
.vf .c3{bottom:0;left:0;border-bottom-width:2px;border-left-width:2px;border-bottom-left-radius:8px}
.vf .c4{bottom:0;right:0;border-bottom-width:2px;border-right-width:2px;border-bottom-right-radius:8px}
.shoot-btns{grid-area:btns;display:grid;grid-template-columns:1.5fr 1fr;gap:8px}
.shoot-how{grid-area:how;justify-self:center;font-size:13px;color:var(--link);margin-top:-4px}
.shoot-how::after{content:" ›"}

/* 進行中橫條 */
#live-strip:empty{display:none}
#live-strip{padding:0 var(--pad);margin-top:10px;display:flex;flex-direction:column;gap:8px}
.livebar{display:grid;grid-template-columns:44px 1fr auto;grid-template-rows:auto auto;gap:2px 10px;align-items:center;padding:10px 12px 0;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);text-align:left;width:100%;cursor:pointer;overflow:hidden}
.livebar img{grid-row:1/3;width:44px;height:44px;border-radius:8px;object-fit:contain;background:#fff;border:1px solid var(--line)}
.livebar .lname{font-weight:700;font-size:14px}
.livebar .lsub{font-size:var(--fs-cap);color:var(--ink3);grid-column:2;display:flex;align-items:center;gap:6px;min-width:0}
.livebar .leta{grid-row:1/3;grid-column:3;text-align:right;font-size:var(--fs-cap);color:var(--ink3);line-height:1.3}
.livebar .leta b{display:block;font-size:17px;color:var(--accent);font-family:var(--font-num)}
.livebar .lbar{grid-column:1/-1;height:3px;background:var(--line);margin:10px -12px 0}
.livebar .lbar>div{height:100%;background:var(--accent)}

/* 加到主畫面引導條 */
.a2hs{margin:10px var(--pad) 0;padding:8px 6px 8px 8px;display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-input)}
.a2hs-ic img{width:32px;height:32px;border-radius:8px}
.a2hs p{flex:1;font-size:12.5px;line-height:1.4;color:var(--ink2);min-width:0}
.a2hs p b{color:var(--ink)}
.a2hs-go{height:30px;padding:0 12px;border-radius:var(--r-btn);border:0;background:var(--btn);color:var(--on-btn);font-size:12px;font-weight:700;cursor:pointer}
.a2hs-x{width:32px;height:32px;border:0;background:none;color:var(--ink3);display:flex;align-items:center;justify-content:center;cursor:pointer}
.a2hs-x .ic{width:16px;height:16px}

/* 我的視頻：最近 4 支 */
.mine{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mine .sk{aspect-ratio:3/4}
.mitem{display:flex;flex-direction:column;gap:5px;background:none;border:0;padding:0;text-align:left;cursor:pointer;min-width:0}
.mthumb{position:relative;aspect-ratio:3/4;border-radius:var(--r-thumb);background:#fff;border:1px solid var(--line);overflow:hidden}
.mthumb img{width:100%;height:100%;object-fit:contain;padding:6px}
.mthumb .tag{position:absolute;left:4px;bottom:4px}
.mname{font-size:12px;font-weight:500;line-height:1.3}
.mine-empty{grid-column:1/-1;display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card)}
.mine-empty p{flex:1;font-size:13px;color:var(--ink2)}

/* 狀態籤（中文四字內） */
.tag{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap;line-height:1}
.tag.live{background:var(--accent-soft);color:var(--accent-press)}
.tag.live i{width:5px;height:5px;border-radius:999px;background:var(--accent)}
.tag.done{background:var(--done-bg);color:#fff}
.tag.fail{background:var(--danger-soft);color:var(--danger)}
.tag.fail::before{content:"!";width:12px;height:12px;border-radius:999px;background:var(--danger);color:#fff;font-size:9px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.tag.review{background:var(--card);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}

/* 橫滑 */
.hscroll{display:flex;gap:8px;overflow-x:auto;margin:0 calc(-1 * var(--pad));padding:0 var(--pad) 2px;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding:0 var(--pad)}
.hscroll::-webkit-scrollbar{display:none}
.hscroll>*{scroll-snap-align:start;flex-shrink:0}

/* 示例卡 */
.ex-sk{width:118px;aspect-ratio:9/16}
.excard{width:118px;display:flex;flex-direction:column;gap:6px;min-width:0}
.ex-media{position:relative;display:block;width:100%;aspect-ratio:9/16;border-radius:12px;overflow:hidden;background:var(--ink);border:0;padding:0;cursor:pointer}
.ex-media img{width:100%;height:100%;object-fit:cover}
.ex-media .vdur{position:absolute;top:6px;right:6px;font-size:10.5px;font-weight:700;color:#fff;background:rgba(22,22,22,.6);border-radius:999px;padding:1px 7px}
.ex-media .vplay{position:absolute;left:6px;bottom:6px;width:26px;height:26px;border-radius:999px;background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center}
.ex-media .vplay .ic{width:12px;height:12px;fill:var(--ink);stroke:none;margin-left:1px}
.ex-name{font-size:12.5px;font-weight:700;line-height:1.3}
.ex-sub{display:flex;justify-content:space-between;align-items:center;font-size:var(--fs-cap);color:var(--ink3);gap:4px}
.ex-sub .link{font-size:var(--fs-cap)}

/* 風格膠囊卡 */
.chip{display:flex;align-items:center;gap:8px;height:48px;padding:0 12px 0 6px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-chip);cursor:pointer;white-space:nowrap}
.chip img{width:36px;height:36px;border-radius:calc(var(--r-chip) - 4px);object-fit:cover}
.chip b{font-size:13px}
.chip small{font-size:11px;color:var(--ink3);font-weight:500}

.trust{margin:24px var(--pad) 0;text-align:center;font-size:var(--fs-cap);color:var(--ink3)}
.trust .link{font-size:var(--fs-cap)}

/* 底部 tab（中間黑圓鈕） */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:16;background:var(--card);border-top:1px solid var(--line);height:calc(var(--tab) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,1fr)}
.tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11px;font-weight:500;color:var(--ink3);background:none;border:0;cursor:pointer;position:relative}
.tabbar .ic{width:22px;height:22px}
.tabbar a span,.tabbar .tab-new>span:last-child{white-space:nowrap}
.tabbar a.on{color:var(--tab-on);font-weight:700}
.tabbar .tab-new{justify-content:flex-end;padding-bottom:8px;color:var(--tab-on);font-weight:700}
.tabbar .fab{width:50px;height:50px;border-radius:var(--r-fab);background:var(--btn);color:var(--on-btn);display:flex;align-items:center;justify-content:center;position:absolute;top:-16px;border:4px solid var(--bg)}
.tabbar .fab .ic{width:24px;height:24px}
.tabbar .dot{position:absolute;top:8px;left:calc(50% + 9px);width:7px;height:7px;border-radius:999px;background:var(--tab-on)}
.no-tab .tabbar,.player-open .tabbar{display:none}

/* 子頁頂欄＋底部固定鈕 */
.subbar{position:sticky;top:0;z-index:20;background:var(--bg);height:calc(52px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 4px 0;display:flex;align-items:center;justify-content:space-between}
.subbar-t{font-size:16px;font-weight:700}
.footer{position:fixed;left:0;right:0;bottom:0;z-index:15;padding:10px var(--pad) calc(12px + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.footer:empty{display:none}
.footer .frow{display:flex;gap:8px}
.footer .frow .btn{flex:1}
.footer>.cap{text-align:center}
#new-pick{flex-direction:row}
#new-pick .btn:first-child{flex:1}
#new-pick .btn:last-child{flex:1.5}

/* 新建 */
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.guide figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-input);overflow:hidden}
.guide figure img{aspect-ratio:1/1;width:100%;object-fit:contain;padding:6px}
.guide figcaption{font-size:var(--fs-cap);color:var(--ink2);padding:5px 8px;border-top:1px solid var(--line);text-align:center}
.ticks{display:flex;flex-direction:column;gap:6px}
.ticks li{font-size:14px;color:var(--ink2);padding-left:14px;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:999px;background:var(--ink)}
.ph-row{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px}
.ph-row img{width:64px;height:64px;border-radius:10px;object-fit:contain;background:#fff;border:1px solid var(--line)}
.ph-row b{font-size:14px}
.fld{display:flex;flex-direction:column;gap:8px}
.fld-h{display:flex;justify-content:space-between;align-items:baseline}
.pk{width:88px;display:flex;flex-direction:column;gap:5px;background:none;border:0;padding:0;cursor:pointer;text-align:left}
.pk .pimg{position:relative;display:block;width:88px;height:88px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:var(--soft)}
.pk .pimg img{width:100%;height:100%;object-fit:cover}
.pk[aria-checked="true"] .pimg{border:2px solid var(--sel)}
.pk .ptag{position:absolute;top:5px;left:5px;font-size:10px;font-weight:700;background:rgba(255,255,255,.94);color:var(--ink);border-radius:999px;padding:1px 6px}
.pk .pname{font-size:13px;font-weight:500;padding-left:2px}
.pk[aria-checked="true"] .pname{font-weight:700}
.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--soft);border-radius:var(--r-btn);padding:3px;gap:2px}
.seg button{height:38px;border:0;border-radius:var(--r-btn);background:none;font-weight:500;font-size:14px;cursor:pointer;color:var(--ink2)}
.seg button[aria-checked="true"]{background:var(--card);color:var(--ink);font-weight:700;box-shadow:inset 0 0 0 1.5px var(--sel)}
.seg-sm button{height:32px;font-size:13px}
.field{display:flex;align-items:center;height:48px;border:1px solid var(--line);border-radius:var(--r-input);background:var(--card);padding:0 14px;gap:8px}
.field:focus-within{border-color:var(--ink)}
.field input{border:0;outline:0;background:transparent;flex:1;font-size:16px;height:100%;min-width:0}
.field .unit{color:var(--ink3);font-size:14px}
.summary{padding:2px 14px}
.sum-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.sum-row:last-child{border-bottom:0}
.sum-row span{color:var(--ink2)}
.err{color:var(--danger);font-size:13px;min-height:0}
.err:empty{display:none}

/* 我的視頻列表 */
.joblist{padding:0 12px}
.jrow{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);width:100%;background:none;border-left:0;border-right:0;border-top:0;text-align:left;cursor:pointer}
.jrow:last-child{border-bottom:0}
.jthumb{width:48px;height:64px;border-radius:var(--r-thumb);object-fit:cover;background:var(--soft);flex-shrink:0;border:1px solid var(--line)}
.jthumb.sq{object-fit:contain;background:#fff;padding:3px}
.jmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.jname{font-weight:700;font-size:14px}
.jmeta{font-size:var(--fs-cap);color:var(--ink3)}
.jline{display:flex;align-items:center;gap:8px;font-size:var(--fs-cap);color:var(--ink3)}
.jbar{height:3px;border-radius:999px;background:var(--line);overflow:hidden;margin-top:4px}
.jbar>div{height:100%;background:var(--accent);border-radius:999px}
.jrow>.ic{color:var(--ink3);width:16px;height:16px}
.jsk{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.jsk:last-child{border-bottom:0}
.jsk .sk{width:48px;height:64px;border-radius:8px;flex-shrink:0}
.empty-box{padding:20px 16px;text-align:center;display:flex;flex-direction:column;gap:6px;align-items:center}
.empty-box .row{width:100%;margin-top:8px}

/* 任務詳情 */
.jhead{display:flex;gap:12px;align-items:center}
.jhead img{width:52px;height:52px;border-radius:10px;object-fit:contain;background:#fff;border:1px solid var(--line);padding:3px}
.stage{display:flex;flex-direction:column;gap:8px;padding:14px}
.stage-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.stage-top b{font-size:18px}
.progress{height:5px;border-radius:999px;background:var(--line);overflow:hidden}
.progress>div{height:100%;background:var(--accent);border-radius:999px;transition:width .2s ease-out}
.tl{padding:4px 14px}
.tl-row{display:flex;gap:10px;align-items:flex-start;padding:9px 0;position:relative}
.tl-row:not(:last-child)::before{content:"";position:absolute;left:8px;top:28px;bottom:-4px;width:1px;background:var(--line)}
.tl-dot{width:17px;height:17px;border-radius:999px;border:2px solid var(--line2);flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--card);margin-top:1px}
.tl-row.ok .tl-dot{border-color:var(--tl-ok);background:var(--tl-ok)}
.tl-row.now .tl-dot{border-color:var(--accent)}
.tl-row.now .tl-dot::after{content:"";width:6px;height:6px;border-radius:999px;background:var(--accent)}
.tl-txt{flex:1;display:flex;justify-content:space-between;gap:8px;font-size:13.5px}
.tl-row.wait .tl-txt{color:var(--ink3)}
.tl-row.now .tl-txt{font-weight:700}
.tl-txt small{font-size:12px;color:var(--ink3);font-weight:400;white-space:nowrap}
.note{padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.note b{font-size:14px}
.note p{font-size:13px;color:var(--ink2)}
.done-video{width:100%;aspect-ratio:9/16;max-height:62dvh;border-radius:var(--r-card);background:var(--ink);display:block;object-fit:contain}
.kv{padding:2px 14px}
.kv>div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}
.kv>div:last-child{border-bottom:0}
.kv span{color:var(--ink2)}
.blk-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.blk-head .row{gap:14px}
.blk-head .link{font-size:13px}
.script{padding:0 14px}
.script>div{padding:10px 0;border-bottom:1px solid var(--line)}
.script>div:last-child{border-bottom:0}
.beat{font-size:11px;font-weight:700;color:var(--ink3);margin-bottom:2px}
.line-es{font-size:14px}
.line-zh{font-size:12.5px;color:var(--ink3);margin-top:1px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags span{font-size:12px;color:var(--ink2);background:var(--soft);border-radius:999px;padding:2px 9px}
.again{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.again .btn{height:44px;font-size:14px}

/* 帳戶 */
.acct{display:flex;align-items:center;gap:12px;padding:14px}
.acct-code{font-size:17px;font-weight:700;letter-spacing:.02em}
.statcard{display:grid;grid-template-columns:repeat(3,1fr)}
.statcard>div{padding:14px 6px;text-align:center;display:flex;flex-direction:column;gap:1px}
.statcard>div+div{border-left:1px solid var(--line)}
.statcard b{font-family:var(--font-num);font-size:24px;font-weight:700;line-height:1.15}
.statcard span{font-size:var(--fs-cap);color:var(--ink3)}
.facts{display:grid;grid-template-columns:1fr 1fr}
.facts>div{padding:11px 14px;display:flex;flex-direction:column;gap:1px}
.facts>div:nth-child(even){border-left:1px solid var(--line)}
.facts>div:nth-child(n+3){border-top:1px solid var(--line)}
.facts span{font-size:var(--fs-cap);color:var(--ink3)}
.facts b{font-size:14px}
.list-links{padding:0 14px}
.list-links a,.list-links button{display:flex;align-items:center;gap:8px;height:50px;border:0;border-bottom:1px solid var(--line);background:none;width:100%;cursor:pointer;font-size:14px;text-align:left;padding:0}
.list-links>*:last-child{border-bottom:0}
.list-links>*>span:first-child{flex:1}
.list-links .ic{color:var(--ink3);width:16px;height:16px}
.ver{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:4px}
/* 品牌字標（10-16）：圖形 nopal-mark.svg（綠圓白掌）＋「仙人掌」；nopal 拉丁小字副標用 .wm-sub。出處 23_brand/23_BRAND_GUIDE.md */
.wordmark{display:inline-flex;align-items:center;gap:6px;font-family:"PingFang SC","Noto Sans SC",sans-serif;font-weight:800;color:var(--ink);font-size:18px;line-height:1;letter-spacing:-.01em;white-space:nowrap}
.wordmark img{width:24px;height:24px;flex:none}
.wm-sub{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--ink3);font-family:"Figtree",-apple-system,"Helvetica Neue",sans-serif}
.wm-sm{font-size:15px;gap:5px}
.wm-sm img{width:20px;height:20px}

/* 浮層（>520px 時以手機框為準） */
.banner{display:none;margin:0 var(--pad) 8px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-input);background:var(--card);font-size:13px;color:var(--ink2)}
.offline .banner{display:block}
.sheet-wrap,.player-wrap{position:fixed;inset:0;display:none;z-index:40}
.sheet-wrap.on,.player-wrap.on{display:block}
.scrim{position:absolute;inset:0;background:rgba(22,22,22,.35)}
.scrim.dark{background:rgba(22,22,22,.94)}
.sheet{position:absolute;left:0;right:0;bottom:0;background:var(--card);border-radius:var(--r-sheet) var(--r-sheet) 0 0;padding:10px var(--pad) calc(20px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px;max-height:80%;overflow-y:auto}
.handle{width:36px;height:4px;border-radius:999px;background:var(--line);margin:0 auto 4px}
.msgs{display:flex;flex-direction:column}
.msg{display:flex;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);background:none;border-left:0;border-right:0;border-top:0;width:100%;text-align:left;cursor:pointer}
.msg:last-child{border-bottom:0}
.msg img{width:40px;height:40px;border-radius:8px;object-fit:contain;background:#fff;border:1px solid var(--line);flex-shrink:0}
.msg b{font-size:14px;display:block}
.msg span{font-size:var(--fs-cap);color:var(--ink3)}
.msg-empty{padding:16px 0;color:var(--ink3);font-size:13px;text-align:center}
.contact{display:flex;flex-direction:column;gap:12px}
.contact .ch{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.contact .chb{height:48px;border-radius:var(--r-btn);border:1px solid var(--line2);background:var(--card);display:flex;align-items:center;justify-content:center;font-weight:700;cursor:pointer;white-space:nowrap}
.cs-pending{font-size:14px;color:var(--ink2);padding:12px 14px;background:var(--soft);border-radius:var(--r-input)}
.player{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:52px 16px calc(16px + env(safe-area-inset-bottom));pointer-events:none}
.player>*{pointer-events:auto}
.player video{width:min(100%,calc(72dvh * 9 / 16));aspect-ratio:9/16;border-radius:var(--r-card);background:#000}
.player-x{position:absolute;top:calc(6px + env(safe-area-inset-top));right:6px;color:#fff}
.player-info{color:#fff;text-align:center;font-size:13px;line-height:1.5}
.player-info span{opacity:.72}
.toast{position:fixed;left:50%;bottom:calc(var(--tab) + 72px);transform:translateX(-50%);background:var(--ink);color:#fff;font-size:14px;padding:9px 16px;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .2s ease-out;z-index:50;white-space:nowrap}
.toast.on{opacity:1}
.facts b span{color:inherit;font-size:inherit}

/* ===== 主題對比（10-16）：只覆蓋 token，不動結構。?theme=t2…t5|orange 手動切換、存 localStorage（chupian.theme.v2）；預設＝:root（t1 定案）。
   出處與理由見 learning/app-study/ui_bench/08_theme_candidates.md ===== */
/* t1 商家後台科技藍（10-16 上午定案、下午品牌定案後退為可切換）：只換強調色，其餘同 :root */
[data-theme="t1"]{ --accent:#3E63DD; --accent-press:#3358D4; --accent-soft:#EDF2FE; }
/* t2 黑白工程感：Vercel Geist 淺色版（gray 100–1000、radius 6）；冷色點綴＝Geist blue 211° 色相，飽和壓到 78%；字＝Geist／Geist Mono（OFL） */
[data-theme="t2"]{
  --bg:#FAFAFA; --card:#FFFFFF; --ink:#171717; --ink2:#4D4D4D; --ink3:#666666;
  --line:#EBEBEB; --line2:#E0E0E0; --soft:#F2F2F2; --accent:#1866BF; --accent-press:#13539C; --accent-soft:#EAF2FB;
  --danger:#CB2A32; --danger-soft:#FBECEC; --btn:#171717; --on-btn:#fff; --btn-dis:#E0E0E0; --on-dis:#4D4D4D; --sel:var(--accent); --tab-on:#171717; --tl-ok:#171717; --done-bg:#171717;
  --r-card:8px; --r-input:6px; --r-btn:6px; --r-thumb:6px; --r-sheet:12px; --r-fab:14px; --r-chip:6px;
  --font:"Geist","Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-num:"Geist Mono",ui-monospace,monospace;
}
/* t3 微信生態綠：WeUI 底色／字色層級＋TDesign Mobile 圓角；綠取 WeUI 關懷模式 BRAND #018942 色相，飽和 75% 以過 4.5:1 */
[data-theme="t3"]{
  --bg:#EDEDED; --card:#FFFFFF; --ink:#191919; --ink2:#4B4B4B; --ink3:#666666;
  --line:#E7E7E7; --line2:#DCDCDC; --soft:#F3F3F3; --accent:#117943; --accent-press:#0C5F34; --accent-soft:#E3F4EA;
  --danger:#AD352F; --danger-soft:#FFF0ED; --btn:#117943; --on-btn:#fff; --btn-dis:#E7E7E7; --on-dis:#4B4B4B; --sel:var(--accent); --tab-on:#117943; --tl-ok:#117943; --done-bg:#191919;
  --r-card:12px; --r-input:8px; --r-btn:8px; --r-thumb:6px; --r-sheet:12px; --r-fab:999px; --r-chip:999px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei","Helvetica Neue",sans-serif;
  --font-num:-apple-system,"Helvetica Neue",sans-serif;
}
/* 主題細節：t2 字距 */
[data-theme="t2"] .shoot-h{font-weight:700;letter-spacing:-.03em}
[data-theme="t2"] .greet{letter-spacing:-.02em}


/* ===== 10-16 第二批候選：t4 商家紅、t5 深色科技（用戶問「紅色可以嗎」）。出處見 08_theme_candidates.md §7–§8 ===== */
/* t4 商家紅：Radix Red（358°，對齊拼多多商家版 #E02E24／京麥 #E1251B 的 3°）；Red 9 #E5484D 白字只 3.9:1，故實色與字都用 Red 11 #CE2C31（飽和 65%）。
   紅只給 主鈕／底部選中／進度／金額／可點字；時間軸完成點、完成籤用 slate-12；失敗＝深栗 #7A1F1F 字＋圓形「!」圖標在灰底，不與主紅同色。中性＝Radix Slate；圓角同 t1 */
[data-theme="t4"]{
  --bg:#F5F5F7; --card:#FFFFFF; --ink:#1C2024; --ink2:#43474E; --ink3:#60646C;
  --line:#E8E8EC; --line2:#D9D9E0; --soft:#F0F0F3; --accent:#CE2C31; --accent-press:#A8232A; --accent-soft:#FEEBEC;
  --danger:#7A1F1F; --danger-soft:#F0F0F3; --btn:#CE2C31; --on-btn:#fff; --btn-dis:#E8E8EC; --on-dis:#43474E; --sel:var(--ink); --tab-on:#CE2C31; --tl-ok:#1C2024; --done-bg:#1C2024;
  --r-card:8px; --r-input:6px; --r-btn:8px; --r-thumb:6px; --r-sheet:12px; --r-fab:999px; --r-chip:8px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  --font-num:"DIN Alternate","Roboto Condensed",-apple-system,sans-serif;
}
[data-theme="t4"] .shoot-h{font-weight:700}
[data-theme="t4"] .tag.fail{border:1px solid var(--line2)}
/* t5 深色科技：底 #0F1115／卡 #171A20；字 #F2F3F5／#A9AFBA／#8B919C（Radix slate dark 12/11 同型）；單強調＝Radix Cyan 9 色相 191.5°（對齊即夢 #00CAE0），飽和 100%→70% 去霓虹；
   主鈕＝近白實心、深字；無漸層無發光。白底商品照一律包 8px 內距＋12px 圓角白框（小縮圖 ≤52px 縮成 5px/10px） */
[data-theme="t5"]{
  color-scheme:dark;
  --bg:#0F1115; --card:#171A20; --ink:#F2F3F5; --ink2:#A9AFBA; --ink3:#8B919C;
  --line:#262A33; --line2:#353A45; --soft:#20242B; --accent:#22A4C3; --accent-press:#5CC6DE; --accent-soft:#11303A;
  --danger:#FF9592; --danger-soft:#3B1A1C; --btn:#F2F3F5; --on-btn:#0F1115; --btn-dis:#353A45; --on-dis:#A9AFBA; --sel:var(--accent); --tab-on:#F2F3F5; --tl-ok:#A9AFBA; --done-bg:#F2F3F5;
  --r-card:12px; --r-input:8px; --r-btn:10px; --r-thumb:12px; --r-sheet:16px; --r-fab:999px; --r-chip:10px;
  --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei","Helvetica Neue",sans-serif;
  --font-num:"DIN Alternate","Roboto Condensed",-apple-system,sans-serif;
}
[data-theme="t5"] .shoot-h{font-weight:700}
[data-theme="t5"] .tag.done,[data-theme="t5"] .avatar:not(.empty),[data-theme="t5"] .toast{color:#0F1115}
[data-theme="t5"] .tag.fail::before{color:#0F1115}
[data-theme="t5"] .ex-media,[data-theme="t5"] .done-video{background:#000}
[data-theme="t5"] .ex-media .vplay .ic{fill:#0F1115}
[data-theme="t5"] .pk .ptag{color:#0F1115}
[data-theme="t5"] .scrim{background:rgba(0,0,0,.6)}
/* 白框：大圖 8px/12px */
[data-theme="t5"] .vf{padding:8px;border-radius:12px}
[data-theme="t5"] .vf i{border-color:#0F1115}
[data-theme="t5"] .mthumb{border-radius:12px;border-color:#fff}
[data-theme="t5"] .mthumb img{padding:8px}
[data-theme="t5"] .guide figure{border-radius:12px;border:0;background:var(--card)}
[data-theme="t5"] .guide figure img{padding:8px;background:#fff;border-radius:12px}
[data-theme="t5"] .guide figcaption{border-top:0}
[data-theme="t5"] .ph-row img,[data-theme="t5"] .jhead img{padding:8px;border-radius:12px;border-color:#fff}
[data-theme="t5"] .livebar img,[data-theme="t5"] .msg img,[data-theme="t5"] .jthumb.sq{padding:5px;border-radius:10px;border-color:#fff}

/* ===== 10-16 t6 仙人掌綠（品牌具象物「仙人掌 · Nopal」）：骨架完全沿用 t1（底／卡／字／線／圓角／字型／已完成近黑／失敗 #B3261E），只換強調色。
   選 Radix Grass 11 #2A7E3B（H132 S50 L33）：比微信綠 #07C160（H149 S93 L39）更深更灰、比 t3 #117943（H149 S75）偏黃綠低飽和，像仙人掌肉不像支付鈕；
   白字 5.07:1、在底 #F2F3F5 上 4.56:1（Green 11 #218358 在底上只 4.25 不過、Teal 11 #0D7A74 色相 177° 偏海水藍）。語義同 t1 五處＋字標點，全走 var(--accent)。 ===== */
/* 10-16 品牌定案後 t6 已寫進 :root（預設）；?theme=t6 等於預設，不再另設覆蓋 */

/* ===== v5（10-16）選風格頁＋社區。出處：ui_bench/07_mobile_app_patterns.md §7–§8 ===== */
.stepno{width:44px;text-align:center;font-size:var(--fs-cap);color:var(--ink3);font-family:var(--font-num)}
.tap{min-height:44px;display:inline-flex;align-items:center;padding:0 4px}
.tap-s{padding:13px 6px;margin:-13px -6px}
.foot-note{text-align:center}
.foot-note:empty{display:none}
/* 選風格 */
.ph-sm{padding:8px 10px 8px 8px}
.ph-sm img{width:48px;height:48px;border-radius:8px}
.tpl-bar{display:flex;align-items:center;gap:10px;padding:6px 6px 6px 14px;background:var(--card);border:1px solid var(--line2);border-radius:var(--r-card)}
.tpl-bar>span{display:flex;flex-direction:column;min-width:0}
.tpl-bar b{font-size:14px}
.scard{display:grid;grid-template-columns:132px 1fr;gap:12px;padding:8px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);cursor:pointer;text-align:left;transition:transform .15s ease-out;outline:none}
.scard:active{transform:scale(.99)}
.scard:focus-visible{box-shadow:inset 0 0 0 2px var(--sel)}
.scard[aria-checked="true"]{border-color:var(--sel);box-shadow:inset 0 0 0 1px var(--sel)}
.sc-media{position:relative;display:block;aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:var(--soft)}
.sc-media img{width:100%;height:100%;object-fit:cover}
.sc-media .ptag{position:absolute;top:6px;left:6px;font-size:10.5px;font-weight:700;background:rgba(255,255,255,.95);color:var(--ink);border-radius:999px;padding:1px 7px}
.sc-media .ptag.wait{background:var(--ink);color:#fff}
.sc-check{position:absolute;right:6px;bottom:6px;width:24px;height:24px;border-radius:999px;background:var(--sel);color:#fff;display:none;align-items:center;justify-content:center;border:2px solid #fff}
.sc-check .ic{width:14px;height:14px;stroke-width:2.5}
.scard[aria-checked="true"] .sc-check{display:flex}
.sc-body{display:flex;flex-direction:column;gap:4px;min-width:0;padding:2px 2px 0 0}
.sc-top b{font-size:16px}
.sc-desc{font-size:13px;color:var(--ink2);line-height:1.45}
.sc-warn{font-size:12px;color:var(--ink);font-weight:700}
.btn-mini{margin-top:auto;align-self:flex-start;height:44px;padding:0 14px;border-radius:var(--r-btn);border:1px solid var(--line2);background:var(--card);font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:4px;cursor:pointer;color:var(--ink)}
.btn-mini .ic{width:14px;height:14px;fill:currentColor;stroke:none}
/* 參數頁頂部摘要 */
.pick-sum{display:flex;align-items:center;gap:10px;padding:10px 6px 10px 10px}
.pick-sum #new-photo{width:52px;height:52px;border-radius:8px;object-fit:contain;background:#fff;border:1px solid var(--line);padding:3px}
.pick-sum .sum-style{width:40px;height:52px;border-radius:6px;object-fit:cover}
.pick-sum b{font-size:15px}
/* 播放層聲音鈕 */
.player-v{position:relative}
.snd{position:absolute;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 14px 0 12px;border-radius:999px;border:0;background:rgba(22,22,22,.72);color:#fff;font-size:13px;font-weight:700;cursor:pointer}
.snd .ic{width:18px;height:18px}
.player-v .snd{top:8px;left:8px}
/* 社區 */
.comm-bar{position:sticky;top:calc(52px + env(safe-area-inset-top));z-index:19;background:var(--bg);padding:0 var(--pad) 6px;display:flex;flex-direction:column;gap:2px;border-bottom:1px solid var(--line)}
.cat-row{gap:6px}
.cat{height:44px;padding:0;border:0;background:none;cursor:pointer;display:inline-flex;align-items:center}
.cat>span{height:34px;padding:0 14px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:13px;font-weight:500;color:var(--ink2);display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.cat small{font-size:11px;color:var(--ink3);font-family:var(--font-num)}
.cat[aria-selected="true"]>span{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:700}
.cat[aria-selected="true"] small{color:#fff}
.comm-tools{display:flex;align-items:center;justify-content:space-between;gap:8px}
#comm-sort{padding:0;background:none;gap:4px}
#comm-sort button{height:44px;padding:0;background:none;box-shadow:none;display:inline-flex;align-items:center}
#comm-sort button>span{height:32px;padding:0 12px;border-radius:var(--r-btn);display:inline-flex;align-items:center;font-size:13px;color:var(--ink2)}
#comm-sort button[aria-checked="true"]>span{background:var(--card);color:var(--ink);font-weight:700;box-shadow:inset 0 0 0 1.5px var(--sel)}
.ap-toggle,.swbtn{height:44px;display:inline-flex;align-items:center;gap:6px;border:0;background:none;font-size:13px;color:var(--ink2);cursor:pointer;padding:0 2px}
.swbtn{width:52px;justify-content:center}
.sw{width:36px;height:22px;border-radius:999px;background:var(--line2);position:relative;flex-shrink:0;transition:background .15s ease-out}
.sw i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:999px;background:#fff;transition:transform .15s ease-out}
[aria-checked="true"]>.sw{background:var(--sel)}
[aria-checked="true"]>.sw i{transform:translateX(14px)}
.wf{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:start}
.wf-col{display:flex;flex-direction:column;gap:16px;min-width:0}
.wf-sk{aspect-ratio:9/16}
.wcard{display:flex;flex-direction:column;gap:5px;min-width:0}
.wmedia{position:relative;display:block;aspect-ratio:9/16;border-radius:var(--r-card);overflow:hidden;background:var(--ink)}
.wmedia img,.wmedia video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wmedia video{opacity:0;transition:opacity .2s ease-out}
.wmedia video.on{opacity:1}
.wmedia .vdur{position:absolute;top:6px;right:6px;font-size:10.5px;font-weight:700;color:#fff;background:rgba(22,22,22,.72);border-radius:999px;padding:1px 7px}
.wtag{position:absolute;top:6px;left:6px;font-size:10.5px;font-weight:700;background:rgba(255,255,255,.95);color:var(--ink);border-radius:999px;padding:1px 7px}
.wtag.static{position:static;background:var(--soft);flex-shrink:0}
.wmk{position:absolute;right:6px;bottom:6px;font-size:10.5px;font-weight:900;letter-spacing:-.02em;color:#fff;background:rgba(22,22,22,.72);border-radius:4px;padding:1px 5px}
.wname{font-size:13px;font-weight:700;line-height:1.3}
.wmeta{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.chipx{font-size:11px;color:var(--ink2);background:var(--card);border:1px solid var(--line);border-radius:4px;padding:0 5px;line-height:18px}
.ex-media .wtag{top:6px;left:6px}
/* 作品詳情 */
.cd-stage{position:relative;background:#000;height:min(66dvh,calc(100vw * 16 / 9));display:flex;justify-content:center}
.cd-video{height:100%;aspect-ratio:9/16;max-width:100%;object-fit:contain;background:#000}
.cd-back{position:absolute;top:calc(6px + env(safe-area-inset-top));left:6px;color:#fff;background:rgba(22,22,22,.55)}
.cd-stage .snd{right:10px;bottom:10px}
.cd-stage .wmk{left:10px;right:auto;bottom:14px}
.cd-info{padding-top:14px}
.share-row{display:flex;align-items:center;gap:10px;padding:10px 6px 10px 14px}
.share-row>span{display:flex;flex-direction:column;gap:2px}
.share-row b{font-size:14px}
/* v5 觸控區補到 ≥44px（可見尺寸不變：透明邊框／負邊距擴點擊區） */
.more,.shoot-how,.trust .link{display:inline-block;padding:13px 6px;margin:-13px -6px}
.code-pill{height:44px;border:0;border-top:6px solid transparent;border-bottom:6px solid transparent;background-clip:padding-box;box-shadow:inset 0 0 0 1px var(--line)}
.bell{width:44px;height:44px}
#durs button{height:44px}

/* v5b 社區兩行篩選（品类／风格，可疊加；0 件置灰仍可點） */
.frow-f{display:flex;align-items:center;gap:8px;min-width:0}
.frow-l{flex-shrink:0;font-size:12px;font-weight:700;color:var(--ink2);width:26px}
.frow-f .hscroll{flex:1;min-width:0;margin:0 calc(-1 * var(--pad)) 0 0;padding:0 var(--pad) 0 0}
.cat small{font-size:11px;color:var(--ink3);font-family:var(--font-num)}
.cat.zero>span{background:transparent;border:1px dashed var(--line2);color:var(--ink3)}
.cat.zero[aria-selected="true"]>span{background:var(--ink3);border-color:var(--ink3);color:#fff}
.blk-head .link{display:inline-block;padding:13px 4px;margin:-13px -4px}

/* v6 參考片標示 */
.wmk.wmk-own{padding:3px;line-height:0;border-radius:999px}
.wmedia .wmk.wmk-own{left:6px;right:auto}   /* 自家片右下角是成片裡的「Contenido generado con IA」標示，角標放左下不蓋住 */
.wmk.wmk-own img{position:static;inset:auto;width:14px;height:14px;display:block;object-fit:contain}
.wmk.wmk-ref{font-weight:700;letter-spacing:0;background:rgba(22,22,22,.6)}
.ex-media .wmk{position:absolute;right:6px;bottom:6px}
.cd-src a{color:var(--link);text-decoration:underline;text-underline-offset:2px;word-break:break-all}

/* 10-17 點數／充值 */
.pts{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.pts-main{display:flex;flex-direction:column;gap:2px}
.pts-main b{font-family:var(--font-num);font-size:30px;font-weight:700;line-height:1.1}
.pts-main b small{font-size:14px;font-weight:600;color:var(--ink3)}
.pts-act{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.btn-sm{padding:9px 18px;font-size:var(--fs-body);min-height:0}
.hist{display:flex;flex-direction:column}
.hist .row{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-top:1px solid var(--line);gap:10px}
.hist .row:first-child{border-top:0}
.hist .row .l{display:flex;flex-direction:column;gap:1px;min-width:0}
.hist .row .n{font-family:var(--font-num);font-weight:700}
.hist .row .n.pos{color:var(--accent)}
.hist .pad{padding:12px 14px}
.packs{display:flex;flex-direction:column;gap:10px;margin:8px 0 10px}
.pack{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:1.5px solid var(--line);border-radius:var(--r-card);background:var(--card);text-align:left;width:100%;font:inherit;color:var(--ink)}
.pack:active{border-color:var(--sel)}
.pack .pl{display:flex;flex-direction:column;gap:2px}
.pack .pl b{font-size:17px}
.pack .pl .cap{font-size:var(--fs-cap)}
.pack .pr{font-family:var(--font-num);font-weight:700;font-size:18px;white-space:nowrap}
.pack .tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:11px;font-weight:600;vertical-align:middle}
.pack[disabled]{opacity:.5}

/* ── 10-17 字體定案 f1 宋體編輯感（用戶「f1 試試」；候選 f2 工具感／f3 海報感已撤）──
   標題與數字 思源宋體 700，正文系統黑體 400（iOS PingFang／Android Noto Sans SC），粗體整體 700→600。
   舊黑體滿版粗體版留 ?font=old 對照。 */
:root{--font-num:"Noto Serif SC","Songti SC",Georgia,serif;--font-head:"Noto Serif SC","Songti SC",Georgia,serif}
b,strong,.lbl,.link,.btn,.code-pill,.jname,.ex-name,.tag,.subbar-t,.livebar .lname,.tabbar a.on,.tabbar .tab-new,.seg button[aria-checked="true"],.pk[aria-checked="true"] .pname{font-weight:600}
.h2,.h3,.greet,.shoot-h,.subbar-t{font-family:var(--font-head);font-weight:700;letter-spacing:0}
.statcard b,.pts-main b,.livebar .leta b{font-family:var(--font-num);font-weight:700}
:root[data-font="old"]{--font-num:"DIN Alternate","Roboto Condensed",-apple-system,sans-serif;--font-head:var(--font)}
:root[data-font="old"] b,:root[data-font="old"] strong,:root[data-font="old"] .lbl,:root[data-font="old"] .link,:root[data-font="old"] .btn,:root[data-font="old"] .h2,:root[data-font="old"] .h3,:root[data-font="old"] .greet,:root[data-font="old"] .shoot-h{font-weight:700}