:root {
  color-scheme: dark;
  --ink-950: #070711;
  --ink-900: #0d0d1d;
  --ink-850: #121126;
  --ink-800: #181631;
  --violet-700: var(--mystic-primary, #7657e8);
  --violet-500: #9a7cf5;
  --violet-300: #c5b4ff;
  --gold-500: var(--mystic-accent, #e8c77a);
  --gold-300: #f3dda8;
  --text: #f8f5ff;
  --text-soft: #cbc4d9;
  --text-muted: #9a92aa;
  --line: rgb(255 255 255 / 12%);
  --line-strong: rgb(232 199 122 / 28%);
  --danger: #ff9ea8;
  --success: #8fddbf;
  --shadow: 0 24px 70px rgb(0 0 0 / 42%);
  --radius-sm: .75rem;
  --radius: 1.1rem;
  --radius-lg: 1.75rem;
  --container: 74rem;
  --font-display: Iowan Old Style, Baskerville, "Times New Roman", serif;
  --font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-family: var(--font-sans);
  background: var(--ink-950);
  color: var(--text);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 20rem;
  min-height: 100vh;
  background:
    radial-gradient(ellipse at 20% -15%, rgb(105 72 185 / 22%), transparent 38rem),
    radial-gradient(ellipse at 92% 18%, rgb(56 79 152 / 13%), transparent 30rem),
    var(--ink-950);
  color: var(--text);
  line-height: 1.6;
}
body::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: .27;
  background-image:
    radial-gradient(circle at 13% 17%, #fff 0 1px, transparent 1.4px),
    radial-gradient(circle at 67% 8%, #fff 0 .8px, transparent 1.2px),
    radial-gradient(circle at 82% 61%, #fff 0 1px, transparent 1.5px),
    radial-gradient(circle at 36% 79%, #fff 0 .7px, transparent 1.1px);
  background-size: 19rem 23rem, 29rem 31rem, 37rem 41rem, 43rem 47rem;
}
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--gold-500); outline-offset: 3px; }
::selection { background: var(--violet-700); color: #fff; }

.skip-link {
  position: fixed; z-index: 100; top: .75rem; left: .75rem;
  padding: .7rem 1rem; border-radius: .6rem; background: var(--gold-300); color: var(--ink-950);
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }
.page-shell, main { width: min(var(--container), calc(100% - 2rem)); margin-inline: auto; min-width: 0; }
main { min-height: 62vh; }
.section { padding-block: clamp(3.5rem, 8vw, 7rem); }
.section-compact { padding-block: clamp(2rem, 5vw, 4rem); }
.section-heading { max-width: 44rem; margin-bottom: 2rem; }
.section-heading.center { margin-inline: auto; text-align: center; }
.section-heading h2 { margin: .4rem 0 .75rem; }

h1, h2, h3, .brand {
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 1.08;
  text-wrap: balance;
}
h1 { font-size: clamp(2.65rem, 9vw, 5.9rem); letter-spacing: -.045em; }
h2 { font-size: clamp(2rem, 5vw, 3.6rem); letter-spacing: -.03em; }
h3 { font-size: clamp(1.3rem, 3vw, 1.7rem); }
p { text-wrap: pretty; }
.eyebrow {
  margin: 0;
  color: var(--gold-300);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.lede { color: var(--text-soft); font-size: clamp(1.05rem, 2vw, 1.28rem); line-height: 1.65; }
.muted { color: var(--text-muted); }
.gold { color: var(--gold-300); }
.measure { max-width: 42rem; }

.site-header {
  position: sticky; z-index: 50; top: 0;
  border-bottom: 1px solid var(--line);
  background: rgb(7 7 17 / 82%);
  backdrop-filter: blur(18px) saturate(130%);
}
.nav-shell { display: flex; align-items: center; min-height: 4.75rem; gap: 1.2rem; }
.brand { display: inline-flex; align-items: center; gap: .65rem; margin-right: auto; font-size: 1.35rem; }
.brand img { width: 2.15rem; height: 2.15rem; object-fit: contain; }
.brand-mark {
  display: grid; width: 2rem; height: 2rem; place-items: center;
  border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300);
  box-shadow: inset 0 0 1rem rgb(232 199 122 / 10%);
}
.desktop-nav { display: none; align-items: center; gap: .2rem; }
.nav-link { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .6rem .8rem; border-radius: .65rem; color: var(--text-soft); font-size: .9rem; }
.nav-link:hover { background: rgb(255 255 255 / 6%); color: #fff; }
.mobile-menu { position: relative; }
.mobile-menu summary {
  display: grid; width: 3rem; height: 3rem; cursor: pointer; list-style: none; place-items: center;
  border: 1px solid var(--line); border-radius: .8rem; background: var(--ink-850);
}
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu summary::before { content: "☰"; font-size: 1.25rem; }
.mobile-menu[open] summary::before { content: "×"; font-size: 1.7rem; }
.mobile-menu-panel {
  position: absolute; top: calc(100% + .65rem); right: 0; display: grid; width: min(20rem, calc(100vw - 2rem));
  gap: .25rem; padding: .75rem; border: 1px solid var(--line); border-radius: var(--radius);
  background: rgb(18 17 38 / 98%); box-shadow: var(--shadow);
}
.mobile-menu-panel .nav-link { min-height: 3rem; }

.button {
  display: inline-flex; min-height: 3rem; align-items: center; justify-content: center; gap: .55rem;
  padding: .75rem 1.25rem; cursor: pointer; border: 1px solid transparent; border-radius: 999px;
  background: var(--violet-700); color: #fff; font-weight: 800; line-height: 1.15;
  box-shadow: 0 10px 30px rgb(83 51 177 / 28%);
  transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.button:hover { transform: translateY(-2px); background: #8466ef; box-shadow: 0 14px 34px rgb(83 51 177 / 38%); }
.button:active { transform: translateY(0); }
.button.secondary { border-color: var(--line-strong); background: transparent; color: var(--gold-300); box-shadow: none; }
.button.secondary:hover { background: rgb(232 199 122 / 8%); }
.button.small { min-height: 2.75rem; padding: .6rem 1rem; font-size: .9rem; }
.button.full { width: 100%; }
.text-link { color: var(--gold-300); font-weight: 750; text-decoration: underline; text-decoration-color: rgb(232 199 122 / 35%); text-underline-offset: .25em; }
.actions { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; margin-top: 1.7rem; }
.actions.center { justify-content: center; }

.hero { padding-block: clamp(2.25rem, 7vw, 5.5rem); }
.home-hero { display: grid; align-items: center; gap: 2rem; }
.page-home h2 { font-size: clamp(1.55rem, 3.2vw, 2.35rem); line-height: 1.2; letter-spacing: -.02em; }
.hero-copy h1 {
  margin: .5rem 0 .8rem;
  max-width: 18ch;
  font-family: Georgia, "Iowan Old Style", Palatino, "Times New Roman", serif;
  font-size: clamp(1.7rem, 4.6vw, 2.75rem);
  font-weight: 500;
  line-height: 1.22;
  letter-spacing: -.02em;
}
.hero-copy .lede { max-width: 34rem; font-size: clamp(.98rem, 1.6vw, 1.1rem); line-height: 1.65; }
.micro-trust { display: flex; flex-wrap: wrap; gap: .6rem 1.1rem; margin: 1.2rem 0 0; padding: 0; color: var(--text-muted); font-size: .84rem; list-style: none; }
.micro-trust li::before { margin-right: .4rem; color: var(--success); content: "✓"; }
.sky-chart {
  position: relative;
  width: min(100%, 19.5rem);
  margin-inline: auto;
  isolation: isolate;
}
.sky-chart-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.sky-disc { fill: rgb(16 13 28 / 88%); }
.sky-stars circle { fill: #f3e7c4; animation: solar-twinkle 4.2s ease-in-out infinite; }
.sky-stars circle:nth-child(3n) { animation-delay: .8s; }
.sky-stars circle:nth-child(4n) { animation-delay: 1.7s; }
.sky-constellation { fill: none; stroke: rgb(243 221 168 / 28%); stroke-width: .7; }
.sky-wheel { transform-origin: 180px 180px; transform-box: view-box; animation: slow-spin 120s linear infinite; }
.sky-ring { fill: none; stroke: rgb(232 199 122 / 42%); stroke-width: 1.1; }
.sky-ring.faint { stroke: rgb(232 199 122 / 18%); stroke-width: .7; }
.sky-ticks { fill: none; stroke: rgb(232 199 122 / 55%); stroke-width: .7; }
.sky-spokes { fill: none; stroke: rgb(232 199 122 / 16%); stroke-width: .6; }
.sky-signs text {
  fill: var(--gold-300);
  font-family: Georgia, "Iowan Old Style", serif;
  font-size: 8px;
  letter-spacing: .4px;
  text-anchor: middle;
}
.sky-kundali path { fill: none; stroke: rgb(232 199 122 / 62%); stroke-width: 1.15; }
.sky-orbit { transform-origin: 180px 180px; transform-box: view-box; animation: slow-spin var(--orbit-dur) linear infinite; }
.sky-orbit.reverse { animation-direction: reverse; }
.sky-orbit.reverse .sky-body { animation-direction: normal; }
.sky-orbit.o1 { --orbit-dur: 26s; }
.sky-orbit.o2 { --orbit-dur: 34s; }
.sky-orbit.o3 { --orbit-dur: 48s; }
.sky-orbit.o4 { --orbit-dur: 62s; }
.sky-body { transform-origin: center; transform-box: fill-box; animation: slow-spin var(--orbit-dur) linear infinite reverse; }
.sky-body circle { fill: #120f1d; stroke: rgb(232 199 122 / 70%); stroke-width: 1; }
.sky-body text { fill: var(--gold-300); font-family: Georgia, serif; font-size: 8px; text-anchor: middle; }
.sky-core circle { fill: #161225; stroke: var(--gold-500); stroke-width: 1.2; }
.sky-sun { fill: var(--gold-300); font-family: Georgia, serif; font-size: 13px; text-anchor: middle; }
.sky-core-label {
  fill: rgb(232 199 122 / 72%);
  font-family: var(--font-sans);
  font-size: 6.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-anchor: middle;
}
.sky-chart-caption {
  margin: .55rem 0 0;
  color: var(--text-muted);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-align: center;
  text-transform: uppercase;
}

.trust-strip { border-block: 1px solid var(--line); background: rgb(255 255 255 / 2%); }
.trust-grid { display: grid; gap: 0; }
.trust-item { display: flex; gap: .8rem; padding: 1.35rem 0; border-bottom: 1px solid var(--line); }
.trust-item:last-child { border: 0; }
.trust-item strong { display: block; font-size: .93rem; }
.trust-item span { color: var(--text-muted); font-size: .82rem; }
.trust-icon { color: var(--gold-300); }

.card-grid { display: grid; gap: 1rem; }
.service-card, .mystic-panel, .auth-card, .content-card {
  border: 1px solid var(--line); border-radius: var(--radius-lg);
  background: rgb(255 255 255 / 4%); box-shadow: var(--shadow);
}
.service-card { display: flex; min-height: 20rem; flex-direction: column; padding: clamp(1.4rem, 4vw, 2rem); overflow: hidden; position: relative; }
.service-card::after { position: absolute; right: -3rem; bottom: -4rem; width: 10rem; height: 10rem; border: 1px solid var(--line-strong); border-radius: 50%; content: ""; }
.service-card:hover { border-color: var(--line-strong); background: rgb(255 255 255 / 6%); }
.service-card h3 { margin: 1.2rem 0 .45rem; }
.service-card p { color: var(--text-soft); }
.service-card .text-link { margin-top: auto; }
.icon-medallion { display: grid; width: 3.25rem; height: 3.25rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: rgb(232 199 122 / 6%); color: var(--gold-300); font-size: 1.35rem; }
.steps-grid { display: grid; gap: 1.1rem; counter-reset: steps; }
.step-card { position: relative; padding: 1.4rem 1.4rem 1.4rem 4.5rem; border-top: 1px solid var(--line); counter-increment: steps; }
.step-card::before { position: absolute; left: 0; top: 1.1rem; display: grid; width: 3rem; height: 3rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300); content: "0" counter(steps); font-size: .78rem; font-weight: 800; }
.step-card h3 { margin: 0 0 .4rem; }
.step-card p { margin: 0; color: var(--text-muted); }
.split-section { display: grid; align-items: center; gap: 2rem; }
.comparison-card { padding: clamp(1.4rem, 4vw, 2.5rem); }
.comparison-list { display: grid; gap: .7rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.comparison-list li { display: flex; gap: .7rem; padding-bottom: .7rem; border-bottom: 1px solid var(--line); color: var(--text-soft); }
.comparison-list li::before { color: var(--gold-300); content: "✦"; }
.chips { display: flex; flex-wrap: wrap; gap: .65rem; }
.chip { display: inline-flex; min-height: 2.5rem; align-items: center; padding: .45rem .85rem; border: 1px solid var(--line); border-radius: 999px; color: var(--text-soft); font-size: .88rem; }
.faq-list { max-width: 52rem; margin-inline: auto; border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { min-height: 4.5rem; padding: 1.25rem 2.2rem 1.25rem 0; cursor: pointer; font-weight: 750; list-style: none; position: relative; }
.faq-list summary::after { position: absolute; right: .25rem; content: "+"; color: var(--gold-300); font-size: 1.5rem; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list p { margin: 0 0 1.4rem; color: var(--text-soft); }
.final-cta { position: relative; overflow: hidden; padding: clamp(2rem, 7vw, 5rem); text-align: center; }
.final-cta::before { position: absolute; inset: -70% 25%; z-index: -1; border: 1px solid var(--line-strong); border-radius: 50%; content: ""; }

.flow-shell, .tarot-shell { width: min(66rem, 100%); margin-inline: auto; padding-block: clamp(1.75rem, 6vw, 5.5rem); min-width: 0; }
.flow-header { max-width: 45rem; margin-bottom: 2rem; }
.flow-header h1, .tarot-shell > h1 { margin: .5rem 0 1rem; font-size: clamp(1.7rem, 6vw, 2.75rem); line-height: 1.2; letter-spacing: -.02em; }
.progress-line { display: flex; gap: .55rem; align-items: center; margin-bottom: 1.2rem; color: var(--text-muted); font-size: .82rem; }
.progress-line::before { width: 2.5rem; height: 2px; background: var(--gold-500); content: ""; }
.form-layout { display: grid; gap: 1rem; min-width: 0; }
.form-layout > * { min-width: 0; max-width: 100%; }
.mystic-panel, .auth-card, .content-card { padding: clamp(1.1rem, 3.5vw, 2.35rem); }
.side-panel { align-self: start; }
.side-panel h2 { margin-top: 0; font-size: 1.7rem; }
.side-list { display: grid; gap: 1rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
.side-list li { display: grid; grid-template-columns: 1.7rem 1fr; gap: .65rem; color: var(--text-soft); }
.side-list li::before { color: var(--gold-300); content: "✦"; }
form { display: grid; gap: 1.15rem; min-width: 0; max-width: 100%; }
.field { display: grid; gap: .4rem; min-width: 0; max-width: 100%; align-content: start; }
.field-check label { display: flex; align-items: flex-start; gap: .6rem; font-weight: 650; }
.field-check input[type="checkbox"] { margin-top: .22rem; flex: 0 0 auto; }
.field-row { display: grid; gap: 1rem 1.15rem; min-width: 0; align-items: start; }
.coord-help { grid-column: 1 / -1; }
.field label { color: var(--text); font-size: .9rem; font-weight: 750; }
.required-mark { color: var(--gold-300); }
.optional-mark {
  margin-left: .35rem; color: var(--text-muted); font-size: .68rem; font-weight: 750;
  letter-spacing: .08em; text-transform: uppercase;
}
.place-suggest { position: relative; }
.place-suggest-list {
  position: absolute; z-index: 8; top: calc(100% + .35rem); right: 0; left: 0;
  display: grid; gap: .2rem; margin: 0; padding: .35rem; overflow: auto;
  max-height: 22rem; list-style: none; border: 1px solid rgb(255 255 255 / 16%);
  border-radius: var(--radius-sm); background: rgb(10 8 22 / 96%);
  box-shadow: 0 18px 40px #0009;
}
.place-suggest-list[hidden] { display: none !important; }
.place-suggest-option {
  display: grid; gap: .12rem; padding: .7rem .8rem; border-radius: .45rem;
  color: var(--text); cursor: pointer;
}
.place-suggest-option strong { font-size: .95rem; font-weight: 750; }
.place-suggest-option small { color: var(--text-muted); font-size: .78rem; }
.place-suggest-option:hover, .place-suggest-option[aria-selected="true"] {
  background: rgb(232 199 122 / 12%);
}
.help-text { margin: 0; color: var(--text-muted); font-size: .8rem; overflow-wrap: anywhere; }
.field-errors, .errorlist { margin: .15rem 0 0; padding: 0; color: var(--danger); font-size: .84rem; list-style: none; }
.form-errors { padding: .8rem 1rem; border: 1px solid rgb(255 158 168 / 35%); border-radius: var(--radius-sm); background: rgb(255 158 168 / 8%); color: #ffd7db; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 3rem;
  min-height: 3rem;
  padding: .8rem .9rem;
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: var(--radius-sm);
  background: rgb(5 5 14 / 72%);
  color: #fff;
  transition: border-color .16s ease, box-shadow .16s ease;
}
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
  appearance: none;
  -webkit-appearance: none;
}
input[type="date"]::-webkit-date-and-time-value,
input[type="time"]::-webkit-date-and-time-value,
input[type="datetime-local"]::-webkit-date-and-time-value {
  min-width: 0;
  text-align: left;
}
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit-fields-wrapper,
input[type="time"]::-webkit-datetime-edit-fields-wrapper,
input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper {
  min-width: 0;
}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  margin-left: .35rem;
  flex-shrink: 0;
}
textarea { height: auto; min-height: 8rem; resize: vertical; }
input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  appearance: none;
  margin: 0;
}
input::placeholder, textarea::placeholder { color: #777082; }
input:hover, select:hover, textarea:hover { border-color: rgb(255 255 255 / 30%); }
input:focus, select:focus, textarea:focus { border-color: var(--violet-500); outline: 0; box-shadow: 0 0 0 3px rgb(154 124 245 / 18%); }
input[type="checkbox"], input[type="radio"] { width: 1.25rem; height: 1.25rem; accent-color: var(--violet-500); }
input[type="file"] { height: auto; min-height: 9rem !important; padding: 3rem 1rem 1rem !important; border-style: dashed !important; background: rgb(154 124 245 / 5%) !important; cursor: pointer; }
input[type="file"]::file-selector-button { margin-right: .8rem; padding: .65rem .9rem; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--ink-800); color: var(--gold-300); cursor: pointer; }
.privacy-note { display: flex; gap: .6rem; margin: .2rem 0; color: var(--text-muted); font-size: .8rem; }
.privacy-note::before { color: var(--success); content: "⌁"; font-size: 1rem; }
.auth-card { width: min(32rem, 100%); margin: clamp(3rem, 9vw, 7rem) auto; }
.auth-card h1 { margin: .6rem 0 1rem; font-size: clamp(2.2rem, 7vw, 3.5rem); }
.auth-card > p:not(.eyebrow) { color: var(--text-soft); }
.auth-card form ul:not(.errorlist) { color: var(--text-muted); font-size: .8rem; }
.account-confirm-card { text-align: center; }
.account-confirm-card .icon-medallion { margin: 0 auto 1.1rem; }
.account-confirm-card form { margin-top: 1.5rem; }
.auth-entry-card > h1 { margin-bottom: .75rem; }
.auth-entry-card > form { margin-top: 1.6rem; }
.checkbox-field { display: flex; align-items: center; gap: .65rem; cursor: pointer; }
.checkbox-field input { flex: 0 0 auto; }
.auth-help-link { width: fit-content; margin-top: -.5rem; font-size: .86rem; }
.hp-field {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.bot-check { display: grid; gap: .7rem; }
.bot-check-copy { margin: 0; color: var(--text-muted); font-size: .8rem; }
.cf-turnstile { justify-self: start; }
.auth-switch { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.auth-switch p { margin: 0 0 1rem; color: var(--text-soft); font-size: .9rem; }
.auth-alt { margin: 1.2rem 0 0; text-align: center; font-size: .86rem; }
.auth-social { margin-top: 1.3rem; padding-top: 1.3rem; border-top: 1px solid var(--line); }
main > h1, main > p, main > form { width: min(32rem, 100%); margin-inline: auto; }
main > h1 { margin-top: clamp(3rem, 9vw, 7rem); font-size: clamp(2.2rem, 7vw, 3.5rem); }
main > h1 + p { color: var(--text-soft); }
main > form { margin-top: 1.5rem; margin-bottom: clamp(3rem, 9vw, 7rem); padding: clamp(1.3rem, 4vw, 2.35rem); border: 1px solid var(--line); border-radius: var(--radius-lg); background: rgb(255 255 255 / 4%); box-shadow: var(--shadow); }
main > form button[type="submit"] { display: inline-flex; min-height: 3rem; align-items: center; justify-content: center; padding: .75rem 1.25rem; cursor: pointer; border: 0; border-radius: 999px; background: var(--violet-700); color: #fff; font-weight: 800; }
main > form a { color: var(--gold-300); text-decoration: underline; text-underline-offset: .2em; }

.purchase-shell { width: min(60rem, 100%); margin-inline: auto; padding-block: clamp(3rem, 8vw, 6rem); }
.purchase-grid { display: grid; gap: 1rem; }
body.checkout-page {
  background:
    radial-gradient(ellipse at 50% -12%, rgb(118 72 196 / 26%), transparent 34rem),
    radial-gradient(ellipse at 88% 18%, rgb(56 79 152 / 12%), transparent 28rem),
    #12081f;
}
body.checkout-page::before { opacity: .18; }
body.checkout-page main {
  width: 100%;
  min-height: 100dvh;
  margin: 0;
}
.checkout-app {
  display: flex;
  flex-direction: column;
  width: min(64rem, calc(100% - 1.6rem));
  min-height: 100dvh;
  min-height: 100svh;
  margin-inline: auto;
  padding: .75rem .2rem calc(1.4rem + env(safe-area-inset-bottom));
}
.checkout-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 2.8rem;
}
.checkout-top .join-brand { justify-content: flex-start; }
.checkout-lock {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin: 0;
  color: var(--gold-300);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.checkout-lock svg { width: .9rem; height: .9rem; }
.checkout-layout {
  display: grid;
  gap: 1.15rem;
  align-items: start;
}
.checkout-summary { min-width: 0; }
.checkout-summary .eyebrow { margin: 0 0 .35rem; }
.checkout-summary h1 {
  margin: 0 0 1rem;
  font-size: clamp(1.7rem, 5vw, 2.55rem);
  letter-spacing: -.03em;
}
.checkout-order-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .8rem;
  padding: .9rem 1rem;
  border: 1px solid var(--line-strong);
  border-radius: 1.15rem;
  background: linear-gradient(135deg, rgb(232 199 122 / 14%), rgb(162 124 255 / 8%));
}
.checkout-order-card .icon-medallion { width: 2.5rem; height: 2.5rem; font-size: 1rem; }
.checkout-order-card span:nth-child(2) { display: grid; gap: .12rem; min-width: 0; }
.checkout-order-card small { color: var(--text-muted); font-size: .7rem; letter-spacing: .04em; text-transform: uppercase; }
.checkout-order-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.checkout-order-card b {
  color: var(--gold-300);
  font-family: var(--font-display);
  font-size: 1.35rem;
  font-weight: 500;
  white-space: nowrap;
}
.checkout-renewal {
  margin: .85rem 0 0;
  padding: .75rem .9rem;
  border: 1px solid rgb(232 199 122 / 30%);
  border-radius: .85rem;
  background: rgb(232 199 122 / 8%);
  color: var(--text-soft);
  font-size: .86rem;
  line-height: 1.45;
}
.checkout-renewal strong { color: var(--gold-300); }
.checkout-includes {
  display: grid;
  gap: .55rem;
  margin: 1rem 0 0;
  padding: 0;
  color: var(--text-soft);
  font-size: .9rem;
  list-style: none;
}
.checkout-includes li::before { margin-right: .5rem; color: var(--success); content: "✓"; }
.checkout-legal {
  display: none;
  margin: 1.1rem 0 0;
  color: var(--text-muted);
  font-size: .78rem;
}
.checkout-legal a { color: var(--gold-300); text-decoration: underline; text-underline-offset: .2em; }
.checkout-pay { min-width: 0; }
.checkout-frame {
  position: relative;
  overflow: hidden;
  min-height: 36rem;
  border-radius: 1.25rem;
  background: #f7f4ff;
  box-shadow: 0 1.6rem 3.4rem rgb(0 0 0 / 28%);
}
.checkout-frame #embedded-checkout { min-height: inherit; }
.checkout-frame iframe { display: block; width: 100%; min-height: 36rem; border: 0; }
.checkout-skeleton {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  align-content: start;
  gap: .85rem;
  padding: 1.6rem 1.25rem;
  background: #f7f4ff;
}
.checkout-skeleton span {
  display: block;
  height: 3rem;
  border-radius: .8rem;
  background: linear-gradient(90deg, #ece6f8, #f7f4ff 45%, #ece6f8);
  background-size: 200% 100%;
  animation: checkout-shimmer 1.2s ease-in-out infinite;
}
.checkout-skeleton span:first-child { width: 46%; height: 1.4rem; margin: .2rem auto 1rem; }
.checkout-pay.is-ready .checkout-skeleton { display: none; }
.checkout-trust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .7rem 1rem;
  margin-top: .85rem;
  color: var(--text-muted);
  font-size: .74rem;
}
.checkout-trust p { margin: 0; }
.checkout-trust strong { color: var(--text-soft); }
.checkout-trust .payment-marks {
  display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;
  margin: 0; padding: 0; list-style: none;
}
.checkout-trust .payment-marks li {
  display: flex; align-items: center; justify-content: center;
  height: 1.7rem; min-width: 2.3rem; padding: 0 .4rem;
  background: #f7f2e8; border-radius: .3rem;
}
.checkout-trust .payment-marks img {
  display: block; width: auto; height: .85rem; max-width: 2.4rem; object-fit: contain;
}
.checkout-disclaimer {
  margin: 1.4rem 0 0;
  color: var(--text-muted);
  font-size: .72rem;
  text-align: center;
}
@keyframes checkout-shimmer {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}
@media (min-width: 64rem) {
  .checkout-layout {
    grid-template-columns: minmax(17rem, 22rem) minmax(0, 30rem);
    justify-content: center;
    gap: 2.4rem;
    margin-top: .5rem;
  }
  .checkout-summary { position: sticky; top: 1.2rem; padding-top: .4rem; }
  .checkout-summary h1 { font-size: 2.45rem; }
  .checkout-legal { display: block; }
  .checkout-frame, .checkout-frame iframe { min-height: 40rem; }
}
@media (max-width: 63.99rem) {
  .checkout-includes,
  .checkout-summary h1 { display: none; }
  .checkout-summary .eyebrow { margin-bottom: .7rem; }
  .checkout-frame, .checkout-frame iframe { min-height: 32rem; }
}
.order-summary h1 { margin: .5rem 0 1rem; font-size: clamp(2.5rem, 7vw, 4.2rem); }
.price { margin: 1.2rem 0; color: var(--gold-300); font-family: var(--font-display); font-size: clamp(2.1rem, 7vw, 3.4rem); line-height: 1; }
.included-list { display: grid; gap: .7rem; margin: 1.2rem 0 1.7rem; padding: 0; list-style: none; }
.included-list li::before { margin-right: .6rem; color: var(--success); content: "✓"; }
.secure-note { display: flex; align-items: center; gap: .55rem; margin: .8rem 0 0; color: var(--text-muted); font-size: .78rem; }
.secure-note::before { color: var(--gold-300); content: "◇"; }

.reading-list { display: grid; gap: .8rem; }
.reading-row { display: flex; min-height: 5.5rem; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.35rem; }
.reading-row:hover { border-color: var(--line-strong); }
.reading-row > span:first-child { display: grid; gap: .2rem; }
.reading-row small { color: var(--text-muted); }
.status { color: var(--gold-300); font-size: .86rem; }
.status-failed { color: var(--danger); }
.empty-state { padding: clamp(2rem, 7vw, 4rem); text-align: center; }
.empty-state .icon-medallion { margin: 0 auto 1rem; }
.loading-panel, .consulting { padding-block: clamp(3rem, 9vw, 6rem); text-align: center; }
.star-orbit { display: grid; width: 4.5rem; height: 4.5rem; margin: 0 auto 1.25rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300); animation: orbit-pulse 2.2s ease-in-out infinite; }
.processing-steps { display: flex; max-width: 28rem; margin: 1.5rem auto 0; padding: 0; justify-content: center; gap: 1rem; color: var(--text-muted); font-size: .75rem; list-style: none; }
.processing-steps li:first-child { color: var(--gold-300); }
.reading-report, .reading-copy { max-width: 50rem; margin-inline: auto; font-size: 1.04rem; line-height: 1.85; }
.reading-report h1, .reading-report h2, .reading-copy h1, .reading-copy h2 { color: var(--gold-300); }
.reading-report h1, .reading-copy h1 { font-size: 2.5rem; }
.reading-report h2, .reading-copy h2 { margin-top: 2.2rem; font-size: 1.8rem; }
.reading-report ol, .reading-copy ol { margin: 0.4rem 0 0; padding-left: 1.25rem; }
.reading-report li, .reading-copy li { margin: 0.45rem 0; }
.reading-disclaimer, .disclaimer { margin-top: 2rem; color: var(--text-muted); font-size: .78rem; line-height: 1.65; }

.astrology-report-shell { width: min(70rem, 100%); margin-inline: auto; padding-block: clamp(2.5rem, 7vw, 6rem); }
.astrology-report-header { max-width: 48rem; margin: 0 auto 2.5rem; text-align: center; }
.astrology-report-header h1 { margin: .55rem 0 1rem; font-size: clamp(2.6rem, 7vw, 5rem); }
.astrology-report-header .lede { margin-inline: auto; }
.astrology-report-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .7rem;
  margin-top: 1.35rem;
}
.birth-chart-section, .planetary-positions { max-width: 66rem; margin: 0 auto 1rem; }
.chart-section-heading { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.chart-section-heading h2 { margin: .35rem 0 0; font-size: clamp(1.8rem, 4vw, 2.7rem); }
.chart-section-heading > .muted { max-width: 19rem; margin: 0; font-size: .82rem; }
.birth-chart-layout { display: grid; align-items: center; gap: 1.4rem; }
.north-indian-chart-frame {
  position: relative; width: min(100%, 34rem); margin-inline: auto; padding: .75rem; overflow: hidden;
  border: 1px solid var(--line-strong); border-radius: var(--radius); background:
  radial-gradient(circle at 50% 50%, rgb(118 87 232 / 15%), transparent 55%), rgb(7 7 17 / 50%);
  box-shadow: inset 0 0 4rem rgb(118 87 232 / 8%);
}
.north-indian-chart-frame::before {
  position: absolute; inset: .5rem; border: 1px solid rgb(232 199 122 / 14%); border-radius: calc(var(--radius) - .3rem);
  content: ""; pointer-events: none;
}
.north-indian-chart { display: block; width: 100%; height: auto; filter: drop-shadow(0 .8rem 1.4rem rgb(0 0 0 / 35%)); }
.chart-outline { fill: rgb(10 9 26 / 72%); stroke: var(--gold-500); stroke-width: 2.2; }
.chart-line { fill: none; stroke: rgb(232 199 122 / 46%); stroke-width: 1.25; }
.chart-core { fill: rgb(18 17 38 / 96%); stroke: var(--gold-500); stroke-width: 1.25; }
.chart-core-label, .chart-core-subtitle, .chart-sign, .chart-house-number, .chart-planets { text-anchor: middle; font-family: var(--font-sans); }
.chart-core-label { fill: var(--gold-300); font-family: var(--font-display); font-size: 22px; }
.chart-core-subtitle { fill: var(--text-muted); font-size: 9px; font-weight: 800; letter-spacing: 2px; }
.chart-sign { fill: var(--gold-300); font-family: var(--font-display); font-size: 20px; }
.chart-house-number { fill: var(--text-muted); font-size: 9px; font-weight: 800; letter-spacing: 1.3px; }
.chart-planets { fill: var(--text); font-size: 13px; font-weight: 800; }
.chart-house { opacity: 0; animation: chart-placement-reveal .65s cubic-bezier(.2,.8,.2,1) both; animation-delay: var(--reveal-delay); }
.chart-key { padding: 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: rgb(255 255 255 / 3%); }
.chart-key dl { display: grid; gap: .75rem; margin: 1rem 0; }
.chart-key dl div { display: grid; gap: .15rem; padding-bottom: .7rem; border-bottom: 1px solid var(--line); }
.chart-key dl div:last-child { padding-bottom: 0; border-bottom: 0; }
.chart-key dt { color: var(--text-muted); font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.chart-key dd { margin: 0; color: var(--text-soft); font-size: .9rem; }
.chart-note { margin: 1rem 0 0; color: var(--text-muted); font-size: .78rem; line-height: 1.55; }
.chart-birth-summary { display: grid; gap: .1rem; color: var(--text-muted); font-size: .8rem; text-align: right; }
.chart-birth-summary strong { color: var(--text); font-size: .95rem; }
.positions-table-wrap { overflow-x: auto; }
.planetary-positions table { width: 100%; min-width: 42rem; border-collapse: collapse; font-size: .88rem; }
.planetary-positions th, .planetary-positions td { padding: .82rem .7rem; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.planetary-positions thead th { color: var(--gold-300); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.planetary-positions tbody th { color: var(--text); font-weight: 800; }
.planetary-positions td { color: var(--text-soft); }
.astrology-reading-copy { margin-top: 1rem; }
.astrology-funnel-shell { width: min(60rem, 100%); margin-inline: auto; padding-block: clamp(1.75rem, 6vw, 5.5rem); min-width: 0; }
.astrology-funnel-header { max-width: 48rem; margin: 0 auto 2rem; text-align: center; }
.astrology-funnel-header h1 { margin: .55rem 0 1rem; font-size: clamp(1.7rem, 6vw, 2.75rem); line-height: 1.2; letter-spacing: -.02em; }
.astrology-funnel-header .lede { margin-inline: auto; }
.astrology-funnel { display: block; max-width: 48rem; margin-inline: auto; }
.funnel-progress { display: grid; gap: .55rem; margin: 0 0 1.15rem; color: var(--text-muted); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.funnel-progress-track { height: .35rem; overflow: hidden; border-radius: 999px; background: rgb(255 255 255 / 9%); }
.funnel-progress-track i { display: block; width: 20%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet-500), var(--gold-500)); transition: width .35s ease; }
.astrology-funnel-card { min-height: 28rem; }
.astrology-funnel-card h2 { margin: .45rem 0 .85rem; font-size: clamp(1.85rem, 5vw, 2.7rem); }
.funnel-choice-grid { display: grid; gap: .75rem; margin-top: 1.6rem; }
.funnel-choice {
  display: grid; gap: .25rem; width: 100%; padding: 1.1rem; cursor: pointer; border: 1px solid var(--line); border-radius: var(--radius);
  background: rgb(255 255 255 / 3%); color: var(--text); text-align: left; transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.funnel-choice:hover, .funnel-choice.is-selected { border-color: var(--gold-500); background: rgb(232 199 122 / 8%); transform: translateY(-2px); }
.funnel-choice strong { font-size: 1rem; }
.funnel-choice span { color: var(--text-muted); font-size: .84rem; line-height: 1.5; }
.funnel-fields { display: grid; gap: 1rem; margin-top: 1.6rem; min-width: 0; }
.funnel-fields > * { min-width: 0; }
.funnel-card-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .7rem; margin-top: 1.6rem; }
.chart-preview { position: relative; display: grid; width: 8.5rem; height: 8.5rem; margin: 0 auto 1.25rem; place-items: center; color: var(--gold-300); font-size: 1.9rem; }
.chart-preview::before, .chart-preview::after { position: absolute; border: 1px solid var(--line-strong); border-radius: 50%; content: ""; }
.chart-preview::before { inset: 0; animation: slow-spin 18s linear infinite; }
.chart-preview::after { inset: 1.2rem; border-style: dashed; animation: slow-spin 10s linear infinite reverse; }
.chart-preview-diamond { position: absolute; inset: 1.8rem; border: 1px solid var(--gold-500); transform: rotate(45deg); animation: chart-preview-pulse 2.6s ease-in-out infinite; }
.chart-preview > span { z-index: 1; animation: chart-preview-pulse 2.6s .25s ease-in-out infinite; }
.astrology-unlock-card { text-align: center; }
.astrology-unlock-card .included-list { max-width: 36rem; margin: 1.6rem auto; text-align: left; }
.unlock-summary { display: grid; gap: .25rem; max-width: 34rem; margin: 1.25rem auto; padding: .9rem 1rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: rgb(232 199 122 / 6%); }
.unlock-summary span { color: var(--gold-300); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.unlock-summary strong { overflow-wrap: anywhere; font-size: .85rem; font-weight: 650; }
.unlock-price-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin: 1.6rem 0 1rem; padding-top: 1.2rem; border-top: 1px solid var(--line); text-align: left; }
.unlock-price-row > div { display: grid; gap: .1rem; }
.unlock-price-row strong { color: var(--gold-300); font-family: var(--font-display); font-size: 2.15rem; line-height: 1; }
.plan-choice-grid { display: grid; gap: .7rem; margin: 1.5rem 0; text-align: left; }
.plan-choice {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; padding: 1rem; cursor: pointer;
  border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgb(255 255 255 / 3%); color: var(--text); text-align: left;
}
.plan-choice:hover, .plan-choice.is-selected { border-color: var(--gold-500); background: rgb(232 199 122 / 8%); }
.plan-choice span { display: grid; gap: .15rem; }
.plan-choice small, .weekly-email-choice small { color: var(--text-muted); font-size: .76rem; line-height: 1.4; }
.plan-choice b { flex: 0 0 auto; color: var(--gold-300); font-family: var(--font-display); font-size: 1.45rem; font-weight: 500; }
.plan-choice .plan-choice-price { flex: 0 0 auto; justify-items: end; text-align: right; }
.plan-choice .plan-choice-price small { max-width: 10rem; color: var(--text-soft); }
.weekly-email-choice { display: grid; grid-template-columns: 1.2rem 1fr; gap: .75rem; margin: 1.25rem 0; padding: .85rem; border: 1px solid var(--line); border-radius: var(--radius-sm); text-align: left; }
.weekly-email-choice input { margin-top: .25rem; accent-color: var(--gold-500); }
.weekly-email-choice span { display: grid; gap: .15rem; }
.weekly-insights { margin-top: 3rem; padding-top: 2.4rem; border-top: 1px solid var(--line); }
.weekly-insights h2 { margin: .35rem 0 .5rem; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.02em; }
.weekly-insight-list { display: grid; gap: .7rem; margin-top: 1.3rem; }
.weekly-insight { padding: 0; overflow: hidden; }
.weekly-insight summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.3rem; cursor: pointer; list-style: none; }
.weekly-insight summary::-webkit-details-marker { display: none; }
.weekly-insight summary span:first-child { display: grid; gap: .1rem; }
.weekly-insight summary small { color: var(--text-muted); }
.weekly-insight summary > span:last-child { color: var(--gold-300); font-size: 1.35rem; }
.weekly-insight[open] summary > span:last-child { transform: rotate(45deg); }
.weekly-insight-copy { padding: 0 1.3rem 1.3rem; color: var(--text-soft); font-size: 1rem; line-height: 1.75; }
.weekly-insight-copy > :first-child { margin-top: 0; }
.weekly-insight-copy h1 {
  margin: 0 0 .75rem; color: var(--text);
  font-size: clamp(1.25rem, 2.4vw, 1.55rem); letter-spacing: -.02em; line-height: 1.25;
}
.weekly-insight-copy h2 {
  margin: 1.35rem 0 .45rem; color: var(--gold-300);
  font-size: 1.12rem; letter-spacing: -.01em; line-height: 1.3;
}
.weekly-insight-copy h3 { margin: 1.1rem 0 .35rem; color: var(--text); font-size: 1.02rem; }
.weekly-insight-copy p { margin: 0 0 .9rem; }
.weekly-insight-copy ul, .weekly-insight-copy ol { margin: 0 0 .9rem; padding-left: 1.15rem; }
.astrology-member-shell { width: min(52rem, 100%); margin-inline: auto; padding-block: clamp(2.5rem, 7vw, 6rem); }
.astrology-member-header { max-width: 38rem; margin: 0 auto 2.5rem; text-align: center; }
.astrology-member-header h1 { margin: .5rem 0 .9rem; font-size: clamp(2rem, 5vw, 3.1rem); letter-spacing: -.03em; }
.astrology-member-header .lede { margin-inline: auto; }
.member-email-preference { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .55rem 1rem; margin: 1.35rem auto 0; color: var(--text-muted); font-size: .8rem; }
.member-email-preference .text-link { border: 0; padding: 0; cursor: pointer; background: transparent; }
.member-orbit { position: relative; display: grid; width: 5.25rem; height: 5.25rem; margin: 0 auto 1rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300); font-size: 1.5rem; }
.member-orbit::before, .member-orbit::after { position: absolute; border: 1px solid var(--line); border-radius: 50%; content: ""; }
.member-orbit::before { inset: -.65rem; border-style: dashed; animation: slow-spin 16s linear infinite; }
.member-orbit::after { inset: .85rem; animation: slow-spin 9s linear infinite reverse; }
.member-orbit span { animation: chart-preview-pulse 2.8s ease-in-out infinite; }
.member-access-cards { display: grid; gap: 1rem; margin-bottom: 2.8rem; }
.member-chart-card { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.4rem; margin-bottom: 2.8rem; }
.member-access-cards .member-chart-card { margin-bottom: 0; }
.member-chart-card > div { max-width: 38rem; }
.member-chart-card h2, .member-reading-history h2 { margin: .35rem 0 .65rem; font-size: clamp(1.45rem, 3vw, 2rem); letter-spacing: -.02em; }
.member-chart-card p:last-child { margin-bottom: 0; }
.member-insights { margin-top: 0; }
.week-picker {
  display: flex; align-items: center; gap: .55rem; margin: 1.25rem 0 .8rem;
}
.week-picker-arrow {
  display: grid; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; place-items: center;
  border: 1px solid var(--line-strong); border-radius: 50%;
  color: var(--gold-300); font-size: 1.45rem; line-height: 1;
}
.week-picker-arrow:hover { border-color: var(--gold-500); background: rgb(232 199 122 / 8%); }
.week-picker-arrow.is-disabled { opacity: .32; pointer-events: none; }
.week-picker-form { display: flex; flex: 1; min-width: 0; gap: .45rem; }
.week-picker-form select {
  flex: 1; min-width: 0; height: 2.6rem; padding: 0 .85rem;
  border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
  background: rgb(255 255 255 / 4%); color: var(--text); font: inherit;
}
.week-picker-form button { flex: 0 0 auto; }
.week-shortcuts { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 1.15rem; }
.week-chip {
  padding: .4rem .85rem; border: 1px solid var(--line); border-radius: 999px;
  color: var(--text-soft); font-size: .8rem;
}
.week-chip:hover { border-color: var(--gold-500); color: var(--gold-300); }
.week-chip.is-active {
  border-color: var(--gold-500); color: var(--gold-300);
  background: rgb(232 199 122 / 10%);
}
.weekly-insight-card { padding: 1.2rem 1.3rem 1.35rem; }
.weekly-insight-card-header h3 {
  margin: .2rem 0 1rem; font-size: clamp(1.2rem, 3vw, 1.55rem); letter-spacing: -.02em;
}
.member-insight-empty { display: flex; align-items: flex-start; gap: 1rem; margin-top: 1.3rem; }
.member-insight-empty h3 { margin: .2rem 0 .35rem; }
.member-insight-empty p { margin: 0; }
.member-reading-history { margin-top: 3rem; padding-top: 2.4rem; border-top: 1px solid var(--line); }
.profile-shell { width: min(66rem, 100%); margin-inline: auto; padding-block: clamp(2.5rem, 7vw, 6rem); }
.profile-header { max-width: 45rem; margin-bottom: 2rem; }
.profile-header h1 { margin: .5rem 0 .9rem; font-size: clamp(2.6rem, 7vw, 4.8rem); }
.profile-grid { display: grid; gap: 1rem; }
.profile-grid h2 { margin: .4rem 0 1.4rem; font-size: clamp(1.55rem, 4vw, 2.15rem); overflow-wrap: anywhere; }
.subscription-panel { display: grid; align-content: start; }
.subscription-card { display: grid; gap: .8rem; padding: 1rem 0; border-top: 1px solid var(--line); }
.subscription-card > div { display: grid; gap: .15rem; }
.subscription-card small { color: var(--text-muted); }
.subscription-notice { margin: 0; color: var(--gold-300); font-size: .84rem; }
.subscription-card form { display: block; }
.reading-credits { display: grid; gap: 1.25rem; margin-top: 1rem; }
.reading-credits h2 { margin: .35rem 0; }
.reading-credits .muted { margin: 0; }
.reading-credit-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .7rem; }
.reading-credit { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: .75rem; padding: .8rem; border: 1px solid var(--line); border-radius: .85rem; background: rgb(232 199 122 / 5%); }
.reading-credit span:last-child { display: grid; gap: .15rem; }
.reading-credit small { color: var(--gold-300); font-size: .8rem; }
.profile-reading-links { display: grid; gap: .8rem; margin-top: 1rem; }
.profile-reading-links a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; }
.profile-reading-links span:nth-child(2) { display: grid; gap: .1rem; }
.profile-reading-links small { color: var(--text-muted); }
.profile-reading-links b { color: var(--gold-300); font-size: 1.3rem; }

@keyframes chart-preview-pulse {
  0%, 100% { filter: drop-shadow(0 0 0 rgb(232 199 122 / 0%)); opacity: .8; transform: scale(1) rotate(45deg); }
  50% { filter: drop-shadow(0 0 1rem rgb(232 199 122 / 55%)); opacity: 1; transform: scale(1.12) rotate(45deg); }
}

@keyframes chart-placement-reveal {
  from { opacity: 0; transform: scale(.76); }
  to { opacity: 1; transform: scale(1); }
}
.tarot-draw { display: grid; grid-template-columns: repeat(2, minmax(0, 10rem)); justify-content: center; gap: 1.5rem; margin: 2rem 0 3rem; }
.tarot-card {
  position: relative; text-align: center; transform-origin: 50% 85%;
  animation: card-reveal .75s cubic-bezier(.2,.8,.2,1) both;
  animation-delay: calc(var(--card-index, 0) * 110ms);
  transition: transform .28s ease, filter .28s ease;
}
.tarot-card:hover { z-index: 2; transform: translateY(-.65rem) rotate(.7deg); filter: drop-shadow(0 1.2rem 1.2rem rgb(0 0 0 / 40%)); }
.card-art { display: block; width: 100%; aspect-ratio: 2/3; border: 2px solid #bd9f58; border-radius: .65rem; background: var(--ink-800); box-shadow: 0 16px 36px #0009; object-fit: cover; transition: transform .35s ease; }
.tarot-card.reversed .card-art { border-color: var(--violet-300); }
.card-position { margin: .8rem 0 .2rem; color: var(--gold-300); font-size: .7rem; letter-spacing: .13em; text-transform: uppercase; }
.tarot-card h3 { margin: 0; font-size: 1.15rem; }
.tarot-card small { color: var(--text-muted); }
.tarot-draw.celtic-cross { grid-template-columns: repeat(2, minmax(0, 7rem)); gap: 1rem; }
.celtic-cross .tarot-card { width: 100%; }
.celtic-cross .card-number {
  position: absolute; z-index: 2; top: .35rem; left: .35rem; display: grid;
  width: 1.35rem; height: 1.35rem; place-items: center; border: 1px solid rgb(255 255 255 / 45%);
  border-radius: 50%; background: rgb(7 7 17 / 86%); color: var(--gold-300);
  font-size: .62rem; font-weight: 850; box-shadow: 0 .2rem .6rem #0008;
}
.celtic-cross .card-position { margin-top: .5rem; font-size: .59rem; letter-spacing: .09em; }
.celtic-cross .tarot-card h3 { font-size: .92rem; }
.celtic-cross .tarot-card small { font-size: .7rem; }
.celtic-legend { display: none; }
.tarot-deck-scene {
  position: relative; width: min(13rem, 72%); height: 12.5rem; margin: 0 auto 2rem;
  perspective: 50rem;
}
.deck-card {
  position: absolute; top: .5rem; left: 50%; display: grid; width: 7rem; aspect-ratio: 2/3; place-items: center;
  border: 2px solid var(--gold-500); border-radius: .65rem;
  background:
    radial-gradient(circle at center, rgb(232 199 122 / 16%) 0 5%, transparent 6%),
    repeating-conic-gradient(from 45deg, rgb(154 124 245 / 14%) 0 10deg, transparent 10deg 20deg),
    var(--ink-800);
  box-shadow: 0 1.1rem 2.2rem rgb(0 0 0 / 45%); color: var(--gold-300); font-size: 1.65rem;
}
.deck-card.card-one { transform: translateX(-72%) rotate(-13deg); animation: deck-breathe 4.8s ease-in-out infinite; }
.deck-card.card-two { z-index: 2; transform: translateX(-50%) translateY(-.45rem); animation: deck-breathe 4.8s .3s ease-in-out infinite; }
.deck-card.card-three { transform: translateX(-28%) rotate(13deg); animation: deck-breathe 4.8s .6s ease-in-out infinite; }
.tarot-loader { position: relative; width: 8rem; height: 7rem; margin: 0 auto 1.5rem; perspective: 40rem; }
.tarot-loader span {
  position: absolute; top: 0; left: 2.25rem; width: 3.5rem; aspect-ratio: 2/3; overflow: hidden;
  border: 1px solid var(--gold-500); border-radius: .35rem;
  background: repeating-conic-gradient(from 45deg, var(--ink-800) 0 12deg, #2a2050 12deg 24deg);
  box-shadow: 0 .8rem 1.6rem #0008;
}
.tarot-loader img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tarot-loader span:nth-child(1) { animation: shuffle-left 1.8s ease-in-out infinite; }
.tarot-loader span:nth-child(2) { z-index: 2; animation: shuffle-center 1.8s .12s ease-in-out infinite; }
.tarot-loader span:nth-child(3) { animation: shuffle-right 1.8s .24s ease-in-out infinite; }

.result-hero { max-width: 48rem; margin-inline: auto; padding-block: clamp(4rem, 12vw, 8rem); text-align: center; }
.result-icon { display: grid; width: 5rem; height: 5rem; margin: 0 auto 1.4rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: rgb(232 199 122 / 7%); color: var(--gold-300); font-size: 2rem; }
.result-hero h1 { margin: .5rem 0 1rem; font-size: clamp(2.5rem, 8vw, 4.5rem); }
.error-shell {
  width: min(44rem, 100%); margin-inline: auto; padding-block: clamp(3.5rem, 10vw, 7rem);
  text-align: center;
}
.error-shell h1 { margin: .65rem 0 1rem; font-size: clamp(2.35rem, 7vw, 4.4rem); }
.error-shell .lede { max-width: 38rem; margin-inline: auto; }
.error-orbit {
  position: relative; display: grid; width: 7rem; height: 7rem; margin: 0 auto 1.5rem;
  place-items: center; border: 1px solid var(--line-strong); border-radius: 50%;
  background: radial-gradient(circle, rgb(118 87 232 / 18%), transparent 68%);
  color: var(--gold-300); font-family: var(--font-display); font-size: 1.45rem;
  box-shadow: 0 0 3rem rgb(118 87 232 / 15%);
}
.error-orbit::before, .error-orbit::after {
  position: absolute; border: 1px solid var(--line); border-radius: 50%; content: "";
}
.error-orbit::before { inset: -.65rem; border-style: dashed; animation: slow-spin 18s linear infinite; }
.error-orbit::after { inset: 1rem; }
.error-support { margin-top: 1.5rem; color: var(--text-muted); font-size: .84rem; }
.reading-transition { width: min(23rem, 100%); margin: 1.8rem auto 0; }
.transition-cards { position: relative; width: 9rem; height: 8.5rem; margin-inline: auto; perspective: 40rem; }
.transition-cards span {
  position: absolute; top: 0; left: 50%; width: 4.2rem; aspect-ratio: 2/3; overflow: hidden;
  border: 1px solid var(--gold-500); border-radius: .45rem; background: var(--ink-800);
  box-shadow: 0 1rem 2rem #0009; transform-origin: 50% 110%;
}
.transition-cards span:nth-child(1) { animation: transition-card-left 1.4s ease-in-out infinite; }
.transition-cards span:nth-child(2) { z-index: 2; animation: transition-card-center 1.4s .12s ease-in-out infinite; }
.transition-cards span:nth-child(3) { animation: transition-card-right 1.4s .24s ease-in-out infinite; }
.transition-cards img { display: block; width: 100%; height: 100%; object-fit: cover; }
.transition-message { margin: .7rem 0 .9rem; color: var(--text-soft); font-size: .9rem; }
.transition-progress { display: block; height: .2rem; overflow: hidden; border-radius: 99px; background: rgb(255 255 255 / 9%); }
.transition-progress i { display: block; width: 100%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--violet-500), var(--gold-500)); transform-origin: left; animation: transition-progress 1.8s linear both; }
.transition-fallback { display: inline-block; margin-top: .75rem; font-size: .78rem; }
.dream-transition,
.palm-transition { width: min(23rem, 100%); margin: 1.8rem auto 0; }
.palm-transition-art,
.palm-loading-art {
  width: min(14rem, 70%); height: min(16rem, 46vw); margin: 0 auto .85rem;
}
.palm-transition-art .palm-figure,
.palm-loading-art .palm-figure { width: auto; height: 100%; }
.palm-loading-panel { text-align: center; }
.palm-result-photo {
  width: min(16.5rem, 68%);
  margin: 0 auto 1.35rem;
  text-align: center;
}
.palm-result-photo--loading { margin-bottom: .95rem; }
.palm-result-photo--loading .palm-result-frame {
  border-color: rgb(232 199 122 / 34%);
  animation: palm-frame-breathe 2.8s ease-in-out infinite;
}
.palm-result-photo--loading .palm-traced-map { z-index: 2; }
.palm-result-photo--loading .palm-line {
  animation: palm-loading-line 5.4s ease-in-out infinite;
}
.palm-result-photo--loading .palm-line-head { animation-delay: .65s; }
.palm-result-photo--loading .palm-line-life { animation-delay: 1.3s; }
.palm-result-photo--loading .palm-line-fate { animation-delay: 1.95s; }
.palm-loading-glow,
.palm-loading-scan,
.palm-loading-corners { position: absolute; pointer-events: none; }
.palm-loading-glow {
  z-index: 1; inset: 0;
  background: radial-gradient(circle at 50% 52%, transparent 42%, rgb(118 87 232 / 22%) 100%);
  animation: palm-glow-pulse 2.8s ease-in-out infinite;
}
.palm-loading-scan {
  z-index: 3; right: 7%; left: 7%; top: 10%; height: 2px; border-radius: 999px;
  background: linear-gradient(90deg, transparent, #fff4c7 24%, #ff6f91 50%, #fff4c7 76%, transparent);
  box-shadow: 0 0 .65rem rgb(255 111 145 / 85%), 0 0 1.8rem rgb(232 199 122 / 45%);
  animation: palm-loading-scan 2.6s cubic-bezier(.45, 0, .55, 1) infinite alternate;
}
.palm-loading-corners {
  z-index: 4; inset: .65rem; border: 1px solid transparent;
  background:
    linear-gradient(var(--gold-300), var(--gold-300)) left top / 1.25rem 1px no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) left top / 1px 1.25rem no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) right top / 1.25rem 1px no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) right top / 1px 1.25rem no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) left bottom / 1.25rem 1px no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) left bottom / 1px 1.25rem no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) right bottom / 1.25rem 1px no-repeat,
    linear-gradient(var(--gold-300), var(--gold-300)) right bottom / 1px 1.25rem no-repeat;
  opacity: .75;
}
.palm-loading-progress {
  width: min(24rem, 88%); height: .3rem; margin: 1.4rem auto 0; overflow: hidden;
  border-radius: 999px; background: rgb(255 255 255 / 7%);
}
.palm-loading-progress i {
  display: block; width: 44%; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, transparent, var(--gold-300), #ff6f91, transparent);
  animation: palm-progress-travel 2.2s ease-in-out infinite;
}
.palm-processing-steps li {
  display: grid; min-width: 5.5rem; gap: .3rem; justify-items: center;
  animation: palm-step-cycle 6s ease-in-out infinite;
}
.palm-processing-steps li:nth-child(2) { animation-delay: 2s; }
.palm-processing-steps li:nth-child(3) { animation-delay: 4s; }
.palm-processing-steps i {
  display: grid; width: 1.8rem; height: 1.8rem; place-items: center;
  border: 1px solid currentColor; border-radius: 50%; font-style: normal;
}
.palm-wait-note {
  max-width: 31rem; margin: 1.4rem auto 0; color: var(--text-muted);
  font-size: .78rem; line-height: 1.55;
}
.palm-result-frame {
  position: relative; overflow: hidden; aspect-ratio: 3 / 4;
  border: 1px solid var(--line-strong); border-radius: 1rem; background: #090814;
  box-shadow: 0 16px 36px rgb(0 0 0 / 28%);
}
.palm-result-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.palm-result-photo figcaption {
  margin: .55rem 0 0; color: var(--text-muted); font-size: .8rem; line-height: 1.45;
}
.soulmate-transition { width: min(28rem, 100%); margin: 1.8rem auto 0; text-align: center; }
.soulmate-transition h2 { margin: .35rem 0 .55rem; }
.soulmate-transition .actions { margin-top: 1.1rem; }
.astrology-transition { width: min(23rem, 100%); margin: 1.8rem auto 0; }
.astrology-transition-chart { position: relative; display: grid; width: 8.5rem; height: 8.5rem; margin: 0 auto .75rem; place-items: center; color: var(--gold-300); font-size: 1.6rem; }
.astrology-transition-chart::before, .astrology-transition-chart::after { position: absolute; border: 1px solid var(--line-strong); border-radius: 50%; content: ""; }
.astrology-transition-chart::before { inset: 0; border-style: dashed; animation: slow-spin 11s linear infinite; }
.astrology-transition-chart::after { inset: 1.25rem; animation: slow-spin 6s linear infinite reverse; }
.astrology-transition-chart i { position: absolute; inset: 2rem; border: 1px solid var(--gold-500); transform: rotate(45deg); animation: chart-preview-pulse 2.2s ease-in-out infinite; }
.astrology-transition-chart span { z-index: 1; animation: chart-preview-pulse 2.2s .2s ease-in-out infinite; }

.funnel-shell { width: min(68rem, 100%); margin-inline: auto; padding-block: clamp(2.5rem, 7vw, 6rem); }
.funnel-hero { display: grid; align-items: center; gap: 2rem; padding-bottom: clamp(3rem, 8vw, 6rem); text-align: center; }
.funnel-hero h1 { margin: .5rem auto 1rem; max-width: 52rem; font-size: clamp(2.7rem, 8vw, 5.3rem); }
.funnel-hero img { max-height: 30rem; margin-inline: auto; border-radius: var(--radius-lg); object-fit: cover; box-shadow: var(--shadow); }
.quiz-wrap { max-width: 44rem; margin-inline: auto; }
.quiz-progress { height: .35rem; margin-bottom: 1.5rem; overflow: hidden; border-radius: 99px; background: rgb(255 255 255 / 8%); }
.quiz-progress span { display: block; width: var(--quiz-progress, 0%); height: 100%; background: var(--gold-500); transition: width .3s ease; }
.quiz-card { min-height: 25rem; text-align: left; }
.quiz-card h2 { margin: .5rem 0 1.5rem; font-size: clamp(1.8rem, 5vw, 2.7rem); }
.option-grid { display: grid; gap: .7rem; }
.option-button { width: 100%; min-height: 3.25rem; padding: .8rem 1rem; cursor: pointer; border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgb(255 255 255 / 3%); color: var(--text); text-align: left; }
.option-button:hover { border-color: var(--violet-500); background: rgb(154 124 245 / 9%); }
.long-form-body { display: grid; gap: 1rem; max-width: 48rem; margin: 0 auto; }
.long-form-section { padding: clamp(1.4rem, 4vw, 2.2rem); border-left: 1px solid var(--line-strong); }
.long-form-section h2 { margin-top: 0; font-size: clamp(1.7rem, 5vw, 2.5rem); }
.quote-grid { display: grid; gap: 1rem; }
blockquote { margin: 0; padding: 1.5rem; border: 1px solid var(--line); border-radius: var(--radius); background: rgb(255 255 255 / 3%); color: var(--text-soft); }
blockquote cite { display: block; margin-top: .8rem; color: var(--gold-300); font-style: normal; font-size: .85rem; }
.offer-card { max-width: 46rem; margin: clamp(3rem, 8vw, 6rem) auto 0; text-align: center; }
.teaser-reveal { position: relative; max-width: 38rem; margin: 2rem auto; overflow: hidden; padding: clamp(2rem, 7vw, 4rem); border-color: var(--line-strong); text-align: center; }
.teaser-symbol { display: grid; width: 5rem; height: 5rem; margin: 0 auto 1rem; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300); font-size: 2rem; }
.sticky-mobile-cta {
  position: fixed; z-index: 45; right: 0; bottom: 0; left: 0; display: flex; align-items: center; gap: .8rem;
  padding: .7rem max(1rem, env(safe-area-inset-left)) calc(.7rem + env(safe-area-inset-bottom));
  border-top: 1px solid var(--line); background: rgb(7 7 17 / 94%); backdrop-filter: blur(16px);
}
.sticky-mobile-cta[hidden] { display: none !important; }
.sticky-mobile-cta span { flex: 1; font-size: .78rem; color: var(--text-soft); }
.sticky-mobile-cta .button { min-height: 3rem; white-space: nowrap; }

.horoscope-index, .horoscope-article { width: min(62rem, 100%); margin-inline: auto; padding-block: clamp(2.8rem, 7vw, 6rem); }
.horoscope-index > .section-heading { max-width: 48rem; }
.horoscope-index h1, .horoscope-article-header h1 { margin: .55rem 0 1rem; font-size: clamp(2.55rem, 7vw, 4.8rem); }
.horoscope-post-grid { display: grid; gap: 1rem; }
.horoscope-post-card { display: flex; flex-direction: column; }
.horoscope-post-card time, .article-meta { color: var(--gold-300); font-size: .75rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.horoscope-post-card h2 { margin: .55rem 0 .7rem; font-size: clamp(1.55rem, 4vw, 2.1rem); }
.horoscope-post-card p { color: var(--text-soft); }
.post-card-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem; margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--line); color: var(--text-muted); font-size: .78rem; }
.horoscope-article-header { max-width: 52rem; margin: 0 auto 2rem; text-align: center; }
.horoscope-article-header .lede { max-width: 46rem; margin-inline: auto; }
.article-meta { display: flex; flex-wrap: wrap; justify-content: center; gap: .65rem 1.2rem; margin-top: 1.3rem; color: var(--text-muted); }
.article-meta span:not(:last-child)::after, .article-meta time::after { margin-left: 1.2rem; color: var(--gold-500); content: "✦"; }
.daily-sky-card { display: flex; max-width: 46rem; align-items: center; gap: 1.1rem; margin: 0 auto 2.5rem; padding: 1.2rem 1.4rem; }
.daily-sky-card .icon-medallion { flex: 0 0 auto; }
.daily-sky-card h2 { margin: .25rem 0; font-size: 1.45rem; }
.daily-sky-card p:last-child { margin: 0; color: var(--text-muted); font-size: .82rem; }
.horoscope-copy { max-width: 46rem; margin-inline: auto; color: var(--text-soft); font-size: 1.03rem; line-height: 1.85; }
.horoscope-copy h1 { display: none; }
.horoscope-copy h2 { margin: 3rem 0 .8rem; padding-top: .6rem; border-top: 1px solid var(--line); color: var(--gold-300); font-size: clamp(1.65rem, 4vw, 2.2rem); }
.horoscope-copy p { margin: 0 0 1.15rem; }
.horoscope-copy strong { color: var(--text); }
.horoscope-cta { max-width: 46rem; margin: 3rem auto 0; text-align: center; }
.horoscope-cta h2 { margin: .4rem 0 .8rem; font-size: clamp(1.8rem, 5vw, 2.7rem); }
.horoscope-cta p { color: var(--text-soft); }

.messages { width: min(44rem, calc(100% - 2rem)); margin: 1rem auto; padding: .6rem 1rem; border: 1px solid rgb(143 221 191 / 30%); border-radius: var(--radius-sm); background: rgb(143 221 191 / 8%); color: #d9fff0; }
.messages p { margin: .35rem 0; }
.site-footer { margin-top: 3rem; border-top: 1px solid var(--line); background: rgb(0 0 0 / 18%); }
.footer-grid { display: grid; gap: 2rem; padding-block: 2.5rem; }
.footer-brand p { max-width: 26rem; color: var(--text-muted); font-size: .85rem; }
.footer-nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: .6rem 1.5rem; }
.footer-legal { display: flex; flex-direction: column; gap: .55rem; }
.footer-nav a, .footer-legal a, .social-links a { color: var(--text-soft); font-size: .86rem; }
.footer-nav a:hover, .footer-legal a:hover, .social-links a:hover { color: var(--gold-300); }
.social-links { display: flex; flex-wrap: wrap; gap: 1rem; }
.footer-bottom {
  display: flex; flex-wrap: wrap; gap: .85rem 1.25rem; align-items: center;
  justify-content: space-between; padding: 1rem 0 1.5rem; border-top: 1px solid var(--line);
  color: var(--text-muted); font-size: .75rem;
}
.footer-bottom-copy { display: flex; flex-wrap: wrap; gap: .45rem 1.2rem; max-width: 38rem; }
.site-footer .payment-marks {
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
  margin: 0; padding: 0; list-style: none;
}
.site-footer .payment-marks li {
  display: flex; align-items: center; justify-content: center;
  box-sizing: border-box; height: 2rem; min-width: 2.7rem; padding: 0 .5rem;
  overflow: hidden; background: #f7f2e8; border-radius: .35rem;
}
.site-footer .payment-marks img {
  display: block; width: auto; height: 1rem; max-width: 2.8rem; max-height: 1.15rem;
  object-fit: contain;
}
.site-footer .payment-marks img[alt="Mastercard"] { height: 1.15rem; max-width: 1.85rem; }
.site-footer .payment-marks img[alt="Apple Pay"] { height: 1.15rem; max-width: 2.6rem; }
.site-footer .payment-marks img[alt="Google Pay"] { height: .9rem; max-width: 3.2rem; }

.legal-page { width: min(46rem, 100%); margin-inline: auto; padding-block: clamp(2.8rem, 7vw, 5.5rem); }
.legal-page-header { margin-bottom: 2rem; }
.legal-page-header h1 { margin: .4rem 0 .6rem; font-size: clamp(2.2rem, 6vw, 3.6rem); }
.legal-updated { color: var(--text-muted); font-size: .85rem; }
.legal-copy { color: var(--text-soft); font-size: 1.02rem; line-height: 1.8; }
.legal-copy h2 { margin: 2.4rem 0 .7rem; color: var(--gold-300); font-size: clamp(1.35rem, 3vw, 1.7rem); }
.legal-copy h3 { margin: 1.5rem 0 .5rem; font-size: 1.05rem; color: var(--text); }
.legal-copy p, .legal-copy ul, .legal-copy ol, .legal-copy table { margin: 0 0 1.1rem; }
.legal-copy ul, .legal-copy ol { padding-left: 1.2rem; }
.legal-copy li { margin: .3rem 0; }
.legal-copy a { color: var(--gold-300); text-decoration: underline; text-underline-offset: .2em; }
.legal-copy strong { color: var(--text); }
.legal-copy table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.legal-copy th, .legal-copy td { padding: .55rem .65rem; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.legal-copy th { color: var(--text); background: rgb(255 255 255 / 4%); }
.legal-page-nav { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.legal-page-nav a { color: var(--text-soft); font-size: .86rem; }
.legal-page-nav a:hover { color: var(--gold-300); }

.cookie-banner {
  position: fixed; z-index: 80; right: 1rem; bottom: 1rem; left: 1rem;
  display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; justify-content: space-between;
  width: min(40rem, calc(100% - 2rem)); margin-inline: auto;
  padding: 1rem 1.1rem; border: 1px solid var(--line-strong); border-radius: var(--radius);
  background: rgb(18 17 38 / 94%); box-shadow: var(--shadow); backdrop-filter: blur(16px);
}
.cookie-banner-copy { flex: 1 1 16rem; }
.cookie-banner-copy p { margin: 0 0 .35rem; color: var(--text-soft); font-size: .84rem; line-height: 1.5; }
.cookie-banner-copy a { color: var(--gold-300); text-decoration: underline; text-underline-offset: .2em; }
.cookie-banner-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.privacy-note a, .secure-note a { color: var(--gold-300); text-decoration: underline; text-underline-offset: .2em; }
.secure-note { flex-wrap: wrap; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.tarot-ritual-shell {
  width: min(62rem, 100%); margin-inline: auto; padding-block: clamp(2rem, 5vw, 4.5rem);
}
.tarot-ritual-header { max-width: 43rem; margin: 0 auto clamp(1.75rem, 4vw, 3rem); text-align: center; }
.tarot-ritual-header .progress-line { justify-content: center; }
.tarot-ritual-header h1 { margin: .5rem 0 .85rem; font-size: clamp(2.25rem, 6.5vw, 4.35rem); }
.tarot-ritual-header .lede { max-width: 43rem; margin-inline: auto; }
.tarot-ritual { display: grid; gap: 1rem; }
.ritual-step { position: relative; overflow: hidden; }
.ritual-step-heading { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.ritual-step-heading h2 { margin: .2rem 0 0; font-size: clamp(1.7rem, 5vw, 2.5rem); }
.ritual-step-number {
  display: grid; width: 2.8rem; height: 2.8rem; flex: 0 0 auto; place-items: center;
  border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300);
  font-family: var(--font-display); font-size: 1.2rem;
}
.spread-picker { display: grid; width: min(44rem, 100%); margin-inline: auto; gap: .7rem; }
.spread-choice { position: relative; cursor: pointer; }
.spread-choice input { position: absolute; opacity: 0; pointer-events: none; }
.spread-choice-body {
  display: grid; min-height: 7.25rem; padding: 1rem; border: 1px solid var(--line);
  border-radius: var(--radius); background: rgb(3 3 12 / 32%); transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.spread-choice:hover .spread-choice-body { border-color: rgb(232 199 122 / 42%); transform: translateY(-2px); }
.spread-choice input:focus-visible + .spread-choice-body { outline: 3px solid var(--gold-500); outline-offset: 3px; }
.spread-choice input:checked + .spread-choice-body {
  border-color: var(--gold-500); background: rgb(232 199 122 / 8%);
  box-shadow: inset 0 0 0 1px rgb(232 199 122 / 20%);
}
.spread-choice input:checked + .spread-choice-body::after {
  position: absolute; top: .8rem; right: .8rem; display: grid; width: 1.5rem; height: 1.5rem;
  place-items: center; border-radius: 50%; background: var(--gold-500); color: var(--ink-950);
  content: "✓"; font-size: .75rem; font-weight: 900;
}
.spread-choice-name { padding-right: 1.6rem; font-family: var(--font-display); font-size: 1.25rem; }
.spread-choice-count { color: var(--gold-300); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.spread-choice-description { align-self: end; margin-top: .55rem; color: var(--text-muted); font-size: .82rem; line-height: 1.45; }
.deck-ritual { text-align: center; }
.deck-ritual .ritual-step-heading { justify-content: center; text-align: left; }
.deck-instruction { min-height: 1.6rem; margin: 0 auto 1rem; color: var(--text-soft); }
.shuffle-button {
  display: inline-flex; min-height: 2.75rem; align-items: center; gap: .5rem; padding: .6rem 1rem;
  cursor: pointer; border: 1px solid var(--line-strong); border-radius: 999px;
  background: rgb(232 199 122 / 7%); color: var(--gold-300); font-weight: 800;
}
.shuffle-button:hover { background: rgb(232 199 122 / 13%); }
.shuffle-button:disabled { cursor: wait; opacity: .65; }
.shuffle-button:disabled > span:first-child { animation: shuffle-icon-spin .7s linear infinite; }
.deck-ritual:has(.pick-deck.is-locked) .shuffle-button {
  animation: required-shuffle-pulse 2s ease-in-out infinite;
}
.pick-deck {
  position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: 26rem;
  gap: .45rem; margin: 1.3rem auto 1.5rem; align-items: center;
}
.pick-deck::before {
  position: absolute; z-index: -1; top: 50%; left: 50%; width: 12rem; height: 12rem;
  border-radius: 50%; background: radial-gradient(circle, rgb(154 124 245 / 22%), transparent 68%);
  content: ""; opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.5);
}
.pick-deck.is-shuffling { pointer-events: none; }
.pick-deck.is-shuffling::before { animation: shuffle-aura 1.35s ease-in-out both; }
.pick-deck.is-locked::after {
  position: absolute; z-index: 30; top: 50%; left: 50%; padding: .55rem .85rem;
  border: 1px solid var(--line-strong); border-radius: 999px;
  background: rgb(7 7 17 / 92%); box-shadow: 0 .75rem 2rem #0009;
  color: var(--gold-300); content: "Shuffle required"; font-size: .72rem;
  font-weight: 850; letter-spacing: .08em; text-transform: uppercase;
  transform: translate(-50%, -50%); pointer-events: none;
}
.pick-card {
  --r: 0deg;
  position: relative; width: 100%; padding: 0;
  cursor: pointer; border: 0; border-radius: .6rem; background: transparent;
  transform: rotate(var(--r)); transform-origin: 50% 75%;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), filter .3s ease, opacity .3s ease;
}
.pick-card:nth-child(3n+1) { --r: -2deg; }
.pick-card:nth-child(3n+2) { --r: 1.5deg; }
.pick-card:nth-child(3n) { --r: -.5deg; }
.pick-card img {
  display: block; width: 100%; aspect-ratio: 2/3; border: 1px solid var(--gold-500);
  border-radius: .6rem; background: var(--ink-800); box-shadow: 0 1rem 2rem #0009; object-fit: cover;
}
.pick-deck.is-locked .pick-card { cursor: not-allowed; opacity: .24; filter: grayscale(.7); transform: scale(.96) rotate(var(--r)); }
.pick-card:not(:disabled):hover { z-index: 2; filter: brightness(1.16) drop-shadow(0 1rem 1.1rem rgb(154 124 245 / 22%)); transform: translateY(-.45rem) rotate(var(--r)); }
.pick-card.is-picked { opacity: .28; transform: scale(.9) rotate(var(--r)); }
.pick-deck.is-shuffling .pick-card {
  animation: ritual-shuffle 1.35s cubic-bezier(.45,.05,.2,1) var(--shuffle-delay, 0ms) both;
}
.collected-reading { padding-top: 1rem; border-top: 1px solid var(--line); }
.collected-reading p { margin: 0 0 .8rem; color: var(--text-soft); font-size: .86rem; }
.collected-reading strong { color: var(--gold-300); }
.collection-slots { display: flex; min-height: 4rem; flex-wrap: wrap; justify-content: center; gap: .45rem; }
.collection-slot {
  display: grid; width: clamp(2.15rem, 9vw, 2.8rem); aspect-ratio: 2/3; place-items: center; overflow: hidden;
  border: 1px dashed rgb(232 199 122 / 32%); border-radius: .35rem; color: var(--text-muted); font-size: .75rem;
}
.collection-slot.is-filled { border-style: solid; border-color: var(--gold-500); animation: card-reveal .35s ease both; }
.collection-slot img { width: 100%; height: 100%; object-fit: cover; }
.deck-note { margin: .9rem auto 0; color: var(--text-muted); font-size: .75rem; }
.ritual-checkout {
  display: grid; align-items: center; gap: 1rem; border-color: var(--line-strong);
  background: linear-gradient(120deg, rgb(118 87 232 / 12%), rgb(232 199 122 / 5%));
}
.ritual-checkout p { margin: .35rem 0 0; color: var(--text-soft); font-size: .85rem; }
.ritual-submit { width: 100%; }
.tarot-ritual.is-enhanced .ritual-submit:disabled { cursor: not-allowed; opacity: .45; filter: grayscale(.35); transform: none; }
.tarot-ritual.is-enhanced .ritual-submit.is-ready { box-shadow: 0 0 0 .35rem rgb(118 87 232 / 12%), 0 14px 34px rgb(83 51 177 / 38%); }

.ritual-funnel-shell { width: min(58rem, 100%); margin-inline: auto; padding-block: clamp(1.75rem, 5vw, 4.5rem); }
.ritual-funnel-header { max-width: 42rem; margin: 0 auto 1.5rem; text-align: center; }
.ritual-funnel-header h1 { margin: .45rem 0 .75rem; font-size: clamp(2.15rem, 6.5vw, 4.2rem); }
.ritual-funnel-header .lede { max-width: 38rem; margin-inline: auto; }
.ritual-funnel { display: block; max-width: 46rem; margin-inline: auto; }
.ritual-funnel-card { min-height: 24rem; }
.ritual-funnel-card h2 { margin: .4rem 0 .8rem; font-size: clamp(1.75rem, 5vw, 2.6rem); }
.ritual-shuffle-card, .ritual-unlock-card { text-align: center; }
.ritual-shuffle-card .funnel-card-actions, .ritual-unlock-card .funnel-card-actions { justify-content: center; }
.ritual-table { position: relative; min-height: 16rem; margin: 1.1rem auto .4rem; }
.ritual-funnel-card[hidden],
.ritual-stack[hidden],
.ritual-pick-deck[hidden] { display: none !important; }
.ritual-stack {
  position: relative; width: min(20rem, 100%); height: 16.5rem; margin: 0 auto;
  perspective: 80rem;
}
.stack-card {
  --r: calc((var(--i) - 6.5) * 2.8deg);
  --x: calc((var(--i) - 6.5) * .14rem);
  --y: calc(var(--i) * -0.1rem);
  position: absolute; left: 50%; top: 2.4rem; z-index: calc(1 + var(--i)); width: 7.35rem; aspect-ratio: 2/3;
  margin-left: -3.675rem; overflow: hidden; border-radius: .7rem;
  box-shadow: 0 1rem 1.8rem rgb(0 0 0 / 42%);
  transform: rotate(var(--r)) translate(var(--x), var(--y));
  transform-origin: 50% 120%; pointer-events: none;
}
.stack-card img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ritual-stack.is-riffle .stack-card:nth-child(odd) {
  animation: stack-riffle-left 1.5s cubic-bezier(.45,.05,.2,1) calc(var(--i) * 18ms) both;
}
.ritual-stack.is-riffle .stack-card:nth-child(even) {
  animation: stack-riffle-right 1.5s cubic-bezier(.45,.05,.2,1) calc(var(--i) * 18ms) both;
}
.ritual-stack.is-exiting { animation: stack-exit .28s ease both; }
.ritual-pick-deck { margin-top: .4rem; }
.ritual-pick-deck.is-dealing .pick-card {
  animation: card-deal-in .55s cubic-bezier(.2,.8,.2,1) calc(var(--i) * 32ms) both;
}
.ritual-slots .collection-slot {
  display: flex; width: clamp(3.4rem, 18vw, 4.6rem); flex-direction: column;
  align-items: center; justify-content: center; gap: .2rem; padding: .2rem;
}
.ritual-slots .collection-slot small {
  color: var(--gold-300); font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.ritual-teaser {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem;
  max-width: 22rem; margin: 1.4rem auto;
}
.teaser-card {
  position: relative; margin: 0; overflow: hidden; border-radius: .7rem;
  box-shadow: 0 1rem 2rem rgb(0 0 0 / 35%);
}
.teaser-card img { display: block; width: 100%; aspect-ratio: 2/3; object-fit: cover; }
.teaser-card.is-locked img { filter: brightness(.55) saturate(.7); }
.teaser-card.is-locked::after {
  position: absolute; inset: 18% 22%; display: grid; place-items: center;
  border: 1px solid rgb(232 199 122 / 45%); border-radius: .4rem;
  background: rgb(7 7 17 / 55%); color: var(--gold-300); content: "✦";
  font-size: 1.1rem;
}
.teaser-card figcaption {
  position: absolute; right: 0; bottom: 0; left: 0; padding: .45rem .3rem .55rem;
  background: linear-gradient(transparent, rgb(7 7 17 / 88%));
  color: var(--gold-300); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.ritual-unlock-card .included-list { max-width: 34rem; margin: 1.4rem auto; text-align: left; }
.ritual-shuffle-card:has([data-pick-deck][hidden]) .shuffle-button:not(:disabled) {
  animation: required-shuffle-pulse 2s ease-in-out infinite;
}
.ritual-funnel [data-read-cards].is-ready {
  box-shadow: 0 0 0 .35rem rgb(118 87 232 / 12%), 0 14px 34px rgb(83 51 177 / 38%);
}

.palm-ritual-shell { width: min(58rem, 100%); margin-inline: auto; padding-block: clamp(1.5rem, 5vw, 4.5rem); }
.palm-ritual-header { max-width: 42rem; margin: 0 auto 1.4rem; text-align: center; }
.palm-ritual-header h1 { margin: .45rem 0 .75rem; font-size: clamp(2.15rem, 7vw, 4.2rem); }
.palm-ritual-header .lede { max-width: 38rem; margin-inline: auto; }
.palm-ritual { position: relative; display: grid; gap: 1rem; max-width: 46rem; margin-inline: auto; }
.palm-stage h2 { margin: .35rem 0 .7rem; font-size: clamp(1.7rem, 5vw, 2.5rem); }
.palm-stage-copy { margin: 0 0 1.1rem; }
.palm-file-host { position: absolute; width: 0; height: 0; overflow: hidden; }
.palm-file-input,
.palm-ritual input[type="file"] {
  position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important;
  padding: 0 !important; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0 !important;
}
.palm-hero { display: grid; gap: 1.1rem; margin-bottom: 1.1rem; align-items: center; }
.palm-hero-art {
  position: relative; display: grid; width: auto; height: min(26rem, 70vw); margin: 0 auto; place-items: center;
}
.palm-hero-art .palm-figure { width: auto; height: 100%; max-width: 100%; overflow: visible; }
.palm-orb {
  position: absolute; z-index: -1; inset: 8% 12%; border-radius: 50%;
  background: radial-gradient(circle, rgb(154 124 245 / 28%), rgb(232 199 122 / 0%) 68%);
  filter: blur(8px);
}
.palm-photo { pointer-events: none; }
.palm-figure .palm-line {
  fill: none; stroke: #ff4d73; stroke-width: 5.5; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: 1;
}
.palm-line-label {
  fill: #ff7a96; font-size: 22px; font-weight: 800; letter-spacing: .14em;
  text-transform: uppercase; font-family: var(--font-sans);
}
.palm-figure--guide .palm-photo { opacity: .55; }
.palm-figure--guide .palm-lines,
.palm-figure--guide .palm-line-labels,
.palm-figure--guide .palm-scan-beam { display: none; }
.palm-figure--trace .palm-photo,
.palm-figure--trace .palm-line-labels,
.palm-figure--trace .palm-scan-beam { display: none; }
.palm-traced-map {
  position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none;
}
.palm-traced-map .palm-line {
  fill: none; stroke: #ff4d73; stroke-width: var(--palm-stroke, 7);
  stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 1; stroke-dashoffset: 1;
}
.palm-result-frame .palm-line,
.palm-preview-wrap .palm-line {
  stroke-dashoffset: 0;
}
.palm-traced-map .palm-line-label { font-size: var(--palm-label, 22px); }
.palm-camera-overlay.has-traced-lines .palm-figure--trace { display: none; }
.palm-scan-beam {
  fill: rgb(255 77 115 / 38%); opacity: 0; pointer-events: none; mix-blend-mode: screen;
}
.palm-hero.is-playing .palm-scan-beam,
.is-drawing .palm-scan-beam { animation: palm-scan-sweep 2.8s ease-in-out 2; }
.palm-hero.is-playing .palm-line-heart,
.is-drawing .palm-line-heart { animation: palm-draw-line 1.1s .2s cubic-bezier(.22,.7,.2,1) forwards; }
.palm-hero.is-playing .palm-line-head,
.is-drawing .palm-line-head { animation: palm-draw-line 1.1s 1.1s cubic-bezier(.22,.7,.2,1) forwards; }
.palm-hero.is-playing .palm-line-life,
.is-drawing .palm-line-life { animation: palm-draw-line 1.25s 2s cubic-bezier(.22,.7,.2,1) forwards; }
.palm-hero.is-playing .palm-line-fate,
.is-drawing .palm-line-fate { animation: palm-draw-line 1.15s 2.9s cubic-bezier(.22,.7,.2,1) forwards; }
.is-drawn .palm-line { stroke-dashoffset: 0; }
.palm-line-legend { display: grid; gap: .55rem; margin: 0; padding: 0; list-style: none; }
.palm-line-legend li {
  display: grid; gap: .15rem; padding: .8rem .95rem; border: 1px solid var(--line);
  border-radius: .85rem; background: rgb(255 255 255 / 3%); color: var(--text-muted);
  opacity: .48; transform: translateY(.15rem);
  transition: opacity .35s ease, border-color .35s ease, background .35s ease, transform .35s ease;
}
.palm-line-legend li.is-active {
  opacity: 1; transform: none; border-color: rgb(232 199 122 / 28%); background: rgb(232 199 122 / 7%);
}
.palm-line-legend strong {
  color: var(--gold-300); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.palm-line-legend span { color: var(--text-soft); font-size: .86rem; line-height: 1.45; }
.palm-actions { display: grid; gap: .7rem; }
.palm-camera-frame {
  position: relative; overflow: hidden; width: min(24rem, 100%); aspect-ratio: 3 / 4;
  margin: .4rem auto 1rem; border: 1px solid var(--line-strong); border-radius: 1.4rem; background: #090814;
}
.palm-camera-video,
.palm-camera-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.palm-camera-photo { z-index: 1; }
.palm-camera-overlay { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.palm-camera-overlay .palm-figure { width: 100%; height: 100%; }
.palm-scan-line {
  position: absolute; left: 18%; right: 18%; top: 12%; height: .12rem; border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--gold-300), transparent);
  box-shadow: 0 0 1.4rem rgb(232 199 122 / 55%); opacity: 0;
}
.palm-camera-frame.is-live .palm-scan-line,
.palm-scan-line.is-active,
.is-drawing .palm-scan-line {
  opacity: 1; animation: palm-scan-travel 2.2s ease-in-out infinite;
}
.palm-camera-status,
.palm-reading-status {
  position: absolute; z-index: 3; right: .8rem; bottom: .8rem; left: .8rem;
  margin: 0; padding: .55rem .7rem; border-radius: 999px;
  background: rgb(7 7 17 / 72%); color: var(--gold-300); font-size: .78rem; font-weight: 750;
  text-align: center;
}
.palm-reading-status { position: static; margin: 0 auto 1rem; max-width: 24rem; }
.palm-camera-controls {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: .7rem; align-items: center;
  width: min(24rem, 100%); margin: 0 auto 1rem;
}
.palm-camera-controls .button { min-height: 2.8rem; font-size: .82rem; }
.palm-shutter {
  width: 4.4rem; height: 4.4rem; padding: 0; cursor: pointer;
  border: .28rem solid var(--gold-300); border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, #fff4d0 42%, var(--gold-500) 43% 68%, transparent 70%);
  box-shadow: 0 0 0 .35rem rgb(232 199 122 / 12%), 0 12px 28px rgb(0 0 0 / 35%);
}
.palm-shutter:hover { transform: scale(1.04); }
.palm-shutter:focus-visible { outline: 3px solid var(--gold-500); outline-offset: 4px; }
.palm-camera-error { margin: 0 0 1rem; color: var(--danger); font-size: .86rem; text-align: center; }
.palm-preview-wrap {
  position: relative; overflow: hidden; width: min(18rem, 100%); margin: .3rem auto 1rem;
  border: 1px solid var(--line-strong); border-radius: 1.1rem;
}
.palm-preview { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; background: #090814; }
.palm-traced-map--preview { z-index: 2; }
body.palm-camera-open { overflow: hidden; }

@keyframes palm-draw-line {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}
@keyframes palm-loading-line {
  0%, 12% { opacity: .2; stroke-dashoffset: 1; }
  42%, 72% { opacity: 1; stroke-dashoffset: 0; }
  100% { opacity: .28; stroke-dashoffset: -1; }
}
@keyframes palm-frame-breathe {
  0%, 100% { box-shadow: 0 16px 36px rgb(0 0 0 / 28%), 0 0 0 rgb(232 199 122 / 0%); }
  50% { box-shadow: 0 18px 42px rgb(0 0 0 / 34%), 0 0 2rem rgb(232 199 122 / 18%); }
}
@keyframes palm-glow-pulse {
  0%, 100% { opacity: .42; }
  50% { opacity: .9; }
}
@keyframes palm-loading-scan {
  from { top: 9%; opacity: .35; }
  18% { opacity: 1; }
  to { top: 88%; opacity: .55; }
}
@keyframes palm-progress-travel {
  from { transform: translateX(-110%); }
  to { transform: translateX(330%); }
}
@keyframes palm-step-cycle {
  0%, 100% { color: var(--text-muted); opacity: .52; transform: translateY(0); }
  18%, 42% { color: var(--gold-300); opacity: 1; transform: translateY(-.18rem); }
}
@keyframes palm-scan-sweep {
  0%, 100% { opacity: 0; transform: translateY(0); }
  12% { opacity: .9; }
  50% { transform: translateY(18rem); }
  88% { opacity: .35; }
}
@keyframes palm-scan-travel {
  0% { top: 12%; opacity: .2; }
  45% { opacity: 1; }
  100% { top: 78%; opacity: .15; }
}
@keyframes ritual-shuffle {
  0% { transform: translate(0) rotate(var(--r)); }
  20% { transform: translate(var(--stack-x), var(--stack-y)) rotate(0) scale(.92); }
  39% { transform: translate(var(--riffle-x), var(--riffle-y)) rotate(var(--shuffle-rotation)) scale(.96); }
  55% { transform: translate(var(--stack-x), var(--stack-y)) rotate(0) scale(.9); }
  72% { transform: translate(var(--riffle-x), var(--riffle-y)) rotate(var(--shuffle-rotation)) scale(.96); }
  84% { transform: translate(var(--stack-x), var(--stack-y)) rotate(0) scale(.9); }
  100% { transform: translate(0) rotate(var(--r)); }
}
@keyframes stack-riffle-left {
  0% { transform: rotate(var(--r)) translate(var(--x), var(--y)); }
  18% { transform: translate(-4.6rem, -.55rem) rotate(-22deg); }
  36% { transform: translate(.7rem, .35rem) rotate(6deg); }
  54% { transform: translate(-3.8rem, -.25rem) rotate(-14deg); }
  72% { transform: translate(.35rem, .15rem) rotate(3deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes stack-riffle-right {
  0% { transform: rotate(var(--r)) translate(var(--x), var(--y)); }
  18% { transform: translate(4.6rem, -.55rem) rotate(22deg); }
  36% { transform: translate(-.7rem, .35rem) rotate(-6deg); }
  54% { transform: translate(3.8rem, -.25rem) rotate(14deg); }
  72% { transform: translate(-.35rem, .15rem) rotate(-3deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}
@keyframes stack-exit {
  from { opacity: 1; transform: scale(1); }
  to { opacity: 0; transform: scale(.92) translateY(.6rem); }
}
@keyframes card-deal-in {
  from { opacity: 0; transform: translateY(-2.4rem) rotate(-8deg) scale(.82); }
  to { opacity: 1; transform: rotate(var(--r)); }
}
@keyframes shuffle-aura {
  0%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.5); }
  35%, 75% { opacity: 1; transform: translate(-50%, -50%) scale(1.35); }
}
@keyframes shuffle-icon-spin { to { transform: rotate(360deg); } }
@keyframes required-shuffle-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgb(232 199 122 / 0%); }
  50% { box-shadow: 0 0 0 .45rem rgb(232 199 122 / 9%); }
}
@keyframes transition-card-left {
  0%, 100% { transform: translateX(-90%) rotate(-10deg); }
  50% { transform: translateX(-118%) translateY(-.45rem) rotate(-17deg); }
}
@keyframes transition-card-center {
  0%, 100% { transform: translateX(-50%) translateY(-.4rem); }
  50% { transform: translateX(-50%) translateY(-.9rem) rotateY(12deg); }
}
@keyframes transition-card-right {
  0%, 100% { transform: translateX(-10%) rotate(10deg); }
  50% { transform: translateX(18%) translateY(-.45rem) rotate(17deg); }
}
@keyframes transition-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

@keyframes slow-spin { to { transform: rotate(360deg); } }
@keyframes solar-breathe {
  0%, 100% { transform: scale(1); opacity: .5; }
  50% { transform: scale(1.16); opacity: .95; }
}
@keyframes solar-core-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.045); }
}
@keyframes solar-twinkle {
  0%, 100% { opacity: .18; transform: scale(.65); }
  50% { opacity: 1; transform: scale(1); }
}
@keyframes orbit-pulse { 50% { transform: scale(1.08) rotate(180deg); box-shadow: 0 0 2.5rem rgb(232 199 122 / 20%); } 100% { transform: rotate(360deg); } }
@keyframes card-reveal {
  from { opacity: 0; transform: translateY(2.5rem) rotateY(70deg) scale(.88); }
  to { opacity: 1; transform: translateY(0) rotateY(0) scale(1); }
}
@keyframes deck-breathe {
  0%, 100% { margin-top: 0; }
  50% { margin-top: -.45rem; filter: drop-shadow(0 1rem 1rem rgb(118 87 232 / 22%)); }
}
@keyframes shuffle-left {
  0%, 100% { transform: translateX(0) rotate(0); }
  45% { transform: translateX(-2.4rem) rotate(-15deg); }
  70% { transform: translateX(.25rem) rotate(2deg); }
}
@keyframes shuffle-center {
  0%, 100% { transform: translateY(-.2rem); }
  50% { transform: translateY(-.75rem) rotateY(18deg); }
}
@keyframes shuffle-right {
  0%, 100% { transform: translateX(0) rotate(0); }
  45% { transform: translateX(2.4rem) rotate(15deg); }
  70% { transform: translateX(-.25rem) rotate(-2deg); }
}
@media (prefers-reduced-motion: reduce) {
  .ritual-stack.is-riffle .stack-card,
  .ritual-pick-deck.is-dealing .pick-card,
  .ritual-stack.is-exiting {
    animation: none !important;
  }
}

@media (min-width: 40rem) {
  .field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sky-chart { width: min(100%, 23.5rem); }
  .trust-grid { grid-template-columns: repeat(3, 1fr); }
  .trust-item { padding: 1.4rem; border-right: 1px solid var(--line); border-bottom: 0; }
  .trust-item:first-child { padding-left: 0; }.trust-item:last-child { padding-right: 0; border-right: 0; }
  .card-grid { grid-template-columns: repeat(2, 1fr); }
  .spread-picker { grid-template-columns: repeat(2, 1fr); }
  .pick-deck { grid-template-columns: repeat(7, minmax(0, 1fr)); max-width: 42rem; gap: .65rem; }
  .ritual-checkout { grid-template-columns: 1fr auto; }
  .ritual-submit { width: auto; min-width: 15rem; }
  .steps-grid { grid-template-columns: repeat(3, 1fr); }
  .tarot-draw { grid-template-columns: repeat(3, minmax(0, 11rem)); }
  .tarot-draw.celtic-cross { grid-template-columns: repeat(3, minmax(0, 7rem)); }
  .purchase-grid { grid-template-columns: 1.15fr .85fr; align-items: start; }
  .quote-grid { grid-template-columns: repeat(2, 1fr); }
  .horoscope-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-grid { grid-template-columns: 1.3fr 1fr auto; }
}
@media (min-width: 52rem) {
  .desktop-nav { display: flex; }
  .mobile-menu { display: none; }
  .home-hero { grid-template-columns: 1.15fr .85fr; gap: 2.5rem; min-height: calc(76vh - 4.75rem); }
  .sky-chart { width: min(100%, 28rem); }
  .card-grid { grid-template-columns: repeat(4, 1fr); }
  .split-section { grid-template-columns: 1fr 1fr; gap: clamp(3rem, 7vw, 6rem); }
  .form-layout { grid-template-columns: minmax(0, 1.35fr) minmax(17rem, .65fr); align-items: start; }
  .field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tarot-draw.celtic-cross {
    position: relative; display: block; width: min(44rem, 100%); height: 36rem; margin: 1.5rem auto 2.5rem;
    background:
      linear-gradient(90deg, transparent, var(--line-strong), transparent) 37% 47% / 60% 1px no-repeat,
      linear-gradient(transparent, var(--line-strong), transparent) 37% 44% / 1px 78% no-repeat,
      linear-gradient(transparent, var(--line-strong), transparent) 88% 45% / 1px 82% no-repeat;
  }
  .celtic-cross .tarot-card { position: absolute; width: 5.1rem; margin-left: -2.55rem; }
  .celtic-cross .tarot-card:nth-child(1) { top: 36%; left: 29%; }
  .celtic-cross .tarot-card:nth-child(2) { top: 36%; left: 46%; }
  .celtic-cross .tarot-card:nth-child(3) { top: 72%; left: 37%; }
  .celtic-cross .tarot-card:nth-child(4) { top: 36%; left: 7%; }
  .celtic-cross .tarot-card:nth-child(5) { top: 0; left: 37%; }
  .celtic-cross .tarot-card:nth-child(6) { top: 36%; left: 64%; }
  .celtic-cross .tarot-card:nth-child(7) { top: 75%; left: 88%; }
  .celtic-cross .tarot-card:nth-child(8) { top: 50%; left: 88%; }
  .celtic-cross .tarot-card:nth-child(9) { top: 25%; left: 88%; }
  .celtic-cross .tarot-card:nth-child(10) { top: 0; left: 88%; }
  .funnel-hero.has-image { grid-template-columns: 1.1fr .9fr; text-align: left; }
  .funnel-hero.has-image h1 { margin-inline: 0; }
  .sticky-mobile-cta { display: none; }
  .birth-chart-layout { grid-template-columns: minmax(0, 1fr) minmax(16rem, .62fr); }
  .funnel-choice-grid.two-column, .funnel-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-reading-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .palm-hero { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 1.5rem; }
  .palm-hero-art { margin: 0 auto; width: auto; height: min(28rem, 62vh); }
}
@media (min-width: 75rem) {
  .page-shell, main { width: min(var(--container), calc(100% - 4rem)); }
  .nav-shell { min-height: 5.25rem; }
}
@media (max-width: 51.99rem) {
  body.has-sticky-cta, body:has(.sticky-mobile-cta:not([hidden])) { padding-bottom: 4.6rem; }
  [data-palm-step="camera"]:not([hidden]) {
    position: fixed; inset: 0; z-index: 80; display: flex; flex-direction: column;
    margin: 0; overflow: auto; border-radius: 0;
    padding: max(1rem, env(safe-area-inset-top)) 1rem max(1.1rem, env(safe-area-inset-bottom));
    background: var(--ink-950);
  }
  [data-palm-step="camera"] .palm-camera-frame {
    width: min(26rem, 100%);
    max-height: calc(100dvh - 16.5rem);
  }
  .palm-actions .button { min-height: 3.1rem; }
}
@media (max-width: 39.99rem) {
  .report-shell { padding-top: 2rem; }
  .report-shell > h1 { margin-bottom: .5rem; font-size: clamp(2.25rem, 12vw, 3rem); }
  .tarot-draw.celtic-cross {
    position: relative; display: block; width: min(18rem, 100%); height: 24rem; margin: 1.25rem auto 1rem;
    background:
      linear-gradient(90deg, transparent, var(--line-strong), transparent) 38% 48% / 68% 1px no-repeat,
      linear-gradient(transparent, var(--line-strong), transparent) 38% 45% / 1px 82% no-repeat,
      linear-gradient(transparent, var(--line-strong), transparent) 90% 45% / 1px 84% no-repeat;
  }
  .celtic-cross .tarot-card { position: absolute; width: 3rem; min-width: 0; margin-left: -1.5rem; }
  .celtic-cross .tarot-card:nth-child(1) { top: 38%; left: 29%; }
  .celtic-cross .tarot-card:nth-child(2) { top: 38%; left: 46%; }
  .celtic-cross .tarot-card:nth-child(3) { top: 72%; left: 38%; }
  .celtic-cross .tarot-card:nth-child(4) { top: 38%; left: 10%; }
  .celtic-cross .tarot-card:nth-child(5) { top: 3%; left: 38%; }
  .celtic-cross .tarot-card:nth-child(6) { top: 38%; left: 63%; }
  .celtic-cross .tarot-card:nth-child(7) { top: 75%; left: 90%; }
  .celtic-cross .tarot-card:nth-child(8) { top: 51%; left: 90%; }
  .celtic-cross .tarot-card:nth-child(9) { top: 27%; left: 90%; }
  .celtic-cross .tarot-card:nth-child(10) { top: 3%; left: 90%; }
  .celtic-cross .card-art { border-radius: .5rem; box-shadow: 0 .7rem 1.5rem #0008; }
  .celtic-cross .card-number {
    top: .2rem; left: .2rem; width: 1.1rem; height: 1.1rem; font-size: .55rem;
  }
  .celtic-cross .card-position, .celtic-cross .tarot-card h3, .celtic-cross .tarot-card small { display: none; }
  .celtic-legend {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem;
    margin: 0 auto 2rem; padding: 0; list-style: none;
  }
  .celtic-legend li {
    display: grid; grid-template-columns: 1.5rem 1fr; gap: .5rem; min-width: 0;
    padding: .65rem; border: 1px solid var(--line); border-radius: .7rem;
    background: rgb(255 255 255 / 3%); color: var(--text-muted); font-size: .68rem; line-height: 1.35;
  }
  .legend-number {
    display: grid; width: 1.4rem; height: 1.4rem; place-items: center;
    border: 1px solid var(--line-strong); border-radius: 50%; color: var(--gold-300);
    font-size: .6rem; font-weight: 850;
  }
  .celtic-legend strong { display: block; margin-bottom: .15rem; color: var(--text); font-size: .7rem; }
  .reading-copy { padding: 1.15rem; font-size: .97rem; line-height: 1.75; overflow-wrap: anywhere; }
  .chart-birth-summary { text-align: left; }
  .birth-chart-section, .planetary-positions { padding: 1.15rem; }
  .daily-sky-card { align-items: flex-start; }
  .article-meta span::after, .article-meta time::after { display: none; }
  .horoscope-copy { font-size: .97rem; line-height: 1.75; }
  .horoscope-copy h2 { margin-top: 2.2rem; }
}
body.join-page {
  background:
    radial-gradient(ellipse at 50% -10%, rgb(118 72 196 / 28%), transparent 36rem),
    #12081f;
}
body.join-page::before { opacity: .2; }
body.join-page main {
  width: 100%;
  min-height: 100dvh;
  margin: 0;
}
.join-app {
  display: flex;
  flex-direction: column;
  width: min(28rem, 100%);
  min-height: 100dvh;
  min-height: 100svh;
  margin-inline: auto;
  padding: .65rem 1.1rem calc(1.1rem + env(safe-area-inset-bottom));
}
.join-top {
  display: grid;
  grid-template-columns: 2.6rem 1fr 2.6rem;
  align-items: center;
  min-height: 2.8rem;
}
.join-back {
  display: grid;
  width: 2.6rem;
  height: 2.6rem;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
}
.join-back[hidden] { visibility: hidden; }
.join-back svg { width: 1.25rem; height: 1.25rem; }
.join-brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  color: var(--gold-300);
  font-family: var(--font-display);
  font-size: 1.15rem;
}
.join-brand img { width: 1.6rem; height: 1.6rem; object-fit: contain; }
.join-brand-mark {
  display: grid;
  width: 1.55rem;
  height: 1.55rem;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  font-size: .8rem;
}
.join-progress-label {
  justify-self: end;
  color: var(--text-muted);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
}
.join-progress-track {
  height: .18rem;
  margin: .35rem 0 1rem;
  overflow: hidden;
  border-radius: 999px;
  background: rgb(255 255 255 / 10%);
}
.join-progress-track i {
  display: block;
  width: 12%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #f0c14b, var(--gold-500));
  transition: width .35s ease;
}
.join-form { display: flex; flex: 1; flex-direction: column; min-height: 0; gap: 0; }
.join-step {
  display: none;
  flex: 1;
  flex-direction: column;
  min-height: 0;
}
.join-step.is-active { display: flex; animation: join-step-in .42s ease both; }
.join-step-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
  overflow: auto;
}
.join-step h1, .join-step h2 {
  margin: .2rem 0 .55rem;
  font-size: clamp(1.85rem, 8vw, 2.45rem);
  text-align: center;
}
.join-sub, .join-sky-caption {
  margin: 0 0 1.2rem;
  color: #b7adc8;
  font-size: .95rem;
  text-align: center;
}
.join-sky-caption { margin-top: .35rem; margin-bottom: .2rem; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
.join-kicker {
  margin: 0 0 .35rem;
  color: var(--gold-300);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-align: center;
  text-transform: uppercase;
}
.join-welcome h1 { margin-bottom: .85rem; }
.join-welcome .join-sub { margin-top: .85rem; margin-bottom: 0; }
.join-welcome-stage {
  position: relative;
  width: min(19rem, 100%);
  height: 15.2rem;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 1.35rem;
  background:
    radial-gradient(ellipse at 50% 120%, rgb(72 42 110 / 55%), transparent 52%),
    radial-gradient(ellipse at 70% 10%, rgb(42 28 88 / 40%), transparent 46%),
    #0b0616;
  perspective: 36rem;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 6%);
}
.join-welcome-glow {
  position: absolute;
  inset: 28% 18% 22%;
  border-radius: 50%;
  background: radial-gradient(circle, rgb(232 199 122 / 16%), transparent 68%);
  animation: join-glow-breathe 5.6s ease-in-out infinite;
}
.join-welcome-stars { position: absolute; inset: 0; }
.join-welcome-stars i {
  position: absolute;
  width: calc(var(--s, 1) * .16rem);
  height: calc(var(--s, 1) * .16rem);
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 .35rem rgb(255 255 255 / 55%);
  animation: join-star-twinkle 3s ease-in-out infinite;
}
.join-welcome-shoot {
  position: absolute;
  top: 18%;
  left: -30%;
  width: 4.8rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, #fff 40%, #f0c14b 70%, transparent);
  opacity: 0;
  animation: join-shoot 8.4s ease-in infinite;
}
.join-welcome-constellation {
  position: absolute;
  top: 8%;
  right: 4%;
  width: 46%;
  opacity: .55;
}
.join-welcome-constellation path {
  stroke: rgb(232 199 122 / 45%);
  stroke-width: 1;
  stroke-dasharray: 180;
  stroke-dashoffset: 180;
  animation: join-ink 3.2s .4s ease forwards;
}
.join-welcome-constellation circle { fill: #f3e7c4; }
.join-welcome-system {
  position: absolute;
  inset: 14% 8% 26%;
  transform: rotateX(58deg) rotateZ(-14deg);
  transform-style: preserve-3d;
  transition: transform .45s ease;
}
.join-orbit {
  position: absolute;
  border: 1px solid rgb(232 199 122 / 22%);
  border-radius: 50%;
  animation: join-orbit-spin linear infinite;
}
.join-orbit.o1 { inset: 2%; animation-duration: 8.5s; }
.join-orbit.o2 { inset: 16%; animation-duration: 15s; animation-direction: reverse; }
.join-orbit.o3 { inset: 30%; animation-duration: 26s; }
.join-orbit.o4 { inset: 44%; animation-duration: 41s; animation-direction: reverse; }
.join-planet {
  position: absolute;
  top: -0.28rem;
  left: calc(50% - .28rem);
  width: .56rem;
  height: .56rem;
  border-radius: 50%;
  box-shadow: 0 0 .55rem currentColor;
}
.join-planet.mercury { background: #d7c3a3; color: #d7c3a3; }
.join-planet.venus { width: .68rem; height: .68rem; left: calc(50% - .34rem); top: -.34rem; background: #e8c77a; color: #e8c77a; }
.join-planet.mars { background: #d46a4a; color: #d46a4a; }
.join-planet.jupiter { width: .78rem; height: .78rem; left: calc(50% - .39rem); top: -.39rem; background: #c9b48a; color: #c9b48a; }
.join-welcome-chart {
  position: absolute;
  inset: 31% 29% 27%;
  filter: drop-shadow(0 0 10px rgb(232 199 122 / 25%));
}
.join-welcome-chart .chart-ink {
  stroke: #f0c14b;
  stroke-width: 1.15;
  stroke-linejoin: round;
  stroke-dasharray: 280;
  stroke-dashoffset: 280;
  animation: join-ink 2.4s .2s ease forwards;
}
.join-welcome-chart .chart-ink.delay { animation-delay: .7s; stroke: rgb(243 221 168 / 75%); stroke-width: .8; }
.join-welcome-chart .chart-ink.late { animation-delay: 1.2s; stroke-width: 1; }
.join-welcome-horizon {
  position: absolute;
  right: 6%;
  bottom: 14%;
  left: 6%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #c4a574 18%, #e8c77a 50%, #c4a574 82%, transparent);
  opacity: .7;
}
.join-welcome-horizon::after {
  position: absolute;
  top: -1.05rem;
  left: 72%;
  width: .85rem;
  height: .85rem;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 30%, #fff6d2, #f0c14b 55%, #b8862a);
  box-shadow: 0 0 .8rem rgb(240 193 75 / 45%);
  content: "";
  animation: join-sun-bob 6.5s ease-in-out infinite;
}
.join-choice-grid { display: grid; gap: .7rem; margin-top: .4rem; }
.join-choice-grid.two { grid-template-columns: 1fr; }
.join-choice {
  display: grid;
  gap: .2rem;
  width: 100%;
  padding: 1rem 1.05rem;
  cursor: pointer;
  border: 1px solid var(--line);
  border-radius: 1.15rem;
  background: rgb(255 255 255 / 4%);
  color: inherit;
  text-align: left;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.join-choice strong { font-size: 1rem; }
.join-choice span { color: var(--text-muted); font-size: .82rem; line-height: 1.45; }
.join-choice:hover, .join-choice.is-selected {
  border-color: var(--gold-500);
  background: rgb(232 199 122 / 10%);
  transform: translateY(-1px);
}
.join-app #id_full_name, .join-app #id_place {
  position: relative;
  z-index: 2;
  min-height: 3.4rem;
  padding: .9rem 1rem;
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 1rem;
  background: rgb(5 5 14 / 72%);
  color: #fff;
  font-family: var(--font-display);
  font-size: 1.2rem;
  text-align: left;
  box-shadow: none;
  pointer-events: auto;
  -webkit-user-select: text;
  user-select: text;
}
.join-app #id_full_name:focus, .join-app #id_place:focus {
  border-color: var(--gold-500);
  box-shadow: 0 0 0 3px rgb(232 199 122 / 16%);
}
.join-app .place-suggest { z-index: 3; margin-top: .4rem; }
.join-app .place-suggest-list {
  position: static;
  max-height: 14rem;
  margin-top: .55rem;
}
.join-app .help-text { margin-top: .7rem; text-align: center; }
.join-zodiac {
  overflow: hidden;
  width: 100%;
  height: 8.6rem;
  margin: .2rem 0 .4rem;
  mask-image: linear-gradient(90deg, transparent, #000 18%, #000 82%, transparent);
}
.join-zodiac-track {
  display: flex;
  align-items: flex-end;
  width: max-content;
  min-height: 8.6rem;
  margin-left: calc(50% - 3.4rem);
  transform: translate3d(calc(var(--zodiac-index, 1) * -6.8rem), 0, 0);
  will-change: transform;
}
.join-sign {
  display: grid;
  flex: 0 0 6.8rem;
  width: 6.8rem;
  justify-items: center;
  gap: .45rem;
  opacity: calc(1 - min(var(--sign-distance, 1), 1.35) * .48);
  transform: scale(calc(1 - min(var(--sign-distance, 1), 1.2) * .2));
  transition: opacity .2s ease, transform .2s ease, color .2s ease;
}
.join-sign b {
  color: #8d819e;
  font-size: .82rem;
  font-weight: 750;
}
.join-sign.is-active {
  opacity: 1;
  transform: scale(1);
}
.join-sign.is-active b { color: #f0c14b; }
.join-sign-disc {
  position: relative;
  display: grid;
  width: 5.4rem;
  height: 5.4rem;
  overflow: hidden;
  place-items: center;
  border-radius: 50%;
  background: #1a1028;
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 14%);
}
.join-sign-disc img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}
.join-sign.is-active .join-sign-disc {
  box-shadow: 0 0 0 1px rgb(255 255 255 / 18%), 0 0 1.8rem rgb(240 193 75 / 22%);
}
.join-sign.is-active .join-sign-disc::before,
.join-sign.is-active .join-sign-disc::after {
  position: absolute;
  z-index: 1;
  width: .28rem;
  height: .28rem;
  border-radius: 50%;
  background: #fff;
  content: "";
  animation: join-sparkle 1.8s ease-in-out infinite;
}
.join-sign.is-active .join-sign-disc::before { top: .35rem; right: .7rem; }
.join-sign.is-active .join-sign-disc::after { bottom: .55rem; left: .45rem; animation-delay: .4s; }
.join-wheels {
  position: relative;
  display: grid;
  grid-template-columns: .7fr 1.3fr .9fr;
  align-items: stretch;
  height: 12.4rem;
  margin-top: .15rem;
}
.join-wheels.time {
  grid-template-columns: 1fr auto 1fr;
  width: min(18rem, 100%);
  margin-inline: auto;
}
.join-time-colon {
  align-self: center;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 700;
}
.join-wheel { position: relative; min-width: 0; height: 100%; min-height: 0; overflow: hidden; }
.join-wheel-scroller {
  height: 100%;
  overflow-y: auto;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.join-wheel-scroller::-webkit-scrollbar { display: none; }
.join-wheel-item {
  display: grid;
  height: var(--wheel-item-height, 44px);
  place-items: center;
  color: #8b819a;
  font-size: 1.05rem;
  scroll-snap-align: center;
  opacity: calc(1 - min(var(--wheel-distance, 1), 2) * .38);
  transform: scale(calc(1 - min(var(--wheel-distance, 1), 2) * .08));
  user-select: none;
}
.join-wheel-item.is-active {
  color: #fff;
  font-size: 1.2rem;
  font-weight: 750;
}
.join-wheel-window {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: .15rem;
  left: .15rem;
  height: 2.75rem;
  pointer-events: none;
  border-radius: 999px;
  background: rgb(255 255 255 / 9%);
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 8%);
  transform: translateY(-50%);
}
.join-wheels, .join-wheels.time { isolation: isolate; }
.join-sky {
  position: relative;
  height: 10.5rem;
  margin: .2rem 0 .15rem;
  overflow: hidden;
  border-radius: 1.2rem;
  background: radial-gradient(ellipse at 50% 120%, #2a1848, #12081f 64%);
  transition: background .55s ease, filter .55s ease;
}
.join-sky[data-period="day"] {
  background: radial-gradient(ellipse at 50% 0%, #6b8fd4, #2a3a78 42%, #1a1638 78%);
}
.join-sky-stars, .join-sky-arc, .join-sky-body { position: absolute; inset: 0; }
.join-sky-stars {
  opacity: .9;
  background-image:
    radial-gradient(circle at 12% 22%, #fff 0 1px, transparent 1.4px),
    radial-gradient(circle at 28% 48%, #fff 0 .7px, transparent 1.1px),
    radial-gradient(circle at 46% 16%, #fff 0 1px, transparent 1.5px),
    radial-gradient(circle at 63% 36%, #fff 0 .8px, transparent 1.2px),
    radial-gradient(circle at 78% 18%, #fff 0 1px, transparent 1.4px),
    radial-gradient(circle at 88% 44%, #fff 0 .7px, transparent 1.1px),
    radial-gradient(circle at 18% 68%, #fff 0 .6px, transparent 1px);
  transition: opacity .45s ease;
}
.join-sky[data-period="day"] .join-sky-stars { opacity: .12; }
.join-sky-arc { color: #c4a574; width: 100%; height: 100%; }
.join-sky-body {
  width: 3.35rem;
  height: 3.35rem;
  inset: auto auto auto auto;
  left: var(--sky-x, 72%);
  top: var(--sky-y, 38%);
  display: grid;
  place-items: center;
  transform: translate(-50%, -50%);
  will-change: left, top;
}
.join-sun, .join-moon {
  position: absolute;
  width: 3.35rem;
  height: 3.35rem;
  border-radius: 50%;
  object-fit: cover;
  transition: opacity .4s ease, transform .4s ease;
}
.join-sun {
  box-shadow: 0 0 1.25rem rgb(255 214 120 / 62%), 0 0 2.4rem rgb(240 193 75 / 32%);
  opacity: 0;
  transform: scale(.7);
}
.join-moon {
  box-shadow: 0 0 1.15rem rgb(220 230 255 / 38%);
}
.join-sky[data-period="day"] .join-sun { opacity: 1; transform: scale(1); }
.join-sky[data-period="day"] .join-moon { opacity: 0; transform: scale(.7); }
.join-step-actions {
  display: grid;
  gap: .55rem;
  margin-top: auto;
  padding-top: .85rem;
  background: linear-gradient(180deg, transparent, #12081f 28%);
}
.join-cta {
  display: inline-flex;
  min-height: 3.35rem;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: .8rem 1.2rem;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  background: #f0c14b;
  color: #1a1020;
  font-weight: 850;
  box-shadow: 0 10px 28px rgb(240 193 75 / 22%);
  transition: transform .18s ease, filter .18s ease;
}
.join-cta:hover { transform: translateY(-1px); filter: brightness(1.04); }
.join-text-action {
  padding: .35rem;
  border: 0;
  background: transparent;
  color: #b7adc8;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: .2em;
}
.join-unlock-orbit {
  display: grid;
  width: 4.4rem;
  height: 4.4rem;
  margin: 0 auto 1rem;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--gold-300);
  animation: slow-spin 16s linear infinite;
}
.join-summary, .join-included, .membership-perks, .join-plans { margin: 1rem 0 0; }
.join-summary {
  display: grid;
  gap: .2rem;
  padding: .85rem 1rem;
  border: 1px solid var(--line-strong);
  border-radius: 1rem;
  background: rgb(232 199 122 / 7%);
}
.join-summary span { color: var(--gold-300); font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.join-summary strong { font-size: .88rem; font-weight: 650; overflow-wrap: anywhere; }
.join-included { display: grid; gap: .45rem; padding: 0; list-style: none; color: var(--text-soft); font-size: .86rem; }
.join-included li { display: grid; grid-template-columns: 1rem 1fr; gap: .45rem; }
.join-included li::before { color: var(--gold-300); content: "✦"; }
.membership-perks {
  display: grid;
  gap: .35rem;
  padding: 1rem;
  border: 1px solid var(--gold-500);
  border-radius: 1rem;
  background: linear-gradient(135deg, rgb(232 199 122 / 15%), rgb(162 124 255 / 12%));
}
.membership-perks .eyebrow { margin: 0; color: var(--gold-300); }
.membership-perks strong { font-size: .93rem; line-height: 1.45; }
.membership-perks small { color: var(--text-soft); line-height: 1.4; }
.join-plans { display: grid; gap: .65rem; }
.join-plan {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  width: 100%;
  padding: .95rem;
  cursor: pointer;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: rgb(255 255 255 / 4%);
  color: inherit;
  text-align: left;
}
.join-plan.is-selected, .join-plan:hover { border-color: var(--gold-500); background: rgb(232 199 122 / 8%); }
.join-plan span { display: grid; gap: .15rem; }
.join-plan small { color: var(--text-muted); font-size: .74rem; line-height: 1.4; }
.join-plan b { color: var(--gold-300); font-family: var(--font-display); font-size: 1.3rem; font-weight: 500; }
.join-email-opt {
  display: grid;
  grid-template-columns: 1.2rem 1fr;
  gap: .7rem;
  margin: 1rem 0;
  padding: .8rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  text-align: left;
}
.join-email-opt small { display: block; color: var(--text-muted); font-size: .74rem; }
.join-secure, .join-disclaimer {
  margin: .8rem 0 0;
  color: var(--text-muted);
  font-size: .74rem;
  text-align: center;
}
.join-disclaimer { margin-top: .85rem; }
.join-disclaimer a { color: var(--gold-300); text-decoration: underline; text-underline-offset: .2em; }
.join-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
@keyframes join-step-in {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes join-sparkle {
  0%, 100% { opacity: .2; transform: scale(.6); }
  50% { opacity: 1; transform: scale(1); }
}
@keyframes join-orbit-spin { to { transform: rotate(360deg); } }
@keyframes join-ink { to { stroke-dashoffset: 0; } }
@keyframes join-star-twinkle {
  0%, 100% { opacity: .18; transform: scale(.7); }
  45% { opacity: 1; transform: scale(1); }
}
@keyframes join-glow-breathe {
  0%, 100% { opacity: .55; transform: scale(.92); }
  50% { opacity: 1; transform: scale(1.08); }
}
@keyframes join-shoot {
  0%, 76% { transform: translate(0, 0) rotate(24deg); opacity: 0; }
  80% { opacity: 1; }
  91% { transform: translate(13.5rem, 4.6rem) rotate(24deg); opacity: 0; }
  100% { opacity: 0; }
}
@keyframes join-sun-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-.28rem); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .sky-orbit.o1 { transform: rotate(18deg); }
  .sky-orbit.o2 { transform: rotate(128deg); }
  .sky-orbit.o3 { transform: rotate(236deg); }
  .sky-orbit.o4 { transform: rotate(304deg); }
  .sky-body { transform: none; }
}

.soulmate-hero-sketch {
  display: grid;
  place-items: center;
  min-height: 17rem;
}
.soulmate-paper {
  position: relative;
  display: grid;
  place-items: center;
  width: min(15rem, 68vw);
  aspect-ratio: .78;
  border: 1px solid rgb(232 199 122 / 35%);
  border-radius: .35rem;
  background: linear-gradient(145deg, #f5f0e5, #ddd4c3);
  box-shadow: 0 1.5rem 4rem rgb(0 0 0 / 35%);
  color: #60594f;
  transform: rotate(-2deg);
}
.soulmate-paper::before,
.soulmate-paper::after {
  position: absolute;
  border: 2px solid rgb(75 69 62 / 42%);
  border-radius: 50%;
  content: "";
}
.soulmate-paper::before { width: 45%; height: 39%; top: 18%; }
.soulmate-paper::after { width: 70%; height: 35%; bottom: 8%; border-bottom: 0; }
.soulmate-paper b { font-family: var(--font-display); font-size: 4rem; font-weight: 400; opacity: .55; }
.soulmate-paper i { position: absolute; inset: 8%; border: 1px dashed rgb(75 69 62 / 18%); }
.soulmate-pencil { color: var(--gold-300); font-size: 3.5rem; line-height: 1; }
.soulmate-loading {
  display: grid;
  justify-items: center;
  gap: .45rem;
  padding: 1.6rem 1.1rem 1.8rem;
  text-align: center;
}
.soulmate-loading h2 { margin: .15rem 0 .2rem; }
.soulmate-draw-status { margin: 0 0 .7rem; color: var(--text-soft); }
.soulmate-draw-stage {
  position: relative;
  width: min(16.5rem, calc(100vw - 3rem), 58dvh);
  aspect-ratio: 4 / 5;
  overflow: hidden;
  isolation: isolate;
  border-radius: 1.15rem;
  background: #f4efe3;
  box-shadow: 0 1.1rem 2.4rem rgb(16 10 28 / 22%);
}
.soulmate-draw-portrait {
  display: block;
  width: 100%;
  height: 100%;
}
.soulmate-draw-page {
  fill: #f7f1e6;
  stroke: rgb(91 85 77 / 22%);
  stroke-width: 1.4;
}
.soulmate-draw-line {
  fill: none;
  stroke: #5b554d;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 280;
  stroke-dashoffset: 280;
}
.soulmate-draw-line-head { stroke-width: 2.4; animation: soulmate-ink 4.8s ease-in-out infinite; }
.soulmate-draw-line-face { stroke-width: 1.8; animation: soulmate-ink 4.8s .55s ease-in-out infinite; }
.soulmate-draw-line-shoulders { stroke-width: 2.1; animation: soulmate-ink 4.8s 1.1s ease-in-out infinite; }
.soulmate-draw-scan {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
  height: 34%;
  background: linear-gradient(180deg, transparent, rgb(255 255 255 / 72%), rgb(197 160 80 / 18%), transparent);
  animation: soulmate-scan 2.1s ease-in-out infinite;
  pointer-events: none;
}
.soulmate-draw-sparkle {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 22% 18%, #fff 0 1.3px, transparent 2px),
    radial-gradient(circle at 78% 28%, #f5d06f 0 1.5px, transparent 2.2px),
    radial-gradient(circle at 64% 72%, #fff 0 1.1px, transparent 1.8px);
  animation: soulmate-sparkle 1.8s ease-in-out infinite;
  pointer-events: none;
}
.soulmate-draw-pencil {
  position: absolute;
  left: 58%;
  top: 22%;
  z-index: 2;
  color: #c9a227;
  font-size: 1.7rem;
  filter: drop-shadow(0 4px 10px rgb(16 10 28 / 35%));
  animation: soulmate-pencil-move 2.6s ease-in-out infinite;
  pointer-events: none;
}
.soulmate-draw-track {
  width: min(16.5rem, calc(100vw - 3rem));
  height: .42rem;
  overflow: hidden;
  margin: .85rem 0 .35rem;
  border-radius: 999px;
  background: rgb(255 255 255 / 6%);
}
.soulmate-draw-track i {
  display: block;
  width: 35%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--gold-500), var(--gold-300));
  animation: soulmate-draw-bar 2.4s ease-in-out infinite;
}
.soulmate-draw-steps {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .55rem .85rem;
  width: min(22rem, 100%);
  margin: .55rem 0 0;
  padding: 0;
  list-style: none;
  color: var(--text-muted);
  font-size: .72rem;
}
.soulmate-draw-steps li { animation: soulmate-step-glow 6.6s ease-in-out infinite; }
.soulmate-draw-steps li:nth-child(2) { animation-delay: 2.2s; }
.soulmate-draw-steps li:nth-child(3) { animation-delay: 4.4s; }
.soulmate-loading .muted { max-width: 26rem; margin: .85rem 0 0; }
@keyframes soulmate-ink {
  0% { stroke-dashoffset: 280; opacity: .25; }
  35%, 68% { stroke-dashoffset: 0; opacity: 1; }
  100% { stroke-dashoffset: 280; opacity: .25; }
}
@keyframes soulmate-pencil-move {
  0% { transform: translate(-8px, 0) rotate(-18deg); }
  40% { transform: translate(18px, 42px) rotate(-8deg); }
  70% { transform: translate(-4px, 88px) rotate(-22deg); }
  100% { transform: translate(-8px, 0) rotate(-18deg); }
}
@keyframes soulmate-draw-bar {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(320%); }
}
@keyframes soulmate-step-glow {
  0%, 100% { color: var(--text-muted); }
  18%, 32% { color: var(--gold-300); }
}
@media (max-width: 420px) {
  .soulmate-loading { padding: 1.2rem .75rem 1.4rem; }
  .soulmate-loading h2 { font-size: 1.45rem; }
}
@media (prefers-reduced-motion: reduce) {
  .soulmate-draw-line,
  .soulmate-draw-scan,
  .soulmate-draw-sparkle,
  .soulmate-draw-pencil,
  .soulmate-draw-track i,
  .soulmate-draw-steps li {
    animation: none;
  }
  .soulmate-draw-line { stroke-dashoffset: 0; }
}
.soulmate-reveal { text-align: center; }
.soulmate-offer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1rem;
  text-align: left;
}
.soulmate-offer span { display: grid; gap: .2rem; }
.soulmate-offer small { color: var(--text-muted); }
.soulmate-offer b { color: var(--gold-300); font-family: var(--font-display); font-size: 1.4rem; white-space: nowrap; }
.soulmate-offer .soulmate-offer-price { flex: 0 0 auto; justify-items: end; text-align: right; }
.soulmate-offer .soulmate-offer-price small { max-width: 10rem; }
.soulmate-companions {
  display: grid;
  gap: 1rem;
  margin-top: 1.6rem;
}
.soulmate-link-card {
  display: grid;
  gap: .45rem;
  text-decoration: none;
  color: inherit;
}
.soulmate-link-card h2 { margin: .1rem 0 .15rem; }
.soulmate-link-card .button { justify-self: start; margin-top: .45rem; }
.soulmate-private-url {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  max-width: 100%;
  margin-top: .35rem;
  padding: .7rem .95rem;
  border: 1px solid rgb(232 199 122 / 28%);
  border-radius: .85rem;
  background: rgb(16 10 28 / 28%);
  color: var(--gold-300);
  font-size: .92rem;
  font-weight: 600;
  letter-spacing: .01em;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.soulmate-private-url:hover { border-color: var(--gold-300); color: #fff; }
.soulmate-chart-card { transition: transform .2s ease, border-color .2s ease; }
.soulmate-chart-card:hover { transform: translateY(-2px); }
@media (min-width: 760px) {
  .soulmate-companions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.soulmate-sketch-card { display: grid; gap: 1.25rem; align-items: center; }
.soulmate-sketch-card img {
  width: 100%;
  max-height: 70vh;
  border-radius: .75rem;
  object-fit: contain;
  background: #f4efe3;
}
@media (min-width: 760px) {
  .soulmate-sketch-card { grid-template-columns: minmax(0, 1.4fr) minmax(15rem, .6fr); }
}

body.soulmate-funnel-page {
  color-scheme: light;
  background:
    radial-gradient(ellipse at 50% -12%, rgb(155 130 230 / 28%), transparent 34rem),
    radial-gradient(ellipse at 110% 88%, rgb(232 199 122 / 16%), transparent 24rem),
    radial-gradient(ellipse at -8% 70%, rgb(109 77 224 / 12%), transparent 22rem),
    #f4f0ff;
  color: #16131f;
}
body.soulmate-funnel-page::before {
  display: block;
  opacity: .55;
  background-image:
    radial-gradient(circle at 12% 16%, #8b6fe8 0 1.1px, transparent 1.6px),
    radial-gradient(circle at 78% 11%, #6d4de0 0 .8px, transparent 1.3px),
    radial-gradient(circle at 91% 42%, #c4b4ff 0 1px, transparent 1.5px),
    radial-gradient(circle at 18% 68%, #8b6fe8 0 .7px, transparent 1.2px),
    radial-gradient(circle at 64% 82%, #e8c77a 0 .8px, transparent 1.3px),
    radial-gradient(circle at 42% 28%, #6d4de0 0 .6px, transparent 1.1px);
  background-size: 17rem 21rem, 27rem 29rem, 33rem 37rem, 41rem 23rem, 19rem 31rem, 23rem 19rem;
}
body.soulmate-funnel-page main {
  background: transparent;
  width: 100%;
}
body.soulmate-funnel-page .join-app {
  position: relative;
  z-index: 1;
  width: min(26.5rem, 100%);
  padding-top: .4rem;
}
body.soulmate-funnel-page .join-back,
body.soulmate-funnel-page .join-progress-label,
body.soulmate-funnel-page .join-kicker,
body.soulmate-funnel-page .join-sub,
body.soulmate-funnel-page .join-secure,
body.soulmate-funnel-page .join-disclaimer {
  color: #6b6578;
}
body.soulmate-funnel-page .join-brand { color: #16131f; }
body.soulmate-funnel-page .join-brand-mark {
  background: #16131f;
  color: #fff;
  border-color: #16131f;
}
body.soulmate-funnel-page .join-progress-track { background: #efeaf8; }
body.soulmate-funnel-page .join-progress-track i {
  background: linear-gradient(90deg, #8b6fe8, #6d4de0);
}
body.soulmate-funnel-page .join-step h1,
body.soulmate-funnel-page .join-step h2 {
  color: #16131f;
  font-family: var(--font-sans);
  font-size: 1.45rem;
  font-weight: 750;
  letter-spacing: -.03em;
  line-height: 1.25;
  text-align: center;
}
body.soulmate-funnel-page .join-step h1 { font-size: 1.65rem; }
body.soulmate-funnel-page .join-sub {
  margin-bottom: .7rem;
  color: #4d475a;
}
body.soulmate-funnel-page .soulmate-hero-sketch {
  width: 100%;
  min-height: 0;
  margin: .15rem 0 .35rem;
}
body.soulmate-funnel-page .soulmate-hero-photo {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center 28%;
  border-radius: 1.15rem;
  box-shadow: 0 1.1rem 2.2rem rgb(88 62 170 / 16%);
}
body.soulmate-funnel-page .soulmate-sky {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
body.soulmate-funnel-page .soulmate-sky-ring,
body.soulmate-funnel-page .soulmate-sky-constellation {
  position: absolute;
  fill: none;
}
body.soulmate-funnel-page .soulmate-sky-ring {
  top: -6rem;
  right: -7rem;
  width: min(22rem, 72vw);
  stroke: rgb(109 77 224 / 22%);
  stroke-width: .8;
}
body.soulmate-funnel-page .soulmate-sky-ring path { fill: rgb(109 77 224 / 28%); stroke: none; }
body.soulmate-funnel-page .soulmate-sky-constellation {
  left: -2rem;
  bottom: 8%;
  width: min(22rem, 78vw);
  stroke: rgb(109 77 224 / 28%);
  stroke-width: 1.2;
}
body.soulmate-funnel-page .soulmate-sky-constellation circle { fill: rgb(109 77 224 / 42%); stroke: none; }
body.soulmate-funnel-page .join-form,
body.soulmate-funnel-page .join-step,
body.soulmate-funnel-page .join-step-body,
body.soulmate-funnel-page .join-step-actions {
  background: none;
  box-shadow: none;
  border: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
body.soulmate-funnel-page .join-step-actions {
  gap: .55rem;
  margin-top: auto;
  padding: .75rem 0 .15rem;
  background: linear-gradient(180deg, transparent, #efeaf6 36%);
}
body.soulmate-funnel-page .join-cta {
  -webkit-appearance: none;
  appearance: none;
  background: #6d4de0;
  color: #fff;
  border: 0;
  box-shadow: 0 .7rem 1.6rem rgb(109 77 224 / 28%);
}
body.soulmate-funnel-page .join-cta:hover { filter: brightness(1.06); }
body.soulmate-funnel-page .join-included li { color: #4d475a; }
body.soulmate-funnel-page .soulmate-offer {
  position: relative;
  overflow: hidden;
  background: #f7f4fd;
  border: 1px solid #e4dcf6;
  border-radius: 1rem;
  padding: 1rem 1.1rem;
  animation: soulmate-offer-breathe 3.2s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-offer::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 25%, rgb(255 255 255 / 58%) 48%, transparent 70%);
  content: "";
  transform: translateX(-120%);
  animation: soulmate-offer-shine 3.8s 1s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-offer > * { position: relative; z-index: 1; }
body.soulmate-funnel-page .soulmate-offer b { color: #6d4de0; }
body.soulmate-funnel-page .join-email-opt { color: #16131f; }
body.soulmate-funnel-page .join-disclaimer a { color: #6d4de0; }
body.soulmate-funnel-page .soulmate-landing { align-items: center; text-align: center; }
body.soulmate-funnel-page .soulmate-trust {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .55rem;
  width: 100%;
  margin: 0 0 1rem;
  padding: 0;
  list-style: none;
}
body.soulmate-funnel-page .soulmate-trust li {
  display: grid;
  gap: .15rem;
  padding: .7rem .75rem;
  border: 1px solid #e4dcf6;
  border-radius: 999px;
  background: #faf8ff;
  text-align: center;
}
body.soulmate-funnel-page .soulmate-trust small {
  color: #8a8298;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
body.soulmate-funnel-page .soulmate-trust strong { font-size: .78rem; }
body.soulmate-funnel-page .soulmate-titles { display: grid; gap: .35rem; }
body.soulmate-funnel-page .soulmate-kicker {
  margin: 0;
  color: #7a63d4;
  font-size: 1.15rem;
  font-weight: 650;
}
body.soulmate-funnel-page .soulmate-chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .45rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}
body.soulmate-funnel-page .soulmate-chips li {
  padding: .35rem .7rem;
  border-radius: 999px;
  background: #f3effc;
  color: #5c5270;
  font-size: .75rem;
  font-weight: 700;
}
body.soulmate-funnel-page .soulmate-proof { align-items: center; text-align: center; }
body.soulmate-funnel-page .soulmate-proof .join-sub { margin-bottom: 1rem; }
body.soulmate-funnel-page .soulmate-proof-path {
  display: grid;
  gap: .55rem;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: none;
}
body.soulmate-funnel-page .soulmate-proof-path li {
  display: grid;
  grid-template-columns: 2rem 1fr;
  grid-template-rows: auto auto;
  column-gap: .75rem;
  align-items: start;
  padding: .85rem .9rem;
  border: 1px solid #e4dcf6;
  border-radius: 1rem;
  background: #faf8ff;
  text-align: left;
}
body.soulmate-funnel-page .soulmate-proof-num {
  grid-row: 1 / span 2;
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  margin-top: .1rem;
  border-radius: 999px;
  background: #6d4de0;
  color: #fff;
  font-size: .82rem;
  font-weight: 800;
}
body.soulmate-funnel-page .soulmate-proof-path strong {
  color: #16131f;
  font-size: .95rem;
  font-weight: 750;
}
body.soulmate-funnel-page .soulmate-proof-path small {
  display: block;
  margin-top: .15rem;
  color: #6b6578;
  font-size: .78rem;
  line-height: 1.4;
}
body.soulmate-funnel-page .soulmate-review {
  width: 100%;
  margin: .85rem 0 0;
  padding: 1rem 1.05rem .9rem;
  border: 1px solid #e4dcf6;
  border-radius: 1.15rem;
  background: #fff;
  text-align: left;
}
body.soulmate-funnel-page .soulmate-review blockquote {
  margin: 0;
  color: #2a2436;
  font-size: .95rem;
  font-style: italic;
  line-height: 1.5;
}
body.soulmate-funnel-page .soulmate-review figcaption {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  margin-top: .75rem;
  padding-top: .7rem;
  border-top: 1px solid #efeaf8;
}
body.soulmate-funnel-page .soulmate-review small { color: #8a8298; }
body.soulmate-funnel-page .soulmate-choice-list {
  display: grid;
  gap: .65rem;
  margin-top: .85rem;
}
body.soulmate-funnel-page .soulmate-choice-list.two { grid-template-columns: 1fr 1fr; }
body.soulmate-funnel-page .soulmate-choice {
  display: flex;
  align-items: center;
  gap: .8rem;
  width: 100%;
  min-height: 3.5rem;
  padding: .85rem 1rem;
  border: 1px solid #ece8f2;
  border-radius: 1rem;
  background: #f7f5f9;
  color: #16131f;
  text-align: left;
  cursor: pointer;
}
body.soulmate-funnel-page .soulmate-choice span { font-size: 1.25rem; line-height: 1; }
body.soulmate-funnel-page .soulmate-choice strong { font-size: .98rem; font-weight: 650; }
body.soulmate-funnel-page .soulmate-choice:hover,
body.soulmate-funnel-page .soulmate-choice.is-selected {
  border-color: #6d4de0;
  background: #f3eeff;
}
body.soulmate-funnel-page .soulmate-field,
body.soulmate-funnel-page .soulmate-funnel #soulmate-name,
body.soulmate-funnel-page .soulmate-funnel #soulmate-birth-date,
body.soulmate-funnel-page .soulmate-funnel #soulmate-birth-time,
body.soulmate-funnel-page .soulmate-funnel #soulmate-place {
  width: 100%;
  margin-top: .85rem;
  padding: .95rem 1rem;
  border: 1px solid #ece8f2;
  border-radius: 1rem;
  background: #f7f5f9;
  color: #16131f;
  font: inherit;
}
body.soulmate-funnel-page .soulmate-label {
  display: block;
  margin-top: 1rem;
  color: #6b6578;
  font-size: .86rem;
}
body.soulmate-funnel-page .soulmate-pickers {
  height: 6.75rem;
  margin-top: .7rem;
  padding: 0 .35rem;
  border: 1px solid #ece8f2;
  border-radius: 1.15rem;
  background: #fff;
}
body.soulmate-funnel-page .soulmate-pickers.time {
  grid-template-columns: .8fr auto .8fr .85fr;
  width: 100%;
  margin-inline: 0;
}
body.soulmate-funnel-page .soulmate-pickers.is-unset .join-wheel-item.is-active {
  color: #6b6578;
  font-weight: 600;
}
body.soulmate-funnel-page .join-wheel-item { color: #9a93a8; }
body.soulmate-funnel-page .join-wheel-item.is-active {
  color: #16131f;
  font-size: 1.12rem;
}
body.soulmate-funnel-page .join-wheel-window {
  background: rgb(109 77 224 / 8%);
  box-shadow: inset 0 0 0 1px rgb(109 77 224 / 16%);
}
body.soulmate-funnel-page .join-time-colon { color: #16131f; }
body.soulmate-funnel-page .join-text-action {
  display: block;
  width: 100%;
  margin-top: .65rem;
  color: #6d4de0;
  font-size: .9rem;
}
body.soulmate-funnel-page .place-suggest-list {
  background: #fff;
  border-color: #ece8f2;
  color: #16131f;
  box-shadow: 0 12px 28px rgb(22 19 31 / 10%);
}
body.soulmate-funnel-page .place-suggest-option {
  color: #16131f;
}
body.soulmate-funnel-page .place-suggest-option strong { color: #16131f; }
body.soulmate-funnel-page .place-suggest-option small { color: #6b6578; }
body.soulmate-funnel-page .place-suggest-option:hover,
body.soulmate-funnel-page .place-suggest-option[aria-selected="true"] {
  background: #f3eeff;
}
body.soulmate-funnel-page .soulmate-reveal,
body.soulmate-funnel-page .soulmate-offer-step {
  align-items: center;
  text-align: center;
}
body.soulmate-funnel-page .soulmate-teaser {
  position: relative;
  width: min(18rem, calc(100vw - 2.4rem), calc(52dvh * .78));
  margin: .35rem auto .85rem;
  overflow: hidden;
  isolation: isolate;
  border-radius: 1.15rem;
  background: #ece8f4;
  box-shadow: 0 1.1rem 2.4rem rgb(88 62 170 / 18%);
}
body.soulmate-funnel-page .soulmate-teaser img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  max-height: min(24rem, 52dvh);
  object-fit: cover;
  object-position: center 22%;
  transform-origin: center 30%;
}
body.soulmate-funnel-page .soulmate-teaser.is-drawing img {
  filter: blur(16px) saturate(.45) brightness(1.08);
  transform: scale(1.12);
  animation: soulmate-draw-blur 3.6s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-teaser.is-drawing.is-ready img {
  animation: soulmate-lock-in .7s ease both;
}
body.soulmate-funnel-page .soulmate-teaser.is-locked img {
  filter: blur(18px) saturate(.4) brightness(1.06);
  transform: scale(1.14);
  animation: soulmate-locked-tease 4.8s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-teaser-glow,
body.soulmate-funnel-page .soulmate-teaser-shimmer,
body.soulmate-funnel-page .soulmate-teaser-scan,
body.soulmate-funnel-page .soulmate-teaser-fog,
body.soulmate-funnel-page .soulmate-teaser-sparkle {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
body.soulmate-funnel-page .soulmate-teaser-glow {
  box-shadow: inset 0 0 3.2rem rgb(109 77 224 / 28%);
  animation: soulmate-glow 2.4s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-teaser-fog {
  background:
    radial-gradient(circle at 50% 38%, rgb(255 255 255 / 18%), transparent 42%),
    linear-gradient(180deg, rgb(244 240 255 / 12%), rgb(22 19 31 / 46%) 82%);
}
body.soulmate-funnel-page .soulmate-teaser-scan {
  height: 32%;
  inset: auto 0 0;
  background: linear-gradient(180deg, transparent, rgb(255 255 255 / 46%), transparent);
  animation: soulmate-scan 2s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-teaser-shimmer {
  background: linear-gradient(110deg, transparent 28%, rgb(255 255 255 / 38%) 48%, transparent 68%);
  transform: translateX(-120%);
  animation: soulmate-shimmer 2.8s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-teaser-sparkle {
  background:
    radial-gradient(circle at 18% 22%, #fff 0 1.4px, transparent 2px),
    radial-gradient(circle at 78% 30%, #f3e8ff 0 1.6px, transparent 2.2px),
    radial-gradient(circle at 62% 72%, #fff 0 1.2px, transparent 1.8px);
  animation: soulmate-sparkle 1.8s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-teaser-lock {
  position: absolute;
  left: 50%;
  bottom: .75rem;
  z-index: 1;
  padding: .42rem .8rem;
  border-radius: 999px;
  background: rgb(22 19 31 / 76%);
  color: #fff;
  font-size: clamp(.64rem, 2.8vw, .72rem);
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  transform: translateX(-50%);
  animation: soulmate-lock-pulse 2.2s ease-in-out infinite;
}
body.soulmate-funnel-page .soulmate-reveal-track {
  width: min(18rem, calc(100vw - 2.4rem), calc(52dvh * .78));
  height: .42rem;
  overflow: hidden;
  border-radius: 999px;
  background: #efeaf8;
}
body.soulmate-funnel-page .soulmate-reveal-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8b6fe8, #6d4de0);
  transition: width .7s ease;
}
body.soulmate-funnel-page .soulmate-offer-step .join-included { width: 100%; text-align: left; }
body.soulmate-funnel-page .soulmate-offer-step .join-included li {
  opacity: 0;
  transform: translateY(.45rem);
  animation: soulmate-benefit-in .48s ease forwards;
}
body.soulmate-funnel-page .soulmate-offer-step .join-included li:nth-child(2) { animation-delay: .08s; }
body.soulmate-funnel-page .soulmate-offer-step .join-included li:nth-child(3) { animation-delay: .16s; }
body.soulmate-funnel-page .soulmate-offer-step .join-included li:nth-child(4) { animation-delay: .24s; }
body.soulmate-funnel-page .soulmate-offer-step .join-included li:nth-child(5) { animation-delay: .32s; }
body.soulmate-funnel-page .soulmate-offer-step .soulmate-teaser { margin: 1rem auto .35rem; }
@keyframes soulmate-offer-breathe {
  0%, 100% { border-color: #e4dcf6; box-shadow: 0 .5rem 1.3rem rgb(109 77 224 / 9%); transform: translateY(0); }
  50% { border-color: #b8a5ef; box-shadow: 0 .75rem 1.8rem rgb(109 77 224 / 19%); transform: translateY(-2px); }
}
@keyframes soulmate-offer-shine {
  0%, 48% { transform: translateX(-120%); }
  72%, 100% { transform: translateX(120%); }
}
@keyframes soulmate-benefit-in {
  to { opacity: 1; transform: translateY(0); }
}
@keyframes soulmate-scan {
  0% { top: -18%; opacity: 0; }
  16% { opacity: 1; }
  100% { top: 86%; opacity: 0; }
}
@keyframes soulmate-shimmer {
  0% { transform: translateX(-130%); }
  45%, 100% { transform: translateX(130%); }
}
@keyframes soulmate-sparkle {
  0%, 100% { opacity: .25; }
  50% { opacity: 1; }
}
@keyframes soulmate-glow {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}
@keyframes soulmate-draw-blur {
  0%, 100% { filter: blur(18px) saturate(.4) brightness(1.06); transform: scale(1.16); }
  45% { filter: blur(10px) saturate(.55) brightness(1.1); transform: scale(1.08); }
}
@keyframes soulmate-lock-in {
  from { filter: blur(10px) saturate(.55); transform: scale(1.08); }
  to { filter: blur(18px) saturate(.4); transform: scale(1.14); }
}
@keyframes soulmate-locked-tease {
  0%, 100% { filter: blur(20px) saturate(.38) brightness(1.05); transform: scale(1.16); }
  42% { filter: blur(9px) saturate(.58) brightness(1.1); transform: scale(1.06); }
  58% { filter: blur(22px) saturate(.35) brightness(1.04); transform: scale(1.18); }
}
@keyframes soulmate-lock-pulse {
  0%, 100% { transform: translateX(-50%) scale(1); }
  50% { transform: translateX(-50%) scale(1.04); }
}
@media (max-width: 420px) {
  body.soulmate-funnel-page .soulmate-choice-list.two { grid-template-columns: 1fr; }
  body.soulmate-funnel-page .soulmate-reveal h2,
  body.soulmate-funnel-page .soulmate-offer-step h2 { font-size: 1.35rem; }
  body.soulmate-funnel-page .join-app {
    width: 100%;
    padding-inline: 1.15rem;
  }
  body.soulmate-funnel-page .join-step-actions {
    margin-top: auto;
    padding: .65rem 0 0;
  }
  body.soulmate-funnel-page .join-cta {
    min-height: 3.2rem;
    box-shadow: 0 .55rem 1.25rem rgb(109 77 224 / 24%);
  }
}
@media (max-height: 740px) {
  body.soulmate-funnel-page .soulmate-teaser {
    width: min(15.5rem, calc(100vw - 2rem), calc(42dvh * .82));
  }
  body.soulmate-funnel-page .soulmate-teaser img { max-height: min(18.5rem, 42dvh); }
  body.soulmate-funnel-page .soulmate-reveal-track {
    width: min(15.5rem, calc(100vw - 2rem), calc(42dvh * .82));
  }
}
@media (prefers-reduced-motion: reduce) {
  body.soulmate-funnel-page .soulmate-teaser img,
  body.soulmate-funnel-page .soulmate-teaser-scan,
  body.soulmate-funnel-page .soulmate-teaser-shimmer,
  body.soulmate-funnel-page .soulmate-teaser-sparkle,
  body.soulmate-funnel-page .soulmate-teaser-glow,
  body.soulmate-funnel-page .soulmate-teaser-lock,
  body.soulmate-funnel-page .soulmate-offer,
  body.soulmate-funnel-page .soulmate-offer::after,
  body.soulmate-funnel-page .soulmate-offer-step .join-included li {
    animation: none;
  }
  body.soulmate-funnel-page .soulmate-offer-step .join-included li {
    opacity: 1;
    transform: none;
  }
  body.soulmate-funnel-page .soulmate-teaser.is-drawing img,
  body.soulmate-funnel-page .soulmate-teaser.is-locked img {
    filter: blur(16px) saturate(.45);
    transform: scale(1.1);
  }
}
body.soulmate-resume-page .join-app {
  min-height: auto;
  overflow: visible;
  padding-bottom: calc(1.4rem + env(safe-area-inset-bottom));
}
body.soulmate-resume-page .soulmate-resume-story {
  display: grid;
  gap: .85rem;
  padding-bottom: .4rem;
}
body.soulmate-resume-page .soulmate-resume-story h1 {
  display: grid;
  gap: .12rem;
  margin: 0;
  font-size: clamp(1.75rem, 7.4vw, 2.2rem);
  line-height: 1.12;
  text-align: center;
}
body.soulmate-resume-page .soulmate-resume-story h1 span {
  color: #6d4de0;
}
body.soulmate-resume-page .soulmate-resume-lead {
  max-width: 22.5rem;
  margin: 0 auto;
  text-align: center;
}
body.soulmate-resume-page .soulmate-resume-collage {
  display: grid;
  gap: .7rem;
}
body.soulmate-resume-page .soulmate-resume-hero-sketch {
  width: min(18.5rem, 100%);
  margin: .1rem auto .15rem;
}
body.soulmate-resume-page .soulmate-resume-couple {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center 30%;
  border-radius: 1.15rem;
  box-shadow: 0 1rem 2rem rgb(88 62 170 / 16%);
}
body.soulmate-resume-page .soulmate-resume-trust {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
body.soulmate-resume-page .soulmate-resume-trust li {
  display: grid;
  place-items: center;
  min-height: 2.9rem;
  padding: .4rem .3rem;
  border: 1px solid #ece6f5;
  border-radius: .85rem;
  background: #f6f3fb;
  color: #6d4de0;
  font-size: .72rem;
  font-weight: 750;
  line-height: 1.25;
  text-align: center;
}
body.soulmate-resume-page .soulmate-chat {
  display: grid;
  gap: .55rem;
  padding: .95rem .9rem 1rem;
  border: 1px solid #e4dcf6;
  border-radius: 1.2rem;
  background: linear-gradient(180deg, #fff, #f7f4fd);
}
body.soulmate-resume-page .soulmate-chat-label {
  margin: 0;
  color: #8a8298;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
}
body.soulmate-resume-page .soulmate-chat-thread {
  display: grid;
  gap: .55rem;
}
body.soulmate-resume-page .soulmate-chat-row {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: .45rem;
  align-items: end;
  max-width: 92%;
}
body.soulmate-resume-page .soulmate-chat-avatar {
  width: 2rem;
  height: 2rem;
  object-fit: cover;
  object-position: center;
  border-radius: 999px;
  background: #d9d0ea;
}
body.soulmate-resume-page .soulmate-chat-row p,
body.soulmate-resume-page .soulmate-chat-sketch {
  margin: 0;
  padding: .7rem .85rem;
  border-radius: 1.05rem 1.05rem 1.05rem .35rem;
  background: #efeaf8;
  color: #241c33;
  font-size: .92rem;
  line-height: 1.4;
  text-align: left;
}
body.soulmate-resume-page .soulmate-chat-row.is-me {
  grid-template-columns: minmax(0, 1fr);
  justify-self: end;
}
body.soulmate-resume-page .soulmate-chat-row.is-me p {
  border-radius: 1.05rem 1.05rem .35rem 1.05rem;
  background: #6d4de0;
  color: #fff;
}
body.soulmate-resume-page .soulmate-chat-row.is-photo {
  align-items: start;
}
body.soulmate-resume-page .soulmate-chat-sketch {
  position: relative;
  overflow: hidden;
  padding: 0;
  background: #121126;
}
body.soulmate-resume-page .soulmate-chat-sketch img {
  width: 9.6rem;
  height: 12rem;
  filter: blur(7px) saturate(.6);
  transform: scale(1.08);
}
body.soulmate-resume-page .soulmate-chat-sketch span {
  position: absolute;
  left: 50%;
  bottom: .55rem;
  padding: .22rem .55rem;
  border-radius: 999px;
  background: rgb(18 17 38 / 78%);
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  transform: translateX(-50%);
}
body.soulmate-resume-page .soulmate-resume-quote {
  margin: 0;
  padding: 1rem 1.05rem;
  border: 1px solid #e4dcf6;
  border-radius: 1.1rem;
  background: #fff;
  color: #241c33;
  font-size: 1rem;
  font-style: italic;
  line-height: 1.45;
  text-align: left;
}
body.soulmate-resume-page .soulmate-resume-quote cite {
  display: block;
  margin-top: .55rem;
  color: #8a8298;
  font-size: .78rem;
  font-style: normal;
  font-weight: 700;
}
body.soulmate-resume-page .soulmate-resume [data-resume-paywall],
body.soulmate-resume-page .soulmate-resume .join-cta {
  width: 100%;
}
body.soulmate-resume-page .soulmate-resume .soulmate-offer {
  width: 100%;
}
body.soulmate-resume-page .soulmate-resume .membership-perks {
  width: 100%;
}
