html{font-size:16px;}
body{font-family:'Inter',sans-serif;background-color:#131313;color:#e5e2e1;font-size:16px;line-height:1.6;}
.font-serif{font-family:'Noto Serif',serif;}
.material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;vertical-align:middle;}
.celestial-grid{background-image:radial-gradient(#5b403a 1px,transparent 1px);background-size:40px 40px;opacity:0.08;}

/* ── LOADING ── */
#loading{display:none;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:20px;}
#loading.show{display:flex}
.loader-ring{width:56px;height:56px;position:relative;}
.loader-ring::before,.loader-ring::after{content:'';position:absolute;inset:0;border-radius:50%;}
.loader-ring::before{border:2px solid rgba(255,87,51,0.1);}
.loader-ring::after{border:2px solid transparent;border-top-color:#FF5733;border-right-color:rgba(255,215,0,0.5);animation:spin 0.9s cubic-bezier(0.4,0,0.2,1) infinite;}
.loader-glyph{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:'Noto Serif',serif;font-size:20px;color:#e9c400;}
@keyframes spin{to{transform:rotate(360deg)}}
.loader-text{font-size:14px;color:#8a8490;letter-spacing:1px;animation:pulse 1.5s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:0.5}50%{opacity:1}}

/* ── INPUT SCREEN ── */
#input-screen,#num-input,#cz-input,#pan-input{display:flex;flex-direction:column;gap:1.5rem}
#input-screen.hidden-screen,#num-input.hidden-screen,#cz-input.hidden-screen,#pan-input.hidden-screen{display:none}

/* ── RESULTS ── */
#results,#num-results,#cz-results,#pan-results{display:none}
#results.show,#num-results.show,#cz-results.show,#pan-results.show{display:block}

/* ── CONTENT PANELS ── */
.content-panel{display:none}
.content-panel.active{display:block}

/* ── NAV ACTIVE STATES ── */
.nav-tab-active{color:#FF5733 !important;border-bottom:2px solid #FF5733;}
.sidenav-active{color:#FF5733 !important;background:#2a2a2a;border-right:4px solid #FF5733;}
.bottom-nav-active{background:#FF5733 !important;color:white !important;border-radius:9999px;padding:0.5rem;box-shadow:0 0 15px rgba(255,87,51,0.5);}

/* ── PLANET ROW HOVER ── */
.planet-tr:hover{background:rgba(255,87,51,0.04);}
.planet-tooltip{
  position:absolute;left:16px;top:100%;z-index:60;
  pointer-events:none;opacity:0;transition:opacity 0.2s;
  background:#2a2a2a;border:1px solid rgba(255,87,51,0.25);border-radius:10px;
  padding:12px 16px;min-width:280px;max-width:380px;width:max-content;
  font-size:13px;line-height:1.7;color:#e5e2e1;
  box-shadow:0 8px 30px rgba(0,0,0,0.5);white-space:normal;
}
.planet-tooltip.show{opacity:1;pointer-events:auto;}
.planet-tooltip b{color:#FF5733;}
html.light .planet-tooltip{background:#ffffff;color:#1c1b1b;border-color:rgba(255,87,51,0.3);box-shadow:0 8px 30px rgba(0,0,0,0.15);}

/* ── CHART TABS ── */
.chart-tab-btn{flex-shrink:0;padding:6px 14px;border-radius:9999px;font-size:12px;font-weight:600;letter-spacing:0.5px;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.04);color:#8a8490;cursor:pointer;transition:all 0.2s;white-space:nowrap;}
.chart-tab-btn:hover{border-color:rgba(255,87,51,0.3);color:#e5e2e1;}
.chart-tab-btn.active{background:rgba(255,87,51,0.12);border-color:rgba(255,87,51,0.4);color:#FF5733;box-shadow:0 0 12px rgba(255,87,51,0.12);}

/* ── DASHA TIMELINE ── */
.dasha-node-active{background:#FF5733;box-shadow:0 0 15px rgba(255,87,51,0.6);}

/* ── FADE UP ── */
.fade-up{animation:fadeUp 0.4s ease forwards;}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* ── GLOW EFFECTS ── */
.glow-orange{box-shadow:0 0 20px rgba(255,87,51,0.3);}
.glow-gold{box-shadow:0 0 20px rgba(255,215,0,0.25);}
.text-glow-orange{text-shadow:0 0 12px rgba(255,87,51,0.5);}

/* Input styles */
.jp-input{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:0.5rem;padding:10px 14px;font-size:14px;color:#e5e2e1;font-family:'Inter',sans-serif;outline:none;width:100%;transition:border-color 0.2s,box-shadow 0.2s;}
.jp-input::placeholder{color:#000000;opacity:0.55}
.jp-input::-webkit-input-placeholder{color:#000000;opacity:0.55}
.jp-input::-moz-placeholder{color:#000000;opacity:0.55}
.jp-input:-ms-input-placeholder{color:#000000;opacity:0.55}
.jp-input:focus{border-color:rgba(255,87,51,0.5);box-shadow:0 0 0 3px rgba(255,87,51,0.08);}
.jp-input option{background:#1c1b1b;color:#e5e2e1}

/* Yoga cards */
.yoga-present{border-left:3px solid #e9c400;background:rgba(233,196,0,0.04);}
.yoga-absent{opacity:0.45;}

/* Info sub-tabs */
.info-stab{flex:1;padding:9px;text-align:center;border-radius:0.5rem;font-size:13px;font-weight:500;border:1px solid rgba(255,255,255,0.07);background:rgba(255,255,255,0.04);color:#8a8490;cursor:pointer;transition:all 0.2s;}
.info-stab.active{background:rgba(255,87,51,0.1);border-color:rgba(255,87,51,0.3);color:#FF5733;}

/* Planet pill */
.p-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 10px;border-radius:8px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);}

/* Sade sati */
.sade-active{background:rgba(220,60,40,0.07);border:1px solid rgba(220,60,40,0.22);}
.sade-clear{background:rgba(50,180,90,0.06);border:1px solid rgba(50,180,90,0.18);}

/* Scrollbar hide */
.no-scrollbar{scrollbar-width:none;}
.no-scrollbar::-webkit-scrollbar{display:none;}

/* Dasha current row */
.dasha-current{background:rgba(255,87,51,0.06);border-color:rgba(255,87,51,0.25)!important;}
.dasha-chevron{transition:transform 0.2s ease;}
.dasha-chevron.rotate-90{transform:rotate(90deg);}

/* Varga card states */
.varga-card{cursor:pointer;transition:all 0.25s;}
.varga-card:hover{transform:translateY(-2px);}
.varga-card.focused{border-color:rgba(255,87,51,0.45)!important;background:#201f1f!important;}

/* ── LOSHU GRID ── */
.loshu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;width:280px;max-width:100%;padding:6px;border:2px solid rgba(255,87,51,0.25);border-radius:18px;background:rgba(255,87,51,0.02);}
.loshu-cell{min-height:70px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-radius:14px;border:2px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);transition:all 0.3s;position:relative;padding:6px 4px;}
.loshu-cell.present{background:rgba(255,87,51,0.06);border-color:rgba(255,87,51,0.25);}
.loshu-cell.repeated{background:rgba(233,196,0,0.06);border-color:rgba(233,196,0,0.3);}
.loshu-cell.missing{background:rgba(255,255,255,0.015);border-color:rgba(255,255,255,0.04);}
.loshu-dots-wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:3px;}
.loshu-dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Noto Serif',serif;font-size:13px;font-weight:700;flex-shrink:0;}
.loshu-dot-sm{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Noto Serif',serif;font-size:11px;font-weight:700;flex-shrink:0;}
.loshu-cell.present .loshu-dot,.loshu-cell.present .loshu-dot-sm{color:#fff;background:#FF5733;box-shadow:0 2px 8px rgba(255,87,51,0.35);}
.loshu-cell.repeated .loshu-dot,.loshu-cell.repeated .loshu-dot-sm{color:#1c1b1b;background:#e9c400;box-shadow:0 2px 8px rgba(233,196,0,0.35);}
.loshu-plane-tag{font-size:12px;font-weight:700;letter-spacing:0.05em;padding:2px 6px;border-radius:4px;}
.loshu-cell.missing .loshu-dot,.loshu-cell.missing .loshu-dot-sm{background:none;box-shadow:none;}

@media(min-width:640px){
  .loshu-grid{width:320px;gap:6px;padding:8px;border-radius:20px;}
  .loshu-dot{width:34px;height:34px;font-size:14px;}
  .loshu-dot-sm{width:24px;height:24px;font-size:12px;}
  .loshu-cell{min-height:80px;}
}

/* ── LIGHT MODE ── */
html.light body{background-color:#f5f3f0;color:#1c1b1b;}
html.light .celestial-grid{opacity:0.03;}
html.light .bg-surface-container{background:#ffffff;}
html.light .bg-surface-container-low{background:#f0edeb;}
html.light .bg-surface-container-high{background:#e8e5e3;}
html.light .bg-surface-container-highest{background:#ddd9d7;}
html.light .bg-surface-container-lowest{background:#ffffff;}
html.light .bg-\[\\#131313\]\/80{background:rgba(245,243,240,0.92)!important;}
html.light .text-on-surface{color:#1c1b1b;}
html.light .text-on-surface-variant{color:#5b403a;}
html.light .border-white\/5{border-color:rgba(0,0,0,0.08);}
html.light .border-outline-variant\/5,html.light .border-outline-variant\/10,html.light .border-outline-variant\/20{border-color:rgba(91,64,58,0.15);}
html.light .shadow-black\/40{box-shadow:0 4px 20px rgba(0,0,0,0.08);}
html.light .jp-input{background:rgba(0,0,0,0.04);border-color:rgba(0,0,0,0.12);color:#1c1b1b;}
html.light .jp-input::placeholder{color:#000000;opacity:0.6}
html.light .jp-input::-webkit-input-placeholder{color:#000000;opacity:0.6}
html.light .jp-input::-moz-placeholder{color:#000000;opacity:0.6}
html.light .planet-tr:hover{background:rgba(255,87,51,0.06);}
html.light .sidenav-active{background:#f0edeb;}
html.light .dasha-current{background:rgba(255,87,51,0.08);}
html.light .yoga-present{background:rgba(233,196,0,0.06);}
html.light .yoga-absent{opacity:0.5;}
html.light .aspect-tip-row td{background:rgba(255,87,51,0.06)!important;}
html.light .loshu-grid{border-color:rgba(255,87,51,0.2);background:rgba(255,87,51,0.02);}
html.light .loshu-cell{background:#fff;border-color:rgba(0,0,0,0.08);}
html.light .loshu-cell.present{background:#fff;border-color:rgba(255,87,51,0.3);}
html.light .loshu-cell.repeated{background:rgba(233,196,0,0.04);border-color:rgba(233,196,0,0.3);}
html.light .loshu-cell.missing{background:rgba(0,0,0,0.02);border-color:rgba(0,0,0,0.05);}

/* Auth page styles */
.auth-card{max-width:420px;margin:0 auto;}