/* Whole-card taps (2026-11-04, owner: "Sometimes in some menus you have to click the text. I want the whole thing (the
   button with text) to be clickable, so the player can tap anywhere to continue.")
   A card that looks like one button IS one button. The card's main action stays the real <button> it always was (its id,
   data-tm, keyboard, focus and accessible name are untouched, and there is still exactly one click event, on that button);
   its ::after is stretched over the whole card, so a tap on the title, the stars or the picture lands on the button.
   Any other button in the card (Month's "This month's lane", a challenge's Delete) sits above the stretch and keeps its
   own job. A disabled main button (a locked lane) gets no stretch: the card stays inert.
   The rule for new markup: .wcMain on the card's main button, in a container that has no other fixed layout concerns
   (docs/rules/presentation.md, "A card that looks like a button is the button").
   The main button never moves on press (a transform would make it the pseudo-element's box and shrink the tap area
   mid-press, losing the click), the CARD does: hover, press and focus styles are on the card. */

/* the cards */
:is(.tvLanes li, .colGrid li, .badgeTrack, .tvDaily, .feat-card, li:has(> .wcMain)){position:relative}

/* the main buttons, stretched */
:is(.tvLanes li > .tvRight > button, .colGrid li > button, .badgeTrack > .badgeUse, .tvDaily > #bSoloDaily,
    .feat-card > .btn:not([hidden]), .feat-card .totmBtns > .btn:first-child, li > .wcMain):not(:disabled){
  position:static!important;transform:none!important}
:is(.tvLanes li > .tvRight > button, .colGrid li > button, .badgeTrack > .badgeUse, .tvDaily > #bSoloDaily,
    .feat-card > .btn:not([hidden]), .feat-card .totmBtns > .btn:first-child, li > .wcMain):not(:disabled)::after{
  content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}

/* the card's own pressed / hover / focus look */
:is(.tvLanes li, .colGrid li, .badgeTrack, .tvDaily, .feat-card, li:has(> .wcMain)):has(:is(.tvRight > button, .colGrid li > button, .badgeUse, #bSoloDaily,
    .feat-card > .btn:not([hidden]), .totmBtns > .btn:first-child, .wcMain):not(:disabled):active){transform:translateY(2px)}
@media (hover:hover){
  :is(.tvLanes li, .colGrid li, .badgeTrack, .tvDaily, .feat-card, li:has(> .wcMain)):has(:is(.tvRight > button, .colGrid li > button, .badgeUse, #bSoloDaily,
      .feat-card > .btn:not([hidden]), .totmBtns > .btn:first-child, .wcMain):not(:disabled):hover){filter:brightness(1.1)}
}
:is(.tvLanes li, .colGrid li, .badgeTrack, .tvDaily, .feat-card, li:has(> .wcMain)):has(:is(.tvRight > button, .colGrid li > button, .badgeUse, #bSoloDaily,
    .feat-card > .btn:not([hidden]), .totmBtns > .btn:first-child, .wcMain):focus-visible){outline:2px solid var(--flame,#ffad47);outline-offset:2px}

/* a second action in a stretched card stays its own button, above the stretch */
:is(.feat-card .totmBtns > .btn:not(:first-child), li:has(> .wcMain) > button:not(.wcMain)){position:relative;z-index:5}
