/* Betrachter: Bedienelemente bleiben außerhalb des gezoomten Blattes. */
#viewer.viewer-dialog{padding:0;border:0;overflow:hidden;background:var(--cream,#fff4d8);color:var(--night,#081c39);width:min(1100px,calc(100vw - 32px));height:min(1000px,calc(100vh - 32px));height:min(1000px,calc(100dvh - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);border-radius:18px;box-shadow:0 22px 80px #0006}
#viewer::backdrop{background:#04132be8;backdrop-filter:blur(4px)}
.viewer-card{height:100%;display:flex;flex-direction:column;overflow:hidden;background:var(--cream,#fff4d8);border-radius:inherit}
.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 18px;flex-shrink:0}
.viewer-heading{min-width:0}
.viewer-heading p{font-size:12px;color:#435447;margin:0 0 3px;line-height:1.3}
.viewer-heading h2{font-family:var(--round,Georgia,serif);font-size:clamp(18px,2vw,26px);line-height:1.2;margin:0;overflow-wrap:anywhere}
.viewer-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font:inherit;font-weight:700;border:1px solid #7b856e;background:transparent;color:var(--night,#081c39);border-radius:24px;padding:8px 14px;text-align:center;line-height:1.25;cursor:pointer;text-decoration:none;touch-action:manipulation}
.viewer-button:hover:enabled{background:#e9ddbc}
.viewer-button:disabled{opacity:.4;cursor:default}
.viewer-card :focus-visible{outline:3px solid #26773b;outline-offset:3px}
#viewer-close{flex:0 0 44px;padding:0;font:30px/1 system-ui,sans-serif}
.viewer-tools{display:flex;gap:6px 10px;flex-wrap:wrap;align-items:center;padding:0 18px 9px;flex-shrink:0}
.viewer-tools .viewer-button{font-size:13px}
.viewer-tabs{display:flex;gap:2px;border:1px solid #87927c;border-radius:28px;padding:2px}
.viewer-tabs .viewer-button{min-height:44px;border:0;padding:7px 14px}
.viewer-tabs .viewer-button[aria-pressed=true]{color:var(--cream,#fff4d8);background:var(--navy,#102a4c)}
.viewer-body{min-height:0;flex:1;display:flex;background:#e6e1d2;overflow:hidden}
.viewer-sheet-pane{position:relative;flex:1;min-width:0;min-height:0;display:flex;overflow:hidden}
.viewer-image-stage{position:relative;flex:1;min-width:0;min-height:0;background:#e6e1d2;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:zoom-in}
.viewer-image-stage.viewer-zoomed{cursor:grab}
.viewer-image-transform{position:absolute;inset:0;transform-origin:center;will-change:transform}
.viewer-image-transform img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain;opacity:0;pointer-events:none;user-select:none;-webkit-user-select:none}
.viewer-image-transform img.viewer-loaded{opacity:1}
.viewer-image-small{z-index:0}
.viewer-image-large{z-index:1;transition:opacity .16s}
.viewer-loading{position:absolute;z-index:2;bottom:12px;left:50%;transform:translateX(-50%);background:#fff4d8ed;color:var(--night,#081c39);padding:8px 15px;border-radius:20px;margin:0;max-width:90%;width:max-content;font-size:12px}
.viewer-image-error{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);padding:18px;background:var(--cream,#fff4d8);border-radius:12px;text-align:center;max-width:90%;width:320px;box-shadow:0 4px 20px #0002}
.viewer-image-error p{margin:0 0 12px}
.viewer-reading{width:100%;min-width:0;overflow:auto;overscroll-behavior:contain;padding:clamp(20px,4vw,44px);background:#fffbef;color:#182c36;font-size:clamp(20px,2.4vw,26px);line-height:1.65;white-space:normal;overflow-wrap:anywhere}
.viewer-reading h3{font-size:1.4em;line-height:1.25;margin:0 0 1.2em}
.viewer-reading h4{font-size:1.15em;line-height:1.3;margin:1.4em 0 .6em}
.viewer-reading p,.viewer-reading blockquote{white-space:pre-line;margin:0 0 1.2em}
.viewer-reading blockquote{padding-left:1em;border-left:4px solid #7e9b65}
.viewer-video-pane{flex:1;min-width:0;min-height:0;background:#07182a;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;overflow:auto;color:var(--cream,#fff4d8)}
.viewer-video{display:block;width:100%;max-width:100%;height:auto;max-height:100%;object-fit:contain;background:#000;border-radius:6px}
.viewer-video-text{color:var(--cream,#fff4d8);border-color:#b6c5d4;flex-shrink:0}
.viewer-video-error{font-size:14px;padding:8px;color:var(--cream,#fff4d8)}
.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 18px;flex-shrink:0;font-size:13px}
.viewer-count{font-variant-numeric:tabular-nums;text-align:center;min-width:44px}
.viewer-footer .viewer-button{min-width:100px}
.viewer-body[data-view=sheet] .viewer-video-pane{display:none}
.viewer-body[data-view=video] .viewer-sheet-pane{display:none}
.viewer-body.viewer-video-only .viewer-sheet-pane{display:none}
.viewer-body.viewer-video-only .viewer-video-pane{display:flex}
@media(min-width:900px) and (orientation:landscape){
 .viewer-body.viewer-has-video .viewer-sheet-pane,.viewer-body.viewer-has-video .viewer-video-pane{display:flex}
 .viewer-body.viewer-has-video .viewer-sheet-pane{flex:1.05}
 .viewer-body.viewer-has-video .viewer-video-pane{flex:1}
 .viewer-body.viewer-has-video.viewer-video-only .viewer-sheet-pane{display:none}
 .viewer-tabs{display:none}
}
@media(max-width:899px){
 #viewer.viewer-dialog{width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100dvh;margin:0;border-radius:0}
 .viewer-card{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
 .viewer-header{padding:9px 12px;gap:8px}
 .viewer-heading p{font-size:11px}
 .viewer-heading h2{font-size:19px}
 .viewer-tools{padding:0 12px 7px;gap:5px}
 .viewer-tools .viewer-button{font-size:12px;padding:7px 10px}
 .viewer-footer{padding:7px 12px}
 .viewer-footer .viewer-button{min-width:86px;font-size:12px;padding:8px 11px}
 .viewer-video-pane{padding:10px}
}
@media(max-height:480px) and (orientation:landscape){
 .viewer-header{padding:4px 12px}
 .viewer-heading p{font-size:10px}
 .viewer-heading h2{font-size:17px}
 .viewer-tools{padding:0 12px 3px}
 .viewer-tools .viewer-button{font-size:11px;padding:4px 9px}
 .viewer-footer{padding:4px 12px}
}
@media(prefers-reduced-motion:reduce){.viewer-image-large{transition:none}#viewer::backdrop{backdrop-filter:none}}
