/* 팀 문서 댓글 위젯 — 페이지 토큰(--surface 등)이 있으면 따르고, 없으면 기본값으로 선다. */
:root{--cmt-surface:var(--surface,#fff);--cmt-ground:var(--ground,#f4f3f7);--cmt-ink:var(--ink,#1b2138);--cmt-ink2:var(--ink2,#4a4f66);--cmt-ink3:var(--ink3,#7d8199);--cmt-rule:var(--rule,#dfdce7);--cmt-accent:var(--accent,#ea7900);--cmt-accent-ink:var(--accentInk,#b45d00);--cmt-sunken:var(--sunken,#ecebf2);--cmt-danger:#b4432f;--cmt-ok:#2f7d5b}
@media (prefers-color-scheme:dark){:root{--cmt-danger:#f08a74;--cmt-ok:#6cc79c}}

.cmt-slot{display:inline-flex;margin-left:8px;vertical-align:middle}
.cmt-btn{display:inline-flex;align-items:center;gap:4px;font:500 12px/1 var(--sans,system-ui);color:var(--cmt-ink3);background:transparent;border:1px solid transparent;border-radius:999px;padding:3px 7px;cursor:pointer}
.cmt-btn svg{width:14px;height:14px}
.cmt-btn:hover{color:var(--cmt-accent-ink);border-color:var(--cmt-rule);background:var(--cmt-surface)}
.cmt-btn.has{color:var(--cmt-accent-ink);background:color-mix(in srgb,var(--cmt-accent) 12%,transparent)}
.cmt-btn:focus-visible,.cmt-panel button:focus-visible,.cmt-panel textarea:focus-visible,.cmt-dock:focus-visible{outline:2px solid var(--cmt-accent);outline-offset:2px}

.cmt-dock{position:fixed;right:20px;bottom:20px;z-index:40;display:inline-flex;align-items:center;gap:8px;font:600 13px/1 var(--sans,system-ui);background:var(--navy,#1b2138);color:#fff;border:0;border-radius:999px;padding:11px 16px;box-shadow:0 6px 20px rgba(15,18,40,.25);cursor:pointer}
.cmt-dock svg{width:16px;height:16px}
.cmt-dock b{background:var(--cmt-accent);color:#1b2138;border-radius:999px;padding:2px 7px;font-size:11.5px}
.cmt-dock[disabled]{opacity:.65;cursor:default}

.cmt-panel{position:fixed;top:0;right:0;bottom:0;z-index:50;width:min(420px,100vw);background:var(--cmt-surface);color:var(--cmt-ink);border-left:1px solid var(--cmt-rule);box-shadow:-10px 0 30px rgba(15,18,40,.14);display:flex;flex-direction:column;font-family:var(--sans,system-ui);font-size:14px}
.cmt-panel[hidden]{display:none}
.cmt-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:16px 18px 12px;border-bottom:1px solid var(--cmt-rule)}
.cmt-head h2{margin:0;font-size:15px;font-weight:600;word-break:break-all}
.cmt-head p{margin:2px 0 0;font-size:12px;color:var(--cmt-ink3)}
.cmt-x{border:0;background:transparent;color:var(--cmt-ink2);font-size:20px;line-height:1;padding:2px 6px;cursor:pointer;border-radius:6px}
.cmt-x:hover{background:var(--cmt-sunken)}
.cmt-tools{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 18px;font-size:12px;color:var(--cmt-ink3);border-bottom:1px solid var(--cmt-rule)}
.cmt-tools label{display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.cmt-body{flex:1;overflow-y:auto;padding:12px 18px;display:flex;flex-direction:column;gap:12px;background:var(--cmt-ground)}
.cmt-empty{color:var(--cmt-ink3);font-size:13px;text-align:center;padding:28px 8px}
.cmt-group h3{margin:6px 0 6px;font-size:12px;font-weight:600;color:var(--cmt-ink3);display:flex;justify-content:space-between;gap:8px}
.cmt-group h3 button{border:0;background:none;color:var(--cmt-accent-ink);font:inherit;cursor:pointer;padding:0}
.cmt-thread{background:var(--cmt-surface);border:1px solid var(--cmt-rule);border-radius:9px;overflow:hidden}
.cmt-thread.resolved{opacity:.72}
.cmt-thread.flash{box-shadow:0 0 0 2px var(--cmt-accent)}
.cmt-item{padding:10px 12px;display:flex;flex-direction:column;gap:5px}
.cmt-item+.cmt-item{border-top:1px solid var(--cmt-rule);padding-left:26px}
.cmt-meta{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:12px;color:var(--cmt-ink3)}
.cmt-meta strong{color:var(--cmt-ink);font-weight:600;font-size:13px}
.cmt-tag{font-size:10.5px;font-weight:600;padding:0 6px;border-radius:999px;background:var(--cmt-sunken);color:var(--cmt-ink2)}
.cmt-tag.ok{color:var(--cmt-ok)}
.cmt-text{margin:0;white-space:pre-wrap;word-break:break-word;line-height:1.55}
.cmt-text.gone{color:var(--cmt-ink3);font-style:italic}
.cmt-acts{display:flex;gap:10px;flex-wrap:wrap}
.cmt-acts button{border:0;background:none;padding:0;font:500 12px/1.4 var(--sans,system-ui);color:var(--cmt-ink3);cursor:pointer}
.cmt-acts button:hover{color:var(--cmt-accent-ink)}
.cmt-acts button.danger:hover{color:var(--cmt-danger)}
.cmt-compose{display:flex;flex-direction:column;gap:8px;padding:12px 18px 16px;border-top:1px solid var(--cmt-rule);background:var(--cmt-surface)}
.cmt-thread .cmt-compose{padding:10px 12px;border-top:1px solid var(--cmt-rule)}
.cmt-compose textarea{font:inherit;font-size:14px;min-height:74px;resize:vertical;padding:8px 10px;border:1px solid var(--cmt-rule);border-radius:7px;background:var(--cmt-surface);color:var(--cmt-ink)}
.cmt-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cmt-hint{font-size:11.5px;color:var(--cmt-ink3)}
.cmt-primary{border:0;border-radius:7px;background:var(--cmt-accent);color:#1b2138;font:600 13px/1 var(--sans,system-ui);padding:8px 14px;cursor:pointer}
.cmt-primary[disabled]{opacity:.5;cursor:default}
.cmt-secondary{border:1px solid var(--cmt-rule);border-radius:7px;background:transparent;color:var(--cmt-ink2);font:500 13px/1 var(--sans,system-ui);padding:7px 12px;cursor:pointer}
.cmt-error{margin:0;font-size:12.5px;color:var(--cmt-danger)}
.cmt-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;background:var(--navy,#1b2138);color:#fff;font:500 13px/1 var(--sans,system-ui);padding:10px 14px;border-radius:8px}
@media (max-width:600px){.cmt-dock{right:12px;bottom:12px}}
@media (prefers-reduced-motion:reduce){.cmt-panel,.cmt-thread{transition:none}}