/* ==================== VARIABLES ==================== */
:root {
  --primary: #39d353;
  --primary-dark: #2ea043;
  --primary-light: rgba(57, 211, 83, 0.1);
  --danger: #ef4444;
  --warning: #f59e0b;
  --info: #3b82f6;
  --bg-primary: #0d1117;
  --bg-secondary: #161b22;
  --bg-card: #1c2128;
  --bg-input: #0d1117;
  --bg-toolbar: #161b22;
  --text-primary: #e6edf3;
  --text-secondary: #8b949e;
  --text-muted: #6e7681;
  --border-color: #30363d;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.12);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.15);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.2);
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --transition: 0.2s ease;
  --toolbar-h: 56px;
  --propbar-h: 44px;
  --sidebar-w: 160px;
}
[data-theme="light"] {
  --bg-primary: #ffffff;
  --bg-secondary: #f6f8fa;
  --bg-card: #ffffff;
  --bg-input: #f6f8fa;
  --bg-toolbar: #f6f8fa;
  --text-primary: #1f2328;
  --text-secondary: #656d76;
  --text-muted: #8b949e;
  --border-color: #d0d7de;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.1);
}

/* ==================== BASE ==================== */
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow:hidden;}
.container{max-width:1200px;margin:0 auto;padding:0 var(--space-lg);}
.container-fluid{padding:0 var(--space-md);}
.text-gradient{background:linear-gradient(135deg,var(--primary),#00d2ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* ==================== HEADER ==================== */
.app-header{background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:var(--space-sm) 0;position:sticky;top:0;z-index:200;height:48px;display:flex;align-items:center;}
.header-content{display:flex;align-items:center;justify-content:space-between;width:100%;}
.logo{display:flex;align-items:center;gap:var(--space-sm);text-decoration:none;color:var(--text-primary);font-size:1.1rem;font-weight:700;white-space:nowrap;}
.logo i{font-size:1.3rem;color:var(--danger);}
.header-center{display:flex;align-items:center;gap:var(--space-sm);font-size:0.8125rem;color:var(--text-secondary);}
.header-center i{color:var(--danger);}
.page-indicator{padding:2px 8px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-size:0.7rem;}
.header-actions{display:flex;align-items:center;gap:var(--space-sm);}
.icon-btn,.header-btn{height:32px;padding:0 10px;border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-size:0.8125rem;transition:all var(--transition);white-space:nowrap;}
.icon-btn{width:32px;padding:0;}
.icon-btn:hover,.header-btn:hover{border-color:var(--primary);color:var(--primary);}
.header-btn.primary{background:var(--primary);color:white;border-color:var(--primary);font-weight:600;}
.header-btn.primary:hover{background:var(--primary-dark);}
.header-btn:disabled{opacity:0.4;cursor:not-allowed;}
.back-btn{height:32px;padding:0 12px;border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-secondary);text-decoration:none;font-size:0.8125rem;display:flex;align-items:center;gap:6px;transition:all var(--transition);}
.back-btn:hover{border-color:var(--primary);color:var(--primary);}

/* ==================== UPLOAD SCREEN ==================== */
.upload-screen{overflow-y:auto;height:calc(100vh - 48px);}
.hero-section{text-align:center;padding:var(--space-xl) 0 var(--space-lg);}
.hero-icon{width:72px;height:72px;border-radius:var(--radius-lg);background:rgba(239,68,68,0.1);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-lg);}
.hero-icon i{font-size:2rem;color:var(--danger);}
.hero-section h1{font-size:2.5rem;font-weight:800;letter-spacing:-0.03em;margin-bottom:var(--space-sm);}
.hero-section p{color:var(--text-secondary);max-width:600px;margin:0 auto;font-size:1rem;}
.upload-area{border:2px dashed var(--border-color);border-radius:var(--radius-xl);padding:60px 40px;text-align:center;cursor:pointer;transition:all var(--transition);background:var(--bg-secondary);max-width:700px;margin:0 auto;}
.upload-area:hover,.upload-area.dragover{border-color:var(--primary);background:var(--primary-light);}
.upload-icon{width:80px;height:80px;border-radius:50%;background:var(--primary-light);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-lg);}
.upload-icon i{font-size:2.5rem;color:var(--primary);}
.upload-area h3{font-size:1.25rem;margin-bottom:var(--space-sm);}
.upload-area p{color:var(--text-secondary);margin-bottom:var(--space-lg);font-size:0.875rem;}
.upload-btn{padding:12px 28px;border-radius:var(--radius-md);border:none;background:var(--primary);color:white;font-size:0.9375rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:all var(--transition);}
.upload-btn:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 6px 20px rgba(57,211,83,0.3);}

