.zhc-calculator {
  --zhc-bg: #030812;
  --zhc-border: rgba(56, 189, 248, 0.34);
  --zhc-text: #dbeafe;
  --zhc-muted: #93c5fd;
  --zhc-primary: #2dd4bf;
  --zhc-soft: rgba(8, 18, 34, 0.98);
  width: min(980px, 100%);
  max-width: 100%;
  margin: 24px auto;
  padding: 20px;
  background:
    radial-gradient(circle at 8% 0%, rgba(45, 212, 191, 0.14), transparent 34%),
    linear-gradient(165deg, rgba(8, 18, 34, 0.98), rgba(3, 8, 18, 0.98));
  border: 1px solid var(--zhc-border);
  border-radius: 14px;
  color: var(--zhc-text);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  box-sizing: border-box;
  overflow-x: clip;
}

.zhc-calculator,
.zhc-calculator * {
  box-sizing: border-box;
  min-width: 0;
}

.zhc-header h2 {
  margin: 0 0 8px;
  color: var(--zhc-text);
}

.zhc-header p {
  margin: 0 0 16px;
  color: var(--zhc-muted);
}

.zhc-form {
  display: grid;
  gap: 10px;
  margin-bottom: 14px;
}

.zhc-fields {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.zhc-field {
  display: grid;
  gap: 6px;
}

.zhc-field label {
  font-weight: 700;
  font-size: 0.92rem;
}

.zhc-field-note {
  margin: 1px 0 0;
  color: #c7d2fe;
  font-size: 0.88rem;
  line-height: 1.45;
}

.zhc-storage-note {
  grid-column: 1 / -1;
  margin-top: 2px;
}

.zhc-saved-chart-note {
  margin: 12px 0 0;
  padding: 10px 12px;
  border: 1px solid rgba(45, 212, 191, 0.34);
  border-radius: 10px;
  background: rgba(13, 148, 136, 0.14);
  color: #dffef8;
  font-size: 0.94rem;
  line-height: 1.5;
}

.zhc-form input[type="date"],
.zhc-form input[type="time"],
.zhc-form input[type="text"] {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.88);
  color: #ffffff;
}

.zhc-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.zhc-form button,
.zhc-sign-grid button,
.zhc-birth-chart-link {
  border: 1px solid #194ca8;
  background: linear-gradient(135deg, var(--zhc-primary), #2f5ec3);
  color: #fff !important;
  border-radius: 10px;
  cursor: pointer;
  transition: filter .2s ease, transform .2s ease;
  text-decoration: none;
  pointer-events: auto;
  position: relative;
  z-index: 1;
}

.zhc-form button,
.zhc-birth-chart-link {
  width: fit-content;
  min-width: 180px;
  padding: 10px 14px;
  font-weight: 700;
}

.zhc-clear-button {
  background: linear-gradient(135deg, #5a6c89, #44546d);
  border-color: #3f4f67;
}

.zhc-form button:hover,
.zhc-sign-grid button:hover,
.zhc-form button:focus-visible,
.zhc-sign-grid button:focus-visible,
.zhc-birth-chart-link:hover,
.zhc-birth-chart-link:focus-visible {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

.zhc-error {
  min-height: 1.2em;
  margin: 0;
  color: #b42318;
  font-weight: 600;
}

.zhc-result {
  background: var(--zhc-soft);
  border: 1px solid rgba(56, 189, 248, 0.34);
  border-left: 4px solid var(--zhc-primary);
  border-radius: 10px;
  padding: 12px;
  margin-bottom: 14px;
  overflow-wrap: break-word;
  word-break: break-word;
}

.zhc-helper-tip {
  border: 1px solid rgba(56, 189, 248, 0.34);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.58);
  padding: 8px 10px;
  margin: 0 0 10px;
}

.zhc-helper-tip__chips {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.zhc-helper-tip__chips.zhc-signal-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  align-items: stretch;
  gap: 8px;
}

.zhc-result h3 {
  margin: 0 0 8px;
}

.zhc-result p {
  margin: 6px 0;
}

.zhc-result-chips {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 10px;
}

.zhc-result-signal-summary {
  gap: 8px;
}

.zhc-result-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  border-radius: 999px;
  border: 1px solid rgba(45, 212, 191, 0.42);
  background: rgba(45, 212, 191, 0.16);
  color: #dffef8;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 3px 8px;
  min-width: 0;
  overflow-wrap: break-word;
  text-align: left;
  white-space: normal;
  word-break: normal;
}

.zhc-result-chip--label {
  background: rgba(45, 212, 191, 0.18);
  border-color: rgba(45, 212, 191, 0.50);
  color: #ffffff;
}

.zhc-result-chip--summary {
  background: rgba(2, 6, 23, 0.58);
  border-color: rgba(56, 189, 248, 0.30);
  color: #bae6fd;
  border-radius: 12px;
  flex: 1 1 230px;
  justify-content: flex-start;
  line-height: 1.42;
  padding: 7px 10px;
}

.zhc-helper-tip__chips .zhc-result-chip {
  justify-content: center;
  min-height: 36px;
  padding: 8px 10px;
}

.zhc-helper-tip__chips .zhc-result-chip--summary {
  justify-content: flex-start;
}

.zhc-signal-details {
  margin: 8px 0 0;
  border: 1px solid rgba(56, 189, 248, 0.26);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.42);
  color: #dbeafe;
}

