.feedback-launcher {
  position:fixed;
  z-index:var(--cc-z-bar);
  left:max(196px,env(safe-area-inset-left,0px));
  bottom:calc(8px + var(--cc-visual-viewport-bottom,0px)
    + env(safe-area-inset-bottom,0px));
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  border:1px solid var(--ui-line);
  border-radius:999px;
  background:var(--ui-panel);
  box-shadow:var(--ui-shadow);
  color:var(--ui-text-soft);
  cursor:grab;
  font-size:11.5px;
  touch-action:none;
  user-select:none;
}
.feedback-launcher:hover { border-color:color-mix(in srgb, var(--ui-accent) 40%, transparent); color:var(--ui-text); }
.feedback-launcher.is-dragging {
  cursor:grabbing;
  box-shadow:0 12px 34px var(--ui-shadow-color);
  transition:none;
}
.feedback-drag-mark {
  color:var(--ui-muted);
  font-size:14px;
  line-height:1;
}
.feedback-launcher:focus-visible {
  outline:2px solid var(--ui-accent);
  outline-offset:3px;
}
.feedback-dialog {
  width:min(620px,calc(100vw - 28px));
  height:auto;
  max-height:92vh;
  background:var(--ui-panel);
}
.feedback-dialog .panel-header,
.feedback-dialog .modal-body { background:var(--ui-panel); }
.feedback-form { display:grid; gap:16px; }
.feedback-kind { margin:0; padding:0; border:0; }
.feedback-kind legend { margin-bottom:8px; color:var(--ui-text-soft); font-weight:650; }
.feedback-kind-options { display:flex; flex-wrap:wrap; gap:7px; }
.feedback-kind-choice {
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:6px 12px;
  border:1px solid var(--ui-line);
  border-radius:999px;
  background:var(--ui-muted-surface);
  color:var(--ui-text-soft);
  cursor:pointer;
  font-size:12px;
}
.feedback-kind-choice:hover { border-color:color-mix(in srgb, var(--ui-accent) 40%, transparent); }
.feedback-kind-choice:has(input:focus-visible) {
  outline:2px solid var(--ui-accent);
  outline-offset:2px;
}
.feedback-kind-choice:has(input:checked) {
  border-color:var(--ui-accent);
  background:var(--ui-accent-soft);
  color:var(--ui-text);
}
.feedback-kind-choice input,
.feedback-consent input {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
}
.feedback-copy textarea {
  width:100%;
  min-width:0;
  min-height:170px;
  max-height:50vh;
  border-color:var(--ui-line);
  background:var(--ui-input);
  color:var(--ui-text);
  resize:vertical;
  font-weight:400;
}
.feedback-copy textarea::placeholder { color:var(--ui-muted); }
.feedback-copy textarea:focus {
  border-color:var(--ui-accent);
  outline:2px solid var(--ui-accent-faint);
}
.feedback-consent {
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:9px;
  align-items:start;
  margin:0;
  color:var(--ui-text-soft);
  cursor:pointer;
  font-size:12.5px;
  line-height:1.5;
}
.feedback-check {
  display:grid;
  width:18px;
  height:18px;
  place-items:center;
  margin-top:1px;
  border:1px solid var(--ui-line);
  border-radius:5px;
  color:transparent;
  font-size:12px;
  font-weight:800;
}
.feedback-consent input:checked + .feedback-check {
  border-color:var(--ui-accent);
  background:var(--ui-accent-soft);
  color:var(--ui-accent);
}
.feedback-consent input:focus-visible + .feedback-check {
  outline:2px solid var(--ui-accent);
  outline-offset:2px;
}
.feedback-context { margin:-5px 0 0; color:var(--ui-muted); font-size:11px; }
.feedback-result { min-height:20px; margin:0; color:var(--ui-muted); font-size:12px; }
.feedback-result.error { color:var(--ui-danger); }
.feedback-actions { display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.feedback-success {
  display:grid;
  justify-items:center;
  gap:9px;
  padding:28px 18px;
  text-align:center;
}
.feedback-success-mark {
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:50%;
  background:var(--ui-success-soft);
  color:var(--ui-success);
  font-size:22px;
  font-weight:800;
}
.feedback-success h2 { margin:0; font-size:18px; }
.feedback-success p { margin:0 0 8px; color:var(--ui-muted); }
@media (max-width:760px) {
  .feedback-launcher {
    bottom:calc(66px + var(--cc-visual-viewport-bottom,0px)
      + env(safe-area-inset-bottom,0px));
    left:max(8px,env(safe-area-inset-left,0px));
  }
  .feedback-dialog { width:100%; max-width:100%; height:auto; }
  .feedback-actions { width:100%; }
  .feedback-actions .button { flex:1 1 140px; }
}

/* T322 + T320 grammar: on phone the floating launcher is DOM-removed; the
   existing overlay opens as a full-screen sheet (safe-area, 44px close). */
@media (max-width:820px) {
  #feedback-overlay[data-sheet-type="full"] {
    box-sizing: border-box;
    padding: 0 !important;
    align-items: stretch;
    justify-content: stretch;
  }
  #feedback-overlay[data-sheet-type="full"] > .feedback-dialog {
    box-sizing: border-box;
    width: 100vw !important;
    max-width: none !important;
    height: var(--cc-visual-viewport-height, 100dvh) !important;
    max-height: none !important;
    margin: 0 !important;
    padding-top: env(safe-area-inset-top, 0px);
    padding-right: env(safe-area-inset-right, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left: env(safe-area-inset-left, 0px);
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  #feedback-overlay[data-sheet-type="full"] > .feedback-dialog > .panel-header {
    flex: 0 0 auto;
  }
  #feedback-overlay[data-sheet-type="full"] > .feedback-dialog > .modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
  }
  #feedback-overlay[data-sheet-type="full"] #feedback-close,
  #feedback-overlay[data-sheet-type="full"] #feedback-cancel,
  #feedback-overlay[data-sheet-type="full"] #feedback-submit,
  #feedback-overlay[data-sheet-type="full"] #feedback-done {
    min-width: 44px;
    min-height: 44px;
    box-sizing: border-box;
  }
  #feedback-overlay[data-sheet-type="full"] .feedback-copy textarea {
    max-height: none;
    min-height: 10rem;
  }
}