/* Features */
.features-section{padding:var(--space-xl) 0 60px;text-align:center;}
.features-section h2{font-size:1.75rem;font-weight:800;margin-bottom:var(--space-xl);}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-lg);text-align:left;max-width:900px;margin:0 auto;}
.feature-card{padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-color);transition:all var(--transition);}
.feature-card:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:0 8px 30px rgba(57,211,83,0.08);}
.feature-icon{width:48px;height:48px;border-radius:var(--radius-md);background:var(--primary-light);display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-md);}
.feature-icon i{font-size:1.25rem;color:var(--primary);}
.feature-card h3{font-size:1rem;margin-bottom:var(--space-xs);}
.feature-card p{font-size:0.8125rem;color:var(--text-secondary);line-height:1.5;}

/* ==================== EDITOR SCREEN ==================== */
.editor-screen{display:flex;flex-direction:column;height:calc(100vh - 48px);}

/* Toolbar */
.toolbar{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);background:var(--bg-toolbar);border-bottom:1px solid var(--border-color);overflow-x:auto;flex-shrink:0;height:var(--toolbar-h);}
.toolbar-group{display:flex;gap:2px;}
.toolbar-divider{width:1px;height:32px;background:var(--border-color);margin:0 var(--space-sm);flex-shrink:0;}
.tool-btn{display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 10px;border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;color:var(--text-secondary);cursor:pointer;font-size:0.65rem;transition:all var(--transition);white-space:nowrap;min-width:48px;}
.tool-btn i{font-size:1rem;}
.tool-btn:hover{background:var(--bg-card);color:var(--text-primary);border-color:var(--border-color);}
.tool-btn.active{background:var(--primary-light);color:var(--primary);border-color:rgba(57,211,83,0.3);}

/* Properties Bar */
.properties-bar{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-xs) var(--space-md);background:var(--bg-secondary);border-bottom:1px solid var(--border-color);min-height:var(--propbar-h);flex-shrink:0;overflow-x:auto;}
.prop-section{display:flex;align-items:center;gap:var(--space-sm);}
.prop-select{padding:4px 8px;border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);font-size:0.8125rem;outline:none;height:30px;}
.prop-input{width:60px;padding:4px 8px;border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--bg-input);color:var(--text-primary);font-size:0.8125rem;outline:none;height:30px;text-align:center;}
.prop-color{width:30px;height:30px;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;padding:2px;background:transparent;}
.prop-btn-group{display:flex;gap:2px;}
.prop-btn{width:30px;height:30px;border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition);}
.prop-btn:hover{border-color:var(--primary);color:var(--primary);}
.prop-btn.active{background:var(--primary);color:white;border-color:var(--primary);}
.prop-label{font-size:0.75rem;color:var(--text-muted);white-space:nowrap;}
.prop-range{width:80px;height:4px;accent-color:var(--primary);}
.prop-value{font-size:0.75rem;color:var(--text-secondary);min-width:30px;}
.prop-check{display:flex;align-items:center;gap:4px;font-size:0.75rem;color:var(--text-secondary);cursor:pointer;white-space:nowrap;}
.prop-check input{accent-color:var(--primary);}

/* Stamp Grid */
.stamp-grid{display:flex;gap:6px;flex-wrap:wrap;}
.stamp-btn{padding:4px 10px;border-radius:var(--radius-sm);border:2px solid;background:transparent;cursor:pointer;font-size:0.7rem;font-weight:800;letter-spacing:0.05em;transition:all var(--transition);}
.stamp-btn:hover{opacity:0.8;transform:scale(1.05);}
.stamp-btn.active{box-shadow:0 0 0 2px var(--bg-primary),0 0 0 4px currentColor;}

/* Editor Layout */
.editor-layout{display:flex;flex:1;overflow:hidden;}

