/* thermo-gauge.css — 盤中溫度計儀表（首頁 home-daily.css 與多維度智能AI頁共用；JS 見 /js/thermo-gauge.js）
   頁面要在 home-daily.css「之前」載入（首頁的版面規則會再覆寫 .hd-gauge-wrap 等尺寸）。
   變數沿用首頁名稱，沒有的頁面（多維度頁 --text3／--up2…）退回該頁色票。 */
/* 溫度計 */
.hd-gauge-wrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;}
.hd-gauge{position:relative;height:100%;max-height:290px;aspect-ratio:320/230;max-width:100%;container-type:inline-size;}
.hd-gauge svg{width:100%;height:100%;display:block;}
.hd-gauge-center{position:absolute;left:0;right:0;top:30%;text-align:center;}
.hd-gauge-temp{font-size:clamp(24px,calc(23cqw - 32px),54px);font-weight:800;line-height:1;letter-spacing:-1.5px;}
.hd-gauge-zone{display:inline-block;margin-top:5px;font-size:11px;font-weight:800;padding:2px 10px;border-radius:4px;background:var(--surface-2,#F1F3F8);color:var(--text-2,var(--text2));}
.hd-gauge-zone.is-up{background:var(--up-soft,var(--up2));color:var(--up);}
.hd-gauge-zone.is-dn{background:var(--down-soft,var(--down2));color:#047857;}
.hd-gauge-thr{position:absolute;left:0;right:0;top:80%;display:flex;justify-content:center;gap:5px;font-size:11px;color:var(--text-2,var(--text2));white-space:nowrap;}
.hd-gauge-thr b{font-weight:700;}
.hd-gauge-ends{position:absolute;left:-6%;right:-6%;bottom:-7px;display:flex;justify-content:space-between;font-size:11px;font-weight:800;}

/* 盤中溫度計：深色賽車儀表（2026-10-11 使用者：再帥一點） */
.hd-pn.is-dash{background:radial-gradient(130% 95% at 50% 100%,#1C2E73 0%,#0D1838 55%,#080F26 100%);border-color:#1E2B5E;color:#fff;overflow:hidden;}
.hd-pn.is-dash .hd-pn-head{border-color:rgba(255,255,255,.08);}
.hd-pn.is-dash .hd-pn-title{color:#fff;}
.hd-pn.is-dash .hd-pn-title::before{background:var(--gold,#F59E0B);box-shadow:0 0 8px rgba(245,158,11,.7);}
.hd-pn.is-dash .hd-pn-meta{color:rgba(255,255,255,.5);}
.hd-shift{flex:none;display:grid;grid-template-columns:repeat(15,1fr);gap:4px;padding:2px 10% 0;}
.hd-shift i{display:block;height:6px;border-radius:3px;background:#EDF0F5;transition:background .4s,box-shadow .4s;}
.hd-pn.is-dash .hd-shift i{background:#1B2752;}
.hd-shift.is-alert i.is-on{animation:hd-shift-blink .9s steps(2,start) infinite;}
@keyframes hd-shift-blink{to{opacity:.25;}}
@media (prefers-reduced-motion:reduce){.hd-pn.is-dash .hd-shift i{background:#1B2752;}
.hd-shift.is-alert i.is-on{animation:none;}}
.hd-pn.is-dash .hd-gauge-temp{font-size:clamp(28px,calc(24cqw - 30px),50px);color:#fff;text-shadow:0 0 18px var(--hd-gc,rgba(148,163,184,.6));}
.hd-pn.is-dash .hd-gauge-zone{background:rgba(255,255,255,.08);color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.14);letter-spacing:2px;}
.hd-pn.is-dash .hd-gauge-zone.is-up{background:rgba(239,68,68,.18);color:#FCA5A5;border-color:rgba(239,68,68,.45);}
.hd-pn.is-dash .hd-gauge-zone.is-dn{background:rgba(16,185,129,.16);color:#6EE7B7;border-color:rgba(16,185,129,.45);}
.hd-pn.is-dash .hd-gauge-thr{color:rgba(255,255,255,.6);top:82%;}
.hd-pn.is-dash .hd-gauge-thr .is-up{color:#FCA5A5;}.hd-pn.is-dash .hd-gauge-thr .is-dn{color:#6EE7B7;}
.hd-pn.is-dash .hd-gauge-ends .is-dn{color:#6EE7B7;}.hd-pn.is-dash .hd-gauge-ends .is-up{color:#FCA5A5;}
.hd-pn.is-dash .hd-gauge-center{top:24%;}
.hd-pn.is-dash .hd-gauge-zone{margin-top:4px;}
.hd-gauge-ends .is-up,.hd-gauge-thr .is-up{color:var(--up);}
.hd-gauge-ends .is-dn,.hd-gauge-thr .is-dn{color:#047857;}
/* 淺色儀表（網站預設）：同一套儀表結構，配色改站內語意色——海軍藍指針、金色軸心、紅漲綠跌；不發光 */
/* 2026-10-11 淺色發光版：底色加深一點的藍色光暈、未亮燈格淡灰底 */
.hd-pn.is-gauge .hd-pn-body{background:radial-gradient(110% 75% at 50% 100%,#E2E8FF 0%,rgba(238,242,255,0) 72%),linear-gradient(180deg,#FFFFFF 0%,#F8FAFF 100%);border-radius:0 0 12px 12px;}
.hd-pn.is-gauge .hd-shift i{background:#E3E8F1;}
.hd-pn.is-gauge .hd-gauge-temp{color:#14307F;font-size:clamp(28px,calc(24cqw - 30px),50px);}
.hd-pn.is-gauge .hd-gauge-center{top:24%;}
.hd-pn.is-gauge .hd-gauge-zone{margin-top:4px;letter-spacing:2px;}
.hd-pn.is-gauge .hd-gauge-thr{top:82%;}
/* 讀數真正置中（° 不佔寬度）；灰色說明字移到儀表下方，與恐慌／樂觀同一列 */
.hd-gauge-temp{display:inline-block;position:relative;}
.hd-pn.is-gauge .hd-gauge-thr,.hd-pn.is-dash .hd-gauge-thr{top:auto;bottom:-2px;}
.hd-gauge-center{display:flex;flex-direction:column;align-items:center;}
/* 2026-10-11 使用者：讀數置中在弧內；狀態標籤與變化描述放在指針軸心正下方 */
.hd-gauge .hd-gauge-center,.hd-pn.is-gauge .hd-gauge-center,.hd-pn.is-dash .hd-gauge-center{top:41%;transform:translateY(-50%);}
.hd-gauge-sub{position:absolute;left:0;right:0;top:72%;display:flex;flex-direction:column;align-items:center;gap:3px;}
.hd-gauge-sub .hd-gauge-zone{margin-top:0;}
.hd-gauge-sub .hd-gauge-thr,.hd-pn.is-gauge .hd-gauge-sub .hd-gauge-thr,.hd-pn.is-dash .hd-gauge-sub .hd-gauge-thr{position:static;top:auto;bottom:auto;}
/* 讀數貼在指針軸心正上方（2026-10-11 使用者） */
.hd-gauge .hd-gauge-center,.hd-pn.is-gauge .hd-gauge-center,.hd-pn.is-dash .hd-gauge-center{top:58%;transform:translateY(-100%);}
.hd-pn.is-gauge .hd-gauge-temp{text-shadow:0 0 2px #fff,0 0 6px #fff,0 0 18px color-mix(in srgb,var(--hd-gc,#94A3B8) 55%,transparent);}
/* 淺色狀態膠囊：照深色版加細框 */
.hd-pn.is-gauge .hd-gauge-zone{border:1px solid rgba(100,116,139,.25);}
.hd-pn.is-gauge .hd-gauge-zone.is-up{border-color:rgba(220,38,38,.35);box-shadow:0 0 10px rgba(220,38,38,.15);}
.hd-pn.is-gauge .hd-gauge-zone.is-dn{border-color:rgba(5,150,105,.35);box-shadow:0 0 10px rgba(5,150,105,.15);}

/* 三格小指標的「i」說明（首頁 .hd-tkpi、多維度頁 .ovt-kpi 共用）；說明框位置由各頁依卡片位置調整 */
.hd-tip{position:relative;flex:none;width:13px;height:13px;padding:0;border:1px solid var(--text-3,var(--text3));border-radius:50%;background:none;color:var(--text-3,var(--text3));font:700 9px/11px 'Inter',sans-serif;cursor:help;}
.hd-tip:hover,.hd-tip:focus-visible{border-color:#14307F;color:#14307F;outline:none;}
.hd-tip::after{content:attr(data-tip);position:absolute;z-index:20;top:calc(100% + 6px);left:50%;transform:translateX(-50%);width:max-content;max-width:200px;padding:6px 9px;border-radius:6px;background:#14307F;color:#fff;font:500 11.5px/1.5 'Noto Sans TC',sans-serif;white-space:normal;text-align:left;box-shadow:var(--shadow-lg,0 8px 24px rgba(15,37,121,.18));opacity:0;visibility:hidden;transition:opacity .15s;pointer-events:none;}
.hd-tip:hover::after,.hd-tip:focus::after{opacity:1;visibility:visible;}