// Single source of truth for the game board's fixed pixel sizes.
//
// The board deliberately uses fixed px (not rem) so it stays pixel-precise and
// scales as one unit via `useFitScale` (desktop) — see index.css for why the
// board opts out of the global rem type lever. These constants keep those px
// values in one place instead of scattered as inline literals across the board
// components (Standings / GameTable / …).
//
// PlayerCircle derives its own font/padding as ratios of the `size` it gets, so
// its internal ratios stay local to that component; only the per-seat `size`
// inputs live here.

/** Player-circle diameter per seat, by viewport. */
export const SEAT_SIZE = {
  desktop: { top: 64, side: 64, me: 70 },
  mobile: { top: 52, side: 48, me: 60 },
} as const;

/** Score list (Standings) type sizes. */
export const STANDINGS_FONT = {
  desktop: { head: 12, idx: 13, cell: 18, dot: 18, sigma: 18, total: 20 },
  mobile: { head: 11, idx: 9, cell: 16, dot: 13, sigma: 15, total: 18 },
} as const;

/** Header / score totals row (GameTable). The value size differs between the
 *  compact desktop header and the mobile header. */
export const TOTALS_FONT = {
  label: 12,
  valueDesktop: 18,
  valueMobile: 17,
} as const;

/** Guess (tip) picker buttons (GuessControls): round button diameter + label
 *  size, in px — kept fixed like the rest of the board (not rem Tailwind classes)
 *  so they don't drift with the global font-size lever. */
export const GUESS_BUTTON = {
  desktop: { size: 48, font: 22 },
  mobile: { size: 40, font: 18 },
} as const;