.astrolog-component {
  --component-gold: var(--gold, #d6b36a);
  --component-moon: var(--moon, #edf1f7);
  --component-silver: var(--silver, #aeb9cc);
  --component-line: var(--line, rgba(214,179,106,.22));
  --component-ink: var(--ink, #070913);
  --component-raised: var(--ink-raised, #12192b);
  position: relative;
}

.astrolog-component [hidden] {
  display: none !important;
}

.astrolog-loading {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--component-silver);
}
.astrolog-loading::before {
  width: 11px;
  height: 11px;
  content: "";
  border: 1px solid var(--component-gold);
  border-top-color: transparent;
  border-radius: 50%;
  animation: astrolog-spin 1s linear infinite;
}

.astrolog-error {
  padding: 16px 18px;
  color: #ffd8cf;
  background: rgba(173,63,41,.12);
  border: 1px solid rgba(207,110,79,.4);
  border-radius: 10px;
}

.portal {
  position: relative;
  display: grid;
  min-height: max(760px, 100svh);
  padding: calc(var(--header-h, 76px) + 42px) max(20px, calc((100vw - 1160px) / 2)) 54px;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at 50% 47%, rgba(42,62,104,.22), transparent 26rem),
    radial-gradient(circle at 50% 15%, rgba(130,154,208,.1), transparent 34rem),
    linear-gradient(180deg, #060813 0%, #090d19 60%, #070913 100%);
}

.portal::before,
.portal::after {
  position: absolute;
  inset: -20%;
  z-index: -3;
  pointer-events: none;
  content: "";
  background-image:
    radial-gradient(circle at 21% 31%, rgba(255,255,255,.8) 0 1px, transparent 1.2px),
    radial-gradient(circle at 74% 22%, rgba(243,221,162,.6) 0 1px, transparent 1.3px),
    radial-gradient(circle at 61% 77%, rgba(255,255,255,.65) 0 1px, transparent 1.2px),
    radial-gradient(circle at 14% 81%, rgba(255,255,255,.45) 0 1px, transparent 1.1px);
  background-size: 190px 190px, 270px 270px, 330px 330px, 410px 410px;
  animation: astrolog-drift 42s linear infinite;
}

.portal::after {
  inset: -10%;
  z-index: -2;
  opacity: .35;
  filter: blur(.2px);
  transform: rotate(17deg) scale(1.1);
  animation-duration: 70s;
  animation-direction: reverse;
}

.portal__layout {
  display: grid;
  grid-template-columns: minmax(330px, .92fr) minmax(430px, 1.08fr);
  align-items: center;
  width: min(1160px, 100%);
  gap: clamp(32px, 5vw, 84px);
}

.portal__copy { position: relative; z-index: 3; max-width: 690px; transition: opacity .35s ease, filter .35s ease, transform .35s ease; }
.portal__copy h1 { margin-bottom: 28px; font-size: clamp(3.5rem, 7.3vw, 7.6rem); }
.portal__copy h1 em { color: var(--component-gold); font-style: normal; }
.portal__lead { max-width: 590px; color: var(--component-silver); font-size: clamp(1.02rem, 1.7vw, 1.25rem); }
.portal__truth { display: flex; margin-top: 30px; align-items: center; gap: 12px; color: #8f9bae; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; }
.portal__truth::before { width: 34px; height: 1px; content: ""; background: var(--component-gold); }
.portal__actions { display: flex; margin-top: 36px; flex-wrap: wrap; align-items: center; gap: 14px; }

.sky-instrument {
  position: relative;
  width: min(46vw, 610px);
  min-width: 430px;
  aspect-ratio: 1;
  margin: 0 auto;
  filter: drop-shadow(0 32px 80px rgba(0,0,0,.52));
}

.sky-instrument::before {
  position: absolute;
  inset: 8%;
  z-index: -1;
  content: "";
  background: radial-gradient(circle, rgba(214,179,106,.09), rgba(25,38,72,.05) 42%, transparent 70%);
  border-radius: 50%;
  filter: blur(12px);
}

.sky-instrument__svg { width: 100%; height: 100%; overflow: visible; }
.sky-ring { fill: none; stroke: rgba(214,179,106,.25); stroke-width: .7; vector-effect: non-scaling-stroke; }
.sky-ring--outer { stroke: rgba(243,221,162,.44); stroke-width: 1; }
.sky-ring--inner { stroke: rgba(174,185,204,.13); stroke-dasharray: 2 6; }
.sky-axis { stroke: rgba(214,179,106,.16); stroke-width: .6; }
.sky-zodiac text { fill: rgba(237,241,247,.64); font-family: var(--serif, Georgia, serif); font-size: 18px; text-anchor: middle; dominant-baseline: middle; }
.sky-planet line { stroke: rgba(214,179,106,.25); stroke-width: .7; }
.sky-planet circle { fill: #0d1221; stroke: var(--component-gold); stroke-width: 1; }
.sky-planet text { fill: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: 19px; text-anchor: middle; dominant-baseline: central; }
.sky-planet.is-retrograde circle { stroke: #d8896d; }
.sky-planet.is-retrograde text { fill: #ffd3c6; }
.sky-aspect { stroke: rgba(214,179,106,.32); stroke-width: .8; vector-effect: non-scaling-stroke; }
.sky-aspect.is-square, .sky-aspect.is-opposition { stroke: rgba(207,110,79,.46); }
.sky-core { fill: rgba(214,179,106,.08); stroke: rgba(243,221,162,.6); }
.sky-core-mark { fill: var(--component-gold); font-size: 19px; text-anchor: middle; dominant-baseline: middle; }

.sky-instrument__status {
  position: absolute;
  inset: 50% auto auto 50%;
  display: grid;
  width: 28%;
  aspect-ratio: 1;
  place-items: center;
  color: var(--component-silver);
  font-size: .64rem;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
  transform: translate(-50%, -50%);
}
.sky-instrument__status strong { display: block; color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: clamp(1.1rem, 2vw, 1.55rem); font-weight: 400; letter-spacing: 0; text-transform: none; }

.portal[data-state="travel"] .sky-instrument__svg { animation: astrolog-time-spin 6.4s cubic-bezier(.55,.02,.25,1) both; }
.portal[data-state="travel"] .sky-zodiac { transform-origin: 200px 200px; animation: astrolog-ring-counter 6.4s cubic-bezier(.55,.02,.25,1) both; }
.portal[data-state="travel"]::before { animation-duration: 1.2s; }
.portal[data-state="travel"] .portal__copy { opacity: .08; filter: blur(2px); transform: translateY(-10px); pointer-events: none; }
.portal[data-state="revealed"] .sky-instrument { animation: astrolog-reveal 1.1s var(--ease, ease) both; }

.travel-overlay {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: none;
  place-items: center;
  color: var(--component-moon);
  pointer-events: none;
  background: radial-gradient(circle, transparent 30%, rgba(7,9,19,.26));
}
.portal[data-state="travel"] .travel-overlay { display: grid; }
.travel-overlay__year { position: absolute; top: var(--travel-year-y, 50%); left: var(--travel-year-x, 50%); padding: .08em .24em .14em; color: #f4d891; font-family: var(--serif, Georgia, serif); font-size: clamp(4rem, 13vw, 11rem); font-weight: 400; line-height: 1; opacity: .96; text-shadow: 0 0 18px rgba(214,179,106,.72), 0 0 56px rgba(214,179,106,.38), 0 4px 24px #050711; transform: translate(-50%, -50%); }
.travel-overlay__skip { position: fixed; z-index: 12; right: 24px; bottom: calc(24px + env(safe-area-inset-bottom)); min-height: 46px; padding: 8px 18px; color: var(--component-moon); pointer-events: auto; background: rgba(7,9,19,.88); border: 1px solid var(--component-line); border-radius: 999px; cursor: pointer; }

.journey-panel {
  position: fixed;
  z-index: 300;
  inset: 0;
  display: none;
  padding: max(18px, 4vw);
  overflow-y: auto;
  overflow-anchor: none;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  background: rgba(4,6,13,.91);
  backdrop-filter: blur(18px);
}
.journey-panel.is-open { display: block; }
.journey-panel--embedded {
  position: relative;
  z-index: auto;
  inset: auto;
  display: grid;
  padding: 0;
  overflow: visible;
  background: transparent;
  backdrop-filter: none;
}
.journey-panel--embedded .journey-panel__dialog {
  min-height: 0;
}
html.journey-is-open { overflow: hidden; }
.journey-panel[data-element="Eld"] .journey-panel__dialog { box-shadow: 0 40px 120px rgba(119,45,23,.45); }
.journey-panel[data-element="Jord"] .journey-panel__dialog { box-shadow: 0 40px 120px rgba(66,73,44,.45); }
.journey-panel[data-element="Luft"] .journey-panel__dialog { box-shadow: 0 40px 120px rgba(42,68,119,.45); }
.journey-panel[data-element="Vatten"] .journey-panel__dialog { box-shadow: 0 40px 120px rgba(24,66,108,.5); }
.journey-panel__dialog {
  position: relative;
  width: min(1080px, 100%);
  margin: 0 auto;
  min-height: min(700px, calc(100svh - 40px));
  padding: clamp(26px, 5vw, 64px);
  overflow: hidden;
  background:
    radial-gradient(circle at 85% 15%, rgba(214,179,106,.1), transparent 18rem),
    linear-gradient(145deg, rgba(18,25,43,.98), rgba(8,11,21,.98));
  border: 1px solid var(--component-line);
  border-radius: 28px;
  box-shadow: 0 40px 120px rgba(0,0,0,.62);
}
.journey-panel__close { position: absolute; z-index: 4; top: 18px; right: 18px; display: grid; width: 48px; height: 48px; place-items: center; color: var(--component-moon); background: rgba(255,255,255,.03); border: 1px solid var(--component-line); border-radius: 50%; cursor: pointer; }
.journey-form { display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr); align-items: center; gap: clamp(34px, 6vw, 80px); }
.journey-form__intro h2 { font-size: clamp(2.5rem, 5.3vw, 5rem); }
.journey-form__intro p:not(.eyebrow) { color: var(--component-silver); }
.birth-form { display: grid; width: 100%; min-width: 0; max-width: 100%; padding: clamp(24px, 4vw, 42px); gap: 18px; background: rgba(255,255,255,.025); border: 1px solid rgba(214,179,106,.17); border-radius: 20px; }
.birth-form__row { display: grid; width: 100%; min-width: 0; max-width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.birth-form label { display: grid; min-width: 0; max-width: 100%; gap: 7px; color: var(--component-silver); font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.birth-form__row > label { width: 100%; overflow: hidden; }
.birth-form input, .birth-form select {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  inline-size: 100%;
  min-inline-size: 0;
  max-inline-size: 100%;
  -webkit-min-logical-width: 0;
  min-height: 52px;
  padding: 10px 13px;
  color: var(--component-moon);
  color-scheme: dark;
  background: #0b101d;
  border: 1px solid rgba(174,185,204,.2);
  border-radius: 9px;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: normal;
  text-transform: none;
}
.birth-form input[type="date"],
.birth-form input[type="time"] {
  width: auto;
  inline-size: auto;
  min-width: 0;
  max-width: none;
  max-inline-size: none;
  margin-inline: 0;
  justify-self: stretch;
  box-sizing: border-box;
}
.birth-form input:focus, .birth-form select:focus { border-color: var(--component-gold); outline: none; box-shadow: 0 0 0 3px rgba(214,179,106,.1); }
.birth-form input:disabled { color: #697488; background: #080c16; opacity: .72; }
.birth-form input[type="date"]::-webkit-date-and-time-value,
.birth-form input[type="time"]::-webkit-date-and-time-value { min-height: 1.25em; text-align: left; }
.birth-form input[type="date"]::-webkit-calendar-picker-indicator,
.birth-form input[type="time"]::-webkit-calendar-picker-indicator { opacity: .72; }
.birth-form__field-help { color: #727e92; font-size: .69rem; font-weight: 500; letter-spacing: .04em; text-transform: none; }
.birth-form__fold { display: grid; padding: 16px; gap: 10px; background: rgba(214,179,106,.07); border: 1px solid rgba(214,179,106,.3); border-radius: 12px; }
.birth-form__fold[hidden] { display: none; }
.birth-form__fold .birth-form__hint { margin: 0; }
.birth-form__check { display: flex !important; min-height: 44px; grid-column: 1 / -1; grid-template-columns: 22px 1fr !important; align-items: center; gap: 10px !important; text-transform: none !important; letter-spacing: 0 !important; cursor: pointer; }
.birth-form__check input { width: 20px; min-width: 20px; max-width: 20px; inline-size: 20px; min-inline-size: 20px; max-inline-size: 20px; min-height: 20px; accent-color: var(--component-gold); }
.birth-form__hint { margin: -6px 0 0; color: #7e8a9f; font-size: .76rem; }
.birth-form__unknown-note { padding: 12px 14px; color: var(--component-silver); background: rgba(214,179,106,.07); border-left: 2px solid var(--component-gold); }
.birth-form__advanced { padding-top: 10px; border-top: 1px solid rgba(174,185,204,.12); }
.birth-form__advanced summary { color: var(--component-gold); cursor: pointer; font-size: .8rem; }
.birth-form__advanced .birth-form__row { margin-top: 14px; }
.birth-form__manual-submit { width: 100%; margin-top: 14px; }

.revelation { display: none; }
.revelation.is-visible { display: block; animation: astrolog-fade-up .8s var(--ease, ease) both; }
.revelation__header { max-width: 760px; margin-bottom: 42px; }
.revelation__header h2 { font-size: clamp(2.7rem, 6vw, 5.6rem); }
.revelation__explainer { max-width: 680px; margin: 18px 0 0; color: var(--component-silver); font-size: clamp(.96rem, 1.7vw, 1.08rem); line-height: 1.65; }
.big-three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--component-line); border: 1px solid var(--component-line); }
.big-three__card { min-height: 280px; padding: clamp(24px, 4vw, 42px); background: #0c111f; }
.big-three__card[data-big-three="sun"] { position: relative; background: radial-gradient(circle at 18% 12%, rgba(235,198,116,.17), transparent 42%), #0c111f; box-shadow: inset 0 2px 0 rgba(235,198,116,.72); }
.big-three__card[data-big-three="sun"]::after { position: absolute; inset: 12px; border: 1px solid rgba(235,198,116,.2); content: ""; pointer-events: none; }
.big-three__type { color: var(--component-gold); font-size: .7rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.big-three__glyph { display: block; margin: 24px 0 12px; color: var(--component-gold); font-size: 3.8rem; line-height: 1; }
.big-three__card h3 { margin-bottom: 14px; font-size: clamp(1.8rem, 3.4vw, 2.8rem); }
.big-three__card p { color: var(--component-silver); font-size: .92rem; }
.revelation__reading { display: grid; margin-top: 1px; padding: clamp(28px, 5vw, 56px); grid-template-columns: .55fr 1.45fr; gap: 36px; background: linear-gradient(120deg, rgba(214,179,106,.08), rgba(255,255,255,.02)); border: 1px solid var(--component-line); }
.revelation__reading blockquote { margin: 0; color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: clamp(1.45rem, 3vw, 2.35rem); line-height: 1.22; }
.revelation__actions { display: flex; margin-top: 28px; flex-wrap: wrap; gap: 12px; }
.revelation__actions [hidden] { display: none !important; }
.revelation__actions .button { min-width: min(100%, 220px); }
.revelation__status { min-height: 1.5em; margin: 12px 0 0; color: var(--component-silver); font-size: .78rem; }
.calculation-pass { margin-top: 28px; padding: 0; border: 1px solid rgba(174,185,204,.14); border-radius: 12px; }
.calculation-pass summary { padding: 16px 18px; color: var(--component-gold); cursor: pointer; font-weight: 700; }
.calculation-pass__body { display: grid; padding: 0 18px 18px; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.calculation-pass__body div { padding: 12px; background: rgba(255,255,255,.025); }
.calculation-pass__body dt { color: #7e8a9f; font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.calculation-pass__body dd { margin: 3px 0 0; color: var(--component-moon); font-size: .86rem; }

.sky-summary,
.daily-weather,
.mercury-answer,
.moon-calendar {
  padding: clamp(28px, 5vw, 56px);
  background:
    radial-gradient(circle at 88% 10%, rgba(214,179,106,.08), transparent 16rem),
    linear-gradient(140deg, rgba(18,25,43,.8), rgba(9,12,23,.88));
  border: 1px solid var(--component-line);
  border-radius: 22px;
}

.sky-summary__grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(30px, 5vw, 70px); }
.sky-summary .sky-instrument { width: min(100%, 500px); min-width: 0; }
.sky-summary { scroll-margin-top: calc(var(--header-h, 76px) + 20px); }
.sky-summary.is-arriving .sky-instrument__svg { transform-origin: 50% 50%; animation: astrolog-sky-arrive 2.7s cubic-bezier(.22,1,.36,1) both; }
.sky-summary.is-arriving .sky-zodiac { transform-origin: 200px 200px; animation: astrolog-sky-ring 2.7s cubic-bezier(.22,1,.36,1) both; }
.sky-summary.is-arriving .sky-planet { animation: astrolog-planet-arrive 1.3s .85s var(--ease, ease) both; }
.sky-facts { display: grid; gap: 1px; background: var(--component-line); }
.sky-fact { display: grid; padding: 22px; grid-template-columns: 1fr auto; gap: 18px; background: #0c111f; }
.sky-fact span { color: #8591a5; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
.sky-fact strong { color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: 1.1rem; font-weight: 400; text-align: right; }

.daily-weather__split { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); gap: clamp(28px,5vw,68px); }
.daily-weather__data { padding-right: 30px; border-right: 1px solid var(--component-line); }
.daily-weather__aspect { color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: clamp(1.8rem, 4vw, 3.3rem); line-height: 1; }
.daily-weather__meta { color: #7f8a9e; font-size: .8rem; }
.daily-weather__reading p { color: var(--component-silver); }
.daily-weather__reading p:first-child { color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: clamp(1.35rem, 2.4vw, 2rem); line-height: 1.25; }

.mercury-answer { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: clamp(26px, 5vw, 70px); }
.mercury-answer__orb { display: grid; width: clamp(150px, 24vw, 240px); aspect-ratio: 1; place-items: center; color: var(--component-gold); border: 1px solid var(--component-line); border-radius: 50%; box-shadow: 0 0 0 20px rgba(214,179,106,.025), 0 0 70px rgba(214,179,106,.09); font-family: var(--serif, Georgia, serif); font-size: clamp(4rem, 9vw, 7rem); }
.mercury-answer__word { color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: clamp(3rem, 7vw, 6rem); line-height: 1; }
.mercury-answer__next { color: var(--component-silver); }

.moon-events { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; background: var(--component-line); }
.moon-event { display: grid; min-height: 154px; padding: 26px; grid-template-columns: auto 1fr; align-items: center; gap: 20px; background: #0c111f; }
.moon-event__glyph { color: var(--component-gold); font-size: 2.7rem; }
.moon-event__type { color: var(--component-gold); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.moon-event time { display: block; color: var(--component-moon); font-family: var(--serif, Georgia, serif); font-size: 1.32rem; }
.moon-event__sign { color: #8390a4; font-size: .82rem; }

.compatibility {
  padding: clamp(28px, 5vw, 62px);
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 8%, rgba(143,91,211,.16), transparent 23rem),
    radial-gradient(circle at 84% 16%, rgba(214,179,106,.14), transparent 22rem),
    linear-gradient(150deg, #101728, #080b15 68%);
  border: 1px solid var(--component-line);
  border-radius: 28px;
}
.compatibility__intro { max-width: 760px; }
.compatibility__intro h2 { font-size: clamp(2.35rem, 5vw, 4.8rem); }
.compatibility__intro > p:last-child { color: var(--component-silver); }
.compatibility-form { display: grid; margin-top: 34px; padding: clamp(20px, 4vw, 36px); grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: end; gap: 18px; background: rgba(4,7,15,.48); border: 1px solid rgba(214,179,106,.18); border-radius: 20px; }
.compatibility-form label { display: grid; gap: 9px; color: var(--component-silver); font-size: .74rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.compatibility-form select, .premium-interest input[type="email"] { width: 100%; min-height: 56px; padding: 0 16px; color: var(--component-moon); background: #0a101d; border: 1px solid #2a3549; border-radius: 12px; font: inherit; }
.compatibility-form__meeting { padding-bottom: 13px; color: var(--component-gold); font-size: 2rem; }
.compatibility-form > .button { grid-column: 1 / -1; justify-self: center; margin-top: 8px; }
.compatibility-result { max-width: 900px; margin: 48px auto 0; padding-top: 48px; scroll-margin-top: 110px; text-align: center; border-top: 1px solid var(--component-line); }
.compatibility-result__constellation { display: flex; justify-content: center; align-items: center; gap: 22px; color: #f0dcaa; font-size: clamp(3.8rem, 9vw, 7rem); text-shadow: 0 0 36px rgba(143,91,211,.55); }
.compatibility-result__constellation i { width: clamp(60px, 12vw, 150px); height: 1px; background: linear-gradient(90deg, transparent, var(--component-gold), transparent); box-shadow: 0 0 16px rgba(214,179,106,.7); }
.compatibility-result__score { display: flex; margin: 12px 0; justify-content: center; align-items: baseline; gap: 8px; }
.compatibility-result__score strong { color: var(--component-gold); font-family: var(--serif, Georgia, serif); font-size: clamp(4rem, 11vw, 8rem); font-weight: 400; line-height: 1; }
.compatibility-result__score span { color: var(--component-silver); }
.compatibility-result > h3 { font-size: clamp(2rem, 4vw, 3.5rem); }
.compatibility-result__lead { max-width: 700px; margin: 0 auto 30px; color: var(--component-silver); font-size: 1.05rem; }
.compatibility-meters { display: grid; margin: 30px 0; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; text-align: left; }
.compatibility-meter { padding: 18px; background: rgba(255,255,255,.025); border: 1px solid rgba(174,185,204,.12); border-radius: 12px; }
.compatibility-meter p { display: flex; margin: 0 0 12px; justify-content: space-between; gap: 12px; color: var(--component-silver); font-size: .76rem; }
.compatibility-meter strong { color: var(--component-gold); }
.compatibility-meter > span { display: block; height: 4px; overflow: hidden; background: rgba(255,255,255,.08); border-radius: 999px; }
.compatibility-meter i { display: block; width: var(--meter); height: 100%; background: linear-gradient(90deg, #8f5bd3, #e2bf75); box-shadow: 0 0 12px rgba(214,179,106,.45); }
.compatibility-result__reading { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; text-align: left; background: var(--component-line); border: 1px solid var(--component-line); }
.compatibility-result__reading article { padding: clamp(22px, 4vw, 38px); background: #0b101d; }
.compatibility-result__reading h4 { color: var(--component-gold); font-size: .74rem; letter-spacing: .13em; text-transform: uppercase; }
.compatibility-result__reading p { color: var(--component-silver); }
.compatibility-result__actions { display: flex; margin-top: 20px; justify-content: center; flex-wrap: wrap; gap: 10px; }

.premium-gate { margin-top: 34px; padding: clamp(24px, 5vw, 46px); text-align: left; background: linear-gradient(135deg, rgba(143,91,211,.12), rgba(214,179,106,.08)); border: 1px solid rgba(214,179,106,.28); border-radius: 18px; }
.premium-gate h3 { font-size: clamp(1.8rem, 3.4vw, 2.8rem); }
.premium-gate > p:not(.eyebrow) { max-width: 720px; color: var(--component-silver); }
.premium-interest { display: grid; margin-top: 22px; grid-template-columns: minmax(220px,1fr) auto; align-items: end; gap: 14px; }
.premium-interest > label:first-of-type { display: grid; gap: 7px; color: var(--component-silver); font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.premium-interest__consent { display: flex; grid-column: 1 / -1; align-items: flex-start; gap: 10px; color: #929eb1; font-size: .76rem; line-height: 1.45; }
.premium-interest__consent input { flex: 0 0 auto; width: 19px; height: 19px; margin-top: 1px; accent-color: var(--component-gold); }
.premium-interest__status { min-height: 1.5em; grid-column: 1 / -1; margin: 0; color: var(--component-gold); font-size: .8rem; }
.astrolog-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }

.year-events__list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; background: var(--component-line); border: 1px solid var(--component-line); }
.year-event { display: grid; min-height: 170px; padding: clamp(22px, 4vw, 36px); grid-template-columns: auto 1fr; align-items: center; gap: 22px; background: linear-gradient(145deg, #101727, #090d18); }
.year-event__glyph { color: var(--component-gold); font-size: 3.2rem; text-shadow: 0 0 24px rgba(214,179,106,.34); }
.year-event__label { color: var(--component-gold); font-size: .68rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.year-event h3 { margin: 7px 0; font-size: clamp(1.2rem, 2.2vw, 1.65rem); }
.year-event p { margin: 0; color: var(--component-silver); font-size: .82rem; }
.year-link-list { display: flex; flex-wrap: wrap; gap: .55rem .75rem; margin-top: 1rem; }
.year-link-list a { color: var(--component-gold); font-weight: 700; }
.year-link-list span { opacity: .45; }

.month-link-list { display: grid; margin: 1.25rem 0 2rem; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; background: var(--component-line); border: 1px solid var(--component-line); }
.month-link-list a { padding: 15px 12px; color: var(--component-moon); background: #0c111f; font-size: .82rem; font-weight: 700; text-align: center; }
.month-link-list a:hover, .month-link-list a:focus-visible { color: var(--component-gold); background: #121a2c; }
.month-fullmoon__events { display: grid; gap: 1px; background: var(--component-line); border: 1px solid var(--component-line); }
.month-fullmoon__event { display: grid; min-height: 220px; padding: clamp(28px,6vw,64px); grid-template-columns: auto minmax(0,1fr); align-items: center; gap: clamp(24px,5vw,58px); overflow: hidden; background: radial-gradient(circle at 13% 50%,rgba(214,179,106,.18),transparent 17rem),linear-gradient(145deg,#121a2d,#080c17); }
.month-fullmoon__moon { color: #f4dc9e; font-family: var(--serif,Georgia,serif); font-size: clamp(5rem,14vw,10rem); line-height: .75; text-shadow: 0 0 22px rgba(214,179,106,.7),0 0 90px rgba(143,91,211,.35); }
.month-fullmoon__event h2 { margin: 8px 0; font-size: clamp(2rem,5vw,4.4rem); }
.month-fullmoon__event p:last-child { margin: 0; color: var(--component-silver); }
.month-fullmoon__reading { padding: clamp(26px,5vw,52px); background: #090d18; }
.month-fullmoon__reading h2 { font-size: clamp(1.8rem,3.4vw,2.8rem); }
.month-fullmoon__reading p { max-width: 780px; color: var(--component-silver); }
.seo-faq { margin-top: clamp(36px,7vw,72px); }
.seo-faq details { padding: 18px 0; border-top: 1px solid var(--component-line); }
.seo-faq details:last-child { border-bottom: 1px solid var(--component-line); }
.seo-faq summary { color: var(--component-moon); font-weight: 700; cursor: pointer; }
.seo-faq details p { max-width: 800px; margin: 12px 0 0; color: var(--component-silver); }
.month-navigation { display: flex; margin: 34px 0; justify-content: space-between; flex-wrap: wrap; gap: 14px; }
.month-navigation a { color: var(--component-gold); font-weight: 700; }
.calendar-return { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px; text-align: center; }
.seo-conversion { display: grid; margin-top: clamp(40px,8vw,86px); padding: clamp(28px,6vw,58px); grid-template-columns: auto minmax(0,1fr); align-items: center; gap: clamp(22px,4vw,48px); background: radial-gradient(circle at 8% 50%,rgba(143,91,211,.25),transparent 18rem),linear-gradient(135deg,#11192b,#090c17); border: 1px solid rgba(214,179,106,.28); border-radius: 24px; }
.seo-conversion > span { color: var(--component-gold); font-size: clamp(4rem,10vw,8rem); text-shadow: 0 0 34px rgba(214,179,106,.55); }
.seo-conversion h2 { margin-bottom: 8px; font-size: clamp(2rem,4.5vw,3.8rem); }
.seo-conversion p { color: var(--component-silver); }
.zodiac-date-grid { display: grid; margin: clamp(28px,6vw,58px) 0; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: var(--component-line); border: 1px solid var(--component-line); }
.zodiac-date-card { display: grid; min-height: 160px; padding: 24px; place-content: center; color: var(--component-moon); text-align: center; background: linear-gradient(145deg,#101727,#090d18); }
.zodiac-date-card > span { color: var(--component-gold); font-size: 2.8rem; text-shadow: 0 0 20px rgba(143,91,211,.38); }
.zodiac-date-card strong { margin-top: 8px; font-family: var(--serif,Georgia,serif); font-size: 1.35rem; font-weight: 400; }
.zodiac-date-card small { margin-top: 5px; color: var(--component-silver); }
.zodiac-date-card:hover, .zodiac-date-card:focus-visible { color: var(--component-gold); background: #131c30; }

@keyframes astrolog-spin { to { transform: rotate(360deg); } }
@keyframes astrolog-drift { to { transform: translate3d(4%, 2%, 0) rotate(.5deg); } }
@keyframes astrolog-time-spin { 0% { transform: rotate(0) scale(1); filter: blur(0); } 45% { transform: rotate(-230deg) scale(.84); filter: blur(.7px); } 100% { transform: rotate(-720deg) scale(1); filter: blur(0); } }
@keyframes astrolog-ring-counter { from { transform: rotate(0); } to { transform: rotate(520deg); } }
@keyframes astrolog-reveal { 0% { opacity: .15; transform: scale(.78); filter: blur(6px); } 100% { opacity: 1; transform: scale(1); filter: blur(0); } }
@keyframes astrolog-fade-up { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes astrolog-sky-arrive { 0% { opacity: .2; transform: rotate(-115deg) scale(.72); filter: blur(4px); } 72% { opacity: 1; transform: rotate(8deg) scale(1.035); filter: blur(0); } 100% { transform: rotate(0) scale(1); } }
@keyframes astrolog-sky-ring { 0% { transform: rotate(150deg); } 100% { transform: rotate(0); } }
@keyframes astrolog-planet-arrive { from { opacity: 0; } to { opacity: 1; } }

@media (max-width: 960px) {
  .portal__layout { grid-template-columns: 1fr; padding-top: 50px; text-align: center; }
  .portal__copy { margin: 0 auto; }
  .portal__lead { margin-right: auto; margin-left: auto; }
  .portal__truth, .portal__actions { justify-content: center; }
  .sky-instrument { width: min(82vw, 560px); min-width: 0; }
  .journey-form { grid-template-columns: 1fr; }
  .journey-form__intro { max-width: 720px; }
  .big-three { grid-template-columns: 1fr; }
  .big-three__card { display: grid; min-height: 0; grid-template-columns: auto 1fr; column-gap: 22px; }
  .big-three__type { grid-column: 1 / -1; }
  .big-three__glyph { margin: 16px 0 0; grid-row: 2 / 4; }
  .big-three__card h3 { margin-top: 16px; }
}

@media (max-width: 720px) {
  .portal { min-height: 760px; padding-right: 14px; padding-left: 14px; }
  .portal__copy h1 { font-size: clamp(3.1rem, 16vw, 5.4rem); }
  .sky-instrument { width: min(96vw, 480px); }
  .journey-panel { padding: 0; }
  .journey-panel__dialog {
    min-height: 100dvh;
    padding: calc(74px + env(safe-area-inset-top)) 18px calc(32px + env(safe-area-inset-bottom));
    overflow: visible;
    background: linear-gradient(155deg, #11182a 0%, #080b15 58%, #060811 100%);
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .journey-panel__close {
    position: fixed;
    top: calc(12px + env(safe-area-inset-top));
    right: 14px;
    background: #111829;
    box-shadow: 0 8px 30px rgba(0,0,0,.35);
  }
  .birth-form { padding: 20px 16px; }
  .birth-form__row { grid-template-columns: 1fr; }
  .revelation__reading, .daily-weather__split, .sky-summary__grid, .mercury-answer { grid-template-columns: 1fr; }
  .revelation__reading { gap: 18px; }
  .calculation-pass__body { grid-template-columns: 1fr; }
  .sky-summary, .daily-weather, .mercury-answer, .moon-calendar { padding: 24px 18px; border-radius: 16px; }
  .daily-weather__data { padding: 0 0 24px; border-right: 0; border-bottom: 1px solid var(--component-line); }
  .mercury-answer { text-align: center; }
  .mercury-answer__orb { margin: 0 auto; }
  .moon-events { grid-template-columns: 1fr; }
  .compatibility { padding: 26px 16px; border-radius: 18px; }
  .compatibility-form { grid-template-columns: 1fr; }
  .compatibility-form__meeting { padding: 0; transform: rotate(90deg); }
  .compatibility-form > .button { width: 100%; }
  .compatibility-meters, .compatibility-result__reading, .year-events__list { grid-template-columns: 1fr; }
  .premium-interest { grid-template-columns: 1fr; }
  .premium-interest > .button { width: 100%; }
  .year-event { min-height: 0; }
  .month-link-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .month-fullmoon__event { min-height: 0; padding: 30px 20px; grid-template-columns: 1fr; text-align: center; }
  .month-fullmoon__moon { font-size: 6.5rem; }
  .month-navigation { display: grid; grid-template-columns: 1fr; text-align: center; }
  .seo-conversion { grid-template-columns: 1fr; text-align: center; }
  .zodiac-date-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .portal::before, .portal::after, .astrolog-loading::before { animation: none !important; }
  .portal[data-state="travel"] .sky-instrument__svg,
  .portal[data-state="travel"] .sky-zodiac { animation: none !important; }
  .sky-summary.is-arriving .sky-instrument__svg,
  .sky-summary.is-arriving .sky-zodiac,
  .sky-summary.is-arriving .sky-planet { animation: none !important; }
}