/* LH1 今日總覽：每張卡一個色系（左側色條＋淡底色＋色點），深色／明亮／黑金主題與各字級都可讀；字級一律 rem */
.ht { margin: 0 0 14px; }
.ht-title { display: flex; align-items: baseline; justify-content: space-between; font-size: 0.8125rem; font-weight: 700; color: var(--text-muted); margin: 2px 2px 8px; }
.ht-day { font-weight: 600; font-size: 0.75rem; }
.ht-skel { color: var(--text-muted); font-size: 0.8125rem; padding: 10px 2px; }
.ht-stale { opacity: .72; }
.ht-card { --hue: #3b82f6; position: relative; margin: 0 0 8px; padding: 8px 12px 8px 14px; border-radius: 12px; border: 1px solid var(--border); border-left: 0.3125rem solid var(--hue);
  background: var(--bg-elev); background: color-mix(in srgb, var(--hue) 11%, var(--bg-elev)); color: var(--text); min-height: 2.75rem; }
.ht-card[data-go] { cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ht-card[data-go]:active { filter: brightness(.94); }
.ht-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ht-h { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; }
.ht-ic { font-size: 1.125rem; line-height: 1; }
.ht-t { font-weight: 700; font-size: 0.9375rem; flex: 1 1 auto; min-width: 0; }
.ht-chev { font-size: 1.25rem; line-height: 1; color: var(--text-muted); }
.ht-pill { flex: 0 0 auto; font-size: 0.75rem; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; color: #fff; background: var(--text-muted); }
.ht-pill.p-ok { background: var(--success, #059669); }
.ht-pill.p-warn { background: var(--warn, #d97706); }
.ht-pill.p-danger { background: var(--danger, #dc2626); }
.ht-pill.p-info { background: #3b82f6; }
.ht-pill.p-muted { background: var(--text-muted); }
.ht-b { font-size: 0.875rem; }
.ht-l { display: flex; align-items: baseline; gap: 8px; padding: 2px 0; overflow-wrap: anywhere; }
.ht-l .k { flex: 0 0 auto; min-width: 4.5em; color: var(--text-muted); font-size: 0.8125rem; }
.ht-l .v { flex: 1 1 auto; min-width: 0; font-weight: 600; }
.ht-lk { cursor: pointer; }
.ht-lk .v::after { content: ' ›'; color: var(--text-muted); font-weight: 400; }
.ht-dot { flex: 0 0 auto; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: #3b82f6; align-self: center; }
.tn-ok .v { color: var(--success, #059669); }
.tn-warn .v { color: var(--warn, #d97706); }
.tn-danger .v { color: var(--danger, #dc2626); }
.tn-muted .v { color: var(--text-muted); font-weight: 500; }
.tn-info .v { color: var(--text); }
.k-today_shift { --hue: #3b82f6; }
.k-punch { --hue: #10b981; }
.k-todos { --hue: #f59e0b; }
.k-announce { --hue: #8b5cf6; }
.k-store_today { --hue: #14b8a6; }
.k-punch.t-warn { --hue: #f59e0b; }
.k-punch.t-danger { --hue: #ef4444; }
.k-punch.t-info { --hue: #3b82f6; }
.k-punch.t-muted, .k-today_shift.t-muted { --hue: #94a3b8; }
.k-todos.t-ok { --hue: #10b981; }
.ht-card.t-fail { --hue: #94a3b8; }
.ht-retry { margin-top: 6px; border: 1px solid var(--border); background: var(--bg-sub); color: var(--text); border-radius: 8px; padding: 8px 14px; font-size: 0.8125rem; min-height: 2.75rem; cursor: pointer; }
.ht-nodetail #home-approvals { display: none; }
/* TY3 颱風提示列：今日總覽最上方；警戒＝紅、留意＝黃；整條可點 */
.ht-ty { --hue: #f59e0b; display: flex; align-items: flex-start; gap: 8px; margin: 0 0 8px; padding: 9px 12px 9px 14px; border-radius: 12px; border: 1px solid var(--border); border-left: 0.3125rem solid var(--hue);
  background: var(--bg-elev); background: color-mix(in srgb, var(--hue) 14%, var(--bg-elev)); color: var(--text); cursor: pointer; -webkit-tap-highlight-color: transparent; min-height: 2.75rem; max-width: 100%; box-sizing: border-box; }
.ht-ty.ty-warn { --hue: #ef4444; }
.ht-ty:active { filter: brightness(.94); }
.ht-ty:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ht-tyb { flex: 0 0 auto; font-size: 0.75rem; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; color: #fff; background: var(--warn, #d97706); margin-top: 1px; }
.ht-ty.ty-warn .ht-tyb { background: var(--danger, #dc2626); }
.ht-tyt { flex: 1 1 auto; min-width: 0; font-size: 0.875rem; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.ht-ty .ht-chev { flex: 0 0 auto; align-self: center; }
