.comments-root { border:1px solid var(--stroke, var(--feed-card-border, #2c2f48)); border-radius:14px; padding:14px; background:linear-gradient(145deg, rgba(29,31,54,0.9), rgba(18,20,36,0.95)); color:var(--text, var(--text-color, #e7ecf5)); box-shadow:0 15px 45px rgba(0,0,0,0.25); }
.cmt-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; flex-wrap:wrap; }
.cmt-header-title { display:flex; align-items:center; gap:10px; }
.cmt-header strong { font-size:1.05rem; letter-spacing:0.3px; }
.cmt-count { background:rgba(59,130,246,0.14); color:#a5b4fc; border:1px solid rgba(99,102,241,0.4); padding:4px 10px; border-radius:999px; font-size:12px; text-transform:uppercase; letter-spacing:0.5px; }
.cmt-header select { background:rgba(255,255,255,0.05); color:inherit; border:1px solid rgba(255,255,255,0.12); border-radius:10px; padding:8px 10px; min-width:110px; }
.cmt-header select:focus { outline:2px solid rgba(99,102,241,0.6); outline-offset:1px; }

.cmt-form { display:flex; gap:10px; margin-bottom:14px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:10px; box-shadow:inset 0 1px 0 rgba(255,255,255,0.05); }
.cmt-form textarea { flex:1; min-height:80px; border:1px solid rgba(255,255,255,0.12); border-radius:10px; background:rgba(0,0,0,0.2); color:inherit; padding:10px 12px; resize:vertical; }
.cmt-form textarea:focus { outline:2px solid rgba(59,130,246,0.4); border-color:rgba(99,102,241,0.6); box-shadow:0 0 0 4px rgba(99,102,241,0.18); }
.cmt-form .cmt-submit { border:1px solid rgba(99,102,241,0.6); background:linear-gradient(135deg, #6366f1, #3b82f6); color:#fff; border-radius:12px; padding:10px 14px; cursor:pointer; font-weight:600; box-shadow:0 10px 20px rgba(63,94,251,0.25); transition:transform 120ms ease, box-shadow 120ms ease; }
.cmt-form .cmt-submit:hover { transform:translateY(-1px); box-shadow:0 14px 28px rgba(63,94,251,0.32); }

.cmt-list { display:flex; flex-direction:column; gap:12px; }
.comment { display:block; border:1px solid rgba(255,255,255,0.05); border-radius:14px; padding:12px; background:rgba(255,255,255,0.03); backdrop-filter:blur(6px); box-shadow:0 1px 0 rgba(255,255,255,0.04), 0 20px 35px rgba(0,0,0,0.3); }
.cmt-head { display:grid; grid-template-columns:auto 1fr auto; align-items:flex-start; gap:12px; margin-bottom:8px; }
.cmt-avatar { width:42px; height:42px; border-radius:50%; overflow:hidden; border:2px solid rgba(99,102,241,0.4); box-shadow:0 0 0 3px rgba(99,102,241,0.12); }
.cmt-avatar-img { width:100%; height:100%; object-fit:cover; display:block; }
.cmt-head-main { display:flex; flex-direction:column; gap:6px; }
.cmt-votes { display:flex; align-items:center; gap:6px; background:rgba(255,255,255,0.04); padding:6px 10px; border-radius:10px; border:1px solid rgba(255,255,255,0.08); }
.cmt-up, .cmt-dn { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.15); border-radius:8px; padding:4px 8px; cursor:pointer; color:inherit; transition:all 120ms ease; }
.cmt-up:hover, .cmt-dn:hover { border-color:#6366f1; color:#c7d2fe; box-shadow:0 0 0 3px rgba(99,102,241,0.18); }
.cmt-up.voted, .cmt-dn.voted { background:rgba(99,102,241,0.15); border-color:#818cf8; color:#c7d2fe; }
.cmt-score { min-width: 28px; text-align:center; opacity:.9; font-weight:700; }

.cmt-meta { display:flex; gap:8px; align-items:center; color:var(--text-dim,var(--feed-muted-color,#9ca3af)); font-size:13px; flex-wrap:wrap; }
.cmt-author { color:#e5e7eb; font-weight:700; }
.cmt-author.muted { color:#9ca3af; font-weight:500; }
.cmt-text { white-space:pre-wrap; line-height:1.55; color:inherit; }
.cmt-deleted { font-style:italic; color:var(--text-dim,#9ca3af); }

.cmt-actions { display:flex; gap:8px; flex-wrap:wrap; }
.cmt-action { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:6px 10px; cursor:pointer; color:inherit; transition:all 120ms ease; }
.cmt-action:hover { border-color:#6366f1; color:#c7d2fe; box-shadow:0 0 0 3px rgba(99,102,241,0.14); }
.cmt-action.danger { color:#fda4af; border-color:rgba(248,113,113,0.6); }

.cmt-body { margin-left:54px; }
.cmt-reply { display:flex; gap:8px; margin-top:10px; margin-left:54px; }
.cmt-reply textarea { flex:1; min-height:60px; border:1px solid rgba(255,255,255,0.14); border-radius:10px; background:rgba(0,0,0,0.2); color:inherit; padding:8px 10px; }
.cmt-reply .cmt-submit { border:1px solid rgba(99,102,241,0.6); background:linear-gradient(135deg, #6366f1, #3b82f6); color:#fff; border-radius:10px; padding:8px 12px; cursor:pointer; box-shadow:0 10px 20px rgba(63,94,251,0.25); }

.cmt-children { margin-left:24px; border-left:2px solid rgba(255,255,255,0.07); padding-left:14px; display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.cmt-more { align-self:flex-start; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.12); border-radius:10px; padding:8px 12px; cursor:pointer; color:inherit; transition:all 120ms ease; }
.cmt-more:hover { border-color:#6366f1; color:#c7d2fe; }
.hidden { display:none !important; }