/* ================================================================
   PERSONAL DESTINY MATRIX — Premium SaaS UI v2.3
   Chart geometry untouched — layout & interaction only
   ================================================================ */

/* Fonts load via <link> / wp_enqueue_style. Do not @import — it delays this file. */

.dm-embed {
  /* Typefaces */
  --dm-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --dm-font-display: 'Fraunces', 'Iowan Old Style', Georgia, 'Times New Roman', serif;

  /* Radius */
  --dm-radius-xl: 22px;
  --dm-radius-lg: 16px;
  --dm-radius-md: 12px;
  --dm-radius-sm: 8px;
  --dm-radius-pill: 999px;

  /* Motion */
  --dm-transition: 250ms cubic-bezier(0.4, 0, 0.2, 1);

  /* Spacing scale */
  --dm-space-1: 4px;
  --dm-space-2: 8px;
  --dm-space-3: 12px;
  --dm-space-4: 16px;
  --dm-space-5: 20px;
  --dm-space-6: 24px;
  --dm-space-7: 32px;
  --dm-space-8: 40px;

  /* Overview typography */
  --dm-overview-title: 1.0625rem;
  --dm-overview-subtitle: 0.6875rem;
  --dm-overview-body: 0.8125rem;
  --dm-overview-leading: 1.75;
  --dm-overview-card-min: 0;

  /* Shadows */
  --dm-shadow-sm: 0 2px 12px rgba(0, 0, 0, 0.22), 0 1px 2px rgba(0, 0, 0, 0.12);
  --dm-shadow-md: 0 8px 28px rgba(0, 0, 0, 0.28), 0 2px 6px rgba(0, 0, 0, 0.14);
  --dm-shadow-lg: 0 16px 44px rgba(0, 0, 0, 0.34), 0 4px 12px rgba(0, 0, 0, 0.16);
  --dm-glow-soft: 0 0 20px rgba(154, 122, 46, 0.14);
  --dm-glow-hover: 0 0 28px rgba(154, 122, 46, 0.22);

  /* Colors */
  --dm-accent: #C9A84C;
  --dm-accent-deep: #A8892E;
  --dm-surface: rgba(255, 255, 255, 0.03);
  --dm-surface-hover: rgba(255, 255, 255, 0.05);
  --dm-border: rgba(255, 255, 255, 0.08);
  --dm-border-hover: rgba(201, 168, 76, 0.28);

  /* Form-aligned design system (mirrors dm-premium.css so the sidebar
     and the calculator form read as one cohesive component) */
  --dm-card-surface: #100a1d;
  --dm-card-border: rgba(255, 255, 255, 0.06);
  --dm-card-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.03),
    0 24px 60px -32px rgba(0, 0, 0, 0.75);
  --dm-field-surface: rgba(255, 255, 255, 0.025);
  --dm-field-surface-hover: rgba(255, 255, 255, 0.045);
  --dm-field-border: rgba(201, 168, 76, 0.35);
  --dm-field-border-hover: rgba(201, 168, 76, 0.6);
  --dm-accent-gold: #C9A84C;
  --dm-accent-gold-hi: #E0C06A;
  /* Legacy aliases — concrete values so themes/cache never keep pink */
  --dm-accent-pink: #C9A84C;
  --dm-accent-pink-hi: #E0C06A;
  --dm-radius-field: 14px;
  --dm-sidebar-width: 420px;
  --dm-chart-aspect: 680 / 600;
  --dm-chart-size: min(826px, 100%);
  --dm-mobile-section-gap: clamp(16px, 4vw, 28px);
  --dm-mobile-gutter: 8px;
  --dm-mobile-chart-max: min(70dvh, 640px);
  --dm-mobile-touch-min: 48px;
  --dm-text-primary: rgba(255, 255, 255, 0.92);
  --dm-text-secondary: rgba(255, 255, 255, 0.58);
  --dm-text-muted: rgba(255, 255, 255, 0.42);

  /* Accordion — 2026 premium report system */
  --dm-acc-radius: 14px;
  --dm-acc-radius-sm: 8px;
  --dm-acc-duration: 360ms;
  --dm-acc-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dm-acc-surface: rgba(255, 255, 255, 0.028);
  --dm-acc-surface-hover: rgba(255, 255, 255, 0.042);
  --dm-acc-surface-active: rgba(224, 192, 106, 0.06);
  --dm-acc-ring: rgba(255, 255, 255, 0.07);
  --dm-acc-ring-hover: rgba(224, 192, 106, 0.24);
  --dm-acc-ring-active: rgba(224, 192, 106, 0.38);
  --dm-acc-shadow: 0 1px 2px rgba(0, 0, 0, 0.18), 0 8px 24px rgba(0, 0, 0, 0.14);
  --dm-acc-shadow-hover: 0 2px 4px rgba(0, 0, 0, 0.2), 0 12px 32px rgba(0, 0, 0, 0.18);
  --dm-acc-shadow-active: 0 0 0 1px rgba(224, 192, 106, 0.12), 0 0 32px rgba(201, 168, 76, 0.1), 0 16px 40px rgba(0, 0, 0, 0.22);

  /* Typography */
  --dm-text-xs: 0.72rem;
  --dm-text-sm: 0.8rem;
  --dm-text-base: 0.875rem;
  --dm-text-md: 1rem;
  --dm-text-lg: 1.125rem;
  --dm-leading: 1.75;
  --dm-leading-tight: 1.4;
}

/* Chart stage — fully collapsed until JS reveals it after a successful generate */
.dm-embed > .show-charts {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  height: auto;
  min-height: 0;
}

.dm-embed > .show-charts.display-none {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden;
}

.dm-embed > .show-charts:not(.display-none) {
  margin-top: 1.5rem;
}

/* Empty state: keep Physical & Energy Body chart table design visible,
   but hide numeric values until calculation succeeds. */
.show-charts.is-empty .dm-sidebar,
.show-charts.is-empty .dm-full-report {
  display: none !important;
}

.show-charts.is-empty .dm-health-map__sub,
.show-charts.is-empty .dm-health-map__howto,
.show-charts.is-empty .dm-health-map__footnote,
.show-charts.is-empty .dm-health-organs {
  display: none !important;
}

.show-charts.is-empty .dm-health-table td,
.show-charts.is-empty .dm-health-table tfoot td {
  color: transparent !important;
  text-shadow: none !important;
  user-select: none;
}

.dm-advanced-profile-mount {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.dm-advanced-profile-mount__placeholder {
  margin-top: clamp(20px, 3vw, 36px);
  padding: clamp(18px, 3vw, 28px);
  border-radius: 18px;
  border: 1px dashed rgba(224, 192, 106, 0.28);
  background: rgba(255, 255, 255, 0.02);
}

.dm-advanced-profile-mount__eyebrow {
  margin: 0 0 6px;
  font: 700 0.68rem/1.3 var(--dm-font-body, 'Inter', sans-serif);
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--dm-accent-pink-hi, #E0C06A);
}

.dm-advanced-profile-mount__title {
  margin: 0 0 8px;
  font: 700 clamp(1.2rem, 2.4vw, 1.6rem)/1.2 var(--dm-font-body, 'Inter', sans-serif);
  letter-spacing: -0.03em;
  color: rgba(255, 255, 255, 0.96);
}

.dm-advanced-profile-mount__lead {
  margin: 0;
  color: rgba(245, 242, 250, 0.68);
  font-size: 0.9rem;
  line-height: 1.55;
}

.dm-advanced-profile-mount.is-ready .dm-advanced-profile-mount__placeholder {
  display: none;
}

.show-charts.is-ready .dm-unlock {
  display: none !important;
}

/* Beat any theme / overflow side-effects that keep the report hidden after calculate. */
.show-charts.is-ready .dm-sidebar.dm-signal-stack {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.show-charts.is-ready .dm-advanced-profile {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.show-charts.is-empty .dm-report-header__label {
  opacity: 0.75;
}

.dm-unlock {
  padding: clamp(20px, 3vw, 30px);
  text-align: center;
  border-radius: var(--dm-radius-xl);
  border: 1px solid rgba(224, 192, 106, 0.24);
  background:
    radial-gradient(520px 200px at 50% 0%, rgba(201, 168, 76, 0.14), transparent 70%),
    rgba(255, 255, 255, 0.022);
  box-shadow: var(--dm-shadow-md);
}

.dm-unlock__eyebrow {
  margin: 0 0 8px;
  font: 700 0.7rem/1.3 var(--dm-font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dm-accent-pink-hi, #E0C06A);
}

.dm-unlock__title {
  margin: 0 0 10px;
  font: 600 clamp(1.2rem, 2.6vw, 1.6rem)/1.25 var(--dm-font-display);
  letter-spacing: -0.02em;
  color: #FFF8EC;
}

.dm-unlock__text {
  margin: 0 auto 20px;
  max-width: 62ch;
  font-family: var(--dm-font-body);
  font-size: 0.97rem;
  line-height: 1.7;
  color: rgba(245, 242, 250, 0.72);
}

.dm-unlock__cta {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 26px;
  border: none;
  border-radius: var(--dm-radius-pill);
  cursor: pointer;
  font: 600 0.95rem/1 var(--dm-font-body);
  color: #1A1408;
  background: var(--dm-accent-pink, #C9A84C);
  box-shadow: 0 8px 24px rgba(201, 168, 76, 0.28);
  transition: background var(--dm-transition), transform var(--dm-transition), box-shadow var(--dm-transition);
}

.dm-unlock__cta:hover {
  background: var(--dm-accent-pink-hi, #E0C06A);
  transform: translateY(-1px);
  box-shadow: 0 12px 30px rgba(201, 168, 76, 0.36);
}

.dm-unlock__cta:active {
  transform: translateY(0);
}

.dm-unlock__cta:focus-visible {
  outline: 2px solid #E0C06A;
  outline-offset: 3px;
}

.dm-embed {
  overflow-x: visible;
  max-width: 100%;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.dm-embed *,
.dm-embed *::before,
.dm-embed *::after {
  box-sizing: border-box;
}

/* Embed compatibility when the chart sits inside a CMS theme */
.entry-content .dm-embed,
.wp-block-group .dm-embed,
.wp-block-column .dm-embed,
.elementor-widget-shortcode .dm-embed,
.ast-container .dm-embed,
.generate-columns-container .dm-embed,
.is-layout-constrained > .dm-embed,
.kb-row-layout-wrap .dm-embed,
.kadence-conversion-wrap .dm-embed {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-left: 0;
  margin-right: 0;
}

.dm-embed .matrix-container,
.dm-embed .matrix-container.personal-redesign,
.dm-embed .personal-matrix-page {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

/* ── Page wrapper — flows inside theme content ── */
.personal-matrix-page {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  font-family: 'Inter', 'Lato', sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

/* ── Advanced 22-Code Profile ─────────────────────────────────── */
/* Match .dm-signal-stack (“Your Detailed Report”) width + inset exactly. */
.dm-advanced-profile {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  flex: 0 0 auto;
  margin-top: 8px;
  margin-left: 0;
  margin-right: 0;
  padding: clamp(16px, 2.5vw, 28px);
  border: 1px solid rgba(224, 192, 106, 0.18);
  border-radius: 22px;
  color: var(--dm-text-primary);
  background:
    radial-gradient(600px 260px at 0 0, rgba(201, 168, 76, 0.12), transparent 68%),
    linear-gradient(145deg, rgba(21, 13, 37, 0.98), rgba(8, 5, 17, 0.98));
  box-shadow: var(--dm-shadow-lg);
  clear: both;
}

.dm-advanced-profile__header {
  max-width: 680px;
  margin-bottom: 14px;
}

.dm-advanced-profile__eyebrow,
.dm-advanced__core > span,
.dm-advanced__motifs > span,
.dm-advanced__practice > span {
  margin: 0 0 6px;
  font: 700 0.68rem/1.3 'Inter', sans-serif;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--dm-accent-pink-hi);
}

.dm-advanced-profile h2,
.dm-advanced-profile h3,
.dm-advanced-profile h4,
.dm-advanced-profile p {
  margin-top: 0;
}

/*
 * Theme overrides (Kadence/Astra/Elementor/etc.) often force dark heading
 * colours inside .entry-content. Beat them with higher specificity + fill
 * colour so titles stay readable on this dark card.
 */
html body .dm-embed .dm-advanced-profile h1,
html body .dm-embed .dm-advanced-profile h2,
html body .dm-embed .dm-advanced-profile h3,
html body .dm-embed .dm-advanced-profile h4,
html body .dm-embed .dm-advanced-profile h5,
html body .dm-embed .dm-advanced-profile h6,
html body .dm-embed .dm-advanced-profile__title,
html body .dm-embed .dm-advanced-profile .dm-signal-stack__title,
html body .dm-embed .dm-advanced-profile .dm-center-card__name,
html body .dm-embed .dm-advanced-profile .dm-motif-item__head strong,
html body .dm-embed .dm-advanced-profile .dm-purpose-card h4,
html body .entry-content .dm-advanced-profile h1,
html body .entry-content .dm-advanced-profile h2,
html body .entry-content .dm-advanced-profile h3,
html body .entry-content .dm-advanced-profile h4,
html body .entry-content .dm-advanced-profile h5,
html body .entry-content .dm-advanced-profile h6,
html body .entry-content .dm-advanced-profile__title,
html body .entry-content .dm-advanced-profile .dm-signal-stack__title,
html body .entry-content .dm-advanced-profile .dm-center-card__name,
html body .entry-content .dm-advanced-profile .dm-motif-item__head strong,
html body .entry-content .dm-advanced-profile .dm-purpose-card h4,
html body .dm-embed .dm-full-report h1,
html body .dm-embed .dm-full-report h2,
html body .dm-embed .dm-full-report h3,
html body .dm-embed .dm-full-report h4,
html body .dm-embed .dm-fr-chapter__title,
html body .dm-embed .dm-fr-topic__title,
html body .dm-embed .dm-reader__title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
}

.dm-advanced-profile__title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html body .dm-embed .dm-advanced-profile p:not(.dm-advanced-profile__title):not(.dm-signal-stack__title):not(.dm-advanced-profile__lead):not(.dm-advanced-profile__eyebrow),
html body .dm-embed .dm-advanced-profile li {
  color: rgba(248, 245, 252, 0.92) !important;
  -webkit-text-fill-color: rgba(248, 245, 252, 0.92) !important;
}

html body .dm-embed .dm-advanced-profile__eyebrow,
html body .dm-embed .dm-advanced__core > span,
html body .dm-embed .dm-advanced__motifs > span,
html body .dm-embed .dm-advanced__practice > span {
  color: var(--dm-accent-pink-hi, #E0C06A) !important;
  -webkit-text-fill-color: var(--dm-accent-pink-hi, #E0C06A) !important;
}

html body .dm-embed .dm-advanced-profile__lead,
html body .dm-embed .dm-advanced-profile__header > p:last-child,
html body .dm-embed .dm-advanced__section-head > p:last-child,
html body .dm-embed .dm-advanced__motifs > p,
html body .dm-embed .dm-center-card__prompt {
  color: rgba(245, 242, 250, 0.68) !important;
  -webkit-text-fill-color: rgba(245, 242, 250, 0.68) !important;
}

.dm-advanced-profile h2,
.dm-advanced-profile h3.dm-advanced-profile__title,
.dm-advanced-profile__title {
  margin-bottom: 10px;
  font: 700 clamp(1.35rem, 4.2vw, 2rem)/1.2 var(--dm-font-body, 'Inter', system-ui, sans-serif);
  letter-spacing: -0.03em;
  color: rgba(255, 255, 255, 0.96);
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96);
}

.dm-advanced-profile__lead,
.dm-advanced-profile__header > p:last-child,
.dm-advanced__section-head > p:last-child,
.dm-advanced__motifs > p {
  margin-bottom: 0;
  color: var(--dm-text-secondary);
  font-size: 0.9rem;
  line-height: 1.65;
}

.dm-advanced__hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.85fr);
  gap: 10px;
}

/* ── Tarot imagery in integrated reading ── */
.dm-tarot {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 10px;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02));
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(201, 168, 76, 0.08);
}

.dm-tarot__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Bias down so RWS Roman numerals at the top are less dominant */
  object-position: center 18%;
}

.dm-tarot__glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, transparent 55%, rgba(8, 5, 16, 0.35) 100%),
    radial-gradient(120% 80% at 50% 0%, rgba(224, 192, 106, 0.16), transparent 60%);
}

.dm-tarot__badge {
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(12, 8, 22, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font: 700 0.62rem/1 'Inter', system-ui, sans-serif;
  letter-spacing: 0.02em;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.dm-tarot--sm .dm-tarot__badge {
  top: 3px;
  left: 3px;
  min-width: 15px;
  height: 15px;
  padding: 0 4px;
  font-size: 0.55rem;
}

.dm-tarot--lg .dm-tarot__badge {
  top: 8px;
  left: 8px;
  min-width: 26px;
  height: 26px;
  font-size: 0.78rem;
}

.dm-tarot--sm {
  width: 42px;
  height: 64px;
  border-radius: 8px;
}

.dm-tarot--md {
  width: 58px;
  height: 90px;
  border-radius: 10px;
}

.dm-tarot--lg {
  width: 132px;
  height: 214px;
  border-radius: 14px;
}

.dm-tarot--fallback {
  align-items: center;
  justify-content: center;
  background: rgba(201, 168, 76, 0.12);
}

.dm-tarot__num {
  color: var(--dm-accent-pink-hi);
  font: 700 0.95rem/1 'Inter', sans-serif;
}

.dm-tarot-hero {
  display: flex;
  align-items: flex-end;
  gap: 18px;
  margin: 10px 0 18px;
}

.dm-tarot-hero__meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding-bottom: 6px;
}

.dm-tarot-hero__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(224, 192, 106, 0.55);
  background: rgba(201, 168, 76, 0.12);
  color: #fff;
  font: 700 0.95rem/1 'Inter', sans-serif;
  box-shadow: 0 0 18px rgba(201, 168, 76, 0.22);
}

.dm-tarot-hero__name {
  font: 700 clamp(1.2rem, 2.4vw, 1.55rem)/1.2 'Inter', sans-serif;
  letter-spacing: -0.03em;
  color: rgba(255, 255, 255, 0.96);
}

.dm-advanced__code--tarot {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  max-width: 100%;
}

.dm-advanced__code-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.dm-advanced__code-meta b {
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  justify-content: flex-start;
  color: var(--dm-accent-pink-hi);
  font: 700 0.78rem/1.1 'Inter', sans-serif;
}

.dm-advanced__code-meta span {
  white-space: normal;
  color: rgba(255, 255, 255, 0.92);
  font: 600 0.82rem/1.25 'Inter', sans-serif;
}

.dm-motif-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 12px;
  align-items: start;
  padding: 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.dm-motif-item > .dm-tarot {
  grid-column: 1;
  grid-row: 1;
}

.dm-motif-item__head {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin: 0;
  min-width: 0;
}

.dm-motif-item__reading,
.dm-motif-item > p {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  min-width: 0;
}

.dm-motif-item__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  border: 1px solid rgba(224, 192, 106, 0.45);
  color: var(--dm-accent-pink-hi);
  font: 700 0.72rem/1 'Inter', sans-serif;
}

