/* ============================================================
   GAIA DESIGN SYSTEM — v1 (Home reference screen)
   Additive & scoped: only the Home screen (.g-home) and the new
   g-* components use these tokens. Old screens keep their old CSS.
   Home is intentionally dark ("dark-first"); light mode is a later phase.
   ============================================================ */

/* ---------- @layer tokens ---------- */
:root{
  /* Template v2 palette (gaia-home-redesign): blue-black ground, lime accent,
     glassy cards. One change here restyles every screen that reads tokens. */
  --g-bg:#04070A; --g-surface:#0C1117; --g-surface-hi:#131A22;
  --g-line:rgba(255,255,255,.09); --g-line-strong:rgba(255,255,255,.15);
  --g-text:#FFFFFF; --g-text-muted:rgba(255,255,255,.62); --g-text-faint:rgba(255,255,255,.40);
  --g-accent:#B6F25C; --g-accent-deep:#8FE03F; --g-on-accent:#0B1408;
  --g-purple:#A78BFA; --g-purple-deep:#6D4FD6; --g-teal:#5CE1E6; --g-gold:#F5C451;
  --g-good:#5CB82E; --g-warn:#E8B04B; --g-danger:#E5715A;
  --g-ck-root:#E53935; --g-ck-sacral:#FB8C00; --g-ck-solar:#FDD835;
  --g-ck-heart:#43A047; --g-ck-throat:#29A8F2; --g-ck-brow:#4F46E5; --g-ck-crown:#8E24AA;

  --g-r-sm:10px; --g-r-md:14px; --g-r-lg:18px; --g-r-xl:24px; --g-r-pill:999px;
  --g-s1:4px; --g-s2:8px; --g-s3:12px; --g-s4:16px; --g-s5:24px;
  --g-s6:32px; --g-s7:48px; --g-s8:64px; --g-s9:96px;

  --g-font:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --g-font-serif:ui-serif,Georgia,"Times New Roman",serif;
  --g-font-mono:ui-monospace,SFMono-Regular,Menlo,monospace;

  --g-shadow-card:0 10px 30px -18px rgba(0,0,0,.55);
  --g-shadow-pop:0 24px 60px -20px rgba(0,0,0,.6);
  --g-glow:0 0 26px rgba(182,242,92,.4);
  --g-ease:cubic-bezier(.22,1,.36,1);
  --g-dur-1:140ms; --g-dur-2:260ms; --g-dur-3:420ms;
  --g-focus:0 0 0 2px var(--g-bg),0 0 0 4px var(--g-accent);
  --g-tap:44px;
}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){
  :root{--g-dur-1:0ms;--g-dur-2:0ms;--g-dur-3:0ms}
}

/* ---------- @layer components ---------- */

/* g-btn ------------------------------------------------------ */
.g-btn{
  --pad-x:var(--g-s4);--pad-y:12px;
  display:inline-flex;align-items:center;justify-content:center;gap:var(--g-s2);
  min-height:var(--g-tap);padding:var(--pad-y) var(--pad-x);
  font:600 15px/1 var(--g-font);letter-spacing:-.01em;
  border:1px solid transparent;border-radius:var(--g-r-md);
  cursor:pointer;white-space:nowrap;user-select:none;text-decoration:none;
  transition:transform var(--g-dur-1) var(--g-ease),filter var(--g-dur-1) var(--g-ease),
             background var(--g-dur-1) var(--g-ease),border-color var(--g-dur-1) var(--g-ease)}
.g-btn:focus-visible{outline:none;box-shadow:var(--g-focus)}
.g-btn--primary{background:var(--g-accent);color:var(--g-on-accent);font-weight:700}
.g-btn--primary:hover{filter:brightness(1.06)}
.g-btn--secondary{background:var(--g-surface-hi);color:var(--g-text);border-color:var(--g-line)}
.g-btn--secondary:hover{border-color:var(--g-line-strong)}
.g-btn--ghost{background:transparent;color:var(--g-accent);padding-inline:var(--g-s1);min-height:auto}
.g-btn--ghost:hover{filter:brightness(1.12)}
.g-btn--pill{border-radius:var(--g-r-pill);background:transparent;color:var(--g-text);
  border-color:var(--g-line);font-weight:600}
.g-btn--pill:hover{background:var(--g-surface-hi)}
.g-btn--sm{--pad-y:8px;--pad-x:var(--g-s3);min-height:36px;font-size:13px}
.g-btn--block{display:flex;width:100%}
.g-btn:active{transform:translateY(1px) scale(.99)}
.g-btn[disabled]{opacity:.45;pointer-events:none}

/* g-section -------------------------------------------------- */
.g-section{display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--g-s3);margin-bottom:var(--g-s3)}
.g-section__lead{display:flex;flex-direction:column;gap:var(--g-s1);min-width:0}
.g-section__kicker{font:600 11px/1 var(--g-font-mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--g-accent)}
.g-section__title{font:600 20px/1.1 var(--g-font);letter-spacing:-.015em;margin:0;color:var(--g-text)}
.g-section--display .g-section__title{font-family:var(--g-font-serif);font-size:clamp(30px,7vw,42px);
  font-weight:600;line-height:1;letter-spacing:-.02em}
.g-section__action{flex:none}

/* g-card ----------------------------------------------------- */
.g-card{display:flex;flex-direction:column;gap:var(--g-s2);
  background:var(--g-surface);border:1px solid var(--g-line);
  border-radius:var(--g-r-lg);padding:var(--g-s4);color:var(--g-text);box-shadow:var(--g-shadow-card)}
.g-card--lg{padding:var(--g-s5);border-radius:var(--g-r-xl)}
.g-card--flush{padding:0;overflow:hidden}
.g-card--feature{background:
  radial-gradient(160px 120px at 100% 0,rgba(125,217,86,.18),transparent 62%),
  linear-gradient(150deg,#1a3520,#0e1c12);border-color:var(--g-line-strong)}
.g-card__label{font:600 11px/1 var(--g-font-mono);letter-spacing:.09em;
  text-transform:uppercase;color:var(--g-accent)}
.g-card__value{font:600 20px/1.15 var(--g-font);letter-spacing:-.01em}
.g-card__value--lg{font-size:clamp(22px,5vw,28px)}
.g-card__meta{font-size:13px;color:var(--g-text-muted);line-height:1.45}
.g-card__actions{display:flex;flex-wrap:wrap;gap:var(--g-s2);margin-top:var(--g-s2)}
.g-card--interactive{cursor:pointer;text-decoration:none;
  transition:transform var(--g-dur-2) var(--g-ease),border-color var(--g-dur-2) var(--g-ease)}
.g-card--interactive:hover{border-color:var(--g-line-strong);transform:translateY(-2px)}

/* g-tile + rail --------------------------------------------- */
.g-rail{display:flex;gap:var(--g-s3);overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  padding-bottom:var(--g-s2);scrollbar-width:thin}
.g-tile{flex:0 0 9rem;scroll-snap-align:start;display:flex;flex-direction:column;
  gap:var(--g-s2);text-decoration:none;color:inherit}
.g-tile__media{aspect-ratio:1;border-radius:var(--g-r-md);overflow:hidden;
  background:var(--g-surface-hi);border:1px solid var(--g-line);display:block;
  transition:transform var(--g-dur-2) var(--g-ease),border-color var(--g-dur-2) var(--g-ease)}
.g-tile__media img{width:100%;height:100%;object-fit:cover;display:block}
.g-tile:hover .g-tile__media{transform:scale(1.02);border-color:var(--g-line-strong)}
.g-tile__title{font-size:13px;line-height:1.25;color:var(--g-text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.g-tile__meta{font:700 11px/1 var(--g-font);color:var(--g-accent)}

/* g-hero ----------------------------------------------------- */
.g-hero{position:relative;overflow:hidden;border-radius:var(--g-r-xl);
  padding:var(--g-s6) var(--g-s5);min-height:200px;display:flex;flex-direction:column;
  justify-content:flex-end;gap:var(--g-s2);border:1px solid var(--g-line);
  background:
    radial-gradient(220px 220px at 82% 24%,rgba(125,217,86,.20),transparent 60%),
    radial-gradient(260px 200px at 12% 96%,rgba(41,168,242,.10),transparent 62%),
    linear-gradient(160deg,#12281a,#0a140d)}
.g-hero__spectrum{position:absolute;top:0;left:0;right:0;height:4px;display:flex;opacity:.9}
.g-hero__spectrum span{flex:1}
.g-hero__kicker{font:600 11px/1 var(--g-font-mono);letter-spacing:.14em;
  text-transform:uppercase;color:var(--g-accent)}
.g-hero__title{font-family:var(--g-font-serif);font-weight:600;
  font-size:clamp(30px,8vw,46px);line-height:1;letter-spacing:-.02em;margin:0;color:var(--g-text);text-wrap:balance}
.g-hero__title em{font-style:italic;color:var(--g-accent)}
.g-hero__sub{font-size:15px;color:var(--g-text-muted);max-width:34ch;margin:0}

/* g-chakra-hero — the signature. Cinematic full-bleed meditation image (already
   carries the 7 glowing centres); greeting overlaid; the centres are tappable to
   reveal their essence. No scores, no list, no fake data. -------------------- */
/* The scrim and the overlay are siblings of the stage, not children of it, so
   they resolve against .g-chakra-hero — which is the stage *plus* the guide
   panel beneath it. Anchoring them with inset:0 / bottom:0 therefore stretched
   both across the guide as well, and the overlay's centred text drifted a
   third of the way down the page. --stage-h is the one height all three read,
   so they cannot come apart again; each breakpoint sets the token, not the
   individual heights. */
.g-chakra-hero{--stage-h:min(52vh,460px);
  position:relative;border-radius:var(--g-r-xl);overflow:hidden;
  background:#05070a;border:1px solid var(--g-line);
  box-shadow:0 34px 90px -52px rgba(0,0,0,.95),0 0 70px -38px rgba(125,217,86,.2)}
@supports (height:100dvh){ .g-chakra-hero{--stage-h:min(52dvh,460px)} }

/* editorial section headers on Home ------------------------- */
.g-sec-head{display:flex;flex-direction:column;gap:3px;margin-bottom:calc(var(--g-s2) * -1)}
.g-sec-head__kicker{font:600 11px/1 var(--g-font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--g-accent);margin:0}
.g-sec-head__title{font-family:var(--g-font-serif);font-weight:600;font-size:clamp(24px,6vw,30px);
  line-height:1;letter-spacing:-.02em;color:var(--g-text);margin:0;text-wrap:balance}
.g-chakra-hero__stage{height:var(--stage-h);display:flex;justify-content:center;align-items:center}
.g-chakra-hero__fig{position:relative;height:100%}
.g-chakra-hero__fig img{height:100%;width:auto;display:block;
  animation:g-breathe 8s var(--g-ease) infinite}
@keyframes g-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
.g-chakra-hero__hit{position:absolute;transform:translate(-50%,-50%);
  width:30px;height:30px;border-radius:50%;border:none;background:transparent;cursor:pointer;padding:0}
.g-chakra-hero__hit::after{content:"";position:absolute;inset:8px;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.22);animation:g-ck-hint 3.4s var(--g-ease) infinite;
  animation-delay:calc(var(--i,0)*.22s)}
.g-chakra-hero__hit:hover::after{border-color:rgba(255,255,255,.5)}
.g-chakra-hero__hit.is-active::after{inset:4px;border-color:var(--ck);box-shadow:0 0 14px var(--ck)}
.g-chakra-hero__hit:focus-visible{outline:none}
.g-chakra-hero__hit:focus-visible::after{border-color:var(--g-accent);box-shadow:0 0 0 2px var(--g-accent)}
@keyframes g-ck-hint{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.4);opacity:1}}
.g-chakra-hero__scrim{position:absolute;top:0;left:0;right:0;height:var(--stage-h);pointer-events:none;
  background:linear-gradient(0deg,rgba(5,7,10,.94) 6%,rgba(5,7,10,.5) 26%,transparent 52%)}
.g-chakra-hero__overlay{position:absolute;left:0;right:0;top:auto;bottom:calc(100% - var(--stage-h));
  padding:var(--g-s6) var(--g-s5) var(--g-s5);display:flex;flex-direction:column;gap:var(--g-s2);pointer-events:none}
.g-chakra-hero__kicker{font:600 11px/1 var(--g-font-mono);letter-spacing:.14em;
  text-transform:uppercase;color:var(--g-accent);margin:0}
.g-chakra-hero__title{font-family:var(--g-font-serif);font-weight:600;
  font-size:clamp(32px,9vw,52px);line-height:.98;letter-spacing:-.02em;margin:0;color:var(--g-text);text-wrap:balance}
.g-chakra-hero__title em{font-style:italic;color:var(--g-accent)}
.g-chakra-hero__caption{font-size:14px;color:var(--g-text-muted);margin:0;min-height:1.3em}
.g-chakra-hero__caption strong{color:var(--g-text);font-weight:600}
.g-chakra-hero__caption a{color:var(--g-accent);font-weight:600;text-decoration:none;pointer-events:auto}
/* tapped-centre info: a floating card anchored right next to the node */
.g-chakra-hero__pop{position:absolute;z-index:4;left:50%;top:50%;
  transform:translate(-50%,16px);width:min(62vw,224px);
  background:rgba(9,14,11,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--ck,var(--g-line));border-radius:14px;padding:11px 13px;
  box-shadow:0 12px 36px rgba(0,0,0,.6);opacity:0;
  /* click-through: the card never blocks the centres underneath it — only its
     own link is interactive. Dismiss by re-tapping a centre or empty space. */
  pointer-events:none;
  transition:opacity .26s ease,transform .26s ease}
.g-chakra-hero__pop.is-open{opacity:1}
.g-chakra-hero__pop.is-above{transform:translate(-50%,calc(-100% - 16px))}
.g-chakra-hero__pop strong{display:block;font-family:var(--g-font-serif);font-weight:600;font-size:16px;color:var(--g-text)}
.g-chakra-hero__pop span{display:block;font-size:12.5px;color:var(--g-text-muted);margin-top:2px;line-height:1.35}
.g-chakra-hero__pop a{display:inline-block;margin-top:7px;font-size:12.5px;font-weight:600;color:var(--ck,var(--g-accent));text-decoration:none;pointer-events:auto}
@media (prefers-reduced-motion:reduce){
  .g-chakra-hero__fig img,.g-chakra-hero__hit::after{animation:none}
  .g-chakra-hero__pop{transition:opacity .26s ease}
}

/* ---------- Home layout (the only Home-specific scaffolding) ---------- */
.g-home{background:var(--g-bg);color:var(--g-text);font-family:var(--g-font);
  display:flex;flex-direction:column;gap:var(--g-s6);
  padding:var(--g-s2) var(--g-s4) calc(var(--g-s9) + env(safe-area-inset-bottom))}
.g-home>section{scroll-margin-top:var(--g-s5)}
.g-home-cards{display:grid;grid-template-columns:1fr;gap:var(--g-s3)}
.g-chakra__frame{margin-top:var(--g-s3);border-radius:var(--g-r-xl);overflow:hidden;
  border:1px solid var(--g-line);background:
    radial-gradient(200px 240px at 50% 30%,rgba(125,217,86,.10),transparent 62%),var(--g-surface);
  padding:var(--g-s3)}
/* clean Home header (today screen only) */
.g-topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--g-s2);
  flex-wrap:nowrap;padding:var(--g-s4) var(--g-s4) var(--g-s2);background:var(--g-bg)}
.g-topbar__brand{display:flex;align-items:center;gap:var(--g-s2);flex:none;
  font:700 17px/1 var(--g-font);letter-spacing:-.01em;color:var(--g-text);text-decoration:none}
.g-topbar__brand img{width:26px;height:26px;border-radius:50%}
.g-topbar__actions{display:flex;align-items:center;gap:var(--g-s2);flex:none;flex-wrap:nowrap}
/* the injected "Live sync" status pill clutters the small top bar — hide it
   on phones (it stays on desktop where there's room) */
@media (max-width:640px){ .g-topbar .gaia-live-sync--header{display:none} }

/* Make the old chakra map read on the dark Home canvas + breathe */
.g-chakra__frame .gaia-chakra-map{--chakra-frame:transparent}
/* Belt-and-braces: legacy coach card never shows on the new Home
   (the #gaia-coach-anchor is also removed, so initCoachMark returns early) */
.g-home .gaia-coach{display:none}

/* g-skeleton (calm loading; the only loading pattern) --------- */
.g-sk{display:flex;flex-direction:column;gap:var(--g-s2)}
.g-sk-b{height:14px;border-radius:var(--g-r-sm);
  background:linear-gradient(90deg,var(--g-surface),var(--g-surface-hi),var(--g-surface));
  animation:g-sk 1.4s var(--g-ease) infinite}
.g-sk-b.big{height:120px}.g-sk-b.w8{width:80%}.g-sk-b.w6{width:60%}
@keyframes g-sk{0%,100%{opacity:.6}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.g-sk-b{animation:none}}

/* g-badge ---------------------------------------------------- */
.g-badge{display:inline-block;font:600 11px/1 var(--g-font-mono);letter-spacing:.05em;
  text-transform:uppercase;padding:4px 9px;border-radius:var(--g-r-sm);
  color:var(--g-text-muted);border:1px solid var(--g-line);white-space:nowrap}
.g-badge--on{color:var(--g-on-accent);background:var(--g-accent);border-color:transparent}

/* g-tabs (segmented control) --------------------------------- */
.g-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;width:100%;max-width:360px;
  background:var(--g-surface);border:1px solid var(--g-line);border-radius:var(--g-r-pill)}
