/* ---------- document viewer ---------- */
#viewer{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;
  opacity:0;pointer-events:none;transition:opacity .5s cubic-bezier(.32,.72,0,1)}
#viewer.on{opacity:1;pointer-events:auto}
#viewer::before{content:'';position:absolute;inset:0;z-index:0;
  background:var(--viewer-scrim);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
#viewerBar{position:relative;z-index:2;flex:0 0 auto;margin:22px 22px 0;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:13px 20px;border-radius:18px;
  background:var(--panel-bg);background-image:var(--panel-img);
  -webkit-backdrop-filter:var(--panel-blur);backdrop-filter:var(--panel-blur);
  border:.5px solid var(--panel-line);
  box-shadow:var(--panel-shadow),inset 0 1px 0 var(--glass-top),inset 0 -1px 0 var(--glass-bot)}
#viewerMeta{display:flex;align-items:baseline;gap:10px;min-width:0}
#viewerKind{font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--tx-3);font-weight:600;flex:0 0 auto}
#viewerName{font-size:14.5px;color:var(--tx);font-weight:500;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
#viewerNav{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.vbtn{width:30px;height:30px;border-radius:50%;border:.5px solid var(--chip-line);
  background:var(--chip);display:flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:14px;color:var(--tx-2);transition:background .25s,transform .25s,color .25s}
.vbtn:hover{background:var(--hover);color:var(--tx);transform:scale(1.07)}
.vbtn.disabled{opacity:.32;pointer-events:none}
#viewerPageInfo,#viewerZoomInfo{font-size:12px;color:var(--tx-3);min-width:44px;
  text-align:center;font-variant-numeric:tabular-nums}
#viewerNav .vbtn+#viewerPageInfo,#viewerNav .vbtn+#viewerZoomInfo{margin-right:2px}

#viewerBody{position:relative;z-index:1;flex:1 1 auto;margin:14px 22px 22px;
  border-radius:22px;overflow:hidden;display:flex;align-items:center;justify-content:center}
#viewerBody>div{display:none}

#viewerEmpty{display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:10px;color:var(--tx-3)}
#viewerEmptyIcon{font-size:38px;color:var(--tx-3);opacity:.55;margin-bottom:6px}
#viewerEmptyTitle{font-family:'Fraunces',Georgia,serif;font-size:22px;
  font-weight:440;color:var(--tx-2)}
#viewerEmptyHint{font-size:13.5px;color:var(--tx-3);margin-bottom:14px}

#viewerLoading{display:none;flex-direction:column;align-items:center;gap:14px;color:var(--tx-3)}
.spinner{width:26px;height:26px;border-radius:50%;
  border:2px solid var(--chip-line);border-top-color:var(--accent);
  animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

#pdfHost{width:100%;height:100%;overflow:auto;display:flex;flex-direction:column;
  align-items:center;gap:18px;padding:28px 0 40px}
#pdfHost canvas{box-shadow:0 18px 50px -18px rgba(0,0,0,.4);border-radius:3px;
  background:#fff;max-width:calc(100% - 56px)}

#docxHost{width:100%;height:100%;overflow:auto;display:flex;justify-content:center;padding:44px 0 60px}
#docxHost .page{width:min(760px,calc(100% - 56px));background:var(--doc-page-bg);
  border-radius:14px;padding:64px 72px;box-shadow:0 18px 50px -18px rgba(0,0,0,.35);
  font-family:'Source Sans 3',sans-serif;font-size:16px;line-height:1.7;color:var(--doc-ink)}
#docxHost .page h1{font-family:'Fraunces',Georgia,serif;font-size:30px;font-weight:500;
  margin:0 0 18px;line-height:1.2;color:var(--doc-ink)}
#docxHost .page h2{font-family:'Fraunces',Georgia,serif;font-size:23px;font-weight:500;
  margin:32px 0 12px;color:var(--doc-ink)}
#docxHost .page h3{font-size:17px;font-weight:600;margin:26px 0 10px;color:var(--doc-ink)}
#docxHost .page p{margin:0 0 15px}
#docxHost .page ul,#docxHost .page ol{margin:0 0 15px;padding-left:26px}
#docxHost .page li{margin-bottom:6px}
#docxHost .page img{max-width:100%;border-radius:6px;margin:10px 0}
#docxHost .page table{border-collapse:collapse;width:100%;margin:0 0 18px;font-size:14.5px}
#docxHost .page td,#docxHost .page th{border:1px solid var(--doc-rule);padding:8px 11px;text-align:left}
#docxHost .page a{color:var(--accent)}
#docxHost .page strong{font-weight:600}

#pptxHost{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:20px;padding:20px 0}
#pptxHost .slide{width:min(880px,calc(100% - 80px));aspect-ratio:16/9;
  background:var(--doc-page-bg);border-radius:14px;box-shadow:0 18px 50px -18px rgba(0,0,0,.35);
  padding:44px 52px;display:flex;flex-direction:column;overflow:hidden;position:relative}
#pptxHost .slide-num{position:absolute;bottom:14px;right:20px;font-size:11px;color:var(--doc-ink-3)}
#pptxHost .slide h2{font-family:'Fraunces',Georgia,serif;font-size:25px;font-weight:500;
  color:var(--doc-ink);margin:0 0 16px;line-height:1.25}
#pptxHost .slide ul{margin:0;padding-left:24px;font-size:15px;line-height:1.65;color:var(--doc-ink-2)}
#pptxHost .slide li{margin-bottom:9px}
#pptxHost .slide .body-text{font-size:15px;line-height:1.65;color:var(--doc-ink-2);white-space:pre-wrap}
#pptxHost .slide-imgs{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
#pptxHost .slide-imgs img{max-height:120px;border-radius:6px}
#pptxHost .slide-notes{width:min(880px,calc(100% - 80px));font-size:12.5px;color:var(--tx-3);
  font-style:italic;line-height:1.5}

#imgHost{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:20px}
#imgHost img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;
  box-shadow:0 18px 50px -18px rgba(0,0,0,.4)}

#vidHost{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:20px}
#vidHost video{max-width:100%;max-height:100%;border-radius:14px;
  box-shadow:0 18px 50px -18px rgba(0,0,0,.45)}
