/*
 * Clarify confirmed-production bridge
 *
 * The visual-confirmation stylesheets are the source of truth. This file only
 * adapts their standalone page roots to the existing production DOM and modal
 * containers. It deliberately contains no new visual direction.
 */

html,
body {
  min-width: 320px;
  overflow-x: hidden;
}

body[data-confirmed-view] {
  background: #f3f1eb;
  color: #18201d;
}

body[data-confirmed-view]::before,
body[data-confirmed-view]::after {
  pointer-events: none;
}

.site-header > .product-nav:not(.product-nav--mobile) {
  position: static !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  backdrop-filter: none !important;
}

.site-header .wordmark,
.site-header a.wordmark {
  color: inherit;
  text-decoration: none;
}

.site-header .nav-item,
.site-header a.nav-item,
.product-nav--mobile a.nav-item {
  border-radius: 0;
  color: inherit;
  text-decoration: none;
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]) .logoorb,
body[data-confirmed-view]:not([data-confirmed-view="landing"]) .viewtog {
  display: none !important;
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) .bar.site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 80;
  width: 100%;
  min-height: 78px;
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 52px;
  border-bottom: 1px solid rgba(24, 32, 29, .08);
  background: rgba(243, 241, 235, .9);
  color: #18201d;
  pointer-events: auto;
  backdrop-filter: blur(15px);
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) .bar .brand-home {
  min-width: 66px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0;
  color: #18201d;
  text-decoration: none;
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) .bar .brand {
  font-family: "Newsreader", Georgia, serif;
  font-size: 32px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.055em;
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #productNav {
  position: static;
  left: auto;
  bottom: auto;
  z-index: auto;
  width: auto;
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: clamp(36px, 4.2vw, 66px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
  backdrop-filter: none;
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #productNav .nav-item {
  position: relative;
  min-height: 44px;
  padding: 0 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #68716c;
  font-size: 15px;
  font-weight: 500;
  line-height: 44px;
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #productNav .nav-item::after {
  position: absolute;
  right: 0;
  bottom: 1px;
  left: 0;
  height: 2px;
  background: #315c4a;
  content: "";
  opacity: 0;
  transform: scaleX(.65);
}

body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #productNav .nav-item.is-active::after,
body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #productNav .nav-item[aria-current="page"]::after {
  opacity: 1;
  transform: scaleX(1);
}

/* Birth Details: keep the production IDs while using the confirmed sheet. */
body[data-confirmed-view="birth"] .bar {
  top: 34px !important;
  right: auto !important;
  left: 46px !important;
  width: auto !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  pointer-events: auto !important;
}

body[data-confirmed-view="birth"] .bar .logoorb,
body[data-confirmed-view="birth"] .bar .viewtog,
body[data-confirmed-view="birth"] #productNav,
body[data-confirmed-view="birth"] #mobileProductNav {
  display: none !important;
}

body[data-confirmed-view="birth"] .bar .brand-home { gap: 0; }
body[data-confirmed-view="birth"] .bar .brand {
  color: #171c19;
  font-family: "Newsreader", Georgia, serif;
  font-size: 29px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.045em;
}

body[data-confirmed-view="birth"] #landing {
  display: block !important;
  min-height: 100svh;
  padding: 0 !important;
  overflow-x: hidden;
  isolation: isolate;
  background-color: #f4f1eb !important;
  background-image:
    linear-gradient(90deg, rgba(244, 241, 235, .01) 0%, rgba(244, 241, 235, .03) 47%, rgba(244, 241, 235, .38) 100%),
    url('/assets/ink-mirror/landing-confirmed-desktop-v101.jpg') !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}

body[data-confirmed-view="birth"] #landing::before,
body[data-confirmed-view="birth"] #landing::after { display: none !important; }

body[data-confirmed-view="birth"] #landing .birth-stage {
  width: min(100%, 1440px) !important;
  max-width: 1440px !important;
  min-height: 100svh !important;
  display: grid !important;
  grid-template-columns: minmax(390px, 1fr) minmax(590px, .93fr) !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 auto !important;
  padding: 88px clamp(48px, 4.5vw, 72px) 36px !important;
}

