/* Lunar calendar and zodiac compatibility. Each application inherits its site's existing identity. */
:is(#calendario-lunar-app,#zc-app) { --cd-ink:var(--px-text,#f5f1e8); --cd-muted:var(--px-muted,#c8c4d2); --cd-accent:var(--px-accent,#d8bb79); --cd-line:var(--px-line,#c8a96b40); --cd-panel:var(--px-surface,#141827); --cd-soft:var(--px-soft,#c8a96b0c); --cd-heading:var(--px-heading,Georgia,serif); min-height:0; padding:0; }
:is(#calendario-lunar-app,#zc-app) .cd-container { max-width:1120px; padding:40px 32px 64px; }
:is(#calendario-lunar-app,#zc-app) .cd-header { display:grid; grid-template-columns:minmax(0,1fr) 230px; align-items:center; gap:40px; padding:0; margin:0 0 28px; text-align:left; }
:is(#calendario-lunar-app,#zc-app) .cd-header-copy { min-width:0; }
:is(#calendario-lunar-app,#zc-app) .cd-deco { display:block; font-size:26px; letter-spacing:0; margin:0 0 12px; color:var(--cd-accent); opacity:1; }
:is(#calendario-lunar-app,#zc-app) .cd-title { font:500 clamp(32px,3.8vw,48px)/1.15 var(--cd-heading); letter-spacing:-.02em; text-transform:none; text-align:left; margin:0; color:var(--cd-ink); text-shadow:none; overflow-wrap:anywhere; }
#zc-app .cd-title em { color:var(--cd-accent); }
:is(#calendario-lunar-app,#zc-app) .cd-subtitle { font:400 16px/1.7 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; margin:16px 0 0; color:var(--cd-muted); }
:is(#calendario-lunar-app,#zc-app) .cd-hero-art { margin:0; aspect-ratio:1.6; overflow:hidden; border:1px solid var(--cd-line); border-radius:100px 100px 12px 12px; }
:is(#calendario-lunar-app,#zc-app) .cd-hero-art img { display:block; width:100%; height:100%; object-fit:cover; }
/* A compact live overview followed by a full-width, seven-column calendar. */
#calendario-lunar-app .sky-zone { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:10px 20px; margin:0 0 24px; }
#calendario-lunar-app .sky-zone label { margin:0; font:500 14px/1.5 Inter,system-ui,sans-serif; color:var(--cd-ink); }
#calendario-lunar-app .sky-zone select { width:100%; max-width:380px; min-height:48px; font:400 16px/1.5 Inter,system-ui,sans-serif; }
#calendario-lunar-app .sky-note { grid-column:1/-1; margin:0; font:400 13px/1.6 Inter,system-ui,sans-serif; color:var(--cd-muted); }
#calendario-lunar-app .cd-overview { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(220px,1fr); gap:20px; margin-bottom:28px; }
#calendario-lunar-app .cl-today-card { grid-template-columns:88px minmax(0,1fr); align-items:center; gap:16px 24px; margin:0; padding:24px; background:var(--cd-panel); border:1px solid var(--cd-line); border-radius:var(--px-radius,12px); }
#calendario-lunar-app .cl-big-moon { grid-column:1; grid-row:1/3; }
#calendario-lunar-app .cl-today-date { font:400 13px/1.6 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; color:var(--cd-muted); margin:0 0 8px; }
#calendario-lunar-app .cl-today-phase-name { font:500 30px/1.2 var(--cd-heading); color:var(--cd-ink); margin:0 0 8px; }
#calendario-lunar-app .cl-today-illumination { font:400 14px/1.5 Inter,system-ui,sans-serif; letter-spacing:0; color:var(--cd-muted); }
#calendario-lunar-app .cl-today-illumination span { color:var(--cd-accent); }
#calendario-lunar-app .cl-zodiac-badge { grid-column:2; display:flex; flex-direction:row; justify-content:flex-start; gap:10px; padding:0; background:none; border:0; text-align:left; }
#calendario-lunar-app .cl-zodiac-name { font:400 14px/1.5 Inter,system-ui,sans-serif; color:var(--cd-muted); letter-spacing:0; text-transform:none; }
#calendario-lunar-app .cl-zodiac-symbol { font-size:22px; color:var(--cd-accent); }
#calendario-lunar-app .cl-events-bar { display:grid; grid-template-columns:1fr; gap:12px; margin:0; }
#calendario-lunar-app .cl-event-pill { min-width:0; gap:14px; border-radius:var(--px-radius,12px); padding:18px; border-color:var(--cd-line); background:var(--cd-panel); overflow-wrap:anywhere; }
#calendario-lunar-app .cl-event-label { font:500 18px/1.35 var(--cd-heading); letter-spacing:0; text-transform:none; color:var(--cd-ink); margin-bottom:6px; opacity:1; }
#calendario-lunar-app .cl-event-date { font:400 13px/1.5 Inter,system-ui,sans-serif; color:var(--cd-muted); letter-spacing:0; }
#calendario-lunar-app .cl-calendar-section { border-color:var(--cd-line); border-radius:var(--px-radius,12px); background:var(--cd-panel); scroll-margin-top:100px; }
#calendario-lunar-app .cl-cal-nav { gap:16px; padding:18px 22px; background:var(--cd-soft); border-color:var(--cd-line); }
#calendario-lunar-app .cl-cal-month-title { font:500 28px/1.25 var(--cd-heading); color:var(--cd-ink); text-transform:none; letter-spacing:0; }
#calendario-lunar-app .cl-nav-btn { width:44px; height:44px; font-size:27px; color:var(--cd-accent); border-color:var(--cd-line); }
#calendario-lunar-app :is(.cl-weekdays,.cl-days-grid) { grid-template-columns:repeat(7,minmax(0,1fr)); border-color:var(--cd-line); }
#calendario-lunar-app .cl-weekday { font:500 14px/1.5 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; opacity:1; color:var(--cd-muted); padding:12px 2px; }
#calendario-lunar-app .cl-day { min-width:0; min-height:110px; padding:10px 4px; gap:6px; border-color:var(--cd-line); }
#calendario-lunar-app .cl-day:not(.other-month) { cursor:pointer; }
#calendario-lunar-app .cl-day-num { font:500 16px/1 Inter,system-ui,sans-serif; width:28px; height:28px; color:var(--cd-ink); }
#calendario-lunar-app .cl-day.other-month .cl-day-num { opacity:.45; }
#calendario-lunar-app .cl-day.today { background:var(--cd-soft); }
#calendario-lunar-app .cl-day.today .cl-day-num { background:var(--cd-accent); color:#191520; width:28px; height:28px; }
#calendario-lunar-app .cl-day[aria-pressed=true] { background:var(--cd-soft); box-shadow:inset 0 0 0 2px var(--cd-accent); }
#calendario-lunar-app .cl-day:focus-visible { outline:2px solid var(--cd-accent); outline-offset:-4px; z-index:2; }
#calendario-lunar-app .cl-day:has(.cl-day-event) { border-top:3px solid var(--cd-accent); padding-top:7px; }
#calendario-lunar-app .cl-day-event { font:500 12px/1.3 Inter,system-ui,sans-serif; color:var(--cd-accent); letter-spacing:0; text-transform:none; max-width:100%; overflow-wrap:anywhere; }
#calendario-lunar-app .cl-day-time { font:400 12px/1.4 Inter,system-ui,sans-serif; color:var(--cd-muted); margin:0; }
#calendario-lunar-app .cl-day-tooltip { font:400 13px/1.6 Inter,system-ui,sans-serif; background:var(--cd-panel); color:var(--cd-ink); border:1px solid var(--cd-line); }
#calendario-lunar-app .cl-selected-detail { display:flex; align-items:center; gap:20px; padding:22px 24px; border-top:1px solid var(--cd-line); background:var(--cd-soft); }
#calendario-lunar-app .cl-selected-moon { flex:0 0 48px; }
#calendario-lunar-app .cl-selected-moon svg { display:block; width:48px; height:48px; }
#calendario-lunar-app .cl-selected-moon:empty { display:none; }
#calendario-lunar-app #cl-selected-label { font:500 13px/1.5 Inter,system-ui,sans-serif; color:var(--cd-accent); margin:0 0 8px; }
#calendario-lunar-app #cl-selected-content { font:400 16px/1.7 Inter,system-ui,sans-serif; color:var(--cd-ink); overflow-wrap:anywhere; }
#calendario-lunar-app #cl-selected-content strong { display:block; font:500 24px/1.3 var(--cd-heading); margin-bottom:6px; }
#calendario-lunar-app .cl-selected-event { font:500 14px/1.5 Inter,system-ui,sans-serif; color:var(--cd-accent); margin:8px 0 0; }
#calendario-lunar-app .cl-selected-event:empty { display:none; }
#calendario-lunar-app .cl-legend { background:none; border-color:var(--cd-line); gap:16px 24px; padding:20px; }
#calendario-lunar-app .cl-legend-item { font:400 13px/1.5 Inter,system-ui,sans-serif; color:var(--cd-muted); }
/* Zodiac selection remains the same twelve signs and the same selection sequence. */
#zc-app #zc-step-selector.active { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); align-items:start; gap:32px; }
#zc-app .cd-selection { min-width:0; padding:24px; border:1px solid var(--cd-line); border-radius:var(--px-radius,12px); background:var(--cd-panel); }
#zc-app .zc-selector-hint { font:400 16px/1.6 Inter,system-ui,sans-serif; color:var(--cd-ink); letter-spacing:0; text-transform:none; margin:0 0 22px; text-align:left; }
#zc-app .zc-chosen-row { grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr); gap:8px; margin:0 0 24px; }
#zc-app .zc-chosen-card { min-width:0; min-height:204px; padding:18px 8px; gap:10px; border-color:var(--cd-line); background:var(--cd-soft); }
#zc-app .zc-chosen-card.filled { border-color:var(--cd-accent); box-shadow:none; }
#zc-app .zc-col-label { font:500 13px/1.5 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; color:var(--cd-muted); }
#zc-app .zc-chosen-name { font:500 22px/1.3 var(--cd-heading); letter-spacing:0; text-transform:none; color:var(--cd-ink); overflow-wrap:anywhere; }
#zc-app .zc-chosen-dates { font:400 12px/1.5 Inter,system-ui,sans-serif; color:var(--cd-muted); overflow-wrap:anywhere; }
#zc-app .zc-vs-text { letter-spacing:0; font-size:12px; color:var(--cd-accent); }
#zc-app .zc-grid-label { font:400 14px/1.6 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; text-align:left; margin:0 0 16px; color:var(--cd-muted); }
#zc-app .zc-signs-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:0; }
#zc-app .zc-sign-tile { min-width:0; min-height:94px; justify-content:center; gap:7px; padding:12px 5px; background:var(--cd-panel); border-color:var(--cd-line); }
#zc-app .zc-tile-name { font:500 14px/1.4 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; color:var(--cd-ink); overflow-wrap:anywhere; }
#zc-app .zc-tile-glyph { display:none; }
#zc-app .zc-sign-tile:is(.sel-1,.sel-2) { border-color:var(--cd-accent); box-shadow:inset 0 0 0 1px var(--cd-accent); background:var(--cd-soft); }
#zc-app .zc-sign-tile:is(.sel-1,.sel-2) :is(.zc-tile-name,.zc-tile-glyph) { color:var(--cd-accent); }
#zc-app .zc-btn-analyze { max-width:none; font:600 15px/1.5 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; min-height:54px; padding:15px 18px; background:var(--cd-accent); color:#191520; }
#zc-app .zc-btn-analyze:disabled { opacity:.5; }
#zc-app .zc-btn-new { font:500 14px/1.5 Inter,system-ui,sans-serif; letter-spacing:0; text-transform:none; min-height:48px; color:var(--cd-accent); border-color:var(--cd-line); }
#zc-app .zc-result-top { margin:0 0 28px; }
#zc-app .zc-result-pill { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); max-width:540px; margin:auto; gap:24px; border-radius:var(--px-radius,12px); background:var(--cd-panel); border-color:var(--cd-line); padding:24px; }
#zc-app .zc-res-sign { gap:10px; min-width:0; }
#zc-app .zc-res-emoji { font-size:40px; }
#zc-app .zc-res-name { font:500 24px/1.3 var(--cd-heading); letter-spacing:0; text-transform:none; color:var(--cd-ink); overflow-wrap:anywhere; }
#zc-app .zc-res-sep { color:var(--cd-accent); }
#zc-app .zc-result-heading { font:500 28px/1.3 var(--cd-heading); color:var(--cd-ink); letter-spacing:0; text-transform:none; margin:24px 0 12px; overflow-wrap:anywhere; hyphens:auto; }
#zc-app #zc-affinity-note { font-size:13px; color:var(--cd-muted); text-align:center; margin:0; }
#zc-app .zc-trio { gap:20px; }
#zc-app .zc-trio-card { display:grid; grid-template-columns:180px minmax(0,1fr); grid-template-rows:auto 1fr; gap:18px 32px; padding:28px; border-color:var(--cd-line); background:var(--cd-panel); }
#zc-app .zc-trio-head { margin:0; grid-column:1; grid-row:1; gap:12px; }
#zc-app .zc-trio-label { font:500 24px/1.3 var(--cd-heading); letter-spacing:0; text-transform:none; }
#zc-app .zc-affinity-row { grid-column:1; grid-row:2; margin:0; flex-direction:column-reverse; align-items:flex-start; align-self:start; gap:12px; }
#zc-app .zc-affinity-track { width:100%; flex:none; height:6px; }
#zc-app .zc-affinity-val { font:500 30px/1.2 var(--cd-heading); }
#zc-app .zc-trio-text { grid-column:2; grid-row:1/3; padding:0 0 0 28px; border-left:1px solid var(--cd-line); font:400 16px/1.9 Inter,system-ui,sans-serif; color:var(--cd-ink); overflow-wrap:anywhere; }
#zc-app .zc-trio-text p { margin:0 0 16px; }
#zc-app .zc-trio-text p:last-child { margin:0; }
#zc-app:has(#zc-step-result.active) .cd-header { display:none; }
@media(max-width:760px){
 :is(#calendario-lunar-app,#zc-app) .cd-container { padding:28px 20px 48px; }
 :is(#calendario-lunar-app,#zc-app) .cd-header { grid-template-columns:minmax(0,1fr) 110px; gap:20px; }
 :is(#calendario-lunar-app,#zc-app) .cd-hero-art { aspect-ratio:.85; }
 :is(#calendario-lunar-app,#zc-app) .cd-title { font-size:30px; }
 :is(#calendario-lunar-app,#zc-app) .cd-subtitle { font-size:14px; margin-top:12px; }
 #calendario-lunar-app .cd-overview { grid-template-columns:minmax(0,1fr); gap:12px; }
 #calendario-lunar-app .cl-events-bar { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 #calendario-lunar-app .cl-event-pill { padding:14px; align-items:flex-start; gap:10px; }
 #calendario-lunar-app .cl-event-label { font-size:17px; }
 #calendario-lunar-app .cl-day { min-height:100px; padding:8px 2px; }
 #calendario-lunar-app .cl-day:has(.cl-day-event) { padding-top:5px; }
 #calendario-lunar-app .cl-day-moon { width:26px; height:26px; }
 #calendario-lunar-app .cl-day-moon svg { width:100%; height:100%; }
 #calendario-lunar-app .cl-day-event { font-size:12px; }
 #calendario-lunar-app .cl-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:20px 16px; }
 #zc-app #zc-step-selector.active { grid-template-columns:1fr; gap:24px; }
 #zc-app .zc-chosen-card { min-height:172px; }
 #zc-app .zc-trio-card { grid-template-columns:1fr; gap:18px; padding:24px; }
 #zc-app :is(.zc-trio-head,.zc-affinity-row,.zc-trio-text) { grid-column:1; grid-row:auto; }
 #zc-app .zc-affinity-row { flex-direction:row; align-items:center; }
 #zc-app .zc-affinity-track { width:auto; flex:1; }
 #zc-app .zc-trio-text { padding:18px 0 0; border-left:0; border-top:1px solid var(--cd-line); }
}
@media(max-width:440px){
 :is(#calendario-lunar-app,#zc-app) .cd-container { padding-left:12px; padding-right:12px; }
 :is(#calendario-lunar-app,#zc-app) .cd-header { grid-template-columns:minmax(0,1fr) 84px; gap:14px; }
 :is(#calendario-lunar-app,#zc-app) .cd-title { font-size:27px; }
 #calendario-lunar-app .sky-zone { grid-template-columns:1fr; gap:8px; }
 #calendario-lunar-app .cl-today-card { grid-template-columns:64px minmax(0,1fr); padding:20px 16px; gap:14px 18px; }
 #calendario-lunar-app .cl-big-moon,#calendario-lunar-app .cl-big-moon svg { width:64px; height:64px; }
 #calendario-lunar-app .cl-today-phase-name { font-size:26px; }
 #calendario-lunar-app .cl-event-pill { flex-direction:column; }
 #calendario-lunar-app .cl-cal-nav { padding:14px 10px; gap:8px; }
 #calendario-lunar-app .cl-cal-month-title { font-size:24px; }
 #calendario-lunar-app .cl-weekday { font-size:13px; }
 #calendario-lunar-app .cl-day-event { display:none; }
 #calendario-lunar-app .cl-day-tooltip { width:200px; }
 #calendario-lunar-app .cl-day { min-height:100px; }
 #calendario-lunar-app .cl-selected-detail { padding:20px 16px; gap:14px; }
 #zc-app .cd-selection { padding:20px 14px; }
 #zc-app .zc-signs-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
 #zc-app .zc-result-pill { padding:22px 14px; gap:12px; }
 #zc-app .zc-res-name { font-size:22px; }
 #zc-app .zc-result-heading { font-size:24px; }
 #zc-app .zc-trio-card { padding:22px 18px; }
}