/* ============================================================
   Gaia app v3 — phase 2: Shop, Membership, You, and the app-wide sheets.

   Built on gaia-app-v3.css (tokens --v3-*, shared cards, buttons, tabs,
   chips) and loaded straight after it. Paint and light layout only; no
   markup or JS was changed, so every link, button and data hook is the
   one gaia-store.js, gaia-member.js, gaia-membership-ui.js and
   gaia-ui.js already render.

   Scope:
   - Shop / Membership: [data-screen="store"] (#store-products,
     #store-memberships)
   - You: [data-screen="profile"] (#member-me)
   - Sheets (appended to <body>, so body-scoped by their own classes):
     .gaia-menu-sheet, .gaia-auth-modal, .gaia-product-modal,
     .gaia-share-modal, .gaia-onboard-modal. The iframe booking sheet
     (.gaia-booking-modal without .gaia-product-modal) is not touched.
   ============================================================ */

/* ---------- 1. Shop: category heads -------------------------------------- */

body.gaia-v2 [data-screen="store"] #store-products { gap: 30px; }

body.gaia-v2 [data-screen="store"] .g-store-cat .g-section { align-items: flex-end; }
body.gaia-v2 [data-screen="store"] .g-store-cat .g-section__lead {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}
body.gaia-v2 [data-screen="store"] .g-store-cat .g-section__title {
  font-family: var(--g-font);
  font-size: clamp(1.15rem, 4.6vw, 1.35rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--v3-text);
}
/* "16 items": a quiet count on the right of the heading. */
body.gaia-v2 [data-screen="store"] .g-store-cat .g-section__meta {
  flex: 0 0 auto;
  margin: 0;
  color: var(--v3-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 1;
}

/* ---------- 2. Shop: the rail ------------------------------------------- */
/* On phones the rail is a horizontal scroller. It now bleeds to the screen
   edges (so the next tile visibly peeks in instead of being cut at the
   card column), keeps the page gutter as its scroll padding, and fades
   out at the right edge so the cut reads as "more this way". */

@media (max-width: 767px) {
  body.gaia-v2 [data-screen="store"] .g-store-rail {
    max-width: none;
    margin-inline: calc(-1 * var(--fit-pad, 16px));
    padding: 4px var(--fit-pad, 16px) 10px;
    scroll-padding-inline: var(--fit-pad, 16px);
    gap: 12px;
    scrollbar-width: none;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--fit-pad, 16px), #000 calc(100% - 36px), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 var(--fit-pad, 16px), #000 calc(100% - 36px), transparent 100%);
  }
  body.gaia-v2 [data-screen="store"] .g-store-rail::-webkit-scrollbar { display: none; }
  body.gaia-v2 [data-screen="store"] .g-store-rail > .g-store-tile {
    flex: 0 0 clamp(9.5rem, 41vw, 11rem);
  }
}

/* ---------- 3. Shop: product tiles ------------------------------------- */
/* One glass card per product: photo on a rounded mat, a two-line title,
   the price (with the struck "was" price), and a quiet outline buy pill
   pinned to the bottom so every tile in a row lines up. */

body.gaia-v2 [data-screen="store"] .g-store-tile {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--v3-border);
  border-radius: 24px;
  background:
    radial-gradient(120% 60% at 0% 0%, rgba(117, 240, 90, 0.04), transparent 60%),
    var(--v3-card);
  box-shadow: inset 0 1px 0 rgba(200, 255, 210, 0.04), 0 18px 36px -28px rgba(0, 0, 0, 0.9);
  transition: border-color 0.2s ease, transform 0.24s var(--v3-ease), background 0.2s ease;
}
body.gaia-v2 [data-screen="store"] .g-store-tile:active { transform: scale(0.985); }
@media (hover: hover) {
  body.gaia-v2 [data-screen="store"] .g-store-tile:hover {
    transform: translateY(-2px);
    border-color: var(--v3-border-strong);
  }
}

