/* One cared-for leather cover, turning around the folio's perforation line. */
@font-face{font-family:"Pinyon Script";src:url('/assets/PinyonScript-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
html[data-cover-pending]{overflow:hidden}
html[data-cover-pending]:not([data-cover-mounted])::before{content:"";position:fixed;inset:0;background:var(--desk,#ddd1ba);z-index:10000}
.binder-entrance{position:fixed;inset:0;z-index:10000;isolation:isolate;overflow:hidden;color:#f4ead5}
.cover-desk{position:absolute;inset:0;background:var(--desk,#ddd1ba);z-index:-1}
.cover-perspective{position:absolute;left:50%;top:18px;bottom:76px;width:min(calc(100% - 32px),calc((100dvh - 94px) * .72));transform:translateX(-50%);perspective:1900px;perspective-origin:left center}
.cover-leaf{position:absolute;inset:0;transform-origin:0 50%;transform-style:preserve-3d;will-change:transform}
.cover-spine{position:absolute;top:0;bottom:0;width:28px;height:100%;object-fit:cover;object-position:left center;border-radius:3px 0 0 3px;box-shadow:-3px 3px 5px #29170838}
.cover-front,.cover-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:3px 7px 7px 3px;box-shadow:5px 9px 24px #34241440}
.cover-front{container-type:inline-size;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;padding:clamp(12px,2.5cqw,24px) 7%;gap:clamp(8px,1.5cqw,14px)}
.cover-back{transform:rotateY(180deg);background:#5d4936 url('/assets/archive/cover-leather.webp') left center/100% 100%}
.cover-material{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;border-radius:inherit;z-index:-1}
.cover-university{position:relative;flex:none;width:clamp(120px,32%,260px);aspect-ratio:3/2}
.patch-backing{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.cover-ulb{position:absolute;left:15%;top:50%;transform:translateY(-50%);width:70%;height:auto;display:block}
.cover-title{position:relative;text-align:center;width:100%;min-width:0}
.cover-title h1{margin:0 auto;max-width:21ch;font:400 2.6rem/1.12 "Pinyon Script",var(--serif);font-size:clamp(1.6rem,8.8cqw,4.4rem);letter-spacing:0;color:#ecd080;overflow-wrap:anywhere;hyphens:auto}
.cover-title p{margin:18px 0 0;font:400 1.125rem/1.25 "Pinyon Script",var(--serif);font-size:clamp(.9375rem,4.7cqw,1.7rem);color:#e4c979}
@supports(background-clip:text){.cover-title h1,.cover-title p{background:#e6c66a url('/assets/archive/gold-leaf.webp') center/360px;background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:.5px .7px .6px #3b220b26}}
.cover-flags{position:relative;flex:none;width:min(490px,86%);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:5%}
.cover-flag{position:relative;min-width:0;aspect-ratio:3/2}
.cover-flag .patch-emblem{position:absolute;left:14%;top:23%;display:block;width:72%;height:54%;object-fit:contain}
.cover-skip{position:absolute;bottom:max(15px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);min-height:44px;padding:10px 18px;font:1rem/1.3 var(--sans);color:#473b2a;background:#f5eddc;border:1px solid #a38c6c;border-radius:2px;white-space:nowrap;cursor:pointer;box-shadow:1px 2px 0 #59432b1f}
.cover-skip:hover{background:#fff9ed}
.cover-skip:focus-visible{outline:3px solid #734e26;outline-offset:4px}
@media(max-width:35em){.cover-title h1{font-size:clamp(1.5rem,8.8cqw,3.8rem)}.cover-title p{font-size:clamp(.9375rem,4.7cqw,1.7rem);margin-top:16px}.cover-flags{width:100%;gap:3%}}
@media(max-height:420px){.cover-front{gap:4px;padding:6px 7%}.cover-university{width:105px}.cover-title h1{font-size:1.6rem;max-width:none}.cover-title p{font-size:.9375rem;margin-top:4px}.cover-flags{width:min(280px,100%)}.cover-skip{bottom:8px}}
@media(prefers-reduced-motion:reduce),print{.binder-entrance{display:none}html[data-cover-pending]{overflow:visible}html[data-cover-pending]::before{display:none}}

/* A single camera holds the live home page, its binding and the leather cover. */
.cover-camera{position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:0 0;will-change:transform}
html[data-cover-pending] .reading-ribbon{visibility:hidden}
.cover-front{padding:clamp(calc(12px * var(--cover-ink-scale,1)),2.5cqw,calc(24px * var(--cover-ink-scale,1))) 7%;gap:clamp(calc(8px * var(--cover-ink-scale,1)),1.5cqw,calc(14px * var(--cover-ink-scale,1)))}
.cover-university{width:clamp(calc(120px * var(--cover-ink-scale,1)),32%,calc(260px * var(--cover-ink-scale,1)))}
.cover-title h1{font-size:clamp(calc(1.6rem * var(--cover-ink-scale,1)),8.8cqw,calc(4.4rem * var(--cover-ink-scale,1)))}
.cover-title p{font-size:clamp(calc(.9375rem * var(--cover-ink-scale,1)),4.7cqw,calc(1.7rem * var(--cover-ink-scale,1)));margin-top:calc(18px * var(--cover-ink-scale,1))}
.cover-flags{width:min(calc(490px * var(--cover-ink-scale,1)),86%)}
@media(max-width:35em){.cover-title h1{font-size:clamp(calc(1.5rem * var(--cover-ink-scale,1)),8.8cqw,calc(3.8rem * var(--cover-ink-scale,1)))}.cover-flags{width:100%}}
@media(max-height:420px){.cover-front{gap:calc(4px * var(--cover-ink-scale,1));padding:calc(6px * var(--cover-ink-scale,1)) 7%}.cover-university{width:calc(105px * var(--cover-ink-scale,1))}.cover-title h1{font-size:calc(1.6rem * var(--cover-ink-scale,1))}.cover-title p{font-size:calc(.9375rem * var(--cover-ink-scale,1));margin-top:calc(4px * var(--cover-ink-scale,1))}.cover-flags{width:min(calc(280px * var(--cover-ink-scale,1)),100%)}}
