/* sheetform.css — v3.44 正式記錄表視圖（官方 FIVB 版式的螢幕版）。
 *
 * 規則一：**`--mm` 是這個檔案裡唯一的長度來源**，其餘每一個尺寸都是
 *          `calc(var(--mm) * N)`，而 N 逐字取自 `server/app/scoresheet_pdf.py:78-113`。
 *          寫死一個 px 會讓螢幕與列印慢慢分家，而那是最難發現的一種不一致。
 *
 * 規則二：**紙的顏色不掛 base.css 的 UI 令牌。** 官方表是黑字白紙
 *          （把空白表 200dpi 光柵化取樣：88.2% 純白、8.9% 近黑），
 *          而 UI 令牌是為介面調的，兩者被綁在一起之後，改介面配色會默默改掉
 *          「紙」看起來的樣子。這裡自己一組 --sf-*。
 *
 * 規則三：印刷層與筆跡層的差別是**字重、字級與筆畫**，不是顏色深淺。
 *          紙上兩者都是黑的；差別在一個是印的、一個是手寫的。
 */

/* ── 紙張調色盤（自成一組，不引用 UI 令牌）──────────────────────────────── */
/* 方向照本專案慣例：`:root` 是**深色**那一組，`html[data-theme="light"]` 是覆寫
   （`css/base.css:249`、`js/core/theme.js` 一律寫出具體主題）。反過來寫的話，
   「跟隨系統」那一格會落到錯的一邊，而那在截圖裡看起來只是「顏色怪怪的」。 */
:root {
  /* 深色不是把紙反白——那會刺眼而且不像紙。用低眩光的暖色紙。 */
  --sf-paper: #e8e2d4;
  --sf-print: #23211a;
  --sf-rule: #23211a;
  --sf-rule-fade: #8c8676;
  --sf-ink: #1a1c26;
  --sf-ink-2: #21386e;
}
html[data-theme='light'] {
  --sf-paper: #ffffff;        /* 紙 */
  --sf-print: #14140f;        /* 印刷層：近黑，不是灰 */
  --sf-rule: #14140f;         /* 格線 */
  --sf-rule-fade: #9a9a93;    /* 階梯的欄分隔等次要細線 */
  --sf-ink: #111827;          /* 筆跡：記錄員的筆 */
  --sf-ink-2: #1e3a8a;        /* 筆跡（藍原子筆的那一種） */
}

