/* ══════════════════════════════════════════════════════════════════════════
   zodiac.css — Zodiac / Astrology page specific styles
   Block1 page-specific + Block4 + Block5 combined.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Zodiac page body overrides ── */
body { font-size: 16px; padding-bottom: 5rem; }

/* ── Block4: base + zodiac design ── */
/* ── Reset + base ─────────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#07070f;--bg2:#0c0b18;
  --card-bg:rgba(255,255,255,0.04);
  --border:rgba(255,255,255,0.07);--border-hi:rgba(255,255,255,0.14);
  --row-border:rgba(255,255,255,0.05);
  --shadow-card:0 0 0 1px rgba(255,255,255,0.06),0 8px 32px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.08);
  --text:#eeeef8;--text-dim:#9898b8;--text-muted:#4a4a68;
  --accent:#7c5cfc;--accent2:#a78bfa;--accent-dim:rgba(124,92,252,0.14);--accent-border:rgba(124,92,252,0.35);
  --green:#34d399;--amber:#fbbf24;--red:#f87171;--blue:#60a5fa;
  --fire:#ef4444;--earth:#84cc16;--air:#60a5fa;--water:#818cf8;
  --radius:18px;--radius-sm:10px;--radius-xs:7px;
  --page-max:1300px;
}
.page{width:100%;max-width:var(--page-max);margin:0 auto;position:relative;z-index:1}

/* ── Glass card ────────────────────────────────────────────────────────────── */
.card,.glass-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.5rem;box-shadow:var(--shadow-card);position:relative;overflow:visible}
.card::before,.glass-card::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.18),transparent);pointer-events:none}

/* ── Section label ─────────────────────────────────────────────────────────── */
.section-label{display:flex;align-items:center;gap:0.5rem;font-size:0.86rem;font-weight:700;letter-spacing:2.2px;text-transform:uppercase;margin-bottom:0.85rem;color:rgba(var(--sl-c,150,150,180),0.85);position:relative;z-index:1}
.section-label .sl-dot{width:5px;height:5px;border-radius:50%;background:rgb(var(--sl-c,150,150,180));box-shadow:0 0 8px rgba(var(--sl-c,150,150,180),0.55);flex-shrink:0}
.section-label::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(var(--sl-c,150,150,180),0.2),transparent)}
.sl-accent{--sl-c:124,92,252}.sl-violet{--sl-c:162,110,255}.sl-green{--sl-c:56,215,160}.sl-amber{--sl-c:255,195,55}.sl-blue{--sl-c:46,196,255}.sl-neutral{--sl-c:100,115,148}

/* ── Buttons ────────────────────────────────────────────────────────────────── */
/* btn base + primary/ghost/sm/green/danger/red inherited from shared.css */


/* ── Inputs ─────────────────────────────────────────────────────────────────── */
.field-group{display:flex;flex-direction:column;gap:0.25rem}
.field-label{font-size:0.94rem;font-weight:600;color:var(--text-dim);letter-spacing:0.3px}
.field-input{width:100%;background:rgba(0,0,0,0.35);border:1px solid var(--border);border-radius:var(--radius-xs);padding:0.5rem 0.8rem;color:var(--text);font-family:'DM Sans',inherit;font-size:0.95rem;outline:none;transition:border-color 0.18s}
.field-input:focus{border-color:var(--accent-border);box-shadow:0 0 0 3px rgba(124,92,252,0.1)}
.field-input::placeholder{color:var(--text-muted)}

