.support-launcher {
  position: fixed;
  z-index: 25;
  right: 24px;
  bottom: max(24px, env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 48px;
  padding: 12px 18px;
  border: 1px solid var(--amber-deep);
  border-radius: 999px;
  background: var(--amber);
  box-shadow: var(--shadow-lg);
  color: white;
  font: 700 14px var(--ui);
  cursor: pointer;
}

.support-dialog {
  position: fixed;
  inset: auto 24px 24px auto;
  width: 420px;
  height: min(680px, calc(100dvh - 48px));
  max-width: calc(100vw - 32px);
  max-height: calc(100dvh - 32px);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--card);
  color: var(--cream);
  box-shadow: var(--shadow-lg);
  font-family: var(--ui);
}

.support-dialog[open] { display: flex; flex-direction: column; }
.support-dialog::backdrop { background: rgba(15, 23, 42, .28); }
.support-dialog [hidden] { display: none !important; }
.support-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 20px 16px; }
.support-eyebrow { display: block; color: var(--faint); font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.support-header h2 { margin: 3px 0 0; color: var(--cream); font-size: 21px; line-height: 1.25; font-weight: 750; letter-spacing: -.025em; }
.support-close { flex: 0 0 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--bg2); color: var(--dim); font: 400 26px var(--ui); cursor: pointer; }
.support-tabs { display: grid; grid-template-columns: 1fr 1fr; flex-shrink: 0; gap: 4px; margin: 0 20px; padding: 4px; background: var(--bg); border: 1px solid var(--line-soft); border-radius: 12px; }
.support-tabs button { min-height: 40px; padding: 8px; border: 0; border-radius: 8px; background: transparent; color: var(--dim); font: 650 13px var(--ui); cursor: pointer; }
.support-tabs button[aria-selected="true"] { background: var(--card); color: var(--amber-deep); box-shadow: 0 1px 4px rgba(15, 23, 42, .09); }
.support-panel { flex: 1; min-height: 0; }
.support-ask-panel { display: flex; flex-direction: column; }
.support-messages { flex: 1; min-height: 80px; padding: 20px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.support-message { width: fit-content; max-width: 100%; margin-bottom: 16px; padding: 12px 14px; border: 1px solid var(--line-soft); border-radius: 14px 14px 14px 4px; background: var(--bg); overflow-wrap: anywhere; }
.support-message-user { margin-left: auto; border-color: #dbeafe; border-radius: 14px 14px 4px 14px; background: #eff6ff; }
.support-message-label { display: block; margin-bottom: 5px; color: var(--dim); font-size: 11px; font-weight: 750; }
.support-message-user .support-message-label { color: var(--amber-deep); }
.support-message p { margin: 0; color: var(--cream); font-size: 14px; line-height: 1.55; white-space: pre-wrap; }
.support-prompts { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.support-prompts button, .support-retry { min-height: 40px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--card); color: var(--amber-deep); font: 600 13px var(--ui); text-align: left; cursor: pointer; }
.support-retry { margin-top: 10px; }
.support-message-error { border-color: #f5cccc; background: #fff7f7; }
.support-sources { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.support-sources a { color: var(--amber-deep); font-size: 12px; font-weight: 650; text-underline-offset: 3px; }
.support-chat-form { flex-shrink: 0; margin: 0 20px; padding-top: 14px; border-top: 1px solid var(--line); }
.support-dialog label { display: block; margin: 0 0 7px; color: var(--cream); font-size: 12px; font-weight: 700; }
.support-dialog textarea, .support-dialog select { display: block; width: 100%; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg2); color: var(--cream); font: 400 16px/1.45 var(--ui); }
.support-dialog textarea { resize: vertical; min-height: 72px; max-height: 160px; }
.support-dialog textarea::placeholder { color: var(--faint); opacity: 1; }
.support-compose-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 9px; }
.support-compose-footer > span { max-width: 135px; color: var(--faint); font-size: 11px; line-height: 1.35; }
.support-primary { min-height: 44px; padding: 11px 15px; border: 1px solid var(--amber-deep); border-radius: 9px; background: var(--amber); color: white; font: 650 13px var(--ui); cursor: pointer; }
.support-session-note { margin: 10px 20px 16px; color: var(--faint); font-size: 10px; line-height: 1.4; }
.support-feedback-panel { padding: 18px 20px 20px; overflow-y: auto; overscroll-behavior: contain; }
.support-feedback-intro { margin: 0 0 18px; color: var(--dim); font-size: 14px; line-height: 1.55; }
.support-feedback-form select { margin-bottom: 18px; }
.support-feedback-form textarea { min-height: 150px; max-height: 220px; }
.support-field-hint { margin: 9px 0 18px; color: var(--faint); font-size: 12px; line-height: 1.5; }
.support-feedback-form .support-primary { width: 100%; }
.support-feedback-status { margin: 0 0 14px; padding: 11px 12px; border-radius: 9px; background: #ecfdf5; color: #065f46; font-size: 13px; line-height: 1.5; }
.support-status-error { background: #fff1f2; color: #9f1239; }
.support-dialog button:disabled, .support-dialog textarea:disabled, .support-dialog select:disabled { opacity: .65; cursor: wait; }
.support-dialog :focus-visible, .support-launcher:focus-visible { outline: 3px solid var(--amber); outline-offset: 3px; }

@media (hover: hover) and (pointer: fine) {
  .support-launcher:hover, .support-primary:hover:not(:disabled) { background: var(--amber-deep); }
  .support-close:hover, .support-prompts button:hover, .support-retry:hover { background: var(--bg); }
}

@media (max-width: 700px) {
  .support-launcher { right: 16px; bottom: calc(84px + env(safe-area-inset-bottom)); }
  .support-dialog { inset: auto 12px max(12px, env(safe-area-inset-bottom)) 12px; width: auto; max-width: none; height: min(680px, calc(100dvh - 24px - env(safe-area-inset-bottom))); border-radius: 18px; }
  .support-header { padding: 16px 16px 12px; }
  .support-tabs { margin-inline: 16px; }
  .support-messages { padding: 16px; }
  .support-chat-form { margin-inline: 16px; }
  .support-session-note { margin-inline: 16px; }
  .support-feedback-panel { padding-inline: 16px; }
  html[data-tsw-native-shell] .support-launcher { bottom: max(20px, env(safe-area-inset-bottom)); }
}

@media (max-height: 500px) {
  .support-dialog { bottom: max(8px, env(safe-area-inset-bottom)); height: calc(100dvh - 16px - env(safe-area-inset-bottom)); max-height: calc(100dvh - 16px - env(safe-area-inset-bottom)); }
  .support-header { padding-block: 8px; }
  .support-eyebrow, .support-session-note { display: none; }
  .support-ask-panel { overflow-y: auto; }
  .support-messages { min-height: 0; }
  .support-chat-form { padding-block: 8px; }
  .support-dialog textarea { height: 48px; min-height: 48px; max-height: 80px; }
}
