:root{--desk:#c4d0de;--desk2:#9fb2c8;--ink:#14243a;--paper:#eef0ea;--paper2:#dde3e6;--green:#0f3b7a;--green2:#0a2a5c;--gold:#ecc874;--river:#2d7390;--laterite:#9a3f2a;--muted:#4f6277;--bar:#0f3b7a;--barink:#eef0ea}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--desk:#0b1424;--desk2:#050a14;--bar:#ecc874;--barink:#0a2a5c}}
:root[data-theme="dark"]{--desk:#0b1424;--desk2:#050a14;--bar:#ecc874;--barink:#0a2a5c}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:radial-gradient(ellipse at 50% 40%,var(--desk),var(--desk2));font-family:"Noto Serif Devanagari",serif;color:var(--ink);overflow:hidden}
.stage{position:fixed;left:50%;top:calc(50% - 34px);width:1000px;height:640px;margin:-320px 0 0 -500px;transform-origin:center}
.book{position:relative;width:1000px;height:640px;perspective:2600px;transition:transform .9s cubic-bezier(.5,.1,.2,1)}
.backcover{position:absolute;left:50%;top:0;width:50%;height:100%;background:var(--green2);border-radius:0 8px 8px 0;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.leaf{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform .95s cubic-bezier(.5,.1,.2,1)}
.leaf.flipped{transform:rotateY(-180deg)}
.nt,.nt .leaf{transition:none!important}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;cursor:pointer}
.face.b{transform:rotateY(180deg)}
.page{position:absolute;inset:0;padding:46px 46px 40px}
.page.r{border-radius:0 6px 6px 0;background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(0,0,0,0) 7%),var(--paper)}
.page.l{border-radius:6px 0 0 6px;background:linear-gradient(270deg,rgba(0,0,0,.2),rgba(0,0,0,0) 7%),var(--paper)}
.cover{background:radial-gradient(circle at 50% 56%,#1558b9 0%,#0b3374 52%,#061a42 100%);border-radius:0 10px 10px 0}
.cover:after{content:"";position:absolute;inset:18px;border:1.5px solid var(--gold);border-radius:4px;pointer-events:none}
.ctitle{position:absolute;left:0;right:0;top:50px;text-align:center;color:#fff}
.ctitle h1{font-family:"Yatra One",serif;font-weight:400;margin:0;font-size:56px;line-height:1.15;color:var(--gold)}
.ctitle h2{font-family:"Yatra One",serif;font-weight:400;margin:0;font-size:34px;line-height:1.3}
#globe{position:absolute;left:20px;top:150px;width:460px;height:400px}
.csub{position:absolute;left:0;right:0;bottom:50px;text-align:center;color:#cfe3ff;font-size:16px;line-height:1.7}
.csub small{display:block;color:var(--gold);font-size:13.5px}
h3{font-family:"Yatra One",serif;font-weight:400;font-size:26px;margin:0 0 6px;color:var(--green);line-height:1.3}
.sub{font-size:13.5px;color:var(--muted);margin:0 0 18px}
p.t{font-size:15.5px;line-height:1.8;margin:0 0 13px}
.part{margin:0 0 15px}
.part h4{font-family:"Yatra One",serif;font-weight:400;font-size:16.5px;margin:0 0 5px;color:var(--laterite);border-bottom:1px solid var(--paper2);padding-bottom:4px}
.ch{display:flex;gap:12px;align-items:baseline;padding:3px 6px;margin:0 -6px;font-size:15px;border-radius:3px;cursor:pointer}
.ch:hover,.ch:focus-visible{background:var(--paper2);outline:none}
.ch b{font-weight:600;min-width:24px;color:var(--green)}
.ch.live{color:var(--river)}
.ch.live span:after{content:attr(data-tag);font-size:12px;color:var(--muted)}
.foot{position:absolute;bottom:20px;font-size:12.5px;color:var(--muted)}
.page.r .foot{right:46px}.page.l .foot{left:46px}
.keys{list-style:none;margin:0;padding:0}
.keys li{padding:9px 0;border-bottom:1px solid var(--paper2);font-size:14.5px;line-height:1.6}
.keys li strong{display:block;font-weight:600;color:var(--green)}
.layers{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin:0 0 12px}
.layers div{display:flex;gap:10px;align-items:center;font-size:14.5px}
.layers i{width:15px;height:15px;border-radius:3px;border:1.5px solid var(--green);display:inline-block}
.layers i.on{background:var(--river);border-color:var(--river)}
.mini{width:100%;height:160px;border:1px solid var(--paper2);background:#e1e8ee;border-radius:4px;margin:6px 0 12px}
.bar{position:fixed;left:0;right:0;bottom:0;display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap;padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px))}
.bar button{font:inherit;font-size:15px;padding:9px 22px;border-radius:999px;border:1.5px solid var(--bar);background:transparent;color:var(--bar);cursor:pointer}
.bar button.p{background:var(--bar);color:var(--barink)}
.bar button:disabled{opacity:.35;cursor:default}
.bar button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.toast{position:fixed;left:50%;bottom:76px;transform:translateX(-50%);background:var(--green2);color:#fff;padding:9px 18px;border-radius:6px;font-size:14px;opacity:0;transition:opacity .25s;pointer-events:none}
.toast.on{opacity:1}
@media (prefers-reduced-motion:reduce){.leaf,.book{transition-duration:.01s}}

.earth{position:absolute;left:50%;top:186px;width:350px;height:350px;margin-left:-175px;filter:drop-shadow(0 0 26px rgba(110,190,255,.55))}
.jhshadow{position:absolute;left:50%;top:470px;width:190px;height:34px;margin-left:-95px;border-radius:50%;background:radial-gradient(ellipse,rgba(0,6,24,.5),rgba(0,6,24,0) 70%);animation:shd 1.8s ease-out both}
.jhglow{position:absolute;left:50%;top:262px;width:250px;height:200px;margin-left:-125px;border-radius:50%;background:radial-gradient(ellipse,rgba(150,215,255,.38),rgba(150,215,255,0) 68%);animation:shd 1.8s ease-out both}
.jhwrap{position:absolute;left:50%;top:268px;width:214px;margin-left:-107px;perspective:640px;animation:rise 1.8s cubic-bezier(.2,.8,.2,1) both,flt 4.2s ease-in-out 1.8s infinite}
.jhwrap img{display:block;width:100%;transform:rotateX(22deg);filter:drop-shadow(0 1px 0 #4d6b35) drop-shadow(0 2px 0 #3f5a2b) drop-shadow(0 3px 0 #35502a) drop-shadow(0 0 2px rgba(255,255,255,.95)) drop-shadow(0 0 9px rgba(190,230,255,.55))}
@keyframes rise{from{transform:translateY(46px) scale(.5);opacity:0}to{transform:none;opacity:1}}
@keyframes shd{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
@keyframes flt{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.jhwrap,.jhshadow,.jhglow{animation:none}}
.fig{margin:0 0 12px}.fig img{width:100%;object-fit:cover;border-radius:4px;display:block}.fig figcaption{font-size:12px;color:var(--muted);margin-top:4px}
.full{width:100%;height:100%;object-fit:cover;display:block}
.spine{position:absolute;top:0;bottom:0;right:0;width:46px;background:linear-gradient(270deg,rgba(0,0,0,.35),rgba(0,0,0,0))}
.credit{position:absolute;left:14px;bottom:12px;font-size:11.5px;color:#fff;background:rgba(0,0,0,.4);padding:2px 8px;border-radius:3px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin:0 -18px}
.cols .part{margin:0 0 12px}
.cols .part h4{font-size:14px}
.cols .ch{font-size:13.5px;gap:7px;padding:2px 4px;margin:0 -4px;line-height:1.5}
.cols .ch b{min-width:20px}
.cols .ch:hover span,.cols .ch:focus-visible span{text-decoration:underline;text-decoration-style:dotted}

/* chapter map opens on top of the book, in the same window */
.chview{position:fixed;inset:0;z-index:100;background:#06183b;opacity:0;transform:scale(1.03);pointer-events:none;visibility:hidden;transition:opacity .35s ease,transform .35s ease,visibility 0s .35s}
.chview.on{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .35s ease,transform .35s ease}
.chview iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#06183b}
.bar button.ic{padding:9px 13px;line-height:0}.bar button.ic svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (prefers-reduced-motion:reduce){.chview,.chview.on{transition-duration:.01s}}

.keys.sm li{padding:6px 0;font-size:13.5px;line-height:1.5}.ch.soon{color:var(--muted);cursor:default}