/* ── Header ─────────────────────────────────────────────────────────────────── */
.page-header-row{display:flex;align-items:center;height:68px;gap:0.55rem;margin-bottom:1.1rem;position:relative}
.back-btn{flex-shrink:0;width:48px;height:62px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);background:var(--card-bg);border:1px solid var(--border);color:var(--text-dim);font-size:1.2rem;font-weight:700;text-decoration:none;transition:all 0.2s;box-shadow:var(--shadow-card);position:relative;overflow:hidden}
.back-btn::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.18),transparent)}
.back-btn:hover{background:var(--accent-dim);border-color:var(--accent-border);color:var(--accent2);transform:translateX(-2px)}
.title-card{flex:1;display:flex;align-items:center;gap:0.75rem;height:62px;padding:0 1.4rem;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-card);position:relative;overflow:hidden}
.title-card::before{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.18),transparent)}
.title-card .page-icon{font-size:1.4rem;line-height:1;flex-shrink:0}
.title-card h1{font-size:1.3rem;font-weight:800;color:var(--text);letter-spacing:-0.5px;line-height:1.15;margin:0}
.title-card .sub{font-size:0.96rem;color:var(--text-dim);margin:0.1rem 0 0}
.title-text{display:flex;flex-direction:column}
.hdr-btn{position:relative;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 1rem;color:var(--text-dim);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;min-width:48px;height:62px;transition:all 0.18s;box-shadow:var(--shadow-card)}
.hdr-btn:hover{border-color:var(--border-hi);color:var(--text)}
.bell-badge{position:absolute;top:6px;right:6px;min-width:16px;height:16px;border-radius:10px;background:var(--red);color:var(--text);font-size:0.94rem;font-weight:800;display:none;align-items:center;justify-content:center;padding:0 3px}
.bell-badge.visible{display:flex}
/* Search */
.hdr-search-wrapper{display:flex;align-items:center;max-width:0;opacity:0;overflow:hidden;transition:max-width 0.32s cubic-bezier(0.16,1,0.3,1),opacity 0.22s ease;flex:0;flex-shrink:0}
.hdr-search-wrapper.expanded{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:50;max-width:none;opacity:1;flex:none;overflow:visible;background:var(--card-bg);border:1px solid var(--border-hi);border-radius:var(--radius-sm);padding:0.3rem 0.6rem;backdrop-filter:blur(16px);box-shadow:0 4px 24px rgba(0,0,0,.5)}
.hdr-search-row{display:flex;align-items:center;gap:0.4rem;width:100%}
.hdr-search-input{flex:1;background:rgba(0,0,0,0.35);border:1px solid rgba(255,255,255,0.1);border-radius:var(--radius-xs);color:var(--text);font-size:1rem;padding:0.45rem 0.8rem;outline:none;font-family:inherit;transition:border-color 0.15s;min-width:0}
.hdr-search-input:focus{border-color:rgba(124,92,252,0.5)}
.hdr-search-input::placeholder{color:var(--text-muted)}
.hdr-search-close{background:none;border:none;color:var(--text-muted);font-size:0.95rem;cursor:pointer;padding:0.3rem;border-radius:4px;transition:color 0.15s;flex-shrink:0}
.hdr-search-close:hover{color:var(--text)}

/* Cards that need clipping */
#wheel-card,#tab-card{overflow:hidden}
#tab-card{display:flex;flex-direction:column}
#tab-content{flex:1;min-height:520px}
#zcal-main{display:flex;flex-direction:column;flex:1}
#zcal-main .zcal-grid{flex:1}
#wheel-svg{width:min(90vw,78vh);height:min(90vw,78vh);display:block;margin:0 auto}
.tab-bar{display:flex;gap:2px;padding:3px;background:rgba(0,0,0,0.3);border-radius:var(--radius-sm);border:1px solid var(--border)}
.tab{padding:0.3rem 0.85rem;border-radius:6px;font-size:0.87rem;font-weight:500;cursor:pointer;color:var(--text-muted);transition:all 0.15s;border:none;background:none;font-family:'DM Sans',sans-serif;white-space:nowrap}
.tab:hover{color:var(--text-dim)}
.tab.active{background:rgba(124,92,252,0.2);color:var(--accent2);border:1px solid rgba(124,92,252,0.3)}

/* ── Badges ─────────────────────────────────────────────────────────────────── */
.retro-badge{display:inline-block;font-size:0.86rem;color:var(--amber);font-family:'DM Mono',monospace;background:rgba(251,191,36,0.1);border:1px solid rgba(251,191,36,0.25);border-radius:3px;padding:0.04rem 0.28rem}

/* ── Ribbon ─────────────────────────────────────────────────────────────────── */
.b-ribbon{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:1.25rem;box-shadow:var(--shadow-card)}
.b-ribbon-cell{padding:0.4rem;text-align:center;background:var(--card-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.28rem;min-height:52px}
.b-ribbon-val{font-size:1.15rem;font-weight:700;color:var(--accent2);line-height:1;display:flex;align-items:center;justify-content:center;gap:0.25rem}
.b-ribbon-lbl{font-size:0.92rem;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--text-muted);line-height:1}

