.atlas-document-preview{box-sizing:border-box;width:min(1180px,calc(100vw - 32px));height:calc(100dvh - 32px);max-width:none;max-height:none;margin:auto;padding:0;border:1px solid #517781;border-radius:20px;background:#f4f5f0;color:#123841;box-shadow:0 24px 90px #0008;font:15px/1.5 system-ui,sans-serif;overflow:hidden}
.atlas-document-preview[open]{display:flex;flex-direction:column}.atlas-document-preview::backdrop{background:#061b24ba;backdrop-filter:blur(5px)}.dp-header{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#0c3540;color:#fff;padding:16px 22px}.dp-header>div:first-child{min-width:0}.dp-header small{color:#b5d8da}.dp-header h2{font-size:17px;margin:2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dp-actions,.dp-controls{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.atlas-document-preview button{font:inherit;border:1px solid #9cafb0;border-radius:10px;min-width:44px;min-height:44px;padding:8px 14px;color:#153b43;background:#fff;cursor:pointer}.atlas-document-preview button:disabled{opacity:.4;cursor:default}.atlas-document-preview button:focus-visible,.dp-viewport:focus-visible{outline:3px solid #34b8ca;outline-offset:2px}.atlas-document-preview [data-dp-export]{background:#e8eedc}.dp-controls{padding:10px 14px;border-bottom:1px solid #d3deda}.dp-status{font-size:12px;text-align:center;margin:4px 12px;min-height:18px}.dp-viewport{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:16px;box-sizing:border-box;scrollbar-gutter:stable;background:#dfe6e4}.dp-viewport canvas{display:block;margin:0 auto;background:white;box-shadow:0 4px 20px #12384122}.dp-text{max-height:26%;overflow:auto;padding:8px 20px;background:#fff}.dp-text div{white-space:pre-wrap;user-select:text}.dp-text[hidden]{display:none}.dp-text summary{cursor:pointer}.dp-actions{flex-shrink:0}
@media(max-width:680px){.atlas-document-preview{width:100vw;height:100dvh;border:0;border-radius:0}.dp-header{padding:12px;gap:8px;flex-wrap:wrap}.dp-header>div:first-child{flex:1 1 100%}.dp-header h2{font-size:15px}.dp-actions{justify-content:space-between;width:100%}.dp-actions button{flex:1}.dp-controls{gap:5px;padding:8px}.atlas-document-preview button{padding:7px 10px}.dp-viewport{padding:12px}}

.dp-paging,.dp-zoom{display:flex;align-items:center;gap:8px}.dp-controls{gap:18px}@media(max-width:680px){.dp-controls{flex-direction:column;gap:6px}}

body.workspace-open>.atlas-document-preview[open]{visibility:visible!important}
