.hao-comment{margin-top:var(--spacing-9);max-width:var(--container--width);margin-left:auto;margin-right:auto;scroll-margin-top:calc(var(--header--height,4rem) + var(--spacing-8))}.hao-comment-header{display:flex;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-7)}.hao-comment-header h2{font-size:1.5rem;font-weight:var(--font-weight-semibold);color:var(--color-contrast);margin:0}.hao-comment-form{margin-bottom:var(--spacing-8)}.hao-comment-form-inner{display:flex;flex-direction:column}.hao-comment-form-avatar{flex-shrink:0}.hao-comment-form-avatar img{width:2.25rem;height:2.25rem;border-radius:50%;object-fit:cover}.hao-comment-form-avatar i{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--color-background-200);color:var(--color-secondary);font-size:1rem}.hao-comment-form-avatar .avatar[data-placeholder]{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--color-background-200);color:var(--color-secondary);font-size:1rem;font-weight:var(--font-weight-medium)}.hao-comment-form-avatar .avatar[data-placeholder]::after{content:attr(data-placeholder)}.hao-comment-form-body{width:100%}.hao-comment-form-guest{display:flex;gap:var(--spacing-4);margin-bottom:var(--spacing-4)}.hao-comment-form-guest input{flex:1;min-width:0;padding:var(--spacing-4) var(--spacing-6);border:1px solid var(--color-border);border-radius:var(--radius-3);background:var(--color-background);color:var(--color-contrast);font-size:var(--font-base);transition:border-color .15s}.hao-comment-form-textarea textarea{width:100%;min-height:140px;padding:var(--spacing-6);padding-bottom:2.5rem;border:1px solid var(--color-border);background:var(--color-background);color:var(--color-contrast);font-size:var(--font-base);font-family:inherit;resize:none;overflow-y:auto;transition:border-color .15s;scrollbar-width:none}.hao-comment-form-textarea textarea::-webkit-scrollbar{display:none}.hao-comment-form-textarea textarea::placeholder{color:var(--color-secondary)}.hao-comment-form-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-3);margin-top:var(--spacing-5)}.hao-comment-submit{padding:var(--spacing-3) var(--spacing-5);border:none;border-radius:var(--radius-2);background:var(--color-contrast);color:var(--color-background);font-size:var(--font-small);font-weight:var(--font-weight-medium);cursor:pointer;transition:opacity .15s}.hao-comment-submit:hover{opacity:.85}.hao-comment-submit:disabled{opacity:.5;cursor:not-allowed}.hao-comment-list{list-style:none;margin:0;padding:0}.hao-comment-item{padding:var(--spacing-7) 0}.hao-comment-item-inner{display:flex;gap:var(--spacing-6);align-items:flex-start}.hao-comment-avatar{flex-shrink:0;--avatar--size:2.75rem}.hao-comment-avatar img{width:2.75rem;height:2.75rem;border-radius:50%;object-fit:cover}.hao-comment-avatar .avatar[data-placeholder]{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--color-background-200);color:var(--color-secondary);font-size:1.125rem;font-weight:var(--font-weight-medium)}.hao-comment-avatar .avatar[data-placeholder]::after{content:attr(data-placeholder)}.hao-comment-body{flex:1;min-width:0}.hao-comment-meta{display:flex;flex-direction:column;gap:var(--spacing-2);margin-bottom:var(--spacing-3)}.hao-comment-author{font-size:var(--font-base);font-weight:var(--font-weight-medium);color:var(--color-contrast);line-height:1.2}a.hao-comment-author,a.hao-comment-author:hover{text-decoration:none}.hao-comment-avatar-link{display:block}.hao-comment-date{font-size:var(--font-x-small);color:var(--color-secondary);line-height:1.2;user-select:none}.hao-comment-ua{display:inline-flex;gap:var(--spacing-2);flex-wrap:wrap}.hao-comment-ua-tag{font-size:var(--font-x-small);line-height:1.4;color:var(--color-secondary);background:var(--color-background-100);padding:var(--spacing-1) var(--spacing-4);border-radius:999px;user-select:none;white-space:nowrap}.hao-comment-admin-badge,.hao-comment-user-badge{user-select:none}.hao-comment-pending{font-size:var(--font-small);color:var(--color-secondary);background:var(--color-background-100);padding:var(--spacing-1) var(--spacing-3);border-radius:var(--radius-1)}.hao-comment-author-row{display:flex;align-items:center;gap:var(--spacing-3)}.hao-comment-admin-badge{font-size:var(--font-x-small);color:#f56c6c;background:#fdecec;padding:1px var(--spacing-3);border-radius:999px;line-height:1.4}.hao-comment-user-badge{font-size:var(--font-x-small);color:#3c83f7;background:#e8f0fe;padding:1px var(--spacing-3);border-radius:999px;line-height:1.4}:root[data-color-scheme=dark] .hao-comment-admin-badge{background:#38262a}:root[data-color-scheme=dark] .hao-comment-user-badge{background:#22293c}@media (prefers-color-scheme:dark){:root[data-color-scheme=system] .hao-comment-admin-badge{background:#38262a}:root[data-color-scheme=system] .hao-comment-user-badge{background:#22293c}}.hao-comment-content{font-size:var(--font-base);color:var(--color-contrast);line-height:1.6;word-break:break-word}.hao-comment-content p{margin:0}.hao-comment-actions{display:flex;align-items:center;gap:var(--spacing-4);margin-top:var(--spacing-3)}.hao-comment-reply-btn{display:inline-flex;align-items:center;border:none;border-radius:999px;background:var(--color-background-100);color:var(--color-secondary);font-size:var(--font-x-small);cursor:pointer;padding:var(--spacing-1) var(--spacing-4);transition:color .15s,background .15s;line-height:1.4}.hao-comment-reply-btn:hover{color:var(--color-contrast);background:var(--color-background-200)}.hao-comment-replies{margin-top:0;padding-left:var(--spacing-7);margin-left:var(--spacing-6)}.hao-comment-replies .hao-comment-item{padding:var(--spacing-5) 0}.hao-comment-expand-wrap{position:relative;margin-top:var(--spacing-2)}.hao-comment-expand-wrap::before{content:'';position:absolute;bottom:100%;left:0;right:0;height:3rem;background:linear-gradient(to bottom,transparent,var(--color-background));pointer-events:none;border-radius:var(--radius-3) var(--radius-3) 0 0}.hao-comment-expand-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-2);width:100%;padding:var(--spacing-3) 0;border:none;border-radius:var(--radius-3);background:var(--color-background-100);color:var(--color-secondary);font-size:var(--font-small);cursor:pointer;transition:background .15s,color .15s}.hao-comment-expand-btn:hover{background:var(--color-background-200);color:var(--color-contrast)}.hao-comment-replies .hao-comment-avatar{--avatar--size:2.25rem}.hao-comment-replies .hao-comment-avatar img{width:2.25rem;height:2.25rem}.hao-comment-replies .hao-comment-avatar .avatar[data-placeholder]{width:2.25rem;height:2.25rem;font-size:1rem}.hao-comment-reply-to-inline{font-size:var(--font-small);color:var(--color-secondary);margin-top:var(--spacing-1);margin-bottom:var(--spacing-2)}.hao-comment-reply-form{margin-top:var(--spacing-5);padding:var(--spacing-6);background:var(--color-background-100);border-radius:var(--radius-3)}.hao-comment-reply-form textarea{width:100%;min-height:70px;padding:var(--spacing-5);border:1px solid var(--color-border);border-radius:var(--radius-2);background:var(--color-background);color:var(--color-contrast);font-size:var(--font-base);font-family:inherit;resize:none;overflow-y:auto;transition:border-color .15s}.hao-comment-reply-form-actions{display:flex;justify-content:flex-end;gap:var(--spacing-3);margin-top:var(--spacing-3)}.hao-comment-reply-cancel{padding:var(--spacing-3) var(--spacing-6);border:none;border-radius:var(--radius-2);background:var(--color-background-200);color:var(--color-contrast);font-size:var(--font-small);cursor:pointer;transition:opacity .15s}.hao-comment-reply-cancel:hover{opacity:.85}.hao-comment-reply-submit{padding:var(--spacing-3) var(--spacing-6);border:none;border-radius:var(--radius-2);background:var(--color-contrast);color:var(--color-background);font-size:var(--font-small);font-weight:var(--font-weight-medium);cursor:pointer;transition:opacity .15s}.hao-comment-reply-submit:hover{opacity:.85}.hao-comment-reply-submit:disabled{opacity:.5;cursor:not-allowed}.hao-comment-sentinel{height:1px}.hao-comment-empty{text-align:center;padding:var(--spacing-9) 0;color:var(--color-secondary);font-size:var(--font-base)}.hao-comment-loading{display:flex;justify-content:center;padding:var(--spacing-8) 0;color:var(--color-secondary)}.hao-comment-load-replies{background:0 0;border:none;padding:0;font-size:var(--font-small);color:var(--ghost-accent-color);cursor:pointer;margin-top:var(--spacing-4)}.hao-comment-load-replies:hover{opacity:.8}.hao-comment-form-user{display:flex;align-items:center;gap:var(--spacing-3)}.hao-comment-form-username{font-size:var(--font-small);color:var(--color-contrast);font-weight:var(--font-weight-medium)}.hao-comment-auth-row{display:flex;gap:var(--spacing-4)}.hao-comment-guest-row{display:flex;align-items:center;gap:var(--spacing-4);margin-top:var(--spacing-5)}.hao-comment-guest-row .hao-comment-form-avatar{flex-shrink:0}.hao-comment-guest-row input{flex:1;min-width:0;height:auto;min-height:0;padding:var(--spacing-3) var(--spacing-5);border:none;border-radius:var(--radius-2);background:var(--color-background-200);color:var(--color-contrast);font-size:var(--font-small);line-height:1.5}.hao-comment-auth-btn{display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-5);border:none;border-radius:var(--radius-2);font-size:var(--font-small);cursor:pointer;transition:opacity .15s}.hao-comment-auth-login{background:var(--color-contrast);color:var(--color-background);font-weight:var(--font-weight-medium)}.hao-comment-auth-guest{background:var(--color-background-200);color:var(--color-secondary)}.hao-comment-auth-guest.is-active{color:var(--color-contrast)}.hao-comment-auth-btn:hover{opacity:.85}.hao-comment-login-modal{width:320px;max-width:calc(100vw - 32px);background:var(--color-background);border-radius:var(--radius-4);box-shadow:0 16px 48px rgba(0,0,0,.18);padding:var(--spacing-8);animation:.2s searchModalIn}.hao-comment-login-modal-title{font-size:1.1rem;font-weight:var(--font-weight-semibold);color:var(--color-contrast);margin-bottom:var(--spacing-6);text-align:center}.hao-comment-login-modal-btn{display:flex;align-items:center;justify-content:center;gap:var(--spacing-3);width:100%;padding:var(--spacing-5) var(--spacing-6);border:none;border-radius:var(--radius-3);background:var(--color-background-100);color:var(--color-contrast);font-size:var(--font-base);cursor:pointer;transition:background .15s}.hao-comment-login-modal-btn+.hao-comment-login-modal-btn{margin-top:var(--spacing-3)}.hao-comment-login-modal-btn:hover{background:var(--color-background-200)}.hao-comment-login-modal-btn:disabled{opacity:.5;cursor:not-allowed}.hao-comment-ai-btn{position:absolute;left:var(--spacing-4);bottom:var(--spacing-4);z-index:3;display:inline-flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-4);border:none;border-radius:var(--radius-2) var(--radius-2) var(--radius-2) calc(1.5rem - 6px);background:var(--color-background-200);color:var(--color-secondary);font-size:var(--font-x-small);cursor:pointer;transition:color .15s,background .15s}.hao-comment-ai-btn:hover{color:var(--color-contrast);background:var(--color-background-300)}.hao-comment-ai-btn.is-loading{pointer-events:none;opacity:.6}.hao-comment-ai-btn svg{width:.875rem;height:.875rem;flex-shrink:0}@property --ai-angle{syntax:'<angle>';initial-value:0deg;inherits:false}@keyframes ai-glow-rotate{to{--ai-angle:360deg}}@keyframes ai-glow-open{0%{clip-path:circle(0% at 0% 100%)}99.9%{clip-path:circle(200% at 50% 50%)}100%{clip-path:none}}.hao-comment-form-textarea{position:relative;border-radius:1.5rem;padding:2px}.hao-comment-form-textarea textarea{position:relative;z-index:2;border-radius:calc(1.5rem - 2px)}.hao-comment-form-textarea::after,.hao-comment-form-textarea::before{content:'';position:absolute;pointer-events:none;opacity:0;background:conic-gradient(from var(--ai-angle),#f0aa31,#f1981d,#d38b1c,#bca862,#8bac9d,#74a7b1,#57a1c9,#449fd6,#3e9dde,#299cf0,#4a83da,#6b75ca,#9671d1,#8a7ae2,#8377dc,#926abd,#9f63af,#b75c99,#d26398,#cc5a84,#c55c74,#c35a5d,#d06951,#e77a33,#f2851e,#f98d0d,#f29104,#f0aa31);transition:opacity 1s}.hao-comment-form-textarea::before{inset:-1px;border-radius:calc(1.5rem + 1px);z-index:0;filter:blur(2px)}.hao-comment-form-textarea::after{inset:-4px;border-radius:calc(1.5rem + 4px);z-index:-1;filter:blur(8px)}.hao-comment-form-textarea.ai-glow-active::after,.hao-comment-form-textarea.ai-glow-active::before{opacity:1;animation:1.5s forwards ai-glow-open,8s linear 1.5s infinite ai-glow-rotate}.hao-comment-form-textarea.ai-glow-active.ai-glow-fading::after,.hao-comment-form-textarea.ai-glow-active.ai-glow-fading::before{opacity:0;transition:opacity 2s}