.support-desk { display:flex; flex-direction:column; gap:14px; min-width:0; }
.support-desk svg { width:18px; height:18px; flex-shrink:0; }
.support-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.support-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.support-identity > svg { width:40px; height:40px; padding:9px; border:1px solid var(--border); border-radius:12px; background:var(--surface-2); color:var(--accent-2); }
.support-identity strong,.support-identity small { display:block; }
.support-identity small { color:var(--muted); margin-top:4px; font-size:12px; overflow-wrap:anywhere; }
.support-filters { display:flex; gap:6px; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin; }
.support-filters button { display:flex; align-items:center; gap:7px; background:transparent; color:var(--muted); border:1px solid transparent; border-radius:9px; padding:9px 12px; white-space:nowrap; font-size:12px; min-height:40px; }
.support-filters button.active { background:color-mix(in srgb,var(--accent) 15%,transparent); color:var(--text); border-color:color-mix(in srgb,var(--accent) 40%,transparent); }
.support-filters button span { background:var(--surface-3); padding:1px 5px; border-radius:5px; }
.support-layout { display:grid; grid-template-columns:minmax(260px,32%) minmax(0,1fr); height:calc(100dvh - 240px); min-height:430px; overflow:hidden; padding:0; }
.support-list { border-right:1px solid var(--border); display:flex; flex-direction:column; min-height:0; min-width:0; }
.support-search { display:flex; align-items:center; padding:12px; border-bottom:1px solid var(--border); gap:5px; }
.support-search label { display:flex; align-items:center; gap:6px; min-width:0; flex:1; }
.support-search input { width:100%; min-width:0; border:0; background:transparent; font-size:12px; padding:8px 2px; }
.support-search svg { color:var(--muted); }
.support-ticket-list { overflow-y:auto; flex:1; scrollbar-width:thin; }
.support-ticket { display:block; width:100%; text-align:left; padding:15px; border:0; border-bottom:1px solid var(--border); border-left:3px solid transparent; background:transparent; }
.support-ticket:hover { background:var(--surface-2); }
.support-ticket.active { border-left-color:var(--accent-2); background:color-mix(in srgb,var(--accent) 10%,transparent); }
.support-ticket > div { display:flex; align-items:center; gap:8px; justify-content:space-between; margin-bottom:8px; }
.support-ticket > strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.support-ticket > small { display:block; color:var(--muted); margin-top:5px; font-size:12px; overflow-wrap:anywhere; }
.support-ticket footer { display:flex; justify-content:space-between; gap:8px; color:var(--subtle); font-size:10px; margin-top:12px; }
.support-number { font:11px ui-monospace,SFMono-Regular,monospace; color:var(--muted); letter-spacing:.04em; }
.support-status { font-size:10px; color:var(--muted); background:var(--surface-2); border-radius:5px; padding:3px 6px; white-space:nowrap; }
.support-status.needs_human { color:var(--warning); background:color-mix(in srgb,var(--warning) 12%,transparent); }
.support-status.ai_active { color:var(--accent-2); }
.support-status.resolved { color:var(--success); }
.support-pagination { display:flex; justify-content:space-between; align-items:center; padding:8px; border-top:1px solid var(--border); font-size:11px; }
.support-pagination .action-btn { padding:7px; font-size:11px; }
.support-thread { display:flex; flex-direction:column; min-width:0; min-height:0; }
.support-thread-head { padding:16px 18px; display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--border); }
.support-thread-head > div { flex:1; min-width:0; }
.support-thread-head h2 { font-size:16px; line-height:1.35; margin:5px 0; overflow-wrap:anywhere; }
.support-thread-head p { color:var(--muted); font-size:11px; margin:0; overflow-wrap:anywhere; }
.support-thread-head [data-support-action="back"] { display:none; }
.support-handover { display:flex; align-items:center; gap:10px; padding:12px 16px; color:var(--warning); background:color-mix(in srgb,var(--warning) 8%,transparent); border:1px solid color-mix(in srgb,var(--warning) 22%,transparent); border-radius:9px; font-size:12px; line-height:1.5; }
.support-thread > .support-handover { border-radius:0; border-width:0 0 1px; }
.support-thread-scroll { flex:1; overflow:auto; min-height:100px; scrollbar-width:thin; }
.support-details { margin:12px 16px; padding:10px 12px; border:1px solid var(--border); border-radius:9px; }
.support-desk summary { cursor:pointer; font-size:12px; color:var(--muted); min-height:24px; }
.support-ticket-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:12px 0; align-items:end; }
.support-desk label { font-size:12px; color:var(--muted); }
.support-ticket-fields label,.support-settings label { display:flex; flex-direction:column; gap:6px; min-width:0; }
.support-desk select,.support-desk textarea,.support-settings input:not([type="checkbox"]) { width:100%; padding:9px 10px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); color:var(--text); min-height:40px; }
.support-messages { display:flex; flex-direction:column; gap:12px; padding:4px 18px 18px; }
.support-message { padding:13px 15px; background:var(--surface-2); border:1px solid var(--border); border-radius:12px; max-width:96%; }
.support-message.outbound { align-self:flex-end; background:color-mix(in srgb,var(--accent) 12%,var(--surface)); width:94%; }
.support-message.note { background:color-mix(in srgb,var(--warning) 8%,var(--surface)); border-color:color-mix(in srgb,var(--warning) 25%,transparent); }
.support-message header { display:flex; justify-content:space-between; gap:12px; margin-bottom:10px; }
.support-message header strong { font-size:12px; overflow-wrap:anywhere; }
.support-message time { font-size:10px; color:var(--subtle); white-space:nowrap; }
.support-message-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.6; font-size:13px; }
.support-message footer { display:flex; align-items:start; justify-content:space-between; gap:8px; margin-top:10px; font-size:10px; color:var(--subtle); }
.support-message footer summary { font-size:10px; }
.support-delivery.failed,.support-delivery.uncertain { color:var(--warning); }
.support-id { font:10px/1.7 ui-monospace,monospace; color:var(--subtle); overflow-wrap:anywhere; }
.support-attachments { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:11px; color:var(--muted); }
.support-attachments small { width:100%; }
.support-message [data-support-action="original"] { margin-top:10px; font-size:11px; padding:7px 10px; }
.support-history { font-size:11px; color:var(--muted); line-height:1.8; padding-left:18px; }
.support-reply-area { border-top:1px solid var(--border); padding:12px 16px; background:var(--surface); }
.support-composer-label { display:flex; flex-direction:column; gap:6px; }
.support-reply-area textarea { resize:vertical; max-height:180px; font-size:13px; }
.support-composer-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.support-composer-foot small { color:var(--subtle); font-size:10px; overflow-wrap:anywhere; }
.support-note { margin-top:8px; }
.support-note form { display:flex; flex-direction:column; gap:8px; }
.support-note label textarea { margin-top:6px; }
.support-draft { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; color:var(--accent-2); margin-bottom:8px; }
.support-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:35px 20px; text-align:center; gap:12px; color:var(--muted); font-size:13px; line-height:1.6; height:100%; }
.support-empty svg { width:30px; height:30px; color:var(--accent-2); }
.support-empty p { max-width:300px; margin:0; }
.support-setup { padding:16px; border:1px dashed var(--border-strong); border-radius:12px; font-size:13px; color:var(--muted); }
.support-setup p { margin:6px 0 0; line-height:1.5; }
.support-settings { padding:18px; }
.support-settings .panel-header { padding:0 0 14px; }
.support-settings .panel-header p { max-width:650px; line-height:1.5; }
.support-setting-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.support-settings .support-check { flex-direction:row; align-items:center; gap:10px; }
.support-check input { accent-color:var(--accent); width:18px; height:18px; }
.support-answers { margin:22px 0; }
.support-answers h3 { font-size:14px; }
.support-answers fieldset { margin:12px 0; display:grid; gap:12px; border:1px solid var(--border); border-radius:12px; padding:14px; }
.support-answers fieldset button { justify-self:end; }
.support-settings > footer { display:flex; justify-content:space-between; }
.support-desk button:disabled { opacity:.45; cursor:not-allowed; }
.support-desk :focus-visible { outline:2px solid var(--accent-2); outline-offset:3px; }
@media(max-width:850px) {
  .support-layout { grid-template-columns:minmax(230px,36%) minmax(0,1fr); }
  .support-ticket-fields { grid-template-columns:1fr; }
  .support-thread-head { flex-wrap:wrap; }
}
@media(max-width:640px) {
  .support-toolbar { flex-wrap:wrap; }
  .support-toolbar .panel-actions { width:100%; }
  .support-toolbar .action-btn { flex:1; justify-content:center; font-size:12px; }
  .support-layout { display:block; height:calc(100dvh - 300px); min-height:440px; }
  .support-list { height:100%; border:0; }
  .support-thread { display:none; height:100%; }
  .support-selected .support-list { display:none; }
  .support-selected .support-thread { display:flex; }
  .support-thread-head [data-support-action="back"] { display:flex; flex-basis:100%; width:100%; font-size:12px; padding:6px 0; background:transparent; border:0; }
  .support-thread-head { padding:10px 12px; gap:8px; }
  .support-thread-head h2 { font-size:14px; }
  .support-thread-head .action-btn { font-size:11px; padding:8px; }
  .support-message { max-width:100%; }
  .support-messages { padding:8px 10px; }
  .support-message header { flex-wrap:wrap; gap:4px; }
  .support-reply-area { padding:10px; }
  .support-composer-foot { align-items:end; }
  .support-composer-foot .action-btn { flex-shrink:0; font-size:12px; }
  .support-setting-grid { grid-template-columns:1fr; }
  .support-handover { font-size:11px; padding:9px 12px; }
}