/* The galaxy, in the language of the order form ("Begin your Blueprint"):
   one continuous night under every page, dark panels drawn with a single
   hairline, small spaced capitals over large quiet headings whose second
   line catches the light, her north star, the Moon in phases, and the
   orbit from the order form's opening page. Loaded after cosmos.css on
   every page; the colours are Stellar's own.

   Nothing on the night has an edge. The nebula is feathered into the dark
   on every side, the stars are one field behind the whole page
   (static/js/galaxy.js), and no section paints a background of its own,
   so one section simply becomes the next. */

:root {
  --gx-ease: cubic-bezier(.32, .72, 0, 1);
  --gx-night: #0c0d20;
  --gx-panel: rgba(21, 20, 40, .93);
  --gx-line: #34324c;
  --gx-hair: #2a2842;
  --gx-gold: #dcbc83;
  --gx-gold-hi: #f0d5a2;
  --gx-soft: #c4b6dc;
  --gx-text: #cfc7dd;
}

/* ---- one night under every page ------------------------------------------------ */
html { overflow-x: clip; }
body.stellar { background: var(--gx-night); position: relative; z-index: 0; overflow-x: clip; }
/* the stars: one field fixed behind everything, drawn by galaxy.js */
.gx-starfield { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
/* the nebula over the head of every page, feathered into the night below and
   wide enough that its sides are never seen */
body.stellar::before {
  content: ""; position: absolute; z-index: -2; top: 0; left: 0; right: 0; pointer-events: none;
  /* the picture's own height at its drawn width (1672 x 941), so the fade
     reaches nothing before the picture ends */
  height: max(923px, 56.3vw);
  background: url('/static/img/preview/stellar-nebula.webp') 72% 0 / max(1640px, 100%) auto no-repeat;
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 36%, rgba(0,0,0,.5) 64%, transparent 93%);
          mask-image: linear-gradient(to bottom, #000 0, #000 36%, rgba(0,0,0,.5) 64%, transparent 93%);
}
@media (prefers-reduced-motion: no-preference) {
  body.stellar::before { animation: gx-drift 80s ease-in-out infinite alternate; will-change: transform; }
}
@keyframes gx-drift { from { transform: scale(1.02) translate3d(-.8%, -.4%, 0); } to { transform: scale(1.1) translate3d(1.2%, 1%, 0); } }
@media (max-width: 700px) {
  body.stellar::before { height: 664px; background-position: 64% 0; background-size: 1180px auto; }
}
/* the footer and every section stand on the same night */
body.stellar .site-footer { background: transparent; }

/* ---- the logo: her north star and the name in spaced capitals, as the book sets it ---- */
body.stellar .wordmark.gx-logo { display: inline-flex; align-items: center; gap: 14px; min-height: 44px;
  font: 500 16px/1 var(--serif); letter-spacing: .34em; text-transform: uppercase; color: var(--ink); white-space: nowrap; }
body.stellar .wordmark.gx-logo span { margin-right: -.34em; }
body.stellar .gx-logo .gx-logo-star { flex: none; width: 15px; height: 21px; color: var(--gx-gold-hi);
  filter: drop-shadow(0 0 6px rgba(240, 213, 162, .55)); }
body.stellar .wordmark.gx-logo-foot { font-size: 18px; gap: 16px; }
body.stellar .gx-logo-foot .gx-logo-star { width: 18px; height: 25px; }
@media (prefers-reduced-motion: no-preference) { body.stellar .gx-logo-star { animation: gx-twinkle 6s ease-in-out infinite; } }
@keyframes gx-twinkle { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .7; transform: scale(.82); } }
@media (max-width: 700px) {
  body.stellar .wordmark.gx-logo { font-size: 13px; letter-spacing: .28em; gap: 10px; }
  body.stellar .wordmark.gx-logo span { margin-right: -.28em; }
  body.stellar .gx-logo .gx-logo-star { width: 12px; height: 17px; }
}

