/* ═══════════════════════════════════════════════════════════════════════
   HUB6 · 私人銀行夜金 共用外觀 yejin.css v1.0（rex/hub 系列頁用）
   用法：<html class="kit"> ＋ 在 hub.css 之後連 <link rel="stylesheet" href="/assets/kit/yejin.css">
         ＋ <meta name="rex-theme" content="native">（放在 rex-theme-boot 之前）
         ＋ 檔尾連 /assets/kit/yejin.js
   所有規則限定在 html.kit 底下，沒加 class 的頁完全不受影響。
   深色＝html[data-rex-theme="dark"].kit（深藍 #06121b，不是棕或黑灰）。
   覆寫 hub.css 的 token，也直接重畫共用元件，所以 hub 系列頁多連這支就有夜金。
   元件：.kit-hero(.hero) .kit-hero-art .kit-kick .kit-tabs/.kit-tab .kit-result .kit-stat
         .kit-btn(.gold/.ghost/.sm/.block) .kit-card .kit-chip .kit-note .kit-grid .kit-fold .kit-num
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. token（淺色）── */
html.kit{
  --k-navy:#0a2334; --k-navy2:#0d2a3a; --k-navy3:#12384f; --k-deep:#061726;
  --k-gold:#E8A020; --k-gold-hi:#f5c453; --k-gold-ink:#8a5a06; --k-on-gold:#2a1d00;
  --k-paper:#f6f1e6; --k-card:#fffdf8; --k-card2:#f8f3e7; --k-card3:#efe8d8;
  --k-line:#e6dcc6; --k-line2:#efe7d4; --k-field:#ffffff; --k-field-line:#d9cfb8;
  --k-text:#1b2733; --k-muted:#566373; --k-soft:#6f7b88; --k-hd:#0a2334;
  --k-ok:#0B8A78; --k-ok-bg:#e1f3ee; --k-ok-ink:#0a6b5d;
  --k-err:#C8423A; --k-err-bg:#fdebe8; --k-err-ink:#a8322b;
  --k-warn-bg:#fcf1d6; --k-warn-ink:#7a4a05;
  --k-zebra:#faf6ec; --k-hover:#f3ead2;
  --k-serif:'Noto Serif TC','Source Han Serif TC','PMingLiU',serif;
  --k-sans:'Noto Sans TC',-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
  --k-shadow:0 14px 34px -24px rgba(10,35,52,.55),0 2px 6px -3px rgba(10,35,52,.12);
  --k-shadow-lg:0 26px 56px -30px rgba(10,35,52,.65);
  --k-r:16px; --k-r-sm:12px;
  /* hub.css token 對應 */
  --navy:#0a2334; --navy-mid:#0a2334; --navy-soft:#12384f;
  --gold:#E8A020; --gold-light:#fbf3dd;
  --orange:#E8A020; --orange-dark:#a86e08; --orange-light:#fbf0d6;
  --teal:#0B7A6A; --teal-dark:#0a4f45; --teal-light:#e1f1ec;
  --acc:#c98a14;
  --light:#f6f1e6; --white:#fffdf8;
  --ink:#1b2733; --ink-soft:#566373; --ink-mute:#6f7b88;
  --border-soft:#e6dcc6; --line:#e6dcc6;
  --ok:#0B8A78; --bad:#C8423A; --info:#0b5d86;
  --shadow:0 14px 34px -24px rgba(10,35,52,.55),0 2px 6px -3px rgba(10,35,52,.12);
  --shadow-lg:0 26px 56px -30px rgba(10,35,52,.65);
  --r:16px; --r-sm:12px;
}
/* ── 2. token（深色）：深藍夜空＋金 ── */
html[data-rex-theme="dark"].kit{
  --k-paper:#06121b; --k-card:#0c2030; --k-card2:#0a1b29; --k-card3:#112b3f;
  --k-line:rgba(232,160,32,.26); --k-line2:rgba(255,255,255,.09); --k-field:#071826; --k-field-line:rgba(255,255,255,.2);
  --k-text:#e9eef3; --k-muted:#aebccb; --k-soft:#93a5b6; --k-hd:#f3e7c6;
  --k-gold:#f0b545; --k-gold-hi:#ffd77a; --k-gold-ink:#f0b94a; --k-on-gold:#1f1600;
  --k-ok:#5fd3b8; --k-ok-bg:rgba(29,158,117,.18); --k-ok-ink:#7fe0c8;
  --k-err:#ff9a92; --k-err-bg:rgba(239,68,68,.16); --k-err-ink:#ffb3ad;
  --k-warn-bg:rgba(250,204,21,.12); --k-warn-ink:#fcd34d;
  --k-zebra:rgba(255,255,255,.03); --k-hover:rgba(232,160,32,.10);
  --k-shadow:0 18px 40px -26px rgba(0,0,0,.85);
  --k-shadow-lg:0 26px 56px -28px rgba(0,0,0,.9);
  /* hub token：--navy 在深色當「標題字色」用，所以變奶油金；要當底色的地方元件另外用 --k-* */
  --navy:#f3e7c6; --navy-mid:#0a2334; --navy-soft:#12384f;
  --gold:#f0b545; --gold-light:rgba(240,181,69,.12);
  --orange:#f0b545; --orange-dark:#f0b545; --orange-light:rgba(240,181,69,.14);
  --teal:#5fd3b8; --teal-dark:#7fe0c8; --teal-light:rgba(29,158,117,.18);
  --acc:#f0b545;
  --light:#06121b; --white:#0c2030;
  --ink:#e9eef3; --ink-soft:#aebccb; --ink-mute:#93a5b6;
  --border-soft:rgba(232,160,32,.26); --line:rgba(232,160,32,.26);
  --ok:#5fd3b8; --bad:#ff9a92; --info:#7dd3fc;
  --shadow:0 18px 40px -26px rgba(0,0,0,.85);
  --shadow-lg:0 26px 56px -28px rgba(0,0,0,.9);
  color-scheme:dark;
}