.dm-motif-item__head strong {
  color: rgba(255, 255, 255, 0.96) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96) !important;
  font: 700 0.9rem/1.25 'Inter', sans-serif;
}

.dm-motif-item__head em {
  margin-left: auto;
}

.dm-purpose-card__head {
  min-width: 0;
}

.dm-purpose-card__arcana {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 2px 0 4px;
}

.dm-purpose-card__arcana b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  border: 1px solid rgba(224, 192, 106, 0.45);
  color: var(--dm-accent-pink-hi);
  font: 700 0.72rem/1 'Inter', sans-serif;
}

.dm-purpose-card__arcana strong {
  margin: 0;
}

.dm-advanced__core,
.dm-advanced__motifs,
.dm-purpose-card,
.dm-center-card {
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.027);
}

.dm-advanced__core,
.dm-advanced__motifs {
  min-width: 0;
  padding: 22px;
  border-radius: 16px;
}

.dm-advanced__core > .dm-advanced__code {
  margin: 4px 0 16px;
}

.dm-advanced__core > p {
  margin-bottom: 16px;
  font-size: 0.94rem;
  line-height: 1.65;
}

.dm-advanced__core blockquote {
  margin: 0;
  padding: 12px 0 0 14px;
  border-left: 2px solid var(--dm-accent-pink);
  color: var(--dm-text-secondary);
  font-size: 0.84rem;
  line-height: 1.6;
}

.dm-advanced__motifs h3,
.dm-advanced__section h3 {
  margin-bottom: 14px;
  font: 700 1.05rem/1.25 'Inter', sans-serif;
  color: rgba(255, 255, 255, 0.96);
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96);
}

.dm-advanced__motifs ul {
  display: grid;
  gap: 9px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.dm-advanced__motifs li p,
.dm-motif-item p,
.dm-motif-item__reading {
  margin: 6px 0 0;
  color: rgba(245, 242, 250, 0.88);
  font-size: 0.88rem;
  line-height: 1.55;
}

.dm-advanced__motifs em,
.dm-motif-item__head em {
  flex-shrink: 0;
  color: var(--dm-text-muted);
  font: 500 0.7rem/1.2 'Inter', sans-serif;
  font-style: normal;
}

.dm-advanced__code {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 7px;
  color: var(--dm-text-primary);
  font: 600 0.74rem/1.2 'Inter', sans-serif;
}

.dm-advanced__code:not(.dm-advanced__code--tarot) b,
.dm-purpose-card__number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 27px;
  height: 27px;
  border: 1px solid #C9A84C;
  border-radius: 50%;
  color: #C9A84C !important;
  -webkit-text-fill-color: #C9A84C !important;
  font: 700 0.72rem/1 'Inter', sans-serif;
}

.dm-advanced__code:not(.dm-advanced__code--tarot) span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 900px) {
  /*
   * iOS/WebKit often leaves grid-template-rows: 0fr/1fr accordions at height 0
   * even when open — so readings look “missing” on mobile. Use plain show/hide.
   */
  .dm-sidebar-item__panel {
    display: block !important;
    grid-template-rows: none !important;
    transition: none !important;
  }

  .dm-sidebar-item__panel[hidden] {
    display: none !important;
  }

  .dm-sidebar-item__panel.is-open {
    display: block !important;
  }

  .dm-sidebar-item__panel-wrap {
    overflow: visible !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
  }

  .dm-sidebar-item__panel-inner {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }

  .dm-sidebar-item__panel .dm-report-card,
  .dm-sidebar-item__panel .dm-report-card__sheet,
  .dm-sidebar-item__panel .dm-report-card__narrative,
  .dm-sidebar-item__panel .dm-report-card__reading,
  .dm-sidebar-item__panel .dm-report__para {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    color: rgba(248, 245, 252, 0.94) !important;
    -webkit-text-fill-color: rgba(248, 245, 252, 0.94) !important;
  }

  /* Advanced shortcode mount (outside .show-charts) */
  html body .dm-embed.dm-embed--advanced,
  .dm-embed.dm-embed--advanced {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html body .dm-advanced-profile-mount,
  html body .dm-advanced-profile-mount .dm-advanced-profile,
  html body .dm-embed--advanced .dm-advanced-profile,
  .dm-advanced-profile-mount,
  .dm-advanced-profile-mount .dm-advanced-profile {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 640px) {
  .dm-tarot--lg {
    width: 104px;
    height: 168px;
  }

  .dm-tarot-hero {
    gap: 12px;
    margin-bottom: 14px;
  }

  .dm-tarot-hero__name {
    font-size: 1.15rem;
  }
}

.dm-advanced__section {
  margin-top: 18px;
}

.dm-advanced__section-head {
  max-width: 680px;
  margin-bottom: 16px;
}

.dm-advanced__section-head h3 {
  margin-bottom: 6px;
}

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

.dm-purpose-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 4px 14px;
  align-items: start;
  min-width: 0;
  padding: 14px;
  border-radius: 12px;
}

.dm-purpose-card > .dm-tarot {
  grid-column: 1;
  grid-row: 1;
}

.dm-purpose-card__head {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}

.dm-purpose-card__reading {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 9px 0 0;
  color: rgba(245, 242, 250, 0.88);
  font-size: 0.9rem;
  line-height: 1.55;
}

.dm-purpose-card h4 {
  margin-bottom: 4px;
  font: 700 0.78rem/1.25 'Inter', sans-serif;
  color: rgba(255, 255, 255, 0.96);
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96);
}

.dm-purpose-card__context {
  margin-bottom: 6px;
  color: var(--dm-text-secondary);
  font-size: 0.72rem;
  line-height: 1.45;
}

.dm-purpose-card strong {
  color: var(--dm-accent-pink-hi);
  font: 600 0.72rem/1.2 'Inter', sans-serif;
}

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

.dm-center-card {
  min-width: 0;
  padding: 16px;
  border-radius: 12px;
}

.dm-center-card header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 13px;
}

.dm-center-card header span:last-child {
  color: var(--dm-text-muted);
  font: 500 0.68rem/1.2 'Inter', sans-serif;
  text-align: right;
}

.dm-center-card__name {
  color: rgba(255, 255, 255, 0.96) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.96) !important;
  font: 700 0.85rem/1.2 'Inter', sans-serif;
}

.dm-center-card__codes {
  display: grid;
  gap: 8px;
}

.dm-center-card__legend,
.dm-health-map__howto {
  margin: 0 0 10px;
  color: rgba(245, 242, 250, 0.62);
  font: 500 0.72rem/1.45 'Inter', sans-serif;
}

.dm-compare-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  margin-top: 12px;
}

.dm-compare-card {
  padding: 16px 18px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(201, 168, 76, 0.22);
}

.dm-compare-card h4 {
  margin: 0 0 10px;
  color: rgba(255, 255, 255, 0.94);
  font: 700 0.92rem/1.3 'Inter', sans-serif;
}

.dm-compare-card__codes {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.dm-compare-card p {
  margin: 0;
  color: rgba(245, 242, 250, 0.88);
  font-size: 0.92rem;
  line-height: 1.65;
}

.dm-center-code {
  padding: 14px 16px 14px 22px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.026);
  border-left: 3px solid rgba(201, 168, 76, 0.7);
}

.dm-center-code__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dm-center-code__lens {
  flex: 0 0 auto;
  margin: 0;
  padding-left: 2px;
  color: #C9A84C !important;
  -webkit-text-fill-color: #C9A84C !important;
  font: 700 0.62rem/1.2 'Inter', sans-serif;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.dm-center-code p {
  margin: 8px 0 0;
  font-family: var(--dm-font-body);
  color: rgba(245, 242, 250, 0.9);
  font-size: 0.95rem;
  line-height: 1.68;
  letter-spacing: 0.005em;
}

.dm-center-code p strong {
  color: var(--dm-text-primary);
  font-weight: 600;
}

.dm-center-card__prompt {
  margin: 13px 0 0;
  color: var(--dm-text-secondary);
  font-size: 0.73rem;
  line-height: 1.5;
}

.dm-advanced__practice {
  margin-top: 28px;
  padding: 18px;
  border-radius: 13px;
  background: rgba(201, 168, 76, 0.08);
  border: 1px solid rgba(224, 192, 106, 0.2);
}

.dm-advanced__practice p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.6;
}

