.comments-panel{width:min(42rem,100vw - 2rem);margin:var(--size-xl) auto var(--size-2xl);padding:var(--size-s);background:var(--surface-1);border:2px solid var(--text-1);border-radius:var(--radius-xs);box-shadow:6px 6px 0 var(--text-1)}.comments-panel-head{gap:.35rem;margin-block-end:var(--size-s);display:grid}.comments-panel h2,.comments-panel p{margin:0}.comments-panel h2{font-family:var(--font-display);text-transform:uppercase;font-size:1.25rem;line-height:1}.comments-panel-head p{color:var(--text-muted);font-size:.9rem;line-height:1.4}.comments-list{gap:.75rem;display:grid}.comment-card{background:var(--surface-2);border:1px solid var(--border-muted);border-radius:var(--radius-xs);transition:background var(--motion-hover), box-shadow var(--motion-hover);gap:.45rem;padding:.8rem;display:grid}.comment-card.is-active{background:var(--selected-tint);box-shadow:inset 0 0 0 2px var(--brand)}.comment-card header{color:var(--text-1);font-size:.85rem;font-weight:900}.comment-card blockquote,.comment-card p{margin:0;line-height:1.45}.comment-card blockquote{color:var(--text-muted);border-inline-start:3px solid var(--brand);padding-inline-start:.65rem;font-size:.85rem}.comment-card p{color:var(--text-2)}.comment-highlight{cursor:pointer;background:color-mix(in oklab, var(--warning) 35%, transparent);color:inherit;border-radius:.12rem;padding-inline:.08em}.comment-highlight:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.inline-comment-popover{z-index:100;background:var(--surface-1);inline-size:min(20rem,100vw - 2rem);color:var(--text-1);border:2px solid var(--text-1);border-radius:var(--radius-xs);box-shadow:7px 7px 0 var(--text-1);gap:.75rem;padding:.85rem;display:grid;position:fixed}.inline-comment-popover[hidden]{display:none}.inline-comment-popover label{text-transform:uppercase;gap:.35rem;font-size:.75rem;font-weight:900;display:grid}.inline-comment-popover input[type=text],.inline-comment-popover textarea{box-sizing:border-box;inline-size:100%;color:var(--text-1);background:var(--surface-1);border:2px solid var(--text-1);border-radius:var(--radius-2xs);font:700 .9rem var(--font-sans);text-transform:none;padding:.55rem}.inline-comment-popover textarea{resize:vertical;min-block-size:6rem}.comment-slider-label{background:var(--surface-2);border:1px solid var(--border-muted);border-radius:var(--radius-xs);padding:.55rem}.comment-slider{accent-color:var(--brand);cursor:grab}.comment-slider:active{cursor:grabbing}.inline-comment-status{min-block-size:1.2rem;color:var(--text-muted);margin:0;font-size:.8rem;font-weight:800}