/* Page Sidebar */
.page-sidebar{width:var(--sidebar-w);background:var(--bg-secondary);border-right:1px solid var(--border-color);display:flex;flex-direction:column;flex-shrink:0;}
.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border-color);font-size:0.8125rem;font-weight:600;}
.sidebar-actions{display:flex;gap:4px;}
.sidebar-btn{width:26px;height:26px;border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--bg-card);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:0.75rem;transition:all var(--transition);}
.sidebar-btn:hover{border-color:var(--primary);color:var(--primary);}
.page-thumbs{flex:1;overflow-y:auto;padding:var(--space-sm);display:flex;flex-direction:column;gap:var(--space-sm);}
.page-thumb{position:relative;border:2px solid var(--border-color);border-radius:var(--radius-sm);overflow:hidden;cursor:pointer;transition:all var(--transition);background:#fff;}
.page-thumb:hover{border-color:var(--primary);}
.page-thumb.active{border-color:var(--primary);box-shadow:0 0 0 2px rgba(57,211,83,0.2);}
.page-thumb canvas{width:100%;display:block;}
.page-thumb-num{position:absolute;bottom:4px;right:4px;background:rgba(0,0,0,0.7);color:white;font-size:0.6rem;padding:1px 6px;border-radius:3px;}
.page-thumb-actions{position:absolute;top:4px;right:4px;display:none;gap:2px;}
.page-thumb:hover .page-thumb-actions{display:flex;}
.page-thumb-action{width:20px;height:20px;border-radius:3px;border:none;background:rgba(0,0,0,0.7);color:white;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:0.6rem;}
.page-thumb-action:hover{background:var(--danger);}

/* Canvas Area */
.canvas-area{flex:1;position:relative;background:var(--bg-primary);overflow:hidden;}
.canvas-scroll{width:100%;height:100%;overflow:auto;display:flex;justify-content:center;padding:var(--space-lg);}
.canvas-wrapper{position:relative;display:inline-flex;flex-direction:column;gap:var(--space-md);align-items:center;}

/* PDF Page */
.pdf-page{position:relative;background:white;box-shadow:var(--shadow-lg);border-radius:2px;}
.pdf-page canvas{display:block;}

/* PDF.js Text Layer — selectable text */
.pdf-text-layer{position:absolute;inset:0;overflow:hidden;opacity:1;line-height:1;z-index:2;pointer-events:none;}
.pdf-text-layer span,
.pdf-text-layer br{color:transparent !important;-webkit-text-fill-color:transparent !important;position:absolute;white-space:pre;transform-origin:0% 0%;pointer-events:all;cursor:text;user-select:text;-webkit-user-select:text;}
.pdf-text-layer ::selection{background:rgba(57,211,83,0.35);}
.pdf-text-layer ::-moz-selection{background:rgba(57,211,83,0.35);}
.pdf-text-layer.editable span{cursor:pointer;border-radius:2px;transition:background 0.15s;user-select:none;-webkit-user-select:none;}
.pdf-text-layer.editable span:hover{background:rgba(57,211,83,0.15);outline:1px dashed var(--primary);outline-offset:1px;}

.annotation-layer{position:absolute;inset:0;pointer-events:none;z-index:3;}
.annotation-layer.active{pointer-events:all;cursor:crosshair;}
.annotation-layer.tool-select{cursor:default;}
.annotation-layer.tool-edittext{cursor:pointer;}
.annotation-layer.tool-text{cursor:text;}

/* Annotation Elements */
.anno-element{position:absolute;cursor:move;user-select:none;-webkit-user-select:none;touch-action:none;transition:outline 0.1s ease;}
.anno-element:hover{outline:2px solid var(--primary);outline-offset:1px;}
.anno-element.selected{outline:2px solid var(--primary);outline-offset:1px;}
.anno-resize{position:absolute;width:10px;height:10px;background:white;border:2px solid var(--primary);border-radius:2px;display:none;z-index:10;touch-action:none;}
.anno-element.selected .anno-resize{display:block;}
.anno-resize.tl{top:-5px;left:-5px;cursor:nw-resize;}
.anno-resize.tr{top:-5px;right:-5px;cursor:ne-resize;}
.anno-resize.bl{bottom:-5px;left:-5px;cursor:sw-resize;}
.anno-resize.br{bottom:-5px;right:-5px;cursor:se-resize;}
.anno-delete{position:absolute;top:-12px;right:-12px;width:22px;height:22px;border-radius:50%;background:var(--danger);color:white;border:none;cursor:pointer;display:none;align-items:center;justify-content:center;font-size:0.65rem;z-index:10;transition:transform 0.15s ease;}
.anno-delete:hover{transform:scale(1.15);}
.anno-element.selected .anno-delete{display:flex;}

/* Text annotation */
.anno-text{padding:4px;min-width:60px;min-height:24px;outline:none;white-space:pre-wrap;word-break:break-word;}
.anno-text:focus{outline:2px solid var(--primary);outline-offset:1px;}

/* Highlight annotation */
.anno-highlight{opacity:0.4;border-radius:2px;pointer-events:all;min-height:16px;min-width:20px;}

/* Stamp annotation */
.anno-stamp{padding:8px 16px;border:3px solid;border-radius:4px;font-weight:900;letter-spacing:0.1em;font-size:1.5rem;transform:rotate(-12deg);opacity:0.7;text-align:center;white-space:nowrap;}

/* Comment pin */
.anno-comment{width:28px;height:28px;background:var(--warning);border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,0.2);}
.anno-comment i{transform:rotate(45deg);color:white;font-size:0.75rem;}
.anno-comment-tooltip{position:absolute;top:100%;left:0;margin-top:8px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:8px 12px;font-size:0.75rem;min-width:150px;max-width:250px;box-shadow:var(--shadow-md);display:none;transform:rotate(45deg) translate(-20px, 0);z-index:20;color:var(--text-primary);}
.anno-comment:hover .anno-comment-tooltip{display:block;}

