:root{--bg: #1a1a1a;--bg-elevated: #222;--bg-hover: #2a2a2a;--bg-surface: #333;--fg: #fff;--fg-muted: #888;--fg-dim: #666;--accent: #0066cc;--accent-hover: #0077ee;--border: #333;--border-strong: #555;--danger: #ff6b6b;--status-open: #4dabf7;--status-blocked: #ff6b6b;--status-pending: #ffa94d;--status-resolved: #51cf66}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#1a1a1a;color:#fff;display:flex;height:100vh;overflow:hidden}.sidebar{width:260px;background:#222;border-right:1px solid #333;display:flex;flex-direction:column;flex-shrink:0;position:relative;transition:width .3s ease}.sidebar.collapsed{width:50px}.sidebar-header{padding:20px;border-bottom:1px solid #333;overflow:hidden;white-space:nowrap}.sidebar.collapsed .sidebar-header{padding:12px 8px}.sidebar-header h1{font-size:1rem;font-weight:600;margin-bottom:4px;display:flex;align-items:center;gap:8px}.sidebar.collapsed .sidebar-header h1{font-size:0;gap:0;justify-content:center}.sidebar.collapsed .sidebar-header h1 .ws-status{margin:0}.sidebar-header .last-updated{font-size:11px;color:#666}.sidebar.collapsed .sidebar-header .last-updated{display:none}.sidebar-tab{position:absolute;right:-24px;top:50%;transform:translateY(-50%);width:24px;height:60px;background:#222;border:1px solid #333;border-left:none;border-radius:0 6px 6px 0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#666;transition:all .15s;z-index:10}.sidebar-tab:hover{background:#2a2a2a;color:#fff}.sidebar-tab svg{transition:transform .3s}.sidebar.collapsed .sidebar-tab svg{transform:rotate(180deg)}.ws-status{width:8px;height:8px;border-radius:50%;display:inline-block;transition:background .3s}.ws-status.connected{background:#51cf66;box-shadow:0 0 6px #51cf66}.ws-status.disconnected{background:#ff6b6b;animation:pulse 2s infinite}.toast{position:fixed;bottom:20px;right:20px;background:#333;color:#fff;padding:12px 20px;border-radius:8px;font-size:13px;z-index:10000;opacity:0;transform:translateY(20px);transition:all .3s ease;max-width:300px;box-shadow:0 4px 12px #0000004d}.toast.show{opacity:1;transform:translateY(0)}.toast-info{border-left:4px solid #0066cc}.toast-success{border-left:4px solid #51cf66}.toast-error{border-left:4px solid #ff6b6b}.login-overlay{position:fixed;inset:0;background:#1a1a1a;z-index:20000;display:flex;align-items:center;justify-content:center}.login-overlay.hidden{display:none}.login-box{background:#2a2a2a;border:1px solid #333;border-radius:12px;padding:40px;width:100%;max-width:400px;box-shadow:0 20px 60px #00000080}.login-box h2{font-size:24px;font-weight:600;margin-bottom:8px;text-align:center}.login-box p{color:#888;font-size:14px;text-align:center;margin-bottom:30px}.login-form{display:flex;flex-direction:column;gap:16px}.login-form input{padding:14px 16px;border-radius:8px;border:1px solid #444;background:#333;color:#fff;font-size:14px;outline:none;transition:border-color .2s}.login-form input:focus{border-color:#06c}.login-form input::placeholder{color:#666}.login-form button{padding:14px 16px;border-radius:8px;border:none;background:#06c;color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.login-form button:hover{background:#07e}.login-form button:disabled{background:#444;cursor:not-allowed}.login-error{color:#ff6b6b;font-size:13px;text-align:center;min-height:20px}.login-user{display:flex;flex-direction:column;gap:12px}.login-user .user-info{display:flex;flex-direction:column;gap:2px}.login-user .username{color:#fff;font-size:14px;font-weight:600}.login-user .email{color:#666;font-size:11px}.login-user .logout-btn{padding:8px 12px;background:transparent;border:1px solid #444;color:#888;border-radius:4px;cursor:pointer;font-size:11px;width:100%;transition:all .15s}.login-user .logout-btn:hover{background:#333;color:#fff;border-color:#555}.sidebar-nav{flex:1;overflow-y:auto;padding:10px 0}.sidebar-footer{padding:15px 20px;border-top:1px solid #333;margin-top:auto;overflow:hidden}.sidebar.collapsed .sidebar-footer{padding:10px 5px}.sidebar.collapsed .sidebar-footer .user-info{display:none}.sidebar.collapsed .sidebar-footer .logout-btn{padding:8px 4px;font-size:0}.sidebar.collapsed .sidebar-footer .logout-btn:before{content:"⏻";font-size:14px}.nav-group{margin-bottom:8px}.nav-group-title{padding:8px 20px;font-size:10px;font-weight:600;color:#666;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;overflow:hidden}.sidebar.collapsed .nav-group-title{font-size:0;padding:4px}.nav-item{padding:10px 20px;cursor:pointer;font-size:13px;color:#999;transition:all .15s;display:flex;align-items:center;gap:10px}.nav-item:hover{background:#2a2a2a;color:#fff}.nav-item.active{background:#06c;color:#fff}.nav-item>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar.collapsed .nav-item{padding:8px;justify-content:center}.sidebar.collapsed .nav-item>span{display:none}.nav-item .badge{background:#333;padding:2px 6px;border-radius:10px;font-size:10px;color:#888}.nav-item.active .badge{background:#fff3;color:#fff}.nav-item .badge.unread{background:#ff6b6b;color:#fff;animation:pulse 2s infinite}.nav-item .badge.remarks-read{background:#51cf66;color:#fff}.nav-item .badge.status-open{background:#4dabf7;color:#fff}.nav-item .badge.status-blocked{background:#ff6b6b;color:#fff}.nav-item .badge.status-pending{background:#ffa94d;color:#000}.nav-badges{display:flex;gap:4px;margin-left:auto}.sidebar.collapsed .nav-badges{margin-left:0}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.main-wrapper{flex:1;display:flex;flex-direction:column;overflow:hidden}.toolbar{padding:15px 20px;background:#2a2a2a;border-bottom:1px solid #333;display:flex;gap:15px;align-items:center;flex-wrap:wrap}.toolbar-controls{display:flex;gap:8px;margin-left:auto}.toolbar button{padding:6px 14px;border-radius:5px;border:1px solid #444;background:#333;color:#fff;cursor:pointer;font-size:12px;transition:all .15s}.toolbar button:hover{background:#444}.toolbar button.active{background:#06c;border-color:#06c}.toolbar button.annotate-btn.active{background:#ff6b6b;border-color:#ff6b6b}.toolbar button.toggle-remarks-btn{padding:6px 8px;display:flex;align-items:center;justify-content:center}.toolbar button.toggle-remarks-btn.active{background:#51cf66;border-color:#51cf66}.toolbar button.toggle-remarks-btn:not(.active){opacity:.5}.toolbar button.toggle-remarks-btn:not(.active) svg{stroke:#888}.content.hide-remarks .remark-rect{display:none!important}.zoom-controls{display:flex;gap:4px;align-items:center;margin-left:20px;padding-left:20px;border-left:1px solid #444}.zoom-controls button{padding:6px 10px;min-width:32px}.zoom-controls button.active{background:#06c;border-color:#06c;color:#fff}.zoom-controls .zoom-level{font-size:11px;color:#888;min-width:50px;text-align:center}.annotation-controls{display:flex;gap:8px;align-items:center;margin-left:20px;padding-left:20px;border-left:1px solid #444}.resolution-bar{display:flex;gap:4px;align-items:center}.resolution-bar:empty{display:none}.resolution-bar button{padding:4px 10px;border-radius:4px;border:1px solid #3a3a3a;background:transparent;color:#888;cursor:pointer;font-size:11px}.resolution-bar button:hover{background:#333;color:#fff}.resolution-bar button.active{background:#06c;border-color:#06c;color:#fff}.content{flex:1;padding:20px;overflow:hidden;display:flex;flex-direction:column}.comparison-headers{display:flex;gap:20px;flex-shrink:0;margin-bottom:10px}.comparison-headers .panel-header{flex:1;font-size:12px;font-weight:500;padding:8px 12px;border-radius:6px;text-align:center;display:flex;align-items:center;justify-content:center;gap:10px}.comparison-headers .panel-header.old{background:#ff6b6b26;color:#ff6b6b;cursor:pointer}.comparison-headers .panel-header.new{background:#51cf6626;color:#51cf66;cursor:pointer}.comparison-headers .panel-header:hover{filter:brightness(1.2)}.comparison-headers:has(.panel-header.active) .panel-header:not(.active){opacity:.4}.compare-view{display:flex;gap:20px;flex:1;min-height:0}.compare-panel{flex:1;display:flex;flex-direction:column;min-width:0}.version-selector{position:relative;display:inline-block}.version-selector select{padding:4px 24px 4px 8px;border-radius:4px;border:1px solid rgba(255,255,255,.2);background:#0000004d;color:inherit;font-size:11px;cursor:pointer;appearance:none;-webkit-appearance:none}.version-selector:after{content:"▼";font-size:8px;position:absolute;right:8px;top:50%;transform:translateY(-50%);pointer-events:none}.version-selector select:hover{background:#00000080}.version-selector select option{background:#2a2a2a;color:#fff}.no-history{font-size:11px;color:#666;font-style:italic}.compare-modes{display:flex;gap:4px;margin-left:20px;padding-left:20px;border-left:1px solid #444}.compare-modes button{padding:6px 10px;font-size:11px}.slider-compare{position:relative;flex:1;overflow:auto;border-radius:8px;background:#000;text-align:center;user-select:none;-webkit-user-select:none}.slider-compare .slider-inner{position:relative;display:inline-block}.slider-compare .slider-img{display:block;width:100%;height:auto;pointer-events:none;-webkit-user-drag:none;user-drag:none}.slider-compare .slider-img.old{position:absolute;top:0;left:0;z-index:1;clip-path:inset(0 50% 0 0)}.slider-compare .slider-img.new{position:relative;z-index:0}.slider-compare .slider-handle{position:absolute;top:0;bottom:0;left:50%;width:4px;background:#ff6b6b;cursor:ew-resize;z-index:10;transform:translate(-50%)}.slider-compare .slider-handle:before{content:"◀ ▶";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#ff6b6b;color:#fff;padding:8px 4px;border-radius:4px;font-size:10px;white-space:nowrap}.overlay-compare{position:relative;flex:1;overflow:auto;border-radius:8px;background:#000;text-align:center}.overlay-compare .overlay-inner{position:relative;display:inline-block;text-align:left}.overlay-compare .overlay-img{display:block}.overlay-compare .overlay-img.new{position:absolute;top:0;left:0;opacity:.5;mix-blend-mode:difference}.overlay-controls{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background:#000c;padding:10px 20px;border-radius:8px;display:flex;align-items:center;gap:10px;z-index:10}.overlay-controls label{font-size:11px;color:#888}.overlay-controls input[type=range]{width:150px}.diff-compare{position:relative;flex:1;overflow:auto;border-radius:8px;background:#000;text-align:center}.diff-compare canvas{display:inline-block}.diff-legend{position:absolute;top:10px;right:10px;background:#000c;padding:8px 12px;border-radius:6px;font-size:11px}.diff-legend span{margin-right:12px}.diff-legend .added{color:#51cf66}.diff-legend .removed{color:#ff6b6b}.diff-legend .changed{color:#ffd43b}.compare-panel .panel-url,.single-view .panel-url{font-size:11px;color:#666;margin-bottom:8px;padding:6px 10px;background:#252525;border-radius:4px;font-family:Monaco,Menlo,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0}.compare-panel .screenshot{background:#000;border-radius:8px;overflow:auto;flex:1;position:relative;text-align:center}.compare-panel .screenshot-inner{position:relative;display:inline-block}.compare-panel .screenshot img{display:block}.single-view{flex:1;display:flex;flex-direction:column;min-height:0}.single-view .panel-header{font-size:12px;font-weight:500;margin-bottom:10px;padding:8px 12px;border-radius:6px;display:inline-block;flex-shrink:0}.single-view .screenshot{background:#000;border-radius:8px;overflow:auto;flex:1;text-align:center}.single-view .screenshot-inner{position:relative;display:inline-block}.single-view .screenshot img{display:block}.no-image{display:flex;align-items:center;justify-content:center;height:200px;background:#252525;border-radius:8px;color:#555;font-size:13px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#555}.empty-state .icon{font-size:48px;margin-bottom:16px;opacity:.3}.empty-state p{font-size:14px}.screenshot::-webkit-scrollbar{width:8px;height:8px}.screenshot::-webkit-scrollbar-track{background:#1a1a1a}.screenshot::-webkit-scrollbar-thumb{background:#444;border-radius:4px}.screenshot::-webkit-scrollbar-thumb:hover{background:#555}.sync-indicator{display:inline-flex;align-items:center;gap:4px;font-size:10px;color:#51cf66;margin-left:8px;padding:4px 8px;background:#51cf661a;border-radius:4px}.sync-indicator.disabled{color:#666;background:#ffffff0d}.annotation-layer{position:absolute;top:0;left:0;pointer-events:none;z-index:10;transform-origin:top left}.screenshot.drawing .annotation-layer{pointer-events:auto;cursor:crosshair}.drawing-rect{position:absolute;border:2px solid #ff6b6b;background:#ff6b6b33;pointer-events:none}.remark-rect{position:absolute;border:2px solid #4dabf7;background:#4dabf71a;cursor:pointer;pointer-events:auto}.remark-rect:hover{background:#4dabf733}.remark-rect.blocked{border-color:#ff6b6b;background:#ff6b6b1a}.remark-rect.blocked:hover{background:#ff6b6b33}.remark-rect.pending{border-color:#ffa94d;background:#ffa94d1a}.remark-rect.pending:hover{background:#ffa94d33}.remark-rect.resolved{border-color:#51cf66;background:#51cf661a}.remark-rect.mismatched{border-style:dashed;opacity:.6;background:repeating-linear-gradient(45deg,transparent,transparent 4px,rgba(150,150,150,.15) 4px,rgba(150,150,150,.15) 8px)}.remark-rect.mismatched:hover{opacity:.8}.remark-rect.mismatched .remark-number{opacity:.6}.remark-rect.mismatched .remark-thumbnail{opacity:.4}.remark-rect.unread{border-width:3px;animation:pulse-border 2s infinite}@keyframes pulse-border{0%,to{box-shadow:0 0 #4dabf766}50%{box-shadow:0 0 10px 5px #4dabf766}}.remark-rect .remark-number{position:absolute;top:-10px;left:-10px;width:20px;height:20px;background:#4dabf7;color:#fff;border-radius:50%;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center}.remark-rect.blocked .remark-number{background:#ff6b6b}.remark-rect.pending .remark-number{background:#ffa94d}.remark-rect.resolved .remark-number{background:#51cf66}.remark-rect .remark-thumbnail{position:absolute;bottom:-8px;right:-8px;width:20px;height:20px;background:#06c;color:#fff;border-radius:4px;font-size:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:.8;transition:all .15s}.remark-rect .remark-thumbnail:hover{opacity:1;transform:scale(1.1)}.remark-rect.blocked .remark-thumbnail{background:#ff6b6b}.remark-rect.pending .remark-thumbnail{background:#ffa94d}.remark-rect.resolved .remark-thumbnail{background:#51cf66}.remark-tooltip{position:fixed;background:#1a1a1a;border:1px solid #444;border-radius:8px;padding:10px 14px;max-width:300px;font-size:12px;color:#fff;z-index:1000;box-shadow:0 4px 20px #00000080;pointer-events:none;opacity:0;transition:opacity .2s}.remark-tooltip.visible{opacity:1}.remark-tooltip .tooltip-author{font-size:10px;color:#888;margin-bottom:4px}.remark-tooltip .tooltip-text{line-height:1.4}.context-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:2000;padding:40px}.context-overlay .context-content{max-width:90vw;max-height:90vh;display:flex;flex-direction:column;background:#222;border-radius:12px;overflow:hidden}.context-overlay .context-header{padding:16px 20px;background:#2a2a2a;border-bottom:1px solid #333;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.context-overlay .context-header .remark-info{flex:1}.context-overlay .context-header .remark-author-line{display:flex;align-items:center;gap:8px;margin-bottom:8px}.context-overlay .context-header .remark-number{width:24px;height:24px;background:#ff6b6b;color:#fff;border-radius:50%;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center}.context-overlay .context-header .remark-author{font-weight:500;font-size:14px}.context-overlay .context-header .remark-date{font-size:12px;color:#666}.context-overlay .context-header .remark-text{font-size:14px;line-height:1.5;color:#ddd}.context-overlay .context-header .close-btn{background:#444;border:none;color:#fff;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.context-overlay .context-header .close-btn:hover{background:#555}.context-overlay .context-image{flex:1;overflow:auto;position:relative}.context-overlay .context-image img{display:block;max-width:100%}.context-overlay .context-image .highlight-rect{position:absolute;border:3px solid #ff6b6b;background:#ff6b6b26;pointer-events:none;box-shadow:0 0 20px #ff6b6b80}.context-overlay .context-body{display:flex;flex:1;min-height:0;overflow:hidden}.context-overlay .context-main{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.context-overlay .context-discussion{width:420px;background:#1a1a1a;border-left:1px solid #333;display:flex;flex-direction:column;flex-shrink:0}.context-content.global-remark{max-width:600px}.context-content.global-remark .context-discussion{width:100%;border-left:none}.global-badge{background:#888;color:#fff;font-size:10px;font-weight:600;padding:3px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.context-discussion .discussion-header{padding:12px 16px;background:#222;border-bottom:1px solid #333;font-size:13px;font-weight:500;display:flex;align-items:center;gap:8px}.context-discussion .discussion-header .comment-count{background:#444;padding:2px 8px;border-radius:10px;font-size:11px;color:#888}.context-discussion .discussion-list{flex:1;overflow-y:auto;padding:12px}.context-discussion .comment-item{background:#2a2a2a;border-radius:8px;padding:12px;margin-bottom:10px;border:1px solid transparent}.context-discussion .comment-item.unread{background:#ff6b6b1a;border-color:#ff6b6b}.context-discussion .comment-item .new-badge{font-size:9px;font-weight:600;color:#fff;background:#ff6b6b;padding:2px 6px;border-radius:8px;animation:pulse 2s infinite}.context-discussion .comment-item .comment-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.context-discussion .comment-item .comment-author{font-size:12px;font-weight:500;color:#fff}.context-discussion .comment-item .comment-date{font-size:10px;color:#666;margin-left:auto}.context-discussion .comment-item .comment-text{font-size:12px;color:#ccc;line-height:1.5;white-space:pre-wrap}.context-discussion .discussion-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#555;font-size:13px;text-align:center;padding:20px}.context-discussion .discussion-empty svg{opacity:.3;margin-bottom:12px}.context-discussion .discussion-form{padding:12px;background:#222;border-top:1px solid #333}.context-discussion .discussion-form textarea{width:100%;padding:10px 12px;border-radius:6px;border:1px solid #444;background:#1a1a1a;color:#fff;font-size:12px;font-family:inherit;resize:none;min-height:60px;margin-bottom:8px}.context-discussion .discussion-form textarea:focus{outline:none;border-color:#06c}.context-discussion .discussion-form textarea::placeholder{color:#555}.context-discussion .discussion-form .form-actions{display:flex;justify-content:flex-end}.context-discussion .discussion-form button{padding:8px 16px;border-radius:6px;border:none;cursor:pointer;font-size:12px;background:#06c;color:#fff;transition:all .15s}.context-discussion .discussion-form button:hover{background:#07e}.context-discussion .discussion-form button:disabled{background:#444;cursor:not-allowed}.context-discussion .discussion-actions{display:flex;gap:8px;padding:12px;background:#1a1a1a;border-top:1px solid #333}.context-discussion .discussion-actions button{flex:1;padding:10px 16px;border-radius:6px;border:none;cursor:pointer;font-size:12px;font-weight:500;transition:all .15s}.context-discussion .btn-delete{background:#333;color:#ff6b6b}.context-discussion .btn-delete:hover{background:#ff6b6b;color:#fff}.context-discussion .btn-resolve{background:#51cf66;color:#000}.context-discussion .btn-resolve:hover{background:#40c057}.context-discussion .btn-resolve.resolved{background:#666;color:#fff}.context-discussion .btn-resolve.resolved:hover{background:#ff6b6b}.context-discussion .status-select{padding:8px 12px;border-radius:6px;font-size:13px;font-weight:500;border:none;cursor:pointer;background:#444;color:#fff}.context-discussion .status-select.status-open{background:#4dabf7;color:#fff}.context-discussion .status-select.status-blocked{background:#ff6b6b;color:#fff}.context-discussion .status-select.status-pending{background:#ffa94d;color:#000}.context-discussion .status-select.status-resolved{background:#51cf66;color:#000}.context-discussion .remark-original{background:#333;border-radius:8px;padding:12px;margin-bottom:10px;border-left:3px solid #0066cc}.context-discussion .remark-original .comment-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.context-discussion .remark-original .comment-date{font-size:10px;color:#666;margin-left:auto}.context-discussion .btn-edit-remark{background:transparent;border:none;color:#666;cursor:pointer;font-size:14px;padding:4px 8px;border-radius:4px;transition:all .15s}.context-discussion .btn-edit-remark:hover{background:#444;color:#fff}.context-discussion .remark-text-display{font-size:13px;color:#fff;line-height:1.5;white-space:pre-wrap}.context-discussion .remark-text-display.hidden{display:none}.context-discussion .remark-text-edit{display:flex;flex-direction:column;gap:8px}.context-discussion .remark-text-edit.hidden{display:none}.context-discussion .remark-text-edit textarea{width:100%;padding:10px 12px;border-radius:6px;border:1px solid #444;background:#1a1a1a;color:#fff;font-size:13px;font-family:inherit;resize:vertical;min-height:80px}.context-discussion .remark-text-edit textarea:focus{outline:none;border-color:#06c}.context-discussion .edit-actions{display:flex;justify-content:flex-end;gap:8px}.context-discussion .edit-actions button{padding:6px 12px;border-radius:4px;border:none;cursor:pointer;font-size:12px;transition:all .15s}.context-discussion .btn-cancel-edit{background:#444;color:#ccc}.context-discussion .btn-cancel-edit:hover{background:#555;color:#fff}.context-discussion .btn-save-edit{background:#06c;color:#fff}.context-discussion .btn-save-edit:hover{background:#07e}.context-discussion .discussion-separator{display:flex;align-items:center;gap:12px;margin:16px 0;color:#555;font-size:11px;text-transform:uppercase;letter-spacing:.5px}.context-discussion .discussion-separator:before,.context-discussion .discussion-separator:after{content:"";flex:1;height:1px;background:#333}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#2a2a2a;border-radius:12px;padding:24px;width:400px;max-width:90vw}.modal h3{margin-bottom:16px;font-size:16px}.modal label{display:block;font-size:12px;color:#888;margin-bottom:6px}.modal input,.modal textarea{width:100%;padding:10px 12px;border-radius:6px;border:1px solid #444;background:#1a1a1a;color:#fff;font-size:13px;margin-bottom:16px}.modal textarea{min-height:100px;resize:vertical;font-family:inherit}.modal input:focus,.modal textarea:focus{outline:none;border-color:#06c}.modal-buttons{display:flex;gap:10px;justify-content:flex-end}.modal-buttons button{padding:8px 16px;border-radius:6px;border:none;cursor:pointer;font-size:13px}.modal-buttons .btn-cancel{background:#444;color:#fff}.modal-buttons .btn-save{background:#06c;color:#fff}.modal-buttons .btn-delete{background:#ff6b6b;color:#fff}.remarks-panel{width:300px;background:#222;border-left:1px solid #333;display:flex;flex-direction:column;flex-shrink:0;position:relative;transition:margin-right .3s ease;margin-right:0}.remarks-panel.collapsed{margin-right:-300px}.remarks-tab{position:absolute;left:-25px;top:50%;transform:translateY(-50%);width:25px;height:auto;min-height:100px;padding:10px 0;background:#222;border:1px solid #333;border-right:none;border-radius:8px 0 0 8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;writing-mode:vertical-rl;text-orientation:mixed;font-size:12px;font-weight:500;color:#888;transition:all .2s}.remarks-tab:hover{background:#2a2a2a;color:#fff}.remarks-tab .tab-badges{display:flex;flex-direction:row;gap:4px;writing-mode:horizontal-tb}.remarks-tab .tab-badge{display:block;color:#fff;font-size:9px;padding:2px 5px;border-radius:8px;min-width:16px;text-align:center}.remarks-tab .tab-badge.status-open{background:#4dabf7}.remarks-tab .tab-badge.status-blocked{background:#ff6b6b}.remarks-tab .tab-badge.status-pending{background:#ffa94d;color:#000}.remarks-tab .tab-badge.zero{display:none}.remarks-panel.collapsed .remarks-tab{background:#333}.remarks-header{padding:16px;border-bottom:1px solid #333;display:flex;align-items:center;justify-content:space-between}.remarks-header h3{font-size:13px;font-weight:600}.remarks-header .count{font-size:11px;color:#888}.remarks-list{flex:1;overflow-y:auto;padding:12px}.remark-item{background:#2a2a2a;border-radius:8px;padding:12px;margin-bottom:10px;cursor:pointer;border:1px solid #333;transition:all .15s}.remark-item:hover{border-color:#444}.remark-item.blocked{border-color:#ff6b6b;background:#ff6b6b1a}.remark-item.pending{border-color:#ffa94d;background:#ffa94d1a}.remark-item.resolved{opacity:.6}.remark-item.unread{border-color:#4dabf7;background:#4dabf70d}.remark-item .unread-dot{width:8px;height:8px;background:#4dabf7;border-radius:50%;flex-shrink:0;animation:pulse 2s infinite}.remark-item .remark-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px}.remark-item .remark-number{width:20px;height:20px;background:#4dabf7;color:#fff;border-radius:50%;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.remark-item.blocked .remark-number{background:#ff6b6b}.remark-item.pending .remark-number{background:#ffa94d}.remark-item.resolved .remark-number{background:#51cf66}.remark-item .remark-author{font-size:12px;font-weight:500;flex:1}.author-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:500;color:#000}.remark-item .remark-date{font-size:10px;color:#666}.remark-item .remark-text{font-size:12px;color:#ccc;line-height:1.4}.remark-item .remark-resolution{font-size:10px;color:#666;margin-top:6px}.remark-item .remark-actions{display:flex;align-items:center;gap:8px;margin-top:8px}.remark-item .comment-badge{font-size:12px;color:#aaa;margin-left:auto;background:#333;padding:4px 8px;border-radius:10px}.global-empty{font-size:11px;color:#555;padding:12px;text-align:center}.accordion-header .btn-add-global{width:20px;height:20px;border-radius:50%;border:1px solid #444;background:#2a2a2a;color:#888;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;margin-left:auto;margin-right:8px}.accordion-header .btn-add-global:hover{background:#06c;border-color:#06c;color:#fff}.remark-item.global{border-left:3px solid #888}.global-modal-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:2000;padding:40px}.global-modal{background:#1e1e1e;border:1px solid #333;border-radius:12px;width:100%;max-width:500px;overflow:hidden}.global-modal-header{padding:16px 20px;background:#2a2a2a;border-bottom:1px solid #333;display:flex;align-items:center;justify-content:space-between}.global-modal-header h3{margin:0;font-size:16px;color:#fff;display:flex;align-items:center;gap:8px}.global-modal-header .close-btn{background:#444;border:none;color:#fff;width:32px;height:32px;border-radius:8px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center}.global-modal-header .close-btn:hover{background:#555}.global-modal-body{padding:20px}.global-modal-body textarea{width:100%;height:120px;background:#111;border:1px solid #333;border-radius:8px;padding:12px;color:#fff;font-size:14px;resize:vertical;font-family:inherit}.global-modal-body textarea:focus{outline:none;border-color:#09f}.global-modal-body textarea::placeholder{color:#555}.global-modal-footer{padding:16px 20px;background:#2a2a2a;border-top:1px solid #333;display:flex;justify-content:flex-end;gap:12px}.global-modal-footer button{padding:10px 20px;border-radius:6px;font-size:13px;cursor:pointer;border:none}.global-modal-footer .btn-cancel{background:#444;color:#fff}.global-modal-footer .btn-cancel:hover{background:#555}.global-modal-footer .btn-save{background:#09f;color:#fff}.global-modal-footer .btn-save:hover{background:#07c}.global-modal-footer .btn-save:disabled{background:#333;color:#666;cursor:not-allowed}.resolved-section{margin-top:16px;border-top:1px solid #333;padding-top:12px}.resolved-header{font-size:12px;color:#51cf66;margin-bottom:8px;display:flex;align-items:center;gap:6px}.resolved-list{display:flex;flex-direction:column;gap:8px}.btn-load-resolved{width:100%;margin-top:8px;padding:10px;background:#2a2a2a;border:1px dashed #444;border-radius:6px;color:#888;font-size:12px;cursor:pointer;transition:all .15s}.btn-load-resolved:hover{background:#333;border-color:#51cf66;color:#51cf66}.remarks-accordion{display:flex;flex-direction:column;gap:8px}.accordion-group{border:1px solid #333;border-radius:6px;overflow:hidden}.accordion-header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#2a2a2a;cursor:pointer;user-select:none}.accordion-header:hover{background:#333}.accordion-header.active{background:#06c}.accordion-header .accordion-title{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500}.accordion-header .accordion-badge{background:#ff6b6b;color:#fff;padding:2px 6px;border-radius:10px;font-size:10px;font-weight:600}.accordion-header .accordion-arrow{transition:transform .2s}.accordion-header.open .accordion-arrow{transform:rotate(180deg)}.accordion-content{display:none;padding:0}.accordion-content.open{display:block}.accordion-content .remark-item{border-radius:0;border:none;border-top:1px solid #333}.remark-item .remark-actions{display:flex;gap:6px;margin-top:8px}.remark-item .btn-target{padding:4px 8px;border-radius:4px;border:1px solid #444;background:#333;color:#fff;cursor:pointer;font-size:11px;display:flex;align-items:center;gap:4px}.remark-item .btn-target:hover{background:#444}@keyframes flash{0%,to{box-shadow:0 0 #ff6b6b00}50%{box-shadow:0 0 20px 10px #ff6b6b99}}.kanban-view{display:none;flex:1;padding:20px;gap:20px;overflow-x:auto;background:#1a1a1a}.kanban-view.active{display:flex}.kanban-column{flex:1;min-width:320px;max-width:400px;background:#222;border-radius:8px;display:flex;flex-direction:column;max-height:100%}.kanban-column-header{padding:16px;border-bottom:1px solid #333;display:flex;align-items:center;gap:10px;flex-shrink:0}.kanban-column-header h3{margin:0;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.kanban-column-header .count{padding:2px 8px;border-radius:10px;font-size:12px;font-weight:600}.kanban-column.open .kanban-column-header{border-bottom-color:#4dabf7}.kanban-column.open .kanban-column-header h3{color:#4dabf7}.kanban-column.open .kanban-column-header .count{background:#4dabf7;color:#fff}.kanban-column.blocked .kanban-column-header{border-bottom-color:#ff6b6b}.kanban-column.blocked .kanban-column-header h3{color:#ff6b6b}.kanban-column.blocked .kanban-column-header .count{background:#ff6b6b;color:#fff}.kanban-column.pending .kanban-column-header{border-bottom-color:#ffa94d}.kanban-column.pending .kanban-column-header h3{color:#ffa94d}.kanban-column.pending .kanban-column-header .count{background:#ffa94d;color:#000}.kanban-column.resolved .kanban-column-header{border-bottom-color:#51cf66}.kanban-column.resolved .kanban-column-header h3{color:#51cf66}.kanban-column.resolved .kanban-column-header .count{background:#51cf66;color:#000}.kanban-cards{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px}.kanban-card{background:#2a2a2a;border-radius:6px;padding:12px;cursor:pointer;border:1px solid #333;transition:all .15s}.kanban-card:hover{border-color:#555;transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.kanban-card-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.kanban-card-number{width:22px;height:22px;border-radius:50%;background:#4dabf7;color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.kanban-column.blocked .kanban-card-number{background:#ff6b6b;color:#fff}.kanban-column.pending .kanban-card-number{background:#ffa94d;color:#000}.kanban-column.resolved .kanban-card-number{background:#51cf66;color:#000}.kanban-card-target{font-size:10px;color:#888;text-transform:uppercase;letter-spacing:.5px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kanban-card-resolution{font-size:9px;color:#666;background:#333;padding:2px 6px;border-radius:4px}.kanban-card-text{font-size:13px;color:#ddd;line-height:1.4;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.kanban-card-footer{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#666}.kanban-card-author{display:flex;align-items:center;gap:6px}.kanban-card-author .author-badge{font-size:10px;padding:1px 6px}.kanban-card-comments{display:flex;align-items:center;gap:4px;color:#888}.kanban-card-actions{display:flex;align-items:center;gap:8px}.kanban-card-goto{width:26px;height:26px;border-radius:4px;border:1px solid #444;background:#333;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .15s}.kanban-card-goto:hover{background:#06c;border-color:#06c;transform:scale(1.1)}.kanban-empty{text-align:center;color:#555;padding:20px;font-size:13px}.sidebar-kanban{padding:12px 20px;border-bottom:1px solid #333}.sidebar-kanban button{width:100%;padding:10px 16px;border-radius:6px;border:1px solid #444;background:#2a2a2a;color:#fff;cursor:pointer;font-size:13px;font-weight:500;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:8px}.sidebar-kanban button:hover{background:#333;border-color:#555}.sidebar-kanban button.active{background:#9c27b0;border-color:#9c27b0}.sidebar.collapsed .sidebar-kanban{padding:8px 5px}.sidebar.collapsed .sidebar-kanban button{padding:8px;font-size:0;gap:0}.sidebar.collapsed .sidebar-kanban button:before{content:"📋";font-size:16px}#app{width:100%;height:100%;display:flex}.boot-error{padding:2rem;color:#ff6b6b}.project-selector{padding:12px 20px;border-bottom:1px solid #333}.project-selector h2{font-size:11px;color:#666;text-transform:uppercase;margin-bottom:8px;letter-spacing:.5px}.project-selector ul{list-style:none;padding:0;margin:0}.project-selector li{margin-bottom:4px}.project-selector button{width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:6px;padding:8px 12px;cursor:pointer;color:#fff;font-size:12px;display:flex;flex-direction:column}.project-selector button:hover{background:#2a2a2a}.project-selector button.active{background:#06c;border-color:#06c}.project-selector button .workspace{font-size:10px;color:#aaa;opacity:.8}.empty-state,.placeholder{padding:1rem;color:#666;text-align:center;font-size:13px}