/* ============================================================
tp27_dark_black — main.css
本檔由 tp21_dark_black 的 main.css 整份複製而來（見 .claude/CLAUDE.md §0），
結構／選擇器／功能鉤子完全不動，這裡改了 :root 配色（粉→紅）＋改成左側
固定常駐側欄取代純頂欄導覽，其餘規則沿用 tp21 原樣，不要看到「tp21」/
「4kvms.org」字樣的既有註解就以為寫錯檔案，那些是複製過來時保留的說明。
視覺：黑底白字紅點綴，左側固定側欄＋頂欄搜尋列，參考 z01.zgtv.online 版式。
============================================================ */
/* ===== CSS Variables ===== */
/* tp42_light_white_green：參考 video.360kan.com——白底為主、按鈕/選中等小元素用綠色。
數值取自參考站實際 computed style（搜尋鈕 #19b955、導覽選中與分隔線綠、標題 24px #333、
副標 14px #999、排行前三紅 #ee3300），見 .claude/CLAUDE.md §1。 */
:root {
/* 背景層（白底） */
--bg-body: #ffffff;
--bg-page: #ffffff;
--bg-card: #f6f7f8;
--bg-card-hover: #eef0f2;
--bg-elevated: #f2f3f5;
--bg-input: #f4f5f7;
--bg-overlay: rgba(0,0,0,.5);
/* 主色：參考站搜尋鈕／按鈕綠 */
--accent: #19b955;
--accent-hover: #12a347;
--accent-grad: linear-gradient(135deg, #19b955 0%, #3fcf72 100%);
--accent-muted: rgba(25,185,85,.1);
--rank-hot: #ee3300; /* 排行榜前三名／熱度火焰（參考站 .decoration.top1） */
--text-warn: #b86e00; /* 白底上的「黃/琥珀色」文字（集數、名次）——原 #FFB800/#FFC53D 對比只有 1.6～1.8:1，這個約 4:1 */
--fill: var(--accent);
--fill-hover: var(--accent-hover);
/* chip 系列 token（tp33 起的「主要按鈕／選中態」統一變數，詳情/篩選/分享/分集/下載頁都用）：綠底白字 */
--chip-text: #ffffff;
--chip-border: transparent;
--chip-gradient: var(--accent);
--chip-gradient-main: var(--accent);
--chip-shadow: none;
--chip-shadow-hover: 0 4px 12px rgba(25,185,85,.3);
--chip-accent: var(--accent);
--glass-bg: rgba(255,255,255,.24);
--glass-blur: blur(4.5px);
/* 文字（深字系，參考站 #333/#666/#999） */
--text-1: #333333;
--text-2: #666666;
--text-3: #999999;
--border: #e6e6e6;
--border-light: #dddddd;
/* 頂欄：白底；不是疊加式固定頂欄，而是 sticky 跟著文件流（見 TOPBAR 說明） */
--topbar-bg: #ffffff;
--topbar-solid: #ffffff;
--topbar-input-bg: #ffffff;
--history-bg: #ffffff;
--sidebar-bg: #ffffff;
--sidebar-overlay: rgba(0,0,0,.4);
--sidebar-text: #333333;
--sidebar-text-muted: #999999;
/* --topbar-h：「固定頂欄要讓出的高度」——tp42 頂欄在文件流內（sticky），內容不必再讓位，所以是 0；
各頁 calc(var(--topbar-h) + N) 的寫法自動退回 N。
--sticky-h：捲動後釘在最上面的綠色導覽列高度（2px 綠線＋38px），給 sticky 側欄/浮層當偏移。 */
--topbar-h: 0px;
--sticky-h: 40px;
--sidebar-w: 0px;
--container-w: 1400px;
--page-max-w: 1400px;
--radius: 4px;
--radius-sm: 2px;
--shadow-card: 0 2px 10px rgba(0,0,0,.08);
/* tp16 移植块（详情/播放/下载/分集/专题等页共用 CSS）用的 token 别名 */
--border-2: var(--border-light);
--accent-light: var(--accent-muted);
--radius-pill: 50px;
--content-max: var(--page-max-w);
--bg-base: var(--bg-body);
--score-hi: var(--accent);
--accent-2: var(--rank-1);
--accent-2-alt: #ffb800;
--shadow-panel: 0 4px 16px rgba(0,0,0,.12);
--rank-1: #FFB800;
--rank-2: #A0A6B0;
--rank-3: #CD7F32;
--score-mid: #FF8A00;
}
/* ===== Reset ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: var(--bg-body); color: var(--text-1); min-height: 100%; }
body { font-family: "PingFang SC","Microsoft YaHei",Arial,sans-serif; font-size: 14px; line-height: 1.6; }
a { text-decoration: none; color: inherit; }
a:hover { color: var(--accent); transition: .15s ease-in-out; }
/* 全域圖片佔位背景（需求方 skill §B 硬性要求）：裸 img{} 選擇器，全站所有
內容 ![]()
自動套用，不用逐個 widget 補——載入前透出這個底圖/底色、載入
成功後被不透明的實際圖片蓋掉、載入失敗（onerror 沒接住或還沒觸發）時一樣
透出這個占位，避免破圖時整塊變空白。sprite 圖示是