@roxyapi/ui 0.3.1 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (165) hide show
  1. package/AGENTS.md +34 -7
  2. package/README.md +145 -26
  3. package/dist/cdn/components/ashtakavarga-grid.js +74 -19
  4. package/dist/cdn/components/ashtakavarga-grid.js.map +2 -2
  5. package/dist/cdn/components/biorhythm-chart.js +18 -4
  6. package/dist/cdn/components/biorhythm-chart.js.map +2 -2
  7. package/dist/cdn/components/choghadiya-grid.js +47 -12
  8. package/dist/cdn/components/choghadiya-grid.js.map +3 -3
  9. package/dist/cdn/components/compatibility-card.js +21 -7
  10. package/dist/cdn/components/compatibility-card.js.map +2 -2
  11. package/dist/cdn/components/dasha-timeline.js +113 -28
  12. package/dist/cdn/components/dasha-timeline.js.map +3 -3
  13. package/dist/cdn/components/data.js +27 -13
  14. package/dist/cdn/components/data.js.map +2 -2
  15. package/dist/cdn/components/divisional-chart.js +225 -118
  16. package/dist/cdn/components/divisional-chart.js.map +4 -4
  17. package/dist/cdn/components/dosha-card.js +18 -4
  18. package/dist/cdn/components/dosha-card.js.map +2 -2
  19. package/dist/cdn/components/endpoint-form.js +25 -11
  20. package/dist/cdn/components/endpoint-form.js.map +2 -2
  21. package/dist/cdn/components/guna-milan.js +20 -6
  22. package/dist/cdn/components/guna-milan.js.map +2 -2
  23. package/dist/cdn/components/hexagram.js +22 -8
  24. package/dist/cdn/components/hexagram.js.map +2 -2
  25. package/dist/cdn/components/horoscope-card.js +20 -6
  26. package/dist/cdn/components/horoscope-card.js.map +2 -2
  27. package/dist/cdn/components/kp-chart.js +19 -5
  28. package/dist/cdn/components/kp-chart.js.map +2 -2
  29. package/dist/cdn/components/kp-planets-table.js +17 -3
  30. package/dist/cdn/components/kp-planets-table.js.map +2 -2
  31. package/dist/cdn/components/kp-ruling-planets.js +17 -3
  32. package/dist/cdn/components/kp-ruling-planets.js.map +2 -2
  33. package/dist/cdn/components/location-search.js +18 -4
  34. package/dist/cdn/components/location-search.js.map +2 -2
  35. package/dist/cdn/components/moon-phase.js +27 -13
  36. package/dist/cdn/components/moon-phase.js.map +2 -2
  37. package/dist/cdn/components/nakshatra-card.js +16 -2
  38. package/dist/cdn/components/nakshatra-card.js.map +2 -2
  39. package/dist/cdn/components/natal-chart.js +79 -40
  40. package/dist/cdn/components/natal-chart.js.map +3 -3
  41. package/dist/cdn/components/numerology-card.js +18 -4
  42. package/dist/cdn/components/numerology-card.js.map +2 -2
  43. package/dist/cdn/components/panchang-table.js +53 -25
  44. package/dist/cdn/components/panchang-table.js.map +3 -3
  45. package/dist/cdn/components/shadbala-table.js +24 -10
  46. package/dist/cdn/components/shadbala-table.js.map +2 -2
  47. package/dist/cdn/components/synastry-chart.js +96 -48
  48. package/dist/cdn/components/synastry-chart.js.map +3 -3
  49. package/dist/cdn/components/tarot-card.js +17 -3
  50. package/dist/cdn/components/tarot-card.js.map +2 -2
  51. package/dist/cdn/components/tarot-spread.js +39 -25
  52. package/dist/cdn/components/tarot-spread.js.map +2 -2
  53. package/dist/cdn/components/transits-table.js +18 -4
  54. package/dist/cdn/components/transits-table.js.map +2 -2
  55. package/dist/cdn/components/vedic-kundli.js +215 -105
  56. package/dist/cdn/components/vedic-kundli.js.map +4 -4
  57. package/dist/cdn/components/vedic-planets-table.js +22 -8
  58. package/dist/cdn/components/vedic-planets-table.js.map +2 -2
  59. package/dist/cdn/components/western-planets-table.js +18 -4
  60. package/dist/cdn/components/western-planets-table.js.map +2 -2
  61. package/dist/cdn/components/yoga-list.js +17 -3
  62. package/dist/cdn/components/yoga-list.js.map +2 -2
  63. package/dist/cdn/roxy-ui.js +1082 -816
  64. package/dist/cdn/roxy-ui.js.map +4 -4
  65. package/dist/components/ashtakavarga-grid.d.ts +13 -1
  66. package/dist/components/ashtakavarga-grid.d.ts.map +1 -1
  67. package/dist/components/ashtakavarga-grid.js +86 -11
  68. package/dist/components/ashtakavarga-grid.js.map +2 -2
  69. package/dist/components/biorhythm-chart.js +14 -0
  70. package/dist/components/biorhythm-chart.js.map +2 -2
  71. package/dist/components/choghadiya-grid.d.ts +6 -0
  72. package/dist/components/choghadiya-grid.d.ts.map +1 -1
  73. package/dist/components/choghadiya-grid.js +50 -2
  74. package/dist/components/choghadiya-grid.js.map +2 -2
  75. package/dist/components/compatibility-card.js +14 -0
  76. package/dist/components/compatibility-card.js.map +2 -2
  77. package/dist/components/dasha-timeline.d.ts +10 -0
  78. package/dist/components/dasha-timeline.d.ts.map +1 -1
  79. package/dist/components/dasha-timeline.js +135 -4
  80. package/dist/components/dasha-timeline.js.map +2 -2
  81. package/dist/components/data.js +14 -0
  82. package/dist/components/data.js.map +2 -2
  83. package/dist/components/divisional-chart.d.ts +9 -6
  84. package/dist/components/divisional-chart.d.ts.map +1 -1
  85. package/dist/components/divisional-chart.js +546 -251
  86. package/dist/components/divisional-chart.js.map +4 -4
  87. package/dist/components/dosha-card.js +14 -0
  88. package/dist/components/dosha-card.js.map +2 -2
  89. package/dist/components/endpoint-form.js +14 -0
  90. package/dist/components/endpoint-form.js.map +2 -2
  91. package/dist/components/guna-milan.js +14 -0
  92. package/dist/components/guna-milan.js.map +2 -2
  93. package/dist/components/hexagram.js +14 -0
  94. package/dist/components/hexagram.js.map +2 -2
  95. package/dist/components/horoscope-card.js +14 -0
  96. package/dist/components/horoscope-card.js.map +2 -2
  97. package/dist/components/kp-chart.js +14 -0
  98. package/dist/components/kp-chart.js.map +2 -2
  99. package/dist/components/kp-planets-table.js +14 -0
  100. package/dist/components/kp-planets-table.js.map +2 -2
  101. package/dist/components/kp-ruling-planets.js +14 -0
  102. package/dist/components/kp-ruling-planets.js.map +2 -2
  103. package/dist/components/location-search.js +14 -0
  104. package/dist/components/location-search.js.map +2 -2
  105. package/dist/components/moon-phase.js +14 -0
  106. package/dist/components/moon-phase.js.map +2 -2
  107. package/dist/components/nakshatra-card.js +14 -0
  108. package/dist/components/nakshatra-card.js.map +2 -2
  109. package/dist/components/natal-chart.d.ts.map +1 -1
  110. package/dist/components/natal-chart.js +76 -6
  111. package/dist/components/natal-chart.js.map +2 -2
  112. package/dist/components/numerology-card.js +14 -0
  113. package/dist/components/numerology-card.js.map +2 -2
  114. package/dist/components/panchang-table.d.ts +1 -0
  115. package/dist/components/panchang-table.d.ts.map +1 -1
  116. package/dist/components/panchang-table.js +37 -1
  117. package/dist/components/panchang-table.js.map +2 -2
  118. package/dist/components/shadbala-table.js +14 -0
  119. package/dist/components/shadbala-table.js.map +2 -2
  120. package/dist/components/synastry-chart.d.ts +6 -0
  121. package/dist/components/synastry-chart.d.ts.map +1 -1
  122. package/dist/components/synastry-chart.js +106 -7
  123. package/dist/components/synastry-chart.js.map +2 -2
  124. package/dist/components/tarot-card.js +14 -0
  125. package/dist/components/tarot-card.js.map +2 -2
  126. package/dist/components/tarot-spread.js +14 -0
  127. package/dist/components/tarot-spread.js.map +2 -2
  128. package/dist/components/transits-table.js +14 -0
  129. package/dist/components/transits-table.js.map +2 -2
  130. package/dist/components/vedic-kundli.d.ts +14 -9
  131. package/dist/components/vedic-kundli.d.ts.map +1 -1
  132. package/dist/components/vedic-kundli.js +537 -245
  133. package/dist/components/vedic-kundli.js.map +4 -4
  134. package/dist/components/vedic-planets-table.js +14 -0
  135. package/dist/components/vedic-planets-table.js.map +2 -2
  136. package/dist/components/western-planets-table.js +14 -0
  137. package/dist/components/western-planets-table.js.map +2 -2
  138. package/dist/components/yoga-list.js +14 -0
  139. package/dist/components/yoga-list.js.map +2 -2
  140. package/dist/index.cjs +1397 -797
  141. package/dist/index.cjs.map +4 -4
  142. package/dist/index.js +1278 -678
  143. package/dist/index.js.map +4 -4
  144. package/dist/manifest.json +23 -23
  145. package/dist/styles/tokens.css +8 -23
  146. package/dist/utils/base-styles.d.ts.map +1 -1
  147. package/dist/utils/kundli-render.d.ts +43 -104
  148. package/dist/utils/kundli-render.d.ts.map +1 -1
  149. package/dist/utils/kundli-styles.d.ts +13 -0
  150. package/dist/utils/kundli-styles.d.ts.map +1 -0
  151. package/dist/version.d.ts +1 -1
  152. package/package.json +1 -1
  153. package/src/components/ashtakavarga-grid.ts +73 -11
  154. package/src/components/choghadiya-grid.ts +37 -2
  155. package/src/components/dasha-timeline.ts +135 -4
  156. package/src/components/divisional-chart.ts +40 -97
  157. package/src/components/natal-chart.ts +89 -6
  158. package/src/components/panchang-table.ts +34 -1
  159. package/src/components/synastry-chart.ts +84 -8
  160. package/src/components/vedic-kundli.ts +35 -95
  161. package/src/styles/tokens.css +8 -23
  162. package/src/utils/base-styles.ts +14 -0
  163. package/src/utils/kundli-render.ts +609 -270
  164. package/src/utils/kundli-styles.ts +124 -0
  165. package/src/version.ts +1 -1
@@ -140,6 +140,20 @@ var baseStyles = css`
140
140
  outline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));
141
141
  outline-offset: 2px;
142
142
  }
143
+
144
+ /* Force the text-style variant on every Unicode glyph in the component.
145
+ * macOS and iOS substitute coloured emoji glyphs for the planetary and
146
+ * gender Unicode code points (Mars, Venus, Mercury, etc.) when the
147
+ * system colour-emoji font wins font selection. The text-style variant
148
+ * keeps glyphs monochrome so they inherit the surrounding fill colour
149
+ * and match the brand palette consistently across platforms.
150
+ *
151
+ * font-variant-emoji is part of CSS Fonts 4 (Safari 17+, Chrome 134+,
152
+ * Firefox 139+). On older browsers the rule is silently ignored.
153
+ */
154
+ :host {
155
+ font-variant-emoji: text;
156
+ }
143
157
  `;
144
158
 
