#mvpn-support { --chat-ink: #f3f6ff; --chat-muted: #aab7d0; --chat-line: #2a3851; color: var(--chat-ink); font: 14px/1.55 "Plus Jakarta Sans", system-ui, sans-serif; position: fixed; right: max(20px, env(safe-area-inset-right)); bottom: max(20px, env(safe-area-inset-bottom)); z-index: 1100; }
#mvpn-support *, #mvpn-support *::before, #mvpn-support *::after { box-sizing: border-box; }
#mvpn-support [hidden] { display: none !important; }
#mvpn-support button, #mvpn-support select, #mvpn-support textarea { font: inherit; color: inherit; }
#mvpn-support button { cursor: pointer; }
#mvpn-support button:disabled { cursor: wait; opacity: .6; }
#mvpn-support :focus-visible { outline: 3px solid #80d1ff; outline-offset: 3px; }
#mvpn-support .msc-launch { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 20px; border: 1px solid #609fff; border-radius: 28px; background: #2466db; color: white; font-weight: 700; box-shadow: 0 8px 28px #0005; }
#mvpn-support .msc-launch svg { width: 22px; height: 22px; }
#mvpn-support .msc-panel { display: flex; flex-direction: column; width: 390px; height: min(690px, calc(100dvh - 108px)); margin-bottom: 12px; background: #101b2e; border: 1px solid var(--chat-line); border-radius: 22px; overflow: hidden; box-shadow: 0 18px 80px #0008; }
#mvpn-support .msc-header { display: flex; align-items: center; gap: 12px; padding: 18px; border-bottom: 1px solid var(--chat-line); background: #15243c; }
#mvpn-support .msc-logo { width: 40px; height: 40px; border-radius: 12px; }
#mvpn-support .msc-heading { flex: 1; }
#mvpn-support .msc-title { margin: 0; font-size: 16px; font-weight: 750; }
#mvpn-support .msc-subtitle { margin: 1px 0 0; font-size: 12px; color: #b9cdf0; }
#mvpn-support .msc-close, #mvpn-support .msc-reset { border: 0; background: transparent; min-width: 44px; min-height: 44px; }
#mvpn-support .msc-close { font-size: 27px; }
#mvpn-support .msc-device { display: flex; gap: 10px; align-items: center; padding: 10px 18px; border-bottom: 1px solid var(--chat-line); color: var(--chat-muted); }
#mvpn-support .msc-device select { flex: 1; min-width: 0; padding: 8px; border: 1px solid var(--chat-line); border-radius: 9px; background: #17253c; min-height: 44px; }
#mvpn-support .msc-device .msc-language { flex: 0 0 70px; width: 70px; }
#mvpn-support .msc-scroll { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px; }
#mvpn-support .msc-message { width: fit-content; max-width: 94%; margin: 0 0 12px; padding: 12px 14px; background: #1b2c46; border-radius: 14px 14px 14px 3px; white-space: pre-wrap; overflow-wrap: anywhere; }
#mvpn-support .msc-message[data-role="user"] { margin-left: auto; background: #235dba; border-radius: 14px 14px 3px 14px; }
#mvpn-support .msc-message[data-role="status"] { color: var(--chat-muted); background: transparent; padding: 0; }
#mvpn-support .msc-suggestions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
#mvpn-support .msc-suggestions button { padding: 9px 12px; border: 1px solid #426899; border-radius: 12px; background: #152840; color: #dcecff; min-height: 44px; text-align: left; }
#mvpn-support .msc-resources { display: flex; gap: 8px; flex-wrap: wrap; padding: 10px 18px; border-top: 1px solid var(--chat-line); }
#mvpn-support .msc-resources a { display: inline-flex; align-items: center; min-height: 36px; color: #9dd8ff; text-decoration: underline; text-underline-offset: 3px; font-size: 12px; }
#mvpn-support .msc-notice { padding: 0 0 14px; color: var(--chat-muted); font-size: 11px; }
#mvpn-support .msc-form { display: flex; gap: 8px; padding: 12px 18px; border-top: 1px solid var(--chat-line); align-items: flex-end; }
#mvpn-support .msc-form textarea { resize: none; flex: 1; min-width: 0; min-height: 48px; max-height: 96px; padding: 12px; background: #0e1728; border: 1px solid #415573; border-radius: 12px; font-size: 16px; }
#mvpn-support .msc-form button { min-width: 48px; min-height: 48px; border: 0; border-radius: 12px; background: #2466db; color: white; font-size: 21px; }
#mvpn-support .msc-footer { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 0 12px 4px 18px; color: var(--chat-muted); font-size: 11px; }
#mvpn-support .msc-reset { font-size: 11px; color: #c0d8fc; }
@media (max-width: 600px) {
  #mvpn-support { right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); }
  #mvpn-support.msc-open { inset: 0; }
  #mvpn-support .msc-panel { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
  #mvpn-support.msc-open .msc-launch { display: none; }
  #mvpn-support .msc-resources a { min-height: 44px; }
}
@media (prefers-reduced-motion: no-preference) { #mvpn-support .msc-launch:hover { background: #3378eb; } }
@media (max-height: 600px) {
  #mvpn-support .msc-header { padding: 8px 14px; }
  #mvpn-support .msc-device { padding: 6px 14px; }
  #mvpn-support .msc-resources { flex-wrap: nowrap; overflow-x: auto; padding: 4px 14px; gap: 14px; }
  #mvpn-support .msc-resources a { flex-shrink: 0; white-space: nowrap; min-height: 44px; }
  #mvpn-support .msc-form { padding: 8px 14px; }
  #mvpn-support .msc-form textarea { height: 48px; }
  #mvpn-support .msc-footer { padding-bottom: 0; }
}

#mvpn-support .msc-feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0; color: var(--chat-muted); }
#mvpn-support .msc-feedback[hidden] { display: none; }
#mvpn-support .msc-feedback button { border: 1px solid var(--chat-line); border-radius: 10px; background: #18263e; color: var(--chat-ink); padding: 7px 10px; cursor: pointer; }
#mvpn-support .msc-feedback button:disabled { opacity: .5; cursor: default; }
#mvpn-support .msc-feedback-status { width: 100%; font-size: 12px; }