/* Continue each entrance illustration into its public destination. */
body.personal-entry, body.zodiac-gallery, body.horoscope-reading { isolation: isolate; background: var(--app-canvas); }
body.personal-entry::before, body.zodiac-gallery::before, body.horoscope-reading::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-size: cover; background-position: center top; background-repeat: no-repeat;
}
body.personal-entry::before {
  background-image: linear-gradient(90deg, color-mix(in srgb, var(--app-canvas) 78%, transparent), color-mix(in srgb, var(--app-canvas) 62%, transparent)), url("/artwork/welcome-personal-v1.webp");
}
body.zodiac-gallery::before, body.horoscope-reading::before {
  background-image: linear-gradient(color-mix(in srgb, var(--app-canvas) 78%, transparent), color-mix(in srgb, var(--app-canvas) 92%, transparent)), url("/artwork/welcome-zodiac-v1.webp");
}
.personal-entry .sky-map, .zodiac-gallery .sky-map, .horoscope-reading .sky-map { display: none; }
.personal-entry .app-main { max-width: 560px; }
.personal-entry .entry-page { padding: 28px; background: color-mix(in srgb, var(--app-canvas) 88%, transparent); border-radius: var(--app-radius); }
.personal-entry .entry-heading p { color: var(--app-secondary); font-size: var(--reading-body-size); }
body.zodiac-gallery .app-main { max-width: 1100px; padding-bottom: 64px; }
.zodiac-gallery .page-heading { margin-bottom: 36px; }
.zodiac-gallery .page-heading p { font-size: var(--reading-body-size); }
.zodiac-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.zodiac-grid .zodiac-card { isolation: isolate; overflow: hidden; display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 24px; color: var(--app-text); text-decoration: none; background: var(--app-surface); border-radius: var(--app-radius); }
.zodiac-card-scenery { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; object-position: 65% top; opacity: .36; mask-image: linear-gradient(black, transparent 94%); pointer-events: none; }
.zodiac-card:nth-child(3n + 2) .zodiac-card-scenery { object-position: 35% top; }
.zodiac-card:nth-child(3n) .zodiac-card-scenery { object-position: right top; }
.zodiac-card-art { display: block; width: 100%; max-width: 240px; height: auto; aspect-ratio: 1; object-fit: contain; }
.zodiac-card-caption { width: 100%; margin-top: 12px; padding-right: 20px; }
.zodiac-card h2 { margin: 0 0 8px; font: 400 var(--reading-title-size)/1.2 var(--font-display); color: var(--app-text); }
.zodiac-card p { margin: 0; font: 400 var(--reading-body-size)/1.5 var(--font-body); color: var(--app-muted); }
.zodiac-card-arrow { position: absolute; right: 24px; bottom: 42px; color: var(--app-gold); }
.zodiac-card-arrow .nav-svg { width: 20px; height: 20px; }
@media (max-width: 700px) {
  body.personal-entry::before, body.zodiac-gallery::before, body.horoscope-reading::before { bottom: auto; height: 100lvh; background-position: 65% top; }
  .personal-entry .entry-page { padding: 20px 16px; }
  .personal-entry .app-main { padding-inline: 16px; }
  .zodiac-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .zodiac-grid .zodiac-card { padding: 16px; }
  .zodiac-card h2 { font-size: var(--reading-section-size); }
  .zodiac-card-caption { padding-right: 0; }
  .zodiac-card-arrow { display: none; }
}
@media (max-width: 359px) { .zodiac-grid { grid-template-columns: minmax(0, 1fr); } }

/* A single public wordmark; compact app navigation uses the same brand partial. */
.screen-public .entry-brand-image, .welcome-brand .entry-brand-image { width: 240px; max-width: 100%; margin: 8px auto 28px; }
@media (max-width: 700px) { .screen-public .entry-brand-image, .welcome-brand .entry-brand-image { width: 210px; } }