/* Editor controls share one upload treatment and a persistent, distinct save bar. */
.studio-editor .media-library { display: grid; grid-template-columns: minmax(0,1fr); gap: 24px; }
.studio-editor .media-slot { padding: 0; border: 0; background: none; display: grid; gap: 12px; }
.studio-upload-zone { width: 100%; min-height: 132px; padding: 20px 16px; display: grid; justify-items: center; gap: 5px; border: 1px dashed #aebbad; border-radius: 14px; background: #f8faf7; color: #26382c; cursor: pointer; text-align: center; transition: background .15s, border-color .15s; }
.studio-upload-zone > ion-icon { font-size: 25px; margin-bottom: 5px; pointer-events: none; }
.studio-upload-zone > * { pointer-events: none; }
.studio-upload-zone strong { font-size: 14px; font-weight: 600; }
.studio-upload-zone span { color: #61695f; font-size: 12px; }
.studio-upload-zone small { color: #61695f; font-size: 11px; margin-top: 3px; }
.studio-upload-zone:hover,.studio-upload-zone.drag { border-color: #385b3b; background: #eaf1e6; }
.studio-upload-zone:focus-visible { outline: 3px solid #385b3b; outline-offset: 3px; }
.studio-upload-zone:disabled { opacity: .6; cursor: wait; }
.studio-editor .gallery-grid { grid-template-columns: repeat(auto-fill,minmax(90px,1fr)); gap: 10px; }
.studio-editor .gallery-thumb { aspect-ratio: 4/3; min-width: 0; border-radius: 10px; }
.studio-editor .gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }
.studio-editor .gallery-thumb button { width: 32px; height: 32px; min-height: 32px; min-width: 32px; opacity: 1; background: #fff; color: #9a2929; }
.studio-media-settings { border-top: 1px solid #e2e6de; padding-top: 20px; margin-top: 24px; }
.studio-media-settings .segmented { width: 100%; display: flex; flex-wrap: wrap; gap: 4px; }
.studio-media-settings .segmented button { flex: 1; min-height: 44px; padding: 8px; font-size: 11px; gap: 6px; }
.studio-media-settings .field[hidden] { display: none; }
.studio-media-feedback { font-size: 12px; color: #3c573b; margin-top: 14px; }
.studio-media-feedback:empty,.studio-media-feedback[hidden] { display: none; }
.studio-media-feedback.is-error { color: #9a2929; background: #fff2ef; padding: 10px; border-radius: 8px; }
.studio-action-bar { background: #fff; border: 1px solid #b6c4b0; border-radius: 16px; box-shadow: 0 6px 26px #2333251a; padding: 14px 18px; gap: 16px; min-height: 76px; }
.studio-action-bar.is-dirty { background: #f5f8f1; border-color: #597353; box-shadow: 0 0 0 1px #597353,0 6px 26px #23332518; }
.studio-action-bar .studio-save-state { font-size: 13px; line-height: 1.4; color: #445042; font-weight: 500; margin-left: auto; }
.studio-action-bar .studio-save-state.is-dirty { color: #253c27; font-weight: 600; }
.studio-save-state::before { width: 8px; height: 8px; flex: none; }
.studio-save-state.is-dirty::before { background: #a76620; box-shadow: 0 0 0 4px #a7662015; }
.studio-save-actions { display: flex; align-items: center; gap: 10px; flex: none; }
.studio-save-actions .btn { min-height: 44px; font-size: 13px; padding: 10px 18px; }
.studio-save-actions .btn-primary { min-width: 116px; }
.studio-save-actions .btn-primary:disabled { opacity: 1; color: #64715f; background: #e4eade; border-color: #e4eade; }
.studio-action-bar .checklist-details > summary { color: #4b5747; }
body:has(.design-layout) #toasts,body:has(.ai-chat-panel) #toasts { top: 78px; bottom: auto; }
@media (min-width:861px) {
  .studio-action-bar { flex-wrap: wrap; }
  .studio-action-bar .checklist-dock { flex-shrink: 0; }
}
@media (max-width:1100px) and (min-width:861px) {
  .studio-action-bar .checklist-details > summary > span:not(.checklist-pulse) { display: none; }
  .studio-save-actions .btn { padding: 10px 12px; }
}
@media (max-width:860px) {
  .design-layout { padding-bottom: 110px; }
  .studio-action-bar { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; padding: 12px 14px; bottom: calc(82px + env(safe-area-inset-bottom)); }
  .studio-action-bar .checklist-dock { position: static; margin: 0; width: auto; max-width: none; grid-column: auto; }
  .studio-action-bar .checklist-details { box-shadow: none; border: 0; background: none; }
  .studio-action-bar .checklist-details > summary { padding: 0; font-size: 11px; }
  .studio-action-bar .checklist-details > summary > span:not(.checklist-pulse) { display: none; }
  .studio-action-bar .checklist-popover { position: absolute; left: 0; right: 0; bottom: calc(100% + 10px); padding: 16px; border-radius: 16px; border: 1px solid #c8d1c3; background: #fff; box-shadow: var(--shadow-lg); }
  .studio-action-bar .studio-save-state { font-size: 12px; }
  .studio-save-actions { grid-column: 1/-1; width: 100%; }
  .studio-save-actions .btn { flex: 1; font-size: 12px; padding: 10px; }
}

/* Conversation first: one context header, a transcript and one composer. */
.ai-chat-widget { right: 24px; bottom: 100px; z-index: 280; }
.ai-chat-launcher { min-width: 48px; height: 48px; padding: 0 14px; background: #fff; border: 1px solid #bcc9b5; color: #31482f; font-weight: 600; box-shadow: 0 4px 18px #263d271a; }
.ai-chat-launcher[hidden] { display: none; }
.ai-chat-launcher-icon { background: transparent; }
.ai-chat-panel { display: grid; grid-template-rows: auto minmax(0,1fr) auto; width: min(440px,calc(100vw - 40px)); height: min(650px,calc(100dvh - 124px)); background: #fff; color: #242a26; border: 1px solid #d8dfd4; border-radius: 20px; overflow: hidden; box-shadow: 0 16px 64px #1c302633,0 2px 8px #1c30260d; }
.ai-chat-head { padding: 16px; gap: 10px; border-bottom: 1px solid #e7ebe3; background: #fff; }
.ai-chat-head .grow { min-width: 0; }
.ai-chat-head strong { display: block; font-size: 14px; font-weight: 600; }
.ai-chat-head .footnote { margin-top: 3px; font-size: 11px; color: #687064; }
.ai-chat-head .btn { flex: none; width: 36px; height: 36px; min-height: 36px; min-width: 36px; border: 0; box-shadow: none; }
.ai-chat-mark { width: 36px; height: 36px; border-radius: 11px; color: #355031; background: #edf2e8; box-shadow: none; }
.ai-chat-messages { gap: 22px; padding: 24px 18px; overscroll-behavior: contain; background: #fff; }
.ai-chat-messages:focus-visible { outline: 2px solid #476343; outline-offset: -3px; }
.ai-message { flex: none; gap: 9px; }
.ai-message-avatar { width: 26px; height: 26px; background: #edf2e8; color: #3c5438; font-size: 14px; }
.ai-message-body { max-width: 100%; gap: 10px; }
.ai-message-text { font-size: 13px; line-height: 1.7; color: #29332a; background: transparent; border: 0; border-radius: 0; padding: 2px 0; }
.ai-message.user { max-width: 88%; }
.ai-message.user .ai-message-text { background: #eef2ea; color: #283827; border-radius: 16px 16px 4px 16px; padding: 11px 14px; }
.ai-message-actions { gap: 6px; }
.ai-message-actions .btn { font-weight: 500; font-size: 11px; min-height: 34px; background: #fff; border: 1px solid #dce3d7; box-shadow: none; padding: 6px 10px; }
.ai-message-actions .btn-icon { width: 34px; padding: 6px; }
.ai-local-notice { flex-basis: 100%; font-size: 10px; color: #687064; }
.ai-chat-empty { width: 100%; flex: 1; justify-content: center; align-content: center; border: 0; gap: 18px; padding: 16px 8px; }
.ai-chat-empty-icon { width: 52px; height: 52px; background: #eef2e8; color: #46613b; border-radius: 16px; }
.ai-chat-empty > strong { font-size: 20px; font-weight: 500; letter-spacing: -.5px; }
.ai-chat-starters { display: grid; gap: 8px; width: 100%; min-width: min(265px,100%); }
.ai-chat-starter { display: flex; align-items: center; justify-content: space-between; gap: 28px; width: 100%; min-height: 44px; padding: 12px 14px; background: #fff; color: #4a5645; border: 1px solid #e0e6da; border-radius: 11px; text-align: left; font-size: 12px; cursor: pointer; }
.ai-chat-starter:hover { background: #f6f8f3; border-color: #a9b7a1; }
.ai-chat-composer { margin: 0 14px 14px; padding: 10px 12px; border: 1px solid #cbd7c4; border-radius: 14px; background: #fff; gap: 6px; }
.ai-chat-composer:focus-within { border-color: #56734a; box-shadow: 0 0 0 3px #56734a10; }
.ai-chat-input { min-height: 64px; max-height: 140px; padding: 4px 0; font-size: 14px; line-height: 1.55; resize: none; border: 0; border-radius: 0; background: transparent; color: #28332a; }
.ai-chat-input:focus { border: 0; box-shadow: none; outline: none; }
.ai-chat-input::placeholder { color: #747b70; }
.ai-chat-compose-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.ai-chat-purpose { min-width: 0; max-width: calc(100% - 50px); }
.ai-chat-purpose select { max-width: 100%; min-height: 36px; border: 0; background: #f4f6f0; color: #505f49; border-radius: 8px; padding: 7px 24px 7px 10px; font: inherit; font-size: 11px; cursor: pointer; }
.ai-chat-send { width: 36px; height: 36px; min-width: 36px; min-height: 36px; border-radius: 10px; }
.ai-typing { display: flex; align-items: center; gap: 4px; min-height: 26px; }
.ai-typing > span { width: 4px; height: 4px; border-radius: 50%; background: #68805e; animation: aiPulse 1.4s ease-in-out infinite; }
.ai-typing > span:nth-child(2) { animation-delay: .15s; }
.ai-typing > span:nth-child(3) { animation-delay: .3s; }
.ai-typing small { font-size: 11px; color: #6b7367; margin-left: 6px; }
.ai-chat-error { display: grid; justify-items: start; gap: 10px; padding: 12px; border: 1px solid #eddcd3; border-radius: 12px; font-size: 12px; color: #864d36; background: #fff9f5; }
.ai-chat-widget :focus-visible { outline: 2px solid #3f6039; outline-offset: 3px; }
.ai-chat-widget .ai-chat-input:focus-visible { outline: 0; }
@keyframes aiPulse { 0%,80%,100% { opacity: .35; } 40% { opacity: 1; } }
@media (max-width:860px) {
  .ai-chat-widget { right: 16px; bottom: calc(210px + env(safe-area-inset-bottom)); }
  .ai-chat-widget.open { left: 8px; right: 8px; bottom: calc(82px + env(safe-area-inset-bottom)); }
  .ai-chat-panel { width: 100%; height: min(650px,calc(100dvh - 166px - env(safe-area-inset-bottom))); }
  .ai-chat-launcher > span:last-child { display: none; }
  .ai-chat-launcher { min-width: 48px; padding: 0 8px; }
  .ai-chat-head { padding: 12px; }
  .ai-chat-messages { padding: 18px 14px; }
  .ai-chat-empty { padding: 0; gap: 12px; }
  .ai-chat-empty > strong { font-size: 17px; }
}
@media (max-height:650px) { .ai-chat-empty-icon { display: none; } .ai-chat-empty { align-content: start; } }
@media (prefers-reduced-motion:reduce) { .ai-typing > span { animation: none; } }