/* Reader workspace: navigation stays out of the way until requested. */
.notes-panel{position:relative}
.notes-close{position:absolute;top:16px;right:16px;display:grid;width:44px;height:44px;place-items:center;border:1px solid #b9c4ba;border-radius:50%;background:#fff;color:#173f30;font-size:28px;line-height:1}
.notes-close:focus-visible{outline:3px solid #b07d42;outline-offset:3px}
.reader-page-image,.reader-cover-page,.notes-reader-preview img{-webkit-user-drag:none;user-select:none;-webkit-touch-callout:none}
.app-shell:has(.reader-notes-view) .bottom-nav{display:none}
.app-shell.splash-mode .bottom-nav,.app-shell.splash-mode .mobile-menu-toggle{display:none!important}
.app-shell.reader-active{grid-template-rows:minmax(0,1fr);gap:0}
.app-shell.reader-active .read{min-height:0;grid-template-rows:minmax(0,1fr)}
.app-shell.reader-active .bottom-nav{position:fixed;z-index:40;left:max(18px,calc((100vw - 1040px)/2));right:max(18px,calc((100vw - 1040px)/2));bottom:18px;transform:translateY(calc(100% + 34px));opacity:0;pointer-events:none;transition:transform .22s ease,opacity .18s ease;box-shadow:0 16px 38px rgba(18,37,31,.24)}
.app-shell.reader-active.menu-open .bottom-nav{transform:translateY(0);opacity:1;pointer-events:auto}
.app-shell.reader-active .mobile-menu-toggle{position:fixed;z-index:41;left:24px;bottom:24px;display:grid;width:48px;height:48px;place-items:center;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:#173f30;color:#fff;box-shadow:0 8px 24px rgba(18,37,31,.3);font-size:20px;line-height:1}
.app-shell.reader-active.menu-open .mobile-menu-toggle{bottom:104px;background:#fff;color:#173f30}
@media(min-width:651px){
  .reader-notes-view{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(350px,460px);gap:22px;height:calc(100svh - 36px);min-height:0;padding:18px!important;overflow:hidden}
  .reader-notes-view .notes-reader-preview{display:grid;min-width:0;place-items:start center;overflow:auto;border-radius:20px;background:#102a20}
  .reader-notes-view .notes-reader-preview img{display:block;align-self:start;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
  .reader-notes-view .notes-panel{min-width:0;height:100%;max-height:none;overflow:auto;padding:34px 28px 28px;border-radius:20px;background:#fff}
  .reader-notes-view .notes-panel h1{font-size:clamp(24px,2.5vw,34px)!important;line-height:1.04!important;margin:8px 52px 14px 0!important}
  .app-shell.reader-active{padding:18px}
  .app-shell.reader-active .read{width:100%}
  .app-shell.reader-active .reader-frame{width:100%;height:100%;max-width:1100px;margin:0 auto;border-radius:20px}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode){display:grid;grid-template-columns:minmax(0,1fr) 184px;grid-template-rows:1fr auto;column-gap:26px;align-items:start;justify-items:center;padding:0 34px}
  .app-shell.reader-active .reader-page-viewport{display:contents}
  .app-shell.reader-active .reader-page-viewport .reader-page-image{grid-column:1;grid-row:1 / span 2;align-self:start;max-height:calc(100svh - 36px);max-width:100%;width:auto;margin:0}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-controls{grid-column:2;grid-row:1;display:flex;flex-direction:column;width:100%;margin:0;gap:12px}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-controls button{width:100%;min-height:48px}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-day-label{order:-1;width:100%;padding:0 0 6px;font-size:14px}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-tools{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-items:stretch;width:100%;gap:4px;padding:10px 0 0}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-tools .text-button{min-height:36px;text-align:center}
  .app-shell.reader-active .reader-cover-mode{display:grid;grid-template-columns:minmax(0,1fr) 184px;align-items:center;justify-items:center;padding:24px 34px;gap:26px}
  .app-shell.reader-active .reader-cover-mode .reader-cover-page{grid-column:1;max-height:calc(100svh - 88px);max-width:100%;width:auto}
  .app-shell.reader-active .reader-cover-mode .reader-cover-actions{grid-column:2;display:grid;gap:12px;width:100%;padding:0}
  .app-shell.reader-active .reader-cover-mode .reader-cover-actions button{min-height:50px}
}
.reader-mobile-tools{display:none}
@media(max-width:650px){
  .app-shell:has(.reader-notes-view){height:100dvh;grid-template-rows:minmax(0,1fr);gap:0;padding:12px}
  .reader-notes-view{display:block!important;height:100%;min-height:0;padding:0!important}
  .reader-notes-view .notes-panel{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden;padding:24px 18px 16px;border-radius:16px;background:#fff}
  .reader-notes-view .notes-panel h1{flex:0 0 auto;margin:8px 52px 14px 0!important}
  .reader-notes-view .notes-panel>p:not(.note-saved){flex:0 0 auto}
  .app-shell.reader-active .bottom-nav{display:none}
  .reader-notes-view .notes-reader-preview{display:none}
  /* iOS zooms focused text inputs below 16px, which pushes this local note editor off-screen. */
  .reader-notes-view .devotional-note{flex:1 1 auto;min-height:0!important;width:100%;margin:10px 0 8px;font-size:16px!important;line-height:1.45;-webkit-text-size-adjust:100%;resize:none}
  .reader-notes-view .note-saved{flex:0 0 auto;margin:0}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode){display:flex;min-height:100%;padding:0!important;align-items:flex-start;justify-content:flex-start;background:#102a20}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-page-image{display:block;width:100%;max-width:100%;max-height:100svh!important;height:auto;object-fit:contain;margin:0}
  .app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-controls,.app-shell.reader-active .reader-pages:not(.reader-cover-mode) .reader-tools{display:none}
  .app-shell.reader-active .reader-cover-mode{padding:18px 12px 22px!important;min-height:100%;justify-content:center;background:#102a20}
  .app-shell.reader-active .reader-cover-mode .reader-cover-page{width:auto;max-width:100%;max-height:min(calc(100svh - 156px),680px)!important;object-fit:contain}
  .app-shell.reader-active .reader-cover-mode .reader-cover-actions{position:static;z-index:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;width:min(100%,380px);margin:16px auto 0;padding:0}
  .app-shell.reader-active .reader-cover-mode .reader-cover-actions button{min-height:48px;padding:8px 5px;font-size:13px}
  .app-shell.reader-active .reader-mobile-tools{position:fixed;z-index:42;left:12px;right:12px;bottom:90px;display:none;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px;border:1px solid rgba(255,255,255,.2);border-radius:16px;background:#173f30;box-shadow:0 12px 32px rgba(0,0,0,.26)}
  .app-shell.reader-active.menu-open .reader-mobile-tools{display:grid}
  .app-shell.reader-active.reader-roomy.menu-open .reader-mobile-tools{position:static;z-index:auto;align-self:stretch;margin:10px 12px 0;box-shadow:none}
  .app-shell.reader-active .reader-mobile-tools button{min-height:42px;border:0;border-radius:9px;background:#f6f2e8;color:#173f30;font-weight:800;font-size:12px}
  .app-shell.reader-active .reader-mobile-tools .reader-landscape-hint{grid-column:1 / -1;margin:0;padding:1px 2px 0;color:rgba(246,242,232,.72);font-size:10px;line-height:1.2;text-align:center}
  .app-shell.reader-active .reader-mobile-tools button:nth-child(4),.app-shell.reader-active .reader-mobile-tools button:nth-child(5){grid-column:span 1}
  .app-shell.reader-active.menu-open .mobile-menu-toggle{bottom:238px}
}
.app-shell.mobile-landscape.reader-active .reader-pages:not(.reader-cover-mode){display:grid!important;grid-template-columns:minmax(0,1fr) 142px;grid-template-rows:1fr auto;gap:10px;padding:8px 12px!important;align-items:center}
.app-shell.mobile-landscape.reader-active .reader-page-viewport{grid-column:1;grid-row:1 / span 2;align-self:stretch;display:block;width:100%;min-width:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.app-shell.mobile-landscape.reader-active .reader-page-viewport .reader-page-image{display:block;width:100%;max-width:none;max-height:none!important;height:auto;margin:0}
.app-shell.mobile-landscape.reader-active .reader-pages:not(.reader-cover-mode) .reader-controls{grid-column:2;grid-row:1;display:flex!important;flex-direction:column;width:100%;gap:8px}
.app-shell.mobile-landscape.reader-active .reader-pages:not(.reader-cover-mode) .reader-tools{grid-column:2;grid-row:2;display:flex!important;flex-direction:column;width:100%;gap:2px}
.app-shell.mobile-landscape.reader-active .reader-pages:not(.reader-cover-mode) .reader-mobile-tools{display:none!important}