@import url("../../cosmos/lessons/style.css");

/* ───────────────────────────────────────────────────────────────
   美式橄榄球的逻辑 / american_football track  (The Logic of American Football)
   Part of the 运动 · 球类的逻辑 group (Big Four sibling of basketball, baseball,
   hockey + soccer). Reuses the cosmos component sheet verbatim (kicker /
   source-note / takeaway / position-grid / lesson-flow / mini-flow /
   trade-table / toc-grid / widget / kpi-grid / dist-canvas). Widgets draw
   the gridiron, down-distance-yardline states, EP curves and coverages
   procedurally on a .dist-canvas — no images.
   ─────────────────────────────────────────────────────────────── */

/* A gridiron field canvas — same sizing contract as .dist-canvas. */
.field-canvas {
  width: 100%;
  display: block;
  border-radius: 10px;
  margin-top: 12px;
  background: #0a1f12;            /* turf green */
  border: 1px solid rgba(120, 200, 150, 0.18);
}

.key-row { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--text-mute); }
.key-row .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: middle; }