:root{--accent:#7b8790;--navy:#071a2b;--surface:#1d303c;--toolbar:rgba(7,26,43,.97)}
[hidden]{display:none!important}
.reader-view{display:none}
*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#12232e;color:#fff}.viewer{height:100%;display:grid;grid-template-rows:58px 1fr;position:relative}.toolbar{height:58px;background:var(--toolbar);border-bottom:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:space-between;padding:0 18px;z-index:20}.identity{display:flex;align-items:center;gap:11px;min-width:0}.identity strong{font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45vw}.book-mark{width:25px;height:26px;display:flex;gap:2px}.book-mark i{width:12px;height:22px;border:1.7px solid var(--accent);margin-top:2px}.book-mark i:first-child{border-radius:2px 0 0 2px;transform:skewY(-7deg)}.book-mark i:last-child{border-radius:0 2px 2px 0;transform:skewY(7deg)}.tools{display:flex;gap:4px}.tools button,.tools a{width:38px;height:38px;border:0;border-radius:8px;background:transparent;color:#c7d1d8;display:grid;place-items:center;text-decoration:none}.tools button:hover,.tools a:hover{background:rgba(255,255,255,.1);color:#fff}.tools svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.tools #overviewButton svg{fill:currentColor;stroke:none}.stage{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 43%,#485965 0,#2c3f4b 43%,#182b37 100%);touch-action:none}.book{display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 24px 30px rgba(0,0,0,.42));transform-origin:center;transition:transform .18s ease;will-change:transform}.page{height:min(calc(100vh - 128px),calc((100vw - 170px)/1.414));aspect-ratio:.707/1;position:relative;background:#fff;overflow:hidden;cursor:zoom-in}.book.zoomed .page{cursor:zoom-out}.page canvas{width:100%;height:100%;display:block}.left-page{border-radius:3px 0 0 3px;border-right:1px solid rgba(0,0,0,.16)}.right-page{border-radius:0 3px 3px 0}.page-number{position:absolute;bottom:7px;right:9px;color:rgba(0,0,0,.55);background:rgba(255,255,255,.83);font-size:.65rem;padding:2px 5px;border-radius:3px}.left-page .page-number{right:auto;left:9px}.page.empty{background:transparent;box-shadow:none}.page.empty canvas,.page.empty .page-number{display:none}.nav{position:absolute;top:50%;transform:translateY(-50%);z-index:4;border:1px solid rgba(255,255,255,.15);width:50px;height:50px;border-radius:50%;background:rgba(4,17,25,.68);color:#fff;font-size:2.15rem;line-height:1;display:grid;place-items:center;backdrop-filter:blur(8px)}.nav:hover:not(:disabled){background:var(--accent)}.nav:disabled{opacity:.2;cursor:not-allowed}.prev{left:24px}.next{right:24px}.page-status{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);font-size:.72rem;color:#c2ccd2;background:rgba(4,17,25,.7);padding:7px 12px;border-radius:99px;backdrop-filter:blur(7px)}.loading{position:absolute;z-index:12;inset:0;background:#172a36;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px}.loading[hidden]{display:none}.loading strong{font-size:.92rem}.loading small{color:#9eacb5}.spinner{width:36px;height:36px;border:3px solid rgba(255,255,255,.18);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin-bottom:5px}.overview{position:absolute;z-index:30;inset:58px 0 0;background:rgba(8,23,33,.96);backdrop-filter:blur(15px);transform:translateY(105%);transition:transform .25s ease;display:flex;flex-direction:column}.overview.open{transform:none}.overview-head{height:62px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.1)}.overview-head button{background:transparent;border:0;color:white;font-size:1.8rem;padding:5px 10px}.thumbs{padding:25px;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:22px;overflow:auto}.thumb{border:0;background:none;color:white;padding:0;display:flex;flex-direction:column;gap:8px;align-items:center}.thumb canvas{width:100%;max-width:145px;background:#fff;box-shadow:0 8px 18px rgba(0,0,0,.33)}.thumb span{font-size:.72rem;color:#b8c4cb}.thumb.active canvas{outline:3px solid var(--accent);outline-offset:4px}.toast{position:absolute;z-index:50;left:50%;bottom:24px;transform:translate(-50%,20px);background:#071a2b;color:#fff;padding:11px 16px;border:1px solid rgba(255,255,255,.13);border-radius:9px;font-size:.78rem;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
.page-status{padding:7px 12px}.page-jump{display:flex;align-items:center;gap:4px;white-space:nowrap;font-variant-numeric:tabular-nums;line-height:1}.page-jump span,.page-jump input{font-size:1em;line-height:1}.page-jump input{width:3ch;height:1em;border:0;border-bottom:1px dashed rgba(255,255,255,.42);border-radius:0;background:transparent;color:inherit;padding:0;text-align:center;font-family:inherit;font-weight:400;outline:none;appearance:textfield;-moz-appearance:textfield}.page-jump input:hover{border-bottom-color:rgba(255,255,255,.75)}.page-jump input:focus{border-bottom-style:solid;border-bottom-color:var(--accent);box-shadow:none;color:#fff}.page-jump input::-webkit-outer-spin-button,.page-jump input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.tools .quality-button{font-size:.68rem;font-weight:850;letter-spacing:.02em}.tools .quality-button.active{background:var(--accent);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:760px){.viewer{grid-template-rows:54px 1fr}.toolbar{height:54px;padding:0 10px}.tools{gap:0}.tools button,.tools a{width:35px;height:35px}.tools #zoomIn,.tools #zoomOut{display:none}.identity strong{max-width:31vw}.book .left-page{display:none}.page{height:min(calc(100vh - 120px),calc(100vw - 44px)/.707);max-width:calc(100vw - 44px)}.prev{left:7px}.next{right:7px}.nav{width:42px;height:42px}.overview{inset:54px 0 0}.thumbs{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));padding:18px;gap:18px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}}
.page canvas.page-slide-new,.page canvas.page-slide-old{transition:transform .46s cubic-bezier(.22,.72,.24,1),opacity .46s ease;will-change:transform,opacity;backface-visibility:hidden}.page canvas.page-slide-new{z-index:1}.page canvas.page-slide-old{z-index:2;transform:translate3d(0,0,0)}.page.page-sliding .page-links,.page.page-sliding .page-number{opacity:0}.page-links,.page-number{transition:opacity .1s ease}
.page-links{position:absolute;inset:0;pointer-events:none}.page-link{position:absolute;display:block;pointer-events:auto;border:1px solid transparent;background:transparent;transition:background .16s,border-color .16s,box-shadow .16s;animation:none}.page-link:hover,.page-link:focus{border-color:color-mix(in srgb,var(--accent) 72%,transparent);background:color-mix(in srgb,var(--accent) 10%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent);outline:none}.page-link::after{content:"↗";position:absolute;right:5px;top:5px;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:.76rem;font-weight:800;opacity:.7;box-shadow:0 3px 9px rgba(0,0,0,.16);transition:opacity .15s,transform .15s}.page-link:hover::after,.page-link:focus::after{opacity:1;transform:scale(1.04)}.page-link::before{content:"Link öffnen";position:absolute;right:34px;top:5px;background:rgba(7,26,43,.9);color:#fff;border-radius:5px;padding:5px 8px;font-size:.66rem;font-weight:700;white-space:nowrap;opacity:0;transform:translateX(4px);transition:opacity .15s,transform .15s}.page-link:hover::before,.page-link:focus::before{opacity:1;transform:none}
@media(hover:none),(pointer:coarse){.page-link{background:transparent;border-color:transparent}.page-link::after{opacity:.76}.page-link::before{display:none}}
.book.zoomed .page{cursor:grab}.book.panning .page{cursor:grabbing}.book.panning{transition:none}.page canvas{user-select:none;-webkit-user-drag:none}
.book.single-cover .left-page{display:none}.book.single-cover .right-page{border-radius:3px;transform-origin:center center}
.book{position:relative;transform-style:preserve-3d;transition:transform .3s cubic-bezier(.22,.61,.24,1)}.book::before{content:"";position:absolute;z-index:12;pointer-events:none;top:0;bottom:0;left:50%;width:1px;transform:translateX(-.5px);background:rgba(0,0,0,.22)}.book::after{content:"";position:absolute;z-index:11;pointer-events:none;top:0;bottom:0;left:50%;width:64px;transform:translateX(-50%);background:linear-gradient(90deg,rgba(0,0,0,0),rgba(0,0,0,.12) 43%,rgba(0,0,0,.17) 50%,rgba(0,0,0,.1) 57%,rgba(0,0,0,0));mix-blend-mode:multiply}.book.single-cover::before,.book.single-cover::after{display:none}.page{transform-style:preserve-3d}.page canvas.page-slide-new,.page canvas.page-slide-old{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden}.page canvas.page-slide-new{z-index:1}.page canvas.page-slide-old{z-index:2}@media(max-width:760px){.book::before,.book::after{display:none}}
.turning-sheet{position:absolute;z-index:10;top:0;bottom:0;width:50%;transform-style:preserve-3d;will-change:transform,filter;pointer-events:none}.turning-sheet.turning-next{left:50%;transform-origin:left center}.turning-sheet.turning-prev{left:0;transform-origin:right center}.turning-face{position:absolute;inset:0;width:100%;height:100%;display:block;backface-visibility:visible;-webkit-backface-visibility:visible;background:#fff}.turning-front{z-index:2}.turning-back{z-index:1;transform:rotateY(180deg);opacity:0}.turning-sheet::after{content:"";position:absolute;inset:0;z-index:3;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(0,0,0,.13));opacity:.55;pointer-events:none}.turning-prev::after{background:linear-gradient(270deg,rgba(255,255,255,0),rgba(0,0,0,.13))}
.stationary-page{position:absolute;z-index:6;top:0;bottom:0;width:50%;pointer-events:none;overflow:hidden;background:#fff}.stationary-next{left:0}.stationary-prev{left:50%}.stationary-canvas{display:block;width:100%;height:100%}
.page canvas{position:absolute;inset:0}.page-links{z-index:2}.page-number{z-index:3}
.search-panel{position:absolute;z-index:35;top:58px;right:0;bottom:0;width:min(430px,100%);background:rgba(8,23,33,.98);box-shadow:-18px 0 35px rgba(0,0,0,.28);transform:translateX(105%);transition:transform .24s ease;display:flex;flex-direction:column}.search-panel.open{transform:none}.search-head{height:62px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.1)}.search-head button{background:transparent;border:0;color:#fff;font-size:1.8rem;padding:5px 10px}.search-form{padding:18px 20px 12px}.search-form label{display:block;color:#b9c5cc;font-size:.72rem;margin-bottom:7px}.search-form>div{display:flex}.search-form input{min-width:0;flex:1;height:42px;border:1px solid rgba(255,255,255,.2);border-radius:7px 0 0 7px;background:#fff;color:#152a36;padding:0 12px;font:inherit}.search-form button{height:42px;border:0;border-radius:0 7px 7px 0;background:var(--accent);color:#fff;font-weight:700;padding:0 15px}.search-summary{margin:0;padding:0 20px 13px;color:#aebbc3;font-size:.75rem}.search-results{overflow:auto;padding:0 12px 20px}.search-result{display:block;width:100%;text-align:left;border:0;border-top:1px solid rgba(255,255,255,.09);background:transparent;color:#fff;padding:13px 8px}.search-result:hover,.search-result:focus{background:rgba(255,255,255,.07);outline:none}.search-result strong{display:block;color:var(--accent);font-size:.76rem;margin-bottom:5px}.search-result span{display:block;color:#c7d1d7;font-size:.76rem;line-height:1.45}.search-result mark{background:color-mix(in srgb,var(--accent) 40%,transparent);color:#fff;border-radius:2px;padding:0 1px}.search-highlights{position:absolute;inset:0;z-index:1;pointer-events:none}.search-highlight{position:absolute;background:rgba(255,222,38,.48);outline:1px solid rgba(255,193,7,.88);border-radius:2px;mix-blend-mode:multiply}.page.search-page-hit::after{content:"Suchtreffer";position:absolute;left:8px;top:8px;z-index:3;background:var(--accent);color:#fff;border-radius:5px;padding:4px 7px;font-size:.62rem;font-weight:800;box-shadow:0 3px 9px rgba(0,0,0,.2)}
@media(max-width:760px){.search-panel{top:54px;width:100%}.identity strong{max-width:18vw}.tools button,.tools a{width:33px}}
.access-gate{position:fixed;z-index:1000;inset:0;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% 25%,#324955,#071a2b 72%);color:#102430}.access-gate[hidden]{display:none}.access-card{width:min(430px,100%);background:#fff;border-radius:20px;padding:36px;box-shadow:0 30px 90px rgba(0,0,0,.45)}.access-mark{display:flex;width:42px;height:40px;gap:3px;margin-bottom:22px}.access-mark i{width:20px;height:36px;border:2px solid var(--accent)}.access-mark i:first-child{border-radius:3px 0 0 3px;transform:skewY(-7deg)}.access-mark i:last-child{border-radius:0 3px 3px 0;transform:skewY(7deg)}.access-eyebrow{margin:0 0 9px;color:var(--accent);font-size:.68rem;font-weight:850;letter-spacing:.12em}.access-card h1{margin:0 0 10px;font-size:1.75rem}.access-intro{margin:0 0 24px;color:#687985;font-size:.86rem;line-height:1.55}.access-card label{display:block;margin:14px 0;font-size:.76rem;font-weight:780}.access-card input{display:block;width:100%;margin-top:7px;border:1px solid #cbd5db;border-radius:9px;padding:12px;font:inherit;outline:none}.access-card input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}.access-card button{width:100%;margin-top:12px;border:0;border-radius:9px;padding:13px;background:var(--accent);color:#fff;font:inherit;font-weight:800}.access-error{margin:10px 0 0;color:#b53020;background:#fff1ee;border-radius:8px;padding:10px 12px;font-size:.76rem}.access-card.shake{animation:accessShake .3s ease}@keyframes accessShake{25%{transform:translateX(-7px)}50%{transform:translateX(7px)}75%{transform:translateX(-4px)}}