/**
 * The light welcome — behind NLD_LIGHT_WELCOME (?light_welcome=1).
 *
 * Scoped to `body.light-welcome #splash-mask`, the gate every believer meets
 * before anything else. It was the last deep-forest screen left, which made it
 * the one place the redesign was contradicted at first sight: a dark lobby
 * opening onto a light app.
 *
 * The lobby is built from inline styles top to bottom — the mask's background,
 * the card, every paragraph's colour, the gold on the button — so nearly every
 * rule here carries !important. That is not a house style creeping in; it is
 * the only way a stylesheet reaches an inline style, and this screen is all of
 * them.
 *
 * The botanical SVGs are left exactly as they are. They are deep forest on a
 * dark field and they still read on pale ground — the leaves become a soft
 * green frame rather than a silhouette, which is what they were drawn as.
 */

/* Paul, 15 Aug: "too white" — the same note that landed on the shell's frame
   (nld-shell-light.css:33-39). This gradient predates that frame: it was
   written when the lobby was the only converted screen, using #f4f9fa /
   #e8f1f3 / #dfeaee, and it was never brought forward once the shell settled
   on an actual pastel rather than a near-white one. It is the identical
   mistake in the identical shape, just never revisited.

   Fixed by taking the shell's canonical three straight across — #e8f7f0 mint
   at the top, #e6f1f4 mint-blue in the middle, #dfeaf3 soft blue at the
   bottom — at the same 170deg angle and the same 0% / 55% / 100% stops this
   file already had, so the lobby keeps its own established shape and only
   the saturation catches up to the rest of the app.

   No corner glows. The shell's are there to give a long, scrollable page
   somewhere for the light to come from; this is one small centred card on a
   screen nobody scrolls, and a plain deepened gradient already reads as
   tinted rather than grain — adding glows here would be decorating a
   postage stamp. */
body.light-welcome #splash-mask {
    background: linear-gradient(170deg, #e8f7f0 0%, #e6f1f4 55%, #dfeaf3 100%) !important;
}

/* #auth-screen (partials/auth.blade.php) is the OTHER gate a believer can land
   on first — reached via #login/#register instead of the name-entry lobby, or
   after finishing the guest Day 1 walk. It was missed when the lobby above was
   converted: the card inside it (#F5F2E8 cream, dark text throughout) was
   already light, so it read as a lit card floating in a dark room rather than
   an all-dark screen — easy to miss for exactly that reason. Same gradient as
   the lobby mask, same !important, for the same reason: this screen too is
   built inline top to bottom. */
body.light-welcome #auth-screen {
    background: linear-gradient(170deg, #e8f7f0 0%, #e6f1f4 55%, #dfeaf3 100%) !important;
}

/* The card. It was cream on near-black, carrying a heavy drop shadow to lift
   it off the dark. On pale ground that shadow reads as grime, so it goes light
   and wide instead of dark and tight.

   #lobby-card, NOT `#splash-mask > div > div`. That structural selector was
   what shipped first and it also matched the 600px radial glow behind the
   card — flattening its gradient to solid white and putting a hard disc on
   screen where there had been a soft halo. A shape selector cannot tell the
   difference between the thing you meant and a decoration that happens to sit
   at the same depth. */
body.light-welcome #splash-mask #lobby-card {
    background: #fff !important;
    box-shadow: 0 20px 60px -24px rgba(20, 60, 70, 0.28) !important;
}

body.light-welcome #splash-mask h1 {
    color: #16333b !important;
}

/* The tagline and the Isaiah line, which share the serif italic voice. */
body.light-welcome #splash-mask p {
    color: #46626b !important;
}

body.light-welcome #splash-mask strong {
    color: #16333b !important;
}

/* The name field. */
body.light-welcome #splash-mask #lobby-name-wrap {
    background: rgba(47, 125, 140, 0.06) !important;
    border-color: rgba(47, 125, 140, 0.16) !important;
}

body.light-welcome #splash-mask #lobby-name-input {
    border-color: rgba(47, 125, 140, 0.24) !important;
    color: #16333b !important;
}

/* ── The way in ──────────────────────────────────────────────────────────────
   Gold on deep forest was a lantern in a dark room, and it was the right
   choice there. On pale ground the same gold reads as a warning strip, and it
   is the one control on the screen that must read as an invitation. It becomes
   the teal the rest of the redesign uses — the same gradient as the reading's
   seal and Home's hero, so the first button a believer ever presses is the
   colour every later one will be.

   All three ids are the same button wearing different labels: whether you are
   new, returning to a path, or signed in without one. */