.g-tab{appearance:none;border:none;background:transparent;color:var(--g-text-muted);
  font:600 14px/1 var(--g-font);padding:10px 16px;border-radius:var(--g-r-pill);cursor:pointer;
  min-height:38px;transition:background var(--g-dur-1) var(--g-ease),color var(--g-dur-1) var(--g-ease)}
.g-tab.is-active{background:var(--g-accent);color:var(--g-on-accent)}
.g-tab:focus-visible{outline:none;box-shadow:var(--g-focus)}

/* g-tier (membership card composition of g-card) -------------- */
.g-tier__head{display:flex;align-items:center;justify-content:space-between;gap:var(--g-s3)}
.g-tier__list{list-style:none;margin:var(--g-s2) 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.g-tier__list li{position:relative;padding-left:22px;font-size:14px;color:var(--g-text);line-height:1.4}
.g-tier__list li::before{content:"✓";position:absolute;left:0;top:0;color:var(--g-accent);font-weight:700}
/* "Your access" on the current plan's card: the member's live enrolments, each a way in. */
.g-tier__access{margin-top:var(--g-s3);padding-top:var(--g-s3);border-top:1px solid var(--g-line)}
.g-tier__access-head{margin:0 0 var(--g-s2);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--g-text-faint)}
.g-tier__access-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.g-tier__access-link{display:flex;align-items:center;gap:var(--g-s2);min-height:44px;padding:6px 0;
  color:var(--g-text);text-decoration:none;border-bottom:1px solid var(--g-line)}
.g-tier__access-list li:last-child .g-tier__access-link{border-bottom:0}
.g-tier__access-name{flex:1 1 auto;font-size:14px;font-weight:600}
.g-tier__access-meta{font-size:13px;color:var(--g-text-muted)}
.g-tier__access-chev{color:var(--g-accent);font-size:18px;line-height:1}
.g-tier__access-link--static{color:var(--g-text-muted);cursor:default}
.g-tier__access-link:hover .g-tier__access-name{text-decoration:underline}
.g-tier__access-link:focus-visible{outline:none;box-shadow:var(--g-focus)}
.g-tier__access-all{margin:var(--g-s2) 0 0;font-size:13px}
.g-tier__access-all a{color:var(--g-accent);text-decoration:none;font-weight:600}
.g-tier__access-all a:hover{text-decoration:underline}

/* Store layout ---------------------------------------------- */
.g-store{background:var(--g-bg);color:var(--g-text);font-family:var(--g-font);
  display:flex;flex-direction:column;gap:var(--g-s5);
  padding:var(--g-s3) var(--g-s4) calc(var(--g-s9) + env(safe-area-inset-bottom))}
.g-store__head{display:flex;flex-direction:column;gap:var(--g-s1)}
.g-store__kicker{font:600 11px/1 var(--g-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--g-accent)}
.g-store__title{font-family:var(--g-font-serif);font-weight:600;font-size:clamp(28px,7vw,40px);
  line-height:1;letter-spacing:-.02em;margin:0;color:var(--g-text)}
.g-store-panel{display:flex;flex-direction:column;gap:var(--g-s5)}
.g-store-panel[hidden]{display:none}
.g-store-cat{display:flex;flex-direction:column;gap:var(--g-s3)}
.g-store-cat .g-section{margin-bottom:0}
.g-store-cat .g-section__title{font-size:17px}

/* Generic screen shell (Community / Academy / Profile) ------ */
.g-page{background:var(--g-bg);color:var(--g-text);font-family:var(--g-font);
  display:flex;flex-direction:column;gap:var(--g-s5);
  padding:var(--g-s3) var(--g-s4) calc(var(--g-s9) + env(safe-area-inset-bottom))}
.g-page__head{display:flex;flex-direction:column;gap:var(--g-s1)}
.g-page__kicker{font:600 11px/1 var(--g-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--g-accent)}
.g-page__title{font-family:var(--g-font-serif);font-weight:600;font-size:clamp(28px,7vw,40px);
  line-height:1;letter-spacing:-.02em;margin:0;color:var(--g-text)}
.g-page__sub{color:var(--g-text-muted);font-size:14px;margin:0;max-width:60ch}
.g-page-sec{display:flex;flex-direction:column;gap:var(--g-s3)}

/* Summary stat strip ---------------------------------------- */
.g-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--g-s2)}
.g-stat{background:var(--g-surface);border:1px solid var(--g-line);border-radius:var(--g-r-md);
  padding:var(--g-s3) var(--g-s4);display:flex;flex-direction:column;gap:3px}
.g-stat__n{font:700 22px/1 var(--g-font);letter-spacing:-.02em;color:var(--g-text)}
.g-stat__n--accent{color:var(--g-accent)}
.g-stat__l{font:600 10.5px/1.1 var(--g-font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--g-text-muted)}

/* Access list (communities / entitlements) ------------------ */
.g-access-grid{display:flex;flex-direction:column;gap:var(--g-s3)}
.g-access{position:relative;display:flex;gap:var(--g-s3);align-items:center;
  background:var(--g-surface);border:1px solid var(--g-line);border-radius:var(--g-r-lg);
  padding:var(--g-s4) var(--g-s4) var(--g-s4) calc(var(--g-s4) + 3px);overflow:hidden}
.g-access::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--st,var(--g-text-muted))}
.g-access--unlocked{--st:var(--g-accent)}
.g-access--locked{--st:#F5C518}
.g-access--soon{--st:rgba(236,243,233,.22)}
.g-access__ic{flex:none;width:38px;height:38px;border-radius:var(--g-r-md);display:grid;place-items:center;
  background:var(--g-surface-hi);color:var(--st,var(--g-text-muted));font-size:17px}
.g-access__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.g-access__name{font:700 15px/1.2 var(--g-font);letter-spacing:-.01em;color:var(--g-text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.g-access__meta{font-size:12.5px;color:var(--g-text-muted);line-height:1.35}
.g-access__act{flex:none}

/* status chip ----------------------------------------------- */
.g-chip{display:inline-flex;align-items:center;gap:5px;font:600 10.5px/1 var(--g-font-mono);
  letter-spacing:.05em;text-transform:uppercase;padding:5px 9px;border-radius:var(--g-r-pill);
  border:1px solid var(--g-line);color:var(--g-text-muted);white-space:nowrap}
.g-chip--on{color:var(--g-accent);border-color:transparent;background:rgba(125,217,86,.14)}
.g-chip--lock{color:#F5C518;border-color:transparent;background:rgba(245,197,24,.13)}

/* Rows inside a g-card (account / lists) --------------------- */
.g-rows{display:flex;flex-direction:column;margin-top:var(--g-s2)}
.g-rows>*{display:flex;align-items:center;justify-content:space-between;gap:var(--g-s3);
  padding:11px 0;border-top:1px solid var(--g-line);font-size:14px;color:var(--g-text);
  text-decoration:none;min-width:0}
.g-rows>*:first-child{border-top:0}
.g-rows>* span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
.g-row__meta{color:var(--g-text-muted);font-size:13px;text-align:right;white-space:nowrap;flex:none}
a.g-row--link:hover,a.g-row--link:hover .g-row__meta{color:var(--g-accent)}
a.g-row--link .g-row__meta{color:var(--g-accent)}
.g-empty{color:var(--g-text-muted);font-size:13.5px;margin:var(--g-s2) 0 0;line-height:1.5}
.g-profile-signout{align-self:center;margin-top:var(--g-s2)}

/* g-access as a link (Academy tracks) ----------------------- */
a.g-access{text-decoration:none;transition:border-color var(--g-motion,.2s) ease}
a.g-access:hover{border-color:rgba(125,217,86,.4)}

/* Birth-date chakra reading (Profile) ----------------------- */
.g-dob{margin-top:var(--g-s3);appearance:none;width:100%;background:var(--g-surface-hi);
  border:1px solid var(--g-line);border-radius:var(--g-r-md);color:var(--g-text);
  padding:11px 14px;font:500 16px var(--g-font)}
.g-dob::-webkit-calendar-picker-indicator{filter:invert(1) opacity(.55);cursor:pointer}
.g-chakra-read{display:flex;align-items:center;gap:var(--g-s3);margin-top:var(--g-s3);min-height:44px}
.g-chakra-dot{flex:none;width:34px;height:34px;border-radius:var(--g-r-pill);box-shadow:0 0 16px currentColor}
.g-hint{color:var(--g-text-muted);font-size:12px;margin:var(--g-s3) 0 0}

/* Admin console -------------------------------------------- */
.g-tabs--3{grid-template-columns:1fr 1fr 1fr;max-width:420px}
.g-tabs--4{grid-template-columns:repeat(4,1fr);max-width:520px}
.g-tabs--5{grid-template-columns:repeat(5,1fr);max-width:620px}
.g-tabs--6{grid-template-columns:repeat(6,1fr);max-width:720px}
.g-admin{gap:var(--g-s4)}
.g-admin-panel{display:flex;flex-direction:column;gap:var(--g-s4)}
.g-admin-panel[hidden]{display:none}
.g-field{display:flex;flex-direction:column;gap:6px;margin-top:var(--g-s3)}
.g-field:first-child{margin-top:0}
.g-label{font:600 12px/1 var(--g-font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--g-text-muted)}
.g-input,.g-textarea{appearance:none;width:100%;background:var(--g-surface-hi);border:1px solid var(--g-line);
  border-radius:var(--g-r-md);color:var(--g-text);padding:11px 13px;font:500 16px var(--g-font)}
.g-input:focus,.g-textarea:focus{outline:none;border-color:var(--g-accent);box-shadow:var(--g-focus)}
.g-textarea{min-height:84px;resize:vertical;line-height:1.45}
.g-input::placeholder,.g-textarea::placeholder{color:var(--g-text-muted)}
.g-checks{display:flex;flex-wrap:wrap;gap:var(--g-s4);margin-top:var(--g-s3)}
.g-check{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--g-text);cursor:pointer}
.g-check input{width:18px;height:18px;accent-color:var(--g-accent)}
.g-admin-item{display:flex;gap:var(--g-s3);align-items:flex-start;background:var(--g-surface);
  border:1px solid var(--g-line);border-radius:var(--g-r-lg);padding:var(--g-s4)}
.g-admin-item__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.g-admin-item__title{font:700 15px/1.25 var(--g-font);color:var(--g-text)}
.g-admin-item__meta{font-size:12.5px;color:var(--g-text-muted);line-height:1.4;word-break:break-word}
.g-admin-item__actions{display:flex;gap:6px;flex:none}
.g-tagrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.g-tag{display:inline-flex;align-items:center;gap:6px;font:600 11px/1 var(--g-font-mono);
  color:var(--g-text);background:var(--g-surface-hi);border:1px solid var(--g-line);
  border-radius:var(--g-r-pill);padding:5px 10px}
.g-tag button{appearance:none;border:none;background:none;color:var(--g-text-muted);cursor:pointer;
  font-size:13px;line-height:1;padding:0}
.g-tag button:hover{color:#F5C518}
.g-note{border-radius:var(--g-r-md);padding:12px 14px;font-size:13px;line-height:1.5;
  border:1px solid var(--g-line);color:var(--g-text-muted);background:var(--g-surface)}
.g-note--warn{border-color:rgba(245,197,24,.3);background:rgba(245,197,24,.06);color:var(--g-text)}
.g-note--ok{border-color:rgba(125,217,86,.3);background:rgba(125,217,86,.07);color:var(--g-text)}
.g-note b{color:#F5C518}
.g-admin-status{font-size:13px;color:var(--g-text-muted);min-height:18px}
.g-admin-status--ok{color:var(--g-accent)}
.g-admin-status--err{color:#F5C518}

/* Announcements (admin-published) --------------------------- */
.g-anns{display:flex;flex-direction:column;gap:var(--g-s3)}
.g-anns:empty{display:none}
.g-ann{display:block;text-decoration:none;background:var(--g-surface);border:1px solid var(--g-line);
  border-radius:var(--g-r-lg);padding:var(--g-s4) var(--g-s4) var(--g-s4) calc(var(--g-s4) + 3px);
  position:relative;overflow:hidden}
.g-ann::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--tone,var(--g-accent))}
.g-ann--info{--tone:#3BA7E0}
.g-ann--success{--tone:var(--g-accent)}
.g-ann--warn{--tone:#F5C518}
.g-ann__title{display:block;font:700 15px/1.3 var(--g-font);color:var(--g-text)}
.g-ann__body{display:block;font-size:13px;color:var(--g-text-muted);margin-top:3px;line-height:1.45}
a.g-ann:hover{border-color:rgba(125,217,86,.4)}

/* Dark-first: the g-* app is designed dark. Keep the canvas dark on every
   theme and retire the half-broken light toggle. */
html{background:#0B120E}
/* faint brand aura at the top of the canvas gives the dark app depth */
body.gaia-v2,body.gaia-v2[data-theme="light"]{
  background:radial-gradient(900px 460px at 50% -90px,rgba(125,217,86,.055),transparent 72%),var(--g-bg) !important;
  background-attachment:fixed;color:var(--g-text)}
.gaia-theme-toggle{display:none !important}

/* ===== Polish: depth, aura, hover/tap feedback ===== */
/* feature cards get a soft aura so wide desktop cards feel intentional */
.g-card--feature{position:relative;overflow:hidden}
.g-card--feature::after{content:"";position:absolute;top:-45%;right:-6%;width:min(320px,58%);aspect-ratio:1;
  background:radial-gradient(circle at 58% 42%,rgba(125,217,86,.15),transparent 66%);pointer-events:none;z-index:0}
.g-card--feature>*{position:relative;z-index:1}
.g-card--feature .g-card__meta{max-width:56ch}
/* motion for interactive surfaces */
.g-card,.g-tile,.g-access,.g-quiz-opt,.g-btn,.g-row--link{
  transition:transform .18s ease,border-color .18s ease,box-shadow .2s ease,filter .15s ease,background .18s ease}
@media (hover:hover){
  a.g-card:hover,.g-tile:hover,a.g-access:hover{transform:translateY(-2px);border-color:rgba(125,217,86,.38);
    box-shadow:0 16px 36px -18px rgba(0,0,0,.75)}
  .g-btn--primary:hover{filter:brightness(1.06);box-shadow:0 10px 26px -12px rgba(125,217,86,.5)}
  .g-btn--secondary:hover,.g-btn--ghost:hover{border-color:var(--g-accent)}
  .g-quiz-opt:hover{transform:translateY(-1px)}
}
.g-btn:active{transform:translateY(1px)}
a.g-card:active,.g-tile:active,.g-quiz-opt:active{transform:scale(.99)}
/* Home: book + colour-test pair (stacks on mobile, 2-up on desktop) */
.g-home-pair{display:flex;flex-direction:column;gap:var(--g-s5)}

/* Birth-date chakra + daily wellness ------------------------ */
.g-well{display:flex;flex-direction:column;gap:var(--g-s3)}
.g-well__lead{color:var(--g-text-muted);font-size:13.5px;margin:2px 0 var(--g-s2);line-height:1.5}
.g-well__lead strong{color:var(--g-text);font-weight:600}
.g-well__welcome{display:flex;flex-direction:column;gap:2px}
.g-well__name{font-family:var(--g-font-serif);font-weight:600;font-size:clamp(26px,7vw,34px);line-height:1;color:var(--g-text)}
.g-well__signout{align-self:flex-start;margin-top:var(--g-s1)}
.g-well-reveal{min-height:20px}

/* chakra energy card + orb */
.g-energy{display:flex;align-items:center;gap:var(--g-s4);background:var(--g-surface-hi);
  border:1px solid var(--g-line);border-radius:var(--g-r-lg);padding:var(--g-s4)}
.g-energy--empty{background:var(--g-surface)}
.g-well-orb{position:relative;flex:none;width:60px;height:60px;border-radius:50%;
  background:var(--ck,#7DD956);box-shadow:0 0 26px -3px var(--ck,#7DD956),0 0 0 1px rgba(255,255,255,.14) inset;
  animation:g-well-pulse 4.2s ease-in-out infinite}
.g-well-orb span{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.6),transparent 46%)}
.g-well-orb--empty{background:var(--g-surface);box-shadow:0 0 0 1px var(--g-line) inset;animation:none}
@keyframes g-well-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.g-energy__body{min-width:0}
.g-energy__kicker{font:600 10.5px/1 var(--g-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ck,var(--g-accent));margin:0}
.g-energy__name{font-family:var(--g-font-serif);font-weight:600;font-size:20px;color:var(--g-text);margin:5px 0 0}
.g-energy__name span{color:var(--g-text-muted);font-size:15px;font-style:italic}
.g-energy__meta{font-size:12.5px;color:var(--g-text-muted);margin:3px 0 0}

/* daily body-point + horoscope cards */
.g-daily{display:flex;flex-direction:column;gap:var(--g-s3)}
.g-daily-card{position:relative;overflow:hidden;padding-left:calc(var(--g-s5) + 3px)}
.g-daily-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ck,var(--g-accent))}
.g-daily-card__kicker{font:600 10.5px/1 var(--g-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ck,var(--g-accent));margin:0}
.g-daily-card--horo{--ck:var(--g-accent)}
.g-daily-card__title{font-family:var(--g-font-serif);font-weight:600;font-size:22px;color:var(--g-text);margin:6px 0 0}
.g-daily-card__title span{color:var(--g-text-muted);font-size:15px;font-style:italic}
.g-daily-card__area{font-size:14px;color:var(--g-text);margin:5px 0 0}
.g-daily-card__meta{font-size:12.5px;color:var(--g-text-muted);margin:4px 0 0}
.g-daily-card__tip{font-size:14.5px;color:var(--g-text);line-height:1.55;margin:8px 0 0}

/* 8-week chakra challenge ----------------------------------- */
.g-chal{position:relative;overflow:hidden;padding-left:calc(var(--g-s5) + 3px)}
.g-chal::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ck,var(--g-accent))}
.g-chal__title{font-family:var(--g-font-serif);font-weight:600;font-size:20px;color:var(--g-text);margin:6px 0 0}
.g-chal__title span{color:var(--g-text-muted);font-size:14px;font-style:italic}
.g-chal-dots{display:flex;gap:6px;margin:var(--g-s3) 0 0}
.g-chal-dot{flex:1;height:6px;border-radius:99px;background:var(--g-line);max-width:34px}
.g-chal-dot.is-on{background:var(--ck,var(--g-accent))}
.g-chal-dot[data-now]{box-shadow:0 0 8px var(--ck,var(--g-accent))}
.g-chal__practice{font-size:14px;color:var(--g-text);line-height:1.5;margin:var(--g-s3) 0 0}
.g-chal__practice strong{color:var(--ck,var(--g-accent))}
.g-chal__aff{font-family:var(--g-font-serif);font-style:italic;font-size:15px;color:var(--g-text-muted);margin:8px 0 0}
.g-chal__count{font-size:12px;color:var(--g-text-muted);align-self:center;margin-left:auto}

/* Colour Personality Test ----------------------------------- */
.g-quiz__title,.g-quiz__q{font-family:var(--g-font-serif);font-weight:600;font-size:20px;color:var(--g-text);margin:6px 0 0}
.g-quiz__q{margin:8px 0 0}
.g-quiz-opts{display:flex;flex-direction:column;gap:8px;margin-top:var(--g-s3)}
.g-quiz-opt{display:flex;align-items:center;gap:10px;width:100%;text-align:left;
  background:var(--g-surface-hi);border:1px solid var(--g-line);border-radius:var(--g-r-md);
  color:var(--g-text);font:500 15px var(--g-font);padding:12px 14px;cursor:pointer;
  transition:border-color .15s ease,background .15s ease}
.g-quiz-opt:hover{border-color:var(--g-accent);background:var(--g-surface)}
.g-quiz-opt:focus-visible{outline:none;box-shadow:var(--g-focus)}
.g-quiz-dot{flex:none;width:16px;height:16px;border-radius:50%;box-shadow:0 0 8px -1px currentColor}
.g-quiz-result{display:flex;align-items:center;gap:var(--g-s4);margin-top:var(--g-s2)}
.g-quiz__kicker{font:600 10.5px/1 var(--g-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ck,var(--g-accent));margin:0}
.g-quiz__result-name{font-family:var(--g-font-serif);font-weight:600;font-size:26px;color:var(--g-text);margin:4px 0 0}

/* ---------- Tablet (≥768px): fill the screen, don't float a tiny phone column ---------- */
@media (min-width:768px){
  /* widen the shell when a redesigned (g-*) screen is active. The non-:has()
     line is a fallback for Safari <15.4 / older browsers that don't support
     :has() — without it the desktop layout silently stays at phone width. */
  body.gaia-v2 .gaia-shell{max-width:1000px !important;}
  body.gaia-v2 .gaia-shell:has(.gaia-screen[data-screen="today"].is-active),
  body.gaia-v2 .gaia-shell:has(.gaia-screen[data-screen="store"].is-active),
  body.gaia-v2 .gaia-shell:has(.gaia-screen[data-screen="community"].is-active),
  body.gaia-v2 .gaia-shell:has(.gaia-screen[data-screen="academy"].is-active),
  body.gaia-v2 .gaia-shell:has(.gaia-screen[data-screen="profile"].is-active){
    max-width:1000px !important;
  }
  /* Keep the floating tabbar pill centered under the widened shell. */
  body.gaia-v2 .gaia-tabbar,
  body.gaia-v2 .gaia-tabbar__inner{max-width:1000px !important;margin-left:auto !important;margin-right:auto !important;}
  /* 2-up grids breathe on tablet & desktop. */
  .g-access-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--g-s3)}
  .g-daily{display:grid;grid-template-columns:1fr 1fr;gap:var(--g-s3);align-items:start}
  .g-home-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--g-s4);align-items:start}
  .g-store-rail{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));overflow:visible;gap:var(--g-s4)}
  .g-store-rail .g-tile{flex:auto}
}

