*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--toolbar-height:44px;--props-width:280px;--bg-primary:#1e1e1e;--bg-toolbar:#2d2d2d;--bg-page:#525659;--bg-panel:#252526;--text-primary:#e0e0e0;--text-secondary:#999;--accent:#4a9eff;--border:#444;--selection:#4a9eff;--handle-size:8px}html,body{height:100%;color:var(--text-primary);background:var(--bg-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;overflow:hidden}#app{flex-direction:column;height:100%;display:flex}#toolbar{height:var(--toolbar-height);background:var(--bg-toolbar);border-bottom:1px solid var(--border);user-select:none;flex-shrink:0;justify-content:center;align-items:center;gap:2px;padding:0 8px;display:flex}.toolbar-group{align-items:center;gap:2px;display:flex}.tb{color:var(--text-primary);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;border-radius:0;align-items:center;gap:4px;padding:4px 8px;font-size:12px;line-height:1;display:flex}.tb svg{flex-shrink:0}.tb:hover{border-color:var(--border);background:#ffffff1a}.tb:active{background:#ffffff2e}.tb:disabled{opacity:.35;cursor:default;pointer-events:auto}.tb:disabled:hover{background:0 0;border-color:#0000}.toolbar-tooltip{color:#eee;white-space:nowrap;pointer-events:none;z-index:200;opacity:0;background:#111;border-radius:0;padding:4px 8px;font-size:11px;transition:opacity .1s;position:fixed;box-shadow:0 2px 6px #0006}.toolbar-tooltip.visible{opacity:1}.tool-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.tool-btn.active:hover{background:#5aadff;border-color:#5aadff}.toolbar-sep{background:var(--border);flex-shrink:0;width:1px;height:24px;margin:0 4px}.toolbar-label{color:var(--text-secondary);text-align:center;min-width:44px;font-size:12px}.page-input{width:36px;color:var(--text-primary);text-align:center;background:#0000004d;border:none;border-radius:0;outline:none;padding:2px 4px;font-family:inherit;font-size:13px}.page-input:focus{outline:1px solid var(--accent);background:#00000080}.page-input:disabled,.zoom-input:disabled{opacity:.35;cursor:default}.page-total{color:var(--text-secondary);margin:0 2px;font-size:13px}.zoom-input{width:48px;color:var(--text-primary);text-align:center;background:#0000004d;border:none;border-radius:0;outline:none;padding:2px 4px;font-family:inherit;font-size:13px}.zoom-input:focus{outline:1px solid var(--accent);background:#00000080}#main-area{flex:1;display:flex;overflow:hidden}.thumb-toggle-btn{background:var(--bg-toolbar);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;z-index:5;padding:6px;display:none;position:absolute;top:50%;left:8px;transform:translateY(-50%)}.thumb-toggle-btn:hover{color:var(--text-primary);background:#ffffff1a}.thumb-toggle-btn.visible{display:block}#thumbnail-sidebar.hidden{display:none!important}#thumbnail-sidebar{background:var(--bg-primary);border-right:1px solid var(--border);flex-shrink:0;width:120px;display:none;position:relative}#thumbnail-sidebar.open{display:flex}.thumb-list{flex:1;padding:8px 0;overflow-y:auto}.thumb-resize-handle{cursor:col-resize;z-index:5;width:6px;height:100%;position:absolute;top:0;right:-3px}.thumb-resize-handle:hover,.thumb-resize-handle:active{background:var(--accent);opacity:.5}.thumb-item{cursor:pointer;user-select:none;flex-direction:column;align-items:center;padding:6px 8px;display:flex;position:relative}.thumb-item:hover{background:#ffffff0d}.thumb-item.active{background:#4a9eff26}.thumb-item.selected .thumb-canvas{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent), 0 1px 4px #0006}.thumb-item.dragging{opacity:.4}.thumb-item.drag-above:before{content:"";background:var(--accent);height:2px;position:absolute;top:0;left:8px;right:8px}.thumb-item.drag-below:after{content:"";background:var(--accent);height:2px;position:absolute;bottom:0;left:8px;right:8px}.thumb-canvas{background:#fff;border:2px solid #0000;box-shadow:0 1px 4px #0006}.thumb-item.active .thumb-canvas{border-color:var(--accent)}.thumb-close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;margin:0 auto 4px;padding:2px 8px;font-size:18px;display:block}.thumb-close-btn:hover{color:var(--text-primary)}.thumb-label{color:var(--text-secondary);margin-top:4px;font-size:11px}.thumb-context-menu{background:var(--bg-toolbar);border:1px solid var(--border);z-index:300;min-width:160px;padding:4px 0;position:fixed;box-shadow:0 4px 12px #00000080}.thumb-ctx-btn{width:100%;color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;border:none;padding:6px 16px;font-family:inherit;font-size:13px;display:block}.thumb-ctx-btn:hover{background:#ffffff1a}#viewport{background:var(--bg-page);flex:1;position:relative;overflow:auto}.viewport-scroll-area{flex-direction:column;align-items:center;min-width:fit-content;min-height:100%;padding:16px;display:flex}.page-wrapper{background:#fff;border:1px solid silver;flex-shrink:0;position:relative;box-shadow:0 2px 8px #0000004d}.page-canvas{display:block}.annotation-overlay-container{pointer-events:auto;z-index:2;position:absolute;inset:0}.annot-overlay{pointer-events:auto;cursor:pointer;border:1px solid #0000;transition:box-shadow .1s;position:absolute}.annot-overlay:hover{box-shadow:0 0 0 2px #4a9eff66}.annot-overlay.selected{box-shadow:0 0 0 2px var(--selection);z-index:10}.annot-icon{cursor:move;border:1px solid #0000004d;border-radius:0}.annot-quadpoint{pointer-events:auto;cursor:pointer;mix-blend-mode:multiply;border:none}.annot-quadpoint.selected{outline:2px solid var(--selection);outline-offset:1px;box-shadow:none}.annot-type-freetext,.annot-type-square,.annot-type-circle,.annot-type-line,.annot-type-ink,.annot-type-polygon,.annot-type-polyline,.annot-type-stamp{background:#ffffff05;border:2px solid #0000}.resize-handle{width:var(--handle-size);height:var(--handle-size);border:1px solid var(--selection);z-index:11;pointer-events:auto;background:#fff;position:absolute}.handle-nw{top:calc(-1 * var(--handle-size) / 2);left:calc(-1 * var(--handle-size) / 2);cursor:nw-resize}.handle-n{top:calc(-1 * var(--handle-size) / 2);left:calc(50% - var(--handle-size) / 2);cursor:n-resize}.handle-ne{top:calc(-1 * var(--handle-size) / 2);right:calc(-1 * var(--handle-size) / 2);cursor:ne-resize}.handle-e{top:calc(50% - var(--handle-size) / 2);right:calc(-1 * var(--handle-size) / 2);cursor:e-resize}.handle-se{bottom:calc(-1 * var(--handle-size) / 2);right:calc(-1 * var(--handle-size) / 2);cursor:se-resize}.handle-s{bottom:calc(-1 * var(--handle-size) / 2);left:calc(50% - var(--handle-size) / 2);cursor:s-resize}.handle-sw{bottom:calc(-1 * var(--handle-size) / 2);left:calc(-1 * var(--handle-size) / 2);cursor:sw-resize}.handle-w{top:calc(50% - var(--handle-size) / 2);left:calc(-1 * var(--handle-size) / 2);cursor:w-resize}@media (hover:none) and (pointer:coarse){:root{--handle-size:22px}.annot-overlay{min-width:44px;min-height:44px}.resize-handle{border-width:2px;border-radius:3px}#viewport{touch-action:manipulation}}#welcome{z-index:10;cursor:pointer;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.welcome-content{text-align:center;color:var(--text-secondary)}.welcome-content h1{color:var(--text-primary);margin-bottom:12px;font-size:28px;font-weight:600}.welcome-content p{font-size:16px;line-height:1.5}.welcome-actions{justify-content:center;gap:12px;margin-top:20px;display:flex}.welcome-btn{border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;padding:10px 24px;font-family:inherit;font-size:14px;font-weight:500}.welcome-btn:hover{background:#3a8eef}.welcome-btn-secondary{color:var(--text-primary);border-color:var(--border);background:0 0}.welcome-btn-secondary:hover{background:#ffffff14}#viewport.drag-over{outline:3px dashed var(--accent);outline-offset:-3px}#viewport.drag-over #welcome .welcome-content p:after{content:" — Release to open";color:var(--accent);font-weight:600}#properties-panel{width:var(--props-width);background:var(--bg-panel);border-left:1px solid var(--border);flex-direction:column;flex-shrink:0;transition:width .15s;display:flex;overflow-y:auto}#properties-panel:not(.open){border-left:none;width:0;overflow:hidden}#properties-panel.hidden{display:none!important}.props-close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:18px;line-height:1}.props-close-btn:hover{color:var(--text-primary)}.props-toggle-btn{background:var(--bg-toolbar);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;z-index:5;padding:6px;display:none;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.props-toggle-btn:hover{color:var(--text-primary);background:#ffffff1a}.props-toggle-btn.visible{display:block}.props-header{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 14px;font-size:12px;font-weight:600;display:flex}.props-tabs{border-bottom:1px solid var(--border);flex-shrink:0;display:flex}.props-tab{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-bottom:2px solid #0000;flex:1;padding:8px 4px;font-family:inherit;font-size:12px;font-weight:500;transition:color .1s,border-color .1s}.props-tab:hover{color:var(--text-primary)}.props-tab.active{color:var(--text-primary);border-bottom-color:var(--accent);font-weight:600}.history-content{padding:0}.session-info{color:var(--text-secondary);border-bottom:1px solid var(--border);padding:10px 14px;font-size:12px;line-height:1.6}.session-info strong{color:var(--text-primary)}.history-section-header{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);padding:8px 14px 4px;font-size:11px;font-weight:600}.history-list{padding:2px 0}.history-entry{color:var(--text-primary);border-left:3px solid #0000;padding:5px 14px 5px 17px;font-size:12px}.history-entry.current{border-left-color:var(--accent)}.history-entry.undone{opacity:.4;font-style:italic}.history-entry[data-action]:hover{background:var(--bg-hover,#0000000d);cursor:pointer}.recent-file{flex-wrap:wrap;align-items:center;gap:4px;display:flex}.recent-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:500;overflow:hidden}.recent-meta{color:var(--text-secondary);white-space:nowrap;font-size:11px}.recent-remove{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:14px;line-height:1}.recent-remove:hover{color:var(--text-primary)}.history-actions{padding:12px 14px}.props-body{flex:1;overflow-y:auto}.props-empty{color:var(--text-secondary);text-align:center;padding:20px 14px;font-size:13px}.props-content{padding:12px 14px}.props-type{color:var(--accent);margin-bottom:14px;font-size:15px;font-weight:600}.props-section{margin-bottom:12px}.props-label{text-transform:uppercase;letter-spacing:.3px;color:var(--text-secondary);margin-bottom:4px;font-size:11px;font-weight:600;display:block}.props-row{align-items:center;gap:8px;display:flex}.props-coord{color:var(--text-primary);font-family:monospace;font-size:12px}.props-coord-label{color:var(--text-secondary);min-width:10px;margin-right:2px;font-size:11px}.props-coord-input{border:1px solid var(--border);background:var(--bg-primary);width:58px;color:var(--text-primary);border-radius:0;margin-right:6px;padding:2px 4px;font-family:monospace;font-size:12px}.props-color{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:0;width:32px;height:24px;padding:0}.props-range{width:100%;accent-color:var(--accent)}.props-value{color:var(--text-secondary);text-align:right;min-width:36px;font-size:12px}.props-input,.props-select{background:var(--bg-primary);border:1px solid var(--border);width:100%;color:var(--text-primary);border-radius:0;padding:4px 8px;font-size:13px}.props-textarea{background:var(--bg-primary);border:1px solid var(--border);width:100%;color:var(--text-primary);resize:vertical;border-radius:0;min-height:60px;padding:6px 8px;font-family:inherit;font-size:13px}.props-readonly{color:var(--text-secondary);font-size:13px}.props-hint{color:var(--text-secondary);font-size:11px}.props-delete{color:#fff;cursor:pointer;background:#c0392b;border:none;border-radius:0;width:100%;margin-top:8px;padding:6px 12px;font-size:13px}.props-delete:hover{background:#e74c3c}.props-btn{background:var(--bg-toolbar);border:1px solid var(--border);width:100%;color:var(--text-primary);cursor:pointer;padding:6px 12px;font-family:inherit;font-size:13px}.props-btn:hover{background:#ffffff1a}.props-btn-sm{background:var(--bg-toolbar);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;text-align:center;flex:1;min-width:50px;padding:4px 8px;font-family:inherit;font-size:11px}.props-btn-sm:hover{background:#ffffff1a}.color-picker-wrap{cursor:pointer;border:1px solid #0000;border-radius:0;align-items:center;padding:3px 6px;display:flex;position:relative}.color-picker-wrap:hover{border-color:var(--border);background:#ffffff1a}.color-picker-wrap input[type=color]{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.color-swatch{display:none}.widget-overlay{background:#6495ed14;border:2px solid #6495ed99}.widget-overlay:hover{background:#6495ed26}.image-overlay{cursor:pointer;border:2px solid #0000}.image-overlay:hover{background:#4a9eff0d;border-color:#4a9eff80}.search-bar{z-index:100;background:var(--bg-panel);border:1px solid var(--border);border-radius:0;flex-direction:column;gap:4px;padding:8px 10px;position:absolute;top:8px;right:16px;box-shadow:0 4px 12px #0000004d}.search-row{align-items:center;gap:4px;display:flex}.search-input{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);border-radius:0;outline:none;width:180px;padding:4px 8px;font-size:13px}.search-input:focus{border-color:var(--accent)}.search-btn{border:1px solid var(--border);color:var(--text-primary);cursor:pointer;white-space:nowrap;background:0 0;border-radius:0;padding:3px 8px;font-size:12px}.search-btn:hover{background:#ffffff1a}.search-close{margin-left:4px}.search-match-count{color:var(--text-secondary);text-align:center;min-width:60px;font-size:11px}.search-highlight-container{pointer-events:none;z-index:4;position:absolute;inset:0}.search-highlight{background:#ffe60066;border-radius:0;position:absolute}.search-highlight.current{background:#ffa50099;box-shadow:0 0 0 2px #ffa5004d}.text-highlight-container{pointer-events:none;z-index:3;position:absolute;inset:0}.text-hover-highlight{pointer-events:none;z-index:3;background:#4a9eff14;border-radius:0;transition:all 50ms;position:absolute}.text-selection-highlight{pointer-events:none;background:#4a9eff4d;border-radius:0;position:absolute}.text-edit-overlay{z-index:15;border:2px solid var(--accent);white-space:pre;background:#fffffff2;outline:none;margin:0;padding:0 2px;position:absolute;overflow:visible;box-shadow:0 0 0 3px #4a9eff33}.toolbar-select{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:0;padding:3px 4px;font-size:11px}.creation-preview{border:2px dashed var(--accent);pointer-events:none;z-index:20;background:#4a9eff1a;position:absolute}.vp-section{border-bottom:1px solid var(--border);padding:12px 16px}.vp-label{color:var(--text-primary);margin-bottom:10px;font-size:13px;font-weight:600}.vp-sizes{justify-content:center;gap:4px;display:flex}.vp-size-btn{width:44px;height:44px;color:var(--text-secondary);cursor:pointer;background:0 0;border:2px solid #0000;border-radius:50%;justify-content:center;align-items:center;transition:all .1s;display:flex}.vp-size-btn:hover{background:#ffffff14}.vp-size-btn.vp-selected{border-color:var(--accent);color:var(--text-primary);background:#4a9eff33}.vp-colors{grid-template-columns:repeat(5,1fr);justify-items:center;gap:8px;display:grid}.vp-color-btn{cursor:pointer;background:0 0;border:2px solid #0000;border-radius:50%;width:36px;height:36px;padding:3px;transition:all .1s}.vp-color-btn:hover{border-color:#ffffff4d}.vp-color-btn.vp-selected{border-color:var(--accent);transform:scale(1.15)}.vp-swatch{border:1px solid #00000026;border-radius:50%;width:100%;height:100%;display:block}.vp-custom{position:relative;overflow:hidden}.vp-color-custom-input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.vp-opacities{justify-content:center;gap:4px;display:flex}.vp-opacity-btn{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:0;padding:4px 10px;font-size:11px;transition:all .1s}.vp-opacity-btn:hover{background:#ffffff14}.vp-opacity-btn.vp-selected{background:var(--accent);border-color:var(--accent);color:#fff}.camera-modal{z-index:500;background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.camera-container{flex-direction:column;align-items:center;gap:16px;max-width:90vw;max-height:90vh;display:flex}.camera-container video{border:2px solid var(--border);background:#000;max-width:80vw;max-height:70vh}.camera-controls{gap:16px;display:flex}.camera-btn{border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;padding:12px 32px;font-family:inherit;font-size:16px;font-weight:500}.camera-btn:hover{background:#3a8eef}.camera-btn-secondary{color:var(--text-primary);border-color:var(--border);background:0 0}.camera-btn-secondary:hover{background:#ffffff1a}#toolbar{height:auto;min-height:var(--toolbar-height);flex-wrap:wrap;overflow:visible}@media (width<=900px){.tb span{display:none}.tb{padding:4px 6px}.toolbar-label{min-width:32px;font-size:11px}.toolbar-select{max-width:50px}}@media (width<=700px){#main-area{flex-direction:column}#thumbnail-sidebar{display:none!important}#properties-panel{border-left:none;border-top:1px solid var(--border);max-height:40vh;width:100%!important}#properties-panel:not(.open){border-top:none;max-height:0}}@media (width<=500px){#toolbar{gap:1px;padding:0 4px}.toolbar-group{gap:1px}.toolbar-sep{margin:0 2px}.tb{padding:4px}#style-group{display:none}}