.comment-toolbar { display:flex; gap:6px; flex-wrap:wrap; }
.comment-panel { position:fixed; inset:12px 12px 12px auto; margin:0; width:min(420px,calc(100vw - 24px)); max-width:none; max-height:calc(100dvh - 24px); height:calc(100dvh - 24px); padding:24px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); color:var(--text); overflow:auto; box-sizing:border-box; font-family:var(--sans); }
.comment-panel::backdrop { background:rgb(0 0 0 / .28); }
.comment-panel header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.comment-panel h2 { margin:0; font-size:20px; }
.comment-panel [data-error] { color:var(--danger); }
.comment-panel [data-error]:empty { display:none; }
.comment-panel textarea { width:100%; box-sizing:border-box; resize:vertical; background:var(--surface-raised); color:var(--text); border:1px solid var(--line-strong); border-radius:var(--radius-sm); padding:12px; font:inherit; }
.comment-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.comment-filters { display:grid; gap:12px; margin:20px 0; }
.comment-filters label { display:flex; align-items:center; gap:10px; }
.comment-filters input { width:auto; accent-color:var(--accent); }
.comment-list { display:grid; gap:10px; }
.comment-list > button { text-align:left; border:1px solid var(--line); background:var(--surface-raised); color:var(--text); border-radius:var(--radius-sm); padding:14px; cursor:pointer; font:inherit; overflow-wrap:anywhere; }
.comment-list p { white-space:pre-wrap; margin:8px 0; }
.comment-list small { color:var(--muted); }
.comment-markers { position:fixed; inset:0; pointer-events:none; z-index:80; }
.comment-marker { position:absolute; transform:translate(-50%,-50%); pointer-events:auto; width:28px; height:28px; border-radius:50% 50% 50% 3px; border:1px solid var(--text); background:var(--accent); color:var(--bg); font:600 12px var(--sans); cursor:pointer; }
.comment-armed .workspace-view { cursor:crosshair; }
.comment-mode-hint { position:fixed; bottom:22px; left:50%; transform:translateX(-50%); z-index:100; background:var(--surface-raised); color:var(--text); border:1px solid var(--accent); padding:12px 20px; border-radius:var(--radius); box-shadow:0 8px 30px #0005; max-width:calc(100vw - 32px); }
.comment-toolbar [aria-pressed="true"] { border-color:var(--accent); color:var(--accent); }