:is(#codexArchive,#codexPending),.archiveEditor,.archivePreview{box-sizing:border-box;width:min(1280px,calc(100vw - 24px));max-height:calc(100dvh - 24px);margin:auto;padding:16px;border:1px solid #ccd9e9;border-radius:14px;background:white;color:#163b55;overflow:auto}:is(#codexArchive,#codexPending) header,.archivePreview header{display:flex;align-items:center;gap:12px;background:#0b3651;color:white;padding:12px;border-radius:10px}:is(#codexArchive,#codexPending) h2{margin:0;font-size:23px}:is(#codexArchive,#codexPending) p{margin:8px 0;font-size:14px}:is(#codexArchive,#codexPending) .btn,.archiveEditor .btn,.archivePreview .btn{background:#1464e8!important;color:#fff!important;border:0;border-radius:8px;padding:9px 13px;min-height:40px;font-size:14px}:is(#codexArchive,#codexPending) .archiveBar{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}:is(#codexArchive,#codexPending) input,.archiveEditor input{box-sizing:border-box;min-width:0;padding:10px;border:1px solid #bdcfe3;border-radius:8px;font-size:16px}:is(#codexArchive,#codexPending) .archiveBar input{flex:1;min-width:200px}:is(#codexArchive,#codexPending) .archiveList{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,470px),1fr));gap:10px}:is(#codexArchive,#codexPending) article{padding:12px;border:1px solid #ccd9e9;border-radius:10px;min-width:0}:is(#codexArchive,#codexPending) h3{margin:0;font-size:17px}:is(#codexArchive,#codexPending) .archiveFile{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:8px}:is(#codexArchive,#codexPending) .archiveFile span{flex:1;min-width:180px;overflow-wrap:anywhere;font-size:13px}:is(#codexArchive,#codexPending) .archiveMissing{color:#986000}.archiveEditor{max-width:650px}.archiveEditor label{display:block;margin:10px 0}.archiveEditor input{display:block;width:100%;margin-top:4px}.archiveEditor .btn{margin-right:8px}.archivePreview{height:calc(100dvh - 24px);display:none}.archivePreview[open]{display:flex;flex-direction:column;gap:10px}.archivePreview iframe,.archivePreview img{width:100%;flex:1;min-height:0;object-fit:contain;border:0}#codexArchiveOpen{background:#1464e8;color:white}

:is(#codexArchive,#codexPending) .archivePicker{display:block;box-sizing:border-box;width:100%;min-width:0;max-width:100%;margin:10px 0 8px;padding:10px;border:1px solid #bdcfe3;border-radius:8px;background:white;color:#163b55;font-size:14px;text-overflow:ellipsis}
:is(#codexArchive,#codexPending) .archiveActions{display:flex;flex-wrap:nowrap;gap:6px;width:100%;margin-top:8px}
:is(#codexArchive,#codexPending) .archiveActions>.btn{flex:1 1 0!important;min-width:0!important;max-width:100%;width:0!important;padding:9px 4px!important;font-size:clamp(12px,1.2vw,14px)!important;white-space:nowrap!important;box-sizing:border-box}
:is(#codexArchive,#codexPending) .archiveUpload:not([hidden]){display:flex;gap:8px;margin-top:8px}:is(#codexArchive,#codexPending) .archiveUpload select{flex:1;min-width:0}:is(#codexArchive,#codexPending) .archiveUpload[hidden]{display:none!important}
.archiveEditor p{overflow-wrap:anywhere;font-size:14px;line-height:1.4}.archiveEditor a.btn{display:block;width:fit-content;margin:8px 0;text-decoration:none}#codexPending .pendingActions>.btn{white-space:normal!important;line-height:1.2}
.archiveEditor input[hidden]{display:none!important}

.archiveEditor.orderViewer[open]{display:flex!important;flex-direction:column!important;width:calc(100vw - 24px)!important;max-width:1500px!important;height:calc(100dvh - 24px)!important;padding:12px!important;gap:8px}.orderViewer>h2{display:none}.orderViewer header{display:flex;align-items:center;gap:12px;background:#0b3651;color:white;padding:8px;border-radius:10px}.orderViewer p{margin:0}.orderViewer select{padding:10px;width:100%;min-width:0}.orderViewer iframe{flex:1;min-height:0;width:100%;border:1px solid #ccd9e9;background:#f3f6fa}#codexPending input[hidden]{display:none!important}

.orderControls{display:flex;gap:6px;flex-wrap:wrap}.orderControls[hidden],.orderSurface[hidden]{display:none!important}.orderSurface{flex:1;min-height:0;overflow:auto;display:flex;align-items:flex-start;justify-content:center;background:#e9eef4}.orderSurface canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;background:white}.orderSurface.zoom canvas{max-height:none;width:100%;height:auto}.orderViewer select[hidden]{display:none!important}

.orderStage{position:relative;flex:1;min-height:0;overflow:hidden;background:#e9eef4}.orderStage[hidden]{display:none!important}.orderStage .orderSurface{position:absolute;inset:0;display:block;overflow:auto;padding:8px;box-sizing:border-box}.orderStage canvas{max-width:none;max-height:none;object-fit:initial;margin:auto}.orderStage .orderPageArrow{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:40px!important;min-width:40px!important;height:48px;padding:0!important;font-size:30px!important}.orderPagePrev{left:8px}.orderPageNext{right:8px}.orderStage .orderDownload{position:absolute;right:8px;top:8px;z-index:2;padding:8px 12px!important;font-size:14px!important;min-height:38px!important}.orderStage button[hidden]{display:none!important}
