/* 3 段字級 — Tide 風格（D016 一行一訊息 / D027 text size）
   用法：在 <html> 上加 data-textsize="small|medium|large"
   所有 rem 字級會依此變數 ±偏移
   預設 = small（最接近原始設計）
*/
:root {
  --ts-base: 15px;          /* body 基準字級（與原本設計對齊） */
  --ts-up: 0px;             /* 段位偏移（由 data-textsize 控制） */
}
html[data-textsize="small"]   { --ts-up: -1.33px; }
html[data-textsize="medium"]  { --ts-up: 0.67px; }
html[data-textsize="large"]   { --ts-up: 2.67px; }
body { font-size: calc(var(--ts-base) + var(--ts-up)); }
/* 也讓 headline 用的 px 值有對應版本：把常用 px 包成變數 */
:root {
  --ts-h1: calc(1.6rem + var(--ts-up));
  --ts-h2: calc(1.2rem + var(--ts-up));
  --ts-h3: calc(1.05rem + var(--ts-up));
  --ts-body: calc(1rem + var(--ts-up));
  --ts-small: calc(0.85rem + var(--ts-up));
  --ts-tiny: calc(0.72rem + var(--ts-up));
}

/* 字級切換 UI（右上角浮動） */
.ts-tool {
  position: fixed; right: 16px; bottom: 16px; z-index: 9999;
  background: var(--panel); border: 1px solid var(--border); border-radius: 22px;
  padding: 4px; display: flex; gap: 2px;
  box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}
.ts-tool button {
  background: transparent; color: var(--muted); border: none;
  padding: 6px 12px; border-radius: 18px; font-size: var(--ts-tiny);
  cursor: pointer; font-family: inherit;
}
.ts-tool button.active { background: var(--acc); color: #000; font-weight: 600; }
.ts-tool button:hover:not(.active) { background: var(--panel2); color: var(--ink); }

/* 模組導航（跨頁切換）— 固定在頂部 + 半透明背景 */
.module-tabs {
  position: sticky; top: 0; z-index: 100;
  display: flex; gap: 6px; flex-wrap: wrap; align-items: center;
  padding: 10px 20px;
  max-width: 100%;
  margin: 0;
  background: rgba(10, 14, 26, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
/* sticky 導航列不擋內容 */
body { padding-top: 0; }
.module-tabs + * { margin-top: 0; }
.mod-tab {
  padding: 7px 14px; border-radius: 8px; color: var(--muted);
  font-size: 0.85rem; font-weight: 500; border: 1px solid transparent;
  transition: all 0.15s; text-decoration: none;
  white-space: nowrap;
}
.mod-tab:hover { background: var(--panel); color: var(--ink); border-color: var(--border); }
.mod-tab.active { background: var(--acc); color: #000; border-color: var(--acc); font-weight: 600; }
/* 字級切換器要避開 sticky 模組列 (它在底部) */
.ts-tool { bottom: 70px !important; }

/* 概念股 badge（chips.html / monitor.html / sectors.html 卡片用） */
.concept-badges { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 4px; }
.concept-badge {
  display: inline-block; padding: 1px 6px; border-radius: 3px;
  font-size: 0.65rem; font-weight: 600;
  background: rgba(95,177,255,0.15); color: var(--acc);
  border: 1px solid rgba(95,177,255,0.3);
}