.dm-advanced__practice strong {
  color: var(--dm-accent-pink-hi);
}

@media (max-width: 900px) {
  .dm-chart-layout {
    gap: 12px !important;
  }

  /* Same outer box as “Your Detailed Report” on mobile */
  html body .dm-embed .dm-advanced-profile,
  html body .dm-advanced-profile-mount .dm-advanced-profile,
  .dm-advanced-profile-mount .dm-advanced-profile,
  .dm-advanced-profile {
    margin-top: 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: clamp(16px, 2.5vw, 28px) !important;
    border: 1px solid rgba(224, 192, 106, 0.18) !important;
    border-radius: 22px !important;
    background:
      radial-gradient(600px 260px at 0 0, rgba(201, 168, 76, 0.12), transparent 68%),
      linear-gradient(145deg, rgba(21, 13, 37, 0.98), rgba(8, 5, 17, 0.98)) !important;
    box-shadow: var(--dm-shadow-lg) !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  .dm-advanced-profile-mount {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
    max-width: none;
  }

  html body .dm-embed .dm-advanced-profile .dm-center-code,
  .dm-center-code {
    padding: 14px 16px 14px 22px !important;
    border-left: 3px solid rgba(201, 168, 76, 0.7) !important;
  }

  html body .dm-embed .dm-advanced-profile .dm-center-code__lens,
  html body .dm-embed .dm-advanced-profile .dm-advanced__code-meta b,
  .dm-center-code__lens,
  .dm-advanced-profile .dm-advanced__code-meta b {
    color: #C9A84C !important;
    -webkit-text-fill-color: #C9A84C !important;
  }

  .dm-advanced-profile__header {
    margin-bottom: 14px !important;
    max-width: none !important;
  }

  /* Match "Your Detailed Report" title treatment exactly */
  .dm-advanced-profile .dm-signal-stack__title,
  .dm-advanced-profile__title,
  html body .dm-embed .dm-advanced-profile h3.dm-signal-stack__title,
  html body .dm-embed .dm-advanced-profile h3.dm-advanced-profile__title {
    margin: 0 0 4px !important;
    font-family: var(--dm-font-body, 'Inter', system-ui, sans-serif) !important;
    font-size: clamp(1.25rem, 2.4vw, 1.7rem) !important;
    font-weight: 700 !important;
    letter-spacing: -0.03em !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    opacity: 1 !important;
  }

  .dm-advanced-profile__lead {
    font-size: 0.84rem !important;
    line-height: 1.45 !important;
  }

  .dm-advanced__hero-grid,
  .dm-purpose-grid,
  .dm-center-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  /* Soft inner panels — contained, not edge-flush */
  html body .dm-embed .dm-advanced-profile .dm-advanced__core,
  html body .dm-embed .dm-advanced-profile .dm-advanced__motifs,
  html body .dm-embed .dm-advanced-profile .dm-purpose-card,
  html body .dm-embed .dm-advanced-profile .dm-center-card,
  .dm-advanced__core,
  .dm-advanced__motifs,
  .dm-purpose-card,
  .dm-center-card {
    padding: 14px 12px !important;
    margin: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    box-shadow: none !important;
  }

  .dm-advanced__hero-grid {
    gap: 10px !important;
  }

  .dm-purpose-grid,
  .dm-center-grid {
    gap: 10px !important;
  }

  .dm-advanced__core + .dm-advanced__motifs,
  .dm-advanced__section {
    margin-top: 12px !important;
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  .dm-advanced__core blockquote {
    margin-top: 4px !important;
    padding: 10px 0 0 12px !important;
  }

  .dm-advanced__section-head {
    margin-bottom: 6px !important;
  }

  .dm-advanced__section-head h3,
  .dm-advanced__motifs h3,
  .dm-purpose-card h4,
  .dm-center-card__name,
  .dm-motif-item__head strong {
    margin: 0 0 6px !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
  }

  .dm-advanced__motifs ul {
    display: grid !important;
    gap: 0 !important;
    margin: 0 0 6px !important;
  }

  /*
   * Motif rows: title beside tarot, reading spans full width under both
   * so there is no empty column under the card.
   */
  .dm-motif-item {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 4px 10px !important;
    align-items: start !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  }

  .dm-motif-item:last-child {
    border-bottom: 0 !important;
  }

  .dm-motif-item > .dm-tarot {
    grid-column: 1 !important;
    grid-row: 1 !important;
    float: none !important;
    margin: 0 !important;
  }

  .dm-motif-item__head {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    gap: 6px 8px !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .dm-motif-item__head em {
    margin-left: 0 !important;
  }

  .dm-motif-item__reading,
  .dm-motif-item > p,
  .dm-advanced__motifs li p {
    display: block !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: auto !important;
    margin: 0 !important;
    clear: none !important;
  }

  /* Purpose cards: same full-width reading under tarot */
  .dm-purpose-card {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 4px 10px !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  }

  .dm-purpose-card > .dm-tarot {
    grid-column: 1 !important;
    grid-row: 1 !important;
    float: none !important;
    margin: 0 !important;
  }

  .dm-purpose-card__head {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
  }

  .dm-purpose-card__reading {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    margin-top: 2px !important;
  }

  .dm-purpose-card::after,
  .dm-motif-item::after {
    content: none !important;
    display: none !important;
  }

  .dm-center-card {
    padding: 10px 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  }

  .dm-purpose-card:last-child,
  .dm-center-card:last-child {
    border-bottom: 0 !important;
  }

  .dm-center-card__codes {
    gap: 4px !important;
  }

  .dm-center-code {
    padding: 6px 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  .dm-tarot-hero {
    gap: 10px !important;
    margin: 4px 0 8px !important;
  }

  .dm-tarot--lg {
    width: 100px !important;
    height: 162px !important;
  }

  .dm-tarot--md {
    width: 52px !important;
    height: 80px !important;
  }
}

/* ── Chart on top, full report underneath ── */
.dm-chart-layout {
  display: flex;
  flex-direction: column;
  gap: clamp(28px, 4vw, 48px);
  align-items: stretch;
  min-height: 0;
  height: auto;
  max-height: none;
  overflow: visible;
  position: relative;
}

.dm-embed > .show-charts:not(.display-none) .dm-chart-area {
  position: relative;
  top: auto;
  width: 100%;
  max-width: none;
  align-self: stretch;
  flex: 0 0 auto;
  flex-shrink: 0;
  min-height: auto;
  height: auto;
  max-height: none;
  overflow: visible;
  z-index: 1;
}

/* ================================================================
   SIGNAL STACK — full-width report under chart (page scroll)
   ================================================================ */
.dm-sidebar,
.dm-signal-stack {
  width: 100%;
  max-width: none;
  flex: 0 0 auto;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: none;
  height: auto;
  margin-top: 8px;
  padding: clamp(16px, 2.5vw, 28px);
  border-radius: 22px;
  border: 1px solid rgba(224, 192, 106, 0.18);
  background:
    radial-gradient(600px 260px at 0 0, rgba(201, 168, 76, 0.1), transparent 68%),
    linear-gradient(145deg, rgba(21, 13, 37, 0.98), rgba(8, 5, 17, 0.98));
  box-shadow: var(--dm-shadow-lg);
  overflow: visible;
  position: relative;
  top: auto;
  z-index: 0;
  clear: both;
  scrollbar-width: auto;
}

.dm-sidebar::-webkit-scrollbar,
.dm-signal-stack__list::-webkit-scrollbar {
  width: 5px;
}

.dm-sidebar::-webkit-scrollbar-thumb,
.dm-signal-stack__list::-webkit-scrollbar-thumb {
  background: rgba(201, 168, 76, 0.35);
  border-radius: var(--dm-radius-pill);
}

/* Header */
.dm-signal-stack__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 2px 14px;
  margin-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
}

.dm-signal-stack__intro {
  min-width: 0;
}

.dm-signal-stack__eyebrow {
  margin: 0 0 4px;
  font-family: var(--dm-font-body);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(224, 192, 106, 0.72);
}

.dm-signal-stack__title {
  margin: 0;
  font-family: var(--dm-font-body);
  font-size: clamp(1.25rem, 2.4vw, 1.7rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: rgba(255, 255, 255, 0.96);
}

/* Same treatment as "Your Detailed Report" — avoid theme heading colour overrides. */
html body .dm-embed .dm-advanced-profile h3.dm-signal-stack__title,
html body .dm-embed .dm-advanced-profile h3.dm-advanced-profile__title,
html body .dm-embed .dm-advanced-profile .dm-signal-stack__title,
html body .dm-embed .dm-advanced-profile .dm-advanced-profile__title,
html body .dm-embed .dm-advanced-profile .dm-advanced__motifs h3,
html body .dm-embed .dm-advanced-profile .dm-advanced__section h3,
html body .dm-embed .dm-advanced-profile .dm-advanced__section-head h3,
html body .dm-embed .dm-advanced-profile .dm-purpose-card h4,
html body .dm-embed .dm-advanced-profile .dm-center-card__name,
html body .dm-embed .dm-advanced-profile .dm-motif-item__head strong,
html body .entry-content .dm-advanced-profile h3.dm-signal-stack__title,
html body .entry-content .dm-advanced-profile .dm-signal-stack__title,
html body .entry-content .dm-advanced-profile .dm-advanced-profile__title,
html body .entry-content .dm-advanced-profile h3,
html body .entry-content .dm-advanced-profile h4,
.dm-advanced-profile h3.dm-signal-stack__title,
.dm-advanced-profile .dm-signal-stack__title,
.dm-advanced-profile__title,
.dm-advanced-profile .dm-advanced__motifs h3,
.dm-advanced-profile .dm-advanced__section h3,
.dm-advanced-profile .dm-purpose-card h4,
.dm-advanced-profile .dm-center-card__name,
.dm-advanced-profile .dm-motif-item__head strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

html body .dm-embed .dm-advanced-profile h3.dm-signal-stack__title,
html body .dm-embed .dm-advanced-profile h3.dm-advanced-profile__title,
html body .entry-content .dm-advanced-profile h3.dm-signal-stack__title,
.dm-advanced-profile h3.dm-signal-stack__title,
.dm-advanced-profile .dm-signal-stack__title,
.dm-advanced-profile__title {
  margin: 0 0 8px !important;
  font-family: var(--dm-font-body, 'Inter', system-ui, sans-serif) !important;
  font-size: clamp(1.25rem, 2.4vw, 1.7rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.2 !important;
}

.dm-advanced-profile__lead {
  margin: 0 !important;
  color: rgba(245, 242, 250, 0.68) !important;
  -webkit-text-fill-color: rgba(245, 242, 250, 0.68) !important;
  font-size: 0.9rem;
  line-height: 1.55;
}

.dm-sidebar-reset {
  flex-shrink: 0;
  align-self: center;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.68);
  padding: 7px 12px;
  min-height: 32px;
  border-radius: 999px;
  font-family: var(--dm-font-body);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    background var(--dm-acc-duration) var(--dm-acc-ease),
    border-color var(--dm-acc-duration) var(--dm-acc-ease),
    color var(--dm-acc-duration) var(--dm-acc-ease),
    box-shadow var(--dm-acc-duration) var(--dm-acc-ease);
}

.dm-sidebar-reset:hover {
  background: rgba(224, 192, 106, 0.1);
  border-color: rgba(224, 192, 106, 0.32);
  color: #fff;
  box-shadow: 0 0 20px rgba(201, 168, 76, 0.12);
}

.dm-sidebar-reset:focus-visible {
  outline: 2px solid var(--dm-accent-pink-hi);
  outline-offset: 2px;
}

/* Accordion list — expand with page, no inner scroll trap */
.dm-signal-stack__list,
.dm-sidebar-menu {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 2px 0 0;
  min-height: 0;
  flex: none;
  overflow: visible;
  -webkit-overflow-scrolling: auto;
}

/* Section card */
.dm-signal-card,
.dm-sidebar-item {
  position: relative;
  flex-shrink: 0;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.022);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 1px 2px rgba(0, 0, 0, 0.16);
  transition:
    border-color var(--dm-acc-duration) var(--dm-acc-ease),
    background var(--dm-acc-duration) var(--dm-acc-ease),
    box-shadow var(--dm-acc-duration) var(--dm-acc-ease),
    transform var(--dm-acc-duration) var(--dm-acc-ease);
}

.dm-sidebar-item__header {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin: 0;
  padding: 11px 12px;
  min-height: 48px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  color: inherit;
  outline: none;
  border-radius: 11px;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--dm-acc-duration) var(--dm-acc-ease);
}

.dm-sidebar-item__header:focus-visible {
  background: rgba(255, 255, 255, 0.04);
  box-shadow: inset 0 0 0 1px rgba(224, 192, 106, 0.35);
}

.dm-sidebar-item__accent {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.035);
  font-family: ui-monospace, 'Inter', monospace;
  font-size: 0.625rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.46);
  transition:
    background var(--dm-acc-duration) var(--dm-acc-ease),
    border-color var(--dm-acc-duration) var(--dm-acc-ease),
    color var(--dm-acc-duration) var(--dm-acc-ease),
    box-shadow var(--dm-acc-duration) var(--dm-acc-ease);
}

