/* 2026-10-09 15:50 IST - CrossFit & Functional programme page: "WOD whiteboard" layout. Own look, every rule scoped
   under body.pg-program-crossfit-functional. Chalk palette for the pattern groups (lower body / upper body / core and
   carry) validated with the dataviz validator, --mode dark --pairs all, on #141414, #1c1c1c and the board #17201c:
   all checks PASS (worst CVD dE 13.2, normal-vision dE 19.3).
   2026-10-10 03:30 IST - the board-family look (hero, notes, staircase, WOD board, fuel timeline, rules, join board,
   tokens) moved to the family kit style-board.css, linked before this sheet; only the movement-pattern wheel and the
   pattern picker stay here. The page renders pixel-identical to the 2026-10-10 03:00 baseline. */

/* 2026-10-09 15:50 IST - movement-pattern wheel + pattern picker */
body.pg-program-crossfit-functional .cf-wheel-wrap { margin: 0; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(20px, 3vw, 48px); align-items: center; background: var(--cf-board); border: 1px solid #22302a; border-radius: 14px; padding: clamp(16px, 2.5vw, 36px); }
body.pg-program-crossfit-functional .cf-wheel-art { min-width: 0; }
body.pg-program-crossfit-functional .cf-wheel { display: block; width: 100%; max-width: 680px; height: auto; margin: 0 auto; }
body.pg-program-crossfit-functional .cf-wheel text { font-family: var(--body); }
body.pg-program-crossfit-functional .cf-ring { fill: none; stroke: rgba(236,235,228,.12); stroke-width: 1; }
body.pg-program-crossfit-functional .cf-hit { fill: transparent; }
body.pg-program-crossfit-functional .cf-fill { transition: opacity .2s; }
body.pg-program-crossfit-functional .cf-wedge.cf-g1 .cf-fill { fill: var(--cf-g1); }
body.pg-program-crossfit-functional .cf-wedge.cf-g2 .cf-fill { fill: var(--cf-g2); }
body.pg-program-crossfit-functional .cf-wedge.cf-g3 .cf-fill { fill: var(--cf-g3); }
body.pg-program-crossfit-functional .cf-wheel.is-filtering .cf-wedge:not(.is-hot) .cf-fill { opacity: .3; }
body.pg-program-crossfit-functional .cf-wedge.is-hot .cf-fill { stroke: var(--cf-chalk); stroke-width: 2; }
body.pg-program-crossfit-functional .cf-wl { fill: var(--cf-chalk); font-size: 24px; font-weight: 600; }
body.pg-program-crossfit-functional .cf-wv { font-weight: 800; fill: var(--cf-chalk); }
body.pg-program-crossfit-functional .cf-hub { fill: var(--cf-board-2); stroke: rgba(236,235,228,.35); stroke-width: 1.5; stroke-dasharray: 4 5; }
body.pg-program-crossfit-functional .cf-hub-v { fill: var(--cf-chalk); font-size: 40px; font-weight: 700; }
body.pg-program-crossfit-functional .cf-hub-l { fill: var(--cf-chalk-2); font-size: 16px; }
body.pg-program-crossfit-functional .cf-wheel-side h3 { font-size: clamp(30px, 3vw, 42px); color: var(--cf-chalk); }
body.pg-program-crossfit-functional .cf-wheel-side .cf-note { color: var(--cf-chalk-2); font-size: 15px; }
body.pg-program-crossfit-functional .cf-patterns { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
body.pg-program-crossfit-functional .cf-pat { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px solid var(--cf-line); border-radius: 8px; background: transparent; color: var(--cf-chalk); font: 600 14px/1.25 var(--body); text-align: left; cursor: pointer; transition: background-color .2s, border-color .2s; }
body.pg-program-crossfit-functional .cf-pat b { margin-left: auto; font-size: 16px; font-variant-numeric: tabular-nums; }
body.pg-program-crossfit-functional .cf-pat:hover { background: rgba(236,235,228,.06); }
body.pg-program-crossfit-functional .cf-pat[aria-pressed="true"] { background: rgba(236,235,228,.12); border-color: var(--cf-chalk); }
body.pg-program-crossfit-functional .cf-engine { margin: 12px 0 0; font-size: 13px; color: var(--cf-chalk-2); }

/* 2026-10-09 15:50 IST - responsive: the wheel panel stacks, then tightens on phones */
@media (max-width: 1200px) {
  body.pg-program-crossfit-functional .cf-wheel-wrap { grid-template-columns: 1fr; }
  body.pg-program-crossfit-functional .cf-wheel { max-width: 600px; }
}
@media (max-width: 700px) {
  body.pg-program-crossfit-functional .cf-wheel-wrap { padding: 12px 8px 18px; }
  body.pg-program-crossfit-functional .cf-wheel-side { padding: 0 8px; }
  body.pg-program-crossfit-functional .cf-wl, body.pg-program-crossfit-functional .cf-wv { font-size: 32px; }
  body.pg-program-crossfit-functional .cf-hub-v { font-size: 48px; }
  body.pg-program-crossfit-functional .cf-hub-l { font-size: 22px; }
}
/* 2026-10-09 15:58 IST - narrow phones: pattern picker in one column */
@media (max-width: 480px) {
  body.pg-program-crossfit-functional .cf-patterns { grid-template-columns: 1fr; }
}
/* 2026-10-09 15:50 IST - reduced motion: no fades on the wheel or the picker */
@media (prefers-reduced-motion: reduce) {
  body.pg-program-crossfit-functional .cf-fill, body.pg-program-crossfit-functional .cf-pat { transition: none; }
}