/* ── Wheel card ─────────────────────────────────────────────────────────────── */
.wheel-outer{display:flex;flex-direction:column;align-items:center;gap:0.75rem;padding:0}
.wheel-summary{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center}
.wheel-summary-pill{font-size:0.97rem;color:var(--text-dim);display:flex;align-items:center;gap:0.35rem}

/* ── Planet table ───────────────────────────────────────────────────────────── */
.planet-table{width:100%;border-collapse:collapse}
.planet-table th{font-size:0.96rem;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--text-muted);padding:0.3rem 0.6rem;text-align:left;border-bottom:1px solid var(--border)}
.planet-table td{padding:0.38rem 0.6rem;font-size:0.92rem;color:var(--text-dim);border-bottom:1px solid rgba(255,255,255,0.03)}
.planet-table tr:last-child td{border-bottom:none}
.planet-table td:first-child{color:var(--text);font-weight:500;display:flex;align-items:center;gap:0.5rem}
.planet-icon-cell{display:flex;align-items:center;gap:0.5rem}

/* ── Element bars ───────────────────────────────────────────────────────────── */
.el-section{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.el-group h4{font-size:0.96rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);margin-bottom:0.65rem}
.el-row{display:flex;align-items:center;gap:0.6rem;margin-bottom:0.45rem}
.el-name{font-size:0.97rem;font-weight:600;width:68px;flex-shrink:0;text-transform:capitalize}
.el-track{flex:1;height:5px;background:rgba(255,255,255,0.07);border-radius:3px;overflow:hidden}
.el-fill{height:100%;border-radius:3px;transition:width 0.6s cubic-bezier(0.4,0,0.2,1)}
.el-num{font-size:0.77rem;font-family:'DM Mono',monospace;color:var(--text-muted);width:14px;text-align:right}

/* ── Aspects ────────────────────────────────────────────────────────────────── */
.asp-row{display:flex;align-items:center;gap:0.5rem;padding:0.3rem 0.4rem;border-radius:5px;font-size:1rem;color:var(--text-dim);transition:background 0.1s;cursor:default}
.asp-row:hover{background:rgba(255,255,255,0.04)}
.asp-sym{font-size:0.92rem;width:1.4rem;text-align:center}
.asp-orb{font-size:0.77rem;font-family:'DM Mono',monospace;color:var(--text-muted);margin-left:auto}

/* ── Transit row ─────────────────────────────────────────────────────────────── */
.transit-row{display:flex;align-items:center;flex-wrap:wrap;gap:0.4rem;padding:0.35rem 0;border-bottom:1px solid rgba(255,255,255,0.04);font-size:1rem;color:var(--text-dim)}
.transit-row:last-child{border-bottom:none}

/* ── Dignities ───────────────────────────────────────────────────────────────── */
.dignity-row{display:flex;align-items:center;justify-content:space-between;padding:0.28rem 0;border-bottom:1px solid rgba(255,255,255,0.03);font-size:0.87rem}
.dignity-row:last-child{border-bottom:none}

/* ── Interpretations ─────────────────────────────────────────────────────────── */
.interp-row{padding:0.55rem 0;border-bottom:1px solid rgba(255,255,255,0.04)}
.interp-row:last-child{border-bottom:none}
.interp-planet{font-size:1rem;font-weight:600;color:var(--text);display:flex;align-items:center;gap:0.4rem;margin-bottom:0.18rem}
.interp-text{font-size:0.97rem;color:var(--text-dim);line-height:1.5}
.interp-kw{display:inline-block;font-size:0.97rem;font-family:'DM Mono',monospace;color:var(--accent2);margin-right:0.28rem;opacity:0.85}

