/* Chapter 3: shutter speed and motion. Builds on the playground styles in exposure.css. */

.total .kicker{margin:0 0 6px;font-family:var(--sans);font-size:15px;font-weight:600;color:var(--muted);min-height:0}
.safe-line{margin:0;font-family:var(--sans);font-size:15px;font-weight:600;color:var(--on-body-muted)}
.safe-line span{color:var(--sharp);font-weight:800}
.presets-row{padding-top:20px}

/* Full-stop shutter speeds, green when they're safe to hold by hand */
.speed-strip{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px;font-family:var(--sans);font-variant-numeric:tabular-nums}
.speed-strip span{padding:4px 9px;border-radius:999px;border:1.5px solid var(--rule);font-size:14px;font-weight:700;color:var(--muted)}
.speed-strip span.safe{border-color:color-mix(in srgb,var(--sharp) 70%,var(--ink));color:var(--ink);background:color-mix(in srgb,var(--sharp) 22%,transparent)}
.speed-strip span.now{box-shadow:0 0 0 2px var(--amber)}


@media (max-width:560px){
  .control .segmented button{font-size:13px}
}