145
159
  // packages/ui/src/utils/format.ts
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/components/shadbala-table.ts", "../../src/tokens/index.ts", "../../src/utils/base-styles.ts", "../../src/utils/format.ts", "../../src/utils/string.ts"],
4
- "sourcesContent": ["import { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { PLANET_GLYPH } from '../tokens/index.js';\nimport type { ShadbalaResponse } from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\nimport { formatNumber } from '../utils/format.js';\nimport { capitalize } from '../utils/string.js';\n\ntype Planet = ShadbalaResponse['planets'][number];\n\n/** CSS variable and display name for each of the 6 bala components. */\nconst BALA_COMPONENTS: Array<{\n\tkey: keyof Pick<\n\t\tPlanet,\n\t\t| 'sthanaBala'\n\t\t| 'digBala'\n\t\t| 'kalaBala'\n\t\t| 'chestaBala'\n\t\t| 'naisargikaBala'\n\t\t| 'drikBala'\n\t>;\n\tlabel: string;\n\tcolor: string;\n}> = [\n\t{ key: 'sthanaBala', label: 'Sthana', color: 'var(--roxy-info, #0284c7)' },\n\t{ key: 'digBala', label: 'Dig', color: 'var(--roxy-success, #16a34a)' },\n\t{ key: 'kalaBala', label: 'Kala', color: 'var(--roxy-warning, #ea580c)' },\n\t{ key: 'chestaBala', label: 'Chesta', color: 'var(--roxy-accent, #f59e0b)' },\n\t{\n\t\tkey: 'naisargikaBala',\n\t\tlabel: 'Naisargika',\n\t\tcolor: 'var(--roxy-secondary, #475569)',\n\t},\n\t{ key: 'drikBala', label: 'Drik', color: 'var(--roxy-danger, #dc2626)' },\n];\n\n/**\n * Shadbala six-fold planetary strength table with stacked bar visualization.\n * Pass `data` from /vedic-astrology/shadbala.\n */\n@customElement('roxy-shadbala-table')\nexport class RoxyShadbalaTable extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`\n\t\t\t.wrap {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t}\n\n\t\t\t.head {\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: space-between;\n\t\t\t\talign-items: baseline;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t\tflex-wrap: wrap;\n\t\t\t}\n\n\t\t\t.title {\n\t\t\t\tfont-size: var(--roxy-text-lg, 1.125rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.subtitle {\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.planet-row {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: 8rem 1fr auto;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: var(--roxy-space-sm, 0.5rem);\n\t\t\t\tpadding: var(--roxy-space-sm, 0.5rem) 0;\n\t\t\t\tborder-bottom: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t}\n\n\t\t\t.planet-row:last-of-type {\n\t\t\t\tborder-bottom: none;\n\t\t\t}\n\n\t\t\t.planet-label {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 6px;\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t}\n\n\t\t\t.glyph {\n\t\t\t\tfont-size: 1.2em;\n\t\t\t\tline-height: 1;\n\t\t\t}\n\n\t\t\t.bar-wrap {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\tgap: 4px;\n\t\t\t}\n\n\t\t\t.bar {\n\t\t\t\tdisplay: flex;\n\t\t\t\theight: 12px;\n\t\t\t\tborder-radius: var(--roxy-radius-sm, 4px);\n\t\t\t\toverflow: hidden;\n\t\t\t\tbackground: var(--roxy-border, #e4e4e7);\n\t\t\t}\n\n\t\t\t.bar-segment {\n\t\t\t\theight: 100%;\n\t\t\t\ttransition: flex-grow var(--roxy-motion-duration, 200ms)\n\t\t\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1));\n\t\t\t}\n\n\t\t\t.pills {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\talign-items: flex-end;\n\t\t\t\tgap: 4px;\n\t\t\t}\n\n\t\t\t.rupas-label {\n\t\t\t\tfont-variant-numeric: tabular-nums;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\twhite-space: nowrap;\n\t\t\t}\n\n\t\t\t.adequacy-badge {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpadding: 1px 6px;\n\t\t\t\tborder-radius: var(--roxy-radius-full, 9999px);\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t}\n\n\t\t\t.adequacy-badge--adequate {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-success, #16a34a) 12%, transparent);\n\t\t\t\tcolor: var(--roxy-success-fg, #166534);\n\t\t\t}\n\n\t\t\t.adequacy-badge--weak {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-danger, #dc2626) 12%, transparent);\n\t\t\t\tcolor: var(--roxy-danger-fg, #991b1b);\n\t\t\t}\n\n\t\t\t.rank-badge {\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-accent-fg, #b45309);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t}\n\n\t\t\t.legend {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-wrap: wrap;\n\t\t\t\tgap: var(--roxy-space-sm, 0.5rem) var(--roxy-space-md, 1rem);\n\t\t\t\tborder-top: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tpadding-top: var(--roxy-space-sm, 0.5rem);\n\t\t\t}\n\n\t\t\t.legend-row {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 6px;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t}\n\n\t\t\t.legend-swatch {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\twidth: 10px;\n\t\t\t\theight: 10px;\n\t\t\t\tborder-radius: var(--roxy-radius-sm, 4px);\n\t\t\t\tflex-shrink: 0;\n\t\t\t}\n\n\t\t\t@container (max-width: 480px) {\n\t\t\t\t.planet-row {\n\t\t\t\t\tgrid-template-columns: 6rem 1fr;\n\t\t\t\t\tgrid-template-rows: auto auto;\n\t\t\t\t}\n\t\t\t\t.pills {\n\t\t\t\t\tgrid-column: 1 / -1;\n\t\t\t\t\tflex-direction: row;\n\t\t\t\t\talign-items: center;\n\t\t\t\t\tjustify-content: flex-start;\n\t\t\t\t}\n\t\t\t}\n\t\t`,\n\t];\n\n\t@property({ attribute: false })\n\tdata: ShadbalaResponse | null = null;\n\n\trender() {\n\t\tif (!this.data?.planets?.length) {\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No shadbala data</div>`;\n\t\t}\n\n\t\tconst sorted = [...this.data.planets].sort(\n\t\t\t(a, b) => a.relativeRank - b.relativeRank,\n\t\t);\n\n\t\treturn html`<div class=\"wrap\" aria-label=\"Shadbala planetary strength\">\n\t\t\t<div class=\"head\">\n\t\t\t\t<h2 class=\"title\">Shadbala</h2>\n\t\t\t\t<p class=\"subtitle\">${sorted.length} planets ranked by strength</p>\n\t\t\t</div>\n\n\t\t\t<div role=\"list\" aria-label=\"Planet strength bars\">\n\t\t\t\t${sorted.map((p) => this.renderPlanetRow(p))}\n\t\t\t</div>\n\n\t\t\t<div class=\"legend\" aria-label=\"Strength component legend\">\n\t\t\t\t${BALA_COMPONENTS.map(\n\t\t\t\t\t(b) => html`<div class=\"legend-row\">\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclass=\"legend-swatch\"\n\t\t\t\t\t\t\tstyle=\"background: ${b.color}\"\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t></span>\n\t\t\t\t\t\t${b.label}\n\t\t\t\t\t</div>`,\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>`;\n\t}\n\n\tprivate renderPlanetRow(p: Planet) {\n\t\tconst glyph = PLANET_GLYPH[capitalize(p.planet)] ?? '';\n\n\t\t// Compute positive component values (drikBala can be negative)\n\t\tconst values = BALA_COMPONENTS.map((b) => Math.max(0, p[b.key] as number));\n\t\tconst total = values.reduce((s, v) => s + v, 0);\n\n\t\tconst isAdequate =\n\t\t\ttypeof p.strengthRatio === 'number' && p.strengthRatio >= 1;\n\t\tconst badgeClass = isAdequate\n\t\t\t? 'adequacy-badge--adequate'\n\t\t\t: 'adequacy-badge--weak';\n\t\tconst badgeLabel = isAdequate ? 'adequate' : 'weak';\n\n\t\tconst rupasStr =\n\t\t\tformatNumber(p.totalRupas, 2) && formatNumber(p.minRequired, 2)\n\t\t\t\t? `${formatNumber(p.totalRupas, 2)} / ${formatNumber(p.minRequired, 2)} R`\n\t\t\t\t: '';\n\n\t\treturn html`<div class=\"planet-row\" role=\"listitem\" aria-label=\"${p.planet} shadbala\">\n\t\t\t<div class=\"planet-label\">\n\t\t\t\t<span class=\"glyph\" aria-hidden=\"true\">${glyph}</span>\n\t\t\t\t${p.planet}\n\t\t\t\t<span class=\"rank-badge\" aria-label=\"rank ${p.relativeRank}\">#${p.relativeRank}</span>\n\t\t\t</div>\n\t\t\t<div class=\"bar-wrap\">\n\t\t\t\t<div class=\"bar\" role=\"img\" aria-label=\"Strength components for ${p.planet}\">\n\t\t\t\t\t${\n\t\t\t\t\t\ttotal > 0\n\t\t\t\t\t\t\t? BALA_COMPONENTS.map((b, i) => {\n\t\t\t\t\t\t\t\t\tconst v = values[i];\n\t\t\t\t\t\t\t\t\tif (v <= 0) return nothing;\n\t\t\t\t\t\t\t\t\tconst grow = (v / total) * 100;\n\t\t\t\t\t\t\t\t\treturn html`<div\n\t\t\t\t\t\t\t\t\tclass=\"bar-segment\"\n\t\t\t\t\t\t\t\t\tstyle=\"flex-grow: ${grow}; background: ${b.color};\"\n\t\t\t\t\t\t\t\t\ttitle=\"${b.label}: ${formatNumber(v, 1)}\"\n\t\t\t\t\t\t\t\t></div>`;\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div class=\"pills\">\n\t\t\t\t${rupasStr ? html`<span class=\"rupas-label\">${rupasStr}</span>` : nothing}\n\t\t\t\t<span class=\"${`adequacy-badge ${badgeClass}`}\">${badgeLabel}</span>\n\t\t\t</div>\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-shadbala-table': RoxyShadbalaTable;\n\t}\n}\n", "/**\n * Symbol constants used across components. Single source of truth so chart\n * wheels, card headers, hexagram displays, and panchang tables stay visually\n * consistent.\n */\n\nexport const PLANET_GLYPH: Record<string, string> = {\n\tSun: '\u2609',\n\tMoon: '\u263D',\n\tMercury: '\u263F',\n\tVenus: '\u2640',\n\tEarth: '\u2641',\n\tMars: '\u2642',\n\tJupiter: '\u2643',\n\tSaturn: '\u2644',\n\tUranus: '\u2645',\n\tNeptune: '\u2646',\n\tPluto: '\u2647',\n\tRahu: '\u260A',\n\tKetu: '\u260B',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n\tNorthNode: '\u260A',\n\tSouthNode: '\u260B',\n\t'North node': '\u260A',\n\t'South node': '\u260B',\n\tChiron: '\u26B7',\n\tLilith: '\u26B8',\n\t'Black moon lilith': '\u26B8',\n};\n\nexport const PLANET_ABBR: Record<string, string> = {\n\tSun: 'Su',\n\tMoon: 'Mo',\n\tMercury: 'Me',\n\tVenus: 'Ve',\n\tMars: 'Ma',\n\tJupiter: 'Ju',\n\tSaturn: 'Sa',\n\tUranus: 'Ur',\n\tNeptune: 'Ne',\n\tPluto: 'Pl',\n\tRahu: 'Ra',\n\tKetu: 'Ke',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n};\n\nexport const SIGN_GLYPH: Record<string, string> = {\n\tAries: '\u2648',\n\tTaurus: '\u2649',\n\tGemini: '\u264A',\n\tCancer: '\u264B',\n\tLeo: '\u264C',\n\tVirgo: '\u264D',\n\tLibra: '\u264E',\n\tScorpio: '\u264F',\n\tSagittarius: '\u2650',\n\tCapricorn: '\u2651',\n\tAquarius: '\u2652',\n\tPisces: '\u2653',\n};\n\nexport const SIGN_ABBR: Record<string, string> = {\n\tAries: 'Ar',\n\tTaurus: 'Ta',\n\tGemini: 'Ge',\n\tCancer: 'Cn',\n\tLeo: 'Le',\n\tVirgo: 'Vi',\n\tLibra: 'Li',\n\tScorpio: 'Sc',\n\tSagittarius: 'Sg',\n\tCapricorn: 'Cp',\n\tAquarius: 'Aq',\n\tPisces: 'Pi',\n};\n\nexport const SIGNS_ORDER = [\n\t'Aries',\n\t'Taurus',\n\t'Gemini',\n\t'Cancer',\n\t'Leo',\n\t'Virgo',\n\t'Libra',\n\t'Scorpio',\n\t'Sagittarius',\n\t'Capricorn',\n\t'Aquarius',\n\t'Pisces',\n] as const;\n\n/**\n * Lowercase rashi keys in canonical zodiac order. Derived from `SIGNS_ORDER`\n * so the two stay in lockstep. The /vedic-astrology/birth-chart response\n * carries planet buckets keyed by these names.\n */\nexport const RASHI_KEYS = SIGNS_ORDER.map((s) =>\n\ts.toLowerCase(),\n) as readonly Lowercase<(typeof SIGNS_ORDER)[number]>[];\n\n/** Aspect symbols. Used by synastry and natal chart aspect tables. */\nexport const ASPECT_SYMBOL: Record<string, string> = {\n\tconjunction: '\u260C',\n\topposition: '\u260D',\n\ttrine: '\u25B3',\n\tsquare: '\u25A1',\n\tsextile: '\u2731',\n\tquincunx: '\u22BB',\n\tsemisextile: '\u22BC',\n};\n\n/** Trigrams used by I Ching hexagrams. Eight trigrams compose 64 hexagrams. */\nexport const TRIGRAM_GLYPH: Record<string, string> = {\n\theaven: '\u2630',\n\tlake: '\u2631',\n\tfire: '\u2632',\n\tthunder: '\u2633',\n\twind: '\u2634',\n\twater: '\u2635',\n\tmountain: '\u2636',\n\tearth: '\u2637',\n\tHeaven: '\u2630',\n\tLake: '\u2631',\n\tFire: '\u2632',\n\tThunder: '\u2633',\n\tWind: '\u2634',\n\tWater: '\u2635',\n\tMountain: '\u2636',\n\tEarth: '\u2637',\n};\n\n/** Moon phase emoji set. Used by moon phase card. */\nexport const MOON_PHASE_EMOJI: Record<string, string> = {\n\t'new moon': '\uD83C\uDF11',\n\t'waxing crescent': '\uD83C\uDF12',\n\t'first quarter': '\uD83C\uDF13',\n\t'waxing gibbous': '\uD83C\uDF14',\n\t'full moon': '\uD83C\uDF15',\n\t'waning gibbous': '\uD83C\uDF16',\n\t'last quarter': '\uD83C\uDF17',\n\t'waning crescent': '\uD83C\uDF18',\n};\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tcontainer-type: inline-size;\n\t\tfont-family: var(\n\t\t\t--roxy-font-sans,\n\t\t\tsystem-ui,\n\t\t\t-apple-system,\n\t\t\tBlinkMacSystemFont,\n\t\t\t'Segoe UI',\n\t\t\tRoboto,\n\t\t\tsans-serif\n\t\t);\n\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\tbackground: transparent;\n\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\tline-height: var(--roxy-leading-normal, 1.5);\n\t\tanimation: roxy-fade-in var(--roxy-motion-duration, 200ms)\n\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;\n\t}\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: border-box;\n\t}\n\n\t@keyframes roxy-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: translateY(2px);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: translateY(0);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-skeleton {\n\t\tbackground: linear-gradient(\n\t\t\t90deg,\n\t\t\tvar(--roxy-border, #e4e4e7) 0%,\n\t\t\tcolor-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent) 50%,\n\t\t\tvar(--roxy-border, #e4e4e7) 100%\n\t\t);\n\t\tbackground-size: 200% 100%;\n\t\tanimation: roxy-shimmer 1.4s ease-in-out infinite;\n\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t}\n\n\t@keyframes roxy-shimmer {\n\t\t0% {\n\t\t\tbackground-position: 200% 0;\n\t\t}\n\t\t100% {\n\t\t\tbackground-position: -200% 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.roxy-skeleton {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-empty {\n\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\tcolor: var(--roxy-muted, #71717a);\n\t\ttext-align: center;\n\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t}\n\n\t:host(:focus-within) .roxy-card {\n\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\toutline-offset: 2px;\n\t}\n`;\n", "/**\n * Display formatters for ISO timestamps and floats coming back from the API.\n * Every helper returns \"\" for nullish or unparseable input so it falls out of\n * template literals cleanly.\n */\n\nexport function formatTime(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tif (/^\\d{4}-\\d{2}-\\d{2}$/.test(input)) return '';\n\tconst bareTime = /^\\d{2}:\\d{2}(:\\d{2})?$/.test(input);\n\tconst iso = bareTime ? `1970-01-01T${input}` : input;\n\tconst d = new Date(iso);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleTimeString(undefined, {\n\t\thour: 'numeric',\n\t\tminute: '2-digit',\n\t\thour12: true,\n\t});\n}\n\nexport function formatDate(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tconst d = new Date(\n\t\t/^\\d{4}-\\d{2}-\\d{2}$/.test(input) ? `${input}T00:00:00` : input,\n\t);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleDateString(undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t\tyear: 'numeric',\n\t});\n}\n\nexport function formatTimeRange(\n\tt: { start?: string; end?: string } | undefined,\n): string {\n\tif (!t) return '';\n\tconst start = formatTime(t.start);\n\tconst end = formatTime(t.end);\n\tif (start && end) return `${start} - ${end}`;\n\treturn start || end || '';\n}\n\nexport function formatNumber(value: unknown, dp = 1): string {\n\tif (typeof value !== 'number' || !Number.isFinite(value)) return '';\n\treturn value.toFixed(dp).replace(/\\.?0+$/, '');\n}\n\nexport function formatPercent(value: unknown, dp = 1): string {\n\tconst n = formatNumber(value, dp);\n\treturn n ? `${n}%` : '';\n}\n\n/**\n * CSS class name per aspect type. Used by natal and synastry chart aspect\n * lines so the same color encoding (harmonious vs challenging) applies in\n * both wheels. Keys are lowercase canonical names, values are CSS class\n * suffixes the chart components define in their `:host` styles.\n */\nexport const ASPECT_CLASS: Record<string, string> = {\n\tconjunction: 'aspect-conjunction',\n\tsextile: 'aspect-sextile',\n\tsquare: 'aspect-square',\n\ttrine: 'aspect-trine',\n\topposition: 'aspect-opposition',\n};\n\n/**\n * Normalize the `type` field on an aspect entry to a lowercase, hyphen-separated\n * canonical name (`SEMI_SEXTILE` \u2192 `semi-sextile`). Accepts any aspect-shaped\n * object so both natal and synastry inter-aspect entries can share this.\n */\nexport function normalizeAspect(a: { type?: string }): string {\n\treturn (a.type ?? '').toLowerCase().replace(/_/g, '-');\n}\n", "/**\n * Shared string helpers used across components. Single source of truth so the\n * same formatting rules apply to every key/label/title that surfaces in the\n * shadow tree.\n *\n * - `capitalize`: title-cases the first character, lowercases the rest. Used\n * when matching API-supplied planet/sign names against the glyph maps in\n * `tokens/index.ts`, which use canonical TitleCase keys.\n * - `humanize`: turns an API key (`birth_date`, `birthDate`, `mahadasha-end`)\n * into a label suitable for display (\"Birth date\", \"Mahadasha end\").\n */\n\nexport function capitalize(s: string): string {\n\tif (!s) return '';\n\treturn s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();\n}\n\nexport function humanize(s: string): string {\n\treturn s\n\t\t.replace(/[_-]+/g, ' ')\n\t\t.replace(/([a-z])([A-Z])/g, '$1 $2')\n\t\t.replace(/^\\w/, (c) => c.toUpperCase());\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { PLANET_GLYPH } from '../tokens/index.js';\nimport type { ShadbalaResponse } from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\nimport { formatNumber } from '../utils/format.js';\nimport { capitalize } from '../utils/string.js';\n\ntype Planet = ShadbalaResponse['planets'][number];\n\n/** CSS variable and display name for each of the 6 bala components. */\nconst BALA_COMPONENTS: Array<{\n\tkey: keyof Pick<\n\t\tPlanet,\n\t\t| 'sthanaBala'\n\t\t| 'digBala'\n\t\t| 'kalaBala'\n\t\t| 'chestaBala'\n\t\t| 'naisargikaBala'\n\t\t| 'drikBala'\n\t>;\n\tlabel: string;\n\tcolor: string;\n}> = [\n\t{ key: 'sthanaBala', label: 'Sthana', color: 'var(--roxy-info, #0284c7)' },\n\t{ key: 'digBala', label: 'Dig', color: 'var(--roxy-success, #16a34a)' },\n\t{ key: 'kalaBala', label: 'Kala', color: 'var(--roxy-warning, #ea580c)' },\n\t{ key: 'chestaBala', label: 'Chesta', color: 'var(--roxy-accent, #f59e0b)' },\n\t{\n\t\tkey: 'naisargikaBala',\n\t\tlabel: 'Naisargika',\n\t\tcolor: 'var(--roxy-secondary, #475569)',\n\t},\n\t{ key: 'drikBala', label: 'Drik', color: 'var(--roxy-danger, #dc2626)' },\n];\n\n/**\n * Shadbala six-fold planetary strength table with stacked bar visualization.\n * Pass `data` from /vedic-astrology/shadbala.\n */\n@customElement('roxy-shadbala-table')\nexport class RoxyShadbalaTable extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`\n\t\t\t.wrap {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t}\n\n\t\t\t.head {\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: space-between;\n\t\t\t\talign-items: baseline;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t\tflex-wrap: wrap;\n\t\t\t}\n\n\t\t\t.title {\n\t\t\t\tfont-size: var(--roxy-text-lg, 1.125rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.subtitle {\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.planet-row {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: 8rem 1fr auto;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: var(--roxy-space-sm, 0.5rem);\n\t\t\t\tpadding: var(--roxy-space-sm, 0.5rem) 0;\n\t\t\t\tborder-bottom: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t}\n\n\t\t\t.planet-row:last-of-type {\n\t\t\t\tborder-bottom: none;\n\t\t\t}\n\n\t\t\t.planet-label {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 6px;\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t}\n\n\t\t\t.glyph {\n\t\t\t\tfont-size: 1.2em;\n\t\t\t\tline-height: 1;\n\t\t\t}\n\n\t\t\t.bar-wrap {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\tgap: 4px;\n\t\t\t}\n\n\t\t\t.bar {\n\t\t\t\tdisplay: flex;\n\t\t\t\theight: 12px;\n\t\t\t\tborder-radius: var(--roxy-radius-sm, 4px);\n\t\t\t\toverflow: hidden;\n\t\t\t\tbackground: var(--roxy-border, #e4e4e7);\n\t\t\t}\n\n\t\t\t.bar-segment {\n\t\t\t\theight: 100%;\n\t\t\t\ttransition: flex-grow var(--roxy-motion-duration, 200ms)\n\t\t\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1));\n\t\t\t}\n\n\t\t\t.pills {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction: column;\n\t\t\t\talign-items: flex-end;\n\t\t\t\tgap: 4px;\n\t\t\t}\n\n\t\t\t.rupas-label {\n\t\t\t\tfont-variant-numeric: tabular-nums;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\twhite-space: nowrap;\n\t\t\t}\n\n\t\t\t.adequacy-badge {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tpadding: 1px 6px;\n\t\t\t\tborder-radius: var(--roxy-radius-full, 9999px);\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t}\n\n\t\t\t.adequacy-badge--adequate {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-success, #16a34a) 12%, transparent);\n\t\t\t\tcolor: var(--roxy-success-fg, #166534);\n\t\t\t}\n\n\t\t\t.adequacy-badge--weak {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-danger, #dc2626) 12%, transparent);\n\t\t\t\tcolor: var(--roxy-danger-fg, #991b1b);\n\t\t\t}\n\n\t\t\t.rank-badge {\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-accent-fg, #b45309);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t}\n\n\t\t\t.legend {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-wrap: wrap;\n\t\t\t\tgap: var(--roxy-space-sm, 0.5rem) var(--roxy-space-md, 1rem);\n\t\t\t\tborder-top: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tpadding-top: var(--roxy-space-sm, 0.5rem);\n\t\t\t}\n\n\t\t\t.legend-row {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: 6px;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t}\n\n\t\t\t.legend-swatch {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\twidth: 10px;\n\t\t\t\theight: 10px;\n\t\t\t\tborder-radius: var(--roxy-radius-sm, 4px);\n\t\t\t\tflex-shrink: 0;\n\t\t\t}\n\n\t\t\t@container (max-width: 480px) {\n\t\t\t\t.planet-row {\n\t\t\t\t\tgrid-template-columns: 6rem 1fr;\n\t\t\t\t\tgrid-template-rows: auto auto;\n\t\t\t\t}\n\t\t\t\t.pills {\n\t\t\t\t\tgrid-column: 1 / -1;\n\t\t\t\t\tflex-direction: row;\n\t\t\t\t\talign-items: center;\n\t\t\t\t\tjustify-content: flex-start;\n\t\t\t\t}\n\t\t\t}\n\t\t`,\n\t];\n\n\t@property({ attribute: false })\n\tdata: ShadbalaResponse | null = null;\n\n\trender() {\n\t\tif (!this.data?.planets?.length) {\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No shadbala data</div>`;\n\t\t}\n\n\t\tconst sorted = [...this.data.planets].sort(\n\t\t\t(a, b) => a.relativeRank - b.relativeRank,\n\t\t);\n\n\t\treturn html`<div class=\"wrap\" aria-label=\"Shadbala planetary strength\">\n\t\t\t<div class=\"head\">\n\t\t\t\t<h2 class=\"title\">Shadbala</h2>\n\t\t\t\t<p class=\"subtitle\">${sorted.length} planets ranked by strength</p>\n\t\t\t</div>\n\n\t\t\t<div role=\"list\" aria-label=\"Planet strength bars\">\n\t\t\t\t${sorted.map((p) => this.renderPlanetRow(p))}\n\t\t\t</div>\n\n\t\t\t<div class=\"legend\" aria-label=\"Strength component legend\">\n\t\t\t\t${BALA_COMPONENTS.map(\n\t\t\t\t\t(b) => html`<div class=\"legend-row\">\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclass=\"legend-swatch\"\n\t\t\t\t\t\t\tstyle=\"background: ${b.color}\"\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t></span>\n\t\t\t\t\t\t${b.label}\n\t\t\t\t\t</div>`,\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>`;\n\t}\n\n\tprivate renderPlanetRow(p: Planet) {\n\t\tconst glyph = PLANET_GLYPH[capitalize(p.planet)] ?? '';\n\n\t\t// Compute positive component values (drikBala can be negative)\n\t\tconst values = BALA_COMPONENTS.map((b) => Math.max(0, p[b.key] as number));\n\t\tconst total = values.reduce((s, v) => s + v, 0);\n\n\t\tconst isAdequate =\n\t\t\ttypeof p.strengthRatio === 'number' && p.strengthRatio >= 1;\n\t\tconst badgeClass = isAdequate\n\t\t\t? 'adequacy-badge--adequate'\n\t\t\t: 'adequacy-badge--weak';\n\t\tconst badgeLabel = isAdequate ? 'adequate' : 'weak';\n\n\t\tconst rupasStr =\n\t\t\tformatNumber(p.totalRupas, 2) && formatNumber(p.minRequired, 2)\n\t\t\t\t? `${formatNumber(p.totalRupas, 2)} / ${formatNumber(p.minRequired, 2)} R`\n\t\t\t\t: '';\n\n\t\treturn html`<div class=\"planet-row\" role=\"listitem\" aria-label=\"${p.planet} shadbala\">\n\t\t\t<div class=\"planet-label\">\n\t\t\t\t<span class=\"glyph\" aria-hidden=\"true\">${glyph}</span>\n\t\t\t\t${p.planet}\n\t\t\t\t<span class=\"rank-badge\" aria-label=\"rank ${p.relativeRank}\">#${p.relativeRank}</span>\n\t\t\t</div>\n\t\t\t<div class=\"bar-wrap\">\n\t\t\t\t<div class=\"bar\" role=\"img\" aria-label=\"Strength components for ${p.planet}\">\n\t\t\t\t\t${\n\t\t\t\t\t\ttotal > 0\n\t\t\t\t\t\t\t? BALA_COMPONENTS.map((b, i) => {\n\t\t\t\t\t\t\t\t\tconst v = values[i];\n\t\t\t\t\t\t\t\t\tif (v <= 0) return nothing;\n\t\t\t\t\t\t\t\t\tconst grow = (v / total) * 100;\n\t\t\t\t\t\t\t\t\treturn html`<div\n\t\t\t\t\t\t\t\t\tclass=\"bar-segment\"\n\t\t\t\t\t\t\t\t\tstyle=\"flex-grow: ${grow}; background: ${b.color};\"\n\t\t\t\t\t\t\t\t\ttitle=\"${b.label}: ${formatNumber(v, 1)}\"\n\t\t\t\t\t\t\t\t></div>`;\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div class=\"pills\">\n\t\t\t\t${rupasStr ? html`<span class=\"rupas-label\">${rupasStr}</span>` : nothing}\n\t\t\t\t<span class=\"${`adequacy-badge ${badgeClass}`}\">${badgeLabel}</span>\n\t\t\t</div>\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-shadbala-table': RoxyShadbalaTable;\n\t}\n}\n", "/**\n * Symbol constants used across components. Single source of truth so chart\n * wheels, card headers, hexagram displays, and panchang tables stay visually\n * consistent.\n */\n\nexport const PLANET_GLYPH: Record<string, string> = {\n\tSun: '\u2609',\n\tMoon: '\u263D',\n\tMercury: '\u263F',\n\tVenus: '\u2640',\n\tEarth: '\u2641',\n\tMars: '\u2642',\n\tJupiter: '\u2643',\n\tSaturn: '\u2644',\n\tUranus: '\u2645',\n\tNeptune: '\u2646',\n\tPluto: '\u2647',\n\tRahu: '\u260A',\n\tKetu: '\u260B',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n\tNorthNode: '\u260A',\n\tSouthNode: '\u260B',\n\t'North node': '\u260A',\n\t'South node': '\u260B',\n\tChiron: '\u26B7',\n\tLilith: '\u26B8',\n\t'Black moon lilith': '\u26B8',\n};\n\nexport const PLANET_ABBR: Record<string, string> = {\n\tSun: 'Su',\n\tMoon: 'Mo',\n\tMercury: 'Me',\n\tVenus: 'Ve',\n\tMars: 'Ma',\n\tJupiter: 'Ju',\n\tSaturn: 'Sa',\n\tUranus: 'Ur',\n\tNeptune: 'Ne',\n\tPluto: 'Pl',\n\tRahu: 'Ra',\n\tKetu: 'Ke',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n};\n\nexport const SIGN_GLYPH: Record<string, string> = {\n\tAries: '\u2648',\n\tTaurus: '\u2649',\n\tGemini: '\u264A',\n\tCancer: '\u264B',\n\tLeo: '\u264C',\n\tVirgo: '\u264D',\n\tLibra: '\u264E',\n\tScorpio: '\u264F',\n\tSagittarius: '\u2650',\n\tCapricorn: '\u2651',\n\tAquarius: '\u2652',\n\tPisces: '\u2653',\n};\n\nexport const SIGN_ABBR: Record<string, string> = {\n\tAries: 'Ar',\n\tTaurus: 'Ta',\n\tGemini: 'Ge',\n\tCancer: 'Cn',\n\tLeo: 'Le',\n\tVirgo: 'Vi',\n\tLibra: 'Li',\n\tScorpio: 'Sc',\n\tSagittarius: 'Sg',\n\tCapricorn: 'Cp',\n\tAquarius: 'Aq',\n\tPisces: 'Pi',\n};\n\nexport const SIGNS_ORDER = [\n\t'Aries',\n\t'Taurus',\n\t'Gemini',\n\t'Cancer',\n\t'Leo',\n\t'Virgo',\n\t'Libra',\n\t'Scorpio',\n\t'Sagittarius',\n\t'Capricorn',\n\t'Aquarius',\n\t'Pisces',\n] as const;\n\n/**\n * Lowercase rashi keys in canonical zodiac order. Derived from `SIGNS_ORDER`\n * so the two stay in lockstep. The /vedic-astrology/birth-chart response\n * carries planet buckets keyed by these names.\n */\nexport const RASHI_KEYS = SIGNS_ORDER.map((s) =>\n\ts.toLowerCase(),\n) as readonly Lowercase<(typeof SIGNS_ORDER)[number]>[];\n\n/** Aspect symbols. Used by synastry and natal chart aspect tables. */\nexport const ASPECT_SYMBOL: Record<string, string> = {\n\tconjunction: '\u260C',\n\topposition: '\u260D',\n\ttrine: '\u25B3',\n\tsquare: '\u25A1',\n\tsextile: '\u2731',\n\tquincunx: '\u22BB',\n\tsemisextile: '\u22BC',\n};\n\n/** Trigrams used by I Ching hexagrams. Eight trigrams compose 64 hexagrams. */\nexport const TRIGRAM_GLYPH: Record<string, string> = {\n\theaven: '\u2630',\n\tlake: '\u2631',\n\tfire: '\u2632',\n\tthunder: '\u2633',\n\twind: '\u2634',\n\twater: '\u2635',\n\tmountain: '\u2636',\n\tearth: '\u2637',\n\tHeaven: '\u2630',\n\tLake: '\u2631',\n\tFire: '\u2632',\n\tThunder: '\u2633',\n\tWind: '\u2634',\n\tWater: '\u2635',\n\tMountain: '\u2636',\n\tEarth: '\u2637',\n};\n\n/** Moon phase emoji set. Used by moon phase card. */\nexport const MOON_PHASE_EMOJI: Record<string, string> = {\n\t'new moon': '\uD83C\uDF11',\n\t'waxing crescent': '\uD83C\uDF12',\n\t'first quarter': '\uD83C\uDF13',\n\t'waxing gibbous': '\uD83C\uDF14',\n\t'full moon': '\uD83C\uDF15',\n\t'waning gibbous': '\uD83C\uDF16',\n\t'last quarter': '\uD83C\uDF17',\n\t'waning crescent': '\uD83C\uDF18',\n};\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tcontainer-type: inline-size;\n\t\tfont-family: var(\n\t\t\t--roxy-font-sans,\n\t\t\tsystem-ui,\n\t\t\t-apple-system,\n\t\t\tBlinkMacSystemFont,\n\t\t\t'Segoe UI',\n\t\t\tRoboto,\n\t\t\tsans-serif\n\t\t);\n\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\tbackground: transparent;\n\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\tline-height: var(--roxy-leading-normal, 1.5);\n\t\tanimation: roxy-fade-in var(--roxy-motion-duration, 200ms)\n\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;\n\t}\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: border-box;\n\t}\n\n\t@keyframes roxy-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: translateY(2px);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: translateY(0);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-skeleton {\n\t\tbackground: linear-gradient(\n\t\t\t90deg,\n\t\t\tvar(--roxy-border, #e4e4e7) 0%,\n\t\t\tcolor-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent) 50%,\n\t\t\tvar(--roxy-border, #e4e4e7) 100%\n\t\t);\n\t\tbackground-size: 200% 100%;\n\t\tanimation: roxy-shimmer 1.4s ease-in-out infinite;\n\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t}\n\n\t@keyframes roxy-shimmer {\n\t\t0% {\n\t\t\tbackground-position: 200% 0;\n\t\t}\n\t\t100% {\n\t\t\tbackground-position: -200% 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.roxy-skeleton {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-empty {\n\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\tcolor: var(--roxy-muted, #71717a);\n\t\ttext-align: center;\n\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t}\n\n\t:host(:focus-within) .roxy-card {\n\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\toutline-offset: 2px;\n\t}\n\n\t/* Force the text-style variant on every Unicode glyph in the component.\n\t * macOS and iOS substitute coloured emoji glyphs for the planetary and\n\t * gender Unicode code points (Mars, Venus, Mercury, etc.) when the\n\t * system colour-emoji font wins font selection. The text-style variant\n\t * keeps glyphs monochrome so they inherit the surrounding fill colour\n\t * and match the brand palette consistently across platforms.\n\t *\n\t * font-variant-emoji is part of CSS Fonts 4 (Safari 17+, Chrome 134+,\n\t * Firefox 139+). On older browsers the rule is silently ignored.\n\t */\n\t:host {\n\t\tfont-variant-emoji: text;\n\t}\n`;\n", "/**\n * Display formatters for ISO timestamps and floats coming back from the API.\n * Every helper returns \"\" for nullish or unparseable input so it falls out of\n * template literals cleanly.\n */\n\nexport function formatTime(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tif (/^\\d{4}-\\d{2}-\\d{2}$/.test(input)) return '';\n\tconst bareTime = /^\\d{2}:\\d{2}(:\\d{2})?$/.test(input);\n\tconst iso = bareTime ? `1970-01-01T${input}` : input;\n\tconst d = new Date(iso);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleTimeString(undefined, {\n\t\thour: 'numeric',\n\t\tminute: '2-digit',\n\t\thour12: true,\n\t});\n}\n\nexport function formatDate(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tconst d = new Date(\n\t\t/^\\d{4}-\\d{2}-\\d{2}$/.test(input) ? `${input}T00:00:00` : input,\n\t);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleDateString(undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t\tyear: 'numeric',\n\t});\n}\n\nexport function formatTimeRange(\n\tt: { start?: string; end?: string } | undefined,\n): string {\n\tif (!t) return '';\n\tconst start = formatTime(t.start);\n\tconst end = formatTime(t.end);\n\tif (start && end) return `${start} - ${end}`;\n\treturn start || end || '';\n}\n\nexport function formatNumber(value: unknown, dp = 1): string {\n\tif (typeof value !== 'number' || !Number.isFinite(value)) return '';\n\treturn value.toFixed(dp).replace(/\\.?0+$/, '');\n}\n\nexport function formatPercent(value: unknown, dp = 1): string {\n\tconst n = formatNumber(value, dp);\n\treturn n ? `${n}%` : '';\n}\n\n/**\n * CSS class name per aspect type. Used by natal and synastry chart aspect\n * lines so the same color encoding (harmonious vs challenging) applies in\n * both wheels. Keys are lowercase canonical names, values are CSS class\n * suffixes the chart components define in their `:host` styles.\n */\nexport const ASPECT_CLASS: Record<string, string> = {\n\tconjunction: 'aspect-conjunction',\n\tsextile: 'aspect-sextile',\n\tsquare: 'aspect-square',\n\ttrine: 'aspect-trine',\n\topposition: 'aspect-opposition',\n};\n\n/**\n * Normalize the `type` field on an aspect entry to a lowercase, hyphen-separated\n * canonical name (`SEMI_SEXTILE` \u2192 `semi-sextile`). Accepts any aspect-shaped\n * object so both natal and synastry inter-aspect entries can share this.\n */\nexport function normalizeAspect(a: { type?: string }): string {\n\treturn (a.type ?? '').toLowerCase().replace(/_/g, '-');\n}\n", "/**\n * Shared string helpers used across components. Single source of truth so the\n * same formatting rules apply to every key/label/title that surfaces in the\n * shadow tree.\n *\n * - `capitalize`: title-cases the first character, lowercases the rest. Used\n * when matching API-supplied planet/sign names against the glyph maps in\n * `tokens/index.ts`, which use canonical TitleCase keys.\n * - `humanize`: turns an API key (`birth_date`, `birthDate`, `mahadasha-end`)\n * into a label suitable for display (\"Birth date\", \"Mahadasha end\").\n */\n\nexport function capitalize(s: string): string {\n\tif (!s) return '';\n\treturn s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();\n}\n\nexport function humanize(s: string): string {\n\treturn s\n\t\t.replace(/[_-]+/g, ' ')\n\t\t.replace(/([a-z])([A-Z])/g, '$1 $2')\n\t\t.replace(/^\\w/, (c) => c.toUpperCase());\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["css", "css"]
7
7
  }
