/* birth-chart.css: Discover My Birth Chart, /astrology/birth-chart (docs/BIRTH_CHART.md). Beside astrology.css; tokens only. */
.bc .astro-layout{gap:var(--s5)}
.bc-privacy{color:var(--cream-2)}

/* ---- the form ---- */
.bc-form{padding:var(--card-pad);max-width:640px}
.bc-form input,.bc-form select{width:100%;min-height:var(--tap);font-size:16px}
.bc-time-row{display:grid;gap:var(--s2)}
.bc-check{display:flex;align-items:center;gap:var(--s2);min-height:var(--tap);cursor:pointer}
.bc-check input{width:22px;height:22px;min-height:0;flex:none}
.bc-place{position:relative}
.bc-places{position:absolute;left:0;right:0;z-index:var(--z-raised);margin:4px 0 0;padding:4px 0;list-style:none;max-height:320px;overflow-y:auto;
  border:var(--hairline);border-radius:var(--r-m);background:var(--card-2);box-shadow:var(--shadow-modal)}
.bc-places[hidden]{display:none}
.bc-places li{min-height:var(--tap);padding:10px var(--s3);cursor:pointer;line-height:1.35}
.bc-places li[aria-selected="true"],.bc-places li:hover{background:var(--soft);color:var(--cream)}
.bc-coords summary{min-height:var(--tap);display:flex;align-items:center;cursor:pointer;color:var(--gold-2)}
.bc-coords-grid{display:grid;gap:var(--s2);padding-top:var(--s2)}
.bc-error{color:var(--rose)}
.bc-error[hidden]{display:none}
@media (min-width:640px){ .bc-time-row{grid-template-columns:minmax(0,1fr) auto;align-items:end} .bc-coords-grid{grid-template-columns:1fr 1fr} .bc-coords-grid .field:last-child{grid-column:1 / -1} }

/* ---- the result ---- */
.bc-result{display:grid;gap:var(--s5);scroll-margin-top:80px}
.bc-result[hidden]{display:none}
.bc-when{color:var(--cream-3);margin-top:calc(-1 * var(--s4))}
.bc-big3{max-width:34ch}
.bc-chart{display:grid;gap:var(--s4);align-items:start}
.bc-figure{margin:0;justify-self:center;width:min(100%,460px)}
.bc-wheel{display:block;width:100%;height:auto;overflow:visible}
.bc-ring{fill:none;stroke:var(--gold-line);stroke-width:1}
.bc-ring-in{stroke:var(--gold-line-soft)}
.bc-spoke,.bc-tick{stroke:var(--gold-line-soft);stroke-width:1}
.bc-planet-tick{stroke:var(--gold-line)}
.bc-cusp{stroke:var(--gold-line-soft);stroke-width:1}
.bc-angle{stroke:var(--gold-2);stroke-width:1.5}
.bc-sign,.bc-planet{font:400 18px/1 'Apple Symbols','Segoe UI Symbol','Noto Sans Symbols2',var(--f-display);text-anchor:middle;dominant-baseline:central}
.bc-sign{fill:var(--gold-2)}
.bc-planet{fill:var(--cream);font-size:17px}
.bc-lights{fill:var(--gold-2);font-size:20px}
.bc-house{fill:var(--cream-3);font:400 10px/1 var(--f-label);text-anchor:middle;dominant-baseline:central}
.bc-angle-name{fill:var(--gold-2);font:600 10px/1 var(--f-label);letter-spacing:.08em;text-anchor:middle;dominant-baseline:central}
.bc-aspect{stroke-width:1;opacity:.7}
.bc-trine,.bc-sextile{stroke:var(--teal)}
.bc-square,.bc-opposition{stroke:var(--rose)}
.bc-conjunction{stroke:var(--gold-2)}
.bc-table-wrap{overflow-x:auto}
.bc-table{width:100%;border-collapse:collapse;font-size:15px}
.bc-table th:last-child,.bc-table td:last-child{padding-right:2px}
.bc-table th,.bc-table td{padding:8px 8px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
.bc-table thead th{color:var(--cream-3);font:var(--t-label);letter-spacing:.06em}
.bc-table tbody th{font-weight:400;color:var(--cream)}
.bc-glyph{display:inline-block;min-width:1.4em;color:var(--gold-2);font-family:'Apple Symbols','Segoe UI Symbol','Noto Sans Symbols2',var(--f-display)}
@media (min-width:1024px){ .bc-chart{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }

.bc-notes p{color:var(--cream-2)}
.bc-meaning-list{display:grid;gap:var(--s3)}
.bc-meaning{padding:var(--card-pad);display:grid;gap:var(--s2);align-content:start}
.bc-meaning h3{color:var(--cream)}
.bc-meaning p{margin:0}
@media (min-width:768px){ .bc-meaning-list{grid-template-columns:repeat(2,minmax(0,1fr))} }
.bc-aspect-list{display:grid;gap:var(--s2);padding-left:1.2em}
.bc-cards[hidden]{display:none}
.bc-card-list{display:grid;grid-template-columns:repeat(3,minmax(0,160px));gap:var(--s3);list-style:none;padding:0;margin:var(--s3) 0 0}
.bc-card{display:grid;gap:6px;text-decoration:none}
.bc-card img{width:100%;height:auto;border-radius:var(--r-s);border:var(--hairline)}
.bc-card-name{font:var(--w-heading) 17px/22px var(--f-display);color:var(--cream)}
.bc-reflection{font-style:italic;color:var(--cream-2)}
