/* Archery scorecard (kind "archery"). Ring colours follow the target face: gold, red, blue, black, white. */
[data-archery] .archery-tabs { align-self: flex-start; max-width: 100%; }
[data-archery] .archery-tabv { font-variant-numeric: tabular-nums; opacity: .7; margin-left: 2px; }
[data-archery] .archery-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
[data-archery] .archery-now { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
[data-archery] .archery-endlabel { font-size: 18px; }
[data-archery] .archery-cells { display: flex; flex-wrap: wrap; gap: 6px; }
[data-archery] .archery-cell { width: 52px; height: 52px; border-radius: 50%; border: 0; font: 800 22px/1 var(--font); display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
[data-archery] .archery-cell:disabled { cursor: default; }
[data-archery] .archery-cell.is-sel { outline: 3px solid var(--ink); outline-offset: 3px; }
[data-archery] .archery-empty { background: var(--soft); box-shadow: inset 0 0 0 2px var(--hairline); }
[data-archery] .archery-sums { display: flex; gap: 20px; }
[data-archery] .archery-sums > div { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
[data-archery] .archery-sums .big { font-size: clamp(40px, 10vw, 72px); }
[data-archery] .archery-sums .archery-rt { font-size: clamp(56px, 16vw, 120px); }
[data-archery] .archery-stats { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 0 4px; color: var(--body); font-size: 15px; }
[data-archery] .archery-stats b { color: var(--ink); font-variant-numeric: tabular-nums; }
[data-archery] .archery-pad { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
[data-archery] .archery-key { min-height: 64px; font-size: 26px; font-weight: 800; padding: 0; }
[data-archery].archery-fixing .archery-key { box-shadow: inset 0 0 0 3px var(--ink); }
.archery-gold { background: #ffd23f; color: #000; }
.archery-red { background: #e11900; color: #fff; }
.archery-blue { background: #276ef1; color: #fff; }
.archery-black { background: #111; color: #fff; box-shadow: inset 0 0 0 1px #555; }
.archery-white { background: #fff; color: #000; box-shadow: inset 0 0 0 1px #bdbdbd; }
.archery-miss { background: var(--canvas); color: var(--ink); box-shadow: inset 0 0 0 2px var(--hairline); }
[data-archery] .pill.archery-gold:hover, [data-archery] .pill.archery-red:hover, [data-archery] .pill.archery-blue:hover, [data-archery] .pill.archery-black:hover, [data-archery] .pill.archery-white:hover { filter: brightness(.92); }
[data-archery] .pill.archery-gold { background: #ffd23f; } [data-archery] .pill.archery-red { background: #e11900; } [data-archery] .pill.archery-blue { background: #276ef1; }
[data-archery] .pill.archery-black { background: #111; } [data-archery] .pill.archery-white { background: #fff; } [data-archery] .pill.archery-miss { background: var(--canvas); }
[data-archery] .archery-table th, [data-archery] .archery-table td { padding: 6px 4px; }
[data-archery] .archery-table tfoot th { color: var(--ink); font-weight: 800; }
[data-archery] .archery-currow td { background: var(--soft); }
[data-archery] .archery-hint, [data-archery] .archery-note { margin: 4px 0; font-size: 14px; }
[data-archery] .settings select { border: 0; border-radius: var(--input); padding: 12px; font-size: 16px; background: var(--canvas); color: var(--ink); width: 100%; max-width: 100%; }
[data-archery] .archery-names { grid-column: 1 / -1; display: grid !important; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
body.is-focus [data-archery] .archery-tools .pill { display: inline-flex; }
body.is-focus [data-archery] .archery-key { min-height: min(12vh, 90px); font-size: min(5vh, 34px); }
@media (max-width: 520px) {
  [data-archery] .archery-pad { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  [data-archery] .archery-key { min-height: 56px; font-size: 22px; }
  [data-archery] .archery-cell { width: 44px; height: 44px; font-size: 19px; }
  [data-archery] .archery-sums { gap: 14px; }
}