/* Raam Leela · the Book v2 (docs/book/BOOK-DECISIONS-11OCT.md; mockup docs/book/mockups/a.html, simplified) */
:root{--bg:#EEE2BC;--surface:#F6EDD0;--surface2:#F0E3B8;--gold-d:#B8923A;--ink:#3A2616;--ink2:#6A5136;--line:#CDB57A;--red:#8E2A1E;--red-t:#fff6e0;--hl:rgba(184,146,58,.30);--shadow:rgba(58,38,22,.22);
  --serif:'EB Garamond',Georgia,serif;--head:Eczar,'Tiro Devanagari Hindi',Georgia,serif;--deva:'Tiro Devanagari Sanskrit','Tiro Devanagari Hindi','Noto Serif Devanagari',serif;--pad:16px;--lf:var(--serif)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#1D150E;--surface:#281D13;--surface2:#31241A;--gold-d:#C9A24D;--ink:#EEE0BA;--ink2:#BBA77F;--line:#5B4527;--red:#E08470;--red-t:#2a1a12;--hl:rgba(201,162,77,.24);--shadow:rgba(0,0,0,.5)}}
:root[data-theme=dark]{--bg:#1D150E;--surface:#281D13;--surface2:#31241A;--gold-d:#C9A24D;--ink:#EEE0BA;--ink2:#BBA77F;--line:#5B4527;--red:#E08470;--red-t:#2a1a12;--hl:rgba(201,162,77,.24);--shadow:rgba(0,0,0,.5)}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:19px/1.55 var(--serif);overflow-wrap:anywhere}
button{font:inherit;color:inherit;cursor:pointer}a{color:var(--red)}:focus-visible{outline:2px solid var(--red);outline-offset:2px}
svg.i{width:1.15em;height:1.15em;vertical-align:-.2em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.top{max-width:1500px;margin:0 auto;padding:14px var(--pad) 4px;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;justify-content:space-between}
.top h1{margin:0;font:600 25px/1.15 var(--head)}.tag{flex:1 1 100%;margin:0;font:15px/1.4 var(--serif);color:var(--ink2)}.tag [lang=hi]{font-family:var(--head)}
.hctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ib{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:transparent;display:grid;place-items:center;color:var(--ink)}.ib:hover{background:var(--hl)}.ib svg{width:21px;height:21px}
.sel{min-height:44px;border:1px solid var(--gold-d);border-radius:999px;background:var(--surface);color:var(--ink);font:17px var(--serif);padding:2px 14px;max-width:100%}
.sw{display:inline-flex;align-items:center;gap:9px;min-height:44px;border:0;background:transparent;font:17px var(--serif);color:var(--ink);padding:0 2px}
.sw i{width:42px;height:24px;border-radius:999px;background:var(--line);position:relative;flex:none;transition:background .15s}
.sw i::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:var(--surface);box-shadow:0 1px 3px var(--shadow);transition:left .15s}
.sw[aria-checked=true] i{background:var(--red)}.sw[aria-checked=true] i::after{left:21px}.sw[disabled]{opacity:.45;cursor:default}
.layout{max-width:1500px;margin:0 auto;padding:0 var(--pad) 120px;display:grid;grid-template-columns:minmax(0,1fr)}
.main{min-width:0}.rail{display:none}
@media (min-width:1024px){.layout{grid-template-columns:300px minmax(0,1fr);gap:0 30px;padding-bottom:40px;align-items:start}
 .rail{display:flex;flex-direction:column;gap:12px;position:sticky;top:12px;height:calc(100vh - 24px);min-height:0}.shead .stbtn{display:none}#mini{display:none}}
.treebox{background:var(--surface);border:1px solid var(--line);padding:10px;flex:1;min-height:0;display:flex;flex-direction:column}
.th{margin:0 0 6px;font:600 12px/1 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);display:flex;justify-content:space-between}
.tb{overflow:auto;min-height:0;flex:1;scrollbar-width:thin}
.kh{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:4px 6px;border:0;border-bottom:1px solid var(--line);background:var(--surface2);font:600 15px/1.2 var(--serif);text-align:left;position:sticky;top:0;z-index:1}
.kh .chev{width:1em;flex:none;transition:transform .15s}.kh[aria-expanded=false] .chev{transform:rotate(-90deg)}.kh small{margin-left:auto;font:12px system-ui,sans-serif;color:var(--ink2)}
.srow{display:grid;grid-template-columns:2.6em minmax(0,1fr) auto;gap:6px;align-items:baseline;width:100%;text-align:left;padding:7px 8px;min-height:44px;border:0;border-bottom:1px solid var(--line);background:transparent;font-size:17px;line-height:1.3}
.srow:hover:not([disabled]){background:var(--hl)}.srow.cur{background:var(--hl);box-shadow:inset 3px 0 0 var(--red)}.srow[disabled]{color:var(--ink2);cursor:default}
.srow .sid{font:600 11.5px system-ui,sans-serif;color:var(--red)}.srow .ss{font:12px system-ui,sans-serif;color:var(--ink2);white-space:nowrap}
.strip,.mini{background:var(--surface);border:1px solid var(--gold-d);border-radius:14px;padding:8px 12px;box-shadow:0 4px 14px var(--shadow);display:flex;align-items:center;gap:8px}
.strip b,.mini b{display:block;font:600 16px/1.3 var(--head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.strip small,.mini small{display:block;font:12.5px system-ui,sans-serif;color:var(--ink2)}
.strip .t,.mini .t{flex:1;min-width:0}.pb{width:44px;height:44px;border-radius:50%;border:0;background:var(--red);color:var(--red-t);display:grid;place-items:center;flex:none}
#mini{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:50;max-width:760px;margin:0 auto}
.drawer{position:fixed;z-index:60;left:10px;right:10px;top:70px;bottom:84px;overflow:auto;background:var(--surface);border:1px solid var(--gold-d);padding:12px;box-shadow:0 8px 30px var(--shadow);flex-direction:column}
.drawer:not([hidden]){display:flex}
.shead{position:sticky;top:0;z-index:30;background:var(--bg);border-bottom:1px solid var(--line);padding:10px 4px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center}
.shead h2{margin:0;font:600 24px/1.2 var(--head)}.shead .acts{display:flex;gap:8px;align-items:center}
.stbtn{min-height:44px;padding:4px 14px;border:1px solid var(--gold-d);border-radius:999px;background:var(--surface);font:15px system-ui,sans-serif}
.seg3{display:inline-flex;border:1px solid var(--gold-d);border-radius:999px;overflow:hidden;background:var(--surface);grid-column:1 / -1;justify-self:start}
.seg3 button{border:0;background:transparent;min-height:44px;padding:2px 16px;font:600 15px system-ui,sans-serif;display:inline-flex;gap:7px;align-items:center}
.seg3 button+button{border-left:1px solid var(--gold-d)}.seg3 button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.seg3 button[disabled]{opacity:.5;cursor:default}
.note{margin:12px 0 0;padding:10px 14px;border:1px dashed var(--line);border-radius:8px;font:15px/1.5 system-ui,sans-serif;color:var(--ink2)}
.book{margin-top:6px;--fs:21px}
.vrow{position:relative;display:grid;gap:0 28px;padding:24px 4px;border-bottom:1px solid var(--line);scroll-margin-top:170px;-webkit-touch-callout:none;grid-template-columns:minmax(0,1fr)}
.vrow.sa-on{grid-template-columns:44px minmax(0,.62fr) minmax(0,1.38fr)}
.vrow .vn{padding-top:8px;text-align:right;color:var(--ink2);font:600 13px/1 system-ui,sans-serif}
.vrow .sa{margin:0;padding-top:4px;font:var(--fs)/1.8 var(--deva);color:var(--ink)}.vrow .ro{margin:4px 0 0;color:var(--ink2);font:italic 15px/1.5 var(--serif)}
.vrow .txt{min-width:0;padding-right:46px;font-family:var(--lf)}
.vt{margin:0 0 8px;font-size:var(--fs);line-height:1.8}.lq{margin:6px 0 8px;padding:10px 14px;border-left:3px solid var(--gold-d);background:color-mix(in srgb,var(--gold-d) 12%,transparent);border-radius:0 8px 8px 0}
.lq .who{font:600 12px/1.2 system-ui,sans-serif;letter-spacing:.04em;color:var(--red);margin-bottom:4px}.lq .q{margin:0;font-size:var(--fs);line-height:1.75}
.vmore{position:absolute;right:2px;top:12px;width:44px;height:44px;border:0;background:transparent;border-radius:50%;color:var(--ink2);display:grid;place-items:center}.vmore:hover{background:var(--hl);color:var(--red)}
.vrow.hit{background:linear-gradient(90deg,var(--hl),transparent 96%);box-shadow:inset 4px 0 0 var(--red)}
/* Sanskrit off: a plain book in the language, no Devanagari, no Roman, no gaps */
.book.plain .vrow{display:block;padding:0;border:0;margin:0}.book.plain .vrow .txt{padding-right:40px}.book.plain .vrow .vmore{top:-6px;opacity:.35}.book.plain .vrow:hover .vmore,.book.plain .vrow:focus-within .vmore{opacity:1}
.book.plain .vt{margin:0 0 .9em}.book.plain .lq{margin:0 0 .9em}.book{max-width:820px}
.end{padding:20px;text-align:center;color:var(--ink2)}
.foot{max-width:1500px;margin:0 auto;padding:10px var(--pad) 130px;color:var(--ink2);font:15px/1.5 var(--serif)}.foot .small{font-size:13px}.foot p{margin:4px 0}
.pop{position:fixed;z-index:110;min-width:230px;max-width:min(92vw,330px);background:var(--surface);border:1px solid var(--gold-d);border-radius:12px;box-shadow:0 8px 28px var(--shadow);padding:6px}
.pop button{display:flex;gap:12px;align-items:center;width:100%;min-height:48px;padding:6px 12px;border:0;background:transparent;text-align:left;color:var(--ink);font:16px system-ui,sans-serif;border-radius:8px}.pop button:hover{background:var(--hl)}
.sh-back{position:fixed;inset:0;z-index:100;background:rgba(30,18,8,.55);display:flex;align-items:flex-end;justify-content:center}
.sh{background:var(--bg);width:100%;max-height:92vh;overflow:auto;border-radius:18px 18px 0 0;border-top:2px solid var(--red);padding:16px var(--pad) calc(16px + env(safe-area-inset-bottom))}
.sh h2{margin:0 0 2px;font:600 20px var(--head);text-align:center}.sh .sub{margin:0 0 10px;text-align:center;color:var(--ink2);font:14px system-ui,sans-serif}
.card{width:min(320px,80%);margin:4px auto 14px;padding:22px 18px;text-align:center;border:3px double var(--red);background:var(--surface2);border-radius:6px}
.card .mk{font:600 12px Eczar,serif;letter-spacing:.24em;text-transform:uppercase;color:var(--red)}.card .tt{font:600 24px/1.25 var(--head);margin:10px 0 2px}.card .te{font:italic 16px var(--serif);color:var(--ink2)}
.sh .menu{max-width:420px;margin:0 auto;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:4px}
.sh .menu button,.sh .menu a{display:flex;gap:12px;align-items:center;width:100%;min-height:52px;padding:6px 14px;border:0;background:transparent;text-align:left;text-decoration:none;color:var(--ink);font:17px system-ui,sans-serif;border-radius:8px}.sh .menu button:hover,.sh .menu a:hover{background:var(--hl)}
@media (min-width:760px){.sh-back{align-items:center}.sh{width:min(480px,92vw);border-radius:14px;border:1px solid var(--gold-d);border-top:2px solid var(--red)}}
@media (max-width:699px){.top h1{font-size:22px;flex:1 1 auto}.hctl .sel{flex:1 1 90px;min-width:90px}.hctl .sw{font-size:15px;gap:6px}.shead h2{font-size:21px}.vrow{padding:18px 2px}.vrow.sa-on{grid-template-columns:minmax(0,1fr)}.vrow .vn{text-align:left;padding:0 0 6px}.vrow .txt{padding-right:42px}.book{--fs:20px}}
@media (min-width:700px) and (max-width:1023px){.vrow.sa-on{grid-template-columns:44px minmax(0,.7fr) minmax(0,1.3fr)}}

.pall{width:100%;margin:0 0 8px;padding:10px 12px;border:0;border-radius:12px;background:var(--red);color:var(--red-t);font:600 15px system-ui,sans-serif;cursor:pointer}.pall:disabled{opacity:.45;cursor:default}
.qbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom));z-index:40;display:flex;align-items:center;gap:6px;max-width:min(94vw,560px);padding:8px 12px;background:var(--surface);border:1px solid var(--gold-d);border-radius:999px;box-shadow:0 6px 20px var(--shadow)}
.qbar[hidden]{display:none}.qbar .qt{flex:1;min-width:0;font:600 15px/1.3 var(--head);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
