:root{--sidebar-width: 380px;--header-height: 56px;--bg: #fafafa;--surface: #ffffff;--border: #e0e0e0;--text: #1a1a1a;--text-secondary: #666;--primary: #2563eb;--primary-hover: #1d4ed8;--error: #dc2626;--success: #16a34a;--highlight: rgba(255, 213, 79, .35);--highlight-hover: rgba(255, 213, 79, .55);--highlight-border: #ffd54f}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;height:var(--header-height);padding:0 1rem;background:var(--surface);border-bottom:1px solid var(--border)}header h1{font-size:1.25rem;font-weight:600}#page-info{font-size:.875rem;color:var(--text-secondary);min-width:100px;text-align:center}#app{display:flex;height:calc(100vh - var(--header-height))}#pdf-container{flex:1;overflow:auto;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem;background:#e8e8e8}.pdf-page{position:relative;box-shadow:0 2px 12px #00000026;background:#fff;line-height:0}.pdf-page canvas{display:block}.textLayer{position:absolute;inset:0;z-index:2;overflow:clip;line-height:1;text-size-adjust:none;forced-color-adjust:none;transform-origin:0 0;caret-color:CanvasText;--min-font-size: 1;--text-scale-factor: calc(var(--total-scale-factor) * var(--min-font-size));--min-font-size-inv: calc(1 / var(--min-font-size))}.textLayer :is(span,br){color:transparent;position:absolute;white-space:pre;cursor:text;transform-origin:0% 0%}.textLayer>:not(.markedContent),.textLayer .markedContent span:not(.markedContent){z-index:1;--font-height: 0;font-size:calc(var(--text-scale-factor) * var(--font-height));--scale-x: 1;--rotate: 0deg;transform:rotate(var(--rotate)) scaleX(var(--scale-x)) scale(var(--min-font-size-inv))}.textLayer .markedContent{display:contents}.textLayer ::selection{background:#2563eb4d}.textLayer ::-moz-selection{background:#2563eb4d}.textLayer br::selection{background:transparent}.textLayer br::-moz-selection{background:transparent}.textLayer .endOfContent{display:block;position:absolute;inset:100% 0 0;z-index:0;cursor:default;-webkit-user-select:none;user-select:none}.textLayer.selecting .endOfContent{top:0}.highlight-layer{position:absolute;inset:0;z-index:1;pointer-events:none}.highlight-rect{position:absolute;background:var(--highlight);pointer-events:auto;cursor:pointer;border-radius:2px;transition:background .15s}.highlight-rect:hover{background:var(--highlight-hover)}.highlight-rect.pulse{animation:highlight-pulse 1.5s ease-in-out}@keyframes highlight-pulse{0%,to{background:var(--highlight)}25%{background:#ffb70099}50%{background:var(--highlight)}75%{background:#ffb70099}}.selection-tooltip{position:absolute;z-index:100;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 16px #00000026;padding:.375rem .75rem;font-size:.8rem;font-weight:500;cursor:pointer;color:var(--primary);white-space:nowrap;transition:background .15s;-webkit-user-select:none;user-select:none;transform:translate(-50%)}.pending-highlight-rect{position:absolute;background:#ffd54f73;border-bottom:2px solid var(--highlight-border);border-radius:2px;pointer-events:none}.selection-tooltip:hover{background:var(--bg)}.highlight-preview{background:#fffde7;border-left:3px solid var(--highlight-border);border-radius:4px;padding:.5rem .75rem;font-size:.8rem;line-height:1.4}.highlight-preview-label{font-weight:600;font-size:.75rem;color:var(--text-secondary);margin-bottom:.25rem;display:flex;align-items:center;justify-content:space-between}.highlight-preview-label button{background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:.75rem;padding:0;text-decoration:underline}.highlight-preview-label button:hover{color:var(--text)}.highlight-preview blockquote{margin:0;font-style:italic;color:var(--text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.comment-card.has-highlight{border-left:3px solid var(--highlight-border);cursor:pointer}.comment-card.has-highlight:hover{background:#fffde7}.comment-card.active{border-color:var(--primary);background:#2563eb0d}.comment-highlight-quote{background:#fffde7;border-left:2px solid var(--highlight-border);border-radius:2px;padding:.25rem .5rem;margin-bottom:.375rem;font-size:.8rem;font-style:italic;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}#sidebar{width:var(--sidebar-width);border-left:1px solid var(--border);background:var(--surface);display:flex;flex-direction:column;overflow:hidden}#comment-list{flex:1;overflow-y:auto;padding:1rem}.comment-list-header{font-size:.875rem;font-weight:600;color:var(--text-secondary);margin-bottom:.75rem}.page-group{border-bottom:1px solid var(--border);padding-bottom:.5rem;margin-bottom:.5rem}.page-group:last-child{border-bottom:none;margin-bottom:0}.page-group.current{background:#2563eb0a;border-radius:6px;padding:.5rem;margin-left:-.5rem;margin-right:-.5rem}.page-group-header{font-size:.8rem;font-weight:600;color:var(--text-secondary);margin-bottom:.5rem;position:sticky;top:0;background:inherit;padding:.25rem 0;z-index:1}.page-group.current .page-group-header{color:var(--primary)}.comment-card{padding:.75rem;border:1px solid var(--border);border-radius:8px;margin-bottom:.75rem}.comment-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.375rem}.comment-author{font-weight:600;font-size:.875rem}.comment-time{font-size:.75rem;color:var(--text-secondary)}.comment-body{font-size:.875rem;line-height:1.5;white-space:pre-wrap;word-break:break-word}.comment-footer{margin-top:.5rem}.comment-link{font-size:.75rem;color:var(--primary);text-decoration:none}.comment-link:hover{text-decoration:underline}.no-comments{color:var(--text-secondary);font-size:.875rem;text-align:center;padding:2rem 0}#comment-form-container{border-top:1px solid var(--border);padding:1rem}.comment-form{display:flex;flex-direction:column;gap:.625rem}.comment-form input,.comment-form textarea{width:100%;padding:.5rem .75rem;border:1px solid var(--border);border-radius:6px;font-family:inherit;font-size:.875rem;resize:vertical}.comment-form input:focus,.comment-form textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #2563eb26}.comment-form textarea{min-height:80px}.comment-form button[type=submit]{padding:.5rem 1rem;background:var(--primary);color:#fff;border:none;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:background .15s}.comment-form button[type=submit]:hover:not(:disabled){background:var(--primary-hover)}.comment-form button[type=submit]:disabled{opacity:.6;cursor:not-allowed}.form-error{color:var(--error);font-size:.8rem}.form-success{color:var(--success);font-size:.8rem}.no-token-notice{color:var(--text-secondary);font-size:.8rem;text-align:center;padding:.5rem}.loading{display:flex;align-items:center;justify-content:center;padding:2rem;color:var(--text-secondary);font-size:.875rem}@media(max-width:768px){#app{flex-direction:column;height:auto}#pdf-container{min-height:60vh}#sidebar{width:100%;border-left:none;border-top:1px solid var(--border)}#comment-list{max-height:40vh}}