/* Live field graphic. Motion is a glide between spots; static when the ball is unknown. */
.field{margin:8px 0 0;padding:0}.field-art{display:block;width:100%;height:auto;overflow:visible}
.field-turf{fill:var(--panel);stroke:var(--line);stroke-width:1}.field-zone{fill:var(--soft-green);stroke:var(--line);stroke-width:1;transition:fill .4s}.field-zone.has-ball{fill:var(--green);fill-opacity:.28}
.field-zone.scored{animation:field-score 1.6s ease-out}
.field-yard{stroke:var(--line);stroke-width:1;stroke-opacity:.7}.field-yard.minor{stroke-opacity:.28}
.field-number{font:600 8px var(--mono);fill:var(--muted);fill-opacity:.8}.field-team{font:700 10px var(--mono);letter-spacing:.08em;fill:var(--ink)}
.field-red{fill:var(--red);fill-opacity:0;transition:fill-opacity .4s}.red-zone .field-red{fill-opacity:.14}
.field-first{stroke:var(--amber);stroke-width:2;stroke-dasharray:4 3}.field-scrimmage{stroke:var(--green);stroke-width:2}
.field-ball,.field-first,.field-scrimmage{transition:transform .8s cubic-bezier(.22,.61,.36,1)}
.field-facing{transition:transform .3s}.field-pigskin{fill:var(--amber);stroke:var(--on-accent);stroke-width:1}.field-lace{stroke:var(--on-accent);stroke-width:1.2}
.field-arrow{fill:var(--green);animation:field-nudge 1.4s ease-in-out infinite}
.field-trail{stroke:var(--amber);stroke-width:3;stroke-linecap:round;stroke-opacity:.7;animation:field-fade 1.4s ease-out forwards}
.idle .field-ball,.idle .field-first,.idle .field-scrimmage{visibility:hidden}.field-first.off{visibility:hidden}
.field-line{display:flex;align-items:baseline;gap:8px;margin-top:6px;font:11px/1.5 var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.field-down{font-weight:700;color:var(--ink)}.field-clock{margin-left:auto}
.field-play{margin-top:3px;font:13px/1.4 var(--serif);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.field-timeouts{display:flex;justify-content:space-between;margin-top:3px;font:10px var(--mono);color:var(--muted);letter-spacing:.1em}
@keyframes field-nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
@keyframes field-fade{from{stroke-opacity:.7}to{stroke-opacity:0}}
@keyframes field-score{0%{fill:var(--amber);fill-opacity:.9}100%{fill:var(--green);fill-opacity:.28}}
@media(prefers-reduced-motion:reduce){.field-ball,.field-first,.field-scrimmage,.field-facing,.field-zone,.field-red{transition:none}.field-arrow,.field-trail,.field-zone.scored{animation:none}.field-trail{display:none}}

.saved-field .field-arrow,.saved-field .field-zone.scored{animation:none}