/* ---------- Desktop (≥900px): chakra hero, side-by-side CTAs, wider gaps ---------- */
@media (min-width:900px){
  /* Store: horizontal rails become full galleries on desktop */
  .g-store{padding-left:var(--g-s7);padding-right:var(--g-s7)}
  /* generic g-* pages breathe on desktop */
  .g-page{padding-left:var(--g-s7);padding-right:var(--g-s7)}
  .g-home{padding-left:var(--g-s7);padding-right:var(--g-s7);gap:var(--g-s7)}
  .g-topbar{padding-left:var(--g-s7);padding-right:var(--g-s7)}
  .g-hero{min-height:280px;padding:var(--g-s8) var(--g-s7)}
  .g-hero__title{font-size:clamp(40px,4vw,60px)}
  /* event + member CTA sit side by side */
  .g-home-cards{grid-template-columns:1.35fr 1fr;gap:var(--g-s4);align-items:stretch}
  .g-home-cards>*{height:100%}
  .g-tile{flex-basis:11rem}

  /* chakra hero → two-column: greeting left, cosmic figure right */
  .g-chakra-hero{--stage-h:440px}
  .g-chakra-hero__stage{justify-content:flex-end;padding-right:6%}
  .g-chakra-hero__overlay{top:0;bottom:auto;height:var(--stage-h);right:auto;width:54%;
    justify-content:center;padding:var(--g-s7) var(--g-s7)}
  .g-chakra-hero__scrim{background:
    linear-gradient(90deg,rgba(5,7,10,.94) 18%,rgba(5,7,10,.45) 48%,transparent 72%)}
  .g-chakra-hero__title{font-size:clamp(42px,4.4vw,62px)}
  .g-chakra-hero__caption{font-size:15px}
}

/* ============================================================
   iOS / mobile polish (2026-07-21)
   - Global tap-highlight removal (no more gray flash on buttons)
   - :hover rules gated to real hover-capable pointers (no sticky hover on touch)
   - 44px minimum tap targets for tabs, buttons, chakra hits
   - position:sticky vendor prefix
   - color-scheme: dark on form controls so native widgets match the dark UI
   ============================================================ */
html { -webkit-tap-highlight-color: transparent; }
a, button, [role="button"], input[type="submit"], input[type="button"], input[type="reset"],
.g-btn, .g-tab, .g-card--interactive, .g-tile, .g-quiz-opt, .g-access, .g-ann,
.g-chakra-hero__hit, [data-open-in-app], [data-book-inline], [data-track-cta] {
  -webkit-tap-highlight-color: transparent;
}

/* Global dark color-scheme so native form controls render dark to match the UI. */
html { color-scheme: dark; }

/* Sticky vendor prefix (older iOS Safari ≤13). */
.gaia-header { position: -webkit-sticky; position: sticky; }

/* 44px minimum tap targets (Apple HIG). */
.g-tab { min-height: 44px; }
.g-btn--sm { min-height: 40px; }

/* Larger, easier-to-tap chakra hotspots on the body map. */
.g-chakra-hero__hit { width: 44px; height: 44px; }
.g-chakra-hero__hit::after { inset: 11px; }

/* data-track-cta is now a <button>; reset native button chrome so it still
   looks like the g-access card it replaced. */
button.g-access.g-access--link {
  text-align: left; width: 100%;
  font: inherit; color: inherit; background: none; border: 1px solid var(--g-line);
  cursor: pointer;
}

/* Real-pointer-only hover effects. On iOS, bare :hover gets "stuck" after a
   tap, so buttons/links look permanently lifted/highlighted. Re-declare the
   hover styling here inside @media (hover:hover) so touch devices never apply it. */
