.ai-panel { margin-top: 26px; }
.bot-binding { display: grid; gap: 14px; margin: 16px 0; }
.bot-binding label { display: grid; gap: 8px; }
.bot-binding select { width: 100%; box-sizing: border-box; font-size: 16px; }
.bot-binding .reply-confirmation { display: flex; gap: 10px; align-items: flex-start; }
.inbox-reply-panel { border-top: 1px solid var(--line); padding-top: 20px; display: grid; gap: 14px; min-width: 0; }
.inbox-reply-panel label { display: grid; gap: 8px; }
.inbox-reply-panel textarea { width: 100%; box-sizing: border-box; font-size: 16px; }
.inbox-reply-panel .reply-confirmation { display: flex; align-items: flex-start; line-height: 1.6; }
.reply-confirmation input { width: 20px; height: 20px; flex: 0 0 20px; margin-top: 3px; }
.inbox-message.inbox-outgoing { background: #eef5dc; }
#reply-feedback { overflow-wrap: anywhere; }
.flow-navigation { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.flow-navigation a { padding: 12px 16px; border-radius: 8px; border: 1px solid var(--line, #dfe5e1); text-decoration: none; color: inherit; }
.flow-navigation a[aria-current] { background: #e8f5bf; font-weight: 700; }
.flow-editor, .flow-nodes { display: grid; gap: 20px; min-width: 0; }
.flow-visual-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; min-width: 0; }
.flow-graph-panel, .flow-inspector { min-width: 0; }
.flow-canvas-viewport { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: radial-gradient(#bdcaba 1px, transparent 1px) 0 0 / 20px 20px #f7f9f4; }
#flow-canvas { display: block; width: 100%; height: 580px; touch-action: none; }
.flow-canvas-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.flow-canvas-node { cursor: grab; }
.flow-canvas-node rect { fill: white; stroke: #c9d6c3; stroke-width: 2; }
.flow-canvas-node.selected rect, .flow-canvas-node:focus rect { stroke: #527938; stroke-width: 4; }
.flow-canvas-node.planned rect { fill: #fffbf1; stroke-dasharray: 5 3; }
.flow-canvas-node text { fill: #4c5d49; font-size: 12px; pointer-events: none; }
.flow-canvas-node .flow-canvas-title { font-size: 15px; font-weight: 700; }
.flow-canvas-node circle { fill: #78a157; stroke: white; stroke-width: 2; cursor: crosshair; }
.flow-canvas-node circle.connecting, .flow-canvas-node [data-canvas-port]:focus circle { fill: #172725; stroke: #b9df64; stroke-width: 4; }
.flow-wire { fill: none; stroke: #789868; stroke-width: 2; }
#flow-arrow path { fill: #789868; }
.flow-wire-label { fill: #46623a; font-size: 11px; }
.flow-inspector .panel { padding: 18px; }
@media (max-width: 1200px) { .flow-visual-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) { #flow-canvas { height: 420px; } .flow-editor.panel { padding: 16px; } #whatsapp-flows .flow-add { display: grid; grid-template-columns: minmax(0, 1fr); } #whatsapp-flows input, #whatsapp-flows select, #whatsapp-flows textarea { font-size: 16px; } }
.flow-node { display: grid; gap: 14px; min-width: 0; }
.flow-node-head, .flow-add, .flow-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.flow-node-head { justify-content: space-between; }
.flow-node-head h3, .flow-node-head h2 { margin: 0; overflow-wrap: anywhere; }
.flow-node-head small { font-size: 13px; font-weight: 400; }
.flow-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#whatsapp-flows label { display: grid; gap: 6px; min-width: 0; }
#whatsapp-flows input, #whatsapp-flows select, #whatsapp-flows textarea { width: 100%; min-width: 0; box-sizing: border-box; }
.flow-add label { flex: 1; }
.whatsapp-qr-image { display: block; width: 260px; max-width: 100%; height: auto; border: 1px solid var(--line); border-radius: 12px; background: white; padding: 12px; }
.whatsapp-qr-pairing { padding: 20px 0; }
#whatsapp-qr-controls { margin-top: 24px; min-width: 0; }
#whatsapp-qr-form { display: grid; gap: 16px; margin-top: 20px; }
#whatsapp-qr-form input { font-size: 16px; }
@media (max-width: 600px) {
  .whatsapp-panel .provider-panel-heading { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; }
  .whatsapp-panel .provider-panel-heading > .badge { grid-column: 2; justify-self: start; }
}
.flow-simulator { border-top: 1px solid var(--line, #dfe5e1); padding-top: 18px; }
.flow-simulator summary { cursor: pointer; font-weight: 700; padding: 10px 0; }
.flow-simulator button { margin-top: 12px; }
.flow-transcript { padding-left: 24px; }
.flow-transcript p { white-space: pre-wrap; overflow-wrap: anywhere; }
#flow-result:empty { display: none; }
@media (max-width: 768px) {
  .flow-choice { grid-template-columns: 1fr; }
  #whatsapp-flows input, #whatsapp-flows select, #whatsapp-flows textarea { font-size: 16px; }
  .flow-actions button { flex: 1; min-height: 44px; }
}
.provider-panel-heading { display: flex; align-items: flex-start; gap: 18px; margin-bottom: 20px; }
.provider-panel-heading > div { flex: 1; }
.provider-panel-heading h3 { margin-bottom: 7px; }
.provider-panel-heading p { margin: 0; font-size: 12px; }
.ai-panel label, .account-select { display: flex; flex-direction: column; gap: 9px; font-size: 12px; color: #63725e; margin: 20px 0; }
.ai-panel .card-actions { align-items: center; gap: 10px; }
.ai-panel .card-actions .primary { background: var(--green); }
.ai-panel .asset-link { margin-left: auto; }
.record-card label { display: flex; flex-direction: column; gap: 9px; margin-top: 20px; font-size: 12px; color: #63725e; }
.record-card .job-error { background: #fcf0e9; border-radius: 7px; padding: 12px; color: #9a6553; }
.checkbox-label { flex-direction: row; align-items: flex-start; line-height: 1.6; }
.checkbox-label input { margin-top: 3px; flex-shrink: 0; }
.automation-history { margin-top: 30px; }
.table-scroll { overflow-x: auto; }
.automation-history table { width: 100%; border-collapse: collapse; text-align: left; }
.automation-history th { font-size: 10px; letter-spacing: 1px; font-weight: 600; color: #7b8d72; padding: 13px 10px; border-bottom: 1px solid var(--line); }
.automation-history td { font-size: 12px; padding: 16px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.automation-history td strong, .automation-history td small { display: block; }
.automation-history td p { margin: 9px 0 0; font-size: 11px; max-width: 340px; }
.automation-history td button { font-size: 10px; padding: 7px 9px; margin-bottom: 5px; }
.heading-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.storage-panel { display: flex; gap: 30px; align-items: center; padding: 21px 24px; background: white; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 24px; font-size: 12px; }
.storage-panel small { display: block; margin-top: 5px; }
.storage-panel meter { flex: 1; height: 16px; min-width: 70px; }
.media-preview { height: 180px; margin: -23px -23px 21px; background: #e9eee3; overflow: hidden; }
.media-preview img, .media-preview video { width: 100%; height: 100%; object-fit: contain; }
.media-placeholder, .audio-preview { display: grid; place-items: center; height: 100%; color: #6c8656; }
.audio-preview { padding: 20px; }
.audio-preview span { font-size: 35px; }
.audio-preview audio { width: 100%; max-height: 45px; }
.asset-card .card-top { margin-bottom: 14px; }
.asset-card .card-actions { align-items: center; gap: 8px; }
.upload-picker { padding: 25px; border: 1px dashed #b5c5a5; border-radius: 10px; background: #f4f7ef; }
.upload-picker input { margin-top: 10px; font-size: 11px; }
.upload-progress progress { width: 100%; accent-color: #799c51; }
.upload-progress span { display: block; margin-top: 10px; font-size: 12px; color: #748565; }
@media (max-width: 760px) { .storage-panel { flex-direction: column; align-items: stretch; gap: 14px; } }
@media (max-width: 760px) { .provider-panel-heading { flex-wrap: wrap; } .ai-panel .asset-link { margin-left: 0; } }
[data-pinterest-fields][hidden], [data-youtube-fields][hidden] { display: none; }

#record-form [hidden] { display: none !important; }

.main-nav { min-height: 0; overflow-y: auto; margin-bottom: 12px; scrollbar-width: thin; scrollbar-color: #50645a transparent; }
.nav-group { margin-bottom: 8px; }
.nav-group .nav-label { margin: 0; text-transform: none; }
.view-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); margin: 0 0 22px; padding-bottom: 10px; overflow-x: auto; }
.view-tabs a { white-space: nowrap; font-size: 13px; padding: 11px 18px; }
.view-tabs a:hover:not(.selected), .status-filters a:hover:not(.selected) { background: #eef4e7; color: #213023; }
.record-card .card-top .eyebrow { margin-bottom: 0; }
.dialog-heading > div { min-width: 0; overflow-wrap: anywhere; }
.dialog-heading > button { flex-shrink: 0; }
.status-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.status-filters a { background: white; border: 1px solid var(--line); padding: 8px 12px; font-size: 11px; gap: 8px; }
.status-filters a > span { width: auto; min-width: 18px; font-size: 10px; border-radius: 4px; padding: 2px 4px; background: #edf0e9; }
.status-filters a.selected > span { background: #ffffff80; }
.button-link { display: inline-flex; align-items: center; justify-content: center; padding: 11px 17px; border: 1px solid var(--line); background: white; border-radius: 9px; font-size: 12px; font-weight: 600; text-decoration: none; }
.button-link:hover { background: #eef4e7; }
.workspace-stats a { background: white; padding: 20px 22px; border: 1px solid var(--line); border-radius: 10px; display: flex; flex-direction: column; gap: 12px; text-decoration: none; }
.workspace-stats a:hover { border-color: #99b879; }
.workspace-stats a > span { font-size: 11px; color: #7d877f; }
.attention-panel { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 32px; }
.attention-panel h2 { margin-bottom: 8px; }
.attention-panel p { margin: 0; font-size: 12px; }
.attention-panel .button-link { flex-shrink: 0; }
.recent-publications { margin-top: 28px; }
.recent-publications a, .section-title a { font-size: 12px; color: #587b3d; }
.recent-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; border-top: 1px solid var(--line); }
.recent-row strong { display: block; font-size: 13px; }
.recent-row small { display: block; margin-top: 6px; }
.recent-row > div { min-width: 0; overflow-wrap: anywhere; }
.recent-row button { flex-shrink: 0; font-size: 11px; }
.content-thumb { height: 160px; margin: -23px -23px 20px; background: #edf0e9; overflow: hidden; }
.content-thumb img { width: 100%; height: 100%; object-fit: contain; }
.badge.published { background: #e8f5df; color: #54833a; }
.badge.publishing, .badge.generating { background: #e5ecfc; color: #5871a0; }
.badge.attention, .badge.failed, .badge.generation_uncertain { background: #fcf0e9; color: #995d48; }
.toolbar-controls { display: flex; align-items: center; gap: 14px; }
.compact-filter { display: flex; align-items: center; gap: 8px; font-size: 11px; }
.compact-filter select { width: auto; font-size: 11px; padding: 9px; }
.focus-strip, .context-strip { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px; padding: 16px 18px; margin-bottom: 22px; border: 1px solid var(--line); border-radius: 9px; background: #edf2e6; font-size: 12px; line-height: 1.6; }
.focus-strip a, .context-strip a { color: #587b3d; font-size: 12px; }
.timeline-item time small { display: block; margin-top: 7px; font-size: 10px; }
.preview-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.post-preview-media { display: grid; gap: 12px; margin-bottom: 20px; }
.post-preview-media img, .post-preview-media video { width: 100%; max-height: 360px; object-fit: contain; border-radius: 8px; background: #f4f6f1; }
.post-preview-media audio { width: 100%; }
.post-copy { white-space: pre-wrap; overflow-wrap: anywhere; }
.post-copy h3 { font-size: 14px; }
.post-copy p { white-space: pre-wrap; color: #35433b; font-size: 13px; }
details { margin: 16px 0; font-size: 12px; line-height: 1.7; }
summary { cursor: pointer; color: #587b3d; }
.routine-format-options { font-size: 14px; }
.routine-format-options > summary { padding: 12px 0; font-weight: 600; }
.routine-format-options[open] > summary { margin-bottom: 8px; }
#editor:has(#record-form[data-kind="automations"]) { width: min(1260px, calc(100vw - 32px)); max-height: calc(100dvh - 24px); padding: 20px; overflow-y: auto; }
#record-form[data-kind="automations"] { display: flex; flex-direction: column; gap: 14px; }
#record-form[data-kind="automations"] .dialog-heading { margin: 0; align-items: center; }
#record-form[data-kind="automations"] .dialog-heading h2 { font-size: 22px; margin: 0; }
#record-form[data-kind="automations"] .eyebrow { margin-bottom: 4px; }
.routine-layout { display: grid; grid-template-columns: 1fr 1.12fr 1fr; gap: 14px; align-items: start; }
.routine-panel { min-width: 0; border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fafcf8; }
.routine-panel h3 { font-size: 15px; margin: 0 0 12px; }
.routine-panel-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.routine-panel-fields > fieldset, .routine-wide { grid-column: 1 / -1; }
#record-form[data-kind="automations"] label { min-width: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; font-size: 12px; line-height: 1.4; }
#record-form[data-kind="automations"] input:not([type="checkbox"]), #record-form[data-kind="automations"] select, #record-form[data-kind="automations"] textarea { width: 100%; min-width: 0; margin: 0; padding: 8px 10px; min-height: 38px; font-size: 13px; border-radius: 7px; }
#record-form[data-kind="automations"] textarea { resize: vertical; line-height: 1.5; }
#record-form[data-kind="automations"] [name="description"] { min-height: 178px; max-height: 260px; }
#record-form[data-kind="automations"] label:has(> input[type="checkbox"]) { flex-direction: row; align-items: flex-start; gap: 7px; }
#record-form[data-kind="automations"] input[type="checkbox"] { flex: 0 0 16px; width: 16px; height: 16px; min-height: 0; margin: 1px 0 0; padding: 0; }
#record-form[data-kind="automations"] fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 10px; min-width: 0; margin: 0; background: white; }
#record-form[data-kind="automations"] fieldset legend { font-size: 12px; padding: 0 4px; }
#record-form[data-kind="automations"] [data-daily-times] { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
#record-form[data-kind="automations"] [data-daily-times][hidden] { display: none; }
#record-form[data-kind="automations"] [data-daily-times] legend, #record-form[data-kind="automations"] [data-daily-times] .daily-time-list, #record-form[data-kind="automations"] [data-daily-times] > button { grid-column: 1 / -1; }
#record-form[data-kind="automations"] .daily-time-list { display: grid; gap: 8px; }
#record-form[data-kind="automations"] .daily-time-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; }
#record-form[data-kind="automations"] .daily-time-row button { min-height: 38px; padding: 8px 12px; }
#record-form[data-kind="automations"] fieldset > p, #record-form[data-kind="automations"] fieldset > button, #record-form[data-kind="automations"] .network-checks { grid-column: 1 / -1; }
#record-form[data-kind="automations"] .network-checks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
#record-form[data-kind="automations"] [data-destinations]:not(:has([data-destination]:not([hidden]))) { display: none; }
#record-form[data-kind="automations"] p { margin: 0; font-size: 12px; line-height: 1.45; }
#record-form[data-kind="automations"] .notice { padding: 9px; }
.routine-optional, .routine-help { border-top: 1px solid var(--line); padding-top: 8px; font-size: 12px; }
.routine-optional > summary, .routine-help > summary { font-weight: 600; cursor: pointer; }
.routine-optional[open] > summary, .routine-help[open] > summary { margin-bottom: 8px; }
#record-form[data-kind="automations"] .form-footer { position: sticky; bottom: -20px; margin: 0; border-top: 1px solid var(--line); padding: 12px 0 0; background: white; display: flex; align-items: center; gap: 8px; }
.routine-summary { flex: 1; min-width: 200px; color: #52614e; }
@media (min-width: 1024px) and (max-height: 800px) { .routine-panel { padding: 10px; } .routine-panel-fields { gap: 8px; } #record-form[data-kind="automations"] [name="description"] { min-height: 145px; } }
@media (max-width: 1023px) { .routine-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); } .routine-panel:last-child { grid-column: 1 / -1; } .routine-panel:last-child .routine-panel-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { #editor:has(#record-form[data-kind="automations"]) { width: calc(100vw - 16px); padding: 12px; } .routine-layout { grid-template-columns: minmax(0, 1fr); } .routine-panel:last-child .routine-panel-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } #record-form[data-kind="automations"] input:not([type="checkbox"]), #record-form[data-kind="automations"] select, #record-form[data-kind="automations"] textarea { font-size: 16px; } .routine-summary { flex-basis: 100%; min-width: 0; } #record-form[data-kind="automations"] .form-footer { bottom: -12px; } }
.run-stages section { padding: 18px 0; border-top: 1px solid var(--line); }
.run-stages h3 { font-size: 14px; margin: 0; }
.run-stages .job-error { padding: 12px; border-radius: 7px; background: #fcf0e9; color: #995d48; }
.form-footer { flex-wrap: wrap; }
@media (max-width: 760px) {
  .main-nav { display: flex; margin: 0; overflow-x: auto; overflow-y: hidden; }
  .nav-group { display: contents; }
  .nav-group .nav-label { display: none; }
  .status-filters { gap: 6px; }
  .status-filters a { padding: 8px 10px; }
  .list-toolbar { align-items: flex-start; flex-wrap: wrap; gap: 14px; }
  .toolbar-controls { width: 100%; flex-wrap: wrap; }
  .search input { width: min(180px, 45vw); }
  .attention-panel, .recent-row { align-items: flex-start; flex-direction: column; }
  .workspace-stats a { padding: 16px; }
  .heading-actions { width: 100%; }
  .preview-meta { align-items: flex-start; }
}
.integration-accounts { display: grid; gap: 12px; margin: 16px 0; }
.integration-account { padding: 14px; border: 1px solid var(--line, #deded8); border-radius: 12px; background: var(--surface, #fafaf7); min-width: 0; }
.integration-account strong, .integration-account small { display: block; overflow-wrap: anywhere; }
.integration-account small { margin: 5px 0; color: var(--muted, #64675f); }
.integration-account .card-actions { gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.integration-card .account-select { margin-top: 16px; }
.integration-card .network-icon { margin: 0; }
.whatsapp-panel details { margin-top: 16px; }
.whatsapp-panel details p { line-height: 1.6; }
.whatsapp-panel .provider-panel-heading > div { min-width: 0; }
.whatsapp-panel small { font-size: 13px; }
.inbox-layout { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.7fr); gap: 20px; align-items: start; }
.inbox-layout > section { min-width: 0; }
.inbox-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.inbox-list h2 { margin: 0 0 16px; }
.inbox-conversations { display: grid; gap: 8px; margin-top: 16px; }
.inbox-row { display: block; padding: 14px; border: 1px solid var(--line); border-radius: 10px; color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.inbox-row.selected { background: #f1f6de; border-color: #5c733d; }
.inbox-row > div, .inbox-detail-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
.inbox-row p { margin: 8px 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.inbox-row small { font-size: 13px; }
.inbox-detail-heading h2 { margin: 0; overflow-wrap: anywhere; }
.inbox-detail-heading p { overflow-wrap: anywhere; }
.inbox-contact { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 16px 0; margin: 16px 0; border-block: 1px solid var(--line); }
.inbox-contact strong, .inbox-contact span { display: block; overflow-wrap: anywhere; }
.inbox-contact span { margin-top: 4px; font-size: 13px; }
.inbox-messages { list-style: none; margin: 16px 0; padding: 0; display: grid; gap: 12px; }
.inbox-message { padding: 16px; background: #f7f7f1; border: 1px solid var(--line); border-radius: 12px; }
.inbox-message small { font-size: 13px; }
.inbox-message p { white-space: pre-wrap; overflow-wrap: anywhere; margin: 8px 0 0; line-height: 1.6; }
.inbox-back { display: none; }
.inbox-readonly { margin-top: 20px; }
@media (max-width: 1100px) { .inbox-layout { grid-template-columns: minmax(220px, .8fr) minmax(0, 1fr); gap: 12px; } .inbox-filters { grid-template-columns: 1fr; } }
@media (max-width: 1000px) { .inbox-layout { grid-template-columns: 1fr; } .inbox-selected .inbox-list { display: none; } .inbox-layout:not(.inbox-selected) .inbox-detail { display: none; } .inbox-back { display: inline-block; margin-bottom: 20px; } .inbox-layout input, .inbox-layout select { font-size: 16px; } .inbox-detail-heading { flex-direction: column; } }
[data-destinations] label[hidden] { display: none; }
.carousel-ai-card progress{width:100%;height:10px;accent-color:#52853e}
.carousel-thumbnails{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;padding:0;margin:18px 0}
.carousel-thumbnails li{min-width:0;display:grid;gap:4px}
.carousel-thumbnails img,.carousel-placeholder{width:100%;aspect-ratio:4/5;object-fit:contain;background:#f4f1ea;border:1px solid var(--line);border-radius:6px}
.carousel-placeholder{display:grid;place-items:center;font-size:26px;color:var(--muted)}
.carousel-thumbnails strong{font-size:11px}.carousel-thumbnails small{font-size:10px}
.carousel-script{margin-top:18px}.carousel-script summary{cursor:pointer;font-size:12px}
.carousel-script ol{padding-left:20px}.carousel-script li{margin:16px 0;font-size:12px}.carousel-script li p{margin:4px 0}
.carousel-entry{padding:12px;background:#edf2e6;border-radius:8px;margin-bottom:16px}
.carousel-entry p{margin-bottom:10px}
.post-preview-media:has(.carousel-preview-slide){display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px;align-items:flex-start}
.carousel-preview-slide{margin:0;flex:0 0 88%;scroll-snap-align:start;min-width:0}
.carousel-preview-slide figcaption{padding:12px 4px;font-size:12px}.carousel-preview-slide p{margin:6px 0}
.reel-preview { display: block; width: 100%; max-height: 420px; aspect-ratio: 9 / 16; object-fit: contain; border-radius: 12px; background: #172a35; margin: 12px 0; }

/* Sistema operacional: progresso, contexto e recuperação */
.skip-link { position: fixed; top: 10px; left: 10px; z-index: 2000; padding: 10px 14px; border-radius: 8px; background: var(--green); color: #172225; font-size: 12px; font-weight: 700; text-decoration: none; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid #5d963c; outline-offset: 3px; }
.workflow { display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; margin: 17px 0 14px; color: #59675f; font-size: 10px; font-weight: 650; }
.workflow small { color: var(--muted); font-size: 10px; font-weight: 400; }
.workflow-progress { grid-column: 1 / -1; height: 4px; overflow: hidden; border-radius: 99px; background: #e5e9e2; }
.workflow-progress::after { content: ''; display: block; height: 100%; background: #7da653; }
.workflow-step-1 .workflow-progress::after { width: 20%; }.workflow-step-2 .workflow-progress::after { width: 40%; }.workflow-step-3 .workflow-progress::after { width: 60%; }.workflow-step-4 .workflow-progress::after { width: 80%; }.workflow-step-5 .workflow-progress::after { width: 100%; }
.status-guidance { margin: 14px 0; padding: 12px 13px; border-left: 3px solid #b9785e; border-radius: 0 7px 7px 0; background: #fcf4ef; color: #734b3d; }
.status-guidance strong, .status-guidance small { display: block; font-size: 11px; }
.status-guidance p { margin: 4px 0; color: inherit; font-size: 11px; line-height: 1.5; }
.status-guidance small { color: #7c5b4d; }
.guided-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0 0 22px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--line); }
.guided-flow span { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 13px; background: #fff; color: #46554d; font-size: 11px; font-weight: 650; }
.guided-flow b { display: grid; place-items: center; flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%; background: #e3f0d3; color: #355b2b; font-size: 10px; }
.priority-queue, .upcoming-panel { margin: 22px 0; }
.priority-queue .recent-row small { max-width: 720px; }
.integration-card details { margin-bottom: 14px; }
.mobile-menu-toggle { display: none; }
.queue-count { display: inline-block; padding: 3px 8px; margin-left: 6px; background: #edf2e6; border-radius: 5px; color: #35522c; font-size: 13px; vertical-align: middle; }
.queue-reason { display: block; margin-bottom: 5px; color: #715535; font-size: 12px; font-weight: 600; }
.queue-clear { margin: 0; }
.studio-help { margin: 0 0 24px; padding: 15px 18px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.studio-help summary { font-size: 13px; font-weight: 600; }
.studio-help .guided-flow { margin: 16px 0 12px; }
.studio-help p { margin: 0; font-size: 13px; }
.creation-options { display: grid; gap: 12px; margin: 20px 0; }
.creation-options button { text-align: left; padding: 18px; }
.creation-options strong, .creation-options span { display: block; }
.creation-options strong { font-size: 15px; margin-bottom: 6px; }
.creation-options span { color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.6; }

/* Base visual compartilhada entre telas editoriais e configurações. */
:root { --muted: #5f6d65; --line: #dce3da; --surface: #fff; --text-secondary: #526258; }
.page-heading { align-items: flex-start; }
.page-heading h1 { font-size: clamp(28px, 3vw, 38px); letter-spacing: -1.2px; }
.page-heading .eyebrow { margin-bottom: 12px; }
.page-heading p, .record-card p, .empty p { color: var(--text-secondary); font-size: 14px; line-height: 1.65; }
.record-card { border-radius: 10px; }
.record-card .card-top { margin-bottom: 16px; }
.badge { font-size: 11px; font-weight: 600; padding: 5px 8px; }
.badge.review { color: #76551f; }.badge.approved, .badge.active, .badge.published { color: #355c25; }.badge.scheduled, .badge.publishing, .badge.generating { color: #385682; }
.tags span { font-size: 11px; color: #52634a; }
.card-actions { gap: 8px; }
.card-actions button { font-size: 12px; padding: 9px 11px; border: 1px solid transparent; }
.card-actions .danger { border-left: 1px solid var(--line); border-radius: 0; padding-left: 15px; color: #8a3e31; }
.search input { font-size: 13px; min-width: 0; }
.list-toolbar { gap: 12px; flex-wrap: wrap; font-size: 13px; }
.list-toolbar > span { color: var(--text-secondary); }
.status-filters a { font-size: 12px; }
.status-filters a > span { font-size: 11px; }
.main-nav a { font-size: 13px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.shell .main-nav [hidden] { display: none !important; }
.main-nav .nav-group { display: block; border-bottom: 1px solid #34463e; padding-bottom: 8px; }
.main-nav .nav-group > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 10px; border-radius: 8px; cursor: pointer; list-style: none; color: #b7c8bf; }
.main-nav .nav-group > summary::-webkit-details-marker { display: none; }
.nav-chevron { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform .15s; }
.main-nav .nav-group[open] > summary .nav-chevron { transform: rotate(90deg); }
.main-nav .nav-label { margin: 0; text-transform: none; font-size: 13px; font-weight: 600; letter-spacing: .2px; color: inherit; flex: 1; }
.nav-group-count { font-size: 11px; color: #a8b9af; }
.main-nav .current-group > summary { color: #dbedc9; }
.main-nav .nav-group > summary:hover { background: #293b33; color: white; }
.main-nav .nav-group > summary:focus-visible, .main-nav a:focus-visible { outline: 2px solid var(--green); outline-offset: -2px; }
.nav-links { display: grid; gap: 3px; padding-top: 4px; }
.shell .main-nav a { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 12px; font-size: 13px; line-height: 1.4; white-space: normal; }
.shell .main-nav a.selected { background: var(--green); color: #213022; font-weight: 650; }
.shell .main-nav .nav-link-label { flex: 1; min-width: 0; width: auto; font-size: 13px; text-align: left; }
.navigation-icon { width: 19px; height: 19px; flex: 0 0 19px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.navigation-search { position: relative; margin: 0 0 14px; }
.navigation-search input { background: #20312c; border-color: #4a5e54; color: #edf5ee; min-height: 44px; padding: 11px 36px 11px 12px; font-size: 13px; }
.navigation-search input::placeholder { color: #b7c7be; opacity: 1; }
.navigation-search input:focus { outline: 2px solid var(--green); outline-offset: -2px; }
.navigation-search input::-webkit-search-cancel-button { display: none; }
.navigation-search button { position: absolute; right: 0; top: 0; width: 36px; min-height: 44px; padding: 0; background: transparent; color: #e7f0e9; border: 0; font-size: 23px; }
.navigation-empty { margin: 12px; color: #d6e2d8; font-size: 13px; line-height: 1.6; }
.shell aside .workspace-name { margin-bottom: 18px; }
.nav-label { color: #acbdb4; font-size: 10px; }
.shell aside .workspace-name small { color: #b3c1b8; }
.table-scroll { max-width: 100%; overflow-x: auto; }
.heading-actions { flex-wrap: wrap; }
@media (max-width: 1100px) { .guided-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .shell aside { padding: 16px 20px; }
  .shell .logo { margin: 0 0 14px; font-size: 26px; }
  .mobile-menu-toggle { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; min-height: 44px; text-align: left; color: #e8f0e8; border-color: #52665a; background: #263632; }
  .mobile-menu-current { font-weight: 400; color: #bdcec3; font-size: 12px; text-align: right; }
  .main-nav { display: none; overflow: visible; }
  .menu-open .main-nav { display: grid; padding: 16px 0 0; }
  .menu-open .main-nav .nav-group { display: block; margin-bottom: 8px; }
  .menu-open .nav-group .nav-label { display: block; margin: 0; }
  .navigation-search input { font-size: 16px; }
  .main-nav a { white-space: normal; min-height: 44px; }
  .sidebar-foot { display: none; }
  .menu-open .sidebar-foot { display: flex; flex-wrap: wrap; }
  .main-content { padding: 24px 16px; }
  .heading-actions { gap: 8px; }
  button, .button-link, .view-tabs a, .status-filters a, summary { min-height: 44px; }
  summary { display: list-item; align-content: center; }
  input, textarea, select, .search input { font-size: 16px; }
  .search { width: 100%; }
  .search input { width: 100%; }
  .toolbar-controls, .compact-filter { width: 100%; }
  .compact-filter select { min-width: 0; flex: 1; font-size: 16px; }
  .status-filters { overflow: visible; flex-wrap: wrap; }
  .priority-queue, .upcoming-panel { padding: 20px; }
  .recent-row button { align-self: stretch; }
  dialog { padding: 20px; max-height: calc(100dvh - 24px); }
  .workflow { grid-template-columns: 1fr; }
  .guided-flow { grid-template-columns: 1fr; }
  .guided-flow span { min-height: 44px; }
  .status-guidance { padding: 11px; }
}
.availability-editor { margin-block: 16px; padding: 16px; border: 1px solid var(--border, #dfe5da); border-radius: 12px; }
.availability-editor p { line-height: 1.5; }
.catalog-tabs { flex-wrap: wrap; }
#whatsapp-data-controls { margin-top: 16px; }
#whatsapp-data-controls input { font-size: 16px; }
#whatsapp-data-controls p { overflow-wrap: anywhere; }
.availability-row { display: grid; grid-template-columns: 1.3fr 1fr 1fr auto; gap: 12px; align-items: end; margin-block: 12px; }
.availability-editor input, .availability-editor select { font-size: 16px; min-width: 0; width: 100%; }
@media (max-width: 600px) { .availability-row { grid-template-columns: 1fr 1fr; } }
.cal-appointment { border-left: 3px solid #5b7e30; }
.inbox-live-actions { margin-block: 12px; }
.inbox-context { margin: 20px 0; padding: 18px; border: 1px solid var(--border, #dfe5d8); border-radius: 16px; background: #f6f8f1; min-width: 0; }
.inbox-context-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.inbox-context h3 { margin: 0 0 8px; }
.inbox-context-records { margin: 12px 0; }
.inbox-context-records > summary { min-height: 44px; padding: 12px 0; cursor: pointer; font-weight: 600; overflow-wrap: anywhere; }
.inbox-context-items { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px; margin: 14px 0; }
.inbox-context-item { min-width: 0; padding: 14px; border: 1px solid var(--border, #dfe5d8); border-radius: 12px; background: white; overflow-wrap: anywhere; }
.inbox-context-item strong { display: block; margin-bottom: 8px; }
.inbox-context-payment { font-weight: 600; }
.inbox-context button { min-height: 44px; white-space: normal; }
@media (max-width: 760px) { .inbox-context { padding: 12px; } .inbox-context-heading > button { width: 100%; } }
.section-navigation { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; padding: 0 0 14px; border-bottom: 1px solid var(--line); }
.section-navigation a { padding: 12px 16px; min-height: 44px; border: 1px solid var(--line); background: white; color: var(--ink); border-radius: 9px; }
.section-navigation a[aria-current="page"] { background: var(--green); border-color: #98b962; font-weight: 650; }
.section-navigation a:hover:not([aria-current="page"]) { background: #eef4e7; }
.integration-section { min-width: 0; }
.mobile-menu-toggle:hover, .mobile-menu-toggle:focus-visible { background: #31463a; color: #eef4e7; border-color: #8da680; }
@media (max-width: 800px) {
  .shell .main-content input, .shell .main-content select, .shell .main-content textarea,
  #editor input, #editor select, #editor textarea { font-size: 16px; }
}
.catalog-tabs { flex-wrap: wrap; gap: 8px; }
.catalog-tabs button { min-height: 44px; }
.toolbar-controls { flex-wrap: wrap; min-width: 0; }
.toolbar-controls > select, .toolbar-controls > .search { flex: 1 1 160px; min-width: 0; }
.filter-control { width: auto; min-height: 44px; }
.record-facts { margin-bottom: 8px; }
.record-notes { margin-bottom: 12px; }
.record-notes p { white-space: pre-wrap; margin-top: 6px; }
.workspace-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.workspace-form-wide { grid-column: 1 / -1; }
.workspace-form-footer { margin-top: 20px; }
.color-field { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.color-field input[type="color"] { width: 44px; height: 44px; padding: 2px; cursor: pointer; }
@media (max-width: 900px) {
.company-form .workspace-form-grid { grid-template-columns: 1fr; }
}
.lp-company-hero { background: #c4f178; }
.lp-company-card.selected { outline: 2px solid #6f8e45; outline-offset: 1px; }
.lp-company-icon, .lp-company-badge { background: #eef4e7; color: #365125; }
@media (max-width: 760px) {
  .workspace-form-grid { grid-template-columns: 1fr; }
  .section-navigation a { flex: 1 1 140px; justify-content: center; }
  .toolbar-controls > select { width: 100%; font-size: 16px; }
  .catalog-tabs button { flex: 1 1 130px; }
}
/* Agente de configuração: progresso real e movimento reduzido. */
.company-agent { max-width: 1020px; margin-inline: auto; }
.agent-steps { display: flex; flex-wrap: wrap; gap: 20px; list-style: none; padding: 0; margin: 0 0 28px; }
.agent-steps li { display: flex; align-items: center; gap: 8px; color: #52605b; font-size: 14px; }
.agent-steps li span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #ccd5cf; border-radius: 50%; }
.agent-steps li[aria-current] { color: #203b2e; font-weight: 700; }
.agent-steps li[aria-current] span { background: #caf279; border-color: #caf279; }
.agent-panel { padding: 32px; animation: agent-arrive .2s ease-out; }
.agent-form { display: grid; gap: 24px; }
.agent-form label { font-size: 14px; margin: 0; }
.agent-form > p { margin: 0; }
.agent-form input:not([type="checkbox"]), .agent-form textarea, .agent-form select { width: 100%; min-width: 0; }
.agent-intro { display: flex; gap: 20px; align-items: center; }
.agent-orbit { display: grid; place-items: center; flex-shrink: 0; width: 64px; height: 64px; font-size: 30px; border-radius: 24px; background: #e7f6d3; color: #254935; }
.agent-intro h2, .agent-complete h2 { margin-top: 0; }
.agent-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.agent-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
.company-agent .agent-consent { display: flex; align-items: flex-start; gap: 12px; line-height: 1.6; }
.agent-consent input, .agent-image input { width: 20px; height: 20px; flex-shrink: 0; margin-top: 3px; }
.agent-tasks { list-style: none; padding: 0; display: grid; gap: 16px; }
.agent-tasks li { display: flex; gap: 16px; padding: 20px; border: 1px solid #dbe2dc; border-radius: 16px; }
.agent-tasks li > span { font-size: 24px; color: #375842; }
.agent-tasks p { margin: 8px 0 0; }
.agent-tasks .working > span { animation: agent-spin 1.5s linear infinite; }
.agent-images { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.company-agent .agent-image { display: flex; gap: 12px; padding: 16px; border: 1px solid #dbe2dc; border-radius: 12px; overflow-wrap: anywhere; }
.agent-image a { display: block; margin-top: 8px; }
.agent-ai-options { display: grid; gap: 16px; padding: 24px; border-radius: 16px; background: #f3f6ee; }
.agent-error { padding: 16px; border-left: 3px solid #a94532; background: #fff4ef; overflow-wrap: anywhere; }
.agent-complete { display: grid; gap: 20px; }
.company-agent input, .company-agent textarea, .company-agent select { max-width: 100%; }
.company-agent a { overflow-wrap: anywhere; }
@keyframes agent-arrive { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes agent-spin { to { transform: rotate(360deg); } }
@media (max-width: 800px) { .agent-panel { padding: 20px; } .agent-field-grid, .agent-images { grid-template-columns: 1fr; } .agent-steps { gap: 12px; } .agent-steps li { font-size: 13px; } .company-agent input, .company-agent select, .company-agent textarea { font-size: 16px; } .company-agent button, .company-agent .button-link { min-height: 44px; } .agent-intro { align-items: flex-start; flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .agent-panel, .agent-tasks .working > span { animation: none; } }
.integration-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.integration-grid > div { min-width: 0; }
.integration-tile { display: flex; flex-direction: column; min-width: 0; min-height: 218px; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: white; overflow-wrap: anywhere; }
.integration-tile-heading { display: grid; grid-template-columns: 32px minmax(0, 1fr); grid-template-rows: minmax(44px, auto) 24px; align-items: center; gap: 8px 12px; min-height: 76px; }
.integration-tile-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #edf3e8; color: #587b3d; font-size: 20px; }
.integration-tile-heading h3 { font-size: 15px; line-height: 1.4; margin: 0; }
.integration-tile-heading > .badge { grid-column: 2; justify-self: start; font-size: 11px; }
.integration-tile-description { font-size: 13px; line-height: 1.5; margin: 14px 0 16px; min-height: 40px; }
.integration-tile > .integration-manage { margin: auto 0 0; }
.integration-manage > summary { border-top: 1px solid var(--line); padding: 12px 0 0; font-size: 13px; font-weight: 600; min-height: 36px; }
.integration-manage > summary:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; border-radius: 4px; }
.integration-tile-body { padding-top: 18px; min-width: 0; }
.integration-tile-body p { font-size: 13px; line-height: 1.6; }
.integration-tile-body label { display: grid; gap: 8px; font-size: 13px; margin-bottom: 14px; }
.integration-tile-body .reply-confirmation { display: flex; align-items: start; }
.integration-tile-body .card-actions { margin-top: 14px; }
.gmail-compose { display: grid; gap: 12px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.gmail-compose h4, .gmail-compose p { margin: 0; }
.gmail-compose label { display: grid; gap: 6px; }
.gmail-compose textarea { min-height: 140px; resize: vertical; }
.gmail-compose .reply-confirmation { display: flex; align-items: flex-start; }
.integration-tile-body button, .integration-tile-body a { font-size: 13px; }
.integration-settings-dialog { width: min(600px, calc(100vw - 32px)); max-height: 85vh; overflow-y: auto; padding: 24px; }
.integration-manage[open] > .integration-tile-body { display: none; }
.integration-settings-dialog .dialog-heading { gap: 16px; align-items: start; }
.integration-settings-dialog .dialog-heading h2 { margin: 0; font-size: 20px; }
.integration-settings-dialog .integration-tile-body { padding-top: 16px; }
.integration-settings-dialog .integration-accounts { grid-template-columns: minmax(0, 1fr); }
.integration-tile-body .integration-accounts { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); }
.integration-grid #whatsapp-qr-controls { margin-top: 0; }
@media (max-width: 1100px) { .integration-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .integration-grid { grid-template-columns: minmax(0, 1fr); } .integration-tile { padding: 16px; } .integration-tile-body input, .integration-tile-body select { font-size: 16px; } .integration-tile-body button { min-height: 40px; } }
.manual-facebook {
  margin: 18px 0;
  padding: 14px 16px;
  border: 1px solid var(--line, #dfe5df);
  border-radius: 12px;
}
.manual-facebook > summary { cursor: pointer; font-weight: 600; }
.manual-facebook .card-actions { flex-wrap: wrap; }
.manual-facebook [data-manual-copy-fallback]:not([hidden]) { display: grid; gap: 8px; margin-top: 14px; }
.manual-facebook textarea { width: 100%; font-size: 16px; }
.global-company-filter { display: grid; gap: 4px; min-width: 180px; max-width: 300px; font-size: 12px; font-weight: 600; }
.global-company-filter select { width: 100%; min-height: 40px; font-size: 14px; }
main > header { height: auto; min-height: 84px; padding-top: 12px; padding-bottom: 12px; gap: 16px; flex-wrap: wrap; }
@media (max-width: 760px) {
  main > header { height: auto; min-height: 64px; padding: 14px 22px; gap: 12px; }
  .global-company-filter { max-width: none; width: 100%; }
  .global-company-filter select { font-size: 16px; }
}
#toast:not(.visible) { visibility: hidden; }
.agent-image img { width: 100%; height: 140px; object-fit: contain; background: #f5f7f3; border-radius: 8px; }
.agent-image img[hidden] { display: none; }
.agent-image [data-image-error]:not([hidden]) { display: block; color: #8b3b28; margin-top: 8px; }
.api-provider-form{display:grid;gap:14px;margin-top:20px}
.ai-default-account{max-width:480px;margin-bottom:24px}
.api-provider-form label{margin:0;min-width:0}
.api-provider-form input,.api-provider-form select{width:100%;min-width:0}
.api-provider-form .checkbox-label{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;gap:10px;line-height:1.65}
.api-provider-form .checkbox-label input{width:16px;height:16px;margin:3px 0 0}
.api-provider-form .small{margin:0}
.api-provider-form button{justify-self:start}
@media(max-width:600px){.api-provider-form input,.api-provider-form select{font-size:16px}.api-provider-form button{min-height:44px}}

/* One shared content request; recurrence is an optional part of the same form. */
.creation-mode-bar { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding: 14px 16px; background: #f4f7ef; border: 1px solid var(--line); border-radius: 10px; }
#record-form[data-kind="automations"] .creation-mode-bar > label { flex: 1; max-width: 360px; }
#record-form[data-kind="automations"] .creation-mode-bar > button { min-height: 42px; }
#record-form[data-kind="automations"] [data-creation-recurrence] { grid-template-columns: minmax(0,1fr); }
#record-form[data-kind="automations"] [data-creation-recurrence] > label { grid-column: 1 / -1; }
.creation-secondary { margin-top: 12px; }
.creation-secondary button { font-size: 12px; }
@media(max-width:600px) { .creation-mode-bar { flex-direction: column; align-items: stretch; padding: 12px; } #record-form[data-kind="automations"] .creation-mode-bar > label { max-width: none; } }