/* ── Toast ───────────────────────────────────────────────────────────────────── */
#ztoa{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%) translateY(20px);background:rgba(20,18,40,0.95);border:1px solid rgba(124,92,252,0.35);border-radius:var(--radius-xs);padding:0.55rem 1.2rem;font-size:0.92rem;color:var(--text);opacity:0;transition:all 0.25s;z-index:9999;pointer-events:none;white-space:nowrap}
#ztoa.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── Dominant card ─────────────────────────────────────────────────────────── */
.dominant-card{display:flex;align-items:center;gap:1.25rem}
.dominant-icon{font-size:2.4rem;line-height:1;filter:drop-shadow(0 0 10px rgba(167,139,250,0.5))}
.dominant-info{flex:1}
.dominant-name{font-size:0.95rem;font-weight:600;color:var(--text);margin-bottom:0.2rem}
.dominant-desc{font-size:0.97rem;color:var(--text-dim);line-height:1.5}
.birth-moon-cell{border-left:1px solid var(--border);padding-left:1.1rem;text-align:center;flex-shrink:0}
.birth-moon-icon{font-size:1.6rem;margin-bottom:0.12rem}
.birth-moon-label{font-size:0.96rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted)}

/* ── Profiles ───────────────────────────────────────────────────────────────── */
.profile-chip{display:inline-flex;align-items:center;gap:0.35rem;padding:0.28rem 0.7rem;border-radius:20px;border:1px solid var(--border);background:rgba(255,255,255,0.04);font-size:0.87rem;color:var(--text-dim);cursor:pointer;transition:all 0.15s}
.profile-chip:hover,.profile-chip.active{border-color:rgba(124,92,252,0.45);background:rgba(124,92,252,0.12);color:var(--accent2)}

/* ── Loading state ───────────────────────────────────────────────────────────── */
.calculating-overlay{display:none;position:absolute;inset:0;background:rgba(7,7,15,0.75);z-index:10;border-radius:var(--radius);align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.calculating-overlay.show{display:flex}
.calc-spinner{width:32px;height:32px;border:3px solid rgba(124,92,252,0.2);border-top-color:var(--accent2);border-radius:50%;animation:spin 0.7s linear infinite;margin-right:0.75rem}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes vcrise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.page{animation:vcrise 0.45s cubic-bezier(0.16,1,0.3,1)}

/* ── Summary card ───────────────────────────────────────────────────────────── */
.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.3rem 1rem}
.summary-row{display:flex;justify-content:space-between;align-items:baseline;padding:0.22rem 0;border-bottom:1px solid rgba(255,255,255,0.03);font-size:1rem}
.summary-row:last-child{border-bottom:none}
.summary-key{color:var(--text-muted);font-size:0.94rem}
.summary-val{color:var(--text);font-weight:500}

/* ── House system picker ────────────────────────────────────────────────────── */
.house-picker{display:flex;gap:2px;padding:3px;background:rgba(0,0,0,0.3);border:1px solid var(--border);border-radius:8px}
.house-btn{padding:0.38rem 1rem;border-radius:5px;font-size:0.92rem;font-weight:500;cursor:pointer;color:var(--text-muted);border:none;background:none;font-family:'DM Sans',sans-serif;transition:all 0.12s}
.house-btn:hover{color:var(--text-dim)}
.house-btn.active{background:rgba(124,92,252,0.2);color:var(--accent2);border:1px solid rgba(124,92,252,0.3)}


