* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; background: #1b1f24; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.loefb-bar {
	display: flex; align-items: center; gap: 14px;
	padding: 10px 16px; background: #12151a; color: #e8eaed;
	position: sticky; top: 0; z-index: 10;
}
.loefb-back { color: #9ab8d8; text-decoration: none; font-size: 14px; white-space: nowrap; }
.loefb-back:hover { color: #fff; }
.loefb-title { flex: 1; font-size: 15px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.loefb-controls { display: flex; align-items: center; gap: 8px; }
.loefb-controls button {
	background: #2a3038; color: #e8eaed; border: 0; border-radius: 6px;
	width: 34px; height: 30px; font-size: 16px; cursor: pointer;
}
.loefb-controls button:hover { background: #3a4250; }
#loefb-page { font-size: 13px; color: #aab; min-width: 54px; text-align: center; }
#loefb-stage { display: flex; align-items: center; justify-content: center; padding: 12px; min-height: calc(100vh - 52px); overflow: hidden; }
#loefb-loading { position: absolute; color: #8892a0; font-size: 15px; }

/* Canvas is transparent outside the pages (patched lib), so the shadow hugs the book itself. */
#loefb-book .stf__canvas { filter: drop-shadow(0 10px 28px rgba(0,0,0,.55)); }

#loefb-zoom { width: auto; padding: 0 10px; font-size: 12px; }
#loefb-stage.loefb-zoomed { cursor: grab; touch-action: none; }
#loefb-stage.loefb-zoomed:active { cursor: grabbing; }
#loefb-stage.loefb-zoomed #loefb-book, #loefb-stage.loefb-zoomed canvas { pointer-events: none; }