:root{
  --bg:#f4f7fb;
  --card:#ffffff;
  --ink:#0b1b33;
  --muted:#51627a;
  --line:#dde6f2;
  --shadow:0 10px 30px rgba(3,20,43,.08);

  --grey:#707b8a;
  --grey-bg:#eef2f7;

  --vv:#0f5f2b;
  --vv-bg:#0f8a3a;

  --vg-bg:#84cc16;

  --g-bg:#ffe88a;

  --bad-bg:#ff6b6b;

  --accent:#31a050;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.wrap{max-width:1180px;margin:0 auto;padding:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:12px;margin-top:10px}
.hero{margin-top:0}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.titleRow{display:flex;align-items:center;gap:10px}
.logo{width:35px;height:35px;max-width:35px;max-height:35px;object-fit:contain}
.titleText{display:flex;flex-direction:column;gap:2px}
.brand .title{font-size:18px;font-weight:600;line-height:1.2}
.brand .location{font-size:11px;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:0.5px}
.brand .subtitle{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.6}
.brand .subtitle .credits{font-size:11px;color:var(--muted);font-weight:500;margin-bottom:2px}
.brand .subtitle .company{font-size:12px;color:var(--coal);font-weight:700;margin-bottom:2px}
.brand .subtitle .experience{font-size:10px;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:0.3px}
.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.badge{font-size:11px;color:var(--muted);font-weight:500}
.btn{border:0;background:var(--accent);color:#fff;border-radius:999px;padding:6px 11px;font-weight:500;cursor:pointer;font-size:13px}
.btn:disabled{opacity:.5;cursor:not-allowed}

.btnRefresh{
  border:0;
  background:#22c55e;
  color:#fff;
  border-radius:6px;
  padding:4px 10px;
  font-weight:600;
  cursor:pointer;
  font-size:11px;
  box-shadow:0 2px 4px rgba(34,197,94,0.2);
  transition:all 0.2s;
}
.btnRefresh:hover{
  background:#16a34a;
  transform:translateY(-1px);
  box-shadow:0 4px 8px rgba(34,197,94,0.3);
}
.btnRefresh:disabled{opacity:.5;cursor:not-allowed}

.filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
@media(min-width:960px){.filters{grid-template-columns:2fr 1fr 1fr 1fr}}
.field label{display:block;font-size:11px;color:var(--muted);margin:0 0 4px 2px;font-weight:500}
.field input,.field select{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:12px;font-size:13px;background:#fff}

.bar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:10px}

.excludeFilters{
  margin-top:12px;
  padding:12px;
  background:#fff9e6;
  border:1px solid #ffc107;
  border-radius:12px;
}
.excludeSection{margin-bottom:10px}
.excludeSection:last-child{margin-bottom:0}
.checkLabel{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-right:12px;
  cursor:pointer;
  font-size:13px;
  user-select:none;
}
.checkLabel input[type="checkbox"]{cursor:pointer}
.checkLabel span{font-weight:500}
.sectionTitle{
  display:block;
  font-size:12px;
  font-weight:600;
  color:var(--ink);
  margin-bottom:8px;
}
.checkGroup{display:flex;flex-wrap:wrap;gap:8px}
.helpText{
  font-size:11px;
  color:var(--muted);
  margin-top:4px;
  margin-left:22px;
}

.taraFilters{
  margin-top:12px;
  padding:12px;
  background:#faf5ff;
  border:1px solid #7c3aed;
  border-radius:12px;
}
.taraSection{margin-bottom:0}

.karanaGuide{
  margin-top:10px;
  border:1px solid #ffc107;
  border-radius:12px;
  overflow:hidden;
}
.karanaGuideSummary{
  padding:10px 12px;
  background:#fff9e6;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  color:#f57c00;
  user-select:none;
  list-style:none;
}
.karanaGuideSummary::-webkit-details-marker{display:none}
.karanaGuideSummary::before{
  content:"▶";
  display:inline-block;
  margin-right:8px;
  transition:transform 0.2s;
}
details[open] .karanaGuideSummary::before{
  transform:rotate(90deg);
}
.karanaGuideSummary:hover{background:#fff6da}

.karanaGuideContent{
  padding:12px;
  background:#fefefe;
  border-top:1px solid #ffc107;
}

.karanaCompact{
  display:grid;
  gap:8px;
}
.karanaGroup{
  border-radius:8px;
  overflow:hidden;
}
.karanaGroup.good{background:#e8f5e9;border:1px solid #81c784}
.karanaGroup.warning{background:#fff6da;border:1px solid #ffc107}
.karanaGroup.bad{background:#ffebee;border:1px solid #ef5350}

.karanaGroupHead{
  padding:8px 10px;
  font-weight:700;
  font-size:12px;
  color:var(--coal);
  border-bottom:1px solid rgba(0,0,0,0.08);
}
.karanaGroup.good .karanaGroupHead{background:rgba(129,199,132,0.2)}
.karanaGroup.warning .karanaGroupHead{background:rgba(255,193,7,0.2)}
.karanaGroup.bad .karanaGroupHead{background:rgba(239,83,80,0.2)}

.karanaGroupBody{
  padding:8px 10px;
}
.karanaLine{
  font-size:11px;
  line-height:1.6;
  color:var(--ink);
  margin-bottom:4px;
}
.karanaLine:last-child{margin-bottom:0}
.karanaLine b{font-weight:700;color:var(--coal)}
.karanaNote{
  font-size:10px;
  color:var(--muted);
  margin-top:6px;
  font-style:italic;
}

.taraGuide{
  margin-top:10px;
  border:1px solid #e0e7ff;
  border-radius:12px;
  overflow:hidden;
}
.taraGuideSummary{
  padding:10px 12px;
  background:#f5f3ff;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  color:#5b21b6;
  user-select:none;
  list-style:none;
}
.taraGuideSummary::-webkit-details-marker{display:none}
.taraGuideSummary::before{
  content:"▶";
  display:inline-block;
  margin-right:8px;
  transition:transform 0.2s;
}
details[open] .taraGuideSummary::before{
  transform:rotate(90deg);
}
.taraGuideSummary:hover{background:#ede9fe}

.taraGuideContent{
  padding:12px;
  background:#fefefe;
  border-top:1px solid #e0e7ff;
}
.guideIntro{
  margin-bottom:8px;
  padding:6px 8px;
  background:#f8f9fa;
  border-radius:6px;
}

.taraCompact{
  display:grid;
  gap:6px;
}
.taraItem{
  border-radius:8px;
  padding:8px 10px;
  font-size:11px;
  line-height:1.5;
}
.taraItem.good{background:#e8f5e9}
.taraItem.bad{background:#ffebee}
.taraItem.neutral{background:#f5f5f5}

.taraHeader{
  font-weight:700;
  color:var(--coal);
  font-size:11px;
  margin-bottom:2px;
}
.taraEffect{
  font-weight:600;
  color:var(--ink);
  font-size:12px;
  margin-bottom:4px;
}
.taraStarsLine{
  color:var(--ink);
  font-size:11px;
  line-height:1.6;
}
.taraStarsLine .en{
  font-weight:600;
  color:var(--coal);
}
.taraStarsLine .te{
  font-weight:500;
  opacity:0.85;
}




dd, details { position:relative; }
.dd summary{list-style:none}
.dd summary::-webkit-details-marker{display:none}

.chip{
  display:inline-flex;align-items:center;gap:6px;
  border:1px solid var(--line);
  border-radius:10px;
  padding:6px 11px;
  font-weight:500;
  cursor:pointer;
  user-select:none;
  min-width:90px;
  justify-content:center;
  font-size:13px;
}
.dd .chip:after{content:"▾"; font-size:11px; opacity:.85}

.dd.all .chip{background:var(--grey-bg); color:var(--ink)}
.dd.vv  .chip{background:var(--vv-bg); color:#fff}
.dd.vg  .chip{background:var(--vg-bg); color:#fff}
.dd.g   .chip{background:var(--g-bg); color:var(--ink)}
.dd.bad .chip{background:var(--bad-bg); color:#fff}

.dd.active .chip{
  outline:3px solid rgba(11,27,51,.12);
  transform:translateY(-1px);
}

.menu{
  position:absolute;
  top:48px;
  left:0;
  width:min(360px, calc(100vw - 32px));
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:var(--shadow);
  padding:8px;
  z-index:9999;
  display:none;
}
.dd[open] > .menu{
  display:block;
}

/* Color-coded dropdown menus for each category */
.dd.vv[open] > .menu{
  display:block;
  border:2px solid #16a34a;
  background:#f0fdf4;
}
.dd.vv .menu .note{
  background:#16a34a;
  color:#fff;
  padding:8px 10px;
  margin:-8px -8px 8px -8px;
  border-radius:12px 12px 0 0;
  font-weight:600;
}

.dd.vg[open] > .menu{
  display:block;
  border:2px solid #84cc16;
  background:#f7fee7;
}
.dd.vg .menu .note{
  background:#84cc16;
  color:#fff;
  padding:8px 10px;
  margin:-8px -8px 8px -8px;
  border-radius:12px 12px 0 0;
  font-weight:600;
}

.dd.g[open] > .menu{
  display:block;
  border:2px solid #eab308;
  background:#fefce8;
}
.dd.g .menu .note{
  background:#eab308;
  color:#fff;
  padding:8px 10px;
  margin:-8px -8px 8px -8px;
  border-radius:12px 12px 0 0;
  font-weight:600;
}

.dd.bad[open] > .menu{
  display:block;
  border:2px solid #ef4444;
  background:#fef2f2;
}
.dd.bad .menu .note{
  background:#ef4444;
  color:#fff;
  padding:8px 10px;
  margin:-8px -8px 8px -8px;
  border-radius:12px 12px 0 0;
  font-weight:600;
}

.menu button{
  width:100%;
  text-align:left;
  border:0;
  background:#fff;
  padding:7px 10px;
  border-radius:10px;
  cursor:pointer;
  font-weight:500;
  color:var(--ink);
  font-size:13px;
}
.menu button:hover{background:#f6f9fd}
.menu .note{
  margin:0;
  text-align:left;
  padding:0 10px 10px 10px;
  color:var(--muted);
  font-size:12px;
}
.menu .sep{height:1px;background:#eef2f7;margin:6px 0}

.resultsTop{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.hint{font-size:12px;color:var(--muted)}
.note{margin:8px 0 0 0;text-align:center;color:var(--muted);font-size:12px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.summary{font-weight:600;color:var(--ink);padding:6px 2px;cursor:pointer}

.group{
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  margin:10px 0;
  background:#fff;
}
.groupHead{
  padding:10px 12px;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.groupHead .left{display:flex;align-items:center;gap:8px}
.groupHead .tag{font-size:11px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:500}

/* Color-coded result groups matching buttons and dropdowns */
.group.vv{
  border:2px solid #16a34a;
  background:#f0fdf4;
}
.group.vv .groupHead{
  background:#16a34a;
  color:#fff;
}
.group.vv .tag{
  color:#16a34a;
  background:#fff;
  border-color:#16a34a;
}

.group.vg{
  border:2px solid #84cc16;
  background:#f7fee7;
}
.group.vg .groupHead{
  background:#84cc16;
  color:#fff;
}
.group.vg .tag{
  color:#84cc16;
  background:#fff;
  border-color:#84cc16;
}

.group.g{
  border:2px solid #eab308;
  background:#fefce8;
}
.group.g .groupHead{
  background:#eab308;
  color:#fff;
}
.group.g .tag{
  color:#eab308;
  background:#fff;
  border-color:#eab308;
}

.group.bad{
  border:2px solid #ef4444;
  background:#fef2f2;
}
.group.bad .groupHead{
  background:#ef4444;
  color:#fff;
}
.group.bad .tag{
  color:#ef4444;
  background:#fff;
  border-color:#ef4444;
}

.groupBody{padding:8px 12px}
.rule{border:1px solid #eef2f7;border-radius:12px;padding:8px 10px;margin:8px 0;background:#fff}
.ruleTitle{font-weight:600;font-size:14px}
.ruleNote{font-size:12px;color:var(--muted);margin-top:3px}

.table{width:100%;border-collapse:separate;border-spacing:0;margin-top:8px;border:1px solid #eef2f7;border-radius:12px;overflow:hidden}
.table th{background:#fbfcfe;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.table th,.table td{padding:8px 10px;border-bottom:1px solid #eef2f7;font-size:13px;text-align:left}
.table tr:last-child td{border-bottom:0}
.table td b{font-weight:600}
.table .date{min-width:100px}
.table .ends{white-space:nowrap}

/* Vertical borders between column groups - VERY VISIBLE */
.table th:nth-child(2),
.table td:nth-child(2) {
  border-right: 4px solid #94a3b8 !important;
}
.table th:nth-child(4),
.table td:nth-child(4) {
  border-right: 4px solid #94a3b8 !important;
}
.table th:nth-child(6),
.table td:nth-child(6) {
  border-right: 4px solid #94a3b8 !important;
}

.table .yogam{
  font-weight:600;
  color:#7c3aed;
  background:#faf5ff;
  font-size:12px;
}
.table .consecutive-group{background:#f8fff9}
.table .consecutive-group td{padding:12px 10px;line-height:1.6}
.table .same-date-group{background:#faf5ff}
.table .same-date-group td{padding:12px 10px;line-height:1.6}
.badge-purple{background:#e9d5ff !important;color:#7c3aed !important;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:600}

@media(max-width:640px){
  .chip{
    min-width:75px;
    padding:5px 9px;
    font-size:12px;
  }
  .badge{font-size:10px}
  .bar{gap:5px}
  .logo{width:28px;height:28px}
  .brand .title{font-size:16px}
  .brand .location{font-size:10px}
  .brand .subtitle{font-size:10px}
  .brand .subtitle .credits{font-size:9px}
  .brand .subtitle .company{font-size:10px}
  .brand .subtitle .experience{font-size:9px}
  .card{padding:10px}
}

/* 🎨 PANCHA (5) ELEMENTS - 3D Color-Coded Cards */
.panchaIntro{
  margin:8px 0;
  padding:8px 14px;
  background:#FF9933;
  border-radius:10px;
  text-align:left;
  color:#fff;
  box-shadow:0 4px 12px rgba(255,153,51,0.3);
}
.panchaIntro h3{
  margin:0;
  font-size:15px;
  font-weight:600;
  letter-spacing:0.3px;
  line-height:1.3;
}
.panchaIntro p{
  margin:2px 0 0 0;
  font-size:11px;
  opacity:0.95;
  font-weight:400;
  line-height:1.3;
}

/* 📚 Panchang Guide (Educational Collapsible) */
.panchangGuide{
  margin:14px 0;
  border:2px solid #42a5f5;
  border-radius:12px;
  overflow:hidden;
  background:#e3f2fd;
}
.panchangGuideSummary{
  padding:12px 16px;
  background:#bbdefb;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  color:#0d47a1;
  user-select:none;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  transition:background 0.2s;
}
.panchangGuideSummary::-webkit-details-marker{display:none}
.panchangGuideSummary::after{
  content:"▶";
  font-size:14px;
  transition:transform 0.3s;
}
details[open].panchangGuide .panchangGuideSummary::after{
  transform:rotate(90deg);
}
.panchangGuideSummary:hover{
  background:#90caf9;
}

.panchangGuideContent{
  padding:16px;
  background:#fff;
  max-height:600px;
  overflow-y:auto;
}

/* Language Tabs */
.langTabs{
  display:flex;
  gap:8px;
  margin-bottom:16px;
  border-bottom:2px solid #e0e0e0;
  padding-bottom:8px;
}
.langTab{
  padding:8px 20px;
  background:#f5f5f5;
  border:none;
  border-radius:8px 8px 0 0;
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  transition:all 0.2s;
}
.langTab:hover{
  background:#e0e0e0;
}
.langTab.active{
  background:#42a5f5;
  color:#fff;
}

/* Guide Text Styling */
.guideText h4{
  margin:16px 0 8px 0;
  font-size:15px;
  font-weight:700;
  color:var(--coal);
}
.guideText h4:first-child{
  margin-top:0;
}
.guideText p{
  margin:8px 0;
  font-size:13px;
  line-height:1.6;
  color:var(--ink);
}
.guideText strong{
  color:var(--coal);
  font-weight:700;
}
.guideText ul,
.guideText ol{
  margin:8px 0;
  padding-left:24px;
}
.guideText li{
  margin:4px 0;
  font-size:12px;
  line-height:1.5;
  color:var(--ink);
}

/* Element Boxes */
.element{
  margin:12px 0;
  padding:10px 12px;
  background:#f8f9fa;
  border-left:4px solid #42a5f5;
  border-radius:6px;
}
.elementTitle{
  font-size:13px;
  font-weight:700;
  color:var(--coal);
  margin-bottom:6px;
}

/* Highlight Box */
.highlight{
  margin:12px 0;
  padding:10px 14px;
  background:#fff3e0;
  border-left:4px solid #ff9800;
  border-radius:6px;
}
.highlight div{
  margin:4px 0;
  font-size:12px;
  font-weight:600;
  color:#e65100;
}

/* Mobile Responsive */
@media(max-width:640px){
  .panchangGuide{
    margin:10px 0;
  }
  .panchangGuideSummary{
    padding:10px 12px;
    font-size:12px;
  }
  .panchangGuideContent{
    padding:12px;
    max-height:500px;
  }
  .langTab{
    padding:6px 14px;
    font-size:12px;
  }
  .guideText h4{
    font-size:14px;
  }
  .guideText p,
  .guideText li{
    font-size:12px;
  }
  .elementTitle{
    font-size:12px;
  }
}

/* 🔍 Filters Card (Between Karana and Yogam) */
.filtersCard{
  margin:14px 0;
  padding:14px;
  background:linear-gradient(135deg, #ffd54f 0%, #ffb300 100%);
  border-radius:14px;
  box-shadow:0 6px 16px rgba(255,179,0,0.3);
}
.filtersHeader{
  font-size:15px;
  font-weight:800;
  color:#4a2800;
  margin-bottom:12px;
  text-align:center;
  letter-spacing:0.5px;
}
.filtersCard .filters{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:12px;
  background:rgba(255,255,255,0.9);
  padding:14px;
  border-radius:10px;
}
@media(max-width:640px){
  .filtersCard{
    margin:10px 0;
    padding:12px;
  }
  .filtersHeader{
    font-size:13px;
  }
  .filtersCard .filters{
    grid-template-columns:1fr;
    gap:10px;
    padding:12px;
  }
}

/* 🕐 Rahu Kalam / Yamagandam / Gulika Kalam Reference */
.kalamReference{
  margin:14px 0;
  border:2px solid #3b82f6;
  border-radius:14px;
  overflow:hidden;
  background:#eff6ff;
}
.kalamSummary{
  padding:14px 16px;
  background:linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  cursor:pointer;
  font-weight:700;
  font-size:14px;
  color:#fff;
  user-select:none;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.kalamSummary::-webkit-details-marker{display:none}
.kalamSummary #downloadKalamPDF{
  background:#fff;
  color:#2563eb;
  border:none;
  padding:8px 16px;
  font-size:12px;
  font-weight:700;
  border-radius:8px;
  cursor:pointer;
  transition:all 0.2s;
  flex-shrink:0;
}
.kalamSummary #downloadKalamPDF:hover{
  background:#dbeafe;
  transform:scale(1.05);
}
.kalamContent{
  padding:16px;
  background:#fff;
}
.kalamIntro{
  margin-bottom:20px;
  padding:14px;
  background:#f0f9ff;
  border-left:4px solid #3b82f6;
  border-radius:8px;
}
.kalamIntro p{
  margin:8px 0;
  font-size:13px;
  line-height:1.5;
  color:var(--ink);
}
.kalamIntro strong{
  color:var(--coal);
  font-weight:700;
}
.kalamNote{
  margin:10px 0;
  font-size:13px;
  line-height:1.45;
  color:var(--muted);
}
.kalamTiny{
  font-size:11px;
  color:var(--muted);
  margin:6px 0 0 0;
}
.kalamSection{
  margin:20px 0;
}
.kalamTableTitle{
  margin:0 0 12px 0;
  font-size:16px;
  font-weight:700;
  color:var(--coal);
}
.kalamTable{
  width:100%;
  border-collapse:collapse;
  border:1px solid #cbd5e1;
  border-radius:8px;
  overflow:hidden;
}
.kalamTable th,
.kalamTable td{
  padding:10px 12px;
  border-bottom:1px solid #e5e7eb;
  font-size:13px;
  text-align:left;
}
.kalamTable th{
  background:#f1f5f9;
  font-weight:700;
  color:var(--coal);
}
.kalamTable tr:last-child td{
  border-bottom:0;
}
.kalamTable tbody tr:hover{
  background:#f8fafc;
}
@media(max-width:640px){
  .kalamSummary{
    font-size:13px;
    padding:12px;
  }
  .kalamSummary #downloadKalamPDF{
    font-size:11px;
    padding:6px 12px;
  }
  .kalamContent{
    padding:12px;
  }
  .kalamIntro{
    padding:12px;
  }
  .kalamIntro p{
    font-size:12px;
  }
  .kalamTableTitle{
    font-size:14px;
  }
  .kalamTable{
    font-size:12px;
  }
  .kalamTable th,
  .kalamTable td{
    padding:8px 10px;
  }
}

/* 3D Card Base */
.panchaCard{
  margin:10px 0;
  border-radius:12px;
  border:2px solid;
  overflow:hidden;
  width:100%;
  max-width:100%;
  box-shadow:
    0 4px 6px rgba(0,0,0,0.1),
    0 8px 16px rgba(0,0,0,0.08),
    inset 0 -2px 4px rgba(0,0,0,0.05);
  transform:translateY(0);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.panchaCard:hover{
  transform:translateY(-2px);
  box-shadow:
    0 6px 10px rgba(0,0,0,0.12),
    0 12px 24px rgba(0,0,0,0.1),
    inset 0 -2px 4px rgba(0,0,0,0.05);
}

/* Card Colors */
.panchaCard.card1{
  background:#FFE1FF;
  border-color:#FF9BFF;
}
.panchaCard.card2{
  background:#E1FFC8;
  border-color:#A0E884;
}
.panchaCard.card3{
  background:#E1FFFF;
  border-color:#84E8E8;
}
.panchaCard.card4{
  background:#FFFFE1;
  border-color:#E8E884;
}
.panchaCard.card5{
  background:#FFE1C8;
  border-color:#E8B584;
  overflow:visible !important;
}

/* Card Summary (Header) */
.panchaCardSummary{
  list-style:none;
  cursor:pointer;
  user-select:none;
  padding:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:rgba(255,255,255,0.5);
  border-bottom:2px solid rgba(0,0,0,0.08);
  transition:background 0.2s;
}
.panchaCardSummary::-webkit-details-marker{display:none}
.panchaCardSummary:hover{
  background:rgba(255,255,255,0.7);
}

/* Card Number Badge */
.cardNumber{
  width:38px;
  height:38px;
  border-radius:10px;
  display:grid;
  place-items:center;
  font-size:20px;
  font-weight:900;
  color:#fff;
  flex-shrink:0;
  box-shadow:
    0 4px 8px rgba(0,0,0,0.2),
    inset 0 1px 2px rgba(255,255,255,0.4);
}
.card1 .cardNumber{background:linear-gradient(135deg, #FF6BFF 0%, #C830C8 100%)}
.card2 .cardNumber{background:linear-gradient(135deg, #7ED957 0%, #4CAF50 100%)}
.card3 .cardNumber{background:linear-gradient(135deg, #3DC7C7 0%, #00ACC1 100%)}
.card4 .cardNumber{background:linear-gradient(135deg, #F4D03F 0%, #E6B800 100%)}
.card5 .cardNumber{background:linear-gradient(135deg, #FF9D6B 0%, #FF7043 100%)}

/* Card Title */
.cardTitle{
  flex-grow:1;
}
.cardTitleMain{
  font-size:14px;
  font-weight:500;
  color:var(--coal);
  line-height:1.3;
}
.cardTitleSub{
  font-size:10px;
  color:var(--muted);
  font-weight:600;
  margin-top:2px;
}

/* Card Chevron */
.cardChevron{
  font-size:18px;
  font-weight:900;
  color:var(--coal);
  transition:transform 0.3s;
  flex-shrink:0;
}
details[open].panchaCard .cardChevron{
  transform:rotate(180deg);
}

/* Card 5 needs overflow visible for dropdowns */
details[open].panchaCard.card5{
  overflow:visible !important;
}

/* Card Status Indicator */
.cardIndicator{
  display:inline-block;
  padding:3px 8px;
  border-radius:12px;
  font-size:10px;
  font-weight:700;
  margin-left:8px;
  margin-right:8px;
  flex-shrink:0;
  background:#e0e7ff;
  color:#3730a3;
  white-space:nowrap;
  transition:all 0.2s;
}
.cardIndicator:empty{
  display:none;
}
.cardIndicator.active{
  background:#dcfce7;
  color:#15803d;
}
.cardIndicator.warning{
  background:#fef3c7;
  color:#92400e;
}
.cardIndicator.inactive{
  background:#fee2e2;
  color:#991b1b;
}

/* Card Body */
.panchaCardBody{
  padding:12px;
  background:rgba(255,255,255,0.7);
}

/* Mobile Responsive */
@media(max-width:640px){
  .panchaCard{
    margin:8px 0;
  }
  .panchaCardSummary{
    padding:10px;
  }
  .cardNumber{
    width:32px;
    height:32px;
    font-size:16px;
  }
  .cardTitleMain{
    font-size:12px;
  }
  .cardTitleSub{
    font-size:9px;
  }
  .panchaCardBody{
    padding:10px;
  }
  .cardIndicator{
    font-size:9px;
    padding:2px 6px;
    margin:0 4px;
  }
  .panchaIntro h3{
    font-size:13px;
  }
  .panchaIntro p{
    font-size:10px;
  }
}

/* 📚 Panchang Information Guide */
.panchangGuide{
  margin:14px 0;
  border:2px solid #3498db;
  border-radius:14px;
  overflow:hidden;
  background:#e3f2fd;
  box-shadow:0 4px 12px rgba(52,152,219,0.2);
}
.panchangGuideSummary{
  padding:14px 16px;
  background:#2196f3;
  cursor:pointer;
  font-weight:700;
  font-size:14px;
  color:#fff;
  user-select:none;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.panchangGuideSummary::-webkit-details-marker{display:none}
.panchangGuideSummary::after{
  content:"▼";
  font-size:12px;
  transition:transform 0.3s;
}
details[open].panchangGuide .panchangGuideSummary::after{
  transform:rotate(180deg);
}
.panchangGuideSummary:hover{
  background:#1976d2;
}
.panchangGuideContent{
  padding:16px;
  background:#fff;
}

/* Language Tabs */
.langTabs{
  display:flex;
  gap:8px;
  margin-bottom:16px;
  border-bottom:2px solid #e0e0e0;
  padding-bottom:8px;
}
.langTab{
  padding:8px 20px;
  border:none;
  background:#f5f5f5;
  border-radius:8px 8px 0 0;
  cursor:pointer;
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  transition:all 0.2s;
}
.langTab:hover{
  background:#e0e0e0;
}
.langTab.active{
  background:#2196f3;
  color:#fff;
}

/* Guide Content */
.guideText{
  font-size:13px;
  line-height:1.7;
  color:var(--ink);
}
.guideText h4{
  font-size:16px;
  color:#1976d2;
  margin:0 0 12px 0;
  font-weight:700;
}
.guideText h5{
  font-size:14px;
  color:#0d47a1;
  margin:16px 0 10px 0;
  font-weight:700;
}
.guideText p{
  margin:8px 0;
}
.guideText ul, .guideText ol{
  margin:8px 0;
  padding-left:24px;
}
.guideText li{
  margin:4px 0;
}
.element{
  display:flex;
  gap:10px;
  margin:12px 0;
  padding:10px;
  background:#f8f9fa;
  border-left:4px solid #2196f3;
  border-radius:6px;
}
.elemNum{
  font-size:18px;
  flex-shrink:0;
}
.elemContent{
  flex-grow:1;
}
.elemContent strong{
  display:block;
  margin-bottom:6px;
  color:var(--coal);
  font-size:14px;
}
.highlight{
  background:#fff9c4;
  padding:10px;
  border-left:4px solid #fbc02d;
  border-radius:6px;
  font-weight:600;
  color:#f57f17;
}

/* Mobile Responsive */
@media(max-width:640px){
  .panchangGuide{
    margin:10px 0;
  }
  .panchangGuideSummary{
    padding:12px;
    font-size:12px;
  }
  .panchangGuideContent{
    padding:12px;
  }
  .langTab{
    padding:6px 12px;
    font-size:11px;
  }
  .guideText{
    font-size:12px;
  }
  .guideText h4{
    font-size:14px;
  }
  .guideText h5{
    font-size:13px;
  }
  .elemNum{
    font-size:16px;
  }
  .elemContent strong{
    font-size:13px;
  }
}

/* 📱 Mobile: Fix text overflow in results table */
@media(max-width:640px){
  .table{
    font-size:12px;
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
  .table thead,
  .table tbody,
  .table tr{
    display:table;
    width:100%;
    table-layout:fixed;
  }
  .table th,
  .table td{
    font-size:11px;
    padding:6px 4px;
    word-wrap:break-word;
    word-break:break-word;
    overflow-wrap:break-word;
    white-space:normal !important;
    hyphens:auto;
  }
  .table .date{
    white-space:normal !important;
    word-break:break-word;
  }
  .table .consecutive-group td,
  .table .same-date-group td{
    white-space:normal !important;
    word-wrap:break-word;
    line-height:1.4;
  }
  .groupBody{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
}

/* 🏢 Site Footer */
.siteFooter{
  margin-top:14px;
  padding:10px 16px;
  background:linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
  border-top:2px solid #3b82f6;
  text-align:center;
}
.footerContent{
  max-width:900px;
  margin:0 auto;
}
.footerText{
  margin:2px 0;
  font-size:11px;
  color:#e0e7ff;
  line-height:1.4;
}
.footerText:first-child{
  font-weight:600;
  font-size:11px;
  color:#fff;
}
.footerABN{
  display:inline-block;
  padding:2px 10px;
  background:rgba(255,255,255,0.2);
  border-radius:4px;
  margin-left:8px;
  font-size:13px;
  color:#fff;
}
@media(max-width:640px){
  .siteFooter{
    padding:8px 12px;
    margin-top:14px;
  }
  .footerText{
    font-size:10px;
  }
  .footerText:first-child{
    font-size:10px;
  }
  .footerABN{
    display:block;
    margin:3px auto 0;
    width:fit-content;
  }
}

/* 📊 Yogam Rules Card (3D Style) */
.yogamRulesCard{
  margin:20px 0;
  border-radius:16px;
  border:2px solid #8b5cf6;
  overflow:hidden;
  background:#fff;
  box-shadow:
    0 4px 6px rgba(139,92,246,0.1),
    0 8px 16px rgba(139,92,246,0.08),
    inset 0 -2px 4px rgba(0,0,0,0.03);
  transform:translateY(0);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.yogamRulesCard:hover{
  transform:translateY(-3px);
  box-shadow:
    0 6px 12px rgba(139,92,246,0.15),
    0 12px 24px rgba(139,92,246,0.1),
    inset 0 -2px 4px rgba(0,0,0,0.03);
}
.yogamRulesSummary{
  padding:16px 20px;
  background:linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
  cursor:pointer;
  font-weight:700;
  font-size:15px;
  color:#fff;
  user-select:none;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  transition:background 0.2s;
}
.yogamRulesSummary::-webkit-details-marker{display:none}
.yogamRulesSummary:hover{
  background:linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
}
.yogamRulesContent{
  padding:20px;
  background:#faf5ff;
}
.yogamNote{
  margin:0 0 16px 0;
  font-size:13px;
  line-height:1.5;
  color:var(--muted);
  padding:12px;
  background:#fff;
  border-left:4px solid #8b5cf6;
  border-radius:6px;
}
.yogamNote .mono{
  font-family:monospace;
  background:#f3e8ff;
  padding:2px 6px;
  border-radius:4px;
  font-weight:600;
  color:#6d28d9;
}
@media(max-width:640px){
  .yogamRulesCard{
    margin:14px 0;
  }
  .yogamRulesSummary{
    font-size:13px;
    padding:12px 14px;
  }
  .yogamRulesContent{
    padding:14px;
  }
  .yogamNote{
    font-size:12px;
    padding:10px;
  }
}

/* Nested Yogam Rules inside Card 5 */
.yogamRulesNested{
  border:2px solid #8b5cf6;
  border-radius:12px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 2px 4px rgba(139,92,246,0.1);
}
.yogamRulesNestedSummary{
  padding:12px 16px;
  background:linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
  cursor:pointer;
  font-weight:700;
  font-size:13px;
  color:#fff;
  user-select:none;
  list-style:none;
  transition:background 0.2s;
}
.yogamRulesNestedSummary::-webkit-details-marker{display:none}
.yogamRulesNestedSummary:hover{
  background:linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
}
.yogamRulesNestedContent{
  padding:16px;
  background:#faf5ff;
}
@media(max-width:640px){
  .yogamRulesNested{
    margin:14px 0;
  }
  .yogamRulesNestedSummary{
    font-size:12px;
    padding:10px 12px;
  }
  .yogamRulesNestedContent{
    padding:12px;
  }
}
  .yogamNote{
    font-size:12px;
    padding:10px;
  }
}

/* 🕐 Rahu Kalam Card (Enhanced 3D Style) */
.kalamReferenceCard{
  margin:20px 0;
  border-radius:16px;
  border:2px solid #f59e0b;
  overflow:hidden;
  background:#fff;
  box-shadow:
    0 4px 6px rgba(245,158,11,0.1),
    0 8px 16px rgba(245,158,11,0.08),
    inset 0 -2px 4px rgba(0,0,0,0.03);
  transform:translateY(0);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.kalamReferenceCard:hover{
  transform:translateY(-3px);
  box-shadow:
    0 6px 12px rgba(245,158,11,0.15),
    0 12px 24px rgba(245,158,11,0.1),
    inset 0 -2px 4px rgba(0,0,0,0.03);
}
.kalamCardSummary{
  padding:16px 20px;
  background:linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  cursor:pointer;
  font-weight:700;
  font-size:15px;
  color:#fff;
  user-select:none;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  transition:background 0.2s;
}
.kalamCardSummary::-webkit-details-marker{display:none}
.kalamCardSummary:hover{
  background:linear-gradient(135deg, #d97706 0%, #b45309 100%);
}
.kalamCardSummary .btnDownload{
  background:#fff;
  color:#d97706;
  border:none;
  padding:8px 16px;
  font-size:12px;
  font-weight:700;
  border-radius:8px;
  cursor:pointer;
  transition:all 0.2s;
  flex-shrink:0;
}
.kalamCardSummary .btnDownload:hover{
  background:#fef3c7;
  transform:scale(1.05);
}
@media(max-width:640px){
  .kalamReferenceCard{
    margin:14px 0;
  }
  .kalamCardSummary{
    font-size:13px;
    padding:12px 14px;
  }
  .kalamCardSummary .btnDownload{
    font-size:11px;
    padding:6px 12px;
  }
}

/* ⚠️ DISCLAIMER CARD (Bright Yellow, 3D Effect) */
.disclaimerCard{
  margin:20px 0;
  border-radius:16px;
  border:4px solid #ff0000;
  outline:3px solid #ffff00;
  outline-offset:-7px;
  overflow:hidden;
  background:#fff;
  box-shadow:
    0 6px 12px rgba(255,0,0,0.3),
    0 12px 24px rgba(255,255,0,0.15),
    inset 0 -3px 6px rgba(0,0,0,0.05);
  transform:translateY(0);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
}
.disclaimerCard:hover{
  transform:translateY(-4px);
  box-shadow:
    0 8px 16px rgba(255,0,0,0.4),
    0 16px 32px rgba(255,255,0,0.2),
    inset 0 -3px 6px rgba(0,0,0,0.05);
}
.disclaimerCardSummary{
  padding:16px 20px;
  background:linear-gradient(135deg, #ffff00 0%, #ffed4e 100%);
  cursor:pointer;
  font-weight:700;
  font-size:16px;
  color:#000;
  user-select:none;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  transition:background 0.2s;
  text-shadow:0 1px 2px rgba(255,255,255,0.5);
}
.disclaimerCardSummary::-webkit-details-marker{display:none}
.disclaimerCardSummary:hover{
  background:linear-gradient(135deg, #ffed4e 0%, #ffd700 100%);
}
.disclaimerContent{
  background:#fff;
  padding:20px;
}
.disclaimerSection{
  margin-bottom:24px;
}
.disclaimerSection:last-child{
  margin-bottom:0;
}
.disclaimerTitle{
  font-size:16px;
  font-weight:700;
  color:#000;
  margin:0 0 12px 0;
  padding-bottom:8px;
  border-bottom:2px solid #ffff00;
}
.disclaimerText{
  font-size:13px;
  line-height:1.7;
  color:#333;
  margin:0 0 12px 0;
  text-align:justify;
}
.disclaimerText:last-child{
  margin-bottom:0;
}
@media(max-width:640px){
  .disclaimerCard{
    margin:14px 0;
  }
  .disclaimerCardSummary{
    font-size:14px;
    padding:12px 14px;
  }
  .disclaimerContent{
    padding:14px;
  }
  .disclaimerTitle{
    font-size:14px;
  }
  .disclaimerText{
    font-size:12px;
  }
}

/* Old styles - keep for nested guides */
.excludeFilters{