:root{font-family:Segoe UI,sans-serif;line-height:1.5;color:#0f1f30;background:linear-gradient(160deg,#e8eef8,#f6f9fd 45%,#dde9f9)}body{margin:0;min-height:100vh;padding:1rem}.app{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);gap:1rem;align-items:start}.panel{background:#ffffffd1;border:1px solid #c6d4e7;border-radius:12px;box-shadow:0 10px 30px #3a55771f}.status-panel{padding:1rem}.status-panel h1{font-size:1.2rem;margin:0 0 .75rem}pre{margin:0;background:#f2f6fc;border:1px solid #d7e2f0;padding:1rem;border-radius:8px;overflow:auto}.viewer-panel{padding:.9rem}.viewer-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem;margin-bottom:.75rem}.viewer-toolbar button{border:1px solid #9fb6d4;background:#f8fbff;color:#103159;border-radius:8px;padding:.45rem .85rem;cursor:pointer}.viewer-toolbar button:disabled{opacity:.7;cursor:default}.selected-file{font-size:.9rem;color:#355277;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-status-row{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin-bottom:.75rem}.hidden-file-input{display:none}.viewer-canvas-wrap{position:relative;width:100%;height:min(72vh,620px);border-radius:10px;overflow:hidden;border:1px solid #9ab4d6}.viewer-canvas-wrap.drag-over{outline:3px solid rgba(79,134,203,.55);outline-offset:-3px}.viewer-canvas{display:block;width:100%;height:100%}.viewer-hint{position:absolute;left:.75rem;bottom:.6rem;margin:0;padding:.2rem .45rem;border-radius:6px;background:#ffffffd1;font-size:.8rem;color:#33567f}.viewer-error{margin:.75rem 0 0;color:#9e1f1f}@media (max-width: 900px){.app{grid-template-columns:1fr}.viewer-canvas-wrap{height:58vh}}