/* Approved dialog shell, attached to the real selection and request UI. */
.app-frame:has(.canvas-stage .work-floats[data-work-panel] [data-canvas-dialog])
  .canvas-shell.claude-canvas-plain .canvas-stage > .canvas-toolbar {
  display: flex;
}
.canvas-shell .canvas-stage .work-floats[data-work-panel]:has([data-canvas-dialog]) {
  left: 50%; right: auto; transform: translateX(-50%);
  bottom: max(calc(94px + env(safe-area-inset-bottom, 0px)), calc(var(--canvas-dialog-keyboard-inset, 0px) + 8px));
}
.canvas-shell .canvas-stage .work-floats[data-work-panel] .canvas-dialog-wrap {
  width: min(600px, calc(100vw - 24px));
}
.canvas-shell .work-float-panel .canvas-dialog {
  position: relative; padding: 14px; gap: 0; box-sizing: border-box;
  background: var(--ref-glass); color: var(--ref-ink);
  backdrop-filter: blur(22px) saturate(1.3);
  border: 1px solid var(--ref-line-2); border-radius: var(--ref-r-3);
  box-shadow: var(--ref-shadow), 0 0 60px -20px var(--ref-glow);
  font: 14px/1.45 var(--ref-f-ui);
  max-height: min(620px, calc(var(--canvas-dialog-visible-height, 100dvh) - var(--canvas-dialog-headroom, 108px)));
  transform-origin: 50% 100%;
  animation: ref-dialog-in .5s var(--ref-spring) both;
}
@keyframes ref-dialog-in {
  from { opacity: 0; transform: translateY(16px) scale(.94); }
  to { opacity: 1; transform: none; }
}
.canvas-dialog .canvas-dialog-nav {
  position: absolute; right: 14px; top: 12px; z-index: 1;
  padding: 0; background: transparent; border: 0;
}
.canvas-dialog .canvas-dialog-nav .panel-tabs-row { display: none; }
.canvas-dialog .canvas-dialog-close {
  width: 30px; min-width: 30px; min-height: 30px; height: 30px; border-radius: var(--ref-r-2);
}
.canvas-dialog .canvas-dialog-context {
  display: flex; min-height: 41px; padding: 2px 42px 12px 4px;
  gap: 10px; order: 0;
}
.canvas-dialog .canvas-dialog-context-text { display: block; min-width: 0; }
.canvas-dialog .canvas-dialog-context h2 {
  position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}