.dm-sidebar-item__label {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.dm-sidebar-item__title {
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.32;
  letter-spacing: -0.015em;
}

.dm-sidebar-item__subtitle {
  font-family: var(--dm-font-body);
  font-size: 0.65625rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.38);
  line-height: 1.28;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Premium chevron */
.dm-sidebar-item__chevron {
  position: relative;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.03);
  flex-shrink: 0;
  transition:
    transform var(--dm-acc-duration) var(--dm-acc-ease),
    background var(--dm-acc-duration) var(--dm-acc-ease),
    border-color var(--dm-acc-duration) var(--dm-acc-ease);
}

.dm-sidebar-item__chevron::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  margin: -4px 0 0 -3px;
  border-right: 1.5px solid rgba(255, 255, 255, 0.52);
  border-bottom: 1.5px solid rgba(255, 255, 255, 0.52);
  transform: rotate(45deg);
  transition: transform var(--dm-acc-duration) var(--dm-acc-ease);
}

@media (hover: hover) and (pointer: fine) {
  .dm-signal-card:hover,
  .dm-sidebar-item:hover {
    border-color: rgba(224, 192, 106, 0.22);
    background: rgba(255, 255, 255, 0.03);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.05),
      0 4px 16px rgba(0, 0, 0, 0.2);
  }

  .dm-signal-card:hover .dm-sidebar-item__accent,
  .dm-sidebar-item:hover .dm-sidebar-item__accent {
    color: rgba(255, 255, 255, 0.78);
    border-color: rgba(224, 192, 106, 0.24);
  }

  .dm-signal-card:hover .dm-sidebar-item__title,
  .dm-sidebar-item:hover .dm-sidebar-item__title {
    color: #fff;
  }
}

@media (hover: none) {
  .dm-sidebar-item__header:active {
    background: rgba(255, 255, 255, 0.04);
  }
}

/* Active / expanded card */
.dm-signal-card.expanded,
.dm-sidebar-item.expanded {
  border-color: rgba(224, 192, 106, 0.38);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(224, 192, 106, 0.1) 0%, transparent 58%),
    rgba(255, 255, 255, 0.04);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 0 0 1px rgba(224, 192, 106, 0.08),
    0 8px 28px rgba(201, 168, 76, 0.1);
}

.dm-sidebar-item.expanded .dm-sidebar-item__header {
  background: rgba(255, 255, 255, 0.02);
}

.dm-sidebar-item.expanded .dm-sidebar-item__accent {
  color: #fff;
  border-color: rgba(224, 192, 106, 0.45);
  background: rgba(201, 168, 76, 0.18);
  box-shadow: 0 0 16px rgba(201, 168, 76, 0.2);
}

.dm-sidebar-item.expanded .dm-sidebar-item__title {
  color: #fff;
  font-weight: 700;
}

.dm-sidebar-item.expanded .dm-sidebar-item__subtitle {
  color: rgba(255, 255, 255, 0.52);
}

.dm-sidebar-item.expanded .dm-sidebar-item__chevron {
  background: rgba(201, 168, 76, 0.14);
  border-color: rgba(224, 192, 106, 0.35);
}

.dm-sidebar-item.expanded .dm-sidebar-item__chevron::before {
  transform: rotate(-135deg);
  margin-top: -2px;
}

/* Panel expand animation */
.dm-sidebar-item__panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--dm-acc-duration) var(--dm-acc-ease);
}

.dm-sidebar-item__panel[hidden] {
  display: none;
}

.dm-sidebar-item__panel.is-open {
  grid-template-rows: 1fr;
}

.dm-sidebar-item__panel-wrap {
  overflow: hidden;
  min-height: 0;
}

.dm-sidebar-item__panel-inner {
  padding: 2px 14px 14px;
  min-height: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  margin-top: 0;
}

.dm-sidebar-item__placeholder {
  margin: 10px 0 0;
  padding: 0;
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  line-height: 1.62;
  color: rgba(255, 255, 255, 0.42);
}

/* ── Reading content inside accordion — no inner card, spacing only ── */
.dm-sidebar-item__panel .dm-report-card {
  height: auto;
  max-width: 100%;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
  overflow: visible;
}

.dm-sidebar-item__panel .dm-report-card::before,
.dm-sidebar-item__panel .dm-report-card::after {
  display: none;
}

.dm-sidebar-item__panel .dm-report-card:hover {
  transform: none;
  border: none;
  box-shadow: none;
}

.dm-sidebar-item__panel .dm-report-card__sheet {
  padding: 0;
}

/* The accordion header already shows the title/subtitle, so the card
   inside the panel starts straight at the reading (no repeated heading). */
.dm-sidebar-item__panel .dm-report-card__header {
  display: none;
}

.dm-sidebar-item__panel .dm-report-card__identity {
  margin-bottom: 14px;
}

.dm-sidebar-item__panel .dm-arcana-chip__circle {
  width: 28px;
  height: 28px;
  font-size: 0.72rem;
  background: rgba(201, 168, 76, 0.12);
  border: 1px solid rgba(224, 192, 106, 0.45);
  color: rgba(255, 255, 255, 0.96);
  box-shadow: 0 0 8px rgba(201, 168, 76, 0.18);
}

.dm-sidebar-item__panel .dm-arcana-chip__name {
  font-size: 0.8125rem;
  white-space: normal;
}

.dm-sidebar-item__panel .dm-arcana-sep {
  margin: 0 10px;
}

.dm-sidebar-item__panel .dm-report__focus {
  margin-bottom: 14px;
}

.dm-sidebar-item__panel .dm-report-card__narrative {
  margin-bottom: 0;
}

.dm-sidebar-item__panel .dm-report__para,
.dm-sidebar-item__panel .dm-report-card__reading p {
  font-size: 0.98rem;
  line-height: 1.75;
  margin-bottom: 14px;
  color: rgba(245, 242, 250, 0.92);
  font-weight: 400;
  letter-spacing: 0.01em;
}

.dm-sidebar-item__panel .dm-report-card__insights {
  grid-template-columns: 1fr;
  gap: 14px;
  padding-top: 0;
  margin-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 14px;
}

/* Keep all reading content inside the narrow panel (no right-side overflow) */
.dm-sidebar-item__panel .dm-report-card,
.dm-sidebar-item__panel .dm-report-card__sheet,
.dm-sidebar-item__panel .dm-report-card__header,
.dm-sidebar-item__panel .dm-report-card__titles,
.dm-sidebar-item__panel .dm-report__numbers,
.dm-sidebar-item__panel .dm-report-card__insights {
  min-width: 0;
  max-width: 100%;
}

.dm-sidebar-item__panel .dm-report-card__title,
.dm-sidebar-item__panel .dm-report-card__subtitle,
.dm-sidebar-item__panel .dm-report__para,
.dm-sidebar-item__panel .dm-report-card__reading p,
.dm-sidebar-item__panel .dm-report__keywords,
.dm-sidebar-item__panel .dm-report__strength,
.dm-sidebar-item__panel .dm-report__challenge,
.dm-sidebar-item__panel .dm-report__advice-item,
.dm-sidebar-item__panel .dm-arcana-chip__name {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ── Chart area — never shrink; report must start below full SVG ── */
.dm-chart-area {
  flex: 0 0 auto;
  min-width: 0;
  max-width: none;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 12px 6px 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  box-shadow: none;
  height: auto;
  min-height: auto;
  max-height: none;
  overflow: visible;
  position: relative;
  z-index: 1;
}

.dm-chart-area .pento {
  width: 100%;
  max-width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: visible;
  height: auto;
  max-height: none;
  flex: 0 0 auto;
}

.dm-chart-area #matrix {
  display: block;
  width: 100%;
  max-width: var(--dm-chart-size, 826px);
  min-width: 0;
  height: auto;
  max-height: none;
  aspect-ratio: var(--dm-chart-aspect);
  margin: 0 auto;
  opacity: 1;
  visibility: visible;
  overflow: visible;
  flex: 0 0 auto;
}

/* Purpose calc nodes stay hidden */
.dm-chakra-hidden {
  display: none !important;
}

/* Chart + Health map: side by side on desktop, stacked on mobile */
.dm-visuals-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, min(420px, 38%));
  gap: clamp(18px, 2.8vw, 32px);
  align-items: center;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.dm-visuals-row > .dm-chart-area {
  order: 1;
  padding: 4px 0 8px;
  min-width: 0;
}

.dm-visuals-row > .dm-health-map {
  order: 2;
}

.dm-health-map {
  position: relative;
  width: 100%;
  max-width: 420px;
  justify-self: end;
  padding: 18px 18px 14px;
  border-radius: 20px;
  border: 1px solid rgba(224, 192, 106, 0.2);
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(224, 192, 106, 0.1), transparent 50%),
    rgba(16, 10, 29, 0.94);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 12px 32px rgba(0, 0, 0, 0.24);
  min-width: 0;
  overflow: hidden;
}

.dm-health-map__head {
  margin: 0 0 12px;
}

.dm-health-map__eyebrow {
  margin: 0 0 3px;
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(224, 192, 106, 0.8);
}

.dm-health-map__title {
  margin: 0 0 3px;
  font-family: var(--dm-font-display);
  font-size: 1.35rem;
  line-height: 1.2;
  color: #FFF8EC;
  letter-spacing: -0.02em;
}

.dm-health-map__sub {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.35;
  color: rgba(245, 242, 250, 0.5);
}

.dm-health-map__scroll {
  width: 100%;
  overflow: visible;
}

.dm-health-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.dm-health-col--chakra { width: 48%; }
.dm-health-col--num { width: 17%; }
.dm-health-col--key { width: 18%; }

.dm-health-table thead th {
  padding: 0 4px 10px;
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.48);
  text-align: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  white-space: nowrap;
  vertical-align: bottom;
}

.dm-health-table thead th:first-child {
  text-align: left;
  padding-left: 0;
}

