/* Load AFTER html5-layout.css. Existing IDs and hidden states remain authoritative. */
body.chatgpt-layout {
  --chat-ink: #202123;
  --chat-muted: #6b6b6b;
  --chat-line: #e7e7e7;
  --chat-gold: #8b713f;
  position: fixed;
  inset: var(--chat-top, 0px) 0 auto;
  width: 100%;
  height: var(--chat-height, 100dvh);
  margin: 0;
  color: var(--chat-ink);
  background: #fff;
  font-family: system-ui, -apple-system, 'Segoe UI', 'Malgun Gothic', sans-serif;
  line-height: 1.65;
  overflow: hidden;
}
.chatgpt-layout [hidden] { display: none !important; }
.chatgpt-layout .chat-header {
  height: 60px;
  min-height: 60px;
  flex-wrap: nowrap;
  gap: 12px;
  padding: 8px 20px;
  justify-content: flex-start;
  z-index: 5;
}
.chatgpt-layout .brand {
  display: block;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.5px;
  white-space: nowrap;
}
.chatgpt-layout .html5-tagline,
.chatgpt-layout .html5-phone,
.chatgpt-layout .main-nav { display: none; }
.chatgpt-layout .app-menu {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--chat-ink);
  border-radius: 12px;
}
.chatgpt-layout .chat-help-open {
  margin-left: auto;
  min-width: 68px;
  min-height: 44px;
  padding: 8px 10px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--chat-muted);
  font-size: 13px;
  white-space: nowrap;
}
.chatgpt-layout .app-menu:hover,
.chatgpt-layout .chat-help-open:hover { background: #f3f3f3; }
.chatgpt-layout .chat-layout {
  display: block;
  flex: 1;
  width: 100%;
  max-width: 820px;
  min-height: 0;
  margin: 0 auto;
  padding: 0 24px max(16px, env(safe-area-inset-bottom));
}
.chatgpt-layout .conversation { height: 100%; min-height: 0; }
.chatgpt-layout .conversation-scroll {
  flex: 1;
  min-height: 0;
  padding: 24px 8px;
  overscroll-behavior: contain;
}
.chatgpt-layout #log { gap: 28px; min-height: 0; padding: 0 0 16px; }
.chatgpt-layout #log > .mock-message {
  position: static;
  max-width: 100%;
  width: 100%;
  padding: 0;
  background: transparent;
  border: 0;
  margin: 0;
}
.chatgpt-layout #log > .mock-message::before { content: none; }
.chatgpt-layout #log > .user-message {
  max-width: 85%;
  padding: 10px 18px;
  border: 0;
  border-radius: 24px !important;
  background: #f3f3f3;
  margin: 0 0 0 auto;
}
.chatgpt-layout #log > div > b {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.chatgpt-layout #log p { margin: 0; font-size: 16px; line-height: 1.85; }
.chatgpt-layout #log details { color: var(--chat-muted); }
.chatgpt-layout #login {
  padding: 16px;
  border: 1px solid var(--chat-line);
  border-radius: 18px;
  box-shadow: none;
}
.chatgpt-layout #login button {
  border: 0;
  border-radius: 12px;
  background: #242424;
  color: #fff;
}
.chatgpt-layout .composer {
  flex: 0 1 auto;
  max-height: 58%;
  min-height: 108px;
  overflow-y: auto;
  padding: 8px 10px;
  border: 1px solid var(--chat-line) !important;
  border-radius: 28px !important;
  background: #f7f7f7 !important;
  box-shadow: 0 2px 10px #00000006 !important;
}
.chatgpt-layout .composer:focus-within { outline: 0; box-shadow: 0 0 0 2px #8b713f30 !important; }
.chatgpt-layout .composer-shell { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 4px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.chatgpt-layout .composer-shell #message {
  grid-column: 1 / -1;
  grid-row: 1;
  width: 100%;
  min-height: 48px;
  max-height: 168px;
  padding: 10px 8px;
  resize: none;
  background: transparent;
  font-size: 16px;
  line-height: 1.6;
}
.chatgpt-layout .composer-leading { grid-column: 1; grid-row: 2; padding: 0; }
.chatgpt-layout .composer-actions { grid-column: 3; grid-row: 2; gap: 4px; padding: 0; }
.chatgpt-layout .composer-shell button { width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
.chatgpt-layout .composer-shell #send { background: #202123 !important; color: #fff; font-size: 26px; }
.chatgpt-layout .composer-shell #attach-plus,
.chatgpt-layout .composer-shell #speech-launch { color: var(--chat-ink); background: transparent; }
.chatgpt-layout .composer-shell #speech-launch[data-phase='recording'] { color: #fff; background: #a52c2c; }
.chatgpt-layout #speech-capture { grid-column: 1 / -1; grid-row: 1; }
.chatgpt-layout #pending-attachments { order: -2; display: flex; flex-wrap: wrap; gap: 8px; }
.chatgpt-layout #pending-attachments:empty { display: none; }
.chatgpt-layout #pending-attachments figure { width: 96px; margin: 4px; }
.chatgpt-layout #pending-attachments img { width: 96px; height: 72px; object-fit: cover; border-radius: 12px; }
.chatgpt-layout #pending-attachments button { min-width: 32px; min-height: 32px; }
.chatgpt-layout #attachment-menu { background: #fff; margin: 4px; }
.chatgpt-layout #status,
.chatgpt-layout #send-block-reason,
.chatgpt-layout #speech-status,
.chatgpt-layout .photo-analysis-controls > [role='status'] {
  display: block;
  max-width: 100%;
  margin: 4px 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #63512c;
  font-size: 12px;
  overflow-wrap: anywhere;
}
.chatgpt-layout #status { order: 7; }
.chatgpt-layout #send-block-reason { order: 8; }
.chatgpt-layout #status:empty,
.chatgpt-layout #speech-status:empty,
.chatgpt-layout .photo-analysis-controls > [role='status']:empty { display: none; }
.chatgpt-layout .speech-inline-help { padding: 0; }
.chatgpt-layout .composer .photo-analysis-controls { margin: 0; padding: 0; gap: 0; border: 0; background: transparent; }
.chatgpt-layout .desktop-sidebar,
.chatgpt-layout #app-drawer { background: #f8f8f8; color: var(--chat-ink); border-color: var(--chat-line); }
.chatgpt-layout .desktop-sidebar { width: 260px; padding: 20px 12px; }
.chatgpt-layout .desktop-sidebar > h2 { display: block; font-size: 17px; letter-spacing: -.5px; }
.chatgpt-layout .new-conversation { background: transparent; color: var(--chat-ink); border-color: transparent; }
.chatgpt-layout .service-topic,
.chatgpt-layout .desktop-sidebar h3,
.chatgpt-layout #app-drawer h3 { color: var(--chat-muted); }
.chatgpt-layout .html5-selected { background: #ebebeb; color: var(--chat-ink); border-radius: 12px; }
.chatgpt-layout .html5-admin { background: transparent; border-color: var(--chat-line); }
.chatgpt-layout .dispatch-btn { background: #fff; color: var(--chat-ink); border: 1px solid var(--chat-line); }
.chatgpt-layout .html5-recipient { overflow-wrap: anywhere; }
.chatgpt-layout #chat-help-dialog,
.chatgpt-layout .feature-consent-dialog {
  width: min(560px, calc(100vw - 24px));
  max-height: min(85dvh, calc(var(--chat-height, 100dvh) - 24px));
  padding: 20px;
  border: 1px solid var(--chat-line);
  border-radius: 22px;
  color: var(--chat-ink);
  background: #fff;
  overflow-y: auto;
  box-shadow: 0 20px 60px #0002;
}
.chatgpt-layout dialog::backdrop { background: #0006; }
.chatgpt-layout .chat-help-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.chatgpt-layout .chat-help-head h2 { margin: 0; font-size: 18px; }
.chatgpt-layout .chat-help-close { width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f4f4f4; font-size: 24px; }
.chatgpt-layout .chat-help-body { font-size: 13px; }
.chatgpt-layout .chat-help-body .consultation-panel { display: block; position: static; width: 100%; margin: 16px 0; }
.chatgpt-layout .chat-help-body #composer-help,
.chatgpt-layout .chat-help-body .mode-strip { display: block; padding: 8px 0; font-size: 12px; white-space: normal; }
.chatgpt-layout .feature-consent-label { min-height: 44px; }
.chatgpt-layout :is(button, a, summary, input):focus-visible { outline: 2px solid var(--chat-gold); outline-offset: 3px; }
.consultation-next-step { margin: 20px 0; padding: 18px; border: 1px solid #e7e7e7; border-radius: 20px; background: #fafafa; }
.consultation-next-step h2 { font-size: 17px; margin: 0 0 10px; }
.consultation-next-step p { font-size: 12px; color: #666; }
.consultation-next-step dl > div { grid-template-columns: 90px 1fr; padding: 6px 0; font-size: 14px; }
.consultation-next-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.consultation-next-actions button { border: 1px solid #ddd; border-radius: 12px; min-height: 44px; background: white; color: #222; }
.consultation-next-actions button:first-child { border-color: #222; background: #222; color: white; }
@media (min-width: 1000px) {
  body.chatgpt-layout { padding-left: 260px; }
  body.chatgpt-layout.chat-sidebar-collapsed { padding-left: 0; }
  .chatgpt-layout.chat-sidebar-collapsed .desktop-sidebar { display: none; }
}
@media (max-width: 999px) {
  body.chatgpt-layout { padding-left: 0; }
  .chatgpt-layout .desktop-sidebar { display: none; }
}
@media (max-width: 760px) {
  .chatgpt-layout .chat-header { height: 56px; min-height: 56px; padding: 4px 10px; gap: 6px; }
  .chatgpt-layout .brand { font-size: 16px; }
  .chatgpt-layout .chat-layout { padding: 0 10px max(8px, env(safe-area-inset-bottom)); }
  .chatgpt-layout .conversation-scroll { padding: 16px 8px; }
  .chatgpt-layout #log { gap: 24px; }
  .chatgpt-layout #log p { font-size: 15px; }
  .chatgpt-layout .composer { border-radius: 26px !important; padding: 6px; }
  .chatgpt-layout #chat-help-dialog { padding: 16px; }
}
.staff-handoff{width:min(680px,calc(100vw - 24px));max-height:90dvh;overflow:auto;border:1px solid #ddd;border-radius:18px;padding:24px}
.staff-handoff fieldset{border:0;padding:0;margin:0}.staff-handoff label{display:block;margin:14px 0}
.staff-handoff input:not([type=checkbox]),.staff-handoff textarea{box-sizing:border-box;width:100%;font:inherit;padding:10px;border:1px solid #bbb;border-radius:10px}
.staff-handoff input[type=checkbox]{margin-right:8px}.staff-handoff button{margin:8px 8px 0 0;padding:10px 16px}
.staff-handoff p{font-size:14px;line-height:1.6;overflow-wrap:anywhere}.intake-photo-previews{display:flex;gap:8px;flex-wrap:wrap}.intake-photo-previews img{width:110px;height:90px;object-fit:cover}
.generated-design{margin:20px 0}.generated-design img{display:block;width:100%;max-width:620px;height:auto;border-radius:16px}.generated-design p{font-size:14px;line-height:1.6}.generated-design a,.generated-design button{display:inline-block;padding:10px 16px;margin-top:8px;border-radius:12px;border:1px solid #ccc;background:white;color:#222}
.generated-design .design-source{margin:0 0 16px;padding:12px;border:1px solid #e5e5e5;border-radius:16px;background:#fafafa}.generated-design .design-source img{width:auto;max-width:100%;max-height:190px;object-fit:contain}.generated-design .design-source figcaption{margin-top:8px;font-size:13px;color:#555}.generated-design h3{font-size:16px;margin:16px 0 10px}.generated-design a+.generated-design button,.generated-design a+button{margin-left:8px}.local-message-attachments button{font-size:13px}
@media(min-width:900px){.generated-design:not([hidden]){display:grid;grid-template-columns:minmax(150px,1fr) minmax(0,2fr);gap:14px;align-items:start}.generated-design>p{grid-column:1/-1;grid-row:1;margin:0}.generated-design>.design-source{grid-column:1;grid-row:2}.generated-design>.design-result{grid-column:2;grid-row:2}.generated-design h3{margin-top:0}.generated-design>.design-result img{max-height:370px;object-fit:contain}.generated-design>button{grid-column:1/-1}}

@media(min-width:900px){.generated-design:has(>.design-source[hidden])>.design-result{grid-column:1/-1}}
