.intro-overlay{display:none;position:fixed;inset:0;z-index:40;overflow:hidden;isolation:isolate}
.intro-active .intro-overlay{display:block}.intro-active #book{pointer-events:none}.intro-active #book #scene{opacity:0}
.intro-backdrop{position:absolute;inset:0;background:#e6edf0;overflow:hidden}.intro-backdrop video,.intro-last-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}.intro-last-frame{opacity:0;pointer-events:none}.intro-backdrop.is-last .intro-last-frame{opacity:1}
.intro-skip{position:absolute;right:26px;top:24px;z-index:4;border:1px solid #6d97a756;background:#fffdf4cc;padding:9px 13px;border-radius:2px;font-size:12px;letter-spacing:1px;color:#386d85;cursor:pointer;backdrop-filter:blur(8px)}.intro-skip span{padding-left:9px}.intro-skip:hover{background:#fffdf4}
.intro-paper-window{position:absolute;inset:0;pointer-events:none;z-index:2;perspective:1600px}#intro-paper{position:absolute;display:block;object-fit:fill;box-shadow:2px 8px 18px #24495c20;transform-origin:center;will-change:transform,left,top,width,height}#intro-paper[hidden]{display:none}

@media(max-width:700px){.intro-skip{right:16px;top:18px;font-size:11px;padding:8px 11px}}
@media(max-height:500px){.intro-skip{top:14px;right:16px}}

.rotate-prompt{display:none}
@media (pointer:coarse) and (orientation:portrait) and (max-width:767px){
  .rotate-prompt{display:grid;position:fixed;inset:0;z-index:50;place-items:center;padding:24px;background:#f4f3e8;color:#087bb9;text-align:center}
  .rotate-message{width:min(100%,330px);padding:32px 12px;border-block:3px double #087bb9}
  .rotate-edition{display:block;margin-bottom:26px;font-size:12px;letter-spacing:.18em}
  .rotate-message h1{margin:14px 0 8px;font-size:30px;letter-spacing:.08em}
  .rotate-message p{margin:0;color:#396779;font-size:14px}
}