/* ---- the parts every page is built from ----------------------------------------------- */
.gx-panel { background: var(--gx-panel); border: 1px solid var(--gx-line); }
.gx-eyebrow { margin: 0 0 22px; font: 500 13px/1.5 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--ink); }
.gx-label { margin: 0 0 20px; font: 600 13px/1.5 var(--serif); letter-spacing: .2em; text-transform: uppercase; color: var(--gx-gold); }
.gx-sub { margin-top: 20px; max-width: 44ch; color: var(--muted); font-size: 19px; line-height: 1.6; text-wrap: pretty; }
.gx-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; }
/* the line that catches the light, as on the order form's opening page */
.gx-title em, .gx-close h2 em, .gx-page h1 em, .gx-doc-title em {
  font-style: normal; font-weight: 400;
  background-image: linear-gradient(135deg, #dcbc83, #f8ead0, #cdb8ea, #e8b98d, #dcbc83); background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent;
}
@media (prefers-reduced-motion: no-preference) {
  .gx-title em, .gx-close h2 em, .gx-page h1 em, .gx-doc-title em { animation: aurora 10s ease-in-out infinite alternate; }
}
/* a heading's second line, a shade softer */
.gx-soft { color: var(--gx-soft); }

/* section headings */
.gx-section { position: relative; padding-block: 128px; }
.gx-head { max-width: 780px; margin-bottom: 60px; }
.gx-head h2, .gx-try-copy h2, .gx-rhea-copy h2, .gx-faq-head h2 {
  font-size: clamp(42px, 4.4vw, 64px); font-weight: 400; line-height: 1.04; letter-spacing: -.025em; text-wrap: balance; }

/* buttons answer a press, and every one carries the same arrow */
.stellar .button { transition: background-color .35s var(--gx-ease), border-color .35s var(--gx-ease), transform .35s var(--gx-ease), box-shadow .5s var(--gx-ease); }
.stellar .button:active, .stellar .header-cta:active { transform: translateY(1px) scale(.99); }
.gx-cta { justify-content: space-between; gap: 44px; box-shadow: 0 14px 44px -18px rgba(240, 213, 162, .65); }
.gx-cta:hover { box-shadow: 0 18px 54px -14px rgba(240, 213, 162, .8); }
.gx-buy { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 30px; }
.gx-price { display: flex; align-items: baseline; gap: 8px; margin: 0; }
.gx-price strong { font-size: 34px; font-weight: 500; line-height: 1; color: var(--ink); font-variant-numeric: lining-nums; letter-spacing: -.01em; }
.gx-price span { font-size: 14px; letter-spacing: .18em; color: var(--muted); }
/* the order form's note: a star, then one quiet line, under a hairline */
.gx-note { display: flex; gap: 16px; align-items: center; border-top: 1px solid var(--gx-line); padding-top: 22px; margin-top: 44px; max-width: 420px; }
.gx-note > span { flex: none; font-size: 30px; line-height: 1; color: var(--gx-gold); }
.gx-note p { font-size: 16px; line-height: 1.6; color: var(--muted); margin: 0; }

/* the Moon in phases, as the order form's progress draws it */
.gx-moon { width: 26px; height: 26px; flex: none; overflow: visible; }
.gx-moon-dark { fill: #1b1830; }
.gx-moon-lit { fill: var(--gx-gold); }
.gx-moon-limb { fill: none; stroke: var(--gx-gold); stroke-width: 1; }

/* the orbit from the order form, turning */
.gx-orbit-art { display: block; overflow: visible; stroke: #8c79aa; stroke-width: .8; }
.gx-orbit-art .o-star, .gx-orbit-art .o-planet { fill: var(--gx-gold); stroke: none; }
.gx-orbit-art .o-planet { filter: drop-shadow(0 0 4px rgba(240, 213, 162, .9)); }
.gx-orbit-art .o-turn-a, .gx-orbit-art .o-turn-b, .gx-orbit-art .o-run-a, .gx-orbit-art .o-run-b, .gx-orbit-art .o-star { transform-origin: 140px 140px; }
@media (prefers-reduced-motion: no-preference) {
  .gx-orbit-art .o-turn-a { animation: gx-turn 70s linear infinite; }
  .gx-orbit-art .o-turn-b { animation: gx-turn 95s linear infinite reverse; }
  .gx-orbit-art .o-run-a { animation: gx-turn 26s linear infinite; }
  .gx-orbit-art .o-run-b { animation: gx-turn 41s linear infinite reverse; }
  .gx-orbit-art .o-star { animation: gx-breathe 5s ease-in-out infinite; }
}
@keyframes gx-turn { to { transform: rotate(360deg); } }
@keyframes gx-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(.86) rotate(12deg); } }

/* rising into view (galaxy.js holds back only what starts below the first screen) */
@media (prefers-reduced-motion: no-preference) {
  /* the list keeps the cards' own hover transitions, which it replaces */
  [data-rise].is-held { opacity: 0; translate: 0 30px;
    transition: opacity 1s var(--gx-ease) var(--rise-delay, 0s), translate 1.2s var(--gx-ease) var(--rise-delay, 0s),
                transform .8s var(--gx-ease), border-color .5s var(--gx-ease), box-shadow .8s var(--gx-ease); }
  [data-rise].is-held.is-risen { opacity: 1; translate: 0 0; }
}
/* cosmos.css's own arrive and leave timelines step aside: one way of arriving, and nothing fades while it is read */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    body.stellar .skybar > *, body.stellar .tagline-section, body.stellar .stellar-heading, body.stellar .stellar-inside-grid > *,
    body.stellar .stellar-page-index, body.stellar .included-section .section-heading, body.stellar .extent, body.stellar .chapter,
    body.stellar .stellar-rhea > *, body.stellar .faq-heading, body.stellar .faq-list details, body.stellar .closing-inner > *,
    body.stellar .site-footer > * { animation: none; }
  }
}
/* while the page scrolls, nothing under a resting pointer reacts (site.js) */
html.is-scrolling .stellar-page-list, html.is-scrolling .stellar-sample-stage, html.is-scrolling .gx-book,
html.is-scrolling .gx-tile, html.is-scrolling .gx-vol, html.is-scrolling .ch-plates, html.is-scrolling .chapter summary,
html.is-scrolling .faq-list summary { pointer-events: none; }

/* ---- the header ------------------------------------------------------------------- */
body.stellar .site-header { border-bottom-color: var(--gx-line); }
body.stellar .site-nav { gap: 40px; }
body.stellar .site-nav a { font-weight: 500; }
/* four links fit beside the logo from a small laptop up; below that they fold behind the button */
@media (min-width: 701px) and (max-width: 1060px) {
  body.stellar .site-header { position: relative; }
  body.stellar .menu-toggle { display: flex; flex-direction: column; gap: 5px; align-items: center; justify-content: center;
    background: transparent; width: 44px; height: 44px; margin-left: 18px; }
  body.stellar .menu-toggle span { display: block; width: 21px; height: 1px; background: var(--ink); }
  body.stellar .header-cta { margin-left: auto; }
  body.stellar .site-nav { display: none; position: absolute; top: calc(100% - 1px); left: -24px; right: -24px; z-index: 20;
    flex-direction: column; gap: 4px; padding: 18px 28px 22px; background: #141227; border-bottom: 1px solid var(--gx-line);
    box-shadow: 0 24px 40px -18px #000c; font-size: 20px; }
  body.stellar .site-nav.open { display: flex; }
}

/* ---- the hero ------------------------------------------------------------------------ */
.gx-hero { position: relative; overflow-x: clip; }
.gx-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; padding-block: 36px 44px; }
.gx-hero-copy { position: relative; z-index: 2; }
.gx-title { margin: 0 0 28px; font-size: clamp(60px, 6.4vw, 100px); font-weight: 400; line-height: 1; letter-spacing: -.035em; text-wrap: balance; }
.gx-lede { max-width: 32ch; font-size: 22px; line-height: 1.5; color: var(--gx-text); text-wrap: pretty; }
.gx-hero .gx-buy { margin-top: 40px; }

/* the book in its orbit. Each ring is a circle squashed into the ellipse of
   a ring seen from just above, tilted a little; its planet runs round the
   circle and is unsquashed again, so it stays round and swells as it comes
   to the near side. The far half of every ring is drawn under the book and
   the near half over it, which is what puts a planet behind the book and
   then in front of it, in every browser. */
