.lp-reader {
  --lp-reader-ink: #f4f7f5;
  --lp-reader-dim: #bfcec7;
  --lp-reader-dark: #17231e;
  --lp-reader-line: #40554b;
  --lp-reader-focus: #86e0b6;
  max-width: 100%;
  margin: 0 0 1.25rem;
  border-radius: 1rem;
  overflow: hidden;
  background: var(--lp-reader-dark);
  color: var(--lp-reader-ink);
  box-shadow: 0 0.85rem 2.8rem #11221a24;
}
.lp-reader [hidden] { display: none !important; }
.lp-prose .lp-reader .lp-reader-links a, .lp-prose .lp-reader .lp-reader-library a {
  color: var(--lp-reader-ink);
  text-decoration-color: #7bb99b;
}
.lp-prose .lp-reader .lp-reader-links a:hover, .lp-prose .lp-reader .lp-reader-library a:hover {
  color: var(--lp-reader-focus);
}
.lp-reader :focus-visible { outline: 2px solid var(--lp-reader-focus); outline-offset: 2px; }
.lp-reader-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem 1rem;
  padding: 0.85rem 1rem;
}
.lp-reader .lp-reader-header h2 { color: inherit; font-size: clamp(1.15rem, 2vw, 1.55rem); margin: 0; }
.lp-reader .lp-reader-header p { color: var(--lp-reader-dim); margin: 0.2rem 0 0; font-size: .85rem; }
.lp-reader-links { display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: .9rem; }
.lp-reader-library, .lp-reader-thumbnails { padding: 0.65rem 1rem; border-top: 1px solid var(--lp-reader-line); }
.lp-reader summary { color: var(--lp-reader-ink); font-weight: 650; cursor: pointer; }
.lp-reader .lp-reader-library ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.2rem;
  padding: 0;
  margin: 0.7rem 0 0.15rem;
  list-style: none;
  font-size: .9rem;
}
.lp-reader .lp-reader-library a[aria-current] { color: var(--lp-reader-focus); font-weight: 700; }
.lp-reader-viewport {
  position: relative;
  isolation: isolate;
  perspective: 1050px;
  min-height: 10rem;
  padding: .85rem;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 20%, #40534a, #26352d 75%);
  touch-action: pan-y pinch-zoom;
}
.lp-reader-viewport:focus-visible { outline-offset: -3px; }
.lp-reader-spread {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  margin: 0 auto;
}
.lp-reader .lp-reader-spread img {
  display: block;
  margin: 0;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: min(68vh, 640px);
  object-fit: contain;
  border-radius: 0;
  background: #fff;
  box-shadow: 0 0.35rem 1rem #08120cb3;
}
.lp-reader .lp-reader-spread img:not(:only-child) { max-width: 50%; }
.lp-reader .lp-reader-turn {
  position: absolute;
  z-index: 1;
  max-width: none;
  margin: 0;
  object-fit: fill;
  pointer-events: none;
  border-radius: 0;
  animation: lp-reader-turn .4s ease-in-out both;
}
@keyframes lp-reader-turn {
  0% { opacity: 1; transform: rotateY(0); }
  65% { opacity: .94; }
  100% { opacity: 0; transform: rotateY(var(--lp-turn-angle)); }
}
.lp-reader-zoomed .lp-reader-viewport { max-height: 72vh; overflow: auto; touch-action: auto; }
.lp-reader-zoomed .lp-reader-spread { display: block; width: max-content; }
.lp-reader.lp-reader-zoomed .lp-reader-spread img { width: min(78rem, 178vw); max-width: none; max-height: none; }
.lp-reader-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.9rem;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1rem;
}
.lp-reader-navigation, .lp-reader-actions { display: flex; align-items: center; gap: 0.5rem; }
.lp-reader-position { min-width: 7rem; text-align: center; font-size: .92rem; font-variant-numeric: tabular-nums; }
.lp-reader button {
  min-height: 44px;
  padding: .4rem .75rem;
  border: 1px solid #71857a;
  border-radius: .45rem;
  background: #2b4035;
  color: var(--lp-reader-ink);
  font: inherit;
  font-size: .88rem;
  cursor: pointer;
}
.lp-reader-navigation button { min-width: 44px; padding: 0; font-size: 1.65rem; line-height: 1; }
.lp-reader button:hover:not(:disabled), .lp-reader button[aria-current], .lp-reader button[aria-pressed="true"] {
  border-color: var(--lp-reader-focus);
  background: #355747;
}
.lp-reader button:disabled { opacity: .48; cursor: default; }
.lp-reader-thumb-list { display: flex; gap: .55rem; flex-wrap: wrap; padding-top: .65rem; }
.lp-reader .lp-reader-thumb-list button { display: grid; justify-items: center; gap: .35rem; }
.lp-reader .lp-reader-thumb-list img { width: 72px; height: 84px; margin: 0; object-fit: contain; }
.lp-reader:fullscreen { overflow: auto; border-radius: 0; }
.lp-reader:fullscreen .lp-reader-spread img { max-height: min(78vh, 900px); }
.lp-reader.lp-reader-zoomed:fullscreen .lp-reader-spread img { max-height: none; }
@media (max-width: 540px) {
  .lp-reader-viewport { padding: .45rem; }
  .lp-reader-controls { padding-inline: .45rem; }
}
@media (prefers-reduced-motion: reduce) {
  .lp-reader .lp-reader-turn { display: none; }
}