body.light-welcome #splash-mask #begin-walk-btn,
body.light-welcome #splash-mask #return-path-btn,
body.light-welcome #splash-mask #auth-enter-btn {
    background: linear-gradient(160deg, #3a97a8 0%, #2f7d8c 100%) !important;
    box-shadow: 0 10px 26px -8px rgba(47, 125, 140, 0.62) !important;
}

body.light-welcome #splash-mask #begin-walk-btn div,
body.light-welcome #splash-mask #return-path-btn div,
body.light-welcome #splash-mask #auth-enter-btn div {
    color: #fff !important;
}

/* The second line inside the button ("Continue where you left off") is set at
   82% black inline, which on teal disappears. */
body.light-welcome #splash-mask #return-path-btn div:last-child,
body.light-welcome #splash-mask #auth-enter-btn div:last-child {
    color: rgba(255, 255, 255, 0.86) !important;
}

/* The sparkles are pale dots meant to catch light against near-black. On pale
   ground they are invisible at best and dirt at worst. */
body.light-welcome #splash-mask .lobby-sparkle {
    display: none !important;
}

/* #welcome-back-overlay and #welcome-tour-overlay (public/js/nld-main.js,
   showWelcomeBack/showWelcomeTour) — two more full-screen gates built
   entirely from inline styles, same as #splash-mask and #auth-screen above,
   just built at runtime instead of in the blade. Every text colour inside
   them is pale-on-near-black (#FAFBF5 headings, rgba(250,251,245,N) body
   copy at three different opacities, a barely-there rgba(250,251,245,0.07)
   card tint) — background alone is not enough here, unlike #auth-screen,
   whose card content was already light. Targeted by the exact inline value
   each element already carries, so this survives copy edits to the strings
   around them without becoming a structural/depth selector (see the
   #lobby-card lesson above). */
body.light-welcome #welcome-back-overlay,
body.light-welcome #welcome-tour-overlay {
    background: linear-gradient(170deg, #e8f7f0 0%, #e6f1f4 55%, #dfeaf3 100%) !important;
}

body.light-welcome #welcome-back-overlay [style*="color:#FAFBF5"],
body.light-welcome #welcome-tour-overlay [style*="color:#FAFBF5"] {
    color: #1F3A2C !important;
}

body.light-welcome #welcome-back-overlay [style*="color:rgba(250,251,245,0.72)"],
body.light-welcome #welcome-tour-overlay [style*="color:rgba(250,251,245,0.72)"] {
    color: rgba(31, 58, 44, 0.82) !important;
}

body.light-welcome #welcome-back-overlay [style*="color:rgba(250,251,245,0.6)"],
body.light-welcome #welcome-tour-overlay [style*="color:rgba(250,251,245,0.6)"] {
    color: rgba(31, 58, 44, 0.68) !important;
}

body.light-welcome #welcome-back-overlay [style*="color:rgba(250,251,245,0.5)"],
body.light-welcome #welcome-tour-overlay [style*="color:rgba(250,251,245,0.5)"] {
    color: rgba(31, 58, 44, 0.58) !important;
}

body.light-welcome #welcome-tour-overlay [style*="background:rgba(250,251,245,0.07)"] {
    background: rgba(11, 36, 20, 0.05) !important;
    border-color: rgba(201, 168, 76, 0.3) !important;
}

/* #routing-screen (new-life-daily.blade.php) — "Where are you right now?",
   shown once per device on first visit or right after logout, before the
   splash-mask lobby even mounts. A fourth full-screen dark gate this same
   welcome pass missed. The h2/p selectors are scoped by TAG, not just the
   inline colour value: #F5F2E8 is also the "still figuring out what I
   believe" button's text on its own green gradient a few lines down, which
   must stay light-on-green regardless of the surrounding theme. */
body.light-welcome #routing-screen {
    background: linear-gradient(170deg, #e8f7f0 0%, #e6f1f4 55%, #dfeaf3 100%) !important;
}

body.light-welcome #routing-screen h2[style*="color:#F5F2E8"] {
    color: #1F3A2C !important;
}

body.light-welcome #routing-screen p[style*="color:rgba(245,242,232,0.52)"] {
    color: rgba(31, 58, 44, 0.6) !important;
}

/* Both buttons already carry their own opaque backgrounds (a green gradient
   and #F5F2E8 cream) independent of the page behind them, so neither needs
   an override here — only the transparent gate around them did. */