.book #catalog:has(.leaf[data-page="1"].visible)::before{content:"";display:block;width:calc((100dvh - 220px)*150/190);max-width:calc((100vw - 60px)/2);flex-shrink:0}
.book .leaf[data-page="1"],.book .leaf[data-page="2"]{background:transparent}
.book .leaf[data-page="1"]{position:relative;isolation:isolate}
.book .leaf[data-page="1"]::before{content:"";position:absolute;inset:0;background:white url('assets/book-final22-original-3.jpg') center/100% 100% no-repeat;z-index:-1}
.punched-composition{background:transparent!important;aspect-ratio:150/190;mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
.punched-front{-webkit-mask-image:url(book-cover-front-final16-mask.svg);mask-image:url(book-cover-front-final16-mask.svg)}
.punched-back{-webkit-mask-image:url(book-cover-back-final16-mask.svg);mask-image:url(book-cover-back-final16-mask.svg)}
.punched-composition>img,.punched-composition>svg{display:block;width:100%;height:100%}
.punched-turn-overlay{position:fixed;z-index:16;perspective:2200px;pointer-events:none}
.punched-turn-sheet{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:left center;will-change:transform}
.punched-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:transparent}
.punched-face-front{transform:rotateY(0deg)}
.punched-face-back{transform:rotateY(180deg)}
.punched-face .composition{width:100%;height:100%}
@media(max-width:700px){.book .leaf[data-page="1"]{width:49vw;max-width:49vw}.book #catalog:has(.leaf[data-page="1"].visible)::before{width:49vw;max-width:49vw}}

.book[data-device="desktop"] #catalog:has(.leaf[data-page="1"].visible)::before{width:calc((100dvh - 172px)*150/190)}

/* Welcome is a stationary layer underneath the punched cover. */
.book-welcome{display:none}
.book[data-device="desktop"] #catalog{position:relative;isolation:isolate;--welcome-width:min(calc((100dvh - 172px)*150/190),calc((100vw - 60px)/2))}
.book[data-device="desktop"] #catalog>.leaf{z-index:1}
.book[data-device="desktop"] #catalog:has(.leaf[data-page="1"].visible,.leaf[data-page="2"].visible)>.book-welcome{display:flex;position:absolute;z-index:0;left:calc(50% - var(--welcome-width));top:24px;width:var(--welcome-width);aspect-ratio:150/190;align-items:center;padding:28px clamp(24px,4vw,64px);color:#53464e}
.book-welcome h1{font:400 clamp(25px,2.6vw,38px)/1.14 Minion,Georgia,serif;margin:0 0 25px;letter-spacing:0}
.book-welcome p{font:400 clamp(13px,1.15vw,16px)/1.65 Avenir,sans-serif;margin:0 0 17px}
.book-welcome p.book-welcome-end{font-family:Minion,Georgia,serif;font-size:21px;margin-top:23px;margin-bottom:0}
@media(max-height:700px){.book[data-device="desktop"] #catalog:has(.leaf[data-page="1"].visible,.leaf[data-page="2"].visible)>.book-welcome{padding:12px 24px}.book-welcome h1{font-size:25px;margin-bottom:15px}.book-welcome p{font-size:12px;line-height:1.5;margin-bottom:12px}.book-welcome p.book-welcome-end{font-size:18px;margin-top:15px}}

/* Approved header and centered 60 percent welcome text. */
.book .topbar .edition{display:none}

.book .book-welcome p:not(.book-welcome-end){text-align:justify;text-align-last:left;hyphens:auto;-webkit-hyphens:auto}

.book[data-device="desktop"] #catalog>.book-welcome{padding:0!important;justify-content:center}
.book .book-welcome>div{width:60%;flex:none;margin-inline:auto}

.book-welcome-logo{display:block;width:90px;height:auto;margin:0 0 24px;filter:brightness(0)}
.book-team-signature{display:block;width:100%;max-width:330px;height:auto;margin-top:20px;color:#53464e}
@media(max-height:700px){.book-welcome-logo{width:60px;margin-bottom:15px}.book-team-signature{max-width:260px;margin-top:12px}}

/* Tablet: Begrüßung auch im Blättermodus, mit Platz für die Ansichtsleiste. */
.book[data-device="tablet"] #catalog{position:relative;isolation:isolate;--welcome-width:min(calc((100dvh - 220px)*150/190),calc((100vw - 60px)/2))}
.book[data-device="tablet"] #catalog>.leaf{z-index:1}
.book[data-device="tablet"] #catalog:has(.leaf[data-page="1"].visible,.leaf[data-page="2"].visible)>.book-welcome{display:flex;position:absolute;z-index:0;left:calc(50% - var(--welcome-width));top:24px;width:var(--welcome-width);aspect-ratio:150/190;align-items:center;justify-content:center;padding:0;color:#53464e}
.book[data-device="tablet"] .book-welcome>div{width:80%}
.book[data-device="tablet"] .book-welcome-logo{width:60px;margin-bottom:14px}
.book[data-device="tablet"] .book-welcome h1{font-size:clamp(21px,2.4vw,28px);margin-bottom:14px}
.book[data-device="tablet"] .book-welcome p{font-size:12px;line-height:1.5;margin-bottom:12px}
.book[data-device="tablet"] .book-welcome p.book-welcome-end{font-size:18px;line-height:1.25;margin-top:14px;margin-bottom:0}
.book[data-device="tablet"] .book-team-signature{margin-top:12px}
