/*!
 * 鑑星閣 全站改版 jx-core.css  v2.3.3
 * ⚠ 外觀已定稿（業主要求）：套版時請勿修改本檔，也不要另寫 CSS／JS 覆蓋或改寫 .jx 元件；需要調整請向業主提出，由設計端更新本檔並升版本號（以整支檔案替換）
 * ---------------------------------------------------------------
 * 命名：BEM + jx- 前綴（.jx-block__element--modifier），狀態類別使用 .is-*
 * 範圍：class 一律以 jx- 開頭，不影響網站其他元素；色彩／字級變數定義在 .jx 根元素上，元件必須放在 class="jx" 的區塊內
 * 設計基準：視窗 1200px 時版寬 1200（內容區 1112px）；寬螢幕版寬與左右留白隨視窗放大，版寬上限 1680px（全站一致，換頁時 Logo 不跳動），詳見「交接說明.md」
 * 斷點：≥1200 設計稿原尺寸（寬螢幕放寬） ／ 1024–1199 等比收窄 ／ 768–1023 平板 ／ <768 手機 ／ <400 小尺寸手機
 *       ／ ≥1440 寬螢幕、<360 極窄手機（僅 jx-auction.css 使用）
 */

/* =================================================================
   1. Design Tokens
   ================================================================= */
