/* ===================================================================
   SEO BATCH 3, STEP 1 — THE TOP BAND KEEPS ITS RESERVED HEIGHT.
   Requested only when `ad_top_hold_live` is on (app/adtophold.py). With the
   switch off this file is not linked, not a request, not a byte and not a
   rule anywhere on the site.

   WHAT IT IS FOR, MEASURED ON /recipes/ BEFORE A LINE OF IT WAS WRITTEN.
   The top band ships from the server already `is-armed` at 150px — the one
   slot on the site that is genuinely above the fold, so the one slot that is
   not left to an observer. AdSense then answers `unfilled`, ad-slots.js calls
   collapse(), `is-empty` is `display: none !important`, and the band goes
   150px -> 0 in a single frame about thirteen seconds in:

       8,053 ms   .ttc-adtop 150px tall, ins.adsbygoogle 0
      12,899 ms   .ttc-adtop 0px        <- one frame
                  the band, the search row, the card grid and every card
                  below move up 150px.    CLS 0.118 in that one step

   That single collapse is 0.118 of a 0.156 CLS on a throttled phone — nearly
   all of it. The pictures are not the cause: all 172 carry width, height,
   srcset and sizes and the grid never resizes. The SPACE ABOVE THEM does.

   SO THE TOP SLOT KEEPS ITS SPACE IN EVERY STATE BUT FILLED. Nothing is
   painted in it — no frame, no border, no label, no background; every painted
   property still hangs off `is-filled` one level in, on `.ttc-ad__box`, and
   `.ttc-ad:not(.is-filled) .ttc-ad__box { pointer-events: none }` already
   keeps an unfilled slot transparent to the pointer. What the reader gets is
   blank space that does not move, which is the whole point.

   THIS REVERSES ROUND 97's "no empty box, ever" FOR ONE SLOT, DELIBERATELY,
   AND ONLY FOR THAT ONE. 97's rule is right for a slot a reader has not
   reached: holding space open for something that may never come, a screen
   below the fold, costs a reader and buys nothing. The top band is the one
   slot where the opposite is true — it is ON the screen at first paint, so
   the choice is not "space or no space" but "space, or space that vanishes
   underneath the reader". Every other slot on the site is untouched by this
   file: `.ttc-ad--top` is on the top band and nowhere else (app/adboxes.
   top_band passes `extra='ttc-ad--top'`), and the selectors below are scoped
   to `.ttc-adtop` as well, so a future slot that borrowed the class outside
   the band would still not match.

   NOTHING ABOUT THE AD IS TOUCHED. No unit id, no ad format, no `ad_slots`
   row, no AdSense call, no script. The <ins> is the same element, at the same
   width, asking for the same thing at the same moment. This file changes one
   grid track and one `display`.

   WHY 150px IS WRITTEN OUT. The band's own armed rule states the number as a
   literal rather than as `var(--adh-*)` — see "B.3: THE TOP BAND IS CAPPED BY
   THE REQUEST" at the foot of ad-slots.css — and this rule has to agree with
   that one exactly, or the held height and the armed height would differ and
   the page would move anyway. It is app/adboxes.TOP_CAP_PX, and
   tools/seo3_adtop_gate.py FAILS if the three stop agreeing.

   AND THE 760px BAND IS NOT A MISTAKE IN THE ORIGINAL — it is dead. The sheet
   says `grid-template-rows: auto` for the armed band inside
   `@media (max-width: 760px)`, and then states the unconditional 150px rule
   AFTER it at the same specificity, so 150px wins at every width. Measured:
   the band is 150px tall at 390 as well as at 1440. One rule, one number, no
   breakpoint — which is also why there is no media query below.
   =================================================================== */

/* THE HOLD. `:not(.is-filled)` is the whole state logic: resting, armed,
   `is-empty` (Google said unfilled) and `is-orphan` (no answer, drew
   something) all keep the height; `is-filled` is left completely alone, so an
   ad that lands still sizes the row to its own creative exactly as it does
   today.

   FOUR CLASSES, WHICH IS NOT DECORATION. `.ttc-ad.is-orphan:not(.is-filled)`
   is three and `.ttc-ad.is-armed:not(.is-filled):not(.is-orphan)` is five, so
   this rule is written to out-specify the first and to agree with the second
   rather than fight it — the two can only ever say 150px together. */
.ttc-adtop .ttc-ad.ttc-ad--top:not(.is-filled),
.ttc-adtop .ttc-ad.ttc-ad--top.is-orphan:not(.is-filled) {
  grid-template-rows: 150px;
}

/* AND `is-empty` TAKES THE ELEMENT OUT OF THE FLOW, so the track alone is not
   enough: `.ttc-ad.is-empty` is `display: none !important; height: 0
   !important`. Both are put back here, and nothing else from that block is —
   the margin, the padding and the border stay at 0, because the clip never
   paints and must not start now.

   `[data-ad-empty]` is in the same block in ad-slots.css as a belt to the
   class; it is matched here for the same reason, so the two cannot disagree
   if the script ever sets one without the other. */
.ttc-adtop .ttc-ad.ttc-ad--top.is-empty,
.ttc-adtop .ttc-ad.ttc-ad--top[data-ad-empty] {
  display: grid !important;
  height: auto !important;
  min-height: 0 !important;
}

/* THE LABEL STAYS HIDDEN. ad-slots.css hides it on `is-empty` and that is
   kept: the reserved band is blank SPACE, not an empty box with the word
   "Advertisement" standing over nothing. Restated rather than inherited so
   that this file cannot be read as holding the box open. */
.ttc-adtop .ttc-ad.ttc-ad--top.is-empty .ttc-ad__label,
.ttc-adtop .ttc-ad.ttc-ad--top[data-ad-empty] .ttc-ad__label {
  display: none !important;
}
