/* «Поддержка» (support.js): кнопка в шапке и панель справа. Цвета — токены темы Locus (theme.css). */
.sup-btn{position:relative}
.sup-btn[hidden]{display:none}  /* .round-btn задаёт display:grid, без этого hidden не прячет кнопку */
.sup-dot{position:absolute;top:8px;right:9px;width:9px;height:9px;border-radius:50%;background:var(--bad);box-shadow:0 0 0 2px var(--panel)}
.sup-panel{position:fixed;top:12px;right:12px;bottom:12px;width:min(420px,calc(100vw - 24px));background:var(--panel);color:var(--fg);border-radius:var(--r-panel,24px);
  box-shadow:0 24px 60px #00000040;z-index:60;display:flex;flex-direction:column;overflow:hidden}
.sup-head{display:flex;align-items:center;gap:10px;padding:16px 16px 12px;border-bottom:1px solid var(--line)}
.sup-title{flex:1;min-width:0;display:grid}
.sup-title b{font-size:16px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sup-title small{font-size:12px;color:var(--muted2)}
.sup-icon{width:34px;height:34px;border-radius:50%;background:var(--inset);border:0;font-size:20px;line-height:1;color:var(--fg);cursor:pointer;flex:none}
.sup-icon:hover{background:var(--line)}
.sup-sub{margin:10px 16px 0;padding:8px 12px;border-radius:12px;background:var(--inset);font-size:13px}
.sup-sub.sup-warn{background:var(--warn-soft);color:var(--warn)}
.sup-body{padding:14px 16px;overflow:auto;display:grid;gap:12px;align-content:start;flex:1}
.sup-new{justify-self:start}
.sup-list{display:grid;gap:6px}
.sup-item{display:grid;gap:4px;text-align:left;background:var(--inset);border:0;border-radius:14px;padding:11px 12px;color:var(--fg);cursor:pointer;font:inherit;position:relative}
.sup-item:hover{background:var(--line)}
.sup-item.sup-unread::after{content:"";position:absolute;top:13px;right:12px;width:8px;height:8px;border-radius:50%;background:var(--bad)}
.sup-item-top{display:flex;justify-content:space-between;gap:10px;padding-right:14px}
.sup-item-top b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sup-item-top time{font-size:12px;color:var(--muted2);flex:none}
.sup-item-text{font-size:13px;color:var(--muted2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sup-tag{justify-self:start;font-size:11.5px;border-radius:999px;padding:1px 9px;background:var(--panel)}
.sup-tag.sup-warn{color:var(--warn)} .sup-tag.sup-info{color:var(--info)} .sup-tag.sup-ok{color:var(--ok)}
.sup-empty{color:var(--muted2);font-size:13.5px}
.sup-error{background:var(--bad-soft);color:var(--bad);border-radius:12px;padding:9px 12px;font-size:13.5px}
.sup-field{display:grid;gap:6px;font-size:12.5px;color:var(--muted2)}
.sup-field input,.sup-field textarea,.sup-compose textarea{width:100%;box-sizing:border-box;font:inherit;font-size:14px;color:var(--fg)}
.sup-msgs{flex:1;overflow:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.sup-msg{max-width:85%;display:grid;gap:3px}
.sup-msg small{font-size:11.5px;color:var(--muted2);padding:0 6px}
.sup-bubble{padding:9px 13px;border-radius:16px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}
.sup-them{align-self:flex-start}.sup-them .sup-bubble{background:var(--inset);border-bottom-left-radius:5px}
.sup-me{align-self:flex-end;justify-items:end}.sup-me .sup-bubble{background:var(--pill);color:var(--pill-fg);border-bottom-right-radius:5px}
.sup-compose{border-top:1px solid var(--line);padding:12px 16px;display:grid;gap:8px}
.sup-compose .primary{justify-self:end}
@media (max-width:600px){.sup-panel{top:0;right:0;bottom:0;width:100vw;border-radius:0}}