.dm-health-table tbody th {
  padding: 9px 8px 9px 0;
  text-align: left;
  font-weight: 600;
  vertical-align: middle;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.dm-health-table tbody td,
.dm-health-table tfoot td {
  padding: 9px 4px;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  vertical-align: middle;
}

.dm-health-table tbody tr:last-child th,
.dm-health-table tbody tr:last-child td {
  border-bottom: none;
}

.dm-health-chakra {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.dm-health-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  position: relative;
  z-index: 1;
}

.dm-health-name {
  display: block;
  font-size: 0.92rem;
  font-weight: 650;
  color: rgba(255, 255, 255, 0.96);
  line-height: 1.2;
  white-space: nowrap;
}

.dm-health-organs {
  display: block;
  font-size: 0.68rem;
  font-weight: 400;
  line-height: 1.25;
  color: rgba(245, 242, 250, 0.42);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Numbered chakra badges — contain glow so it never covers the name */
.dm-health-map .dm-health-dot {
  position: relative;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  margin: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  z-index: 0;
}

.dm-health-map #circle-sahastrara:before,
.dm-health-map #circle-ajna:before,
.dm-health-map #circle-vishuddha:before,
.dm-health-map #circle-anahata:before,
.dm-health-map #circle-manipura:before,
.dm-health-map #circle-svadhishtana:before,
.dm-health-map #circle-muladhara:before {
  position: absolute;
  inset: 0;
  width: 28px;
  height: 28px;
  margin: 0 !important;
  font-size: 0.85rem !important;
  line-height: 28px;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 10px 1px rgba(255, 255, 255, 0.12) !important;
  filter: none;
}

.dm-health-map #circle-sahastrara:before { box-shadow: 0 0 12px 1px rgba(182, 83, 247, 0.45) !important; }
.dm-health-map #circle-ajna:before { box-shadow: 0 0 12px 1px rgba(61, 84, 245, 0.45) !important; }
.dm-health-map #circle-vishuddha:before { box-shadow: 0 0 12px 1px rgba(116, 224, 248, 0.4) !important; }
.dm-health-map #circle-anahata:before { box-shadow: 0 0 12px 1px rgba(182, 253, 87, 0.35) !important; }
.dm-health-map #circle-manipura:before { box-shadow: 0 0 12px 1px rgba(251, 228, 157, 0.4) !important; }
.dm-health-map #circle-svadhishtana:before { box-shadow: 0 0 12px 1px rgba(237, 114, 51, 0.4) !important; }
.dm-health-map #circle-muladhara:before { box-shadow: 0 0 12px 1px rgba(234, 70, 49, 0.4) !important; }

.dm-health-table tbody td:nth-child(2) { color: #a8c4ff; }
.dm-health-table tbody td:nth-child(3) { color: #f0c987; }
.dm-health-table tbody td:nth-child(4) {
  color: #E0C06A;
  font-size: 1.12rem;
}

.dm-health-table tfoot th,
.dm-health-table tfoot td {
  padding: 12px 4px 2px;
  border-bottom: 0;
  border-top: 1px solid rgba(224, 192, 106, 0.22);
  font-size: 1.02rem;
  font-weight: 700;
}

.dm-health-table tfoot th {
  text-align: left;
  padding-left: 0;
  color: rgba(255, 255, 255, 0.62);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.68rem;
}

.dm-health-table tfoot td {
  color: #fff;
  background: transparent;
}

.dm-health-table tfoot td:nth-child(2) { color: #a8c4ff; }
.dm-health-table tfoot td:nth-child(3) { color: #f0c987; }
.dm-health-table tfoot td:nth-child(4) { color: #E0C06A; }

.dm-health-map__footnote {
  margin: 12px 0 0;
  font-size: 0.7rem;
  line-height: 1.35;
  color: rgba(245, 242, 250, 0.38);
}

/* Tablet / mobile: chart first, health map underneath */
@media (max-width: 1100px) {
  .dm-visuals-row {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 22px;
  }

  .dm-visuals-row > .dm-chart-area {
    order: 1;
    padding-bottom: 0;
  }

  .dm-visuals-row > .dm-health-map {
    order: 2;
    max-width: none;
    width: 100%;
    justify-self: stretch;
  }
}

@media (max-width: 520px) {
  .dm-health-map {
    max-width: none;
    width: 100%;
    padding: 12px 8px 10px;
    border-radius: 14px;
  }

  .dm-health-map__title {
    font-size: 1.15rem;
  }

  .dm-health-name {
    font-size: 0.82rem;
  }

  .dm-health-organs {
    white-space: normal;
    font-size: 0.68rem;
  }

  .dm-health-table {
    width: 100%;
    table-layout: fixed;
  }

  .dm-health-col--chakra { width: 40%; }
  .dm-health-col--num { width: 20%; }
  .dm-health-col--key { width: 20%; }

  .dm-health-table thead th {
    font-size: 0.58rem;
    letter-spacing: 0.03em;
    padding-left: 2px;
    padding-right: 2px;
  }

  .dm-health-table th,
  .dm-health-table td {
    padding-left: 3px;
    padding-right: 3px;
  }

  .dm-health-table tbody td,
  .dm-health-table tfoot td {
    font-size: 0.88rem;
  }

  .dm-health-chakra {
    gap: 8px;
  }
}

/* ================================================================
   REPORT CARDS — rendered by the reading engine, distributed into
   the sidebar accordion panels. `.dm-overview-report` is only a
   hidden staging container the engine builds into before moving cards.
   ================================================================ */
.dm-overview-report {
  display: none;
}

.dm-report-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: rgba(12, 9, 20, 0.52);
  border: 1px solid rgba(255, 255, 255, 0.045);
  border-radius: 16px;
  padding: 0;
  box-shadow:
    0 2px 20px rgba(0, 0, 0, 0.18),
    0 0 24px rgba(201, 168, 76, 0.025);
  position: relative;
  overflow: hidden;
  transition:
    transform 250ms cubic-bezier(0.4, 0, 0.2, 1),
    border-color 250ms ease,
    box-shadow 250ms ease;
}

.dm-report-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 100% 60% at 50% -10%, rgba(255, 255, 255, 0.025), transparent 55%);
  pointer-events: none;
}

.dm-report-card:hover {
  transform: translateY(-5px);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow:
    0 16px 48px rgba(0, 0, 0, 0.32),
    0 0 40px rgba(201, 168, 76, 0.12),
    0 0 0 1px rgba(201, 168, 76, 0.08);
}

.dm-report-card__sheet {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 28px 28px 26px;
  min-height: 0;
}

/* ── Chapter header ── */
.dm-report-card__header {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 22px;
  flex-shrink: 0;
}

.dm-report-card__icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  line-height: 1;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 20px rgba(139, 92, 246, 0.08);
  transition: transform 320ms ease, box-shadow 320ms ease;
}

.dm-report-card:hover .dm-report-card__icon {
  transform: scale(1.05);
  box-shadow: 0 0 24px rgba(201, 168, 76, 0.15);
}

.dm-report-card__index {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  font-family: var(--dm-font-body);
  font-size: 0.6875rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: rgba(255, 255, 255, 0.5);
  letter-spacing: 0.04em;
  background: rgba(255, 255, 255, 0.02);
}

.dm-report-card__titles {
  flex: 1;
  min-width: 0;
  padding-top: 3px;
}

.dm-report-card__title {
  font-family: var(--dm-font-body);
  font-size: 1.1875rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.97);
  margin: 0 0 6px;
  line-height: 1.25;
  letter-spacing: -0.015em;
  transition: color 320ms ease;
}

.dm-report-card__subtitle {
  margin: 0;
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 400;
  letter-spacing: 0.005em;
  text-transform: none;
  color: rgba(161, 161, 170, 0.92);
  line-height: 1.45;
}

/* ── Arcana numbers ── */
.dm-report-card__identity {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 14px;
  margin-bottom: 20px;
  flex-shrink: 0;
}

.dm-report-card__tarot {
  flex: 0 0 auto;
}

.dm-report-card__tarot .dm-tarot {
  display: block;
}

.dm-report__numbers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  row-gap: 10px;
}

.dm-arcana-sep {
  margin: 0 12px;
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.28);
  user-select: none;
}

.dm-arcana-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.dm-arcana-chip__circle {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1;
  flex-shrink: 0;
  background: rgba(201, 168, 76, 0.12);
  border: 1px solid rgba(224, 192, 106, 0.45);
  color: rgba(255, 255, 255, 0.96);
  box-shadow: 0 0 10px rgba(201, 168, 76, 0.2);
  transition: box-shadow 320ms ease, transform 320ms ease, border-color 320ms ease;
}

.dm-report-card:hover .dm-arcana-chip__circle {
  transform: scale(1.04);
  border-color: var(--dm-accent-pink-hi);
  box-shadow: 0 0 16px rgba(201, 168, 76, 0.32);
}

.dm-arcana-chip__name {
  font-family: var(--dm-font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.94);
  white-space: nowrap;
  letter-spacing: 0.005em;
}

/* ── Focus ── */
.dm-report__focus {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin: 0 0 20px;
  padding: 0;
  flex-shrink: 0;
}

.dm-report__focus-label {
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: #C9A84C;
  line-height: 1.2;
}

.dm-report__keywords {
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 400;
  letter-spacing: 0.01em;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.5;
}

/* ── Reading ── */
.dm-report-card__narrative {
  flex: 0 1 auto;
  min-height: 0;
  margin-bottom: 22px;
}

.dm-report-card__reading {
  position: relative;
}

.dm-report__para,
.dm-report-card__reading p,
.dm-report__meaning p {
  margin: 0 0 16px;
  font-family: var(--dm-font-body);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.78;
  color: rgba(245, 242, 250, 0.92);
  letter-spacing: 0.01em;
}

.dm-report__lead,
.dm-report-card__reading p:first-child {
  color: rgba(255, 255, 255, 0.96);
  font-size: 1.05rem;
  line-height: 1.72;
  font-weight: 450;
}

.dm-report__para:last-child,
.dm-report-card__reading p:last-child,
.dm-report__meaning p:last-child {
  margin-bottom: 0;
}

.dm-report__pending {
  color: rgba(255, 255, 255, 0.32);
  font-style: italic;
  font-size: 0.8125rem;
  line-height: 1.65;
}

/* ── Strengths / Challenges / Advice ── */
.dm-report-card__insights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: auto;
  margin-bottom: 0;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
}

.dm-report__insight-col {
  min-width: 0;
}

.dm-report__insight-heading {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  font-family: var(--dm-font-body);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.2;
}

.dm-report__insight-icon {
  font-size: 0.75rem;
  line-height: 1;
  flex-shrink: 0;
}

.dm-report__insight-col--strengths .dm-report__insight-heading {
  color: #4ade80;
}

.dm-report__insight-col--challenges .dm-report__insight-heading {
  color: #fb923c;
}

.dm-report__insight-col--advice .dm-report__insight-heading {
  color: #e879f9;
}

.dm-report__strengths,
.dm-report__challenges,
.dm-report__advice-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.dm-report__strength,
.dm-report__challenge,
.dm-report__advice-item {
  position: relative;
  margin: 0 0 8px;
  padding-left: 12px;
  font-family: var(--dm-font-body);
  font-size: 0.9rem;
  line-height: 1.55;
  color: rgba(235, 232, 245, 0.9);
}

.dm-report__strength::before,
.dm-report__challenge::before,
.dm-report__advice-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: rgba(161, 161, 170, 0.55);
}

.dm-report__strength:last-child,
.dm-report__challenge:last-child,
.dm-report__advice-item:last-child {
  margin-bottom: 0;
}

/* ================================================================
   HIGHLIGHT RULES (from specification §3)
   ================================================================ */
#matrix *,
.base-circle {
  transition: opacity 0.4s ease, filter 0.4s ease, stroke 0.4s ease, fill 0.4s ease;
}

.matrix-container.active-highlight #matrix-frame *,
.matrix-container.active-highlight #points-basic circle,
.matrix-container.active-highlight #points-basic text,
.matrix-container.active-highlight #points-years text,
.matrix-container.active-highlight .base-circle {
  opacity: 0.2;
}

.matrix-container.active-highlight [data-id].highlighted {
  opacity: 1 !important;
}

.matrix-container.active-highlight circle[data-id].highlighted {
  stroke-width: 3.5px !important;
  animation: dm-node-pulse 2.5s ease-in-out infinite;
}

.matrix-container.active-highlight text[data-id].highlighted {
  font-weight: 700 !important;
  filter: drop-shadow(0 0 5px var(--dm-arcana-glow, rgba(201, 168, 76, 0.35)));
}

.matrix-container.active-highlight span.base-circle.highlighted {
  font-weight: 600 !important;
}

.matrix-container.active-highlight td.highlighted {
  color: var(--dm-accent) !important;
  font-weight: 600 !important;
  text-shadow: 0 0 6px rgba(201, 168, 76, 0.35);
}

@keyframes dm-node-pulse {
  0%, 100% {
    filter: drop-shadow(0 0 3px var(--dm-arcana-glow, rgba(201, 168, 76, 0.28)))
            drop-shadow(0 0 1px var(--dm-arcana-border, rgba(201, 168, 76, 0.4)));
  }
  50% {
    filter: drop-shadow(0 0 10px var(--dm-arcana-glow, rgba(201, 168, 76, 0.45)))
            drop-shadow(0 0 4px var(--dm-arcana-border, rgba(201, 168, 76, 0.55)));
  }
}

/* ── Report header — name + birth date above chart ── */
.dm-report-header {
  text-align: center;
  padding: 0 0 1.25rem;
  max-width: 100%;
  margin: 0 auto 1rem;
}

.dm-report-header__label {
  margin: 0 0 14px;
  font-family: var(--dm-font-body);
  font-size: clamp(0.9375rem, 2.4vw, 1.125rem);
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.35;
}

.dm-report-header__identity {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.dm-report-header__identity.is-ready {
  display: flex;
}

.dm-report-header__name {
  display: block;
  font-family: var(--dm-font-body);
  font-size: clamp(2rem, 5.5vw, 2.875rem);
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.15;
  color: rgba(255, 255, 255, 0.96);
}

.dm-report-header__dob {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(201, 168, 76, 0.1);
  border: 1px solid rgba(201, 168, 76, 0.28);
  font-family: var(--dm-font-body);
  font-size: 0.8125rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1;
}

.dm-report-header__dob-label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--dm-accent-pink, #C9A84C);
}

.dm-report-header__dob-value {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
  letter-spacing: 0.02em;
}

/* ── Matrix container override when redesigned ── */
.matrix-container.personal-redesign {
  align-items: stretch;
}

