/* VSSGEO cleanup · lane "journey" · the flow between the front door, Log in, the map and Home.
   FRICTION items 3, 4, 6, 7, 13 (the draft, item 2, is journey.js). Loads on BOTH pages, in the HEAD, last:
   front door after frontdoor-r2.css; the map as the last stylesheet in server.py DOOR_TAGS[0].
   Tokens only (--vg-*); every rule works in both themes. Brand art from the front door's own /brand/ folder. */

/* ── 4 · FIRST PAINT IS THE PAGE COLOUR ─────────────────────────────────────────────────────────────────────────
   Evan's page paints html with his own --bg (#07090a) in BOTH themes, so light mode flashed black between the
   front door and the map (measured: one flat #080808 frame at ~420 ms, then cream). :root beats his html rule.
   The inline head patch in journey.md does the same before any stylesheet; this is the belt to its braces. */
:root{background:var(--vg-bg);color-scheme:dark}
:root[data-theme="light"]{color-scheme:light}

/* Measured after the fix: front door -> map in light mode is cream from the first frame to the map (no black
   frame); dark is #07090a throughout. The ~0.8 s of plain ground while Evan's page parses is the page colour,
   by design (no logo pop-in: on a fast load it would itself flash). */

/* ── 3 · SIGN-IN ON A CALM PAGE ─────────────────────────────────────────────────────────────────────────────────
   Opened from the front door (#auth=…&back=1 -> html.j-calm): the page colour and the logo where the front door
   keeps it, no map, no blur, no scrim; the card is the only thing on the page. Closing returns to the front door
   (door.js), so the map is never seen on this trip. */
html.j-calm body.door{background:var(--vg-bg)!important;border-color:transparent!important}   /* no map frame line */
html.j-calm body.door>:not(#auth){opacity:0!important;pointer-events:none!important;transition:none!important;animation:none!important}
html.j-calm body.door #auth{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.j-calm body.door #auth .in{box-shadow:var(--vg-shadow)}
html.j-calm body.door #auth .vbrand{display:none}                  /* one logo on the page: the one on the ground */
html.j-calm body.door::before{content:"";position:fixed;z-index:31;left:16px;top:16px;width:150px;height:78px;pointer-events:none;
  background:url("/vista100/brand/vssgeo-logo-dark.svg") left top/contain no-repeat;image-rendering:pixelated}   /* = the front door's rail logo */
:root[data-theme="light"].j-calm body.door::before{background-image:url("/vista100/brand/vssgeo-logo.svg")}
@media (max-width:760px){                                          /* = the front door's phone top bar wordmark */
  html.j-calm body.door::before{left:56px;top:19px;width:132px;height:16px;background-image:url("/vista100/brand/official/inverse-vssgeo-long-logo.svg")}
  :root[data-theme="light"].j-calm body.door::before{background-image:url("/vista100/brand/official/regular-vssgeo-long-logo.svg")}
}

/* ── 7 · PHONES: A WAY HOME FROM THE FULL-SCREEN REPORT ─────────────────────────────────────────────────────────
   journey.js adds .jhome (Evan's .wbtn look) after the back arrow; it only shows where the report covers Geo's
   panel and its Home button. */
body.door #panel .winbar .jhome{display:none}
@media (max-width:760px){
  body.door #panel.open .winbar .jhome{display:grid;place-items:center;color:var(--vg-ink)}
}

/* ── 13 · FRONT DOOR: ONE OF EACH ───────────────────────────────────────────────────────────────────────────────
   Was: 3× Open the map (rail, top bar, under the box), 2× Log in (rail foot, top bar), 2× How it works and
   2× Plans (rail, top bar), two logos (rail logo + top-bar wordmark).
   Now:  the rail = the product (logo, New question, Search your projects, Plans and pricing, How it works, account);
         the top bar = you (theme, Log in, Sign up free) + the Vista Site Selection link;
         the hero = the one way to the map ("No question yet? Open the map", right under the box).
   The protected logo stays in the rail; the top-bar wordmark only shows when the rail's logo can't be seen
   (rail collapsed, or a phone where the rail is a closed drawer). */
.fd .topnav a[data-modal],
.fd .topnav a[data-app="explore"],
.fd .rail .rail-nav a.rail-item[data-app="explore"],
.fd .rail .btn-login{display:none!important}
@media (min-width:761px){ .fd .rail:not(.collapsed)~.main .brandlab{display:none} }
@media (min-width:901px){ .fd .topnav a.out.hide-sm{display:inline-flex} }   /* the only thing left in the nav */
.fd .rail.collapsed~.main .brandlab em{display:none}      /* "by Vista Site Selection" + "↗ Vista Site Selection": once */

/* ── 6 · PHONES: LOG IN IN THE TOP BAR ──────────────────────────────────────────────────────────────────────────
   frontdoor-r2.css hid it under 420 px (it lived in the ☰ drawer, and 2 of 5 testers couldn't find it). It comes
   back, and "Sign up free" says "Sign up" there so ☰ · wordmark · theme · Log in · Sign up fit in 390 px. */
@media (max-width:420px){
  .fd .topbar .signed-out{gap:8px}
  .fd .topbar .signed-out .btn-ghost{display:inline-flex}
  .fd .topbar .signed-out .btn-ghost,.fd .topbar .signed-out .btn-solid{padding:0 12px}
  .fd .topbar .j-free{display:none}
}