body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__media {
  aspect-ratio: 1;
  border: 0;
  border-radius: 18px;
  background: var(--v3-card-2);
  box-shadow: inset 0 0 0 1px rgba(160, 255, 185, 0.08);
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__media img { border-radius: inherit; }
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__media--empty {
  background:
    radial-gradient(60% 60% at 50% 45%, rgba(117, 240, 90, 0.08), transparent 70%),
    var(--v3-card-2);
}
body.gaia-v2 [data-screen="store"] .g-store-tile:hover .g-tile__media { transform: none; }

body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 4px 2px;
}
/* The title is the button that opens the detail sheet (44px floor from
   gaia-system.css); two lines, always reserving two lines of height. */
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__title { margin: 0; }
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__open {
  min-height: calc(2 * 1.35em);
  color: var(--v3-text);
  font-family: var(--g-font);
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.01em;
  -webkit-line-clamp: 2;
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 6px;
  margin: 2px 0 0;
  color: var(--v3-text);
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__was {
  margin: 0;
  color: var(--v3-muted);
  font-size: 12px;
  font-weight: 500;
  opacity: 1;
  text-decoration-color: rgba(168, 179, 173, 0.7);
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__price--muted {
  color: var(--v3-text-2);
  font-size: 12.5px;
  font-weight: 500;
  opacity: 1;
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__meta {
  color: var(--v3-muted);
  font-size: 12px;
  opacity: 1;
}

/* Buy pill: secondary outline, not a full neon block on every tile. The
   bright primary is kept for the product sheet's main call to action. */
body.gaia-v2 [data-screen="store"] .g-store-tile .g-card__actions {
  margin-top: auto;
  padding-top: 10px;
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-card__actions .g-btn,
body.gaia-v2 [data-screen="store"] .g-store-tile .g-card__actions .g-btn--primary {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(117, 240, 90, 0.34);
  background: rgba(117, 240, 90, 0.06);
  color: var(--v3-green-hi);
  font-size: 13px;
  font-weight: 600;
  box-shadow: none;
  filter: none;
}
body.gaia-v2 [data-screen="store"] .g-store-tile .g-card__actions .g-btn:active {
  background: rgba(117, 240, 90, 0.16);
}
@media (hover: hover) {
  body.gaia-v2 [data-screen="store"] .g-store-tile .g-card__actions .g-btn:hover {
    border-color: rgba(117, 240, 90, 0.6);
    background: rgba(117, 240, 90, 0.12);
    box-shadow: 0 0 18px -8px rgba(117, 240, 90, 0.5);
  }
}

body.gaia-v2 [data-screen="store"] .g-store-note {
  margin: 0;
  padding: 0 4px;
  color: var(--v3-muted);
  font-size: 12px;
  opacity: 1;
}

/* ---------- 4. Membership --------------------------------------------- */

/* "Gaia 2.0 Practitioners" intro: a section heading, not a thin card. */
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card:first-child:not(:has(.g-tier__head)) {
  padding: 6px 4px 0;
  border: 0;
  background: none;
  box-shadow: none;
}
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card:first-child:not(:has(.g-tier__head)) .g-card__label {
  margin: 0;
  color: var(--v3-text);
  font-size: clamp(1.3rem, 5.4vw, 1.6rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.022em;
  text-transform: none;
}
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card:first-child:not(:has(.g-tier__head)) .g-card__meta {
  margin: 6px 0 0;
  color: var(--v3-text-2);
  font-size: 14px;
}

/* Tier cards. */
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card:has(.g-tier__head) {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 22px 20px 20px;
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__head {
  align-items: center;
  gap: 12px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(160, 255, 185, 0.1);
}
/* Tier name: the card's heading (it was a small eyebrow). */
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__head .g-card__label {
  margin: 0;
  color: var(--v3-text);
  font-size: clamp(1.3rem, 5.6vw, 1.55rem);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.022em;
  text-transform: none;
}
/* Price: the badge becomes the card's price figure. */
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__head .g-badge:not(.g-badge--on) {
  padding: 0;
  border: 0;
  background: none;
  color: var(--v3-text);
  font-size: clamp(1.15rem, 5vw, 1.35rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: none;
  white-space: nowrap;
}
/* Current plan: a lit pill instead of a price, on a lit card. */
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__head .g-badge--on {
  padding: 7px 12px;
  border: 1px solid rgba(117, 240, 90, 0.45);
  background: rgba(117, 240, 90, 0.14);
  color: var(--v3-green-hi);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card--feature {
  border-color: var(--v3-border-strong);
  background:
    radial-gradient(110% 70% at 100% 0%, rgba(117, 240, 90, 0.13), transparent 60%),
    var(--v3-card);
  box-shadow:
    inset 0 1px 0 rgba(200, 255, 210, 0.07),
    0 0 0 1px rgba(117, 240, 90, 0.08),
    0 0 44px -14px rgba(117, 240, 90, 0.3),
    0 22px 44px -30px rgba(0, 0, 0, 0.9);
}

/* Feature list with round check marks. */
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__list {
  gap: 11px;
  margin: 0;
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__list li {
  padding-left: 32px;
  min-height: 20px;
  color: var(--v3-text-2);
  font-size: 14.5px;
  line-height: 1.4;
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__list li::before {
  content: "\2713";
  top: 0;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: rgba(66, 219, 134, 0.14);
  box-shadow: inset 0 0 0 1px rgba(66, 219, 134, 0.34);
  color: #6fe6a4;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card > .g-card__meta { margin: 0; }

/* One call to action, full width at the foot of the card. */
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card .g-card__actions { margin: 4px 0 0; }
body.gaia-v2 [data-screen="store"] #store-memberships > .g-card .g-card__actions .g-btn {
  width: 100%;
  min-height: 50px;
  font-size: 15px;
}

/* "Your access" block on the member's own plan card. */
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--v3-border);
  border-radius: 20px;
  background: var(--v3-card-2);
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-head {
  margin: 0;
  color: var(--v3-label);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-link {
  display: flex;
  align-items: center;
  gap: 4px 10px;
  flex-wrap: wrap;
  min-height: 48px;
  padding: 8px 12px;
  border-radius: 14px;
  background: rgba(5, 16, 11, 0.6);
  color: var(--v3-text);
  text-decoration: none;
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-name { flex: 1 1 auto; font-weight: 600; font-size: 14px; }
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-meta { color: var(--v3-text-2); font-size: 12.5px; }
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-chev { color: var(--v3-muted); }
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-all { margin: 2px 0 0; font-size: 13px; }
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__access-all a { color: var(--v3-green); font-weight: 600; text-decoration: none; }

/* Wide screens: the tier cards sit two to a row. */
@media (min-width: 900px) {
  body.gaia-v2 [data-screen="store"] #store-memberships:not([hidden]) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
  }
  body.gaia-v2 [data-screen="store"] #store-memberships > .g-card:first-child:not(:has(.g-tier__head)) {
    grid-column: 1 / -1;
  }
  body.gaia-v2 [data-screen="store"] #store-memberships > .g-card .g-card__actions { margin-top: auto; }
}

/* ---------- 5. You (profile) ------------------------------------------- */

body.gaia-v2 [data-screen="profile"] #member-me { gap: 16px; }
body.gaia-v2 [data-screen="profile"] #member-me > div:empty { display: none; }
/* From tablet width the account cards sit two abreast: most of them are
   short (an empty state and a button), and a single 1300px column of them
   put My readings a screen and a half down. Pass, access and next level keep
   the full width; so does My readings above. */
@media (min-width: 760px) {
  body.gaia-v2 [data-screen="profile"] #member-me { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
  body.gaia-v2 [data-screen="profile"] #member-me > .g-pass,
  body.gaia-v2 [data-screen="profile"] #member-me > .g-ma,
  body.gaia-v2 [data-screen="profile"] #member-me > .g-next,
  body.gaia-v2 [data-screen="profile"] #member-me > .g-card--feature { grid-column: 1 / -1; }
  body.gaia-v2 [data-screen="profile"] #member-me > .g-card { margin: 0; }
}
body.gaia-v2 [data-screen="profile"] #member-readings { margin-bottom: 16px; }
/* An empty card is one line: label, then the sentence, no box of nothing. */
body.gaia-v2 [data-screen="profile"] #member-me .g-card--empty { padding: 14px 20px; display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
body.gaia-v2 [data-screen="profile"] #member-me .g-card--empty .g-card__label { margin: 0; flex: none; }
body.gaia-v2 [data-screen="profile"] #member-me .g-card--empty .g-empty { margin: 0; flex: 1 1 12rem; min-width: 0; }
/* Next level folds to one line on request; the choice lives on the server. */
body.gaia-v2 [data-screen="profile"] .g-next__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
body.gaia-v2 [data-screen="profile"] .g-next__head .g-next__kicker { margin: 0; }
body.gaia-v2 [data-screen="profile"] .g-next__toggle { background: none; border: 0; padding: 4px 0; color: var(--v3-label); font: inherit; font-size: 0.8rem; font-weight: 600; cursor: pointer; }
body.gaia-v2 [data-screen="profile"] .g-next__toggle:hover, body.gaia-v2 [data-screen="profile"] .g-next__toggle:focus-visible { color: var(--v3-green); outline: none; }
body.gaia-v2 [data-screen="profile"] .g-next__line { margin: 6px 0 0; color: var(--v3-text-2); }
body.gaia-v2 [data-screen="profile"] .g-next__line strong { color: var(--v3-text); font-weight: 600; }
body.gaia-v2 [data-screen="profile"] .g-next.is-collapsed { padding: 14px 20px; }
body.gaia-v2 [data-screen="profile"] .g-next.is-collapsed > :not(.g-next__head):not(.g-next__line) { display: none; }
.g-readings-nudge__nums { display: block; margin-top: 2px; font-size: 0.82em; color: var(--g-text-muted); font-variant-numeric: tabular-nums; }
.g-readings-nudge__nums b { color: var(--g-text); font-weight: 600; }
body.gaia-v2 [data-screen="profile"] #member-readings[hidden], body.gaia-v2 [data-screen="profile"] #member-readings.is-on-practice-tab { display: none; }
/* The header card sat 30px above the first card while the cards below
   are 16px apart; one rhythm down the screen. */
body.gaia-v2 [data-screen="profile"] .g-page__head--profile { margin-bottom: 6px; }

/* Signed out: "Sign in securely" and "Join free" share the row, "Compare
   plans" sits under them as a quiet link. */
body.gaia-v2 [data-screen="profile"] #member-me .g-card { padding: 22px 20px 20px; }
body.gaia-v2 [data-screen="profile"] #member-me .g-card .g-card__label { margin: 0 0 8px; }
body.gaia-v2 [data-screen="profile"] #member-me .g-card .g-card__value--lg { margin: 0 0 8px; }
body.gaia-v2 [data-screen="profile"] #member-me .g-card__actions {
  gap: 10px;
  margin-top: 18px;
}
body.gaia-v2 [data-screen="profile"] #member-me .g-card__actions > .g-btn--primary,
body.gaia-v2 [data-screen="profile"] #member-me .g-card__actions > .g-btn--secondary {
  flex: 1 1 9rem;
  min-height: 48px;
}
body.gaia-v2 [data-screen="profile"] #member-me .g-card__actions > .g-btn--ghost {
  flex: 1 1 100%;
  min-height: 44px;
}

/* Rows inside the account cards. */
body.gaia-v2 [data-screen="profile"] #member-me .g-row {
  min-height: 48px;
  border-color: rgba(160, 255, 185, 0.1);
  color: var(--v3-text);
}
body.gaia-v2 [data-screen="profile"] #member-me .g-row__meta { color: var(--v3-text-2); }
body.gaia-v2 [data-screen="profile"] #member-me .g-row--link .g-row__meta { color: var(--v3-green); font-weight: 600; }
body.gaia-v2 [data-screen="profile"] #member-me .g-empty { color: var(--v3-text-2); }

/* Member Pass: the premium card at the top of the signed-in screen. */
body.gaia-v2 [data-screen="profile"] .g-pass {
  position: relative;
  overflow: hidden;
  padding: 24px 20px 20px;
  border: 1px solid var(--v3-border-strong);
  border-radius: var(--v3-radius-lg);
  background:
    radial-gradient(90% 90% at 100% 0%, rgba(117, 240, 90, 0.15), transparent 60%),
    radial-gradient(70% 80% at 0% 100%, rgba(88, 199, 232, 0.06), transparent 70%),
    var(--v3-card);
  box-shadow:
    inset 0 1px 0 rgba(200, 255, 210, 0.07),
    0 0 44px -16px rgba(117, 240, 90, 0.28),
    0 22px 44px -30px rgba(0, 0, 0, 0.9);
}
body.gaia-v2 [data-screen="profile"] .g-pass--none {
  border-color: var(--v3-border);
  background: var(--v3-card-bg);
  box-shadow: var(--v3-card-shadow);
}
body.gaia-v2 [data-screen="profile"] .g-pass__kicker {
  margin: 0 0 8px;
  color: var(--v3-label);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.gaia-v2 [data-screen="profile"] .g-pass__title {
  margin: 0;
  font-family: var(--g-font);
  font-size: clamp(1.6rem, 7vw, 2rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--v3-text);
}
body.gaia-v2 [data-screen="profile"] .g-pass--none .g-pass__title { font-size: clamp(1.25rem, 5.2vw, 1.5rem); }
body.gaia-v2 [data-screen="profile"] .g-pass__subtitle { margin: 4px 0 14px; color: var(--v3-emerald); font-weight: 600; }
body.gaia-v2 [data-screen="profile"] .g-pass__status { margin: 0 0 10px; }
body.gaia-v2 [data-screen="profile"] .g-pass__meta { margin: 0 0 2px; color: var(--v3-text-2); line-height: 1.5; }
body.gaia-v2 [data-screen="profile"] .g-pass__actions { margin-top: 18px; }
body.gaia-v2 [data-screen="profile"] .g-pass__actions .g-btn { flex: 1 1 100%; min-height: 48px; }

/* My Access, Included, Next Level: section headings + glass lists. */
body.gaia-v2 [data-screen="profile"] :is(.g-ma__title) {
  margin: 8px 4px 12px;
  font-family: var(--g-font);
  font-size: clamp(1.2rem, 4.8vw, 1.45rem);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--v3-text);
}
body.gaia-v2 [data-screen="profile"] .g-ma-rows {
  overflow: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--v3-border);
  border-radius: var(--v3-radius);
  background: var(--v3-card);
  box-shadow: var(--v3-card-shadow);
}
body.gaia-v2 [data-screen="profile"] .g-ma-row + .g-ma-row { border-top-color: rgba(160, 255, 185, 0.1); }
body.gaia-v2 [data-screen="profile"] .g-ma-row__button {
  min-height: 60px;
  padding: 12px 18px;
  color: var(--v3-text);
  font-weight: 600;
  transition: background 0.18s ease;
}
/* One line per row: name left, value right (they stacked on phones). */
body.gaia-v2 [data-screen="profile"] .g-ma-row__button { flex-wrap: nowrap; text-align: left; }
body.gaia-v2 [data-screen="profile"] .g-ma-row__value {
  order: 0;
  width: auto;
  max-width: 55%;
  text-align: right;
  font-size: 13.5px;
}
body.gaia-v2 [data-screen="profile"] .g-ma-row__button:hover { background: transparent; }
@media (hover: hover) {
  body.gaia-v2 [data-screen="profile"] .g-ma-row__button:hover { background: rgba(22, 42, 32, 0.6); }
}
body.gaia-v2 [data-screen="profile"] .g-ma-row__button:active { background: rgba(24, 46, 34, 0.85); }
body.gaia-v2 [data-screen="profile"] .g-ma-row__value { color: var(--v3-text-2); font-weight: 500; }
body.gaia-v2 [data-screen="profile"] .g-ma-row__chev { color: var(--v3-muted); }
body.gaia-v2 [data-screen="profile"] .g-ma-row__button[aria-expanded="true"] { background: rgba(117, 240, 90, 0.06); }
body.gaia-v2 [data-screen="profile"] .g-ma-row__panel { padding: 4px 18px 14px; background: rgba(2, 8, 5, 0.5); }

body.gaia-v2 [data-screen="profile"] .g-next {
  padding: 22px 20px 20px;
  border: 1px solid var(--v3-border);
  border-radius: var(--v3-radius);
  background:
    radial-gradient(90% 90% at 100% 0%, rgba(88, 199, 232, 0.08), transparent 60%),
    var(--v3-card);
  box-shadow: var(--v3-card-shadow);
}
body.gaia-v2 [data-screen="profile"] .g-next__kicker {
  margin: 0 0 8px;
  color: var(--v3-label);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.gaia-v2 [data-screen="profile"] .g-next__title {
  margin: 0;
  font-family: var(--g-font);
  font-size: clamp(1.3rem, 5.4vw, 1.55rem);
  font-weight: 600;
  letter-spacing: -0.022em;
  color: var(--v3-text);
}
body.gaia-v2 [data-screen="profile"] .g-next__subtitle { margin: 4px 0 0; color: var(--v3-cyan); font-weight: 600; }
body.gaia-v2 [data-screen="profile"] .g-next__lead { margin: 14px 0 8px; color: var(--v3-text-2); }
body.gaia-v2 [data-screen="profile"] .g-next__list { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
body.gaia-v2 [data-screen="profile"] .g-next__list li {
  position: relative;
  padding-left: 30px;
  color: var(--v3-text-2);
  line-height: 1.4;
}
body.gaia-v2 [data-screen="profile"] .g-next__list li::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: rgba(88, 199, 232, 0.14);
  box-shadow: inset 0 0 0 1px rgba(88, 199, 232, 0.34);
  color: #7fd8f2;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
body.gaia-v2 [data-screen="profile"] .g-next__list strong { color: var(--v3-text); }
body.gaia-v2 [data-screen="profile"] .g-next__actions { margin-top: 18px; display: flex; }
body.gaia-v2 [data-screen="profile"] .g-next__actions .g-btn { flex: 1 1 100%; min-height: 48px; }

body.gaia-v2 [data-screen="profile"] .g-profile-signout {
  align-self: center;
  min-height: 44px;
  margin-top: 8px;
  color: var(--v3-text-2);
}

/* ---------- 6. Sheets: shared panel, close button, inputs -------------- */
/* Glass panels like the Assist card: 32px corners, a green glow from the
   top, a 48px round close button in the top-right corner. */

body.gaia-v2 :is(.gaia-menu-sheet, .gaia-auth-modal, .gaia-share-modal, .gaia-onboard-modal) {
  background:
    radial-gradient(70% 45% at 50% 85%, rgba(66, 219, 134, 0.1), transparent 70%),
    rgba(2, 8, 5, 0.74);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__backdrop {
  background:
    radial-gradient(70% 45% at 50% 85%, rgba(66, 219, 134, 0.1), transparent 70%),
    rgba(2, 8, 5, 0.74);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

body.gaia-v2 :is(.gaia-menu-sheet__panel, .gaia-auth-modal__panel, .gaia-share-modal__panel, .gaia-onboard-modal__panel, .gaia-product-modal .g-store-sheet, .gaia-product-modal .gaia-booking-modal__sheet) {
  border: 1px solid rgba(140, 255, 170, 0.2);
  border-radius: 32px;
  background:
    radial-gradient(120% 45% at 50% 0%, rgba(117, 240, 90, 0.11), transparent 60%),
    radial-gradient(90% 35% at 50% 100%, rgba(66, 219, 134, 0.06), transparent 70%),
    rgba(5, 16, 11, 0.97);
  box-shadow:
    inset 0 1px 0 rgba(200, 255, 210, 0.08),
    0 0 0 1px rgba(117, 240, 90, 0.04),
    0 0 48px -8px rgba(117, 240, 90, 0.16),
    0 30px 80px -20px rgba(0, 0, 0, 0.8);
  color: var(--v3-text);
  animation: v3sy-sheet-in 0.42s var(--v3-ease);
}
body.gaia-v2 :is(.gaia-menu-sheet__panel, .gaia-auth-modal__panel) { padding: 24px 22px 22px; }
@keyframes v3sy-sheet-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

/* The close button, matched to the Assist close: 48px glass circle. */
body.gaia-v2 :is(.gaia-menu-sheet, .gaia-auth-modal, .gaia-share-modal, .gaia-onboard-modal) .gaia-sheet-close,
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__close {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  padding: 0;
  border: 1px solid var(--v3-border) !important;
  border-radius: 999px;
  background: rgba(16, 31, 24, 0.72) !important;
  color: var(--v3-text-2) !important;
  font: 400 24px/1 system-ui, sans-serif;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
body.gaia-v2 :is(.gaia-menu-sheet, .gaia-auth-modal, .gaia-share-modal, .gaia-onboard-modal) .gaia-sheet-close:active,
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__close:active {
  background: rgba(28, 52, 40, 0.9) !important;
  color: var(--v3-text) !important;
}
@media (hover: hover) {
  body.gaia-v2 :is(.gaia-menu-sheet, .gaia-auth-modal, .gaia-share-modal, .gaia-onboard-modal) .gaia-sheet-close:hover,
  body.gaia-v2 .gaia-product-modal .gaia-booking-modal__close:hover {
    border-color: var(--v3-border-strong) !important;
    background: rgba(28, 52, 40, 0.8) !important;
    color: var(--v3-text) !important;
  }
}
body.gaia-v2 :is(.gaia-menu-sheet, .gaia-auth-modal, .gaia-share-modal, .gaia-onboard-modal) .gaia-sheet-close:focus-visible,
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__close:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--v3-page), 0 0 0 4px rgba(117, 240, 90, 0.75);
}

/* Eyebrows and titles inside the sheets. */
body.gaia-v2 :is(.gaia-share-modal__kicker, .g-onb__kicker) {
  font-family: var(--g-font);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--v3-label);
}
body.gaia-v2 .gaia-menu-sheet__kicker,
body.gaia-v2 .gaia-auth-modal__kicker { margin: 4px 0 8px; }
body.gaia-v2 :is(.gaia-menu-sheet__top, .gaia-auth-modal__top) { align-items: flex-start; }
body.gaia-v2 .gaia-auth-modal__body {
  margin-top: 12px;
  color: var(--v3-text-2);
  font-size: 14.5px;
  line-height: 1.55;
}

/* Inputs: the Assist input — a dark field inside a thin green-to-cyan rim,
   a soft glow when focused. */
body.gaia-v2 .gaia-auth-modal__input,
body.gaia-v2 .gaia-onboard-modal .g-onb__row input,
body.gaia-v2 .gaia-onboard-modal .g-onb__dob-fields :is(select, input) {
  min-height: 54px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(rgba(8, 22, 15, 0.96), rgba(8, 22, 15, 0.96)) padding-box,
    linear-gradient(100deg, rgba(117, 240, 90, 0.5), rgba(66, 219, 134, 0.3) 50%, rgba(88, 199, 232, 0.5)) border-box;
  color: var(--v3-text);
  font: 500 16px var(--g-font);
  box-shadow: 0 0 26px -14px rgba(117, 240, 90, 0.4);
  transition: box-shadow 0.2s ease, background 0.2s ease;
}
body.gaia-v2 .gaia-onboard-modal .g-onb__dob-fields :is(select, input) { padding: 0 14px; }
body.gaia-v2 :is(.gaia-auth-modal__input, .gaia-onboard-modal input, .gaia-onboard-modal select)::placeholder {
  color: var(--v3-muted);
  opacity: 1;
}
body.gaia-v2 .gaia-auth-modal__input:focus,
body.gaia-v2 .gaia-onboard-modal .g-onb__row input:focus,
body.gaia-v2 .gaia-onboard-modal .g-onb__dob-fields :is(select, input):focus {
  outline: none;
  background:
    linear-gradient(rgba(8, 22, 15, 0.96), rgba(8, 22, 15, 0.96)) padding-box,
    linear-gradient(100deg, rgba(117, 240, 90, 0.85), rgba(66, 219, 134, 0.55) 50%, rgba(88, 199, 232, 0.85)) border-box;
  box-shadow: 0 0 0 3px rgba(117, 240, 90, 0.14), 0 0 34px -10px rgba(117, 240, 90, 0.6);
}
body.gaia-v2 :is(.gaia-auth-modal__submit, .g-onb__submit, .gaia-share-modal__actions .g-btn) {
  min-height: 54px;
  border-radius: 999px;
  font-size: 15.5px;
}

/* ---------- 7. Menu sheet ---------------------------------------------- */
/* The three links become Assist-style action cards (the divided list read
   as a settings page). The "Explore →" hint is a quiet green label. */

body.gaia-v2 .gaia-menu-sheet__nav { gap: 10px; margin-top: 20px; }
body.gaia-v2 .gaia-menu-sheet__link {
  min-height: 64px;
  padding: 12px 16px 12px 18px;
  border: 1px solid var(--v3-border);
  border-radius: 22px;
  background: var(--v3-card-2);
  color: var(--v3-text);
  font: 600 16px/1.3 var(--g-font);
  letter-spacing: -0.01em;
  transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
  -webkit-tap-highlight-color: transparent;
}
body.gaia-v2 .gaia-menu-sheet__link:active { transform: scale(0.98); background: rgba(24, 46, 34, 0.9); }
@media (hover: hover) {
  body.gaia-v2 .gaia-menu-sheet__link:hover {
    border-color: var(--v3-border-strong);
    background: rgba(22, 42, 32, 0.85);
  }
}
body.gaia-v2 .gaia-menu-sheet__link:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--v3-page), 0 0 0 4px rgba(117, 240, 90, 0.75);
}
body.gaia-v2 .gaia-menu-sheet__link span {
  flex: 0 0 auto;
  padding: 6px 12px;
  border: 1px solid rgba(117, 240, 90, 0.28);
  border-radius: 999px;
  background: rgba(117, 240, 90, 0.08);
  color: var(--v3-green-hi);
  font-size: 13px;
  font-weight: 600;
}

/* ---------- 8. Sign-in sheet ------------------------------------------- */

body.gaia-v2 .gaia-auth-modal__form { gap: 12px; margin-top: 20px; }
body.gaia-v2 .gaia-auth-modal__status { color: var(--v3-text-2); }
body.gaia-v2 .gaia-auth-modal__status.is-sent {
  border-color: rgba(117, 240, 90, 0.34);
  border-radius: 20px;
  background: rgba(117, 240, 90, 0.08);
}
body.gaia-v2 .gaia-auth-modal__sent-title { color: var(--v3-green-hi); }
body.gaia-v2 .gaia-auth-modal__join {
  margin-top: 16px;
  padding-top: 14px;
  border-top-color: rgba(160, 255, 185, 0.1);
  color: var(--v3-text-2);
}
body.gaia-v2 .gaia-auth-modal__joinlink,
body.gaia-v2 .gaia-auth-modal__joinalt { color: var(--v3-green); }
/* Provider buttons keep their brand colours (white Google, black Apple);
   only the shape follows the pills. */
body.gaia-v2 .gaia-auth-modal__social-btn {
  min-height: 52px;
  border-radius: 999px;
}
body.gaia-v2 .gaia-auth-modal__social-btn[data-oauth="apple"] { border-color: rgba(255, 255, 255, 0.22); }
body.gaia-v2 .gaia-auth-modal__or { color: var(--v3-muted); }
body.gaia-v2 .gaia-auth-modal__or::before,
body.gaia-v2 .gaia-auth-modal__or::after { background: rgba(160, 255, 185, 0.12); }

/* ---------- 9. Product sheet ------------------------------------------- */

body.gaia-v2 .gaia-product-modal .g-store-sheet {
  gap: 14px;
  padding: 18px 18px 20px;
  scrollbar-width: thin;
  scrollbar-color: rgba(160, 255, 185, 0.2) transparent;
}
@media (max-width: 640px) {
  body.gaia-v2 .gaia-product-modal { padding: 12px; }
  body.gaia-v2 .gaia-product-modal .g-store-sheet { border-radius: 32px; max-height: calc(100dvh - 24px); }
}
body.gaia-v2 .gaia-product-modal .g-store-sheet > .gaia-booking-modal__close { top: 26px; right: 26px; }
body.gaia-v2 .gaia-product-modal .g-store-sheet__media {
  aspect-ratio: 4 / 3;
  border-radius: 22px;
  background: var(--v3-card-2);
  box-shadow: inset 0 0 0 1px rgba(160, 255, 185, 0.08);
}
body.gaia-v2 .gaia-product-modal .g-store-sheet__title {
  margin-top: 4px;
  font-family: var(--g-font);
  font-size: clamp(1.35rem, 5.6vw, 1.6rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.022em;
  color: var(--v3-text);
}
body.gaia-v2 .gaia-product-modal .g-store-sheet__meta { color: var(--v3-text-2); opacity: 1; }
body.gaia-v2 .gaia-product-modal .g-store-sheet__meta:empty { display: none; }
body.gaia-v2 .gaia-product-modal .g-tag {
  padding: 5px 10px;
  border: 1px solid var(--v3-border);
  border-radius: 999px;
  background: rgba(16, 31, 24, 0.6);
  color: var(--v3-text-2);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.gaia-v2 .gaia-product-modal .g-store-sheet__price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  color: var(--v3-text);
  font-size: 1.35rem;
  letter-spacing: -0.02em;
}
body.gaia-v2 .gaia-product-modal .g-store-sheet__price s {
  margin: 0;
  color: var(--v3-muted);
  font-size: 0.95rem;
  opacity: 1;
}
body.gaia-v2 .gaia-product-modal .g-store-sheet__price.g-tile__price--muted { font-size: 1rem; color: var(--v3-text-2); }
body.gaia-v2 .gaia-product-modal .g-store-sheet__body { color: var(--v3-text-2); opacity: 1; font-size: 14.5px; }
body.gaia-v2 .gaia-product-modal .g-label {
  margin: 6px 0 0;
  color: var(--v3-label);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
body.gaia-v2 .gaia-product-modal .g-store-sheet__list { color: var(--v3-text-2); opacity: 1; }
body.gaia-v2 .gaia-product-modal .g-store-sheet__list li::marker { color: var(--v3-emerald); }
/* The main call to action: the one bright primary in the Shop. It sits
   in a sticky foot so it stays in reach under a long description. */
body.gaia-v2 .gaia-product-modal .g-store-sheet .g-card__actions {
  position: sticky;
  bottom: -20px;
  z-index: 1;
  flex-wrap: nowrap;
  gap: 10px;
  margin: 4px -18px -20px;
  padding: 14px 18px 20px;
  background: linear-gradient(to bottom, rgba(5, 16, 11, 0), rgba(5, 16, 11, 0.96) 30%);
}
body.gaia-v2 .gaia-product-modal .g-store-sheet .g-card__actions .g-btn { min-height: 52px; }
body.gaia-v2 .gaia-product-modal .g-store-sheet .g-card__actions .g-btn--primary,
body.gaia-v2 .gaia-product-modal .g-store-sheet .g-card__actions .g-btn--secondary { flex: 1 1 auto; font-size: 15.5px; }
body.gaia-v2 .gaia-product-modal .g-store-sheet .g-card__actions .g-btn--ghost { flex: 0 0 auto; color: var(--v3-text-2); }

/* The older product sheet (Today's "From the store" tiles). */
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__sheet { overflow: hidden; }
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__head { background: transparent; border-color: rgba(160, 255, 185, 0.1) !important; }
body.gaia-v2 .gaia-product-modal .gaia-booking-modal__title {
  font-family: var(--g-font);
  font-size: 11px !important;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--v3-label) !important;
}
body.gaia-v2 .gaia-product-modal .gaia-product-modal__body { background: transparent; }
body.gaia-v2 .gaia-product-modal .gaia-product-modal__image { border-radius: 22px; width: calc(100% - 32px); margin: 16px 16px 0; }
body.gaia-v2 .gaia-product-modal .gaia-product-modal__description,
body.gaia-v2 .gaia-product-modal .gaia-product-modal__note { color: var(--v3-text-2); }
body.gaia-v2 .gaia-product-modal .gaia-product-modal__buy { min-height: 54px; border-radius: 999px; }

/* ---------- 10. Share and onboarding sheets ------------------------------ */

body.gaia-v2 :is(.gaia-share-modal__panel, .gaia-onboard-modal__panel) {
  padding: 24px 20px calc(20px + env(safe-area-inset-bottom, 0px));
}
/* The close button sat in the text flow above the eyebrow; it moves to
   the top-right corner like every other sheet. */
body.gaia-v2 :is(.gaia-share-modal__panel, .gaia-onboard-modal__panel) > .gaia-sheet-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
}
body.gaia-v2 .gaia-share-modal__kicker { min-height: 48px; display: flex; align-items: center; margin: -10px 60px 8px 0; }
body.gaia-v2 .g-onb__kicker { min-height: 48px; display: flex; align-items: center; margin: -10px 60px 0 0; }
body.gaia-v2 .g-onb__title {
  margin-top: 2px;
  font-family: var(--g-font);
  font-size: clamp(1.5rem, 6.4vw, 1.9rem);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.022em;
  color: var(--v3-text);
}
body.gaia-v2 :is(.g-onb__lead, .g-onb__row, .g-onb__dob-label, .gaia-share-modal__note) { color: var(--v3-text-2); }
body.gaia-v2 :is(.g-onb__note) { color: var(--v3-muted); opacity: 1; }
body.gaia-v2 .g-onb__row { gap: 8px; margin-bottom: 14px; font-weight: 600; font-size: 13px; }
body.gaia-v2 .g-onb__row input { width: 100%; }
body.gaia-v2 .g-onb__status,
body.gaia-v2 .gaia-share-modal__status { color: var(--v3-green-hi); }
body.gaia-v2 .gaia-share-modal__preview {
  border-radius: 22px;
  box-shadow: inset 0 0 0 1px rgba(160, 255, 185, 0.1);
}
body.gaia-v2 .gaia-share-modal__toggle { min-height: 44px; color: var(--v3-text); }
body.gaia-v2 .gaia-share-modal__toggle input { width: 20px; height: 20px; accent-color: var(--v3-green); }

/* ---------- 11. Reduced motion ----------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  body.gaia-v2 :is(.gaia-menu-sheet__panel, .gaia-auth-modal__panel, .gaia-share-modal__panel, .gaia-onboard-modal__panel, .gaia-product-modal .g-store-sheet, .gaia-product-modal .gaia-booking-modal__sheet) {
    animation: none;
  }
  body.gaia-v2 :is([data-screen="store"] .g-store-tile, [data-screen="profile"] .g-ma-row__button, .gaia-menu-sheet__link, .gaia-sheet-close, .gaia-product-modal .gaia-booking-modal__close) {
    transition: none !important;
  }
  body.gaia-v2 :is([data-screen="store"] .g-store-tile, .gaia-menu-sheet__link):is(:active, :hover) { transform: none; }
}

/* ---------- The featured plan (owner: Gold, 2026-09-28) ----------------
   gaia-member.js marks it g-tier--featured (the plans API's own `featured`
   flag wins when it exists) and adds a "Most popular" flag, unless it is
   already the member's current plan. One lit rim, one small flag — the
   price and the button stay the same as every other tier. */
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier--featured {
  position: relative;
  border-color: rgba(120, 245, 145, 0.42);
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(117, 240, 90, 0.09), transparent 60%),
    var(--v3-card, rgba(5, 16, 11, 0.9));
  box-shadow: 0 0 0 1px rgba(117, 240, 90, 0.12), 0 18px 40px -22px rgba(117, 240, 90, 0.45);
}
body.gaia-v2 [data-screen="store"] #store-memberships .g-tier__flag {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, #75F05A, #8BFF70);
  color: #06140a;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: 0 6px 18px -6px rgba(117, 240, 90, 0.6);
}

/* ── Practice: a practitioner's clients, inside You ──────────────────────────
   Built entirely from the existing tokens, so it inherits the theme, the dark
   mode and the radii without introducing a second visual language. Every value
   below is a --g-* or a multiple of the spacing already in use here.

   Mobile first and single column throughout: the person using this is a
   practitioner on a phone between sessions, and the whole screen has to be
   readable at arm's length without a horizontal scroll anywhere. */
.g-prac { display: flex; flex-direction: column; gap: 20px; }
.g-prac__sec { display: flex; flex-direction: column; gap: 8px; }
.g-prac__h { font: 600 15px/1.3 var(--g-font-serif, inherit); margin: 4px 0 2px; color: var(--g-text); }
.g-prac__h4 { font: 600 13px/1.3 inherit; margin: 12px 0 4px; color: var(--g-text-muted); }
.g-prac__muted { color: var(--g-text-muted); font-size: 13px; margin: 0; }
.g-prac__num { font-variant-numeric: tabular-nums; font-size: 13px; color: var(--g-text-muted); min-width: 56px; text-align: right; }

/* A client is a button, not a row with a link in it: the whole card is the
   target, which is what a thumb needs. */
.g-prac__client {
  display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left;
  padding: 12px 14px; border: 1px solid var(--g-line); border-radius: var(--g-r-md);
  background: var(--g-surface); color: var(--g-text); cursor: pointer;
  min-height: 56px;
}
.g-prac__client:hover { border-color: var(--g-line-strong); }
.g-prac__client:focus-visible { outline: 2px solid var(--g-focus, var(--g-accent)); outline-offset: 2px; }
.g-prac__client-name { font-weight: 600; font-size: 15px; }
.g-prac__client-meta { color: var(--g-text-muted); font-size: 12px; }
.g-prac__when { color: var(--g-text-muted); font-size: 12px; margin-top: 2px; }

/* Concern chips. Severity is carried by colour AND by the word inside, so it
   survives being read by somebody who cannot tell the two greens apart. */
.g-prac__flags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.g-prac__flag {
  font-size: 11px; padding: 2px 8px; border-radius: 999px;
  background: var(--g-surface-hi); color: var(--g-text-muted); border: 1px solid var(--g-line);
}
/* Concerns are warnings, not good news: amber for elevated, red for high
   (the same tokens My readings uses). They were two shades of green. */
.g-prac__flag.is-elevated { color: var(--g-warn); border-color: color-mix(in srgb, var(--g-warn) 50%, transparent); background: color-mix(in srgb, var(--g-warn) 10%, transparent); }
.g-prac__flag.is-high { color: var(--g-danger); border-color: color-mix(in srgb, var(--g-danger) 55%, transparent); background: color-mix(in srgb, var(--g-danger) 14%, transparent); font-weight: 600; }
.g-prac__tag { font-size: 11px; color: var(--g-text-muted); }
.g-prac__tag--shares { color: var(--g-accent); margin-left: 6px; }
.g-prac__shares { margin: 8px 0 0; padding: 8px 12px; border-radius: var(--g-r-md); font-size: 0.86em; color: var(--g-text); background: color-mix(in srgb, var(--g-accent) 9%, var(--g-surface-hi)); border: 1px solid color-mix(in srgb, var(--g-accent) 28%, var(--g-line)); }

.g-prac__search { width: 100%; margin-bottom: 4px; }

/* The three Bio-Well cards. Collapsed by default: open is a ten-second call,
   and nobody should pay for one they did not ask for. */
.g-prac__cards { display: flex; flex-direction: column; gap: 8px; }
.g-prac__card { border: 1px solid var(--g-line); border-radius: var(--g-r-md); background: var(--g-surface); overflow: hidden; }
.g-prac__card-head {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  width: 100%; padding: 14px; background: none; border: 0; color: var(--g-text);
  font: 600 14px/1.2 inherit; cursor: pointer; min-height: 48px;
}
.g-prac__card-head:focus-visible { outline: 2px solid var(--g-focus, var(--g-accent)); outline-offset: -2px; }
.g-prac__card-cta { color: var(--g-accent); font-size: 13px; font-weight: 500; }
.g-prac__card-body { padding: 0 14px 14px; }

.g-prac__loading-note { color: var(--g-text-muted); font-size: 12px; margin: 8px 0 0; }

.g-prac__metrics { display: flex; gap: 10px; margin: 10px 0; }
.g-prac__metrics .gaia-metric { flex: 1; min-width: 0; }

/* One reading. The bar is decoration over a number that is always present, so
   nothing depends on reading the bar. */
.g-prac__row { display: flex; align-items: center; gap: 10px; padding: 5px 0; font-size: 13px; min-width: 0; }
.g-prac__row > span:first-child { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.g-prac__row em { font-style: normal; font-size: 11px; }
.g-prac__bar { flex: 0 0 72px; height: 5px; border-radius: 999px; background: var(--g-surface-hi); overflow: hidden; }
.g-prac__bar > span { display: block; height: 100%; background: var(--g-accent); }

.g-prac__profile { padding: 2px 0 4px; }
.g-prac__name { font: 600 20px/1.2 var(--g-font-serif, inherit); margin: 0 0 4px; }
.g-prac__service { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border: 1px solid var(--g-line); border-radius: var(--g-r-md); background: var(--g-surface); }
.g-prac__service-name { font-weight: 600; font-size: 14px; }
.g-prac__file { padding: 10px 14px; border: 1px solid var(--g-line); border-radius: var(--g-r-md); font-size: 13px; }
.g-prac__compare + .g-prac__compare { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--g-line); }

@media (prefers-reduced-motion: reduce) { .g-prac__bar > span { transition: none; } }

/* ── My readings (You): a member's own Bio-Well results ───────────────── */
/* ── My readings: a member's own Bio-Well results. Phone first; two columns from 640px, three from 900px. ── */
.g-readings { --rd-high: var(--g-danger); --rd-elev: var(--g-warn); --rd-low: var(--g-teal); --rd-e: var(--g-accent); --rd-s: var(--g-teal); --rd-bar: var(--g-accent); }
.g-readings.is-focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--g-accent) 45%, transparent); transition: box-shadow 0.4s ease; }
.g-readings__lead { margin: 0 0 6px; font-weight: 600; color: var(--g-text); }
.g-readings__muted { margin: 4px 0 0; color: var(--g-text-muted); font-size: 0.9em; line-height: 1.45; }
.g-readings__note { margin-top: 14px; }
.g-readings__when { margin: 2px 0 0; }
.g-readings__sec { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--g-line); min-width: 0; }
.g-readings__kicker { margin: 0 0 8px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--g-text-muted); }
.g-readings__kicker .g-readings__muted { display: inline; text-transform: none; letter-spacing: 0; font-weight: 500; }