body[data-confirmed-view="birth"] #birthCard {
  position: relative;
  grid-column: 2;
  width: min(100%, 620px);
  max-width: 620px;
  display: block;
  justify-self: end;
  margin: 0;
  padding: 31px 43px 29px;
  overflow: visible;
  border: 1px solid rgba(21, 90, 59, .18);
  border-radius: 4px;
  background: rgba(250, 248, 243, .87);
  box-shadow: 0 30px 74px -56px rgba(23, 35, 30, .54), inset 0 1px 0 rgba(255, 255, 255, .74);
  backdrop-filter: blur(12px);
  color: #171c19;
}

body[data-confirmed-view="birth"] #birthCard::before {
  position: absolute;
  inset: 12px;
  z-index: -1;
  display: block;
  border: 1px solid rgba(21, 90, 59, .12);
  content: "";
  pointer-events: none;
}

body[data-confirmed-view="birth"] #birthCard[hidden],
body[data-confirmed-view="birth"] #landingIntro[hidden] { display: none !important; }

body[data-confirmed-view="birth"] #birthCard #cityInput {
  width: 100%;
  max-width: none;
  margin: 0;
}

body[data-confirmed-view="birth"] #birthCard #birthDetailsTitle,
body[data-confirmed-view="birth"] #birthCard .choice {
  text-transform: none;
}

body[data-confirmed-view="birth"] #birthCard .date-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1.25fr;
  gap: 10px;
  margin: 0;
}

body[data-confirmed-view="birth"] #birthCard .date-grid input {
  min-height: 49px;
  padding: 0 15px;
  border: 1px solid rgba(23, 28, 25, .18);
  border-radius: 10px;
  background: rgba(255, 255, 255, .48);
  color: #171c19;
  font: 500 16px "Manrope", sans-serif;
  text-align: left;
}

body[data-confirmed-view="birth"] #birthCard .date-grid label { gap: 6px; }

body[data-confirmed-view="birth"] #birthCard .choice {
  min-height: 50px;
  padding: 0;
  font: 500 14px "Manrope", sans-serif;
}

body[data-confirmed-view="birth"] #birthCard .optional-helper {
  margin-top: 9px;
  font-size: 11px;
  line-height: 1.5;
}

body[data-confirmed-view="birth"] #birthCard .next-note strong {
  font-size: 11.5px;
  line-height: 1.4;
}

body[data-confirmed-view="birth"] #birthCard .next-note span { line-height: normal; }

body[data-confirmed-view="birth"] #landingErr:empty { display: none; }

body[data-confirmed-view="birth"] #birthCard .date-grid .dtin::placeholder {
  color: #68716c;
  opacity: 1;
}

body[data-confirmed-view="birth"] #birthCard .cta {
  position: static;
  width: 100%;
}

body[data-confirmed-view="birth"] #birthCard .optional-grid > div {
  display: grid;
  gap: 6px;
}

body[data-confirmed-view="birth"] #birthCard .optional-grid > div > label > span {
  color: #606863;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
}

body[data-confirmed-view="birth"] #birthCard .optional-grid input {
  width: 100%;
  min-height: 49px;
  margin: 0;
  padding: 0 13px;
  border: 1px solid rgba(23, 28, 25, .18);
  border-radius: 10px;
  background: rgba(255, 255, 255, .48);
  color: #171c19;
  box-shadow: none;
  font: 500 16px/1 "Manrope", sans-serif;
}

body[data-confirmed-view="birth"] #birthCard .optional-details summary {
  border-radius: 0;
}

body[data-confirmed-view="birth"] #birthCard .legal-copy button {
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #303a35;
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Analysis / Identity roots are still a single production route. */
#reveal {
  position: fixed !important;
  inset: 0;
  z-index: 60;
  min-height: 100dvh;
  display: none;
  overflow-y: auto;
}

#reveal.on { display: block !important; }

body[data-confirmed-view="analysis"] #reveal::before,
body[data-confirmed-view="analysis"] #reveal::after,
body[data-confirmed-view="reading"] #reveal::before,
body[data-confirmed-view="reading"] #reveal::after { display: none !important; }

