:root, [data-theme="light"] {
  --bg:#f3eee3; --card:#fffdf7; --ink:#1f1a14; --muted:#6b5f4d; --accent:#2f5da8; --accent-ink:#fff; --line:#d8ccb4;
  --head:#e4ecf8; --head-ink:#20407a; --alt:#f6f0e2; --lag:#e3e0f5; --body:#8a1c1c; --num:#1d3f8f;
  --ch-bg:#ececec; --ch-line:#1a1a1a; --ch-sn:#2e7d32; --ch-pl:#b3122a; --ch-as:#c2187a; --ch-up:#3b3b3b; --ch-ar:#3d55b4; --ch-sl:#7a4fa3;
  --av-hl:#cfd8ea; --ok:#2e7d32; --bad:#b3122a; --warn-bg:#fff4dc; --warn-line:#e0b35a; --warn-ink:#6a4a00;
  --input:#fff; --top:#e9e1d0;
  font-family: "Segoe UI", Tahoma, system-ui, -apple-system, sans-serif;
  color-scheme: light;
}
[data-theme="dark"] {
  --bg:#17110d; --card:#231912; --ink:#f1e5d3; --muted:#c1a887; --accent:#d4a017; --accent-ink:#1a120e; --line:#4a3525;
  --head:#2f2218; --head-ink:#e7c98f; --alt:#2a1e15; --lag:#33294a; --body:#f0a58a; --num:#9cc0ff;
  --ch-bg:#1f1610; --ch-line:#d2b78e; --ch-sn:#8fd18f; --ch-pl:#ff8a80; --ch-as:#f48fb1; --ch-up:#d7ccc8; --ch-ar:#90a4ff; --ch-sl:#ce93d8;
  --av-hl:#3b3350; --ok:#8fd18f; --bad:#ff8a80; --warn-bg:#3a2410; --warn-line:#8a5a20; --warn-ink:#e8b87a;
  --input:#1b130e; --top:#100b08;
  color-scheme: dark;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); }