.gx-hero-art { position: relative; display: grid; place-items: center; min-height: 580px; }
.gx-hero-art::before { content: ""; position: absolute; inset: -12% -18%; z-index: -1; pointer-events: none;
  background: radial-gradient(closest-side, rgba(122, 104, 214, .24), rgba(122, 104, 214, 0)); }
.gx-orbits { position: absolute; inset: 0; pointer-events: none; }
.gx-far { z-index: 0; }
.gx-near { z-index: 2; }
.gx-ring { position: absolute; left: 50%; top: 61%; width: var(--w); height: calc(var(--w) * var(--k));
  margin: calc(var(--w) * var(--k) / -2) 0 0 calc(var(--w) / -2); transform: rotate(var(--tilt)); }
.gx-far .gx-ring { clip-path: inset(-60px -60px 50% -60px); }
.gx-near .gx-ring { clip-path: inset(50% -60px -60px -60px); }
.gx-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke-width: 1; }
.gx-far .gx-ring svg { stroke: rgba(205, 184, 234, .2); }
.gx-near .gx-ring svg { stroke: rgba(225, 208, 250, .42); }
.gx-ring-3 svg { stroke-dasharray: 2 7; }
.gx-squash { position: absolute; left: 0; top: 50%; width: var(--w); height: var(--w); margin-top: calc(var(--w) / -2); transform: scaleY(var(--k)); }
.gx-spin { position: absolute; inset: 0; }
.gx-spin i { position: absolute; left: 50%; top: 0; width: var(--p); height: var(--p); margin: calc(var(--p) / -2) 0 0 calc(var(--p) / -2);
  border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff9ea, var(--gx-gold-hi) 45%, #b8935a);
  box-shadow: 0 0 16px 4px rgba(240, 213, 162, .5); transform: scaleY(calc(1 / var(--k))) scale(.75); }