/* Link annotation */
.anno-link{border:2px dashed var(--info);background:rgba(59,130,246,0.05);padding:4px 8px;min-width:80px;min-height:24px;display:flex;align-items:center;gap:4px;font-size:0.75rem;color:var(--info);border-radius:3px;}

/* Image annotation */
.anno-image{overflow:hidden;}
.anno-image img{width:100%;height:100%;object-fit:contain;}

/* Whiteout annotation */
.anno-whiteout{background:white;border:1px solid #e5e7eb;}

/* Drawing Canvas */
.draw-canvas{position:absolute;inset:0;cursor:crosshair;}

/* Zoom Controls */
.zoom-controls{position:absolute;bottom:var(--space-md);right:var(--space-md);display:flex;align-items:center;gap:4px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:4px;box-shadow:var(--shadow-md);z-index:50;}
.zoom-btn{width:30px;height:30px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition);}
.zoom-btn:hover{background:var(--bg-secondary);color:var(--primary);}
.zoom-level{font-size:0.75rem;font-weight:600;min-width:44px;text-align:center;color:var(--text-primary);}

/* Page Navigation */
.page-nav{position:absolute;bottom:var(--space-md);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:var(--space-sm);background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:4px 8px;box-shadow:var(--shadow-md);z-index:50;}
.page-nav-btn{width:28px;height:28px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition);}
.page-nav-btn:hover{background:var(--bg-secondary);color:var(--primary);}
.page-input{width:40px;height:28px;text-align:center;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text-primary);font-size:0.8125rem;outline:none;}
.page-nav span{font-size:0.8125rem;color:var(--text-secondary);}

/* ==================== MODALS ==================== */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:500;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.modal-box{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);width:560px;max-width:95vw;max-height:90vh;overflow:hidden;box-shadow:var(--shadow-lg);}
.modal-box.small{width:400px;}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--border-color);}
.modal-header h3{font-size:1rem;display:flex;align-items:center;gap:8px;}
.modal-close{width:32px;height:32px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition);}
.modal-close:hover{background:var(--bg-secondary);color:var(--danger);}
.modal-body{padding:var(--space-lg);}
.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-sm);padding:var(--space-md) var(--space-lg);border-top:1px solid var(--border-color);}
.btn-primary{padding:8px 20px;border-radius:var(--radius-md);border:none;background:var(--primary);color:white;font-size:0.875rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all var(--transition);}
.btn-primary:hover{background:var(--primary-dark);}
.btn-secondary{padding:8px 20px;border-radius:var(--radius-md);border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);font-size:0.875rem;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all var(--transition);}
.btn-secondary:hover{border-color:var(--primary);}

