/* The page beside a panel snapped to a side (Explore since 2026-10-08; the
   Write-up popup joined it the same day). TMB.pageShift
   (scripts/tmb-common.js) sets body.tmb-shift and --tmb-shift-left /
   --tmb-shift-right, the width taken on each side: the page gives the panel
   its column and is covered nowhere. The body's margin moves everything in
   the flow; what is fixed or sized off the screen is moved here, one rule
   each:
   - .header stays the full width of the screen (a panel starts under it).
     It has no `left` of its own, so without one it would start where the
     body now does.
   - the footer bar and the sport bar span the page's room, not the screen.
     The sport bar is "100vw, pulled out to the screen's edges" in front.css:
     the same sum with the panels' widths taken off. The page's content
     column is centred in the room left, so the pull-out is half the two
     widths together, whichever side each panel is on.
   - the slide-out menu and its flyout open beside a panel snapped left, not
     behind it (their own `left` is 0 and 310px: the same with no shift).
   New page chrome that is position: fixed or sized in vw gets a rule here,
   or it sits under the panel. Desktop only: the scripts set none of this
   below the phone breakpoint. Loaded once a page (TMB_PAGE_SHIFT_CSS) by
   includes/explore-dock.php and admin/bet/includes/bet-writeup-modal.php. */
body.tmb-shift { margin-left: var(--tmb-shift-left, 0px); margin-right: var(--tmb-shift-right, 0px); }
body.tmb-shift .header { left: 0; }
body.tmb-shift footer, body.tmb-shift .footer { width: auto; left: var(--tmb-shift-left, 0px); right: var(--tmb-shift-right, 0px); }
body.tmb-shift .tmb-sport-bar {
    width: calc(100vw - var(--tmb-shift-left, 0px) - var(--tmb-shift-right, 0px));
    margin-left: calc(-50vw + 50% + (var(--tmb-shift-left, 0px) + var(--tmb-shift-right, 0px)) / 2);
    margin-right: calc(-50vw + 50% + (var(--tmb-shift-left, 0px) + var(--tmb-shift-right, 0px)) / 2);
}
body.tmb-shift #sidebarMenu { left: var(--tmb-shift-left, 0px); }
body.tmb-shift #sbFlyout { left: calc(310px + var(--tmb-shift-left, 0px)); }