body[data-confirmed-view="analysis"] #reveal.is-analyzing .analysis-stage { display: grid !important; }
body[data-confirmed-view="analysis"] #reveal.is-analyzing .identity-hero { display: none !important; }
body[data-confirmed-view="reading"] #reveal.is-identity .analysis-stage { display: none !important; }
body[data-confirmed-view="reading"] #reveal.is-identity .identity-hero { display: grid !important; }

body[data-confirmed-view="analysis"] #reveal .analysis-state {
  position: static;
  z-index: auto;
  width: min(100%, 680px);
  min-height: 0;
  margin-top: -3.5vh;
  padding: 0;
  display: grid;
  place-items: initial;
  justify-items: center;
  text-align: center;
}

body[data-confirmed-view="analysis"] #reveal .analysis-state h1 {
  margin: 0;
  color: #1b211e;
  font: 400 clamp(38px, 3.45vw, 52px)/1.05 "Newsreader", Georgia, serif;
  letter-spacing: -.035em;
}

body[data-confirmed-view="analysis"] #reveal .analysis-live-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

body[data-confirmed-view="analysis"] #reveal #inlineAnalysis:has(> .analysis-live-status:only-child) {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0 !important;
  overflow: hidden;
}

body[data-confirmed-view="analysis"] .bar,
body[data-confirmed-view="analysis"] #mobileProductNav { display: none !important; }

body[data-confirmed-view="reading"] #reveal .rvtraits,
body[data-confirmed-view="reading"] #reveal .profile-map,
body[data-confirmed-view="reading"] #reveal .profile-summary { display: none !important; }

body[data-confirmed-view="reading"] #reveal .identity-continue { display: none !important; }

body[data-confirmed-view="reading"]:has(#reveal.on.is-identity) .bar.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 80;
}

body[data-confirmed-view="reading"] #reveal.on.is-identity {
  position: relative !important;
  inset: auto;
  min-height: 0;
  overflow: visible;
  background-color: #f4f1eb;
  background-image: url('/assets/ink-mirror/analysis-transition-desktop-v101.jpg');
  background-position: center top;
  background-size: 100% auto;
  background-repeat: repeat-y;
}

body[data-confirmed-view="reading"] #reveal #rvArch:focus-visible { outline: none; }

body[data-confirmed-view="reading"]:has(#reveal.on.is-identity) #result.on #scroll {
  padding-top: 0;
}

/* Six conclusions and the confirmed bottom offer. */
body[data-confirmed-view="reading"] #result.on {
  position: relative;
  z-index: 55;
  min-height: 100dvh;
  display: block;
  overflow: visible;
  background: transparent;
}

body[data-confirmed-view="reading"] #result.on #scroll {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

body[data-confirmed-view="reading"] #result.on #scroll > .reading-page {
  min-height: 100dvh;
}

/* A returning Reading opens directly on the approved free-reading canvas,
   whose header overlays the generous intro padding. The identity route keeps
   its own sticky, in-flow header above the portrait reveal. */
body[data-confirmed-view="reading"]:not(:has(#reveal.on.is-identity)) .bar.site-header {
  position: absolute !important;
  min-height: 82px;
  height: auto;
  padding: 28px 52px 10px;
  border-bottom: 0;
  background: transparent;
  backdrop-filter: none;
}

body[data-confirmed-view="reading"] #rdPreview .eyebrow {
  font-size: 12px;
  line-height: 1.2;
}

/* The Reading bundle also contains a generic .primary-action for the paid
   offer. Keep the two conversion actions visually distinct at their source. */
body[data-confirmed-view="reading"] #rdOpenGuestLifeBook {
  min-height: 60px;
  border: 1px solid #f8f6f1;
  background: #f8f6f1;
  color: #224a39;
  box-shadow: 0 18px 38px -25px rgba(0, 0, 0, .72);
}

body[data-confirmed-view="reading"] #rdOpenGuestLifeBook:hover {
  background: #e8eee9;
  border-color: #e8eee9;
  color: #173b2e;
}

