:root {
  --pnx-bg: #050b14;
  --pnx-side: #071421;
  --pnx-card: #0a1928;
  --pnx-card2: #0d2234;
  --pnx-border: #173c5a;
  --pnx-blue: #008cff;
  --pnx-neon: #00b7ff;
  --pnx-green: #20d67a;
  --pnx-red: #ff5b62;
  --pnx-text: #f4f8fc;
  --pnx-muted: #91a8bc;
}

.pnx-support-launch {
  position: fixed;
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, env(safe-area-inset-bottom));
  z-index: 2147483000;
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  border: 1px solid var(--pnx-neon);
  border-radius: 999px;
  padding: 13px 18px;
  background: linear-gradient(135deg, #0064d8, #008cff);
  color: #fff;
  box-shadow: 0 10px 34px rgba(0, 140, 255, .35);
  cursor: pointer;
  font: 750 14px/1.1 system-ui, -apple-system, "Segoe UI", sans-serif;
  animation: pnxSupportFloat 3.4s ease-in-out infinite;
  transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}

.pnx-support-launch:hover,
.pnx-support-launch:focus-visible {
  filter: brightness(1.1);
  box-shadow: 0 14px 40px rgba(0, 140, 255, .46);
  outline: 2px solid rgba(110, 219, 255, .9);
  outline-offset: 3px;
}

.pnx-support-launch.is-open { animation-play-state: paused; }
.pnx-support-launch-icon { filter: drop-shadow(0 0 7px rgba(255, 255, 255, .45)); }
.pnx-support-launch-badge {
  display: none;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--pnx-red);
  align-items: center;
  justify-content: center;
  font-size: 11px;
}
.pnx-support-launch.has-unread .pnx-support-launch-badge { display: flex; }

.pnx-support-panel {
  position: fixed;
  right: max(14px, env(safe-area-inset-right));
  bottom: calc(max(14px, env(safe-area-inset-bottom)) + 62px);
  z-index: 2147483001;
  display: none;
  flex-direction: column;
  width: min(410px, calc(100% - 28px));
  height: min(650px, calc(100dvh - 104px));
  overflow: hidden;
  border: 1px solid var(--pnx-border);
  border-radius: 16px;
  background: var(--pnx-bg);
  color: var(--pnx-text);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .55);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}
