/* MOORSACHI · onboarding card (onboard.js)
   House tokens only (--moor-*). VELVET-NOCTURNE correspondence card: it rises
   from the bottom on phones, centres on larger screens, and the page stays
   visible behind a soft scrim. Motion: VELVET Ambient Drift entrance
   cubic-bezier(0,0,.2,1) 450ms, exit 200ms. No overshoot; reduced motion
   is a plain fade. */
.onb { position: fixed; inset: 0; z-index: 1000; display: grid; align-items: end; justify-items: center; }
.onb[hidden] { display: none; }
.onb__scrim { position: absolute; inset: 0; background: rgba(9, 8, 14, 0.72); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); opacity: 0; transition: opacity 200ms linear; }
.onb__card {
  position: relative; width: min(100%, 30rem); max-height: 100dvh; overflow-y: auto; overscroll-behavior: contain;
  background: var(--moor-surface-elevated, #100F18); color: var(--moor-ink-primary, #F0ECF5);
  border: 1px solid var(--moor-hairline, rgba(155,111,212,.18)); border-bottom: 0; border-radius: 18px 18px 0 0;
  padding: 2rem 1.5rem max(1.5rem, env(safe-area-inset-bottom));
  transform: translateY(24px); opacity: 0;
  transition: transform 200ms cubic-bezier(0,0,.2,1), opacity 200ms linear;
}
.onb.is-open .onb__scrim { opacity: 1; }
.onb.is-open .onb__card { transform: none; opacity: 1; transition-duration: 450ms, 300ms; }
@media (min-width: 640px) {
  .onb { align-items: center; padding: 1.5rem; }
  .onb__card { border-bottom: 1px solid var(--moor-hairline, rgba(155,111,212,.18)); border-radius: 18px; padding: 2.5rem 2.25rem 2rem; }
}
html.onb-open { overflow: hidden; }

.onb__close { position: absolute; top: .75rem; right: .75rem; min-width: 44px; min-height: 44px; padding: 0 .75rem;
  background: none; border: 0; color: var(--moor-ink-soft, #8A82A0); font: 500 .7rem/1 var(--font-utility, "Barlow Condensed", sans-serif);
  letter-spacing: .2em; text-transform: uppercase; cursor: pointer; }
.onb__close:hover { color: var(--moor-ink-primary, #F0ECF5); }
.onb__eyebrow { margin: 0 0 .5rem; font: 500 .68rem/1 var(--font-utility, "Barlow Condensed", sans-serif); letter-spacing: .32em; color: var(--moor-purple-bright, #B591E0); }
.onb__title { margin: 0 0 1.5rem; font: 400 clamp(1.9rem, 6vw, 2.4rem)/1.05 var(--font-display, "Newsreader", Georgia, serif); }
.onb__title em { color: var(--moor-purple-bright, #B591E0); }

.onb__doors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-bottom: 1px solid var(--moor-hairline, rgba(155,111,212,.18)); margin-bottom: 1.25rem; }
.onb__door { min-height: 44px; padding: .5rem .25rem; background: none; border: 0; border-bottom: 1px solid transparent; margin-bottom: -1px;
  color: var(--moor-ink-soft, #8A82A0); font: 500 .72rem/1.2 var(--font-utility, "Barlow Condensed", sans-serif); letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.onb__door[aria-selected="true"] { color: var(--moor-ink-primary, #F0ECF5); border-bottom-color: var(--moor-gold-hairline, #C8AF78); }

.onb__lede { margin: 0 0 1.25rem; font: italic 400 1.05rem/1.45 var(--font-display, "Newsreader", Georgia, serif); color: var(--moor-ink-secondary, rgba(240,236,245,.85)); }
.onb__field { display: grid; gap: .4rem; margin-bottom: 1rem; }
.onb__field[hidden] { display: none; }
.onb__field span { font: 500 .66rem/1 var(--font-utility, "Barlow Condensed", sans-serif); letter-spacing: .22em; text-transform: uppercase; color: var(--moor-ink-soft, #8A82A0); }
.onb__field input, .onb__field textarea {
  width: 100%; box-sizing: border-box; min-height: 48px; padding: .8rem .9rem; border-radius: 0;
  background: var(--moor-surface-card, #1a1525); color: var(--moor-ink-primary, #F0ECF5);
  border: 1px solid var(--moor-hairline, rgba(155,111,212,.18)); font: 400 1rem/1.4 var(--font-body, "Barlow", sans-serif); }
.onb__field textarea { resize: vertical; min-height: 7rem; }
.onb__field input:focus-visible, .onb__field textarea:focus-visible { outline: 2px solid var(--moor-purple-bright, #B591E0); outline-offset: 1px; }
.onb__field :invalid:not(:placeholder-shown):not(:focus) { border-color: #D98C8C; }
.onb__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.onb__submit { width: 100%; min-height: 52px; margin-top: .25rem; border: 0; cursor: pointer;
  background: var(--moor-purple, #9B6FD4); color: #09080E;
  font: 600 .78rem/1 var(--font-utility, "Barlow Condensed", sans-serif); letter-spacing: .2em; text-transform: uppercase; }
.onb__submit:hover { background: var(--moor-purple-bright, #B591E0); }
.onb__submit:disabled { opacity: .6; cursor: progress; }
.onb__submit:focus-visible, .onb__door:focus-visible, .onb__close:focus-visible, .onb__link:focus-visible { outline: 2px solid var(--moor-purple-bright, #B591E0); outline-offset: 3px; }
.onb__status { min-height: 1.3em; margin: .9rem 0 0; font: 400 .92rem/1.4 var(--font-body, "Barlow", sans-serif); color: var(--moor-ink-secondary, rgba(240,236,245,.85)); }
.onb__status a { color: var(--moor-purple-bright, #B591E0); }
.onb__fine { margin: .5rem 0 0; font: 400 .78rem/1.4 var(--font-body, "Barlow", sans-serif); color: var(--moor-ink-soft, #8A82A0); }

.onb__done { padding: 1rem 0 .5rem; }
.onb__done-title { margin: 0 0 .5rem; font: 400 2.4rem/1 var(--font-display, "Newsreader", Georgia, serif); }
.onb__done-line { margin: 0 0 1.5rem; font: italic 400 1.1rem/1.45 var(--font-display, "Newsreader", Georgia, serif); color: var(--moor-ink-secondary, rgba(240,236,245,.85)); }
.onb__link { min-height: 44px; padding: 0; background: none; border: 0; border-bottom: 1px solid var(--moor-purple-bright, #B591E0); color: var(--moor-purple-bright, #B591E0);
  font: italic 400 1rem/1 var(--font-display, "Newsreader", Georgia, serif); cursor: pointer; }

/* inline hero/closing forms after a stored entry */
.hero__form.is-received .hero__input { opacity: .5; }

@media (prefers-reduced-motion: reduce) {
  .onb__card, .onb.is-open .onb__card { transform: none; transition: opacity 200ms linear; }
}