body[data-confirmed-view="reading"] #rdBlueprintOffer .purchase-rail {
  min-height: 0;
  margin: 0;
}

body[data-confirmed-view="reading"] #rdBlueprintOffer #buyBpInline {
  min-height: 60px;
  border: 1px solid #224a39;
  background: #224a39;
  color: #fff;
  box-shadow: 0 18px 38px -24px rgba(34, 74, 57, .7);
}

body[data-confirmed-view="reading"] #rdBlueprintOffer #buyBpInline:hover {
  border-color: #163b2e;
  background: #163b2e;
  color: #fff;
}

body[data-confirmed-view="reading"] #rdBlueprintOffer .price-line strong,
body[data-confirmed-view="reading"] #rdBlueprintOffer .price-line span,
body[data-confirmed-view="reading"] #rdBlueprintOffer .primary-action,
body[data-confirmed-view="reading"] #rdBlueprintOffer .purchase-action > p {
  line-height: normal;
}

body[data-confirmed-view="reading"] #rdEntryMsg:empty { display: none; }

body[data-confirmed-view="reading"] #rdEntryMsg:not(:empty) {
  grid-column: 1 / -1;
  margin: 0;
}

/* Full-page sheets: the standalone confirmation roots own the canvas. */
#bpreader.account-reader,
#bpreader.confirmed-purchase-reader,
#bpreader.share-composer-reader,
#bpreader.referral-reader,
#bpreader.share-referral-reader,
#bpreader.preview-reader,
#legal.confirmed-legal {
  z-index: 100 !important;
  padding: 0 !important;
  background: #f3f1eb;
}

#legal.confirmed-legal { z-index: 120 !important; }

#legal.confirmed-legal .legal-page { line-height: normal; }

#legal.confirmed-legal .legal-hero .eyebrow {
  margin: 0;
  font-size: 10.5px;
  line-height: 1.3;
}

#legal.confirmed-legal .plain-summary li {
  margin: 0;
  font-size: inherit;
  line-height: normal;
}

#legal.confirmed-legal .contents li,
#legal.confirmed-legal .mobile-contents li { margin: 0; }

#bpreader.account-reader .sheet-in,
#bpreader.confirmed-purchase-reader .sheet-in,
#bpreader.share-composer-reader .sheet-in,
#bpreader.referral-reader .sheet-in,
#bpreader.share-referral-reader .sheet-in,
#bpreader.preview-reader .sheet-in,
#legal.confirmed-legal .sheet-in {
  width: 100%;
  max-width: none !important;
  min-height: 100dvh;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

#bpreader.account-reader #bpClose,
#bpreader.confirmed-purchase-reader #bpClose,
#bpreader.share-composer-reader #bpClose,
#bpreader.referral-reader #bpClose,
#bpreader.share-referral-reader #bpClose,
#bpreader.preview-reader #bpClose { display: none !important; }

#bpreader.account-reader #bpBody,
#bpreader.confirmed-purchase-reader #bpBody,
#bpreader.share-composer-reader #bpBody,
#bpreader.referral-reader #bpBody,
#bpreader.share-referral-reader #bpBody,
#bpreader.preview-reader #bpBody,
#legal.confirmed-legal #legalBody {
  width: 100%;
  min-height: 100dvh;
}

#bpreader.account-reader .you-page,
#bpreader.confirmed-purchase-reader .blueprint-page,
#bpreader.referral-reader .referral-page,
#bpreader.share-referral-reader .referral-page,
#legal.confirmed-legal .legal-page { min-height: 100dvh; }

#bpreader.referral-reader .referral-page,
#bpreader.share-referral-reader .referral-page,
#bpreader.share-composer-reader .share-flow { line-height: normal; }

#bpreader.referral-reader .referral-copy .eyebrow,
#bpreader.share-referral-reader .referral-copy .eyebrow {
  margin: 0;
  font-size: 11px;
  line-height: 1.4;
}

#bpreader.referral-reader .referral-copy .trust-line,
#bpreader.share-referral-reader .referral-copy .trust-line {
  margin: 14px 0 28px;
  font-size: 10px;
  line-height: 1.45;
}

