*{box-sizing:border-box}body{margin:0;background:#eef3f5;color:#153446;font-family:Arial,sans-serif}header{display:flex;justify-content:space-between;gap:20px;padding:20px 5%;background:#103c43;color:white}header a{color:white}main{max-width:1100px;margin:auto;padding:28px 20px}h1{font-size:22px;line-height:1.5;overflow-wrap:anywhere}.viewer-controls{display:flex;align-items:center;flex-wrap:wrap;gap:12px;position:sticky;top:0;z-index:3;background:#eef3f5;padding:12px 0}.viewer-controls button,.viewer-controls a{min-height:44px;padding:12px 16px;border:1px solid #aac6bf;border-radius:7px;background:white;color:#154e46;font:inherit;font-size:14px;cursor:pointer}.viewer-controls button:disabled{opacity:.45;cursor:default}.viewer-controls a{margin-left:auto;text-decoration:none;background:#103c43;color:white}#viewer-status{font-size:14px;line-height:1.6}#page-container{position:relative;margin:20px auto;max-width:100%;box-shadow:0 5px 24px #15344622;background:white}canvas{display:block;max-width:100%}.textLayer{position:absolute;inset:0;overflow:clip;line-height:1;text-align:initial;transform-origin:0 0;z-index:2}.textLayer :is(span,br){color:transparent;position:absolute;white-space:pre;cursor:text;transform-origin:0 0}.textLayer span::selection{background:#4b99cf66}.textLayer .markedContent{display:contents}.textLayer .endOfContent{display:block;position:absolute;inset:100% 0 0;z-index:-1;cursor:default;user-select:none}.textLayer .endOfContent.active{top:0}@media(max-width:600px){header{flex-direction:column;padding:16px}header strong{font-size:13px}main{padding:18px 12px}h1{font-size:18px}.viewer-controls{gap:8px;font-size:13px}.viewer-controls button,.viewer-controls a{padding:11px;font-size:12px}.viewer-controls a{margin-left:0}#page-container{margin-top:10px}}

#word-preview{display:block;width:100%;height:75vh;border:1px solid #cadbdc;background:white}#word-preview[hidden],[hidden]{display:none!important}