/* ── Astro Calendar (zodiac) ─────────────────────────────────────────────────── */
.zcal-header{display:flex;align-items:center;justify-content:space-between;padding:0.85rem 1rem 0.65rem;border-bottom:1px solid rgba(124,92,252,0.12)}
.zcal-month-title{font-family:'Cinzel',serif;font-size:0.95rem;font-weight:400;letter-spacing:0.04em;color:var(--text)}
.zcal-nav{display:flex;gap:0.3rem}
.zcal-nav button{background:rgba(124,92,252,0.08);border:1px solid rgba(124,92,252,0.2);border-radius:6px;color:var(--accent2);width:24px;height:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:0.87rem;transition:all 0.15s}
.zcal-nav button:hover{background:rgba(124,92,252,0.18)}
.zcal-dow{display:grid;grid-template-columns:repeat(7,1fr);padding:0.35rem 0.5rem 0.1rem}
.zcal-dow span{text-align:center;font-size:0.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:rgba(167,139,250,0.35)}
.zcal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;padding:0 0.4rem 0.4rem;background:rgba(124,92,252,0.04)}
.zcal-cell{min-height:68px;padding:0.22rem 0.2rem 0.18rem;background:var(--bg);cursor:pointer;transition:background 0.1s;border-radius:2px}
.zcal-cell:hover{background:rgba(124,92,252,0.07)}
.zcal-cell.other{opacity:0.2}
.zcal-cell.today{background:rgba(124,92,252,0.12)}
.zcal-cell.selected{background:rgba(124,92,252,0.2);outline:1px solid rgba(124,92,252,0.4)}
.zcal-cell-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.1rem}
.zcal-day-n{font-size:0.92rem;color:var(--text-muted)}
.zcal-cell.today .zcal-day-n{color:var(--accent2);font-weight:700}
.zcal-moon{font-size:0.96rem;opacity:0.8}
.zcal-ev{font-size:0.72rem;font-family:'DM Mono',monospace;padding:0.05rem 0.2rem;border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:0.12rem;margin-top:1px}
.zcal-ev.ingress{background:rgba(96,165,250,0.15);color:#93c5fd}
.zcal-ev.lunar{background:rgba(167,139,250,0.15);color:var(--accent2)}
.zcal-ev.retro{background:rgba(251,191,36,0.12);color:var(--amber)}
.zcal-ev.direct{background:rgba(52,211,153,0.12);color:var(--green)}
.zcal-detail{border-top:1px solid rgba(124,92,252,0.12);padding:0.65rem 1rem;background:rgba(124,92,252,0.04);display:none}
.zcal-detail.open{display:block}

/* ── Empty / not-calculated state ───────────────────────────────────────────── */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;gap:0.75rem;color:var(--text-muted);text-align:center}
.empty-icon{font-size:2.5rem;opacity:0.35}
.empty-text{font-size:0.94rem;line-height:1.55}