.pnx-support-panel.open { display: flex; }
.pnx-support-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px 15px;
  border-bottom: 1px solid var(--pnx-border);
  background: linear-gradient(180deg, #0a1928, #071421);
}
.pnx-support-logo {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--pnx-blue);
  border-radius: 10px;
  background: #082c4b;
  font-size: 20px;
}
.pnx-support-head-copy { min-width: 0; flex: 1; }
.pnx-support-head strong { display: block; font-size: 14px; }
.pnx-support-head small { display: block; margin-top: 2px; color: var(--pnx-muted); font-size: 11px; }
.pnx-support-close {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--pnx-muted);
  cursor: pointer;
  font-size: 24px;
}
.pnx-support-close:hover,
.pnx-support-close:focus-visible { background: var(--pnx-card2); color: #fff; outline: 1px solid var(--pnx-neon); }

.pnx-support-body {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 14px;
  background: radial-gradient(circle at top right, rgba(0, 140, 255, .07), transparent 40%), var(--pnx-bg);
  scrollbar-color: #1d5a82 #07121d;
}
.pnx-support-directory { margin-bottom: 13px; }
.pnx-support-directory h2 { margin: 0 0 4px; color: #f5fbff; font-size: 18px; }
.pnx-support-directory > p { margin: 0 0 10px; color: var(--pnx-muted); font-size: 12px; line-height: 1.45; }
.pnx-support-channels { display: grid; gap: 7px; }
.pnx-support-channel {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  width: 100%;
  box-sizing: border-box;
  min-height: 54px;
  border: 1px solid var(--pnx-border);
  border-radius: 10px;
  padding: 8px 10px;
  background: #081827;
  color: var(--pnx-text);
  cursor: pointer;
  text-align: left;
  text-decoration: none;
  font: inherit;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.pnx-support-channel:hover,
.pnx-support-channel:focus-visible { border-color: var(--pnx-neon); background: #0a2236; transform: translateY(-1px); outline: none; }
.pnx-support-channel-primary { border-color: rgba(0, 183, 255, .62); background: linear-gradient(90deg, rgba(0, 111, 220, .18), #081827); }
.pnx-support-channel-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #0a2e4c; color: #7cdcff; font-size: 16px; }
.pnx-support-channel-copy { min-width: 0; }
.pnx-support-channel-copy strong,
.pnx-support-channel-copy small { display: block; }
.pnx-support-channel-copy strong { color: #f4f9fd; font-size: 12px; }
.pnx-support-channel-copy small { margin-top: 2px; color: var(--pnx-muted); font-size: 10.5px; }
.pnx-support-channel-arrow { color: #58cfff; font-weight: 800; }

.pnx-support-intro {
  margin-bottom: 12px;
  padding: 10px 11px;
  border: 1px solid #174e73;
  border-radius: 10px;
  background: #082c4b;
  color: #cceeff;
  font-size: 12px;
  line-height: 1.45;
}
.pnx-support-form { display: grid; gap: 10px; }
.pnx-support-field { display: grid; gap: 5px; }
.pnx-support-field span { color: #c9d7e2; font-size: 11px; font-weight: 650; }
.pnx-support-field input,
.pnx-support-field textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--pnx-border);
  border-radius: 9px;
  padding: 11px 12px;
  outline: none;
  background: #081827;
  color: var(--pnx-text);
  font: 500 13px/1.3 system-ui, -apple-system, "Segoe UI", sans-serif;
}
.pnx-support-field input:focus,
.pnx-support-field textarea:focus { border-color: var(--pnx-neon); box-shadow: 0 0 0 2px rgba(0, 183, 255, .1); }
.pnx-support-field textarea { min-height: 100px; resize: vertical; }
.pnx-support-hp { position: absolute !important; left: -99999px !important; opacity: 0 !important; pointer-events: none !important; }
.pnx-support-btn {
  border: 1px solid var(--pnx-neon);
  border-radius: 9px;
  padding: 11px 13px;
  background: linear-gradient(135deg, #0064d8, #008cff);
  color: #fff;
  cursor: pointer;
  font-weight: 750;
}
.pnx-support-btn:disabled { opacity: .5; cursor: not-allowed; }
.pnx-support-secondary { border-color: var(--pnx-border); background: var(--pnx-card2); }
.pnx-support-status { margin-top: 8px; color: var(--pnx-muted); font-size: 11px; line-height: 1.4; }
.pnx-support-status.error { color: #ff9da2; }
.pnx-support-status.ok { color: #8cf0be; }

.pnx-chat-shell { display: flex; flex-direction: column; min-height: 360px; }
.pnx-chat-meta { margin-bottom: 10px; padding: 10px 11px; border: 1px solid var(--pnx-border); border-radius: 10px; background: var(--pnx-card); }
.pnx-chat-meta strong { display: block; font-size: 13px; }
.pnx-chat-meta small { display: block; margin-top: 3px; color: var(--pnx-muted); font-size: 10.5px; }
.pnx-chat-messages { flex: 1; min-height: 190px; max-height: 250px; overflow: auto; display: flex; flex-direction: column; gap: 8px; padding: 4px 2px 10px; }
.pnx-chat-message { max-width: 86%; overflow-wrap: anywhere; padding: 9px 10px; border: 1px solid var(--pnx-border); border-radius: 10px; background: var(--pnx-card2); font-size: 12px; line-height: 1.45; white-space: pre-wrap; }
.pnx-chat-message.owner { align-self: flex-end; border-color: #1b5b88; background: #082c4b; }
.pnx-chat-message.customer { align-self: flex-start; }
.pnx-chat-message b { display: block; margin-bottom: 4px; color: var(--pnx-neon); font-size: 9px; }
.pnx-chat-message.owner b { color: var(--pnx-green); }
.pnx-chat-message time { display: block; margin-top: 5px; color: #60788e; font-size: 9px; }
.pnx-chat-compose { display: grid; gap: 8px; border-top: 1px solid var(--pnx-border); padding-top: 10px; }
.pnx-chat-compose textarea { width: 100%; box-sizing: border-box; min-height: 74px; max-height: 130px; resize: vertical; border: 1px solid var(--pnx-border); border-radius: 9px; padding: 10px; outline: none; background: #081827; color: var(--pnx-text); }
.pnx-chat-compose textarea:focus { border-color: var(--pnx-neon); }
.pnx-chat-actions { display: flex; gap: 8px; }
.pnx-chat-actions button { flex: 1; }
.pnx-support-resolved { padding: 9px 10px; border: 1px solid var(--pnx-green); border-radius: 9px; background: #082d20; color: #9cf0c6; font-size: 11px; line-height: 1.4; }

[data-auth-state-message] { display: none !important; }

@keyframes pnxSupportFloat {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -8px, 0); }
}

@media (max-width: 520px) {
  .pnx-support-launch { right: max(10px, env(safe-area-inset-right)); bottom: max(10px, env(safe-area-inset-bottom)); }
  .pnx-support-panel { right: max(10px, env(safe-area-inset-right)); bottom: calc(max(10px, env(safe-area-inset-bottom)) + 60px); width: calc(100% - 20px); height: min(680px, calc(100dvh - 82px)); }
  .pnx-support-head small { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .pnx-support-launch { animation: none; transition: none; }
  .pnx-support-channel { transition: none; }
}