/* Birth chart presentation only. Calculations, validation and timing remain in the existing app. */
#ca-app { --ca-ink:var(--px-text,#f5f1e8); --ca-muted:var(--px-muted,#c8c4d2); --ca-accent:var(--px-accent,#d8bb79); --ca-line:var(--px-line,#c8a96b40); --ca-panel:var(--px-surface,#141827); --ca-heading:var(--px-heading,Georgia,serif); min-height:0; }
#ca-app .ca-container { max-width:1120px; padding:48px 32px 72px; }
#ca-app .ca-header { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); align-items:center; gap:48px; text-align:left; margin-bottom:36px; }
#ca-app .ca-header-copy { min-width:0; }
#ca-app .ca-deco { font-size:22px; margin:0 0 20px; opacity:1; color:var(--ca-accent); }
#ca-app .ca-title { font-family:var(--ca-heading); font-size:clamp(32px,3.8vw,52px); font-weight:500; line-height:1.12; letter-spacing:-.025em; text-transform:none; text-align:left; text-shadow:none; color:var(--ca-ink); }
#ca-app .ca-subtitle { font-family:Inter,system-ui,sans-serif; font-size:13px; font-style:normal; line-height:1.6; letter-spacing:.08em; text-transform:uppercase; text-align:left; color:var(--ca-accent); margin:20px 0 12px; }
#ca-app .ca-intro { font:400 16px/1.8 Inter,system-ui,sans-serif; max-width:44ch; color:var(--ca-muted); }
#ca-app .header-rule { display:none; }
#ca-app .ca-hero-art { position:relative; margin:0; border:1px solid var(--ca-line); border-radius:160px 160px 12px 12px; overflow:hidden; aspect-ratio:1.6; }
#ca-app .ca-hero-art img { display:block; width:100%; height:100%; object-fit:cover; }
#ca-app .ca-step { scroll-margin-top:100px; }
#ca-app .form-card { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:24px 32px; padding:32px; margin:0; }
#ca-app :is(.form-section-title,.ca-field-city,.form-card>.dst-note,.birth-adjustment,.form-error-msg,.form-card>.btn-oracle,.form-card>.form-group:not(.ca-field-date,.ca-field-time,.ca-field-city)) { grid-column:1/-1; }
#ca-app .form-section-title { font:500 24px/1.35 var(--ca-heading); letter-spacing:0; text-transform:none; color:var(--ca-ink); margin:0 0 2px; }
#ca-app .form-group { margin:0; min-width:0; }
#ca-app .form-row { gap:12px; margin:0; }
#ca-app .form-row.three { grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr) minmax(0,1fr); }
#ca-app .form-row.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
#ca-app .field-wrap { min-width:0; gap:8px; }
#ca-app .field-group-label { font:500 14px/1.45 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; color:var(--ca-ink); margin-bottom:12px; }
#ca-app .field-label { font:400 12px/1.4 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; color:var(--ca-muted); }
#ca-app :is(.date-select,.city-input) { font-family:Inter,system-ui,sans-serif; font-weight:400; min-height:50px; padding:12px 30px 12px 12px; text-align:left; }
#ca-app .city-input { padding-right:46px; }
#ca-app .city-search-icon { display:flex; align-items:center; width:18px; height:18px; right:17px; color:var(--ca-accent); }
#ca-app .city-list { background:var(--ca-panel); border-color:var(--ca-line); }
#ca-app .city-option { font:400 15px/1.5 Inter,system-ui,sans-serif; min-height:48px; color:var(--ca-ink); }
#ca-app .city-option:hover { background:var(--px-soft,#292537); }
#ca-app .dst-note { margin:0; font:400 13px/1.65 Inter,system-ui,sans-serif; color:var(--ca-muted); padding:12px 16px; border-color:var(--ca-line); }
#ca-app .birth-adjustment { margin:-12px 0 0; font:400 13px/1.6 Inter,system-ui,sans-serif; }
#ca-app .birth-adjustment summary { padding:8px 0; min-height:40px; margin:0; color:var(--ca-accent); cursor:pointer; }
#ca-app .birth-adjustment[open] { padding-top:8px; }
#ca-app .birth-adjustment[open] summary { margin-bottom:10px; }
#ca-app .birth-adjustment .dst-note { margin-top:8px; }
#ca-app .form-error-msg { margin:0; min-height:0; font:500 14px/1.5 Inter,system-ui,sans-serif; }
#ca-app .form-error-msg:not(.visible) { display:none; }
#ca-app .btn-oracle { font:600 15px/1.5 Inter,system-ui,sans-serif; letter-spacing:.015em; text-transform:none; min-height:54px; margin:0; }
#ca-app .btn-secondary { font:500 14px/1.5 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; }
#ca-app .ca-result-layout { display:grid; grid-template-columns:minmax(235px,.8fr) minmax(0,2fr); gap:28px; align-items:start; }
#ca-app .ca-result-layout>.ornament { display:none; }
#ca-app .planets-trio { display:grid; grid-template-columns:1fr; gap:14px; margin:0; }
#ca-app .planet-card { display:grid; grid-template-columns:38px minmax(0,1fr) 40px; grid-template-areas:'planet label sign' 'planet name sign' 'planet degree sign'; align-items:center; column-gap:12px; padding:20px 16px; text-align:left; background:var(--ca-panel); border-color:var(--ca-line); border-top:1px solid var(--ca-line); border-left:3px solid var(--pc,var(--ca-accent)); border-radius:var(--px-radius,12px); }
#ca-app .planet-symbol { grid-area:planet; margin:0; font-size:27px; color:var(--ca-accent); }
#ca-app .planet-label { grid-area:label; margin:0 0 6px; font:500 12px/1.4 Inter,system-ui,sans-serif; letter-spacing:.025em; text-transform:none; color:var(--ca-muted); }
#ca-app .planet-sign-sym { grid-area:sign; margin:0; font-size:32px; text-align:center; }
#ca-app .planet-sign-name { grid-area:name; margin:0 0 4px; font:500 20px/1.25 var(--ca-heading); letter-spacing:0; text-transform:none; overflow-wrap:anywhere; hyphens:auto; color:var(--ca-ink); }
#ca-app .planet-degree { grid-area:degree; font:400 13px/1.5 Inter,system-ui,sans-serif; color:var(--ca-muted); }
#ca-app .info-cards { margin:0; gap:20px; min-width:0; }
#ca-app .info-card { padding:28px; border-left-width:1px; border-top:2px solid var(--ca-accent); }
#ca-app .info-card-title { font:500 23px/1.35 var(--ca-heading); color:var(--ca-accent); letter-spacing:0; text-transform:none; margin-bottom:16px; overflow-wrap:anywhere; }
#ca-app .info-card-body { font:400 16px/1.9 Inter,system-ui,sans-serif; color:var(--ca-ink); overflow-wrap:anywhere; }
#ca-app .result-section-title { text-transform:none; letter-spacing:0; font-weight:500; margin-bottom:16px; }
#ca-app #ca-birth-summary { margin:0 auto 28px; max-width:76ch; padding:0; background:none; border:0; text-align:center; font-style:normal; }
#ca-app:has(#ca-step-result.active) .ca-header { grid-template-columns:1fr; gap:0; margin-bottom:24px; }
#ca-app:has(#ca-step-result.active) .ca-header :is(.ca-hero-art,.ca-intro,.header-rule,.ca-title) { display:none; }
#ca-app:has(#ca-step-result.active) .ca-deco { text-align:center; margin-bottom:8px; }
#ca-app:has(#ca-step-result.active) .ca-subtitle { text-align:center; margin:0; }
@media(min-width:900px){#ca-app .planets-trio { position:sticky; top:110px; }}
@media(max-width:720px){
 #ca-app .ca-container { padding:28px 20px 52px; }
 #ca-app .ca-header { gap:20px; grid-template-columns:minmax(0,1fr) 125px; margin-bottom:28px; }
 #ca-app .ca-hero-art { aspect-ratio:.8; border-radius:80px 80px 8px 8px; }
 #ca-app .ca-title { font-size:32px; }
 #ca-app .ca-deco { font-size:17px; letter-spacing:5px; margin-bottom:16px; }
 #ca-app .ca-subtitle { margin-top:14px; font-size:11px; letter-spacing:.025em; }
 #ca-app .ca-intro { font-size:14px; line-height:1.7; }
 #ca-app .form-card { grid-template-columns:1fr; gap:22px; padding:24px; }
 #ca-app .ca-result-layout { grid-template-columns:1fr; gap:24px; }
 #ca-app .planets-trio { gap:10px; }
 #ca-app .planet-card { padding:16px 20px; }
 #ca-app .info-card { padding:24px; }
}
@media(max-width:440px){
 #ca-app .ca-container { padding-left:16px; padding-right:16px; }
 #ca-app .ca-header { grid-template-columns:minmax(0,1fr) 94px; gap:16px; }
 #ca-app .ca-title { font-size:28px; }
 #ca-app .ca-intro { grid-column:1/-1; }
 #ca-app .form-card { padding:20px 16px; }
 #ca-app .form-section-title { font-size:22px; }
 #ca-app .form-row.three { grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); }
 #ca-app .form-row.three .field-wrap:last-child { grid-column:1/-1; }
 #ca-app .info-card { padding:22px 18px; }
 #ca-app .info-card-title { font-size:22px; }
}