/* ── Block5: production overrides ── */
/* ── Production overrides ── */
:root { --page-max: 1300px; }
/* form grid */
.form-5{display:grid;grid-template-columns:1fr 1fr 1fr 1fr auto;gap:.75rem;align-items:end}
@media(max-width:860px){.form-5{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:520px){.form-5{grid-template-columns:1fr 1fr}}
/* pending banner */
.pending-banner{display:none;align-items:center;gap:.75rem;background:rgba(124,92,252,.08);border:1px solid rgba(124,92,252,.25);border-radius:10px;padding:.85rem 1rem;margin-top:.75rem;font-size:.82rem;color:var(--text-dim)}
.pending-banner.show{display:flex}
/* summary cards */
.summary-row{display:flex;justify-content:space-between;align-items:baseline;padding:.35rem 0;border-bottom:1px solid rgba(255,255,255,.03);font-size:1rem}
.summary-row:last-child{border-bottom:none}
.summary-key{color:var(--text-muted);font-size:.88rem}
.summary-val{color:var(--text);font-weight:500}
/* tab empty state */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.5rem 1rem;gap:.65rem;color:var(--text-muted);text-align:center}
.empty-icon{font-size:2.5rem;opacity:.35}
.empty-text{font-size:.82rem;line-height:1.55}
/* calc overlay */
.calculating-overlay{display:none;position:absolute;inset:0;background:rgba(7,7,15,.75);z-index:10;border-radius:var(--radius);align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.calculating-overlay.show{display:flex}
.calc-spinner{width:32px;height:32px;border:3px solid rgba(124,92,252,.2);border-top-color:var(--accent2);border-radius:50%;animation:zspin .7s linear infinite;margin-right:.75rem}
@keyframes zspin{to{transform:rotate(360deg)}}
/* planet icon cell */
.planet-icon-cell{display:flex;align-items:center;gap:.3rem}
/* planet table */
.planet-table{width:100%;border-collapse:collapse;font-size:1rem}
.planet-table th{font-size:.78rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);padding:.5rem .75rem;border-bottom:1px solid rgba(255,255,255,.07);text-align:left}
.planet-table td{padding:.6rem .75rem;border-bottom:1px solid rgba(255,255,255,.04);vertical-align:middle;font-size:1rem}
.planet-table tr:last-child td{border-bottom:none}
.planet-table tbody tr:hover td{background:rgba(124,92,252,.04)}
.el-fire{color:#ef4444}.el-earth{color:#84cc16}.el-air{color:#60a5fa}.el-water{color:#818cf8}
/* aspect grid */
.asp-grid{border-collapse:collapse;font-size:.9rem}
.asp-grid th,.asp-grid td{width:38px;height:38px;text-align:center;vertical-align:middle;border:1px solid rgba(255,255,255,.04)}
.asp-grid th{font-size:.78rem;font-weight:700;color:var(--text-dim);background:rgba(0,0,0,.2)}
.asp-cell{font-size:1rem;cursor:default}
.asp-con{color:#fff}.asp-sex{color:var(--green)}.asp-tri{color:#60a5fa}
.asp-squ{color:var(--red)}.asp-opp{color:var(--amber)}.asp-qcx{color:var(--text-dim)}
/* el bars */
.el-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.55rem}
.el-name{font-size:.95rem;font-weight:600;width:80px;flex-shrink:0;text-transform:capitalize}
.el-track{flex:1;height:6px;background:rgba(255,255,255,.07);border-radius:3px;overflow:hidden}
.el-fill{height:100%;border-radius:3px;transition:width .6s cubic-bezier(.4,0,.2,1)}
.el-n{font-size:.85rem;font-family:'DM Mono',monospace;color:var(--text-muted);width:18px;text-align:right}
/* interp */
.interp-row{padding:.7rem 0;border-bottom:1px solid rgba(255,255,255,.04)}
.interp-row:last-child{border-bottom:none}
.interp-planet{font-size:1rem;font-weight:600;color:var(--text);display:flex;align-items:center;gap:.4rem;margin-bottom:.2rem}
.interp-text{font-size:.94rem;color:var(--text-dim);line-height:1.55}
.interp-kw{font-size:.8rem;font-family:'DM Mono',monospace;color:var(--accent2);margin-right:.32rem}
/* transit row */
.transit-row td{color:var(--accent2);opacity:.85}
/* retro badge */
.retro-badge{font-size:.78rem;font-weight:700;padding:.12rem .45rem;border-radius:4px;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.25);color:var(--amber)}
/* wheel summary pills */
.wheel-summary{display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center}
.wheel-summary-pill{font-size:.73rem;color:var(--text-dim);display:flex;align-items:center;gap:.35rem}
/* zcal */
.zcal-header{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem .65rem;border-bottom:1px solid rgba(124,92,252,.12)}
.zcal-nav{display:flex;gap:.3rem}
.zcal-nav button{background:rgba(124,92,252,.08);border:1px solid rgba(124,92,252,.2);border-radius:6px;color:var(--accent2);width:24px;height:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.75rem;transition:all .15s}
.zcal-nav button:hover{background:rgba(124,92,252,.18)}
.zcal-dow{display:grid;grid-template-columns:repeat(7,1fr);padding:.35rem .5rem .1rem}
.zcal-dow span{text-align:center;font-size:.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:rgba(167,139,250,.35)}
.zcal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;padding:0 .4rem .4rem;background:rgba(124,92,252,.04)}
.zcal-cell{min-height:68px;padding:.3rem .25rem .2rem;background:var(--bg);cursor:pointer;transition:background .1s;border-radius:2px}
.zcal-cell:hover{background:rgba(124,92,252,.07)}
.zcal-cell.other{opacity:.2}
.zcal-cell.today{background:rgba(124,92,252,.12)}
.zcal-cell.selected{background:rgba(124,92,252,.2);outline:1px solid rgba(124,92,252,.4)}
.zcal-cell-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.12rem}
.zcal-day-n{font-size:.82rem;color:var(--text-muted)}
.zcal-cell.today .zcal-day-n{color:var(--accent2);font-weight:700}
.zcal-moon{font-size:.88rem;opacity:.8}
.zcal-ev{font-size:.68rem;font-family:'DM Mono',monospace;padding:.06rem .25rem;border-radius:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:.15rem;margin-top:2px}
.zcal-ev.ingress{background:rgba(96,165,250,.15);color:#93c5fd}
.zcal-ev.lunar{background:rgba(167,139,250,.15);color:var(--accent2)}
.zcal-ev.retro{background:rgba(251,191,36,.12);color:var(--amber)}
.zcal-ev.direct{background:rgba(52,211,153,.12);color:var(--green)}
.zcal-detail{border-top:1px solid rgba(124,92,252,.12);padding:.65rem 1rem;background:rgba(124,92,252,.04);display:none}
.zcal-detail.open{display:block}

/* ── Block1 zodiac-specific styles ── */
.sl-red     { --sl-c: 248,113,113; }
/* btn-green/danger/red inherited from shared.css */
.badge-green  { background: rgba(52,211,153,0.1);  border-color: rgba(52,211,153,0.25); color: var(--green); }
.badge-amber  { background: rgba(255,195,55,0.1);  border-color: rgba(255,195,55,0.25); color: var(--amber); }
.badge-red    { background: rgba(248,113,113,0.1); border-color: rgba(248,113,113,0.25);color: var(--red); }
.badge-blue   { background: rgba(46,196,255,0.1);  border-color: rgba(46,196,255,0.25); color: #60d4ff; }
.space-bg { position: fixed; inset: 0; pointer-events: none; z-index: 0; background: radial-gradient(ellipse 800px 600px at 5% 10%, rgba(124,92,252,0.13) 0%, transparent 70%), radial-gradient(ellipse 600px 500px at 92% 80%, rgba(46,196,255,0.10) 0%, transparent 70%), radial-gradient(ellipse 500px 400px at 50% 115%, rgba(56,215,160,0.08) 0%, transparent 70%); animation: spaceshift 30s ease-in-out infinite alternate; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.75rem; position: relative; z-index: 1; }
.form-grid { grid-template-columns: 1fr 1fr; }
.form-grid { grid-template-columns: 1fr; }
.form-grid > * { min-width: 0; }
.profiles-row { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 1rem; position: relative; z-index: 1; }
.profile-pill { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.22rem 0.65rem; border-radius: 20px; font-size: 0.74rem; font-weight: 600; cursor: pointer; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04); color: var(--text-dim); transition: all 0.15s; }
.profile-pill:hover { border-color: rgba(124,92,252,0.4); color: var(--accent2); background: rgba(124,92,252,0.08); }
.profile-pill.active { border-color: rgba(124,92,252,0.5); color: var(--accent2); background: rgba(124,92,252,0.14); }
.profile-pill .del-x { opacity: 0.4; margin-left: 0.15rem; font-size:0.8rem; }
.profile-pill .del-x:hover { opacity: 1; color: var(--red); }
.save-profile-row { display: flex; gap: 0.4rem; margin-top: 0.75rem; position: relative; z-index: 1; }
.save-profile-input { flex: 1; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 0.38rem 0.65rem; color: var(--text); font-size: 0.8rem; font-family: inherit; outline: none; transition: border-color 0.2s; }
.save-profile-input:focus { border-color: rgba(124,92,252,0.45); }
.save-profile-input::placeholder { color: var(--text-muted); }
.chart-wrap { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; min-height: 460px; flex-direction: column; padding: 0.5rem 0; }
.chart-placeholder { text-align: center; color: var(--text-muted); font-size: 0.85rem; }
.transit-toggle-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.85rem; position: relative; z-index: 1; }
.transit-badge { font-size:0.82rem; font-weight: 700; padding: 0.15rem 0.55rem; border-radius: 20px; background: rgba(162,110,255,0.1); border: 1px solid rgba(162,110,255,0.3); color: var(--accent2); }
.spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,0.1); border-top-color: var(--accent); border-radius: 50%; animation: zspin 0.75s linear infinite; vertical-align: middle; margin-right: 0.3rem; }
.planets-table { width: 100%; border-collapse: collapse; position: relative; z-index: 1; font-size: 0.82rem; }
.planets-table th { font-size:0.76rem; font-weight: 700; letter-spacing: 1.8px; text-transform: uppercase; color: rgba(255,255,255,0.3); padding: 0.5rem 0.75rem; border-bottom: 1px solid rgba(255,255,255,0.07); text-align: left; }
.planets-table td { padding: 0.58rem 0.75rem; border-bottom: 1px solid rgba(255,255,255,0.04); vertical-align: middle; }
.planets-table tr:last-child td { border-bottom: none; }
.planets-table tbody tr:hover td { background: rgba(124,92,252,0.04); }
.planets-table .planet-name { font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 0.35rem; }
.planets-table .planet-glyph { font-size: 1rem; width: 1.2rem; text-align: center; flex-shrink: 0; }
.planets-table .sign-cell { display: flex; align-items: center; gap: 0.35rem; }
.planets-table .sign-glyph { font-size: 0.9rem; }
.planets-table .degree-cell { font-family: 'DM Mono', monospace; font-size: 0.75rem; color: var(--text-dim); }
.planets-table .house-cell { font-family: 'DM Mono', monospace; font-size: 0.75rem; color: rgba(255,255,255,0.35); }
.aspect-grid-wrap { overflow-x: auto; position: relative; z-index: 1; }
.aspect-grid { border-collapse: collapse; font-size: 0.7rem; }
.aspect-grid th, .aspect-grid td { width: 34px; height: 34px; text-align: center; vertical-align: middle; border: 1px solid rgba(255,255,255,0.04); }
.aspect-grid th { font-size:0.76rem; font-weight: 700; color: var(--text-dim); background: rgba(0,0,0,0.2); }
.asp-ssq { color: #c084fc; }
.asp-header-cell { background: rgba(0,0,0,0.25); }
.export-row { display: flex; gap: 0.4rem; margin-top: 0.85rem; position: relative; z-index: 1; flex-wrap: wrap; }
.zodiac-pending-banner { display: none; align-items: center; gap: 0.75rem; background: rgba(124,92,252,0.08); border: 1px solid rgba(124,92,252,0.25); border-radius: 10px; padding: 0.85rem 1rem; margin-bottom: 0.75rem; font-size: 0.82rem; color: var(--text-dim); position: relative; z-index: 1; }
.zodiac-pending-banner.visible { display: flex; }
.zodiac-pending-icon { font-size: 1.2rem; flex-shrink: 0; }
.date-picker-btn { color: var(--text-dim); }
.date-picker-btn.has-value { color: var(--text); }
.dp-portal{position:fixed;z-index:9999;background:rgba(14,14,30,0.97);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,0.12);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,0.65);padding:1rem;min-width:240px;}
.dp-portal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.65rem;}
.dp-portal-month{font-size:0.84rem;font-weight:700;color:var(--text);}
.dp-portal-nav{background:none;border:none;color:var(--text-dim);font-size:1rem;cursor:pointer;padding:0.2rem 0.45rem;border-radius:5px;font-family:inherit;transition:color 0.15s;}
.dp-portal-nav:hover{color:var(--text);}
.dp-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.dp-cal-dow{text-align:center;font-size:0.76rem;font-weight:700;letter-spacing:1px;color:var(--text-muted);padding:0.2rem 0;}
.dp-cal-day{text-align:center;font-size:0.78rem;padding:0.3rem 0;border-radius:6px;cursor:pointer;color:var(--text-dim);transition:background 0.1s,color 0.1s;}
.dp-cal-day:hover{background:rgba(124,92,252,0.12);color:var(--text);}
.dp-cal-day.today{color:var(--accent2);font-weight:700;}
.dp-cal-day.selected{background:var(--accent);color:#fff;font-weight:700;}
.dp-cal-day.empty{cursor:default;}
#toast {
  position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 9999;
  display: flex; flex-direction: column; gap: 0.4rem;
  pointer-events: none; max-width: 320px;
}
.toast-item {
  padding: 0.65rem 1.1rem; border-radius: var(--radius-sm);
  font-size: 0.82rem; font-weight: 500;
  background: rgba(14,14,28,0.95); border: 1px solid var(--border-hi);
  color: var(--text); box-shadow: 0 8px 32px rgba(0,0,0,0.5);
  animation: vcrise 0.25s cubic-bezier(.16,1,.3,1);
}

/* ── Profile pill (absorbed from inline style block) ── */
.profile-pill { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.22rem 0.65rem; border-radius: 20px; font-size: 0.74rem; font-weight: 600; cursor: pointer; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.04); color: var(--text-dim); transition: all 0.15s; }
.profile-pill:hover  { border-color: rgba(124,92,252,0.4); color: var(--accent2); background: rgba(124,92,252,0.08); }
.profile-pill.active { border-color: rgba(124,92,252,0.5); color: var(--accent2); background: rgba(124,92,252,0.14); }
.profile-pill .del-x { opacity: 0.4; margin-left: 0.15rem; font-size: 0.8rem; }
.profile-pill .del-x:hover { opacity: 1; color: var(--red); }
.profiles-row { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }