/* Starkin astrology theme: warm ivory + violet. Loaded AFTER styles.css; overrides base. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --night:#faf7f1; --night2:#ffffff; --night3:#f2ecdf;
  --ink:#3a2d21; --ink-dim:rgba(58,45,33,.66); --ink-faint:rgba(58,45,33,.42);
  --gold:#d97f42; --gold-bright:#e89a5c; --gold-soft:rgba(217,127,66,.09); --gold-line:rgba(217,127,66,.22);
  --card:rgba(255,255,255,.72); --card2:#ffffff; --line:rgba(58,45,33,.12);
  --good:#2e7d46; --warn:#8f6a12; --bad:#b3502f;
}
html{background:var(--night)}
body{
  background:transparent;
  color:var(--ink);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  min-height:100vh;
  position:relative;
}
/* starfield + nebula */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.5;
  background:
    radial-gradient(1px 1px at 12% 22%, rgba(217,127,66,.55) 50%, transparent 51%),
    radial-gradient(1px 1px at 28% 68%, rgba(217,127,66,.30) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 41% 12%, rgba(217,127,66,.45) 50%, transparent 51%),
    radial-gradient(1px 1px at 57% 44%, rgba(217,127,66,.28) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 66% 81%, rgba(217,127,66,.38) 50%, transparent 51%),
    radial-gradient(1px 1px at 74% 27%, rgba(217,127,66,.45) 50%, transparent 51%),
    radial-gradient(1px 1px at 83% 61%, rgba(217,127,66,.25) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 91% 15%, rgba(217,127,66,.4) 50%, transparent 51%),
    radial-gradient(1px 1px at 8% 87%, rgba(217,127,66,.30) 50%, transparent 51%),
    radial-gradient(1px 1px at 47% 93%, rgba(217,127,66,.32) 50%, transparent 51%),
    radial-gradient(1px 1px at 19% 45%, rgba(217,127,66,.22) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 94% 88%, rgba(217,127,66,.30) 50%, transparent 51%);
  background-color:transparent;
}
body::after{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(60% 45% at 50% -5%, rgba(217,127,66,.10), transparent 70%),
    radial-gradient(45% 35% at 85% 20%, rgba(240,190,150,.20), transparent 70%),
    linear-gradient(180deg, #fdfbf7, var(--night) 60%);
}
.ambient{display:none}
h1,h2,h3,h4,h5,.serif{font-family:'Fraunces',Georgia,serif;letter-spacing:-.3px;color:var(--ink)}
p,li,td,th,label,span,div{color:inherit}
a{color:var(--gold-bright)}

/* logo */
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font-weight:600;font-size:18px}
.logo .mark{width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,var(--gold-bright),var(--gold));display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 12px rgba(217,127,66,.35)}

/* buttons */
.btn{cursor:pointer;border:none;font-family:inherit}
.btn-primary,.btn.btn-primary{
  background:linear-gradient(135deg,var(--gold-bright),var(--gold));
  color:#4a2a10;font-weight:700;border:none;border-radius:13px;padding:12px 22px;font-size:15px;
  box-shadow:0 6px 22px rgba(217,127,66,.3);cursor:pointer;
}
.btn-primary:hover{filter:brightness(1.06)}
.btn-primary:disabled{opacity:.55;cursor:default}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:13px;padding:12px 20px;font-size:14.5px;text-decoration:none;display:inline-block}

/* inputs */
input,select{
  background:var(--card2);border:1px solid var(--line);border-radius:11px;color:var(--ink);
  padding:11px 12px;font-size:14.5px;font-family:inherit;width:100%;box-sizing:border-box;
}
input::placeholder{color:var(--ink-faint)}
input:focus,select:focus{outline:2px solid rgba(217,127,66,.4);border-color:transparent}
select option{background:var(--night2);color:var(--ink)}
label{font-size:13px;opacity:.75;display:block;margin-bottom:6px}
.field{margin-bottom:12px}

