/* Starry Bodies — pearl, soft ink and an ascending star body. */
:root,:root[data-theme=light]{color-scheme:light;--paper:#fbfaf6;--surface:#fffefa;--soft:#f2f1eb;--ink:#454b50;--muted:#6f7472;--line:#deded4;--gold:#826c45;--accent:#786449;--ocean:#f1f4f1;--shadow:#454b500b;--brand-gold:#b58018;--p-bg:#fbfaf6;--p-panel:#fffefa;--p-soft:#f1f0e8;--p-ink:#454b50;--p-muted:#6f7472;--p-gold:#826c45;--p-line:#deded4;--p-shadow:#454b500b}
:root[data-theme=dark]{color-scheme:dark;--paper:#222833;--surface:#2a303b;--soft:#313846;--ink:#eeece4;--muted:#b5b8bb;--line:#48505b;--gold:#d0bd98;--accent:#d0bd98;--ocean:#252e38;--shadow:#0002;--brand-gold:#e9c56d;--p-bg:#222833;--p-panel:#2a303b;--p-soft:#313846;--p-ink:#eeece4;--p-muted:#b5b8bb;--p-gold:#d0bd98;--p-line:#48505b;--p-shadow:#0002}
body{background-image:none}
.brand,.portal-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;flex:none;min-width:0}
.brand-symbol,.brand-wordmark,.hero-word,.hero-mark{display:block;background:currentColor;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}
.brand-symbol{width:35px;height:35px;flex:none;color:var(--brand-gold);mask-image:url('/assets/brand/mark-small-v7.svg');-webkit-mask-image:url('/assets/brand/mark-small-v7.svg')}
.brand-wordmark{width:210px;height:24px;color:var(--ink);mask-image:url('/assets/brand/wordmark-v3.svg');-webkit-mask-image:url('/assets/brand/wordmark-v3.svg')}
.site-header{min-height:78px;padding-block:15px;background:color-mix(in srgb,var(--paper) 92%,transparent);border-bottom-color:color-mix(in srgb,var(--line) 65%,transparent);gap:30px}
.site-header nav{font:500 19px/1.15 "Cormorant Garamond",Cormorant,Georgia,serif;letter-spacing:.015em;gap:27px}.site-header nav>a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;transition:color .18s}.site-header .booking-link{color:var(--ink)}
.site-header .appearance{padding:0;display:grid;place-items:center;width:44px;height:44px;min-width:44px;border:1px solid transparent;border-radius:50%;margin-left:0;background:transparent}
.site-header .appearance:hover{background:var(--soft);border-color:var(--line)}.site-header .appearance #theme-symbol{font-size:23px;line-height:1;color:var(--gold)}.site-header .toggle-knob{display:none}
.intro{width:100vw;max-width:none;margin:0 calc(50% - 50vw);min-height:clamp(690px,calc(100svh - 78px),840px);display:block;position:relative;isolation:isolate;overflow:clip;text-align:center;padding:75px 5% 170px;background:var(--paper);border-bottom:1px solid var(--line)}
.intro-text{display:block;position:relative;width:100%;max-width:660px;margin:0 auto;padding:0;animation:celestial-arrive 1.3s ease both}
.hero-mark{width:88px;height:88px;margin:0 auto 25px;color:var(--brand-gold);mask-image:url('/assets/brand/mark-v7.svg');-webkit-mask-image:url('/assets/brand/mark-v7.svg')}
.intro #hero-title{display:grid;justify-items:center;gap:16px;width:clamp(275px,31vw,440px);max-width:100%;margin:0 auto;font:inherit;line-height:1;letter-spacing:0;text-shadow:none;text-transform:none;animation:none}
.intro #hero-title>.hero-word{padding:0;margin:0;background:var(--ink)}
.intro #hero-title>.hero-word-starry{width:100%;aspect-ratio:4151.554 / 672;mask-image:url('/assets/brand/starry-v3.svg');-webkit-mask-image:url('/assets/brand/starry-v3.svg')}
.intro #hero-title>.hero-word-bodies{width:92%;aspect-ratio:3710.4 / 654;mask-image:url('/assets/brand/bodies-v3.svg');-webkit-mask-image:url('/assets/brand/bodies-v3.svg')}
.hero-caption{margin:30px auto 0;padding:0;border:0;display:block;max-width:100%}
.hero-lead{font:400 clamp(24px,2.35vw,30px)/1.3 "Cormorant Garamond",Georgia,serif;letter-spacing:-.01em;color:var(--ink);max-width:560px;margin:0 auto;text-wrap:balance}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:center;width:fit-content;max-width:100%;margin:24px auto 0;position:relative;isolation:isolate}
.hero-actions:before{content:'';position:absolute;inset:-14px -28px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse,color-mix(in srgb,var(--paper) 96%,transparent) 25%,color-mix(in srgb,var(--paper) 82%,transparent) 60%,transparent 78%);filter:blur(8px)}
.hero-actions [hidden]{display:none!important}
.hero-primary,.hero-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;box-sizing:border-box;font-size:14px;font-weight:500;line-height:1.25;white-space:nowrap;text-decoration:none;color:var(--ink)}
.hero-action-label{color:inherit;font:inherit}
.hero-action-arrow{display:block;width:16px;height:16px;flex:none;color:var(--gold)}
.hero-secondary{gap:10px;padding:12px 4px}
.hero-secondary .hero-action-label{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:var(--gold)}
.hero-secondary:hover .hero-action-label{text-decoration-color:currentColor}
.hero-primary{gap:14px;padding:12px 25px;border:1px solid color-mix(in srgb,var(--brand-gold) 65%,transparent);border-radius:40px;background:color-mix(in srgb,var(--paper) 94%,transparent);box-shadow:0 4px 25px #89734d08;transition:transform .25s,background .25s,box-shadow .25s}
.hero-primary:hover{transform:translateY(-2px);background:var(--surface);box-shadow:0 7px 30px #89734d12}
.cosmic-scene{position:absolute;inset:0;z-index:-2;pointer-events:none;transform:none}
.star-beings{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center 48%;background:url(data:image/webp;base64,UklGRqgAAABXRUJQVlA4IJwAAABwBQCdASooABQAPrVQoEsnJKMhqqoA4BaJZwDNhBJJ58SedLR1LazvJ3mPeBAdEcZFsBTQAP7wjg2Cr2h30anELtg6bKKfrKyv4JZlMbsFI360Y7C2dHwNTr0hIiNG2FQyZ8EYs0XqxEyL3mqyqZn5E16hEeO2g6wN/TGdi/PtSfqBnnicpHrCI9ePE+i9hOuaOO+5lagdwtQAAAA=) center 48%/cover no-repeat;opacity:.92;mix-blend-mode:multiply;filter:none;mask-image:linear-gradient(180deg,transparent,#000 8%,#000 85%,transparent)}
.intro:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 24% 42% at 50% 37%,color-mix(in srgb,var(--paper) 35%,transparent),transparent),linear-gradient(0deg,var(--paper),transparent 18%,transparent 94%,var(--paper))}
#starfield{position:absolute;inset:0;width:100%;height:100%;opacity:.13;transform:translateY(calc(var(--hero-scroll)*-12px))}
:root[data-theme=dark] .star-beings{filter:invert(1) grayscale(1);mix-blend-mode:screen;opacity:.35}
.portal-brand{gap:11px}.portal-brand>.brand-symbol{width:35px;height:35px;background:var(--brand-gold);font:inherit;letter-spacing:0}.portal-brand>.brand-wordmark{width:210px;height:24px;background:var(--p-ink);font:inherit;letter-spacing:0}
.portal-celestial{background-image:url('/assets/celestial-dawn-v3.webp');mix-blend-mode:multiply;opacity:.5}
:root[data-theme=dark] .portal-celestial{filter:invert(1) grayscale(1);mix-blend-mode:screen;opacity:.24}
.footer-brand{display:flex;align-items:center;gap:11px}.footer-brand .brand-symbol{width:31px;height:31px}.footer-brand .brand-wordmark{width:182px;height:22px}
.birth-panel{border-radius:10px;box-shadow:0 8px 40px var(--shadow)}.profile-bar{border-bottom-color:var(--line)}
.is-embedded .intro{display:none}
@keyframes celestial-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(min-width:1800px){.intro{padding-top:90px}.star-beings{object-position:center 45%}}
@media(max-width:1100px){.site-header{gap:20px}.site-header nav{gap:20px}.site-header .brand{min-width:0;gap:10px}.site-header .brand-wordmark{width:185px}.intro{min-height:700px;padding-top:72px}}
@media(max-width:700px){.site-header{min-height:68px;padding:12px 5%;gap:12px;flex-wrap:nowrap;justify-content:space-between}.site-header .brand,.portal-brand{gap:8px}.site-header .brand-symbol,.portal-brand>.brand-symbol{width:29px;height:29px}.site-header .brand-wordmark,.portal-brand>.brand-wordmark{width:172px;height:22px}.site-header .appearance{width:44px;height:44px;min-width:44px;margin-left:auto}.site-header nav{display:none}.intro{min-height:650px;padding:47px 6% 245px}.intro-text{max-width:100%}.hero-mark{width:70px;height:70px;margin-bottom:22px}.intro #hero-title{width:min(80vw,330px);gap:13px}.hero-caption{margin-top:27px}.hero-lead{font-size:24px;letter-spacing:-.01em}.hero-actions{margin-top:23px}.hero-primary{padding:12px 24px}.star-beings{width:110%;height:auto;inset:auto;left:-5%;bottom:0;object-fit:contain;object-position:center;opacity:1;mask-image:linear-gradient(180deg,transparent,#000 12%,#000 90%,transparent)}.cosmic-scene{transform:none}.intro:before{background:linear-gradient(0deg,var(--paper),transparent 13%,transparent 94%,var(--paper))}#starfield{opacity:.14}.footer-brand .brand-symbol{width:27px;height:27px}.footer-brand .brand-wordmark{width:162px;height:21px}}
@media(max-width:370px){.site-header .brand-wordmark{width:153px}.site-header .brand-symbol{width:27px;height:27px}.intro #hero-title{width:81vw}.hero-lead{font-size:23px}.portal-brand>.brand-wordmark{width:150px}}
@media(prefers-reduced-motion:reduce){.intro-text,.cosmic-scene,#starfield{animation:none;transform:none;will-change:auto}.hero-primary{transition:none}}
@media(forced-colors:active){.brand-symbol,.brand-wordmark,.hero-word,.hero-mark{forced-color-adjust:none;background:CanvasText}}
@media print{.intro{display:none!important}.brand-symbol,.brand-wordmark{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* Account access has its own place in the header, including on small screens. */
.header-account{display:flex;align-items:center;justify-content:flex-end;gap:20px;flex:none;font:500 18px/1.2 "Cormorant Garamond",Cormorant,Georgia,serif;letter-spacing:.015em;white-space:nowrap}
.header-account a{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;text-decoration:none}
.header-account [hidden]{display:none!important}
.header-signin{color:var(--muted)}.header-signin:hover{text-decoration:underline;text-underline-offset:4px}
.header-account .header-create,.header-account .header-library{padding:10px 18px;border:1px solid color-mix(in srgb,var(--gold) 65%,transparent);border-radius:3px;background:color-mix(in srgb,var(--surface) 65%,transparent);color:var(--ink);transition:background .18s,border-color .18s,color .18s}
.header-account .header-create:hover,.header-account .header-library:hover{background:var(--soft);color:var(--gold)}
.header-library span{color:var(--gold)}
.profile-bar .profile-create{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 20px;border:1px solid var(--gold);border-radius:4px;text-decoration:none;background:var(--surface);color:var(--ink)}
.profile-bar .profile-create:hover{background:var(--soft)}
.profile-bar #profile-signin{padding-inline:6px;border-radius:0;text-decoration:underline;text-underline-offset:4px}
#your-charts{scroll-margin-top:24px}
@media(min-width:701px) and (max-width:1250px){.site-header.has-account-nav{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;gap:8px 24px}.site-header.has-account-nav>.brand{grid-row:1;grid-column:1}.site-header.has-account-nav>.header-account{grid-row:1;grid-column:2}.site-header.has-account-nav>.appearance{grid-row:1;grid-column:3}.site-header.has-account-nav>nav{grid-row:2;grid-column:1/-1;justify-content:center;gap:28px}}
@media(max-width:700px){.site-header.has-account-nav{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:6px 16px}.site-header.has-account-nav>.brand{grid-row:1;grid-column:1}.site-header.has-account-nav>.appearance{grid-row:1;grid-column:2;margin-left:0}.site-header.has-account-nav>.header-account{grid-row:2;grid-column:1/-1;justify-content:flex-end;gap:24px;padding-top:3px}.header-account .header-create,.header-account .header-library{padding:9px 16px}.profile-bar .profile-create{margin-left:auto}}
@media print{.header-account{display:none!important}}

/* No browser focus rectangles. Keyboard focus stays local to text, fields and chart geometry. */
:focus,:focus-visible,:focus-within,.zodiac-control input:focus-visible+span,.year-sign:focus-visible .year-sign-copy{outline:none!important}
:where(a,button,summary):focus-visible{text-decoration:underline;text-underline-offset:.3em}
:where(input,select,textarea):focus-visible{border-bottom-color:var(--gold,var(--brand-gold));box-shadow:inset 0 -1px 0 var(--gold,var(--brand-gold))}
.wheel-aspect-hit:focus{stroke:transparent;opacity:0}
a:focus-visible .brand-wordmark{opacity:.65}