:root{
  --ink:#000;--paper:#fff;--muted:#666;--hair:rgba(0,0,0,.14);--hdr-h:120px;--hero-top-gap:32px;
  /* 關於資料庫：左欄標題區固定高度，讓左側底線與右側統計上線落在同一條水平線上 */
  --about-head-h:58px;
  /* 客戶 9/18 反饋：英文原用 Roboto Condensed 過扁窄單薄，違背 PDF 第 1 頁 Helvetica/Inter 字型規範。
     改用系統 UI 黑體（Mac 為 San Francisco、Windows 為 Segoe UI）＋ Inter 網頁字型／Helvetica Neue 當後備，
     中文一律回退 Noto Sans TC。 */
  --zh:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,"Inter","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  --la:"Helvetica Neue",Helvetica,"Inter",Arial,sans-serif;
}
/* client 風格接管 ho-kan.css 的襯線/等寬變數：客戶指定全站黑體，
   未覆寫時作品標題會落到 PMingLiU 新細明體、媒材標籤會落到 Consolas 等寬體。
   限定 body.theme-client 作用域，另三種風格不受影響。 */
body.theme-client{--serif:var(--zh);--mono:var(--zh)}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:#fff;color:#000;font-family:var(--zh);font-weight:400;-webkit-font-smoothing:antialiased;text-wrap:pretty}
body.hk-en{font-family:var(--la);font-weight:300}
a{color:#000;text-decoration:none}
a:hover{color:#666}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:left}
input,select,textarea{font:inherit;color:inherit;background:none;border:0;outline:none;border-radius:0}
/* 鍵盤焦點環：只在鍵盤操作時出現，滑鼠點擊外觀不變 */
:focus-visible{outline:2px solid #000;outline-offset:3px}
.mi:focus-visible{outline:2px solid #000;outline-offset:-3px}
.cell:focus-visible,.doc:focus-visible,.bcard:focus-visible,.mainImg:focus-visible{outline:3px solid #fff;outline-offset:-3px;box-shadow:0 0 0 5px #000}
.lbbg:focus-visible,.lbx:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.la{font-family:var(--la);letter-spacing:.06em}
.wrap{max-width:1360px;margin:0 auto;padding:0 40px}

/* ── 頁首（HK-REV-006）：指定 Logo 靠左，與主選單同一水平線 ── */
.hdr{border-bottom:1px solid var(--hair);background:#fff;position:relative;z-index:40;
     display:flex;align-items:center;gap:34px;padding:26px 36px 18px}
.brand{flex:none;display:flex;align-items:center;padding:0}
/* logo.jpg 本身已含簽名 ＋ 中英品牌名，不再另外輸出 bname／ben 文字 */
/* 客戶指定：放大至可清楚辨識簽名＋中英品牌名整體文字，高度對齊既有 --hdr-h(120px) 設計基準 */
.mark{height:92px;width:auto}
/* 主選單在剩餘空間置中；整組撐滿頁首高度，選單、搜尋與語系控制項靠頁首下方對齊。 */
.navrow{align-self:stretch;flex:1;min-width:0;display:flex;align-items:flex-end;gap:24px;padding:0}
.nav{flex:1;min-width:0;display:flex;align-items:flex-end;justify-content:center;gap:10px;flex-wrap:wrap}
.utils{flex:none;display:flex;align-items:flex-end;gap:22px}
/* HK-REV-001 分隔線：改用畫出來的長線，不用「——」字元，桌機手機都不會擠壓文字 */
.dash{display:inline-block;align-self:center;flex:none;width:46px;height:1px;background:#000;opacity:.85;user-select:none}
.navitem{position:relative;display:inline-flex;align-items:center}
.navlink{display:inline-flex;align-items:center;gap:5px;font-size:14px;letter-spacing:.1em;padding:5px 2px;border-bottom:1px solid transparent;white-space:nowrap}
.navlink:hover{color:#666}
/* HK-REV-002：目前頁只用字重＋aria-current 表示，不畫下底線 */
.navlink.on{border-bottom-color:transparent;font-weight:500}
.navcaret{display:inline-flex;align-items:center;padding:4px 2px 4px 4px;color:inherit;background:none;border:0;cursor:pointer}
.navcaret:hover{color:#666}
.navcaret:focus-visible{outline:2px solid #000;outline-offset:2px}
.navcaret[aria-expanded="true"] .caret{transform:rotate(180deg)}
/* HK-REV-003／工項5：作品／資料庫類型與語系切換的向下箭頭比例過小，統一放大並與文字間距協調 */
.navcaret .caret{font-size:17px;line-height:1;transform-origin:50% 50%;transition:transform .2s ease}
.caret{font-size:13px;line-height:1}
.menu{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);min-width:172px;max-width:calc(100vw - 32px);background:#fff;border:1px solid #000;padding:5px 0;z-index:60}
.menuArc{min-width:214px}
.mi{display:block;width:100%;padding:9px 18px;font-size:13px;letter-spacing:.07em;white-space:nowrap}
.mi:hover{background:#000;color:#fff}
.scrim{position:fixed;inset:0;z-index:35}

/* ── 全域搜尋（HK-REV-005）：底線縮短、無 placeholder、可實際送出 ── */
.searchWrap{position:relative}
.search{display:flex;align-items:center;gap:8px;border-bottom:1px solid #000;padding:4px 2px;width:132px}
.search input{width:100%;font-size:12px;letter-spacing:.08em;min-width:0}
/* 搜尋欄取得焦點時只加強底線，不顯示四邊焦點框 */
.search:focus-within{border-bottom-width:2px;padding-bottom:3px}
.search input:focus,.search input:focus-visible{outline:none;box-shadow:none}
.search input::-webkit-search-cancel-button{-webkit-appearance:none}
.mg{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;cursor:pointer}
.mgIcon{position:relative;width:11px;height:11px;border:1px solid #000;border-radius:50%;display:block}
.mgIcon::after{content:"";position:absolute;right:-4px;bottom:-2px;width:6px;height:1px;background:#000;transform:rotate(45deg)}
.mg:hover .mgIcon{border-color:#666}
.searchPanel{position:absolute;top:calc(100% + 8px);right:0;width:330px;max-width:calc(100vw - 32px);
             background:#fff;border:1px solid #000;z-index:70;max-height:62vh;overflow-y:auto}
.searchList{padding:6px 0}
.searchGroup{padding:9px 16px 3px;font-size:10px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
.searchItem{display:block;width:100%;padding:9px 16px;font-size:13px;letter-spacing:.04em;line-height:1.5}
.searchItem:hover{background:#000;color:#fff}
.searchItem:hover .searchMeta{color:#ddd}
.searchMeta{display:block;font-size:11px;letter-spacing:.08em;color:var(--muted);margin-top:3px}
.searchNone{padding:16px;font-size:12.5px;letter-spacing:.06em;color:var(--muted)}
.lang{position:relative}
.langbtn{display:inline-flex;align-items:center;gap:6px;padding:5px 0;border-bottom:1px solid transparent;font-size:12px;letter-spacing:.12em;white-space:nowrap}
.langbtn:hover{color:#666}
.langmenu{position:absolute;top:calc(100% + 10px);right:0;min-width:118px;background:#fff;border:1px solid #000;padding:5px 0;z-index:60}

/* 滿版圖 */
.hero{position:relative;width:100%;height:calc(100vh - var(--hdr-h) - var(--hero-top-gap));min-height:420px;overflow:hidden;background:#f2f2f2;margin-top:var(--hero-top-gap)}
.hero img{width:100%;height:100%;object-fit:cover;object-position:center}
/* HK-REV-026 藝術家首屏：三張黑白照等寬滿版三聯 */
.heroTri{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.heroTri img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.phc{position:absolute;top:0;right:0;bottom:0;left:0;background-size:contain;background-position:center;background-repeat:no-repeat}
/* 目錄／檔案磚：改用 <img>，不再用 inline background-image（避免單引號 URL 解析問題） */
.cellImg{width:100%;height:100%;object-fit:cover;object-position:center}
/* V7 資料庫入口：整圖可點的透明覆蓋層 ＋ 置中偏下的實心按鈕 */
.heroOverlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;padding:0;background:none;cursor:pointer}
.heroOverlay:focus-visible{outline:3px solid #fff;outline-offset:-8px}
.entryBtn{position:absolute;left:50%;bottom:clamp(40px,9vh,110px);transform:translateX(-50%);z-index:2;background:#fff;color:#000;border:1px solid #000;padding:17px 42px;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:.18em;text-indent:.18em;text-align:center;white-space:nowrap;box-shadow:0 2px 18px rgba(0,0,0,.3);transition:background .2s ease,color .2s ease}
.entryBtn:hover{background:#000;color:#fff}
.entryBtn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.entryBtn[disabled]:hover{background:#fff;color:#000}
.entryBtn:focus-visible{outline:3px solid #000;outline-offset:3px;box-shadow:0 0 0 6px rgba(255,255,255,.92)}

/* V1 首頁滿版圖：淡雅向下滾動提示（工項 4：滿版首圖缺乏向下滾動提示）。
   動畫只套在箭頭符號上，按鈕本身的可點擊熱區維持靜止不位移——
   避免整顆按鈕持續浮動造成點擊熱區不穩定（實測 Playwright 判定為 unstable element，點擊逾時）。 */
.scrollHint{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:6px;background:none;padding:8px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.scrollHintArrow{font-size:20px;line-height:1;display:block;animation:hkScrollHint 1.8s ease-in-out infinite}
.scrollHintLabel{font-size:11px;letter-spacing:.16em;white-space:nowrap}
.scrollHint:hover{opacity:.82}
.scrollHint:focus-visible{outline:2px solid #fff;outline-offset:4px}
@keyframes hkScrollHint{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media (prefers-reduced-motion:reduce){.scrollHintArrow{animation:none}}

/* V7 資料庫入口：深色半透明極簡按鈕，融入油畫背景（工項 5，僅限 V7，不影響 V3／V9 共用的 .entryBtn） */
main[data-view="v7"] .entryBtn{background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.7)}
main[data-view="v7"] .entryBtn:hover{background:rgba(0,0,0,.82);color:#fff;border-color:#fff}
main[data-view="v7"] .entryBtn:focus-visible{outline:3px solid #fff;outline-offset:3px;box-shadow:0 0 0 6px rgba(0,0,0,.35)}

/* V3 作品入口：媒材／年代選擇鈕 */
.entryHint{position:absolute;top:24px;left:24px;z-index:2;max-width:60%;color:#fff;font-size:13px;letter-spacing:.08em;line-height:1.5;text-shadow:0 1px 6px rgba(0,0,0,.45)}
.entryModes{position:absolute;left:50%;bottom:clamp(112px,20vh,196px);transform:translateX(-50%);z-index:2;display:flex;gap:14px}
.tag{background:rgba(255,255,255,.92);color:#000;border:1px solid #000;padding:11px 26px;font-size:13px;font-weight:500;letter-spacing:.14em;white-space:nowrap;cursor:pointer;transition:background .2s ease,color .2s ease}
.tag:hover{background:#000;color:#fff}
.tag[aria-pressed="true"]{background:#000;color:#fff}
.tag:focus-visible{outline:3px solid #000;outline-offset:3px;box-shadow:0 0 0 6px rgba(255,255,255,.92)}

/* 共用文字 */
.h1{font-size:24px;font-weight:700;letter-spacing:.16em;margin:0}
.rule{width:100%;height:1px;background:#000;margin:0 0 30px}
.aboutMain .rule{margin-bottom:44px}
.ruleShort{width:56px;margin:18px 0 26px}
.p{font-size:15px;line-height:2.15;letter-spacing:.03em;color:#111;margin:0 0 22px}

/* ── V1 關於資料庫 ──
   HK-REV-013 左欄放大右欄縮小；HK-REV-007 左標題底線與右統計上線等粗、等高、平行。 */
.aboutGrid{display:grid;grid-template-columns:80fr 17fr;gap:3%;padding:78px 0 0}
.aboutHead{height:var(--about-head-h);display:flex;align-items:flex-end}
.aboutStats{padding-top:var(--about-head-h)}
/* 上線與左側 .rule 同為 1px 實線黑，且起點同高 */
.count{border-top:1px solid #000;padding:15px 0 44px}
.countL{font-size:15px;font-weight:700;letter-spacing:.12em;color:#000}
/* HK-REV-009：數字與標題同一視覺層級，不再放大到 52px */
/* 客戶第 9 項：數字字級須與 .countL 標籤完全相同 */
.countN{font-family:var(--la);font-size:12px;font-weight:300;line-height:1.35;margin-top:7px;letter-spacing:.01em;color:#777}
.foot{border-top:1px solid var(--hair);margin-top:84px;padding:26px 0 46px;font-size:12px;letter-spacing:.1em;color:var(--muted)}

/* V2 藝術家介紹 */
.bioGrid{display:grid;grid-template-columns:1fr 3fr;gap:56px;padding:74px 0 0}
.anchors{position:sticky;top:22px;align-self:start;display:flex;flex-direction:column}
.anchor{display:block;width:100%;padding:11px 0 11px 16px;border-left:1px solid var(--hair);font-size:15px;letter-spacing:.1em}
.anchor:hover{border-left-color:#000}
.anchor.on{border-left:2px solid #000;font-weight:700;padding-left:15px}
.aname{font-size:34px;font-weight:700;letter-spacing:.22em;text-indent:.22em}
/* HK-REV-015：標題下方不再畫線；區段分隔線（.secH）不受影響 */
.anameSub{font-size:13px;letter-spacing:.2em;color:var(--muted);margin:10px 0 30px}
.sec{padding:0 0 54px;scroll-margin-top:96px}
.secH{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding:0 0 15px;border-bottom:1px solid #000;margin-bottom:24px}
.secHt{font-size:18px;font-weight:700;letter-spacing:.16em}
.row{display:grid;grid-template-columns:92px 1fr;gap:20px;padding:12px 0;border-bottom:1px solid var(--hair)}
.rowY{font-family:var(--la);font-size:14px;letter-spacing:.08em}
.rowV{font-size:14px;line-height:1.95}
.li{font-size:14px;line-height:1.95;padding:4px 0}
#sec-exh .row,#sec-award .row,#sec-cv .row{border-bottom:0;padding:8px 0}
#sec-exh .rowV,#sec-award .rowV,#sec-coll .li{line-height:1.62}
#sec-coll .li{padding:8px 0}

/* ── V4 作品目錄-A／V8 資料庫目錄 共用標題列 ──
   HK-REV-021：標題「作品／WORKS」，可見件數在其右側；HK-REV-022：沒有 SORT BY 標題。 */
.catBar{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap;padding:64px 0 18px;border-bottom:1px solid #000}
.catHead{display:flex;align-items:baseline;gap:16px}
.catT{font-size:30px;font-weight:700;letter-spacing:.14em;margin:0}
.catCount{font-family:var(--la);font-size:30px;font-weight:700;line-height:1;letter-spacing:.02em}
.catCountArchive{font-size:14px;font-weight:300;color:#777}
.catBar.avMode{border-bottom:0;padding-bottom:8px}
.catHead[hidden],.wall[hidden],.avGrid[hidden]{display:none!important}
.avHead{gap:8px}
.pieceNumber{font-family:var(--la);font-size:30px;font-weight:400;line-height:1;letter-spacing:.02em}
.pieceUnit{font-size:13px;font-weight:300;color:#777;letter-spacing:.14em}
/* HK-REV-028：V8 頂部直觀雙籤（文獻檔案／影音紀錄），與下拉選單並存 */
.viewTabs{display:flex;gap:10px;flex-wrap:wrap}
.viewTab{display:inline-flex;align-items:center;gap:8px;border:1px solid #000;padding:9px 18px;font-size:13px;font-weight:500;letter-spacing:.06em;white-space:nowrap;background:#fff;color:#000;transition:background .2s ease,color .2s ease}
.viewTab:hover{background:#f2f2f2}
.viewTab.on{background:#000;color:#fff}
.viewTab:focus-visible{outline:2px solid #000;outline-offset:3px}
.viewTabCount{font-family:var(--la);font-size:12px;font-weight:400;opacity:.7}
.sel{position:relative;display:inline-flex;align-items:center;border-bottom:1px solid #000;padding:6px 24px 6px 2px;min-width:252px}
.sel select{width:100%;font-size:12.5px;letter-spacing:.06em;appearance:none;-webkit-appearance:none;cursor:pointer}
.sel select:hover{color:#666}
/* HK-REV-023：滑鼠點開下拉不顯示四邊外框；鍵盤 focus-visible 仍保留焦點 */
.sel select:focus{outline:none;box-shadow:none}
.sel select:focus-visible{outline:2px solid #000;outline-offset:2px}
.selc{position:absolute;right:2px;font-size:13px;pointer-events:none}
.gridA{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:34px 0 0}
.cell{display:block;width:100%;position:relative;aspect-ratio:4/5;overflow:hidden;padding:0;background-color:#f2f2f2;transition:opacity .25s ease}
.cell:hover{opacity:.7}
.empty{padding:60px 0;font-size:13px;letter-spacing:.1em;color:var(--muted)}

/* V5 作品目錄-B（HK-REV-016：區內關鍵字搜尋已移除，統一走 Header 全域搜尋） */
.bGrid{display:grid;grid-template-columns:192px 1fr;gap:52px;padding:90px 0 0}
.filterH{font-size:11px;letter-spacing:.2em;color:var(--muted);padding-bottom:12px;border-bottom:1px solid var(--hair);margin-bottom:8px}
.filterH2{margin-top:30px}
.filterGroup.modeFocus .filterH{color:#000;border-bottom-color:#000}
.fitem{display:block;width:100%;padding:6px 0 6px 14px;font-size:13px;line-height:1.35;letter-spacing:.08em;border-left:1px solid var(--hair)}
.fitem:hover{color:#666}
.fitem.on{font-weight:500;border-left:2px solid #000;padding-left:13px}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;align-items:start}
.col2{padding-top:114px}
.col3{padding-top:57px}
.bcard{display:block;width:88%;padding:0;margin-bottom:42px}
.bimg{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background-color:#f2f2f2;transition:opacity .25s ease}
.bcard:hover .bimg{opacity:.7}
.bt{font-size:13.5px;font-weight:700;letter-spacing:.06em;margin-top:13px}
.bm{font-size:12px;letter-spacing:.06em;color:var(--muted);margin-top:6px}

/* ── V6 作品介紹 ──
   HK-REV-018 圓點＋前後鍵；HK-REV-019 移除右上大標題；HK-REV-020 主圖上緣＝右欄內容上緣。 */
.dGrid{display:grid;grid-template-columns:2fr 1fr;gap:56px;padding:56px 0 0;align-items:start}
.dMedia{min-width:0;border-right:1px solid #000;padding-right:40px}
.gal{position:relative;width:100%}
.mainImg{position:relative;display:block;width:100%;aspect-ratio:4/3;cursor:zoom-in;padding:0;overflow:hidden;background:transparent;transition:opacity .25s ease}
.mainImg:hover{opacity:.88}
.mainImgPic{width:100%;height:100%;object-fit:contain;object-position:center}
.galNav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;display:flex;align-items:center;justify-content:center;
        width:34px;height:54px;background:transparent;border:0;outline:0;box-shadow:none;appearance:none;-webkit-appearance:none;
        font-size:34px;font-weight:300;line-height:1;text-align:center;color:#111;opacity:1;visibility:visible;pointer-events:auto;
        transition:opacity .16s ease,color .16s ease}
@media (hover:hover) and (pointer:fine){
  .galNav{opacity:0;pointer-events:none}
  .gal:hover .galNav,.galNav:focus-visible{opacity:1;pointer-events:auto}
}
.galNav:hover,.galNav:focus,.galNav:focus-visible,.galNav:active{background:transparent;border:0;outline:0;box-shadow:none}
.galNav:hover,.galNav:active{color:#666}
.galNav:focus-visible{color:#000}
.galPrev{left:8px}
.galNext{right:8px}
.dots{display:flex;justify-content:center;gap:9px;margin-top:14px}
.dot{width:9px;height:9px;padding:0;border:1px solid #000;border-radius:50%;background:#fff}
.dot[aria-current="true"]{background:#000}
.dot:focus-visible{outline:2px solid #000;outline-offset:3px}
.dInfo{min-width:0}
/* 作品資訊只靠留白分組；明確清除各層邊框，避免基礎樣式或舊快取重新帶出分隔線。 */
.dInfo,.dInfo>*,.specRow,.specK,.specV,.blocks,.blk,.blkK,.blkV{border:0}
.specRow{display:grid;grid-template-columns:98px 1fr;gap:16px;padding:14px 0;align-items:baseline}
.specK{font-size:12px;letter-spacing:.1em;color:var(--muted)}
.specV{font-size:14px;letter-spacing:.04em;line-height:1.7}
.blocks{padding:60px 0 0}
.blk{padding:0}
.blkK{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:14px 0;background:none;font:inherit;color:inherit;cursor:pointer;text-align:left}
.blkKLabel{font-size:13px;font-weight:500;letter-spacing:.1em;border-bottom:1px solid #000;padding-bottom:6px;display:inline-block}
.blkCaret{font-size:15px;line-height:1;color:#666;transition:transform .2s ease}
/* HK-REV-028：▾ 固定不變，展開時旋轉 180°，與 .navcaret 同一套視覺語言 */
.blkK[aria-expanded="true"] .blkCaret{transform:rotate(180deg)}
.blkV{padding:0 0 20px;font-size:13.5px;line-height:1.55;color:#111;white-space:pre-line}
.blkV[hidden]{display:none}

/* V9 全球募集計畫（HK-REV-029：移除暫定狀態，改為緣起＋募集範圍卡片＋聯絡 CTA） */
.pending{padding:90px 0 0;max-width:840px}
.callScopeH{font-size:16px;font-weight:700;letter-spacing:.14em;margin:44px 0 22px;padding-bottom:14px;border-bottom:1px solid #000}
.callScopeGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.callCard{border:1px solid var(--hair);padding:22px 24px}
.callCardLabel{font-size:14px;font-weight:700;letter-spacing:.06em;margin-bottom:10px}
.callCardDesc{font-size:13.5px;line-height:1.85;letter-spacing:.03em;color:#333}
.callCta{margin-top:52px;padding-top:38px;border-top:1px solid var(--hair)}
.callCta .entryBtn{position:static;left:auto;bottom:auto;transform:none;display:inline-block;box-shadow:none}

/* 燈箱 */
.lb{position:fixed;inset:0;background:#000;z-index:200;display:flex;align-items:center;justify-content:center;padding:64px 56px}
.lbbg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;padding:0;background:none;cursor:pointer}
.lbimg{position:absolute;top:64px;right:56px;bottom:64px;left:56px;overflow:hidden;z-index:1;pointer-events:none}
.lbPic{width:100%;height:100%;object-fit:contain;object-position:center}
.lbx{position:absolute;top:18px;right:24px;z-index:2;color:#fff;font-family:var(--la);font-size:28px;line-height:1;padding:10px}
.lbx:hover{color:#bbb}
.lbcap{position:absolute;left:0;right:0;bottom:22px;z-index:2;text-align:center;color:#fff;font-size:11.5px;letter-spacing:.16em;pointer-events:none;padding:0 24px}

/* V8 資料庫磚牆 */
.wall{columns:5;column-gap:18px;padding:32px 0 0}
.doc{position:relative;display:block;width:100%;padding:0;margin:0 0 18px;overflow:hidden;break-inside:avoid;background-color:#f2f2f2;transition:opacity .25s ease}
.doc:hover{opacity:.72}
.avGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 34px;padding:22px 0 0}
.avCard{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:center;padding:14px 0;border-top:1px solid var(--hair);color:inherit;text-decoration:none}
.avCard:hover .avThumb img{opacity:.75}
.avCard:focus-visible{outline:2px solid #000;outline-offset:4px}
.avThumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#f2f2f2}
.avThumb img{display:block;width:100%;height:100%;object-fit:cover;transition:opacity .2s ease}
.avPlay{position:absolute;left:50%;top:50%;width:32px;height:32px;border:1px solid #fff;border-radius:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.35)}
.avPlay::before{content:"";position:absolute;left:12px;top:8px;border-left:10px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent}
.avBody{display:block;min-width:0}
.avTitle{display:block;font-size:14px;font-weight:400;line-height:1.45;letter-spacing:.04em}
.avMeta{display:block;margin-top:7px;font-size:11px;font-weight:300;line-height:1.5;letter-spacing:.08em;color:#888}
.r32{aspect-ratio:3/2}
.r34{aspect-ratio:3/4}
.r11{aspect-ratio:1/1}
.r57{aspect-ratio:5/7}
.r43{aspect-ratio:4/3}
.r23{aspect-ratio:2/3}
.r169{aspect-ratio:16/9}
.tail{height:80px}

/* AV detail page */
.hk-av-detail{background:var(--bg);color:var(--ink);font-family:var(--zh);font-weight:300;min-height:100vh}
.avDetail{max-width:1160px;margin:0 auto;padding:44px 36px 70px}
.avBack{display:inline-flex;margin-bottom:36px;font-size:12px;letter-spacing:.12em;color:inherit;text-decoration:none;border-bottom:1px solid #000;padding-bottom:4px}
.avBack:hover{color:#666;border-bottom-color:#666}
.avDetailGrid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.85fr);gap:52px;align-items:start}
.avPlayer{min-width:0}
.avPoster{position:relative;display:block;width:100%;aspect-ratio:16/9;background:#f2f2f2;overflow:hidden}
.avPoster img,.avPoster video{display:block;width:100%;height:100%;object-fit:contain}
.avPoster iframe{display:block;width:100%;height:100%;border:0}
.avMissing{margin-top:16px;font-size:12px;line-height:1.7;letter-spacing:.08em;color:#777}
.avDetailKind{font-size:12px;letter-spacing:.18em;color:#777;margin:0 0 18px}
.avDetailTitle{font-size:28px;font-weight:400;line-height:1.35;letter-spacing:.04em;margin:0}
.avDetailMeta{margin:18px 0 0;font-size:12px;line-height:1.7;letter-spacing:.08em;color:#888}
.avDetailNote{margin:34px 0 0;font-size:14px;line-height:1.85;letter-spacing:.04em;color:#111}
.avDetailYoutube{display:inline-block;margin-top:28px;font-size:12px;letter-spacing:.1em;color:inherit;text-decoration:none;border-bottom:1px solid #000;padding-bottom:3px}
.avDetailYoutube:hover{color:#666;border-bottom-color:#666}

/* ── HK-REV-010 回頂鍵：每個視圖右下角一顆，捲動後才出現 ── */
.toTop{position:fixed;right:20px;bottom:186px;z-index:140;display:flex;align-items:center;justify-content:center;
       width:44px;height:44px;background:#fff;border:1px solid #000;font-size:17px;font-weight:700;line-height:1;
       text-align:center;box-shadow:0 2px 12px rgba(0,0,0,.18);transition:background .2s ease,color .2s ease}
.toTop:hover{background:#000;color:#fff}
.toTop[hidden]{display:none}
.toTop:focus-visible{outline:2px solid #000;outline-offset:3px}

.theme-client .kxfb-launcher{right:20px;bottom:20px;z-index:150;height:42px;border-radius:0;background:#000;border:1px solid #000;
  color:#fff;padding:0 16px;font-family:var(--zh);font-size:12.5px;font-weight:700;letter-spacing:.1em;line-height:1;
  min-height:42px;white-space:nowrap;width:max-content;max-width:calc(100vw - 40px);
  box-shadow:0 2px 14px rgba(0,0,0,.25);transition:background .2s ease,color .2s ease,transform .2s ease}
.theme-client .kxfb-launcher:hover{background:#fff;color:#000;transform:translateY(-2px)}
.theme-client .kxfb-launcher svg{width:13px;height:13px}
.theme-client .kxfb-overlay{z-index:220;background:rgba(0,0,0,.35)}
.theme-client .kxfb-dropzone{z-index:225}
.theme-client .kxfb-modal{--kxfb-primary:#000;--kxfb-primary-deep:#000;--kxfb-primary-soft:#f3f3f3;--kxfb-accent:#000;--kxfb-accent-soft:#f3f3f3;--kxfb-ink:#111;--kxfb-text:#222;--kxfb-muted:#666;--kxfb-line:#000;--kxfb-line-soft:#d8d8d8;--kxfb-wash:#f7f7f7;--kxfb-radius-lg:0;
  border-radius:0;border-color:#000;box-shadow:0 2px 14px rgba(0,0,0,.25);font-family:var(--zh)}
.theme-client .kxfb-head h2,.theme-client .kxfb-rec-title{font-family:var(--zh);font-weight:700;letter-spacing:.12em}
.theme-client .kxfb-ai-badge{border-radius:0;background:#f3f3f3;color:#000;border:1px solid #000;font-family:var(--zh);letter-spacing:.08em}
.theme-client .kxfb-close,.theme-client .kxfb-reset,.theme-client .kxfb-attach,.theme-client .kxfb-enter-mode,
.theme-client .kxfb-rec-back,.theme-client .kxfb-modal .btn{border-radius:0;border:1px solid #000;background:#fff;color:#000;font-family:var(--zh);box-shadow:none}
.theme-client .kxfb-close:hover,.theme-client .kxfb-reset:hover,.theme-client .kxfb-attach:hover,.theme-client .kxfb-enter-mode:hover,
.theme-client .kxfb-rec-back:hover,.theme-client .kxfb-modal .btn:hover{background:#000;color:#fff;border-color:#000}
.theme-client .kxfb-chat,.theme-client .kxfb-inputbar textarea,.theme-client .kxfb-page-note,.theme-client .kxfb-el-chip,
.theme-client .kxfb-attach-preview,.theme-client .kxfb-rec-list{border-radius:0;border:1px solid #000;background:#f7f7f7;color:#222}
.theme-client .kxfb-inputbar textarea:focus{border-color:#000;background:#fff}
.theme-client .kxfb-bubble-text,.theme-client .kxfb-bubble-img,.theme-client .kxfb-doc-chip,.theme-client .kxfb-attach-row img,
.theme-client .kxfb-attach-row button,.theme-client .kxfb-attach-ico,.theme-client .kxfb-rec-card,.theme-client .kxfb-rec-st,
.theme-client .kxfb-rec-reply,.theme-client .kxfb-rec-reply-imgs img,.theme-client .kxfb-msg.ok,.theme-client .kxfb-msg.err,
.theme-client .kxfb-dropzone-inner{border-radius:0}
.theme-client .kxfb-ai .kxfb-bubble-text{border:1px solid #000;background:#fff;color:#222}
.theme-client .kxfb-me .kxfb-bubble-text{background:#000;color:#fff}
.theme-client .kxfb-msg.ok,.theme-client .kxfb-msg.err{border:1px solid #000;background:#f3f3f3;color:#000}
.theme-client .kxfb-pick-hint{border-radius:0;background:#000;color:#fff;box-shadow:0 2px 14px rgba(0,0,0,.25);font-family:var(--zh)}
.theme-client .kxfb-picking .kxfb-hover-target{outline-color:#000!important;background-color:#f3f3f3!important}
.theme-client .kxfb-rec-card{border:1px solid #000;background:#fff}
.theme-client .kxfb-rec-st{border:1px solid #000;background:#fff;color:#000;letter-spacing:.06em}
.theme-client .kxfb-rec-st-confirm{background:#000;color:#fff}
.theme-client .kxfb-rec-reply{border-left:2px solid #000;background:#f7f7f7}
.theme-client .kxfb-rec-reply-head{color:#000}

/* 可送出後台的「新網站・待確認」工具：沿用客戶版黑白、方角與低裝飾語彙 */
.theme-client .kxdec-launcher{right:20px;bottom:74px;z-index:150;min-height:42px;height:42px;border-radius:0;background:#fff;
  border:1px solid #000;color:#000;padding:0 14px;font-family:var(--zh);font-size:12.5px;font-weight:700;letter-spacing:.1em;
  line-height:1;white-space:nowrap;width:max-content;max-width:calc(100vw - 40px);
  box-shadow:0 2px 14px rgba(0,0,0,.18);transition:background .2s ease,color .2s ease,transform .2s ease}
.theme-client .kxdec-launcher:hover{background:#000;color:#fff;transform:translateY(-2px)}
.theme-client .kxdec-launcher svg{width:13px;height:13px}
.theme-client .kxdec-launcher-label{display:inline-block;flex:0 0 auto;min-width:max-content;max-width:none;overflow:visible;text-overflow:clip;white-space:nowrap}
.theme-client .kxdec-count{min-width:22px;height:20px;border-radius:0;border:1px solid currentColor;background:transparent;color:currentColor;
  font-size:11px;font-weight:700}
.theme-client .kxdec-overlay{z-index:215;background:rgba(0,0,0,.35);justify-content:center}
.theme-client .kxdec-panel{border-radius:0;border:1px solid #000;background:#fff;color:#222;box-shadow:0 2px 18px rgba(0,0,0,.28);
  font-family:var(--zh);width:min(720px,100%)}
.theme-client .kxdec-head{background:#fff;border-bottom:1px solid #000}
.theme-client .kxdec-title-row{align-items:flex-start}
.theme-client .kxdec-kicker{color:#000;font-size:11px;font-weight:700;letter-spacing:.18em}
.theme-client .kxdec-head h2{color:#000;font-family:var(--zh);font-size:20px;font-weight:700;letter-spacing:.08em}
.theme-client .kxdec-intro,.theme-client .kxdec-context,.theme-client .kxdec-group-head p,.theme-client .kxdec-foot-note{color:#333}
.theme-client .kxdec-progress{color:#000;letter-spacing:.05em}
.theme-client .kxdec-track{border-radius:0;background:#f3f3f3;border:1px solid #000;height:8px}
.theme-client .kxdec-fill{border-radius:0;background:#000}
.theme-client .kxdec-saved,.theme-client .kxdec-status{color:#000}
.theme-client .kxdec-submitted{border-top:1px solid #000;background:#f3f3f3;color:#000}
.theme-client .kxdec-body{background:#fff}
.theme-client .kxdec-group-head h3,.theme-client .kxdec-question legend,.theme-client .kxdec-option-title{color:#000}
.theme-client .kxdec-question,.theme-client .kxdec-option,.theme-client .kxdec-note,.theme-client .kxdec-close,.theme-client .kxdec-action{
  border-radius:0;border-color:#000;background:#fff;color:#000;box-shadow:none}
.theme-client .kxdec-question{padding:18px}
.theme-client .kxdec-option:hover{background:#f3f3f3;border-color:#000}
.theme-client .kxdec-option:has(input:checked){border-color:#000;background:#f3f3f3;box-shadow:inset 3px 0 #000}
.theme-client .kxdec-option input{accent-color:#000}
.theme-client .kxdec-option-desc{color:#555}
.theme-client .kxdec-recommended{border-radius:0;background:#000;color:#fff;font-weight:700;letter-spacing:.08em}
.theme-client .kxdec-note{background:#fff;font-family:var(--zh)}
.theme-client .kxdec-note:focus-visible,.theme-client .kxdec-action:focus-visible,.theme-client .kxdec-close:focus-visible,
.theme-client .kxdec-launcher:focus-visible,.theme-client .kxdec-option:focus-within{outline:2px solid #000;outline-offset:2px}
.theme-client .kxdec-foot{background:#fff;border-top:1px solid #000}
.theme-client .kxdec-action.primary{background:#000;color:#fff;border-color:#000}
.theme-client .kxdec-action.primary:hover{background:#fff;color:#000}
.theme-client .kxdec-action:disabled{background:#f3f3f3;color:#666;border-color:#999}
.theme-client .kxdec-action:hover:not(:disabled),.theme-client .kxdec-close:hover{background:#000;color:#fff}
.theme-client .kxdec-action.danger{margin-left:auto;color:#000}
.theme-client .kxdec-status.error{color:#000;background:#f3f3f3;border:1px solid #000;padding:6px 10px}

@media (max-width:1200px){
  .gridA{grid-template-columns:repeat(3,1fr)}
  .wall{columns:4}
  .dGrid{grid-template-columns:1fr;gap:40px}
  .dMedia{border-right:0;padding-right:0}
  .mainImg{aspect-ratio:3/2}
}
@media (max-width:900px){
  .wrap{padding:0 26px}
  .hdr{flex-direction:column;align-items:center;gap:12px;padding:16px 20px}
  .navrow{width:100%;flex-direction:column;align-items:center;gap:14px}
  /* 窄版：下拉改以整條 nav 為定位基準，避免靠邊的選單被推出視窗造成水平溢位 */
  .nav{position:relative;justify-content:center;flex-wrap:wrap}
  .navitem{position:static}
  .menu{left:50%;transform:translateX(-50%);max-width:calc(100vw - 40px)}
  .dash{width:26px}
  .searchPanel{left:50%;right:auto;transform:translateX(-50%)}
  .aboutGrid{grid-template-columns:1fr;gap:44px;padding-top:56px}
  .aboutHead{height:auto}
  .aboutStats{padding-top:0}
  .bioGrid{grid-template-columns:1fr;gap:34px;padding-top:56px}
  .anchors{position:static;flex-direction:row;flex-wrap:wrap}
  .anchor{width:auto;padding:8px 16px 8px 14px}
  .bGrid{grid-template-columns:1fr;gap:34px;padding-top:70px}
  .cols{grid-template-columns:repeat(3,1fr);gap:20px}
  .col2{padding-top:70px}
  .col3{padding-top:35px}
  .wall{columns:3}
  .avGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .avDetail{padding:34px 24px 54px}
  .avDetailGrid{grid-template-columns:1fr;gap:34px}
  .aname{font-size:28px}
  .callScopeGrid{grid-template-columns:1fr}
}
@media (max-width:600px){
  :root{--hero-top-gap:18px}
  .wrap{padding:0 20px}
  .gridA{grid-template-columns:repeat(2,1fr);gap:14px}
  .cols{grid-template-columns:1fr;gap:0}
  .bcard{width:100%}
  .col2{padding-top:0}
  .col3{padding-top:0}
  .wall{columns:2;column-gap:12px}
  .doc{margin-bottom:12px}
  .row{grid-template-columns:64px 1fr;gap:12px}
  .sel{min-width:0;width:100%}
  .catBar{padding-top:46px}
  .catT,.catCount{font-size:24px}
  .catCount.catCountArchive{font-size:14px;font-weight:300;color:#777}
  .avGrid{grid-template-columns:1fr;gap:12px}
  .avCard{grid-template-columns:88px minmax(0,1fr);gap:14px;padding:12px 0}
  .pieceNumber{font-size:24px}
  .pieceUnit{font-size:12px}
  .avDetailTitle{font-size:23px}
  .heroTri{min-height:320px}
  /* 觸控目標 ≥44px（僅手機寬度，桌機外觀不變） */
  .navlink{min-height:44px;padding:5px 6px}
  .langbtn{min-height:44px;min-width:44px;justify-content:center}
  .mi{min-height:44px;display:flex;align-items:center}
  .fitem{min-height:44px;display:flex;align-items:center}
  .anchor{min-height:44px;display:flex;flex-direction:column;justify-content:center}
  .search{min-height:44px;padding:0 2px}
  .search input{min-height:40px}
  .sel{min-height:44px;padding:0 24px 0 2px}
  .sel select{min-height:40px}
  .lbx{padding:12px;min-width:44px;text-align:center}
  .entryBtn{padding:14px 26px;font-size:13.5px;letter-spacing:.14em;text-indent:.14em;bottom:clamp(32px,8vh,90px)}
  .entryHint{top:18px;left:18px;font-size:12px}
  .entryModes{bottom:clamp(96px,18vh,150px);gap:10px}
  .tag{padding:9px 18px;font-size:12px;letter-spacing:.1em}
  .viewTab{min-height:44px;padding:8px 14px;font-size:12px}
  .callCard{padding:18px}
  .scrollHint{bottom:18px}
  .lbimg{top:52px;right:20px;bottom:52px;left:20px}
  .theme-client .kxfb-launcher{right:14px;bottom:14px;max-width:calc(100vw - 28px)}
  .theme-client .kxdec-launcher{right:14px;bottom:70px;max-width:calc(100vw - 28px);padding:0 12px;font-size:11.5px;letter-spacing:.06em}
  .theme-client .kxdec-launcher-label{min-width:max-content;max-width:calc(100vw - 118px)}
  .theme-client .kxdec-panel{max-height:92dvh}
  .toTop{bottom:172px}
}

@media (hover:none),(pointer:coarse){
  .galNav{opacity:1;pointer-events:auto}
}

/* ── PHP demo 整合附加（2026-08-30）── */
/* 雙語切換：預設中文，body.hk-en 切英文 */
[data-en]{display:none}
body.hk-en [data-zh]{display:none}
body.hk-en [data-en]{display:revert}
/* 視圖切換保護：hidden 一律生效 */
main[data-view][hidden]{display:none!important}
/* demo 環境共存：client 風格的站體放在 body 直接子層，避開全域按鈕樣式干擾 */
.hk-site{min-height:60vh}
.hk-site .site{background:#fff}
/* client 風格：風格選擇器摺疊為橫向小條（滿版 hero 才是開場主角） */
.theme-client .demo-notice{flex-wrap:wrap;gap:4px 14px;padding:6px 20px;font-size:12px}
.theme-client .style-picker{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;padding:12px 24px;margin:0;border-bottom:1px solid #000}
.theme-client .style-picker > div:first-child{display:flex;align-items:baseline;gap:10px}
.theme-client .style-picker .eyebrow{font-size:9px;letter-spacing:.2em}
.theme-client .style-picker h1{font-size:14px;letter-spacing:.08em;margin:0}
.theme-client .style-options{display:flex;flex-wrap:wrap;gap:6px;grid-template-columns:none}
.theme-client .style-option{display:inline-flex;align-items:baseline;gap:6px;padding:5px 11px;border:1px solid rgba(0,0,0,.35);font-size:12px;margin:0}
.theme-client .style-option small{display:none}
.theme-client .style-option span{font-size:9px;letter-spacing:.12em}
.theme-client .style-option strong{font-size:12px}
/* 燈箱保護：class 的 display:flex 不得覆蓋 hidden 屬性（2026-08-30 修正全屏黑畫面） */
.lb[hidden]{display:none!important}
.searchPanel[hidden],.galNav[hidden],.dots[hidden]{display:none!important}

/* ── 手機導覽（≤760px）：漢堡 ＋ 由頁首下緣展開的全寬抽屜（2026-08-31 補）──
   桌機／平板橫向不受影響：.burger 預設隱藏，.navrow 維持原本排版。 */
.burger{display:none}

@media (max-width:760px){
  /* 頁首壓成單行並吸頂：左品牌、右漢堡 */
  .hdr{position:sticky;top:0;flex-direction:row;align-items:center;gap:12px;padding:8px 20px 10px;min-height:70px}
  .brand{flex:1;min-width:0;flex-direction:row;align-items:center;gap:10px;padding:9px 0}
  /* 60px 手機頁首扣除上下各 9px 後，用滿 42px 可用高度。 */
  .mark{height:42px;flex:none}

  .burger{display:flex;align-items:center;justify-content:flex-end;flex:none;width:44px;height:44px;margin-right:-4px}
  .burgerBox{position:relative;width:22px;height:13px}
  .burgerBox span{position:absolute;left:0;width:100%;height:1px;background:#000;transition:top .22s ease,transform .22s ease,opacity .16s ease}
  .burgerBox span:nth-child(1){top:0}
  .burgerBox span:nth-child(2){top:6px}
  .burgerBox span:nth-child(3){top:12px}
  body.hk-nav-open .burgerBox span:nth-child(1){top:6px;transform:rotate(45deg)}
  body.hk-nav-open .burgerBox span:nth-child(2){opacity:0}
  body.hk-nav-open .burgerBox span:nth-child(3){top:6px;transform:rotate(-45deg)}

  /* 抽屜本體 */
  body.hk-nav-open{overflow:hidden}
  .navrow{position:fixed;top:var(--hk-drawer-top,60px);left:0;right:0;bottom:0;z-index:80;
          display:flex;flex-direction:column;align-items:stretch;gap:0;padding:2px 20px 40px;background:#fff;overflow-y:auto;
          -webkit-overflow-scrolling:touch;border-top:1px solid var(--hair);
          opacity:0;visibility:hidden;transform:translateY(-6px);
          transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
  body.hk-nav-open .navrow{opacity:1;visibility:visible;transform:none;transition-delay:0s}
  body.hk-nav-open .scrim{display:none}

  .nav{display:block;flex:none;gap:0}
  /* 抽屜內改成一列一項，分隔線用列邊框表示（保留桌機的加長 dash） */
  .dash{display:none}
  .navitem{position:relative;display:block;border-bottom:1px solid var(--hair)}
  .navlink{display:flex;width:100%;min-height:56px;justify-content:space-between;align-items:center;
           padding:0 56px 0 0;font-size:16px;letter-spacing:.12em;border-bottom:0}
  .navlink.on{border-bottom:0;font-weight:700}
  .navlink.on::before{content:"";position:absolute;left:-16px;top:50%;width:8px;height:1px;background:#000}
  .navcaret{position:absolute;top:0;right:0;bottom:0;width:56px;min-height:56px;justify-content:center;
            padding:0;border-bottom:0}
  .navcaret .caret{font-size:17px;transition:transform .22s ease}

  /* 子選單改就地展開（不再是浮動下拉） */
  .menu{position:static;transform:none;min-width:0;max-width:none;padding:0 0 8px;border:0;background:none;z-index:auto}
  .mi{min-height:48px;padding:0 0 0 18px;font-size:14px;letter-spacing:.1em;color:#333}
  .mi:hover,.mi:focus{background:none;color:#000}

  /* 搜尋與語言：抽屜底部直排 */
  .utils{display:block;flex:none;margin-top:auto;padding-top:32px}
  .searchWrap{width:100%}
  .search{width:100%;min-height:48px;padding:0 2px}
  .searchPanel{position:static;width:100%;transform:none;max-height:44vh;margin-top:8px}
  .lang{width:100%;margin-top:16px;border-top:1px solid var(--hair)}
  .langbtn{display:flex;width:100%;min-height:52px;justify-content:space-between;align-items:center;
           font-size:14px;letter-spacing:.12em}
  .langmenu{position:static;min-width:0;padding:0 0 6px;border:0;background:none;z-index:auto}
}

/* 觸控裝置：點過的項目不留 hover 殘影（僅手機斷點，768px 平板與桌機不受影響） */
@media (max-width:760px) and (hover:none){
  .navlink:hover,.langbtn:hover{color:inherit}
  .mi:hover{background:none;color:inherit}
}