:root{font-family:Arial,Helvetica,sans-serif;color:#e8edf5;background:#111d35;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 45%,#253958 0,#14223c 48%,#101b30 100%);min-height:100svh}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;border:1px solid #ffffff24;background:#ffffff07;color:inherit;border-radius:7px;cursor:pointer;min-height:42px;padding:8px 14px;transition:background .18s}button:hover{background:#ffffff18}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ff9b5c;outline-offset:4px}header{height:88px;border-bottom:1px solid #ffffff16;display:flex;align-items:center;justify-content:space-between;padding:0 5vw}.brand{display:flex;align-items:center;gap:16px;color:inherit;text-decoration:none;font-size:13px;font-weight:700;letter-spacing:1.4px}.brand small{display:block;font-size:8px;letter-spacing:1.6px;margin-top:8px;color:#a5b4c9}.monogram{font-family:Georgia,serif;font-size:30px;letter-spacing:-2px}.monogram span{font-size:18px;color:#ff985c;margin:0 5px}.muted{color:#a0adbf}.edition{font-size:10px;letter-spacing:2px;color:#a7b5c9}.edition b{display:block;font-size:15px;color:#f6f4ee;margin-top:6px;letter-spacing:1px}main{max-width:1440px;margin:auto;padding:28px 5vw 10px}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.eyebrow{font-size:9px;letter-spacing:2px;color:#efaa7c;margin:0 0 8px}h1{font-family:Georgia,serif;font-size:clamp(23px,2.6vw,34px);font-weight:400;margin:0}#thumb-toggle{font-size:12px}#reader{position:relative;background:#09122550;border:1px solid #ffffff12;border-radius:12px;overflow:hidden;box-shadow:0 24px 70px #0003}#stage{height:calc(100svh - 325px);min-height:320px;max-height:950px;display:flex;align-items:center;justify-content:center;padding:22px;position:relative;background:radial-gradient(ellipse,#34496344,transparent 70%)}#book{flex-shrink:0;box-shadow:0 12px 28px #0004}.book-page{background:#20355d;overflow:hidden}.book-page img{width:100%;height:100%;display:block;object-fit:fill}.controls{min-height:66px;display:flex;align-items:center;justify-content:center;gap:10px;border-top:1px solid #ffffff12;background:#101b2cbf}.controls button{border-color:transparent;font-size:17px}.controls button span{font-size:12px;vertical-align:middle}.page-label{font-size:12px;display:flex;align-items:center;gap:7px;color:#b7c3d3}input{width:42px;padding:6px 3px;text-align:center;border:1px solid #ffffff26;border-radius:4px;background:#ffffff08;color:#fff;font:inherit;appearance:textfield}input::-webkit-inner-spin-button{appearance:none}.divider{height:22px;border-left:1px solid #ffffff20;margin:0 8px}.hint{font-size:11px;color:#97a8bf;text-align:center;margin:15px 0}.hint span{padding:0 10px;color:#ed9d68}footer{padding:15px 5vw 24px;display:flex;justify-content:space-between;gap:15px;color:#7e90aa;font-size:9px;letter-spacing:.3px}footer span:first-child{color:#bbc7d6}#loading{position:absolute;color:#bbc7d6;font-size:13px}#thumbnails{border:1px solid #ffffff1c;border-radius:10px;background:#162640;padding:20px;margin-top:24px}.tray-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}h2{font-family:Georgia,serif;font-size:22px;font-weight:400;margin:0}#thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:16px}.thumb{padding:5px;border:2px solid transparent;background:transparent}.thumb img{width:100%;aspect-ratio:595/842;display:block;object-fit:contain}.thumb small{display:block;margin-top:7px;color:#b9c7db}.thumb[aria-current=true]{border-color:#f5a071;background:#ffffff09}#zoom-dialog{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#101a2b;color:#fff}#zoom-dialog[open]{display:flex;flex-direction:column}.zoom-toolbar{display:flex;align-items:center;gap:8px;padding:12px 20px;background:#192840;flex-shrink:0}.zoom-toolbar button{font-size:20px}.zoom-spacer{flex:1}#zoom-label,#zoom-level{font-size:12px;white-space:nowrap}#zoom-scroll{flex:1;overflow:auto;text-align:center;touch-action:pan-x pan-y pinch-zoom;padding:20px}#zoom-image{display:block;margin:0 auto;max-width:none;height:auto}.zoom-hint{margin:0;padding:9px;text-align:center;font-size:11px;color:#9bacbf;background:#192840}#reader:fullscreen{width:100vw;height:100dvh;border:0;border-radius:0;background:#13223b}#reader:fullscreen #stage{height:calc(100dvh - 66px);max-height:none}#reader:fullscreen .controls{height:66px}@media(max-width:640px){header{height:72px;padding:0 20px}.brand{font-size:10px;gap:10px;letter-spacing:1px}.brand small{font-size:6px;letter-spacing:.5px}.monogram{font-size:24px}.edition{display:none}main{padding:22px 12px 6px}.intro{padding:0 7px;margin-bottom:18px;gap:10px}.eyebrow{font-size:7px;letter-spacing:1.1px}h1{font-size:23px}#thumb-toggle{padding:8px;font-size:18px}#thumb-toggle span{display:none}#stage{height:calc(100svh - 280px);min-height:300px;padding:12px}.controls{gap:3px;min-height:60px}.controls button{padding:8px 10px}.controls button span{display:none}.divider{margin:0 4px}.hint{font-size:9px}.hint span{padding:0 3px}footer{padding:12px 20px 20px;justify-content:center;text-align:center}footer span:last-child{display:none}.zoom-toolbar{padding:8px;gap:5px}.zoom-toolbar button{padding:6px 10px}#zoom-scroll{padding:10px}#thumbnails{padding:14px}#thumb-grid{gap:8px;grid-template-columns:repeat(4,1fr)}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Promote only moving pages, avoiding repeated full-book filter rasterisation. */
.book-page img{user-select:none;-webkit-user-drag:none;object-fit:contain;background:#20355d}.book-page.stf__item{backface-visibility:hidden;-webkit-backface-visibility:hidden}.stf__item.--soft{will-change:transform}
/* Compact official branding keeps the prospectus as the main focus. */
header{height:80px;border-bottom:2px solid #ef4c24;padding:0 4vw;gap:24px}.brand{display:block;line-height:0;flex-shrink:1}.partnership-logo{display:block;width:250px;max-width:100%;height:auto}.header-actions{display:flex;align-items:center;gap:24px;flex-shrink:0}.edition{font-size:8px;letter-spacing:1.5px}.edition b{font-size:12px;margin-top:4px}main{max-width:none;padding:16px 3vw 4px}#stage{height:calc(100svh - 225px);max-height:none}#reader{border-radius:8px}.hint{margin:12px 0;font-size:10px}footer{padding:8px 3vw 14px}.thumb[aria-current=true]{border-color:#ef4c24}.hint span{color:#ef4c24}button:focus-visible,a:focus-visible,input:focus-visible{outline-color:#ef4c24}
@media(max-width:640px){header{height:68px;padding:0 18px;gap:15px}.partnership-logo{width:205px}.header-actions{gap:0}.edition{display:none}#thumb-toggle{min-width:40px}main{padding:10px 8px 2px}#stage{height:calc(100svh - 192px);padding:12px;min-height:280px}.hint{font-size:9px;margin:10px 0}footer{padding:8px 15px 12px}}

#zoom-book{margin:0 auto;flex-shrink:0;box-shadow:0 12px 28px #0004}#zoom-scroll{text-align:left}#zoom-book .book-page img{object-fit:fill}

@media(max-width:640px){.controls{gap:0}.controls button{padding:8px 7px;min-width:32px}.zoom-toolbar{gap:3px;padding:8px 5px}.zoom-toolbar button{padding:6px;min-width:32px}.zoom-toolbar #zoom-label{font-size:11px}.zoom-toolbar #zoom-level{font-size:10px}}
/* Quiet, compact chrome leaves most of the viewport to the booklet. */
header{height:54px;padding:0 22px;gap:16px}.partnership-logo{width:170px}.header-actions{gap:16px}.edition{font-size:7px;letter-spacing:1px}.edition b{font-size:10px;margin-top:2px}#thumb-toggle{min-height:30px;padding:4px 9px;font-size:11px}main{padding:8px 12px 0}#stage{height:calc(100svh - 136px);min-height:240px;padding:10px}.controls{min-height:40px;gap:4px}.controls button{min-height:30px;min-width:30px;padding:3px 8px;font-size:16px}.controls button span{font-size:10px}.page-label{font-size:10px;gap:4px}.page-label input{width:32px;padding:3px}.divider{height:16px;margin:0 5px}.hint{font-size:8px;margin:6px 0}footer{padding:3px 16px 6px;font-size:8px;gap:8px;justify-content:center}footer span:last-child{display:none}#reader:fullscreen #stage{height:calc(100dvh - 40px)}#reader:fullscreen .controls{height:40px;min-height:40px}.zoom-toolbar{padding:5px 8px;gap:5px}.zoom-toolbar button{min-height:30px;padding:3px 7px;font-size:17px}.zoom-hint{font-size:9px;padding:5px}
@media(max-width:640px){header{height:46px;padding:0 14px}.partnership-logo{width:145px}#thumb-toggle{min-height:28px;min-width:30px;padding:2px 7px;font-size:16px}main{padding:6px 5px 0}#stage{height:calc(100svh - 121px);padding:7px;min-height:240px}.controls{min-height:36px;gap:0}.controls button{min-height:28px;min-width:30px;padding:3px 7px}.controls .divider{margin:0 3px}.hint{font-size:8px;margin:5px 0}footer{font-size:7px;padding:2px 10px 5px}.zoom-toolbar{padding:4px;gap:2px}.zoom-toolbar button{min-height:30px;min-width:30px;padding:3px 5px}}

.page-label{white-space:nowrap}.page-label input{width:28px;border-color:transparent;background:transparent;padding:3px 0;border-radius:3px}.page-label input.page-range{width:43px}.page-label input:hover,.page-label input:focus{border-color:#ffffff35;background:#ffffff09}.controls{flex-wrap:wrap}.controls button{flex-shrink:0}

/* Tablet and phone viewport support, including browser bars and safe areas. */
body{overflow-x:hidden}header{padding-left:max(14px,env(safe-area-inset-left));padding-right:max(14px,env(safe-area-inset-right))}
#stage{height:calc(100dvh - 136px);min-height:100px}footer{padding-bottom:max(6px,env(safe-area-inset-bottom))}
#zoom-dialog{height:100dvh}.zoom-toolbar{padding-top:max(5px,env(safe-area-inset-top));padding-left:max(5px,env(safe-area-inset-left));padding-right:max(5px,env(safe-area-inset-right));flex-wrap:wrap}.zoom-hint{padding-bottom:max(5px,env(safe-area-inset-bottom))}#zoom-scroll{min-height:0;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}#book{touch-action:pan-y pinch-zoom}
@media(max-width:899px){.controls button span{display:none}.edition{display:none}.controls{gap:0;min-height:44px}.controls button{min-height:44px;min-width:36px;padding:4px 7px}.page-label{font-size:11px}.page-label input{min-height:36px;font-size:16px;width:28px}.page-label input.page-range{width:50px}.controls .divider{margin:0 2px}#stage{height:calc(100dvh - 132px)}.zoom-toolbar button{min-width:36px;min-height:44px;padding:4px}.zoom-toolbar{gap:2px}.zoom-toolbar #zoom-label{font-size:11px}.zoom-toolbar #zoom-level{font-size:10px}.zoom-spacer{min-width:0}#thumbnails{margin-top:12px}#thumb-toggle{min-width:40px;min-height:40px}header{height:50px}}
@media(pointer:coarse) and (min-width:900px){.controls{min-height:48px}.controls button{min-width:44px;min-height:44px}.zoom-toolbar button{min-width:44px;min-height:44px}#stage{height:calc(100dvh - 144px)}}
@media(max-height:500px) and (orientation:landscape){header{height:40px}.partnership-logo{width:130px}main{padding-top:4px}.hint,footer{display:none}#stage{height:calc(100dvh - 90px);padding:5px}.controls{min-height:40px}.controls button{min-height:40px}.zoom-hint{display:none}}
@media(max-width:359px){.controls button{min-width:30px;padding:4px}.page-label{gap:2px}.controls .divider{display:none}.zoom-toolbar button{min-width:30px}.zoom-toolbar{gap:0}#zoom-label{font-size:10px!important}}

#book,#zoom-book,#book .stf__block,#zoom-book .stf__block{touch-action:pan-y pinch-zoom}#book img,#zoom-book img{pointer-events:none}

/* Horizontal touch gestures belong to the reader; vertical scrolling remains native. */
#book,#zoom-book,#book .stf__block,#zoom-book .stf__block{touch-action:pan-y pinch-zoom}

/* Prevent browser scrolling from stealing swipes that start on the book. */
#book,#book *{touch-action:pinch-zoom}#zoom-book,#zoom-book *{touch-action:pinch-zoom}#zoom-scroll.zoom-pannable #zoom-book,#zoom-scroll.zoom-pannable #zoom-book *{touch-action:pan-y pinch-zoom}

#stage,#stage *{touch-action:pinch-zoom}

/* Pinch and pan are handled together, avoiding browser gesture cancellation. */
#stage,#stage *,#zoom-scroll,#zoom-scroll *{touch-action:none!important}#zoom-scroll{overscroll-behavior:contain}

/* Atmospheric blue surround with a restrained geometric light pattern. */
body{background:#101b30;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 12% 18%,#214f744d,transparent 48%),radial-gradient(ellipse at 90% 75%,#35416c55,transparent 52%),radial-gradient(ellipse at 70% 5%,#19607824,transparent 40%),linear-gradient(135deg,#0c1629 0%,#172a44 48%,#111b32 100%)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.65;background-image:repeating-linear-gradient(120deg,transparent 0,transparent 159px,#8dbbdd1a 160px,transparent 161px,transparent 320px),repeating-linear-gradient(30deg,transparent 0,transparent 159px,#8dbbdd12 160px,transparent 161px,transparent 320px);mask-image:linear-gradient(90deg,#000,transparent 42%,transparent 58%,#000);-webkit-mask-image:linear-gradient(90deg,#000,transparent 42%,transparent 58%,#000)}
header{background:#101b302b}#reader{background:transparent;border-color:#ffffff0b;box-shadow:none}#stage{background:radial-gradient(ellipse at 50% 50%,#54729412,transparent 65%)}.controls{background:#0c17252b}#reader:fullscreen{background:radial-gradient(ellipse at 15% 20%,#214f7433,transparent 55%),linear-gradient(135deg,#0c1629,#172a44 50%,#111b32)}
/* A pool of light and layered shadows give the booklet physical depth. */
#stage{isolation:isolate;overflow:visible;background:radial-gradient(ellipse at 50% 42%,#6b9ac321 0%,#40698e12 38%,transparent 72%)}
#stage::before{content:"";position:absolute;inset:3% 6% 0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,#83aed526,transparent 66%);filter:blur(22px)}
#book{position:relative;box-shadow:0 2px 5px #0005,0 15px 26px -8px #0008,0 32px 52px -16px #0007;outline:1px solid #ffffff0b}
#book::after{content:"";position:absolute;z-index:20;top:0;bottom:0;left:50%;width:24px;transform:translateX(-50%);pointer-events:none;opacity:0;background:linear-gradient(90deg,transparent,#00000024 38%,#00000042 49%,#ffffff10 52%,#00000018 65%,transparent)}
#book.has-spread::after{opacity:1}#book.is-turning::after{opacity:0}
#zoom-book{box-shadow:0 2px 5px #0005,0 16px 32px -8px #0009,0 30px 50px -14px #0006}
@media(max-width:640px){#stage::before{inset:5% 0;filter:blur(16px)}#book{box-shadow:0 2px 4px #0004,0 12px 24px -8px #0009,0 24px 36px -16px #0007}}
