/* The support workspace owns its viewport; only the list, history and profile scroll. */
.work:has(#support-view:not([hidden])){width:100%;max-width:none;height:100dvh;min-height:0;display:flex;flex-direction:column;padding:20px 24px;overflow:hidden;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;letter-spacing:normal}
.work:has(#support-view:not([hidden])) .work-header{flex:none;min-height:40px;margin:0 0 14px;align-items:center}
.work:has(#support-view:not([hidden])) .work-header .eyebrow{display:none}
.work:has(#support-view:not([hidden])) h1{margin:0;font-size:25px;line-height:1.2;letter-spacing:-.025em;font-weight:650}
#support-view{--sp-bg:#fff;--sp-soft:#f3f5f9;--sp-history:#f7f8fb;--sp-text:#1c293b;--sp-muted:#52627a;--sp-line:#dee4ec;--sp-accent:#334ca5;--sp-selected:#eaf0ff;--sp-outgoing:#eaf0ff;--sp-solid:#4055bd;display:flex;flex:1;flex-direction:column;min-height:0;color:var(--sp-text);font-size:14px;line-height:1.5;letter-spacing:normal}
body.theme-dark #support-view{--sp-bg:#172131;--sp-soft:#1e2c40;--sp-history:#111a28;--sp-text:#edf3fc;--sp-muted:#b5c3d8;--sp-line:#33445b;--sp-accent:#b9cbff;--sp-selected:#273b60;--sp-outgoing:#243959;--sp-solid:#4055bd}
#support-view button{font-family:inherit;font-weight:600;letter-spacing:normal;transform:none;box-shadow:none;transition:background .12s,color .12s}
#support-view button:hover{transform:none}
#support-view button:focus-visible{outline:2px solid var(--sp-accent);outline-offset:2px}
#support-view input,#support-view select,#support-view textarea{background:var(--sp-bg);color:var(--sp-text);border:1px solid var(--sp-line);font-family:inherit;font-weight:400;letter-spacing:normal}
#support-view input::placeholder,#support-view textarea::placeholder{color:var(--sp-muted);opacity:1}
#support-view input:focus,#support-view select:focus,#support-view textarea:focus{outline:2px solid var(--sp-accent);outline-offset:1px;border-color:var(--sp-accent)}
#support-view .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.support-top{display:none}
.support-warning{flex:none;margin:0 0 10px;padding:8px 12px;border:1px solid #a67a2d;border-radius:8px;background:#fff4df;color:#70450c;font-size:13px}
body.theme-dark .support-warning{background:#392d19;color:#ffe1a5}
.support-tabs{display:flex;align-items:center;flex:none;gap:6px;margin-bottom:14px}
#support-view .support-tabs button{display:flex;align-items:center;gap:8px;min-height:38px;padding:8px 13px;border:0;border-radius:9px;background:transparent;color:var(--sp-muted);font-size:13px}
#support-view .support-tabs button:hover{background:var(--sp-soft);color:var(--sp-text)}
#support-view .support-tabs button.active{background:var(--sp-selected);color:var(--sp-accent)}
.support-tabs span{font-size:11px;font-variant-numeric:tabular-nums;min-width:18px;text-align:center}
.support-workspace{position:relative;display:grid;grid-template-columns:minmax(235px,280px) minmax(0,1fr) 260px;gap:14px;flex:1;min-height:0;min-width:0}
.support-inbox,.support-thread-pane,.support-profile{min-width:0;min-height:0;overflow:hidden;border:1px solid var(--sp-line);border-radius:13px;background:var(--sp-bg)}
.support-inbox{display:flex;flex-direction:column}
.support-inbox-tools{display:grid;gap:8px;flex:none;padding:12px;border-bottom:1px solid var(--sp-line)}
#support-view .support-inbox-tools input,#support-view .support-inbox-tools select{width:100%;min-width:0;min-height:36px;padding:7px 9px;border-radius:7px;font-size:12px}
.support-conversation-list{flex:1;min-height:0;overflow:auto;padding:6px;scrollbar-width:thin;scrollbar-color:var(--sp-line) transparent;overscroll-behavior:contain}
#support-view .support-conversation{display:grid;gap:5px;width:100%;min-height:88px;margin:0 0 3px;padding:10px 11px;border:0;border-radius:8px;background:transparent;color:var(--sp-text);text-align:left;font-weight:400}
#support-view .support-conversation:hover{background:var(--sp-soft)}
#support-view .support-conversation.active{background:var(--sp-selected);color:var(--sp-text)}
.support-conversation-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;min-width:0}
.support-conversation-top strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:650}
.support-conversation-top time{flex:none;color:var(--sp-muted);font-size:11px;font-weight:400;font-variant-numeric:tabular-nums}
.support-conversation-preview{display:block;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--sp-muted);font-size:12px;line-height:1.5}
.support-conversation-context{display:flex;align-items:center;gap:7px;min-width:0;height:19px}
.support-app-badge{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sp-accent);font-size:11px;font-weight:500}
.support-kind-badge{color:var(--sp-muted);font-size:10px;font-weight:600}
.support-unread{display:grid;place-items:center;margin-left:auto;min-width:19px;height:19px;padding:0 4px;border-radius:6px;background:var(--sp-solid);color:#fff;font-size:10px;font-weight:650}
.support-empty{margin:0;padding:22px 13px;color:var(--sp-muted);font-size:13px}
.support-thread-pane{display:flex;flex-direction:column}
.support-thread-header{display:flex;justify-content:space-between;align-items:center;gap:15px;flex:none;min-height:81px;padding:13px 18px;border-bottom:1px solid var(--sp-line)}
.support-thread-person{min-width:0}
.support-thread-context{display:block;color:var(--sp-accent);font-size:11px;font-weight:600;letter-spacing:.025em}
.support-thread-header h3{margin:3px 0 0;color:var(--sp-text);font-size:16px;font-weight:650;letter-spacing:normal}
.support-thread-header p{margin:2px 0 0;color:var(--sp-muted);font-size:12px;overflow-wrap:anywhere}
.support-thread-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
#support-view .support-thread-actions button,#support-view .support-profile-close{padding:7px 10px;min-height:34px;border:1px solid var(--sp-line);border-radius:8px;background:var(--sp-bg);color:var(--sp-text);font-size:12px;white-space:nowrap}
#support-view .support-thread-actions button:hover,#support-view .support-profile-close:hover{background:var(--sp-soft);border-color:var(--sp-accent)}
.support-presence{color:var(--sp-muted);font-size:11px;white-space:nowrap}
.support-presence.online{color:#24704e}body.theme-dark .support-presence.online{color:#8ce0b7}
.support-thread-messages{display:flex;flex-direction:column;align-items:flex-start;gap:16px;flex:1;min-height:0;overflow:auto;padding:22px;background:var(--sp-history);scrollbar-width:thin;scrollbar-color:var(--sp-line) transparent;overscroll-behavior:contain}
.support-bubble{flex:none;width:min(88%,720px);padding:15px 17px;border:1px solid var(--sp-line);border-radius:12px;background:var(--sp-bg);color:var(--sp-text);overflow-wrap:anywhere}
.support-bubble.admin{align-self:flex-end;background:var(--sp-outgoing);color:var(--sp-text)}
.support-bubble.bot{background:var(--sp-soft)}
.support-bubble>header{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:3px 12px;margin-bottom:9px}
.support-bubble>header strong{font-size:12px;font-weight:650;color:var(--sp-text)}
.support-bubble time,.support-bubble small{color:var(--sp-muted);font-size:11px;font-weight:400;line-height:1.5}
.support-bubble p{margin:0;color:var(--sp-text);font-size:15px;font-weight:400;line-height:1.65;white-space:pre-wrap}
.support-bubble small{display:block;margin-top:9px}
.support-compose{position:relative;flex:none;margin:0;padding:12px 16px 14px;border-top:1px solid var(--sp-line);background:var(--sp-bg)}
#support-view .support-compose textarea{display:block;width:100%;height:94px;min-height:64px;max-height:min(180px,25dvh);padding:12px;border-radius:9px;resize:vertical;font-size:14px;line-height:1.55;background:var(--sp-history)}
.support-compose>div{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px}
.support-compose>div span{max-width:75%;color:var(--sp-muted);font-size:11px;line-height:1.4}
#support-view .support-compose button,#support-view .support-function-submit{flex:none;min-height:36px;padding:8px 18px;border:0;border-radius:8px;background:var(--sp-solid);color:#fff;font-size:13px}
#support-view .support-compose button:hover,#support-view .support-function-submit:hover{background:#33479f;color:#fff}
.support-archived,.support-thread-empty{display:grid;place-items:center;flex:1;padding:25px;color:var(--sp-muted);font-size:14px;text-align:center}
.support-archived{flex:none;border-top:1px solid var(--sp-line)}
.support-profile{display:flex;flex-direction:column}
.support-profile-body{min-height:0;overflow:auto;padding:17px;scrollbar-width:thin;scrollbar-color:var(--sp-line) transparent;overscroll-behavior:contain}
.support-profile-person{display:flex;align-items:center;gap:10px;padding-bottom:17px;border-bottom:1px solid var(--sp-line)}
.support-profile-person>span{display:grid;place-items:center;flex:none;width:37px;height:37px;border-radius:11px;background:var(--sp-selected);color:var(--sp-accent);font-size:15px;font-weight:650}
.support-profile-person>div{min-width:0}
.support-profile-person strong{display:block;color:var(--sp-text);font-size:14px;font-weight:650;overflow-wrap:anywhere}
.support-profile-person small{display:block;margin-top:3px;color:var(--sp-muted);font-size:12px;overflow-wrap:anywhere}
.support-profile dl{margin:12px 0 18px}
.support-profile dl>div{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px;padding:9px 0}
.support-profile dt{color:var(--sp-muted);font-size:12px}
.support-profile dd{margin:0;overflow-wrap:anywhere;color:var(--sp-text);font-size:12px;font-weight:500}
#support-view .support-account-link,#support-view .support-functions-toggle,#support-view .support-delete{width:100%;min-height:37px;margin:0 0 9px;padding:9px 10px;border:1px solid var(--sp-line);border-radius:8px;background:var(--sp-soft);color:var(--sp-text);font-size:12px;text-align:left}
#support-view .support-account-link:hover,#support-view .support-functions-toggle:hover{background:var(--sp-selected);border-color:var(--sp-accent)}
#support-view .support-delete{min-height:40px;margin-top:17px;color:#8f2c43;background:#fff3f5;border-color:#e3a7b6;font-weight:700}
#support-view .support-delete:hover{background:#ffe5eb;border-color:#c85d78;color:#782138}
body.theme-dark #support-view .support-delete{color:#ffd0da;background:#3b2632;border-color:#8d5566}
body.theme-dark #support-view .support-delete:hover{background:#54313e;border-color:#c77c91;color:#fff0f3}
.support-function-panel{display:grid;gap:12px;margin:3px 0 12px;padding:12px;border:1px solid var(--sp-line);border-radius:9px;background:var(--sp-history)}
.support-function-panel label{display:grid;gap:6px;color:var(--sp-text);font-size:12px}
#support-view .support-function-panel select,#support-view .support-function-panel input{min-height:36px;padding:7px;font-size:12px}
.support-function-panel p,.support-function-panel small{margin:0;color:var(--sp-muted);font-size:12px;line-height:1.55}
.support-function-panel .support-function-note{color:var(--sp-accent)}
#support-note{flex:none;margin:8px 0 0;color:var(--sp-accent);font-size:12px}#support-note:empty{display:none}
#support-view .support-mobile-back,#support-view .support-contact-toggle,#support-view .support-profile-close{display:none}
@media(max-width:1350px){.support-workspace{grid-template-columns:230px minmax(0,1fr) 230px;gap:10px}.support-thread-messages{padding:16px}.support-profile-body{padding:13px}.support-thread-header{padding:12px 14px}.support-thread-actions{gap:6px}.support-presence{display:none}}
@media(max-width:1200px){.support-workspace{grid-template-columns:230px minmax(0,1fr)}.support-profile{display:none;position:absolute;right:0;top:0;bottom:0;width:300px;z-index:4;box-shadow:-12px 0 36px #0003}#support-view.show-profile .support-profile{display:flex}#support-view .support-contact-toggle,#support-view .support-profile-close{display:block}#support-view .support-profile-close{align-self:flex-end;margin:10px 12px 0}.support-thread-actions{gap:7px}.support-thread-header{flex-wrap:wrap}}
@media(max-width:700px){#dashboard:has(#support-view:not([hidden])){height:100dvh;display:flex;flex-direction:column;overflow:hidden}#dashboard:has(#support-view:not([hidden]))>.sidebar{flex:none;padding:9px 12px}#dashboard:has(#support-view:not([hidden])) .side-brand{display:none}#dashboard:has(#support-view:not([hidden])) .sidebar nav{margin:0;padding:0}#dashboard:has(#support-view:not([hidden])) .sidebar nav button{min-height:37px;font-size:12px}.work:has(#support-view:not([hidden])){flex:1;height:auto;min-height:0;padding:12px}.work:has(#support-view:not([hidden])) .work-header{min-height:34px;margin-bottom:9px}.work:has(#support-view:not([hidden])) h1{font-size:21px}.support-tabs{gap:3px;margin-bottom:10px}#support-view .support-tabs button{padding:7px 10px;min-height:34px;font-size:12px}.support-workspace{display:flex;min-height:0}.support-inbox,.support-thread-pane{width:100%}.support-inbox{display:none}#support-view.show-inbox .support-inbox{display:flex}#support-view.show-inbox .support-thread-pane{display:none}#support-view .support-mobile-back{display:block}.support-thread-header{gap:8px;min-height:0;padding:10px 12px}.support-thread-person{flex:1;min-width:130px}.support-thread-header h3{font-size:14px}.support-thread-context{font-size:10px}.support-thread-header p{font-size:11px}.support-thread-actions{justify-content:flex-start;width:100%;gap:6px}#support-view .support-thread-actions button{min-height:31px;padding:6px 9px;font-size:11px}.support-thread-messages{padding:12px;gap:12px}.support-bubble{width:94%;padding:12px 13px}.support-bubble p{font-size:14px}.support-bubble time{font-size:10px}.support-compose{padding:10px}.support-compose>div span{font-size:10px}#support-view .support-compose textarea{height:78px;font-size:16px}.support-profile{width:100%}.support-profile-body{padding:17px}}
@media(max-height:700px) and (min-width:701px){.work:has(#support-view:not([hidden])){padding-block:12px}.work:has(#support-view:not([hidden])) .work-header{margin-bottom:8px}.support-tabs{margin-bottom:10px}.support-thread-header{min-height:66px;padding-block:9px}#support-view .support-compose textarea{height:72px}.support-compose{padding-block:9px}}
@media(prefers-reduced-motion:reduce){#support-view button{transition:none}}
