/* Support app */
.page.wide{max-width:860px}
form.inline{display:inline}
.notice{border:2px solid var(--line);border-radius:14px;padding:12px 16px;margin:0 0 18px;color:var(--text);background:var(--panel)}
.notice.bad{border-color:var(--hot)}
.fine{font-size:13px;color:var(--muted)}
.tag{display:inline-block;font:600 10px Pixelify;letter-spacing:1px;background:var(--hot);color:#fff;border-radius:5px;padding:1px 6px;vertical-align:middle}
.tag.staff{background:#fff;color:#070505}
.chat{border:2px solid var(--line);border-radius:20px;background:var(--panel);overflow:hidden;margin:6px 0 34px}
.chat-head{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:2px solid var(--line);font:700 14px Bricolage}
.chat-head .dot{width:9px;height:9px;border-radius:50%;background:#32d46b;box-shadow:0 0 10px #32d46b}
.chat-log{height:300px;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
#chatform{display:flex;gap:10px;padding:12px;border-top:2px solid var(--line)}
#chatform input,.form input,.form textarea,.form select{flex:1;background:#0b0707;border:2px solid var(--line);border-radius:12px;color:var(--text);padding:11px 14px;font:15px Inter,system-ui,sans-serif;width:100%}
#chatform input:focus,.form input:focus,.form textarea:focus,.form select:focus{outline:none;border-color:var(--hot)}
.chat .fine{padding:0 16px 12px}
.bubble{max-width:86%;border:2px solid var(--line);border-radius:16px;padding:10px 14px;background:#0f0909}
.bubble .who{font:700 12px Bricolage;color:var(--muted);margin-bottom:4px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.bubble .who .when{margin-left:auto;font:400 11px Inter}
.bubble .text{white-space:pre-wrap;word-wrap:break-word;color:var(--text);font-size:15px}
.bubble.me{align-self:flex-end;border-color:#5a1a1a;background:#1c0b0b}
.bubble.ai{align-self:flex-start}
.bubble.staff{align-self:flex-start;border-color:var(--hot)}
.bubble.wait .text{color:var(--muted)}
.form{display:grid;gap:14px;margin:18px 0}
.form label{display:grid;gap:6px;font:700 14px Bricolage;color:var(--text)}
.form textarea{resize:vertical;min-height:110px}
.form .check{display:flex;gap:10px;align-items:center;font:500 15px Inter;color:var(--muted)}
.form .check input{width:auto;flex:none}
.rows{display:grid;gap:10px;margin-top:14px}
.row{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;border:2px solid var(--line);border-radius:16px;background:var(--panel);padding:14px 18px;color:var(--text)!important;text-decoration:none!important;transition:.15s}
.row:hover{border-color:var(--hot);transform:translateX(3px)}
.rtitle{display:grid;gap:2px;min-width:0}
.rtitle b{font:700 16px Bricolage;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rtitle span,.when{color:var(--muted);font-size:13px}
.empty{color:var(--muted);padding:20px 0}
.badge{font:700 12px Bricolage;border-radius:99px;padding:4px 12px;border:2px solid var(--line);color:var(--muted);white-space:nowrap}
.badge.s-open{border-color:#c98a00;color:#ffc83d}
.badge.s-answered{border-color:#1f9d55;color:#4be08a}
.badge.s-ai{border-color:var(--hot);color:#ff7b7b}
.badge.s-closed{color:var(--muted)}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}
.tabs a{border:2px solid var(--line);border-radius:99px;padding:6px 14px;font:700 13px Bricolage;color:var(--muted);text-decoration:none}
.tabs a.on{border-color:var(--hot);color:var(--text);background:var(--hot)}
.page h1.tt{font-size:clamp(26px,4.4vw,40px);text-transform:none;letter-spacing:-.03em}
.tmeta{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:8px 0 18px}
.tmeta .who2{color:var(--muted);font-size:13px}
.tmeta .acts{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.thread{display:flex;flex-direction:column;gap:12px;margin:10px 0}
.typing{color:var(--muted);font-size:14px;display:flex;align-items:center;gap:8px;margin:6px 0}
.typing span{width:6px;height:6px;border-radius:50%;background:var(--hot);animation:blink 1s infinite}
.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}
@keyframes blink{50%{opacity:.2}}
.replybox{margin-top:22px}
.page .btn{text-decoration:none;color:var(--text)}
.page .btn.hot{color:#fff}
@media(max-width:700px){.row{grid-template-columns:1fr}.bubble{max-width:100%}}
.typing[hidden]{display:none}
.form .btn{justify-self:start}