/* shared nav */
.astro-nav{display:flex;justify-content:space-between;align-items:center;padding:4px 0;margin-bottom:34px;flex-wrap:wrap;gap:10px}
.astro-nav .links{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.astro-nav .links a{margin-left:14px;text-decoration:none;color:var(--ink-dim);font-size:14.5px}
.astro-nav .links a:hover{color:var(--ink)}
.astro-nav .links a.cta{background:linear-gradient(135deg,var(--gold-bright),var(--gold));color:#4a2a10;font-weight:700;padding:9px 16px;border-radius:11px}

/* cards */
.acard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px}
.acard-gold{background:linear-gradient(135deg,rgba(217,168,78,.12),rgba(217,168,78,.03));border:1px solid var(--gold-line);border-radius:18px}

/* panchang strip */
.pstrip{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:10px 0}
.pstrip .pchip{background:var(--card2);border:1px solid var(--gold-line);border-radius:99px;padding:7px 15px;font-size:13px;box-shadow:0 2px 10px rgba(58,45,33,.05)}
.pstrip .pchip b{color:var(--gold-bright);font-weight:600;margin-right:5px}

/* misc */
.msg{margin-top:10px;font-size:13.5px}
.msg.err{color:var(--bad)}
.suggD{background:var(--night2);border:1px solid var(--gold-line);box-shadow:0 14px 40px rgba(58,45,33,.15)}
::selection{background:rgba(217,127,66,.25)}


/* ---------- DARK MODE: the star theme ---------- */
html[data-theme="dark"]{
  --night:#100e1e; --night2:#1a1633; --night3:#221c42;
  --ink:#f3edde; --ink-dim:rgba(243,237,222,.68); --ink-faint:rgba(243,237,222,.42);
  --gold:#d9a84e; --gold-bright:#eec06a; --gold-soft:rgba(217,168,78,.14); --gold-line:rgba(217,168,78,.3);
  --card:rgba(255,255,255,.05); --card2:#1c1838; --line:rgba(243,237,222,.13);
  --good:#7fc492; --warn:#e0b45c; --bad:#e08a6d;
}
html[data-theme="dark"] body::before{
  opacity:1;
  background:
    radial-gradient(1px 1px at 12% 22%, rgba(255,255,255,.85) 50%, transparent 51%),
    radial-gradient(1px 1px at 28% 68%, rgba(255,255,255,.5) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 41% 12%, rgba(238,192,106,.8) 50%, transparent 51%),
    radial-gradient(1px 1px at 57% 44%, rgba(255,255,255,.45) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 66% 81%, rgba(255,255,255,.6) 50%, transparent 51%),
    radial-gradient(1px 1px at 74% 27%, rgba(238,192,106,.7) 50%, transparent 51%),
    radial-gradient(1px 1px at 83% 61%, rgba(255,255,255,.4) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 91% 15%, rgba(255,255,255,.65) 50%, transparent 51%),
    radial-gradient(1px 1px at 8% 87%, rgba(255,255,255,.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 47% 93%, rgba(238,192,106,.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 19% 45%, rgba(255,255,255,.35) 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 94% 88%, rgba(255,255,255,.5) 50%, transparent 51%);
}
html[data-theme="dark"] body::after{
  background:
    radial-gradient(60% 45% at 50% -5%, rgba(96,74,160,.4), transparent 70%),
    radial-gradient(45% 35% at 85% 20%, rgba(217,168,78,.12), transparent 70%),
    linear-gradient(180deg, #171430, var(--night) 60%);
}
html[data-theme="dark"] .pstrip .pchip{box-shadow:none}

/* ---------- burger + drawer ---------- */
.burger{width:42px;height:42px;border-radius:12px;background:var(--card2);border:1px solid var(--line);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.burger svg{stroke:var(--ink);stroke-width:2}
.drawer-overlay{position:fixed;inset:0;background:rgba(10,8,20,.45);z-index:90;opacity:0;pointer-events:none;transition:opacity .25s}
.drawer-overlay.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;left:0;bottom:0;width:min(340px,88vw);background:var(--night);border-right:1px solid var(--line);z-index:95;transform:translateX(-102%);transition:transform .28s cubic-bezier(.2,.8,.25,1);display:flex;flex-direction:column;overflow-y:auto}
.drawer.open{transform:translateX(0)}
.drawer .d-head{display:flex;justify-content:space-between;align-items:center;padding:18px 18px 8px}
.drawer .d-close{width:36px;height:36px;border-radius:10px;background:var(--card2);border:1px solid var(--line);color:var(--ink);cursor:pointer;font-size:16px}
.drawer .d-cta{margin:10px 18px 4px;text-align:center}
.drawer .d-cta a{display:block;text-decoration:none;background:linear-gradient(135deg,var(--gold-bright),var(--gold));color:#4a2a10;font-weight:700;padding:13px;border-radius:13px}
.drawer .d-cta .d-sub{font-size:12px;opacity:.55;margin-top:7px}
.drawer .d-sec{font-size:11px;text-transform:uppercase;letter-spacing:.8px;opacity:.5;padding:16px 20px 6px}
.drawer .d-item{display:flex;align-items:center;gap:12px;margin:0 12px 6px;padding:12px 12px;border-radius:12px;background:var(--card2);border:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:14.5px}
.drawer .d-item:hover{border-color:var(--gold-line)}
.drawer .d-item .d-ic{width:32px;height:32px;border-radius:9px;background:var(--gold-soft);display:inline-flex;align-items:center;justify-content:center;flex:none}
.drawer .d-item .d-ic svg{stroke:var(--gold);stroke-width:2}
.drawer .d-item .d-arrow{margin-left:auto;opacity:.4}
.drawer .d-item.soon{opacity:.55;cursor:default}
.drawer .d-item.soon .tag{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;background:var(--gold-soft);color:var(--gold);padding:2px 8px;border-radius:99px}
.drawer .d-pan{margin:4px 12px;padding:12px;border-radius:12px;background:var(--card2);border:1px solid var(--gold-line)}
.drawer .d-pan .pstrip{justify-content:flex-start;margin:0;gap:6px}
.drawer .d-pan .pchip{font-size:11.5px;padding:5px 10px}
.drawer .d-theme{margin:auto 12px 16px;padding-top:14px;border-top:1px solid var(--line)}
.drawer .d-theme .d-sec{padding:0 8px 8px}
.drawer .d-theme .seg{display:flex;gap:6px}
.drawer .d-theme .seg button{flex:1;padding:10px 8px;border-radius:11px;background:var(--card2);border:1px solid var(--line);color:var(--ink-dim);cursor:pointer;font-size:13px;font-family:inherit}
.drawer .d-theme .seg button.active{background:var(--gold-soft);border-color:var(--gold-line);color:var(--ink);font-weight:600}