/* =====================================================================
   ROUND 136, B1 (the second half): the step number beside its photographs,
   not level with the bottom of them.

   WHAT IS WRONG. A sub-step's number is baseline-aligned to the first line of
   its body -- `recipe-v3.css:935`, `.sstep { align-items: baseline }`, which
   round R3 added ON PURPOSE and for a good reason written in that file: with
   the tops aligned instead, "as soon as the body began with a list or a
   nested step the number floated 16, 40, even 112 pixels ABOVE the line it
   belongs to."

   What baseline alignment does not survive is a first line that is TALLER
   than text. The two boxes share a baseline, so when the body opens with a
   ROW OF PHOTOGRAPHS the shared baseline is the bottom of the photographs and
   the number goes down there with it.

   MEASURED on all 172 published recipes, rendered at 1440:

       8 sub-steps on 3 recipes have the number more than 60px below the top
       of its own step, and every one of the 8 opens with a `.pshots` row:

         /recipes/burger-buns/              1.4 (235px)  2.3 (148)
                                            3.4 (148)    4.3 (235)
         /recipes/czech-rye-bread/          1.4 (148)    3.6 (148)  + one 235
         /recipes/rustic-bread-or-baguettes/ 1.4 (148)

       Zemlovka has none, and is untouched by this file.

   WHY THIS SELECTOR AND NOT `align-items: flex-start` ON `.sstep`. The brief
   is explicit -- "Scope to affected sub-steps only -- do NOT restyle all 169".
   `:has(> .sbody > .pshots:first-child)` matches a sub-step whose body OPENS
   with a photograph row and nothing else, so it cannot reach the 1,886
   sub-steps that are correct, and it cannot reintroduce R3's bug: that was
   about a body beginning with a LIST or a NESTED STEP, neither of which
   matches this.

   The number is top-aligned with a nudge down, so it sits on the first
   photograph's top edge rather than above it -- the same optical place it
   occupies on a sub-step whose body is text.

   ITS OWN SWITCH: `site_r136_stepnum`, OFF by default.
   ROLLBACK: site_r136_stepnum off.
   ===================================================================== */

.ttc-v2 .card.step .sstep:has(> .sbody > .pshots:first-child) {
  align-items: flex-start;
}
.ttc-v2 .card.step .sstep:has(> .sbody > .pshots:first-child) > .lead {
  padding-top: 2px;
}