/* Visitor chat window v2: calm, compact and mobile-first. */
:root { color-scheme: light; }
.support-app-gate { --gate-accent: #536dfe; --gate-accent-soft: #eef1ff; position: fixed; z-index: 2147483647; inset: 0; width: 100%; min-height: 100vh; min-height: 100dvh; display: flex; align-items: center; justify-content: center; overflow-x: hidden; overflow-y: auto; padding: 72px 0 18px; background: #edf3fb; background: radial-gradient(circle at 12% 8%, rgba(255, 255, 255, .95), transparent 32%), radial-gradient(circle at 88% 0, rgba(83, 109, 254, .16), transparent 42%), #edf3fb; color: #172033; box-sizing: border-box; -webkit-overflow-scrolling: touch; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
.support-app-gate, .support-app-gate * { box-sizing: border-box; }
.support-app-gate[hidden] { display: none !important; }
.support-app-gate[data-app="wechat"] { --gate-accent: #07a957; --gate-accent-soft: #eafaf2; }
.support-app-gate[data-app="qq"] { --gate-accent: #1684f8; --gate-accent-soft: #eaf4ff; }
.support-app-gate[data-app="weibo"] { --gate-accent: #eb6946; --gate-accent-soft: #fff1ed; }
.support-app-gate[data-app="douyin"] { --gate-accent: #172033; --gate-accent-soft: #edf0f4; }
html.support-inapp-browser, html.support-inapp-browser body.support-page { width: 100%; max-width: 100%; overflow: hidden; }
html.support-inapp-browser body.support-page .support-window { visibility: hidden; pointer-events: none; }
.support-app-gate-menu-tip { position: fixed; z-index: 2; top: 13px; right: 12px; min-height: 44px; display: flex; align-items: center; gap: 7px; padding: 0 11px 0 14px; border-radius: 999px; color: #fff; background: #172033; box-shadow: 0 10px 26px rgba(23, 32, 51, .22); font-size: 12px; font-weight: 750; animation: support-gate-nudge 1.8s ease-in-out infinite; }
.support-app-gate-menu-tip b { min-width: 30px; padding: 1px 7px 5px; border-radius: 999px; color: #172033; background: #fff; font-size: 17px; letter-spacing: 1px; line-height: 1; }
.support-app-gate-menu-tip i { font-size: 17px; font-style: normal; }
@keyframes support-gate-nudge { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(2px, -2px); } }
.support-app-gate-card { width: calc(100% - 24px); max-width: 420px; margin: auto; padding: 24px 21px 18px; overflow: hidden; border: 1px solid rgba(75, 113, 157, .13); border-radius: 23px; background: #fff; box-shadow: 0 24px 70px rgba(30, 52, 83, .15); text-align: center; }
.support-app-gate-mark { width: 50px; height: 50px; display: grid; place-items: center; margin: 0 auto 11px; border-radius: 16px; color: #fff; background: var(--gate-accent); box-shadow: 0 10px 22px rgba(40, 71, 142, .2); font-size: 24px; font-weight: 900; }
.support-app-gate-eyebrow { display: block; margin-bottom: 6px; color: var(--gate-accent); font-size: 11px; font-weight: 800; letter-spacing: .2px; }
.support-app-gate-card h1 { margin: 0; color: #172033; font-size: 25px; font-size: clamp(22px, 7vw, 27px); line-height: 1.24; letter-spacing: -.5px; }
.support-app-gate-card p { margin: 9px auto 14px; max-width: 350px; color: #65758a; font-size: 13px; line-height: 1.6; }
.support-app-gate-steps { display: grid; gap: 8px; margin: 0 0 13px; padding: 0; list-style: none; text-align: left; }
.support-app-gate-steps li { min-height: 46px; display: flex; align-items: center; gap: 10px; padding: 8px 11px; border: 1px solid #e4eaf2; border-radius: 13px; color: #263c55; background: #f8fafc; }
.support-app-gate-steps span { width: 27px; height: 27px; flex: 0 0 27px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--gate-accent); font-size: 12px; font-weight: 850; }
.support-app-gate-steps strong { font-size: 13px; line-height: 1.45; }
.support-app-gate-link { min-width: 0; margin: 0 0 11px; text-align: left; }
.support-app-gate-link label { display: block; margin: 0 0 6px 2px; color: #71849a; font-size: 10px; font-weight: 700; }
.support-app-gate-link input { display: block; width: 100%; min-width: 0; height: 43px; padding: 0 12px; overflow: hidden; border: 1px solid #dbe5f0; border-radius: 12px; outline: 0; color: #56708e; background: #f7faff; text-overflow: ellipsis; white-space: nowrap; -webkit-appearance: none; appearance: none; font: 11px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.support-app-gate-link input:focus { border-color: var(--gate-accent); box-shadow: 0 0 0 3px var(--gate-accent-soft); }
.support-app-gate-actions button, .support-app-gate-actions a { width: 100%; min-height: 46px; display: flex; align-items: center; justify-content: center; padding: 0 14px; border: 0; border-radius: 12px; text-decoration: none; font: 800 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; cursor: pointer; touch-action: manipulation; }
.support-app-gate-actions [hidden] { display: none !important; }
.support-app-gate-actions { display: grid; gap: 8px; }
.support-app-gate-primary { color: #fff; background: var(--gate-accent); box-shadow: 0 8px 18px rgba(40, 71, 142, .18); }
.support-app-gate-open { color: var(--gate-accent); border: 1px solid var(--gate-accent) !important; background: #fff; }
.support-app-gate-share { color: #36506d; background: var(--gate-accent-soft); }
.support-app-gate-secondary { min-height: 40px !important; color: #718197; background: transparent; }
.support-app-gate-card button:focus-visible, .support-app-gate-card a:focus-visible { outline: 3px solid #b9c8ff; outline-offset: 2px; }
.support-app-gate-card small { display: block; min-height: 30px; margin-top: 9px; color: #8193a7; font-size: 10px; line-height: 1.5; }
@supports (padding: max(0px)) { .support-app-gate { padding-top: max(72px, calc(env(safe-area-inset-top) + 58px)); padding-bottom: max(18px, env(safe-area-inset-bottom)); } .support-app-gate-menu-tip { top: max(13px, env(safe-area-inset-top)); } }
@media (max-width: 380px) { .support-app-gate { padding-top: 66px; } .support-app-gate-menu-tip { top: 10px; right: 9px; min-height: 42px; padding-left: 12px; } .support-app-gate-card { width: calc(100% - 16px); padding: 19px 14px 14px; border-radius: 20px; } .support-app-gate-card p { font-size: 12px; } .support-app-gate-steps strong { font-size: 12px; } }
@media (max-height: 660px) { .support-app-gate { align-items: flex-start; } .support-app-gate-card { padding-top: 16px; padding-bottom: 12px; } .support-app-gate-mark { width: 42px; height: 42px; margin-bottom: 8px; } .support-app-gate-card p { margin-bottom: 9px; } .support-app-gate-steps { gap: 6px; margin-bottom: 9px; } .support-app-gate-steps li { min-height: 40px; padding-top: 6px; padding-bottom: 6px; } }
.support-page { background: radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--support-color), transparent 82%), transparent 38%), #eef1f6; }
.support-window { grid-template-rows: 88px minmax(0, 1fr) auto auto auto; border: 1px solid rgba(60, 60, 67, .1); border-radius: 24px; background: rgba(255, 255, 255, .96); box-shadow: 0 25px 80px rgba(30, 35, 52, .2), 0 3px 10px rgba(30, 35, 52, .07); }
.is-embed .support-window { border: 0; border-radius: 20px; }
.support-head { position: relative; gap: 12px; padding: 0 17px; overflow: hidden; background: linear-gradient(135deg, color-mix(in srgb, var(--support-color), white 14%), var(--support-color) 58%, color-mix(in srgb, var(--support-color), black 15%)); }
.support-head:before { content: ""; position: absolute; right: -42px; top: -70px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255, 255, 255, .1); }
.support-head:after { content: ""; position: absolute; left: 30%; bottom: -55px; width: 130px; height: 90px; border-radius: 50%; background: rgba(255, 255, 255, .055); }
.support-avatar { position: relative; z-index: 1; width: 46px; height: 46px; flex: 0 0 auto; border: 1px solid rgba(255, 255, 255, .38); border-radius: 15px; background: rgba(255, 255, 255, .2); box-shadow: 0 8px 20px rgba(20, 24, 40, .13); font-size: 17px; }
.support-avatar img { display: block; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.support-head-copy { position: relative; z-index: 1; min-width: 0; display: grid; gap: 2px; }
.support-eyebrow { display: flex; align-items: center; gap: 5px; color: rgba(255, 255, 255, .7); font-size: 8px; font-weight: 650; letter-spacing: .7px; }
.support-eyebrow i { width: 6px; height: 6px; border: 1px solid rgba(255, 255, 255, .7); border-radius: 50%; background: #30d158; box-shadow: 0 0 0 3px rgba(48, 209, 88, .14); }
.support-head strong { font-size: 15px; letter-spacing: -.15px; }
.support-head small { font-size: 10px; opacity: .78; }
.support-head-actions { position: relative; z-index: 1; margin-left: auto; display: flex; align-items: center; gap: 7px; }
.support-safe { padding: 5px 7px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 999px; color: rgba(255, 255, 255, .72); background: rgba(255, 255, 255, .1); font-size: 8px; white-space: nowrap; }
.support-icon { margin: 0; width: 44px; height: 44px; border-radius: 12px; font-size: 23px; transition: background .16s, transform .16s; }
.support-icon:hover { background: rgba(255, 255, 255, .22); transform: scale(1.04); }
.support-messages { gap: 14px; padding: 20px 17px; background: radial-gradient(circle at 95% 0, rgba(255, 255, 255, .9), transparent 34%), #f3f5f8; }
.support-loading { padding: 9px 13px; border-radius: 999px; color: #898c95; background: rgba(118, 118, 128, .08); font-size: 10px; }
.support-welcome { position: relative; max-width: 92%; padding: 11px 14px 11px 36px; border: 1px solid rgba(60, 60, 67, .07); border-radius: 14px; color: #656871; background: rgba(255, 255, 255, .82); box-shadow: 0 4px 16px rgba(35, 40, 56, .04); font-size: 11px; }
.support-welcome img{display:block;width:100%;max-width:240px;max-height:150px;margin:0 0 9px;border-radius:12px;object-fit:cover}.support-welcome span{display:block}
.support-welcome:before { content: "✦"; position: absolute; left: 13px; top: 10px; color: var(--support-color); font-size: 13px; }
.support-message { gap: 6px; max-width: 88%; }
.support-bubble { min-width: 0; max-width: 100%; padding: 10px 13px; overflow-wrap: anywhere; border: 1px solid rgba(60, 60, 67, .06); border-radius: 17px 17px 17px 5px; background: #fff; box-shadow: 0 3px 12px rgba(31, 37, 51, .055); font-size: 13px; line-height: 1.5; }
.support-bubble img { width: auto; max-width: 100%; height: auto; }
.visitor .support-bubble { border: 0; border-radius: 17px 17px 5px 17px; background: linear-gradient(145deg, color-mix(in srgb, var(--support-color), white 8%), var(--support-color)); box-shadow: 0 6px 16px color-mix(in srgb, var(--support-color), transparent 78%); }
.support-time { color: #a0a2a9; font-size: 8px; }
.support-bubble img:focus-visible { outline: 3px solid color-mix(in srgb, var(--support-color), white 48%); outline-offset: 3px; }
.support-image-viewer { position: absolute; z-index: 20; inset: 0; padding: 54px 18px 24px; display: grid; place-items: center; background: rgba(8, 12, 22, .82); opacity: 0; transition: opacity .16s ease; }
.support-image-viewer[hidden] { display: none; }
.support-image-viewer.is-open { opacity: 1; }
.support-image-viewer > button { position: absolute; z-index: 2; top: 14px; right: 14px; width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .26); border-radius: 12px; color: #fff; background: rgba(255, 255, 255, .14); font: 400 27px/1 sans-serif; cursor: pointer; }
.support-image-viewer > div { width: 100%; height: 100%; min-height: 0; display: grid; place-items: center; grid-template-rows: minmax(0, 1fr) auto; gap: 10px; }
.support-image-viewer img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 12px; box-shadow: 0 20px 55px rgba(0, 0, 0, .32); }
.support-image-viewer small { color: rgba(255, 255, 255, .72); font-size: 10px; }
.support-waiting { min-height: 32px; padding: 7px 12px; border-top-color: rgba(60, 60, 67, .08); color: #72757d; background: rgba(250, 250, 252, .92); font-size: 9px; }
.support-waiting i { width: 6px; height: 6px; background: #30d158; }
.support-restriction { padding: 10px 13px; border-top: 1px solid rgba(180, 89, 36, .14); color: #8a4b20; background: #fff8ec; font-size: 11px; font-weight: 700; line-height: 1.45; text-align: center; }
.support-restriction[hidden] { display: none !important; }
.support-restriction[data-code="ACCOUNT_SUSPENDED"] { color: #8b2d2d; border-top-color: rgba(185, 55, 55, .16); background: #fff2f1; }
.support-eyebrow.is-risk { color: rgba(255, 232, 230, .9); }
.support-eyebrow.is-risk i { border-color: #fff; background: #ff453a; box-shadow: 0 0 0 3px rgba(255, 69, 58, .22); }
.support-safe.is-risk { color: #fff; border-color: rgba(255, 255, 255, .34); background: rgba(104, 11, 13, .28); }
.support-risk-notice { max-height: min(292px, 46vh); padding: 12px 13px 11px; overflow-x: hidden; overflow-y: auto; color: #642020; border-top: 1px solid rgba(185, 55, 55, .2); background: linear-gradient(180deg, #fff7f5, #fff1ef); text-align: left; scrollbar-width: thin; }
.support-risk-head { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; }
.support-risk-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: #fff; background: linear-gradient(145deg, #dc3d34, #aa1f22); box-shadow: 0 7px 15px rgba(171, 31, 34, .18); font-size: 18px; font-weight: 900; }
.support-risk-head > div { min-width: 0; display: grid; gap: 1px; }
.support-risk-head small { color: #a8524e; font-size: 8px; font-weight: 800; letter-spacing: .35px; }
.support-risk-head strong { color: #761f22; font-size: 14px; line-height: 1.25; }
.support-risk-head > b { padding: 5px 7px; border: 1px solid rgba(179, 40, 41, .14); border-radius: 999px; color: #a42125; background: rgba(255, 255, 255, .72); font-size: 8px; white-space: nowrap; }
.support-risk-notice > p { margin: 9px 0 8px; color: #7b3735; font-size: 11px; font-weight: 650; line-height: 1.58; }
.support-risk-notice ul { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.support-risk-notice li { position: relative; min-height: 24px; padding: 5px 8px 5px 25px; border: 1px solid rgba(174, 48, 48, .09); border-radius: 8px; color: #733330; background: rgba(255, 255, 255, .66); font-size: 10px; font-weight: 700; line-height: 1.45; }
.support-risk-notice li:before { content: "\2713"; position: absolute; left: 8px; top: 5px; width: 12px; height: 12px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #bd3434; font-size: 7px; }
.support-risk-law { margin-top: 7px; padding: 7px 8px; border-left: 3px solid #bd3434; border-radius: 7px; color: #813431; background: rgba(255, 255, 255, .72); font-size: 9px; font-weight: 700; line-height: 1.48; }
.support-risk-notice footer { margin-top: 8px; padding-top: 7px; border-top: 1px dashed rgba(164, 46, 46, .16); color: #a14d49; font-size: 8px; font-weight: 750; line-height: 1.45; }
.support-has-risk-alert .support-window { grid-template-rows: 88px minmax(0, 1fr) auto; }
.support-has-risk-alert .support-head { background: linear-gradient(135deg, #cf4542, #a21f26 66%, #741921); }
.support-has-risk-alert .support-messages, .support-has-risk-alert .support-new-messages, .support-has-risk-alert .support-waiting, .support-has-risk-alert .support-error, .support-has-risk-alert .support-rating { display: none !important; }
.support-has-risk-alert .support-risk-notice { min-height: 0; max-height: none; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 18px 17px; overflow-y: auto; border-top: 0; }
.support-has-risk-alert .support-send { color: #9e8585; background: #ded4d4; box-shadow: none; }
.support-is-restricted.support-has-risk-alert .support-composer { border-top-color: rgba(185, 55, 55, .12); background: #f5f3f3; }
.support-is-restricted.support-has-risk-alert .support-composer textarea { color: #9a7a7a; background: rgba(124, 72, 72, .07); }
.support-is-restricted .support-composer { background: #f7f7f8; }
.support-is-restricted .support-composer textarea { color: #858891; background: rgba(118, 118, 128, .08); }
.support-error { padding: 8px 12px; font-size: 10px; }
.support-rating{padding:12px 14px;border-top:1px solid rgba(60,60,67,.08);background:#fff;text-align:center}.support-rating strong{display:block;font-size:12px;margin-bottom:8px}.support-rating div{display:flex;justify-content:center;gap:8px}.support-rating button{min-height:44px;border:1px solid #dde2ea;border-radius:999px;background:#f7f8fa;padding:7px 13px;cursor:pointer}.support-rating button:hover{border-color:var(--support-color);color:var(--support-color)}.support-rating textarea{display:block;width:100%;min-height:48px;margin-top:9px;padding:8px 10px;border:1px solid #e3e7ee;border-radius:10px;resize:none;font:inherit}.support-rating small{display:block;color:#147c45;margin-top:8px}
.support-new-messages { bottom: 107px; padding: 7px 12px; background: rgba(32, 34, 41, .92); backdrop-filter: blur(14px); font-size: 10px; }
.support-composer { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: end; gap: 7px; padding: 10px 88px 8px 11px; border-top: 1px solid rgba(60, 60, 67, .1); background: rgba(255, 255, 255, .96); }
.support-compose-tools { position: relative; display: flex; gap: 4px; }
.support-tool-toggle { width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #555b67; background: rgba(118, 118, 128, .1); font-size: 26px; line-height: 1; cursor: pointer; transition: .16s; }
.support-tool-toggle:hover, .support-tool-toggle.active { color: #fff; background: var(--support-color); transform: rotate(45deg); }
.support-tool-toggle:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.support-voice-button { position: relative; width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #555b67; background: rgba(118, 118, 128, .1); cursor: pointer; transition: .16s; touch-action: manipulation; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.support-voice-button svg { width: 21px; height: 21px; fill: currentColor; }
.support-voice-button:hover { color: #fff; background: var(--support-color); }
.support-voice-button:disabled { opacity: .45; cursor: not-allowed; }
.support-voice-button.is-recording { color: #fff; background: #ff453a; box-shadow: 0 0 0 5px rgba(255, 69, 58, .14); animation: supportVoicePulse 1.25s ease-in-out infinite; }
.support-voice-button.is-recording.is-canceling { background: #747982; box-shadow: 0 0 0 6px rgba(80, 84, 94, .13); animation: none; }
.support-voice-button.is-recording svg { display: none; }
.support-voice-time { display: none; font-size: 9px; font-weight: 800; font-variant-numeric: tabular-nums; }
.support-voice-button.is-recording .support-voice-time { display: block; }
.support-tool-toggle.is-record-cancel { color: #c92f27; background: #fff0ef; transform: none; font-size: 23px; }
@keyframes supportVoicePulse { 50% { box-shadow: 0 0 0 9px rgba(255, 69, 58, .04); } }
.support-tool-panel { position: absolute; z-index: 8; left: 0; bottom: calc(100% + 9px); width: 236px; padding: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; border: 1px solid rgba(60, 60, 67, .11); border-radius: 16px; background: rgba(255, 255, 255, .96); box-shadow: 0 14px 44px rgba(28, 33, 46, .18); backdrop-filter: blur(16px); }
.support-tool-panel[hidden] { display: none; }
.support-tool-panel button { min-width: 0; min-height: 72px; display: grid; justify-items: center; align-content: center; gap: 3px; border: 0; border-radius: 13px; color: #343944; background: rgba(118, 118, 128, .075); cursor: pointer; }
.support-tool-panel button:hover { color: var(--support-color); background: color-mix(in srgb, var(--support-color), transparent 91%); }
.support-tool-panel span { font-size: 22px; line-height: 1; }
.support-tool-panel b { font-size: 12px; }
.support-tool-panel small { color: #686d78; font-size: 11px; }
.support-upload { width: 32px; height: 38px; border-radius: 10px; color: #666a74; background: rgba(118, 118, 128, .08); font-size: 18px; transition: .16s; }
.support-upload:hover { color: var(--support-color); background: color-mix(in srgb, var(--support-color), transparent 90%); }
.support-composer textarea { width: 100%; min-width: 0; min-height: 44px; max-height: 96px; padding: 11px; border-radius: 12px; background: rgba(118, 118, 128, .075); font-size: 13px; }
.support-composer textarea:focus { background: #fff; box-shadow: 0 0 0 3px color-mix(in srgb, var(--support-color), transparent 87%), inset 0 0 0 1px color-mix(in srgb, var(--support-color), transparent 70%); }
.support-send { position: absolute; right: 11px; top: 10px; min-width: 64px; height: 44px; padding: 0 14px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: linear-gradient(145deg, color-mix(in srgb, var(--support-color), white 7%), var(--support-color)); box-shadow: 0 6px 14px color-mix(in srgb, var(--support-color), transparent 78%); font-size: 13px; font-weight: 700; }

@media (max-width: 520px) {
    .support-window, .is-embed .support-window { grid-template-rows: 76px minmax(0, 1fr) auto auto auto; border-radius: 0; }
    .support-has-risk-alert .support-window, .support-has-risk-alert.is-embed .support-window { grid-template-rows: 76px minmax(0, 1fr) auto; }
    .support-head { min-height: 76px; padding: 0 12px; }
    .support-avatar { width: 40px; height: 40px; border-radius: 13px; }
    .support-safe { display: none; }
    .support-icon { width: 44px; height: 44px; }
    .support-messages { padding: 15px 12px; }
    .support-message { max-width: 91%; }
    .support-bubble { font-size: 12px; }
    .support-risk-notice { max-height: min(270px, 44dvh); padding: 10px 10px 9px; }
    .support-has-risk-alert .support-risk-notice { max-height: none; padding: 14px 12px; }
    .support-risk-head { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 7px; }
    .support-risk-mark { width: 32px; height: 32px; border-radius: 10px; }
    .support-risk-head strong { font-size: 13px; }
    .support-risk-notice > p { margin: 8px 0 7px; font-size: 10px; }
    .support-risk-notice li { padding-left: 24px; font-size: 9px; }
    .support-risk-law { font-size: 8.5px; }
    .support-composer { padding: 8px 76px 7px 8px; gap: 5px; }
    .support-compose-tools { gap: 2px; }
    .support-tool-toggle { width: 44px; height: 44px; font-size: 25px; }
    .support-voice-button { width: 44px; height: 44px; flex-basis: 44px; }
    .support-tool-panel { width: min(244px, calc(100vw - 18px)); bottom: calc(100% + 7px); grid-template-columns: repeat(2, 1fr); }
    .support-tool-panel button { min-height: 70px; }
    .support-upload { width: 44px; height:44px; }
    .support-send { top: 8px; right: 8px; min-width: 62px; width: 62px; height:44px; padding: 0 10px; }
    .support-composer textarea { font-size: 16px; }
    .support-new-messages { bottom: 101px; }
    .support-image-viewer { padding: max(58px, env(safe-area-inset-top)) 10px max(18px, env(safe-area-inset-bottom)); }
    .support-image-viewer > button { top: max(10px, env(safe-area-inset-top)); right: 10px; width: 44px; height: 44px; }
}
@media (max-width: 360px) {
    .support-head-copy strong { max-width: 160px; }
    .support-composer textarea { padding-left: 8px; padding-right: 8px; font-size: 16px; }
}
@media (max-width: 520px) and (max-height: 520px) {
    .support-window, .is-embed .support-window { grid-template-rows: 58px minmax(0, 1fr) auto auto auto; }
    .is-direct .support-window { grid-template-rows: calc(58px + env(safe-area-inset-top)) minmax(0, 1fr) auto auto auto; }
    .support-head { min-height: 58px; padding-left: 10px; padding-right: 10px; }
    .support-avatar { width: 34px; height: 34px; border-radius: 11px; }
    .support-head strong { font-size: 14px; }
    .support-head small { font-size: 9px; }
    .support-icon { width: 40px; height: 40px; }
    .support-messages { padding: 10px; gap: 10px; }
    .support-composer { padding-top: 6px; padding-bottom: 5px; }
    .support-new-messages { bottom: 88px; }
}
.support-loading-retry { display: grid; gap: 6px; max-width: 240px; margin: auto; padding: 12px 14px; border-radius: 12px; line-height: 1.5; }
.support-loading-retry p { margin: 0; color: #4d5a70; font-size: 13px; font-weight: 700; }
.support-loading-retry small { color: #8790a3; font-size: 12px; }
.support-loading-retry button { justify-self: center; border: 0; border-radius: 999px; padding: 7px 14px; color: #fff; background: var(--support-color,#635bff); font-size: 12px; font-weight: 700; }
.support-error.is-success { background: #ecfdf3; color: #16794a; border-top-color: #b8efd0; }