/* the Bible page */
.devo-page{background:var(--paper)}
.devo-head{padding:clamp(30px,5vh,60px) var(--gutter) 10px}
.daybar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 18px}
.arrow{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:20px;cursor:pointer;color:var(--ink)}
.arrow:hover{border-color:var(--accent);color:var(--accent)}
.daylabel{display:grid;line-height:1.1}
.daylabel b{font-family:var(--display);font-size:30px;text-transform:uppercase;letter-spacing:.02em}
.pick{display:inline-flex;align-items:center;gap:8px;margin-left:auto}
.pick input{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:6px;background:#fff}
.devo h1{font-size:clamp(44px,6.4vw,92px);line-height:.92}
.theme{margin:10px 0 0}
.book-stage{padding:20px var(--gutter) 10px;max-width:1180px;margin:0 auto}
.book{position:relative;height:clamp(420px,46vw,620px);display:grid;grid-template-columns:1fr 1fr;perspective:2200px;filter:drop-shadow(0 40px 40px rgba(0,0,0,.35))}
.cover{position:absolute;top:-14px;bottom:-14px;width:calc(50% + 14px);background:linear-gradient(135deg,#2B2B2B,#161616);border-radius:12px 4px 4px 12px}
.cover.left{left:-14px}
.cover.right{right:-14px;border-radius:4px 12px 12px 4px;background:linear-gradient(225deg,#2B2B2B,#161616)}
.page{position:relative;background:#FBF7EC;overflow:hidden;box-shadow:inset 0 0 40px rgba(0,0,0,.08)}
.page.left{border-radius:4px 0 0 4px;box-shadow:inset -30px 0 40px -30px rgba(0,0,0,.25),inset 0 0 40px rgba(0,0,0,.05)}
.page.right{border-radius:0 4px 4px 0;box-shadow:inset 30px 0 40px -30px rgba(0,0,0,.25),inset 0 0 40px rgba(0,0,0,.05)}
.page-in{padding:clamp(18px,3vw,40px) clamp(18px,3.4vw,46px);height:100%;overflow:auto;font-family:'PT Serif',Georgia,serif;font-size:clamp(15px,1.25vw,18px);line-height:1.6;color:#2A2622}
.ref{margin:0 0 12px;color:var(--accent)}
.verses p{margin:0 0 10px;text-indent:0}
.verses sup{font-family:var(--sign);font-size:11px;color:var(--accent);margin-right:4px;font-weight:700}
.verses .hl{background:linear-gradient(180deg,rgba(255,224,102,0) 15%,rgba(255,224,102,.85) 16%,rgba(255,224,102,.85) 88%,rgba(255,224,102,0) 89%);padding:0 2px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.verses .w{border-radius:3px;transition:background .12s}
.verses .w.now{background:var(--accent);color:#fff;padding:0 3px;margin:0 -3px}
.pgnum{text-align:right;margin:8px 0 0;color:#9A9080}
.flip{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transform:rotateY(0deg);pointer-events:none;opacity:0}
.flip.go{opacity:1;animation:flip .9s cubic-bezier(.4,.1,.3,1) forwards}
.flip-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#FBF7EC;box-shadow:inset 0 0 40px rgba(0,0,0,.08)}
.flip-face.back{transform:rotateY(180deg);background:#F3EDDF}
@keyframes flip{0%{transform:rotateY(0)}100%{transform:rotateY(-180deg)}}
.ribbon{position:absolute;left:calc(50% - 8px);top:-14px;width:16px;height:64%;background:var(--red);border-radius:0 0 2px 2px;box-shadow:0 6px 10px rgba(0,0,0,.25);clip-path:polygon(0 0,100% 0,100% 100%,50% 88%,0 100%)}
.book-ui{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:26px 0 0}
.book-ui .ico{display:inline-block;width:0;height:0;border-left:12px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-right:10px;vertical-align:-1px}
.book-ui .btn.reading .ico{border:0;width:10px;height:14px;background:#fff;border-radius:2px}
.lookup{display:flex;gap:8px;margin-left:auto}
.lookup input{font:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:#fff;min-width:260px}
.devo-body{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,4vw,60px);padding-top:clamp(40px,6vh,70px);padding-bottom:clamp(40px,6vh,70px);align-items:start}
.devo-text{font-size:clamp(18px,1.5vw,21px);line-height:1.65;color:var(--ink-2)}
.devo-text p{margin:0 0 16px}
.devo-text .w{border-radius:3px;transition:background .12s}
.devo-text .w.now{background:var(--accent);color:#fff;padding:0 3px;margin:0 -3px}
.pray-text .w.now{background:#F6D36B;color:#232323}
.pray{background:var(--ink);color:var(--paper);padding:26px 28px;border-radius:12px}
.pray .kicker{color:#F6D36B}
.pray-text{color:#EDE7DA;font-family:'PT Serif',Georgia,serif;font-style:italic}
.pray-ui{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.pray .btn.ghost{color:#fff;border-color:rgba(255,255,255,.3)}
.byline{margin-top:6px}
.five-band{padding-bottom:clamp(50px,8vh,100px)}
.five-list{font-family:var(--display);font-size:clamp(26px,3vw,40px);text-transform:uppercase;line-height:1.1;margin:8px 0 22px;padding-left:1.2em;color:var(--ink)}
.five-list li{margin:4px 0}
.five-list li::marker{color:var(--accent)}
@media (max-width:760px){
  .book{grid-template-columns:1fr;height:auto}
  .cover{display:none}
  .page.right,.flip,.ribbon{display:none}
  .page.left{border-radius:8px;min-height:360px}
  .page-in{height:auto;max-height:70vh}
  .lookup{margin-left:0;width:100%}
  .lookup input{min-width:0;flex:1}
  .devo-body{grid-template-columns:1fr}
  .pick{margin-left:0}
}