/* SacredAstra site stylesheet (the web font is static/fonts/web: Cormorant Garamond subset to Latin as WOFF2; the TTFs beside it are the PDF renderer's): the shared base, the Quiet Cosmos light theme (body without .stellar) and the Stellar midnight theme (body.stellar). Built from the design studies; edit here, not there. */
@font-face{font-family:Cosmos;src:url('/static/fonts/web/CormorantGaramond.woff2') format('woff2'),url('/static/fonts/CormorantGaramond.ttf') format('truetype');font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:Cosmos;src:url('/static/fonts/web/CormorantGaramond-Italic.woff2') format('woff2'),url('/static/fonts/CormorantGaramond-Italic.ttf') format('truetype');font-weight:300 700;font-style:italic;font-display:swap}
:root{--paper:#f5f0e8;--ink:#2e352d;--muted:#71776b;--rust:#a95f45;--line:#dad8ca;--serif:Cosmos,Georgia,serif;--sans:Arial,Helvetica,sans-serif;--olive:#424b3b;--white:#fbf8f1}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.65 var(--sans);-webkit-font-smoothing:antialiased}body:has(dialog[open]){overflow:hidden}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}svg{display:block}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-weight:400}button{border:0}button:disabled{cursor:default;opacity:.5}a,button{transition:background-color .2s,color .2s,transform .2s,border-color .2s}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--rust);outline-offset:5px}::selection{background:#d6d5bd;color:var(--ink)}[hidden]{display:none!important}.container{max-width:1240px;width:calc(100% - 112px);margin-inline:auto}.eyebrow{font:10px/1.5 var(--sans);letter-spacing:1.65px;font-weight:500;text-transform:uppercase}.section-title{font:500 clamp(40px,4.6vw,66px)/1.04 var(--serif);letter-spacing:-1.8px}.section-title em{font-weight:400}p{text-wrap:pretty}.button{display:inline-flex;justify-content:center;align-items:center;gap:30px;min-height:53px;padding:15px 25px;background:var(--rust);color:#fffaf1;border:1px solid var(--rust);font-size:12px;line-height:1.5;letter-spacing:.1px}.button:hover{background:#8b4c37;border-color:#8b4c37;transform:translateY(-2px)}.button span[aria-hidden]{font-size:20px;font-weight:400;line-height:1}.button.secondary{background:transparent;border-color:var(--line);color:var(--ink)}.button.secondary:hover{background:#e8e4d9;border-color:var(--ink)}.text-link{display:inline-flex;gap:22px;align-items:center;background:none;border-bottom:1px solid currentColor;padding:4px 0;font-size:12px;line-height:1.8}.text-link:hover{color:var(--rust)}.text-link span{font-size:17px}.skip-link{position:absolute;top:-80px;left:20px;background:#0c0d20;color:#f2eada;padding:12px 16px;z-index:100;border:1px solid #dcbc83}.skip-link:focus{top:10px}.site-header{height:106px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:25px}.wordmark{font:500 32px/1 var(--serif);letter-spacing:-1.2px;display:inline-flex;align-items:center;white-space:nowrap;gap:11px}.wordmark svg{width:34px;height:34px}.wordmark-dot{align-self:flex-start;font:8px var(--sans);margin:4px 0 0 -7px}.site-nav{display:flex;gap:31px;font-size:11px}.site-nav a:hover{color:var(--rust)}.header-cta{font-size:11px;border-bottom:1px solid var(--ink);padding:7px 0;display:flex;gap:20px;align-items:center}.header-cta span{font-size:18px}.menu-toggle{display:none}.hero{display:grid;grid-template-columns:1.02fr 1fr;gap:80px;align-items:center;padding-top:44px;padding-bottom:54px}.hero-copy{padding:18px 0 0}.hero-copy .eyebrow{font-size:9px;letter-spacing:1.6px;display:flex;gap:10px;align-items:center;margin-bottom:29px}.tiny-star{font-size:24px;line-height:1;color:var(--rust)}.hero h1{font:500 clamp(68px,7.2vw,108px)/.91 var(--serif);letter-spacing:-4px;margin-bottom:29px}.hero h1 em{font-weight:400;color:var(--rust)}.hero-description{font-size:14px;line-height:1.9;max-width:380px;color:#666e61}.hero-actions{display:flex;align-items:center;gap:26px;margin-top:31px}.hero-actions .text-link{font-size:11px;white-space:nowrap}.hero-details{display:flex;margin-top:39px;gap:22px;color:var(--muted);font-size:10px}.hero-details span{border-right:1px solid var(--line);padding-right:22px;display:flex;align-items:center;gap:7px}.hero-details span:last-child{border:0;padding:0}.hero-details b{font:400 27px var(--serif);color:var(--ink)}.hero-note{margin-top:15px;font-size:9px;color:var(--muted);display:flex;align-items:center;gap:8px}.note-dot{height:5px;width:5px;background:#7c8b6b;border-radius:50%}.note-divider{margin:0 4px;color:#b8b9a9}.hero-art{position:relative;max-width:540px;width:100%;padding-inline:20px}.hero-art-top{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;margin:0 -19px 30px}.landscape-frame{position:relative;isolation:isolate;aspect-ratio:1/1.11;border-radius:50% 50% 1px 1px;overflow:hidden}.landscape-frame>img{width:100%;height:100%;object-fit:cover;object-position:center 58%;filter:saturate(.77)}.landscape-shade{position:absolute;inset:65% 0 0;background:linear-gradient(transparent,rgba(12,27,19,.56))}.art-caption{position:absolute;bottom:23px;left:25px;right:25px;display:flex;justify-content:space-between;align-items:center;color:#efe8d3}.art-caption>span:first-child{font-size:7px;letter-spacing:1.25px}.art-caption>span:last-child{font:italic 17px var(--serif)}.hero-orbits{position:absolute;inset:24px -12px auto;width:calc(100% + 24px);height:calc(100% - 22px);color:#b1a37a;pointer-events:none;opacity:.8}.orbit-seal{position:absolute;right:-20px;top:28%;border:1px solid #c8c6b1;background:var(--paper);width:95px;height:95px;display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;border-radius:50%;transform:rotate(13deg);color:var(--olive)}.orbit-seal svg{width:33px;height:33px}.orbit-seal span{font-size:6px;letter-spacing:1.8px}.art-footnote{display:flex;align-items:center;justify-content:space-between;margin-top:18px}.art-footnote>span:first-child{font-size:7px;letter-spacing:1.1px}.art-footnote>span:last-child{font:italic 17px var(--serif)}.art-footnote i{font-style:normal;font-family:var(--sans);font-size:16px;margin-left:20px}.systems-ribbon{border-block:1px solid var(--line);padding:25px 0;display:flex;justify-content:space-between;align-items:center;gap:25px}.systems-ribbon>span{font-size:8px;letter-spacing:1.4px;color:var(--muted)}.systems-ribbon>a{font:500 21px var(--serif);display:flex;gap:13px;align-items:center}.systems-ribbon>a:hover{color:var(--rust)}.systems-ribbon>a>span{font:23px Georgia,serif;color:var(--olive)}.approach-section{padding-block:105px 98px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:70px;margin-bottom:43px}.section-heading .eyebrow{margin-bottom:21px;color:var(--rust)}.section-heading>p{color:var(--muted);font-size:13px;max-width:340px;line-height:1.9;padding-bottom:4px}.system-explorer{background:#303a2f;color:#f0ebd9;border-radius:2px}.system-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #53604d}.system-tabs button{text-align:left;background:transparent;color:#e7e5d5;display:flex;align-items:center;gap:15px;padding:24px 26px;border-right:1px solid #53604d;font:500 20px var(--serif);position:relative}.system-tabs button:last-child{border-right:0}.system-tabs button span:first-child{font:9px var(--sans);opacity:.6}.system-tabs button span:last-child{font:13px var(--sans);margin-left:auto}.system-tabs button[aria-selected=true]{background:#424d3c}.system-tabs button[aria-selected=true]:after{content:"";position:absolute;bottom:-1px;left:26px;right:26px;height:2px;background:#c9b794}.system-tabs button:hover{background:#3c4737}.system-stage{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:420px;padding:42px 80px;gap:90px}.celestial-diagram{position:relative;max-width:340px;width:100%;margin:auto;color:#bbae8c}.celestial-diagram svg{width:100%;stroke:currentColor;stroke-width:.65}.diagram-aspects{opacity:.55}.diagram-symbol{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:72px/1 Georgia,serif;color:#d7c49a}.diagram-label{position:absolute;top:69%;left:0;right:0;font-size:6px;letter-spacing:2px;text-align:center;color:#d7c49a}.system-panel .eyebrow{color:#b1b99f;font-size:9px}.system-panel h3{font:400 45px/1.07 var(--serif);margin:18px 0}.system-panel>p:not(.eyebrow){font-size:12px;color:#c0c6b5;line-height:1.9;max-width:365px}.system-panel ul{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:23px 0 22px;padding:0}.system-panel li{font-size:8px;padding:4px 8px;border:1px solid #62705b;color:#c6cdbb}.light-link{color:#e7dcc1;font-size:10px}.light-link:hover{color:white}.system-bottom{display:flex;justify-content:space-between;align-items:center;margin:0 30px;padding:18px 0;border-top:1px solid #53604d;font-size:8px;letter-spacing:1px;color:#b6c0aa}.system-bottom>span:last-child{letter-spacing:0}.system-bottom>span:last-child>span{margin-left:30px;font-size:18px;vertical-align:middle}.inside-section{padding:80px 0 95px;background:#ece9df}.inside-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:100px}.inside-copy .eyebrow{color:var(--rust);margin-bottom:23px}.inside-copy>p:not(.eyebrow){color:var(--muted);font-size:13px;line-height:1.9;margin-top:23px;max-width:365px}.chapter-list{margin:27px 0 23px}.chapter-list>div{border-bottom:1px solid #cecfc0;display:flex;align-items:center;gap:22px;padding:17px 0}.chapter-list>div>span:first-child{font-size:9px;color:var(--muted)}.chapter-list p{font:500 24px/1.15 var(--serif)}.chapter-list small{display:block;font:11px/1.6 var(--sans);color:var(--muted);margin-top:5px}.chapter-list>div>span:last-child{margin-left:auto;font-size:15px;color:var(--muted)}.book-meta{display:flex;justify-content:space-between;font-size:7px;letter-spacing:1px}.book-arrangement{height:465px;position:relative;display:flex;align-items:center;justify-content:center;margin-top:18px}.book-back{position:absolute;width:60%;height:74%;background:#f8f4e8;left:1%;top:7%;transform:rotate(-11deg);box-shadow:0 20px 40px #3937251a;color:#6d7659;border:1px solid #dbd9c7;padding:50px 25px 25px;text-align:center;display:flex;align-items:center;flex-direction:column}.book-back>span{font:27px/1.15 var(--serif);letter-spacing:1px}.book-sun{font:100px/1.3 var(--serif);margin-block:8px}.book-back p{font:italic 18px/1.25 var(--serif)}.book-back small{font-size:7px;letter-spacing:3px;margin-top:auto}.book-front{background:#152027;width:59%;position:absolute;right:3%;top:12%;transform:rotate(7deg);box-shadow:10px 23px 35px #30312433;padding:0}.book-front>img{width:100%;height:auto}.book-front>span{position:absolute;inset:auto 0 0;background:#19251ce6;color:#ebe5d3;padding:12px 15px;display:flex;justify-content:space-between;font-size:9px;opacity:0;transition:opacity .2s}.book-front:hover>span,.book-front:focus-visible>span{opacity:1}.book-front:hover{transform:rotate(4deg) translateY(-4px)}.book-caption{display:flex;justify-content:space-between;align-items:center;font-size:9px;color:var(--muted);gap:20px}.book-caption .text-link{font-size:10px;color:var(--ink)}.process-section{padding-block:99px}.process-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:54px}.process-grid article{padding:0 36px;border-right:1px solid var(--line)}.process-grid article:first-child{padding-left:0}.process-grid article:last-child{padding-right:0;border-right:0}.process-number{font:400 48px/1 var(--serif);color:#a2a28d;display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.process-number>span{font:24px var(--serif);color:var(--ink)}.process-grid h3{font:500 29px/1.1 var(--serif);margin-bottom:17px}.process-grid p{font-size:12px;color:var(--muted);line-height:1.9;max-width:290px}.process-grid small{display:block;font-size:7px;letter-spacing:1.3px;margin-top:23px}.rhea-section{display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:98px;background:#e7e7da;padding:62px;margin-bottom:95px}.rhea-art{position:relative;max-width:350px}.rhea-art img{width:100%;height:420px;object-fit:cover;object-position:center 30%;filter:saturate(.55);border-radius:180px 180px 0 0}.rhea-caption{position:absolute;bottom:19px;left:20px;color:#fff5d9;font-size:7px;letter-spacing:1.4px}.rhea-copy .eyebrow{font-size:8px;color:var(--rust);margin-bottom:24px}.rhea-copy .section-title{font-size:55px}.rhea-copy>p{font-size:12px;line-height:1.9;color:#696f60;margin-top:13px;max-width:380px}.rhea-copy .rhea-intro{font:italic 25px/1.3 var(--serif);color:var(--ink);margin:23px 0 16px}.rhea-signoff{display:flex;align-items:center;gap:30px;margin-top:22px}.rhea-signoff>span{font:italic 40px/1 var(--serif);transform:rotate(-8deg)}.rhea-signoff>p{font-size:7px;letter-spacing:1.2px;line-height:1.8;color:var(--muted)}.faq-section{display:grid;grid-template-columns:.9fr 1.2fr;gap:90px;padding-bottom:95px}.faq-heading .eyebrow{color:var(--rust);font-size:8px;margin-bottom:25px}.faq-heading .text-link{margin-top:32px;font-size:11px}.faq-list details{border-bottom:1px solid var(--line)}.faq-list details:first-child{border-top:1px solid var(--line)}.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;font:500 24px/1.25 var(--serif);cursor:pointer}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary>span{font:18px var(--sans);color:#808772;transition:transform .2s}.faq-list details[open] summary>span{transform:rotate(45deg)}.faq-list details p{font-size:12px;color:var(--muted);padding:0 26px 23px 0;line-height:1.9}.closing-section{position:relative;overflow:hidden;background:#dfe2d0;padding:70px 0 75px;text-align:center}.closing-section:before,.closing-section:after{content:"";position:absolute;top:-20%;left:-14%;width:47%;aspect-ratio:1;border:1px solid #b4bea14d;border-radius:50%;pointer-events:none}.closing-section:after{top:24%;left:auto;right:-12%;width:44%}.closing-star{font:60px/1 var(--serif);display:block;color:#677453;margin-bottom:20px}.closing-inner>.eyebrow{font-size:8px;letter-spacing:1.9px}.closing-inner h2{font:500 90px/.95 var(--serif);letter-spacing:-3px;margin:26px 0}.closing-inner h2 em{font-weight:400}.closing-inner>p:not(.eyebrow){font-size:12px;color:#66705c;line-height:1.9;margin-bottom:29px}.closing-details{font-size:9px;margin-top:17px;color:#68735d}.closing-details>span{margin:0 11px}.site-footer{padding:55px 0 160px}.footer-top{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;padding-bottom:35px}.footer-top>.wordmark{font-size:32px}.footer-star{font:40px/1 var(--serif);margin-left:12px;color:var(--rust)}.footer-top>p{font:italic 22px/1.3 var(--serif);justify-self:center}.footer-top nav{display:flex;flex-direction:column;gap:8px;font-size:11px;justify-self:end}.footer-top nav a:hover{color:var(--rust)}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-block:19px;font-size:8px;color:var(--muted)}.footer-disclosure{font-size:9px;line-height:1.8;color:var(--muted);max-width:1000px;text-align:center;margin-top:15px}.dock-title small{display:block;font-size:8px;letter-spacing:0;color:var(--muted);margin-top:2px}.gallery-dialog{width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 40px);border:0;padding:23px;background:var(--paper);color:var(--ink);box-shadow:0 10px 100px #1116}.gallery-dialog::backdrop{background:#202c27cc;backdrop-filter:blur(5px)}.gallery-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.gallery-top h2{font:32px var(--serif)}.gallery-top .eyebrow{font-size:7px}.gallery-close{font-size:30px;background:transparent;width:44px;height:44px}.gallery-image{height:min(62dvh,680px);display:flex;justify-content:center;background:#e2e2d3}.gallery-image img{height:100%;width:auto;object-fit:contain}.gallery-controls{display:flex;justify-content:space-between;align-items:center;margin-top:17px}.gallery-controls button{border:1px solid var(--line);background:transparent;width:42px;height:36px}.gallery-controls p{font-size:10px;letter-spacing:2px}.gallery-disclaimer{font-size:9px;color:var(--muted);text-align:center;margin-top:13px}.reveal{transition:opacity .65s,transform .65s}.reveal.will-reveal{opacity:0;transform:translateY(20px)}.reveal.is-visible{opacity:1;transform:none}
@media(min-width:1600px){.hero{padding-block:55px 70px}.hero h1{font-size:110px}.hero-art{max-width:560px}.hero-description{font-size:15px}}
@media(max-width:1150px){.container{width:calc(100% - 72px)}.site-nav{gap:19px}.hero{gap:40px}.hero h1{font-size:90px}.hero-actions{gap:18px}.hero-actions .button{padding-inline:19px;gap:15px}.hero-details{gap:14px}.hero-details span{padding-right:14px}.system-stage{padding:40px 45px;gap:50px}.system-tabs button{padding:22px 19px;gap:10px;font-size:18px}.inside-grid{gap:65px}.rhea-section{gap:60px;padding:45px}.rhea-art img{height:420px}.book-arrangement{height:410px}.book-back{padding-top:35px}.book-sun{font-size:80px}.systems-ribbon>a{font-size:19px;gap:9px}}
@media(max-width:900px){.site-nav{gap:16px;font-size:10px}.wordmark{font-size:28px;gap:7px}.wordmark svg{width:28px}.header-cta{font-size:10px;gap:9px}.hero{gap:35px}.hero h1{font-size:76px;letter-spacing:-2.5px}.hero-copy .eyebrow{font-size:7px;letter-spacing:1.1px}.hero-description{font-size:12px}.hero-actions{align-items:flex-start;flex-direction:column;gap:14px}.hero-details{font-size:8px;gap:10px;margin-top:24px}.hero-details span{padding-right:10px;gap:5px}.hero-details b{font-size:23px}.hero-note{font-size:7px;gap:5px}.hero-art{padding-inline:5px}.hero-art-top{margin-inline:0;font-size:6px}.orbit-seal{width:76px;height:76px;right:-12px}.orbit-seal span{font-size:5px}.orbit-seal svg{width:26px;height:26px}.art-caption{left:15px;right:15px}.art-caption>span:first-child{font-size:5px}.art-caption>span:last-child{font-size:14px}.art-footnote>span:first-child{font-size:6px}.art-footnote>span:last-child{font-size:14px}.art-footnote i{margin-left:8px}.systems-ribbon{gap:15px;flex-wrap:wrap}.systems-ribbon>span{width:100%;font-size:7px}.systems-ribbon>a{font-size:20px;gap:8px}.section-heading{gap:35px}.section-heading>p{max-width:265px;font-size:12px}.section-title{font-size:49px}.system-stage{gap:30px;padding:35px;min-height:370px}.system-tabs button{font-size:16px;padding:19px 13px;gap:7px}.system-tabs button span:first-child{font-size:7px}.system-panel h3{font-size:36px}.system-panel>p:not(.eyebrow){font-size:11px}.diagram-symbol{font-size:54px}.diagram-label{font-size:5px;letter-spacing:1px}.inside-grid{gap:45px}.inside-copy .section-title{font-size:45px}.inside-copy .eyebrow{font-size:8px}.book-arrangement{height:345px}.book-back{padding:27px 15px 17px}.book-back>span{font-size:22px}.book-sun{font-size:63px}.book-back p{font-size:15px}.book-meta{font-size:5px}.book-caption{font-size:7px}.book-caption .text-link{font-size:8px}.chapter-list p{font-size:22px}.chapter-list small{font-size:9px}.chapter-list>div{gap:14px}.process-grid article{padding-inline:22px}.process-grid h3{font-size:24px}.process-grid p{font-size:11px}.rhea-section{padding:35px;gap:40px}.rhea-copy .section-title{font-size:45px}.rhea-art img{height:410px}.faq-section{gap:50px}.faq-list summary{font-size:22px}.hero-art-top>span:last-child{font-size:5px}}
@media(max-width:700px){.container{width:calc(100% - 40px)}.site-header{height:80px;gap:15px;position:relative}.wordmark{font-size:29px}.wordmark svg{width:30px;height:30px}.header-cta{margin-left:auto;font-size:9px;gap:8px}.header-cta span{font-size:15px}.menu-toggle{display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;background:transparent;width:30px;height:44px}.menu-toggle span{display:block;width:21px;height:1px;background:var(--ink)}.site-nav{display:none;position:absolute;top:79px;left:-20px;right:-20px;background:var(--paper);border-bottom:1px solid var(--line);z-index:20;padding:20px 25px;box-shadow:0 15px 20px #30382712;font-size:14px}.site-nav.open{display:flex;flex-direction:column;gap:20px}.hero{grid-template-columns:1fr;gap:42px;padding-top:35px;padding-bottom:36px}.hero-copy{padding:0}.hero-copy .eyebrow{font-size:7.5px;letter-spacing:1.2px;margin-bottom:25px}.hero h1{font-size:clamp(76px,15vw,100px);letter-spacing:-3px;margin-bottom:24px}.hero-description{font-size:13px;max-width:410px;line-height:1.85}.hero-actions{flex-direction:row;align-items:center;gap:20px;margin-top:24px}.hero-actions .button{padding:14px 17px;min-height:51px;font-size:11px;gap:20px}.hero-actions .text-link{font-size:10px;gap:12px}.hero-details{font-size:9px;gap:19px;margin-top:26px}.hero-details span{padding-right:19px}.hero-details b{font-size:26px}.hero-note{font-size:8px;margin-top:11px;gap:7px}.hero-art{max-width:450px;margin:auto;padding-inline:15px}.hero-art-top{font-size:7px;margin-bottom:24px}.hero-art-top>span:last-child{font-size:6px}.landscape-frame{aspect-ratio:1/1.04}.hero-orbits{inset:5px -6px auto;width:calc(100% + 12px);height:calc(100% + 5px)}.orbit-seal{right:0;top:27%;width:86px;height:86px}.art-caption{left:18px;right:18px}.art-caption>span:first-child{font-size:6px}.art-caption>span:last-child{font-size:15px}.art-footnote>span:first-child{font-size:6px}.art-footnote>span:last-child{font-size:16px}.systems-ribbon{display:grid;grid-template-columns:1fr 1fr;gap:15px 22px;padding:23px 0}.systems-ribbon>span{grid-column:1/-1;margin-bottom:4px}.systems-ribbon>a{font-size:21px;gap:13px}.systems-ribbon>a>span{width:22px;font-size:24px}.approach-section{padding-block:65px}.section-heading{display:block;margin-bottom:29px}.section-heading .eyebrow{font-size:8px;margin-bottom:18px}.section-title{font-size:49px;letter-spacing:-1.5px}.section-heading>p{max-width:100%;font-size:12px;margin-top:22px;line-height:1.85}.system-tabs{grid-template-columns:1fr 1fr}.system-tabs button{padding:17px 14px;font-size:19px;border-bottom:1px solid #53604d}.system-tabs button:nth-child(2){border-right:0}.system-tabs button[aria-selected=true]:after{left:14px;right:14px}.system-stage{grid-template-columns:1fr;padding:27px 25px 32px;gap:25px}.celestial-diagram{max-width:250px}.diagram-symbol{font-size:60px}.diagram-label{font-size:5px;letter-spacing:1.2px}.system-panel .eyebrow{font-size:8px}.system-panel h3{font-size:40px;max-width:290px;margin:15px 0}.system-panel>p:not(.eyebrow){font-size:12px;max-width:100%}.system-panel ul{margin:19px 0}.system-panel li{font-size:8px}.system-bottom{margin-inline:25px;padding:15px 0;font-size:6px;letter-spacing:.6px}.system-bottom>span:last-child{display:none}.inside-section{padding-block:50px 55px}.inside-grid{grid-template-columns:1fr;gap:45px}.blueprint-display{max-width:450px;width:100%;margin:auto}.book-meta{font-size:6px}.book-arrangement{height:440px}.book-back{padding:40px 20px 20px}.book-back>span{font-size:26px}.book-sun{font-size:95px}.book-back p{font-size:19px}.book-caption{font-size:8px}.book-caption .text-link{font-size:10px}.inside-copy .section-title{font-size:49px}.inside-copy>p:not(.eyebrow){font-size:12px;max-width:100%}.chapter-list p{font-size:24px}.chapter-list small{font-size:10px}.process-section{padding-block:60px}.process-grid{grid-template-columns:1fr;margin-top:30px}.process-grid article,.process-grid article:first-child,.process-grid article:last-child{padding:26px 0;border-right:0;border-top:1px solid var(--line)}.process-number{font-size:40px;margin-bottom:20px}.process-grid h3{font-size:29px;margin-bottom:12px}.process-grid p{font-size:12px;max-width:100%}.process-grid small{font-size:7px;margin-top:17px}.rhea-section{grid-template-columns:1fr;padding:26px;gap:35px;margin-bottom:60px}.rhea-art{margin:auto;width:100%;max-width:350px}.rhea-art img{height:380px}.rhea-copy .section-title{font-size:49px}.rhea-copy .eyebrow{font-size:7px;margin-bottom:20px}.rhea-copy>p{max-width:100%}.rhea-copy .rhea-intro{font-size:25px}.faq-section{grid-template-columns:1fr;gap:32px;padding-bottom:60px}.faq-heading .text-link{margin-top:22px}.faq-list summary{font-size:23px;padding:21px 0}.closing-section{padding-block:50px 55px}.closing-inner h2{font-size:76px;letter-spacing:-2px}.closing-star{font-size:48px}.closing-inner>p:not(.eyebrow){font-size:12px}.closing-details{font-size:8px}.footer-top{grid-template-columns:1fr 1fr;row-gap:25px;padding-bottom:25px}.footer-top>.wordmark{grid-column:1/-1;font-size:32px}.footer-top>p{justify-self:start;font-size:22px}.footer-top nav{font-size:10px;gap:9px}.footer-bottom{font-size:7px;flex-wrap:wrap;gap:12px}.footer-bottom>span:last-child{display:none}.footer-disclosure{font-size:8px;text-align:left}.site-footer{padding:42px 0 155px}.dock-title small{font-size:7px}.gallery-dialog{padding:17px}.gallery-top h2{font-size:27px}.gallery-image{height:57dvh}}
@media(max-width:380px){.header-cta{font-size:8px}.wordmark{font-size:26px}.wordmark svg{width:25px;height:25px}.hero h1{font-size:73px}.hero-actions{gap:14px}.hero-actions .button{gap:13px;padding-inline:14px;font-size:10px}.hero-details{gap:12px}.hero-details span{padding-right:12px}.hero-art{padding-inline:10px}.book-arrangement{height:370px}.book-sun{font-size:70px}.book-back>span{font-size:22px}.book-back p{font-size:17px}.section-title,.inside-copy .section-title,.rhea-copy .section-title{font-size:45px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal.will-reveal{opacity:1;transform:none}}

/* ---- Quiet Cosmos refinements (light theme) ---- */
/* Quiet Cosmos uses one family across content and controls. */
body:not(.stellar) { --sans: Cosmos, Georgia, serif; --muted: #606657; font-family: var(--serif); font-size: 19px; line-height: 1.6; }
body:not(.stellar) em { font-style: normal; }
body:not(.stellar) .eyebrow { font: 500 17px/1.4 var(--serif); letter-spacing: 0; text-transform: none; }
body:not(.stellar) .site-nav, body:not(.stellar) .header-cta { font-size: 17px; }
body:not(.stellar) .button { font: 600 19px/1.4 var(--serif); background: #424b3b; color: #fffaf1; border-color: #424b3b; min-height: 54px; padding: 14px 27px; }
body:not(.stellar) .button:hover { background: #2e352d; border-color: #2e352d; transform: none; }
body:not(.stellar) .text-link { font-size: 18px; }
body:not(.stellar) .hero { gap: 80px; padding-block: 64px 72px; }
body:not(.stellar) .hero-copy { padding: 0; }
body:not(.stellar) .hero-copy .eyebrow { font-size: 17px; letter-spacing: 0; margin-bottom: 24px; }
body:not(.stellar) .hero h1 { font-size: clamp(64px,6.8vw,96px); line-height: 1; letter-spacing: -2px; margin-bottom: 26px; }
body:not(.stellar) .hero-description { font-size: 21px; line-height: 1.55; max-width: 460px; color: #555e50; }
.quiet-price { display: flex; align-items: center; gap: 19px; margin: 24px 0 10px; }
.quiet-price strong { font-size: 64px; font-weight: 500; line-height: 1; letter-spacing: -2px; }
.quiet-price > span { font-size: 16px; line-height: 1.4; color: #555e50; }
.quiet-inclusions { font-size: 18px; color: #555e50; }
body:not(.stellar) .hero-actions { margin-top: 24px; gap: 26px; }
body:not(.stellar) .hero-actions .text-link { font-size: 18px; }
body:not(.stellar) .hero-note { font-size: 16px; line-height: 1.5; margin-top: 20px; color: #606657; }
body:not(.stellar) .hero-art { padding: 0; margin: 0; }
body:not(.stellar) .landscape-frame { border-radius: 0; aspect-ratio: 4 / 5; }
body:not(.stellar) .art-footnote { display: block; font: 16px/1.5 var(--serif); margin-top: 16px; color: var(--muted); }
body:not(.stellar) .inside-section { padding-block: 76px; background: #e9e6dc; }
body:not(.stellar) .inside-grid { gap: 85px; align-items: center; }
body:not(.stellar) .section-title { font-size: clamp(40px,4.2vw,58px); line-height: 1.1; letter-spacing: -1px; }
body:not(.stellar) .book-meta { font-size: 16px; letter-spacing: 0; }
body:not(.stellar) .book-arrangement { height: auto; aspect-ratio: 1; margin-block: 30px; }
.quiet-back-page { position: absolute; top: 0; left: 5%; width: 61%; height: auto; transform: rotate(-9deg); box-shadow: 0 7px 20px #2e352d22; }
body:not(.stellar) .book-front { width: 64%; top: 8%; right: 8%; transform: rotate(5deg); }
body:not(.stellar) .book-front > span { font-size: 15px; }
body:not(.stellar) .book-caption { display: block; font-size: 16px; color: var(--muted); }
body:not(.stellar) .inside-copy > p:not(.eyebrow) { font-size: 20px; line-height: 1.6; }
body:not(.stellar) .chapter-list > div { display: block; padding-block: 20px; }
body:not(.stellar) .chapter-list p { font: 500 26px/1.3 var(--serif); }
body:not(.stellar) .chapter-list small { font: 400 18px/1.5 var(--serif); margin-top: 7px; color: #606657; }
body:not(.stellar) .approach-section { padding-block: 85px; }
body:not(.stellar) .section-heading > p { font-size: 20px; line-height: 1.6; }
body:not(.stellar) .system-explorer { background: #424b3b; }
body:not(.stellar) .system-tabs button { font: 500 21px/1.4 var(--serif); padding: 23px 18px; }
body:not(.stellar) .system-panel h3 { font-size: 39px; }
body:not(.stellar) .system-panel > p:not(.eyebrow) { font-size: 20px; line-height: 1.6; color: #e3e5d8; }
body:not(.stellar) .system-stage { min-height: 340px; }
body:not(.stellar) .diagram-symbol { font-family: var(--serif); }
.quiet-process { display: grid; grid-template-columns: 1fr 1fr; gap: 85px; padding-bottom: 85px; }
.quiet-process .eyebrow { margin-bottom: 20px; }
.quiet-process-list article { border-top: 1px solid var(--line); padding: 22px 0; }
.quiet-process-list h3 { font-size: 28px; margin-bottom: 10px; }
.quiet-process-list p { font-size: 20px; color: var(--muted); }
body:not(.stellar) .rhea-section { gap: 85px; margin-bottom: 85px; padding: 0; background: none; }
body:not(.stellar) .rhea-art img { border-radius: 0; }
body:not(.stellar) .rhea-copy > p:not(.eyebrow) { font-size: 20px; line-height: 1.6; }
body:not(.stellar) .rhea-copy .text-link { margin-top: 20px; }
body:not(.stellar) .faq-list summary { font-size: 26px; }
body:not(.stellar) .faq-list details p { font-size: 19px; line-height: 1.6; }
body:not(.stellar) .closing-section { background: #e9e6dc; padding-block: 65px; text-align: left; }
body:not(.stellar) .closing-section::before, body:not(.stellar) .closing-section::after { content: none; }
.quiet-offer { display: grid; grid-template-columns: 1fr 1fr; gap: 85px; align-items: center; }
.quiet-offer .section-title { margin: 20px 0; }
.quiet-offer > div:last-child { justify-self: end; }
.quiet-offer .quiet-price { margin-top: 0; margin-bottom: 24px; }
.quiet-offer .button { width: 100%; }
.quiet-delivery { font-size: 17px; margin-top: 14px; color: var(--muted); }
body:not(.stellar) .footer-top nav { font-size: 18px; }
body:not(.stellar) .footer-bottom, body:not(.stellar) .footer-disclosure { font-size: 15px; line-height: 1.6; }
body:not(.stellar) .gallery-disclaimer, body:not(.stellar) .gallery-controls p { font-size: 16px; }
body:not(.stellar) .flow-progress li > span { display: none; }
body:not(.stellar) .flow-chapter-number, body:not(.stellar) .flow-policy-number { display: none; }
body:not(.stellar) .flow-field input, body:not(.stellar) .flow-field textarea, body:not(.stellar) .flow-field select { font-size: 18px; }
body:not(.stellar) .flow-field > label, body:not(.stellar) .flow-progress li, body:not(.stellar) .flow-order-line { font-size: 17px; }
body:not(.stellar) .flow-order-line strong { font-size: 36px; }
@media(max-width:1100px) {
 body:not(.stellar) .site-nav { gap: 16px; font-size: 16px; }
 body:not(.stellar) .header-cta { font-size: 16px; }
 body:not(.stellar) .hero, body:not(.stellar) .inside-grid, body:not(.stellar) .rhea-section, .quiet-process, .quiet-offer { gap: 40px; }
 body:not(.stellar) .hero-actions { flex-wrap: wrap; gap: 18px; }
 body:not(.stellar) .system-tabs button { font-size: 19px; padding-inline: 12px; }
}
@media(max-width:700px) {
 body:not(.stellar) .header-cta { font-size: 14px; }
 body:not(.stellar) .hero { padding-block: 36px 46px; gap: 38px; }
 body:not(.stellar) .hero h1 { font-size: clamp(58px,12vw,76px); letter-spacing: -1.5px; }
 body:not(.stellar) .hero-description { font-size: 20px; }
 .quiet-price strong { font-size: 60px; }
 body:not(.stellar) .hero-note { font-size: 16px; }
 body:not(.stellar) .hero-art { max-width: 440px; margin-inline: auto; }
 body:not(.stellar) .landscape-frame { aspect-ratio: 1.1; }
 body:not(.stellar) .inside-section, body:not(.stellar) .approach-section { padding-block: 50px; }
 body:not(.stellar) .inside-copy .section-title { font-size: 43px; }
 body:not(.stellar) .section-heading { gap: 23px; }
 body:not(.stellar) .system-tabs button { font-size: 19px; padding: 16px 10px; }
 body:not(.stellar) .system-panel h3 { font-size: 34px; }
 .quiet-process, .quiet-offer { grid-template-columns: 1fr; gap: 30px; }
 .quiet-process { padding-bottom: 50px; }
 body:not(.stellar) .rhea-section { margin-bottom: 50px; }
 .quiet-offer > div:last-child { justify-self: stretch; }
}

/* ---- Stellar (body.stellar) ---- */
/* Stellar: one type family, midnight violet, warm gold. */
.stellar {
  --paper: #0c0d20;
  --ink: #f2eada;
  --muted: #aaa6c1;
  --rust: #dcbc83;
  --line: #34324c;
  --olive: #b9acd5;
  --white: #17162c;
  --sans: Cosmos, Georgia, serif;
  color-scheme: dark;
  font-family: var(--serif);
  font-size: 18px;
  line-height: 1.6;
  background: #0c0d20 url('/static/img/preview/stellar-nebula.webp') center 25px / 1600px auto no-repeat;
}
.stellar h1, .stellar h2, .stellar h3, .stellar h4 { font-weight: 500; }
.stellar em { font-style: normal; }
.stellar .eyebrow { font-size: 13px; letter-spacing: 1px; }
.stellar .site-header { height: 100px; }
.stellar .wordmark { font-size: 34px; }
.stellar .wordmark svg { color: var(--rust); }
.stellar .site-nav { font-size: 16px; gap: 30px; }
.stellar .header-cta { font-size: 16px; gap: 22px; border-color: #b49a6d; }
.stellar .button { background: var(--rust); border-color: var(--rust); color: #141326; font: 600 18px/1.4 var(--serif); padding: 15px 27px; gap: 35px; border-radius: 3px; }
.stellar .button:hover { background: #efd29e; border-color: #efd29e; }
.stellar .button.secondary { background: transparent; color: var(--ink); border-color: #675c7f; }
.stellar .button.secondary:hover { background: #28213f; border-color: var(--rust); }
.stellar .text-link { font-size: 17px; gap: 22px; border-color: #635875; }
.stellar .text-link:hover { color: var(--rust); }
.stellar .menu-toggle span { background: var(--ink); }
.stellar-kicker { color: var(--rust); font-size: 18px; margin-bottom: 22px; letter-spacing: .2px; }
.stellar-opening { position: relative; }
.stellar-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 75px; align-items: center; padding-block: 76px 70px; }
.stellar-hero-copy h1 { font-size: clamp(68px, 7.4vw, 108px); line-height: .95; letter-spacing: -2.5px; margin-bottom: 25px; }
.stellar-hero-copy h1 span { color: #ddbf8e; }
.stellar-description { max-width: 440px; font-size: 20px; line-height: 1.65; color: #c0bad3; }
.stellar-actions { display: flex; gap: 29px; align-items: center; margin-top: 31px; }
.stellar-purchase { border-top: 1px solid #615471; margin-top: 28px; padding-top: 24px; max-width: 440px; }
.stellar-price { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; color: var(--ink); }
.stellar-price strong { color: #f0d5a2; font-size: 72px; line-height: 1; font-weight: 500; letter-spacing: -2px; font-variant-numeric: lining-nums; }
.stellar-price span { font-size: 17px; line-height: 1.5; color: #e3d9ed; }
.stellar-purchase .stellar-inclusions, .stellar-offer-purchase .stellar-inclusions { font-size: 18px; line-height: 1.6; color: #d0c7df; margin: 16px 0 0; }
.stellar-purchase .stellar-actions { margin-top: 22px; }
.stellar-final-offer { display: grid; grid-template-columns: 1.2fr 1fr; gap: 80px; align-items: center; text-align: left; }
.stellar-offer-purchase { background: #141225; padding: 35px; border: 1px solid #665671; }
.stellar-offer-purchase .button { width: 100%; margin-top: 25px; }
.stellar-final-offer .stellar-kicker { color: var(--rust); font-size: 18px; margin: 0 0 22px; }
.stellar-product { position: relative; padding: 22px 0 0; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.stellar-book { position: relative; width: 318px; aspect-ratio: .706; padding: 17px; background: linear-gradient(115deg, #0b102cdc, #242043d9), url('/static/img/preview/stellar-nebula.webp') right center / cover; color: #e6d0a2; border: 1px solid #8c795867; border-radius: 2px 5px 5px 2px; box-shadow: -8px 1px 0 #101023, -10px 2px 0 #686072, 4px 3px 0 #a8a0a0, 7px 5px 0 #e0d6ba, 10px 7px 0 #776f75, 16px 18px 40px #0008; transform: perspective(1400px) rotateY(-9deg) rotateZ(6deg); z-index: 1; }
.stellar-book:before { position: absolute; content: ''; left: 7px; top: 0; bottom: 0; width: 3px; border-left: 1px solid #f1d6a033; background: #0002; }
.stellar-book-border { height: 100%; border: 1px solid #b99a6066; outline: 1px solid #b99a6030; outline-offset: -5px; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 18px 16px 15px; }
.stellar-book-brand { font-size: 15px; letter-spacing: 1.8px; }
.stellar-book-star { font-size: 28px; line-height: 1; margin: 13px 0 10px; }
.stellar-book h2 { font-size: 42px; line-height: 1.02; letter-spacing: .2px; }
.stellar-book-border > p { font-size: 11px; margin-top: 12px; color: #c6b596; }
.stellar-chart { width: 100%; stroke: currentColor; stroke-width: .7; }
.stellar-book .stellar-chart { width: 155px; margin: 13px 0 4px; }
.stellar-book-bottom { margin-top: auto; width: 100%; display: flex; flex-direction: column; align-items: center; }
.stellar-book-bottom > span { font-size: 10px; color: #c5b99e; }
.stellar-book-bottom strong { font-size: 23px; font-weight: 400; line-height: 1.4; }
.stellar-book-bottom small { font-size: 7px; letter-spacing: 1px; margin-top: 12px; }
.stellar-orbit { position: absolute; inset: 4% 0 13%; border: 1px solid #d5bc842b; border-radius: 50%; transform: rotate(-24deg); }
.stellar-orbit-two { inset: 30% -6% 38%; transform: rotate(-32deg); border-color: #d5bc8445; }
.stellar-orbit-star { position: absolute; right: 4%; top: 5%; color: var(--rust); font-size: 43px; }
.stellar-heading { text-align: center; margin-bottom: 48px; }
.stellar-heading .stellar-kicker { margin-bottom: 17px; }
.stellar-heading > p:last-child { color: var(--muted); font-size: 19px; line-height: 1.6; margin-top: 21px; }
.stellar-paper { --ink: #2d263c; --muted: #625a6e; --rust: #775b35; --line: #d4cbd0; background: #efe9e3; color: var(--ink); color-scheme: light; }
.stellar-inside { padding-block: 88px 64px; }
.stellar-inside .stellar-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; text-align: left; margin-bottom: 58px; }
.stellar-inside .stellar-heading > p { max-width: 350px; }
.stellar-inside-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 85px; }
.stellar-sample-stage { padding: 26px 30px 24px; display: flex; align-items: center; flex-direction: column; position: relative; }
.stellar-sample-label { color: var(--muted); font-size: 15px; margin-top: 13px; text-align: center; }
.stellar-page-fan { width: 100%; position: relative; padding: 20px 0 18px 20%; }
.stellar-fan-back { position: absolute; width: 63%; height: auto; top: 0; left: 2%; transform: rotate(-11deg); box-shadow: 0 12px 25px #28203726; }
.stellar-sample-page { position: relative; background: none; padding: 0; width: 100%; transform: rotate(5deg); box-shadow: 5px 13px 25px #28203730; border: 1px solid #b29a6777; }
.stellar-sample-page:hover { transform: rotate(-2deg) translateY(-3px); }
.stellar-sample-page img { width: 100%; height: auto; }
.stellar-sample-stage .text-link { font-size: 16px; margin-top: 30px; }
.stellar-contents .stellar-kicker { font-size: 16px; margin-bottom: 18px; }
.stellar-contents > h3 { font-size: 43px; line-height: 1.1; margin-bottom: 21px; }
.stellar-content-row { display: flex; gap: 23px; padding: 21px 0; border-bottom: 1px solid var(--line); }
.stellar-content-row > span { color: var(--muted); font-size: 17px; padding-top: 3px; }
.stellar-content-row h4 { font-size: 27px; line-height: 1.3; }
.stellar-content-row p { font-size: 18px; color: var(--muted); line-height: 1.55; max-width: 385px; margin-top: 7px; }
.stellar-contents > .button { margin-top: 30px; }
.stellar-page-index { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; border-top: 1px solid var(--line); margin-top: 58px; padding-top: 20px; gap: 20px; }
.stellar-page-index > span { grid-column: 1 / -1; color: var(--muted); font-size: 16px; }
.stellar-page-index button { display: flex; align-items: center; text-align: left; gap: 12px; background: transparent; color: var(--ink); border: 0; border-bottom: 1px solid var(--line); padding: 13px 0; font: 500 19px/1.4 var(--serif); }
.stellar-page-index button > span:last-child { margin-left: auto; }
.stellar-page-index button:hover { border-color: var(--ink); }
.stellar-approach { padding-block: 90px 85px; }
.stellar .system-explorer { background: #18152d; color: var(--ink); border: 1px solid #3d3357; }
.stellar .system-tabs { border-color: #3d3357; }
.stellar .system-tabs button { border-color: #3d3357; font: 500 22px var(--serif); gap: 15px; padding: 23px; }
.stellar .system-tabs button span:first-child { font: 13px var(--serif); }
.stellar .system-tabs button span:last-child { font: 16px var(--serif); }
.stellar .system-tabs button[aria-selected=true], .stellar .system-tabs button:hover { background: #29213f; }
.stellar .system-tabs button[aria-selected=true]:after { background: #d2ad77; }
.stellar .system-stage { padding: 38px 70px; min-height: 380px; gap: 70px; }
.stellar .celestial-diagram { max-width: 280px; color: #b399c4; }
.stellar .diagram-symbol { background: #18152d; border-radius: 50%; width: 88px; height: 88px; display: grid; place-items: center; font: 58px var(--serif); color: var(--rust); }
.stellar .system-panel .eyebrow { color: #b6a3cc; text-transform: none; letter-spacing: 0; font-size: 16px; }
.stellar .system-panel h3 { font-size: 45px; margin: 14px 0 20px; }
.stellar .system-panel > p:not(.eyebrow) { font-size: 19px; line-height: 1.6; max-width: 420px; color: #bab0cd; }
.stellar .system-panel li { font-size: 14px; border-color: #635078; color: #c4b2d5; padding: 5px 11px; }
.stellar .light-link { color: #e0c796; font-size: 16px; }
/* One statement, one paragraph, and a lot of air. The section sits between
   the chapter index and Rhea, both of which are dense, so its job is to
   slow the page down rather than add to it. */
.stellar-rhea { display: grid; grid-template-columns: .85fr 1.15fr; gap: 75px; align-items: center; padding: 60px 65px; background: #211a30; margin-bottom: 95px; }
.stellar-rhea-photo { max-width: 448px; }
.stellar-rhea-photo img { width: 100%; height: auto; filter: none; }
.stellar-rhea > div > p:not(.stellar-kicker) { font-size: 19px; color: #bdb2cb; line-height: 1.6; margin-top: 23px; max-width: 440px; }
.stellar-rhea .text-link { margin-top: 25px; }

.stellar .faq-heading .text-link { font-size: 17px; }
.stellar .faq-list summary { font-size: 26px; }
.stellar .faq-list summary > span { color: #c0a47e; }
.stellar .faq-list details p { color: #b8afc8; font-size: 18px; line-height: 1.7; }
.stellar-close { padding-block: 65px 80px; border-block: 1px solid #3a2f4a; text-align: center; background: linear-gradient(#1011244d,#0c0d20d9),url('/static/img/preview/stellar-nebula.webp') center 55% / cover; }
.stellar-close-star { font-size: 52px; color: var(--rust); display: block; line-height: 1; margin-bottom: 24px; }
.stellar-close h2 { font-size: 74px; line-height: 1; letter-spacing: -1.5px; }
.stellar-close p { font-size: 20px; color: #c4b8d0; margin: 25px 0 30px; }
.stellar-close small { display: block; font-size: 15px; color: #afa2c0; margin-top: 19px; }
.stellar .site-footer { background: #0b0c1d; }
.stellar .footer-top > p { font-style: normal; color: #bfb4cc; }
.stellar .footer-top nav { font-size: 16px; }
.stellar .footer-bottom { font-size: 13px; }
.stellar .footer-disclosure { font-size: 14px; line-height: 1.65; }
.stellar .preview-dock { background: #18182df5; border-color: #524463; color: #dcd1e7; box-shadow: 0 6px 30px #0005; }
.stellar .dock-title { font-size: 11px; letter-spacing: .7px; }
.stellar .dock-title small { font-size: 11px; }
.stellar .preview-dock nav { font-size: 14px; }
.stellar .preview-dock nav a[aria-current], .stellar .preview-dock nav a:hover { background: #352845; color: #ecd4a4; }
.stellar .dock-note { font-size: 11px; }
.stellar .dock-compare select { font-size: 14px; }
.stellar .compare-label { font-size: 12px; }
.stellar .gallery-image { background: #111022; }
.stellar .gallery-disclaimer { font-size: 14px; }
.stellar .gallery-top .eyebrow, .stellar .gallery-controls p { font-size: 13px; }
.stellar .gallery-dialog::backdrop { background: #040613da; }

/* Keep the working intake and review interactions, with a calmer type scale. */
.stellar .flow-shell, .stellar .flow-review, .stellar .flow-complete, .stellar .flow-contact, .stellar .flow-privacy { --flow-paper: #151428; --flow-soft: #27213a; }
.stellar .flow-intro h1 em, .stellar .flow-centered-head h1 em, .stellar .flow-complete h1 em, .stellar .flow-contact h1 em, .stellar .flow-privacy h1 em { font-style: normal; }
.stellar .flow-intro h1 { font-size: 72px; line-height: 1.04; }
.stellar .flow-intro-copy > p:last-child, .stellar .flow-centered-head > p:last-child, .stellar .flow-step-description, .stellar .flow-contact-intro > p:not(.eyebrow):not(.flow-contact-caption), .stellar .flow-letter-card > p:not(.eyebrow):not(.flow-hint), .stellar .flow-contact-topic p, .stellar .flow-privacy-heading > p:not(.eyebrow), .stellar .flow-policy-content p, .stellar .flow-next-chapters p, .stellar .flow-complete-lede { font-size: 18px; line-height: 1.6; }
.stellar .flow-intro-note p, .stellar .flow-hint, .stellar .flow-preview-note, .stellar .flow-review-foot, .stellar .flow-complete-footer, .stellar .flow-letter-signoff, .stellar .flow-privacy-preview p, .stellar .flow-policy-date, .stellar .flow-policy-content .flow-policy-original { font-size: 14px; }
.stellar .flow-policy-list { font-size: 18px; line-height: 1.6; }
.stellar .flow-policy-list li { margin-bottom: 10px; }
.stellar .flow-back-link, .stellar .flow-progress li, .stellar .flow-field > label, .stellar .flow-checkbox, .stellar .flow-card-head .text-link, .stellar .flow-details > div, .stellar .flow-order-line, .stellar .flow-inclusions li, .stellar .flow-complete-actions > .text-link { font-size: 16px; }
.stellar .flow-progress li > span, .stellar .flow-field > label > span, .stellar .flow-step-label, .stellar .flow-policy-number { font-size: 13px; }
.stellar .flow-step-label { text-transform: none; letter-spacing: .25px; }
.stellar .flow-field input, .stellar .flow-field textarea, .stellar .flow-field select { color: #ece5f1; background: #101023; border-color: #45405a; font-size: 18px; }
.stellar .flow-field input::placeholder, .stellar .flow-field textarea::placeholder { color: #978fa9; }
.stellar .flow-field input:focus, .stellar .flow-field textarea:focus, .stellar .flow-field select:focus { background: #1f1932; }
.stellar .flow-field input:disabled { background: #272337; }
.stellar .flow-notice { border-color: #9781b3; font-size: 16px; }
.stellar .flow-orbit svg { stroke: #8c79aa; }
.stellar .flow-focus-content { background: #151428; border-color: #45405a; }
.stellar .flow-focus-content strong { font-size: 17px; }
.stellar .flow-focus-content small { font-size: 14px; color: var(--muted); }
.stellar .flow-focus input:checked + .flow-focus-content { background: #312642; border-color: #bea170; }
.stellar .flow-focus-mark { color: var(--rust); }
.stellar .flow-review-tags span { background: #302342; color: #d4bddf; font-size: 15px; }
.stellar .flow-review-note, .stellar .flow-privacy-aside > p { font-style: normal; }
.stellar .flow-mini-book { background: #23213e url('/static/img/preview/stellar-nebula.webp') right center / cover; width: 196px; box-shadow: -4px 0 0 #2e2545, 4px 3px 0 #a8a0a0, 7px 5px 0 #d7cbb4, 10px 9px 0 #80778b, 16px 19px 25px #0004; }
.stellar .flow-book-brand { font-size: 9px; letter-spacing: 1px; }
.stellar .flow-book-subtitle { font-size: 10px; }
.stellar .flow-book-name { font-size: 15px; }
.stellar .flow-book-title { font-size: 29px; }
.stellar .flow-book-title em { font-style: normal; }
.stellar .flow-order-line { flex-wrap: wrap; gap: 12px; }
.stellar .flow-order-line strong { font-size: 46px; line-height: 1.2; color: #f0d5a2; white-space: nowrap; font-variant-numeric: lining-nums; }
.stellar .flow-order-line strong small { font-size: 16px; color: var(--ink); }
.stellar .flow-order-card .eyebrow { font-size: 13px; }
.stellar .flow-inclusions li:before { color: var(--rust); font-size: 14px; }
.stellar .flow-complete-notice { background: #241f38; border-color: #443451; }
.stellar .flow-complete-notice p { color: #c9bcd7; font-size: 16px; }
.stellar .flow-complete-notice > span { color: var(--rust); }
.stellar .flow-email-link { border-color: var(--line); font-size: 21px; }
.stellar .flow-sample-button, .stellar .flow-clear-button, .stellar .flow-status { font-size: 14px; }

/* Desk controls share the same family and palette. The page remains paper. */
.stellar .desk-intro, .stellar .desk-person a, .stellar .desk-due, .stellar .desk-search input, .stellar .desk-filters button, .stellar .reading-chapter-heading p { font-size: 17px; }
.stellar .desk-stat-label, .stellar .desk-small, .stellar .desk-next-description, .stellar .desk-review-note li, .stellar .desk-demo-note, .stellar .reading-editor-foot, .stellar .reading-chapter-controls button, .stellar .reading-preview-heading h2, .stellar .reading-preview-caption, .stellar .reading-keep-editing { font-size: 14px; }
.stellar .desk-stat-foot, .stellar .desk-person > div > span, .stellar .desk-due > span, .stellar .desk-table-foot, .stellar .desk-table-head, .stellar .desk-filters button span, .stellar .desk-status, .stellar .reading-draft-badge { font-size: 12px; }
.stellar .desk-filters button span { background: #332945; }
.stellar .desk-filters button.is-active span { background: var(--rust); color: var(--paper); }
.stellar .desk-row:hover { background: #231c35; }
.stellar .desk-avatar { color: #e5d5ef; }
.stellar .desk-avatar.sand { background: #443647; }
.stellar .desk-avatar.sage { background: #36324d; }
.stellar .desk-avatar.rose { background: #4b2c49; }
.stellar .desk-status { color: #ccbce0; background: #30273e; }
.stellar .desk-status.attention { color: #e5c594; background: #3d2c35; }
.stellar .desk-status.completed { border-color: #50405e; background: transparent; }
.stellar .desk-next { background: #29213e; color: var(--ink); border: 1px solid #594567; }
.stellar .desk-next > a { color: var(--rust); font-size: 17px; border-color: #554164; }
.stellar .desk-orbit-core, .stellar .desk-orbit b { background: #29213e; }
.stellar .desk-orbit { border-color: #89739c; }
.stellar .desk-orbit-ring { border-color: #685079; }
.stellar .desk-orbit:before, .stellar .desk-orbit:after { background: #685079; }
.stellar .desk-next-detail { font-size: 13px; color: #c0afce; }
.stellar .desk-stat-note p, .stellar .desk-review-note h3 { font-style: normal; }
.stellar .reading-section-nav button { color: var(--muted); font-size: 15px; }
.stellar .reading-section-nav button.is-active { background: #2c2340; color: var(--ink); }
.stellar .reading-editor { background: #181529; border-color: #49405a; }
.stellar .reading-editor-top > .eyebrow, .stellar .reading-chapter-heading > span { font-size: 12px; letter-spacing: .5px; }
.stellar .reading-textarea { font-size: 20px; line-height: 1.65; }
.stellar .reading-review-flag { background: #362536; border-color: #c5a06e; }
.stellar .reading-review-flag strong, .stellar .reading-review-flag p { color: #d1b5bf; font-size: 14px; }
.stellar .reading-paper { --ink: #302743; --rust: #927546; --muted: #71667f; --line: #d9d2dd; color: var(--ink); background: #f7f2ee; border-color: #bfb3c6; box-shadow: 0 5px 28px #0004, 3px 4px 0 -1px #e6dde4; }
.stellar .reading-paper h3 { font-style: normal; }
.stellar .reading-feedback { color: #d4c3e5; background: #2b223d; border-color: #59476c; font-size: 16px; }
.stellar .reading-approval-dialog > p:not(.eyebrow) { font-size: 17px; }
.stellar .reading-approval-dialog h2 { font-style: normal; }
.stellar .reading-approval-summary > span { font-size: 14px; }
.stellar .reading-approval-dialog .button { font-size: 17px; }

@media (max-width: 1100px) {
  .stellar .site-nav { gap: 19px; font-size: 15px; }
  .stellar .header-cta { font-size: 15px; gap: 10px; }
  .stellar-hero { gap: 45px; padding-top: 55px; }
  .stellar-hero-copy h1 { font-size: 88px; }
  .stellar-description { font-size: 19px; }
  .stellar-book { width: 285px; }
  .stellar-book h2 { font-size: 37px; }
  .stellar-book .stellar-chart { width: 126px; }
  .stellar-actions { gap: 20px; }
  .stellar .button { gap: 20px; padding-inline: 22px; }
  .stellar-inside-grid { gap: 50px; }
  .stellar .system-tabs button { font-size: 20px; gap: 10px; padding: 20px 15px; }
  .stellar-rhea { gap: 50px; padding: 40px; }
  .stellar .system-stage { gap: 45px; padding: 35px 40px; }
  .stellar .flow-intro h1 { font-size: 62px; }
}
@media (max-width: 900px) {
  .stellar .site-nav { gap: 13px; font-size: 14px; }
  .stellar .wordmark { font-size: 29px; }
  .stellar .header-cta { font-size: 14px; }
  .stellar-hero { gap: 35px; padding-top: 45px; }
  .stellar-hero-copy h1 { font-size: 76px; }
  .stellar-description { font-size: 18px; }
  .stellar-book { width: 252px; padding: 12px; }
  .stellar-book-border { padding: 14px 11px; }
  .stellar-book-brand { font-size: 12px; }
  .stellar-book h2 { font-size: 34px; }
  .stellar-book-star { font-size: 24px; margin: 8px 0; }
  .stellar-book .stellar-chart { width: 112px; margin-block: 10px 4px; }
  .stellar-book-border > p { font-size: 9px; }
  .stellar-book-bottom small { font-size: 6px; margin-top: 9px; }
  .stellar-actions { flex-wrap: wrap; gap: 16px; }
.stellar-inside-grid { gap: 35px; }
  .stellar-sample-stage { padding-inline: 23px; }
  .stellar-sample-page { width: 220px; }
  .stellar-contents > h3 { font-size: 36px; }
  .stellar-content-row { gap: 17px; padding-block: 16px; }
  .stellar-content-row p { font-size: 17px; }
  .stellar-rhea { gap: 35px; padding: 30px; }
  .stellar-rhea-photo img { height: auto; }
  .stellar .system-tabs button { font-size: 18px; }
  .stellar .system-stage { padding: 30px; gap: 30px; }
  .stellar .system-panel h3 { font-size: 38px; }
  .stellar .system-panel > p:not(.eyebrow) { font-size: 18px; }
  .stellar .flow-intro h1 { font-size: 54px; }
  .stellar .flow-progress li { font-size: 13px; }
}
@media (max-width: 700px) {
  .stellar { background-position: center 650px; background-size: 1200px auto; }
  .stellar .site-header { height: 83px; }
  .stellar .wordmark { font-size: 29px; gap: 8px; }
  .stellar .header-cta { font-size: 13px; gap: 8px; }
  .stellar .site-nav { top: 82px; font-size: 18px; background: #141227; }
  .stellar-hero { grid-template-columns: 1fr; padding-top: 38px; padding-bottom: 32px; gap: 36px; }
  .stellar-kicker { font-size: 17px; margin-bottom: 21px; }
  .stellar-hero-copy h1 { font-size: 76px; letter-spacing: -2px; line-height: .97; margin-bottom: 25px; }
  .stellar-description { font-size: 19px; line-height: 1.55; max-width: 450px; }
  .stellar-actions { gap: 24px; margin-top: 25px; }
  .stellar .button { font-size: 17px; min-height: 52px; padding: 13px 20px; gap: 22px; }
  .stellar .text-link { font-size: 16px; gap: 13px; }
  .stellar-price strong { font-size: 64px; }
  .stellar-final-offer { grid-template-columns: 1fr; gap: 30px; }
  .stellar-offer-purchase { padding: 25px; }
  .stellar-product { max-width: 440px; width: 100%; margin:auto; padding-top: 28px; }
  .stellar-book { width: 265px; padding: 13px; }
  .stellar-book-border { padding: 16px 12px; }
  .stellar-book-brand { font-size: 13px; }
  .stellar-book h2 { font-size: 36px; }
  .stellar-book .stellar-chart { width: 121px; }
  .stellar-book-border > p { font-size: 10px; }
.stellar-orbit-one { inset: 7% 0 17%; }
  .stellar-orbit-two { inset: 27% 0 38%; }
  .stellar-orbit-star { top: 3%; right: 3%; font-size: 34px; }
.stellar-heading { text-align:left; margin-bottom: 30px; }
.stellar-heading > p:last-child { font-size: 18px; }
  .stellar-heading > p:last-child br { display: none; }
  .stellar-inside { padding-block: 58px 48px; }
  .stellar-inside .stellar-heading { display: block; margin-bottom: 32px; }
  .stellar-inside-grid { grid-template-columns: 1fr; gap: 34px; }
  .stellar-sample-stage { padding: 22px 28px; }
  .stellar-sample-page { width: 100%; }
  .stellar-page-fan { max-width: 370px; }
  .stellar-page-index { grid-template-columns: 1fr 1fr; gap: 10px 20px; margin-top: 32px; }
  .stellar-page-index button { font-size: 17px; gap: 8px; }
  .stellar-contents > h3 { font-size: 38px; }
  .stellar-content-row p { font-size: 18px; }
  .stellar-approach { padding-block: 58px; }
  .stellar .system-tabs button { font-size: 19px; padding: 16px 13px; gap: 9px; }
  .stellar .system-tabs button span:first-child { font-size: 12px; }
  .stellar .system-stage { grid-template-columns: 1fr; padding: 30px 23px; gap: 22px; }
  .stellar .celestial-diagram { max-width: 225px; }
  .stellar .diagram-symbol { width: 64px; height:64px; font-size: 48px; }
  .stellar .system-panel h3 { font-size: 39px; }
  .stellar .system-panel > p:not(.eyebrow) { font-size: 18px; }
  .stellar .system-panel li { font-size: 14px; }
.stellar-rhea { grid-template-columns: 1fr; padding: 27px; gap: 32px; margin-bottom: 55px; }
  .stellar-rhea-photo { width: 100%; margin:auto; }
  .stellar-rhea-photo img { height: auto; }
  .stellar-rhea > div > p:not(.stellar-kicker) { font-size: 18px; }
  .stellar .faq-section { gap: 25px; }
  .stellar .faq-list summary { font-size: 24px; }
  .stellar .faq-list details p { font-size: 18px; }
  .stellar-close { padding-block: 55px; }
  .stellar-close h2 { font-size: 58px; }
  .stellar-close p { font-size: 19px; }
  .stellar-close small { font-size: 13px; max-width: 290px; margin-inline:auto; }
  .stellar .footer-top nav { font-size: 15px; }
  .stellar .footer-bottom { font-size: 12px; }
  .stellar .footer-disclosure { font-size: 13px; }
  .stellar .preview-dock nav { font-size: 12px; }
  .stellar .preview-dock nav a { padding-inline: 7px; }
  .stellar .dock-title { font-size: 10px; }
  .stellar .dock-title small { font-size: 10px; }
  .stellar .dock-note { font-size: 9px; }
  .stellar .dock-compare select { font-size: 13px; }
  .stellar .compare-label { font-size: 11px; }
  .stellar .flow-intro h1 { font-size: 55px; }
  .stellar .flow-progress li { font-size: 13px; gap: 5px; }
  .stellar .flow-progress li > span { font-size: 12px; }
  .stellar .flow-field input, .stellar .flow-field textarea, .stellar .flow-field select { font-size: 18px; }
  .stellar .flow-form-panel { padding-inline: 20px; }
  .stellar .flow-card-head .text-link { font-size: 14px; }
  .stellar .desk-filters { gap: 15px; }
  .stellar .desk-filters button { font-size: 15px; }
  .stellar .desk-status { font-size: 11px; }
  .stellar .desk-person a { font-size: 17px; }
}
@media (max-width: 380px) {
  .stellar .wordmark { font-size: 25px; gap: 6px; }
  .stellar .wordmark svg { width: 26px; }
  .stellar .header-cta { font-size: 12px; gap: 5px; }
  .stellar-hero-copy h1 { font-size: 67px; }
  .stellar-actions { gap: 18px; }
  .stellar .button { font-size: 16px; padding-inline: 15px; gap: 18px; }
  .stellar-book { width: 235px; }
  .stellar-book .stellar-chart { width: 107px; }
  .stellar-book h2 { font-size: 32px; }
  .stellar-book-border { padding-block: 13px; }
  .stellar-book-bottom small { font-size: 5px; }
  .stellar .system-tabs button { font-size: 17px; padding-inline: 10px; gap: 6px; }
  .stellar .flow-progress li { font-size: 12px; gap: 4px; }
  .stellar .flow-progress li > span { width: 19px; height: 19px; }
  .stellar .flow-form-panel { padding-inline: 15px; }
  .stellar .desk-filters { gap: 10px; }
  .stellar .desk-filters button { font-size: 14px; }
  .stellar .desk-filters button span { margin-left: 3px; font-size: 11px; }
}
/* Contain the decorative orbits and blend the sky into the page. */
.stellar-opening { overflow: clip; }
.stellar {
  background-image: linear-gradient(to bottom, #0c0d20 0%, #0c0d2000 18%, #0c0d2000 55%, #0c0d20 100%), url('/static/img/preview/stellar-nebula.webp');
  background-size: 1600px 901px, 1600px auto;
  background-position: center 25px;
  background-repeat: no-repeat;
}
.stellar-description, .stellar-content-row p, .stellar-rhea > div > p:not(.stellar-kicker), .stellar .system-panel > p:not(.eyebrow), .stellar .faq-list details p { font-weight: 500; }
.stellar .flow-orbit > span { display: none; }
@media (max-width: 700px) {
  .stellar { background-size: 1200px 680px, 1200px auto; background-position: center 650px; }
}

.stellar[data-preview-page="desk"], .stellar[data-preview-page="reading"] {
  background-image: linear-gradient(to bottom, #0c0d2077, #0c0d20 95%), url('/static/img/preview/stellar-nebula.webp');
}

/* ---- production refinements ---- */
body:not(.stellar) .rhea-copy .eyebrow, body:not(.stellar) .faq-heading .eyebrow, body:not(.stellar) .inside-copy .eyebrow, body:not(.stellar) .section-heading .eyebrow, body:not(.stellar) .hero-copy .eyebrow { font: 500 17px/1.4 var(--serif); letter-spacing: 0; text-transform: none; color: var(--rust); }
.faq-heading .text-link, .book-caption .text-link, .rhea-copy .text-link { font-size: 18px; }
.book-meta { font: 500 16px/1.4 var(--serif); letter-spacing: 0; }
/* The strip used to hold three things and the phone rules hid two of them
   by position. With one label left it was both first and last child, so
   the phone showed an empty band. */
/* ---- motion, states and the tagline moment ---- */
h1, h2, h3 { text-wrap: balance; }
a, button { transition: background-color .45s cubic-bezier(.32,.72,0,1), color .45s cubic-bezier(.32,.72,0,1), border-color .45s cubic-bezier(.32,.72,0,1), transform .45s cubic-bezier(.32,.72,0,1), opacity .45s cubic-bezier(.32,.72,0,1); }
.button:active { transform: translateY(1px); }
.text-link:active, .site-nav a:active, .header-cta:active { transform: translateY(1px); }
.button[disabled], .button[aria-busy="true"] { opacity: .7; cursor: progress; transform: none; }
.site-nav a[aria-current], .header-cta[aria-current] { color: var(--rust); }
.menu-toggle span { transition: transform .45s cubic-bezier(.32,.72,0,1), opacity .45s cubic-bezier(.32,.72,0,1); transform-origin: center; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
@media (max-width: 700px) {
  .site-nav.open a { animation: nav-rise .6s cubic-bezier(.32,.72,0,1) both; }
  .site-nav.open a:nth-child(2) { animation-delay: .06s; } .site-nav.open a:nth-child(3) { animation-delay: .12s; }
  .site-nav.open a:nth-child(4) { animation-delay: .18s; } .site-nav.open a:nth-child(5) { animation-delay: .24s; }
}
@keyframes nav-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.tagline-section { padding-block: 72px 24px; }
.tagline-reveal { font: 500 clamp(32px, 4vw, 54px)/1.15 var(--serif); letter-spacing: -1px; max-width: 900px; margin: 0; color: var(--ink); text-wrap: balance; }
/* Words that arrive with the scroll (the tagline and the section headings):
   each word waits as faint, low and soft, and rises into full ink in
   reading order once its block is in view. The stagger is capped so a
   long sentence still finishes inside a second and a half. */
[data-reveal-words] .w { display: inline-block; opacity: .28; transform: translateY(.35em); filter: blur(3px); transition: opacity .75s cubic-bezier(.32,.72,0,1), transform .75s cubic-bezier(.32,.72,0,1), filter .75s cubic-bezier(.32,.72,0,1); transition-delay: min(calc(var(--i, 0) * 55ms), 1400ms); }
[data-reveal-words].on .w { opacity: 1; transform: none; filter: none; }
@media (max-width: 700px) { .tagline-section { padding-block: 44px 8px; } }
@media (prefers-reduced-motion: reduce) { [data-reveal-words] .w { opacity: 1; transform: none; filter: none; transition: none; } .site-nav.open a { animation: none; } }

/* The hero kicker (after Magic UI's animated-shiny-text): brass at rest,
   with a band of light passing over the words every few seconds, the way
   a gilt line catches a lamp. Clipped to the glyphs, so it is the text
   that shines and nothing around it. */
/* Every gold kicker on the page shines the same way, each on its own
   beat (site.js staggers them). On paper the sweep is a lighter brass,
   since white would vanish into the page. Section kickers also carry a
   short brass rule before the words, the editorial eyebrow. */
body.stellar { --kicker-shine: #fff6dc; }
body.stellar .daybreak, body.stellar .stellar-paper { --kicker-shine: #e2b07a; }
body.stellar .daybreak .stellar-rhea { --kicker-shine: #fff6dc; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  body.stellar .stellar-kicker {
    --shine: 120px;
    background-image: linear-gradient(100deg, var(--rust) 0%, var(--rust) 40%, var(--kicker-shine) 50%, var(--rust) 60%, var(--rust) 100%);
    background-size: 250% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: shiny-text 7s cubic-bezier(.6, .6, 0, 1) infinite;
  }
}
@keyframes shiny-text {
  0%, 82%, 100% { background-position: calc(100% + var(--shine, 100px)) 0; }
  36%, 64% { background-position: calc(-100% - var(--shine, 100px)) 0; }
}
@media (max-width: 700px) {
  .hero-actions .button { font-size: 18px; padding: 14px 22px; gap: 14px; }
  .hero-actions .text-link { font-size: 17px; }
}

/* ---- tonight's sky: a quiet plate under the hero ---- */
.skybar { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 22px 0; margin-top: 8px; }
.skybar-in { display: flex; align-items: center; gap: 26px; }
.moon { width: 64px; height: 64px; flex: none; }
.moon-dark { fill: #e4dfd2; }
.moon-lit { fill: #f3ead3; }
.moon-limb { fill: none; stroke: var(--olive); stroke-width: 1.2; }
.skybar-label { font-size: 17px; font-weight: 500; margin: 0 0 2px; }
.skybar-label span { color: var(--muted); font-weight: 400; margin-left: 10px; }
.skybar-line { font-size: 19px; line-height: 1.5; margin: 0; }
.skybar-note { font-size: 16px; color: var(--muted); margin: 4px 0 0; }
@media (max-width: 700px) { .skybar-in { align-items: flex-start; gap: 16px; } .moon { width: 52px; height: 52px; } .skybar-line { font-size: 18px; } }

/* ---- what is included ------------------------------------------------
   The product is a book, so this section is measured in pages. Two
   decisions carry it, and both have the same reason: the shape of the
   reading should be visible before a word of it is read.

   1. The extent bar. Eight bands, each as wide as its chapter's true
      share of the thirty two pages. Western astrology is eleven pages
      and looks it; the archetype is one page and looks it. It is the
      identity motif of this section and nothing else could use it.
   2. Chapter weight. A row's title scales with its extent, so the list
      is not eight identical rows pretending every chapter is equal.
      This is deliberate variation, not decoration.

   The real pages sit inside the open chapter rather than behind a link:
   the section claims to show what is on the pages, so it shows them.
   Built on <details>, like the FAQ, so it needs no JavaScript and the
   keyboard works without help. */
.included-section { padding-block: 85px; }

.extent { margin-top: 6px; }
.extent-bar { display: flex; gap: 6px; }
.extent-seg { position: relative; display: block; padding-top: 24px; }
.extent-seg i { display: block; height: 14px; background: #4b4770; transition: background .45s cubic-bezier(.32,.72,0,1); }
.extent-front i { background: transparent; border: 1px solid #3b3856; height: 12px; }
.extent-seg b { position: absolute; top: 0; left: 0; font-weight: 400; font-size: 15px; color: var(--muted); }
.extent-note { display: flex; justify-content: space-between; margin-top: 11px; font-size: 15px; color: var(--muted); }
.extent-note span:nth-child(2) { font-style: italic; }

.chapters { list-style: none; margin: 40px 0 0; padding: 0; border-top: 1px solid var(--line); }
.chapter { border-bottom: 1px solid var(--line); }
.chapter > details > summary {
  list-style: none; cursor: pointer; display: grid; align-items: baseline;
  grid-template-columns: 3.4rem minmax(0, 1fr) 7rem 1.6rem; gap: 24px;
  /* the taller the chapter, the more air it gets */
  padding: calc(14px + var(--span) * 1.1px) 0;
}
.chapter > details > summary::-webkit-details-marker { display: none; }
.ch-num { font-size: 16px; letter-spacing: .14em; color: var(--muted); }
/* one page reads at 22px, eleven pages at 34px */
.ch-name { font: 500 calc(21px + var(--span) * 1.15px)/1.15 var(--serif); }
.ch-extent { font-size: 16px; color: var(--muted); text-align: right; font-variant-numeric: tabular-nums; }
.ch-extent b { font-weight: 400; color: var(--ink); }
.ch-mark { position: relative; justify-self: end; width: 14px; height: 14px; align-self: center; }
.ch-mark::before, .ch-mark::after {
  content: ""; position: absolute; inset: 50% 0 auto; height: 1px; background: var(--ink);
  transition: transform .45s cubic-bezier(.32,.72,0,1), opacity .45s cubic-bezier(.32,.72,0,1);
}
.ch-mark::after { transform: rotate(90deg); }
.chapter > details[open] .ch-mark::after { transform: rotate(0deg); opacity: 0; }
.chapter > details > summary:hover .ch-name { color: var(--rust); }
.chapter > details > summary:focus-visible { outline: 2px solid var(--rust); outline-offset: 3px; }

.ch-body { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr) auto; gap: 24px; padding-bottom: 34px; align-items: start; }
.ch-lines { grid-column: 2; list-style: none; margin: 0; padding: 0; }
.ch-lines li { font-size: 19px; line-height: 1.5; padding: 10px 0; border-top: 1px solid var(--line); }
.ch-lines li:first-child { border-top: 0; padding-top: 0; }
.ch-plates { grid-column: 3; grid-row: 1; display: flex; gap: 20px; padding-left: 20px; }
.ch-plates figure { margin: 0; width: 200px; }
.ch-plates button { display: block; padding: 0; background: none; border: 1px solid var(--line); width: 100%; }
.ch-plates img { width: 100%; height: auto; }
.ch-plates button:hover { border-color: var(--rust); transform: translateY(-3px); }
.ch-plates button:focus-visible { outline: 2px solid var(--rust); outline-offset: 3px; }
.ch-plates figcaption { margin-top: 9px; font-size: 15px; line-height: 1.4; color: var(--muted); }

/* The detail flows in and out rather than snapping. <details> cannot be
   animated on its own, so this uses ::details-content with a keyword size
   interpolation and a mask that starts as a soft gradient edge and opens
   out of the way. A browser without ::details-content opens instantly,
   which is where this started. */
:root { interpolate-size: allow-keywords; }
.chapter > details::details-content {
  block-size: 0; overflow: clip; opacity: 0;
  mask-image: linear-gradient(to bottom, #000 0 8%, transparent 60%);
  mask-size: 100% 100%; mask-repeat: no-repeat;
  transition:
    block-size .6s cubic-bezier(.32,.72,0,1),
    opacity .42s cubic-bezier(.32,.72,0,1),
    mask-size .7s cubic-bezier(.32,.72,0,1),
    content-visibility .6s cubic-bezier(.32,.72,0,1) allow-discrete;
}
.chapter > details[open]::details-content { block-size: auto; opacity: 1; mask-size: 100% 600%; }
@media (prefers-reduced-motion: reduce) {
  .chapter > details::details-content { transition: none; mask-image: none; }
  .ch-plates button:hover { transform: none; }
}

/* The open chapter lights its band, so the bar answers "where am I in
   the book" instead of being a decorative rule. The first band is the
   front matter, so chapter N is band N + 1 (room for ten chapters). */
.included-section:has(.chapter:nth-child(1) > details[open]) .extent-seg:nth-child(2) i,
.included-section:has(.chapter:nth-child(2) > details[open]) .extent-seg:nth-child(3) i,
.included-section:has(.chapter:nth-child(3) > details[open]) .extent-seg:nth-child(4) i,
.included-section:has(.chapter:nth-child(4) > details[open]) .extent-seg:nth-child(5) i,
.included-section:has(.chapter:nth-child(5) > details[open]) .extent-seg:nth-child(6) i,
.included-section:has(.chapter:nth-child(6) > details[open]) .extent-seg:nth-child(7) i,
.included-section:has(.chapter:nth-child(7) > details[open]) .extent-seg:nth-child(8) i,
.included-section:has(.chapter:nth-child(8) > details[open]) .extent-seg:nth-child(9) i,
.included-section:has(.chapter:nth-child(9) > details[open]) .extent-seg:nth-child(10) i,
.included-section:has(.chapter:nth-child(10) > details[open]) .extent-seg:nth-child(11) i { background: var(--rust); }

@media (max-width: 900px) {
  .chapter > details > summary { grid-template-columns: 2.4rem minmax(0, 1fr) 1.4rem; gap: 14px; }
  .ch-extent { grid-column: 2; grid-row: 2; text-align: left; padding-top: 3px; }
  .ch-body { grid-template-columns: 2.4rem minmax(0, 1fr); gap: 14px; padding-right: 6px; }
  .ch-plates { grid-column: 2; grid-row: auto; margin-top: 22px; padding-left: 0; flex-wrap: wrap; }
}
@media (max-width: 700px) {
  .included-section { padding-block: 50px; }
  .extent-seg b { font-size: 13px; }
  .extent-note { font-size: 13px; }
  .extent-note span:nth-child(2) { display: none; }
  .ch-name { font-size: calc(20px + var(--span) * .8px); }
  .ch-lines li { font-size: 18px; }
  .ch-plates figure { width: calc(50% - 11px); }
}

/* ---- Stellar variants of the production sections ---- */
.stellar .skybar { border-color: var(--line); }
.stellar .moon-dark { fill: #262443; }
.stellar .moon-lit { fill: #f0d5a2; }
.stellar .moon-limb { stroke: #b49a6d; }
.stellar .skybar-line { color: var(--ink); }
.stellar .skybar-note, .stellar .skybar-label span { color: var(--muted); }
.stellar .tagline-reveal { color: var(--ink); }
.stellar .chapters, .stellar .chapter { border-color: #423f5e; }
.stellar .ch-lines li { border-color: #302e47; color: var(--ink); }
.stellar .ch-name { color: var(--ink); }
.stellar .ch-num, .stellar .ch-extent, .stellar .extent-note, .stellar .extent-seg b { color: var(--muted); }
.stellar .ch-extent b { color: var(--ink); }
.stellar .extent-seg i { background: #4b4770; }
.stellar .ch-mark::before, .stellar .ch-mark::after { background: var(--muted); }
.stellar .ch-plates button { border-color: #423f5e; }
.stellar .ch-plates figcaption { color: var(--muted); }
.stellar .section-heading .eyebrow, .stellar .stellar-kicker { color: var(--rust); }
.stellar .errbox { background: #2a1d24; border-color: #a95f45; }
.stellar .place-list { background: #17162c; border-color: var(--line); }
.stellar .place-option { color: var(--ink); border-color: var(--line); }
.stellar .place-option:hover { background: #28213f; }
/* A background swap of 1.16:1 was the whole focus indicator, on the very
   keyboard path the picker exists to serve. */
.stellar .place-option:focus-visible, .place-option:focus-visible {
  background: #28213f; outline: 2px solid var(--rust); outline-offset: -2px;
}
.stellar .place-confirmed { color: #b9d2a3; }
/* Rust on near black is 2.9:1, and these three are the only text on the
   intake that fails: the lines that tell a blocked customer what is wrong. */
.stellar .flow-field .err, .stellar .place-pending,
.stellar .flow-field.has-error > label { color: #e9ab90; }
.stellar .flow-field.has-error input, .stellar .flow-field.has-error select { border-color: #dcbc83; }
.stellar .menu-toggle span { background: var(--ink); }

/* ---- what the interface work found ---- */
/* A first name long enough to fill the line used to run off a narrow phone. */
.flow-complete h1, .flow-centered-head h1, .flow-intro h1 { overflow-wrap: break-word; }
@media (max-width: 360px) {
  .flow-complete h1, .flow-centered-head h1 { font-size: 42px; letter-spacing: -1px; }
}

/* ---- daybreak: the page is one night that becomes morning -------------
   The reading is printed on paper, and the sample pages are warm cream.
   Read on black they float; read on paper they are what they are. So the
   page turns over once: the sky you were born under is the ground under
   the hero, and from the horizon down the ground is the page itself.

   Why a gradient, when a gradient is usually the first thing to cut: it
   is the horizon, which is the subject. It runs once, over 400px, and
   nothing is ever set against the middle of it, because the type only
   starts after the ground has settled. A24's membership site calls this
   flip between surfaces the essential rhythm of a page; here it is also
   the argument, night on one side and the printed thing on the other. */
.daybreak {
  --ink: #2b2438;
  --muted: #675d72;
  --rust: #8a5227;
  --line: #ded3c5;
  --white: #fbf6ee;
  --olive: #57634a;
  color: var(--ink);
  color-scheme: light;
  position: relative;
  /* A real colour, not only the gradient. Forced colours mode and printing
     both drop background images, and without this the ink would land back
     on the night the body is painted with. */
  background-color: #f4ede3;
}
/* The horizon is painted over the paper rather than instead of it, so the
   ground underneath is always the page. */
.daybreak-sky {
  position: absolute; inset: 0 0 auto; height: 400px; pointer-events: none;
  background-image: linear-gradient(to bottom,
    #0c0d20 0px, #14132c 110px, #2b2140 200px,
    #60404a 270px, #b98d6e 320px, #e8d8c4 362px, #f4ede300 400px);
}
.daybreak > section, .daybreak > div:not(.daybreak-sky) { position: relative; z-index: 1; }
/* The horizon is the tagline's top margin, so the ramp is never empty
   space: the sky lightens above the sentence, and the sentence is the
   first thing you read as ink on paper. */
.daybreak > .tagline-section { padding-top: 430px; padding-bottom: 90px; }

/* The four colours that were chosen for a dark ground and cannot follow
   a token. */
.stellar .daybreak .faq-list summary > span { color: #8a5227; }
.stellar .daybreak .faq-list details p { color: #4c4458; }
.stellar .daybreak .ch-lines li { border-color: #e3d9cc; color: var(--ink); }
.stellar .daybreak .extent-seg i { background: #b9a68f; }
.stellar .daybreak .extent-front i { background: transparent; border-color: #cdbfab; }
.stellar .daybreak .chapters, .stellar .daybreak .chapter,
.stellar .daybreak .ch-plates button { border-color: #ded3c5; }
.stellar .daybreak .ch-mark::before, .stellar .daybreak .ch-mark::after { background: var(--ink); }
.stellar .daybreak .faq-list details, .stellar .daybreak .faq-list details:first-child { border-color: #ded3c5; }
/* Body weight was raised to 500 to hold up on a dark ground. On paper the
   same weight reads heavy, so it comes back down. */
.stellar .daybreak .stellar-content-row p,
.stellar .daybreak .stellar-rhea > div > p:not(.stellar-kicker),
.stellar .daybreak .faq-list details p { font-weight: 400; }

@media (max-width: 700px) {
  .daybreak-sky { height: 210px; background-image: linear-gradient(to bottom,
    #0c0d20 0px, #14132c 44px, #2b2140 92px,
    #60404a 132px, #b98d6e 162px, #e8d8c4 188px, #f4ede300 210px); }
  .daybreak > .tagline-section { padding-top: 226px; padding-bottom: 55px; }
}

/* ---- arrival ---------------------------------------------------------
   Everything arrives and leaves with the scroll. The page is a night that
   becomes morning, and things surfacing as you reach them and receding as
   you pass suits that better than a page that is simply already there.

   Done with a scroll timeline rather than a library: it runs on the
   compositor instead of the main thread, needs no JavaScript, and the
   site's content policy forbids loading a library from a CDN anyway. A
   browser without view() timelines shows the page exactly as it is, which
   is the right fallback rather than a degraded one.

   Two animations, not one, and this is the part that matters. A single
   range covers entry and exit together, so a short block like an FAQ row
   spends the tail of that range fading while it is still sitting in the
   middle of the screen being read: measured at 0.40 opacity while three
   quarters visible. Scoping each half to its own phase makes that
   impossible by construction. Between the two phases the element is fully
   on screen and both animations hold opacity 1. */
@media (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    /* Nothing above the fold. A view() timeline reads 0% for an element
       that has never entered from below, so the whole first screen faded
       itself out at load: the headline, the price and the button were
       simply not there. The first screen is also the thing being waited
       for, and it should never be waited for twice. */
    .skybar > *,
    .tagline-section,
    .stellar-heading, .stellar-inside-grid > *, .stellar-page-index,
    .included-section .section-heading, .extent, .chapter,
    .stellar-rhea > *,
    .faq-heading, .faq-list details,
    .closing-inner > *,
    .site-footer > * {
      animation: arrive-in linear both, arrive-out linear both;
      animation-timeline: view(), view();
      animation-range: entry 12% entry 88%, exit 30% exit 100%;
      will-change: opacity, transform;
    }
    /* A block taller than the window would spend its whole read inside the
       ramp, so those hold still and only change in opacity. */
    .chapter, .faq-list details, .stellar-rhea > *, .stellar-inside-grid > * {
      animation-name: arrive-in-still, arrive-out;
    }
  }
}
@keyframes arrive-in { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes arrive-in-still { from { opacity: 0; } to { opacity: 1; } }
@keyframes arrive-out { from { opacity: 1; } to { opacity: 0; } }

/* ---- measure and rhythm ----------------------------------------------
   Two faults, both measured rather than guessed.

   Measure. Lines were running to 85, 101, even 150 characters because
   nothing capped them and the container is 1240px wide. Anything past
   about 75 characters is hard to track back to the start of the next
   line, and it is exactly what "bunched up" looks like: a wall with no
   edge. Prose is now capped in ch, so the cap follows the type size
   instead of a pixel guess.

   Rhythm. Section padding was 85, 70, 110, 60, 90, 65, 80: no system,
   so no rhythm. One scale now, and it is deliberately bimodal the way
   abcdinamo's is, a large jump between sections and a small one inside
   them, so the page reads as separated rather than evenly grey. */
:root { --sp-section: 118px; --sp-block: 46px; --sp-tight: 18px; }
@media (max-width: 900px) { :root { --sp-section: 84px; --sp-block: 36px; } }
@media (max-width: 700px) { :root { --sp-section: 62px; --sp-block: 30px; } }

.skybar-label, .skybar-line, .skybar-note { max-width: 68ch; }
.ch-lines { max-width: 62ch; }
.footer-disclosure { max-width: 78ch; }
.stellar-sample-label, .extent-note span:nth-child(2) { max-width: 54ch; }

/* One word alone on a last line reads as a mistake in a serif this large. */
.skybar-note, .stellar-sample-label, .ch-lines li,
.stellar-content-row p, .faq-list details p { text-wrap: pretty; }
.included-section { padding-block: var(--sp-section); }
.faq-section, .stellar .faq-section { padding-block: var(--sp-section); }
.stellar-close { padding-block: var(--sp-section); }
.stellar-rhea { padding-block: calc(var(--sp-section) * .62); margin-bottom: var(--sp-section); }
.daybreak > .tagline-section { padding-bottom: var(--sp-section); }
.stellar-inside { padding-block: var(--sp-section); }
.skybar { padding-block: var(--sp-block); }

/* Rhea's panel is a dark island inside the paper block, so it carries the
   night tokens back. Without this it inherited the daybreak ink, which is
   near black, and printed it on a near black panel: the heading and the
   link were there and unreadable. */
.daybreak .stellar-rhea {
  --ink: #f2eada;
  --muted: #b4abc6;
  --rust: #dcbc83;
  --line: #3d3757;
  --white: #17162c;
  color: var(--ink);
  color-scheme: dark;
}
.daybreak .stellar-rhea .stellar-kicker { color: var(--rust); }

/* ==================================================================
   Touch targets: everything a finger or a pointer has to hit is at
   least 44px, on every device.

   The underlined links keep their exact look. Their underline is a
   bottom border, so growing the box would push it away from the words;
   instead the box stays as designed and an invisible ::before stretches
   the hit area to 44px around it. Stacked links (the footer column and
   the open phone menu) get a real 44px height, because invisible areas
   there would overlap the link above or below.

   `body.stellar` outranks the single-class rules in cosmos-flow.css,
   which loads after this file on the order pages.
   ================================================================== */
/* z-index: the stretched area must win where it meets the element next
   to it, or the neighbour (the first FAQ question, under "We are here to
   help") takes the last few pixels of it */
body.stellar .text-link,
body.stellar .header-cta { position: relative; z-index: 1; }
body.stellar .text-link::before,
body.stellar .header-cta::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: max(100%, 44px);
  transform: translateY(-50%);
}
body.stellar .wordmark { min-height: 44px; }
body.stellar .site-nav a,
body.stellar .footer-top nav a,
body.stellar .flow-back-link,
body.stellar .flow-back-button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
body.stellar .footer-top nav { gap: 0; }
body.stellar .flow-back-button { min-width: 44px; }
body.stellar .menu-toggle { min-width: 44px; min-height: 44px; }
body.stellar .gallery-controls button { min-width: 44px; min-height: 44px; }
@media (max-width: 700px) {
  /* 44px links need less air between them than the 20px the text had */
  body.stellar .site-nav.open { gap: 4px; }
}

/* ==================================================================
   Aurora text (after Magic UI's aurora-text, MIT). The accent word in a
   heading carries a slow brass aurora instead of one flat gold. Same
   mechanics as the original: a 135deg gradient at twice the width,
   clipped to the glyphs, its position walking a loop. The palette is
   the site's own, brass to champagne, one pass of the sky's lavender,
   and back. The original also rotates and scales its inner span, but
   that span is inline, where transforms do nothing, so only the
   position moves here as well. Under reduced motion the global rule
   stops the animation and the word stays a still gradient.
   ================================================================== */
@keyframes aurora {
  0%   { background-position: 0% 50%; }
  25%  { background-position: 50% 100%; }
  50%  { background-position: 100% 50%; }
  75%  { background-position: 50% 0%; }
  100% { background-position: 0% 50%; }
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  body.stellar .stellar-hero-copy h1 span,
  body.stellar .flow-intro h1 em,
  body.stellar .flow-centered-head h1 em,
  body.stellar .flow-complete h1 em,
  body.stellar .flow-contact h1 em,
  body.stellar .flow-privacy h1 em {
    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;
    animation: aurora 10s ease-in-out infinite alternate;
  }
}

/* ==================================================================
   Dot pattern (after Magic UI's dot-pattern). A 16px lattice of 1px
   dots on the paper surfaces only: the daybreak ground and the sample
   pages block. Night surfaces, the hero, the sky bar, Rhea's panel and
   the close, never get it. It is drawn on a pseudo-element under the
   content so a mask can fade it out at the horizon and at the foot,
   where it would otherwise stop with a hard edge.
   ================================================================== */
body.stellar .daybreak,
body.stellar .stellar-paper { position: relative; isolation: isolate; }
body.stellar .daybreak::before,
body.stellar .stellar-paper::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  /* barely there: a texture you notice only once you look for it */
  background-image: radial-gradient(circle, rgba(43, 36, 56, .065) 1px, transparent 1.5px);
  background-size: 18px 18px;
  background-position: 9px 9px;
}
body.stellar .daybreak::before {
  -webkit-mask-image: linear-gradient(to bottom, transparent 360px, #000 560px, #000 calc(100% - 220px), transparent);
  mask-image: linear-gradient(to bottom, transparent 360px, #000 560px, #000 calc(100% - 220px), transparent);
}
body.stellar .stellar-paper::before {
  -webkit-mask-image: radial-gradient(ellipse 75% 85% at 50% 50%, #000 35%, transparent 100%);
  mask-image: radial-gradient(ellipse 75% 85% at 50% 50%, #000 35%, transparent 100%);
}
@media (forced-colors: active), print {
  body.stellar .daybreak::before,
  body.stellar .stellar-paper::before { display: none; }
}

/* ==================================================================
   Pixel image (after Magic UI's pixel-image). Rhea's photo arrives as a
   6 x 4 mosaic: each tile is painted the average colour of the piece of
   the photo underneath it, and the tiles clear in a random order to the
   sharp picture. No dark or grey phase; it starts in the photo's own
   colours. One <img> keeps its alt text and lazy loading; site.js
   builds the grid, samples the colours once the photo has loaded and
   starts the reveal when the panel scrolls into view. Without it the
   photo is simply there.
   ================================================================== */
body.stellar .pixel-image { position: relative; overflow: hidden; --pixel-ground: #211a30; }
body.stellar .pixel-image > img { display: block; width: 100%; height: auto; }
body.stellar .pixel-image .pixel {
  position: absolute;
  background: var(--pixel-ground);
  opacity: 1;
  pointer-events: none;
  transition: opacity .55s cubic-bezier(.4, 0, .2, 1);
}
body.stellar .pixel-image.is-revealed .pixel { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
  body.stellar .pixel-image .pixel { display: none; }
}

/* Shooting stars on press (after Magic UI's cool-mode): one canvas over
   the page, drawn only while stars are in flight. */
body.stellar .shooting-stars {
  position: fixed; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 2147483647;
}

/* Shooting stars beside the tagline (after shadcn.io's shooting-stars
   background). A canvas in the space to the right of the sentence: a
   few faint fixed stars that twinkle, and every second or two a meteor
   crossing in from an edge. site.js places it beside the text and runs
   it only while the section is in view. Under 900px the sentence takes
   the full width and there is no "right of the text", so it is not
   drawn. */
body.stellar .tagline-stars { position: absolute; z-index: -1; pointer-events: none; }
@media (max-width: 900px) { body.stellar .tagline-stars { display: none; } }

/* ==================================================================
   Wide screens. Above 1800px the 1240px column sat in the middle of a
   27-inch monitor with the nebula stopping at its edges, which read as
   a page cut out of a bigger one. The column grows, the type grows with
   it, and the nebula spans the full width.
   ================================================================== */
@media (min-width: 1800px) {
  body.stellar { font-size: 20px; background-size: 100% auto; background-position: center 0; }
  body.stellar .container { max-width: 1560px; width: calc(100% - 200px); }
  body.stellar .site-header { height: 116px; }
  body.stellar .wordmark { font-size: 38px; }
  body.stellar .site-nav { font-size: 18px; gap: 36px; }
  body.stellar .header-cta { font-size: 18px; }
  body.stellar .stellar-hero { gap: 110px; padding-block: 110px 100px; }
  body.stellar .stellar-kicker { font-size: 21px; }
  body.stellar .stellar-hero-copy h1 { font-size: clamp(108px, 5.6vw, 150px); letter-spacing: -3.5px; margin-bottom: 30px; }
  body.stellar .stellar-description { font-size: 24px; max-width: 560px; }
  body.stellar .stellar-purchase { max-width: 560px; }
  body.stellar .stellar-price strong { font-size: 88px; }
  body.stellar .stellar-price span { font-size: 19px; }
  body.stellar .stellar-purchase .stellar-inclusions { font-size: 21px; }
  body.stellar .button { font-size: 20px; padding: 17px 32px; }
  body.stellar .text-link { font-size: 19px; }
  body.stellar .stellar-book { width: 400px; padding: 21px; }
  body.stellar .stellar-book h2 { font-size: 52px; }
  body.stellar .stellar-book .stellar-chart { width: 195px; }
  body.stellar .stellar-book-bottom strong { font-size: 28px; }
  body.stellar .daybreak > .tagline-section { padding-top: 470px; }
  body.stellar .tagline-reveal { font-size: 66px; max-width: 1080px; }
  body.stellar .stellar-heading > p:last-child { font-size: 22px; }
  body.stellar .stellar-content-row h4 { font-size: 31px; }
  body.stellar .stellar-content-row p { font-size: 20px; max-width: 460px; }
  body.stellar .stellar-rhea { padding: 80px 90px; gap: 90px; }
  body.stellar .stellar-rhea-photo { max-width: 520px; }
  body.stellar .stellar-rhea > div > p:not(.stellar-kicker) { font-size: 22px; max-width: 520px; }
  body.stellar .faq-list summary { font-size: 30px; }
  body.stellar .faq-list details p { font-size: 20px; }
  body.stellar .stellar-close h2 { font-size: 92px; }
  body.stellar .stellar-close p { font-size: 23px; }
}

/* ==================================================================
   Tonight's sky, drawn. A plate between the hero and the horizon: the
   zodiac ring with every planet at its longitude (retrograde ones
   marked), the aspects between them, the Moon with its true phase at
   the centre, and beside it a chip per planet. The glyphs come from two
   tiny subsets: the planets and signs from Noto Sans Symbols, the
   retrograde mark from EB Garamond, the only local face that has it.
   The outer dotted ring turns once every four minutes, the way the sky
   itself does over the night; everything else arrives once, when the
   plate scrolls into view, and then holds still to be read.
   ================================================================== */
@font-face { font-family: "Astro Glyphs"; src: url('/static/fonts/AstroGlyphs.ttf') format('truetype'); font-display: swap; }
@font-face { font-family: "Astro Marks"; src: url('/static/fonts/AstroMarks.ttf') format('truetype'); font-display: swap; }
body.stellar .skybar { border: 0; padding: 0; margin-top: 10px; }
body.stellar .sky-now {
  position: relative; display: grid; grid-template-columns: minmax(280px, 400px) 1fr; gap: 56px; align-items: center;
  padding: 44px 54px; border: 1px solid #2f2b48; border-radius: 3px; overflow: hidden;
  background: radial-gradient(ellipse 60% 90% at 24% 50%, #1c1938 0%, #10102500 70%), #0e0e22;
}
body.stellar .sky-stage { position: relative; min-width: 0; }
.sky-wheel { width: 100%; height: auto; display: block; overflow: visible; }
.sky-orbit { fill: none; stroke: #d5bc84; stroke-opacity: .38; stroke-width: .8; stroke-dasharray: 1 7; transform-origin: 200px 200px; animation: sky-turn 240s linear infinite; }
.sky-ring { fill: none; stroke: #5d5580; stroke-width: .8; }
.sky-ring-inner { stroke: #3f3a5c; }
.sky-tick { stroke: #6c6590; stroke-width: .7; }
.sky-tick-sign { stroke: #ab9fc7; stroke-width: 1; }
.sky-sign, .sky-glyph, .sky-chip-glyph, .sky-chip-sign { font-family: "Astro Glyphs", "Noto Sans Symbols", "Apple Symbols", "Segoe UI Symbol", "DejaVu Sans", sans-serif; }
.sky-rx, .sky-chip-rx { font-family: "Astro Marks", "EB Garamond", Georgia, serif; }
.sky-sign { font-size: 15px; fill: #cbbfe3; text-anchor: middle; dominant-baseline: central; }
.sky-aspect { fill: none; stroke-width: 1; stroke-linecap: round; opacity: .9; stroke-dasharray: 400; stroke-dashoffset: 400; transition: stroke-dashoffset 1.6s cubic-bezier(.32,.72,0,1); }
.sky-aspect-trine, .sky-aspect-sextile { stroke: #dcbc83; }
.sky-aspect-sextile { stroke-opacity: .55; }
.sky-aspect-square, .sky-aspect-opposition { stroke: #a78fd2; }
.sky-aspect-square { stroke-opacity: .7; }
.sky-stem { stroke: #dcbc83; stroke-opacity: .26; stroke-width: .6; }
.sky-moon-halo { opacity: .8; }
.sky-moon-dark { fill: #1b1833; }
.sky-moon-lit { fill: #f1dfb8; }
.sky-moon-limb { fill: none; stroke: #bca57a; stroke-width: 1; }
.sky-body > * { transform-box: fill-box; transform-origin: center; transform: scale(0); opacity: 0; transition: transform .7s cubic-bezier(.34, 1.45, .64, 1), opacity .45s ease-out; transition-delay: calc(var(--i, 0) * 90ms + 250ms); }
.sky-body-disc { fill: #12112a; stroke: #dcbc83; stroke-width: 1; }
.sky-body-sun .sky-body-disc { stroke: #f0d5a2; stroke-width: 1.4; filter: drop-shadow(0 0 7px #f0d5a2aa); }
.sky-body-moon .sky-body-disc { stroke: #e9dab5; }
.sky-sun-dot { fill: #f0d5a2; }
.sky-glyph { font-size: 13px; fill: #efe2c6; text-anchor: middle; dominant-baseline: central; }
.sky-rx { font-size: 9px; fill: #dcbc83; text-anchor: middle; dominant-baseline: central; }
.sky-now.is-live .sky-aspect { stroke-dashoffset: 0; }
.sky-now.is-live .sky-body > * { transform: none; opacity: 1; }
@keyframes sky-turn { to { transform: rotate(360deg); } }
body.stellar .sky-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 16px; margin: 12px 0 0; font-size: 12.5px; letter-spacing: .3px; color: var(--muted); }
.sky-key { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: currentColor; vertical-align: middle; margin-right: 7px; }
.sky-key-trine, .sky-key-sextile { color: #dcbc83; }
.sky-key-sextile { opacity: .55; }
.sky-key-square, .sky-key-opposition { color: #a78fd2; }
/* each key is its line: squares are drawn at .7, as sextiles at .55 */
.sky-key-square { opacity: .7; }
.sky-legend-count { color: #8f86a8; }
body.stellar .sky-read { min-width: 0; }
body.stellar .sky-bodies { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; max-width: 640px; }
body.stellar .sky-bodies li {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 13px 6px 10px; border: 1px solid #3b3659; border-radius: 999px;
  background: #14132a; color: #d8cfe6; font-size: 14.5px; letter-spacing: .1px;
  opacity: 0; transform: translateY(6px); transition: opacity .5s ease-out, transform .5s cubic-bezier(.32,.72,0,1); transition-delay: calc(var(--i, 0) * 60ms + 300ms);
}
body.stellar .sky-now.is-live .sky-bodies li { opacity: 1; transform: none; }
body.stellar .sky-bodies li.is-retro { border-color: #6b5b91; }
.sky-chip-glyph { font-size: 15px; color: #efe2c6; width: 18px; text-align: center; line-height: 1; }
.sky-chip-sun { position: relative; width: 14px; height: 14px; margin: 0 2px; border: 1.4px solid #f0d5a2; border-radius: 50%; flex-shrink: 0; }
.sky-chip-sun::after { content: ""; position: absolute; left: 50%; top: 50%; width: 3px; height: 3px; margin: -1.5px 0 0 -1.5px; border-radius: 50%; background: #f0d5a2; }
.sky-chip-name { color: #efe6d6; }
.sky-chip-place { color: #bdb1d1; font-variant-numeric: tabular-nums; }
.sky-chip-sign { color: #cbbfe3; }
.sky-chip-rx { color: var(--rust); text-decoration: none; font-size: 14px; }
.sky-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 900px) {
  body.stellar .sky-now { grid-template-columns: 1fr; gap: 26px; padding: 26px 20px 28px; }
  body.stellar .sky-stage { max-width: 340px; margin: 0 auto; width: 100%; }
  body.stellar .sky-bodies li { font-size: 13.5px; padding: 5px 11px 5px 9px; }
}
@media (min-width: 1800px) {
  body.stellar .sky-now { grid-template-columns: minmax(340px, 520px) 1fr; gap: 72px; padding: 56px 68px; }
  body.stellar .sky-bodies li { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .sky-orbit { animation: none; }
  .sky-aspect, .sky-body > *, body.stellar .sky-bodies li { transition: none; }
  .sky-aspect { stroke-dashoffset: 0; }
  .sky-body > * { transform: none; opacity: 1; }
  body.stellar .sky-bodies li { opacity: 1; transform: none; }
}

/* ==================================================================
   Footer. A brand footer rather than a signature line: the wordmark and
   what the house stands for, two short columns of links, the disclosure
   under its own heading where it can be found, then the name set very
   large and very quiet across the foot of the page, and the legal line.
   ================================================================== */
body.stellar .site-footer { padding: 72px 0 0; background: #0b0c1d; border-top: 1px solid #1f1d33; overflow: hidden; }
body.stellar .footer-grid { display: grid; grid-template-columns: 1.6fr .9fr .9fr; gap: 40px 48px; align-items: start; padding-bottom: 48px; }
body.stellar .footer-brand .wordmark { font-size: 34px; }
body.stellar .footer-tagline { font-size: 22px; line-height: 1.3; color: #d9cfe6; margin: 18px 0 14px; max-width: 22ch; }
body.stellar .footer-line { font-size: 15px; line-height: 1.6; color: var(--muted); margin: 0; max-width: 34ch; }
body.stellar .footer-col { display: flex; flex-direction: column; gap: 2px; }
body.stellar .footer-heading { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--rust); margin: 8px 0 12px; font-weight: 500; }
body.stellar .footer-col a { display: inline-flex; align-items: center; min-height: 40px; font-size: 16px; color: #cfc5dd; width: fit-content; border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
body.stellar .footer-col a:hover { color: var(--ink); border-color: var(--rust); }
body.stellar .footer-note .footer-disclosure { font-size: 14px; line-height: 1.7; color: var(--muted); margin: 0; max-width: 46ch; text-align: left; }
body.stellar .footer-mark { margin: 12px auto 0; width: fit-content; text-align: center; font: 500 clamp(64px, 13vw, 210px)/.85 var(--serif); letter-spacing: -.03em; color: #15142a; user-select: none; transform: translateY(14%); pointer-events: none; }
body.stellar .footer-bottom { position: relative; display: flex; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap; border-top: 1px solid #1f1d33; padding: 22px 0 28px; font-size: 13px; color: var(--muted); }
@media (max-width: 1150px) { body.stellar .footer-grid { grid-template-columns: 1fr 1fr; } body.stellar .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 700px) {
  body.stellar .site-footer { padding-top: 48px; }
  body.stellar .footer-grid { grid-template-columns: 1fr; gap: 28px; padding-bottom: 28px; }
  body.stellar .footer-brand .wordmark { font-size: 30px; }
  body.stellar .footer-tagline { font-size: 20px; }
  body.stellar .site-footer { padding-bottom: 150px; }
}

/* The gold kickers, larger and heavier: they are the labels the eye
   uses to find its way down the page, so they read from a distance. */
body.stellar .stellar-kicker { font-size: 26px; font-weight: 600; letter-spacing: .3px; margin-bottom: 18px; }
body.stellar .stellar-hero-copy .stellar-kicker { font-size: 28px; }
@media (max-width: 700px) { body.stellar .stellar-kicker { font-size: 21px; } body.stellar .stellar-hero-copy .stellar-kicker { font-size: 22px; } }
@media (min-width: 1800px) { body.stellar .stellar-kicker { font-size: 30px; } body.stellar .stellar-hero-copy .stellar-kicker { font-size: 32px; } }

/* Section openers read as one block: kicker, heading, then the line that
   explains it directly beneath, instead of a sentence pushed to the far
   edge of the page where it read as unrelated to its heading. */
body.stellar .included-section .section-heading { display: block; text-align: left; margin-bottom: 52px; }
body.stellar .stellar-inside .stellar-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; text-align: left; margin-bottom: 58px; }
body.stellar .stellar-inside .stellar-heading > p:last-child,
body.stellar .included-section .section-heading > p:last-child { max-width: 44ch; margin: 18px 0 0; padding: 0; font-size: 21px; line-height: 1.55; color: var(--muted); text-wrap: pretty; }
@media (max-width: 700px) {
  body.stellar .stellar-inside .stellar-heading { display: block; }
  body.stellar .stellar-inside .stellar-heading,
  body.stellar .included-section .section-heading { margin-bottom: 34px; }
  body.stellar .stellar-inside .stellar-heading > p:last-child,
  body.stellar .included-section .section-heading > p:last-child { font-size: 18px; margin-top: 14px; }
}
body.stellar .stellar-inside .stellar-heading h2 { font-size: clamp(40px, 4.6vw, 62px); line-height: 1.04; letter-spacing: -1.5px; font-weight: 500; }
@media (max-width: 700px) { body.stellar .stellar-inside .stellar-heading h2 { font-size: 40px; letter-spacing: -1px; } }


/* The note under "Written for you": a framed star-chart annotation. A
   hairline frame on warm paper, a second hairline set off it, a brass
   four-point star on two corners that twinkle slowly, the line in
   italic. It says "this is a specimen" the way a plate label does. */
body.stellar .stellar-inside .stellar-heading > p:last-child {
  position: relative; display: inline-block; margin: 0 0 6px; padding: 18px 28px 18px 30px; flex-shrink: 0;
  border: 1px solid #c8b89b; outline: 1px solid #ddd2bf; outline-offset: 4px; background: #f8f2e9;
  font-style: italic; font-size: 21px; line-height: 1.5; color: #4c4458; max-width: 44ch;
}
body.stellar .stellar-inside .stellar-heading > p:last-child::before,
body.stellar .stellar-inside .stellar-heading > p:last-child::after {
  content: ""; position: absolute; width: 16px; height: 16px; background: var(--rust);
  clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%);
  animation: note-star 4.5s ease-in-out infinite;
}
body.stellar .stellar-inside .stellar-heading > p:last-child::before { top: -9px; left: -9px; }
body.stellar .stellar-inside .stellar-heading > p:last-child::after { bottom: -9px; right: -9px; animation-delay: 2.2s; }
@keyframes note-star { 0%, 100% { transform: scale(1) rotate(0deg); opacity: 1; } 50% { transform: scale(.72) rotate(25deg); opacity: .65; } }
@media (max-width: 700px) { body.stellar .stellar-inside .stellar-heading > p:last-child { display: block; margin-top: 26px; padding: 14px 18px 14px 20px; font-size: 18px; } }
@media (prefers-reduced-motion: reduce) { body.stellar .stellar-inside .stellar-heading > p:last-child::before, body.stellar .stellar-inside .stellar-heading > p:last-child::after { animation: none; } }

/* ==================================================================
   The header in the same face as the headline. Cormorant, but larger
   and heavier than before and in a lighter ink, so the navigation reads
   at a glance on the night ground.
   ================================================================== */
body.stellar .site-nav, body.stellar .header-cta { font-family: var(--serif); font-weight: 600; letter-spacing: .01em; }
body.stellar .site-nav { font-size: 19px; gap: 34px; }
body.stellar .site-nav a { color: #e4dcee; transition: color .2s; }
body.stellar .site-nav a:hover, body.stellar .site-nav a[aria-current="page"] { color: var(--rust); }
body.stellar .header-cta { font-size: 19px; color: var(--ink); }
@media (max-width: 900px) { body.stellar .site-nav { font-size: 17px; gap: 22px; } body.stellar .header-cta { font-size: 17px; } }
@media (max-width: 700px) { body.stellar .site-nav { font-size: 19px; } }
@media (min-width: 1800px) { body.stellar .site-nav { font-size: 21px; gap: 40px; } body.stellar .header-cta { font-size: 21px; } }


/* ==================================================================
   Inside the reading: the fan on the left, the six named pages on the
   right. Each row is a page number, a title and one line on what the
   page holds; the row whose page is in the fan is marked in brass.
   ================================================================== */
body.stellar .stellar-inside-grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 72px; align-items: center; }
body.stellar .stellar-page-list { display: flex; flex-direction: column; min-width: 0; }
body.stellar .stellar-page-list > p { color: var(--muted); font-size: 17px; margin: 0 0 10px; }
body.stellar .stellar-page-list button {
  display: grid; grid-template-columns: 44px 1fr auto; gap: 18px; align-items: baseline; width: 100%;
  text-align: left; background: transparent; border: 0; border-bottom: 1px solid #d6cbbd; padding: 17px 0; color: var(--ink);
  font: 500 24px/1.2 var(--serif); cursor: pointer; transition: border-color .25s, color .25s;
}
body.stellar .stellar-page-list button:first-of-type { border-top: 1px solid #d6cbbd; }
body.stellar .stellar-page-list .num { font-size: 15px; color: var(--muted); font-variant-numeric: tabular-nums; letter-spacing: .04em; transition: color .25s; }
body.stellar .stellar-page-list small { display: block; font: 400 16px/1.5 var(--serif); color: var(--muted); margin-top: 4px; max-width: 40ch; }
body.stellar .stellar-page-list .arrow { font-size: 17px; color: var(--muted); transition: color .25s, transform .25s; }
body.stellar .stellar-page-list button:hover, body.stellar .stellar-page-list button:focus-visible, body.stellar .stellar-page-list button.is-shown { border-bottom-color: var(--rust); }
body.stellar .stellar-page-list button.is-shown .num, body.stellar .stellar-page-list button:hover .num, body.stellar .stellar-page-list button:hover .arrow, body.stellar .stellar-page-list button.is-shown .arrow { color: var(--rust); }
body.stellar .stellar-page-list button:hover .arrow { transform: translate(2px, -2px); }
body.stellar .stellar-page-list button:active { transform: translateY(1px); }
@media (max-width: 900px) {
  body.stellar .stellar-inside-grid { grid-template-columns: 1fr; gap: 36px; }
  body.stellar .stellar-page-list button { font-size: 21px; padding: 14px 0; grid-template-columns: 36px 1fr auto; gap: 12px; }
  body.stellar .stellar-page-list small { font-size: 15px; }
}

/* The close runs straight into the footer: no rule under its last line,
   none over the footer, so the night simply continues. */
body.stellar .stellar-close { border-bottom: 0; }
body.stellar .site-footer { border-top: 0; }
/* No rule between the description and the price: the hero reads as one column. */
body.stellar .stellar-purchase { border-top: 0; padding-top: 10px; margin-top: 22px; }

/* ==================================================================
   "Begin your reading" as a button (after Magic UI's shimmer-button):
   a night pill with a band of light travelling round its edge, a soft
   brass glow and a lift on hover, the arrow nudging outward. The band
   is a conic gradient on a ring-masked pseudo-element, turned by a
   registered angle property; browsers without @property show a still
   arc. Under reduced motion it holds still.
   ================================================================== */
@property --cta-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
body.stellar .header-cta {
  position: relative; isolation: isolate; display: inline-flex; align-items: center; gap: 12px;
  min-height: 44px; padding: 10px 18px 10px 20px; border: 0; border-radius: 999px;
  background: #1a1830; color: #f2eada; box-shadow: inset 0 0 0 1px #4a4266, 0 0 0 0 #dcbc8300;
  transition: background-color .25s, box-shadow .35s, transform .25s, color .2s;
}
body.stellar .header-cta::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1.5px; z-index: -1;
  background: conic-gradient(from var(--cta-angle), #dcbc8300 0deg, #dcbc83 50deg, #fff6dc 80deg, #dcbc83 110deg, #dcbc8300 170deg, #dcbc8300 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
  height: auto; top: -1px; transform: none;
  animation: cta-turn 4s linear infinite;
}
body.stellar .header-cta { white-space: nowrap; }
body.stellar .header-cta .cta-arrow { font-family: var(--serif); font-size: 17px; line-height: 1; transition: transform .25s; }
body.stellar .header-cta:hover { background: #241f3d; color: #fff6dc; transform: translateY(-1px); box-shadow: inset 0 0 0 1px #6b5f8a, 0 0 26px #dcbc8342; }
body.stellar .header-cta:hover .cta-arrow { transform: translate(2px, -2px); }
body.stellar .header-cta:active { transform: translateY(0); }
@keyframes cta-turn { to { --cta-angle: 360deg; } }
/* On a phone the hero's own button sits right below; the pill shortens to
   one word so the header stays one line. Its accessible name stays whole. */
@media (max-width: 700px) { body.stellar .header-cta { padding: 8px 14px 8px 16px; gap: 8px; min-height: 44px; font-size: 16px; margin-left: auto; } body.stellar .header-cta .cta-long { display: none; } }
@media (prefers-reduced-motion: reduce) { body.stellar .header-cta::before { animation: none; } }


/* ==================================================================
   The sample-page lightbox. The page is shown as a plate under a lamp:
   large, on the night, with a brass edge and a soft glow, the room
   behind it dimmed and blurred. Round arrows either side, the caption
   in the site's type beneath, six thumbnails to jump between pages,
   and a quiet entrance. Escape, the arrows and a press outside close
   or move it, as before.
   ================================================================== */
body.stellar .gallery-dialog { width: min(1180px, calc(100% - 40px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; border: 0; background: transparent; box-shadow: none; overflow: visible; color: var(--ink); }
body.stellar .gallery-dialog::backdrop { background: #050612e8; backdrop-filter: blur(14px); }
body.stellar .gallery-dialog[open] { animation: gallery-in .4s cubic-bezier(.32, .72, 0, 1); }
@keyframes gallery-in { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
body.stellar .gallery-frame { position: relative; display: grid; gap: 18px; padding: 34px 40px 26px; border: 1px solid #3b3556; border-radius: 4px; background: radial-gradient(ellipse 70% 60% at 50% 20%, #1b1838 0%, #0e0e23 70%); box-shadow: 0 40px 120px #000c; }
body.stellar .gallery-close { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; border-radius: 50%; background: #15132a; border: 1px solid #4a4266; color: #d9d1e6; font: 26px/1 var(--serif); display: grid; place-items: center; transition: border-color .2s, color .2s, background-color .2s; z-index: 2; }
body.stellar .gallery-close:hover { border-color: var(--rust); color: var(--rust); background: #1d1a33; }
body.stellar .gallery-stage { display: grid; grid-template-columns: 52px 1fr 52px; align-items: center; gap: 24px; }
body.stellar .gallery-plate { margin: 0; display: flex; justify-content: center; filter: drop-shadow(0 0 44px #dcbc8324); }
body.stellar .gallery-plate img { height: min(64dvh, 760px); width: auto; max-width: 100%; box-shadow: 0 0 0 1px #d5bc8455, 0 30px 70px #000b; border-radius: 2px; }
body.stellar .gallery-arrow { width: 52px; height: 52px; border-radius: 50%; border: 1px solid #5c527c; background: #15132a; color: #f2eada; font: 22px/1 var(--serif); display: grid; place-items: center; transition: border-color .2s, background-color .2s, transform .2s; }
body.stellar .gallery-arrow:hover { border-color: var(--rust); background: #241f3d; transform: translateY(-1px); }
body.stellar .gallery-arrow:active { transform: translateY(0); }
body.stellar .gallery-caption { text-align: center; }
body.stellar .gallery-caption .eyebrow { color: var(--rust); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; margin: 0 0 6px; }
body.stellar .gallery-caption h2 { font: 500 32px/1.1 var(--serif); margin: 0; }
body.stellar .gallery-caption #gallery-count { color: var(--muted); font-size: 15px; margin: 8px 0 0; letter-spacing: .04em; }
body.stellar .gallery-thumbs { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
body.stellar .gallery-thumbs button { width: 54px; height: 70px; padding: 0; border: 1px solid #3b3556; border-radius: 2px; background: #0b0b1c; overflow: hidden; opacity: .55; transition: opacity .2s, border-color .2s, transform .2s; }
body.stellar .gallery-thumbs button img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
body.stellar .gallery-thumbs button:hover, body.stellar .gallery-thumbs button[aria-current="true"] { opacity: 1; border-color: var(--rust); }
body.stellar .gallery-thumbs button[aria-current="true"] { transform: translateY(-2px); box-shadow: 0 0 0 1px var(--rust); }
body.stellar .gallery-disclaimer { text-align: center; color: var(--muted); font-size: 14px; margin: 0; }
@media (max-width: 700px) {
  body.stellar .gallery-dialog { width: calc(100% - 20px); max-height: calc(100dvh - 20px); }
  body.stellar .gallery-frame { padding: 54px 14px 18px; gap: 14px; }
  body.stellar .gallery-stage { grid-template-columns: 1fr; }
  body.stellar .gallery-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; background: #15132ae0; }
  body.stellar #gallery-prev { left: 8px; } body.stellar #gallery-next { right: 8px; }
  body.stellar .gallery-arrow:hover { transform: translateY(-50%); }
  body.stellar .gallery-plate img { height: min(56dvh, 640px); }
  body.stellar .gallery-caption h2 { font-size: 26px; }
  body.stellar .gallery-thumbs button { width: 40px; height: 52px; }
}
@media (prefers-reduced-motion: reduce) { body.stellar .gallery-dialog[open] { animation: none; } }
/* the older rule sizing every span in the call keeps its hands off the label */
body.stellar .header-cta .cta-text, body.stellar .header-cta .cta-long { font: inherit; }

/* ==================================================================
   One vertical rhythm. Rhea's panel added its own margin on top of the
   questions section's padding, so that gap was twice every other one;
   it now takes the same single section gap as the rest.
   ================================================================== */
body.stellar .stellar-rhea { margin-bottom: 0; }
body.stellar .faq-list summary { text-wrap: balance; }

/* ==================================================================
   Phones. Every section boundary is one gap; text columns use the full
   width; lists sit tight; the footer's links share a row; and the old
   clearance for a fixed bar the page no longer has is gone (the home
   indicator on newer iPhones is still cleared).
   ================================================================== */
@media (max-width: 700px) {
  body.stellar .stellar-rhea { padding: 24px 22px 30px; gap: 26px; }
  body.stellar .stellar-rhea > div > p:not(.stellar-kicker) { margin-top: 16px; }
  body.stellar .stellar-rhea .text-link { margin-top: 20px; }

  body.stellar .chapter > details > summary { row-gap: 2px; padding-block: calc(12px + var(--span) * .8px); }
  body.stellar .ch-extent { padding-top: 0; }

  body.stellar .faq-list summary { padding-block: 18px; }

  body.stellar .site-footer { padding-top: 44px; padding-bottom: calc(28px + env(safe-area-inset-bottom)); }
  body.stellar .footer-grid { grid-template-columns: 1fr 1fr; gap: 30px 18px; padding-bottom: 12px; }
  body.stellar .footer-brand { grid-column: 1 / -1; }
  body.stellar .footer-heading { margin: 0 0 6px; }
  body.stellar .footer-col a { min-height: 44px; font-size: 16px; }
  body.stellar .footer-mark { margin-top: 18px; }
}

/* Section headings on one scale. Rhea's heading and the questions heading
   had no size of their own and fell back to 27px on a loose 43px line,
   against 40px on phones and 62-66px on desktop for every other section. */
body.stellar .stellar-rhea h2,
body.stellar .faq-heading h2 { font-weight: 500; line-height: 1.04; letter-spacing: -1.2px; text-wrap: balance; }
body.stellar .stellar-rhea h2 { font-size: clamp(40px, 4.1vw, 56px); margin-top: 4px; }
body.stellar .faq-heading h2 { font-size: clamp(40px, 4.6vw, 62px); }
@media (max-width: 700px) {
  body.stellar .stellar-rhea h2, body.stellar .faq-heading h2 { font-size: 40px; letter-spacing: -1px; }
}
@media (min-width: 1800px) {
  body.stellar .stellar-rhea h2 { font-size: 64px; }
  body.stellar .faq-heading h2 { font-size: 72px; }
}

/* Tonight's sky: the dot before the date is inside the date span, so it
   must not take the date's own left margin a second time. The note
   under the planet chips gets room to breathe. A long chapter title
   breaks evenly instead of leaving one word alone on the last line. */
body.stellar .skybar-label .skybar-date span { margin-left: 0; }
body.stellar .sky-bodies + .skybar-note { margin-top: 18px; }
body.stellar .ch-name { text-wrap: balance; }