.gx-ring-1 { --w: 640px; --k: .24; --tilt: -8deg; --dur: 46s; --p: 11px; }
.gx-ring-2 { --w: 500px; --k: .3; --tilt: 9deg; --dur: 31s; --p: 7px; }
.gx-ring-3 { --w: 800px; --k: .2; --tilt: -3deg; --dur: 88s; --p: 5px; }
.gx-ring-2 .gx-spin i { background: radial-gradient(circle at 35% 35%, #fff, #d9cbf5 50%, #8f7cc4); box-shadow: 0 0 14px 3px rgba(205, 184, 234, .55); }
.gx-ring-3 .gx-spin i { background: #fff; box-shadow: 0 0 10px 2px rgba(255, 255, 255, .5); }
@media (prefers-reduced-motion: no-preference) {
  .gx-spin { animation: gx-spin var(--dur) linear infinite var(--dir, normal); }
  .gx-spin i { animation: gx-face var(--dur) linear infinite var(--dir, normal); }
  .gx-ring-2 { --dir: reverse; }
  .gx-orbits { animation: gx-fade 2.4s .3s var(--gx-ease) both; }
}
@keyframes gx-spin { to { transform: rotate(360deg); } }
@keyframes gx-face {
  0% { transform: rotate(0deg) scaleY(calc(1 / var(--k))) scale(.72); }
  50% { transform: rotate(-180deg) scaleY(calc(1 / var(--k))) scale(1.22); }
  100% { transform: rotate(-360deg) scaleY(calc(1 / var(--k))) scale(.72); }
}
@keyframes gx-fade { from { opacity: 0; } }

/* the book: its cover turned a little on its spine, two of its pages fanned
   behind it, turning a little toward the pointer, floating */
.gx-book { position: relative; z-index: 1; width: min(400px, 72vw); aspect-ratio: 842 / 1052; margin: 0; perspective: 1700px;
  --rx: 0deg; --ry: 0deg; translate: -13% 0; }
.gx-book-pages img, .gx-book-cover { position: absolute; inset: 0; }
.gx-book-pages img { width: 100%; height: 100%; object-fit: cover; border-radius: 2px; background: #fdfcf8;
  box-shadow: 0 18px 40px -12px #000a, 0 0 0 1px #ffffff14; transform-origin: 30% 100%;
  transition: transform 1.4s var(--gx-ease), opacity 1s var(--gx-ease); }
.gx-book-pages .gx-page-1 { transform: translate(15%, 4%) rotate(7deg); }
.gx-book-pages .gx-page-2 { transform: translate(29%, 9%) rotate(13deg); filter: brightness(.8); }
.gx-book-cover { display: block; border-radius: 2px 6px 6px 2px; overflow: hidden; transform-origin: 0 50%;
  transform: rotateY(calc(-12deg + var(--ry))) rotateX(calc(2deg + var(--rx)));
  box-shadow: 1px 1px 0 #d9d1ee, 3px 2px 0 #f4effb, 5px 3px 0 #a79fc2, 7px 4px 0 #ece6f6, 9px 6px 0 #7d7598,
              0 50px 90px -24px #000d, 0 0 150px -30px #7a6fd6;
  transition: transform 1.1s var(--gx-ease); }
.gx-book-cover img { width: 100%; height: 100%; object-fit: cover; }
.gx-book-cover::before { content: ""; position: absolute; z-index: 1; inset: 0 auto 0 0; width: 16px;
  background: linear-gradient(90deg, #ffffff26, #ffffff08 55%, #0000002e); }
/* light catching the board where the pointer is */
.gx-sheen { position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: 2px 6px 6px 2px; transform-origin: 0 50%;
  transform: rotateY(calc(-12deg + var(--ry))) rotateX(calc(2deg + var(--rx)));
  background: radial-gradient(circle at var(--mx, 28%) var(--my, 18%), rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 46%);
  transition: transform 1.1s var(--gx-ease); }
.gx-book:hover .gx-page-1 { transform: translate(19%, 3%) rotate(9deg); }
.gx-book:hover .gx-page-2 { transform: translate(35%, 7%) rotate(16deg); }
@media (prefers-reduced-motion: no-preference) {
  .gx-book { animation: gx-float 9s ease-in-out 2.2s infinite alternate; }
  .gx-book-cover, .gx-sheen { animation: gx-arrive 1.8s var(--gx-ease) both; }
  .gx-book-pages img { animation: gx-fan 2s .45s var(--gx-ease) both; }
}
@keyframes gx-arrive { from { opacity: 0; transform: rotateY(-34deg) rotateX(6deg) translateY(30px); } }
@keyframes gx-fan { from { opacity: 0; transform: translate(0, 0) rotate(0deg); } }
@keyframes gx-float { from { translate: -13% 0; } to { translate: -13% -14px; } }

/* what every Blueprint is, in a few words each */
.gx-trust { list-style: none; margin: 0 auto; padding: 26px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--gx-line); }
.gx-trust li { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 4px 24px; }
.gx-trust li:first-child { padding-left: 0; }
.gx-trust li + li { border-left: 1px solid var(--gx-line); }
.gx-trust svg { flex: none; width: 12px; height: 17px; color: var(--gx-gold); }
.gx-trust p { margin: 0; font-size: 17px; line-height: 1.35; color: var(--muted); }
.gx-trust strong { display: block; font-weight: 600; font-size: 19px; color: var(--ink); letter-spacing: .01em; }

/* ---- look inside ---------------------------------------------------------------------- */
body.stellar .gx-inside .stellar-inside-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; align-items: center; }
.gx-inside .stellar-fan-back { box-shadow: 0 22px 46px -10px #000c; }
.gx-inside .stellar-sample-page { border-color: #ffffff1f; box-shadow: 0 30px 60px -18px #000d, 0 0 90px -30px #8f80e0; }
body.stellar .stellar-page-list.gx-panel { padding: 10px 34px 28px; }
body.stellar .gx-panel .stellar-page-list button, body.stellar .stellar-page-list.gx-panel button { border-bottom-color: var(--gx-hair); padding: 19px 0; font-size: 25px; }
body.stellar .stellar-page-list.gx-panel button:first-of-type { border-top: 0; }
body.stellar .stellar-page-list.gx-panel .num { color: var(--gx-gold); font-size: 14px; letter-spacing: .12em; }
body.stellar .stellar-page-list.gx-panel button:hover, body.stellar .stellar-page-list.gx-panel button.is-shown { border-bottom-color: var(--gx-gold); }
body.stellar .stellar-page-list .gx-panel-link { display: inline-flex; grid-template-columns: none; width: auto; margin-top: 24px; padding: 4px 0;
  border: 0; border-bottom: 1px solid currentColor; font: 500 17px/1.8 var(--serif); color: var(--ink); gap: 16px; }
body.stellar .stellar-page-list .gx-panel-link:hover { color: var(--gx-gold); border-bottom-color: var(--gx-gold); }

/* ---- made from your chart -------------------------------------------------------------- */
.gx-made-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.gx-tile { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 36px 38px 38px; min-width: 0; overflow: hidden;
  transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .8s var(--gx-ease), border-color .5s var(--gx-ease), box-shadow .8s var(--gx-ease); }
.gx-tile::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .07), rgba(255, 255, 255, 0) 55%);
  transition: opacity .5s var(--gx-ease); }
.gx-tile:hover { border-color: #4d4673; box-shadow: 0 34px 70px -34px #000d, 0 0 90px -50px #8f80e0; }
.gx-tile:hover::after { opacity: 1; }
.gx-tile-art { height: 190px; margin-bottom: 18px; display: flex; align-items: center; justify-content: center; }
.gx-tile h3 { font-size: 30px; line-height: 1.15; letter-spacing: -.01em; }
.gx-tile p { color: var(--muted); font-size: 18px; line-height: 1.55; }
.gx-three { display: flex; gap: 26px; align-items: flex-end; }
.gx-three figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.gx-three img { width: 100px; height: 100px; filter: drop-shadow(0 12px 22px #0008); }
.gx-three figcaption, .gx-cycle figcaption { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--gx-gold); text-align: center; }
.gx-three figcaption small, .gx-cycle figcaption small { display: block; margin-top: 3px; font-size: 14px; letter-spacing: 0; text-transform: none; color: #ddd5ea; }
.gx-house { width: 100%; max-width: 460px; border-radius: 2px; background: #f1ebf6; color: #1d2148; box-shadow: 0 20px 44px -18px #000c; overflow: hidden; }
.gx-house-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 16px 20px 10px; }
.gx-house-head strong { font-size: 24px; font-weight: 500; color: #121534; }
.gx-house-head span { font-style: italic; font-size: 15px; color: #2a30c2; }
.gx-house dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 1px solid #d9cfea; }
.gx-house dl > div { padding: 11px 13px 14px; border-left: 1px solid #d9cfea; min-width: 0; }
.gx-house dl > div:first-child { border-left: 0; }
.gx-house dt { font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #2a30c2; }
.gx-house dd { margin: 4px 0 0; font-size: 15px; line-height: 1.35; }
.gx-cycles { display: flex; gap: 24px; align-items: flex-end; }
.gx-cycle { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.gx-cycle img { height: 92px; width: auto; filter: drop-shadow(0 10px 18px #0009); }
@media (prefers-reduced-motion: no-preference) {
  .gx-cycle img { animation: gx-bob 6s ease-in-out infinite alternate; }
  .gx-cycle:nth-child(2) img { animation-delay: -2s; } .gx-cycle:nth-child(3) img { animation-delay: -4s; }
}
@keyframes gx-bob { from { translate: 0 0; } to { translate: 0 -8px; } }
.gx-palette { display: flex; align-items: center; gap: 30px; }
.gx-swatches { display: flex; }
.gx-swatches img { width: 70px; height: 70px; margin-left: -16px; border-radius: 50%; }
.gx-swatches img:first-child { margin-left: 0; }
.gx-stones { display: grid; grid-template-columns: repeat(2, auto); gap: 6px 14px; align-items: center; }
.gx-stones img { height: 48px; width: auto; filter: drop-shadow(0 8px 12px #000a); }

/* ---- her cover line ---------------------------------------------------------------- */
body.stellar .gx-tagline { position: relative; padding-block: 64px; }
body.stellar .gx-tagline .tagline-reveal { max-width: 940px; font-size: clamp(36px, 4.2vw, 60px); font-weight: 400; line-height: 1.14; letter-spacing: -.02em; }

/* ---- what is inside ------------------------------------------------------------------ */
.gx-book-map { padding: 34px 40px 12px; }
body.stellar .gx-book-map .chapters { margin-top: 30px; border-top-color: var(--gx-hair); }
body.stellar .gx-book-map .chapter { border-bottom-color: var(--gx-hair); }
body.stellar .gx-book-map .chapter:last-child { border-bottom: 0; }
body.stellar .gx-book-map .ch-num { color: var(--gx-gold); }

/* ---- try it ----------------------------------------------------------------------------- */
.gx-try-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; align-items: center; }
.gx-try-form { margin-top: 36px; max-width: 520px; }
.gx-try-form label { display: block; margin-bottom: 10px; font-size: 16px; color: var(--ink); }
.gx-try-row { display: flex; gap: 12px; }
.gx-try-row input, .gx-waitlist-row input { flex: 1 1 auto; min-width: 0; height: 56px; padding: 0 16px; border-radius: 0;
  border: 1px solid #4b4570; background: #100f24; color: var(--ink); font: 18px var(--serif); color-scheme: dark;
  transition: border-color .4s var(--gx-ease), box-shadow .4s var(--gx-ease); }
.gx-try-row input:focus, .gx-waitlist-row input:focus { outline: none; border-color: var(--gx-gold); box-shadow: 0 0 0 3px rgba(220, 188, 131, .2); }
.gx-try-row input[aria-invalid="true"] { border-color: #e0868a; }
.gx-waitlist-row input::placeholder { color: #8a83a6; }
.gx-try-row .button, .gx-waitlist-row .button { flex: none; }
.gx-try-error { margin-top: 12px; font-size: 16px; color: #f0a8ab; }
.gx-try-result { position: relative; min-height: 400px; display: flex; align-items: center; }
.gx-try-empty, .gx-try-card { width: 100%; padding: 38px 40px; }
.gx-try-card { background: var(--gx-panel); border: 1px solid var(--gx-line); }
.gx-try-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; min-height: 400px; text-align: center; }
.gx-try-orbit { width: 210px; height: 210px; }
.gx-try-empty p { color: var(--muted); font-size: 17px; }
.gx-try-result.is-loading > * { opacity: .55; transition: opacity .3s var(--gx-ease); }
.gx-try-result.is-loading::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, .06) 50%, rgba(255, 255, 255, 0) 70%) 0 0 / 250% 100%;
  animation: gx-sweep 1.4s var(--gx-ease) infinite; }
@keyframes gx-sweep { from { background-position: 130% 0; } to { background-position: -30% 0; } }
@media (prefers-reduced-motion: no-preference) { .gx-try-card { animation: gx-rise .9s var(--gx-ease) both; } }
@keyframes gx-rise { from { opacity: 0; translate: 0 14px; } }
.gx-try-sun { display: flex; align-items: center; gap: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--gx-hair); }
.gx-try-sun img { flex: none; width: 84px; height: 84px; }
.gx-try-sun p { font-size: 22px; line-height: 1.4; }
.gx-try-sun strong { font-weight: 600; color: var(--gx-gold-hi); }
.gx-try-dates { margin: 6px 0 26px; }
.gx-try-dates > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 20px; align-items: baseline; padding: 15px 0; border-bottom: 1px solid var(--gx-hair); }
.gx-try-dates dt { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gx-gold); }
.gx-try-dates dd { margin: 0; font-size: 24px; text-align: right; font-variant-numeric: lining-nums; }
.gx-try-dates dd span { display: block; font-size: 15px; color: var(--muted); }
.gx-try-card .button { width: 100%; justify-content: center; }
.gx-try-card .gx-note { display: block; margin-top: 14px; padding-top: 0; border-top: 0; max-width: none; font-size: 15px; line-height: 1.6; color: var(--muted); }

/* ---- how it works: three phases of the Moon, as on the order form ------------------------ */
.gx-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gx-steps li { position: relative; padding: 40px 40px 44px; min-width: 0; }
.gx-steps li + li { border-left: 1px solid var(--gx-hair); }
.gx-step-mark { display: flex; align-items: center; gap: 14px; margin-bottom: 30px; }
/* the dotted orbit from each Moon toward the next */
.gx-steps li:not(:last-child) .gx-step-mark::after { content: ""; flex: 1; border-top: 1px dashed #4b4566; margin-right: -40px; }
.gx-step-num { margin: 0 0 10px; font-size: 13px; letter-spacing: .2em; color: var(--gx-gold); }
.gx-steps h3 { font-size: 29px; line-height: 1.15; margin-bottom: 10px; text-wrap: balance; }
.gx-steps li > p:last-child { color: var(--muted); font-size: 18px; line-height: 1.55; text-wrap: pretty; }

/* ---- Rhea ------------------------------------------------------------------------------ */
.gx-rhea-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; align-items: center; }
.gx-rhea-photo { position: relative; justify-self: center; width: min(448px, 100%); }
.gx-rhea-photo::before { content: ""; position: absolute; inset: -22%; z-index: -1; pointer-events: none;
  background: radial-gradient(closest-side, rgba(70, 56, 140, .55), rgba(70, 56, 140, 0)); }
.gx-rhea-photo img { width: 100%; height: auto; border: 1px solid var(--gx-line); box-shadow: 0 40px 80px -30px #000d; }
.gx-rhea-copy .text-link { margin-top: 30px; }

/* ---- the series ---------------------------------------------------------------------- */
.gx-shelf { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; align-items: end; max-width: 960px; }
.gx-vol { display: flex; flex-direction: column; gap: 6px; min-width: 0; color: var(--ink); }
.gx-vol-cover { position: relative; display: block; aspect-ratio: 842 / 1052; border-radius: 2px 6px 6px 2px; overflow: hidden; margin-bottom: 18px;
  transform: perspective(1000px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .8s var(--gx-ease); }
.gx-vol-open .gx-vol-cover { box-shadow: 1px 1px 0 #d9d1ee, 3px 2px 0 #f4effb, 5px 3px 0 #8e86a6, 0 34px 70px -22px #000d, 0 0 110px -36px #8a7be0; }
.gx-vol-cover img { width: 100%; height: 100%; object-fit: cover; }
.gx-vol-soon .gx-vol-cover { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 14px;
  background: var(--gx-panel); border: 1px solid var(--gx-line); color: #8f86b3; }
.gx-vol-soon .gx-vol-cover .gx-vol-orbit { width: 56%; height: auto; opacity: .75; }
.gx-vol-soon .gx-vol-cover span { font-size: 13px; letter-spacing: .3em; text-transform: uppercase; }
.gx-vol-num { font-size: 13px; letter-spacing: .22em; text-transform: uppercase; color: var(--gx-gold); }
.gx-vol strong { font-size: 25px; font-weight: 500; line-height: 1.15; }
.gx-vol small { font-size: 16px; color: var(--muted); }
.gx-vol-soon strong { color: #c9c1dc; }
.gx-waitlist { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 32px 48px; align-items: center;
  max-width: 960px; margin-top: 64px; padding: 34px 40px; }
.gx-waitlist .gx-label { margin-bottom: 10px; }
.gx-waitlist h3 { font-size: 28px; line-height: 1.2; }
.gx-waitlist-row { display: flex; gap: 12px; }

/* ---- questions ---------------------------------------------------------------------- */
.gx-faq-inner { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 80px; align-items: start; }
.gx-faq-head .text-link { margin-top: 30px; }
body.stellar .faq-list.gx-panel { padding: 6px 36px; }
body.stellar .faq-list.gx-panel details { border-bottom: 1px solid var(--gx-hair); }
body.stellar .faq-list.gx-panel details:first-child { border-top: 0; }
body.stellar .faq-list.gx-panel details:last-child { border-bottom: 0; }
body.stellar .faq-list.gx-panel summary { font-size: 24px; padding-block: 24px; }
body.stellar .faq-list.gx-panel summary > span { color: var(--gx-gold); }
body.stellar .faq-list.gx-panel details p { font-size: 18px; line-height: 1.6; padding-bottom: 26px; }

/* ---- the last word -------------------------------------------------------------------- */
.gx-close { position: relative; padding-block: 120px 140px; text-align: center; overflow-x: clip; }
/* the nebula once more, feathered all round */
.gx-close-nebula { position: absolute; inset: 0 -10%; z-index: -2; pointer-events: none;
  background: url('/static/img/preview/stellar-nebula.webp') 75% 60% / cover no-repeat; opacity: .8;
  -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 15%, transparent 72%);
          mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 15%, transparent 72%); }
.gx-close-inner { position: relative; display: flex; flex-direction: column; align-items: center; }
.gx-close-orbit { width: 200px; height: 200px; margin-bottom: 34px; }
.gx-close h2 { font-size: clamp(54px, 6.4vw, 96px); font-weight: 400; line-height: 1; letter-spacing: -.035em; }
.gx-close .gx-buy { justify-content: center; margin-top: 44px; }

/* ---- the footer ------------------------------------------------------------------------ */
body.stellar .site-footer { border-top: 1px solid var(--gx-line); padding-top: 72px; padding-bottom: 0; }
body.stellar .footer-grid { padding-bottom: 56px; }
body.stellar .footer-tagline { color: var(--gx-text); }
body.stellar .footer-heading { color: var(--gx-gold); letter-spacing: .2em; }
body.stellar .footer-col a[aria-current="page"] { color: var(--gx-gold); }
.gx-footnote { border-top: 1px solid var(--gx-hair); padding: 24px 0 30px; display: flex; flex-wrap: wrap; justify-content: space-between;
  align-items: center; gap: 10px 30px; font-size: 15px; color: var(--muted); }
.gx-footnote nav { display: flex; gap: 28px; }
.gx-footnote a { display: inline-flex; align-items: center; min-height: 44px; }
.gx-footnote a:hover, .gx-footnote a[aria-current="page"] { color: var(--gx-gold); }

/* =====================================================================================
   The other pages, built like the order form
   ===================================================================================== */

/* a page that stands in the middle: the orbit, the eyebrow, the heading, one line, the way on */
.gx-page { padding-block: 72px 120px; }
.gx-page h1 { font-size: clamp(54px, 6vw, 88px); font-weight: 400; line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
.gx-center { display: flex; flex-direction: column; align-items: center; text-align: center; }
.gx-center .gx-orbit-art { width: 190px; height: 190px; margin-bottom: 36px; }
.gx-center .gx-lede-c { max-width: 46ch; margin-top: 24px; font-size: 20px; line-height: 1.6; color: var(--muted); text-wrap: pretty; }
.gx-center .gx-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 18px 30px; margin-top: 40px; }
.gx-center .gx-fine { margin-top: 30px; font-size: 15px; color: var(--muted); }
.gx-center .gx-fine a { color: var(--ink); border-bottom: 1px solid currentColor; }

/* the thank you page: the three things that happen next, as the Moon waxes */
.gx-next { list-style: none; margin: 56px auto 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1000px; text-align: left; }
.gx-next li { padding: 34px 34px 36px; min-width: 0; }
.gx-next li + li { border-left: 1px solid var(--gx-hair); }
.gx-next .gx-step-mark { margin-bottom: 22px; }
.gx-next li:not(:last-child) .gx-step-mark::after { content: ""; flex: 1; border-top: 1px dashed #4b4566; margin-right: -34px; }
.gx-next h2 { font-size: 26px; line-height: 1.2; margin-bottom: 10px; }
.gx-next p { color: var(--muted); font-size: 17px; line-height: 1.6; }

/* the legal pages: a contents list that stays in view beside numbered sections */
.gx-doc-head { padding: 64px 0 48px; border-bottom: 1px solid var(--gx-line); }
.gx-doc-head h1 { font-size: clamp(54px, 6vw, 84px); }
.gx-doc-head p { margin-top: 22px; max-width: 56ch; font-size: 20px; line-height: 1.6; color: var(--muted); }
.gx-doc-date { display: block; margin-top: 26px; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--gx-gold); }
.gx-doc { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 80px; padding: 56px 0 120px; align-items: start; }
.gx-toc { position: sticky; top: 32px; padding: 26px 28px 28px; }
.gx-toc p { margin: 0 0 12px; font-size: 13px; letter-spacing: .2em; text-transform: uppercase; color: var(--gx-gold); }
.gx-toc ol { list-style: none; margin: 0; padding: 0; counter-reset: toc; }
.gx-toc li { counter-increment: toc; }
.gx-toc a { display: grid; grid-template-columns: 28px 1fr; gap: 6px; padding: 7px 0; font-size: 16px; line-height: 1.35; color: var(--gx-text); }
.gx-toc a::before { content: counter(toc); color: var(--muted); font-variant-numeric: lining-nums; }
.gx-toc a:hover { color: var(--gx-gold); }
.gx-doc-body { max-width: 720px; }
.gx-doc-body > section { padding: 0 0 36px; margin: 0 0 36px; border-bottom: 1px solid var(--gx-hair); scroll-margin-top: 28px; }
.gx-doc-body > section:last-child { border-bottom: 0; margin-bottom: 0; }
.gx-doc-body h2 { display: flex; gap: 18px; align-items: baseline; font-size: 32px; line-height: 1.2; margin: 0 0 18px; }
.gx-doc-body h2 > span { flex: none; min-width: 30px; font-size: 16px; letter-spacing: .1em; color: var(--gx-gold); font-variant-numeric: lining-nums; }
.gx-doc-body p, .gx-doc-body li { font-size: 18px; line-height: 1.7; color: var(--gx-text); }
.gx-doc-body p + p, .gx-doc-body ul + p, .gx-doc-body p + ul { margin-top: 14px; }
.gx-doc-body ul { margin: 0; padding-left: 22px; }
.gx-doc-body li { margin-bottom: 8px; }
.gx-doc-body li::marker { color: var(--gx-gold); }
.gx-doc-body strong { color: var(--ink); font-weight: 600; }
.gx-doc-body a { color: var(--ink); border-bottom: 1px solid var(--gx-gold); }
.gx-doc-body a:hover { color: var(--gx-gold); }
.gx-doc-body .gx-clause { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px; }
.gx-doc-body .gx-clause > span { color: var(--muted); font-size: 16px; font-variant-numeric: lining-nums; padding-top: 2px; }
.gx-doc-body .gx-clause + .gx-clause { margin-top: 12px; }

/* the order form's own pages: a few pieces they share */
body.stellar .flow-form-panel .gx-panel-title { font-size: clamp(33px, 3.1vw, 44px); font-weight: 400; line-height: 1.1; letter-spacing: -.025em; margin: 0 0 12px; }
body.stellar .flow-form-panel > .flow-step-label { margin-top: 0; }
body.stellar .flow-intro .gx-mini-cover { margin: 34px auto 36px; }
.gx-center .gx-detail { margin-top: 10px; font-size: 17px; }
.gx-doc-head h1 { font-weight: 400; line-height: 1.02; letter-spacing: -.035em; }
body.stellar .flow-intro .gx-orbit-art { width: 240px; height: 240px; margin: 28px auto 32px; }
/* on a phone the order form drops its orbit so the panel comes first; these pages do the same */
@media (max-width: 760px) { body.stellar .flow-intro .gx-orbit-art { display: none; } }
body.stellar .flow-email { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 0 18px;
  border-bottom: 1px solid var(--gx-gold); font-size: 26px; color: var(--ink); overflow-wrap: anywhere; }
body.stellar .flow-email:hover { color: var(--gx-gold); }
body.stellar .gx-topics { margin: 34px 0 0; padding: 0; list-style: none; }
body.stellar .gx-topics li { padding: 22px 0; border-top: 1px solid var(--gx-hair); }
body.stellar .gx-topics h3 { font-size: 24px; margin-bottom: 6px; }
body.stellar .gx-topics p { font-size: 17px; line-height: 1.6; color: var(--muted); }
body.stellar .gx-topics a { color: var(--ink); border-bottom: 1px solid currentColor; }
body.stellar .gx-panel-foot { margin-top: 18px; font-size: 15px; line-height: 1.6; color: var(--muted); }
body.stellar .gx-panel-foot a { color: var(--ink); border-bottom: 1px solid currentColor; }

/* ---- the confirm page: their cover, with their name where the book sets it --------------- */
.gx-mini-cover { position: relative; width: min(300px, 100%); margin: 4px auto 34px; container-type: inline-size;
  border-radius: 2px 5px 5px 2px; overflow: hidden;
  box-shadow: 1px 1px 0 #d9d1ee, 3px 2px 0 #f4effb, 5px 3px 0 #8e86a6, 0 30px 60px -20px #000d, 0 0 90px -30px #8a7be0; }
.gx-mini-cover img { display: block; width: 100%; height: auto; }
/* the book: 30pt on an 842pt page, 25pt past 18 letters, 21pt past 26 (a little larger, to read at this size) */
.gx-mini-name { position: absolute; left: 7.4%; bottom: 19%; width: 58%; color: #fff; text-align: left;
  font: 500 12px/1.13 var(--serif); font-size: 4.1cqw; text-wrap: balance; }
.gx-mini-name.mid { font-size: 3.5cqw; }
.gx-mini-name.long { font-size: 2.95cqw; }

/* =====================================================================================
   Narrower screens
   ===================================================================================== */
@media (max-width: 1100px) {
  .gx-hero-grid { gap: 24px; }
  .gx-hero-art { min-height: 520px; }
  .gx-book { width: min(340px, 34vw); }
  .gx-ring-1 { --w: 540px; } .gx-ring-2 { --w: 420px; } .gx-ring-3 { --w: 660px; }
  .gx-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 18px; }
  .gx-trust li:nth-child(3) { border-left: 0; padding-left: 0; }
  .gx-tile { padding: 30px 28px 32px; }
  .gx-palette { gap: 20px; }
  .gx-swatches img { width: 54px; height: 54px; margin-left: -12px; }
  .gx-stones img { height: 40px; }
  .gx-steps li { padding: 34px 28px 38px; }
  .gx-steps li:not(:last-child) .gx-step-mark::after { margin-right: -28px; }
  .gx-doc { grid-template-columns: 240px minmax(0, 1fr); gap: 48px; }
}
@media (max-width: 900px) {
  .gx-section { padding-block: 92px; }
  .gx-hero-grid { grid-template-columns: 1fr; min-height: 0; padding-top: 36px; gap: 40px; }
  .gx-hero-art { min-height: 520px; }
  .gx-book { width: min(330px, 60vw); }
  body.stellar .gx-inside .stellar-inside-grid, .gx-try-inner, .gx-rhea-inner, .gx-faq-inner { grid-template-columns: 1fr; gap: 44px; }
  /* one column: the fanned pages keep a page's width and their own room */
  .gx-inside .stellar-page-fan { max-width: 400px; margin-inline: auto; }
  .gx-inside .stellar-sample-stage { padding-bottom: 36px; }
  .gx-palette { flex-direction: row; }
  .gx-made-grid { grid-template-columns: 1fr; }
  .gx-steps, .gx-next { grid-template-columns: 1fr; }
  .gx-steps li + li, .gx-next li + li { border-left: 0; border-top: 1px solid var(--gx-hair); }
  .gx-steps li:not(:last-child) .gx-step-mark::after, .gx-next li:not(:last-child) .gx-step-mark::after { content: none; }
  .gx-try-result, .gx-try-empty { min-height: 0; }
  .gx-waitlist { grid-template-columns: 1fr; }
  .gx-doc { grid-template-columns: 1fr; gap: 36px; }
  .gx-toc { position: static; }
  .gx-toc ol { columns: 2; column-gap: 28px; }
}
@media (max-width: 700px) {
  body.stellar .site-nav { font-size: 20px; }
  .gx-section { padding-block: 72px; }
  .gx-head { margin-bottom: 38px; }
  .gx-title { font-size: clamp(48px, 13.5vw, 64px); letter-spacing: -.03em; }
  .gx-lede { font-size: 19px; }
  .gx-hero .gx-buy { margin-top: 30px; }
  .gx-buy .gx-cta { flex: 1 1 100%; }
  .gx-note { margin-top: 32px; }
  .gx-hero-art { min-height: 430px; }
  .gx-book { width: min(260px, 64vw); translate: -4% 0; }
  @keyframes gx-float { from { translate: -4% 0; } to { translate: -4% -10px; } }
  .gx-ring-1 { --w: 400px; } .gx-ring-2 { --w: 310px; } .gx-ring-3 { --w: 480px; }
  .gx-trust { grid-template-columns: 1fr 1fr; gap: 18px 0; padding-top: 22px; }
  .gx-trust li { padding: 0 12px; gap: 10px; }
  .gx-trust li:nth-child(odd) { padding-left: 0; border-left: 0; }
  .gx-trust p { font-size: 15px; }
  .gx-trust strong { font-size: 17px; }
  body.stellar .stellar-page-list.gx-panel { padding: 4px 20px 22px; }
  body.stellar .stellar-page-list.gx-panel button { font-size: 21px; padding: 15px 0; }
  .gx-tile { padding: 24px 22px 26px; }
  .gx-tile-art { height: auto; min-height: 150px; }
  .gx-tile h3, .gx-steps h3 { font-size: 26px; }
  .gx-three { gap: 14px; }
  .gx-three img { width: 74px; height: 74px; }
  .gx-house dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gx-house dl > div:nth-child(3) { border-left: 0; }
  .gx-house dl > div:nth-child(n+3) { border-top: 1px solid #d9cfea; }
  .gx-cycles { gap: 12px; }
  .gx-cycle img { height: 68px; }
  .gx-palette { flex-direction: column; gap: 18px; }
  .gx-book-map { padding: 24px 20px 4px; }
  .gx-try-row, .gx-waitlist-row { flex-direction: column; }
  .gx-try-row .button, .gx-waitlist-row .button { justify-content: center; }
  .gx-try-empty, .gx-try-card { padding: 28px 22px; }
  .gx-try-orbit { width: 160px; height: 160px; }
  .gx-try-sun img { width: 66px; height: 66px; }
  .gx-try-sun p { font-size: 19px; }
  .gx-try-dates dd { font-size: 21px; }
  .gx-steps li, .gx-next li { padding: 28px 22px 30px; }
  .gx-shelf { grid-template-columns: 1fr 1fr; gap: 18px; }
  .gx-vol-open { grid-column: 1 / -1; max-width: 280px; }
  .gx-vol strong { font-size: 21px; }
  .gx-waitlist { margin-top: 48px; padding: 26px 22px; }
  body.stellar .faq-list.gx-panel { padding: 0 20px; }
  body.stellar .faq-list.gx-panel summary { font-size: 21px; padding-block: 20px; }
  .gx-close { padding-block: 104px 110px; }
  .gx-close-orbit { width: 150px; height: 150px; margin-bottom: 26px; }
  .gx-page { padding-block: 44px 80px; }
  .gx-center .gx-orbit-art { width: 150px; height: 150px; margin-bottom: 26px; }
  .gx-center .gx-lede-c { font-size: 18px; }
  .gx-doc-head { padding: 40px 0 32px; }
  .gx-doc { padding: 32px 0 80px; }
  .gx-toc { padding: 20px 20px 22px; }
  .gx-toc ol { columns: 1; }
  .gx-doc-body h2 { font-size: 27px; gap: 12px; }
  .gx-doc-body p, .gx-doc-body li { font-size: 17px; }
  .gx-doc-body .gx-clause { grid-template-columns: 38px minmax(0, 1fr); }
  body.stellar .flow-email { font-size: 21px; }
  body.stellar .site-footer { padding-top: 52px; }
  .gx-footnote { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .gx-book-cover, .gx-sheen, .gx-book-pages img, .gx-tile, .gx-vol-cover { transition: none; }
  .gx-try-result.is-loading::after { animation: none; }
}