#bpreader.account-reader .account-home.page-main {
  display: block;
  gap: 0;
}

/* The account prototype is a normal document, not a legacy fixed sheet. */
#bpreader.account-reader.on {
  position: relative !important;
  inset: auto !important;
  width: 100%;
  height: auto;
  min-height: 100dvh;
  overflow: visible !important;
  line-height: normal;
}

body[data-confirmed-view="you"] #landing { display: none !important; }

body[data-confirmed-view="you"] > .bar,
body[data-confirmed-view="you"] > #mobileProductNav,
body[data-confirmed-view="purchase"] > .bar,
body[data-confirmed-view="purchase"] > #mobileProductNav,
body[data-confirmed-view="legal"] > .bar,
body[data-confirmed-view="legal"] > #mobileProductNav { display: none !important; }

#bpreader.account-reader .page-intro .eyebrow {
  margin: 0;
  color: #214838;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .17em;
}

#bpreader.account-reader .page-intro { border: 0; }

#bpreader.account-reader .page-intro .intro-copy {
  max-width: 34ch;
  margin: 0 0 7px;
  color: #46514b;
  font-family: "Newsreader", Georgia, serif;
  font-size: 24px;
  line-height: 1.34;
  letter-spacing: -.018em;
}

#bpreader.account-reader .account-login-form.auth-form {
  margin: 0;
}

#bpreader.account-reader .field-note,
#bpreader.account-reader .quiet-note {
  margin: 0;
  color: #68716c;
  font-size: 13px;
  line-height: 1.55;
}

#bpreader.account-reader .contact-panel .field-note { margin-top: 14px; }

#bpreader.account-reader #accountContact.contact-link {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#bpreader.account-reader #accountLoginMessage:empty { display: none; }

#bpreader.account-reader .auth-divider {
  color: #68716c;
  font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 11px;
  letter-spacing: 0;
  text-transform: none;
}

#bpreader.account-reader .account-google {
  width: 100%;
  min-height: 50px;
}

#bpreader.account-reader .account-google > .google-action {
  width: 100%;
}

/* The purchase confirmation stylesheet was approved as a standalone page.
   Neutralize the legacy reader sheet's inherited rhythm so the integrated
   offer keeps the same typography and geometry at every breakpoint. */
#bpreader.confirmed-purchase-reader.on { line-height: normal; }

#bpreader.confirmed-purchase-reader .blueprint-page {
  line-height: normal;
}

#bpreader.confirmed-purchase-reader .eyebrow,
#bpreader.confirmed-purchase-reader .micro-label {
  margin: 0;
  color: #315c4a;
  font-size: 10px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: .18em;
}

#bpreader.confirmed-purchase-reader .micro-label { font-size: 9px; }

#bpreader.confirmed-purchase-reader .outcome-list {
  display: grid;
  gap: 13px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}

#bpreader.confirmed-purchase-reader .outcome-fact {
  display: flex;
  align-items: center;
  gap: 11px;
  margin: 0;
  font-size: 12px;
  line-height: normal;
}

#bpreader.confirmed-purchase-reader .hero-deck {
  margin: 0;
  color: #45504b;
  font-family: "Newsreader", Georgia, serif;
  font-size: clamp(20px, 1.65vw, 25px);
  line-height: 1.42;
}

#bpreader.confirmed-purchase-reader .checkout-summary {
  margin: 0 0 25px;
  color: #5f6762;
  font-size: 13px;
  line-height: 1.65;
}

#bpreader.confirmed-purchase-reader .purchase-assurances {
  display: grid;
  gap: 8px;
  margin: 20px 0 0;
  padding: 18px 0 0;
  border-top: 1px solid rgba(24, 32, 29, .16);
  list-style: none;
  color: #606963;
  font-size: 9px;
  line-height: normal;
}

#bpreader.confirmed-purchase-reader .purchase-assurances li {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  font-size: 9px;
  line-height: normal;
}

#bpreader.confirmed-purchase-reader .action-notice:empty { display: none; }

