:root{color:#ffffffe6;font-synthesis:none;background:0 0;font-family:Inter,DM Sans,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{background:0 0}button,input,textarea{font:inherit}button{cursor:pointer}#app{background:#0e0e0ef5;flex-direction:column;min-height:100vh;display:flex}header{z-index:3;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#0e0e0ee0;border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;min-height:58px;padding:10px 12px 10px 18px;display:flex;position:sticky;top:0}header strong{-webkit-user-select:none;user-select:none;font-size:14px;font-weight:560}.header-actions,.composer-actions,.comment-actions{align-items:center;gap:8px;display:flex}input,textarea{color:#ffffffe0;background:#ffffff0e;border:1px solid #ffffff17;border-radius:9px;outline:none}.icon-button,.text-button,.comment-actions button{color:#fff9;background:0 0;border:0}.icon-button{border-radius:50%;width:34px;height:34px;font-size:22px;line-height:1}.icon-button:hover,.text-button:hover,.comment-actions button:hover{color:#fff;background:#ffffff12}.text-button,.comment-actions button{border-radius:7px;padding:6px 7px;font-size:11px}.composer{border-bottom:1px solid #ffffff12;gap:9px;padding:14px;display:grid}.nickname{width:min(180px,60%);padding:9px 10px;font-size:12px}textarea{resize:vertical;width:100%;min-height:96px;padding:11px;font-size:12px;line-height:1.6}input:focus,textarea:focus{border-color:#ffffff3d}.composer-actions{min-height:32px}.composer-actions .status{color:#ffffff6b;flex:1;font-size:10px}.submit{color:#111;background:#ffffffe6;border:0;border-radius:999px;min-width:58px;padding:8px 13px;font-size:11px;font-weight:600}.submit:disabled{opacity:.45}.reply-target{color:#ffffff8c;cursor:pointer;background:#ffffff0d;border-radius:7px;padding:7px 9px;font-size:10px}.comment-list{flex:1;padding:4px 14px 18px}.thread{border-bottom:1px solid #fff1}.comment{grid-template-columns:30px minmax(0,1fr);gap:10px;padding:15px 0;display:grid}.comment.reply{border-left:1px solid #ffffff17;grid-template-columns:26px minmax(0,1fr);margin-left:18px;padding:12px 0 12px 12px}.comment-avatar{width:30px;height:30px;color:hsla(var(--avatar-hue), 34%, 94%, .9);background:hsla(var(--avatar-hue), 32%, 46%, .34);border:1px solid hsla(var(--avatar-hue), 48%, 72%, .12);-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;font-size:12px;font-weight:620;line-height:1;display:flex}.comment.reply .comment-avatar{width:26px;height:26px;font-size:10px}.comment-main{min-width:0}.comment-head{align-items:center;gap:9px;min-height:30px;display:flex}.comment.reply .comment-head{min-height:26px}.comment-head strong{font-size:12px;font-weight:560}.comment-head time{color:#ffffff52;font-size:9px}.comment-actions{gap:2px;margin-top:7px}.comment-actions .like-button{justify-content:center;align-items:center;gap:4px;min-width:28px;height:28px;padding:4px 6px;display:inline-flex}.comment-actions .like-button svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:14px;height:14px;transition:fill .16s,transform .16s}.comment-actions .like-button span{font-variant-numeric:tabular-nums;font-size:10px}.comment-actions .like-button.liked{color:#ff6b7e}.comment-actions .like-button.liked svg{fill:currentColor;transform:scale(1.04)}.comment-actions .danger{color:#ff6a6ab8}.markdown{color:#ffffffc2;overflow-wrap:anywhere;font-size:12px;line-height:1.7}.markdown p{margin:8px 0 0}.markdown a{color:#89b9ff}.markdown img{border-radius:8px;max-width:100%;max-height:320px;margin-top:8px;display:block}.markdown pre,.markdown code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.markdown pre{background:#ffffff0d;border-radius:7px;padding:10px;overflow:auto}.markdown blockquote{border-left:2px solid #ffffff29;margin:8px 0;padding-left:10px}.preview{background:#ffffff0a;border-radius:9px;min-height:96px;padding:10px}.preview-error,.empty{color:#ffffff61;font-size:11px}.empty{text-align:center;padding:36px 0}footer{color:#ffffff3d;text-align:center;padding:12px 16px 18px;font-size:9px}footer a{color:#ffffff57;text-underline-offset:2px;text-decoration:underline}footer a:hover{color:#ffffff9e}@media (width<=700px){#app{min-height:100dvh}header{min-height:52px}.composer{padding:12px}.comment-list{padding-inline:12px}textarea{min-height:82px}}