@media (hover: hover) {
  .g-btn--primary:hover { filter: brightness(1.06); }
  .g-btn--secondary:hover { border-color: var(--g-line-strong); }
  .g-btn--ghost:hover { filter: brightness(1.12); }
  .g-btn--pill:hover { background: var(--g-surface-hi); }
  .g-card--interactive:hover { border-color: var(--g-line-strong); transform: translateY(-2px); }
  .g-tile:hover .g-tile__media { transform: scale(1.02); border-color: var(--g-line-strong); }
  .g-chakra-hero__hit:hover::after { border-color: rgba(255,255,255,.5); }
  a.g-row--link:hover, a.g-row--link:hover .g-row__meta { color: var(--g-accent); }
  a.g-access:hover { border-color: rgba(125,217,86,.4); }
  .g-tag button:hover { color: #F5C518; }
  a.g-ann:hover { border-color: rgba(125,217,86,.4); }
  .g-quiz-opt:hover { border-color: var(--g-accent); background: var(--g-surface); }
}

/* Suppress the inherited "stuck" hover on touch devices by overriding the
   transform/filter changes back to neutral when the pointer can't hover. */
@media (hover: none) {
  .g-card--interactive:hover,
  .g-tile:hover .g-tile__media,
  .g-access:hover,
  .gaia-chakra-teaser:hover,
  .gaia-bento__tile:hover,
  .gaia-assist__chips button:hover { transform: none !important; filter: none !important; }
}

/* ── Gaia store: cards built for a Shopify catalogue with very long titles ── */
.g-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.g-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}
.g-store-tile{display:flex;flex-direction:column;min-width:0}
.g-store-tile .g-tile__body{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.g-store-tile .g-tile__title{font-size:.95rem;line-height:1.3;margin:0;font-weight:600;
  /* a 200-character title must never stretch the card */
  overflow-wrap:anywhere}
.g-store-tile .g-tile__price{margin:0;font-size:.95rem;font-weight:650;font-variant-numeric:tabular-nums;
  /* never split "$2500 USD" across lines */
  text-wrap:pretty}
.g-store-tile .g-tile__price>*{white-space:nowrap}
.g-store-tile .g-tile__price--muted{font-weight:500;opacity:.72;font-size:.86rem}
.g-store-tile .g-tile__was{opacity:.6;font-weight:400;margin-left:6px}
.g-store-tile .g-tile__meta{margin:0;font-size:.82rem;opacity:.75}
.g-store-tile .g-tile__media{aspect-ratio:1;overflow:hidden;border-radius:10px;background:rgba(255,255,255,.04)}
.g-store-tile .g-tile__media img{width:100%;height:100%;object-fit:cover;display:block}
.g-store-tile .g-card__actions{margin-top:auto;padding-top:4px}
/* a comfortable tap target on phones */
.g-store-tile .g-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.g-store-note{font-size:.82rem;opacity:.7;margin:8px 0 0;padding:0 4px}
/* Keyboard users must be able to see where they are. The shared button style
   sets outline:none, so the store restores a visible ring on its own links. */
.g-store-tile a:focus-visible,.g-store-tile .g-btn:focus-visible{
  outline:2px solid var(--g-accent,#A8E063);outline-offset:3px;border-radius:999px}
.g-section__meta{font-size:.8rem;opacity:.65;margin:2px 0 0}

/* ── Gaia store: the in-app product sheet ──
   Self-contained on purpose. An earlier version reused .gaia-booking-modal__panel
   and inherited nothing, because that rule is not loaded on this page — the
   sheet rendered transparent over the shelf and was unreadable. */
.gaia-product-modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;
  justify-content:center;padding:20px}
.gaia-product-modal .gaia-booking-modal__backdrop{position:absolute;inset:0;
  background:rgba(0,0,0,.62);backdrop-filter:blur(2px)}
.g-store-sheet{position:relative;z-index:1;max-width:560px;width:100%;max-height:86vh;
  overflow-y:auto;padding:22px;display:flex;flex-direction:column;gap:12px;
  background:var(--g-surface,#111A14);color:var(--g-text,#ECF3E9);
  border:1px solid rgba(255,255,255,.10);border-radius:18px;
  box-shadow:0 24px 60px rgba(0,0,0,.55)}
.gaia-product-modal .gaia-booking-modal__close{position:absolute;top:12px;right:12px;
  width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.35);color:inherit;font-size:20px;line-height:1;cursor:pointer;z-index:2}
.gaia-product-modal .gaia-booking-modal__close:focus-visible{outline:2px solid var(--g-accent,#A8E063);outline-offset:2px}
.g-store-sheet__media{aspect-ratio:16/10;overflow:hidden;border-radius:12px;background:rgba(255,255,255,.04)}
.g-store-sheet__media img{width:100%;height:100%;object-fit:cover;display:block}
.g-store-sheet__title{font-size:1.3rem;line-height:1.25;margin:0;font-weight:650;overflow-wrap:anywhere}
.g-store-sheet__meta{margin:0;font-size:.85rem;opacity:.8;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.g-store-sheet__price{margin:0;font-size:1.1rem;font-weight:700;font-variant-numeric:tabular-nums}
.g-store-sheet__price s{opacity:.55;font-weight:400;margin-left:6px}
.g-store-sheet__body{margin:0;font-size:.92rem;line-height:1.6;opacity:.88;
  /* Shopify descriptions run to hundreds of words; show a readable lead and let
     the rest live on the product page. */
  display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;overflow:hidden}
.g-store-sheet__list{margin:0;padding-left:1.1rem;display:flex;flex-direction:column;gap:4px;font-size:.9rem;opacity:.9}
.g-store-sheet .g-card__actions{margin-top:6px;display:flex;gap:8px;flex-wrap:wrap}
.g-store-sheet .g-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
/* The title doubles as the control that opens the sheet — and on a phone it is
   the only way into the product, since the tile itself is an <article>. At its
   natural height it was 20px for a one-line title, under the 44px touch
   minimum, so it gets a floor. */
.g-tile__open{background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;
  text-align:left;cursor:pointer;width:100%;min-height:44px}

/* The two-line clamp could not live on .g-tile__title, even though that is
   where .g-clamp-2 sits: the title is a flex item of .g-tile__body, so its
   display:-webkit-box is blockified to flow-root and -webkit-line-clamp never
   applied. A 200-character product title therefore ran to eight lines and
   pushed its Buy button far out of line with the rest of the row. The button
   inside the title is not a flex item, so the clamp holds there. */
.g-store-tile .g-tile__open{display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.g-tile__open:focus-visible{outline:2px solid var(--g-accent,#A8E063);outline-offset:3px;border-radius:6px}
@media (max-width:640px){.g-store-sheet{max-width:100%;border-radius:16px 16px 0 0;max-height:90vh}}

/* ── Add to Home Screen ──
   A quiet sheet at the bottom, above the tab bar and clear of the home
   indicator. It only ever appears when it can actually help. */
/* Notices: toast + confirm sheet (the app's own, in place of window.alert/confirm) */
.g-toast{position:fixed;left:0;right:0;z-index:130;
  bottom:calc(84px + env(safe-area-inset-bottom,0px));
  display:flex;justify-content:center;padding:0 12px;pointer-events:none}
.g-toast[hidden]{display:none}
.g-toast__text{pointer-events:auto;display:inline-flex;align-items:center;gap:10px;
  max-width:420px;padding:12px 14px 12px 16px;border-radius:var(--g-r-lg,16px);
  background:var(--g-surface-hi,#16221A);color:var(--g-text,#ECF3E9);font-size:14px;line-height:1.35;
  border:1px solid var(--g-line);box-shadow:var(--g-shadow-pop,0 18px 44px rgba(0,0,0,.5));
  animation:g-install-in .24s cubic-bezier(.2,.8,.3,1) both}
.g-toast--error .g-toast__text{border-color:var(--g-danger,#E5484D)}
.g-toast--ok .g-toast__text{border-color:var(--g-accent)}
.g-toast__close{pointer-events:auto;margin-left:-6px;display:inline-grid;place-items:center;
  width:44px;height:44px;border:0;background:transparent;color:var(--g-text-muted);cursor:pointer;border-radius:50%}
.g-toast__close:focus-visible{outline:none;box-shadow:var(--g-focus)}
.g-confirm{position:fixed;inset:0;z-index:140;display:flex;align-items:flex-end;justify-content:center;
  padding:12px;background:rgba(0,0,0,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
@media (min-width:600px){.g-confirm{align-items:center}}
.g-confirm__panel{width:100%;max-width:420px;background:var(--g-surface,#111A14);color:var(--g-text,#ECF3E9);
  border:1px solid var(--g-line);border-radius:var(--g-r-xl,22px);padding:20px 18px calc(16px + env(safe-area-inset-bottom,0px));
  box-shadow:var(--g-shadow-pop,0 18px 44px rgba(0,0,0,.5));display:flex;flex-direction:column;gap:12px;
  animation:g-install-in .28s cubic-bezier(.2,.8,.3,1) both}
.g-confirm__title{margin:0;font-size:17px;font-weight:600;line-height:1.3}
.g-confirm__detail{margin:0;font-size:14px;color:var(--g-text-muted);line-height:1.4}
.g-confirm__actions{display:flex;gap:10px;justify-content:flex-end;margin-top:4px}
.g-confirm__actions .g-btn{min-height:44px}
.g-install{position:fixed;left:0;right:0;z-index:120;
  /* clear of the floating tab bar and the home indicator below it */
  bottom:calc(72px + env(safe-area-inset-bottom,0px));
  padding:0 12px;
  display:flex;justify-content:center;pointer-events:none}
.g-install__panel{pointer-events:auto;width:100%;max-width:420px;
  background:var(--g-surface,#111A14);color:var(--g-text,#ECF3E9);
  border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:16px 18px;
  box-shadow:0 18px 44px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:12px;
  animation:g-install-in .28s cubic-bezier(.2,.8,.3,1) both}
@keyframes g-install-in{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.g-install__panel{animation:none}}
.g-install__head{display:flex;gap:12px;align-items:center}
.g-install__icon{border-radius:12px;flex:none}
.g-install__title{margin:0;font-weight:650;font-size:.98rem;line-height:1.3}
.g-install__sub{margin:2px 0 0;font-size:.84rem;opacity:.72;line-height:1.35}
.g-install__steps{margin:0;padding-left:1.15rem;display:flex;flex-direction:column;gap:6px;
  font-size:.9rem;opacity:.9}
.g-install__steps b{font-weight:650}
.g-install__actions{display:flex;gap:8px;justify-content:flex-end}
.g-install__actions .g-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}

/* ── Home: let the last card clear the floating tab bar ──
   Needs body.gaia-v2 to outrank `body.gaia-v2 .gaia-main`, which otherwise wins
   on specificity and leaves the final card tucked under the bar. */
body.gaia-v2 main.gaia-main.gaia-main--today{
  padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))}
/* A short scrim so content scrolling under the floating bar fades out instead
   of being sliced mid-word. */
.gaia-tabbar::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:28px;
  background:linear-gradient(to top,var(--g-bg,#0B120E),transparent);pointer-events:none}

/* ── Featured event ──
   The next gathering leads the home screen. It carries the event's own artwork
   and its registration link, so it is useful in itself rather than only a way
   through to another page. */
.g-feature-event{position:relative;overflow:hidden;border-radius:20px;isolation:isolate;
  border:1px solid rgba(255,255,255,.10);background:var(--g-surface,#111A14);
  display:flex;flex-direction:column;min-height:210px}
.g-feature-event__art{position:absolute;inset:0;z-index:0}
.g-feature-event__art img{width:100%;height:100%;object-fit:cover;display:block;
  /* The published artwork is often a wordmark rather than a photograph — the
     Elevate image carries its own large "ELEVATE" lettering. Held back to
     texture so it sets a mood behind the card instead of arguing with the
     title sitting on top of it. */
  opacity:.34;transform:scale(1.04);filter:saturate(.9)}
.g-feature-event__art::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(7,16,11,.55) 0%,rgba(7,16,11,.82) 55%,rgba(7,16,11,.96) 100%)}
.g-feature-event__body{position:relative;z-index:1;margin-top:auto;
  padding:18px;display:flex;flex-direction:column;gap:8px}
.g-feature-event__kicker{margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;
  color:var(--g-accent,#A8E063)}
.g-feature-event__kicker svg{width:15px;height:15px}
.g-feature-event__badge{letter-spacing:.02em;text-transform:none;font-weight:650;font-size:.74rem;
  color:#07100b;background:var(--g-accent,#A8E063);border-radius:999px;padding:3px 9px}
.g-feature-event__title{margin:0;font-size:1.28rem;line-height:1.2;font-weight:650;
  color:#fff;text-wrap:balance}
.g-feature-event__meta{margin:0;font-size:.86rem;line-height:1.45;color:rgba(255,255,255,.80)}
.g-feature-event__actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.g-feature-event__actions .g-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
@media (min-width:760px){
  .g-feature-event{min-height:260px}
  .g-feature-event__title{font-size:1.6rem}
  .g-feature-event__body{padding:24px}
}

/* ── App feel ──
   The three things that separate a web page from an app: something happens the
   instant you touch a control, screens arrive rather than blink into place, and
   spacing is the same everywhere. All of it yields to prefers-reduced-motion. */

/* Press feedback. A native control acknowledges a finger before the work
   starts; without this the app feels dead on tap even when it is fast. */
.g-tile,.g-card,.g-super-row,.g-store-tile,.g-free-tools a,.g-free-tools button,.g-feature-event .g-btn,.g-btn{
  transition:transform .12s ease,opacity .12s ease,background-color .16s ease}
.g-super-row:active,.g-store-tile:active,.g-free-tools a:active,
.g-free-tools button:active,.g-btn:active{transform:scale(.975)}
/* Cards are large, so they compress less — scaling a full-width card the same
   amount as a button reads as a glitch rather than a press. */
.g-tile:active,.g-card:active{transform:scale(.99)}

/* Screens arrive. Only the incoming screen animates, and only once. */
.gaia-screen.is-active{animation:g-screen-in .26s cubic-bezier(.22,.61,.36,1) both}
@keyframes g-screen-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* One rhythm for every page, so sections do not drift apart view by view. */
.g-super-home > section + section,
.g-super-page > section + section{margin-top:18px}
@media (min-width:760px){
  .g-super-home > section + section,
  .g-super-page > section + section{margin-top:24px}
}

/* Momentum scrolling and no rubber-banding of the whole page behind a sheet —
   both are things people read as "this is a website". */
html{-webkit-text-size-adjust:100%}
body{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}
.g-store-rail,.g-rail{-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.g-store-rail > *,.g-rail > *{scroll-snap-align:start}

@media (prefers-reduced-motion:reduce){
  .gaia-screen.is-active{animation:none}
  .g-tile,.g-card,.g-super-row,.g-store-tile,.g-btn,
  .g-free-tools a,.g-free-tools button{transition:none}
  .g-super-row:active,.g-store-tile:active,.g-btn:active,
  .g-tile:active,.g-card:active,
  .g-free-tools a:active,.g-free-tools button:active{transform:none}
}

/* ── Practice journal ──
   Twelve weeks of days, coloured by the centre each one asked for. A filled
   ring means the practice was kept; a hollow one means the day was simply
   lived. Nothing here leaves the device. */
.g-practice{display:flex;flex-direction:column;gap:14px}
.g-practice__lead{margin:0;font-size:.93rem;line-height:1.55;opacity:.85}
.g-practice__stats{display:flex;gap:16px 22px;flex-wrap:wrap;align-items:flex-start}
.g-practice__stats div{display:flex;flex-direction:column;gap:1px}
.g-practice__stats strong{font-size:1.35rem;font-weight:700;line-height:1.05;font-variant-numeric:tabular-nums}
/* The recurring centre is a name, not a number — sized so it sits beside the
   counts rather than shouting over them. */
.g-practice__stats div:last-child strong{font-size:1.05rem;font-weight:650}
.g-practice__stats span{font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;opacity:.6}

.g-practice__grid{display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,1fr);
  gap:4px;overflow-x:auto;padding-bottom:4px}
.g-practice__day{width:13px;height:13px;border-radius:4px;padding:0;cursor:pointer;
  border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);
  transition:transform .12s ease}
/* A day that was recorded carries its centre's colour, softly. */
.g-practice__day.is-on{background:color-mix(in srgb,var(--c) 42%,transparent);border-color:transparent}
/* A day the practice was kept is solid — the difference should be visible at a
   glance across twelve weeks, not require reading. */
.g-practice__day.is-done{background:var(--c)}
.g-practice__day.is-today{outline:2px solid var(--g-accent,#A8E063);outline-offset:1px}
.g-practice__day:hover{transform:scale(1.25)}
.g-practice__day:focus-visible{outline:2px solid var(--g-accent,#A8E063);outline-offset:2px}

.g-practice__detail{margin:0;font-size:.86rem;line-height:1.5;opacity:.9;
  padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.045)}
.g-practice__detail em{opacity:.8}
.g-practice__today{display:flex;gap:8px;flex-wrap:wrap}
.g-practice__today .g-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.g-practice__note textarea{width:100%;resize:vertical;min-height:52px;font:inherit;font-size:.92rem;
  color:inherit;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.10);
  border-radius:12px;padding:10px 12px}
.g-practice__note textarea:focus-visible{outline:2px solid var(--g-accent,#A8E063);outline-offset:1px}
.g-practice__private{margin:0;font-size:.76rem;opacity:.55}
@media (prefers-reduced-motion:reduce){.g-practice__day{transition:none}.g-practice__day:hover{transform:none}}

/* ── Today's sky ──────────────────────────────────────────────────────────
   The one card on the home screen that needs nothing from the visitor. It is
   given the weight of a feature rather than a widget, because for someone who
   has never signed in it is the first thing on the page they can actually
   read — and the only reason for them to come back tomorrow.

   Tinted by the chakra Gaia associates with the sign the moon is in, so the
   card is a different colour as the moon moves — a real signal, not decoration. */
.g-sky{position:relative;overflow:hidden;isolation:isolate;
  border:1px solid color-mix(in srgb,var(--sky-tint,#8E4EC6) 26%,transparent);
  background:
    radial-gradient(120% 90% at 82% 0%,color-mix(in srgb,var(--sky-tint,#8E4EC6) 16%,transparent) 0%,transparent 62%),
    var(--g-surface,#111A14);
  display:flex;flex-direction:column;gap:12px}
.g-sky__head{display:flex;align-items:center;gap:16px}
.g-sky__art{flex:0 0 auto;width:84px;height:84px}
.g-sky__moon{width:100%;height:100%;display:block}
/* The disc is painted in two tones only: lit and unlit. Anything more would
   suggest detail the calculation does not have. */
.g-sky__moon-lit{fill:#F4F1E4}
.g-sky__moon-dark{fill:#141C18}
.g-sky__moon-rim{fill:none;stroke:color-mix(in srgb,var(--sky-tint,#8E4EC6) 55%,transparent);stroke-width:1.2}
.g-sky__lede{min-width:0}
.g-sky__kicker{margin:0 0 2px;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  font-weight:700;color:color-mix(in srgb,var(--sky-tint,#8E4EC6) 70%,#fff)}
.g-sky__phase{margin:0;font-size:1.34rem;line-height:1.15;font-weight:650;color:#fff;text-wrap:balance}
.g-sky__facts{margin:6px 0 0;display:flex;flex-wrap:wrap;gap:6px}
.g-sky__facts span{font-size:.76rem;font-weight:600;padding:3px 9px;border-radius:999px;
  color:rgba(255,255,255,.82);background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.09);
  /* The percentage changes daily and sits next to other numbers — lining the
     digits up stops the row from twitching as it counts. */
  font-variant-numeric:tabular-nums}
.g-sky__facts .g-sky__chakra{color:color-mix(in srgb,var(--sky-tint,#8E4EC6) 80%,#fff);
  background:color-mix(in srgb,var(--sky-tint,#8E4EC6) 14%,transparent);
  border-color:color-mix(in srgb,var(--sky-tint,#8E4EC6) 34%,transparent)}
.g-sky__theme{margin:0;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
  font-weight:700;color:rgba(255,255,255,.48)}
.g-sky__invitation{margin:0;font-size:.97rem;line-height:1.55;color:rgba(255,255,255,.86);
  max-width:62ch}
.g-sky__practice{margin:0;font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.74);
  padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.05);
  border-left:3px solid color-mix(in srgb,var(--sky-tint,#8E4EC6) 60%,transparent)}
.g-sky__practice strong{display:block;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:color-mix(in srgb,var(--sky-tint,#8E4EC6) 72%,#fff);margin-bottom:3px}

/* The invitation to sign up, and the reward for having done so, occupy the same
   slot — so the card does not visibly grow or shrink around signing in. */
.g-sky__invite,.g-sky__personal{border-radius:16px;padding:14px;
  display:flex;flex-direction:column;gap:6px}
.g-sky__invite{background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.16)}
.g-sky__invite-head,.g-sky__personal-head{margin:0;font-weight:650;color:#fff;font-size:.95rem}
.g-sky__invite p,.g-sky__personal p{margin:0;font-size:.88rem;line-height:1.5;color:rgba(255,255,255,.72)}
.g-sky__invite .g-btn{align-self:flex-start;margin-top:4px}
.g-sky__personal{background:color-mix(in srgb,var(--own,#7DD956) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--own,#7DD956) 30%,transparent)}
.g-sky__personal-link{align-self:flex-start;margin-top:2px;font-size:.86rem;font-weight:650;
  color:var(--own,#7DD956);text-decoration:none}
.g-sky__personal-link:hover{text-decoration:underline}
.g-sky__foot{margin:0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;
  font-size:.76rem;color:rgba(255,255,255,.5);
  padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.g-sky__source{color:rgba(255,255,255,.36)}

@media (min-width:760px){
  .g-sky__art{width:104px;height:104px}
  .g-sky__phase{font-size:1.6rem}
}

/* ── My Events and My Ticket ──────────────────────────────────────────────
   The screen someone opens at a venue with a queue behind them. Everything
   here is sized for that moment: large targets, high contrast, and the QR
   given more room than anything else on the page. */
.g-mye{display:flex;flex-direction:column;gap:22px;margin-bottom:26px}
.g-mye__group{display:flex;flex-direction:column;gap:10px}
.g-mye__grouphead{margin:0;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
  font-weight:700;color:rgba(255,255,255,.5)}
.g-mye__card{border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:16px;
  background:var(--g-surface,#111A14);display:flex;flex-direction:column;gap:12px}
.g-mye__card.is-past{opacity:.72}
.g-mye__head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.g-mye__when{margin:0 0 2px;font-size:.76rem;letter-spacing:.06em;text-transform:uppercase;
  font-weight:650;color:var(--g-accent,#A8E063)}
.g-mye__name{margin:0;font-size:1.14rem;line-height:1.25;font-weight:650;color:#fff;text-wrap:balance}
.g-mye__where{margin:3px 0 0;font-size:.86rem;color:rgba(255,255,255,.66)}
.g-mye__chip{flex:0 0 auto;font-size:.72rem;font-weight:700;letter-spacing:.05em;
  padding:4px 10px;border-radius:999px;color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10)}
.g-mye__chip.is-live{color:#07100b;background:var(--g-accent,#A8E063);border-color:transparent;
  display:inline-flex;align-items:center;gap:6px}
.g-mye__pass{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.g-mye__passname{font-size:.88rem;font-weight:650;color:#fff;padding:4px 11px;border-radius:999px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.10)}
.g-mye__vip{font-size:.72rem;font-weight:800;letter-spacing:.1em;padding:4px 10px;border-radius:999px;
  color:#1a1206;background:#FFC53D}
.g-mye__status{font-size:.82rem;font-weight:600}
.g-mye__status.is-good{color:#7DD956}
.g-mye__status.is-idle{color:rgba(255,255,255,.55)}
.g-mye__status.is-bad{color:#FF8A80}
.g-mye__actions{display:flex;flex-wrap:wrap;gap:8px}
.g-mye__actions .g-btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
.g-mye__note{margin:0;font-size:.85rem;color:#FFC53D}

.g-mye--prompt,.g-mye--empty,.g-mye--problem{border:1px solid rgba(255,255,255,.10);
  border-radius:18px;padding:20px;background:var(--g-surface,#111A14);margin-bottom:26px;
  display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.g-mye--prompt h2,.g-mye--empty h2,.g-mye--problem h2{margin:0;font-size:1.1rem;font-weight:650;color:#fff}
.g-mye--prompt p,.g-mye--empty p,.g-mye--problem p{margin:0;font-size:.92rem;line-height:1.55;
  color:rgba(255,255,255,.7);max-width:52ch}
.g-mye--prompt .g-btn,.g-mye--empty .g-btn,.g-mye--problem .g-btn{margin-top:6px;min-height:44px}
.g-mye--problem{border-color:rgba(255,197,61,.35)}
.g-mye--problem h2{color:#FFC53D}

/* The ticket sheet. Its own stacking context and its own panel styles — it
   must not borrow a modal class whose CSS may not be loaded on every screen. */
.g-ticket{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;
  padding:16px;background:rgba(4,9,6,.86);backdrop-filter:blur(6px);overflow-y:auto}
.g-ticket__panel{position:relative;width:min(420px,100%);border-radius:22px;padding:26px 22px 22px;
  background:#0E1712;border:1px solid rgba(255,255,255,.12);
  display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;
  box-shadow:0 24px 60px rgba(0,0,0,.55)}
.g-ticket__panel--loading{min-height:220px;justify-content:center;color:rgba(255,255,255,.7)}
.g-ticket__close{position:absolute;top:10px;right:12px;width:40px;height:40px;border-radius:50%;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;
  font-size:1.5rem;line-height:1;cursor:pointer}
.g-ticket__event{margin:0;font-size:1.16rem;font-weight:650;color:#fff;text-wrap:balance;
  padding:0 34px}
.g-ticket__when{margin:0 0 10px;font-size:.84rem;color:rgba(255,255,255,.62)}
/* White ground under the code on purpose: scanners read dark-on-light far more
   reliably than the inverse, and this is the one element that must not fail. */
.g-ticket__qr{background:#fff;border-radius:16px;padding:14px;width:min(300px,78vw)}
.g-ticket__qr img{display:block;width:100%;height:auto;image-rendering:pixelated}
.g-ticket__noqr{margin:0;color:#1a1a1a;font-size:.88rem;padding:32px 8px}
.g-ticket__code{margin:8px 0 0;font-size:.78rem;letter-spacing:.12em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  color:rgba(255,255,255,.45)}
.g-ticket__name{margin:10px 0 0;font-size:1.24rem;font-weight:650;color:#fff}
.g-ticket__meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:4px}
.g-ticket__pass{font-size:.86rem;font-weight:650;color:#fff;padding:5px 12px;border-radius:999px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.g-ticket__vip{font-size:.74rem;font-weight:800;letter-spacing:.1em;padding:5px 12px;border-radius:999px;
  color:#1a1206;background:#FFC53D}
.g-ticket__status{margin:10px 0 0;font-size:.92rem;font-weight:650}
.g-ticket__status.is-good{color:#7DD956}
.g-ticket__status.is-idle{color:rgba(255,255,255,.6)}
.g-ticket__status.is-bad{color:#FF8A80}
.g-ticket__hint{margin:10px 0 0;font-size:.8rem;color:rgba(255,255,255,.45);max-width:34ch}

/* Wallet passes, under the QR. Each store's own black pill, because that is
   what people are looking for -- a Gaia-green button here would read as ours
   rather than as Apple's or Google's. */
.g-wallet{display:flex;flex-direction:column;align-items:center;gap:8px;margin:14px 0 0;width:min(300px,78vw)}
.g-wallet__btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;
  padding:0 16px;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:#000;color:#fff;
  font:inherit;font-size:.92rem;font-weight:650;text-decoration:none;cursor:pointer}
.g-wallet__btn:hover{border-color:rgba(255,255,255,.6)}
.g-wallet__btn:focus-visible{outline:2px solid #a6ed68;outline-offset:2px}
.g-wallet__btn[disabled]{opacity:.65;cursor:default}
.g-wallet__btn i{font-size:1.15em}
.g-wallet__note{margin:0;font-size:.76rem;color:rgba(255,255,255,.45);max-width:32ch;text-align:center}

@media (min-width:760px){
  .g-mye__name{font-size:1.28rem}
  .g-ticket__qr{width:320px}
}

/* ── Favourites and My Schedule ───────────────────────────────────────────
   The save control sits on every agenda row for ticket holders and is absent
   entirely for everyone else, so the public programme stays a programme. */
.g-save{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;
  min-height:44px;padding:8px 12px;border-radius:999px;cursor:pointer;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.72);font-size:.8rem;font-weight:650;
  transition:background .15s ease,border-color .15s ease,color .15s ease}
.g-save:hover{border-color:rgba(168,224,99,.4);color:#fff}
.g-save:disabled{opacity:.55;cursor:progress}
.g-save.is-on{color:#07100b;background:var(--g-accent,#A8E063);border-color:transparent}
.g-save__icon{font-size:1rem;line-height:1}
.g-event-timeline__item{display:flex;gap:12px;align-items:flex-start}
.g-event-timeline__item > div{flex:1;min-width:0}

.g-mysch{border:1px solid rgba(168,224,99,.26);border-radius:20px;padding:18px;
  background:color-mix(in srgb,var(--g-accent,#A8E063) 7%,var(--g-surface,#111A14));
  margin-bottom:22px;display:flex;flex-direction:column;gap:14px}
.g-mysch__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.g-mysch__head h3{margin:0;font-size:1.1rem;font-weight:650;color:#fff}
.g-mysch__count{font-size:.8rem;color:rgba(255,255,255,.6);font-variant-numeric:tabular-nums}
.g-mysch__warn{margin:0;font-size:.84rem;line-height:1.5;color:#FFC53D}
.g-mysch__day{display:flex;flex-direction:column;gap:8px}
.g-mysch__dayhead{margin:0;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
  font-weight:700;color:rgba(255,255,255,.5)}
.g-mysch__item{display:flex;gap:12px;align-items:flex-start;padding:12px;
  border-radius:14px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07)}
.g-mysch__item.has-clash{border-color:rgba(255,197,61,.4)}
.g-mysch__time{flex:0 0 auto;width:5.4rem;font-size:.8rem;font-weight:650;
  color:var(--g-accent,#A8E063);font-variant-numeric:tabular-nums;padding-top:2px}
.g-mysch__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.g-mysch__title{margin:0;font-size:.98rem;font-weight:650;color:#fff;line-height:1.3}
.g-mysch__who,.g-mysch__where{margin:0;font-size:.83rem;color:rgba(255,255,255,.62)}
.g-mysch__clash{margin:2px 0 0;font-size:.8rem;color:#FFC53D}
.g-mysch--empty{align-items:flex-start}
.g-mysch--empty h3{margin:0;font-size:1.05rem;color:#fff}
.g-mysch--empty p{margin:0;font-size:.9rem;line-height:1.55;color:rgba(255,255,255,.68);max-width:50ch}

@media (max-width:480px){
  .g-save__label{display:none}          /* the star alone is legible on a phone */
  .g-save{padding:8px 10px;min-width:44px;justify-content:center}
  .g-mysch__time{width:4.4rem;font-size:.76rem}
}

/* ── Workshop registration ────────────────────────────────────────────────
   The label always says what the tap will actually do: "Join waitlist" on a
   full room, never a "Register" that quietly delivers a queue position. */
.g-event-timeline__reg{display:block;margin-top:8px}
.g-reg{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:9px 16px;
  border-radius:999px;cursor:pointer;font-size:.84rem;font-weight:650;
  border:1px solid rgba(168,224,99,.45);background:rgba(168,224,99,.12);
  color:var(--g-accent,#A8E063);
  transition:background .15s ease,border-color .15s ease,color .15s ease}
.g-reg:hover{background:rgba(168,224,99,.2)}
.g-reg:disabled{opacity:.55;cursor:progress}
.g-reg.is-registered{color:#07100b;background:var(--g-accent,#A8E063);border-color:transparent}
.g-reg.is-waitlisted{color:#FFC53D;background:rgba(255,197,61,.12);border-color:rgba(255,197,61,.4)}
.g-reg.is-full{color:rgba(255,255,255,.75);background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.18)}
.g-reg.is-refused{color:#FF8A80;background:rgba(255,138,128,.1);
  border-color:rgba(255,138,128,.35);cursor:default}

/* ── Venue map ────────────────────────────────────────────────────────────
   Pins are positioned in percentages of the plan image, so the same pin lands
   on the same wall at every screen size. The legend is the accessible route to
   the same information — a list is findable when a crowded plan is not. */
.g-map{display:flex;flex-direction:column;gap:14px}
.g-map__plan{position:relative;border-radius:18px;overflow:hidden;
  border:1px solid rgba(255,255,255,.12);background:#0E1712}
.g-map__plan img{display:block;width:100%;height:auto}
.g-map__pin{position:absolute;transform:translate(-50%,-100%);
  display:flex;flex-direction:column;align-items:center;gap:2px;
  background:none;border:0;cursor:pointer;padding:6px;
  /* comfortably tappable even when pins sit close */
  min-width:44px;min-height:44px;justify-content:flex-end}
.g-map__glyph{font-size:1.15rem;line-height:1;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.8))}
.g-map__pin .g-map__name{font-size:.66rem;font-weight:700;color:#fff;
  background:rgba(7,16,11,.82);padding:2px 7px;border-radius:999px;white-space:nowrap;
  border:1px solid rgba(255,255,255,.15)}
.g-map__pin.is-active .g-map__name{color:#07100b;background:var(--g-accent,#A8E063);
  border-color:transparent}
.g-map__pin.is-active .g-map__glyph{transform:scale(1.35)}
.g-map__legend{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.g-map__row{display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer;
  min-height:52px;padding:10px 12px;border-radius:14px;
  border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);color:inherit}
.g-map__row:hover{border-color:rgba(168,224,99,.35)}
.g-map__row .g-map__glyph{font-size:1rem}
.g-map__row strong{display:block;font-size:.9rem;color:#fff}
.g-map__row em{display:block;font-style:normal;font-size:.78rem;color:rgba(255,255,255,.6)}

/* ── Update notifications ─────────────────────────────────────────────────
   A dot, and a toast. The dot marks unread updates on the tab and clears the
   moment the tab is opened; the toast surfaces a change that lands while the
   person is looking somewhere else. Neither nags. */
.g-tab-dot{display:inline-block;width:8px;height:8px;border-radius:50%;
  background:var(--g-accent,#A8E063);margin-left:6px;vertical-align:2px}
.g-update-toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));
  transform:translateX(-50%);z-index:2147482000;max-width:min(420px,92vw);
  display:flex;flex-direction:column;gap:2px;padding:12px 18px;border-radius:16px;
  background:#0E1712;border:1px solid rgba(168,224,99,.4);
  box-shadow:0 12px 40px rgba(0,0,0,.5);animation:g-toast-in .3s ease}
.g-update-toast strong{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--g-accent,#A8E063)}
.g-update-toast span{font-size:.92rem;color:#fff;line-height:1.4}
.g-update-toast.is-leaving{opacity:0;transition:opacity .4s ease}
@keyframes g-toast-in{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
@media (prefers-reduced-motion: reduce){.g-update-toast{animation:none}}

/* Offline notes: quiet, factual, never alarming. */
.g-mye__offline,.g-ticket__offline{margin:0;font-size:.8rem;line-height:1.5;
  color:#FFC53D;padding:8px 12px;border-radius:10px;
  background:rgba(255,197,61,.09);border:1px solid rgba(255,197,61,.3)}
.g-ticket__offline{margin-top:12px;max-width:34ch;text-align:center}

/* ── People ───────────────────────────────────────────────────────────────
   The join panel leads because the directory is opt-in: the first thing on
   the tab is the choice, not other people's names. */
.g-people{display:flex;flex-direction:column;gap:18px}
.g-people__join{border:1px dashed rgba(255,255,255,.2);border-radius:16px;padding:16px;
  display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.g-people__join.is-on{border-style:solid;border-color:rgba(168,224,99,.35);
  background:rgba(168,224,99,.06)}
.g-people__join p{margin:0;font-size:.92rem;line-height:1.55;color:rgba(255,255,255,.75);max-width:52ch}
.g-people__join strong{color:#fff}
.g-people__biolabel{width:100%;display:flex;flex-direction:column;gap:4px}
.g-people__biolabel span{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:700;color:rgba(255,255,255,.5)}
.g-people__biolabel input{width:100%;min-height:44px;padding:10px 14px;border-radius:12px;
  border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:#fff;font-size:.92rem}
.g-people__group{display:flex;flex-direction:column;gap:8px}
.g-people__group h3{margin:0;font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
  font-weight:700;color:rgba(255,255,255,.5)}
.g-people__card{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.04)}
.g-people__who{min-width:0}
.g-people__who h4{margin:0;font-size:.98rem;font-weight:650;color:#fff}
.g-people__who p{margin:2px 0 0;font-size:.82rem;color:rgba(255,255,255,.62)}
.g-people__bio{font-style:italic}
.g-people__email a{color:var(--g-accent,#A8E063);text-decoration:none;font-size:.86rem}
.g-people__email a:hover{text-decoration:underline}
.g-people__state{flex:0 0 auto;font-size:.78rem;font-weight:650;color:rgba(255,255,255,.55)}
.g-people__state.is-good{color:#7DD956}
.g-people__respond{display:flex;gap:6px;flex:0 0 auto}
.g-people__respond .g-btn{min-height:44px}
.g-people__empty{margin:0;font-size:.88rem;color:rgba(255,255,255,.55)}

/* Rating stars on My Events cards. 44px targets; filled state in the accent. */
.g-mye__rate{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding-top:10px;border-top:1px solid rgba(255,255,255,.07)}
.g-mye__ratelabel{font-size:.82rem;color:rgba(255,255,255,.6)}
.g-mye__stars{display:inline-flex;gap:2px}
.g-mye__star{width:44px;height:44px;border:0;background:none;cursor:pointer;
  font-size:1.4rem;line-height:1;color:rgba(255,255,255,.45);padding:0}
.g-mye__star.is-on{color:#FFC53D}
.g-mye__ratedone{font-size:.8rem;font-weight:650;color:#7DD956}


/* ── Mobile: the sky card, condensed ──────────────────────────────────────
   Same reading, half the height: a smaller moon, tighter copy, and the
   signup invite as one row instead of a boxed paragraph. */
@media (max-width: 480px) {
  .g-sky { gap: 9px; }
  .g-sky__art { width: 62px; height: 62px; }
  .g-sky__phase { font-size: 1.16rem; }
  .g-sky__facts { margin-top: 4px; }
  .g-sky__facts span { font-size: .72rem; padding: 2px 8px; }
  .g-sky__theme { display: none; }          /* the invitation carries it */
  .g-sky__invitation { font-size: .9rem; line-height: 1.45; }
  .g-sky__practice { font-size: .84rem; line-height: 1.45; padding: 9px 11px; }
  .g-sky__invite { padding: 11px 12px; gap: 4px; }
  .g-sky__invite p { font-size: .82rem; line-height: 1.4; }
  .g-sky__invite-head { display: none; }    /* the ask itself is the line that matters */
  .g-sky__invite .g-btn { margin-top: 2px; }
  .g-sky__foot { padding-top: 8px; font-size: .72rem; }
  .g-sky__source { display: none; }         /* charming, not essential */
}

/* ── Template v2: the redesign proposal, applied ──────────────────────────
   Blue-black ground and lime accent arrive via the tokens above. Below: the
   hero as one card with the artwork actually visible, the Elevate art as a
   real banner, the sky card in indigo at one screen height, and the four
   colour-coded doors. Menu stays top-right — the proposal's own call. */

/* Hero: one card. The artwork is the card; the words sit on it. */
body.gaia-v2 .g-super-home .g-super-hero{border:1px solid var(--g-line);
  border-radius:24px;overflow:hidden;background:var(--g-surface)}
.g-super-home .g-super-hero__art{opacity:.85;
  -webkit-mask-image:none;mask-image:none}
.g-super-home .g-super-hero__art::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(4,7,10,.18) 0%,rgba(4,7,10,.55) 55%,rgba(4,7,10,.9) 100%)}
@media (max-width:480px){
  .g-super-home .g-super-hero__art{inset:0;height:auto;opacity:.8}
  body.gaia-v2 .g-super-home .g-super-hero .g-super-hero__intro{min-height:0;
    display:grid;align-content:end;padding:12px 14px 12px}
  .g-super-hero__intro h1{font-size:28px}
  body.gaia-v2 .g-super-hero__intro::before{background:transparent}
}

/* Elevate: the poster is the card; copy sits on it so the first fold can
   hold greeting + event without stacking a 190px banner under the photo. */
.g-feature-event{position:relative;flex-direction:column;min-height:0}
.g-feature-event__art{position:absolute;inset:0;height:auto;border-radius:0}
.g-feature-event__art img{opacity:1;transform:none;filter:none;object-position:center 30%}
.g-feature-event__art::after{background:linear-gradient(180deg,transparent 28%,rgba(4,7,10,.55) 62%,rgba(4,7,10,.94) 100%)}
.g-feature-event__body{margin-top:auto;padding:14px 16px 16px}
.g-feature-event__where{display:flex;align-items:center;gap:5px}
.g-feature-event__where svg{width:14px;height:14px;color:var(--g-accent)}
@media (max-width:480px){
  .g-feature-event .g-feature-event__art{height:auto}
  .g-feature-event .g-feature-event__art img{opacity:1}
  .g-feature-event__title{font-size:1.12rem}
  .g-feature-event__meta{font-size:.82rem}
}

/* Sky: indigo, one screen. Head row · moon+phase+ring · chips · reading. */
.g-sky{gap:10px;padding:16px;border-color:rgba(167,139,250,.3);
  background:radial-gradient(130% 100% at 85% 0%,rgba(109,79,214,.22) 0%,transparent 62%),#0B0A18}
.g-sky__head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.g-sky__head .g-sky__kicker{margin:0;color:#B9A8FF}
.g-sky__tofull{font-size:.7rem;font-weight:700;padding:3px 10px;border-radius:999px;
  color:#0B0A18;background:var(--g-purple);white-space:nowrap}
.g-sky__row{display:flex;align-items:center;gap:14px}
.g-sky__row .g-sky__art{flex:0 0 auto;width:70px;height:70px}
.g-sky__lede{flex:1;min-width:0}
.g-sky__phase{font-family:var(--g-font-serif);font-weight:600;font-size:1.3rem}
.g-sky__day{margin:2px 0 0;font-size:.8rem;color:rgba(255,255,255,.55)}
.g-sky__ring{flex:0 0 auto;width:62px;height:62px}
.g-sky__ring-track{fill:none;stroke:rgba(255,255,255,.1);stroke-width:5}
.g-sky__ring-fill{fill:none;stroke:var(--g-purple);stroke-width:5;stroke-linecap:round}
.g-sky__ring-num{fill:#fff;font-size:13px;font-weight:700;text-anchor:middle;
  font-variant-numeric:tabular-nums}
.g-sky__ring-cap{fill:rgba(255,255,255,.5);font-size:8px;text-anchor:middle;
  letter-spacing:.08em;text-transform:uppercase}
.g-sky__facts{margin:0;display:flex;flex-wrap:wrap;gap:6px}
.g-sky__facts span{font-size:.74rem;font-weight:600;padding:3px 10px;border-radius:999px;
  color:rgba(255,255,255,.8);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1)}
.g-sky__facts .g-sky__chakra{color:var(--ck,#FDD835);
  background:color-mix(in srgb,var(--ck,#FDD835) 13%,transparent);
  border-color:color-mix(in srgb,var(--ck,#FDD835) 32%,transparent)}
.g-sky__theme{display:block;margin:2px 0 0;font-size:.7rem;letter-spacing:.13em;
  text-transform:uppercase;font-weight:700;color:#B9A8FF}
.g-sky__invitation{font-size:.9rem;line-height:1.5}
.g-sky__practice{border-left-color:var(--g-purple)}
.g-sky__practice strong{color:#B9A8FF}
.g-sky__invite{border-color:rgba(167,139,250,.35)}
.g-sky__invite-head{font-size:.88rem}
.g-sky__personal-line{margin:0;padding:10px 12px;border-radius:12px;font-size:.86rem;
  line-height:1.5;color:color-mix(in srgb,var(--own,#B6F25C) 78%,#fff);
  background:color-mix(in srgb,var(--own,#B6F25C) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--own,#B6F25C) 28%,transparent)}

/* Four doors, one row, each in its own colour. */
.g-free-tools__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.g-free-tool{--tool:var(--g-accent);
  border-color:color-mix(in srgb,var(--tool) 22%,transparent);
  background:linear-gradient(165deg,color-mix(in srgb,var(--tool) 9%,transparent),transparent 70%),var(--g-surface)}
.g-free-tool > span{color:var(--tool);background:color-mix(in srgb,var(--tool) 13%,transparent)}
@media (max-width:480px){
  .g-free-tools__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .g-free-tool{min-height:92px;grid-template-columns:none;grid-auto-flow:row;
    align-content:center;justify-items:center;gap:6px;padding:10px 4px;text-align:center}
  .g-free-tool > span{width:38px;height:38px;font-size:19px}
  .g-free-tool strong{font-size:11.5px;line-height:1.15}
  .g-free-tool small{display:none}
}

/* Continue your journey — members with a real course grant. Purple family. */


/* ── Retouch: air, hierarchy, and quiet edges ─────────────────────────────
   From real-device review: same layout, more room to breathe. Text over the
   hero art gets a soft shadow, every block inside the sky card gets clear
   separation, and nothing sits closer than it needs to. */
@media (max-width: 480px){
  .g-super-home{gap:8px}

  /* Hero: words seated with intention, not stacked in a corner. */
  body.gaia-v2 .g-super-home .g-super-hero .g-super-hero__intro{
    min-height:0;padding:12px 14px 12px;row-gap:0}
  .g-super-hero__intro .g-super-date{margin:0 0 4px;text-shadow:0 1px 8px rgba(0,0,0,.6)}
  .g-super-hero__intro h1{font-size:26px;line-height:1.05;margin:0 0 4px;
    text-shadow:0 2px 14px rgba(0,0,0,.65)}
  .g-super-hero__intro > p:not(.g-super-date){margin:0 0 10px;font-size:13px;
    color:rgba(255,255,255,.82);text-shadow:0 1px 10px rgba(0,0,0,.6)}

  /* Elevate: poster is the card; copy sits on it so the fold can hold both. */
  .g-feature-event .g-feature-event__art{position:absolute;inset:0;height:auto}
  .g-feature-event__body{padding:12px;gap:6px}
  .g-feature-event__meta{font-size:.84rem;color:rgba(255,255,255,.72)}
  .g-feature-event__actions{margin-top:10px;gap:10px}

  /* Sky: one screen, but with visible seams between its four moments. */
  .g-sky{gap:0;padding:16px}
  .g-sky__head{margin-bottom:14px}
  .g-sky__tofull{font-size:.68rem;padding:3px 9px}
  .g-sky__row{gap:12px;margin-bottom:12px}
  .g-sky__row .g-sky__art{width:64px;height:64px}
  .g-sky__phase{font-size:1.24rem}
  .g-sky__day{font-size:.78rem}
  .g-sky__ring{width:56px;height:56px}
  .g-sky__facts{margin-bottom:14px}
  .g-sky__facts span{font-size:.72rem;padding:3px 9px}
  .g-sky__theme{font-size:.64rem;margin-bottom:6px}
  .g-sky__invitation{font-size:.88rem;line-height:1.5;margin-bottom:12px}
  .g-sky__practice{font-size:.84rem;padding:10px 12px;margin-bottom:12px}
  .g-sky__invite{padding:12px 14px;gap:5px}
  .g-sky__invite p{font-size:.84rem;margin:0}
  .g-sky__invite-head{font-size:.86rem}
  .g-sky__invite .g-btn{margin-top:6px;min-height:42px}

  /* Four doors: square, roomy, labels that never wrap awkwardly. */
  .g-free-tools{padding:18px 14px}
  .g-free-tools__grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .g-free-tool{min-height:96px;grid-template-columns:none;grid-auto-flow:row;
    align-content:center;justify-items:center;gap:7px;padding:12px 4px;
    text-align:center;border-radius:16px}
  .g-free-tool > span{width:40px;height:40px;font-size:20px}
  .g-free-tool strong{font-size:11.5px;line-height:1.2;letter-spacing:.01em}
  .g-free-tool small{display:none}

  /* Section heads: kicker small, serif calm, consistent rhythm. */
  .g-super-section-head{margin-bottom:14px}
  .g-super-section-head h2{font-size:26px}
}


/* CTA pair: a row wherever it lives. */
.g-super-discover{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* ── Desktop: the template, composed for a wide screen ────────────────────
   The phone layout stretched wide read as boxes in a void: the moon art sat
   in a bordered side panel, and the 760px poster smeared across 1240px.
   Here the hero is one cinematic card with the words seated bottom-left,
   and the poster becomes a true side panel at a size it stays sharp. */
@media (min-width: 1060px){
  /* Hero: full-bleed art, words bottom-left, air everywhere. */
  body.gaia-v2 .g-super-home .g-super-hero{position:relative;display:block;
    min-height:0;border-radius:26px}
  .g-super-home .g-super-hero__art{position:absolute;inset:0;border-left:0;
    background-position:center 26%;opacity:.9}
  .g-super-home .g-super-hero__art::after{
    background:linear-gradient(100deg,rgba(4,7,10,.82) 0%,rgba(4,7,10,.35) 45%,rgba(4,7,10,.05) 75%),
      linear-gradient(180deg,transparent 45%,rgba(4,7,10,.8) 100%)}
  body.gaia-v2 .g-super-home .g-super-hero .g-super-hero__intro{position:relative;
    z-index:1;min-height:0;max-width:620px;display:grid;align-content:end;
    padding:40px 44px;row-gap:0}
  .g-super-home .g-super-hero__intro h1{font-size:56px;line-height:1.02;margin:0 0 10px;
    text-shadow:0 2px 18px rgba(0,0,0,.6)}
  .g-super-home .g-super-hero__intro .g-super-date{margin:0 0 10px}
  .g-super-home .g-super-hero__intro > p:not(.g-super-date){margin:0 0 22px;
    font-size:17px;color:rgba(255,255,255,.85);text-shadow:0 1px 12px rgba(0,0,0,.55)}

  /* Elevate: same overlay card as mobile, stretched beside the greeting. */
  .g-feature-event{flex-direction:column;align-items:stretch;min-height:0}
  .g-feature-event__art{position:absolute;inset:0;flex:none;height:auto;border-radius:0}
  .g-feature-event__art img{object-position:center 35%}
  .g-feature-event__art::after{
    background:linear-gradient(180deg,transparent 32%,rgba(4,7,10,.55) 68%,rgba(4,7,10,.94) 100%)}
  .g-feature-event__body{flex:none;margin-top:auto;justify-content:flex-end;padding:22px 26px;gap:10px}
  .g-feature-event__title{font-size:1.7rem}
  .g-feature-event__meta{font-size:.95rem}
  .g-feature-event__actions{margin-top:12px;gap:12px}

  /* Sky beside the hero: give its pieces desktop sizes. */
  .g-sky{padding:20px}
  .g-sky__row .g-sky__art{width:76px;height:76px}
  .g-sky__phase{font-size:1.4rem}
  .g-sky__ring{width:66px;height:66px}

  /* Doors and the journey card breathe a little wider. */
  .g-free-tool{min-height:118px}
  .g-free-tool strong{font-size:13px}
  .g-free-tool > span{width:46px;height:46px;font-size:22px}
}

/* Chakra Balance Quiz — result recommendations (Phase 1) */
.g-cq-result .g-quiz__result-name span{font-size:15px;color:var(--g-text-muted);font-style:italic;font-weight:400}
.g-cq-try{margin-top:var(--g-s3);padding:12px 14px;border:1px solid var(--g-line);border-radius:14px;background:color-mix(in srgb,var(--ck,var(--g-accent)) 8%,transparent)}
.g-cq-try__label{display:block;font:700 10.5px/1 var(--g-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ck,var(--g-accent));margin-bottom:5px}
.g-cq-try p{margin:0;font-size:13.5px;line-height:1.5;color:var(--g-text)}
.g-cq-recs__head{margin:var(--g-s4) 0 8px;font:700 11px/1 var(--g-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--g-text-muted)}
.g-cq-recs{display:flex;flex-direction:column;gap:8px}
.g-cq-rec{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--g-line);border-radius:14px;text-decoration:none;background:var(--g-surface);transition:border-color .15s ease}
.g-cq-rec:hover{border-color:var(--ck,var(--g-accent))}
.g-cq-rec strong{color:var(--g-text);font-size:14px;font-weight:600}
.g-cq-rec small{color:var(--g-text-muted);font-size:12px}
.g-cq-rec--primary{border-color:var(--ck,var(--g-accent));background:color-mix(in srgb,var(--ck,var(--g-accent)) 12%,var(--g-surface))}

/* Chakra Balance Quiz — email lead capture (Phase 1b) */
.g-cq-lead{margin-top:var(--g-s4);padding:14px 15px;border:1px solid var(--ck,var(--g-accent));border-radius:14px;background:color-mix(in srgb,var(--ck,var(--g-accent)) 8%,transparent)}
.g-cq-lead__head{margin:0 0 9px;font-size:13.5px;font-weight:600;color:var(--g-text)}
.g-cq-lead__row{display:flex;gap:8px;flex-wrap:wrap}
.g-cq-lead__input{flex:1 1 160px;min-width:0}
.g-cq-lead__status{margin:7px 0 0;font-size:12px;color:var(--g-text-muted);min-height:14px}
.g-cq-lead__done{margin:0;font-size:13px;font-weight:600;color:var(--ck,var(--g-accent))}

/* Moon Rituals (Phase 2) */
.g-moon__top{display:flex;align-items:center;gap:14px}
.g-moon__orb{flex:none;width:50px;height:50px;border-radius:50%;background:radial-gradient(circle at 38% 34%,#f6f3ff,#d9d0ff 55%,#b9a9f0);box-shadow:0 0 18px rgba(190,170,255,.45);border:1px solid rgba(200,185,255,.4)}
.g-moon__phase{margin:0;font-family:var(--g-font-serif);font-size:19px;color:var(--g-text)}
.g-moon__sign{margin:1px 0 0;font-size:12px;color:var(--g-text-muted)}
.g-moon__ritual-title{margin:12px 0 4px;font-family:var(--g-font-serif);font-size:17px;color:var(--g-text)}
.g-moon__crystal{margin-top:12px;padding:12px 14px;border:1px solid var(--g-line);border-radius:14px;display:flex;flex-direction:column;gap:9px}
.g-moon.is-full .g-moon__crystal{border-color:rgba(200,185,255,.55);background:rgba(190,170,255,.10)}
.g-moon__crystal p{margin:0;font-size:13px;line-height:1.5;color:var(--g-text)}
.g-moon__crystal .g-btn{align-self:flex-start}
.g-moon__next{margin:12px 0 0;font:600 11px/1.4 var(--g-font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--g-text-muted)}

/* Energy Match (Phase 4) */
.g-match-person{margin-top:12px}
.g-match-person .g-label{display:block;margin-bottom:6px}
.g-match-dob{display:flex;gap:8px}
.g-match-dob .g-input{min-width:0}
.g-match-dob select{flex:1.4}
.g-match-dob input{flex:1}
.g-match-err{margin:8px 0 0;font-size:12px;color:#e0745a;min-height:14px}
.g-match-orbs{display:flex;align-items:center;justify-content:center;gap:18px;margin:4px 0 14px}
.g-match-score{text-align:center}
.g-match-score strong{display:block;font-family:var(--g-font-serif);font-size:34px;line-height:1;color:var(--g-text)}
.g-match-score strong i{font-size:16px;font-style:normal;color:var(--g-text-muted)}
.g-match-score span{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--g-accent)}

/* Cosmic Map (Phase 5) */
.g-cosmic__note{margin:10px 0 0;font-size:12.5px;line-height:1.5;color:var(--g-text-muted);font-style:italic}
.g-cosmic__unlock{margin-top:var(--g-s4);padding:13px 15px;border:1px dashed var(--g-line);border-radius:14px}
.g-cosmic__unlock-head{margin:0 0 5px;font-size:13px;font-weight:700;color:var(--g-text)}
.g-cosmic__unlock p{margin:0 0 9px;font-size:12.5px;line-height:1.5;color:var(--g-text-muted)}
/* Chakra Journey (Phase 3) */
.g-chal__bar{height:6px;border-radius:4px;background:rgba(255,255,255,.07);overflow:hidden;margin:2px 0 12px}
.g-chal__bar>i{display:block;height:100%;border-radius:4px;background:var(--ck,var(--g-accent))}
.g-chal__affirm{margin:0 0 10px;font-family:var(--g-font-serif);font-size:16px;font-style:italic;color:var(--g-text)}
.g-chal__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.g-chal__done{font-size:13px;font-weight:700;color:var(--ck,var(--g-accent))}
.g-chal__streak{font:600 11px/1 var(--g-font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--g-text-muted)}

/* Energy toolkit accordion (collapsible tool cards) */
.g-toolkit{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.g-tk{border:1px solid var(--g-line);border-radius:16px;background:var(--g-surface);overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}
.g-tk.is-open{border-color:color-mix(in srgb,var(--tint,var(--g-accent)) 55%,var(--g-line));box-shadow:0 6px 22px rgba(0,0,0,.18)}
.g-tk__head{width:100%;display:flex;align-items:center;gap:13px;padding:15px 16px;background:none;border:0;cursor:pointer;text-align:left;color:var(--g-text);font:inherit}
.g-tk__icon{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:21px;color:var(--tint,var(--g-accent));background:color-mix(in srgb,var(--tint,var(--g-accent)) 15%,transparent)}
.g-tk__text{flex:1;min-width:0;display:grid;gap:2px}
.g-tk__text strong{font-size:15px;font-weight:600;line-height:1.2}
.g-tk__text small{font-size:12.5px;line-height:1.35;color:var(--g-text-muted)}
.g-tk__chev{flex:none;font-size:18px;color:var(--g-text-muted);transition:transform .25s ease}
.g-tk.is-open .g-tk__chev{transform:rotate(180deg);color:var(--tint,var(--g-accent))}
.g-tk__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.3,.8,.3,1)}
.g-tk.is-open .g-tk__panel{grid-template-rows:1fr}
.g-tk__inner{overflow:hidden;min-height:0}
.g-tk__inner .g-card{border:none;background:transparent;box-shadow:none;margin:0;padding:2px 16px 16px;border-radius:0}
.g-tk__inner .g-card > .g-card__label:first-child{display:none}
.g-tk__head:hover .g-tk__icon{filter:brightness(1.12)}
.g-tk__head:focus-visible{outline:2px solid var(--tint,var(--g-accent));outline-offset:-2px;border-radius:16px}
@media (prefers-reduced-motion:reduce){.g-tk__panel,.g-tk__chev{transition:none}}

/* Energy Check — combined reading card (compact redesign) */
.g-et{display:flex;flex-direction:column}
.g-et__row{display:flex;align-items:center;gap:14px;padding:10px 0}
.g-et__row + .g-et__row{border-top:1px solid var(--g-line)}
.g-et__body{min-width:0}
.g-et__k{margin:0;font:600 10px/1 var(--g-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--g-text-muted)}
.g-et__n{margin:3px 0 0;font-family:var(--g-font-serif);font-size:20px;line-height:1.1;color:var(--g-text)}
.g-et__n span{font-size:14px;color:var(--g-text-muted);font-style:italic}
.g-et__m{margin:2px 0 0;font-size:12.5px;color:var(--g-text-muted)}
.g-et__note{margin:0;padding:11px 0 2px;border-top:1px solid var(--g-line);font-size:13px;color:var(--g-text)}

/* Energy Check — collapsible <details> dropdowns (Practice, Challenge) */
.g-drop{border:1px solid var(--g-line);border-radius:16px;background:var(--g-surface);overflow:hidden;margin-top:10px}
.g-drop[open]{border-color:color-mix(in srgb,var(--tint,var(--g-accent)) 45%,var(--g-line))}
.g-drop__head{list-style:none;display:flex;align-items:center;gap:13px;padding:14px 16px;cursor:pointer;color:var(--g-text)}
.g-drop__head::-webkit-details-marker{display:none}
.g-drop__head::marker{content:""}
.g-drop__icon{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:19px;color:var(--tint,var(--g-accent));background:color-mix(in srgb,var(--tint,var(--g-accent)) 15%,transparent)}
.g-drop__text{flex:1;min-width:0;display:grid;gap:2px}
.g-drop__text strong{font-size:14.5px;font-weight:600}
.g-drop__text small{font-size:12px;color:var(--g-text-muted)}
.g-drop__chev{flex:none;font-size:17px;color:var(--g-text-muted);transition:transform .2s ease}
.g-drop[open] .g-drop__chev{transform:rotate(180deg);color:var(--tint,var(--g-accent))}
.g-drop__body{padding:0 16px 16px}
.g-drop__body .g-card{border:none;background:transparent;box-shadow:none;margin:0;padding:0}
[data-wellness-signout]{display:flex;justify-content:center;margin-top:6px}

/* Horoscope — element-tinted graphic hero (redesign) */
.g-horo{position:relative;overflow:hidden;padding:20px;border-radius:20px;border:1px solid color-mix(in srgb,var(--el,#4fc3dc) 30%,var(--g-line));background:linear-gradient(150deg,color-mix(in srgb,var(--el,#4fc3dc) 15%,var(--g-surface)),var(--g-surface) 68%)}
.g-horo__glow{position:absolute;top:-46px;right:-34px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--el,#4fc3dc) 42%,transparent),transparent 70%);pointer-events:none}
.g-horo__hero{position:relative;display:flex;align-items:center;gap:16px}
.g-horo__badge{flex:none;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:32px;color:var(--el,#4fc3dc);border:1px solid color-mix(in srgb,var(--el,#4fc3dc) 45%,transparent);background:color-mix(in srgb,var(--el,#4fc3dc) 12%,transparent);box-shadow:0 0 34px color-mix(in srgb,var(--el,#4fc3dc) 32%,transparent)}
.g-horo__id{min-width:0}
.g-horo__eyebrow{margin:0;font:700 10px/1 var(--g-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--el,#4fc3dc)}
.g-horo__sign{margin:5px 0 9px;font-family:var(--g-font-serif);font-size:30px;font-weight:600;line-height:1;color:var(--g-text)}
.g-horo__chips{display:flex;flex-wrap:wrap;gap:7px}
.g-horo__chips span{padding:5px 11px;border-radius:999px;font:700 10.5px/1 var(--g-font-sans);color:var(--g-text);border:1px solid color-mix(in srgb,var(--el,#4fc3dc) 38%,transparent);background:color-mix(in srgb,var(--el,#4fc3dc) 12%,transparent)}
.g-horo__reading{position:relative;margin:16px 0 10px;font-family:var(--g-font-serif);font-size:clamp(19px,4.8vw,24px);line-height:1.35;color:var(--g-text)}
.g-horo .g-hint{position:relative;margin:0}

/* Horoscope check-in — compact icon-left rows (redesign of .g-cosmic-checkin) */
.g-cc{display:grid;gap:9px;margin-top:12px}
.g-cc__item{display:flex;align-items:flex-start;gap:12px;padding:13px 14px;border:1px solid var(--g-line);border-radius:14px;background:var(--g-surface)}
.g-cc__ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:18px;color:var(--el,var(--g-accent));background:color-mix(in srgb,var(--el,var(--g-accent)) 14%,transparent)}
.g-cc__b{min-width:0}
.g-cc__k{display:block;font:700 10px/1 var(--g-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--g-text-muted)}
.g-cc__b p{margin:4px 0 0;color:var(--g-text);font-size:13.5px;line-height:1.45}

/* Graphic ritual CTA — Horoscope + Chakra match (tinted by --el or --active-chakra) */
.g-ritual-cta{width:100%;display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:15px;cursor:pointer;text-align:left;color:var(--g-text);border:1px solid color-mix(in srgb,var(--el,var(--active-chakra,var(--g-accent))) 40%,var(--g-line));background:linear-gradient(120deg,color-mix(in srgb,var(--el,var(--active-chakra,var(--g-accent))) 15%,var(--g-surface)),var(--g-surface) 74%);transition:border-color .15s ease,transform .1s ease}
.g-ritual-cta:hover{border-color:color-mix(in srgb,var(--el,var(--active-chakra,var(--g-accent))) 65%,var(--g-line))}
.g-ritual-cta:active{transform:scale(.99)}
.g-ritual-cta__ic{flex:none;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:20px;color:var(--el,var(--active-chakra,var(--g-accent)));background:color-mix(in srgb,var(--el,var(--active-chakra,var(--g-accent))) 16%,transparent)}
.g-ritual-cta__t{flex:1;min-width:0;display:grid;gap:2px}
.g-ritual-cta__t strong{font-size:14px;font-weight:600;line-height:1.2}
.g-ritual-cta__t small{font-size:11.5px;color:var(--g-text-muted)}
.g-ritual-cta__go{flex:none;font-size:18px;color:var(--el,var(--active-chakra,var(--g-accent)))}
/* Chakra match — compact guide rows (mirror the Horoscope rows) */
.g-chakra-hero .g-chakra-guide__rituals{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:9px}
.g-chakra-hero .g-guide-row{display:flex;align-items:flex-start;gap:12px;padding:12px 13px;border:1px solid var(--g-line);border-radius:13px;background:var(--g-surface)}
.g-chakra-hero .g-guide-row__ic{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:17px;color:var(--active-chakra,var(--g-accent));background:color-mix(in srgb,var(--active-chakra,var(--g-accent)) 15%,transparent)}
.g-chakra-hero .g-guide-row__b{min-width:0}
.g-chakra-hero .g-guide-row__k{display:block;margin:0;font:700 9.5px/1.3 var(--g-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--g-text-muted)}
.g-chakra-hero .g-guide-row__b p{margin:4px 0 0;color:var(--g-text);font-size:12.5px;line-height:1.45}

/* Academy Player (Path A, Phase 1) — full-screen native course player */
.gaia-acad{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;background:var(--g-bg,#0b0f0c);color:var(--g-text)}
.gaia-acad__bar{display:flex;align-items:center;gap:12px;padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px;border-bottom:1px solid var(--g-line);background:var(--g-surface)}
.gaia-acad__back{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:20px;color:var(--g-text);background:var(--g-surface-hi);border:1px solid var(--g-line);cursor:pointer}
.gaia-acad__back:hover{border-color:var(--g-accent);color:var(--g-accent)}
.gaia-acad__title{flex:1;min-width:0;margin:0;font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gaia-acad__spacer{width:38px;flex:none}
.gaia-acad__stage{background:#000;width:100%}
.gaia-acad__video{width:100%;max-height:56vh;display:block;background:#000;aspect-ratio:16/9}
.gaia-acad__nowplaying{margin:0;padding:13px 16px 2px;font-family:var(--g-font-serif);font-size:18px;line-height:1.25;color:var(--g-text)}
.gaia-acad__list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:6px 12px calc(env(safe-area-inset-bottom,0px) + 22px)}
.gaia-acad__sec{margin-top:10px}
.gaia-acad__seclabel{margin:0 0 7px;font:700 10px/1 var(--g-font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--g-text-muted)}
.gaia-acad__lesson{width:100%;display:flex;align-items:center;gap:12px;padding:11px 12px;margin-bottom:7px;border:1px solid var(--g-line);border-radius:13px;background:var(--g-surface);color:var(--g-text);cursor:pointer;text-align:left}
.gaia-acad__lesson.is-active{border-color:var(--g-accent);background:color-mix(in srgb,var(--g-accent) 12%,var(--g-surface))}
.gaia-acad__play{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:16px;color:var(--g-accent);background:color-mix(in srgb,var(--g-accent) 14%,transparent)}
.gaia-acad__lesson.is-active .gaia-acad__play{background:var(--g-accent);color:#05270f}
.gaia-acad__ltext{flex:1;min-width:0;display:grid;gap:2px}
.gaia-acad__ltext strong{font-size:14px;font-weight:600}
.gaia-acad__ltext small{font-size:12px;color:var(--g-text-muted);font-variant-numeric:tabular-nums}
.gaia-acad__lcheck{flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--g-line)}
.gaia-acad__lcheck.is-done{border-color:var(--g-accent);background:var(--g-accent)}
.gaia-acad__lcheck.is-done::after{content:"\2713";display:block;text-align:center;color:#05270f;font-size:12px;line-height:17px;font-weight:700}
.gaia-acad-cta{width:100%;text-align:left;cursor:pointer;border:1px solid color-mix(in srgb,var(--g-accent) 45%,var(--g-line))}

.gaia-acad__yt{width:100%;aspect-ratio:16/9;max-height:56vh;display:block;border:0;background:#000}
.gaia-acad__unavail{width:100%;aspect-ratio:16/9;max-height:56vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;padding:24px;text-align:center;background:#000;color:var(--g-text)}
.gaia-acad__unavail .ph{font-size:40px;color:var(--g-text-muted)}
.gaia-acad__unavail-title{margin:0;font-size:17px;font-weight:600}
.gaia-acad__unavail-body{margin:0;max-width:34em;font-size:14px;line-height:1.45;color:var(--g-text-muted)}
.gaia-acad__unavail-actions{margin:8px 0 0}
.gaia-acad__lesson.is-locked{opacity:.72}
.gaia-acad__lesson.is-locked .gaia-acad__play{color:var(--g-text-muted)}
/* Viewport-fill fallback for the fullscreen button where iOS Safari can
   fullscreen neither an iframe nor a div (YouTube/Vimeo lessons): the same
   player stays mounted — no reload, no playback restart — and the lesson
   list steps aside so the stage fills the viewport. */
.gaia-acad--fill .gaia-acad__list,
.gaia-acad--fill .gaia-acad__nowplaying{display:none}
.gaia-acad--fill .gaia-acad__stage{flex:1;display:flex;align-items:center;justify-content:center}
.gaia-acad--fill .gaia-acad__yt{width:auto;height:100%;max-width:100%;max-height:100%;margin:0 auto}
.gaia-acad--fill .gaia-acad__video{width:100%;height:100%;max-height:none;object-fit:contain}

.g-acadprog{display:block;height:5px;border-radius:999px;background:var(--g-line);margin-top:7px;overflow:hidden}
.g-acadprog > span{display:block;height:100%;border-radius:999px;background:var(--g-accent)}

/* Your courses — collapsible course cards with video drop-down + progress */
.g-sync-list{display:grid;gap:10px;margin-top:12px}
.g-sync{border:1px solid var(--g-line);border-radius:16px;background:var(--g-surface);overflow:hidden}
.g-sync[open]{border-color:color-mix(in srgb,var(--g-accent) 40%,var(--g-line))}
.g-sync__head{list-style:none;display:flex;align-items:center;gap:13px;padding:12px 14px;cursor:pointer}
.g-sync__head::-webkit-details-marker{display:none}
.g-sync__poster{flex:none;width:52px;height:52px;border-radius:11px;object-fit:cover;background:var(--g-surface-hi)}
.g-sync__poster--ph{display:grid;place-items:center;font-size:22px;color:var(--g-accent);background:color-mix(in srgb,var(--g-accent) 12%,transparent)}
.g-sync__meta{flex:1;min-width:0;display:grid;gap:4px}
.g-sync__meta strong{font-size:14.5px;font-weight:600;line-height:1.2}
.g-sync__meta small{font-size:12px;color:var(--g-text-muted);font-variant-numeric:tabular-nums}
.g-sync__chev{flex:none;font-size:18px;color:var(--g-text-muted);transition:transform .2s ease}
.g-sync[open] .g-sync__chev{transform:rotate(180deg);color:var(--g-accent)}
.g-sync__lessons{padding:2px 10px 10px}
.g-sync__lesson{width:100%;display:flex;align-items:center;gap:11px;padding:10px 11px;margin-top:6px;border:1px solid var(--g-line);border-radius:12px;background:var(--g-bg,#0b0f0c);color:var(--g-text);cursor:pointer;text-align:left}
.g-sync__lesson:hover{border-color:var(--g-accent)}
.g-sync__lplay{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-size:18px;color:var(--g-accent);background:color-mix(in srgb,var(--g-accent) 13%,transparent)}
.g-sync__ltext{flex:1;min-width:0}
.g-sync__ltext strong{font-size:13.5px;font-weight:600}
.g-sync__lgo{flex:none;font-size:15px;color:var(--g-text-muted)}
.g-sync__ldone{flex:none;font:700 10px/1 var(--g-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--g-accent)}
.g-sync__empty{margin:8px 4px 2px;font-size:12.5px;color:var(--g-text-muted)}
.gaia-acad__fs{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:19px;color:var(--g-text);background:var(--g-surface-hi);border:1px solid var(--g-line);cursor:pointer}
.gaia-acad__fs:hover{border-color:var(--g-accent);color:var(--g-accent)}

/* ── Digital badge card (gaia-card.js) ─────────────────────────────────── */
.g-card{width:100%;margin-top:14px;padding:16px;border-radius:16px;text-align:left;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.g-card__head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.g-card__title{margin:0;font-size:1rem;font-weight:700;color:#fff}
.g-card__pill{font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:999px;
  color:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.18)}
.g-card__pill.is-on{color:var(--g-on-accent);background:var(--g-accent);border-color:transparent}
.g-card__views{margin-left:auto;font-size:.78rem;color:rgba(255,255,255,.55)}
.g-card__lead{margin:8px 0 0;font-size:.9rem;line-height:1.5;color:rgba(255,255,255,.72)}
.g-card__lead em{color:#fff;font-style:normal;font-weight:600}
.g-card__url{display:inline-block;margin-top:10px;font-family:var(--g-font-mono);font-size:.85rem;color:var(--g-teal);text-decoration:none;
  word-break:break-all;border-bottom:1px dotted rgba(92,225,230,.5)}
.g-card__actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.g-card__actions .g-btn{flex:1 1 auto;justify-content:center}
/* the editor sheet */
.g-card__sheet{align-items:flex-end}
@media (min-width:600px){.g-card__sheet{align-items:center}}
.g-card__panel{position:relative;width:min(480px,100%);max-height:min(92dvh,900px);overflow:auto;-webkit-overflow-scrolling:touch;
  border-radius:22px 22px 0 0;padding:22px 20px 28px;background:#0E1712;border:1px solid rgba(255,255,255,.12);
  text-align:left;box-shadow:0 24px 60px rgba(0,0,0,.55)}
@media (min-width:600px){.g-card__panel{border-radius:22px}}
.g-card__h2{margin:2px 0 14px;font-size:1.35rem;color:#fff}
.g-card__form{display:flex;flex-direction:column;gap:12px}
.g-card__photo{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.g-card__photo small,.g-card__field small,.g-card__toggle small{display:block;font-size:.76rem;color:rgba(255,255,255,.5);line-height:1.4}
.g-card__photo small{flex-basis:100%;margin-top:-4px}
.g-card__avatar{width:72px;height:72px;border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;
  font-weight:700;font-size:1.5rem;color:var(--g-on-accent);
  background:conic-gradient(from 210deg,var(--g-accent),var(--g-teal),var(--g-purple),var(--g-accent))}
.g-card__avatar img{width:100%;height:100%;object-fit:cover;display:block}
.g-card__upload{cursor:pointer}
.g-card__name{margin:0;font-size:1.1rem;font-weight:700;color:#fff}
.g-card__field{display:flex;flex-direction:column;gap:5px}
.g-card__field>span,.g-card__sub{font-size:.78rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.g-card__sub{margin:8px 0 -4px}
.g-card__field input,.g-card__field textarea{width:100%;box-sizing:border-box;font:inherit;font-size:1rem;color:#fff;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:11px 12px;min-height:44px}
.g-card__field textarea{resize:vertical;line-height:1.45}
.g-card__field input:focus,.g-card__field textarea:focus{outline:none;border-color:var(--g-accent);box-shadow:0 0 0 3px rgba(182,242,92,.18)}
.g-card__note{margin:0;font-size:.85rem;line-height:1.5;color:rgba(255,255,255,.6)}
/* What is held on file but never published. Shown read-only so the owner can
   check it is right, without implying they can switch it on for the world. */
.g-card__oncard{display:grid;gap:1px;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);border-radius:12px;overflow:hidden;margin-top:10px}
.g-card__oncard-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  padding:11px 14px;background:var(--g-surface,#0f1a12)}
.g-card__oncard-row span{font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;
  color:rgba(255,255,255,.55)}
.g-card__oncard-row b{font-weight:600;font-size:.95rem;overflow-wrap:anywhere;text-align:right}
.g-card__toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);cursor:pointer;min-height:48px}
.g-card__toggle>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.g-card__toggle b{color:#fff;font-weight:600;font-size:.95rem}
.g-card__toggle small{word-break:break-all}
.g-card__toggle input{position:absolute;opacity:0;width:1px;height:1px}
.g-card__toggle i{flex:none;width:44px;height:26px;border-radius:999px;background:rgba(255,255,255,.18);position:relative;transition:background var(--g-dur-2) var(--g-ease)}
.g-card__toggle i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform var(--g-dur-2) var(--g-ease)}
.g-card__toggle input:checked+i{background:var(--g-accent)}
.g-card__toggle input:checked+i::after{transform:translateX(18px)}
.g-card__toggle input:focus-visible+i{box-shadow:var(--g-focus)}
.g-card__publish{margin-top:6px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1)}
.g-card__publish .g-card__toggle{border-color:rgba(182,242,92,.35)}
.g-card__status{margin:0;min-height:1.2em;font-size:.88rem;color:rgba(255,255,255,.6)}
.g-card__status.is-good{color:var(--g-accent)}.g-card__status.is-bad{color:var(--g-danger)}
.g-card__toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translate(-50%,16px);opacity:0;z-index:2147483001;
  max-width:min(92vw,420px);padding:12px 16px;border-radius:14px;font-size:.92rem;line-height:1.4;color:#fff;
  background:#131A22;border:1px solid rgba(255,255,255,.14);box-shadow:var(--g-shadow-pop);transition:opacity var(--g-dur-2) var(--g-ease),transform var(--g-dur-2) var(--g-ease)}
.g-card__toast.is-in{opacity:1;transform:translate(-50%,0)}
.g-card__toast.is-good{border-color:rgba(182,242,92,.45)}.g-card__toast.is-warn{border-color:rgba(232,176,75,.5)}
@media (prefers-reduced-motion:reduce){.g-card__toast,.g-card__toggle i,.g-card__toggle i::after{transition:none}}

/* theme picker + profile tile (gaia-card.js) */
.g-card__themes{display:flex;gap:8px;flex-wrap:wrap}
.g-card__theme{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;font-size:11px;color:rgba(255,255,255,.6);text-transform:capitalize}
.g-card__theme input{position:absolute;opacity:0;width:1px;height:1px}
.g-card__theme i{width:36px;height:36px;border-radius:50%;border:2px solid transparent;background:conic-gradient(from 210deg,var(--t1),var(--t2),var(--t3),var(--t1))}
.g-card__theme input:checked+i{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.18)}
.g-card__theme input:focus-visible+i{box-shadow:var(--g-focus)}
.g-card__theme--gaia{--t1:#B6F25C;--t2:#5CE1E6;--t3:#A78BFA}.g-card__theme--sunrise{--t1:#F5C451;--t2:#F08A5D;--t3:#E5715A}
.g-card__theme--ocean{--t1:#5CE1E6;--t2:#4F9DF2;--t3:#A78BFA}.g-card__theme--rose{--t1:#F7A1C4;--t2:#E06C9F;--t3:#A78BFA}
.g-card__theme--forest{--t1:#6FCE3A;--t2:#3F8C1F;--t3:#5CE1E6}.g-card__theme--gold{--t1:#F5C451;--t2:#E8B04B;--t3:#FFFFFF}
.g-cardtile__wrap{margin:8px 0 18px}.g-cardtile__h2{margin:2px 0 12px;font-size:1.25rem}
.g-cardtile{display:grid;grid-template-columns:104px 1fr;gap:14px;align-items:center;padding:14px;border-radius:18px;background:var(--g-surface);border:1px solid var(--g-line)}
.g-cardtile__qr{background:#fff;border-radius:12px;padding:6px}.g-cardtile__qr img{display:block;width:100%;height:auto;image-rendering:pixelated}
.g-cardtile__ev{margin:0;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--g-accent);font-weight:700}
.g-cardtile__name{margin:2px 0 4px;font-weight:700;font-size:1.05rem;color:#fff}
.g-cardtile__state{margin:8px 0 0;display:flex;align-items:center;gap:8px}
.g-cardtile__hint{margin:10px 0 0;font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.5}
@media (max-width:420px){.g-cardtile{grid-template-columns:84px 1fr}}

/* permanent badge-card tile: the events it has been carried at */
.g-cardtile__events{list-style:none;margin:10px 0 0;padding:12px 14px;display:grid;gap:8px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--g-line)}
.g-cardtile__events li{display:flex;align-items:center;gap:9px;font-size:.92rem;font-weight:600;color:#fff}
.g-cardtile__dot{width:6px;height:6px;border-radius:50%;background:var(--g-accent);flex:none}
.g-cardtile__role{margin-left:auto;font-size:.78rem;font-weight:500;color:rgba(255,255,255,.45)}

/* Vendor directory — the exhibit hall as attendees browse it. A row is a stand,
   not a link out: it opens that stand's own page, which carries the booth
   number and how to reach them. */
.g-vendors{display:grid;gap:1px;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);border-radius:14px;overflow:hidden}
.g-vendor{display:flex;gap:13px;align-items:center;padding:13px 15px;
  background:var(--g-surface,#0f1a12);color:inherit;text-decoration:none}
.g-vendor:hover{background:rgba(125,217,86,.07)}
.g-vendor svg{flex:0 0 auto;opacity:.5;margin-left:auto}
.g-vendor__logo{flex:0 0 auto;width:46px;height:46px;border-radius:11px;background:#fff;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  border:1px solid rgba(0,0,0,.08)}
/* Several of these logos are white artwork and vanish on a white tile. */
.g-vendor__logo.is-dark{background:#12200f;border-color:rgba(255,255,255,.14)}
.g-vendor__logo img{max-width:80%;max-height:80%;object-fit:contain}
.g-vendor__logo b{font-size:19px;font-weight:700;color:#2e7d32}
.g-vendor__text{min-width:0;display:flex;flex-direction:column;gap:2px}
.g-vendor__text strong{font-size:15px;font-weight:650;line-height:1.3}
.g-vendor__text em{font-style:normal;font-size:12px;letter-spacing:.02em;
  color:rgba(255,255,255,.55)}
.g-vendor__blurb{font-size:13px;line-height:1.45;color:rgba(255,255,255,.68);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Where a stand has no logo but has photographed itself, the photo fills the
   tile rather than leaving an initial next to a page that is full of pictures. */
.g-vendor__logo img.is-photo{max-width:100%;max-height:100%;width:100%;height:100%;
  object-fit:cover}
.g-dir-search{margin:0 0 12px}
.g-dir-search .g-input{font-size:15px}
/* One column on a phone; two once there is room for two, because a directory
   read standing in a hall is scanned, not read. */
@media (min-width:760px){
  .g-vendors{grid-template-columns:1fr 1fr;gap:1px}
}
.g-super-sub{margin:2px 0 0;font-size:12.5px;color:rgba(255,255,255,.55)}
