:root{--paper:#fffdf8;--paper2:#f6efe0;--ink:#241c16;--muted:#776b60;--accent:#8b4f24;--rule:rgba(50,35,24,.16);--shadow:0 16px 55px rgba(28,18,10,.18);--font-size:19px;--line:1.7;--pad:clamp(16px,4vw,28px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#17120f;color:var(--ink);font-family:Georgia,'Times New Roman',serif}button,input,select{font:inherit}button{cursor:pointer}
body[data-theme="sepia"]{--paper:#f7ead0;--paper2:#ead7b3;--ink:#392617;--muted:#79634f;--accent:#8a451e;--rule:rgba(70,45,25,.18)}
body[data-theme="dark"]{--paper:#17191b;--paper2:#202326;--ink:#ece5dc;--muted:#aaa29a;--accent:#e0a16c;--rule:rgba(255,255,255,.14);background:#090a0b}
.app{height:100%;display:flex;flex-direction:column;position:relative;overflow:hidden}.topbar{height:56px;min-height:56px;display:flex;align-items:center;gap:8px;padding:calc(env(safe-area-inset-top) + 6px) max(10px,env(safe-area-inset-right)) 6px max(10px,env(safe-area-inset-left));background:color-mix(in srgb,var(--paper) 95%,transparent);border-bottom:1px solid var(--rule);z-index:40;box-shadow:0 2px 14px rgba(0,0,0,.08)}
.iconbtn{width:42px;height:42px;border:0;border-radius:50%;background:transparent;color:var(--ink);display:grid;place-items:center;font:700 20px/1 system-ui}.iconbtn:active{background:var(--paper2)}.titlebox{min-width:0;flex:1;text-align:center}.titlebox b{display:block;font:700 14px/1.25 system-ui;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.titlebox span{display:block;font:500 11px/1.25 system-ui;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.stage{flex:1;min-height:0;position:relative;perspective:1600px;background:linear-gradient(90deg,rgba(0,0,0,.12),transparent 4%,transparent 96%,rgba(0,0,0,.12)),var(--paper2);overflow:hidden}.sheet{position:absolute;inset:0;background:var(--paper);transform-origin:left center;backface-visibility:hidden;will-change:transform,opacity;box-shadow:var(--shadow);overflow:hidden}.sheet.out-next{animation:outNext .28s ease-in forwards}.sheet.in-next{animation:inNext .32s ease-out both}.sheet.out-prev{transform-origin:right center;animation:outPrev .28s ease-in forwards}.sheet.in-prev{transform-origin:right center;animation:inPrev .32s ease-out both}@keyframes outNext{to{transform:translateX(-20%) rotateY(-18deg);opacity:.05}}@keyframes inNext{from{transform:translateX(18%) rotateY(12deg);opacity:.1}to{transform:none;opacity:1}}@keyframes outPrev{to{transform:translateX(20%) rotateY(18deg);opacity:.05}}@keyframes inPrev{from{transform:translateX(-18%) rotateY(-12deg);opacity:.1}to{transform:none;opacity:1}}
.page-scroll{position:absolute;inset:0;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scroll-padding-top:32px}.page{font-size:var(--font-size);line-height:var(--line);max-width:820px;margin:0 auto;padding:clamp(42px,7vh,68px) var(--pad) calc(160px + env(safe-area-inset-bottom));min-height:100%;background:var(--paper)}
.page-meta{font:800 12px/1.2 system-ui;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);text-align:center;margin-bottom:18px}.page h1{font-size:clamp(2rem,6vw,3.1rem);line-height:1.08;text-align:center;margin:.1em auto .8em;max-width:18ch}.page h2.text-number{display:none}.verse-line{text-align:center;font-style:italic;font-size:1.08em;line-height:1.55;margin:.16em auto;max-width:95%}.subhead{font:800 12px/1.2 system-ui;letter-spacing:.14em;text-transform:uppercase;text-align:center;color:var(--accent);margin:2.15rem 0 .8rem;padding-top:.4rem;border-top:1px solid var(--rule)}.page p{margin:.78em 0}.synonym-text{font-size:.95em}.translation-text{font-weight:700;font-size:1.05em;line-height:1.65;text-align:center;padding:1em 0}.page i{font-style:italic}.page b{font-weight:700}.page .chapter-number,.cover-kicker{font:800 12px/1.2 system-ui;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);text-align:center}.chapter-hint,.cover-hint{text-align:center;color:var(--muted);font:600 13px/1.4 system-ui;margin-top:3rem}.cover-page{padding:0;max-width:none;background:#0d0d0d}.cover-wrap{min-height:100%;display:grid;place-items:end center;position:relative;background:radial-gradient(circle at 50% 24%,rgba(255,226,145,.32),transparent 25%),linear-gradient(145deg,#241009,#6f2f14 52%,#160b08)}.cover-wrap:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(10,6,3,.92))}.cover-copy{position:relative;z-index:2;color:white;text-align:center;padding:30px 20px max(42px,env(safe-area-inset-bottom));text-shadow:0 2px 14px #000}.cover-copy h1{font-size:clamp(2.5rem,10vw,5rem);margin:.25em 0;line-height:.9}.cover-copy h1 span{font-size:.55em}.cover-copy p{font:500 16px/1.45 system-ui}.cover-copy .cover-kicker{color:#f4cc98}.cover-copy .cover-hint{color:#eee}
.bottom{position:absolute;z-index:35;left:0;right:0;bottom:0;padding:8px max(10px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));pointer-events:none}.bottom-inner{max-width:820px;margin:auto;display:grid;grid-template-columns:52px 1fr 52px;gap:8px;align-items:center}.navbtn{pointer-events:auto;height:50px;border:1px solid var(--rule);border-radius:16px;background:color-mix(in srgb,var(--paper) 94%,transparent);color:var(--ink);box-shadow:0 6px 20px rgba(0,0,0,.14);font:700 23px/1 system-ui}.navbtn:disabled{opacity:.25}.position{pointer-events:auto;min-width:0;background:color-mix(in srgb,var(--paper) 94%,transparent);border:1px solid var(--rule);border-radius:16px;padding:8px 12px;text-align:center;box-shadow:0 6px 20px rgba(0,0,0,.12)}.position b{display:block;font:700 12px/1.25 system-ui;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.position span{display:block;font:500 10px/1.25 system-ui;color:var(--muted);margin-top:2px}
.progress{height:3px;position:absolute;z-index:45;top:56px;left:0;right:0;background:transparent}.progress i{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:80;opacity:0;pointer-events:none;transition:.2s}.scrim.show{opacity:1;pointer-events:auto}.drawer{position:fixed;z-index:90;top:0;bottom:0;left:0;width:min(91vw,390px);background:var(--paper);color:var(--ink);transform:translateX(-102%);transition:.25s ease;box-shadow:20px 0 60px rgba(0,0,0,.28);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}.drawer.show{transform:none}.drawer-head{display:flex;align-items:center;padding:12px 12px 8px;border-bottom:1px solid var(--rule)}.drawer-head h2{font:800 18px/1.2 system-ui;margin:0;flex:1}.drawer-body{overflow:auto;padding:8px 10px calc(20px + env(safe-area-inset-bottom))}.front-link,.chapter-link{width:100%;border:0;background:transparent;color:var(--ink);text-align:left;border-radius:12px;padding:12px;font:700 14px/1.3 system-ui}.front-link:active,.chapter-link:active{background:var(--paper2)}.chapter-link small{display:block;color:var(--muted);font-weight:500;margin-top:3px}.verse-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:0 8px 12px}.verse-grid button{border:1px solid var(--rule);background:var(--paper2);color:var(--ink);border-radius:9px;padding:8px 2px;font:700 11px/1.1 system-ui}.verse-grid button.active{background:var(--accent);color:white}
.panel{position:fixed;z-index:100;left:50%;bottom:0;width:min(100%,520px);background:var(--paper);color:var(--ink);border-radius:22px 22px 0 0;transform:translate(-50%,105%);transition:.25s;box-shadow:0 -18px 60px rgba(0,0,0,.3);padding:18px 18px calc(18px + env(safe-area-inset-bottom))}.panel.show{transform:translate(-50%,0)}.panel h2{font:800 18px/1.2 system-ui;margin:0 0 16px}.setting{display:flex;align-items:center;gap:12px;margin:13px 0;font:600 14px/1.3 system-ui}.setting label{flex:1}.setting input[type=range]{width:180px}.theme-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.theme-row button{border:1px solid var(--rule);border-radius:12px;padding:12px 7px;background:var(--paper2);color:var(--ink);font:700 13px/1 system-ui}.theme-row button.active{outline:2px solid var(--accent)}
.searchbox{display:flex;gap:7px;margin-bottom:10px}.searchbox input{flex:1;min-width:0;border:1px solid var(--rule);border-radius:12px;background:var(--paper2);color:var(--ink);padding:11px 12px;font:500 14px/1.2 system-ui}.results button{display:block;width:100%;border:0;border-bottom:1px solid var(--rule);background:transparent;color:var(--ink);padding:12px 5px;text-align:left}.results b{display:block;font:700 13px/1.3 system-ui}.results span{display:block;color:var(--muted);font:500 11px/1.4 system-ui;margin-top:3px}.edge{position:absolute;z-index:20;top:0;bottom:92px;width:9%;opacity:0}.edge.left{left:0}.edge.right{right:0}
body.hide-sanskrit .verse-line{display:none}body.hide-synonyms .synonyms,body.hide-synonyms .synonym-text{display:none}body.hide-purport .purport,body.hide-purport .purport~*{display:none}
@media(min-width:760px){.stage{padding:18px}.sheet{inset:18px;border-radius:18px}.bottom{bottom:10px}.topbar{padding-left:20px;padding-right:20px}.progress{top:56px}.page{padding-left:46px;padding-right:46px;padding-bottom:170px}}
@media(prefers-reduced-motion:reduce){.sheet.out-next,.sheet.in-next,.sheet.out-prev,.sheet.in-prev{animation:none}.drawer,.panel,.scrim{transition:none}}


/* Final typography test: only long reading prose is justified. */
.alignment-test{margin:16px 0 18px;font:600 14px/1.35 system-ui}
.alignment-test>label{display:block;margin-bottom:9px}
.alignment-test small{display:block;color:var(--muted);font:500 11px/1.45 system-ui;margin-top:8px}
.align-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.align-row button{min-height:43px;border:1px solid var(--rule);border-radius:12px;padding:8px 7px;background:var(--paper2);color:var(--ink);font:700 12px/1.2 system-ui}
.align-row button.active{outline:2px solid var(--accent);outline-offset:1px}

/* Sanskrit and synonyms should never be stretched across the line. */
.verse-line{ text-align:center; -webkit-hyphens:none; hyphens:none; }
.synonym-text{ text-align:left; text-align-last:left; -webkit-hyphens:none; hyphens:none; overflow-wrap:anywhere; }

/* Book style: translations and purports only. */
body.align-book .translation-text{
  text-align:justify;
  text-align-last:center;
  text-justify:inter-word;
  -webkit-hyphens:auto;
  hyphens:auto;
  overflow-wrap:break-word;
}
body.align-book .purport-text{
  text-align:justify;
  text-align-last:left;
  text-justify:inter-word;
  -webkit-hyphens:auto;
  hyphens:auto;
  overflow-wrap:break-word;
}

/* Natural mode restores the original alignment. */
body.align-natural .translation-text{ text-align:center; text-align-last:auto; -webkit-hyphens:none; hyphens:none; }
body.align-natural .purport-text{ text-align:left; text-align-last:auto; -webkit-hyphens:none; hyphens:none; }

/* Prevent the floating navigation controls from hiding the final line. */
.page::after{content:"";display:block;height:18px}


/* V3: grouped-verse and non-overlapping navigation fixes. */
/* Some combined verses arrived from the PRC as plain <p><i>…</i></p> lines.
   Treat every unclassified paragraph before the section headings as a Sanskrit line. */
.verse-page > p:not([class]){
  text-align:center;
  font-style:italic;
  font-size:1.08em;
  line-height:1.55;
  margin:.16em auto;
  max-width:95%;
  -webkit-hyphens:none;
  hyphens:none;
}

/* A conventional justified paragraph keeps its final line at the left.
   This makes the translation visibly justified rather than visually centred. */
body.align-book .translation-text{
  width:100%;
  max-width:none;
  text-align:justify;
  text-align-last:left;
  -moz-text-align-last:left;
  text-justify:inter-word;
  -webkit-hyphens:auto;
  hyphens:auto;
  overflow-wrap:break-word;
}

/* Keep the controls in their own footer instead of floating over the page. */
.bottom{
  position:relative;
  left:auto;
  right:auto;
  bottom:auto;
  flex:0 0 auto;
  padding:8px max(10px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));
  background:var(--paper2);
  border-top:1px solid var(--rule);
  box-shadow:0 -5px 18px rgba(0,0,0,.08);
}
.edge{bottom:0}
.page{padding-bottom:clamp(42px,7vh,72px)}
.page::after{height:0}

/* Slightly improve long bold translation paragraphs. */
.translation-text{
  letter-spacing:.002em;
  word-spacing:normal;
}

/* Śrīmad-Bhāgavatam canto reader additions */
.cover-wrap{place-items:center;overflow:hidden}.cover-wrap:before{content:"";position:absolute;width:min(88vw,620px);aspect-ratio:1;border:1px solid rgba(255,230,178,.2);border-radius:50%;box-shadow:0 0 0 22px rgba(255,230,178,.035),0 0 0 48px rgba(255,230,178,.025)}.cover-wrap:after{inset:0;background:linear-gradient(transparent,rgba(10,4,2,.65))}.cover-copy{max-width:680px}.cover-copy h1{font-size:clamp(2.7rem,11vw,6.2rem);line-height:.9}.lotus-mark{font-size:clamp(3rem,12vw,6rem);color:#f3ce8d;line-height:1;text-shadow:0 0 30px rgba(255,220,140,.5)}.canto-cover-title{font:italic 700 clamp(1.5rem,5vw,2.5rem)/1.2 Georgia,serif;color:#f6dab0}.canto-title{text-align:center;font-size:clamp(1.5rem,4vw,2.15rem);font-style:italic;margin:-.35em auto 1.4em;color:var(--accent)}.front-subhead{text-align:center;font-size:1.25em;line-height:1.35;margin:2rem auto 1rem;color:var(--accent)}.chapter-end{font-style:italic;text-align:left;border-top:1px solid var(--rule);margin-top:2rem!important;padding-top:1rem}.library-link{display:block;margin:4px 8px 12px;padding:11px 12px;border:1px solid var(--rule);border-radius:12px;color:var(--accent);text-decoration:none;font:800 13px/1.2 system-ui;text-align:center;background:var(--paper2)}