.support-badge { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 5px; border-radius:10px; background:#e5484d; color:#fff; font-size:11px; font-weight:700; line-height:1; margin-left:7px; flex-shrink:0; }
.support-badge[hidden], .support-launcher[hidden], .support-modal[hidden] { display:none !important; }
.support-launcher { position:fixed; right:26px; bottom:26px; z-index:70; display:flex; align-items:center; gap:9px; padding:14px 19px; border:0; border-radius:28px; background:#2458e6; color:white; font:inherit; font-size:14px; font-weight:600; box-shadow:0 8px 30px #2448a52b; cursor:pointer; transition:transform .16s,background .16s; }
.support-launcher:hover { transform:translateY(-2px); background:#1947c9; }
.support-launcher svg { width:22px; height:22px; }
.support-launcher .support-badge { margin:0; }
.support-modal { position:fixed; inset:0; z-index:1200; display:flex; align-items:center; justify-content:center; padding:24px; }
body.support-chat-open { overflow:hidden; }
.support-modal-backdrop { position:absolute; inset:0; background:#17254d66; backdrop-filter:blur(4px); }
.support-chat-pane { min-width:0; display:flex; flex-direction:column; overflow:hidden; background:white; }
#supportUserDialog { position:relative; width:620px; max-width:100%; height:min(760px,88dvh); border-radius:22px; box-shadow:0 25px 90px #10235133; animation:support-enter .18s ease-out; }
.support-chat-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 24px; border-bottom:1px solid #e9edf5; flex-shrink:0; }
.support-chat-header strong { display:block; font-size:18px; line-height:1.5; color:#172444; }
.support-chat-header p { margin:4px 0 0; color:#77839c; font-size:12px; line-height:1.6; overflow-wrap:anywhere; }
.support-close { display:grid; place-items:center; width:34px; height:34px; padding:0; border:0; border-radius:50%; background:#f1f5ff; color:#2954d9; font-size:24px; cursor:pointer; flex-shrink:0; }
.support-history { display:flex; gap:14px; align-items:center; justify-content:center; min-height:34px; padding:5px 15px; background:#f8faff; color:#8590a6; font-size:11px; flex-shrink:0; }
.support-history button, .support-list-pages button { border:0; padding:3px; background:none; color:#3159cd; cursor:pointer; font-size:12px; }
.support-history button[hidden] { display:none; }
.support-history .is-error { color:#bf3f48; }
.support-messages { flex:1; min-height:110px; overflow:auto; padding:22px 24px; background:#f8faff; overscroll-behavior:contain; }
.support-message { display:flex; flex-direction:column; align-items:flex-start; margin-bottom:20px; }
.support-message.is-mine { align-items:flex-end; }
.support-message-meta { display:flex; align-items:center; gap:9px; margin-bottom:6px; font-size:11px; color:#8590a5; }
.support-message-meta span { color:#5c6b86; }
.support-bubble { max-width:86%; padding:12px 15px; border-radius:3px 14px 14px; background:#fff; border:1px solid #e7ecf6; color:#25344e; font-size:14px; line-height:1.8; overflow-wrap:anywhere; }
.support-message.is-mine .support-bubble { border-color:#dbe6ff; border-radius:14px 3px 14px 14px; background:#eaf0ff; }
.support-message-text { white-space:pre-wrap; }
.support-message-image { display:block; max-width:100%; margin:2px 0; padding:0; border:0; border-radius:8px; overflow:hidden; background:#eef2f8; cursor:zoom-in; }
.support-message-image img { display:block; width:240px; max-width:100%; height:180px; object-fit:contain; }
.support-message-image + .support-message-text { margin-top:8px; }
.support-image-draft[hidden], .support-composer input[type="file"][hidden] { display:none !important; }
.support-image-draft { display:flex; align-items:center; gap:12px; margin:8px 0; padding:8px 10px; border:1px solid #e5ebf7; border-radius:8px; background:#f8faff; }
.support-image-draft img { width:58px; height:58px; object-fit:contain; border-radius:5px; background:#eef2f8; }
.support-image-draft span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; color:#61708b; }
.support-image-draft button { width:30px; height:30px; border:0; border-radius:50%; background:#eaf0ff; color:#3159cd; font-size:22px; cursor:pointer; }
.support-composer-tools { display:flex; align-items:center; gap:12px; min-width:0; }
.support-composer-tools > span { color:#8b96ab; font-size:10px; }
.support-image-picker { flex-shrink:0; padding:7px 10px; border:1px solid #dfe6f5; border-radius:7px; background:white; color:#3159cd; font:inherit; font-size:12px; cursor:pointer; }
.support-image-picker:hover { background:#f3f6ff; }
.support-image-picker:disabled, .support-image-draft button:disabled { opacity:.5; cursor:default; }
.support-image-viewer { position:fixed; inset:0; width:100vw; height:100dvh; max-width:100vw; max-height:100dvh; margin:0; padding:50px 20px 30px; box-sizing:border-box; border:0; background:#0b1426ed; color:white; overflow:auto; text-align:center; }
.support-image-viewer[open] { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
.support-image-viewer::backdrop { background:#0b1426c9; }
.support-image-viewer > img { display:block; max-width:100%; max-height:calc(100dvh - 130px); width:auto; height:auto; object-fit:contain; }
.support-image-viewer > p { margin:0; font-size:12px; color:#bbc5d9; }
.support-image-viewer-close { position:absolute; top:max(16px,env(safe-area-inset-top)); right:20px; width:40px; height:40px; border:1px solid #ffffff55; border-radius:50%; background:#ffffff1a; color:white; font-size:28px; cursor:pointer; }
.support-read-state { margin-top:4px; color:#8b96ab; font-size:10px; }
.support-order-card { padding:9px 11px; margin:0 0 9px; border-left:3px solid #799bfa; background:#f6f8fe; line-height:1.6; }
.support-order-card > div { display:flex; align-items:baseline; justify-content:space-between; gap:14px; }
.support-order-card strong { font-size:12px; }
.support-order-card span { white-space:nowrap; font-size:10px; color:#3159cd; }
.support-order-card small { display:block; font-size:10px; color:#71809a; }
.support-composer { padding:14px 20px 18px; border-top:1px solid #e9edf5; flex-shrink:0; background:white; }
.support-order-picker { display:flex; align-items:center; gap:12px; font-size:12px; color:#75829b; }
.support-order-picker > span { flex-shrink:0; }
.support-composer select { width:100%; min-width:0; height:34px; padding:5px 10px; font-size:12px; color:#61708b; border:1px solid #e5ebf7; border-radius:7px; background:#fff; }
.support-text-label { display:block; margin-top:8px; }
.support-composer textarea { display:block; width:100%; min-height:70px; max-height:150px; resize:vertical; padding:10px 2px; border:0; border-radius:0; background:#fff; font:inherit; font-size:14px; color:#25344e; line-height:1.6; box-sizing:border-box; }
.support-composer textarea:focus { outline:none; box-shadow:0 2px 0 #d8e3ff; }
.support-composer-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:6px; }
.support-composer-actions > span { font-size:10px; color:#98a2b5; }
.support-composer .primary-btn { min-height:38px; padding:9px 20px; font-size:13px; }
.support-empty { display:flex; height:100%; min-height:140px; align-items:center; justify-content:center; flex-direction:column; padding:25px; text-align:center; color:#7986a0; box-sizing:border-box; }
.support-empty strong { font-size:15px; color:#566580; font-weight:500; }
.support-empty p { font-size:12px; margin-top:8px; }
.support-empty-symbol { font-size:35px; color:#acbfe9; margin-bottom:15px; }
.support-overview { color:#75819b; font-size:13px; }
.support-workspace { display:grid; grid-template-columns:290px minmax(0,1fr); height:calc(100dvh - 365px); min-height:480px; max-height:900px; border:1px solid #e3e9f4; border-radius:14px; overflow:hidden; background:#fff; }
.support-inbox { min-width:0; display:flex; flex-direction:column; border-right:1px solid #e5eaf3; background:#fff; }
.support-inbox-views { display:flex; gap:4px; padding:12px 16px 0; }
.support-inbox-views button { flex:1; padding:9px 6px; border:0; border-radius:7px; background:transparent; color:#75829b; font:inherit; font-size:13px; cursor:pointer; }
.support-inbox-views button[aria-pressed="true"] { background:#edf3ff; color:#3159cd; font-weight:600; }
.support-email-form { max-width:760px; padding:26px; border:1px solid #e3e9f4; border-radius:14px; background:#fff; }
.support-email-label { display:flex; flex-direction:column; gap:10px; font-size:14px; color:#25344e; }
.support-email-label input { width:100%; box-sizing:border-box; padding:12px 14px; border:1px solid #dfe6f3; border-radius:8px; font:inherit; }
.support-email-toggle { display:flex; align-items:center; gap:8px; margin:22px 0; font-size:14px; color:#25344e; }
.support-email-toggle input { width:17px; height:17px; accent-color:#3159cd; }
.support-email-help, .support-email-status { color:#75829b; font-size:13px; line-height:1.9; }
.support-email-status { margin-top:22px; padding-top:16px; border-top:1px solid #edf0f6; }
.support-email-feedback { min-height:22px; font-size:13px; color:#3159cd; }
.support-email-feedback.is-error { color:#bf3f48; }
.support-email-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:20px; }
.support-composer[hidden], .support-history[hidden], [data-support-filter][hidden], [data-support-resolve][hidden] { display:none !important; }
.support-inbox-filters { padding:17px 16px; display:flex; flex-direction:column; gap:10px; border-bottom:1px solid #e9edf5; }
.support-inbox-filters input, .support-inbox-filters select { width:100%; padding:9px 11px; border:1px solid #e6ebf5; border-radius:7px; background:#f9faff; font-size:12px; color:#52617d; box-sizing:border-box; }
.support-thread-list { flex:1; min-height:0; overflow:auto; }
.support-thread { display:block; width:100%; padding:16px; text-align:left; border:0; border-bottom:1px solid #eff2f8; border-left:3px solid transparent; background:#fff; cursor:pointer; transition:background .15s; }
.support-thread:hover { background:#f7f9ff; }
.support-thread.is-active { background:#eff4ff; border-left-color:#3767eb; }
.support-thread-top, .support-thread-bottom { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.support-thread-top strong { font-size:13px; color:#2c3b57; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.support-thread-status { flex-shrink:0; color:#8c97a9; font-size:10px; }
.support-thread-status.is-waiting { color:#c58b28; }
.support-thread p { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; margin:8px 0 11px; color:#7b88a0; }
.support-thread-bottom time { font-size:10px; color:#9aa4b6; }
.support-thread .support-badge { height:17px; min-width:17px; font-size:9px; }
.support-list-pages { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; border-top:1px solid #e9edf5; font-size:11px; color:#8a95a9; }
.support-list-pages button:disabled { color:#bbc3d1; cursor:default; }
.support-empty-list { min-height:200px; height:auto; }
.support-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes support-enter { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:960px) { .support-workspace { grid-template-columns:235px minmax(0,1fr); } }
@media (max-width:640px) {
  .support-composer-tools { gap:6px; flex-wrap:wrap; }
  .support-composer-tools > span { max-width:130px; font-size:9px; }
  .support-message-image img { width:210px; height:160px; }
  .support-launcher { right:16px; bottom:calc(18px + env(safe-area-inset-bottom)); padding:12px 15px; font-size:12px; }
  .support-modal { padding:0; align-items:stretch; }
  #supportUserDialog { width:100%; max-width:none; height:100dvh; max-height:100dvh; border-radius:0; }
  .support-chat-header { padding:18px 16px; padding-top:max(18px,env(safe-area-inset-top)); }
  .support-chat-header strong { font-size:17px; }
  .support-messages { padding:18px 14px; }
  .support-bubble { max-width:91%; font-size:13px; }
  .support-composer { padding:12px 15px max(14px,env(safe-area-inset-bottom)); }
  .support-workspace { grid-template-columns:1fr; height:auto; max-height:none; min-height:0; }
  .support-inbox { border-right:0; max-height:240px; border-bottom:1px solid #e5eaf3; }
  .support-inbox-filters { flex-direction:row; padding:12px; }
  .support-inbox-filters label { min-width:0; flex:1; }
  .support-inbox-filters select { width:110px; }
  .support-workspace > .support-chat-pane { height:650px; max-height:85dvh; }
  .support-message-meta { font-size:10px; }
}
@media (prefers-reduced-motion:reduce) { .support-launcher, .support-thread { transition:none; } #supportUserDialog { animation:none; } }