@@ -21,6 +21,12 @@ export declare class RoxySynastryChart extends LitElement {
21
21
  private renderSpokes;
22
22
  private renderSigns;
23
23
  private renderRing;
24
+ /**
25
+ * Ascendant markers for both people. Drawn as small spokes at the inner
26
+ * rim with the label outside, so the two rising signs are immediately
27
+ * scannable on the wheel without depending on tooltips.
28
+ */
29
+ private renderAscendants;
24
30
  private renderInterAspectLines;
25
31
  private renderAspects;
26
32
  }
@@ -1 +1 @@
1
- {"version":3,"file":"synastry-chart.d.ts","sourceRoot":"","sources":["../../src/components/synastry-chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAgB,MAAM,KAAK,CAAC;AAG1D,OAAO,KAAK,EACX,yBAAyB,EACzB,kBAAkB,EAClB,MAAM,mBAAmB,CAAC;AAU3B,KAAK,WAAW,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;AAQzD,KAAK,mBAAmB,GAAG,yBAAyB,GAAG;IACtD,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC;IACtC,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC;CACtC,CAAC;AASF;;;GAGG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IAChD,MAAM,CAAC,MAAM,4BA2JX;IAGF,IAAI,EAAE,mBAAmB,GAAG,IAAI,CAAQ;IAExC,MAAM;IA2JN,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,WAAW;IAQnB,OAAO,CAAC,UAAU;IAclB,OAAO,CAAC,sBAAsB;IA6B9B,OAAO,CAAC,aAAa;CAwBrB;AAOD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,iBAAiB,CAAC;KACzC;CACD"}
1
+ {"version":3,"file":"synastry-chart.d.ts","sourceRoot":"","sources":["../../src/components/synastry-chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,UAAU,EAAgB,MAAM,KAAK,CAAC;AAG1D,OAAO,KAAK,EACX,yBAAyB,EACzB,kBAAkB,EAClB,MAAM,mBAAmB,CAAC;AAU3B,KAAK,WAAW,GAAG,kBAAkB,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;AAQzD,KAAK,mBAAmB,GAAG,yBAAyB,GAAG;IACtD,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC;IACtC,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,WAAW,EAAE,CAAA;KAAE,CAAC;CACtC,CAAC;AASF;;;GAGG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IAChD,MAAM,CAAC,MAAM,4BAsLX;IAGF,IAAI,EAAE,mBAAmB,GAAG,IAAI,CAAQ;IAExC,MAAM;IA4JN,OAAO,CAAC,OAAO;IAIf,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,WAAW;IAQnB,OAAO,CAAC,UAAU;IA+BlB;;;;OAIG;IACH,OAAO,CAAC,gBAAgB;IA0BxB,OAAO,CAAC,sBAAsB;IA6B9B,OAAO,CAAC,aAAa;CAwBrB;AAOD,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,iBAAiB,CAAC;KACzC;CACD"}
@@ -154,9 +154,43 @@ var baseStyles = css`
154
154
  outline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));
155
155
  outline-offset: 2px;
156
156
  }
157
+
158
+ /* Force the text-style variant on every Unicode glyph in the component.
159
+ * macOS and iOS substitute coloured emoji glyphs for the planetary and
160
+ * gender Unicode code points (Mars, Venus, Mercury, etc.) when the
161
+ * system colour-emoji font wins font selection. The text-style variant
162
+ * keeps glyphs monochrome so they inherit the surrounding fill colour
163
+ * and match the brand palette consistently across platforms.
164
+ *
165
+ * font-variant-emoji is part of CSS Fonts 4 (Safari 17+, Chrome 134+,
166
+ * Firefox 139+). On older browsers the rule is silently ignored.
167
+ */
168
+ :host {
169
+ font-variant-emoji: text;
170
+ }
157
171
  `;
158
172
 
159
173
  // packages/ui/src/utils/degree.ts
174
+ function normalizeLongitude(lon) {
175
+ const wrapped = lon % 360;
176
+ return wrapped < 0 ? wrapped + 360 : wrapped;
177
+ }
178
+ function longitudeToSignPosition(longitude) {
179
+ const lon = normalizeLongitude(longitude);
180
+ const signIndex = Math.floor(lon / 30) % 12;
181
+ const within = lon % 30;
182
+ const degree = Math.floor(within);
183
+ const minuteFloat = (within - degree) * 60;
184
+ const minute = Math.floor(minuteFloat);
185
+ const second = Math.round((minuteFloat - minute) * 60);
186
+ return {
187
+ sign: SIGNS_ORDER[signIndex] ?? "Aries",
188
+ signIndex,
189
+ degree,
190
+ minute,
191
+ second
192
+ };
193
+ }
160
194
  function polarToCartesian(cx, cy, radius, angleDeg) {
161
195
  const angleRad = angleDeg * Math.PI / 180;
162
196
  return {
@@ -285,7 +319,8 @@ var RoxySynastryChart = class extends LitElement {
285
319
  />
286
320
  ${this.renderSpokes()} ${this.renderSigns()}
287
321
  ${this.renderInterAspectLines(p1Planets, p2Planets, interAspects)}
288
- ${this.renderRing(p1Planets, P1_R, "p1")} ${this.renderRing(p2Planets, P2_R, "p2")}
322
+ ${this.renderRing(p1Planets, P1_R, "p1", 1)} ${this.renderRing(p2Planets, P2_R, "p2", 2)}
323
+ ${this.renderAscendants(this.data)}
289
324
  </svg>
290
325
  <div class="legend-row">
291
326
  <span><span class="swatch" style="background: var(--roxy-accent)"></span>Person 1</span>
@@ -329,19 +364,56 @@ var RoxySynastryChart = class extends LitElement {
329
364
  return svg`<text class="sign" x=${pos.x} y=${pos.y} text-anchor="middle" dominant-baseline="central">${SIGN_GLYPH[s]}</text>`;
330
365
  });
331
366
  }
332
- renderRing(planets, radius, cls) {
367
+ renderRing(planets, radius, cls, personIndex) {
333
368
  return planets.map((p) => {
334
369
  if (!Number.isFinite(p.longitude)) return nothing;
335
- const pos = polarToCartesian(
370
+ const angle = this.toAngle(p.longitude);
371
+ const pos = polarToCartesian(CENTER, CENTER, radius, angle);
372
+ const degOffset = personIndex === 1 ? -12 : -10;
373
+ const degPos = polarToCartesian(
336
374
  CENTER,
337
375
  CENTER,
338
- radius,
339
- this.toAngle(p.longitude)
376
+ radius + degOffset,
377
+ angle
340
378
  );
341
379
  const glyph = PLANET_GLYPH[capitalize(p.name)] ?? p.name.slice(0, 2);
342
- return svg`<text class=${cls} x=${pos.x} y=${pos.y} text-anchor="middle" dominant-baseline="central"><title>${p.name}</title>${glyph}</text>`;
380
+ const sp = longitudeToSignPosition(p.longitude);
381
+ const retro = p.isRetrograde === true;
382
+ const degLabel = `${sp.degree}\xB0${String(sp.minute).padStart(2, "0")}'`;
383
+ const tooltip = `${p.name}${retro ? " retrograde" : ""} - ${degLabel} ${sp.sign}`;
384
+ return svg`<g>
385
+ <text class=${cls} x=${pos.x} y=${pos.y} text-anchor="middle" dominant-baseline="central"><title>${tooltip}</title>${glyph}<tspan class="person-tag" dy="-0.55em" dx="0.15em">${personIndex}</tspan></text>
386
+ <text class="planet-deg" x=${degPos.x} y=${degPos.y} text-anchor="middle" dominant-baseline="central">${sp.degree}°${retro ? svg`<tspan class="retro"> ℞</tspan>` : nothing}</text>
387
+ </g>`;
343
388
  });
344
389
  }
390
+ /**
391
+ * Ascendant markers for both people. Drawn as small spokes at the inner
392
+ * rim with the label outside, so the two rising signs are immediately
393
+ * scannable on the wheel without depending on tooltips.
394
+ */
395
+ renderAscendants(data) {
396
+ const items = [];
397
+ const make = (asc, personIndex) => {
398
+ if (!asc) return;
399
+ const signIdx = SIGNS_ORDER.findIndex(
400
+ (s) => s.toLowerCase() === asc.sign.toLowerCase()
401
+ );
402
+ if (signIdx === -1) return;
403
+ const longitude = signIdx * 30 + asc.degree;
404
+ const angle = this.toAngle(longitude);
405
+ const innerR = personIndex === 1 ? P1_R + 14 : P2_R + 14;
406
+ const tickPos = polarToCartesian(CENTER, CENTER, innerR, angle);
407
+ const labelPos = polarToCartesian(CENTER, CENTER, OUTER_R + 14, angle);
408
+ items.push(svg`<g>
409
+ <line class="asc-tick" x1=${tickPos.x} y1=${tickPos.y} x2=${labelPos.x} y2=${labelPos.y} />
410
+ <text class="asc-label" x=${labelPos.x} y=${labelPos.y} text-anchor="middle" dominant-baseline="central">Asc${personIndex}</text>
411
+ </g>`);
412
+ };
413
+ make(data.person1?.ascendant, 1);
414
+ make(data.person2?.ascendant, 2);
415
+ return items;
416
+ }
345
417
  renderInterAspectLines(p1, p2, aspects) {
346
418
  const longitudeOf = (list, name) => {
347
419
  const target = capitalize(name);
@@ -420,7 +492,9 @@ RoxySynastryChart.styles = [
420
492
  svg {
421
493
  display: block;
422
494
  width: 100%;
423
- max-width: 400px;
495
+ max-width: 560px;
496
+ aspect-ratio: 1 / 1;
497
+ height: auto;
424
498
  margin: 0 auto;
425
499
  }
426
500
 
@@ -442,6 +516,31 @@ RoxySynastryChart.styles = [
442
516
  font-weight: 600;
443
517
  font-size: 13px;
444
518
  }
519
+ .person-tag {
520
+ font-size: 7px;
521
+ font-weight: 700;
522
+ opacity: 0.85;
523
+ }
524
+ .planet-deg {
525
+ fill: var(--roxy-muted, #71717a);
526
+ font-size: 7px;
527
+ font-family: var(--roxy-font-sans);
528
+ }
529
+ .planet-deg .retro {
530
+ fill: var(--roxy-danger, #dc2626);
531
+ }
532
+ .asc-tick {
533
+ stroke: var(--roxy-accent-fg, #b45309);
534
+ stroke-width: 1;
535
+ opacity: 0.75;
536
+ }
537
+ .asc-label {
538
+ fill: var(--roxy-accent-fg, #b45309);
539
+ font-size: 9px;
540
+ font-weight: 700;
541
+ font-family: var(--roxy-font-sans);
542
+ letter-spacing: 0.04em;
543
+ }
445
544
  .aspect {
446
545
  stroke-width: 0.8;
447
546
  fill: none;
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/components/synastry-chart.ts", "../../src/tokens/index.ts", "../../src/utils/base-styles.ts", "../../src/utils/degree.ts", "../../src/utils/format.ts", "../../src/utils/string.ts"],
4
- "sourcesContent": ["import { css, html, LitElement, nothing, svg } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { PLANET_GLYPH, SIGN_GLYPH, SIGNS_ORDER } from '../tokens/index.js';\nimport type {\n\tCalculateSynastryResponse,\n\tNatalChartResponse,\n} from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\nimport { polarToCartesian } from '../utils/degree.js';\nimport {\n\tASPECT_CLASS,\n\tformatNumber,\n\tnormalizeAspect,\n} from '../utils/format.js';\nimport { capitalize } from '../utils/string.js';\n\ntype PlanetEntry = NatalChartResponse['planets'][number];\ntype InterAspect = CalculateSynastryResponse['interAspects'][number];\n\n// Drawing the dual wheel requires per-person planet longitudes alongside\n// the synastry response. Callers can merge planet arrays from\n// /astrology/natal-chart into `person1.planets` and `person2.planets`\n// before passing the payload in; without them, the component falls back\n// to the inter-aspects table and a status note instead of an empty wheel.\ntype SynastryWithPlanets = CalculateSynastryResponse & {\n\tperson1?: { planets?: PlanetEntry[] };\n\tperson2?: { planets?: PlanetEntry[] };\n};\n\nconst SIZE = 360;\nconst CENTER = SIZE / 2;\nconst OUTER_R = 170;\nconst SIGN_R = 154;\nconst P1_R = 124;\nconst P2_R = 96;\n\n/**\n * Dual-wheel synastry chart with inter-aspects table. Pass `data` from\n * /astrology/synastry.\n */\n@customElement('roxy-synastry-chart')\nexport class RoxySynastryChart extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`\n\t\t\t.wrap {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t}\n\n\t\t\t.head {\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: space-between;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t\tflex-wrap: wrap;\n\t\t\t}\n\n\t\t\t.title {\n\t\t\t\tfont-size: var(--roxy-text-lg, 1.125rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.score {\n\t\t\t\tfont-variant-numeric: tabular-nums;\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tcolor: var(--roxy-accent-fg, #b45309);\n\t\t\t\tfont-size: var(--roxy-text-xl, 1.5rem);\n\t\t\t}\n\n\t\t\tsvg {\n\t\t\t\tdisplay: block;\n\t\t\t\twidth: 100%;\n\t\t\t\tmax-width: 400px;\n\t\t\t\tmargin: 0 auto;\n\t\t\t}\n\n\t\t\t.wheel-line {\n\t\t\t\tfill: none;\n\t\t\t\tstroke: var(--roxy-border, #e4e4e7);\n\t\t\t}\n\t\t\t.sign {\n\t\t\t\tfill: var(--roxy-secondary, #475569);\n\t\t\t\tfont-size: 14px;\n\t\t\t}\n\t\t\t.p1 {\n\t\t\t\tfill: var(--roxy-accent, #f59e0b);\n\t\t\t\tfont-weight: 600;\n\t\t\t\tfont-size: 13px;\n\t\t\t}\n\t\t\t.p2 {\n\t\t\t\tfill: var(--roxy-info, #0284c7);\n\t\t\t\tfont-weight: 600;\n\t\t\t\tfont-size: 13px;\n\t\t\t}\n\t\t\t.aspect {\n\t\t\t\tstroke-width: 0.8;\n\t\t\t\tfill: none;\n\t\t\t\topacity: 0.5;\n\t\t\t}\n\t\t\t.aspect-trine,\n\t\t\t.aspect-sextile {\n\t\t\t\tstroke: var(--roxy-success, #16a34a);\n\t\t\t}\n\t\t\t.aspect-square,\n\t\t\t.aspect-opposition {\n\t\t\t\tstroke: var(--roxy-danger, #dc2626);\n\t\t\t}\n\t\t\t.aspect-conjunction {\n\t\t\t\tstroke: var(--roxy-accent-fg, #b45309);\n\t\t\t}\n\t\t\t.aspect-other {\n\t\t\t\tstroke: var(--roxy-muted, #71717a);\n\t\t\t\topacity: 0.35;\n\t\t\t}\n\t\t\t.legend-row {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-wrap: wrap;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tmargin-top: calc(var(--roxy-space-xs, 0.25rem) * -1);\n\t\t\t}\n\t\t\t.legend-row .swatch {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\twidth: 8px;\n\t\t\t\theight: 8px;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tmargin-right: 4px;\n\t\t\t\tvertical-align: middle;\n\t\t\t}\n\n\t\t\t.summary {\n\t\t\t\tmargin: 0;\n\t\t\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\t\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\t\t}\n\n\t\t\ttable {\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-collapse: collapse;\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t}\n\t\t\tth,\n\t\t\ttd {\n\t\t\t\tpadding: var(--roxy-space-sm, 0.5rem);\n\t\t\t\tborder-bottom: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\ttext-align: left;\n\t\t\t}\n\t\t\tth {\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tletter-spacing: 0.06em;\n\t\t\t}\n\t\t\ttd.orb {\n\t\t\t\tfont-variant-numeric: tabular-nums;\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t}\n\n\t\t\t.lists {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t}\n\t\t\t.lists h3 {\n\t\t\t\tmargin: 0 0 var(--roxy-space-xs, 0.25rem) 0;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\tletter-spacing: 0.06em;\n\t\t\t}\n\t\t\t.lists ul {\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding-left: var(--roxy-space-md, 1rem);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t}\n\n\t\t\t.missing-planets {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-accent, #f59e0b) 8%, transparent);\n\t\t\t\tborder: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tpadding: var(--roxy-space-md, 1rem);\n\t\t\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\tline-height: 1.5;\n\t\t\t}\n\t\t\t.missing-planets code {\n\t\t\t\tfont-family: var(--roxy-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);\n\t\t\t\tfont-size: 0.95em;\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-fg, #0a0a0a) 6%, transparent);\n\t\t\t\tpadding: 0 4px;\n\t\t\t\tborder-radius: 4px;\n\t\t\t}\n\t\t`,\n\t];\n\n\t@property({ attribute: false })\n\tdata: SynastryWithPlanets | null = null;\n\n\trender() {\n\t\tif (!this.data)\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No synastry data</div>`;\n\t\tconst { person1, person2, compatibilityScore, analysis } = this.data;\n\t\tconst interAspects = this.data.interAspects ?? [];\n\t\tconst p1Planets = person1?.planets ?? [];\n\t\tconst p2Planets = person2?.planets ?? [];\n\n\t\tconst score =\n\t\t\ttypeof compatibilityScore === 'number'\n\t\t\t\t? Math.round(compatibilityScore)\n\t\t\t\t: undefined;\n\t\tconst summaryText = analysis?.overall;\n\t\tconst strengths = analysis?.strengths ?? [];\n\t\tconst challenges = analysis?.challenges ?? [];\n\n\t\t// /astrology/synastry does not return per-person planet positions, so the\n\t\t// dual-wheel cannot be drawn from a bare synastry response. Surface this\n\t\t// explicitly instead of rendering a blank wheel; keep the inter-aspects\n\t\t// table when it is present so callers still get useful output.\n\t\tconst hasPlanets = p1Planets.length > 0 && p2Planets.length > 0;\n\t\tif (!hasPlanets) {\n\t\t\treturn html`<div\n\t\t\t\tclass=\"wrap\"\n\t\t\t\taria-label=\"Synastry compatibility chart\"\n\t\t\t>\n\t\t\t\t<div class=\"head\">\n\t\t\t\t\t<h2 class=\"title\">Synastry</h2>\n\t\t\t\t\t${\n\t\t\t\t\t\ttypeof score === 'number'\n\t\t\t\t\t\t\t? html`<span class=\"score\" aria-label=${`Score ${score} of 100`}\n\t\t\t\t\t\t\t\t>${score} / 100</span\n\t\t\t\t\t\t\t>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<div class=\"missing-planets\" role=\"status\">\n\t\t\t\t\tSynastry response missing planet positions. Pass\n\t\t\t\t\t<code>data</code> with <code>person1.planets</code> and\n\t\t\t\t\t<code>person2.planets</code> arrays from the natal-chart endpoint, or\n\t\t\t\t\tuse the <code>&lt;roxy-data&gt;</code> fallback.\n\t\t\t\t</div>\n\t\t\t\t${summaryText ? html`<p class=\"summary\">${summaryText}</p>` : nothing}\n\t\t\t\t${interAspects.length > 0 ? this.renderAspects(interAspects) : nothing}\n\t\t\t\t${\n\t\t\t\t\tstrengths.length > 0 || challenges.length > 0\n\t\t\t\t\t\t? html`<div class=\"lists\">\n\t\t\t\t\t\t\t${\n\t\t\t\t\t\t\t\tstrengths.length\n\t\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t\t<h3>Strengths</h3>\n\t\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t\t${strengths.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t${\n\t\t\t\t\t\t\t\tchallenges.length\n\t\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t\t<h3>Challenges</h3>\n\t\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t\t${challenges.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t</div>`;\n\t\t}\n\n\t\treturn html`<div\n\t\t\tclass=\"wrap\"\n\t\t\taria-label=\"Synastry compatibility chart\"\n\t\t>\n\t\t\t<div class=\"head\">\n\t\t\t\t<h2 class=\"title\">Synastry</h2>\n\t\t\t\t${\n\t\t\t\t\ttypeof score === 'number'\n\t\t\t\t\t\t? html`<span class=\"score\" aria-label=${`Score ${score} of 100`}\n\t\t\t\t\t\t\t>${score} / 100</span\n\t\t\t\t\t\t>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<svg\n\t\t\t\tviewBox=\"0 0 ${SIZE} ${SIZE}\"\n\t\t\t\trole=\"img\"\n\t\t\t\taria-label=\"Dual chart wheel comparing two natal charts\"\n\t\t\t>\n\t\t\t\t<title>Synastry dual wheel</title>\n\t\t\t\t<circle\n\t\t\t\t\tclass=\"wheel-line\"\n\t\t\t\t\tcx=${CENTER}\n\t\t\t\t\tcy=${CENTER}\n\t\t\t\t\tr=${OUTER_R}\n\t\t\t\t\tstroke-width=\"1.5\"\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tclass=\"wheel-line\"\n\t\t\t\t\tcx=${CENTER}\n\t\t\t\t\tcy=${CENTER}\n\t\t\t\t\tr=${P2_R + 14}\n\t\t\t\t\tstroke-width=\"0.8\"\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tclass=\"wheel-line\"\n\t\t\t\t\tcx=${CENTER}\n\t\t\t\t\tcy=${CENTER}\n\t\t\t\t\tr=${P2_R - 14}\n\t\t\t\t\tstroke-width=\"0.6\"\n\t\t\t\t/>\n\t\t\t\t${this.renderSpokes()} ${this.renderSigns()}\n\t\t\t\t${this.renderInterAspectLines(p1Planets, p2Planets, interAspects)}\n\t\t\t\t${this.renderRing(p1Planets, P1_R, 'p1')} ${this.renderRing(p2Planets, P2_R, 'p2')}\n\t\t\t</svg>\n\t\t\t<div class=\"legend-row\">\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-accent)\"></span>Person 1</span>\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-info)\"></span>Person 2</span>\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-success)\"></span>harmonious</span>\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-danger)\"></span>challenging</span>\n\t\t\t</div>\n\t\t\t${summaryText ? html`<p class=\"summary\">${summaryText}</p>` : nothing}\n\t\t\t${interAspects.length > 0 ? this.renderAspects(interAspects) : nothing}\n\t\t\t${\n\t\t\t\tstrengths.length > 0 || challenges.length > 0\n\t\t\t\t\t? html`<div class=\"lists\">\n\t\t\t\t\t\t${\n\t\t\t\t\t\t\tstrengths.length\n\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t<h3>Strengths</h3>\n\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t${strengths.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t}\n\t\t\t\t\t\t${\n\t\t\t\t\t\t\tchallenges.length\n\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t<h3>Challenges</h3>\n\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t${challenges.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>`\n\t\t\t\t\t: nothing\n\t\t\t}\n\t\t</div>`;\n\t}\n\n\tprivate toAngle(longitude: number): number {\n\t\treturn 180 - longitude;\n\t}\n\n\tprivate renderSpokes() {\n\t\treturn Array.from({ length: 12 }, (_, i) => {\n\t\t\tconst angle = this.toAngle(i * 30);\n\t\t\tconst start = polarToCartesian(CENTER, CENTER, P2_R - 14, angle);\n\t\t\tconst end = polarToCartesian(CENTER, CENTER, OUTER_R, angle);\n\t\t\treturn svg`<line class=\"wheel-line\" x1=${start.x} y1=${start.y} x2=${end.x} y2=${end.y} stroke-width=\"0.6\" />`;\n\t\t});\n\t}\n\n\tprivate renderSigns() {\n\t\treturn SIGNS_ORDER.map((s, i) => {\n\t\t\tconst angle = this.toAngle(i * 30 + 15);\n\t\t\tconst pos = polarToCartesian(CENTER, CENTER, SIGN_R, angle);\n\t\t\treturn svg`<text class=\"sign\" x=${pos.x} y=${pos.y} text-anchor=\"middle\" dominant-baseline=\"central\">${SIGN_GLYPH[s]}</text>`;\n\t\t});\n\t}\n\n\tprivate renderRing(planets: PlanetEntry[], radius: number, cls: string) {\n\t\treturn planets.map((p) => {\n\t\t\tif (!Number.isFinite(p.longitude)) return nothing;\n\t\t\tconst pos = polarToCartesian(\n\t\t\t\tCENTER,\n\t\t\t\tCENTER,\n\t\t\t\tradius,\n\t\t\t\tthis.toAngle(p.longitude),\n\t\t\t);\n\t\t\tconst glyph = PLANET_GLYPH[capitalize(p.name)] ?? p.name.slice(0, 2);\n\t\t\treturn svg`<text class=${cls} x=${pos.x} y=${pos.y} text-anchor=\"middle\" dominant-baseline=\"central\"><title>${p.name}</title>${glyph}</text>`;\n\t\t});\n\t}\n\n\tprivate renderInterAspectLines(\n\t\tp1: PlanetEntry[],\n\t\tp2: PlanetEntry[],\n\t\taspects: InterAspect[],\n\t) {\n\t\tconst longitudeOf = (\n\t\t\tlist: PlanetEntry[],\n\t\t\tname: string,\n\t\t): number | undefined => {\n\t\t\tconst target = capitalize(name);\n\t\t\tfor (const p of list) {\n\t\t\t\tif (capitalize(p.name) !== target) continue;\n\t\t\t\tif (typeof p.longitude === 'number') return p.longitude;\n\t\t\t}\n\t\t\treturn undefined;\n\t\t};\n\t\treturn aspects.map((a) => {\n\t\t\tconst l1 = longitudeOf(p1, a.planet1);\n\t\t\tconst l2 = longitudeOf(p2, a.planet2);\n\t\t\tif (l1 === undefined || l2 === undefined) return nothing;\n\t\t\tconst out = polarToCartesian(CENTER, CENTER, P1_R - 12, this.toAngle(l1));\n\t\t\tconst inn = polarToCartesian(CENTER, CENTER, P2_R + 8, this.toAngle(l2));\n\t\t\tconst aspectName = normalizeAspect(a);\n\t\t\tconst cls = ASPECT_CLASS[aspectName] ?? 'aspect-other';\n\t\t\tconst orbLabel = formatNumber(a.orb, 1);\n\t\t\treturn svg`<line class=${`aspect ${cls}`} x1=${out.x} y1=${out.y} x2=${inn.x} y2=${inn.y}><title>${a.planet1} ${aspectName} ${a.planet2}${orbLabel ? ` (orb ${orbLabel}\u00B0)` : ''}</title></line>`;\n\t\t});\n\t}\n\n\tprivate renderAspects(aspects: InterAspect[]) {\n\t\treturn html`<table>\n\t\t\t<thead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th>Planet 1</th>\n\t\t\t\t\t<th>Planet 2</th>\n\t\t\t\t\t<th>Aspect</th>\n\t\t\t\t\t<th>Orb</th>\n\t\t\t\t\t<th>Strength</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody>\n\t\t\t\t${aspects.slice(0, 12).map(\n\t\t\t\t\t(a) => html`<tr>\n\t\t\t\t\t\t<td>${a.planet1}</td>\n\t\t\t\t\t\t<td>${a.planet2}</td>\n\t\t\t\t\t\t<td>${normalizeAspect(a) || ''}</td>\n\t\t\t\t\t\t<td class=\"orb\">${formatNumber(a.orb, 1)}</td>\n\t\t\t\t\t\t<td>${formatStrength(a.strength)}</td>\n\t\t\t\t\t</tr>`,\n\t\t\t\t)}\n\t\t\t</tbody>\n\t\t</table>`;\n\t}\n}\n\nfunction formatStrength(s: number | undefined): string {\n\tif (typeof s === 'number') return Math.round(s).toString();\n\treturn '';\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-synastry-chart': RoxySynastryChart;\n\t}\n}\n", "/**\n * Symbol constants used across components. Single source of truth so chart\n * wheels, card headers, hexagram displays, and panchang tables stay visually\n * consistent.\n */\n\nexport const PLANET_GLYPH: Record<string, string> = {\n\tSun: '\u2609',\n\tMoon: '\u263D',\n\tMercury: '\u263F',\n\tVenus: '\u2640',\n\tEarth: '\u2641',\n\tMars: '\u2642',\n\tJupiter: '\u2643',\n\tSaturn: '\u2644',\n\tUranus: '\u2645',\n\tNeptune: '\u2646',\n\tPluto: '\u2647',\n\tRahu: '\u260A',\n\tKetu: '\u260B',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n\tNorthNode: '\u260A',\n\tSouthNode: '\u260B',\n\t'North node': '\u260A',\n\t'South node': '\u260B',\n\tChiron: '\u26B7',\n\tLilith: '\u26B8',\n\t'Black moon lilith': '\u26B8',\n};\n\nexport const PLANET_ABBR: Record<string, string> = {\n\tSun: 'Su',\n\tMoon: 'Mo',\n\tMercury: 'Me',\n\tVenus: 'Ve',\n\tMars: 'Ma',\n\tJupiter: 'Ju',\n\tSaturn: 'Sa',\n\tUranus: 'Ur',\n\tNeptune: 'Ne',\n\tPluto: 'Pl',\n\tRahu: 'Ra',\n\tKetu: 'Ke',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n};\n\nexport const SIGN_GLYPH: Record<string, string> = {\n\tAries: '\u2648',\n\tTaurus: '\u2649',\n\tGemini: '\u264A',\n\tCancer: '\u264B',\n\tLeo: '\u264C',\n\tVirgo: '\u264D',\n\tLibra: '\u264E',\n\tScorpio: '\u264F',\n\tSagittarius: '\u2650',\n\tCapricorn: '\u2651',\n\tAquarius: '\u2652',\n\tPisces: '\u2653',\n};\n\nexport const SIGN_ABBR: Record<string, string> = {\n\tAries: 'Ar',\n\tTaurus: 'Ta',\n\tGemini: 'Ge',\n\tCancer: 'Cn',\n\tLeo: 'Le',\n\tVirgo: 'Vi',\n\tLibra: 'Li',\n\tScorpio: 'Sc',\n\tSagittarius: 'Sg',\n\tCapricorn: 'Cp',\n\tAquarius: 'Aq',\n\tPisces: 'Pi',\n};\n\nexport const SIGNS_ORDER = [\n\t'Aries',\n\t'Taurus',\n\t'Gemini',\n\t'Cancer',\n\t'Leo',\n\t'Virgo',\n\t'Libra',\n\t'Scorpio',\n\t'Sagittarius',\n\t'Capricorn',\n\t'Aquarius',\n\t'Pisces',\n] as const;\n\n/**\n * Lowercase rashi keys in canonical zodiac order. Derived from `SIGNS_ORDER`\n * so the two stay in lockstep. The /vedic-astrology/birth-chart response\n * carries planet buckets keyed by these names.\n */\nexport const RASHI_KEYS = SIGNS_ORDER.map((s) =>\n\ts.toLowerCase(),\n) as readonly Lowercase<(typeof SIGNS_ORDER)[number]>[];\n\n/** Aspect symbols. Used by synastry and natal chart aspect tables. */\nexport const ASPECT_SYMBOL: Record<string, string> = {\n\tconjunction: '\u260C',\n\topposition: '\u260D',\n\ttrine: '\u25B3',\n\tsquare: '\u25A1',\n\tsextile: '\u2731',\n\tquincunx: '\u22BB',\n\tsemisextile: '\u22BC',\n};\n\n/** Trigrams used by I Ching hexagrams. Eight trigrams compose 64 hexagrams. */\nexport const TRIGRAM_GLYPH: Record<string, string> = {\n\theaven: '\u2630',\n\tlake: '\u2631',\n\tfire: '\u2632',\n\tthunder: '\u2633',\n\twind: '\u2634',\n\twater: '\u2635',\n\tmountain: '\u2636',\n\tearth: '\u2637',\n\tHeaven: '\u2630',\n\tLake: '\u2631',\n\tFire: '\u2632',\n\tThunder: '\u2633',\n\tWind: '\u2634',\n\tWater: '\u2635',\n\tMountain: '\u2636',\n\tEarth: '\u2637',\n};\n\n/** Moon phase emoji set. Used by moon phase card. */\nexport const MOON_PHASE_EMOJI: Record<string, string> = {\n\t'new moon': '\uD83C\uDF11',\n\t'waxing crescent': '\uD83C\uDF12',\n\t'first quarter': '\uD83C\uDF13',\n\t'waxing gibbous': '\uD83C\uDF14',\n\t'full moon': '\uD83C\uDF15',\n\t'waning gibbous': '\uD83C\uDF16',\n\t'last quarter': '\uD83C\uDF17',\n\t'waning crescent': '\uD83C\uDF18',\n};\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tcontainer-type: inline-size;\n\t\tfont-family: var(\n\t\t\t--roxy-font-sans,\n\t\t\tsystem-ui,\n\t\t\t-apple-system,\n\t\t\tBlinkMacSystemFont,\n\t\t\t'Segoe UI',\n\t\t\tRoboto,\n\t\t\tsans-serif\n\t\t);\n\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\tbackground: transparent;\n\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\tline-height: var(--roxy-leading-normal, 1.5);\n\t\tanimation: roxy-fade-in var(--roxy-motion-duration, 200ms)\n\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;\n\t}\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: border-box;\n\t}\n\n\t@keyframes roxy-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: translateY(2px);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: translateY(0);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-skeleton {\n\t\tbackground: linear-gradient(\n\t\t\t90deg,\n\t\t\tvar(--roxy-border, #e4e4e7) 0%,\n\t\t\tcolor-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent) 50%,\n\t\t\tvar(--roxy-border, #e4e4e7) 100%\n\t\t);\n\t\tbackground-size: 200% 100%;\n\t\tanimation: roxy-shimmer 1.4s ease-in-out infinite;\n\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t}\n\n\t@keyframes roxy-shimmer {\n\t\t0% {\n\t\t\tbackground-position: 200% 0;\n\t\t}\n\t\t100% {\n\t\t\tbackground-position: -200% 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.roxy-skeleton {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-empty {\n\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\tcolor: var(--roxy-muted, #71717a);\n\t\ttext-align: center;\n\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t}\n\n\t:host(:focus-within) .roxy-card {\n\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\toutline-offset: 2px;\n\t}\n`;\n", "/**\n * Math helpers for converting raw ecliptic longitude decimals into the\n * sign / degree / minute / second triplet used across chart components.\n */\n\nimport { SIGNS_ORDER } from '../tokens/index.js';\n\nexport interface SignPosition {\n\tsign: string;\n\tsignIndex: number;\n\tdegree: number;\n\tminute: number;\n\tsecond: number;\n}\n\n/**\n * Wrap longitude into [0, 360) so negative or out-of-range values still\n * resolve to a real sign. Robust to wonky upstream data.\n */\nexport function normalizeLongitude(lon: number): number {\n\tconst wrapped = lon % 360;\n\treturn wrapped < 0 ? wrapped + 360 : wrapped;\n}\n\n/**\n * Convert decimal ecliptic longitude (0-360) into sign/degree/minute/second.\n * Used by every chart wheel and aspect table.\n */\nexport function longitudeToSignPosition(longitude: number): SignPosition {\n\tconst lon = normalizeLongitude(longitude);\n\tconst signIndex = Math.floor(lon / 30) % 12;\n\tconst within = lon % 30;\n\tconst degree = Math.floor(within);\n\tconst minuteFloat = (within - degree) * 60;\n\tconst minute = Math.floor(minuteFloat);\n\tconst second = Math.round((minuteFloat - minute) * 60);\n\treturn {\n\t\tsign: SIGNS_ORDER[signIndex] ?? 'Aries',\n\t\tsignIndex,\n\t\tdegree,\n\t\tminute,\n\t\tsecond,\n\t};\n}\n\n/** Compact display string like \"12\u00B0 Leo 34'\". Used in chart labels. */\nexport function formatSignPosition(longitude: number): string {\n\tconst { sign, degree, minute } = longitudeToSignPosition(longitude);\n\treturn `${degree}\u00B0 ${sign} ${String(minute).padStart(2, '0')}'`;\n}\n\n/**\n * The point diametrically opposite a longitude (e.g. Descendant from\n * Ascendant, IC from MC). Exact derivation, always 180 degrees away.\n */\nexport function oppositePoint(longitude: number): number {\n\treturn normalizeLongitude(longitude + 180);\n}\n\n/**\n * Midpoint of the forward arc from `start` to `end` (both ecliptic\n * longitudes). Handles the 360/0 wrap, so a house spanning 350 to 20 degrees\n * yields a midpoint of 5, not 185. Used to place house numbers between two\n * cusps regardless of how unequal the house is.\n */\nexport function arcMidpoint(start: number, end: number): number {\n\tconst s = normalizeLongitude(start);\n\tlet span = normalizeLongitude(end) - s;\n\tif (span < 0) span += 360;\n\treturn normalizeLongitude(s + span / 2);\n}\n\n/** Polar to cartesian for SVG wheel positioning. Angle in degrees, 0 at 3 o'clock. */\nexport function polarToCartesian(\n\tcx: number,\n\tcy: number,\n\tradius: number,\n\tangleDeg: number,\n): { x: number; y: number } {\n\tconst angleRad = (angleDeg * Math.PI) / 180;\n\treturn {\n\t\tx: cx + radius * Math.cos(angleRad),\n\t\ty: cy + radius * Math.sin(angleRad),\n\t};\n}\n", "/**\n * Display formatters for ISO timestamps and floats coming back from the API.\n * Every helper returns \"\" for nullish or unparseable input so it falls out of\n * template literals cleanly.\n */\n\nexport function formatTime(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tif (/^\\d{4}-\\d{2}-\\d{2}$/.test(input)) return '';\n\tconst bareTime = /^\\d{2}:\\d{2}(:\\d{2})?$/.test(input);\n\tconst iso = bareTime ? `1970-01-01T${input}` : input;\n\tconst d = new Date(iso);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleTimeString(undefined, {\n\t\thour: 'numeric',\n\t\tminute: '2-digit',\n\t\thour12: true,\n\t});\n}\n\nexport function formatDate(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tconst d = new Date(\n\t\t/^\\d{4}-\\d{2}-\\d{2}$/.test(input) ? `${input}T00:00:00` : input,\n\t);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleDateString(undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t\tyear: 'numeric',\n\t});\n}\n\nexport function formatTimeRange(\n\tt: { start?: string; end?: string } | undefined,\n): string {\n\tif (!t) return '';\n\tconst start = formatTime(t.start);\n\tconst end = formatTime(t.end);\n\tif (start && end) return `${start} - ${end}`;\n\treturn start || end || '';\n}\n\nexport function formatNumber(value: unknown, dp = 1): string {\n\tif (typeof value !== 'number' || !Number.isFinite(value)) return '';\n\treturn value.toFixed(dp).replace(/\\.?0+$/, '');\n}\n\nexport function formatPercent(value: unknown, dp = 1): string {\n\tconst n = formatNumber(value, dp);\n\treturn n ? `${n}%` : '';\n}\n\n/**\n * CSS class name per aspect type. Used by natal and synastry chart aspect\n * lines so the same color encoding (harmonious vs challenging) applies in\n * both wheels. Keys are lowercase canonical names, values are CSS class\n * suffixes the chart components define in their `:host` styles.\n */\nexport const ASPECT_CLASS: Record<string, string> = {\n\tconjunction: 'aspect-conjunction',\n\tsextile: 'aspect-sextile',\n\tsquare: 'aspect-square',\n\ttrine: 'aspect-trine',\n\topposition: 'aspect-opposition',\n};\n\n/**\n * Normalize the `type` field on an aspect entry to a lowercase, hyphen-separated\n * canonical name (`SEMI_SEXTILE` \u2192 `semi-sextile`). Accepts any aspect-shaped\n * object so both natal and synastry inter-aspect entries can share this.\n */\nexport function normalizeAspect(a: { type?: string }): string {\n\treturn (a.type ?? '').toLowerCase().replace(/_/g, '-');\n}\n", "/**\n * Shared string helpers used across components. Single source of truth so the\n * same formatting rules apply to every key/label/title that surfaces in the\n * shadow tree.\n *\n * - `capitalize`: title-cases the first character, lowercases the rest. Used\n * when matching API-supplied planet/sign names against the glyph maps in\n * `tokens/index.ts`, which use canonical TitleCase keys.\n * - `humanize`: turns an API key (`birth_date`, `birthDate`, `mahadasha-end`)\n * into a label suitable for display (\"Birth date\", \"Mahadasha end\").\n */\n\nexport function capitalize(s: string): string {\n\tif (!s) return '';\n\treturn s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();\n}\n\nexport function humanize(s: string): string {\n\treturn s\n\t\t.replace(/[_-]+/g, ' ')\n\t\t.replace(/([a-z])([A-Z])/g, '$1 $2')\n\t\t.replace(/^\\w/, (c) => c.toUpperCase());\n}\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { css, html, LitElement, nothing, svg } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { PLANET_GLYPH, SIGN_GLYPH, SIGNS_ORDER } from '../tokens/index.js';\nimport type {\n\tCalculateSynastryResponse,\n\tNatalChartResponse,\n} from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\nimport { longitudeToSignPosition, polarToCartesian } from '../utils/degree.js';\nimport {\n\tASPECT_CLASS,\n\tformatNumber,\n\tnormalizeAspect,\n} from '../utils/format.js';\nimport { capitalize } from '../utils/string.js';\n\ntype PlanetEntry = NatalChartResponse['planets'][number];\ntype InterAspect = CalculateSynastryResponse['interAspects'][number];\n\n// Drawing the dual wheel requires per-person planet longitudes alongside\n// the synastry response. Callers can merge planet arrays from\n// /astrology/natal-chart into `person1.planets` and `person2.planets`\n// before passing the payload in; without them, the component falls back\n// to the inter-aspects table and a status note instead of an empty wheel.\ntype SynastryWithPlanets = CalculateSynastryResponse & {\n\tperson1?: { planets?: PlanetEntry[] };\n\tperson2?: { planets?: PlanetEntry[] };\n};\n\nconst SIZE = 360;\nconst CENTER = SIZE / 2;\nconst OUTER_R = 170;\nconst SIGN_R = 154;\nconst P1_R = 124;\nconst P2_R = 96;\n\n/**\n * Dual-wheel synastry chart with inter-aspects table. Pass `data` from\n * /astrology/synastry.\n */\n@customElement('roxy-synastry-chart')\nexport class RoxySynastryChart extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`\n\t\t\t.wrap {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t}\n\n\t\t\t.head {\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: space-between;\n\t\t\t\talign-items: center;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t\tflex-wrap: wrap;\n\t\t\t}\n\n\t\t\t.title {\n\t\t\t\tfont-size: var(--roxy-text-lg, 1.125rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.score {\n\t\t\t\tfont-variant-numeric: tabular-nums;\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tcolor: var(--roxy-accent-fg, #b45309);\n\t\t\t\tfont-size: var(--roxy-text-xl, 1.5rem);\n\t\t\t}\n\n\t\t\tsvg {\n\t\t\t\tdisplay: block;\n\t\t\t\twidth: 100%;\n\t\t\t\tmax-width: 560px;\n\t\t\t\taspect-ratio: 1 / 1;\n\t\t\t\theight: auto;\n\t\t\t\tmargin: 0 auto;\n\t\t\t}\n\n\t\t\t.wheel-line {\n\t\t\t\tfill: none;\n\t\t\t\tstroke: var(--roxy-border, #e4e4e7);\n\t\t\t}\n\t\t\t.sign {\n\t\t\t\tfill: var(--roxy-secondary, #475569);\n\t\t\t\tfont-size: 14px;\n\t\t\t}\n\t\t\t.p1 {\n\t\t\t\tfill: var(--roxy-accent, #f59e0b);\n\t\t\t\tfont-weight: 600;\n\t\t\t\tfont-size: 13px;\n\t\t\t}\n\t\t\t.p2 {\n\t\t\t\tfill: var(--roxy-info, #0284c7);\n\t\t\t\tfont-weight: 600;\n\t\t\t\tfont-size: 13px;\n\t\t\t}\n\t\t\t.person-tag {\n\t\t\t\tfont-size: 7px;\n\t\t\t\tfont-weight: 700;\n\t\t\t\topacity: 0.85;\n\t\t\t}\n\t\t\t.planet-deg {\n\t\t\t\tfill: var(--roxy-muted, #71717a);\n\t\t\t\tfont-size: 7px;\n\t\t\t\tfont-family: var(--roxy-font-sans);\n\t\t\t}\n\t\t\t.planet-deg .retro {\n\t\t\t\tfill: var(--roxy-danger, #dc2626);\n\t\t\t}\n\t\t\t.asc-tick {\n\t\t\t\tstroke: var(--roxy-accent-fg, #b45309);\n\t\t\t\tstroke-width: 1;\n\t\t\t\topacity: 0.75;\n\t\t\t}\n\t\t\t.asc-label {\n\t\t\t\tfill: var(--roxy-accent-fg, #b45309);\n\t\t\t\tfont-size: 9px;\n\t\t\t\tfont-weight: 700;\n\t\t\t\tfont-family: var(--roxy-font-sans);\n\t\t\t\tletter-spacing: 0.04em;\n\t\t\t}\n\t\t\t.aspect {\n\t\t\t\tstroke-width: 0.8;\n\t\t\t\tfill: none;\n\t\t\t\topacity: 0.5;\n\t\t\t}\n\t\t\t.aspect-trine,\n\t\t\t.aspect-sextile {\n\t\t\t\tstroke: var(--roxy-success, #16a34a);\n\t\t\t}\n\t\t\t.aspect-square,\n\t\t\t.aspect-opposition {\n\t\t\t\tstroke: var(--roxy-danger, #dc2626);\n\t\t\t}\n\t\t\t.aspect-conjunction {\n\t\t\t\tstroke: var(--roxy-accent-fg, #b45309);\n\t\t\t}\n\t\t\t.aspect-other {\n\t\t\t\tstroke: var(--roxy-muted, #71717a);\n\t\t\t\topacity: 0.35;\n\t\t\t}\n\t\t\t.legend-row {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-wrap: wrap;\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tmargin-top: calc(var(--roxy-space-xs, 0.25rem) * -1);\n\t\t\t}\n\t\t\t.legend-row .swatch {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\twidth: 8px;\n\t\t\t\theight: 8px;\n\t\t\t\tborder-radius: 50%;\n\t\t\t\tmargin-right: 4px;\n\t\t\t\tvertical-align: middle;\n\t\t\t}\n\n\t\t\t.summary {\n\t\t\t\tmargin: 0;\n\t\t\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\t\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\t\t}\n\n\t\t\ttable {\n\t\t\t\twidth: 100%;\n\t\t\t\tborder-collapse: collapse;\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t}\n\t\t\tth,\n\t\t\ttd {\n\t\t\t\tpadding: var(--roxy-space-sm, 0.5rem);\n\t\t\t\tborder-bottom: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\ttext-align: left;\n\t\t\t}\n\t\t\tth {\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tletter-spacing: 0.06em;\n\t\t\t}\n\t\t\ttd.orb {\n\t\t\t\tfont-variant-numeric: tabular-nums;\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t}\n\n\t\t\t.lists {\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));\n\t\t\t\tgap: var(--roxy-space-md, 1rem);\n\t\t\t}\n\t\t\t.lists h3 {\n\t\t\t\tmargin: 0 0 var(--roxy-space-xs, 0.25rem) 0;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\tletter-spacing: 0.06em;\n\t\t\t}\n\t\t\t.lists ul {\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding-left: var(--roxy-space-md, 1rem);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t}\n\n\t\t\t.missing-planets {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-accent, #f59e0b) 8%, transparent);\n\t\t\t\tborder: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tpadding: var(--roxy-space-md, 1rem);\n\t\t\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\tline-height: 1.5;\n\t\t\t}\n\t\t\t.missing-planets code {\n\t\t\t\tfont-family: var(--roxy-font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);\n\t\t\t\tfont-size: 0.95em;\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-fg, #0a0a0a) 6%, transparent);\n\t\t\t\tpadding: 0 4px;\n\t\t\t\tborder-radius: 4px;\n\t\t\t}\n\t\t`,\n\t];\n\n\t@property({ attribute: false })\n\tdata: SynastryWithPlanets | null = null;\n\n\trender() {\n\t\tif (!this.data)\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No synastry data</div>`;\n\t\tconst { person1, person2, compatibilityScore, analysis } = this.data;\n\t\tconst interAspects = this.data.interAspects ?? [];\n\t\tconst p1Planets = person1?.planets ?? [];\n\t\tconst p2Planets = person2?.planets ?? [];\n\n\t\tconst score =\n\t\t\ttypeof compatibilityScore === 'number'\n\t\t\t\t? Math.round(compatibilityScore)\n\t\t\t\t: undefined;\n\t\tconst summaryText = analysis?.overall;\n\t\tconst strengths = analysis?.strengths ?? [];\n\t\tconst challenges = analysis?.challenges ?? [];\n\n\t\t// /astrology/synastry does not return per-person planet positions, so the\n\t\t// dual-wheel cannot be drawn from a bare synastry response. Surface this\n\t\t// explicitly instead of rendering a blank wheel; keep the inter-aspects\n\t\t// table when it is present so callers still get useful output.\n\t\tconst hasPlanets = p1Planets.length > 0 && p2Planets.length > 0;\n\t\tif (!hasPlanets) {\n\t\t\treturn html`<div\n\t\t\t\tclass=\"wrap\"\n\t\t\t\taria-label=\"Synastry compatibility chart\"\n\t\t\t>\n\t\t\t\t<div class=\"head\">\n\t\t\t\t\t<h2 class=\"title\">Synastry</h2>\n\t\t\t\t\t${\n\t\t\t\t\t\ttypeof score === 'number'\n\t\t\t\t\t\t\t? html`<span class=\"score\" aria-label=${`Score ${score} of 100`}\n\t\t\t\t\t\t\t\t>${score} / 100</span\n\t\t\t\t\t\t\t>`\n\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t}\n\t\t\t\t</div>\n\t\t\t\t<div class=\"missing-planets\" role=\"status\">\n\t\t\t\t\tSynastry response missing planet positions. Pass\n\t\t\t\t\t<code>data</code> with <code>person1.planets</code> and\n\t\t\t\t\t<code>person2.planets</code> arrays from the natal-chart endpoint, or\n\t\t\t\t\tuse the <code>&lt;roxy-data&gt;</code> fallback.\n\t\t\t\t</div>\n\t\t\t\t${summaryText ? html`<p class=\"summary\">${summaryText}</p>` : nothing}\n\t\t\t\t${interAspects.length > 0 ? this.renderAspects(interAspects) : nothing}\n\t\t\t\t${\n\t\t\t\t\tstrengths.length > 0 || challenges.length > 0\n\t\t\t\t\t\t? html`<div class=\"lists\">\n\t\t\t\t\t\t\t${\n\t\t\t\t\t\t\t\tstrengths.length\n\t\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t\t<h3>Strengths</h3>\n\t\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t\t${strengths.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t${\n\t\t\t\t\t\t\t\tchallenges.length\n\t\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t\t<h3>Challenges</h3>\n\t\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t\t${challenges.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t</div>`;\n\t\t}\n\n\t\treturn html`<div\n\t\t\tclass=\"wrap\"\n\t\t\taria-label=\"Synastry compatibility chart\"\n\t\t>\n\t\t\t<div class=\"head\">\n\t\t\t\t<h2 class=\"title\">Synastry</h2>\n\t\t\t\t${\n\t\t\t\t\ttypeof score === 'number'\n\t\t\t\t\t\t? html`<span class=\"score\" aria-label=${`Score ${score} of 100`}\n\t\t\t\t\t\t\t>${score} / 100</span\n\t\t\t\t\t\t>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<svg\n\t\t\t\tviewBox=\"0 0 ${SIZE} ${SIZE}\"\n\t\t\t\trole=\"img\"\n\t\t\t\taria-label=\"Dual chart wheel comparing two natal charts\"\n\t\t\t>\n\t\t\t\t<title>Synastry dual wheel</title>\n\t\t\t\t<circle\n\t\t\t\t\tclass=\"wheel-line\"\n\t\t\t\t\tcx=${CENTER}\n\t\t\t\t\tcy=${CENTER}\n\t\t\t\t\tr=${OUTER_R}\n\t\t\t\t\tstroke-width=\"1.5\"\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tclass=\"wheel-line\"\n\t\t\t\t\tcx=${CENTER}\n\t\t\t\t\tcy=${CENTER}\n\t\t\t\t\tr=${P2_R + 14}\n\t\t\t\t\tstroke-width=\"0.8\"\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tclass=\"wheel-line\"\n\t\t\t\t\tcx=${CENTER}\n\t\t\t\t\tcy=${CENTER}\n\t\t\t\t\tr=${P2_R - 14}\n\t\t\t\t\tstroke-width=\"0.6\"\n\t\t\t\t/>\n\t\t\t\t${this.renderSpokes()} ${this.renderSigns()}\n\t\t\t\t${this.renderInterAspectLines(p1Planets, p2Planets, interAspects)}\n\t\t\t\t${this.renderRing(p1Planets, P1_R, 'p1', 1)} ${this.renderRing(p2Planets, P2_R, 'p2', 2)}\n\t\t\t\t${this.renderAscendants(this.data)}\n\t\t\t</svg>\n\t\t\t<div class=\"legend-row\">\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-accent)\"></span>Person 1</span>\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-info)\"></span>Person 2</span>\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-success)\"></span>harmonious</span>\n\t\t\t\t<span><span class=\"swatch\" style=\"background: var(--roxy-danger)\"></span>challenging</span>\n\t\t\t</div>\n\t\t\t${summaryText ? html`<p class=\"summary\">${summaryText}</p>` : nothing}\n\t\t\t${interAspects.length > 0 ? this.renderAspects(interAspects) : nothing}\n\t\t\t${\n\t\t\t\tstrengths.length > 0 || challenges.length > 0\n\t\t\t\t\t? html`<div class=\"lists\">\n\t\t\t\t\t\t${\n\t\t\t\t\t\t\tstrengths.length\n\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t<h3>Strengths</h3>\n\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t${strengths.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t}\n\t\t\t\t\t\t${\n\t\t\t\t\t\t\tchallenges.length\n\t\t\t\t\t\t\t\t? html`<div>\n\t\t\t\t\t\t\t\t\t<h3>Challenges</h3>\n\t\t\t\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t\t\t\t${challenges.map((s) => html`<li>${s}</li>`)}\n\t\t\t\t\t\t\t\t\t</ul>\n\t\t\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t\t\t: nothing\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>`\n\t\t\t\t\t: nothing\n\t\t\t}\n\t\t</div>`;\n\t}\n\n\tprivate toAngle(longitude: number): number {\n\t\treturn 180 - longitude;\n\t}\n\n\tprivate renderSpokes() {\n\t\treturn Array.from({ length: 12 }, (_, i) => {\n\t\t\tconst angle = this.toAngle(i * 30);\n\t\t\tconst start = polarToCartesian(CENTER, CENTER, P2_R - 14, angle);\n\t\t\tconst end = polarToCartesian(CENTER, CENTER, OUTER_R, angle);\n\t\t\treturn svg`<line class=\"wheel-line\" x1=${start.x} y1=${start.y} x2=${end.x} y2=${end.y} stroke-width=\"0.6\" />`;\n\t\t});\n\t}\n\n\tprivate renderSigns() {\n\t\treturn SIGNS_ORDER.map((s, i) => {\n\t\t\tconst angle = this.toAngle(i * 30 + 15);\n\t\t\tconst pos = polarToCartesian(CENTER, CENTER, SIGN_R, angle);\n\t\t\treturn svg`<text class=\"sign\" x=${pos.x} y=${pos.y} text-anchor=\"middle\" dominant-baseline=\"central\">${SIGN_GLYPH[s]}</text>`;\n\t\t});\n\t}\n\n\tprivate renderRing(\n\t\tplanets: PlanetEntry[],\n\t\tradius: number,\n\t\tcls: string,\n\t\tpersonIndex: 1 | 2,\n\t) {\n\t\treturn planets.map((p) => {\n\t\t\tif (!Number.isFinite(p.longitude)) return nothing;\n\t\t\tconst angle = this.toAngle(p.longitude);\n\t\t\tconst pos = polarToCartesian(CENTER, CENTER, radius, angle);\n\t\t\t// Degree label sits one tier inward from the glyph so the two\n\t\t\t// concentric rings never blur their numbers into the aspect lines.\n\t\t\tconst degOffset = personIndex === 1 ? -12 : -10;\n\t\t\tconst degPos = polarToCartesian(\n\t\t\t\tCENTER,\n\t\t\t\tCENTER,\n\t\t\t\tradius + degOffset,\n\t\t\t\tangle,\n\t\t\t);\n\t\t\tconst glyph = PLANET_GLYPH[capitalize(p.name)] ?? p.name.slice(0, 2);\n\t\t\tconst sp = longitudeToSignPosition(p.longitude);\n\t\t\tconst retro = p.isRetrograde === true;\n\t\t\tconst degLabel = `${sp.degree}\u00B0${String(sp.minute).padStart(2, '0')}'`;\n\t\t\tconst tooltip = `${p.name}${retro ? ' retrograde' : ''} - ${degLabel} ${sp.sign}`;\n\t\t\treturn svg`<g>\n\t\t\t\t<text class=${cls} x=${pos.x} y=${pos.y} text-anchor=\"middle\" dominant-baseline=\"central\"><title>${tooltip}</title>${glyph}<tspan class=\"person-tag\" dy=\"-0.55em\" dx=\"0.15em\">${personIndex}</tspan></text>\n\t\t\t\t<text class=\"planet-deg\" x=${degPos.x} y=${degPos.y} text-anchor=\"middle\" dominant-baseline=\"central\">${sp.degree}\u00B0${retro ? svg`<tspan class=\"retro\"> \u211E</tspan>` : nothing}</text>\n\t\t\t</g>`;\n\t\t});\n\t}\n\n\t/**\n\t * Ascendant markers for both people. Drawn as small spokes at the inner\n\t * rim with the label outside, so the two rising signs are immediately\n\t * scannable on the wheel without depending on tooltips.\n\t */\n\tprivate renderAscendants(data: SynastryWithPlanets) {\n\t\tconst items: ReturnType<typeof svg>[] = [];\n\t\tconst make = (\n\t\t\tasc: { sign: string; degree: number } | undefined,\n\t\t\tpersonIndex: 1 | 2,\n\t\t) => {\n\t\t\tif (!asc) return;\n\t\t\tconst signIdx = SIGNS_ORDER.findIndex(\n\t\t\t\t(s) => s.toLowerCase() === asc.sign.toLowerCase(),\n\t\t\t);\n\t\t\tif (signIdx === -1) return;\n\t\t\tconst longitude = signIdx * 30 + asc.degree;\n\t\t\tconst angle = this.toAngle(longitude);\n\t\t\tconst innerR = personIndex === 1 ? P1_R + 14 : P2_R + 14;\n\t\t\tconst tickPos = polarToCartesian(CENTER, CENTER, innerR, angle);\n\t\t\tconst labelPos = polarToCartesian(CENTER, CENTER, OUTER_R + 14, angle);\n\t\t\titems.push(svg`<g>\n\t\t\t\t<line class=\"asc-tick\" x1=${tickPos.x} y1=${tickPos.y} x2=${labelPos.x} y2=${labelPos.y} />\n\t\t\t\t<text class=\"asc-label\" x=${labelPos.x} y=${labelPos.y} text-anchor=\"middle\" dominant-baseline=\"central\">Asc${personIndex}</text>\n\t\t\t</g>`);\n\t\t};\n\t\tmake(data.person1?.ascendant, 1);\n\t\tmake(data.person2?.ascendant, 2);\n\t\treturn items;\n\t}\n\n\tprivate renderInterAspectLines(\n\t\tp1: PlanetEntry[],\n\t\tp2: PlanetEntry[],\n\t\taspects: InterAspect[],\n\t) {\n\t\tconst longitudeOf = (\n\t\t\tlist: PlanetEntry[],\n\t\t\tname: string,\n\t\t): number | undefined => {\n\t\t\tconst target = capitalize(name);\n\t\t\tfor (const p of list) {\n\t\t\t\tif (capitalize(p.name) !== target) continue;\n\t\t\t\tif (typeof p.longitude === 'number') return p.longitude;\n\t\t\t}\n\t\t\treturn undefined;\n\t\t};\n\t\treturn aspects.map((a) => {\n\t\t\tconst l1 = longitudeOf(p1, a.planet1);\n\t\t\tconst l2 = longitudeOf(p2, a.planet2);\n\t\t\tif (l1 === undefined || l2 === undefined) return nothing;\n\t\t\tconst out = polarToCartesian(CENTER, CENTER, P1_R - 12, this.toAngle(l1));\n\t\t\tconst inn = polarToCartesian(CENTER, CENTER, P2_R + 8, this.toAngle(l2));\n\t\t\tconst aspectName = normalizeAspect(a);\n\t\t\tconst cls = ASPECT_CLASS[aspectName] ?? 'aspect-other';\n\t\t\tconst orbLabel = formatNumber(a.orb, 1);\n\t\t\treturn svg`<line class=${`aspect ${cls}`} x1=${out.x} y1=${out.y} x2=${inn.x} y2=${inn.y}><title>${a.planet1} ${aspectName} ${a.planet2}${orbLabel ? ` (orb ${orbLabel}\u00B0)` : ''}</title></line>`;\n\t\t});\n\t}\n\n\tprivate renderAspects(aspects: InterAspect[]) {\n\t\treturn html`<table>\n\t\t\t<thead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th>Planet 1</th>\n\t\t\t\t\t<th>Planet 2</th>\n\t\t\t\t\t<th>Aspect</th>\n\t\t\t\t\t<th>Orb</th>\n\t\t\t\t\t<th>Strength</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody>\n\t\t\t\t${aspects.slice(0, 12).map(\n\t\t\t\t\t(a) => html`<tr>\n\t\t\t\t\t\t<td>${a.planet1}</td>\n\t\t\t\t\t\t<td>${a.planet2}</td>\n\t\t\t\t\t\t<td>${normalizeAspect(a) || ''}</td>\n\t\t\t\t\t\t<td class=\"orb\">${formatNumber(a.orb, 1)}</td>\n\t\t\t\t\t\t<td>${formatStrength(a.strength)}</td>\n\t\t\t\t\t</tr>`,\n\t\t\t\t)}\n\t\t\t</tbody>\n\t\t</table>`;\n\t}\n}\n\nfunction formatStrength(s: number | undefined): string {\n\tif (typeof s === 'number') return Math.round(s).toString();\n\treturn '';\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-synastry-chart': RoxySynastryChart;\n\t}\n}\n", "/**\n * Symbol constants used across components. Single source of truth so chart\n * wheels, card headers, hexagram displays, and panchang tables stay visually\n * consistent.\n */\n\nexport const PLANET_GLYPH: Record<string, string> = {\n\tSun: '\u2609',\n\tMoon: '\u263D',\n\tMercury: '\u263F',\n\tVenus: '\u2640',\n\tEarth: '\u2641',\n\tMars: '\u2642',\n\tJupiter: '\u2643',\n\tSaturn: '\u2644',\n\tUranus: '\u2645',\n\tNeptune: '\u2646',\n\tPluto: '\u2647',\n\tRahu: '\u260A',\n\tKetu: '\u260B',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n\tNorthNode: '\u260A',\n\tSouthNode: '\u260B',\n\t'North node': '\u260A',\n\t'South node': '\u260B',\n\tChiron: '\u26B7',\n\tLilith: '\u26B8',\n\t'Black moon lilith': '\u26B8',\n};\n\nexport const PLANET_ABBR: Record<string, string> = {\n\tSun: 'Su',\n\tMoon: 'Mo',\n\tMercury: 'Me',\n\tVenus: 'Ve',\n\tMars: 'Ma',\n\tJupiter: 'Ju',\n\tSaturn: 'Sa',\n\tUranus: 'Ur',\n\tNeptune: 'Ne',\n\tPluto: 'Pl',\n\tRahu: 'Ra',\n\tKetu: 'Ke',\n\tAscendant: 'Asc',\n\tLagna: 'La',\n};\n\nexport const SIGN_GLYPH: Record<string, string> = {\n\tAries: '\u2648',\n\tTaurus: '\u2649',\n\tGemini: '\u264A',\n\tCancer: '\u264B',\n\tLeo: '\u264C',\n\tVirgo: '\u264D',\n\tLibra: '\u264E',\n\tScorpio: '\u264F',\n\tSagittarius: '\u2650',\n\tCapricorn: '\u2651',\n\tAquarius: '\u2652',\n\tPisces: '\u2653',\n};\n\nexport const SIGN_ABBR: Record<string, string> = {\n\tAries: 'Ar',\n\tTaurus: 'Ta',\n\tGemini: 'Ge',\n\tCancer: 'Cn',\n\tLeo: 'Le',\n\tVirgo: 'Vi',\n\tLibra: 'Li',\n\tScorpio: 'Sc',\n\tSagittarius: 'Sg',\n\tCapricorn: 'Cp',\n\tAquarius: 'Aq',\n\tPisces: 'Pi',\n};\n\nexport const SIGNS_ORDER = [\n\t'Aries',\n\t'Taurus',\n\t'Gemini',\n\t'Cancer',\n\t'Leo',\n\t'Virgo',\n\t'Libra',\n\t'Scorpio',\n\t'Sagittarius',\n\t'Capricorn',\n\t'Aquarius',\n\t'Pisces',\n] as const;\n\n/**\n * Lowercase rashi keys in canonical zodiac order. Derived from `SIGNS_ORDER`\n * so the two stay in lockstep. The /vedic-astrology/birth-chart response\n * carries planet buckets keyed by these names.\n */\nexport const RASHI_KEYS = SIGNS_ORDER.map((s) =>\n\ts.toLowerCase(),\n) as readonly Lowercase<(typeof SIGNS_ORDER)[number]>[];\n\n/** Aspect symbols. Used by synastry and natal chart aspect tables. */\nexport const ASPECT_SYMBOL: Record<string, string> = {\n\tconjunction: '\u260C',\n\topposition: '\u260D',\n\ttrine: '\u25B3',\n\tsquare: '\u25A1',\n\tsextile: '\u2731',\n\tquincunx: '\u22BB',\n\tsemisextile: '\u22BC',\n};\n\n/** Trigrams used by I Ching hexagrams. Eight trigrams compose 64 hexagrams. */\nexport const TRIGRAM_GLYPH: Record<string, string> = {\n\theaven: '\u2630',\n\tlake: '\u2631',\n\tfire: '\u2632',\n\tthunder: '\u2633',\n\twind: '\u2634',\n\twater: '\u2635',\n\tmountain: '\u2636',\n\tearth: '\u2637',\n\tHeaven: '\u2630',\n\tLake: '\u2631',\n\tFire: '\u2632',\n\tThunder: '\u2633',\n\tWind: '\u2634',\n\tWater: '\u2635',\n\tMountain: '\u2636',\n\tEarth: '\u2637',\n};\n\n/** Moon phase emoji set. Used by moon phase card. */\nexport const MOON_PHASE_EMOJI: Record<string, string> = {\n\t'new moon': '\uD83C\uDF11',\n\t'waxing crescent': '\uD83C\uDF12',\n\t'first quarter': '\uD83C\uDF13',\n\t'waxing gibbous': '\uD83C\uDF14',\n\t'full moon': '\uD83C\uDF15',\n\t'waning gibbous': '\uD83C\uDF16',\n\t'last quarter': '\uD83C\uDF17',\n\t'waning crescent': '\uD83C\uDF18',\n};\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tcontainer-type: inline-size;\n\t\tfont-family: var(\n\t\t\t--roxy-font-sans,\n\t\t\tsystem-ui,\n\t\t\t-apple-system,\n\t\t\tBlinkMacSystemFont,\n\t\t\t'Segoe UI',\n\t\t\tRoboto,\n\t\t\tsans-serif\n\t\t);\n\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\tbackground: transparent;\n\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\tline-height: var(--roxy-leading-normal, 1.5);\n\t\tanimation: roxy-fade-in var(--roxy-motion-duration, 200ms)\n\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;\n\t}\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: border-box;\n\t}\n\n\t@keyframes roxy-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: translateY(2px);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: translateY(0);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-skeleton {\n\t\tbackground: linear-gradient(\n\t\t\t90deg,\n\t\t\tvar(--roxy-border, #e4e4e7) 0%,\n\t\t\tcolor-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent) 50%,\n\t\t\tvar(--roxy-border, #e4e4e7) 100%\n\t\t);\n\t\tbackground-size: 200% 100%;\n\t\tanimation: roxy-shimmer 1.4s ease-in-out infinite;\n\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t}\n\n\t@keyframes roxy-shimmer {\n\t\t0% {\n\t\t\tbackground-position: 200% 0;\n\t\t}\n\t\t100% {\n\t\t\tbackground-position: -200% 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.roxy-skeleton {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-empty {\n\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\tcolor: var(--roxy-muted, #71717a);\n\t\ttext-align: center;\n\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t}\n\n\t:host(:focus-within) .roxy-card {\n\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\toutline-offset: 2px;\n\t}\n\n\t/* Force the text-style variant on every Unicode glyph in the component.\n\t * macOS and iOS substitute coloured emoji glyphs for the planetary and\n\t * gender Unicode code points (Mars, Venus, Mercury, etc.) when the\n\t * system colour-emoji font wins font selection. The text-style variant\n\t * keeps glyphs monochrome so they inherit the surrounding fill colour\n\t * and match the brand palette consistently across platforms.\n\t *\n\t * font-variant-emoji is part of CSS Fonts 4 (Safari 17+, Chrome 134+,\n\t * Firefox 139+). On older browsers the rule is silently ignored.\n\t */\n\t:host {\n\t\tfont-variant-emoji: text;\n\t}\n`;\n", "/**\n * Math helpers for converting raw ecliptic longitude decimals into the\n * sign / degree / minute / second triplet used across chart components.\n */\n\nimport { SIGNS_ORDER } from '../tokens/index.js';\n\nexport interface SignPosition {\n\tsign: string;\n\tsignIndex: number;\n\tdegree: number;\n\tminute: number;\n\tsecond: number;\n}\n\n/**\n * Wrap longitude into [0, 360) so negative or out-of-range values still\n * resolve to a real sign. Robust to wonky upstream data.\n */\nexport function normalizeLongitude(lon: number): number {\n\tconst wrapped = lon % 360;\n\treturn wrapped < 0 ? wrapped + 360 : wrapped;\n}\n\n/**\n * Convert decimal ecliptic longitude (0-360) into sign/degree/minute/second.\n * Used by every chart wheel and aspect table.\n */\nexport function longitudeToSignPosition(longitude: number): SignPosition {\n\tconst lon = normalizeLongitude(longitude);\n\tconst signIndex = Math.floor(lon / 30) % 12;\n\tconst within = lon % 30;\n\tconst degree = Math.floor(within);\n\tconst minuteFloat = (within - degree) * 60;\n\tconst minute = Math.floor(minuteFloat);\n\tconst second = Math.round((minuteFloat - minute) * 60);\n\treturn {\n\t\tsign: SIGNS_ORDER[signIndex] ?? 'Aries',\n\t\tsignIndex,\n\t\tdegree,\n\t\tminute,\n\t\tsecond,\n\t};\n}\n\n/** Compact display string like \"12\u00B0 Leo 34'\". Used in chart labels. */\nexport function formatSignPosition(longitude: number): string {\n\tconst { sign, degree, minute } = longitudeToSignPosition(longitude);\n\treturn `${degree}\u00B0 ${sign} ${String(minute).padStart(2, '0')}'`;\n}\n\n/**\n * The point diametrically opposite a longitude (e.g. Descendant from\n * Ascendant, IC from MC). Exact derivation, always 180 degrees away.\n */\nexport function oppositePoint(longitude: number): number {\n\treturn normalizeLongitude(longitude + 180);\n}\n\n/**\n * Midpoint of the forward arc from `start` to `end` (both ecliptic\n * longitudes). Handles the 360/0 wrap, so a house spanning 350 to 20 degrees\n * yields a midpoint of 5, not 185. Used to place house numbers between two\n * cusps regardless of how unequal the house is.\n */\nexport function arcMidpoint(start: number, end: number): number {\n\tconst s = normalizeLongitude(start);\n\tlet span = normalizeLongitude(end) - s;\n\tif (span < 0) span += 360;\n\treturn normalizeLongitude(s + span / 2);\n}\n\n/** Polar to cartesian for SVG wheel positioning. Angle in degrees, 0 at 3 o'clock. */\nexport function polarToCartesian(\n\tcx: number,\n\tcy: number,\n\tradius: number,\n\tangleDeg: number,\n): { x: number; y: number } {\n\tconst angleRad = (angleDeg * Math.PI) / 180;\n\treturn {\n\t\tx: cx + radius * Math.cos(angleRad),\n\t\ty: cy + radius * Math.sin(angleRad),\n\t};\n}\n", "/**\n * Display formatters for ISO timestamps and floats coming back from the API.\n * Every helper returns \"\" for nullish or unparseable input so it falls out of\n * template literals cleanly.\n */\n\nexport function formatTime(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tif (/^\\d{4}-\\d{2}-\\d{2}$/.test(input)) return '';\n\tconst bareTime = /^\\d{2}:\\d{2}(:\\d{2})?$/.test(input);\n\tconst iso = bareTime ? `1970-01-01T${input}` : input;\n\tconst d = new Date(iso);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleTimeString(undefined, {\n\t\thour: 'numeric',\n\t\tminute: '2-digit',\n\t\thour12: true,\n\t});\n}\n\nexport function formatDate(input: unknown): string {\n\tif (typeof input !== 'string' || input.length === 0) return '';\n\tconst d = new Date(\n\t\t/^\\d{4}-\\d{2}-\\d{2}$/.test(input) ? `${input}T00:00:00` : input,\n\t);\n\tif (Number.isNaN(d.getTime())) return input;\n\treturn d.toLocaleDateString(undefined, {\n\t\tmonth: 'short',\n\t\tday: 'numeric',\n\t\tyear: 'numeric',\n\t});\n}\n\nexport function formatTimeRange(\n\tt: { start?: string; end?: string } | undefined,\n): string {\n\tif (!t) return '';\n\tconst start = formatTime(t.start);\n\tconst end = formatTime(t.end);\n\tif (start && end) return `${start} - ${end}`;\n\treturn start || end || '';\n}\n\nexport function formatNumber(value: unknown, dp = 1): string {\n\tif (typeof value !== 'number' || !Number.isFinite(value)) return '';\n\treturn value.toFixed(dp).replace(/\\.?0+$/, '');\n}\n\nexport function formatPercent(value: unknown, dp = 1): string {\n\tconst n = formatNumber(value, dp);\n\treturn n ? `${n}%` : '';\n}\n\n/**\n * CSS class name per aspect type. Used by natal and synastry chart aspect\n * lines so the same color encoding (harmonious vs challenging) applies in\n * both wheels. Keys are lowercase canonical names, values are CSS class\n * suffixes the chart components define in their `:host` styles.\n */\nexport const ASPECT_CLASS: Record<string, string> = {\n\tconjunction: 'aspect-conjunction',\n\tsextile: 'aspect-sextile',\n\tsquare: 'aspect-square',\n\ttrine: 'aspect-trine',\n\topposition: 'aspect-opposition',\n};\n\n/**\n * Normalize the `type` field on an aspect entry to a lowercase, hyphen-separated\n * canonical name (`SEMI_SEXTILE` \u2192 `semi-sextile`). Accepts any aspect-shaped\n * object so both natal and synastry inter-aspect entries can share this.\n */\nexport function normalizeAspect(a: { type?: string }): string {\n\treturn (a.type ?? '').toLowerCase().replace(/_/g, '-');\n}\n", "/**\n * Shared string helpers used across components. Single source of truth so the\n * same formatting rules apply to every key/label/title that surfaces in the\n * shadow tree.\n *\n * - `capitalize`: title-cases the first character, lowercases the rest. Used\n * when matching API-supplied planet/sign names against the glyph maps in\n * `tokens/index.ts`, which use canonical TitleCase keys.\n * - `humanize`: turns an API key (`birth_date`, `birthDate`, `mahadasha-end`)\n * into a label suitable for display (\"Birth date\", \"Mahadasha end\").\n */\n\nexport function capitalize(s: string): string {\n\tif (!s) return '';\n\treturn s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();\n}\n\nexport function humanize(s: string): string {\n\treturn s\n\t\t.replace(/[_-]+/g, ' ')\n\t\t.replace(/([a-z])([A-Z])/g, '$1 $2')\n\t\t.replace(/^\\w/, (c) => c.toUpperCase());\n}\n"],
5
+ "mappings": "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",
6
6
  "names": ["css", "css"]
7
7
  }
@@ -97,6 +97,20 @@ var baseStyles = css`
97
97
  outline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));
98
98
  outline-offset: 2px;
99
99
  }
100
+
101
+ /* Force the text-style variant on every Unicode glyph in the component.
102
+ * macOS and iOS substitute coloured emoji glyphs for the planetary and
103
+ * gender Unicode code points (Mars, Venus, Mercury, etc.) when the
104
+ * system colour-emoji font wins font selection. The text-style variant
105
+ * keeps glyphs monochrome so they inherit the surrounding fill colour
106
+ * and match the brand palette consistently across platforms.
107
+ *
108
+ * font-variant-emoji is part of CSS Fonts 4 (Safari 17+, Chrome 134+,
109
+ * Firefox 139+). On older browsers the rule is silently ignored.
110
+ */
111
+ :host {
112
+ font-variant-emoji: text;
113
+ }
100
114
  `;
101
115
 
102
116
  // packages/ui/src/components/tarot-card.ts
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/components/tarot-card.ts", "../../src/utils/base-styles.ts"],
4
- "sourcesContent": ["import { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type { GetCardResponse, GetDailyCardResponse } from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\n\ntype TarotData = GetCardResponse | GetDailyCardResponse;\n\n/**\n * Tarot card. Renders /tarot/cards/{id} or /tarot/daily. Click to flip\n * between upright and reversed where the data shape supports it.\n */\n@customElement('roxy-tarot-card')\nexport class RoxyTarotCard extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`\n\t\t\t.card {\n\t\t\t\tbackground: var(--roxy-bg, #fff);\n\t\t\t\tborder: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\t\t\tbox-shadow: var(--roxy-shadow-sm);\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: minmax(0, 9rem) 1fr;\n\t\t\t\tgap: var(--roxy-space-lg, 1.5rem);\n\t\t\t\talign-items: start;\n\t\t\t}\n\n\t\t\t@container (max-width: 480px) {\n\t\t\t\t.card {\n\t\t\t\t\tgrid-template-columns: 1fr;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t.image-wrap {\n\t\t\t\tperspective: 800px;\n\t\t\t}\n\t\t\t.image {\n\t\t\t\tdisplay: block;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: auto;\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent);\n\t\t\t\ttransition:\n\t\t\t\t\ttransform var(--roxy-motion-duration, 200ms)\n\t\t\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1));\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t.image.reversed {\n\t\t\t\ttransform: rotate(180deg);\n\t\t\t}\n\t\t\t.image:focus-visible {\n\t\t\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\t\t\toutline-offset: 2px;\n\t\t\t}\n\n\t\t\t.title {\n\t\t\t\tmargin: 0;\n\t\t\t\tfont-size: var(--roxy-text-xl, 1.5rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tletter-spacing: var(--roxy-tracking-tight);\n\t\t\t}\n\t\t\t.meta {\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\tletter-spacing: 0.06em;\n\t\t\t\tmargin-bottom: var(--roxy-space-sm, 0.5rem);\n\t\t\t}\n\n\t\t\t.message {\n\t\t\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\t\t\tmargin: var(--roxy-space-sm, 0.5rem) 0 var(--roxy-space-md, 1rem);\n\t\t\t}\n\n\t\t\t.chips {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-wrap: wrap;\n\t\t\t\tgap: var(--roxy-space-xs, 0.25rem);\n\t\t\t\tmargin-top: var(--roxy-space-sm, 0.5rem);\n\t\t\t}\n\t\t\t.chips span {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-accent, #f59e0b) 14%, transparent);\n\t\t\t\tpadding: 2px 8px;\n\t\t\t\tborder-radius: var(--roxy-radius-full, 9999px);\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t}\n\n\t\t\t.flip {\n\t\t\t\tmargin-top: var(--roxy-space-sm, 0.5rem);\n\t\t\t\tbackground: transparent;\n\t\t\t\tborder: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tpadding: 4px 12px;\n\t\t\t\tfont-family: inherit;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-secondary, #475569);\n\t\t\t\tcursor: pointer;\n\t\t\t\ttransition:\n\t\t\t\t\ttransform var(--roxy-motion-duration, 200ms)\n\t\t\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1));\n\t\t\t}\n\t\t\t.flip:hover {\n\t\t\t\ttransform: scale(1.02);\n\t\t\t}\n\t\t`,\n\t];\n\n\t@property({ attribute: false })\n\tdata: TarotData | null = null;\n\n\t@state()\n\tprivate flipped = false;\n\n\tprivate toggleFlip = () => {\n\t\tthis.flipped = !this.flipped;\n\t};\n\n\trender() {\n\t\tconst d = this.data;\n\t\tif (!d)\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No tarot data</div>`;\n\n\t\tif ('card' in d) return this.renderDailyCard(d);\n\t\treturn this.renderFullCard(d);\n\t}\n\n\tprivate renderDailyCard(d: GetDailyCardResponse) {\n\t\tconst card = d.card;\n\t\tconst isReversed = this.flipped !== Boolean(card.reversed);\n\t\tconst keywords = card.keywords ?? [];\n\n\t\treturn html`<article class=\"card\" aria-label=${card.name ?? 'Tarot card'}>\n\t\t\t<div class=\"image-wrap\">\n\t\t\t\t${\n\t\t\t\t\tcard.imageUrl\n\t\t\t\t\t\t? html`<img\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tsrc=${card.imageUrl}\n\t\t\t\t\t\t\talt=${card.name ?? 'Tarot card'}\n\t\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\t\t\t@keydown=${(e: KeyboardEvent) => {\n\t\t\t\t\t\t\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\tthis.toggleFlip();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>`\n\t\t\t\t\t\t: html`<div\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tstyle=\"aspect-ratio: 0.6; display: flex; align-items: center; justify-content: center; color: var(--roxy-muted)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${card.name ?? '?'}\n\t\t\t\t\t\t</div>`\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div>\n\t\t\t\t<div class=\"meta\">\n\t\t\t\t\t${card.arcana ? html`${card.arcana} arcana` : nothing}\n\t\t\t\t\t${isReversed ? html` \u00B7 reversed` : nothing}\n\t\t\t\t</div>\n\t\t\t\t<h2 class=\"title\">${card.name ?? 'Tarot card'}</h2>\n\t\t\t\t${d.dailyMessage ? html`<p class=\"message\">${d.dailyMessage}</p>` : nothing}\n\t\t\t\t${card.meaning ? html`<p>${card.meaning}</p>` : nothing}\n\t\t\t\t${\n\t\t\t\t\tkeywords.length > 0\n\t\t\t\t\t\t? html`<div class=\"chips\">\n\t\t\t\t\t\t\t${keywords.map((k) => html`<span>${k}</span>`)}\n\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t\t<button\n\t\t\t\t\tclass=\"flip\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\taria-pressed=${this.flipped ? 'true' : 'false'}\n\t\t\t\t>\n\t\t\t\t\tFlip card\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</article>`;\n\t}\n\n\tprivate renderFullCard(d: GetCardResponse) {\n\t\tconst isReversed = this.flipped;\n\t\tconst orientedMeaning = isReversed ? d.reversed : d.upright;\n\t\tconst keywords = isReversed\n\t\t\t? (d.keywords?.reversed ?? [])\n\t\t\t: (d.keywords?.upright ?? []);\n\n\t\treturn html`<article class=\"card\" aria-label=${d.name ?? 'Tarot card'}>\n\t\t\t<div class=\"image-wrap\">\n\t\t\t\t${\n\t\t\t\t\td.imageUrl\n\t\t\t\t\t\t? html`<img\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tsrc=${d.imageUrl}\n\t\t\t\t\t\t\talt=${d.name ?? 'Tarot card'}\n\t\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\t\t\t@keydown=${(e: KeyboardEvent) => {\n\t\t\t\t\t\t\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\tthis.toggleFlip();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>`\n\t\t\t\t\t\t: html`<div\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tstyle=\"aspect-ratio: 0.6; display: flex; align-items: center; justify-content: center; color: var(--roxy-muted)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${d.name ?? '?'}\n\t\t\t\t\t\t</div>`\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div>\n\t\t\t\t<div class=\"meta\">\n\t\t\t\t\t${d.arcana ? html`${d.arcana} arcana` : nothing}\n\t\t\t\t\t${d.number !== undefined && d.number !== null ? html` \u00B7 ${d.number}` : nothing}\n\t\t\t\t\t${isReversed ? html` \u00B7 reversed` : nothing}\n\t\t\t\t</div>\n\t\t\t\t<h2 class=\"title\">${d.name ?? 'Tarot card'}</h2>\n\t\t\t\t${orientedMeaning?.description ? html`<p>${orientedMeaning.description}</p>` : nothing}\n\t\t\t\t${\n\t\t\t\t\tkeywords.length > 0\n\t\t\t\t\t\t? html`<div class=\"chips\">\n\t\t\t\t\t\t\t${keywords.map((k) => html`<span>${k}</span>`)}\n\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t\t<button\n\t\t\t\t\tclass=\"flip\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\taria-pressed=${this.flipped ? 'true' : 'false'}\n\t\t\t\t>\n\t\t\t\t\tFlip card\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</article>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-tarot-card': RoxyTarotCard;\n\t}\n}\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tcontainer-type: inline-size;\n\t\tfont-family: var(\n\t\t\t--roxy-font-sans,\n\t\t\tsystem-ui,\n\t\t\t-apple-system,\n\t\t\tBlinkMacSystemFont,\n\t\t\t'Segoe UI',\n\t\t\tRoboto,\n\t\t\tsans-serif\n\t\t);\n\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\tbackground: transparent;\n\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\tline-height: var(--roxy-leading-normal, 1.5);\n\t\tanimation: roxy-fade-in var(--roxy-motion-duration, 200ms)\n\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;\n\t}\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: border-box;\n\t}\n\n\t@keyframes roxy-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: translateY(2px);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: translateY(0);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-skeleton {\n\t\tbackground: linear-gradient(\n\t\t\t90deg,\n\t\t\tvar(--roxy-border, #e4e4e7) 0%,\n\t\t\tcolor-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent) 50%,\n\t\t\tvar(--roxy-border, #e4e4e7) 100%\n\t\t);\n\t\tbackground-size: 200% 100%;\n\t\tanimation: roxy-shimmer 1.4s ease-in-out infinite;\n\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t}\n\n\t@keyframes roxy-shimmer {\n\t\t0% {\n\t\t\tbackground-position: 200% 0;\n\t\t}\n\t\t100% {\n\t\t\tbackground-position: -200% 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.roxy-skeleton {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-empty {\n\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\tcolor: var(--roxy-muted, #71717a);\n\t\ttext-align: center;\n\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t}\n\n\t:host(:focus-within) .roxy-card {\n\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\toutline-offset: 2px;\n\t}\n`;\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import { css, html, LitElement, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type { GetCardResponse, GetDailyCardResponse } from '../types/index.js';\nimport { baseStyles } from '../utils/base-styles.js';\n\ntype TarotData = GetCardResponse | GetDailyCardResponse;\n\n/**\n * Tarot card. Renders /tarot/cards/{id} or /tarot/daily. Click to flip\n * between upright and reversed where the data shape supports it.\n */\n@customElement('roxy-tarot-card')\nexport class RoxyTarotCard extends LitElement {\n\tstatic styles = [\n\t\tbaseStyles,\n\t\tcss`\n\t\t\t.card {\n\t\t\t\tbackground: var(--roxy-bg, #fff);\n\t\t\t\tborder: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\t\t\tbox-shadow: var(--roxy-shadow-sm);\n\t\t\t\tdisplay: grid;\n\t\t\t\tgrid-template-columns: minmax(0, 9rem) 1fr;\n\t\t\t\tgap: var(--roxy-space-lg, 1.5rem);\n\t\t\t\talign-items: start;\n\t\t\t}\n\n\t\t\t@container (max-width: 480px) {\n\t\t\t\t.card {\n\t\t\t\t\tgrid-template-columns: 1fr;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t.image-wrap {\n\t\t\t\tperspective: 800px;\n\t\t\t}\n\t\t\t.image {\n\t\t\t\tdisplay: block;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: auto;\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent);\n\t\t\t\ttransition:\n\t\t\t\t\ttransform var(--roxy-motion-duration, 200ms)\n\t\t\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1));\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\t\t\t.image.reversed {\n\t\t\t\ttransform: rotate(180deg);\n\t\t\t}\n\t\t\t.image:focus-visible {\n\t\t\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\t\t\toutline-offset: 2px;\n\t\t\t}\n\n\t\t\t.title {\n\t\t\t\tmargin: 0;\n\t\t\t\tfont-size: var(--roxy-text-xl, 1.5rem);\n\t\t\t\tfont-weight: var(--roxy-weight-bold, 600);\n\t\t\t\tletter-spacing: var(--roxy-tracking-tight);\n\t\t\t}\n\t\t\t.meta {\n\t\t\t\tcolor: var(--roxy-muted, #71717a);\n\t\t\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t\t\t\ttext-transform: uppercase;\n\t\t\t\tletter-spacing: 0.06em;\n\t\t\t\tmargin-bottom: var(--roxy-space-sm, 0.5rem);\n\t\t\t}\n\n\t\t\t.message {\n\t\t\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\t\t\tmargin: var(--roxy-space-sm, 0.5rem) 0 var(--roxy-space-md, 1rem);\n\t\t\t}\n\n\t\t\t.chips {\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-wrap: wrap;\n\t\t\t\tgap: var(--roxy-space-xs, 0.25rem);\n\t\t\t\tmargin-top: var(--roxy-space-sm, 0.5rem);\n\t\t\t}\n\t\t\t.chips span {\n\t\t\t\tbackground: color-mix(in srgb, var(--roxy-accent, #f59e0b) 14%, transparent);\n\t\t\t\tpadding: 2px 8px;\n\t\t\t\tborder-radius: var(--roxy-radius-full, 9999px);\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t}\n\n\t\t\t.flip {\n\t\t\t\tmargin-top: var(--roxy-space-sm, 0.5rem);\n\t\t\t\tbackground: transparent;\n\t\t\t\tborder: 1px solid var(--roxy-border, #e4e4e7);\n\t\t\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t\t\t\tpadding: 4px 12px;\n\t\t\t\tfont-family: inherit;\n\t\t\t\tfont-size: var(--roxy-text-xs, 0.75rem);\n\t\t\t\tcolor: var(--roxy-secondary, #475569);\n\t\t\t\tcursor: pointer;\n\t\t\t\ttransition:\n\t\t\t\t\ttransform var(--roxy-motion-duration, 200ms)\n\t\t\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1));\n\t\t\t}\n\t\t\t.flip:hover {\n\t\t\t\ttransform: scale(1.02);\n\t\t\t}\n\t\t`,\n\t];\n\n\t@property({ attribute: false })\n\tdata: TarotData | null = null;\n\n\t@state()\n\tprivate flipped = false;\n\n\tprivate toggleFlip = () => {\n\t\tthis.flipped = !this.flipped;\n\t};\n\n\trender() {\n\t\tconst d = this.data;\n\t\tif (!d)\n\t\t\treturn html`<div class=\"roxy-empty\" role=\"status\">No tarot data</div>`;\n\n\t\tif ('card' in d) return this.renderDailyCard(d);\n\t\treturn this.renderFullCard(d);\n\t}\n\n\tprivate renderDailyCard(d: GetDailyCardResponse) {\n\t\tconst card = d.card;\n\t\tconst isReversed = this.flipped !== Boolean(card.reversed);\n\t\tconst keywords = card.keywords ?? [];\n\n\t\treturn html`<article class=\"card\" aria-label=${card.name ?? 'Tarot card'}>\n\t\t\t<div class=\"image-wrap\">\n\t\t\t\t${\n\t\t\t\t\tcard.imageUrl\n\t\t\t\t\t\t? html`<img\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tsrc=${card.imageUrl}\n\t\t\t\t\t\t\talt=${card.name ?? 'Tarot card'}\n\t\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\t\t\t@keydown=${(e: KeyboardEvent) => {\n\t\t\t\t\t\t\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\tthis.toggleFlip();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>`\n\t\t\t\t\t\t: html`<div\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tstyle=\"aspect-ratio: 0.6; display: flex; align-items: center; justify-content: center; color: var(--roxy-muted)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${card.name ?? '?'}\n\t\t\t\t\t\t</div>`\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div>\n\t\t\t\t<div class=\"meta\">\n\t\t\t\t\t${card.arcana ? html`${card.arcana} arcana` : nothing}\n\t\t\t\t\t${isReversed ? html` \u00B7 reversed` : nothing}\n\t\t\t\t</div>\n\t\t\t\t<h2 class=\"title\">${card.name ?? 'Tarot card'}</h2>\n\t\t\t\t${d.dailyMessage ? html`<p class=\"message\">${d.dailyMessage}</p>` : nothing}\n\t\t\t\t${card.meaning ? html`<p>${card.meaning}</p>` : nothing}\n\t\t\t\t${\n\t\t\t\t\tkeywords.length > 0\n\t\t\t\t\t\t? html`<div class=\"chips\">\n\t\t\t\t\t\t\t${keywords.map((k) => html`<span>${k}</span>`)}\n\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t\t<button\n\t\t\t\t\tclass=\"flip\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\taria-pressed=${this.flipped ? 'true' : 'false'}\n\t\t\t\t>\n\t\t\t\t\tFlip card\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</article>`;\n\t}\n\n\tprivate renderFullCard(d: GetCardResponse) {\n\t\tconst isReversed = this.flipped;\n\t\tconst orientedMeaning = isReversed ? d.reversed : d.upright;\n\t\tconst keywords = isReversed\n\t\t\t? (d.keywords?.reversed ?? [])\n\t\t\t: (d.keywords?.upright ?? []);\n\n\t\treturn html`<article class=\"card\" aria-label=${d.name ?? 'Tarot card'}>\n\t\t\t<div class=\"image-wrap\">\n\t\t\t\t${\n\t\t\t\t\td.imageUrl\n\t\t\t\t\t\t? html`<img\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tsrc=${d.imageUrl}\n\t\t\t\t\t\t\talt=${d.name ?? 'Tarot card'}\n\t\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\t\t\t@keydown=${(e: KeyboardEvent) => {\n\t\t\t\t\t\t\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t\tthis.toggleFlip();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>`\n\t\t\t\t\t\t: html`<div\n\t\t\t\t\t\t\tclass=${`image ${isReversed ? 'reversed' : ''}`}\n\t\t\t\t\t\t\tstyle=\"aspect-ratio: 0.6; display: flex; align-items: center; justify-content: center; color: var(--roxy-muted)\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${d.name ?? '?'}\n\t\t\t\t\t\t</div>`\n\t\t\t\t}\n\t\t\t</div>\n\t\t\t<div>\n\t\t\t\t<div class=\"meta\">\n\t\t\t\t\t${d.arcana ? html`${d.arcana} arcana` : nothing}\n\t\t\t\t\t${d.number !== undefined && d.number !== null ? html` \u00B7 ${d.number}` : nothing}\n\t\t\t\t\t${isReversed ? html` \u00B7 reversed` : nothing}\n\t\t\t\t</div>\n\t\t\t\t<h2 class=\"title\">${d.name ?? 'Tarot card'}</h2>\n\t\t\t\t${orientedMeaning?.description ? html`<p>${orientedMeaning.description}</p>` : nothing}\n\t\t\t\t${\n\t\t\t\t\tkeywords.length > 0\n\t\t\t\t\t\t? html`<div class=\"chips\">\n\t\t\t\t\t\t\t${keywords.map((k) => html`<span>${k}</span>`)}\n\t\t\t\t\t\t</div>`\n\t\t\t\t\t\t: nothing\n\t\t\t\t}\n\t\t\t\t<button\n\t\t\t\t\tclass=\"flip\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t@click=${this.toggleFlip}\n\t\t\t\t\taria-pressed=${this.flipped ? 'true' : 'false'}\n\t\t\t\t>\n\t\t\t\t\tFlip card\n\t\t\t\t</button>\n\t\t\t</div>\n\t\t</article>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'roxy-tarot-card': RoxyTarotCard;\n\t}\n}\n", "import { css } from 'lit';\n\n/**\n * Shared host styles every component pulls in. Sets default font, color,\n * container query support, and the entry fade-in.\n */\nexport const baseStyles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tcontainer-type: inline-size;\n\t\tfont-family: var(\n\t\t\t--roxy-font-sans,\n\t\t\tsystem-ui,\n\t\t\t-apple-system,\n\t\t\tBlinkMacSystemFont,\n\t\t\t'Segoe UI',\n\t\t\tRoboto,\n\t\t\tsans-serif\n\t\t);\n\t\tcolor: var(--roxy-fg, #0a0a0a);\n\t\tbackground: transparent;\n\t\tfont-size: var(--roxy-text-base, 1rem);\n\t\tline-height: var(--roxy-leading-normal, 1.5);\n\t\tanimation: roxy-fade-in var(--roxy-motion-duration, 200ms)\n\t\t\tvar(--roxy-motion-easing, cubic-bezier(0.4, 0, 0.2, 1)) both;\n\t}\n\n\t*,\n\t*::before,\n\t*::after {\n\t\tbox-sizing: border-box;\n\t}\n\n\t@keyframes roxy-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t\ttransform: translateY(2px);\n\t\t}\n\t\tto {\n\t\t\topacity: 1;\n\t\t\ttransform: translateY(0);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-skeleton {\n\t\tbackground: linear-gradient(\n\t\t\t90deg,\n\t\t\tvar(--roxy-border, #e4e4e7) 0%,\n\t\t\tcolor-mix(in srgb, var(--roxy-border, #e4e4e7) 60%, transparent) 50%,\n\t\t\tvar(--roxy-border, #e4e4e7) 100%\n\t\t);\n\t\tbackground-size: 200% 100%;\n\t\tanimation: roxy-shimmer 1.4s ease-in-out infinite;\n\t\tborder-radius: var(--roxy-radius-md, 8px);\n\t}\n\n\t@keyframes roxy-shimmer {\n\t\t0% {\n\t\t\tbackground-position: 200% 0;\n\t\t}\n\t\t100% {\n\t\t\tbackground-position: -200% 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.roxy-skeleton {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t.roxy-empty {\n\t\tpadding: var(--roxy-space-lg, 1.5rem);\n\t\tcolor: var(--roxy-muted, #71717a);\n\t\ttext-align: center;\n\t\tfont-size: var(--roxy-text-sm, 0.875rem);\n\t}\n\n\t:host(:focus-within) .roxy-card {\n\t\toutline: 2px solid var(--roxy-ring, rgba(245, 158, 11, 0.4));\n\t\toutline-offset: 2px;\n\t}\n\n\t/* Force the text-style variant on every Unicode glyph in the component.\n\t * macOS and iOS substitute coloured emoji glyphs for the planetary and\n\t * gender Unicode code points (Mars, Venus, Mercury, etc.) when the\n\t * system colour-emoji font wins font selection. The text-style variant\n\t * keeps glyphs monochrome so they inherit the surrounding fill colour\n\t * and match the brand palette consistently across platforms.\n\t *\n\t * font-variant-emoji is part of CSS Fonts 4 (Safari 17+, Chrome 134+,\n\t * Firefox 139+). On older browsers the rule is silently ignored.\n\t */\n\t:host {\n\t\tfont-variant-emoji: text;\n\t}\n`;\n"],
5
+ "mappings": "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",
6
6
  "names": ["css", "css"]
7
7
  }