html[data-theme] body[data-editor-shell="canvas"] #dock #panel-assistant > summary {
  flex:0 0 auto;
  margin:0 20px 8px;
  font-size:20px;
  line-height:1.2;
}

html[data-theme] body[data-editor-shell="canvas"] #dock:has(#panel-assistant[open]) { overflow:hidden; }
/* Anchor the chat to the full-width dock, not the animating sidebar. */
html[data-theme] body[data-editor-shell="canvas"] #dock #panel-assistant[open] { position:relative; display:flex; flex-direction:column; height:100%; min-height:0; padding:20px 0 0; overflow:hidden; }

html[data-theme] body[data-editor-shell="canvas"] #dock #panel-assistant .panel-body {
  position:absolute;
  inset:64px 0 0;
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  gap:10px;
  min-height:0;
  overflow:hidden;
  padding:0 14px 12px;
}

html[data-theme] body[data-editor-shell="canvas"] .design-assistant__notice { padding:9px 11px; border:1px solid color-mix(in srgb,var(--accent) 48%,var(--line)); border-radius:10px; background:color-mix(in srgb,var(--primary) 9%,var(--surface-2)); color:var(--text); font-size:11.5px; line-height:1.45; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__conversation { display:flex; flex:1 1 auto; flex-direction:column; gap:10px; min-height:0; padding:4px 3px 12px 0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--edge) transparent; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__conversation::-webkit-scrollbar { width:5px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__conversation::-webkit-scrollbar-thumb { background:var(--edge); border-radius:6px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__message { display:grid; grid-template-columns:26px minmax(0,1fr); gap:7px; align-items:start; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__message--user { grid-template-columns:minmax(0,1fr); padding-left:32px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__message-avatar { display:grid; place-items:center; width:25px; height:25px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__message-avatar img { display:block; width:25px; height:25px; object-fit:contain; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__bubble { padding:9px 10px; border:1px solid var(--line); border-radius:4px 12px 12px; background:linear-gradient(145deg,var(--surface-3),var(--surface-2)); color:var(--text); font-size:12px; line-height:1.5; overflow-wrap:anywhere; white-space:pre-wrap; box-shadow:inset 0 1px color-mix(in srgb,#fff 5%,transparent); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__message--user .design-assistant__bubble { border-color:color-mix(in srgb,var(--accent) 48%,var(--line)); border-radius:12px 4px 12px 12px; background:color-mix(in srgb,var(--primary) 13%,var(--surface-3)); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__message.is-pending .design-assistant__bubble { color:var(--text-soft); font-style:italic; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__thinking-dots { display:inline-flex; width:1.2em; margin-left:2px; font-style:normal; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__thinking-dots span { opacity:.2; animation:design-assistant-thinking-dot 1.2s infinite; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__thinking-dots span:nth-child(2) { animation-delay:.2s; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__thinking-dots span:nth-child(3) { animation-delay:.4s; }
@keyframes design-assistant-thinking-dot { 0%,20% { opacity:.2; } 40%,100% { opacity:1; } }
@media(prefers-reduced-motion:reduce) {
  html[data-theme] body[data-editor-shell="canvas"] .design-assistant__thinking-dots span { opacity:1; animation:none; }
}

html[data-theme] body[data-editor-shell="canvas"] .design-assistant__actions { display:grid; gap:6px; margin-top:8px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__action,
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__generate { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; min-height:34px; padding:7px 9px; border:1px solid color-mix(in srgb,var(--accent) 55%,var(--line)); border-radius:9px; background:color-mix(in srgb,var(--primary) 10%,var(--surface-2)); color:var(--text); font:inherit; font-size:11.5px; font-weight:650; text-align:left; cursor:pointer; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__action:hover,
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__generate:hover { border-color:var(--accent); background:color-mix(in srgb,var(--primary) 18%,var(--surface-2)); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__action::after { content:'Apply'; color:var(--accent); font-size:9px; letter-spacing:.5px; text-transform:uppercase; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__action.is-applied { border-color:color-mix(in srgb,#5fcb91 48%,var(--line)); color:var(--text-soft); cursor:default; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__action.is-applied::after { content:'Applied'; color:#65ce95; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__generate { justify-content:center; background:linear-gradient(180deg,var(--primary-hover),var(--primary)); border-color:var(--primary-hover); color:#fff; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__generate .lucide { width:14px; height:14px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-card { display:grid; gap:8px; padding:8px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-card > img { display:block; width:100%; aspect-ratio:1; object-fit:contain; border:1px solid var(--line); border-radius:9px; background:#fff; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-card > p { margin:0 2px; color:var(--text-soft); font-size:11px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-actions { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-actions .design-assistant__action,
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-actions .design-assistant__generate { justify-content:center; margin:0; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__image-actions .design-assistant__action::after { content:none; }

html[data-theme] body[data-editor-shell="canvas"] .design-assistant__composer { position:relative; flex:0 0 auto; margin-top:0; padding:8px 0 0; background:var(--surface-2); z-index:3; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__composer-pill { display:grid; grid-template-columns:32px minmax(0,1fr) 32px; gap:5px; align-items:end; min-height:46px; padding:6px; border:1px solid var(--line); border-radius:23px; background:var(--surface-1); box-shadow:0 8px 22px #0002; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__composer-pill:focus-within { border-color:var(--accent); box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 22%,transparent),0 8px 22px #0002; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__composer textarea { width:100%; height:32px; min-height:32px; max-height:32px; padding:7px 7px 5px; overflow-y:auto; resize:none; border:0; outline:0; background:transparent; color:var(--text); font:inherit; font-size:12px; line-height:1.35; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-toggle,
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__send { display:grid; place-items:center; width:32px; height:32px; padding:0; border-radius:50%; cursor:pointer; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-toggle { border:1px solid var(--line); background:var(--surface-3); color:var(--text); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-toggle:hover,
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-toggle[aria-expanded="true"] { background:color-mix(in srgb,var(--primary) 15%,var(--surface-3)); border-color:color-mix(in srgb,var(--accent) 60%,var(--line)); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-toggle .lucide { width:17px; height:17px; transition:transform .16s ease; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-toggle[aria-expanded="true"] .lucide { transform:rotate(45deg); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__send { border:1px solid var(--primary-hover); background:linear-gradient(180deg,var(--primary-hover),var(--primary)); color:#fff; box-shadow:0 5px 14px color-mix(in srgb,var(--primary) 38%,transparent); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__send:disabled { opacity:.48; cursor:wait; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__send .lucide { width:16px; height:16px; stroke-width:2.2; }

html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu { position:absolute; right:0; bottom:calc(100% + 8px); left:0; display:grid; gap:3px; max-height:min(410px,var(--assistant-menu-max-height,60vh)); padding:8px; overflow-y:auto; overscroll-behavior:contain; border:1px solid var(--line); border-radius:15px; background:var(--surface-1); box-shadow:0 18px 48px #0008; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu[hidden] { display:none; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-heading,
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__quick > p { margin:3px 7px 5px; color:var(--text-soft); font-size:9.5px; font-weight:750; letter-spacing:.8px; text-transform:uppercase; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item { display:grid; grid-template-columns:24px minmax(0,1fr); gap:8px; align-items:center; width:100%; padding:7px 8px; border:0; border-radius:9px; background:transparent; color:var(--text); text-align:left; cursor:pointer; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item:hover { background:var(--surface-3); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item:disabled { opacity:.42; cursor:default; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item .lucide { width:17px; height:17px; color:var(--accent); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item span { display:grid; gap:1px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item strong { font-size:11.5px; font-weight:650; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__menu-item small { color:var(--text-soft); font-size:10px; }

html[data-theme] body[data-editor-shell="canvas"] .design-assistant__brief { margin:1px 7px 5px 39px; padding:8px 9px; border:1px solid var(--line); border-radius:9px; background:var(--surface-2); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__brief dl { display:grid; grid-template-columns:auto minmax(0,1fr); gap:4px 7px; margin:0; font-size:10.5px; line-height:1.35; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__brief dt { color:var(--text-soft); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__brief dd { margin:0; color:var(--text); overflow-wrap:anywhere; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__quick { display:grid; gap:2px; margin-top:3px; padding-top:5px; border-top:1px solid var(--line); }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__quick > div { display:grid; gap:1px; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__quick button { display:flex; align-items:center; width:100%; min-height:32px; padding:6px 8px 6px 39px; border:0; border-radius:9px; background:transparent; color:var(--text); font-size:11px; text-align:left; cursor:pointer; }
html[data-theme] body[data-editor-shell="canvas"] .design-assistant__quick button:hover { background:var(--surface-3); }

@media(max-width:900px) {
  html[data-theme] body[data-editor-shell="canvas"] #dock #panel-assistant .panel-body { padding-inline:12px; }
}
