@layer components{.comment-section{margin-top:2rem}.comment-section-header{color:var(--text-primary);align-items:center;gap:.5rem;margin-bottom:1.25rem;font-size:1.25rem;font-weight:700;display:flex}.comment-count{color:var(--text-muted);font-size:.875rem;font-weight:500}.comment-list{flex-direction:column;gap:0;display:flex}.comment-item{border-bottom:1px solid var(--border-subtle);padding:1rem 0}.comment-item:last-child{border-bottom:none}.comment-item-reply{border-left:2px solid var(--border-subtle);margin-top:.5rem;margin-left:1rem;padding-left:1.5rem}.comment-item-inner{gap:.75rem;display:flex}.comment-avatar{background:var(--surface-secondary);width:32px;height:32px;color:var(--text-muted);border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;font-size:.8125rem;font-weight:600;display:flex;overflow:hidden}.comment-avatar img{object-fit:cover;width:100%;height:100%}.comment-content{flex:1;min-width:0}.comment-header{align-items:center;gap:.5rem;margin-bottom:.25rem;display:flex}.comment-author{color:var(--text-primary);font-size:.875rem;font-weight:600}.comment-time{color:var(--text-muted);font-size:.75rem}.comment-body{color:var(--text-secondary);white-space:pre-wrap;word-break:break-word;font-size:.875rem;line-height:1.6}.comment-actions{align-items:center;gap:.75rem;margin-top:.5rem;display:flex}.comment-action-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0;font-size:.75rem;font-weight:500;transition:color .15s}.comment-action-btn:hover{color:var(--text-primary)}.comment-action-btn-danger:hover{color:var(--color-error-600)}.comment-form{margin-top:.75rem}.comment-form textarea{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-primary);width:100%;color:var(--text-primary);resize:vertical;min-height:4.5rem;padding:.625rem .75rem;font-size:.875rem;line-height:1.5;transition:border-color .15s}.comment-form textarea:focus{border-color:var(--color-brand-600);outline:none}.comment-form textarea::placeholder{color:var(--text-muted)}.comment-form-actions{align-items:center;gap:.5rem;margin-top:.5rem;display:flex}.comment-form-submit{border-radius:var(--radius-md);background:var(--color-brand-600);color:#fff;cursor:pointer;border:none;padding:.375rem 1rem;font-size:.8125rem;font-weight:600;transition:opacity .15s}.comment-form-submit:disabled{opacity:.5;cursor:not-allowed}.comment-form-cancel{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:var(--surface-primary);color:var(--text-secondary);cursor:pointer;padding:.375rem 1rem;font-size:.8125rem;font-weight:500;transition:background .15s}.comment-form-cancel:hover{background:var(--surface-secondary)}.comment-form-error{color:var(--color-error-600);margin-top:.375rem;font-size:.8125rem}.comment-login-prompt{color:var(--text-muted);text-align:center;border:1px dashed var(--border-subtle);border-radius:var(--radius-md);margin-bottom:1rem;padding:1rem;font-size:.875rem}.comment-login-prompt a{color:var(--color-brand-600);text-decoration:underline}.comment-empty{color:var(--text-muted);text-align:center;padding:1.5rem 0;font-size:.875rem}}