/* r72.7.3 tap targets: invisible hit areas, no layout or paint change.
   Pseudo boxes are transparent; padding swaps are paired with equal negative margins.
   Expansions stop at the midpoint of the gap to any neighbouring control. */

/* header: wordmark and the round More button */
a.logo{position:relative}
a.logo::after{content:'';position:absolute;left:0;right:0;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px))}
.sn-more-btn{position:relative}
.sn-more-btn::after{content:'';position:absolute;inset:min(-1px,calc(50% - 22px))}

/* event hero video credit "i": hero clips at its edges, so the box leans up and left */
.e-hero .hv-credit.hv-i .hv-i-ic::after{top:-20px;right:-12px;bottom:-8px;left:-16px}

/* photo credit "i" buttons: 18px dot, box from 42 to 44 (boat card keeps its own 44 square) */
.ci-b::after{inset:-13px}
#boatBadge .bb-band .ci-b.ci-at-bb-cr::after{inset:0}

/* event facts: Details and All hours toggles, venue name link */
.fx-more summary{position:relative;z-index:1}
.fx-more summary::after{content:'';position:absolute;left:-4px;right:-4px;top:calc(50% - 22px);bottom:calc(50% - 22px)}
/* the b.fx-h block holds only the venue link, so the box spans both lines of a wrapped name */
.e-facts.fx .fx-h{position:relative}
.e-facts.fx .fx-h>a::after{content:'';position:absolute;left:0;right:0;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px))}

/* Sources & verification toggle: 4px more padding, cancelled by 4px negative margin */
.vf>summary{position:relative;z-index:1;padding-top:16px;padding-bottom:16px;margin-top:-4px;margin-bottom:-4px}
html.t-editorial .vf>summary{padding-top:16px;padding-bottom:16px}

/* footer: stacked links split the 6px gap, Feedback pill grows to 44 */
.foot-links>a{position:relative}
.foot-links>a::after{content:'';position:absolute;left:0;right:0;top:-3px;bottom:-3px}
.foot-links>a.fb-foot::after{top:min(-3px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px))}

/* home hero: pause button, Watch and Save, slide dots (dots split their 6px gap) */
.hv-btn::after{content:'';position:absolute;inset:min(0px,calc(50% - 22px))}
.hero .hero-cta .btn.play{position:relative}
.hero .hero-cta .btn.play::after{content:'';position:absolute;left:0;right:0;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px))}
.hero .hero-cta .btn.round.save{position:relative;top:auto;right:auto;bottom:auto;left:auto}
/* Save grows to the right only, so it never reaches into Watch & explore */
.hero .hero-cta .btn.round.save::after{content:'';position:absolute;inset:min(0px,calc(50% - 22px));left:0;right:min(0px,calc(100% - 44px))}
.hero-dots>button::after{content:'';position:absolute;left:-3px;right:-3px;top:calc(50% - 22px);bottom:calc(50% - 22px)}

/* weekend card link */
.wkd-all{position:relative}
.wkd-all::after{content:'';position:absolute;left:0;right:0;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px))}

/* filter row: Filters, Near me, area segment, category chips (row has 2px padding, boxes stay inside it) */
.fx-row .fx-btn,.fx-row .fx-near,.fx-row .fx-seg .rg,.fx-row .chip{position:relative}
.fx-row .fx-btn::after,.fx-row .fx-near::after,.fx-row .fx-seg .rg::after,.fx-row .chip::after{content:'';position:absolute;left:0;right:0;top:min(0px,calc(50% - 22px));bottom:min(0px,calc(50% - 22px))}

/* hero slide dots clip their progress bar; let the hit box out and keep the rounded ends on the bar itself */
.hero-dots>button{overflow:visible}
.hero-dots>button i{border-radius:2px}
/* r72.7.3b All picks: chips 33px and Sort select 32px -> 44px hit, nothing visible moves.
   Chips: ::before (the .on chip already uses ::after for its x). The chip row is a scroll container, so it gets +2px bottom
   padding with -2px margin to stop the pseudo being clipped. Up 7 (into the 10px gap under the search), down 4 (the select's
   hit area takes the other 6 of the 10px gap). */
.ap-chips{padding-bottom:4px;margin-bottom:-2px}
.ap-chip{position:relative}
.ap-chip::before{content:'';position:absolute;left:0;right:0;top:-8px;bottom:-5px}
/* Sort: a select can't carry a pseudo, so its box grows by 6px top and bottom as transparent border, pulled back with -6px
   margins; the old 1px border is an inset shadow on the padding box and the fill is clipped to it, so the drawn box is the same 32px. */
.ap-sort select{border:0 solid transparent;border-top-width:6px;border-bottom-width:6px;margin-top:-6px;margin-bottom:-6px;
  padding:7px 29px 7px 11px;min-height:44px;background-clip:padding-box;box-shadow:inset 0 0 0 1px var(--line);
  border-radius:8px/14px;background-position:right 10px center}
/* Bottom tab bar: opaque, like the sticky header (Reme: nothing shows through). Covers the safe-area padding too (it is padding). */
.sn-tabs{background:var(--bg,#0b0b0c);-webkit-backdrop-filter:none;backdrop-filter:none}
html.t-editorial .sn-tabs{background:rgb(245,242,236)}
html .tp-page .sn-tabs{background:var(--tp-bg,var(--bg,#0b0b0c))}
/* rail "See all →" text pills under rails: 24px tall; card is 14px above, nothing tappable for ~38px below. Invisible hit box: 7px up (gap midpoint), 14px down = 45px (44 measured as 43.5 subpixel at 13) */
.row:not(.hh-row)>.row-more .row-seeall{position:relative}
.row:not(.hh-row)>.row-more .row-seeall::before{content:"";position:absolute;left:-6px;right:-6px;top:-7px;bottom:-14px}
/* r72.7.3b2 photo credit "i" in Sources: #ev .verify has content-visibility:auto, whose paint containment clips the dot's
   hit box at the section's left and bottom edges. Grow the section box with padding swapped for equal negative margin
   (.e-main section margin-bottom is 56px, so 16+40), nothing drawn moves; then the dot's box is 46x46. */
#ev .e-main section.verify.vf-wrap{padding-left:16px;margin-left:-16px;padding-bottom:16px;margin-bottom:40px}
.ci-b.ci-at-photoCredits::after{inset:-14px}