.jx{
  /* 色彩 */
  --jx-gold:#9a6a44;
  --jx-gold-hover:#80552f;
  --jx-gold-soft:#c9a27e;
  --jx-ink:#1c1c1c;          /* 標題、價格 */
  --jx-text:#3d3d3d;         /* 內文 */
  --jx-sub:#5c5c5c;          /* 頁籤、次要連結 */
  --jx-muted:#767676;        /* 標籤、說明（白底對比 4.5:1，符合 AA） */
  --jx-placeholder:#aaa39b;  /* 輸入框提示文字 */
  --jx-line:#e8e3dd;
  --jx-line-strong:#d9d3cc;  /* 表單、篩選框框線 */
  --jx-bg:#fff;
  --jx-bg-cream:#f6f1eb;     /* 委託區塊底色 */
  --jx-bg-img:#f3f3f2;       /* 商品圖底色 */
  --jx-bg-dark:#2a241d;      /* 專場封面佔位 */
  --jx-bg-hover:#fdfbf8;     /* 列表滑過底色 */
  --jx-bg-selected:#fbf7f2;  /* 選取中底色 */
  --jx-on-dark-muted:#8a7862;   /* 深色底上的說明文字 */
  --jx-danger:#b3261e;       /* 錯誤、逾期 */
  --jx-danger-bg:#fbeeed;
  --jx-success:#2f6f4f;      /* 完成、通過 */
  --jx-success-bg:#e8f1eb;
  --jx-todo-bg:#f5e9dc;      /* 待處理 */

  /* 字體 */
  --jx-serif:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --jx-sans:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;

  /* 字級（桌機；平板、手機於下方 RWD 覆寫） */
  --jx-fs-hero-title:58px;
  --jx-fs-hero-sub:24px;
  --jx-fs-hero-meta:17px;
  --jx-fs-section:36px;
  --jx-fs-consign:38px;
  --jx-fs-card-title:19px;
  --jx-fs-auction-title:20px;
  --jx-fs-price:25px;
  --jx-fs-deal-price:24px;
  --jx-fs-body:15px;
  --jx-fs-nav:14px;
  --jx-fs-sm:14px;           /* 出價數、查看拍品 */
  --jx-fs-xs:13px;           /* 目前出價、查看全部、時間 */
  --jx-fs-2xs:12px;          /* 專場標籤、示意說明 */

  /* 版面 */
  --jx-max:1680px;           /* 版寬上限（含左右留白）；視窗 1200 時版寬即 1200 */
  --jx-gutter:max(44px, calc(4.5vw - 10px));   /* 左右留白：1200 寬時 44，1440→55、1672→65；≤1199 由 RWD 覆寫 */
  --jx-header-h:61px;
  --jx-section-gap:30px;     /* 區塊上方間距 */
  --jx-grid-gap:20px;        /* 拍品卡片間距 */
  --jx-hero-h:clamp(416px, 29vw, 520px);   /* 1200 寬時 416，寬螢幕等比增高 */
  --jx-consign-h:clamp(205px, 17.08vw, 320px);   /* 委託 Banner 高度：1200 寬時 205，寬螢幕等比增高，圖片維持約 3.4:1 */
  --jx-hero-info:min(32vw, calc(var(--jx-max) * .32));   /* Hero 左側文字欄寬（含左留白）；1200 寬時 384 */
  --jx-hero-inset:11px;              /* Hero 文字比內容區再內縮（設計稿） */

  /* 其他 */
  --jx-radius:2px;           /* 按鈕、標籤、狀態 */
  --jx-radius-md:4px;        /* 搜尋框、圖卡 */
  --jx-z-cs:90;              /* 浮動客服 */
  --jx-z-header:100;         /* Header */
  --jx-z-drawer:200;         /* 篩選抽屜等全螢幕面板 */
  --jx-pulse-dur:1.6s;       /* 直播／進行中狀態點的閃爍節奏（全站一致） */
  --jx-ease:cubic-bezier(.25,.1,.25,1);
  --jx-shadow:0 10px 30px rgba(28,28,28,.08);

  font-family:var(--jx-sans);
  font-size:var(--jx-fs-body);
  line-height:1.6;
  color:var(--jx-text);
  background:var(--jx-bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* 西文彎引號（’ ‘ “ ”）：Noto TC 字型內是全形（1em 寬），用在英文品名會多出一大段空隙、撐寬標題；
   改由系統西文襯線字提供比例寬字形。只用在英文為主的標題（例：.jx-bidcol__title），中文內文維持全形；黑體標題用 "JX Latin Quote Sans" */
@font-face{font-family:"JX Latin Quote";src:local("Georgia"),local("Times New Roman"),local("Noto Serif"),local("Times-Roman");font-weight:100 900;unicode-range:U+2018-2019,U+201C-201D}
@font-face{font-family:"JX Latin Quote Sans";src:local("Arial"),local("Helvetica Neue"),local("Helvetica"),local("Roboto"),local("Noto Sans");font-weight:400;unicode-range:U+2018-2019,U+201C-201D}
@font-face{font-family:"JX Latin Quote Sans";src:local("Arial Bold"),local("Arial-BoldMT"),local("Helvetica Neue Bold"),local("HelveticaNeue-Bold"),local("Roboto Bold"),local("Roboto-Bold"),local("Noto Sans Bold");font-weight:700;unicode-range:U+2018-2019,U+201C-201D}

/* =================================================================
   2. 與現有網站 CSS 的相容處理
   -----------------------------------------------------------------
   現有 static/css/main.css 設定 html,body{min-width:1260px}（768px 以上），
   會讓 768–1259px 的平板版失效並出現橫向捲軸。
   → 所有改版頁面的 <html> 都要加上 class="jx-page"（見交接說明 §2），否則 768–1259px 會出現橫向捲軸、平板與手機版失效；
     未改版的頁面不受影響。
   ================================================================= */
html.jx-page,html.jx-page body{min-width:0}
/* 跳到錨點、瀏覽器捲到驗證失敗的欄位、Tab 聚焦時：內容停在固定 Header 下方 16px，不被遮住（Header 高度 61／60／56，見下方 RWD；變數定義在 .jx 上，<html> 讀不到，故寫數字） */
html.jx-page{scroll-padding-top:77px}
@media (max-width:1023px){html.jx-page{scroll-padding-top:76px}}
@media (max-width:767px){html.jx-page{scroll-padding-top:72px}}
/* 頁內錨點平滑捲動（業主 2026-10-02：Header「立即委託」連到委託拍賣頁 #jxApply、「前往重新上傳」等）；系統設定「減少動態效果」時維持瞬間跳轉 */
@media (prefers-reduced-motion:no-preference){html.jx-page{scroll-behavior:smooth}}

/* 抵銷現有全站樣式對本區塊的影響（main.css: a{transition:all .4s} 由下方 Reset 的 .jx :where(a) 一併處理） */
.jx nav li::before{content:none;float:none}      /* UePageReset: nav li:before 零寬字元 */
.jx :where(small){font-size:inherit}             /* UePageReset: small{font-size:80%} */
.jx :focus-visible{outline:2px solid var(--jx-gold)!important;outline-offset:3px}  /* main.css: button,input{outline:0!important} */

/* =================================================================
   3. Scoped Reset（:where 權重為 0，任何元件樣式都能覆寫）
   ================================================================= */
.jx,.jx *,.jx *::before,.jx *::after{box-sizing:border-box}
.jx :where(h1,h2,h3,h4,p,ul,ol,li,figure,dl,dd){margin:0;padding:0}
.jx :where(ul,ol){list-style:none}
.jx :where(a){color:inherit;text-decoration:none;transition:none}   /* transition：抵銷 main.css a{transition:all .4s} */
.jx :where(img,svg){display:block;max-width:100%}
.jx :where(img){height:auto;border:0}
.jx :where(button){font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;-webkit-appearance:none;appearance:none}
.jx :where(input,select,textarea){font:inherit;color:inherit;margin:0}   /* select／textarea 預設不繼承字型（會變成 Arial／等寬字） */
.jx :where(time,data){font:inherit}
.jx [hidden]{display:none!important}
.jx :focus:not(:focus-visible){outline:none}

/* 斷行：標題平均分行、內文避免最後一行只剩一個字（瀏覽器不支援時維持一般斷行）
   用 text-wrap-style 而非 text-wrap 簡寫，才不會蓋掉元件自己的 white-space:nowrap；
   個別元件要照設計稿斷行時，寫 text-wrap:wrap 即可取消 */
.jx :where(h1,h2,h3,h4){text-wrap-style:balance}
.jx :where(p,li,dd,blockquote,figcaption){text-wrap-style:pretty}

.jx-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 「跳到主要內容」（業主 2026-10-02，無障礙）：<a class="jx-skip" href="#jxMain">跳到主要內容</a> 放在 <body> 最前面（版型 layout.html）
   平常隱藏（同 .jx-sr-only），用鍵盤 Tab 聚焦時固定出現在畫面左上角（白底、金框，蓋在 Header 之上）；按下後移到 #jxMain（主要內容前的定位點）
   本元素不在 class="jx" 區塊內，讀不到色彩變數，所以直接寫色碼（金 #9a6a44、墨 #1c1c1c）；color、transition 寫明，避免被現有網站的 a 樣式改掉 */
.jx-skip{position:absolute;left:8px;top:8px;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;transition:none}
.jx-skip:focus{position:fixed;z-index:1000;width:auto;height:auto;margin:0;padding:10px 18px;overflow:visible;clip:auto;
  font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;font-size:14px;font-weight:500;line-height:1.4;letter-spacing:.04em;color:#1c1c1c;text-decoration:none;
  background:#fff;border:2px solid #9a6a44;border-radius:2px;box-shadow:0 6px 20px rgba(28,28,28,.12);outline:none}   /* z-index 1000：高於 Header（100）、篩選抽屜（200）；金框即聚焦框 */
#jxMain:focus{outline:none}   /* 跳過來的定位點（空的 span，tabindex="-1"）：不畫聚焦框 */

/* =================================================================
   4. 共用元件
   ================================================================= */
.jx-container{width:100%;max-width:var(--jx-max);margin:0 auto;padding:0 var(--jx-gutter)}

/* 圖片框：圖片載入失敗或未提供時，只顯示灰色底
   data-label（建議尺寸）是給開發者的提示：只在本機預覽顯示（preview-links.js 會在 <html> 加上 class="jx-preview"），正式網站不會出現 */
.jx-media{position:relative;overflow:hidden;background:var(--jx-bg-img)}
.jx-media::before{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:12px;font-size:12px;letter-spacing:.08em;color:#b5ada4;text-align:center}
html.jx-preview .jx-media::before{content:attr(data-label)}
.jx-media picture{display:block;width:100%;height:100%}
.jx-media img{position:relative;width:100%;height:100%;object-fit:cover;background-color:inherit;transition:transform .6s var(--jx-ease)}   /* 底色：去背 PNG 透明處也是灰底，不透出下層提示字 */
.jx-media--contain img{object-fit:contain;padding:7% 9%}
.jx-media.is-empty img{display:none}

/* 按鈕：預設 40px ／ --sm 34px（小型按鈕）／ --lg 46px（表單送出、頁面主要行動）；
   篩選列、工具列的精簡控制項為 36px（見 jx-pages.css） */
.jx-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 28px;
  font-size:var(--jx-fs-sm);font-weight:500;letter-spacing:.14em;line-height:1;white-space:nowrap;
  color:#fff;background:var(--jx-gold);border-radius:var(--jx-radius);
  transition:background-color .2s var(--jx-ease),color .2s var(--jx-ease),border-color .2s var(--jx-ease)}
.jx-btn:hover{color:#fff;background:var(--jx-gold-hover)}
.jx-btn--sm{height:34px;padding:0 20px;font-size:var(--jx-fs-xs);letter-spacing:.1em}
.jx-btn--lg{height:46px;padding:0 38px;font-size:15px}

/* 箭頭圖示 */
.jx-arrow{width:10px;height:10px;flex-shrink:0;transition:transform .2s var(--jx-ease)}

/* =================================================================
   5. Header
   ================================================================= */
.jx-header{position:sticky;top:0;z-index:var(--jx-z-header);background:#fff;border-bottom:1px solid var(--jx-line);transition:box-shadow .3s var(--jx-ease)}
.jx-header.is-scrolled{box-shadow:0 2px 16px rgba(28,28,28,.06)}
.jx-header__inner{display:flex;align-items:center;height:var(--jx-header-h);gap:32px}

.jx-logo{display:block;flex-shrink:0}
/* Logo 圖檔左右各有約 16% 透明留白：用 aspect-ratio＋object-fit 只顯示圖形部分，讓圖形對齊版面邊緣。
   日後換成已裁掉留白的圖檔時，刪除 aspect-ratio 與 object-fit 即可 */
.jx-logo img{width:auto;height:32px;aspect-ratio:19/4;object-fit:cover}
.jx-header .jx-logo{margin:0 20px 0 calc(var(--jx-hero-inset) - 1px)}   /* 設計稿：Logo 圖形與 Hero 文字左緣對齊，與搜尋框留 52px */

/* 搜尋 */
.jx-search{position:relative;flex:1 1 296px;max-width:296px;min-width:0}
.jx-search__input{width:100%;height:34px;padding:0 12px 0 36px;font-size:var(--jx-fs-xs);color:var(--jx-ink);text-overflow:ellipsis;
  background:#fff;border:1px solid var(--jx-line);border-radius:var(--jx-radius-md);transition:border-color .2s var(--jx-ease),box-shadow .2s var(--jx-ease)}
.jx-search__input::placeholder{color:var(--jx-placeholder);text-overflow:ellipsis}   /* 欄位太窄時以「…」結尾，不會切到半個字 */
/* 聚焦：與其他輸入框相同（金色邊框＋淡金光暈），放大鏡轉金色 */
.jx .jx-search__input:focus,.jx .jx-search__input:focus-visible{border-color:var(--jx-gold);box-shadow:0 0 0 3px rgba(154,106,68,.12);outline:none!important}
.jx-search:focus-within .jx-search__btn{color:var(--jx-gold)}
/* Header 搜尋框為 required（不送出空白搜尋）：未輸入就按搜尋時只顯示瀏覽器提示，不加紅框（Firefox 預設會加紅色光暈）；分開寫：不支援的瀏覽器只略過該條 */
.jx .jx-search__input:user-invalid:not(:focus){box-shadow:none}
.jx .jx-search__input:-moz-ui-invalid:not(:focus){box-shadow:none}
.jx-search__input::-webkit-search-cancel-button{cursor:pointer}
.jx-search__input:placeholder-shown::-webkit-search-cancel-button{display:none}   /* 未輸入時不預留清除鈕空間，窄欄位（1024 寬）提示文字仍完整顯示；輸入後 × 照常出現 */
.jx-search__btn{position:absolute;left:1px;top:1px;bottom:1px;width:34px;display:flex;align-items:center;justify-content:center;color:#555;transition:color .2s}
.jx-search__btn svg{width:15px;height:15px}

/* 主選單 */
.jx-header__inner>nav{margin-left:auto}   /* 靠右的是外層 <nav>（flex 子項），不是內層 ul.jx-nav */
.jx-nav{display:flex;align-items:center;gap:30px}
.jx-nav__item{position:relative}
.jx-nav__link{display:flex;align-items:center;gap:5px;height:var(--jx-header-h);font-size:var(--jx-fs-nav);color:var(--jx-ink);letter-spacing:.04em;white-space:nowrap;transition:color .2s}
.jx-nav__link:hover,.jx-nav__link[aria-current="page"]{color:var(--jx-gold)}
.jx-caret{width:9px;height:9px;flex-shrink:0;max-width:none;transition:transform .25s var(--jx-ease)}   /* 不隨選單擠壓而縮成 0 */
.jx-nav__item:hover .jx-caret,.jx-nav__item:focus-within .jx-caret{transform:rotate(180deg)}

.jx-dropdown{position:absolute;top:calc(100% - 8px);left:50%;min-width:132px;padding:8px 0;background:#fff;border:1px solid var(--jx-line);box-shadow:var(--jx-shadow);
  opacity:0;visibility:hidden;transform:translate(-50%,6px);transition:opacity .2s var(--jx-ease),transform .2s var(--jx-ease),visibility .2s}
.jx-nav__item:hover>.jx-dropdown,.jx-nav__item:focus-within>.jx-dropdown,.jx-lang.is-open>.jx-dropdown{opacity:1;visibility:visible;transform:translate(-50%,0)}
.jx-dropdown a{display:block;padding:8px 20px;font-size:var(--jx-fs-xs);color:var(--jx-text);white-space:nowrap;text-align:center;transition:color .2s,background-color .2s}
.jx-dropdown a:hover,.jx-dropdown a[aria-current="true"]{color:var(--jx-gold);background:var(--jx-bg-cream)}

/* 右側工具 */
.jx-tools{display:flex;align-items:center;gap:26px;flex-shrink:0}
.jx-lang{position:relative}
.jx-lang__btn{display:flex;align-items:center;gap:6px;height:var(--jx-header-h);font-size:var(--jx-fs-nav);color:var(--jx-ink);white-space:nowrap;transition:color .2s}
.jx-lang__btn:hover{color:var(--jx-gold)}
.jx-lang__btn>svg:first-child{width:18px;height:18px}
.jx-lang.is-open .jx-caret{transform:rotate(180deg)}
/* 顯示幣別（外幣參考金額，業主 2026-10-01）：Header 下拉（同語系選單）、手機選單一列按鈕、價格下方的換算金額 */
.jx-currency .jx-dropdown{min-width:176px}
.jx-dropdown button{display:block;width:100%;padding:8px 20px;font-size:var(--jx-fs-xs);color:var(--jx-text);white-space:nowrap;text-align:center;transition:color .2s,background-color .2s}
.jx-dropdown button:hover,.jx-dropdown button[aria-pressed="true"]{color:var(--jx-gold);background:var(--jx-bg-cream)}
.jx-dropdown__note{margin:6px 12px 0;padding:8px 0 2px;border-top:1px solid var(--jx-line);font-size:11px;line-height:1.5;color:var(--jx-muted);text-align:center;white-space:normal}
.jx-drawer__fx{display:flex;flex-wrap:wrap;align-items:center;gap:0 14px;margin-top:8px;font-size:var(--jx-fs-xs);line-height:20px;color:var(--jx-sub)}
.jx-drawer__fx>span{margin-right:2px;color:var(--jx-muted)}
.jx-drawer__fx button{padding:12px 0;color:var(--jx-sub);transition:color .2s}   /* 點擊高度 44px */
.jx-drawer__fx button:hover,.jx-drawer__fx button[aria-pressed="true"]{color:var(--jx-gold)}
.jx-drawer__fx button[aria-pressed="true"]{font-weight:500;text-decoration:underline;text-underline-offset:4px}
.jx-fx{display:block;margin-top:2px;font-family:var(--jx-sans);font-size:14px;font-weight:500;line-height:1.4;letter-spacing:0;color:var(--jx-sub);white-space:nowrap;font-variant-numeric:tabular-nums}   /* 較深的灰、500 字重：海外買家一眼看得到換算 */
.jx-fx[hidden]{display:none}
.jx-deal-card__price .jx-fx{font-weight:400}   /* 最新成交：換算放在價格內，與「N 次出價」維持同一列 */
.jx-fx-note{font-size:12px;line-height:1.6;color:var(--jx-muted)}
.jx-fx-note[hidden]{display:none}
.jx-icon-btn{display:flex;align-items:center;justify-content:center;width:24px;height:24px;color:var(--jx-ink);transition:color .2s}
.jx-icon-btn:hover{color:var(--jx-gold)}
.jx-icon-btn svg{width:20px;height:20px}
.jx-tools .jx-btn{margin-left:-10px}
.jx-menu-toggle{display:none}
.jx-menu-toggle__x{display:none}
.jx-header.is-open .jx-menu-toggle__bars{display:none}   /* 選單開啟時 ☰ 換成 ✕ */
.jx-header.is-open .jx-menu-toggle__x{display:block}

/* 手機選單 */
.jx-drawer{display:none;max-height:calc(100vh - var(--jx-header-h));max-height:calc(100dvh - var(--jx-header-h));overflow-y:auto;overscroll-behavior:contain;
  padding:12px var(--jx-gutter) 24px;background:#fff;border-top:1px solid var(--jx-line)}
.jx-drawer .jx-search{display:block;max-width:none;margin-bottom:8px}
.jx-drawer .jx-search__input{height:40px}   /* 觸控操作，點擊範圍加高 */
.jx-drawer__item{border-bottom:1px solid var(--jx-line)}
.jx-drawer__link{display:block;padding:13px 0;font-size:15px;color:var(--jx-ink);transition:color .2s}
/* 子選單與底部連結：上下各 12px 內距讓點擊範圍達 44px；容器以負邊距抵銷，文字位置與原設計相同 */
.jx-drawer__sub{display:flex;flex-wrap:wrap;gap:0 20px;margin-top:-12px}
.jx-drawer__sub a{padding:12px 0;font-size:var(--jx-fs-xs);line-height:20px;color:var(--jx-sub);transition:color .2s}
.jx-drawer__foot{display:flex;gap:20px;margin-bottom:-12px;padding-top:4px;font-size:var(--jx-fs-xs);line-height:20px;color:var(--jx-sub)}
.jx-drawer__foot a{padding:12px 0;transition:color .2s}
/* 選單開啟時：選單下方的頁面加深色遮罩（只往下延伸，不蓋到 Header 本身）；
   html.jx-menu-open 由 jx.js 加上，同時鎖定頁面捲動（點遮罩關閉選單，不會點到底下的連結） */
.jx-header.is-open .jx-drawer{box-shadow:0 100vh 0 100vh rgba(20,17,14,.4)}
html.jx-menu-open{overflow:hidden}
.jx .jx-drawer:focus{outline:none!important}
.jx-drawer__link:hover,.jx-drawer__link[aria-current="page"],.jx-drawer__sub a:hover,.jx-drawer__foot a:hover,.jx-drawer__foot a[aria-current]{color:var(--jx-gold)}

/* =================================================================
   6. Hero 輪播
   ================================================================= */
.jx-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--jx-line);touch-action:pan-y}
.jx-hero__track{display:grid}
.jx-hero__slide{grid-area:1/1;position:relative;height:var(--jx-hero-h);opacity:0;visibility:hidden;transition:opacity .9s var(--jx-ease),visibility .9s}
.jx-hero__slide.is-active{opacity:1;visibility:visible;z-index:1}

/* 右側主視覺：左緣對齊版寬 32% 處，右側滿版 */
.jx-hero__media{position:absolute;top:0;right:0;bottom:0;left:calc(max(0px, (100% - var(--jx-max)) / 2) + var(--jx-hero-info));background:#ece6de}
.jx-hero__media img{transition:transform 7s linear}
.jx-hero__slide.is-active .jx-hero__media img{transform:scale(1.03)}

.jx-hero__slide>.jx-container{position:relative;height:100%}
.jx-hero__info{display:flex;flex-direction:column;justify-content:center;height:100%;padding-bottom:30px;
  margin-left:var(--jx-hero-inset);width:calc(var(--jx-hero-info) - var(--jx-gutter) - var(--jx-hero-inset) - 40px)}
.jx-hero__kicker{font-size:15px;line-height:1.4;letter-spacing:.12em;color:var(--jx-gold)}
.jx-hero__title{margin-top:14px;font-family:var(--jx-serif);font-size:var(--jx-fs-hero-title);font-weight:600;line-height:1.2;letter-spacing:.06em;color:var(--jx-ink)}
.jx-hero__sub{font-family:var(--jx-serif);font-size:var(--jx-fs-hero-sub);line-height:1.4;letter-spacing:.06em;color:var(--jx-ink)}
.jx-hero__divider{width:36px;height:2px;margin:16px 0 0;background:var(--jx-gold);border:0;color:inherit}
.jx-hero__meta{margin-top:18px;font-size:var(--jx-fs-hero-meta);line-height:1.82;color:var(--jx-ink);font-variant-numeric:tabular-nums}
.jx-hero__meta>div{white-space:nowrap}
.jx-hero__info .jx-btn{align-self:flex-start;margin-top:17px;height:44px;padding:0 42px;font-size:15px}

/* 頁碼與箭頭 */
.jx-hero__controls{position:absolute;left:0;right:0;bottom:27px;z-index:2;pointer-events:none}
.jx-hero__pager{display:flex;align-items:center;gap:16px;margin-left:var(--jx-hero-inset);width:calc(var(--jx-hero-info) - var(--jx-gutter) - var(--jx-hero-inset) - 40px);pointer-events:auto}
.jx-hero__index{font-size:var(--jx-fs-2xs);letter-spacing:.06em;color:var(--jx-sub);font-variant-numeric:tabular-nums}
.jx-hero__progress{position:relative;width:62px;height:2px;background:var(--jx-line);overflow:hidden}
.jx-hero__progress>i{position:absolute;inset:0 auto 0 0;width:33.33%;background:var(--jx-gold);transition:width .5s var(--jx-ease)}
.jx-hero__arrows{display:flex;align-items:center;gap:8px;margin-left:auto}
.jx-hero__arrow{display:flex;align-items:center;justify-content:center;width:28px;height:28px;color:var(--jx-ink);transition:color .2s}
.jx-hero__arrow:hover{color:var(--jx-gold)}
.jx-hero__arrow svg{width:16px;height:16px}
.jx-hero__sep{width:1px;height:16px;background:#9b9b9b}

/* =================================================================
   7. Section 共用
   ================================================================= */
.jx-section{padding-top:var(--jx-section-gap)}
.jx-hero+.jx-section{padding-top:22px}
.jx-section__head{display:flex;align-items:center;gap:56px;margin-bottom:6px}
.jx-section__title{flex-shrink:0;font-family:var(--jx-serif);font-size:var(--jx-fs-section);font-weight:600;line-height:1.3;letter-spacing:.08em;color:var(--jx-ink)}

.jx-tabs{display:flex;gap:36px;min-width:0}
.jx-tab{position:relative;padding:6px 0 7px;font-size:var(--jx-fs-sm);color:var(--jx-sub);letter-spacing:.04em;white-space:nowrap;transition:color .2s}
.jx-tab::after{content:"";position:absolute;left:-7px;right:-7px;bottom:0;height:2px;background:var(--jx-gold);transform:scaleX(0);transition:transform .3s var(--jx-ease)}
.jx-tab:hover,.jx-tab[aria-selected="true"]{color:var(--jx-gold)}
.jx-tab[aria-selected="true"]::after{transform:scaleX(1)}

.jx-more{display:inline-flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0;font-size:var(--jx-fs-xs);color:var(--jx-sub);white-space:nowrap;transition:color .2s}
.jx-more:hover{color:var(--jx-gold)}
.jx-more:hover .jx-arrow{transform:translateX(3px)}

.jx-note{margin-top:13px;font-size:var(--jx-fs-2xs);color:var(--jx-muted);text-align:center}
.jx-empty{padding:56px 0;font-size:var(--jx-fs-sm);color:var(--jx-muted);text-align:center}

/* =================================================================
   8. 拍賣專場卡片
   ================================================================= */
.jx-auction-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.jx-auction-card{display:block}
.jx-auction-card .jx-media{aspect-ratio:207/100;background:var(--jx-bg-dark)}
.jx-auction-card .jx-media::before{color:var(--jx-on-dark-muted)}
.jx-auction-card__tag{margin-top:7px;font-size:var(--jx-fs-2xs);line-height:18px;color:var(--jx-muted);letter-spacing:.04em}
.jx-auction-card__title{margin-top:4px;font-family:var(--jx-serif);font-size:var(--jx-fs-auction-title);font-weight:500;line-height:28px;color:var(--jx-ink);letter-spacing:.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s}
.jx-auction-card__time{display:block;margin-top:6px;font-size:var(--jx-fs-xs);line-height:20px;color:var(--jx-muted);font-variant-numeric:tabular-nums}
.jx-auction-card:hover .jx-media img{transform:scale(1.04)}
.jx-auction-card:hover .jx-auction-card__title{color:var(--jx-gold)}

/* =================================================================
   9. 拍品卡片（精選拍品／即將結標）
   ================================================================= */
.jx-lot-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--jx-grid-gap)}
.jx-lot-card{display:block}
.jx-lot-card .jx-media{aspect-ratio:4/3}
.jx-lot-card__title{margin-top:10px;font-family:var(--jx-serif);font-size:var(--jx-fs-card-title);font-weight:500;line-height:1.42;color:var(--jx-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s}
.jx-lot-card__label{margin-top:5px;font-size:var(--jx-fs-xs);line-height:18px;color:var(--jx-muted)}
.jx-lot-card__price{font-family:var(--jx-serif);font-size:var(--jx-fs-price);font-weight:500;line-height:1.25;color:var(--jx-ink);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.jx-lot-card__stats{display:flex;flex-wrap:wrap;align-items:center;margin-top:4px;font-size:var(--jx-fs-sm);line-height:20px;color:var(--jx-muted);font-variant-numeric:tabular-nums}
.jx-lot-card__stats>span+span::before{content:"";display:inline-block;width:1px;height:12px;margin:0 11px;background:#c9c9c9;vertical-align:-1px}
.jx-lot-card__left{color:var(--jx-gold)}
.jx-lot-card__more{display:inline-flex;align-items:center;gap:10px;margin-top:11px;font-size:var(--jx-fs-sm);line-height:20px;color:var(--jx-gold)}
.jx-lot-card:hover .jx-media img{transform:scale(1.04)}
.jx-lot-card:hover .jx-lot-card__title{color:var(--jx-gold)}
.jx-lot-card:hover .jx-arrow{transform:translateX(3px)}

/* 已結標狀態（倒數歸零時由 JS 自動加上 .is-ended） */
.is-ended .jx-lot-card__left{color:var(--jx-muted)}
.is-ended .jx-media img{filter:grayscale(.3);opacity:.85}
.is-ended .jx-badge--live{display:none}   /* 閃爍的「拍賣中」徽章在結標後隱藏（徽章樣式在 jx-pages.css） */

/* =================================================================
   10. 最新成交
   ================================================================= */
.jx-section--deals{padding-top:56px}
.jx-section--deals .jx-section__head{margin-bottom:16px}
.jx-deal-grid{row-gap:36px}

/* 卡片：整張可點（標題連結的 ::after 覆蓋全卡），「出價紀錄」浮在上層可單獨點擊 */
.jx-deal-card{position:relative;display:flex;flex-direction:column;height:100%}
.jx-deal-card .jx-media{aspect-ratio:4/3}
.jx-deal-card:hover .jx-media img{transform:scale(1.04)}

/* 已成交標籤 */
.jx-deal-card__badge{position:absolute;top:12px;left:12px;z-index:1;padding:4px 10px;
  font-size:12px;font-weight:500;line-height:1.3;letter-spacing:.12em;color:#fff;background:var(--jx-ink);border-radius:var(--jx-radius)}

/* LOT 018 ・ 精品 */
.jx-deal-card__lot{margin-top:14px;font-size:12px;line-height:18px;letter-spacing:.1em;color:var(--jx-muted);font-variant-numeric:tabular-nums}
.jx-deal-card__lot>span::before{content:"";display:inline-block;width:3px;height:3px;margin:0 8px;border-radius:50%;background:var(--jx-gold-soft);vertical-align:middle}

/* 名稱：最多兩行，固定兩行高度讓價格列對齊 */
.jx-deal-card__title{margin-top:4px;min-height:3em;font-family:var(--jx-serif);font-size:17px;font-weight:500;line-height:1.5;color:var(--jx-ink);
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;transition:color .3s}   /* 兩行平均分配（h3 預設 balance），避免第二行只剩一個字 */
.jx-deal-card__link::after{content:"";position:absolute;inset:0;z-index:1}
.jx-deal-card:hover .jx-deal-card__title{color:var(--jx-gold)}
.jx .jx-deal-card__link:focus-visible{outline:none!important}
.jx-deal-card__link:focus-visible::after{outline:2px solid var(--jx-gold);outline-offset:4px}

/* 成交價 ＋ 出價次數 */
.jx-deal-card__row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:10px 0 14px}
.jx-deal-card__price{font-family:var(--jx-serif);font-size:var(--jx-fs-deal-price);font-weight:600;line-height:1.2;letter-spacing:.01em;color:var(--jx-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.jx-deal-card__bids{flex-shrink:0;font-size:13px;color:var(--jx-muted);white-space:nowrap;font-variant-numeric:tabular-nums}

/* 結標時間 ＋ 出價紀錄 */
.jx-deal-card__foot{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:auto;padding-top:10px;border-top:1px solid var(--jx-line);
  font-size:12px;line-height:18px;color:var(--jx-muted)}
.jx-deal-card__ended{font-variant-numeric:tabular-nums}
.jx-deal-card__history{position:relative;z-index:2;flex-shrink:0;color:var(--jx-sub);text-decoration:underline;text-decoration-color:#c8c2bb;text-underline-offset:3px;
  transition:color .2s,text-decoration-color .2s}
.jx-deal-card__history:hover{color:var(--jx-gold);text-decoration-color:var(--jx-gold)}

.jx-section--deals .jx-note{margin-top:36px}

/* =================================================================
   11. 委託服務 Banner
   ================================================================= */
.jx-consign{display:grid;grid-template-columns:58% 42%;min-height:var(--jx-consign-h);margin-top:20px;background:var(--jx-bg-cream)}
.jx-consign .jx-media{height:100%;min-height:var(--jx-consign-h);background:#3a3027}
.jx-consign .jx-media img{position:absolute;inset:0}   /* 不讓圖片原始比例撐高區塊 */
.jx-consign .jx-media::before{color:#9b8a74}
.jx-consign__body{display:flex;flex-direction:column;justify-content:center;padding:22px var(--jx-gutter) 22px 51px}
.jx-consign__title{font-family:var(--jx-serif);font-size:var(--jx-fs-consign);font-weight:600;line-height:1.3;letter-spacing:.1em;color:var(--jx-ink)}
.jx-consign__text{margin-top:4px;font-size:17px;line-height:26px;color:var(--jx-text);letter-spacing:.04em}
.jx-consign__body .jx-btn{align-self:flex-start;margin-top:15px;min-width:157px}

/* =================================================================
   12. Footer
   ================================================================= */
.jx-footer{padding-top:18px;border-top:1px solid var(--jx-line)}
.jx-footer__grid{display:grid;grid-template-columns:1.38fr 2.02fr 1.04fr;gap:24px}
.jx-footer__links--cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,auto);grid-auto-flow:column;column-gap:24px}   /* 2026-10-07：官網原樣，兩欄、由上而下 */
.jx-footer .jx-logo img{height:34px}
.jx-footer__company{margin-top:16px;font-size:var(--jx-fs-xs);color:var(--jx-text)}
.jx-footer__heading{margin-bottom:2px;font-size:var(--jx-fs-xs);font-weight:500;line-height:24px;color:var(--jx-ink)}
.jx-footer__links a{display:inline-block;font-size:var(--jx-fs-xs);line-height:24px;color:#6b6b6b;transition:color .2s}
.jx-footer__links a:hover{color:var(--jx-gold)}
.jx-social{display:flex;align-items:center;gap:28px;margin-top:10px}
.jx-social a{display:block;width:22px;height:22px;color:var(--jx-ink);transition:color .2s,transform .2s}
.jx-social a:hover{color:var(--jx-gold);transform:translateY(-1px)}
.jx-social svg{width:100%;height:100%}
.jx-footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px;padding:10px 0;border-top:1px solid var(--jx-line);
  font-size:var(--jx-fs-2xs);color:var(--jx-muted)}
.jx-footer__legal{display:flex;gap:40px}
.jx-footer__legal a{transition:color .2s}
.jx-footer__legal a:hover{color:var(--jx-gold)}

/* 浮動客服（本身就是 .jx 根元素，所以底線、聚焦框要自己設定）
   ≥1200 為設計稿的方形圖示＋文字；≤1199 縮為 48px 圓形只留圖示（文字隱藏，名稱由 aria-label 提供） */
.jx-cs{position:fixed;right:24px;bottom:72px;z-index:var(--jx-z-cs);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  width:68px;height:64px;font-size:11px;color:var(--jx-sub);text-decoration:none;background:#fff;border:1px solid var(--jx-line);border-radius:8px;box-shadow:0 6px 20px rgba(28,28,28,.08);
  transition:transform .2s var(--jx-ease),color .2s,box-shadow .2s}
.jx-cs:hover{color:var(--jx-gold);text-decoration:none;transform:translateY(-2px);box-shadow:0 10px 24px rgba(28,28,28,.12)}
.jx-cs:focus-visible{outline:2px solid var(--jx-gold)!important;outline-offset:3px}
.jx-cs svg{width:24px;height:24px;color:var(--jx-gold)}
html:has(.jx-contact) .jx-cs{display:none}   /* 聯繫我們頁：頁面第一個管道就是 LINE，不重複顯示（也避免壓到送出按鈕） */
html.jx-modal-open .jx-cs,html.jx-drawer-open .jx-cs,html.jx-menu-open .jx-cs{margin-right:var(--jx-sbw,0px)}   /* 彈出視窗開啟時捲軸消失，jx.js 將捲軸寬度寫入 --jx-sbw，按鈕位置不跳動 */
/* 列表頁（活動總覽、拍品總覽、搜尋）1200–1759（版寬達上限後左右留白要到約 1740 才放得下原尺寸）、會員中心列表頁（總覽、競標、委託、個人資料）≥1200：
   內容延伸到左右留白邊緣，原尺寸（68×64）會蓋住最右欄的拍品卡、待辦按鈕「查看委託」→ 縮為 48px 圓形，整顆收在右側留白內
   （會員中心列表頁＝有 .jx-member，但沒有明細頁的 .jx-detail、委託流程的 .jx-cnew） */
@media (min-width:1200px) and (max-width:1759px){
  html:has(.jx-listing) .jx-cs{right:max(4px, calc(var(--jx-gutter) - 52px));bottom:16px;width:48px;height:48px;gap:0;border-radius:50%}
  html:has(.jx-listing) .jx-cs span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  html:has(.jx-listing) .jx-cs svg{width:22px;height:22px}
}
@media (min-width:1200px){
  html:has(.jx-member):not(:has(.jx-detail,.jx-cnew)) .jx-cs{right:max(4px, calc(var(--jx-gutter) - 52px));bottom:16px;width:48px;height:48px;gap:0;border-radius:50%}
  html:has(.jx-member):not(:has(.jx-detail,.jx-cnew)) .jx-cs span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  html:has(.jx-member):not(:has(.jx-detail,.jx-cnew)) .jx-cs svg{width:22px;height:22px}
}

/* =================================================================
   13. RWD
   ================================================================= */

/* 1024–1199：等比收窄 */
@media (max-width:1199px){
  .jx{
    --jx-gutter:32px;
    --jx-fs-hero-title:50px;
    --jx-fs-section:32px;
    --jx-fs-card-title:17px;
    --jx-fs-auction-title:18px;
    --jx-fs-price:22px;
    --jx-fs-deal-price:21px;
    --jx-grid-gap:16px;
    --jx-hero-h:380px;
  }
  .jx-header__inner{gap:20px}
  .jx-header .jx-logo{margin-right:0}   /* 版面較窄，空間讓給搜尋框（1024 寬時提示文字仍完整顯示） */
  .jx-nav{gap:22px}
  .jx-tools{gap:20px}
  .jx-tools .jx-btn{margin-left:-6px}
  .jx-hero__sub{font-size:21px}
  .jx-hero__meta{font-size:15px}
  .jx-section__head{gap:40px}
  .jx-auction-grid{gap:18px}
  /* 浮動客服縮為 48px 圓形貼角：1199 以下左右留白只有 32px，原尺寸會壓到內容右側的按鈕 */
  .jx-cs{right:12px;bottom:16px;width:48px;height:48px;gap:0;border-radius:50%}
  .jx-cs span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .jx-cs svg{width:22px;height:22px}
  .jx-footer{padding-bottom:72px}   /* 捲到頁尾時，最後一列（使用條款、隱私保護）留在浮動客服上方 */
  html:has(.jx-contact) .jx-footer,html:has(.jx-bidpage) .jx-footer{padding-bottom:0}   /* 聯繫我們頁、拍品競標頁（1439 以下）不顯示浮動客服，頁尾不用預留空間 */
}

/* 1024–1199：Hero 文字欄較窄，副標縮小避免單字落行，並讓按鈕與頁碼保持距離 */
@media (min-width:1024px) and (max-width:1199px){
  .jx-hero__sub{font-size:19px;letter-spacing:.04em}
  .jx-hero__info{padding-bottom:64px}
}

/* 768–1023：平板，主選單收合 */
@media (max-width:1023px){
  .jx{
    --jx-header-h:60px;
    --jx-fs-hero-title:40px;
    --jx-fs-section:28px;
    --jx-fs-consign:30px;
    --jx-fs-card-title:16px;
    --jx-fs-auction-title:16px;
    --jx-fs-price:20px;
    --jx-fs-deal-price:19px;
    --jx-fs-sm:13px;
    --jx-hero-h:340px;
    --jx-hero-info:40vw;
    --jx-section-gap:36px;
  }
  .jx-header__inner>nav,.jx-tools>.jx-lang{display:none}   /* 連外層 nav 一起隱藏，避免兩個 margin-left:auto 平分空間 */
  .jx-menu-toggle{display:flex}
  .jx-tools{margin-left:auto;gap:18px}
  .jx-tools .jx-btn{margin-left:0}
  .jx-header.is-open .jx-drawer{display:block}
  .jx-hero__kicker{font-size:13px}
  .jx-hero__sub{font-size:18px}
  .jx-hero__meta{font-size:14px;margin-top:14px}
  .jx-hero__info .jx-btn{height:40px;padding:0 30px;font-size:14px}
  .jx-hero__controls{bottom:20px}
  .jx-section__head{gap:32px}
  .jx-tabs{gap:26px}
  .jx-auction-grid{gap:14px}
  .jx-deal-card__title{font-size:15px}
  /* 最新成交：卡片變窄，成交價與出價次數、結標時間與出價紀錄改為上下排 */
  .jx-deal-card__row{flex-direction:column;align-items:flex-start;gap:2px;margin:8px 0 12px}
  .jx-deal-card__foot{flex-direction:column;align-items:flex-start;gap:2px}
  .jx-deal-card__ended{white-space:nowrap}
  .jx-consign{grid-template-columns:50% 50%}
  .jx-consign__body{padding-left:36px}
  .jx-consign__text{font-size:15px;line-height:24px}
}

/* 768–1023：平板 Header 仍有空間放搜尋框（一次點擊就能搜尋），選單內的搜尋框不重複顯示；手機（< 768）搜尋框只在選單內
   768–1023：首頁卡片欄寬較窄 */
@media (min-width:768px) and (max-width:1023px){
  .jx-drawer .jx-search{display:none}
  .jx-auction-card__title{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;line-height:24px;min-height:48px}   /* 專場名稱最多兩行，不截斷重點 */
  .jx-section .jx-lot-card__stats{flex-direction:column;align-items:flex-start;line-height:18px}   /* 出價數與剩餘時間上下排，位數變多也不會單張換行 */
  .jx-section .jx-lot-card__stats>span+span::before{display:none}
}

/* < 768：手機 */
@media (max-width:767px){
  .jx{
    --jx-gutter:16px;
    --jx-header-h:56px;
    --jx-hero-inset:0px;
    --jx-fs-hero-title:34px;
    --jx-fs-section:24px;
    --jx-fs-consign:24px;
    --jx-fs-card-title:15px;
    --jx-fs-auction-title:17px;
    --jx-fs-price:18px;
    --jx-fs-deal-price:17px;
    --jx-fs-sm:13px;           /* 多行內文（說明段落、待辦、狀態文字、表單標籤）不小於 13px；與平板相同 */
    --jx-fs-xs:13px;           /* 業主 2026-10-04（手機版選擇題）：手機小字放大一級（原 12px；同桌機） */
    --jx-fs-2xs:12px;          /* 同上（原 11px） */
    --jx-muted:#666;           /* 同上：手機的灰色說明字加深（原 #767676；米色底上對比也達 4.5:1） */
    --jx-sub:#555;             /* 同上（原 #5c5c5c） */
    --jx-grid-gap:12px;
    --jx-section-gap:32px;
  }
  .jx-header__inner{gap:12px}
  .jx-header__inner>.jx-search{display:none}   /* 手機：搜尋框只在選單內 */
  .jx-logo img{height:28px}
  .jx-search__input{font-size:16px}   /* iOS：輸入框字級小於 16px 時，點擊會自動放大畫面 */
  .jx-tools{gap:14px}
  .jx-tools .jx-btn{height:32px;padding:0 12px;font-size:12px;letter-spacing:.06em}
  .jx-icon-btn{position:relative}
  .jx-icon-btn::after{content:"";position:absolute;inset:-10px}   /* 點擊範圍擴大為 44×44，圖示大小與位置不變 */

  /* Hero：圖上文下 */
  .jx-hero__slide{height:auto;display:flex;flex-direction:column}
  .jx-hero__media{position:relative;left:auto;height:auto;aspect-ratio:16/10}
  .jx-hero__slide>.jx-container{height:auto;padding-top:20px}
  .jx-hero__info{width:auto;height:auto;padding-bottom:64px}
  .jx-hero__title{margin-top:8px}
  .jx-hero__sub{font-size:16px}
  .jx-hero__divider{margin-top:12px}
  .jx-hero__meta{margin-top:10px;font-size:14px;line-height:1.75}
  .jx-hero__info .jx-btn{margin-top:14px}
  .jx-hero__pager{width:auto}
  .jx-hero__arrow{position:relative}
  .jx-hero__arrow::after{content:"";position:absolute;inset:-8px}   /* 點擊範圍擴大為 44×44，箭頭大小與位置不變 */

  /* 「查看全部」「查看成交紀錄」：上下內距加大點擊範圍（約 44px），負邊距抵銷，排版不變 */
  .jx-more{padding:12px 0;margin-top:-12px;margin-bottom:-12px;line-height:20px}

  /* 區塊標題：頁籤換到第二行，可橫向滑動 */
  .jx-section__head{flex-wrap:wrap;gap:4px 16px;margin-bottom:10px}
  .jx-section__head .jx-tabs{order:3;width:calc(100% + var(--jx-gutter) * 2);margin:0 calc(var(--jx-gutter) * -1);padding:0 var(--jx-gutter);gap:26px;
    overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .jx-section__head .jx-tabs::-webkit-scrollbar{display:none}
  .jx-section__head .jx-tab{padding:16px 0 8px;line-height:20px}   /* 高 44px（觸控）：上方加高（文字與底線距離不變）；不用負邊距往上抵銷，以免與上一列「查看全部」的點擊範圍重疊 */
  .jx-section__head .jx-tab::after{left:0;right:0}   /* 底線與文字等寬，第一個頁籤對齊內容左緣 */
  /* 橫向捲動容器內的聚焦框改畫在內側，避免被裁掉 */
  .jx .jx-section__head .jx-tab:focus-visible,.jx .jx-auction-grid .jx-auction-card:focus-visible{outline-offset:-2px}

  /* 拍賣專場：橫向滑動 */
  .jx-auction-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:84%;gap:12px;
    margin:0 calc(var(--jx-gutter) * -1);padding:0 var(--jx-gutter);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--jx-gutter);scrollbar-width:none}
  .jx-auction-grid::-webkit-scrollbar{display:none}
  .jx-auction-grid>*{scroll-snap-align:start}
  .jx-auction-card__title{line-height:24px}

  /* 拍品：兩欄 */
  .jx-lot-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:24px}
  .jx-lot-card__title{margin-top:8px}
  .jx-lot-card__stats{flex-direction:column;align-items:flex-start;line-height:18px}
  .jx-lot-card__stats>span+span::before{display:none}
  .jx-lot-card__more{margin-top:6px}
  .jx-section--deals{padding-top:40px}
  .jx-deal-grid{row-gap:28px}
  .jx-deal-card__badge{top:8px;left:8px;padding:2px 6px;font-size:11px;letter-spacing:.04em}   /* 與 .jx-badge--xs 相同 */
  .jx-deal-card__lot{margin-top:10px;font-size:11px;letter-spacing:.06em}
  .jx-deal-card__lot>span::before{margin:0 6px}
  .jx-deal-card__title{font-size:14px}
  .jx-deal-card__row{margin:6px 0 10px}
  .jx-deal-card__bids{font-size:11px}
  .jx-deal-card__foot{padding-top:8px;font-size:11px}
  .jx-deal-card__history::after{content:"";position:absolute;inset:-13px -8px}   /* 「出價紀錄」點擊範圍擴大為約 44px 高（浮在整卡連結之上），文字位置不變 */
  .jx-section--deals .jx-note{margin-top:24px}

  /* 委託 */
  .jx-consign{grid-template-columns:1fr;margin-top:24px}
  .jx-consign .jx-media{min-height:0;aspect-ratio:16/9}
  .jx-consign .jx-media img{position:relative}
  .jx-consign__body{padding:24px var(--jx-gutter) 28px}
  .jx-consign__text{font-size:14px;line-height:22px}

  /* Footer */
  .jx-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
  .jx-footer__grid>:first-child,.jx-footer__nav,.jx-footer__follow{grid-column:1/-1}
  .jx-footer__legal{gap:20px}
  /* 觸控：連結上下加內距，點擊範圍約 44px（清單以負邊距抵銷，第一個連結與標題的距離不變）；社群圖示以 ::after 擴大為 44×44 */
  .jx-footer__links{margin-top:-10px}
  .jx-footer__links a{padding:10px 0}
  .jx-footer__legal{margin:-12px 0}
  .jx-footer__legal a{padding:12px 0}
  .jx-social a{position:relative}
  .jx-social a::after{content:"";position:absolute;inset:-11px}

  .jx-footer__legal a{line-height:20px}
  /* 會員中心列表頁：手機保留浮動客服（列表頁沒有其他「聯繫客服」按鈕）；捲動時可能短暫蓋住卡片右側，屬浮動按鈕的正常行為 */
}

/* < 400：小尺寸手機（會員入口移至選單內） */
@media (max-width:399px){
  .jx-tools{gap:12px}
  .jx-tools>.jx-icon-btn:not(.jx-menu-toggle){display:none}
  .jx-tools .jx-btn{padding:0 10px}
}

/* 提示訊息（JX.toast）：畫面下方置中，約 3 秒後淡出；手機避開底部安全區域 */
/* width:max-content（2.3.1）：left:50% 時寬度原本只有半個畫面，手機上十幾個字就換行 */
.jx-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));z-index:2147483000;width:max-content;max-width:calc(100vw - 32px);padding:12px 20px;font-size:15px;line-height:1.5;color:#fff;text-align:center;background:var(--jx-ink);border-radius:var(--jx-radius-md);box-shadow:0 6px 24px rgba(0,0,0,.18);opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .25s var(--jx-ease),transform .25s var(--jx-ease),visibility 0s .25s;pointer-events:none}
.jx-toast.is-show{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .25s var(--jx-ease),transform .25s var(--jx-ease)}

/* 減少動態效果（系統設定）：動畫只跑一次即停止（不重複閃動），直播／進行中的呼吸燈直接關閉 */
@media (prefers-reduced-motion:reduce){
  .jx,.jx *,.jx *::before,.jx *::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  .jx .jx-badge--live::before,.jx .jx-state--live::before,.jx .jx-status--green::before,.jx .jx-player__live::before{animation:none}
  .jx-hero__slide.is-active .jx-hero__media img{transform:none}
}

/* 2.3.2（2026-10-04 手機版操作檢查）：手機上的小按鈕，點擊範圍加大到約 44px 高；外觀與位置不變（透明的 ::after／::before） */
@media (max-width:767px){
  .jx-header .jx-logo{position:relative}
  .jx-header .jx-logo::after{content:"";position:absolute;inset:-8px 0}   /* Logo 圖 28px → 點擊 44px */
  .jx-tools .jx-btn{position:relative}
  .jx-tools .jx-btn::after{content:"";position:absolute;inset:-6px 0}   /* Header「立即委託」32px → 44px */
  :where(.jx-btn--sm){position:relative}   /* :where 不加權重：本來就有定位設定的按鈕維持原設定 */
  .jx-btn--sm{height:40px}   /* 業主 2026-10-04（手機版選擇題）：小按鈕外觀 34 → 40px（Header「立即委託」另有規則，維持 32px） */
  .jx-btn--sm::after{content:"";position:absolute;inset:-2px 0}   /* 點擊高度 44px（上下相鄰的按鈕間距 4px 以上，不會互相蓋到） */
  .jx-section__head .jx-tab::before{content:"";position:absolute;inset:0 -10px}   /* 首頁頁籤（「全部」只有兩個字寬）：左右各加 10px，頁籤間距 26px 不重疊 */
}

/* 2.3.2（業主 2026-10-04 手機版選擇題）：倒數剩不到 1 小時（jx.js 加 .is-soon）改粗體、不變色（同延長中不變色的決定）；全部寬度適用 */
.jx-lot-card__left:has(.is-soon){font-weight:700}   /* 拍品卡片「剩餘 00:28:10」 */