.afh-chart-render { display:flex; flex-direction:column; align-items:stretch; color:var(--theme-text); background:var(--theme-surface); border-radius:var(--radius-md, 10px); }
.afh-chart-render svg { display:block; width:min(100%, 720px); max-width:100%; height:auto; margin:0 auto; }
.afh-chart-with-positions { display:grid; grid-template-columns:minmax(0,1fr); gap:1rem; align-items:start; padding:.75rem; }
.afh-chart-visual, .afh-western-positions { min-width:0; background:var(--theme-surface); border:1px solid var(--theme-border); border-radius:var(--radius-md,10px); overflow:hidden; }
.afh-chart-heading { padding:.85rem 1rem .55rem; border-bottom:1px solid var(--theme-border); }
.afh-chart-heading h3 { margin:0; color:var(--theme-text); font-size:1.08rem; }
.afh-chart-heading span { display:block; margin-top:.2rem; color:var(--theme-text-muted); font-size:.78rem; }
.afh-western-wheel-tabs { display:flex; gap:1.2rem; padding:.75rem 1rem .55rem; border-bottom:1px solid var(--theme-border); color:var(--theme-text-muted); font-size:.85rem; font-weight:700; }
.afh-western-wheel-tabs .active { color:var(--primary-color); border-bottom:2px solid var(--primary-color); padding-bottom:.55rem; margin-bottom:-.55rem; }
.afh-western-positions h3 { margin:0; padding:.9rem 1rem; color:var(--theme-text); font-size:1.05rem; border-bottom:1px solid var(--theme-border); }
.afh-western-positions-note { margin:0; padding:.65rem 1rem; color:var(--theme-text-muted); font-size:.76rem; line-height:1.45; border-bottom:1px solid var(--theme-border); }
.afh-western-table-scroll { overflow-x:auto; }
.afh-western-positions table { width:100%; border-collapse:collapse; color:var(--theme-text); font-size:.8rem; }
.afh-western-positions th { text-align:left; color:var(--theme-text-muted); background:var(--theme-surface-muted); text-transform:uppercase; letter-spacing:.04em; font-size:.7rem; }
.afh-western-positions th, .afh-western-positions td { padding:.55rem .7rem; border-bottom:1px solid var(--theme-border); white-space:nowrap; }
.afh-western-positions td { color:var(--theme-text); }
.afh-western-positions tbody tr:nth-child(even) { background:var(--theme-surface-muted); }
.afh-western-positions tbody tr:hover { background:var(--theme-hover, var(--theme-surface-muted)); }
.afh-western-body { font-weight:800; }
.afh-western-body--sun { color:#d97706; } .afh-western-body--moon { color:#64748b; }
.afh-western-body--mars { color:#dc2626; } .afh-western-body--mercury { color:#15803d; }
.afh-western-body--jupiter { color:#a16207; } .afh-western-body--venus { color:#be185d; }
.afh-western-body--saturn { color:#2563eb; } .afh-western-body--rahu { color:#7e22ce; }
.afh-western-body--ketu { color:#475569; } .afh-western-body--ascendant { color:#ea580c; }
.afh-western-aspect-line { pointer-events:stroke; }
.afh-chart-render .afh-chart-style-selector { flex:0 0 auto; }
.afh-chart-style-selector { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.35rem; padding:.6rem .75rem; background:var(--theme-surface-muted); border:1px solid var(--theme-border); border-radius:var(--radius-md, 10px); }
.afh-chart-style-selector .kp-chart-selector-label { margin-right:auto; color:var(--theme-text-muted); font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.afh-chart-style-selector--embedded { width:100%; box-sizing:border-box; margin-bottom:.5rem; }
.afh-chart-style-selector [data-chart-type], .afh-chart-style-selector [data-chart-style] { padding:.4rem .65rem; background:var(--theme-surface-muted); color:var(--theme-text); border:1px solid var(--theme-border); border-radius:var(--radius-sm, 6px); cursor:pointer; font-weight:700; }
.afh-chart-style-selector [data-chart-type].active, .afh-chart-style-selector [data-chart-style].active { background:var(--primary-color, #4f46e5); color:#fff; border-color:var(--primary-color, #4f46e5); }
.afh-chart-style-selector button:focus-visible { outline:2px solid var(--theme-focus, #818cf8); outline-offset:2px; }
@media (max-width:600px) {
  .afh-chart-style-selector { justify-content:flex-start; }
  .afh-chart-style-selector .kp-chart-selector-label { width:100%; margin-right:0; }
  .afh-chart-style-selector button { flex:1 1 auto; min-width:0; }
  .afh-chart-render svg { width:100%; }
  .afh-chart-with-positions { grid-template-columns:1fr; padding:.4rem; }
}
@media (prefers-color-scheme: dark) {
  .afh-chart-render { background:var(--theme-surface); }
}