/* Your data and sharing */
body.gaia-v2 [data-screen="profile"] #member-data-sharing { margin-top: 16px; }
body.gaia-v2 [data-screen="profile"] #member-data-sharing[hidden], body.gaia-v2 [data-screen="profile"] #member-data-sharing.is-on-practice-tab { display: none; }
.g-datashare .g-row__meta { text-align: right; max-width: 60%; }
/* "What can they see?" */
.g-readings__linkbtn { background: none; border: 0; padding: 0; font: inherit; font-size: 0.92em; color: var(--g-accent); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.g-readings__linkbtn:focus-visible { outline: 2px solid var(--g-accent); outline-offset: 2px; border-radius: 3px; }
.g-readings__whosees { margin: 10px 0 0; padding: 12px 14px; border: 1px solid var(--g-line); border-radius: var(--g-r-md); background: var(--g-surface-hi); display: flex; flex-direction: column; gap: 6px; }
.g-readings__whosees .g-readings__kicker { margin: 4px 0 2px; }
/* In short */
.g-readings__summary { margin: 12px 0 0; padding: 14px 16px; border-radius: var(--g-r-md); background: color-mix(in srgb, var(--g-accent) 9%, var(--g-surface-hi)); border: 1px solid color-mix(in srgb, var(--g-accent) 28%, var(--g-line)); }
.g-readings__summary .g-readings__kicker { color: var(--g-accent); }
.g-readings__headline { margin: 0 0 8px; font-family: var(--g-font-serif); font-size: 1.25rem; line-height: 1.25; color: var(--g-text); text-wrap: balance; }
.g-readings__lines { margin: 0; padding: 0 0 0 1.1em; color: var(--g-text); font-size: 0.93em; line-height: 1.5; display: flex; flex-direction: column; gap: 4px; }
.g-readings__summary .g-card__actions { margin-top: 10px; }

/* Hero: two gauges + the sparkline (or the spectrum when there is no history) */
.g-readings__hero { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 14px 0 0; align-items: stretch; }
.g-readings__hero > .g-readings__spark, .g-readings__hero > .g-readings__spectrum { grid-column: 1 / -1; }
@media (min-width: 640px) { .g-readings__hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); } .g-readings__hero > .g-readings__spark, .g-readings__hero > .g-readings__spectrum { grid-column: auto; } }
.g-readings__gauge { margin: 0; padding: 8px 8px 10px; background: var(--g-surface-hi); border: 1px solid var(--g-line); border-radius: var(--g-r-md); display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
.g-readings__gauge svg { width: 100%; max-width: 150px; height: auto; display: block; }
.g-readings__gauge figcaption { font-size: 0.8rem; color: var(--g-text); text-align: center; line-height: 1.3; }
.g-readings__gauge figcaption .g-readings__muted { display: block; margin: 0; font-size: 0.74rem; }
.g-readings__gauge-track { fill: none; stroke: var(--g-line); stroke-width: 9; stroke-linecap: round; }
.g-readings__gauge-fill { fill: none; stroke: var(--g-accent); stroke-width: 9; stroke-linecap: round; }
.g-readings__gauge-n { fill: var(--g-text); font-family: var(--g-font-serif); font-size: 24px; font-variant-numeric: tabular-nums; }
.g-readings__gauge-u { fill: var(--g-text-muted); font-size: 9px; }
.g-readings__gauge-min, .g-readings__gauge-max { fill: var(--g-text-muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.g-readings__spark { margin: 0; padding: 10px 10px 8px; background: var(--g-surface-hi); border: 1px solid var(--g-line); border-radius: var(--g-r-md); display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.g-readings__spark svg { width: 100%; height: 96px; display: block; }
.g-readings__spark-grid { stroke: var(--g-line); stroke-width: 1; stroke-dasharray: 2 4; }
.g-readings__spark-e { fill: none; stroke: var(--rd-e); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.g-readings__spark-s { fill: none; stroke: var(--rd-s); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; }
.g-readings__spark-e-dot { fill: var(--rd-e); } .g-readings__spark-s-dot { fill: var(--rd-s); }
.g-readings__spark figcaption { display: flex; justify-content: space-between; align-items: center; font-size: 0.74rem; color: var(--g-text-muted); gap: 8px; }
.g-readings__spark-key { display: inline-flex; gap: 10px; align-items: center; }
.g-readings__spark-key i { display: inline-block; width: 14px; height: 3px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }
.g-readings__spark-key i.is-e { background: var(--rd-e); } .g-readings__spark-key i.is-s { background: var(--rd-s); }

/* The seven centres */
.g-readings__spectrum { display: flex; justify-content: space-between; align-items: flex-end; gap: 4px; padding: 10px 6px 6px; margin: 0 0 10px; min-width: 0; }
.g-readings__hero > .g-readings__spectrum { background: var(--g-surface-hi); border: 1px solid var(--g-line); border-radius: var(--g-r-md); margin: 0; align-items: flex-end; }
.g-readings__disc { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; height: 64px; }
.g-readings__disc i { display: block; border-radius: 50%; box-shadow: 0 2px 8px color-mix(in srgb, currentColor 20%, transparent); }
.g-readings__disc b { font-weight: 500; font-size: 0.62rem; color: var(--g-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.g-readings__dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 7px; vertical-align: 0; }
.g-readings__chakras { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 6px; }
@media (min-width: 640px) { .g-readings__chakras { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; } }
.g-readings__chakra { display: grid; grid-template-columns: 8rem minmax(0, 1fr) 3rem; align-items: center; gap: 10px; font-size: 0.92em; }
.g-readings__chakra-name { color: var(--g-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-readings__chakra-val { text-align: right; color: var(--g-text-muted); font-variant-numeric: tabular-nums; }
.g-readings__bar { display: block; height: 7px; border-radius: 999px; background: var(--g-line); overflow: hidden; }
.g-readings__bar > span { display: block; height: 100%; border-radius: 999px; background: var(--rd-bar); }

/* Detail grid */
.g-readings__grid { display: grid; grid-template-columns: 1fr; column-gap: 22px; }
@media (min-width: 640px) { .g-readings__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .g-readings__sec--wide { grid-column: 1 / -1; } }
@media (min-width: 900px) { .g-readings__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.g-readings__stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 12px; }
.g-readings__stat { background: var(--g-surface-hi); border: 1px solid var(--g-line); border-radius: var(--g-r-md); padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.g-readings__stat-n { font-family: var(--g-font-serif); font-size: 1.35rem; line-height: 1.1; color: var(--g-text); font-variant-numeric: tabular-nums; }
.g-readings__stat-l { font-size: 0.76rem; color: var(--g-text-muted); }
.g-readings__flags, .g-readings__pairs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.g-readings__flag, .g-readings__pair { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--g-line); font-size: 0.92em; }
.g-readings__flag:last-child, .g-readings__pair:last-child { border-bottom: 0; }
.g-readings__flag .g-readings__muted, .g-readings__pair .g-readings__muted { display: inline; font-size: 0.85em; }
.g-readings__pill { flex: none; padding: 2px 9px; border-radius: 999px; font-size: 0.74rem; font-weight: 600; letter-spacing: 0.02em; color: var(--g-text-muted); background: var(--g-surface-hi); border: 1px solid var(--g-line); white-space: nowrap; font-variant-numeric: tabular-nums; }
.g-readings__pill.is-high { color: var(--rd-high); border-color: color-mix(in srgb, var(--rd-high) 45%, transparent); background: color-mix(in srgb, var(--rd-high) 12%, transparent); }
.g-readings__pill.is-elevated { color: var(--rd-elev); border-color: color-mix(in srgb, var(--rd-elev) 45%, transparent); background: color-mix(in srgb, var(--rd-elev) 12%, transparent); }
.g-readings__pair { flex-wrap: wrap; }
.g-readings__pair-when { color: var(--g-text); }
.g-readings__pair-deltas { color: var(--g-text-muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.g-readings__delta { font-weight: 600; color: var(--g-text); }
.g-readings__code { margin: 6px 0 2px; font-family: var(--g-font-mono); font-size: 1.9rem; letter-spacing: 0.14em; color: var(--g-accent); font-variant-numeric: tabular-nums; }
.g-readings__code-gap { display: inline-block; width: 0.5em; }
/* Practitioner note, centre of the week, compare-any-two */
.g-readings__pnote { background: var(--g-surface-hi); border: 1px solid var(--g-line); border-radius: var(--g-r-md); padding: 12px 14px; border-top-width: 1px; }
.g-readings__pnote-text { font-family: var(--g-font-serif); font-size: 1.1rem; font-weight: 500; line-height: 1.4; white-space: pre-line; }
.g-readings__centre-row { display: flex; gap: 12px; align-items: flex-start; }
.g-readings__centre-disc { flex: none; width: 34px; height: 34px; border-radius: 50%; margin-top: 2px; box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 10%, transparent); }
.g-readings__pick-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.g-readings__pick-row label { display: flex; flex-direction: column; gap: 4px; font-size: 0.76rem; color: var(--g-text-muted); min-width: 0; }
.g-readings__pick-row select { width: 100%; min-width: 0; padding: 8px 10px; border-radius: var(--g-r-md); border: 1px solid var(--g-line); background: var(--g-surface-hi); color: var(--g-text); font: inherit; font-size: 0.92rem; }
.g-readings__pick-out { margin: 10px 0 0; color: var(--g-text); font-variant-numeric: tabular-nums; }
/* First-visit explainer and "read this first" */
.g-readings__explain { margin: 14px 0 0; border: 1px solid var(--g-line); border-radius: var(--g-r-md); background: var(--g-surface-hi); padding: 0 14px; }
.g-readings__explain > summary { cursor: pointer; padding: 11px 0; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--g-text-muted); list-style: none; display: flex; align-items: center; justify-content: space-between; }
.g-readings__explain > summary::-webkit-details-marker { display: none; }
.g-readings__explain > summary::after { content: '+'; font-size: 1.1rem; font-weight: 500; color: var(--g-accent); }
.g-readings__explain[open] > summary::after { content: '–'; }
.g-readings__explain-grid { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 0 0 14px; }
@media (min-width: 640px) { .g-readings__explain-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.g-readings__explain-card { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: var(--g-r-md); background: var(--g-surface); border: 1px solid var(--g-line); font-size: 0.86em; line-height: 1.45; color: var(--g-text-muted); }
.g-readings__explain-card strong { color: var(--g-text); font-weight: 600; }
.g-readings__first { background: color-mix(in srgb, var(--g-accent) 8%, var(--g-surface-hi)); border: 1px solid color-mix(in srgb, var(--g-accent) 28%, var(--g-line)); border-radius: var(--g-r-md); padding: 12px 14px; }
.g-readings__first .g-readings__kicker { color: var(--g-accent); }
/* Today nudge and the dot on the You tab: "a newer reading exists", nothing more */
.g-readings-nudge { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 12px 14px; border-radius: var(--g-r-md); background: var(--g-surface); border: 1px solid var(--g-line); color: var(--g-text); text-decoration: none; }
.g-readings-nudge.is-new { background: color-mix(in srgb, var(--g-accent) 10%, var(--g-surface)); border-color: color-mix(in srgb, var(--g-accent) 32%, var(--g-line)); }
.g-readings-nudge i { font-size: 1.3rem; color: var(--g-accent); flex: none; }
.g-readings-nudge span { flex: 1 1 auto; min-width: 0; font-size: 0.92rem; line-height: 1.35; }
.g-readings-nudge strong { font-weight: 600; }
.g-readings-nudge em { font-style: normal; font-weight: 600; color: var(--g-accent); flex: none; }
.gaia-tabbar__link.has-new-reading .gaia-tabbar__icon { position: relative; }
.gaia-tabbar__link.has-new-reading .gaia-tabbar__icon::after { content: ''; position: absolute; top: -2px; right: -5px; width: 9px; height: 9px; border-radius: 50%; background: var(--g-accent); box-shadow: 0 0 0 2px var(--g-bg); }
@media (prefers-reduced-motion: reduce) { .g-readings.is-focus { transition: none; } }
/* the pass and its next level, one card */
body.gaia-v2 [data-screen="profile"] #member-me > .g-pass-stack { grid-column: 1 / -1; display: flex; flex-direction: column; }
body.gaia-v2 [data-screen="profile"] .g-pass-stack > .g-pass { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
body.gaia-v2 [data-screen="profile"] .g-pass-stack > .g-next { margin-top: 0; border-top: 1px dashed var(--v3-border); border-top-left-radius: 0; border-top-right-radius: 0; padding: 16px 20px 18px; }
body.gaia-v2 [data-screen="profile"] .g-pass-stack > .g-next .g-next__title { font-size: 1.2rem; }
body.gaia-v2 [data-screen="profile"] .g-pass-stack > .g-next .g-next__lead { margin-top: 10px; }
body.gaia-v2 [data-screen="profile"] .g-pass-stack > .g-next.is-collapsed { padding: 12px 20px; }
/* My readings, folded */
.g-readings--folded .g-readings__summary { margin-top: 10px; }
.g-prac-badge { display: inline-block; margin-left: 6px; padding: 2px 9px; border-radius: 999px; font-size: 0.72rem; font-weight: 700; letter-spacing: .04em; color: var(--g-accent); background: color-mix(in srgb, var(--g-accent) 12%, transparent); border: 1px solid color-mix(in srgb, var(--g-accent) 40%, transparent); vertical-align: middle; }
.g-prac__attempt { margin: 0 0 10px; padding: 9px 12px; border-radius: 12px; font-size: 0.9em; color: var(--g-text); background: color-mix(in srgb, var(--g-danger) 12%, transparent); border: 1px solid color-mix(in srgb, var(--g-danger) 40%, transparent); }
.g-prac-link { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: 6px; vertical-align: middle; }
.g-prac-link__as { font-size: 0.78rem; color: var(--g-text-muted); }
.g-prac-link__x { background: none; border: 0; padding: 0; font: inherit; font-size: 0.78rem; font-weight: 600; color: var(--g-text-muted); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.g-prac-link__x:hover, .g-prac-link__x:focus-visible { color: var(--g-danger); outline: none; }

/* Keep practitioner recovery and empty states readable in the app's dark theme. */
#practitioner-panel .gaia-empty { background: var(--g-surface); color: var(--g-text); border: 1px solid var(--g-line); }
#practitioner-panel .gaia-empty__text { color: var(--g-text-muted); }
#practitioner-panel .gaia-empty .g-btn { color: var(--g-text); }
[data-prac-disconnect-error] { display: block; margin-top: 8px; color: var(--g-text); font-size: 13px; }

/* Reading sharing must wrap long names and dates on narrow screens. */
.g-datashare .g-row { flex-wrap: wrap; gap: 6px 16px; }
.g-datashare .g-row > span { min-width: 0; overflow-wrap: anywhere; white-space: normal; }
.g-datashare .g-row__meta { flex: 1 1 170px; max-width: 100%; white-space: normal; }
.g-readings__averages { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 12px 0; }
.g-readings__averages > div { display: grid; gap: 8px; }
.g-readings__averages strong { font-size: 1.6rem; }
.g-readings__averages .g-readings__bar > span { background: var(--g-accent); }
@media (max-width: 480px) { .g-datashare .g-row { display: grid; grid-template-columns: 1fr; } .g-datashare .g-row__meta { text-align: left; } }
.g-readings__summary, .g-readings__pick, [data-prac-pick] { scroll-margin-top: 140px; scroll-margin-bottom: 100px; }

/* ---------- Shop: category jump row, one tile background, Home's column ----
   ~130 products in 14 sections: a row of category buttons (gaia-store.js)
   sits above the catalogue and sticks under the header while scrolling;
   each scrolls to its section. Product photos arrive on white, transparent
   or dark backgrounds, so every image tile is the same light ground; a
   product with no photo shows a bag icon instead of an empty box. */
body.gaia-v2 [data-screen="store"] .g-store-jump {
  /* Sticks just under the Shop | Membership tabs, which are sticky too
     (72px from the top on desktop, 66px on phones; 54px tall). */
  position: sticky;
  top: 134px;
  z-index: 4;
  display: flex;
  gap: 8px;
  margin: 0 0 18px;
  padding: 8px;
  overflow-x: auto;
  scrollbar-width: none;
  border: 1px solid var(--v3-border);
  border-radius: 999px;
  background: rgba(8, 17, 13, 0.88);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
body.gaia-v2 [data-screen="store"] .g-store-jump::-webkit-scrollbar { display: none; }
/* More chips than fit: fade the right edge so the row reads as scrollable. */
body.gaia-v2 [data-screen="store"] .g-store-jump {
  -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
  mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent);
}
body.gaia-v2 [data-screen="store"] .g-store-jump__chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 6px 14px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: var(--v3-text-2);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
body.gaia-v2 [data-screen="store"] .g-store-jump__chip span { color: var(--v3-muted); font-weight: 500; font-size: 12px; }
body.gaia-v2 [data-screen="store"] .g-store-jump__chip:hover { background: var(--v3-card-2); color: var(--v3-text); }
body.gaia-v2 [data-screen="store"] .g-store-jump__chip:focus-visible { outline: none; border-color: var(--v3-border-strong); color: var(--v3-text); }
body.gaia-v2 [data-screen="store"] .g-store-cat { scroll-margin-top: 200px; }
@media (max-width: 1099px) {
  body.gaia-v2 [data-screen="store"] .g-store-jump { top: 128px; }
  body.gaia-v2 [data-screen="store"] .g-store-cat { scroll-margin-top: 194px; }
}

body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__media { background: var(--g-text); }
body.gaia-v2 [data-screen="store"] .g-store-tile .g-tile__media--empty {
  display: grid;
  place-items: center;
  background: var(--g-surface-hi);
  color: var(--v3-muted);
  font-size: 34px;
}

@media (min-width: 1100px) {
  body.gaia-v2 [data-screen="store"] .gaia-main.g-store > * {
    width: 100%;
    max-width: 1180px;
    margin-inline: auto;
  }
  body.gaia-v2 [data-screen="store"] .gaia-main.g-store > .g-tabs { width: fit-content; margin-left: max(0px, calc((100% - 1180px) / 2)); margin-right: auto; }
}

/* ---------- You, signed out: two cards side by side, buttons at their size --
   Only when the page shows the sign-in card (#member-me holds a
   [data-native-signin] button); the signed-in You is untouched. From 700px
   the buttons keep their own width (they each took half the card); from
   1100px the page uses the 1180px column and "Sync your access" and
   "Become a practitioner" share one row at equal height. */
@media (min-width: 700px) {
  body.gaia-v2 [data-screen="profile"] #member-me:has([data-native-signin]) .g-card__actions { justify-content: flex-start; }
  body.gaia-v2 [data-screen="profile"] #member-me:has([data-native-signin]) .g-card__actions .g-btn {
    flex: 0 0 auto;
    width: auto;
    padding-inline: 24px;
  }
}
@media (min-width: 700px) and (max-width: 1099px) {
  body.gaia-v2 [data-screen="profile"] #member-me:has([data-native-signin]) > .g-card { grid-column: 1 / -1; }
}
@media (min-width: 1100px) {
  body.gaia-v2 [data-screen="profile"] .g-page.g-profile > * {
    width: 100%;
    max-width: 1180px;
    margin-inline: auto;
  }
  body.gaia-v2 [data-screen="profile"] #member-me:has([data-native-signin]) {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 16px;
  }
  body.gaia-v2 [data-screen="profile"] #member-me:has([data-native-signin]) > .g-card {
    grid-column: auto;
    width: auto;
    max-width: none;
    margin: 0;
    display: flex;
    flex-direction: column;
  }
  body.gaia-v2 [data-screen="profile"] #member-me:has([data-native-signin]) > .g-card .g-card__actions { margin-top: auto; padding-top: 16px; }
}

/* ---------- Membership plans on wide screens: four across, one bright CTA --
   From 1100px the four plans sit in one row (they were a 2x2 grid that
   read as two separate pairs). Every "Choose" button was the same bright
   primary, so the featured plan did not stand out: only the featured
   plan's button stays primary; the others are outlined. */
@media (min-width: 1100px) {
  body.gaia-v2 [data-screen="store"] #store-memberships:has(> .g-tier) {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
  }
  body.gaia-v2 [data-screen="store"] #store-memberships:has(> .g-tier) > :not(.g-tier) { grid-column: 1 / -1; }
  body.gaia-v2 [data-screen="store"] #store-memberships > .g-tier {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 22px 20px;
  }
  body.gaia-v2 [data-screen="store"] #store-memberships > .g-tier .g-card__actions { margin-top: auto; padding-top: 18px; }
  body.gaia-v2 [data-screen="store"] #store-memberships > .g-tier .g-tier__list li { font-size: 14px; }
}
body.gaia-v2 [data-screen="store"] #store-memberships:has(> .g-tier--featured) > .g-tier:not(.g-tier--featured) .g-card__actions .g-btn--primary {
  background: transparent;
  border: 1px solid var(--v3-border-strong);
  color: var(--v3-text);
  box-shadow: none;
}

/* Practice: the back link sits where a back link is expected; on wide
   screens the client lists are two columns instead of full-width bars. */
.g-prac--client > [data-prac-back] { align-self: flex-start; margin-right: auto; padding-inline: 4px; }
@media (min-width: 1100px) {
  .g-prac__sec:has(> .g-prac__client) ,
  .g-prac [data-prac-client-list] { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: stretch; }
  .g-prac__sec:has(> .g-prac__client) > :not(.g-prac__client) { grid-column: 1 / -1; }
  .g-prac [data-prac-client-list] > :not(.g-prac__client) { grid-column: 1 / -1; }
  .g-prac [data-prac-client-list] > .g-prac__client, .g-prac__sec > .g-prac__client { margin: 0; }
}

/* "Already a practitioner?" (Account card): hidden for practitioners, who have the Practice tab. */
[data-prac-optin][hidden] { display: none !important; }

/* —— Practice workspace header (gaia-practitioner.js workspaceHead) ——————— */
.g-prac-ws { display: grid; gap: 14px; margin: 4px 0 22px; padding: 20px 22px; border-radius: 22px; background: radial-gradient(120% 140% at 100% 0%, rgba(88, 199, 232, 0.10), transparent 55%), var(--g-surface-hi); }
.g-prac-ws__kicker { margin: 0; color: var(--g-accent); font-size: 11.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.g-prac-ws__name { margin: 4px 0 0; font-size: clamp(22px, 2.6vw, 28px); font-weight: 600; letter-spacing: -0.015em; }
.g-prac-ws__pills { display: flex; flex-wrap: wrap; gap: 8px; }
.g-prac-ws__pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 600; border: 1px solid var(--g-line); color: var(--g-text-muted); }
.g-prac-ws__pill.is-ok { color: var(--g-accent); border-color: color-mix(in srgb, var(--g-accent) 40%, transparent); }
.g-prac-ws__pill.is-pending { color: var(--g-warn); border-color: color-mix(in srgb, var(--g-warn) 45%, transparent); }
.g-prac-ws__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; }
.g-prac-ws__stats div { padding: 10px 12px; border-radius: 14px; background: var(--g-surface); }
.g-prac-ws__stats dt { color: var(--g-text-muted); font-size: 12px; }
.g-prac-ws__stats dd { margin: 2px 0 0; font-size: 22px; font-weight: 600; font-variant-numeric: tabular-nums; }
@media (min-width: 900px) {
  .g-prac-ws { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .g-prac-ws__stats { grid-column: 1 / -1; }
}