#legal.confirmed-legal #legalClose {
  position: static;
  z-index: auto;
  min-height: 44px;
  margin: 0;
  padding: 0 0 0 24px;
  border: 0;
  border-left: 1px solid rgba(49, 92, 74, .23);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #315c4a;
  font: 600 12px/1 "Manrope", sans-serif;
}

#legal.confirmed-legal #legalClose::first-letter { text-transform: uppercase; }

/* Standalone report pages use these same confirmed shells. */
body.life-book-page > .top,
body.blueprint-page > .top { display: none; }

/* The legacy report shells paint a fixed, fully opaque body pseudo-element.
   Keep the confirmed reader artwork, but never let that layer cover the
   confirmed intro and document panels. */
body.life-book-page,
body.blueprint-page { isolation: isolate; }

body.life-book-page::before,
body.blueprint-page::before { z-index: -1; }

body.life-book-page .site-header .nav-item,
body.blueprint-page .site-header .nav-item {
  border-radius: 0;
  background: transparent;
  color: inherit;
}

body.life-book-page .site-header .nav-item[aria-current="page"],
body.blueprint-page .site-header .nav-item[aria-current="page"] {
  background: transparent;
  color: var(--jade-deep);
}

body.life-book-page .product-nav--mobile,
body.blueprint-page .product-nav--mobile {
  width: 100%;
  border-radius: 0;
  transform: none;
}

body.life-book-page .product-nav--mobile .nav-item[aria-current="page"],
body.blueprint-page .product-nav--mobile .nav-item[aria-current="page"] {
  background: transparent;
  color: var(--jade-deep);
}

body.life-book-page #app,
body.blueprint-page #app {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.purchase-state-page {
  min-height: calc(100dvh - 78px);
}

@media (min-width: 821px) and (max-width: 1149px) {
  body[data-confirmed-view="reading"] #reveal.is-identity .identity-hero {
    width: calc(100% - 64px);
    grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
    gap: clamp(32px, 5vw, 64px);
  }

  body[data-confirmed-view="reading"] #reveal.is-identity .portrait-wrap {
    height: min(733px, 72vw);
  }

  body[data-confirmed-view="reading"] #reveal.is-identity .identity-copy {
    min-width: 0;
    padding-top: clamp(110px, 14vw, 170px);
  }

  body[data-confirmed-view="reading"] #reveal.is-identity .identity-copy h1 {
    font-size: clamp(64px, 8.6vw, 100px);
  }
}

@media (min-width: 1150px) {
  body[data-confirmed-view="reading"] #reveal.is-identity.has-long-identity .identity-copy {
    padding-top: 148px;
  }

  body[data-confirmed-view="reading"] #reveal.is-identity.has-long-identity .identity-copy h1 {
    max-width: 7.5ch;
    font-size: clamp(76px, 7.25vw, 104px);
    line-height: .9;
  }
}