.zhc-signal-details summary {
  cursor: pointer;
  padding: 8px 10px;
  color: #ffffff;
  font-size: 0.86rem;
  font-weight: 800;
}

.zhc-signal-details p {
  margin: 0 !important;
  padding: 0 10px 10px;
  color: #dbeafe !important;
  font-size: 0.9rem;
  line-height: 1.5;
}

.zhc-panels {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 14px;
}

.zhc-panel {
  border: 1px solid rgba(56, 189, 248, 0.34);
  border-radius: 10px;
  padding: 12px;
  background: rgba(8, 18, 34, 0.98);
}

.zhc-panel h4 {
  margin: 0 0 10px;
}

.zhc-panel p,
.zhc-panel ul {
  margin: 0 0 8px;
  overflow-wrap: break-word;
  word-break: break-word;
}

.zhc-signal-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.zhc-signal-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px 10px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  border: 1px solid transparent;
}

.zhc-signal-chip--high {
  background: rgba(52, 211, 153, 0.18);
  border-color: rgba(52, 211, 153, 0.46);
  color: #d1fae5;
}

.zhc-signal-chip--medium {
  background: rgba(250, 204, 21, 0.16);
  border-color: rgba(250, 204, 21, 0.42);
  color: #fef3c7;
}

.zhc-signal-chip--fallback {
  background: rgba(56, 189, 248, 0.14);
  border-color: rgba(56, 189, 248, 0.36);
  color: #bae6fd;
}

.zhc-signal-chip--loading {
  background: rgba(168, 85, 247, 0.16);
  border-color: rgba(168, 85, 247, 0.40);
  color: #ede9fe;
}

.zhc-signal-source {
  color: #93c5fd;
  font-size: 0.86rem;
  overflow-wrap: break-word;
  word-break: break-word;
}

.zhc-focus-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: 1fr;
  margin-top: 10px;
}

.zhc-focus-card {
  border: 1px solid rgba(56, 189, 248, 0.30);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.58);
  padding: 12px 14px;
}

.zhc-focus-card h5 {
  margin: 0 0 6px;
  font-size: 0.9rem;
  color: #ffffff;
}

.zhc-focus-card p {
  margin: 0;
  font-size: 0.86rem;
}

.zhc-panel ul {
  padding-left: 18px;
}

.zhc-next-step {
  border: 1px solid rgba(56, 189, 248, 0.36);
  border-radius: 12px;
  background:
    radial-gradient(circle at 8% 0%, rgba(45, 212, 191, 0.10), transparent 32%),
    linear-gradient(180deg, rgba(8, 18, 34, 0.98), rgba(3, 8, 18, 0.98));
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.30);
  padding: 14px;
  margin-bottom: 14px;
}

.zhc-next-step h3 {
  margin: 0 0 8px;
}

.zhc-next-step p {
  margin: 0 0 12px;
}

.zhc-note {
  color: #93c5fd;
}

.zhc-sign-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.zhc-sign-grid button {
  padding: 8px 10px;
  border-radius: 999px;
  font-weight: 700;
}

.zhc-sign-grid button.is-active {
  box-shadow: inset 0 0 0 2px #9bb8f3;
}

.zhc-birthhour-wrap {
  margin-bottom: 4px;
}

#zhc-birthhour {
  width: 100%;
}

.zhc-insight-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 6px 0 12px;
}

.zhc-transit-controls {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 0 12px;
}

.zhc-transit-controls select,
.zhc-transit-controls input[type="date"] {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.88);
  color: #ffffff;
}

.zhc-insight-tabs button {
  border: 1px solid rgba(56, 189, 248, 0.36);
  border-radius: 999px;
  background: rgba(2, 6, 23, 0.58);
  color: #dbeafe;
  font-weight: 700;
  padding: 8px 14px;
  cursor: pointer;
}