.top { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.55rem 1rem; background:var(--top); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; }
.top h1 { font-size:1.05rem; margin:0; } .top small { color:var(--muted); font-weight:400; font-size:.78rem; }
.icon { background:var(--card); border:1px solid var(--line); color:var(--ink); font-size:1.15rem; line-height:1; padding:.35rem .55rem; border-radius:6px; cursor:pointer; }
.tabs { display:flex; gap:2px; padding:.35rem .6rem 0; background:var(--top); border-bottom:1px solid var(--line); overflow-x:auto; scrollbar-width:none; position:sticky; top:2.7rem; z-index:4; }
.tabs a { color:var(--ink); text-decoration:none; padding:.4rem .8rem; border:1px solid var(--line); border-bottom:none; border-radius:6px 6px 0 0; background:var(--bg); white-space:nowrap; font-size:.9rem; cursor:pointer; }
.tabs a.on { background:var(--card); font-weight:600; color:var(--accent); position:relative; top:1px; }
main { padding:.7rem; max-width:1180px; margin:0 auto; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:.7rem .9rem; margin-bottom:.7rem; }
.card h2 { font-size:1.1rem; margin:.1rem 0 .5rem; } .card h3 { font-size:.98rem; margin:.3rem 0 .45rem; color:var(--head-ink); }
.hidden { display:none !important; }
.birth-sum { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem; font-size:.9rem; }
.grid2 { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:.5rem; margin-top:.6rem; }
label { display:flex; flex-direction:column; gap:.2rem; font-size:.82rem; color:var(--muted); }
label.inline { flex-direction:row; align-items:center; gap:.5rem; margin-bottom:.5rem; }
label.chk { flex-direction:row; align-items:center; gap:.35rem; color:var(--ink); }
input, select, button { font:inherit; padding:.4rem .5rem; border-radius:6px; border:1px solid var(--line); background:var(--input); color:var(--ink); }
button { cursor:pointer; }
button.primary { background:var(--accent); color:var(--accent-ink); border:none; font-weight:600; }
.row { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:.6rem; } .row.small { font-size:.85rem; }
.hint { color:var(--muted); font-size:.8rem; }
.note { color:var(--muted); font-size:.8rem; border-top:1px dashed var(--line); padding-top:.5rem; margin:.6rem 0 0; }
.warn { color:var(--warn-ink); background:var(--warn-bg); border:1px solid var(--warn-line); padding:.5rem .75rem; border-radius:8px; font-size:.85rem; }
.table-wrap { overflow:auto; -webkit-overflow-scrolling:touch; }
table.lon { width:100%; border-collapse:collapse; font-size:.86rem; }
table.lon th { background:var(--head); color:var(--head-ink); font-weight:500; text-align:left; padding:.3rem .45rem; border-bottom:1px solid var(--line); white-space:nowrap; }
table.lon td { padding:.24rem .45rem; border-bottom:1px solid var(--line); white-space:nowrap; }
table.lon tbody tr:nth-child(even) td { background:var(--alt); }
table.lon tr.lag td { background:var(--lag) !important; }
table.lon td.b { color:var(--body); } table.lon td.num { color:var(--num); font-variant-numeric:tabular-nums; }
table.lon tr.g-special td.b { color:var(--ch-sl); } table.lon tr.g-upa td.b { color:var(--ch-up); }
td.ok { color:var(--ok) !important; font-weight:600; } td.bad { color:var(--bad) !important; font-weight:600; }
/* North Indian chart */
.ni-wrap { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.9rem; }
@media (max-width:720px){ .ni-wrap { grid-template-columns:1fr; } }
.ni-fig { margin:0; }
.ni-fig figcaption { display:flex; justify-content:space-between; font-size:.95rem; color:var(--head-ink); margin-bottom:.2rem; padding:0 .15rem; }
.ni-sub { font-weight:600; }
.ni-svg { width:100%; height:auto; display:block; background:var(--ch-bg); max-width:560px; }
.ni-frame { fill:none; stroke:var(--ch-line); stroke-width:3; } .ni-frame2 { fill:none; stroke:var(--ch-line); stroke-width:1; }
.ni-line { fill:none; stroke:var(--ch-line); stroke-width:1.1; }
.ni-sn { fill:var(--ch-sn); font-size:12px; }
.ni-pl { fill:var(--ch-pl); font-family: Arial, "Segoe UI", sans-serif; }
.ni-pl.as { fill:var(--ch-as); } .ni-pl.up { fill:var(--ch-up); }
.ni-mi { font-family: Arial, sans-serif; } .ni-mi.ar { fill:var(--ch-ar); } .ni-mi.sl { fill:var(--ch-sl); }
/* ashtakavarga */
.av-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:.6rem; margin-bottom:.7rem; }
@media (max-width:420px){ .av-grid { grid-template-columns:repeat(3, 1fr); gap:.35rem; } }
.av-fig { margin:0; } .av-fig figcaption { text-align:center; color:var(--ch-pl); font-size:.85rem; }
.av-num { fill:var(--ink); font-size:44px; } .av-hl { fill:var(--av-hl); stroke:var(--ch-line); stroke-width:1.5; }
.av-tab td, .av-tab th { text-align:center !important; }
/* key info */
.kv { display:grid; grid-template-columns:max-content 1fr; gap:.2rem .9rem; margin:0; font-size:.88rem; }
.kv dt { color:#2e6b4f; } [data-theme="dark"] .kv dt { color:#8fd1b0; }
.kv dd { margin:0; color:var(--bad); }
/* dasha */
ul.dasha, ul.dasha ul { list-style:none; margin:0; padding-left:0; }
ul.dasha ul { padding-left:1.1rem; border-left:1px dashed var(--line); margin-left:.4rem; }
ul.dasha summary, ul.dasha .leaf { display:flex; gap:.8rem; padding:.22rem .3rem; cursor:pointer; border-bottom:1px solid var(--line); font-variant-numeric:tabular-nums; }
ul.dasha .leaf { cursor:default; }
ul.dasha .dl { min-width:6.5rem; color:var(--body); font-weight:600; } ul.dasha .dd { color:var(--num); font-size:.88rem; }
ul.dasha li.cur > details > summary, ul.dasha li.cur > .leaf { background:var(--lag); }
.foot { text-align:center; color:var(--muted); font-size:.75rem; padding:1rem; }
.err { color:var(--bad); white-space:pre-wrap; } .loading { color:var(--muted); }
@media (max-width:480px){ main { padding:.45rem; } .card { padding:.55rem .6rem; } table.lon { font-size:.8rem; } .top h1 small { display:none; } }