/* Fishing Hook Size Chart (ROADMAP-Calcs-Marine.md GM3) — the calibration card, the to-scale
   hook and the millimetre ruler. Everything else comes from the core stylesheet. */
.chqt-hook-cal { margin-top: 1rem; }
.chqt-hook-cal summary { cursor: pointer; font-weight: 600; }
/* ⚠️ NO max-width. This box IS the ruler: clamping it to its column makes the scale it sets
   wrong, silently — the production gate caught it stuck at 281px while the slider moved. The
   wrapper scrolls instead, so a card wider than the column is still a card. */
.chqt-hook-cardwrap { overflow-x: auto; margin: .75rem 0; }
.chqt-hook-card {
  height: 54px; border: 2px dashed var(--chqt-accent, #136C79); border-radius: 8px;
  background: var(--chqt-cream, #F1F5F7); display: flex; align-items: center; justify-content: center;
  font-size: .85rem; font-weight: 600; max-width: none; flex: none;
}
.chqt-hook-cal input[type="range"] { width: 100%; height: 44px; }
.chqt-hook-fig svg { width: 100%; height: auto; display: block; }
.chqt-hook-ruler { overflow-x: auto; padding: .5rem 0 0; }
.chqt-hook-ruler svg { display: block; height: auto; }
.chqt-hook-chart { width: 100%; border-collapse: collapse; font-size: .95rem; }
.chqt-hook-chart caption { text-align: left; font-weight: 600; padding-bottom: .5rem; }
.chqt-hook-chart th, .chqt-hook-chart td { padding: .4rem .55rem; border-bottom: 1px solid var(--chqt-line, #D5E1E7); text-align: left; vertical-align: top; }
.chqt-hook-chart tbody th { font-weight: 700; white-space: nowrap; }
.chqt-hook-chart tr[data-hit="1"] th, .chqt-hook-chart tr[data-hit="1"] td { background: var(--chqt-cream, #F1F5F7); }
.chqt-hook-chart tr[data-band="1"] th { box-shadow: inset 3px 0 0 var(--chqt-accent, #136C79); }
.chqt-hook-chart .chqt-hook-na { color: var(--chqt-page-muted, #4F646F); }
.chqt-hook-types h3, .chqt-hook-src h3 { font-size: 1rem; margin: .9rem 0 .25rem; }
.chqt-hook-types p, .chqt-hook-src p { margin: 0 0 .6rem; }
@media print { .chqt-hook-cal, .chqt-actions { display: none; } }
.chqt-hook-cal input[type="range"] { font-size: 16px; }