/* Signature Modal */
.sign-tabs{display:flex;gap:4px;margin-bottom:var(--space-md);}
.sign-tab{flex:1;padding:8px;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;font-size:0.8125rem;text-align:center;transition:all var(--transition);}
.sign-tab:hover{border-color:var(--primary);}
.sign-tab.active{background:var(--primary-light);color:var(--primary);border-color:rgba(57,211,83,0.3);}
.sign-panel{display:none;}
.sign-panel.active{display:block;}
#signCanvas{width:100%;border:1px solid var(--border-color);border-radius:var(--radius-md);background:white;cursor:crosshair;touch-action:none;}
.sign-actions{display:flex;align-items:center;justify-content:space-between;margin-top:var(--space-sm);}
.sign-colors{display:flex;gap:6px;}
.sign-color{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:all var(--transition);}
.sign-color:hover{transform:scale(1.1);}
.sign-color.active{border-color:var(--text-primary);box-shadow:0 0 0 2px var(--bg-card);}
.sign-text-input{width:100%;padding:16px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:white;color:#000;font-size:2rem;text-align:center;outline:none;margin-bottom:var(--space-md);}
.sign-font-options{display:flex;gap:8px;margin-bottom:var(--space-md);}
.sign-font{flex:1;padding:12px;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:white;color:#000;cursor:pointer;font-size:1.25rem;text-align:center;transition:all var(--transition);}
.sign-font:hover{border-color:var(--primary);}
.sign-font.active{border-color:var(--primary);background:var(--primary-light);}
.sign-upload-area{border:2px dashed var(--border-color);border-radius:var(--radius-md);padding:40px;text-align:center;cursor:pointer;color:var(--text-secondary);transition:all var(--transition);}
.sign-upload-area:hover{border-color:var(--primary);}
.sign-upload-area i{font-size:2rem;display:block;margin-bottom:var(--space-sm);}

/* Comment & Link */
.comment-textarea{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-input);color:var(--text-primary);font-size:0.875rem;outline:none;resize:vertical;font-family:inherit;}
.comment-textarea:focus{border-color:var(--primary);}
.link-input{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-input);color:var(--text-primary);font-size:0.875rem;outline:none;font-family:inherit;}
.link-input:focus{border-color:var(--primary);}

/* ==================== RANGE INPUTS ==================== */
input[type="range"]{-webkit-appearance:none;appearance:none;height:4px;border-radius:2px;background:var(--border-color);outline:none;}
input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--primary);cursor:pointer;border:2px solid white;box-shadow:0 1px 4px rgba(0,0,0,0.2);}

/* ==================== TOAST ==================== */
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}

/* ==================== RESPONSIVE ==================== */
@media(max-width:768px){
  .hero-section h1{font-size:1.75rem;}
  .features-grid{grid-template-columns:1fr;}
  .page-sidebar{width:120px;}
  .toolbar{gap:0;}
  .tool-btn{padding:4px 6px;min-width:40px;}
  .tool-btn span{display:none;}
  .toolbar-divider{margin:0 4px;}
  .prop-section{flex-wrap:wrap;}
  :root{--sidebar-w:120px;}
}
@media(max-width:480px){
  .page-sidebar{display:none;}
  .upload-area{padding:30px 20px;}
}

/* ==================== LOADING OVERLAY ==================== */
.pdf-loading-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:600;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
.pdf-loading-spinner{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);color:var(--text-primary);}
.pdf-loading-spinner span{font-size:0.9375rem;font-weight:600;}
.pdf-loading-spinner .spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--primary);border-radius:50%;animation:spinAnim 0.8s linear infinite;}
@keyframes spinAnim{to{transform:rotate(360deg)}}

/* ==================== WATERMARK ANNOTATION ==================== */
.anno-watermark{font-weight:900;letter-spacing:0.15em;text-transform:uppercase;white-space:nowrap;pointer-events:all;opacity:0.5;text-align:center;display:flex;align-items:center;justify-content:center;font-family:'Inter',Arial,sans-serif;user-select:none;}