/* 文件型頁面的共用主題（about.html、observe/*）。

   舊版這個檔案整組覆寫 shared.css 的色票（綠黑 + 襯線標題 + 格線底），
   結果同一個站有兩套外觀。2026-07-30 UI 大改後這裡**不再覆寫任何顏色與字體**，
   只負責這兩頁的頂列、版面寬度與表格樣式；色值一律 var(--*)。 */

/* ── 頂列（42px 狀態列，與 .mast / .deskbar 同調）────────────────────── */

.etf-mast {
  position: sticky; top: 0; z-index: 40;
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px 16px; flex-wrap: wrap;
  min-height: 42px;
  padding: 0 max(16px, calc((100vw - var(--content-wide)) / 2 + 16px));
  border-bottom: 1px solid var(--night-rule);
  background: var(--night);
}
.etf-mast-l { display: flex; align-items: baseline; gap: 12px; min-width: 0; }
.etf-mast-back { color: var(--fog); font-size: 11.5px; text-decoration: none; flex: 0 0 auto; }
.etf-mast-back:hover { color: #fff; }
.etf-mast-code {
  flex: 0 0 auto;
  color: var(--haze); font-family: var(--font-mono);
  font-size: 10px; font-weight: 600; letter-spacing: 0.16em;
}
.etf-mast-name { color: #fff; font-size: 12.5px; }
.etf-mast-r {
  flex: 0 0 auto;
  color: var(--fog); font-family: var(--font-mono); font-size: 10.5px;
}
.etf-mast-r strong { color: #fff; font-weight: 600; }

/* ── 版面與表格 ────────────────────────────────────────────────────────── */

main { width: min(var(--content-wide), calc(100% - 32px)); margin: 0 auto; padding: 22px 0 56px; }

table { border-collapse: collapse; }
th { text-align: left; }

.gain { color: var(--up); }
.loss { color: var(--down); }
.empty-state, .empty {
  padding: 40px 0;
  color: var(--fog); font-family: var(--font-mono); font-size: 11.5px; text-align: center;
}

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: var(--night); }
::-webkit-scrollbar-thumb { background: var(--night-rule-strong); }
::-webkit-scrollbar-thumb:hover { background: var(--fog); }

@media (max-width: 640px) {
  main { width: 100%; padding: 14px 12px 40px; }
  .etf-mast { padding: 0 12px; }
  .etf-mast-name { font-size: 11.5px; }
  .etf-mast-r { flex: 0 0 100%; padding-bottom: 5px; font-size: 9.5px; }
}