.zhc-insight-tabs button.is-active {
  border-color: #194ca8;
  background: linear-gradient(135deg, #2dd4bf, #38bdf8);
  color: #031018;
}

.zhc-interactive {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.zhc-interactive > div,
.faq {
  border: 1px solid rgba(56, 189, 248, 0.34);
  border-radius: 12px;
  background: rgba(8, 18, 34, 0.98);
  padding: 14px;
}

.zodiac-wheel-container {
  width: min(680px, 100%);
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  max-width: 100%;
  overflow: hidden;
}

.zodiac-wheel {
  position: relative;
  width: 100%;
  height: 100%;
  border: 1px solid rgba(56, 189, 248, 0.38);
  border-radius: 50%;
  background: radial-gradient(circle at center, rgba(56, 189, 248, 0.18) 0%, rgba(8, 18, 34, 0.98) 72%, rgba(3, 8, 18, 0.98) 100%);
  --wheel-radius: 220px;
}

.zodiac-wheel::before {
  content: "";
  position: absolute;
  inset: 23%;
  border-radius: 50%;
  border: 1px dashed rgba(125, 211, 252, 0.44);
  background: rgba(2, 6, 23, 0.34);
}

.zodiac-sign {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: rotate(var(--angle)) translateY(calc(var(--wheel-radius) * -1)) rotate(calc(var(--angle) * -1));
  transform-origin: center;
  width: 90px;
  margin-left: -45px;
  cursor: pointer;
  outline: none;
}

.zodiac-sign .sign-content {
  border: 1px solid rgba(56, 189, 248, 0.34);
  border-radius: 12px;
  background: rgba(8, 18, 34, 0.98);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.24);
  text-align: center;
  padding: 8px 6px;
}

.zodiac-sign .sign-symbol {
  display: block;
  color: #8eeaff;
  font-size: 1.2rem;
  line-height: 1.2;
}

.zodiac-sign .sign-name {
  display: block;
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
}

.zodiac-sign:hover .sign-content,
.zodiac-sign:focus-visible .sign-content {
  border-color: rgba(45, 212, 191, 0.72);
  transform: translateY(-1px);
}

.zodiac-sign.is-active .sign-content {
  border-color: rgba(45, 212, 191, 0.86);
  box-shadow: 0 10px 24px rgba(34, 211, 238, 0.22);
}

.astro-elements h3,
.zodiac-history h3,
.personalized-tips h3,
.feedback-section h3,
.faq h2 {
  margin-top: 0;
}

.elements-details,
.history-details {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.element,
.history-item {
  border: 1px solid rgba(56, 189, 248, 0.30);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.58);
  padding: 10px;
}

.element-symbol {
  display: inline-flex;
  min-width: 48px;
  height: 24px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(45, 212, 191, 0.42);
  border-radius: 999px;
  background: rgba(45, 212, 191, 0.16);
  color: #dffef8;
  font-size: 0.78rem;
  font-weight: 700;
}

.tips-details ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.feedback-section textarea {
  width: 100%;
  min-height: 92px;
  border: 1px solid rgba(148, 163, 184, 0.42);
  border-radius: 10px;
  padding: 10px 12px;
  margin: 8px 0 10px;
  resize: vertical;
}

.zhc-feedback-hp {
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.zhc-feedback-status {
  min-height: 1.4em;
  margin: 8px 0 0;
  color: #dffef8;
  font-size: 0.94rem;
  line-height: 1.45;
}

.zhc-feedback-status.is-error {
  color: #fecaca;
}

.feedback-section button,
.social-sharing .share-btn {
  border: 1px solid #194ca8;
  background: linear-gradient(135deg, var(--zhc-primary), #2f5ec3);
  color: #fff !important;
  border-radius: 10px;
  padding: 10px 14px;
  font-weight: 700;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 1;
}

.social-sharing {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.faq {
  margin-top: 12px;
}

.faq-item + .faq-item {
  margin-top: 10px;
}

.faq-question {
  border: 1px solid rgba(56, 189, 248, 0.30);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.58);
  padding: 10px 12px;
  font-weight: 700;
  cursor: pointer;
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.faq-answer {
  display: none;
  padding: 8px 4px 0;
}

.faq-item.active .faq-answer {
  display: block;
}

.faq-answer p {
  margin: 0;
  color: #dbeafe !important;
}

.faq h2 {
  color: #ffffff !important;
}

.faq-item {
  background: rgba(8, 18, 34, 0.98);
  border: 1px solid rgba(56, 189, 248, 0.30);
  border-radius: 10px;
  padding: 6px;
}

.faq-question:hover,
.faq-question:focus-visible {
  background: rgba(45, 212, 191, 0.14);
  border-color: rgba(45, 212, 191, 0.62);
}

.zhc-modal {
  display: none;
  position: fixed;
  inset: 0;
  align-items: center;
  justify-content: center;
  background: rgba(10, 19, 33, 0.58);
  z-index: 9999;
  padding: 14px;
}

.zhc-modal-content {
  width: min(680px, 96vw);
  max-height: 88vh;
  overflow: auto;
  border-radius: 12px;
  border: 1px solid rgba(56, 189, 248, 0.38);
  background: rgba(8, 18, 34, 0.98);
  box-shadow: 0 20px 40px rgba(8, 20, 36, 0.24);
  padding: 16px;
  position: relative;
}

.zhc-modal-close {
  position: absolute;
  right: 10px;
  top: 10px;
  border: 1px solid rgba(45, 212, 191, 0.42);
  background: rgba(2, 6, 23, 0.88);
  color: #dffef8;
  border-radius: 999px;
  width: 30px;
  height: 30px;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
}

.zhc-modal-close:hover,
.zhc-modal-close:focus-visible {
  background: rgba(45, 212, 191, 0.18);
}

@media (max-width: 980px) {
  .zhc-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .zhc-panels {
    grid-template-columns: 1fr;
  }

  .zhc-sign-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .zodiac-wheel {
    --wheel-radius: 180px;
  }
}

@media (max-width: 700px) {
  .zhc-calculator {
    margin: 12px auto;
    padding: 14px;
  }

  .zhc-fields,
  .zhc-sign-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .zhc-transit-controls {
    grid-template-columns: 1fr;
  }

  .zhc-focus-grid {
    grid-template-columns: 1fr;
  }

  .elements-details,
  .history-details {
    grid-template-columns: 1fr;
  }

  .zodiac-wheel {
    --wheel-radius: 145px;
  }

  .zodiac-sign {
    width: 76px;
    margin-left: -38px;
  }

  .zodiac-sign .sign-name {
    font-size: 0.72rem;
  }
}

@media (max-width: 480px) {
  .zhc-form button,
  .zhc-birth-chart-link,
  .social-sharing .share-btn,
  .zhc-insight-tabs button {
    width: 100%;
    min-width: 0;
  }

  .zhc-fields,
  .zhc-sign-grid {
    grid-template-columns: 1fr;
  }

  .zodiac-wheel {
    --wheel-radius: 116px;
  }

  .zodiac-sign {
    width: 64px;
    margin-left: -32px;
  }

  .zodiac-sign .sign-content {
    padding: 6px 4px;
  }

  .zodiac-sign .sign-symbol {
    font-size: 1rem;
  }

  .zodiac-sign .sign-name {
    font-size: 0.66rem;
  }

  .zhc-result-chip {
    font-size: 0.68rem;
    padding: 2px 7px;
  }

}

.zhc-account-save {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #c9d9f6;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
  box-shadow: 0 10px 24px rgba(24, 60, 120, 0.08);
}

.zhc-save-panel {
  margin: 0 0 16px;
}

.zhc-account-save h4 {
  margin: 0 0 8px;
  color: #ffffff !important;
  font-size: 1.08rem;
}

.zhc-account-save p {
  margin: 0 0 10px;
  color: #dbeafe !important;
}

.zhc-save-details-choice {
  display: flex !important;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 12px;
  color: #dbeafe !important;
  font-size: 0.94rem;
  line-height: 1.45;
}

.zhc-save-details-choice input {
  flex: 0 0 auto;
  margin-top: 0.22em;
}

.zhc-account-save button,
.zhc-account-save .zhc-birth-chart-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 13px;
  border: 1px solid rgba(45, 212, 191, 0.72);
  border-radius: 10px;
  background: linear-gradient(135deg, #2dd4bf, #38bdf8);
  color: #031018 !important;
  font-weight: 800;
  text-decoration: none;
}

#zhc-save-status {
  margin-top: 10px !important;
  font-weight: 700;
}

/* SSA dark-neon final alignment for horoscope results. */
.zhc-calculator,
.horoscope-calculator {
  color-scheme: dark;
  color: #dbeafe !important;
}

.zhc-calculator :is(
  .zhc-panel,
  .zhc-card,
  .zhc-result,
  .zhc-result-chip,
  .zhc-transit-controls,
  .zhc-focus-card,
  .zhc-sign-grid,
  .zhc-sign-card,
  .zodiac-sign .sign-content,
  .interactive-sections,
  .personalized-tips,
  .astro-elements,
  .element,
  .zodiac-history,
  .history-item,
  .zhc-account-save,
  .zhc-modal-content,
  .zodiac-wheel
) {
  background:
    radial-gradient(circle at 8% 0%, rgba(45, 212, 191, 0.10), transparent 32%),
    linear-gradient(180deg, rgba(8, 18, 34, 0.98), rgba(3, 8, 18, 0.98)) !important;
  border-color: rgba(56, 189, 248, 0.38) !important;
  color: #dbeafe !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

.zhc-calculator :is(p, li, span, small, em, div, label, legend, summary, td, th),
.zhc-account-save p {
  color: #dbeafe !important;
}

.zhc-calculator :is(h1, h2, h3, h4, h5, h6, strong, b, .sign-name, .sign-symbol),
.zhc-account-save h4 {
  color: #ffffff !important;
  text-shadow: 0 0 16px rgba(56, 189, 248, 0.24);
}

.zhc-calculator :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) {
  background: rgba(2, 6, 23, 0.88) !important;
  border-color: rgba(148, 163, 184, 0.42) !important;
  color: #ffffff !important;
}

.zhc-calculator :is(button, .button, .btn, .wp-element-button, .share-btn, .zhc-birth-chart-link),
.zhc-account-save :is(button, .zhc-birth-chart-link) {
  background: linear-gradient(135deg, #2dd4bf, #38bdf8) !important;
  border: 1px solid rgba(45, 212, 191, 0.72) !important;
  color: #031018 !important;
  box-shadow: 0 12px 28px rgba(34, 211, 238, 0.22) !important;
  text-decoration: none !important;
}

.zhc-calculator :is(button:disabled, .button:disabled, .btn:disabled) {
  background: rgba(30, 41, 59, 0.92) !important;
  border-color: rgba(148, 163, 184, 0.36) !important;
  color: #94a3b8 !important;
  box-shadow: none !important;
}

.zhc-result-chip--label,
.zhc-signal-chip--high,
.zhc-signal-chip--medium,
.zhc-signal-chip--low {
  background: rgba(45, 212, 191, 0.16) !important;
  border-color: rgba(45, 212, 191, 0.42) !important;
  color: #dffef8 !important;
}

.zhc-modal {
  background: rgba(2, 6, 23, 0.78) !important;
}

.zhc-pathway,
.zhc-interpretation-guide,
.zhc-companion,
.zhc-calculator .ssa-aie-block {
  margin: 18px 0;
  padding: clamp(16px, 3vw, 24px);
  border: 1px solid rgba(56, 189, 248, 0.36);
  border-radius: 16px;
  background:
    radial-gradient(circle at 12% 0%, rgba(45, 212, 191, 0.12), transparent 34%),
    linear-gradient(180deg, rgba(8, 18, 34, 0.98), rgba(3, 8, 18, 0.98));
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  color: #dbeafe;
}

.zhc-pathway h3,
.zhc-interpretation-guide h3,
.zhc-companion h3,
.zhc-calculator .ssa-aie-block h3 {
  margin-top: 0;
  color: #ffffff !important;
}

.zhc-pathway-grid,
.zhc-companion-grid,
.zhc-calculator .ssa-aie-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.zhc-path-card,
.zhc-companion-card,
.zhc-calculator .ssa-aie-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 100%;
  padding: 14px;
  border: 1px solid rgba(45, 212, 191, 0.30);
  border-radius: 12px;
  background: rgba(2, 6, 23, 0.46) !important;
  color: #dbeafe !important;
  text-decoration: none;
}

.zhc-path-card strong,
.zhc-companion-card strong,
.zhc-calculator .ssa-aie-card :is(h4, strong) {
  color: #ffffff !important;
}

.zhc-path-card span,
.zhc-companion-card span,
.zhc-calculator .ssa-aie-card :is(p, span, div) {
  color: #bae6fd !important;
}

.zhc-companion-card:hover,
.zhc-companion-card:focus-visible,
.zhc-calculator .ssa-aie-card:hover {
  border-color: rgba(45, 212, 191, 0.78);
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(34, 211, 238, 0.16);
}

.zhc-calculator .ssa-aie-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 40px;
  padding: 9px 13px;
  border: 1px solid rgba(45, 212, 191, 0.72) !important;
  border-radius: 999px;
  background: linear-gradient(135deg, #2dd4bf, #38bdf8) !important;
  color: #031018 !important;
  font-weight: 800;
  text-decoration: none;
}

.zhc-calculator a:not(.button):not(.btn):not(.wp-element-button):not(.zhc-birth-chart-link) {
  color: #8eeaff !important;
}

.zhc-calculator :is(#results, [id*="result"], [id*="Result"], [class*="result"], [class*="results"], [class*="card"], [class*="panel"], table, thead, tbody, tr, td, th, [aria-live="polite"]) {
  background:
    radial-gradient(circle at 8% 0%, rgba(45, 212, 191, 0.10), transparent 32%),
    linear-gradient(180deg, rgba(8, 18, 34, 0.98), rgba(3, 8, 18, 0.98)) !important;
  border-color: rgba(56, 189, 248, 0.38) !important;
  color: #dbeafe !important;
}

@media (max-width: 640px) {
  .zhc-calculator {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 12px !important;
    overflow-x: hidden !important;
  }

  .zhc-calculator :where(*) {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-wrap: break-word !important;
    white-space: normal !important;
  }

  .zhc-calculator :where(.grid, .zhc-pathway-grid, .zhc-companion-grid, .ssa-aie-grid, [class*="-grid"], [class*="__grid"], [class*="-actions"], [class*="-cards"]) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
/* SSA dark-neon hard stop for legacy pale zodiac widgets. */
body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) {
  --ssa-neon-bg: #050b12;
  --ssa-neon-surface: rgba(5, 14, 24, 0.98);
  --ssa-neon-surface-2: rgba(8, 26, 40, 0.96);
  --ssa-neon-border: rgba(45, 211, 218, 0.56);
  --ssa-neon-text: #f4fbff;
  --ssa-neon-muted: #cfefff;
  --ssa-neon-accent: #2ed3da;
  background: linear-gradient(135deg, var(--ssa-neon-bg), #061927) !important;
  border-color: var(--ssa-neon-border) !important;
  color: var(--ssa-neon-text) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(section, article, aside, fieldset, details, summary, table, thead, tbody, tfoot, tr, td, th, label, legend, [aria-live], [role="tabpanel"], [role="group"], [class*="card"], [class*="Card"], [class*="panel"], [class*="Panel"], [class*="box"], [class*="Box"], [class*="tile"], [class*="Tile"], [class*="widget"], [class*="Widget"], [class*="result"], [class*="Result"], [class*="summary"], [class*="Summary"], [class*="output"], [class*="Output"], [class*="metric"], [class*="Metric"], [class*="stat"], [class*="Stat"], [class*="notice"], [class*="Notice"], [class*="warning"], [class*="Warning"], [class*="callout"], [class*="Callout"], [class*="option"], [class*="Option"], [class*="question"], [class*="Question"], [class*="field"], [class*="Field"], [class*="group"], [class*="Group"], [class*="item"], [class*="Item"], [class*="row"], [class*="Row"], [class*="form"], [class*="Form"], [class*="input"], [class*="Input"], [class*="history"], [class*="History"], [class*="dashboard"], [class*="Dashboard"], [class*="profile"], [class*="Profile"], [class*="prompt"], [class*="Prompt"], [class*="intro"], [class*="Intro"], [class*="body"], [class*="Body"]) {
  background: linear-gradient(135deg, var(--ssa-neon-surface), var(--ssa-neon-surface-2)) !important;
  border-color: var(--ssa-neon-border) !important;
  box-shadow: 0 0 0 1px rgba(45, 211, 218, 0.16), 0 18px 44px rgba(0, 0, 0, 0.34) !important;
  color: var(--ssa-neon-text) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) {
  background: rgba(3, 10, 18, 0.98) !important;
  border-color: var(--ssa-neon-border) !important;
  color: var(--ssa-neon-text) !important;
  -webkit-text-fill-color: var(--ssa-neon-text) !important;
  box-shadow: inset 0 0 0 1px rgba(45, 211, 218, 0.14) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--ssa-neon-accent) !important;
  background-color: rgba(3, 10, 18, 0.98) !important;
  border-color: var(--ssa-neon-border) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) input::placeholder,
body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) {
  --ssa-neon-bg: #050b12;
  --ssa-neon-surface: rgba(5, 14, 24, 0.98);
  --ssa-neon-surface-2: rgba(8, 26, 40, 0.96);
  --ssa-neon-border: rgba(45, 211, 218, 0.56);
  --ssa-neon-text: #f4fbff;
  --ssa-neon-muted: #cfefff;
  --ssa-neon-accent: #2ed3da;
  background: linear-gradient(135deg, var(--ssa-neon-bg), #061927) !important;
  border-color: var(--ssa-neon-border) !important;
  color: var(--ssa-neon-text) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(section, article, aside, fieldset, details, summary, table, thead, tbody, tfoot, tr, td, th, label, legend, [aria-live], [role="tabpanel"], [role="group"], [class*="card"], [class*="Card"], [class*="panel"], [class*="Panel"], [class*="box"], [class*="Box"], [class*="tile"], [class*="Tile"], [class*="widget"], [class*="Widget"], [class*="result"], [class*="Result"], [class*="summary"], [class*="Summary"], [class*="output"], [class*="Output"], [class*="metric"], [class*="Metric"], [class*="stat"], [class*="Stat"], [class*="notice"], [class*="Notice"], [class*="warning"], [class*="Warning"], [class*="callout"], [class*="Callout"], [class*="option"], [class*="Option"], [class*="question"], [class*="Question"], [class*="field"], [class*="Field"], [class*="group"], [class*="Group"], [class*="item"], [class*="Item"], [class*="row"], [class*="Row"], [class*="form"], [class*="Form"], [class*="input"], [class*="Input"], [class*="history"], [class*="History"], [class*="dashboard"], [class*="Dashboard"], [class*="profile"], [class*="Profile"], [class*="prompt"], [class*="Prompt"], [class*="intro"], [class*="Intro"], [class*="body"], [class*="Body"]) {
  background: linear-gradient(135deg, var(--ssa-neon-surface), var(--ssa-neon-surface-2)) !important;
  border-color: var(--ssa-neon-border) !important;
  box-shadow: 0 0 0 1px rgba(45, 211, 218, 0.16), 0 18px 44px rgba(0, 0, 0, 0.34) !important;
  color: var(--ssa-neon-text) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) {
  background: rgba(3, 10, 18, 0.98) !important;
  border-color: var(--ssa-neon-border) !important;
  color: var(--ssa-neon-text) !important;
  -webkit-text-fill-color: var(--ssa-neon-text) !important;
  box-shadow: inset 0 0 0 1px rgba(45, 211, 218, 0.14) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: var(--ssa-neon-accent) !important;
  background-color: rgba(3, 10, 18, 0.98) !important;
  border-color: var(--ssa-neon-border) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) textarea::placeholder {
  color: rgba(207, 239, 255, 0.72) !important;
  -webkit-text-fill-color: rgba(207, 239, 255, 0.72) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(button:not(.mf-danger-button), .button:not(.mf-danger-button), .btn:not(.mf-danger-button), [role="button"]:not(.mf-danger-button), input[type="button"], input[type="submit"], input[type="reset"], a.button, a.btn, [class*="-btn"]:not(.mf-danger-button), [class*="-button"]:not(.mf-danger-button), [class*="Button"]:not(.mf-danger-button)) {
  background: linear-gradient(135deg, #33f7ff, #21c6d3 55%, #1498ff) !important;
  border-color: rgba(84, 245, 255, 0.82) !important;
  color: #021018 !important;
  -webkit-text-fill-color: #021018 !important;
  box-shadow: 0 0 18px rgba(45, 211, 218, 0.28), 0 12px 28px rgba(0, 0, 0, 0.32) !important;
  text-shadow: none !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) :is(h1, h2, h3, h4, h5, h6, p, li, label, span, small, strong, b, em, legend, summary, td, th, output, div) {
  color: var(--ssa-neon-text) !important;
}

body :is(
  #zodiac-page-shell#zodiac-page-shell,
  .zhc-calculator.zhc-calculator,
  [class^="zhc-"][class^="zhc-"],
  [class*=" zhc-"][class*=" zhc-"]
) a:not(.button):not(.btn) {
  color: #7ff7ff !important;
}

/* Keep chart-signal badges readable after the broad dark-neon hard-stop rules. */
.zhc-calculator .zhc-helper-tip__chips.zhc-signal-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)) !important;
  align-items: stretch !important;
  gap: 8px !important;
}

.zhc-calculator .zhc-result-chips.zhc-result-signal-summary {
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.zhc-calculator .zhc-result-chip {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-wrap: break-word !important;
  white-space: normal !important;
  word-break: normal !important;
  box-shadow: none !important;
  text-align: left !important;
}

.zhc-calculator .zhc-result-chip--label {
  flex: 0 0 auto !important;
  justify-content: center !important;
  background: rgba(45, 212, 191, 0.18) !important;
  border-color: rgba(45, 212, 191, 0.50) !important;
  color: #ffffff !important;
}

.zhc-calculator .zhc-result-chip--summary {
  flex: 1 1 230px !important;
  justify-content: flex-start !important;
  border-radius: 12px !important;
  background: rgba(2, 6, 23, 0.58) !important;
  border-color: rgba(56, 189, 248, 0.30) !important;
  color: #bae6fd !important;
  line-height: 1.42 !important;
  padding: 7px 10px !important;
}

.zhc-calculator .zhc-helper-tip__chips .zhc-result-chip {
  min-height: 36px !important;
  padding: 8px 10px !important;
}

.zhc-calculator .zhc-signal-chip--high {
  background: rgba(52, 211, 153, 0.18) !important;
  border-color: rgba(52, 211, 153, 0.46) !important;
  color: #d1fae5 !important;
}

.zhc-calculator .zhc-signal-chip--medium {
  background: rgba(250, 204, 21, 0.16) !important;
  border-color: rgba(250, 204, 21, 0.42) !important;
  color: #fef3c7 !important;
}

.zhc-calculator .zhc-signal-chip--fallback {
  background: rgba(56, 189, 248, 0.14) !important;
  border-color: rgba(56, 189, 248, 0.36) !important;
  color: #bae6fd !important;
}

.zhc-calculator .zhc-signal-chip--loading {
  background: rgba(168, 85, 247, 0.16) !important;
  border-color: rgba(168, 85, 247, 0.40) !important;
  color: #ede9fe !important;
}

.zhc-calculator .zhc-signal-details {
  margin: 8px 0 0 !important;
  border: 1px solid rgba(56, 189, 248, 0.26) !important;
  border-radius: 10px !important;
  background: rgba(2, 6, 23, 0.42) !important;
  box-shadow: none !important;
  color: #dbeafe !important;
}

.zhc-calculator .zhc-signal-details summary {
  display: list-item !important;
  padding: 8px 10px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
  cursor: pointer !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
}

.zhc-calculator .zhc-signal-details p {
  margin: 0 !important;
  padding: 0 10px 10px !important;
  color: #dbeafe !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}

.zhc-calculator .zhc-source-map,
.zhc-calculator .zhc-share-card {
  display: grid !important;
  gap: 8px !important;
  margin: 10px 0 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(56, 189, 248, 0.30) !important;
  border-radius: 10px !important;
  background: rgba(2, 6, 23, 0.50) !important;
  box-shadow: none !important;
}

.zhc-calculator .zhc-source-map__row {
  display: grid !important;
  gap: 4px !important;
  grid-template-columns: minmax(90px, 0.28fr) minmax(0, 1fr) !important;
  align-items: start !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.zhc-calculator .zhc-source-map__row strong,
.zhc-calculator .zhc-share-card strong {
  color: #ffffff !important;
}

.zhc-calculator .zhc-source-map__row span,
.zhc-calculator .zhc-share-card p {
  margin: 0 !important;
  color: #dbeafe !important;
  line-height: 1.45 !important;
}

.zhc-calculator .zhc-copy-share {
  width: fit-content !important;
  min-width: 140px !important;
}

@media (max-width: 700px) {
  .zhc-calculator .zhc-source-map__row {
    grid-template-columns: 1fr !important;
  }
}

/* Final public-result layout guard. Keep source context and personalized
   career/relationship/well-being guidance readable as user-facing cards. */
body .zhc-calculator.zhc-calculator .zhc-source-map {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 12px !important;
}

body .zhc-calculator.zhc-calculator .zhc-source-map__row {
  display: grid !important;
  grid-template-columns: minmax(120px, 0.28fr) minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body .zhc-calculator.zhc-calculator .zhc-source-map__row strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 900 !important;
}

body .zhc-calculator.zhc-calculator .zhc-source-map__row span {
  color: #dbeafe !important;
  -webkit-text-fill-color: #dbeafe !important;
  line-height: 1.45 !important;
}

body .zhc-calculator.zhc-calculator .zhc-focus-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 14px 0 0 !important;
}

body .zhc-calculator.zhc-calculator .zhc-focus-card {
  display: grid !important;
  gap: 8px !important;
  align-content: start !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 14px !important;
  border: 1px solid rgba(56, 189, 248, 0.34) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(45, 212, 191, 0.10), transparent 32%),
    rgba(2, 6, 23, 0.62) !important;
  box-shadow: none !important;
}

body .zhc-calculator.zhc-calculator .zhc-focus-card h5 {
  margin: 0 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 0.96rem !important;
  line-height: 1.25 !important;
}

body .zhc-calculator.zhc-calculator .zhc-focus-card p {
  margin: 0 !important;
  color: #dbeafe !important;
  -webkit-text-fill-color: #dbeafe !important;
  font-size: 0.92rem !important;
  line-height: 1.52 !important;
}

@media (max-width: 900px) {
  body .zhc-calculator.zhc-calculator .zhc-focus-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 700px) {
  body .zhc-calculator.zhc-calculator .zhc-source-map__row {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}