/* ── 3. 基礎 ── */
html.kit{scrollbar-color:rgba(232,160,32,.45) transparent}
html.kit body{
  font-family:var(--k-sans);color:var(--k-text);font-size:15.5px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(1100px 420px at 85% -120px,rgba(232,160,32,.10),transparent 70%),
    var(--k-paper);
  background-repeat:no-repeat;background-attachment:scroll;
}
html[data-rex-theme="dark"].kit body{
  background:
    radial-gradient(1100px 460px at 85% -140px,rgba(232,160,32,.10),transparent 70%),
    radial-gradient(900px 500px at 0% 0%,rgba(18,56,79,.45),transparent 70%),
    var(--k-paper);
  background-repeat:no-repeat;
}
html.kit ::selection{background:rgba(232,160,32,.35)}
html.kit a{color:var(--teal)}
html.kit .wrap{max-width:1060px;padding:1.3rem 1.1rem 4.5rem}
html.kit .tc,html.kit .tnum,html.kit .kit-num{font-variant-numeric:tabular-nums}
html.kit input,html.kit select,html.kit textarea,html.kit button{font-family:inherit}
html.kit :focus-visible{outline:2px solid var(--k-gold);outline-offset:2px}
html.kit .muted{color:var(--k-soft)}
html.kit .hr{background:var(--k-line)}
html.kit footer.hub-foot{color:var(--k-soft);padding:2.2rem 1rem 1.6rem}
@media (prefers-reduced-motion:reduce){html.kit *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ── 4. 頂欄 .hub-top：深藍細帶＋底部金線 ── */
html.kit .hub-top{
  background:linear-gradient(180deg,var(--k-deep),var(--k-navy));
  box-shadow:0 10px 26px -18px rgba(0,0,0,.7);
  border-bottom:1px solid rgba(232,160,32,.55);
  padding:.55rem 1rem;min-height:52px;color:#f3e7c6;
}
html.kit .hub-top .back{
  background:rgba(255,255,255,.08);border:1px solid rgba(232,160,32,.38);color:#f6e7c1;
  min-height:36px;padding:.3rem .85rem;font-weight:700;letter-spacing:.04em;
}
html.kit .hub-top .back:hover{background:rgba(232,160,32,.18);opacity:1}
html.kit .hub-top .t{font-family:var(--k-serif);font-weight:700;font-size:1.02rem;letter-spacing:.06em;color:#f6e7c1}
html.kit .hub-top .tag{background:transparent;color:var(--k-gold-hi);border:1px solid rgba(232,160,32,.6);
  font-weight:700;letter-spacing:.12em;padding:.12rem .6rem}

/* ── 5. 頁首橫幅 .kit-hero（舊 .hero 同步套用）── */
html.kit .hero,html.kit .kit-hero{
  position:relative;overflow:hidden;isolation:isolate;color:#f3ecd9;
  border-radius:20px;padding:1.9rem 1.7rem 1.7rem;margin-bottom:1.3rem;
  border:1px solid rgba(232,160,32,.38);
  background:
    linear-gradient(115deg,transparent 0 62%,rgba(232,160,32,.10) 62.2%,transparent 62.4%),
    repeating-linear-gradient(135deg,rgba(232,160,32,.07) 0 1px,transparent 1px 22px),
    radial-gradient(420px 260px at 92% 8%,rgba(232,160,32,.22),transparent 70%),
    linear-gradient(135deg,var(--k-deep) 0%,var(--k-navy) 48%,var(--k-navy3) 100%);
  box-shadow:var(--k-shadow-lg);
}
html.kit .hero:before,html.kit .kit-hero:before{
  content:"";position:absolute;left:0;right:0;bottom:0;top:auto;width:auto;height:2px;border-radius:0;
  background:linear-gradient(90deg,transparent,var(--k-gold) 20%,var(--k-gold-hi) 50%,var(--k-gold) 80%,transparent);
  opacity:.9;z-index:2;
}
html.kit .hero:after,html.kit .kit-hero:after{
  content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;
  border:1px solid rgba(232,160,32,.22);box-shadow:0 0 0 26px rgba(232,160,32,.04),0 0 0 27px rgba(232,160,32,.12);
  z-index:-1;pointer-events:none;
}
html.kit .hero>*,html.kit .kit-hero>*{position:relative;z-index:1}
html.kit .kit-kick,html.kit .hero .kit-kick,html.kit .kit-hero .kit-kick{
  display:inline-flex;align-items:center;gap:.7rem;font-size:.72rem;font-weight:800;letter-spacing:.32em;
  color:var(--k-gold-hi);margin-bottom:.55rem;text-transform:uppercase;
}
html.kit .kit-kick:before{content:"";width:26px;height:1px;background:var(--k-gold)}
html.kit .hero h1,html.kit .kit-hero h1{
  font-family:var(--k-serif);font-weight:900;font-size:clamp(1.55rem,4.6vw,2.1rem);line-height:1.25;
  letter-spacing:.05em;color:#fff7e3;max-width:calc(100% - 120px);text-shadow:0 2px 18px rgba(0,0,0,.35);
}
html.kit .hero p,html.kit .kit-hero p{font-size:.92rem;line-height:1.85;color:#d6dee6;opacity:1;margin-top:.7rem;max-width:620px}
html.kit .hero .chips,html.kit .kit-hero .chips{gap:8px;margin-top:1.05rem}
html.kit .hero .chip,html.kit .kit-hero .chip{
  font-size:.74rem;font-weight:700;letter-spacing:.06em;color:#f6e7c1;
  background:rgba(232,160,32,.10);border:1px solid rgba(232,160,32,.4);padding:.28rem .75rem;
}
html.kit .kit-hero-art{
  position:absolute;right:1.4rem;top:50%;transform:translateY(-50%);z-index:1;
  width:112px;height:112px;display:flex;align-items:center;justify-content:center;
  font-size:4.6rem;line-height:1;pointer-events:none;user-select:none;
  filter:drop-shadow(0 8px 22px rgba(0,0,0,.45));
}
html.kit .kit-hero-art img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}
html.kit .kit-hero-art.art-fail img{display:none}
@media (max-width:640px){
  html.kit .hero,html.kit .kit-hero{padding:1.35rem 1.15rem 1.25rem;border-radius:18px}
  html.kit .kit-hero-art{width:68px;height:68px;font-size:2.8rem;right:.9rem;top:1.1rem;transform:none}
  html.kit .hero h1,html.kit .kit-hero h1{max-width:calc(100% - 76px)}
  html.kit .hero p,html.kit .kit-hero p{font-size:.86rem;line-height:1.75}
}
@media (max-width:360px){html.kit .kit-hero-art{display:none}html.kit .hero h1,html.kit .kit-hero h1{max-width:100%}}

/* ── 6. 卡片 ── */
html.kit .card,html.kit .kit-card{
  background:var(--k-card);border:1px solid var(--k-line);border-radius:var(--k-r);
  padding:1.3rem 1.25rem;box-shadow:var(--k-shadow);margin-bottom:1.1rem;color:var(--k-text);
}
html.kit .card h2,html.kit .kit-card h2{
  font-family:var(--k-serif);font-size:1.12rem;font-weight:700;letter-spacing:.05em;color:var(--k-hd);
  margin-bottom:.8rem;display:flex;align-items:center;gap:.5rem;
}
html.kit .card h2:before,html.kit .kit-card h2:before{content:"";width:4px;height:1.15em;border-radius:2px;background:linear-gradient(180deg,var(--k-gold-hi),var(--k-gold));flex:none}
html.kit .card h3,html.kit .kit-card h3{font-size:.93rem;font-weight:800;color:var(--k-gold-ink);margin:1rem 0 .45rem;letter-spacing:.04em}
html.kit .card .sub,html.kit .kit-card .sub{color:var(--k-muted);font-size:.84rem;line-height:1.8;margin-bottom:.85rem}
html.kit .card p{color:var(--k-text)}

/* ── 7. 表單 ── */
html.kit .field label{color:var(--k-muted);font-size:.8rem;font-weight:700;letter-spacing:.04em}
html.kit .field input,html.kit .field select,html.kit .field textarea{
  background:var(--k-field);color:var(--k-text);border:1.5px solid var(--k-field-line);border-radius:var(--k-r-sm);
  min-height:46px;padding:.6rem .85rem;font-size:1rem;font-variant-numeric:tabular-nums;
  transition:border-color .15s,box-shadow .15s;
}
html.kit .field input:focus,html.kit .field select:focus,html.kit .field textarea:focus{
  border-color:var(--k-gold);box-shadow:0 0 0 3px rgba(232,160,32,.22);outline:none;
}
html.kit .field .unit{color:var(--k-soft)}
html.kit .field input::placeholder,html.kit .field textarea::placeholder{color:var(--k-soft);opacity:.7}
html.kit input[type=range]{accent-color:var(--k-gold)}
html.kit input[type=checkbox],html.kit input[type=radio]{accent-color:var(--k-gold)}

/* ── 8. 按鈕：.btn / .kit-btn ── */
html.kit .btn,html.kit .kit-btn{
  min-height:44px;border-radius:12px;font-weight:800;letter-spacing:.06em;font-size:.95rem;
  background:var(--k-navy);color:#f6e7c1;border:1.5px solid var(--k-navy);
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;cursor:pointer;padding:.65rem 1.3rem;
  transition:transform .15s,box-shadow .15s,filter .15s,background .15s;
}
html.kit .btn:hover,html.kit .kit-btn:hover{filter:brightness(1.12);transform:translateY(-1px);opacity:1}
html.kit .btn:active,html.kit .kit-btn:active{transform:none}
html.kit .btn.primary,html.kit .btn.gold,html.kit .kit-btn.gold{
  background:linear-gradient(180deg,var(--k-gold-hi),var(--k-gold));color:var(--k-on-gold);border-color:#c98a14;
  box-shadow:0 10px 22px -12px rgba(232,160,32,.9),inset 0 1px 0 rgba(255,255,255,.45);
}
html.kit .btn.ghost,html.kit .kit-btn.ghost{background:transparent;color:var(--k-navy);border:1.5px solid var(--k-navy)}
html.kit .btn.ghost:hover,html.kit .kit-btn.ghost:hover{background:rgba(10,35,52,.06);filter:none}
html.kit .btn.sm,html.kit .kit-btn.sm{padding:.42rem .95rem;font-size:.82rem;min-height:44px}
html.kit .btn.block,html.kit .kit-btn.block{width:100%}
html.kit .btn:disabled,html.kit .kit-btn:disabled,html.kit .btn[disabled]{opacity:.45;cursor:not-allowed;transform:none;filter:none}
html[data-rex-theme="dark"].kit .btn,html[data-rex-theme="dark"].kit .kit-btn{background:var(--k-navy3);color:var(--k-gold-hi);border-color:rgba(232,160,32,.55)}
html[data-rex-theme="dark"].kit .btn.primary,html[data-rex-theme="dark"].kit .btn.gold,html[data-rex-theme="dark"].kit .kit-btn.gold{
  background:linear-gradient(180deg,var(--k-gold-hi),var(--k-gold));color:var(--k-on-gold);border-color:#c98a14}
html[data-rex-theme="dark"].kit .btn.ghost,html[data-rex-theme="dark"].kit .kit-btn.ghost{background:transparent;color:var(--k-gold-hi);border-color:rgba(232,160,32,.55)}
html[data-rex-theme="dark"].kit .btn.ghost:hover,html[data-rex-theme="dark"].kit .kit-btn.ghost:hover{background:rgba(232,160,32,.12)}

/* ── 9. 分頁籤（膠囊）── */
html.kit .tabs,html.kit .kit-tabs{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:1.1rem}
html.kit .tab,html.kit .kit-tab{
  min-height:44px;display:inline-flex;align-items:center;padding:.5rem 1.1rem;border-radius:999px;
  font-size:.88rem;font-weight:700;letter-spacing:.05em;cursor:pointer;user-select:none;
  background:var(--k-card);border:1.5px solid var(--k-line);color:var(--k-muted);transition:.15s;
}
html.kit .tab:hover,html.kit .kit-tab:hover{border-color:var(--k-gold);color:var(--k-hd)}
html.kit .tab.on,html.kit .kit-tab.on,html.kit .kit-tab[aria-selected="true"]{
  background:var(--k-navy);border-color:var(--k-gold);color:var(--k-gold-hi);
  box-shadow:0 8px 18px -12px rgba(10,35,52,.9),inset 0 0 0 1px rgba(232,160,32,.25);
}
html[data-rex-theme="dark"].kit .tab.on,html[data-rex-theme="dark"].kit .kit-tab.on,html[data-rex-theme="dark"].kit .kit-tab[aria-selected="true"]{
  background:linear-gradient(180deg,var(--k-gold-hi),var(--k-gold));color:var(--k-on-gold);border-color:var(--k-gold)}
html.kit .cat-chip{background:var(--k-card);border-color:var(--k-line);color:var(--k-muted);min-height:40px}
html.kit .cat-chip.on{background:var(--k-navy);border-color:var(--k-gold);color:var(--k-gold-hi)}
html[data-rex-theme="dark"].kit .cat-chip.on{background:var(--k-gold);color:var(--k-on-gold)}
/* 選項膠囊（chip-sel / kit-chip）*/
html.kit .chip-sel,html.kit .kit-chip{
  min-height:44px;display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .95rem;border-radius:999px;
  background:var(--k-field);border:1.5px solid var(--k-field-line);color:var(--k-muted);font-weight:700;cursor:pointer;
  user-select:none;transition:.13s;
}
html.kit .chip-sel:hover,html.kit .kit-chip:hover{border-color:var(--k-gold);color:var(--k-hd)}
html.kit .chip-sel[class*="on-"],html.kit .kit-chip.on{
  background:var(--k-navy);border-color:var(--k-gold);color:var(--k-gold-hi);box-shadow:inset 0 0 0 1px rgba(232,160,32,.25)}
html[data-rex-theme="dark"].kit .chip-sel[class*="on-"],html[data-rex-theme="dark"].kit .kit-chip.on{
  background:rgba(232,160,32,.18);color:var(--k-gold-hi);border-color:var(--k-gold)}

/* ── 10. 表格 ── */
html.kit .tbl-wrap{border:1px solid var(--k-line);border-radius:var(--k-r-sm);background:var(--k-card)}
html.kit table.tbl{background:var(--k-card);font-variant-numeric:tabular-nums}
html.kit .tbl th{background:var(--k-navy);color:#f6e7c1;font-weight:700;letter-spacing:.06em;border-bottom:2px solid var(--k-gold)}
html[data-rex-theme="dark"].kit .tbl th{background:var(--k-card3);color:var(--k-gold-hi)}
html.kit .tbl td{color:var(--k-text);border-bottom:1px solid var(--k-line2);background:transparent}
html.kit .tbl tr:nth-child(even) td{background:var(--k-zebra)}
html.kit .tbl tr:hover td{background:var(--k-hover)}
html.kit .tbl .pos{color:var(--k-ok-ink)}
html.kit .tbl .neg{color:var(--k-err-ink)}

/* ── 11. 徽章／提示 ── */
html.kit .badge.teal{background:var(--k-ok-bg);color:var(--k-ok-ink)}
html.kit .badge.orange,html.kit .badge.gold{background:rgba(232,160,32,.16);color:var(--k-gold-ink)}
html.kit .badge.gray{background:var(--k-card3);color:var(--k-muted)}
html.kit .note,html.kit .kit-note{
  background:var(--k-warn-bg);border-left:4px solid var(--k-gold);color:var(--k-text);
  border-radius:0 var(--k-r-sm) var(--k-r-sm) 0;padding:.7rem .95rem;font-size:.84rem;line-height:1.8;
}
html.kit .note.teal,html.kit .kit-note.teal{background:var(--k-ok-bg);border-color:var(--k-ok)}
html.kit .note.warn,html.kit .kit-note.warn{background:var(--k-err-bg);border-color:var(--k-err)}
html.kit .note b,html.kit .note strong{color:var(--k-hd)}

/* ── 12. 結果區：.result（深藍面板）與 .kit-result（紙面大數字）── */
html.kit .result{
  position:relative;overflow:hidden;color:#eef2f6;border:1px solid rgba(232,160,32,.4);border-radius:var(--k-r);
  padding:1.35rem 1.2rem;margin-top:1.1rem;
  background:
    repeating-linear-gradient(135deg,rgba(232,160,32,.06) 0 1px,transparent 1px 20px),
    radial-gradient(360px 220px at 100% 0%,rgba(232,160,32,.2),transparent 70%),
    linear-gradient(135deg,var(--k-deep),var(--k-navy) 55%,var(--k-navy3));
  box-shadow:var(--k-shadow-lg);
}
html.kit .result:before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--k-gold-hi),transparent)}
html.kit .result h3{font-family:var(--k-serif);color:var(--k-gold-hi);font-size:1rem;letter-spacing:.12em;margin:0 0 .8rem}
html.kit .stat{background:rgba(255,255,255,.06);border:1px solid rgba(232,160,32,.28);border-radius:var(--k-r-sm);padding:.85rem .8rem}
html.kit .stat .k{color:#c9d4de;opacity:1;font-weight:600;letter-spacing:.04em}
html.kit .stat .v{font-family:var(--k-serif);color:var(--k-gold-hi);font-weight:900;font-size:1.5rem;font-variant-numeric:tabular-nums;letter-spacing:.01em}
html.kit .stat .v.sm{font-size:1.2rem}
html.kit .stat .s{color:#a9b9c8;opacity:1}
@media (max-width:520px){html.kit .stats{grid-template-columns:repeat(2,1fr)}html.kit .stat{padding:.7rem .5rem}}
/* 紙面結果卡 */
html.kit .kit-result{
  background:var(--k-card);border:1px solid var(--k-line);border-top:3px solid var(--k-gold);border-radius:var(--k-r);
  padding:1.3rem 1.25rem;box-shadow:var(--k-shadow);margin-top:1.1rem;
}
html.kit .kit-result h3{font-family:var(--k-serif);color:var(--k-hd);font-size:1rem;letter-spacing:.1em;margin:0 0 .7rem}
html.kit .kit-stats{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
html.kit .kit-stat{background:var(--k-card2);border:1px solid var(--k-line2);border-radius:var(--k-r-sm);padding:.8rem .9rem}
html.kit .kit-stat .k{font-size:.76rem;color:var(--k-muted);font-weight:700;letter-spacing:.05em}
html.kit .kit-stat .v,html.kit .kit-num{
  font-family:var(--k-serif);font-size:1.7rem;font-weight:900;color:var(--k-hd);line-height:1.25;
  font-variant-numeric:tabular-nums;display:inline-block;
  background:linear-gradient(var(--k-gold),var(--k-gold)) no-repeat 0 100%/100% 3px;padding-bottom:3px;
}
html.kit .kit-stat .s{font-size:.72rem;color:var(--k-soft);margin-top:.25rem}

/* ── 13. 清單卡／步驟／摺疊 ── */
html.kit .li-card{
  background:var(--k-card);border:1px solid var(--k-line);border-left:5px solid var(--k-navy3);color:var(--k-text);
  border-radius:var(--k-r-sm);padding:.95rem 1.05rem;box-shadow:var(--k-shadow);margin-bottom:.75rem;line-height:1.8;
}
html[data-rex-theme="dark"].kit .li-card{border-left-color:var(--k-ok)}
html.kit .li-card.orange,html.kit .li-card.gold{border-left-color:var(--k-gold)}
html.kit .li-card b{color:var(--k-hd)}
html.kit .li-card .src{color:var(--k-soft)}
html.kit .step{background:var(--k-card);border:1.5px solid var(--k-line);color:var(--k-muted);border-radius:var(--k-r-sm)}
html.kit .step.on{border-color:var(--k-gold);background:rgba(232,160,32,.14);color:var(--k-gold-ink)}
html.kit details.card>summary,html.kit .kit-fold>summary{min-height:44px;cursor:pointer;color:var(--k-hd);font-family:var(--k-serif);letter-spacing:.05em}
html.kit .kit-fold{background:var(--k-card);border:1px solid var(--k-line);border-radius:var(--k-r);padding:.2rem 1.1rem;margin-bottom:1rem}
html.kit .kit-fold[open]{padding-bottom:1rem}
html.kit .kit-fold>summary{display:flex;align-items:center;gap:.5rem;font-weight:700;list-style:none}
html.kit .kit-fold>summary::-webkit-details-marker{display:none}
html.kit .kit-fold>summary:after{content:"▾";margin-left:auto;color:var(--k-gold);transition:transform .2s}
html.kit .kit-fold[open]>summary:after{transform:rotate(180deg)}
html.kit .kit-grid{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}

/* ── 14. 工具地圖（hub 首頁）── */
html.kit .cat-h{font-family:var(--k-serif);color:var(--k-hd);border-left:4px solid var(--k-gold);letter-spacing:.06em}
html.kit .tool-card{background:var(--k-card);border:1px solid var(--k-line);color:var(--k-text);border-radius:16px}
html.kit .tool-card:hover{border-color:var(--k-gold);box-shadow:var(--k-shadow-lg);background:var(--k-card)}
html.kit .tool-card .ic{background:var(--k-card3)}
html.kit .tool-card .nm{color:var(--k-hd)}
html.kit .tool-card .ds{color:var(--k-soft)}
html.kit .tool-card.hot{background:var(--k-card)}
html.kit .searchbar{background:var(--k-field);border:1.5px solid var(--k-field-line);min-height:48px}
html.kit .searchbar:focus-within{border-color:var(--k-gold);box-shadow:0 0 0 3px rgba(232,160,32,.22)}
html.kit .searchbar input{color:var(--k-text);background:transparent}
html.kit .more-btn{background:var(--k-card);border-color:var(--k-line);color:var(--k-muted)}
html.kit .cat-chips{background:transparent}
html.kit .skeleton{background:linear-gradient(90deg,var(--k-card3) 25%,var(--k-card2) 50%,var(--k-card3) 75%);background-size:200%}

/* AI 按鈕旁的額度提示（yejin.js 自動插入 .kit-ai-quota）*/
html.kit .kit-ai-quota{font-size:.76rem;color:var(--k-soft);text-align:center;margin-top:.45rem;letter-spacing:.04em}
html.kit [data-ai]:disabled{opacity:.5;cursor:not-allowed}

/* ── 15. 嵌入模式（中心頁 iframe）── */
html.kit-embed.kit .hub-top,html.kit-embed.kit .hero,html.kit-embed.kit .kit-hero,html.kit-embed.kit .kit-back,
html.kit-embed.kit footer.hub-foot{display:none!important}
html.kit-embed.kit body{background:transparent}
html.kit-embed.kit .wrap{padding-top:.4rem;padding-bottom:1rem}

/* ── 16. 列印 ── */
@media print{
  html.kit .hub-top,html.kit .hero,html.kit .kit-hero,html.kit .kit-hero-art,html.kit [data-art]{display:none!important}
  html.kit body{background:#fff!important;color:#000}
  html.kit .card,html.kit .kit-card,html.kit .kit-result,html.kit .li-card{box-shadow:none;background:#fff;border:1px solid #ccc}
  html.kit .result{background:#fff;color:#000;box-shadow:none;border:1px solid #999}
  html.kit .result:before{display:none}
  html.kit .stat{background:#fff;border-color:#ccc}
  html.kit .stat .k,html.kit .stat .s{color:#333}
  html.kit .stat .v,html.kit .result h3{color:#000}
  html.kit .tbl th{background:#eee;color:#000;border-bottom-color:#999}
}

/* ── 頁首主視覺（中心頁）：<div class="hero kit-hero kit-hero--art"><span class="kit-hero-bg" data-art="名-hero"></span>…
   淺色＝米白頁首＋深藍字（配淺色插畫）；深色＝原本深藍頁首（配深色插畫）。yejin.js 切主題時直接換圖、不重整。
   圖載不到 → 顯示原本的 .kit-hero-art emoji。── */
html.kit .kit-hero>.kit-hero-bg{position:absolute;right:0;top:0;bottom:0;width:min(46%,470px);z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 9%,#000 91%,transparent 100%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 9%,#000 91%,transparent 100%)}
html.kit .kit-hero>.kit-hero-bg img{width:100%;height:100%;object-fit:contain;object-position:right center;display:block}
html.kit .kit-hero>.kit-hero-bg.art-fail{display:none}
html.kit .kit-hero--art{min-height:290px}
html.kit .kit-hero--art>.kit-hero-art{display:none}
html.kit .kit-hero--art:has(>.kit-hero-bg.art-fail)>.kit-hero-art{display:flex}
html.kit .kit-hero--art h1,html.kit .kit-hero--art p,html.kit .kit-hero--art .chips{max-width:58%}
html.kit:not([data-rex-theme="dark"]) .kit-hero--art{
  color:#0a2334;border-color:rgba(232,160,32,.5);
  background:
    radial-gradient(420px 260px at 92% 8%,rgba(232,160,32,.16),transparent 70%),
    linear-gradient(135deg,#fdfaf3 0%,#f7f0e2 55%,#f1e7d2 100%);
  box-shadow:0 18px 40px -28px rgba(10,35,52,.45);
}
html.kit:not([data-rex-theme="dark"]) .kit-hero--art h1{color:#0a2334;text-shadow:none}
html.kit:not([data-rex-theme="dark"]) .kit-hero--art p{color:#44505e}
html.kit:not([data-rex-theme="dark"]) .kit-hero--art .kit-kick{color:#a8730f}
html.kit:not([data-rex-theme="dark"]) .kit-hero--art .chip{color:#6b4a0a;background:rgba(232,160,32,.12);border-color:rgba(232,160,32,.5)}
@media (max-width:640px){
  html.kit .kit-hero--art{min-height:0}
  html.kit .kit-hero>.kit-hero-bg{width:68%;opacity:.32}
  html.kit .kit-hero--art h1,html.kit .kit-hero--art p,html.kit .kit-hero--art .chips{max-width:100%}
}
@media print{html.kit .kit-hero>.kit-hero-bg{display:none}}

/* ── AI 額度用完插圖（yejin.js 在 .ai8-err 加 kit-quota-out）── */
html.kit .ai8-err.kit-quota-out{display:flex;align-items:center;gap:.85rem}
html.kit .ai8-err.kit-quota-out:before{content:"";flex:0 0 64px;height:64px;background:url(/assets/kit/art/state-quota.webp) center/contain no-repeat}
html.kit[data-rex-theme="dark"] .ai8-err.kit-quota-out:before{background-image:url(/assets/kit/art/state-quota-dark.webp)}
@media print{html.kit .ai8-err.kit-quota-out:before{display:none}}