/* ── 外框與縮放 ──────────────────────────────────────────────────────────── */
#sheet-form-chrome {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0 0 6px;
  font-size: 0.82rem;
  color: var(--muted, #8a8f98);
}
.sf-chrome-line { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; }
.sf-chrome-set { font-weight: 600; color: var(--fg, inherit); }
.sf-chrome-note { color: var(--warn, #d08700); }
.sf-zoom { display: inline-flex; gap: 0; }
.sf-zoom-btn { border-radius: 0; }
.sf-zoom-btn:first-child { border-radius: 6px 0 0 6px; }
.sf-zoom-btn:last-child { border-radius: 0 6px 6px 0; }
/* v3.57 E-②：單局檢視的選局鈕（與檢視比例同一種按鈕組；目前局多一個點）。 */
.sf-setpick { display: inline-flex; gap: 0; align-items: center; }
.sf-setpick-lab { margin-right: 4px; }
.sf-setpick-btn { border-radius: 0; min-width: 2.4em; }
.sf-setpick-btn:first-of-type { border-radius: 6px 0 0 6px; }
.sf-setpick-btn:last-of-type { border-radius: 0 6px 6px 0; }
.sf-setpick-btn[data-current]::after { content: '\2022'; margin-left: 2px; }
.sf-zoom-btn[aria-pressed='true'],
.sf-setpick-btn[aria-pressed='true'] {
  background: var(--accent, #2f7cf6);
  color: var(--accent-fg, #fff);
  border-color: var(--accent, #2f7cf6);
}

/* 容器查詢：`--mm` 由容器寬度換算，不必量 DOM，也不怕縮放與旋轉。
   （計畫原本要用 ResizeObserver；容器查詢單位做得到同一件事，而且不會有
   ResizeObserver 在捲軸出現／消失時自我觸發的迴圈錯誤。） */
#sheet-form-fit {
  container-type: inline-size;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
}
#sheet-form { overflow: auto; }
#sheet-form[data-empty] .sf-sheet { display: none; }

.sf-sheet {
  /* 後備值先寫：若瀏覽器不支援 cqw，下一行整條無效，這一行仍然成立。
     **一個未定義的 `--mm` 會讓 calc() 全部失效、格線退化成等分列**，
     那時每一個格子都還在、每一條數量斷言都還是綠的——所以不能沒有後備。 */
  --mm: 2.4px;
  /* --sf-span 由 formview.js 寫在這一層：一般局 205、決勝局 332、整張 A3 420（mm）。 */
  --mm: calc(100cqw / var(--sf-span, 205));

  /* scoresheet_pdf.py:78-113 逐字 */
  --mm-set-row-h: 56.5;
  --mm-r-head: 6;
  --mm-r-order: 5;
  --mm-r-start: 5.5;
  --mm-r-subno: 5.5;
  --mm-r-score: 5;
  --mm-points-w: 17;
  --mm-label-w: 26;
  --mm-spine-w: 6.5;
  --sf-lw-block: 0.7;
  --sf-lw-grid: 0.3;
  --sf-lw-hair: 0.2;

  /* 線寬有下限（v3.46）：整張檢視時 --mm 只有約 3px，0.3 與 0.2mm 的線都會落在
     同一個裝置像素上，三層粗細就變成一層。這是**刻意與 PDF 不同**的地方
     ——列印時沒有這個問題，螢幕上有。 */
  --sf-w-block: max(1.5px, calc(var(--mm) * var(--sf-lw-block)));
  --sf-w-grid: max(1px, calc(var(--mm) * var(--sf-lw-grid)));
  --sf-w-hair: max(0.5px, calc(var(--mm) * var(--sf-lw-hair)));

  --sf-rows:
    calc(var(--mm) * var(--mm-r-head))
    calc(var(--mm) * var(--mm-r-order))
    calc(var(--mm) * var(--mm-r-start))
    calc(var(--mm) * var(--mm-r-subno))
    calc(var(--mm) * var(--mm-r-score))
    calc(var(--mm) * var(--mm-r-score))
    minmax(0, 1fr);

  background: var(--sf-paper);
  color: var(--sf-print);
  width: 100%;
  box-sizing: border-box;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  line-height: 1;
  /* 顯示層，不是輸入層：整個紙面沒有可點的東西。 */
  cursor: default;
  user-select: text;
}
/* 單局：紙就是那一局。 */
.sf-sheet[data-mode='set'] { height: calc(var(--mm) * var(--mm-set-row-h)); }

/* 整張 A3（scoresheet_pdf.py::build_scoresheet_pdf 的組裝）：
   高 4+20+2+56.5+2+56.5+2+56.5+2+91.5+4 = 297；寬 4+332+2+78+4 = 420。 */
.sf-page {
  display: grid;
  grid-template-columns: calc(var(--mm) * 332) calc(var(--mm) * 78);
  grid-template-rows:
    calc(var(--mm) * 20)
    calc(var(--mm) * 56.5)
    calc(var(--mm) * 56.5)
    calc(var(--mm) * 56.5)
    calc(var(--mm) * 91.5);
  gap: calc(var(--mm) * 2);
  padding: calc(var(--mm) * 4);
  aspect-ratio: 420 / 297;
}
.sf-region { border: var(--sf-w-block) solid var(--sf-rule); }
.sf-region[data-region='header'] { grid-area: 1 / 1 / 2 / 3; }
.sf-region[data-region='right']  { grid-area: 4 / 2 / 6 / 3; }
.sf-region[data-region='bottom'] { grid-area: 5 / 1 / 6 / 2; }
.sf-setrow {
  /* v3.46 叫 `.sf-pair`，跟比分對格子（v3.45）撞名：整排兩局因此繼承了比分對的
     `white-space: nowrap`、字距、筆跡顏色與 transform——第 1–4 局的標籤不會換行、
     壓到格線，只有決勝局（不在這一排裡）正常。v3.48 改名。 */
  display: grid;
  grid-template-columns: 1fr 1fr;          /* (412 - 2) / 2 = 205mm 一局 */
  gap: calc(var(--mm) * 2);
  min-width: 0;
}
.sf-setrow[data-row='0'] { grid-area: 2 / 1 / 3 / 3; }
.sf-setrow[data-row='1'] { grid-area: 3 / 1 / 4 / 3; }
.sf-decider-slot { grid-area: 4 / 1 / 5 / 2; min-width: 0; }
/* best-of-3 的第二排：一張紙沒用到的那一半，什麼都不畫。 */
.sf-setblock-unused { border: 0; }

/* ── set block ──────────────────────────────────────────────────────────── */
.sf-setblock {
  display: grid;
  grid-template-columns:
    calc(var(--mm) * var(--mm-label-w))
    calc(var(--mm) * var(--mm-spine-w))
    1fr 1fr;
  height: 100%;
  min-width: 0;
  border: var(--sf-w-outer, max(2px, calc(var(--mm) * 1))) solid var(--sf-rule);
  box-sizing: border-box;
}
/* 決勝局：[標籤][SET 5][A 換場前][B 全局][Change side][A 換場後]
   （332 − 26 − 6.5 − 6.5）/ 3 = 97.667mm 一區。 */
.sf-setblock[data-decider] {
  grid-template-columns:
    calc(var(--mm) * var(--mm-label-w))
    calc(var(--mm) * var(--mm-spine-w))
    1fr 1fr
    calc(var(--mm) * var(--mm-spine-w))
    1fr;
}

.sf-labelcol {
  display: grid;
  grid-template-rows: var(--sf-rows);
  /* minmax(0, 1fr)，不是 1fr：`1fr` 的最小寬度是內容的最小寬度，長標籤
     （N° of Starting players）會把格子撐出 26mm，壓到右邊的 SET 書脊。
     整張檢視時字很小、又碰到瀏覽器最小字級，所以只有那個模式看得出來。 */
  grid-template-columns: calc(var(--mm) * 5) minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  border-right: var(--sf-w-block) solid var(--sf-rule);
}
.sf-lab-spine {
  grid-row: 1 / -1;
  grid-column: 1;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  display: grid;
  place-items: center;
  font-size: calc(var(--mm) * 2.1);
  border-right: var(--sf-w-hair) solid var(--sf-rule-fade);
}
.sf-lab-stack { grid-row: 1 / -1; grid-column: 2; display: grid; grid-template-rows: var(--sf-rows); min-width: 0; }
.sf-lab {
  display: grid;
  place-items: center end;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: anywhere;
  padding-right: calc(var(--mm) * 1);
  font-size: calc(var(--mm) * 2.2);
  line-height: 1.1;                         /* 兩行標籤在 5.5mm 的列裡，行高 1 會切到第一行的上緣 */
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
  text-align: right;
}
.sf-lab-head { border-bottom-width: var(--sf-w-block); }
.sf-lab-subs { grid-row: 4 / 7; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); display: grid; align-items: stretch; }
/* 「Substitutes」只拿到標籤欄的一半寬，字級小一號，免得在整張檢視時被從字中間切開。 */
.sf-lab-subs-l {
  display: grid; place-items: center;
  font-size: calc(var(--mm) * 1.8);
  overflow-wrap: normal;
  border-right: var(--sf-w-hair) solid var(--sf-rule);
}
.sf-lab-subs-r {
  display: grid;
  /* 跟資料格同一條線：原本用 1fr 2fr（5.17／10.33mm），而資料格是 5.5／5＋5mm，
     標籤下面那條線比右邊的格線高 0.33mm。 */
  grid-template-rows: calc(var(--mm) * var(--mm-r-subno)) minmax(0, 1fr);
}
.sf-lab-subs-r > span { display: grid; place-items: center end; padding-right: calc(var(--mm) * 1); }
.sf-lab-subs-r > span:first-child { border-bottom: var(--sf-w-grid) solid var(--sf-rule); }
.sf-lab-rounds {
  grid-row: 7;
  display: grid;
  grid-template-columns: minmax(0, 1fr) calc(var(--mm) * 9);
  place-items: stretch;
  padding-right: 0;
}
.sf-lab-rounds-t { display: grid; place-items: center end; padding-right: calc(var(--mm) * 1); }
.sf-ords {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(var(--sf-round-per-half), 1fr);
  border-left: var(--sf-w-hair) solid var(--sf-rule);
}
.sf-ord {
  grid-column: var(--sf-col-line);
  grid-row: var(--sf-r-row);
  display: grid; place-items: center;
  font-size: calc(var(--mm) * 1.6);
  border-right: var(--sf-w-hair) solid var(--sf-rule-fade);
  border-bottom: var(--sf-w-hair) solid var(--sf-rule-fade);
}

.sf-spine {
  display: grid;
  place-items: center;
  writing-mode: vertical-rl;
  letter-spacing: calc(var(--mm) * 0.8);
  font-weight: 700;
  font-size: calc(var(--mm) * 3.4);
  border-right: var(--sf-w-block) solid var(--sf-rule);
}
.sf-spine[data-spine='change'] {
  font-size: calc(var(--mm) * 2.2);
  letter-spacing: calc(var(--mm) * 0.3);
  border-left: var(--sf-w-block) solid var(--sf-rule);
}

/* ── 一隊的 block ───────────────────────────────────────────────────────── */
.sf-team {
  display: grid;
  grid-template-columns: repeat(12, 1fr) calc(var(--mm) * var(--mm-points-w));
  grid-template-rows: var(--sf-rows);
  min-width: 0;
}
.sf-team[data-side='right'] { border-left: var(--sf-w-block) solid var(--sf-rule); }

.sf-head {
  grid-row: 1;
  grid-column: 1 / 13;
  display: flex;
  align-items: center;
  gap: calc(var(--mm) * 1.5);
  padding: 0 calc(var(--mm) * 1.2);
  border-bottom: var(--sf-w-block) solid var(--sf-rule);
  font-size: calc(var(--mm) * 2.2);
  min-width: 0;
}
.sf-head.is-mirrored { flex-direction: row; }  /* DOM 已按鏡像順序排好 */
.sf-head-lab { font-size: calc(var(--mm) * 1.9); letter-spacing: 0.02em; }
.sf-head-time { display: flex; align-items: center; gap: calc(var(--mm) * 0.8); }
.sf-units { display: flex; gap: calc(var(--mm) * 1.6); font-size: calc(var(--mm) * 1.5); }
.sf-head-team { display: flex; align-items: center; gap: calc(var(--mm) * 1); min-width: 0; flex: 1; }
.sf-head-teamname {
  font-size: calc(var(--mm) * 2.6);
  /* 整張的行高是 1（.sf-sheet），而這一格要 `overflow: hidden` 才能截斷長隊名——
     兩者一起，字母的上伸部（h、k）在整張檢視時會被切掉（7px 字級、盒高取整成 7px）。 */
  line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sf-head-atc {
  display: flex; align-items: center; gap: calc(var(--mm) * 1);
  margin-left: auto;
}
.sf-atc-box {
  display: inline-grid; place-items: center;
  min-width: calc(var(--mm) * 9);
  height: calc(var(--mm) * 4.2);
  border: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-head-pts {
  grid-row: 1;
  grid-column: 13;
  display: grid; place-items: center;
  font-size: calc(var(--mm) * 2);
  border-bottom: var(--sf-w-block) solid var(--sf-rule);
  border-left: var(--sf-w-block) solid var(--sf-rule);
}

/* 寫字梳齒（City / Hall / 時間格那種）：下緣一排小豎線。 */
.sf-comb { display: inline-flex; align-items: flex-end; gap: 0; }
/* 局首的時刻：一格寫兩個數字（時／分），所以比一般書寫格的字小一號。 */
.sf-comb-time .sf-combcell { display: grid; place-items: center; }
.sf-clockch { font-size: calc(var(--mm) * 2); letter-spacing: -0.03em; }
.sf-combcell {
  display: inline-block;
  width: calc(var(--mm) * 3.2);
  height: calc(var(--mm) * 3.2);
  border-left: var(--sf-w-hair) solid var(--sf-rule-fade);
  border-right: var(--sf-w-hair) solid var(--sf-rule-fade);
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
}

/* Ⓐ / Ⓑ 與 S / R 都用畫的，不用 Unicode 圈字（多數 CJK 字型沒有那些字）。 */
.sf-badge, .sf-sr-o {
  display: inline-grid; place-items: center;
  width: calc(var(--mm) * 4); height: calc(var(--mm) * 4);
  border: var(--sf-w-grid) solid var(--sf-print);
  border-radius: 50%;
  font-weight: 700;
  flex: none;
}
/* 圈裡的字母是 SVG（見 formview.js::circledLetter）：字級由 viewBox 決定，不看 font-size。 */
.sf-letter { display: block; width: 100%; height: 100%; overflow: visible; }
.sf-letter text { fill: currentColor; }
.sf-sr { display: inline-flex; gap: calc(var(--mm) * 0.6); }
.sf-sr-o { width: calc(var(--mm) * 3.2); height: calc(var(--mm) * 3.2);
           font-weight: 400; border-color: var(--sf-rule-fade); }
.sf-sr-o.is-on { border-color: var(--sf-print); border-width: calc(var(--mm) * 0.5); font-weight: 700; }

/* ── 格子共用 ───────────────────────────────────────────────────────────── */
.sf-cell {
  position: relative;
  display: grid;
  place-items: center;
  border-right: var(--sf-w-grid) solid var(--sf-rule);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
  min-width: 0;
  overflow: hidden;
}
.sf-order  { grid-row: 2; grid-column: var(--sf-col-line) / span 2; font-size: calc(var(--mm) * 2.6); }
.sf-start  { grid-row: 3; grid-column: var(--sf-col-line) / span 2; }
.sf-subno  { grid-row: 4; grid-column: var(--sf-col-line) / span 2; }
.sf-score  { grid-row: var(--sf-row-line); grid-column: var(--sf-col-line) / span 2; }

.sf-rounds {
  grid-row: 7;
  grid-column: 1 / 13;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(var(--sf-round-per-half), 1fr);
  min-width: 0;
}
.sf-svc {
  grid-row: var(--sf-r-row);
  grid-column: var(--sf-col-line);
  font-size: calc(var(--mm) * 2);
}
/* 每個發球輪小格左上角印的輪次號（官方表與 PDF 都有，淡、小）。 */
.sf-rno {
  position: absolute;
  left: calc(var(--mm) * 0.35);
  top: calc(var(--mm) * 0.25);
  font-size: calc(var(--mm) * 1.25);
  color: var(--sf-rule-fade);
  pointer-events: none;
}
/* 現在發球的那一欄：紙本上沒有這條線，是螢幕版的輔助——所以做得很輕。 */
.sf-team[data-current-col='1'] .sf-cell[data-col='1'],
.sf-team[data-current-col='2'] .sf-cell[data-col='2'],
.sf-team[data-current-col='3'] .sf-cell[data-col='3'],
.sf-team[data-current-col='4'] .sf-cell[data-col='4'],
.sf-team[data-current-col='5'] .sf-cell[data-col='5'],
.sf-team[data-current-col='6'] .sf-cell[data-col='6'] {
  background: color-mix(in srgb, var(--sf-print) 3.5%, transparent);
}
/* v3.57：現在發球的那一**格**（舊格線 `svc-cell-current` 的等價）。同樣是螢幕輔助，
   而列印區塊用了 `print-color-adjust: exact`，所以放在 screen 裡，紙上不帶。 */
@media screen {
  .sf-svc[data-current] {
    outline: calc(var(--mm) * 0.35) solid color-mix(in srgb, var(--sf-ink-2) 55%, transparent);
    outline-offset: calc(var(--mm) * -0.35);
  }
}

/* ── 印刷層 vs 筆跡層 ───────────────────────────────────────────────────── */
[data-print] { color: var(--sf-print); font-weight: 400; }
.sf-colon { color: var(--sf-rule-fade); font-size: calc(var(--mm) * 1.8); }
.sf-num, .sf-pair, .sf-head-teamname {
  color: var(--sf-ink-2);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  transform: rotate(var(--tilt, 0deg));
}
.sf-num { font-size: calc(var(--mm) * 2.9); }
/* 換上來的背號最多兩個（換人＋換回），並排寫在同一格，所以比先發背號小一點。 */
.sf-subnums { font-size: calc(var(--mm) * 2.6); white-space: nowrap; }
/* 比分對（Score at change、"T" 暫停格）：一串置中的「A:B」。
   ⚠ 字級刻意**大於** PDF 的 5pt——PDF 印在 A3 紙上讀得清楚，螢幕上整張縮小之後
   5pt 只剩約 10px（user 回報「分數太小」）。版面照 PDF，字級照螢幕可讀。
   格子是 11.5 × 5mm，「12:14」在 3.2mm 字級下約 9mm 寬，放得下。 */
.sf-pair {
  font-size: calc(var(--mm) * 3.2);
  white-space: nowrap;
  letter-spacing: -0.02em;
}
.sf-score, .sf-t-slot { position: relative; }

.sf-ink-svg {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none;
}
.sf-ink-svg ellipse { fill: none; stroke: var(--sf-ink-2); stroke-width: max(1px, calc(var(--mm) * 0.28)); vector-effect: non-scaling-stroke; }
/* 筆畫粗細用 --mm：`non-scaling-stroke` 讓 stroke-width 是螢幕像素，寫死 9 在小格子裡
   就是 9px 的粗線，勾選框（約 9px 見方）會糊成實心方塊（v3.48 第一版就是這樣）。 */
.sf-tick polyline { fill: none; stroke: var(--sf-ink-2); stroke-width: max(1px, calc(var(--mm) * 0.4)); stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }

/* ── POINTS 欄 ──────────────────────────────────────────────────────────── */
.sf-pts {
  grid-row: 2 / -1;
  grid-column: 13;
  display: grid;
  grid-template-rows: 0.66fr 0.34fr;   /* scoresheet_pdf.py:442 的 0.66 切分 */
  border-left: var(--sf-w-block) solid var(--sf-rule);
  min-width: 0;
}
.sf-pts-nums {
  position: relative;
  display: grid;
  grid-auto-flow: column;                                   /* ← column-major，跟紙本一樣 */
  grid-template-rows: repeat(var(--sf-pts-rows), 1fr);
  grid-auto-columns: 1fr;
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
  min-width: 0;
}
.sf-pt {
  position: relative;
  display: grid; place-items: center;
  font-size: calc(var(--mm) * 1.7);
  line-height: 1;
  min-width: 0;
}
.sf-pt[data-col-break] { border-left: var(--sf-w-hair) solid var(--sf-rule-fade); }
/* 階梯上的號碼全部是**印**上去的，所以全部一樣深——紙上不是用深淺區分已得分，
   是用劃記。把未劃的印成灰會讓整欄看起來像「還沒印好」，而那不是那張紙的樣子。 */
.sf-pt-n { color: var(--sf-print); }
/* 劃記：一道斜線穿過號碼。用漸層畫，和既有格線同一個技法。 */
.sf-pt[data-mark='x']::after {
  content: '';
  position: absolute; inset: 8% 14%;
  background: linear-gradient(to top right, transparent 44%, var(--sf-ink-2) 44%,
                              var(--sf-ink-2) 56%, transparent 56%);
  pointer-events: none;
}
/* 局末未劃記＝劃銷：一段連號一筆長劃，不是一個號碼一道。 */
.sf-void-run {
  position: absolute;
  left: calc(var(--run-col) * 100% / var(--sf-pts-cols));
  width: calc(100% / var(--sf-pts-cols));
  top: calc(var(--run-r0) * 100% / var(--sf-pts-rows));
  height: calc(var(--run-len) * 100% / var(--sf-pts-rows));
  pointer-events: none;
  background: linear-gradient(to top right, transparent calc(50% - 0.4px),
                              var(--sf-ink) calc(50% - 0.4px),
                              var(--sf-ink) calc(50% + 0.4px), transparent calc(50% + 0.4px));
}
/* "T" 暫停區：照 scoresheet_pdf.py 的切分——上面 38% 印 "T"，下面兩格各 31%。
   第一版用 `auto 1fr 1fr`，標題被壓成一條細線、兩格被拉長，看起來就是變形。 */
.sf-pts-t {
  display: grid;
  grid-template-rows: 0.38fr 0.31fr 0.31fr;
  place-items: stretch;
  min-height: 0;
}
.sf-t-cap {
  display: grid; place-items: center;
  font-size: calc(var(--mm) * 2.6);
  font-weight: 700;
}
.sf-t-slot {
  position: relative;
  display: grid; place-items: center;
  border-top: var(--sf-w-hair) solid var(--sf-rule-fade);
}

/* ── 剛剛變動的格子：一次極短的提示，然後回到紙的樣子 ──────────────────── */
[data-fresh] { animation: sf-fresh 0.9s ease-out 1; }
@keyframes sf-fresh {
  from { background: color-mix(in srgb, var(--sf-ink-2) 22%, transparent); }
  to   { background: transparent; }
}
@media (prefers-reduced-motion: reduce) {
  [data-fresh] { animation: none; }
}

/* ── 窄螢幕：這張表不縮成手機版，橫向捲動比擠壞誠實 ─────────────────────── */
@media (max-width: 720px) {
  #sheet-form { overflow-x: auto; }
  #sheet-form-fit { min-width: 720px; }
}

/* ── 頁首（v3.48 階段 3）──────────────────────────────────────────────────
   版面以官方空白表為準（不是 PDF）。下面的 `fr` 值就是空白表上量到的 pt 寬高，
   所以比例與紙本相同；絕對大小由整頁格線的 20mm 那一列決定。
   頁首框 x 31–1156、y 31.3–113.8pt；左半 31–699、標題 699–1156。 */
.sf-hdr {
  /* 頁首只有 20mm（整頁格線照 PDF），官方表是 29mm。**所有列都用 minmax(0, fr)**：
     `fr` 的最小高度預設是內容高度，勾選框與圓圈會把列撐高、總高超過 20mm、
     底部被裁掉（v3.48 第一版實測總高 59px、頁首 53px）。
     **只設欄不設列也一樣**：隱含的那一列是 `auto`，照樣被內容撐高——第一次修只改了
     內層的列，外層 `.sf-hdr` 與 `.sf-hdr-body` 沒設列，量到的高度一點都沒變。 */
  display: grid;
  grid-template-columns: 668fr 457fr;
  grid-template-rows: minmax(0, 1fr);
  height: 100%;
  min-width: 0;
  overflow: hidden;
}
.sf-hdr-left {
  display: grid;
  grid-template-rows: minmax(0, 23.8fr) minmax(0, 58.7fr);
  min-width: 0;
  border-right: var(--sf-w-block) solid var(--sf-rule);
}
.sf-hdr-comp {
  display: flex; align-items: center; gap: calc(var(--mm) * 1.5);
  padding: 0 calc(var(--mm) * 1.2);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
  min-width: 0;
}
.sf-hdr-body {
  display: grid;
  grid-template-columns: 414fr 248fr;
  grid-template-rows: minmax(0, 1fr);
  min-width: 0;
}
.sf-hdr-fields {
  display: grid;
  grid-template-rows: minmax(0, 19.4fr) minmax(0, 17.7fr) minmax(0, 21.6fr);
  border-right: var(--sf-w-grid) solid var(--sf-rule);
  min-width: 0;
}
.sf-hdr-row {
  display: grid;
  align-items: center;
  min-height: 0;
  overflow: hidden;
  grid-auto-flow: column;
  grid-auto-columns: max-content;          /* 放不進格子時寫在旁邊的原值 */
  column-gap: calc(var(--mm) * 0.8);
  padding: 0 calc(var(--mm) * 1);
  min-width: 0;
  border-bottom: var(--sf-w-hair) solid var(--sf-rule-fade);
}
.sf-hdr-row-city { grid-template-columns: 44fr 226fr 96fr 48fr; }
.sf-hdr-row-hall { grid-template-columns: 44fr 162fr 64fr 47fr 65fr 32fr; }
.sf-hdr-row-div {
  display: flex; flex-wrap: nowrap; gap: calc(var(--mm) * 1.2);
  border-bottom: 0;
}
.sf-hdr-dt {
  display: grid;
  grid-template-rows: minmax(0, 25.9fr) minmax(0, 31.3fr);
  min-width: 0;
}
.sf-hdr-row-dt { grid-template-columns: 33fr 96fr 46fr 64fr; }
.sf-hdr-teams {
  display: flex; align-items: center; justify-content: center;
  gap: calc(var(--mm) * 0.8);
  border-bottom: 0;
}

/* 印刷層的標籤與筆跡 */
.sf-hl { font-size: calc(var(--mm) * 1.7); white-space: nowrap; }
.sf-hl-bold { font-weight: 700; font-size: calc(var(--mm) * 1.9); }
.sf-hl-cat { margin-left: calc(var(--mm) * 1.5); }
.sf-hv { min-width: 0; }
.sf-hv-free { flex: 1; overflow: hidden; }
.sf-hv-box {
  align-self: stretch;
  border: var(--sf-w-hair) solid var(--sf-rule);
  display: grid; place-items: center;
  margin: calc(var(--mm) * 0.35) 0;
  overflow: hidden;
}
.sf-hink {
  color: var(--sf-ink-2);
  font-weight: 700;
  font-size: calc(var(--mm) * 2.2);
  line-height: 1.15;                       /* 預設行高在 3mm 高的框裡會把字的上緣切掉 */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: rotate(var(--tilt, 0deg));
}
.sf-raw { font-size: calc(var(--mm) * 1.9); }

/* 一格一個字的書寫格：頁首的版本撐滿欄寬、格數由 --sf-cells 決定（計數，不是長度）。
   v3.50 起右側欄與 RESULTS 也用同一個樣子。 */
.sf-hdr .sf-comb, .sf-rcol .sf-comb, .sf-res .sf-comb {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--sf-cells), 1fr);
  align-self: stretch;
  margin: calc(var(--mm) * 0.35) 0;
  min-width: 0;
  min-height: 0;
}
.sf-hdr .sf-combcell, .sf-rcol .sf-combcell, .sf-res .sf-combcell {
  width: auto;
  height: auto;
  display: grid; place-items: center;
  border-left: var(--sf-w-hair) solid var(--sf-rule);
  border-right: 0;
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-hdr .sf-combcell:last-child, .sf-rcol .sf-combcell:last-child,
.sf-res .sf-combcell:last-child { border-right: var(--sf-w-hair) solid var(--sf-rule); }
.sf-combch {
  color: var(--sf-ink-2);
  font-size: calc(var(--mm) * 2.2);
  font-weight: 700;
  font-style: normal;
  transform: rotate(var(--tilt, 0deg));
}
/* City／Hall 的值是寫在格線上面的一整行字（人不會一格一字地寫地名）。 */
.sf-over {
  position: absolute;
  inset: 0 calc(var(--mm) * 0.6);
  display: grid; align-items: center;
  pointer-events: none;
}
.sf-hdt { display: grid; grid-template-rows: minmax(0, 1fr) auto; align-self: stretch; min-width: 0; min-height: 0; }
.sf-units-date { display: grid; grid-template-columns: repeat(3, 1fr); justify-items: center; }
.sf-units-time { display: grid; grid-template-columns: repeat(2, 1fr); justify-items: center; }
.sf-comb-time-hdr {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  min-width: 0;
}
/* 時與分之間的冒號是**印上去的**（紙本就有），不是比分格那個「空格才有」的淡色冒號。 */
.sf-hdr .sf-colon {
  display: grid; place-items: center;
  padding: 0 calc(var(--mm) * 0.5);
  color: var(--sf-rule);
  font-weight: 700;
  font-size: calc(var(--mm) * 2.4);
  line-height: 1;
}

/* Division／Category 的勾選框：打勾是一筆畫，不是 ✓ 字元。 */
.sf-tick-item { display: inline-flex; align-items: center; gap: calc(var(--mm) * 0.6); }
.sf-tick-lab { font-size: calc(var(--mm) * 1.7); }
.sf-tickbox {
  position: relative;
  display: inline-block;
  width: calc(var(--mm) * 3.3);
  height: calc(var(--mm) * 3.3);
  border: var(--sf-w-grid) solid var(--sf-rule);
}

/* TEAMS：(A or B) 圈 ＋ 3 格代碼 ＋ TEAMS vs ＋ 3 格代碼 ＋ 圈 (A or B) */
.sf-hdr-teams .sf-comb { width: calc(var(--mm) * 15); height: calc(var(--mm) * 4.2); align-self: center; }
/* 右側欄表頭：(圈)(A or B)［代碼］TEAMS［代碼］(A or B)(圈)——官方表的代碼框 48pt 寬。 */
.sf-rrow-teams {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 calc(var(--mm) * 0.8);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
  min-width: 0; min-height: 0; overflow: hidden;
}
.sf-rrow-teams .sf-comb { width: calc(var(--mm) * 17); height: calc(var(--mm) * 5); align-self: center; }
.sf-abcircle {
  display: inline-grid; place-items: center;
  width: calc(var(--mm) * 5.6);
  height: calc(var(--mm) * 5.6);
  border: var(--sf-w-grid) solid var(--sf-rule);
  border-radius: 50%;
}
.sf-ablegend {
  display: inline-grid;
  grid-auto-flow: row;
  font-size: calc(var(--mm) * 1.3);
  line-height: 1.05;
  text-align: center;
}
.sf-teams-vs {
  display: inline-grid; justify-items: center;
  font-size: calc(var(--mm) * 1.8);
  margin: 0 calc(var(--mm) * 1);
}

/* 標題：官方表放 FIVB 標誌的位置。**不重製任何 FIVB 標誌、字標或協會名稱。** */
.sf-hdr-title {
  display: grid;
  grid-template-rows: minmax(0, 56.5fr) minmax(0, 26fr);
  min-width: 0;
}
.sf-title-rules {
  display: grid; align-items: center;
  padding: 0 calc(var(--mm) * 2);
  font-size: calc(var(--mm) * 2.4);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-title-main {
  display: grid; align-items: center;
  padding: 0 calc(var(--mm) * 2);
  font-size: calc(var(--mm) * 4.2);
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.01em;
  white-space: nowrap;
  overflow: hidden;
}

/* ── 右側欄（v3.50 階段 4）──────────────────────────────────────────────────
   fr 值＝官方空白表上量到的 pt 高度（右側欄 442.6–821.0）。
   欄：兩半 113.7 ｜ 114.3；背號 13.3／14.2；職員代碼欄 23.2（置中）。 */
.sf-rcol {
  display: grid;
  grid-template-rows:
    minmax(0, 21.3fr) minmax(0, 12fr)
    repeat(14, minmax(0, 12.56fr))
    minmax(0, 10.7fr) repeat(2, minmax(0, 11.35fr))
    minmax(0, 10.7fr) repeat(5, minmax(0, 11.88fr))
    minmax(0, 10.6fr) minmax(0, 27.4fr) minmax(0, 27.8fr);
  min-width: 0;
  overflow: hidden;
}
.sf-rrow {
  display: grid;
  min-width: 0;
  min-height: 0;
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
}
.sf-rrow-p { grid-template-columns: 13.3fr 100.4fr 14.2fr 100.1fr; }
.sf-rrow-o { grid-template-columns: 102.3fr 23.2fr 102.5fr; }
.sf-rrow-s { grid-template-columns: 113.7fr 114.3fr; }
.sf-rsub { border-bottom-width: var(--sf-w-grid); }
.sf-rc {
  position: relative;
  display: grid;
  align-items: center;
  min-width: 0;
  overflow: hidden;
  padding: 0 calc(var(--mm) * 0.6);
  font-size: calc(var(--mm) * 1.9);
}
.sf-rc-num { justify-items: center; border-right: var(--sf-w-hair) solid var(--sf-rule); }
/* 兩半之間的粗線：右半的背號格左邊。 */
.sf-rrow-p > .sf-rc-num:nth-child(3),
.sf-rrow-s > .sf-rc-sig:nth-child(2) { border-left: var(--sf-w-grid) solid var(--sf-rule); }
.sf-rc-name { white-space: nowrap; }
.sf-rc-code {
  justify-items: center;
  font-weight: 700;
  border-left: var(--sf-w-grid) solid var(--sf-rule);
  border-right: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-rc-off { justify-items: center; white-space: nowrap; }
.sf-rtitle {
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: calc(var(--mm) * 2);
  border-top: var(--sf-w-grid) solid var(--sf-rule);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-rink {
  color: var(--sf-ink-2);
  font-weight: 700;
  font-size: calc(var(--mm) * 2.1);
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transform: rotate(var(--tilt, 0deg));
}
.sf-rink-num { font-size: calc(var(--mm) * 2.3); }
.sf-rc-num[data-captain] .sf-ink-svg {
  /* 圈用 inset 定框（取消 .sf-ink-svg 的 100% 寬高），比格子小一圈——筆畫貼著格線時，
     窄的那一欄看起來像被切掉一半。 */
  inset: 8% 6%;
  width: auto;
  height: auto;
}
.sf-rc-sig { align-content: space-between; padding-block: calc(var(--mm) * 0.5); }
.sf-sig-lab { font-size: calc(var(--mm) * 1.6); }
/* 簽名圖（v3.51）：保持比例、不超出格子；沒有圖時這個盒子是 0 高，不佔位。 */
.sf-sig-img { display: block; min-height: 0; overflow: hidden; }
.sf-sig-img img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.sf-rc-sig .sf-sig-img { flex: 1 1 auto; align-self: stretch; }
.sf-appr-sign { position: relative; overflow: hidden; padding: calc(var(--mm) * 0.3); }
.sf-appr-sign .sf-sig-img { height: 100%; }

/* ── 下緣（v3.50 階段 4）──────────────────────────────────────────────────── */
.sf-bottom {
  grid-area: 5 / 1 / 6 / 2;
  display: grid;
  grid-template-columns: 187.1fr 463.5fr 221.3fr;
  column-gap: calc(var(--mm) * 2);
  min-width: 0;
  min-height: 0;
}
.sf-bottom-mid {
  display: grid;
  grid-template-rows: minmax(0, 74.9fr) minmax(0, 149.6fr);
  row-gap: calc(var(--mm) * 0.9);
  min-width: 0;
  min-height: 0;
}
.sf-box {
  position: relative;
  border: var(--sf-w-block) solid var(--sf-rule);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.sf-box-title {
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: calc(var(--mm) * 3);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
}

/* SANCTIONS：頂帶 33.3 ｜ 表頭 21.3 ｜ 11 × 12.0 ｜ 說明 40.1 */
.sf-sanc {
  display: grid;
  grid-template-rows: minmax(0, 33.3fr) minmax(0, 21.3fr) repeat(11, minmax(0, 12fr)) minmax(0, 40.1fr);
  border: 0;
  overflow: visible;
}
.sf-sanc-top {
  display: grid;
  grid-template-columns: 101.6fr 5fr 80.4fr;
  min-height: 0;
}
.sf-sanc-title {
  grid-column: 1;
  display: grid;
  place-items: center;
  font-size: calc(var(--mm) * 3.2);
  letter-spacing: 0.04em;
  border: var(--sf-w-block) solid var(--sf-rule);
  border-bottom-width: var(--sf-w-grid);
}
.sf-imp {
  grid-column: 3;
  display: grid;
  grid-template-rows: 13.5fr 14.9fr;
  align-self: start;
  height: calc(100% * 28.4 / 33.3);
  border: var(--sf-w-block) solid var(--sf-rule);
}
.sf-imp-title {
  display: grid; place-items: center;
  font-weight: 700; font-size: calc(var(--mm) * 1.8);
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
}
.sf-imp-row { display: flex; align-items: center; justify-content: center; gap: calc(var(--mm) * 0.4); }
.sf-imp-team { display: inline-flex; align-items: center; gap: calc(var(--mm) * 0.3); }
.sf-imp-tick {                                        /* 記號（打勾）畫在圈旁邊，不蓋住字母 */
  position: relative;
  display: inline-block;
  width: calc(var(--mm) * 2.6);
  height: calc(var(--mm) * 2.6);
}
.sf-imp-colon { font-size: calc(var(--mm) * 2); font-weight: 700; margin: 0 calc(var(--mm) * 0.4); }
.sf-sanc-row {
  display: grid;
  grid-template-columns: 25.5fr 25.4fr 25.3fr 25.4fr 16fr 22.7fr 46.8fr;
  border-left: var(--sf-w-block) solid var(--sf-rule);
  border-right: var(--sf-w-block) solid var(--sf-rule);
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
  min-height: 0;
}
.sf-sanc-head { border-top: var(--sf-w-block) solid var(--sf-rule); border-bottom-width: var(--sf-w-grid); }
.sf-sanc-c {
  display: grid; place-items: center;
  min-width: 0; overflow: hidden;
  border-right: var(--sf-w-hair) solid var(--sf-rule);
}
.sf-sanc-c:nth-child(4) { border-right-width: var(--sf-w-grid); }
.sf-sanc-c:last-child { border-right: 0; }
.sf-sanc-h { grid-auto-flow: row; align-content: center; font-size: calc(var(--mm) * 2); }
.sf-sanc-h small { font-size: calc(var(--mm) * 1); }
.sf-sanc-abh { grid-auto-flow: row; justify-items: center; row-gap: calc(var(--mm) * 0.15); }
.sf-sanc-abh .sf-badge-xs { width: calc(var(--mm) * 2.3); height: calc(var(--mm) * 2.3); }
.sf-sanc-or { font-size: calc(var(--mm) * 1.1); line-height: 1; }
.sf-sanc-note {
  padding: calc(var(--mm) * 0.5) calc(var(--mm) * 0.6);
  font-size: calc(var(--mm) * 1.25);
  line-height: 1.2;
  border: var(--sf-w-block) solid var(--sf-rule);
  border-top-width: var(--sf-w-grid);
  overflow: hidden;
}
.sf-badge-sm { width: calc(var(--mm) * 2.8); height: calc(var(--mm) * 2.8); }
.sf-badge-xs { width: calc(var(--mm) * 2); height: calc(var(--mm) * 2); }
.sf-badge-lg { width: calc(var(--mm) * 6); height: calc(var(--mm) * 6); border-width: var(--sf-w-grid); }

/* REMARKS：7 條書寫線，頭兩條讓出左上的標題頁籤（官方：頁籤 80.2 × 21.4pt，線距 10.7pt）。 */
.sf-rem {
  --rem-pitch: calc(100% / 7);
}
.sf-rem-tab {
  position: absolute;
  left: 0; top: 0;
  width: calc(100% * 80.2 / 463.5);
  height: calc(100% * 2 / 7);
  display: grid; place-items: center;
  font-size: calc(var(--mm) * 2.6);
  background: var(--sf-paper);
  border-right: var(--sf-w-grid) solid var(--sf-rule);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
  z-index: 1;
}
.sf-rem-body {
  position: absolute;
  inset: 0;
  --pitch: calc(var(--mm) * 30.18 / 7);
  line-height: var(--pitch);
  padding: 0 calc(var(--mm) * 1.2);
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent calc(var(--pitch) - var(--sf-w-hair)),
    var(--sf-rule-fade) calc(var(--pitch) - var(--sf-w-hair)),
    var(--sf-rule-fade) var(--pitch));
  overflow: hidden;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.sf-rem-float {
  float: left;
  width: calc(var(--mm) * 174.3 * 80.2 / 463.5);
  height: calc(var(--pitch) * 2);
}
.sf-rem-ink { color: var(--sf-ink-2); font-weight: 700; font-size: calc(var(--mm) * 2.2); }

/* APPROVAL：標題 18.8 ｜ 表頭 18.7 ｜ 4 × 16.0 ｜ Line Judges 2 × 16.0 ｜ Team Captains 16.1 */
.sf-appr {
  display: grid;
  grid-template-rows: minmax(0, 18.8fr) minmax(0, 18.7fr) repeat(4, minmax(0, 16fr)) minmax(0, 31.9fr) minmax(0, 16.1fr);
}
.sf-appr-row {
  display: grid;
  grid-template-columns: 34.4fr 215.5fr 52.8fr 160.8fr;
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
  min-height: 0;
}
.sf-appr-head { border-bottom-width: var(--sf-w-grid); }
.sf-appr-head > * { display: grid; place-items: center; font-size: calc(var(--mm) * 1.9); }
.sf-appr-row:not(.sf-appr-head) > * { border-right: var(--sf-w-grid) solid var(--sf-rule); display: grid; align-items: center; min-width: 0; overflow: hidden; }
.sf-appr-row > *:last-child { border-right: 0; }
.sf-appr-lab { font-size: calc(var(--mm) * 1.7); padding-left: calc(var(--mm) * 0.8); }
.sf-appr-name { padding: 0 calc(var(--mm) * 1.2); }
.sf-appr-lj {
  display: grid;
  grid-template-columns: 209.1fr 40.8fr 213.6fr;
  grid-template-rows: 1fr 1fr;
  border-top: var(--sf-w-grid) solid var(--sf-rule);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
  min-height: 0;
}
.sf-appr-ljlab {
  grid-column: 2; grid-row: 1 / 3;
  display: grid; place-items: center; text-align: center;
  font-size: calc(var(--mm) * 1.7);
  border-left: var(--sf-w-grid) solid var(--sf-rule);
  border-right: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-appr-ljc { position: relative; display: grid; align-items: center; min-width: 0; overflow: hidden; padding: 0 calc(var(--mm) * 4); }
.sf-appr-ljc[data-judge='1'] { grid-column: 1; grid-row: 1; }
.sf-appr-ljc[data-judge='2'] { grid-column: 3; grid-row: 1; }
.sf-appr-ljc[data-judge='3'] { grid-column: 1; grid-row: 2; }
.sf-appr-ljc[data-judge='4'] { grid-column: 3; grid-row: 2; }
.sf-appr-ljc[data-judge='1'], .sf-appr-ljc[data-judge='2'] { border-bottom: var(--sf-w-hair) solid var(--sf-rule); }
.sf-appr-ljno { position: absolute; font-size: calc(var(--mm) * 1.8); }
.sf-appr-ljc[data-judge='1'] .sf-appr-ljno, .sf-appr-ljc[data-judge='3'] .sf-appr-ljno { right: calc(var(--mm) * 1); }
.sf-appr-ljc[data-judge='2'] .sf-appr-ljno, .sf-appr-ljc[data-judge='4'] .sf-appr-ljno { left: calc(var(--mm) * 1); }
.sf-appr-cap {
  display: grid;
  grid-template-columns: 209.1fr 40.8fr 213.6fr;
  min-height: 0;
}
.sf-appr-cap .sf-rc-sig {
  display: flex; align-items: center; gap: calc(var(--mm) * 1);
  padding: 0 calc(var(--mm) * 1);
}
.sf-appr-cap .sf-rc-sig[data-side='A'] .sf-badge { margin-left: auto; }
.sf-appr-caplab {
  display: grid; place-items: center; text-align: center;
  font-size: calc(var(--mm) * 1.7);
  border-left: var(--sf-w-grid) solid var(--sf-rule);
  border-right: var(--sf-w-grid) solid var(--sf-rule);
}

/* RESULTS：標題 21.0 ｜ 隊伍 24.1 ｜ 表頭 20.0 ｜ 5 × 20.04 ｜ 合計 20.0 ｜ 時間 22.6 ｜ WINNER 19.2 */
.sf-res {
  display: grid;
  grid-template-rows: minmax(0, 21fr) minmax(0, 24.1fr) minmax(0, 20fr) repeat(5, minmax(0, 20.04fr))
                      minmax(0, 20fr) minmax(0, 22.6fr) minmax(0, 19.2fr);
}
.sf-res-teams {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 calc(var(--mm) * 1);
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-res-teams .sf-comb { width: calc(var(--mm) * 17); height: calc(var(--mm) * 5.5); }
.sf-res-row {
  display: grid;
  grid-template-columns: 17.6fr 18.8fr 18.4fr 23.2fr 64.1fr 23fr 18.7fr 18.6fr 18.9fr;
  border-bottom: var(--sf-w-hair) solid var(--sf-rule);
  min-height: 0;
}
.sf-res-head { border-bottom-width: var(--sf-w-grid); }
.sf-res-total { border-bottom-width: var(--sf-w-block); }
.sf-res-c {
  display: grid; place-items: center; grid-auto-flow: row;
  min-width: 0; overflow: hidden;
  border-right: var(--sf-w-hair) solid var(--sf-rule);
  font-size: calc(var(--mm) * 2);
}
.sf-res-c:nth-child(4), .sf-res-c:nth-child(5) { border-right-width: var(--sf-w-grid); }
.sf-res-c:last-child { border-right: 0; }
.sf-res-c small { font-size: calc(var(--mm) * 1); }
.sf-res-set { grid-auto-flow: column; justify-content: space-between; padding: 0 calc(var(--mm) * 1); }
.sf-res-tsd { grid-auto-flow: row; justify-content: center; }
.sf-res-dur, .sf-res-hm { min-width: calc(var(--mm) * 5); display: inline-grid; place-items: center; }
.sf-res-times {
  display: grid;
  grid-template-columns: 78fr 64.1fr 79.2fr;
  border-bottom: var(--sf-w-grid) solid var(--sf-rule);
}
.sf-res-time {
  display: grid; grid-template-rows: auto auto;
  justify-items: center; align-content: center; row-gap: calc(var(--mm) * 0.5);
  padding-block: calc(var(--mm) * 0.4);
  border-right: var(--sf-w-grid) solid var(--sf-rule);
  min-width: 0; overflow: hidden;
}
.sf-res-time:last-child { border-right: 0; }
.sf-res-time-lab { font-size: calc(var(--mm) * 1.3); }
.sf-res-time-line { display: inline-flex; align-items: baseline; gap: calc(var(--mm) * 0.3); }
.sf-res-unit { font-size: calc(var(--mm) * 1.6); }
.sf-res-winner {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 calc(var(--mm) * 2);
}
.sf-res-winlab { font-size: calc(var(--mm) * 3); }
.sf-res-winner .sf-comb { width: calc(var(--mm) * 17); height: calc(var(--mm) * 5.5); }
.sf-res-winscore { display: inline-flex; align-items: baseline; gap: calc(var(--mm) * 0.5); font-size: calc(var(--mm) * 2.6); }

/* ── 列印（v3.51 階段 5）─────────────────────────────────────────────────────
   紙本就是 A3 橫式，所以列印時 `--mm` 直接等於 1mm——整張紙印出來是**實際尺寸**
   （420 × 297），不是縮放過的螢幕版。其餘畫面不印。
   線寬也脫掉螢幕的下限：`max(1px, …)` 是為了讓 0.2mm 的細線在螢幕上還看得見，
   印在紙上不需要，留著反而讓三種粗細變成同一種。 */
@page { size: A3 landscape; margin: 0; }

@media print {
  /* 只留紙：用 visibility 而不是 display，才不會改變版面計算（容器查詢仍成立）。
     ⚠ 但 `visibility: hidden` **仍然佔位**——只做這一步的話，文件高度還是整個
     app 的高度，印出來是**兩頁**（實測）。所以把文件本身收成一張紙的大小，
     並把紙拉出文件流（position: fixed）。 */
  html, body {
    width: 420mm;
    height: 297mm;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #fff;
  }
  body * { visibility: hidden !important; }
  #sheet-form, #sheet-form * { visibility: visible !important; }
  #sheet-form {
    position: fixed;
    inset: 0 auto auto 0;
    width: 420mm;
    max-height: 297mm;
    overflow: visible;
  }
  #sheet-form-fit { max-width: none; }
  .sf-sheet {
    --mm: 1mm;                       /* 實際尺寸 */
    --sf-w-block: calc(var(--mm) * var(--sf-lw-block));
    --sf-w-grid: calc(var(--mm) * var(--sf-lw-grid));
    --sf-w-hair: calc(var(--mm) * var(--sf-lw-hair));
    /* 紙是白的、印刷與格線是黑的，不跟著畫面主題（深色主題印出來是暖灰底）。 */
    --sf-paper: #ffffff;
    --sf-print: #000000;
    --sf-rule: #000000;
    --sf-rule-fade: #808080;
    --sf-ink: #111827;
    --sf-ink-2: #1e3a8a;
    box-shadow: none;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
}