.canvas-dialog .canvas-dialog-scope {
  margin: 0; gap: 10px; font-size: 17px;
  color: var(--ref-ink); line-height: 1.35;
}
.canvas-dialog .canvas-dialog-scope-name { font: 500 17px/1.25 var(--ref-f-hand); }
.canvas-dialog .canvas-dialog-scope-meta {
  padding: 0; border: 0; font: 500 10.5px var(--ref-f-mono);
  color: var(--ref-ink-3); letter-spacing: .09em;
}
.canvas-dialog-scope-previews { display: flex; flex: none; align-items: center; }
.canvas-dialog-scope-previews img {
  width: 26px; height: 26px; border-radius: 8px; object-fit: cover;
  border: 2px solid var(--ref-surface); margin-left: -8px;
}
.canvas-dialog-scope-previews img:first-child { margin-left: 0; }
.canvas-dialog .canvas-dialog-tools button {
  min-height: 30px; padding: 0 12px; border-radius: var(--ref-r-2);
  color: var(--ref-ink-2); border-color: var(--ref-line-2); font-size: 12px;
}
.canvas-dialog .canvas-dialog-activity {
  order: 2; background: var(--ref-surface-2); border-radius: var(--ref-r-2);
  padding: 16px 18px; margin: 0 0 10px; min-height: min(92px, 14dvh);
}
.canvas-dialog .canvas-dialog-empty { padding: 0; }
.canvas-dialog .canvas-dialog-record { padding: 0 0 8px; }
.canvas-dialog .canvas-dialog-record + .canvas-dialog-record { padding-top: 8px; }
.canvas-dialog .canvas-dialog-record-label {
  color: var(--ref-ink-3); font: 500 10px var(--ref-f-mono);
  letter-spacing: .08em; text-transform: uppercase;
}
.canvas-dialog .canvas-dialog-finding { background: transparent; border: 0; border-bottom: 1px solid var(--ref-line); border-radius: 0; }
.canvas-dialog .canvas-dialog-composer { display: contents; }
.canvas-dialog .canvas-dialog-attachments { order: 1; margin: 0 0 8px; }
.canvas-dialog .canvas-dialog-attachments :is(.canvas-dialog-attachment, .canvas-dialog-action) {
  min-height: 30px; padding-inline: 12px; border-radius: var(--ref-r-2); color: var(--ref-ink-2); font-size: 12px;
}
.canvas-dialog .canvas-dialog-attachments [data-chat-pick-file] { border: 1px dashed var(--ref-line-2); }
.canvas-dialog .canvas-dialog-input-frame {
  order: 3; display: grid; grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center; gap: 10px; flex: 0 0 auto; box-sizing: border-box;
  min-height: 48px; padding: 0 7px 0 17px; border-radius: var(--ref-r-2);
  border: 1px solid transparent; background: var(--ref-surface-2);
}
.canvas-dialog .canvas-dialog-input-frame:focus-within { border-color: var(--ref-line-2); }
.canvas-dialog .canvas-dialog-input-icon { color: var(--ref-ink-2); }
.canvas-dialog .canvas-dialog-input-frame textarea[data-chat-input] {
  padding: 4px 0; margin: 0; min-height: 34px; height: 34px; max-height: 96px;
  border: 0; border-radius: 0; color: var(--ref-ink); font-size: 16px; outline: none;
}
.canvas-dialog .canvas-dialog-composer-controls { display: contents; }
.canvas-dialog .canvas-dialog-status {
  grid-row: 2; grid-column: 2 / -1;
  color: var(--ref-ink-2); font-size: 12px; padding-bottom: 6px;
}
.canvas-dialog .canvas-dialog-action-primary {
  grid-column: 3; grid-row: 1; padding: 0; border-radius: var(--ref-r-2);
  width: 34px; min-width: 34px; height: 34px; min-height: 34px;
  background: var(--ref-accent); color: var(--ref-accent-ink); transition: transform .3s var(--ref-spring);
}
.canvas-dialog .canvas-dialog-action-primary:hover:not(:disabled) {
  transform: scale(1.12); opacity: 1; background: var(--ref-accent); color: var(--ref-accent-ink);
}
.canvas-dialog .canvas-dialog-action-primary:disabled { opacity: .42; }
.canvas-dialog .canvas-dialog-confirm {
  order: 4; padding: 0; margin-top: 8px;
}
.canvas-dialog .canvas-dialog-confirm [data-chat-confirm] {
  min-height: 40px; border: 0; border-radius: var(--ref-r-2);
  background: var(--ref-accent); color: var(--ref-accent-ink);
}
@media (pointer: coarse) {
  .canvas-dialog .canvas-dialog-close, .canvas-dialog .canvas-dialog-action-primary { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
}
@media (max-width: 560px) {
  .canvas-dialog .canvas-dialog-activity { padding: 12px; }
  .canvas-dialog .canvas-dialog-confirm [data-chat-confirm] { width: 100%; }
  .canvas-dialog .canvas-dialog-tools button { padding-inline: 7px; }
}
html[data-canvas-dialog-keyboard] .canvas-shell .canvas-stage .work-floats[data-work-panel]:has([data-canvas-dialog]) {
  bottom: calc(var(--canvas-dialog-keyboard-inset, 0px) + 8px);
}
@media (prefers-reduced-motion: reduce) {
  .canvas-shell .work-float-panel .canvas-dialog { animation: none; }
}
