/* Paper edges, a cloth spine and a physical page turn. Comics are never cropped. */
.album-stage{background:#ecebdc;padding:30px 68px 34px;overflow:hidden}
.album-image-button{overflow:visible;perspective:1800px}
.book-page{position:relative;flex:none!important;min-width:0;min-height:0;margin:auto;background:#fcfaf3;border-radius:2px 7px 7px 2px;perspective:1800px;transform-style:preserve-3d;isolation:isolate;box-shadow:1px 2px 0 #e6ddc8,2px 4px 0 #fcf8ed,3px 6px 0 #c4b69a,4px 8px 0 #f8f2e3,5px 11px 0 #637b54,7px 16px 25px #27372228}
.book-page:before{content:"";position:absolute;top:-5px;bottom:-11px;left:-14px;width:18px;background:linear-gradient(90deg,#435f3d,#879a6c 58%,#c7d0ac 82%,#647d53);border-radius:5px 0 0 6px;box-shadow:-2px 2px 7px #29371d18;z-index:-1}
.book-page:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;border-radius:inherit;background:linear-gradient(90deg,#403e262e 0,transparent 2%,#ede7d725 3%,transparent 6%);box-shadow:inset -1px 0 #ded4bd70}
.book-page>img,.comic-dialog .reader-body .book-page>img{display:block;position:relative;width:100%;height:100%;max-width:100%;max-height:100%;min-height:0;object-fit:contain;background:#fcfaf3;border-radius:inherit;margin:0;filter:none;flex:none;box-shadow:none}
.turn-sheet{position:absolute;inset:0;z-index:5;pointer-events:none;transform-origin:left center;transform-style:preserve-3d;will-change:transform}
.turn-face{position:absolute;inset:0;overflow:hidden;border-radius:2px 7px 7px 2px;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fcfaf3;box-shadow:3px 1px 17px #14230d35}
.turn-front{transform:translateZ(.4px)}
.turn-front:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#574d303d,transparent 8%,transparent 70%,#e1d8bf44);pointer-events:none}
.turn-face img,.comic-dialog .reader-body .turn-face img{width:100%;height:100%;max-width:none;max-height:none;margin:0;object-fit:contain;border-radius:inherit;background:#fcfaf3;flex:none}
.turn-back{transform:rotateY(180deg);background:linear-gradient(90deg,#ddd2b7,#faf5e6 15%,#fcf8ec 80%,#e4d9bf);box-shadow:-3px 1px 19px #14230d2a}
.turn-back:after{content:"";position:absolute;left:7%;right:7%;bottom:6%;height:1px;background:#a79b7740}
.comic-dialog .reader-body{padding:20px 40px 27px;perspective:1800px;overflow:hidden;background:#203729}
.comic-dialog .reader-body .book-page{margin:auto;align-self:center}
.comic-dialog .reader-body.zoomed{overflow:auto;perspective:none}
.comic-dialog .reader-body.zoomed .book-page{width:1536px!important;height:auto!important;margin:0;box-shadow:none;perspective:none;transform-style:flat}
.comic-dialog .reader-body.zoomed .book-page:before,.comic-dialog .reader-body.zoomed .book-page:after{display:none}
.comic-dialog .reader-body.zoomed .book-page>img{width:1536px;max-width:none;height:auto;max-height:none;border-radius:0}
.reader-kicker,.album-eyebrow{letter-spacing:.18em}
@media(max-width:850px){.album-stage{padding:24px 55px 29px}}
@media(max-width:600px){.album-stage{padding:15px 9px 62px}.book-page:before{left:-10px;width:13px;top:-3px;bottom:-8px}.book-page{box-shadow:1px 2px 0 #e6ddc8,2px 4px 0 #fcf8ed,3px 6px 0 #c4b69a,4px 8px 0 #637b54,5px 10px 16px #27372228}.comic-dialog .reader-body{padding:12px 13px 18px}.comic-dialog .reader-body.zoomed .book-page{width:1100px!important}.comic-dialog .reader-body.zoomed .book-page>img{width:1100px}.album-arrow{bottom:8px}}
@media(prefers-reduced-motion:reduce){.turn-sheet{display:none!important}.book-page{perspective:none}}
@media print{.album-stage{padding:0;background:white}.book-page{width:100%!important;height:auto!important;box-shadow:none;perspective:none}.book-page>img{height:auto}.book-page:before,.book-page:after,.turn-sheet{display:none}}

/* A shared paper size keeps all page changes steady. */
.album-stage{padding:14px 60px 21px}
.album-caption{padding:13px 22px 14px}
.album-caption h3{margin:3px 0 4px}
.album-thumbnails-bar{padding-top:10px}
.album-hint{padding-bottom:10px}
.comic-dialog{width:calc(100% - 12px);height:98dvh;max-width:1600px}
.comic-dialog[open]{grid-template-rows:52px 44px 44px minmax(0,1fr) 64px 32px}
.comic-dialog .reader-toolbar{padding:5px 18px}
.comic-dialog .reader-kicker{font-size:8px}
.comic-dialog .reader-toolbar h2{font-size:14px;line-height:1.5}
.comic-dialog .icon-button{width:40px;height:40px}
.comic-dialog .reader-tools{padding:3px 18px}
.comic-dialog .playback-controls{padding:3px 18px}
.comic-dialog .reader-body{padding:8px 20px 17px;scrollbar-gutter:auto}
.comic-dialog .reader-thumbnails{padding:5px 14px;gap:7px}
.comic-dialog .reader-thumb{height:52px;flex-basis:64px;padding:3px}
.album-hint{height:50px;padding:4px 16px;display:flex;align-items:center;justify-content:center}
.album-hint .album-note{margin:0;padding:0;background:none;border:0;font-size:11px;line-height:1.6}
.album-hint:has(.album-note:not([hidden])) .album-tip{display:none}
.comic-dialog .reader-footer{display:flex;align-items:center;justify-content:center;padding:2px 12px}
.comic-dialog .reader-footer .reader-note{margin:0;padding:0;background:none;border-radius:0;color:#f2dda9;font-size:10px;line-height:1.5}
.comic-dialog .reader-footer:has(.reader-note:not([hidden])) .reader-tip{display:none}
@media(max-width:850px){.album-stage{padding-inline:53px}}
@media(max-width:600px){
  .album-stage{padding:8px 9px 59px}
  .album-caption{padding:11px 14px 12px}
  .comic-dialog{width:100%;height:100dvh;max-height:100dvh}
  .comic-dialog[open]{grid-template-rows:49px 44px 46px minmax(0,1fr) 59px 48px}
  .comic-dialog .reader-toolbar{padding:3px 12px}
  .comic-dialog .reader-toolbar h2{font-size:12px}
  .comic-dialog .reader-kicker{font-size:7px}
  .comic-dialog .reader-tools,.comic-dialog .playback-controls{padding:2px 12px}
  .comic-dialog .reader-body{padding:5px 12px 13px}
  .comic-dialog .reader-thumbnails{padding:4px 8px}
  .comic-dialog .reader-thumb{height:49px;flex-basis:60px}
  .album-hint{height:64px}
  .album-hint .album-note,.comic-dialog .reader-footer .reader-note{font-size:9px}
}
@media print{.album-stage{height:auto!important;padding:0}}