/* Cricket scoring modules — the SHEET's own styles (cells, rows, grids, print), shared by every stage. Loaded
   after module.css by a module's index.html and on its own by its blank-sheet.html. Every rule is scoped under
   .cs-sheet. Sizes follow the two reference photos of the printed Stage 1 sheet: a landscape page, tall batting
   rows whose ball columns run the full height of the block, tall bowling rows with the over boxes split into ball
   cells over a diagonal spare strip, the 1–200 / 1–80 / 1–30 strike grids, and the TOTAL column down the right of
   the totals block. The blocks a sibling format switches on (wrapped ball rows, text batting columns, the
   fall-of-wickets table, 4-column over score, extras boxes, the figures line under an over box, a split over table,
   the printed retirement line) are styled at the end, then the two other LAYOUTS a format can pick (data-layout
   "dense" — the Stage 2 page; "book" — the club scorebook page). Natural width = format.width (--cs-width, 1500 px
   for Stage 1; the Explore stage and the Learn embed scale it; blank-sheet.mjs zooms it to the A3 printable area). */
.cs-sheet {
  --cs-hand: 'Patrick Hand', 'Bradley Hand', 'Segoe Print', 'Comic Sans MS', cursive;
  --cs-ui: var(--font-ui, 'Schibsted Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif);
  --cs-ink: #1b2a6b;            /* the scorer's pen */
  --cs-paper: #fdfcf7;
  --cs-line: #8d8f99;           /* grid lines */
  --cs-edge: #3a3b40;           /* block borders */
  --cs-head: #62646e;           /* dark label bands */
  --cs-headtxt: #fff;
  --cs-light: #e3e3e8;          /* light sub-bands */
  --cs-bat-row: 40px;           /* one batter row */
  --cs-bowl-row: 40px;          /* one bowler row */
  --cs-cell: 26px;              /* a strike-grid cell width */
  position: relative; width: var(--cs-width, 1500px); box-sizing: border-box; background: var(--cs-paper); color: #222;
  padding: 10px 16px 10px; border-radius: 6px; box-shadow: 0 10px 40px rgb(0 0 0 / .22);
  font: 12px/1.2 var(--cs-ui); user-select: none; -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.cs-sheet *, .cs-sheet *::before, .cs-sheet *::after { box-sizing: border-box; }

/* ---------------------------------------------------------------- title band + match details */
.cs-sheet .cs-head { position: relative; top: auto; z-index: auto; display: block; text-align: center; margin: 0 0 6px; padding: 0 180px; min-height: 44px; border: 0; background: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.cs-sheet .cs-titles { display: grid; gap: 2px; }
.cs-sheet .cs-title { display: block; font-size: 26px; line-height: 1.1; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #222; }
.cs-sheet .cs-sub { display: block; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: #333; }
.cs-sheet .cs-dl { position: absolute; right: 0; top: 4px; display: inline-flex; align-items: center; gap: 6px; font: 600 15px/1 var(--cs-ui); color: #1f5f2e; background: #e6f3e9; border: 1.5px solid #2f8a48; border-radius: 999px; padding: 8px 14px; text-decoration: none; white-space: nowrap; }
.cs-sheet .cs-dl::before { content: '⤓'; font-size: 16px; }
.cs-sheet .cs-dl:hover, .cs-sheet .cs-dl:focus-visible { background: #2f8a48; color: #fff; outline: none; }
.cs-sheet .cs-rh { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; background: var(--cs-head); color: var(--cs-headtxt); padding: 4px 6px; text-align: center; line-height: 1.1; }
.cs-sheet .cs-region-match > .cs-rh, .cs-sheet .cs-region-batting > .cs-rh, .cs-sheet .cs-region-bowling > .cs-rh, .cs-sheet .cs-region-totals > .cs-rh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cs-sheet .cs-match { display: grid; grid-template-columns: repeat(var(--cols, 5), 1fr); grid-template-rows: auto auto; grid-auto-flow: row; gap: 6px 18px; margin: 0 0 8px; }
.cs-sheet .cs-field { display: flex; align-items: flex-end; gap: 6px; min-width: 0; }
.cs-sheet .cs-fl { font-size: 11.5px; font-weight: 500; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; color: #222; padding-bottom: 3px; }
.cs-sheet .cs-fl::after { content: ':'; }
.cs-sheet .cs-field .cs-cell { flex: 1; width: auto; min-width: 0; height: 24px; border: 0; border-bottom: 1px solid #555; border-radius: 0; text-align: left; justify-content: flex-start; padding: 0 0 0 5px; font-size: 16px; white-space: nowrap; overflow: hidden; }

/* ---------------------------------------------------------------- rows of blocks */
.cs-sheet .cs-row { display: flex; gap: 8px; align-items: stretch; margin: 0 0 8px; }
.cs-sheet .cs-row-1 .cs-region-batting, .cs-sheet .cs-row-2 .cs-region-bowling { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.cs-sheet .cs-region-batting > .cs-table, .cs-sheet .cs-region-bowling > .cs-table { flex: 1 1 auto; }
.cs-sheet .cs-region { position: relative; border-radius: 2px; }
.cs-sheet .cs-region-runs, .cs-sheet .cs-region-wickets, .cs-sheet .cs-region-overs { flex: 0 0 auto; display: flex; flex-direction: column; border: 1.5px solid var(--cs-edge); background: #fff; }
.cs-sheet .cs-region-runs { width: calc(10 * var(--cs-cell) + 3px); }
.cs-sheet .cs-region-wickets { width: calc(5 * var(--cs-cell) + 3px); }
.cs-sheet .cs-region-overs { width: 176px; }
.cs-sheet .cs-region-overs > .cs-rh { font-size: 10.5px; letter-spacing: .04em; white-space: nowrap; }

/* ---------------------------------------------------------------- tables (batting, bowling, over score) */
.cs-sheet .cs-table { border-collapse: collapse; width: 100%; table-layout: fixed; background: #fff; }
.cs-sheet .cs-table th { background: var(--cs-head); color: var(--cs-headtxt); font-weight: 600; font-size: 11.5px; letter-spacing: .02em; padding: 3px 2px; border: 1px solid #fff; white-space: nowrap; overflow: hidden; text-align: center; vertical-align: middle; height: 22px; }
.cs-sheet .cs-table th.cs-th-blank, .cs-sheet .cs-table th.cs-th-margin { background: transparent; border: 0; }
.cs-sheet .cs-table th.cs-th-balls { background: var(--cs-light); color: #222; border: 1px solid var(--cs-line); border-bottom: 0; height: 20px; font-weight: 600; }
.cs-sheet .cs-table th.cs-th-batter, .cs-sheet .cs-table th.cs-th-bowler { text-align: center; }
.cs-sheet .cs-table th.cs-th-nums { padding: 0; }
.cs-sheet .cs-ballnums { display: grid; grid-template-columns: repeat(var(--cols, 24), 1fr); height: 100%; }
.cs-sheet .cs-ballnums span { display: flex; align-items: center; justify-content: center; font-size: 10.5px; border-right: 1px solid rgb(255 255 255 / .45); overflow: hidden; }
.cs-sheet .cs-ballnums span:last-child { border-right: 0; }
.cs-sheet .cs-thr-sub th { background: var(--cs-light); color: #222; border-color: var(--cs-line); height: 18px; font-size: 9.5px; font-weight: 500; letter-spacing: 0; padding: 1px 1px; }
.cs-sheet .cs-thr-sub th.cs-th-blank { background: #fff; border: 0; border-bottom: 1px solid var(--cs-line); }
.cs-sheet .cs-table td { border: 1px solid var(--cs-line); padding: 0; vertical-align: middle; height: auto; }
.cs-sheet .cs-table tbody tr:last-child td { border-bottom: 1.5px solid var(--cs-edge); }
.cs-sheet .cs-table tbody td:last-child { border-right: 1.5px solid var(--cs-edge); }
.cs-sheet .cs-table .cs-n { text-align: left; vertical-align: top; padding: 2px 0 0 3px; font-size: 11px; font-weight: 500; color: #333; background: #fff; }
.cs-sheet .cs-table .cs-margin { border: 0; background: transparent; padding: 0 2px 0 0; }
.cs-sheet .cs-table .cs-margin + .cs-n, .cs-sheet .cs-table .cs-n:first-child { border-left: 1.5px solid var(--cs-edge); }
.cs-sheet .cs-table tbody tr:first-child td { border-top: 1.5px solid var(--cs-edge); }
.cs-sheet .cs-table tbody tr:first-child td.cs-margin, .cs-sheet .cs-table tbody tr:last-child td.cs-margin { border-top: 0; border-bottom: 0; }
.cs-sheet .cs-td .cs-cell { display: flex; width: 100%; height: 100%; min-height: 24px; border: 0; border-radius: 0; }

/* batting */
.cs-sheet .cs-batting .cs-col-n { width: 18px; }
.cs-sheet .cs-batting .cs-col-name { width: 158px; }
.cs-sheet .cs-batting .cs-col-runs { width: 46px; }
.cs-sheet .cs-batting .cs-col-bf { width: 40px; }
.cs-sheet .cs-batting .cs-col-fours, .cs-sheet .cs-batting .cs-col-sixes { width: 36px; }
.cs-sheet .cs-batting .cs-col-outs { width: 62px; }
.cs-sheet .cs-batting tbody td { height: var(--cs-bat-row); }
.cs-sheet .cs-batting .cs-td .cs-cell { height: var(--cs-bat-row); }
.cs-sheet .cs-namewrap { display: flex; align-items: stretch; height: var(--cs-bat-row); }
.cs-sheet .cs-namewrap .cs-name { flex: 1; min-width: 0; height: auto; border: 0; }
.cs-sheet .cs-namewrap .cs-bnum { flex: 0 0 40px; width: 40px; height: auto; border: 0; font-size: 15px; }
.cs-sheet .cs-bnum[data-filled="true"] .cs-v::before { content: '('; }
.cs-sheet .cs-bnum[data-filled="true"] .cs-v::after { content: ')'; }
.cs-sheet .cs-tally { display: grid; grid-template-columns: repeat(var(--cols, 24), 1fr); height: var(--cs-bat-row); background-image: linear-gradient(to bottom, transparent calc(50% - .5px), #cfd0d6 calc(50% - .5px), #cfd0d6 calc(50% + .5px), transparent calc(50% + .5px)); }
.cs-sheet .cs-tally .cs-cell { width: auto; height: auto; min-width: 0; border: 0; border-right: 1px solid var(--cs-line); border-radius: 0; padding-bottom: 14px; }
.cs-sheet .cs-tally .cs-cell:last-child { border-right: 0; }

/* bowling */
.cs-sheet .cs-bowling .cs-col-margin { width: 26px; }
.cs-sheet .cs-bowling .cs-col-n { width: 18px; }
.cs-sheet .cs-bowling .cs-col-bname { width: 124px; }
.cs-sheet .cs-bowling .cs-col-over { width: 78px; }
.cs-sheet .cs-bowling .cs-col-overs { width: 44px; }
.cs-sheet .cs-bowling .cs-col-maidens { width: 50px; }
.cs-sheet .cs-bowling .cs-col-wd, .cs-sheet .cs-bowling .cs-col-nb { width: 36px; }
.cs-sheet .cs-bowling .cs-col-wkts { width: 50px; }
.cs-sheet .cs-bowling .cs-col-runs { width: 44px; }
.cs-sheet .cs-bowling tbody td { height: calc(var(--cs-bowl-row) + var(--cs-ovfig, 0px)); }
.cs-sheet .cs-bowling .cs-td .cs-cell { height: calc(var(--cs-bowl-row) + var(--cs-ovfig, 0px)); }
.cs-sheet .cs-bowling .cs-margin .cs-cell { width: 100%; height: calc(var(--cs-bowl-row) + var(--cs-ovfig, 0px)); border: 0; border-radius: 0; }
.cs-sheet .cs-pnum[data-filled="true"] .cs-v { border: 1.5px solid var(--cs-ink); border-radius: 50%; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; line-height: 1; }
.cs-sheet .cs-over { padding: 0; background: #fff; }
.cs-sheet .cs-ovbox { display: grid; grid-template-columns: repeat(var(--cols, 6), 1fr); grid-template-rows: 1fr 1fr; height: calc(var(--cs-bowl-row) + var(--cs-ovfig, 0px)); }
.cs-sheet .cs-ovbox .cs-cell { width: auto; height: auto; min-width: 0; border: 0; border-right: 1px solid var(--cs-line); border-bottom: 1px solid var(--cs-line); border-radius: 0; font-size: 13px; }
.cs-sheet .cs-ovbox .cs-cell:nth-child(6) { border-right: 0; }
.cs-sheet .cs-ovbox .cs-cell[data-len="two"] { font-size: 10px; }
.cs-sheet .cs-ovbox .cs-cell[data-len="long"] { font-size: 9px; letter-spacing: -.03em; }
.cs-sheet .cs-ovbox .cs-spare { grid-column: span var(--span, 3); border-bottom: 0; background-color: #f6f5ef; background-image: linear-gradient(to bottom right, transparent calc(50% - .5px), #b9bac2 calc(50% - .5px), #b9bac2 calc(50% + .5px), transparent calc(50% + .5px)); background-size: 14px 100%; background-repeat: no-repeat; background-position: 0 0; }
.cs-sheet .cs-ovbox .cs-spare:last-child { border-right: 0; }
.cs-sheet .cs-ovbox .cs-spare[data-filled="true"] { background-image: none; }

/* over score */
.cs-sheet .cs-overs .cs-col-ov { width: 24px; }
.cs-sheet .cs-region-overs .cs-table { flex: 1 1 auto; height: 100%; }
.cs-sheet .cs-region-overs .cs-table th { background: var(--cs-light); color: #222; border: 1px solid var(--cs-line); font-size: 10.5px; font-weight: 600; height: 20px; padding: 2px 1px; }
.cs-sheet .cs-region-overs .cs-table td { border: 1px solid var(--cs-line); height: auto; }
.cs-sheet .cs-region-overs .cs-table tbody tr:first-child td { border-top: 1px solid var(--cs-line); }
.cs-sheet .cs-region-overs .cs-table tbody tr:last-child td { border-bottom: 0; }
.cs-sheet .cs-region-overs .cs-table tbody td:last-child { border-right: 0; }
.cs-sheet .cs-region-overs .cs-table .cs-n { border-left: 0; vertical-align: middle; text-align: center; padding: 0; font-size: 11px; }
.cs-sheet .cs-region-overs .cs-td .cs-cell { height: 100%; min-height: 15px; min-width: 0; font-size: 15px; }

/* ---------------------------------------------------------------- cells and marks */
.cs-sheet .cs-cell { display: inline-flex; align-items: center; justify-content: center; width: var(--cs-cell); height: var(--cs-cell); margin: 0; padding: 0; border: 1px solid var(--cs-line); background: transparent; color: var(--cs-ink); font: 600 17px/1 var(--cs-hand); cursor: pointer; position: relative; border-radius: 2px; overflow: hidden; }
.cs-sheet[data-editable="false"] .cs-cell { cursor: default; }
.cs-sheet .cs-cell:hover { background: rgb(0 90 200 / .08); }
.cs-sheet .cs-cell:focus-visible { outline: 3px solid #e2740a; outline-offset: -1px; z-index: 3; }
.cs-sheet .cs-cell[aria-expanded="true"] { background: rgb(0 90 200 / .14); }
.cs-sheet .cs-mark { font-size: 17px; }
.cs-sheet .cs-mark[data-len="two"] { font-size: 13px; letter-spacing: -.02em; }
.cs-sheet .cs-mark[data-len="long"] { font-size: 11px; letter-spacing: -.03em; }
.cs-sheet .cs-name { text-align: left; font-size: 16px; justify-content: flex-start !important; padding-left: 5px !important; white-space: nowrap; }
.cs-sheet .cs-num { min-width: 0; font-size: 16px; }
.cs-sheet .cs-text-w { min-width: 0; font-size: 15px; }
.cs-sheet .cs-sig { font-style: italic; }
.cs-sheet .cs-big { font-size: 20px !important; }

/* strike grids (1–200, 1–80, 1–30) */
.cs-sheet .cs-grid { display: grid; grid-template-columns: repeat(var(--cols, 10), 1fr); grid-auto-rows: 1fr; flex: 1 1 auto; }
.cs-sheet .cs-grid .cs-cell { width: auto; height: auto; min-height: 16px; font: 500 11px/1 var(--cs-ui); color: #222; border: 0; border-right: 1px solid var(--cs-line); border-bottom: 1px solid var(--cs-line); border-radius: 0; }
.cs-sheet .cs-grid .cs-cell:nth-child(10n) { border-right: 0; }
.cs-sheet .cs-region-wickets .cs-grid .cs-cell:nth-child(n) { border-right: 1px solid var(--cs-line); }
.cs-sheet .cs-region-wickets .cs-grid .cs-cell:nth-child(5n) { border-right: 0; }
.cs-sheet .cs-region-runs .cs-grid { padding-top: 1px; }
.cs-sheet .cs-strike[data-struck="true"] .cs-v { position: relative; }
.cs-sheet .cs-strike[data-struck="true"] .cs-v::after { content: ''; position: absolute; left: -6px; right: -6px; top: 50%; height: 2px; background: var(--cs-ink); transform: rotate(-38deg); border-radius: 2px; }

/* ---------------------------------------------------------------- totals block */
.cs-sheet .cs-region-totals { flex: 0 0 480px; width: 480px; display: flex; flex-direction: column; }
.cs-sheet .cs-totbox { flex: 1 1 auto; display: flex; flex-direction: column; border: 1.5px solid var(--cs-edge); background: #fff; }
.cs-sheet .cs-tr3 { display: grid; grid-template-columns: 116px 1fr 70px; align-items: stretch; min-height: 24px; }
.cs-sheet .cs-tr-hd { min-height: 20px; }
.cs-sheet .cs-tlab { display: flex; align-items: center; font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: uppercase; background: var(--cs-head); color: var(--cs-headtxt); padding: 2px 5px; border: 1px solid #fff; line-height: 1.15; white-space: nowrap; }
.cs-sheet .cs-tlab.cs-wklab { white-space: normal; }
.cs-sheet .cs-tlab.cs-thd { justify-content: center; font-weight: 600; }
.cs-sheet .cs-tlab.cs-span2 { grid-column: span 2; }
.cs-sheet .cs-tlab.cs-exlab { text-transform: none; font-size: 12px; }
.cs-sheet .cs-tnone { background: transparent; }
.cs-sheet .cs-tlight { background: var(--cs-light); border: 1px solid #fff; }
.cs-sheet .cs-tcell { width: 100%; height: 100%; min-height: 24px; border: 1px solid var(--cs-line); border-radius: 0; font-size: 18px; }
.cs-sheet .cs-exblock { flex: 1 1 auto; display: flex; flex-direction: column; position: relative; }
.cs-sheet .cs-exblock > .cs-tr3:first-child { flex: 0 0 auto; }
.cs-sheet .cs-exrow2 { flex: var(--rows, 2) 1 0; min-height: calc(var(--rows, 2) * 20px); }
.cs-sheet .cs-exg { grid-template-columns: repeat(15, 1fr); grid-auto-rows: 1fr; border: 1px solid var(--cs-line); border-right: 0; }
.cs-sheet .cs-exg .cs-cell { min-height: 18px; font-size: 11px; }
.cs-sheet .cs-exg .cs-cell:nth-child(10n) { border-right: 1px solid var(--cs-line); }
.cs-sheet .cs-exg .cs-cell:nth-child(15n) { border-right: 1px solid var(--cs-line); }
.cs-sheet .cs-wkrow { display: grid; grid-template-columns: 240px 1fr 64px 70px; align-items: stretch; min-height: 34px; }
.cs-sheet .cs-wklab { text-transform: none; font-size: 11.5px; }
.cs-sheet .cs-wkrow .cs-x4 { display: flex; align-items: center; justify-content: flex-end; padding-right: 6px; font-size: 13px; font-weight: 700; background: var(--cs-light); border: 1px solid #fff; }
.cs-sheet .cs-tscore { font-weight: 600; }
.cs-sheet .cs-resbox { margin-top: 8px; border: 1.5px solid var(--cs-edge); background: #fff; display: grid; }
.cs-sheet .cs-rrow { display: grid; grid-template-columns: 200px 1fr; min-height: 26px; }
.cs-sheet .cs-rrow .cs-tlab { justify-content: center; font-weight: 600; }

/* ---------------------------------------------------------------- footer */
.cs-sheet .cs-foot { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin: 4px 0 0; padding: 0; border: 0; background: none; color: inherit; font-size: inherit; text-align: left; }
.cs-sheet .cs-foot .cs-field { flex: 1; }

/* ---------------------------------------------------------------- Explore stage: "labels off" hides the printed labels of the sheet too */
.cs-stage[data-labels="off"] .cs-tlab, .cs-stage[data-labels="off"] .cs-ballnums, .cs-stage[data-labels="off"] .cs-x4, .cs-stage[data-labels="off"] .cs-title, .cs-stage[data-labels="off"] .cs-sub { visibility: hidden; }

/* ---------------------------------------------------------------- sibling-format blocks (off for 'ndca-stage1') */
/* wrapped ball rows: batterBalls > batterBallsPerRow stacks rows inside the one tall batter row */
.cs-sheet .cs-batting tr[style*="--rows"] td { height: calc(var(--rows, 1) * var(--cs-bat-row)); }
.cs-sheet .cs-tally[data-rows]:not([data-rows="1"]) { height: calc(var(--rows, 1) * var(--cs-bat-row)); grid-template-rows: repeat(var(--rows, 1), 1fr); background-image: none; }
.cs-sheet .cs-tally[data-rows]:not([data-rows="1"]) .cs-cell { border-bottom: 1px solid var(--cs-line); padding-bottom: 0; }
/* text batting columns (how out / bowler / fielder) */
.cs-sheet .cs-batting .cs-col-howOut { width: 150px; }
.cs-sheet .cs-batting .cs-col-bowler, .cs-sheet .cs-batting .cs-col-fielder { width: 96px; }
.cs-sheet .cs-batting .cs-col-mins { width: 44px; }
.cs-sheet .cs-btext { font-size: 13px; justify-content: flex-start !important; padding-left: 4px !important; white-space: nowrap; text-align: left; }
.cs-sheet .cs-batting[data-ballrows="0"] .cs-col-name { width: 220px; }
/* fall of wickets and the 4-column over score */
.cs-sheet .cs-region-fow { flex: 0 0 auto; display: flex; flex-direction: column; border: 1.5px solid var(--cs-edge); background: #fff; width: 200px; }
.cs-sheet .cs-region-fow > .cs-rh { font-size: 10.5px; letter-spacing: .04em; white-space: nowrap; }
.cs-sheet .cs-fow .cs-col-fowscore { width: 52px; } .cs-sheet .cs-fow .cs-col-fowbat { width: 52px; } .cs-sheet .cs-fow .cs-col-fowpart { width: 60px; }
.cs-sheet .cs-region-fow .cs-table { flex: 1 1 auto; height: 100%; }
.cs-sheet .cs-region-fow .cs-table th { background: var(--cs-light); color: #222; border: 1px solid var(--cs-line); font-size: 10.5px; font-weight: 600; height: 20px; padding: 2px 1px; }
.cs-sheet .cs-region-fow .cs-table td { border: 1px solid var(--cs-line); height: auto; }
.cs-sheet .cs-region-fow .cs-table tbody tr:last-child td { border-bottom: 0; }
.cs-sheet .cs-region-fow .cs-table tbody td:last-child { border-right: 0; }
.cs-sheet .cs-region-fow .cs-table .cs-n { border-left: 0; vertical-align: middle; text-align: center; padding: 0; font-size: 11px; }
.cs-sheet .cs-region-fow .cs-td .cs-cell { height: 100%; min-height: 15px; min-width: 0; font-size: 14px; }
.cs-sheet .cs-overs[data-cols="4"] .cs-col-ovruns, .cs-sheet .cs-overs[data-cols="4"] .cs-col-ovwkts { width: 34px; }
.cs-sheet .cs-region-overs:has(.cs-overs[data-cols="4"]) { width: 236px; }
/* extras as one box per kind */
.cs-sheet .cs-exblock[data-style="boxes"] .cs-exrow-box { flex: 1 1 0; min-height: 26px; }
.cs-sheet .cs-exblock[data-style="boxes"] .cs-exlab.cs-span2 { grid-column: span 2; }
/* no fielding block: the bowling header keeps one row */
.cs-sheet .cs-bowling[data-fielding="no"] .cs-th-blank { display: none; }
/* no spare cells: an over box is one row of ball cells */
.cs-sheet .cs-ovbox[data-spare="no"] { grid-template-rows: 1fr; }
/* the figures line under an over box (format.overBoxFigures): cumulative runs–wkts, and M for a maiden */
.cs-sheet .cs-ovbox[data-fig="yes"] { grid-template-rows: 1fr 1fr var(--cs-ovfig, 14px); }
.cs-sheet .cs-ovbox[data-spare="no"][data-fig="yes"] { grid-template-rows: 1fr var(--cs-ovfig, 14px); }
.cs-sheet .cs-ovfig { grid-column: 1 / -1; display: flex; align-items: stretch; height: var(--cs-ovfig, 14px); border-top: 1px solid var(--cs-line); background: #f6f5ef; }
.cs-sheet .cs-ovfig .cs-cell { height: auto; min-width: 0; border: 0; border-radius: 0; font-size: 10px; letter-spacing: -.02em; }
.cs-sheet .cs-ovfig .cs-ovcum { flex: 1 1 auto; }
.cs-sheet .cs-ovfig .cs-ovm { flex: 0 0 16px; width: 16px; border-left: 1px solid var(--cs-line); font-weight: 700; }
.cs-sheet .cs-ovbox[data-fig="yes"] .cs-spare { border-bottom: 1px solid var(--cs-line); }
/* the printed retirement line (format.retireLineAfter): a heavy rule under a whole ball line, or a dotted edge after one cell */
.cs-sheet .cs-tally .cs-cell.cs-retire-row { border-bottom: 2px solid var(--cs-edge) !important; }
.cs-sheet .cs-tally .cs-cell.cs-retire-after { border-right: 2px dotted var(--cs-ink) !important; }
/* the split over table (format.overTableSplit): K tables side by side */
.cs-sheet .cs-ovsplit { flex: 1 1 auto; display: flex; align-items: stretch; gap: 0; }
.cs-sheet .cs-ovsplit .cs-table { flex: 0 0 auto; width: 200px; height: 100%; }   /* a fixed width per half (a format may change it) so the region never grows into the batting block */
.cs-sheet .cs-ovsplit .cs-table + .cs-table { border-left: 1.5px solid var(--cs-edge); }
.cs-sheet .cs-region-overs:has(.cs-ovsplit[data-split="2"]) { width: 402px; }
.cs-sheet .cs-region-overs:has(.cs-ovsplit[data-split="3"]) { width: 603px; }

/* ---------------------------------------------------------------- layout "dense" (format.layout; the Stage 2 page): row 1 is a grid —
   batting | over table ; progressive total as a 50-wide strip | fall of wickets | a vertical 1–10 wickets strip — so two
   lines of 30 ball cells and three text columns keep their width and the sheet stays landscape */
.cs-sheet[data-layout="dense"] .cs-row-1 { display: grid; grid-template-columns: minmax(0, 1fr) 184px 70px; grid-template-rows: auto auto; gap: 8px; align-items: stretch; }
.cs-sheet[data-layout="dense"] .cs-row-1 > .cs-region-batting { grid-area: 1 / 1 / 2 / 2; }
.cs-sheet[data-layout="dense"] .cs-row-1 > .cs-region-overs { grid-area: 1 / 2 / 2 / 4; width: auto; }
.cs-sheet[data-layout="dense"] .cs-row-1 > .cs-region-runs { grid-area: 2 / 1 / 3 / 2; width: auto; }
.cs-sheet[data-layout="dense"] .cs-row-1 > .cs-region-fow { grid-area: 2 / 2 / 3 / 3; width: auto; }
.cs-sheet[data-layout="dense"] .cs-row-1 > .cs-region-wickets { grid-area: 2 / 3 / 3 / 4; width: auto; }
.cs-sheet[data-layout="dense"] .cs-region-runs .cs-grid { grid-template-columns: repeat(50, 1fr); }
.cs-sheet[data-layout="dense"] .cs-region-runs .cs-grid .cs-cell { min-height: 22px; font-size: 10.5px; }
.cs-sheet[data-layout="dense"] .cs-region-runs .cs-grid .cs-cell:nth-child(10n) { border-right: 1px solid var(--cs-line); }
.cs-sheet[data-layout="dense"] .cs-region-runs .cs-grid .cs-cell:nth-child(50n) { border-right: 0; }
.cs-sheet[data-layout="dense"] .cs-region-wickets .cs-grid { grid-template-columns: 1fr; }
.cs-sheet[data-layout="dense"] .cs-region-wickets .cs-grid .cs-cell:nth-child(n) { border-right: 0; font-size: 12px; }
.cs-sheet[data-layout="dense"] .cs-region-wickets > .cs-rh, .cs-sheet[data-layout="dense"] .cs-region-runs > .cs-rh { font-size: 10.5px; letter-spacing: .04em; white-space: nowrap; overflow: hidden; }
.cs-sheet[data-layout="dense"] .cs-region-overs .cs-td .cs-cell { min-height: 14px; font-size: 13px; }
.cs-sheet[data-layout="dense"] .cs-region-overs .cs-table .cs-n { font-size: 10px; }
.cs-sheet[data-layout="dense"] .cs-region-fow .cs-td .cs-cell { min-height: 20px; font-size: 13px; }
.cs-sheet[data-layout="dense"] .cs-fow .cs-col-fowscore { width: 44px; } .cs-sheet[data-layout="dense"] .cs-fow .cs-col-fowbat { width: 44px; } .cs-sheet[data-layout="dense"] .cs-fow .cs-col-fowpart { width: 52px; }

/* ---------------------------------------------------------------- layout "book" (a club scorebook page): row 1 is a grid —
   batting (both rows) | progressive total over the wickets strip | the (split) over table over the fall of wickets */
.cs-sheet[data-layout="book"] .cs-row-1 { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-rows: auto auto; gap: 8px; align-items: stretch; }   /* columns 2 and 3 take the fixed widths of the total grid, the over table and the fall of wickets */
.cs-sheet[data-layout="book"] .cs-row-1 > .cs-region-batting { grid-area: 1 / 1 / 3 / 2; }
.cs-sheet[data-layout="book"] .cs-row-1 > .cs-region-runs { grid-area: 1 / 2 / 2 / 3; }
.cs-sheet[data-layout="book"] .cs-row-1:not(:has(.cs-region-wickets)) > .cs-region-runs { grid-area: 1 / 2 / 3 / 3; }
.cs-sheet[data-layout="book"] .cs-row-1 > .cs-region-wickets { grid-area: 2 / 2 / 3 / 3; width: auto; }
.cs-sheet[data-layout="book"] .cs-region-wickets .cs-grid { grid-template-columns: repeat(10, 1fr); }
.cs-sheet[data-layout="book"] .cs-region-wickets .cs-grid .cs-cell:nth-child(n) { border-right: 1px solid var(--cs-line); } .cs-sheet[data-layout="book"] .cs-region-wickets .cs-grid .cs-cell:nth-child(10n) { border-right: 0; }
.cs-sheet[data-layout="book"] .cs-row-1 > .cs-region-overs { grid-area: 1 / 3 / 2 / 4; justify-self: stretch; }
.cs-sheet[data-layout="book"] .cs-row-1 > .cs-region-fow { grid-area: 2 / 3 / 3 / 4; justify-self: stretch; }
.cs-sheet[data-layout="book"] .cs-region-overs .cs-td .cs-cell { min-height: 14px; font-size: 12px; }
.cs-sheet[data-layout="book"] .cs-region-overs .cs-table .cs-n { font-size: 10px; }
.cs-sheet[data-layout="book"] .cs-region-fow .cs-td .cs-cell { min-height: 18px; font-size: 13px; }

/* ---------------------------------------------------------------- print (blank-sheet.html; also if a learner prints the page) */
@media print {
  .cs-sheet { box-shadow: none; border-radius: 0; background: #fff; }
  .cs-sheet .cs-dl { display: none; }
  .cs-sheet .cs-cell { cursor: default; }
  .cs-sheet .cs-pal { display: none; }
  /* blank-sheet.mjs records the A3 fit as --bs-print-zoom: a headless print (no beforeprint) gets the same zoom */
  .bs-page .bs-sheetwrap { zoom: var(--bs-print-zoom, 1) !important; }
}

/* ---------------------------------------------------------------- marks legend under the blank sheet (blank-sheet.mjs) */
.bs-sheetwrap { display: inline-block; }
.cs-legend { width: var(--cs-width, 1500px); box-sizing: border-box; margin: 6px 0 0; padding: 0 6px; display: flex; flex-wrap: wrap; gap: 2px 14px; align-items: baseline; font: 500 11px/1.4 var(--font-ui, system-ui, sans-serif); color: #333; }
.cs-legend b { font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 10px; }
.cs-legend-item { white-space: nowrap; }
.cs-legend kbd { font: 700 11px/1 'Patrick Hand', var(--font-ui, system-ui, sans-serif); border: 1px solid #999; border-radius: 3px; padding: 1px 4px; background: #fff; color: #1a2a6c; }

/* Cricket Caddy logo in the sheet's title band (left; the download link sits on the right). */
.cs-sheet .cs-logo { position: absolute; left: 0; top: 2px; height: 20px; width: auto; }