@media (max-width: 820px) {
  body[data-confirmed-view="birth"] #birthCard .legal-copy button {
    min-height: 44px;
    padding: 0 2px;
  }

  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) .bar.site-header {
    min-height: 66px;
    height: 66px;
    padding: 11px 18px;
  }

  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #productNav {
    display: none !important;
  }

  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]):not([data-confirmed-view="analysis"]) #mobileProductNav:not([hidden]) {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 110;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-radius: 0;
    transform: none;
  }

  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #mobileProductNav .nav-item,
  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #mobileProductNav .nav-item[aria-current="page"] {
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #5f6963;
    box-shadow: none;
  }

  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #mobileProductNav .nav-item.is-active,
  body[data-confirmed-view]:not([data-confirmed-view="landing"]):not([data-confirmed-view="birth"]) #mobileProductNav .nav-item[aria-current="page"] {
    color: #214838;
  }

  .product-nav--mobile .nav-item::after {
    top: 0;
    right: 14%;
    bottom: auto;
    left: 14%;
  }

  body[data-confirmed-view="birth"] .bar {
    top: 24px !important;
    left: 22px !important;
  }

  body[data-confirmed-view="birth"] #landing .birth-stage {
    width: 100% !important;
    max-width: none !important;
    display: block !important;
    grid-template-columns: none !important;
    padding: 76px 18px 26px !important;
  }

  body[data-confirmed-view="birth"] #landing {
    background-image: linear-gradient(180deg, rgba(244, 241, 235, .04), rgba(244, 241, 235, .2)), url('/assets/ink-mirror/landing-confirmed-mobile-v101.jpg') !important;
    background-attachment: scroll !important;
  }

  body[data-confirmed-view="birth"] #birthCard {
    width: 100%;
    max-width: 620px;
    justify-self: center;
    margin: 0 auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }

  body[data-confirmed-view="birth"] #birthCard::before { display: none; }

  body[data-confirmed-view="birth"] #birthCard .date-grid {
    grid-template-columns: 1fr 1fr 1.25fr;
    gap: 8px;
  }

  body[data-confirmed-view="birth"] #birthCard .date-grid input {
    min-height: 48px;
    padding: 0 12px;
  }

  body[data-confirmed-view="reading"] #result.on #scroll { padding-top: 0; }

  body[data-confirmed-view="reading"]:has(#reveal.on.is-identity) #result.on #scroll { padding-top: 0; }

  body[data-confirmed-view="reading"]:not(:has(#reveal.on.is-identity)) .bar.site-header {
    min-height: 61px;
    height: auto;
    padding: max(9px, env(safe-area-inset-top)) 24px 7px;
  }

  body[data-confirmed-view="reading"]:not(:has(#reveal.on.is-identity)) .bar .brand {
    font-size: 22px;
  }

  body[data-confirmed-view="reading"] #rdPreview .eyebrow { font-size: 10px; }

  body[data-confirmed-view="reading"] #mobileProductNav { padding-inline: 10px; }

  body[data-confirmed-view="reading"] #reveal.on.is-identity {
    background-image: url('/assets/ink-mirror/analysis-transition-mobile-v101.jpg');
  }

  body[data-confirmed-view="reading"] #reveal.is-identity .identity-hero {
    display: block !important;
    grid-template-columns: none !important;
    min-height: auto;
    padding-bottom: 28px;
  }

  body[data-confirmed-view="reading"] #reveal.is-identity .portrait-wrap {
    width: min(62vw, 240px);
    height: min(38dvh, 320px);
    margin-bottom: 16px;
  }

  body[data-confirmed-view="reading"] #reveal.is-identity .identity-copy {
    padding-right: 24px;
    padding-left: 24px;
  }

  body[data-confirmed-view="analysis"] #reveal .analysis-state { margin-top: -2vh; }

  body[data-confirmed-view="analysis"] #reveal .analysis-state h1 {
    max-width: 12ch;
    font-size: clamp(32px, 9.2vw, 39px);
    line-height: 1.04;
  }

  #bpreader.account-reader .page-intro .intro-copy {
    max-width: 31ch;
    font-size: 18px;
  }

  #bpreader.confirmed-purchase-reader .outcome-list { margin-top: 27px; }

  #bpreader.confirmed-purchase-reader .hero-deck {
    font-size: 19px;
    line-height: 1.4;
  }

  #bpreader.confirmed-purchase-reader .checkout-summary { margin-bottom: 18px; }

  #bpreader.confirmed-purchase-reader .product-nav--mobile {
    right: 0;
    left: 0;
    width: 100%;
    margin: 0;
    transform: none;
  }

  #bpreader.account-reader .product-nav--mobile {
    right: 0;
    left: 0;
    width: 100%;
    margin: 0;
    transform: none;
  }

  #legal.confirmed-legal .product-nav--mobile {
    right: 0;
    left: 0;
    width: 100%;
    margin: 0;
    transform: none;
  }

  #legal.confirmed-legal .legal-page > .product-nav--mobile { min-height: 69px; }

  #legal.confirmed-legal #legalClose { padding-left: 18px; }
}

@media (max-width: 520px) {
  #bpreader.account-reader .page-intro .intro-copy {
    font-size: 17px;
    line-height: 1.4;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}