/* Every child counts padding/border inside its width so nothing overflows the column */
.matrix-container.personal-redesign,
.matrix-container.personal-redesign * {
  box-sizing: border-box;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (min-width: 1101px) and (max-width: 1400px) {
  :root {
    --dm-sidebar-width: 380px;
    --dm-chart-size: min(820px, 100%);
  }

  .dm-chart-layout {
    gap: 32px;
  }

  .dm-sidebar {
    max-height: none;
    padding: var(--dm-space-5);
  }

  .dm-chart-area {
    padding: 4px 6px;
  }
}

/* Large desktop — balanced sidebar + chart proportions */
@media (min-width: 1401px) and (max-width: 1599px) {
  :root {
    --dm-sidebar-width: 460px;
    --dm-chart-size: min(900px, 100%);
    --dm-layout-max-width: 1480px;
  }

  .personal-matrix-page,
  .matrix-container.personal-redesign {
    max-width: var(--dm-layout-max-width);
    margin-left: auto;
    margin-right: auto;
  }

  .dm-chart-layout {
    gap: 36px;
  }

  .dm-sidebar {
    padding: var(--dm-space-6);
  }

  .dm-chart-area {
    padding: 4px 8px;
  }
}

/* Ultra-wide monitors — premium spacing on 1920px+ */
@media (min-width: 1600px) {
  :root {
    --dm-sidebar-width: 480px;
    --dm-chart-size: min(940px, 100%);
    --dm-layout-max-width: 1560px;
  }

  .personal-matrix-page,
  .matrix-container.personal-redesign {
    max-width: var(--dm-layout-max-width);
    margin-left: auto;
    margin-right: auto;
  }

  .dm-chart-layout {
    gap: 40px;
  }

  .dm-sidebar {
    max-height: none;
  }

  .dm-chart-area {
    padding: 4px 10px;
  }
}

@media (max-width: 1100px) {
  .dm-chart-area {
    max-width: none;
  }

  /*
   * Mobile / tablet — natural page flow:
   * chart first, then full report accordion underneath (no sticky scroll trap).
   */
  .dm-embed > .show-charts:not(.display-none) {
    display: block;
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .dm-embed > .show-charts:not(.display-none) .matrix-container.personal-redesign,
  .dm-embed > .show-charts:not(.display-none) .personal-matrix-page {
    display: flex;
    flex-direction: column;
    flex: none;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    height: auto;
    overflow: visible;
    align-items: stretch;
    /* Parent .show-charts owns the only mobile gutter — avoid double inset. */
    padding-left: 0;
    padding-right: 0;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-report-header {
    flex: 0 0 auto;
    padding: 0 0 0.75rem;
    margin-bottom: 0.5rem;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-chart-layout {
    display: flex;
    flex-direction: column;
    flex: none;
    min-height: 0;
    width: 100%;
    position: relative;
    top: auto;
    height: auto;
    max-height: none;
    gap: clamp(20px, 4vw, 32px);
    overflow: visible;
    z-index: auto;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-chart-area {
    order: 1;
    flex: 0 0 auto !important;
    position: relative;
    width: 100%;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 0 24px;
    margin: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    overflow: visible !important;
    z-index: 1;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-chart-area .pento {
    width: 100%;
    max-width: 100%;
    max-height: none !important;
    height: auto !important;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible !important;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-chart-area #matrix {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: var(--dm-chart-aspect);
    margin: 0 auto;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar.dm-signal-stack {
    order: 2;
    flex: 0 0 auto !important;
    align-self: stretch;
    min-height: 0;
    position: relative;
    top: auto;
    z-index: 0;
    width: 100%;
    max-width: 100%;
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    border-radius: 16px;
    padding: 12px 8px calc(12px + env(safe-area-inset-bottom, 0px));
    margin: 10px 0 0;
    box-sizing: border-box;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-menu,
  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item,
  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel,
  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel-inner,
  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel .dm-report-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel-inner {
    padding: 2px 8px 14px;
  }

  .dm-sidebar {
    position: static;
    top: auto;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-signal-stack__head {
    flex-shrink: 0;
    padding: 0 0 12px;
    margin-bottom: 12px;
    border-bottom-color: rgba(255, 255, 255, 0.07);
    background: transparent;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-signal-stack__list,
  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-menu {
    flex: none;
    flex-direction: column;
    flex-wrap: nowrap;
    overflow: visible;
    gap: 8px;
    padding: 0;
    max-height: none;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-signal-card,
  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar .dm-sidebar-reset {
    padding: 8px 12px;
    min-height: var(--dm-mobile-touch-min);
    font-size: 0.625rem;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__header {
    padding: 13px 14px;
    min-height: var(--dm-mobile-touch-min);
    grid-template-columns: 28px minmax(0, 1fr) 24px;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__title {
    font-size: 0.875rem;
    line-height: 1.34;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__subtitle {
    font-size: 0.6875rem;
  }
}

@media (max-width: 768px) {
  .dm-report-header {
    padding-left: 0;
    padding-right: 0;
  }

  .dm-chart-area {
    padding-left: 0;
    padding-right: 0;
  }

  .dm-chart-area .pento {
    width: 100%;
    max-width: 100%;
    padding: 0;
    box-sizing: border-box;
    overflow: visible;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar {
    padding: 0 0 calc(var(--dm-mobile-section-gap) + env(safe-area-inset-bottom, 0px));
  }

  .dm-signal-stack__head {
    margin-bottom: var(--dm-space-3);
    padding-bottom: var(--dm-space-2);
    padding-left: 0;
    padding-right: 0;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__header,
  .dm-sidebar-item__header {
    padding: 14px 14px;
    min-height: var(--dm-mobile-touch-min);
  }

  .dm-sidebar-item__panel-inner {
    padding: 2px 14px 16px;
  }

  .dm-sidebar-item__panel .dm-report-card__insights {
    margin-top: 24px;
    gap: 18px;
  }

  .dm-sidebar-item__panel .dm-report__para,
  .dm-sidebar-item__panel .dm-report-card__reading p {
    font-size: 0.98rem;
    line-height: 1.75;
    margin-bottom: 14px;
    color: rgba(245, 242, 250, 0.92);
  }

  .dm-sidebar-item__panel .dm-report-card__narrative {
    margin-bottom: 0;
  }

  .dm-sidebar-item__panel .dm-report-card__insights {
    gap: 18px;
    margin-top: 24px;
  }

  .dm-sidebar-item__title {
    font-size: 0.8125rem;
    line-height: 1.3;
  }

  .dm-sidebar-item__subtitle {
    line-height: 1.4;
  }
}

/* ================================================================
   MOBILE REPORT — full-width accordion (max-width: 768px only)
   Escapes theme column padding; desktop unchanged.
   ================================================================ */
@media (max-width: 768px) {
  html body .dm-embed .matrix-container.personal-redesign {
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /*
   * Full-bleed chart stage on phones: escape typical theme content gutters
   * so Health Map + Detailed Report use the full viewport width.
   * overflow-x:clip on body prevents the 100vw scrollbar edge-case.
   */
  html body:has(.dm-embed) {
    overflow-x: clip;
  }

  html body .dm-embed > .show-charts:not(.display-none),
  html body .dm-embed > .show-charts.is-empty,
  html body .dm-embed > .show-charts.is-ready,
  html body .dm-embed.dm-embed--advanced {
    box-sizing: border-box;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-left: max(8px, env(safe-area-inset-left, 0px));
    padding-right: max(8px, env(safe-area-inset-right, 0px));
    overflow: visible;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-health-map,
  html body .dm-embed > .show-charts:not(.display-none) .dm-visuals-row,
  html body .dm-embed > .show-charts:not(.display-none) .dm-advanced-profile,
  html body .dm-embed.dm-embed--advanced .dm-advanced-profile-mount,
  html body .dm-embed.dm-embed--advanced .dm-advanced-profile {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-advanced-profile,
  html body .dm-embed.dm-embed--advanced .dm-advanced-profile {
    display: block !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar.dm-signal-stack {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* Sidebar must stay flex on mobile so the accordion list lays out correctly */
  html body .dm-embed > .show-charts.is-ready .dm-sidebar.dm-signal-stack {
    display: flex !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .personal-matrix-page {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-report-header {
    width: 100%;
    max-width: 100%;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-chart-layout {
    width: 100% !important;
    max-width: 100% !important;
    align-items: stretch !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-chart-area {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 12px 8px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 16px !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-menu,
  html body .dm-embed > .show-charts:not(.display-none) .dm-signal-stack__list {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item,
  html body .dm-embed > .show-charts:not(.display-none) .dm-signal-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel,
  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel-inner,
  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel .dm-report-card {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__header {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 8px;
    min-height: var(--dm-mobile-touch-min);
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__panel-inner {
    padding: 2px 8px 14px;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-signal-stack__head {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 600px) {
  .matrix-container.personal-redesign {
    width: 100%;
    max-width: 100%;
    overflow: visible;
  }

  .personal-matrix-page {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .dm-report-header {
    padding-left: 0;
    padding-right: 0;
  }

  .dm-report-header__name {
    font-size: 1.875rem;
  }

  .dm-report-header__dob {
    font-size: 0.75rem;
    padding: 6px 12px;
  }

  .dm-chart-layout {
    width: 100%;
  }

  .dm-chart-area {
    width: 100%;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
    overflow: visible;
  }

  .dm-chart-area .pento {
    width: 100%;
    max-width: 100%;
    padding: 0;
    overflow: visible;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-chart-area #matrix,
  html body .dm-embed > .show-charts:not(.display-none) .matrix-container.personal-redesign #matrix {
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    min-width: 0 !important;
    height: auto !important;
    aspect-ratio: var(--dm-chart-aspect) !important;
    margin: 0 auto !important;
    float: none !important;
    overflow: visible !important;
    touch-action: manipulation !important;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar {
    padding: 0 0 calc(var(--dm-mobile-section-gap) + env(safe-area-inset-bottom, 0px));
  }

  .dm-report-card__sheet {
    padding: 18px 12px 16px;
  }

  .dm-report-card__insights {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .dm-arcana-sep {
    margin: 0 8px;
  }

  .dm-arcana-chip__name {
    white-space: normal;
  }

  /* Compact mobile signal stack */
  .dm-embed > .show-charts:not(.display-none) .dm-signal-stack__head {
    margin-bottom: 8px;
    padding-bottom: 8px;
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar-item__header,
  .dm-sidebar-item__header {
    padding: 14px 12px;
    min-height: var(--dm-mobile-touch-min);
  }

  .dm-embed > .show-charts:not(.display-none) .dm-sidebar .dm-sidebar-reset {
    padding: 5px 10px;
    font-size: 0.625rem;
  }

  .dm-sidebar-item__panel-inner {
    padding: 2px 12px 14px;
  }

  .dm-sidebar-item__panel .dm-report-card__insights {
    margin-top: 24px;
    gap: 20px;
  }

  .dm-sidebar-item__panel .dm-report__para,
  .dm-sidebar-item__panel .dm-report-card__reading p {
    font-size: 0.97rem;
    line-height: 1.75;
    margin-bottom: 14px;
    color: rgba(245, 242, 250, 0.92);
  }

  .dm-sidebar-item__panel .dm-report__strength,
  .dm-sidebar-item__panel .dm-report__challenge,
  .dm-sidebar-item__panel .dm-report__advice-item {
    font-size: 0.9rem;
    line-height: 1.55;
    color: rgba(235, 232, 245, 0.9);
  }

  .dm-sidebar-reset {
    padding: 5px 10px;
    font-size: 0.6875rem;
  }
}

/* Mobile spacing polish — must load after narrower breakpoints so padding is not reset */
@media (max-width: 768px) {
  html body .dm-embed > .show-charts:not(.display-none) {
    margin-top: 3.5rem;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-report-header {
    padding-top: 1.25rem;
    padding-bottom: 2rem;
    margin-bottom: 1.75rem;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-report-header__label {
    margin-bottom: 24px;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-report-header__identity.is-ready {
    gap: 20px;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-chart-area {
    max-height: none !important;
    height: auto !important;
    flex: 0 0 auto !important;
    padding-top: 8px;
    padding-bottom: var(--dm-mobile-section-gap);
    overflow: visible !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-chart-area .pento {
    max-height: none !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-chart-area #matrix,
  html body .dm-embed > .show-charts:not(.display-none) .matrix-container.personal-redesign #matrix {
    max-height: none !important;
    height: auto !important;
  }

  html body .dm-embed > .show-charts:not(.display-none) .dm-sidebar {
    padding-top: 16px;
    padding-bottom: calc(var(--dm-mobile-section-gap) + env(safe-area-inset-bottom, 0px));
    margin-top: 8px;
    position: relative !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* ── Unified brand accent for all reading cards ── */
.dm-report-card {
  --dm-section-accent: var(--dm-accent-pink-hi);
  --dm-section-glow: rgba(201, 168, 76, 0.18);
}

.dm-report-card .dm-report-card__index {
  border-color: rgba(224, 192, 106, 0.35);
  color: rgba(224, 192, 106, 0.85);
}

.dm-report-card:hover .dm-report-card__icon {
  box-shadow: 0 0 28px rgba(201, 168, 76, 0.15);
  border-color: rgba(224, 192, 106, 0.25);
}

@media (prefers-reduced-motion: reduce) {
  .dm-sidebar-item__panel,
  .dm-sidebar-item__panel-inner,
  .dm-report-card,
  .dm-arcana-chip__circle,
  .dm-sidebar-item__chevron,
  .dm-sidebar-item__chevron::before {
    animation: none !important;
    transition: none !important;
  }

  .dm-report-card:hover {
    transform: none;
  }
}


/* Detailed reading aspect blocks */
.dm-report__details {
  display: grid;
  gap: 14px;
  margin-top: 16px;
}
.dm-report__aspect {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 12px;
}
.dm-report__aspect-title {
  margin: 0 0 10px;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.78);
}
.dm-report__aspect-list {
  margin: 0;
  padding-left: 1.15rem;
  display: grid;
  gap: 8px;
  color: rgba(245, 242, 250, 0.9);
  font-size: 0.95rem;
  line-height: 1.6;
}
.dm-report__aspect--plus .dm-report__aspect-title,
.dm-report__aspect--heal .dm-report__aspect-title {
  color: #E0C06A;
}
.dm-report__aspect--minus .dm-report__aspect-title,
.dm-report__aspect--past .dm-report__aspect-title {
  color: #c9b8ff;
}
.dm-report__affirmation {
  margin: 8px 0 0;
  padding: 12px 14px;
  border-left: 3px solid #C9A84C;
  background: rgba(201, 168, 76, 0.08);
  color: rgba(255, 248, 236, 0.96);
  font-style: italic;
  font-size: 0.98rem;
  line-height: 1.65;
}
.dm-report__karmic-label {
  margin: 8px 0 0;
  font-size: 0.85rem;
  color: rgba(224, 192, 106, 0.95);
}

/* ===== FULL MATRIX REPORT ===== */
.dm-full-report {
  margin-top: clamp(32px, 5vw, 64px);
  padding: clamp(20px, 3.5vw, 42px);
  border: 1px solid rgba(224, 192, 106, 0.18);
  border-radius: 22px;
  color: var(--dm-text-primary, #f5f2fa);
  background:
    radial-gradient(720px 280px at 8% 0%, rgba(201, 168, 76, 0.12), transparent 65%),
    radial-gradient(560px 240px at 100% 20%, rgba(168, 196, 255, 0.08), transparent 60%),
    linear-gradient(155deg, rgba(22, 14, 38, 0.98), rgba(8, 5, 17, 0.99));
  box-shadow: var(--dm-shadow-lg, 0 24px 60px rgba(0, 0, 0, 0.35));
}

.dm-full-report__header {
  max-width: 720px;
  margin-bottom: clamp(22px, 3vw, 36px);
}

.dm-full-report__eyebrow,
.dm-fr-hero__eyebrow,
.dm-fr-chapter__eyebrow {
  margin: 0 0 8px;
  font: 700 0.7rem/1.3 var(--dm-font-body);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dm-accent-pink-hi, #E0C06A);
}

.dm-full-report__header h2 {
  margin: 0 0 10px;
  font: 700 clamp(1.55rem, 3.2vw, 2.15rem)/1.15 var(--dm-font-display);
  letter-spacing: -0.03em;
  color: #FFF8EC;
}

.dm-full-report__header > p {
  margin: 0;
  color: rgba(245, 242, 250, 0.72);
  font-size: 1rem;
  line-height: 1.65;
}

.dm-full-report__scroll {
  display: grid;
  gap: clamp(28px, 4vw, 48px);
}

/* Chapter */
.dm-fr-chapter {
  --dm-fr-accent: #E0C06A;
  display: grid;
  gap: 18px;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.dm-fr-chapter:first-child {
  border-top: 0;
  padding-top: 0;
}

.dm-fr-chapter__head {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.dm-fr-chapter__icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--dm-fr-accent) 45%, transparent);
  background: color-mix(in srgb, var(--dm-fr-accent) 14%, transparent);
  color: var(--dm-fr-accent);
  font-size: 1.1rem;
  flex-shrink: 0;
}

.dm-fr-chapter__title {
  margin: 0 0 4px;
  font: 700 clamp(1.25rem, 2.4vw, 1.65rem)/1.2 var(--dm-font-display);
  color: #FFF8EC;
}

.dm-fr-chapter__sub {
  margin: 0;
  color: rgba(245, 242, 250, 0.68);
  font-size: 0.95rem;
  line-height: 1.5;
}

.dm-fr-chapter__topics {
  display: grid;
  gap: 16px;
}

/* Hero glance */
.dm-full-report__hero,
.dm-fr-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(140px, 0.7fr);
  gap: 18px 22px;
  padding: clamp(18px, 3vw, 28px);
  border-radius: 20px;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(201, 168, 76, 0.14), rgba(168, 196, 255, 0.08) 45%, rgba(158, 230, 200, 0.06)),
    rgba(12, 8, 24, 0.55);
  border: 1px solid rgba(224, 192, 106, 0.22);
}

.dm-fr-hero__accent {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: linear-gradient(180deg, #E0C06A, #c9b8ff 45%, #9ee6c8);
}

.dm-fr-hero__copy {
  grid-column: 1;
  padding-left: 8px;
}

.dm-fr-hero__title {
  margin: 0 0 8px;
  font: 700 clamp(1.6rem, 3.5vw, 2.35rem)/1.12 var(--dm-font-display);
  letter-spacing: -0.035em;
  color: #fff;
}

.dm-fr-hero__sub {
  margin: 0 0 12px;
  font-size: 1.05rem;
  color: rgba(255, 248, 236, 0.82);
  line-height: 1.5;
}

.dm-fr-hero__feature {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  justify-content: center;
}

.dm-fr-hero__feature-meta {
  text-align: center;
  display: grid;
  gap: 2px;
}

.dm-fr-hero__feature-meta b {
  font-size: 1.35rem;
  color: #E0C06A;
}

.dm-fr-hero__feature-meta strong {
  font-size: 0.95rem;
  color: #fff;
}

.dm-fr-hero__feature-meta span {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(245, 242, 250, 0.55);
}

.dm-fr-hero__revelations {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.dm-fr-reveal {
  display: grid;
  justify-items: start;
  gap: 4px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.dm-fr-reveal span {
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(224, 192, 106, 0.9);
}

.dm-fr-reveal b {
  color: #fff;
  font-size: 1.15rem;
}

.dm-fr-reveal strong {
  font-size: 0.88rem;
  color: rgba(245, 242, 250, 0.85);
  font-weight: 600;
}

/* Topics */
.dm-fr-topic {
  padding: 16px 16px 18px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.dm-fr-topic__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-bottom: 12px;
}

.dm-fr-topic__kicker {
  display: block;
  width: 100%;
  margin: 0;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(245, 242, 250, 0.55);
}

.dm-fr-topic__title {
  margin: 0;
  flex: 1 1 auto;
  font: 700 1.12rem/1.3 var(--dm-font-display);
  color: #FFF8EC;
}

.dm-fr-topic__body {
  display: grid;
  gap: 13px;
}

.dm-fr-topic--nested {
  margin-top: 8px;
  padding: 12px 14px 14px;
  border-left: 3px solid var(--dm-fr-accent, #E0C06A);
  border-radius: 0 12px 12px 0;
  background: rgba(0, 0, 0, 0.18);
}

.dm-fr-children {
  display: grid;
  gap: 12px;
  margin-top: 6px;
  padding-left: 4px;
}

/* Accent-rotating labels */
.dm-fr-label {
  display: inline-block;
  margin: 6px 0 2px;
  font: 700 0.74rem/1.3 var(--dm-font-body);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.dm-fr-topic__body > .dm-fr-label:nth-of-type(4n + 1) { color: #E0C06A; }
.dm-fr-topic__body > .dm-fr-label:nth-of-type(4n + 2) { color: #c9b8ff; }
.dm-fr-topic__body > .dm-fr-label:nth-of-type(4n + 3) { color: #9ee6c8; }
.dm-fr-topic__body > .dm-fr-label:nth-of-type(4n + 4) { color: #f0c987; }

.dm-fr-text {
  margin: 0;
  font-family: var(--dm-font-body);
  font-size: 1.0125rem;
  font-weight: 400;
  line-height: 1.78;
  letter-spacing: 0.005em;
  color: rgba(248, 245, 252, 0.94);
}


.dm-fr-text--muted {
  color: rgba(245, 242, 250, 0.55);
}

.dm-fr-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 4px;
}

.dm-fr-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 6px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  font-size: 0.86rem;
  color: rgba(255, 248, 236, 0.92);
}

.dm-fr-chip b {
  color: #E0C06A;
}

.dm-fr-list {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: 9px;
  font-family: var(--dm-font-body);
  color: rgba(248, 245, 252, 0.92);
  font-size: 0.985rem;
  line-height: 1.68;
}

.dm-fr-list--plus { color: rgba(255, 220, 236, 0.95); }
.dm-fr-list--minus { color: rgba(220, 210, 255, 0.95); }

.dm-fr-grid {
  display: grid;
  gap: 12px;
}

.dm-fr-grid--ages,
.dm-fr-grid--positions {
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.dm-fr-grid--22 {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.dm-fr-age,
.dm-fr-pos,
.dm-fr-energy {
  padding: 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.07);
  display: grid;
  gap: 8px;
}

.dm-fr-age.is-current,
.dm-fr-energy.is-present {
  border-color: rgba(224, 192, 106, 0.45);
  box-shadow: 0 0 0 1px rgba(201, 168, 76, 0.15), 0 12px 28px rgba(0, 0, 0, 0.25);
  background: rgba(201, 168, 76, 0.08);
}

.dm-fr-age__yr,
.dm-fr-pos__name {
  font-size: 0.78rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(224, 192, 106, 0.9);
}

.dm-fr-pos__id {
  font-size: 0.75rem;
  color: rgba(245, 242, 250, 0.45);
}

.dm-fr-energy > header {
  display: flex;
  gap: 10px;
  align-items: center;
}

.dm-fr-energy > header strong {
  display: block;
  color: #fff;
}

.dm-fr-energy > header em {
  color: #E0C06A;
  font-style: normal;
  font-size: 0.8rem;
}

/* Tarot thumbs */
.dm-fr-tarot {
  position: relative;
  display: inline-flex;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
  flex-shrink: 0;
}

.dm-fr-tarot img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
}

.dm-fr-tarot__badge {
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: rgba(12, 8, 22, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  font: 700 0.58rem/1 'Inter', system-ui, sans-serif;
  pointer-events: none;
}

.dm-fr-tarot--lg .dm-fr-tarot__badge {
  min-width: 24px;
  height: 24px;
  font-size: 0.72rem;
}

.dm-fr-tarot--xs { width: 28px; height: 40px; }
.dm-fr-tarot--sm { width: 44px; height: 64px; }
.dm-fr-tarot--md { width: 64px; height: 92px; }
.dm-fr-tarot--lg { width: 110px; height: 160px; border-radius: 14px; }

.dm-fr-tarot--fallback {
  align-items: center;
  justify-content: center;
  color: #E0C06A;
  font-weight: 700;
}

/* Sidebar panel inner inherits report styles */
.dm-sidebar-item__panel-inner .dm-fr-chapter {
  border-top: 0;
}

.dm-sidebar-item__panel-inner .dm-full-report__hero,
.dm-sidebar-item__panel-inner .dm-fr-hero {
  margin-bottom: 8px;
}

.dm-sidebar-item__panel-inner .dm-fr-grid--22 {
  grid-template-columns: 1fr;
}

@media (max-width: 860px) {
  .dm-full-report__hero,
  .dm-fr-hero {
    grid-template-columns: 1fr;
  }

  .dm-fr-hero__feature {
    grid-column: 1;
    grid-row: auto;
    flex-direction: row;
    justify-content: flex-start;
  }

  .dm-fr-hero__feature-meta {
    text-align: left;
  }

  .dm-fr-hero__revelations {
    grid-template-columns: 1fr;
  }

  .dm-fr-grid--ages,
  .dm-fr-grid--positions,
  .dm-fr-grid--22 {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dm-full-report,
  .dm-fr-topic,
  .dm-fr-reveal {
    transition: none !important;
  }
}

/* Subtopic readability + sidebar chapter teasers */
.dm-fr-label {
  display: inline-block;
  margin: 14px 0 6px;
  padding: 3px 0;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: color-mix(in srgb, var(--dm-fr-accent, #E0C06A) 85%, #fff);
  border-bottom: 1px solid color-mix(in srgb, var(--dm-fr-accent, #E0C06A) 35%, transparent);
}

.dm-fr-topic:nth-child(4n + 1) .dm-fr-label { color: #E0C06A; }
.dm-fr-topic:nth-child(4n + 2) .dm-fr-label { color: #b8c9ff; }
.dm-fr-topic:nth-child(4n + 3) .dm-fr-label { color: #9ee6c8; }
.dm-fr-topic:nth-child(4n + 4) .dm-fr-label { color: #f0c987; }

.dm-fr-keywords {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.dm-fr-keywords em {
  font-style: normal;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  padding: 4px 8px;
  border-radius: 999px;
  color: rgba(255, 248, 236, 0.88);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.dm-fr-sidebar-teaser {
  display: grid;
  gap: 10px;
  padding: 4px 2px 10px;
}

.dm-fr-toc {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: grid;
  gap: 8px;
}

.dm-fr-toc li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.92rem;
  color: rgba(248, 245, 252, 0.86);
}

.dm-fr-toc-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.04);
}

.dm-fr-jump {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 6px;
  padding: 10px 14px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 600;
  color: #1a1218;
  background: linear-gradient(135deg, var(--dm-fr-accent, #E0C06A), color-mix(in srgb, var(--dm-fr-accent, #E0C06A) 55%, #fff));
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

.dm-fr-jump:hover {
  filter: brightness(1.05);
}

.dm-fr-rule {
  color: color-mix(in srgb, var(--dm-fr-accent, #E0C06A) 80%, #fff);
}

.dm-fr-topic__kicker {
  color: color-mix(in srgb, var(--dm-fr-accent, #E0C06A) 75%, #d8c4ff);
}

.dm-full-report__header h2 {
  /* Keep solid colour — gradient text-clip goes invisible on some mobile browsers. */
  color: #FFF8EC;
  -webkit-text-fill-color: #FFF8EC;
  background: none;
}

.dm-fr-chapter__title {
  letter-spacing: -0.02em;
}

.dm-fr-list--plus li::marker { color: #9ee6c8; }
.dm-fr-list--minus li::marker { color: #c9b8ff; }

/* ===== Beautiful section reader ===== */
.dm-sidebar-item.expanded {
  border-color: rgba(224, 192, 106, 0.28);
  background: linear-gradient(180deg, rgba(224, 192, 106, 0.07), rgba(255, 255, 255, 0.02));
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
}

.dm-sidebar-item__panel-inner .dm-fr-chapter--accordion {
  border: 0;
  padding: 6px 0 4px;
  margin: 0;
  background: transparent;
  gap: 0;
}

.dm-sidebar-item__panel-inner .dm-fr-chapter--accordion .dm-fr-topic,
.dm-sidebar-item__panel-inner .dm-fr-chapter--accordion .dm-fr-topic--nested,
.dm-sidebar-item__panel-inner .dm-reader__content .dm-fr-flat {
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.dm-reader {
  display: grid;
  gap: 14px;
}

.dm-reader__menu {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 2px 6px;
  margin: 0 -2px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.dm-reader__menu::-webkit-scrollbar { display: none; }

.dm-reader__step {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  min-width: min(220px, 78vw);
  max-width: 78vw;
  min-height: 56px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.035);
  color: rgba(255, 255, 255, 0.78);
  text-align: left;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
  -webkit-tap-highlight-color: transparent;
}

.dm-reader__step-num {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(224, 192, 106, 0.75);
}

.dm-reader__step-label {
  display: grid;
  gap: 2px;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.25;
  color: inherit;
}

.dm-reader__step-label small {
  font-size: 0.68rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.42);
}

.dm-reader__step-code {
  min-width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  color: #E0C06A;
  background: rgba(224, 192, 106, 0.12);
}

.dm-reader__step.is-on {
  border-color: rgba(224, 192, 106, 0.55);
  background: linear-gradient(135deg, rgba(224, 192, 106, 0.22), rgba(255, 255, 255, 0.05));
  color: #fff;
  box-shadow: 0 8px 20px rgba(201, 168, 76, 0.12);
}

.dm-reader__step.is-on .dm-reader__step-num,
.dm-reader__step.is-on .dm-reader__step-code {
  color: #E8D08A;
}

.dm-reader__stage {
  position: relative;
}

.dm-reader__page {
  display: none;
  animation: dmReaderIn 0.28s ease;
}

.dm-reader__page.is-on {
  display: block;
}

@keyframes dmReaderIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .dm-reader__page { animation: none; }
}

.dm-reader__head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 0 0 14px;
  padding: 0 0 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.dm-reader__head .dm-fr-tarot {
  flex-shrink: 0;
  border-radius: 12px;
}

.dm-reader__head-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.dm-reader__kicker {
  margin: 0;
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(224, 192, 106, 0.85);
}

.dm-reader__title {
  margin: 0;
  font-family: var(--dm-font-display);
  font-size: 1.2rem;
  line-height: 1.3;
  font-weight: 700;
  color: #FFF8EC;
  letter-spacing: -0.02em;
}

.dm-reader__note {
  margin: 2px 0 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: rgba(245, 242, 250, 0.55);
}

.dm-reader__content {
  display: grid;
  gap: 8px;
}

.dm-reader__content .dm-fr-text {
  font-size: 1rem;
  line-height: 1.76;
  color: rgba(248, 245, 252, 0.92);
}

.dm-reader__content .dm-fr-label {
  margin-top: 10px;
  border-bottom: 0;
  color: #E0C06A;
}

/* Restored gold Focus + summary callouts inside subtopic reader */
.dm-fr-focus {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 2px 0 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(201, 168, 76, 0.08);
  border: 1px solid rgba(201, 168, 76, 0.18);
}

.dm-fr-focus__label {
  font: 700 0.72rem/1.2 var(--dm-font-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #C9A84C;
}

.dm-fr-focus__keywords {
  font: 500 0.9rem/1.45 var(--dm-font-body);
  color: rgba(255, 248, 236, 0.9);
}

.dm-fr-callout {
  margin: 4px 0 12px;
  padding: 12px 14px 12px 18px;
  border-radius: 0 12px 12px 0;
  border-left: 3px solid #C9A84C;
  background: rgba(201, 168, 76, 0.09);
}

.dm-fr-callout__label {
  display: block;
  margin-bottom: 6px;
  font: 700 0.7rem/1.2 var(--dm-font-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #C9A84C;
}

.dm-fr-callout__text {
  margin: 0;
  font: 450 1.02rem/1.65 var(--dm-font-body);
  color: rgba(255, 248, 236, 0.96);
}

.dm-reader__content .dm-fr-chip {
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.1);
}

.dm-reader__content .dm-fr-list {
  font-size: 0.92rem;
  gap: 7px;
}

.dm-reader__pager {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  padding-top: 4px;
}

.dm-reader__navbtn {
  min-height: 42px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(255, 255, 255, 0.88);
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
  justify-self: start;
  -webkit-tap-highlight-color: transparent;
}

.dm-reader__navbtn--next {
  justify-self: end;
  border-color: rgba(224, 192, 106, 0.35);
  background: rgba(224, 192, 106, 0.14);
  color: #E8D08A;
}

.dm-reader__navbtn:disabled {
  opacity: 0.35;
  cursor: default;
}

.dm-reader__count {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.45);
  font-variant-numeric: tabular-nums;
}

.dm-reader__content .dm-fr-roles {
  margin: 0 0 8px;
  font-size: 0.86rem;
  color: rgba(255, 255, 255, 0.62);
}

.dm-reader__content .dm-fr-roles strong {
  color: #E8D08A;
}

.dm-reader__content .dm-fr-lead,
.dm-reader__content .dm-fr-merge-note {
  font-size: 0.9rem;
  color: rgba(248, 245, 252, 0.7);
}

.dm-reader__content .dm-fr-split {
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  margin: 12px 0;
}

@media (max-width: 720px) {
  .dm-reader__title {
    font-size: 1.1rem;
  }

  .dm-reader__step {
    min-width: min(200px, 82vw);
  }
}

.dm-fr-dup-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.66rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 650;
  color: #C9A84C;
  background: rgba(201, 168, 76, 0.12);
  border: 1px solid rgba(201, 168, 76, 0.28);
}

.dm-fr-roles {
  margin: 0 0 6px;
  font-size: 0.86rem;
  color: rgba(248, 245, 252, 0.7);
}

.dm-fr-roles strong {
  color: color-mix(in srgb, var(--dm-fr-accent, #E0C06A) 75%, #fff);
  font-weight: 650;
}

.dm-fr-ref {
  margin: 4px 0 8px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(201, 168, 76, 0.22);
  background: rgba(201, 168, 76, 0.06);
}

.dm-fr-ref .dm-fr-meta {
  margin-bottom: 8px;
}

.dm-fr-ref .dm-fr-text--muted {
  margin-top: 8px;
  color: rgba(245, 242, 250, 0.55);
  font-size: 0.88rem;
}

@media (max-width: 720px) {
  .dm-sidebar-item__panel-inner {
    padding-left: 10px;
    padding-right: 10px;
  }

  .dm-reader__head .dm-fr-tarot--md {
    width: 52px;
    height: 76px;
  }

  .dm-fr-chip {
    max-width: 100%;
  }
}

/* ================================================================
   CALC LOADER — staged reading calculation overlay
   ================================================================ */
body.dm-calc-locked {
  overflow: hidden;
}

.dm-calc-loader {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

.dm-calc-loader[hidden] {
  display: none !important;
}

.dm-calc-loader.is-open {
  opacity: 1;
  pointer-events: auto;
}

.dm-calc-loader.is-closing {
  opacity: 0;
  pointer-events: none;
}

.dm-calc-loader__backdrop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 50% 40%, rgba(201, 168, 76, 0.28), transparent 70%),
    rgba(5, 3, 12, 0.84);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.dm-calc-loader__card {
  position: relative;
  width: min(440px, 100%);
  max-height: min(92vh, 720px);
  overflow: auto;
  padding: 32px 28px 24px;
  border-radius: 24px;
  border: 1px solid rgba(224, 192, 106, 0.28);
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(224, 192, 106, 0.22), transparent 55%),
    radial-gradient(90% 70% at 100% 100%, rgba(201, 168, 76, 0.08), transparent 50%),
    linear-gradient(165deg, rgba(32, 24, 12, 0.98), rgba(10, 8, 6, 0.98));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04) inset,
    0 0 48px rgba(201, 168, 76, 0.12),
    0 28px 80px rgba(0, 0, 0, 0.55);
  text-align: center;
  transform: translateY(16px) scale(0.97);
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.dm-calc-loader.is-open .dm-calc-loader__card {
  transform: translateY(0) scale(1);
}

.dm-calc-loader__orb {
  position: relative;
  width: 108px;
  height: 108px;
  margin: 0 auto 20px;
}

.dm-calc-loader__ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: rgba(224, 192, 106, 0.98);
  border-right-color: rgba(201, 168, 76, 0.45);
  animation: dm-calc-spin 1.35s linear infinite;
}

.dm-calc-loader__ring--2 {
  inset: 10px;
  border-top-color: rgba(232, 208, 138, 0.9);
  border-right-color: rgba(168, 137, 46, 0.35);
  animation-duration: 2.1s;
  animation-direction: reverse;
}

.dm-calc-loader__core {
  position: absolute;
  inset: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 35% 30%, rgba(224, 192, 106, 0.28), transparent 55%),
    rgba(18, 14, 8, 0.95);
  border: 1px solid rgba(224, 192, 106, 0.35);
  box-shadow: 0 0 28px rgba(201, 168, 76, 0.28);
}

.dm-calc-loader__pct {
  font-family: var(--dm-font-display);
  font-size: 1.15rem;
  font-weight: 600;
  color: #FFF8EC;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.dm-calc-loader__eyebrow {
  margin: 0 0 6px;
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: rgba(224, 192, 106, 0.8);
}

.dm-calc-loader__title {
  margin: 0 0 4px;
  font-family: var(--dm-font-display);
  font-size: clamp(1.25rem, 3.5vw, 1.55rem);
  line-height: 1.25;
  color: #FFF8EC;
  letter-spacing: -0.02em;
  font-weight: 600;
}

.dm-calc-loader__for {
  margin: 0 0 8px;
  font-size: 0.92rem;
  color: rgba(232, 208, 138, 0.85);
  font-style: italic;
}

.dm-calc-loader__detail {
  margin: 0 0 18px;
  font-size: 0.86rem;
  line-height: 1.45;
  color: rgba(245, 242, 250, 0.58);
  min-height: 2.6em;
}

.dm-calc-loader__bar {
  height: 4px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
  margin: 0 0 20px;
}

.dm-calc-loader__bar-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #A8892E, #C9A84C, #E0C06A, #C9A84C);
  background-size: 200% 100%;
  animation: dm-calc-shimmer 2.4s linear infinite;
  transition: width 0.12s linear;
}

.dm-calc-loader__steps {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 220px;
  overflow: auto;
}

.dm-calc-loader__step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 12px;
  font-size: 0.8rem;
  line-height: 1.3;
  color: rgba(245, 242, 250, 0.38);
  transition: background 0.25s ease, color 0.25s ease;
}

.dm-calc-loader__step.is-active {
  color: #FFF8EC;
  background: rgba(224, 192, 106, 0.1);
}

.dm-calc-loader__step.is-done {
  color: rgba(245, 242, 250, 0.55);
}

.dm-calc-loader__mark {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, 0.2);
  position: relative;
  background: transparent;
}

.dm-calc-loader__step.is-active .dm-calc-loader__mark {
  border-color: #E0C06A;
  box-shadow: 0 0 0 3px rgba(224, 192, 106, 0.15);
}

.dm-calc-loader__step.is-active .dm-calc-loader__mark::after {
  content: '';
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: #E0C06A;
  animation: dm-calc-pulse 1s ease-in-out infinite;
}

.dm-calc-loader__step.is-done .dm-calc-loader__mark {
  border-color: #34d399;
  background: rgba(52, 211, 153, 0.2);
  box-shadow: 0 0 0 3px rgba(52, 211, 153, 0.12);
}

.dm-calc-loader__step.is-done .dm-calc-loader__mark::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: solid #34d399;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  animation: none;
}

.dm-calc-loader__foot {
  margin: 18px 0 0;
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  color: rgba(245, 242, 250, 0.32);
}

.dm-calc-loader.is-error .dm-calc-loader__title {
  color: #F0E2B0;
}

.dm-calc-loader__error {
  margin-top: 18px;
  text-align: center;
}

.dm-calc-loader__error-text {
  margin: 0 0 16px;
  font-size: 0.92rem;
  line-height: 1.45;
  color: rgba(255, 236, 230, 0.9);
}

.dm-calc-loader__error-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.dm-calc-loader__retry,
.dm-calc-loader__dismiss {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 11px 18px;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease;
}

.dm-calc-loader__retry {
  background: linear-gradient(180deg, #E0C06A, #C9A84C);
  color: #1A1408;
  box-shadow: 0 8px 22px rgba(201, 168, 76, 0.3);
}

.dm-calc-loader__dismiss {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 245, 240, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.14);
}

.dm-calc-loader__retry:hover,
.dm-calc-loader__dismiss:hover {
  transform: translateY(-1px);
}

.dm-calc-loader__retry:active,
.dm-calc-loader__dismiss:active {
  transform: translateY(0);
  opacity: 0.9;
}

@keyframes dm-calc-spin {
  to { transform: rotate(360deg); }
}

@keyframes dm-calc-shimmer {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

@keyframes dm-calc-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.75); }
}

@media (max-width: 520px) {
  .dm-calc-loader {
    padding: 12px;
    align-items: flex-end;
  }

  .dm-calc-loader__card {
    width: 100%;
    max-height: 88vh;
    padding: 24px 18px 18px;
    border-radius: 20px 20px 16px 16px;
  }

  .dm-calc-loader__orb {
    width: 92px;
    height: 92px;
  }

  .dm-calc-loader__core {
    inset: 18px;
  }

  .dm-calc-loader__steps {
    max-height: 180px;
  }
}

/* Shortcode section layouts — use the 3 shortcodes together on one page */
.dm-embed[data-dm-sections="map"] .dm-sidebar.dm-signal-stack,
.dm-embed[data-dm-sections="map"] .dm-advanced-profile,
.dm-embed[data-dm-sections="map"] .dm-advanced-profile-mount {
  display: none !important;
}

/* Detailed report can wait until calculate; integrated reading stays visible. */
.dm-embed[data-dm-sections="detailed"]:not(.is-ready),
.dm-detailed-report:not(.is-ready),
.dm-embed[data-dm-sections="integrated"]:not(.is-ready),
.dm-embed.dm-embed--advanced:not(.is-ready) {
  display: none !important;
}

.dm-embed[data-dm-sections="detailed"].is-ready .dm-detailed-report,
.dm-detailed-report.is-ready {
  display: block;
  width: 100%;
  max-width: 100%;
}

.dm-embed[data-dm-sections="detailed"] .dm-chart-layout--report-only {
  display: block;
  width: 100%;
}

.dm-embed[data-dm-sections="report"] .dm-advanced-profile,
.dm-embed[data-dm-sections="report"] .dm-advanced-profile-mount {
  display: none !important;
}

.dm-embed[data-dm-sections="form"] .show-charts {
  display: none !important;
}