/* ============================================================================
   Med&X member portal v2: THE OPENING (js/intro.js decides when, js/opening.js draws it), direction C "House lights"
   (Alen picked C for everything, 1 Oct 2026). In the app only: html[data-mx-intro="guest" | "member"] is set by the app's
   native/boot.js on a plain cold launch, and js/opening.js adds html.mx-op while it plays and holds the screen. A browser
   never has either, so nothing here applies on the web. Transform and opacity only.
   ========================================================================== */

/* the layer: the two halves of the house's dark, the pool of light, the mark's shade and the mark, above everything the
   page draws. It never takes a tap (a tap skips the opening through a window listener, opening.js) */
#mx-op { position: fixed; inset: 0; z-index: 2147483000; pointer-events: none; overflow: hidden; -webkit-user-select: none; user-select: none; }
.mx-op-sheet { position: absolute; left: 0; right: 0; top: 0; pointer-events: none; will-change: transform; }
#mx-op .mx-op-mark { position: absolute; left: 0; top: 0; transform-origin: 0 0; will-change: transform; }
#mx-op .mx-op-mark svg { display: block; overflow: visible; }
/* the page does not scroll under it */
html.mx-op-lock, html.mx-op-lock body { overflow: hidden; }
/* the hero (its photo, its melt and its words, one picture) sits above the page while it plays, so its own melt is the
   curtain the page rides under; each piece that glides is its own layer, placed on sub-pixels and never re-rastered */
html.mx-op .mx-home > .mx-today[data-hx] { z-index: 3; }
html.mx-op :is(.mx-hx-stage, .mx-home > .mx-today[data-hx] > .mx-today-body, .mx-home > .mx-today[data-hx] + .mx-p, #mx-tabbar, .mx-greet-dot, .mx-mt-caps, .mx-wb-gc, .mx-wb-gcap, .mx-cb-seat, .mx-wel-stage, .mx-wel-words) { will-change: transform; }
/* the photo drawn at one interpolation quality while the camera moves and until the hand-over: WebKit otherwise swaps its
   low and high quality image filters from frame to frame while a picture is rescaled, and once more as the scale comes to
   rest (a hop over the whole room, C round 8 on the Gala's settle) */
html.mx-op :is(.mx-today-photo img, .mx-wel-photo) { image-rendering: -webkit-optimize-contrast; }
/* nothing the opening moves eases on its own (the web tab bar's hide transition, a control's press) */
html.mx-op :is(#mx-tabbar, .mx-mt-caps, .mx-wb-gc, .mx-wb-gcap, .mx-cb-seat, .mx-greet-dot, .mx-today-body, .mx-hx-stage, .mx-wel-words, .mx-wel-stage) { transition: none !important; }
/* the bar's logo (and the welcome's lockup) stays hidden under the mark until the first scroll, touch or navigation hands over to it */
html.mx-op-slot :is(#chrome .mx-brand, .mx-wel-logo) .mx-cb-wm { opacity: 0; }
/* the guest's welcome: its entrance is the opening's (auth.js skips its own cascade) */
html[data-mx-intro="guest"] .mx-auth-screen[data-auth="welcome"] .mx-wel-stage { overflow: visible; }