/* The Jyotish Project Study Space v1.92: the expanded Knowledge Base (topic contents, reader, figures, home). */

/* ---------- home ---------- */
.kb9-home{display:grid;gap:6px}
.kb9-hero{display:flex;flex-wrap:wrap;align-items:center;gap:10px 30px;padding:20px 22px;margin:4px 0 14px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--gold) 12%,var(--paper)),var(--paper));color:var(--ink)}
.kb9-hero>div:not(.kb9-heroact){display:grid;line-height:1.1}
.kb9-hero b{font-size:1.9rem;font-weight:600;color:var(--wine);font-variant-numeric:tabular-nums}
.kb9-hero span{font:600 11px system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.kb9-heroact{margin-left:auto;display:flex;flex-wrap:wrap;gap:8px}
.kb9-gdesc{margin:-4px 0 12px;color:var(--muted);font-size:.95rem}
.kb9-tcard{position:relative}
.kb9-tcard .kb9-count{display:block;margin-top:8px}
.kb9-bar{display:block;height:3px;border-radius:3px;background:var(--line);margin-top:6px;overflow:hidden}
.kb9-bar i{display:block;height:100%;background:var(--gold)}
.kb9-hit span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- topic contents ---------- */
.kb9-contents{padding:24px 26px}
.kb9-chead{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:flex-end;justify-content:space-between;padding:6px 0 18px;border-bottom:1px solid var(--line);margin-bottom:16px}
.kb9-chead>div:first-child{flex:1 1 420px;min-width:0}
.kb9-chead h2{margin:4px 0 6px;font-size:2.1rem;line-height:1.1;color:var(--ink)}
.kb9-chead p{margin:0 0 12px;color:var(--muted);max-width:68ch;line-height:1.55}
.kb9-stats{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.92rem;color:var(--muted)}
.kb9-stats b{color:var(--ink);font-variant-numeric:tabular-nums}
.kb9-progress{height:5px;border-radius:5px;background:var(--line);margin-top:10px;max-width:420px;overflow:hidden}
.kb9-progress i{display:block;height:100%;background:var(--gold);border-radius:5px}
.kb9-cact{display:flex;flex-wrap:wrap;gap:8px}
.kb9-filter{display:grid;gap:5px;margin:0 0 6px;max-width:460px}
.kb9-filter span{font:600 11px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.kb9-filter input{padding:10px 12px;border-radius:10px;border:1px solid var(--line);font:inherit;background:var(--paper);color:var(--ink)}
.kb9-part{margin-top:18px}
.kb9-part h3{display:flex;align-items:baseline;gap:10px;margin:0 0 10px;font-size:1.25rem;color:var(--ink)}
.kb9-part h3 span{font:600 11px system-ui,sans-serif;letter-spacing:.08em;color:var(--gold)}
.kb9-part h3 small{margin-left:auto;font:600 11px system-ui,sans-serif;color:var(--muted)}
.kb9-cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.kb9-ccard{display:grid;gap:4px;align-content:start;text-align:left;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);font:inherit;cursor:pointer;transition:border-color .15s,transform .15s,box-shadow .15s}
.kb9-ccard:hover,.kb9-ccard:focus-visible{border-color:var(--gold);transform:translateY(-1px);box-shadow:0 6px 16px rgba(0,0,0,.06)}
.kb9-ccard b{font-size:1rem;line-height:1.3}
.kb9-ccard span{font-size:.88rem;color:var(--muted);line-height:1.45}
.kb9-ccard small{display:flex;gap:8px;font:600 10.5px system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.kb9-ccard small em{font-style:normal;color:var(--olive,var(--wine))}
.kb9-ccard.read{border-left:3px solid var(--gold)}
.kb9-wait{padding:30px 6px;color:var(--muted);font-style:italic}

/* ---------- reader ---------- */
.kb9-jump{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:6px 0 18px}
.kb9-jump select{max-width:min(520px,72vw);padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit}
.kb9-pos{font:600 11px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.kb9-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kb9-mode{display:flex;gap:4px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.kb9-mode button{flex:1;padding:7px 6px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:8px;font:600 11px system-ui,sans-serif;letter-spacing:.03em;cursor:pointer}
.kb9-mode button[aria-pressed=true]{background:var(--wine);border-color:var(--wine);color:var(--paper)}
.kb9-meta{margin:-8px 0 16px;font:600 11px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.kb9-reader article{min-width:0}
.kb9-body{line-height:1.72;font-size:1.04rem;color:var(--ink)}
.kb9-body>:first-child{margin-top:0}
.kb9-body p{margin:0 0 14px}
.kb9-body h3{margin:26px 0 10px;font-size:1.3rem;color:var(--wine);line-height:1.25}
.kb9-body h4{margin:20px 0 8px;font:600 13px system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.kb9-body ul,.kb9-body ol{margin:6px 0 16px;padding-left:22px}
.kb9-body li{margin:6px 0}
.kb9-body a[data-kb]{color:var(--wine);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--wine) 40%,transparent);text-underline-offset:3px;cursor:pointer}
.kb9-body a[data-kb]:hover{text-decoration-color:var(--wine)}
.kb9-body a[data-kb-dead]{color:inherit}
.kb9-sechead{margin:36px 0 14px!important;padding-top:16px;border-top:1px solid var(--line);font:600 12px system-ui,sans-serif!important;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)!important}
.kb9-whole:first-child .kb9-sechead{margin-top:6px!important;border-top:0;padding-top:0}
.kb9-verse{margin:16px 0 18px;padding:14px 18px;border-left:3px solid var(--gold);background:color-mix(in srgb,var(--gold) 8%,transparent);border-radius:0 12px 12px 0;display:grid;gap:8px}
.kb9-verse .iast{font-style:italic;font-size:1.05rem;line-height:1.6;color:var(--ink);white-space:pre-line}
.kb9-verse .tr{color:var(--ink);line-height:1.6}
.kb9-verse cite{font:600 11px system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-style:normal}
.kb9-callout{margin:16px 0;padding:13px 16px;border-radius:12px;border:1px solid color-mix(in srgb,var(--wine) 30%,var(--line));background:color-mix(in srgb,var(--wine) 7%,transparent);line-height:1.62}
.kb9-callout b:first-child{color:var(--wine)}
.kb9-example{margin:16px 0;padding:13px 16px;border-radius:12px;border:1px dashed var(--line);background:var(--paper2);line-height:1.62}
.kb9-example b:first-child{color:var(--olive,var(--wine))}
.kb9-defs{display:grid;grid-template-columns:minmax(110px,max-content) 1fr;gap:8px 18px;margin:12px 0 18px}
.kb9-defs dt{font-weight:600;color:var(--wine)}
.kb9-defs dd{margin:0;line-height:1.6}
.kb9-fig{margin:18px 0 22px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);text-align:center}
.kb9-fig svg{display:block;width:100%;max-width:640px;height:auto;margin:0 auto;overflow:hidden;color:var(--ink)}
.kb9-fig svg text{font-family:system-ui,sans-serif}
.kb9-fig figcaption{margin-top:10px;font-size:.88rem;color:var(--muted);line-height:1.5;text-align:left}
.kb9-body .kb9-table td:first-child{white-space:normal}
.kb9-body .kb9-table table caption{caption-side:top;text-align:left;font-size:.9rem;color:var(--muted);padding:0 0 6px}
.kb9-body blockquote:not(.kb9-verse){margin:14px 0;padding:6px 16px;border-left:3px solid var(--line);color:var(--muted)}
.kb9-related{margin:26px 0 8px;padding-top:16px;border-top:1px solid var(--line)}
.kb9-related h4{margin:0 0 10px;font:600 11px system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.kb9-related>div{display:flex;flex-wrap:wrap;gap:6px}
.kb9-related button{display:grid;text-align:left;gap:1px;padding:7px 11px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:.9rem;cursor:pointer;max-width:290px}
.kb9-related button:hover{border-color:var(--gold)}
.kb9-related small{font:600 9.5px system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.kb9-sources{margin:12px 0 0;font-size:.88rem;color:var(--muted)}
.kb9-sources b{color:var(--ink)}
.kb9-nextsec{margin:22px 0 4px}
.kb9-reader .study-reading-footer{flex-wrap:wrap}
.kb9-reader .study-breadcrumb button.text-btn{padding:0}

/* themes: figures and accents stay legible */
html[data-appearance=dark] .kb9-fig,html[data-appearance=dark] .kb9-ccard,html[data-appearance=dark] .kb9-related button{background:var(--paper2)}
html[data-appearance=dark] .kb9-ccard:hover{box-shadow:none}
html[data-appearance=dark] .kb9-hero{background:linear-gradient(135deg,#1c1812,var(--paper))}

/* tap a figure to see it larger (scrolls sideways on a phone) */
.kb9-body .kb9-fig{cursor:zoom-in}
.kb9-body .kb9-fig.kb9-zoom{cursor:zoom-out;overflow-x:auto}
.kb9-body .kb9-fig.kb9-zoom svg{max-width:none;width:max(100%,860px)}

@media (max-width:750px){
  .kb9-contents{padding:18px 16px}
  .kb9-chead h2{font-size:1.65rem}
  .kb9-cgrid{grid-template-columns:1fr}
  .kb9-hero{padding:16px}
  .kb9-hero b{font-size:1.5rem}
  .kb9-heroact{margin-left:0;width:100%}
  .kb9-mode{margin:0 0 0 6px;padding:0;border:0;flex:0 0 auto}
  .kb9-mode button{flex:0 0 auto;white-space:nowrap}
  .kb9-defs{grid-template-columns:1fr;gap:2px 0}
  .kb9-defs dd{margin-bottom:8px}
  .kb9-fig{padding:8px}
  .kb9-body{font-size:1rem}
  .kb9-verse{padding:12px 14px}
}