:root {
  font-family: "Segoe UI", Tahoma, sans-serif;
  color: var(--text);
  background: var(--canvas);
  line-height: 1.8;
  --green: #16634f;
  --text: #203b33;
  --muted: #53685f;
  --canvas: #f3f6f4;
  --surface: #fff;
  --subtle: #edf3ef;
  --border: #d9e3dc;
  --control-border: #a7bab0;
  --radius: 12px;
  --focus: #16634f;
}
.library-items {margin-block:1rem;}
.library-row {display:flex;align-items:start;justify-content:space-between;gap:1rem;padding-block:1rem;border-block-end:1px solid var(--border);overflow-wrap:anywhere;}
.library-row p {margin-block:.25rem;white-space:pre-wrap;}
.tool-editor {padding-block:1.25rem;border-block-end:1px solid var(--border);}
.tool-editor h3 {margin-block:0 .75rem;}
.conversation-tags {padding-block:.75rem;border-block:1px solid var(--border);}
.saved-reply-picker {margin-block-end:.75rem;}
.messages a {display:block;overflow-wrap:anywhere;text-underline-offset:.2em;}
@media(max-width:640px){.library-row{flex-direction:column;}.library-row .actions{width:100%;}.tool-library .actions button{flex:1 1 10rem;}}
* {
  box-sizing: border-box;
}
[hidden] {
  display: none !important;
}
body {
  margin: 0;
}
#mfaQr {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 16px auto;
}
#mfaSecret,
#mfaRecoveryCodes {
  overflow-wrap: anywhere;
  word-break: break-word;
}
#mfaRecoveryCodes {
  white-space: pre-wrap;
  text-align: left;
  font-size: 14px;
}
header {
  padding: 16px max(24px, calc((100vw - 1440px) / 2));
  display: flex;
  align-items: center;
  gap: 28px;
  background: #fff;
  border-bottom: 1px solid var(--border);
}
header p {
  flex: 1;
  color: #5d6b65;
}
.brand {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  font-weight: 800;
  letter-spacing: 1.2px;
  font-size: 20px;
  text-decoration: none;
  color: var(--text);
}
.brand .brand-wordmark > span {
  color: var(--green);
}
.brand-logo { width: 80px; height: 80px; flex: 0 0 80px; object-fit: contain; }
.brand-copy { display: grid; gap: 3px; }
.brand-wordmark { line-height: 1.15; }
.brand-team { font-size: 11px; font-weight: 600; letter-spacing: .3px; line-height: 1.3; color: var(--muted); }
main {
  max-width: 1440px;
  padding: 32px 24px 48px;
  margin: auto;
}
h1 {
  font-size: 28px;
  line-height: 1.4;
  margin: 8px 0;
}
h2 {
  font-size: 19px;
  margin: 0 0 14px;
}
h3 {
  margin: 0;
}
p {
  margin: 8px 0 16px;
  color: var(--muted);
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  border: 1px solid var(--control-border);
  background: #fff;
  color: var(--text);
  padding: 9px 17px;
  border-radius: 8px;
  cursor: pointer;
  min-height: 44px;
  font-weight: 600;
  transition: background-color 160ms ease-out, border-color 160ms ease-out;
}
button:hover {
  border-color: var(--green);
  background: #edf4ef;
}
button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}
.primary {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}
.primary:hover {
  background: #104c3c;
  color: #fff;
}
.danger {
  color: #a52b35;
}
.danger:hover:not(:disabled) { background: #fff1f0; border-color: #a52b35; }
button:active:not(:disabled) { background: #deebe3; }
.primary:active:not(:disabled) { background: #0c3e31; }
input,
select,
textarea {
  display: block;
  width: 100%;
  border: 1px solid var(--control-border);
  border-radius: 7px;
  padding: 11px 12px;
  background: #fff;
  color: inherit;
  margin: 5px 0 16px;
}
input:focus,
select:focus,
textarea:focus,
button:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}
textarea {
  min-height: 95px;
  resize: vertical;
}
label {
  display: block;
  font-size: 14px;
  font-weight: 600;
}
.check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
}
.check input {
  width: 18px;
  height: 18px;
  margin: 0;
}
.billing-history {
  overflow-wrap: anywhere;
}
.card {
  background: var(--surface);
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  margin-bottom: 20px;
}
.auth {
  max-width: 500px;
  margin: 40px auto;
  padding: 32px;
}
.auth h1 { margin-block-end: 12px; }
.auth form > .primary { width: 100%; margin-block-start: 8px; }
.auth > p { margin-block-end: 24px; }
#authActions { padding-block-start: 20px; border-block-start: 1px solid var(--border); }
#authActions button { flex: 1 1 auto; font-size: 13px; }
#authForm details { font-size: 13px; }
.eyebrow {
  font-size: 12px;
  letter-spacing: 1px;
  color: var(--green);
  font-weight: bold;
}
.actions,
.section-title {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.section-title {
  justify-content: space-between;
  margin-bottom: 15px;
}
.actions {
  margin-top: 15px;
}
.actions button {
  font-size: 13px;
}
.topline {
  display: flex;
  justify-content: space-between;
  gap: 25px;
  align-items: center;
}
.quota {
  background: #e3eee5;
  padding: 15px 24px;
  border-radius: 10px;
  min-width: 210px;
}
.quota strong,
.quota span {
  display: block;
}
.quota strong {
  font-size: 24px;
}
.quota span {
  font-size: 12px;
}
nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid var(--border);
  padding: 18px 0;
  margin-bottom: 25px;
}
nav button.active {
  background: var(--green);
  color: #fff;
}
.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
  gap: 18px;
}
#campaigns > .card {
  min-width: 0;
  overflow-wrap: anywhere;
}
#campaignDraftStatus {
  overflow-wrap: anywhere;
}
.stack {
  display: grid;
  gap: 12px;
}
.row {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px;
  overflow-wrap: anywhere;
}
.muted {
  color: var(--muted);
  font-size: 13px;
}
.badge {
  display: inline-block;
  border-radius: 5px;
  padding: 2px 8px;
  background: #e8f0e8;
  font-size: 12px;
}
.unknown {
  background: #fff0d1;
  color: #7e4b00;
}
.inbox-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 20px;
}
.messages {
  min-height: 200px;
  max-height: 500px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 20px 0;
}
#conversations button[aria-current="page"] {
  border-color: var(--green);
  background: #eaf4ed;
}
#conversations {
  max-height: 500px;
  overflow-y: auto;
}
#conversations button {
  text-align: start;
  overflow-wrap: anywhere;
}
.message {
  max-width: 90%;
  border: 1px solid var(--border);
  padding: 10px 15px;
  border-radius: 8px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.message.human,
.message.bot {
  align-self: flex-end;
  background: #eaf4ed;
}
#notice {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #e1f0e5;
  color: #144c35;
  padding: 14px 24px;
  border-bottom: 1px solid #a7c8b4;
}
#notice.error {
  background: #fff0ee;
  color: #90262d;
}
details {
  margin: 10px 0;
}
footer {
  border-top: 1px solid var(--border);
  padding: 25px;
  text-align: center;
  font-size: 12px;
  color: var(--muted);
  display: grid;
  justify-items: center;
  gap: 12px;
}
.team-credit { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text); }
.team-credit img { width: 44px; height: 44px; object-fit: contain; }
a {
  color: var(--green);
  text-underline-offset: 4px;
}
@media (max-width: 760px) {
  header {
    padding: 14px 18px;
    gap: 12px;
  }
  header p {
    display: none;
  }
  header .brand {
    flex: 1;
  }
  .brand-logo { width: 64px; height: 64px; flex-basis: 64px; }
  main {
    padding: 20px 14px;
  }
  .topline {
    display: block;
  }
  .quota {
    margin: 15px 0;
  }
  .card {
    padding: 18px;
  }
  .inbox-layout {
    display: block;
  }
  #conversations {
    max-height: 240px;
  }
  h1 {
    font-size: 25px;
  }
  nav button {
    flex: 1;
    font-size: 13px;
    padding: 8px;
  }
  .auth .actions {
    display: grid;
  }
  .section-title {
    align-items: flex-start;
  }
}
#campaignFields { border:0; padding:0; margin:0; min-width:0; }
#campaignRecovery { overflow-wrap:anywhere; }
#historyRecords .row { min-width:0; overflow-wrap:anywhere; }
.admin-records .row { min-width:0; overflow-wrap:anywhere; }
.page-post-content { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 22rem; overflow: auto; }

/* Refinement of the existing Arabic workspace interface. */
.skip-link { position: fixed; inset-block-start: 10px; inset-inline-start: 16px; padding: 10px 18px; background: #fff; border: 2px solid var(--green); z-index: 100; transform: translateY(-160%); border-radius: 7px; }
.skip-link:focus { transform: translateY(0); }
#mainContent:focus { outline: none; }
.view:focus { outline: none; }
#pageFilters, #historyFilter { gap: 12px; align-items: end; }
#pageFilters input, #pageFilters select, #historyFilter input, #historyFilter select { margin-block-end: 0; }
#pageFilterCount { margin: 0; font-size: 13px; }
nav { position: sticky; top: 0; z-index: 5; flex-wrap: nowrap; overflow-x: auto; background: #f5f5f0; padding: 12px 0; scrollbar-width: thin; scrollbar-color: #91a99d #f5f5f0; }
nav button { flex: 0 0 auto; white-space: nowrap; }
nav button[aria-current="page"] { border-color: var(--green); }
.view { scroll-margin-block-start: 88px; }
#notice { position: fixed; inset-block-start: auto; inset-block-end: max(20px, env(safe-area-inset-bottom)); inset-inline-start: 24px; inset-inline-end: auto; width: min(560px, calc(100vw - 48px)); max-height: 38vh; overflow: auto; display: flex; gap: 16px; align-items: flex-start; padding: 16px 18px; border: 1px solid #a7c8b4; border-radius: 10px; z-index: 30; }
#noticeText { flex: 1; min-width: 0; overflow-wrap: anywhere; }
#noticeDismiss { flex: 0 0 auto; color: inherit; background: transparent; border-color: currentColor; }
#notice.error { border-color: #dfb1ad; }
button[aria-busy="true"] { cursor: progress; }
button[aria-busy="true"]::after { content: ""; display: inline-block; width: 12px; height: 12px; margin-inline-start: 9px; border: 2px solid currentColor; border-inline-end-color: transparent; border-radius: 50%; vertical-align: middle; animation: control-spin 800ms linear infinite; }
@keyframes control-spin { to { transform: rotate(360deg); } }
.setup-steps { list-style: none; padding: 0; margin: 20px 0; }
.setup-steps li { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 16px 0; border-block-end: 1px solid var(--border); }
.setup-steps li:first-child { padding-block-start: 0; }
.setup-steps li:last-child { border: 0; padding-block-end: 0; }
.setup-steps p { font-size: 14px; margin: 3px 0 0; }
.setup-steps .badge { flex: 0 0 auto; color: #536159; background: #f0f2ed; }
.setup-steps .complete .badge { color: #144c35; background: #e1f0e5; }
.page-card { min-width: 0; }
.page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.page-heading > div { min-width: 0; }
.page-heading h3 { overflow-wrap: anywhere; font-size: 19px; }
.page-heading .badge { flex: 0 0 auto; max-width: 48%; }
.page-id { direction: ltr; unicode-bidi: isolate; text-align: right; overflow-wrap: anywhere; margin: 5px 0 8px; font-variant-numeric: tabular-nums; }
.page-card > .actions { margin-block-start: 16px; }
.page-automation { border-block-start: 1px solid var(--border); padding-block-start: 16px; margin-block-start: 16px; }
.page-automation .actions { margin-block-start: 8px; }
.page-automation .muted { margin: 12px 0 0; }
.ai-options { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,220px),1fr)); gap: 14px; }
#aiSettings { scroll-margin-block-start: 88px; }
#aiSettings .row > label { flex: 1 1 240px; }
#pagePostsRows { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:16px; }
.post-card { min-width:0;margin:0;align-self:start; }
.post-card summary { font-weight:500;line-height:1.9; }
.post-picture { width:100%;max-height:260px;object-fit:contain;border-radius:6px;background:#f5f5f0; }
#contentDraftSave > label { flex:1 1 240px; }
#pageComposer,#pageProviderBrowser,#pagePostsBrowser { scroll-margin-block-start:88px; }
.page-settings { border-block-start: 1px solid var(--border); padding-block-start: 14px; margin: 18px 0 0; }
summary { cursor: pointer; padding-block: 7px; min-height: 44px; font-weight: 600; }
summary:focus-visible, .skip-link:focus-visible { outline: 3px solid #16634f; outline-offset: 3px; border-radius: 5px; }
.page-settings summary { color: var(--green); font-size: 14px; }
::selection { background: #c8e3d5; color: #123e31; }
input, textarea { caret-color: var(--green); }
@media (max-width: 760px) {
  nav { margin-inline: -14px; padding-inline: 14px; }
  nav button { flex: 0 0 auto; padding: 9px 14px; }
  .quota { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; padding: 12px 16px; min-width: 0; }
  .quota strong { font-size: 20px; }
  #notice { inset-inline-start: 14px; width: calc(100vw - 28px); padding: 12px; gap: 10px; }
  .setup-steps li { gap: 10px; flex-wrap: wrap; }
  .setup-steps li > div { flex: 1 1 180px; }
  .page-card { margin-bottom: 0; }
  .page-heading { flex-wrap: wrap; }
  .page-heading .badge { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) { button[aria-busy="true"]::after { animation: none; } }
/* Content and AI editor rows group controls; activity rows retain their borders. */
#contentView .row, #aiSettings .row {display:flex;flex-wrap:wrap;align-items:center;gap:12px;border:0;padding:0;}
#contentView .row > h2, #aiSettings .row > h2 {flex:1 1 220px;margin:0;}
#contentView form.row > label {flex:1 1 240px;}
#contentView .row > label input {margin-block-end:0;}
#contentView > .card > .section-title {margin:0;}
#contentView > .card > .section-title h2 {margin:0;}
#contentView > .card .grid {gap:12px;}
#contentView > .card select {margin-block-end:0;}
#contentView > .card > .muted {margin:0;}
#contentView > .card > .actions {margin:0;}
#contentPanels > .card {padding:20px;}
#contentView .post-card {padding:18px;}
#contentView .post-card .actions {margin-block-start:0;}
/* Inbox: a compact conversation rail and a quiet reading surface. */
.inbox-help {margin-block-end:16px;color:#465e53;font-size:14px;}
.inbox-help summary {cursor:pointer;}
.inbox-help p {max-width:75ch;}
.inbox-layout {grid-template-columns:minmax(270px,340px) minmax(0,1fr);gap:18px;align-items:start;}
.inbox-sidebar,.chat-panel {min-width:0;}
.inbox-sidebar {padding:20px;}
#conversationFilter {gap:8px;}
#conversationFilter input,#conversationFilter select {margin-block-end:0;}
#conversationCount {margin-block:14px 8px;}
#conversations {gap:6px;max-height:580px;}
#conversations .conversation-item {display:flex;align-items:flex-start;gap:10px;width:100%;padding:12px;border-color:transparent;min-height:92px;}
#conversations .conversation-item:hover {border-color:#bccbc2;}
.inbox-avatar {display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;background:#e5eee8;color:#164c3c;border-radius:50%;font-size:14px;font-weight:700;}
.conversation-content {display:flex;flex-direction:column;gap:4px;min-width:0;flex:1;}
.conversation-top {display:flex;gap:8px;align-items:baseline;justify-content:space-between;}
.conversation-top strong {font-size:14px;overflow-wrap:anywhere;}
.conversation-time {font-size:11px;color:#52665b;flex-shrink:0;max-width:85px;}
.conversation-preview {font-size:13px;color:#42584c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.conversation-page {font-size:11px;color:#52665b;}
.chat-panel {padding:22px;scroll-margin-block-start:88px;}
.chat-heading {align-items:flex-start;}
.chat-person {display:flex;gap:12px;align-items:center;min-width:0;flex:1;}
.chat-person h2 {font-size:21px;margin:0;overflow-wrap:anywhere;}
#chatMeta {margin:3px 0 0;}
.chat-status {font-size:13px;color:#355346;padding-block-end:12px;border-block-end:1px solid var(--border);}
.chat-status.human-active {color:#8a4a13;}
.chat-details {font-size:13px;padding:10px 0;border-block-end:1px solid var(--border);}
.chat-details summary {cursor:pointer;font-weight:600;}
.chat-details p {margin:10px 0;}
.chat-empty {padding:60px 12px;text-align:center;max-width:50ch;margin:auto;}
.messages {max-height:520px;min-height:260px;padding:8px 3px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#91a99d #f5f5f0;}
.message {max-width:88%;padding:12px 14px;border-radius:12px;background:#fff;align-self:flex-start;}
.message > div {line-height:1.9;}
.message > small {display:block;font-size:11px;margin-block-end:5px;}
.message.bot,.message.human {background:#edf4ef;}
.message-day {text-align:center;font-size:12px;color:#52665b;margin:8px 0;}
.message-receipt {color:#16634f;margin-block-start:6px;}
#sendForm {border-block-start:1px solid var(--border);padding-block-start:16px;}
#sendForm textarea {min-height:110px;margin-block-end:4px;}
#replyCount {font-size:12px;text-align:end;margin:0;}
.inbox-back {display:none;}
@media(max-width:760px){.inbox-layout{grid-template-columns:minmax(0,1fr);}.inbox-sidebar,.chat-panel{padding:18px;}#conversations{max-height:330px;}.inbox-back{display:inline-block;margin-block-start:8px;}.chat-person h2{font-size:19px;}.messages{max-height:460px;}.conversation-time{max-width:100px;}}
#conversations {min-width:0;grid-template-columns:minmax(0,1fr);overflow-x:hidden;}
#conversations .conversation-item {min-width:0;max-width:100%;}
.conversation-preview {max-width:100%;}
.chat-person > div {min-width:0;}
.reply-availability {font-size:13px;color:#874413;background:#fff7ec;padding:10px 12px;border-radius:7px;}
@media(max-width:760px){.chat-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;}.chat-heading > button{justify-self:start;}.chat-person h2{font-size:20px;}.chat-person{align-items:flex-start;}}

/* Workspace shell: persistent navigation, then workspace and section context. */
#dashboard {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  column-gap: 32px;
  align-items: start;
}
#dashboard > .topline {
  grid-column: 2;
  grid-row: 1;
  border-block-end: 1px solid var(--border);
  padding-block-end: 24px;
  gap: 20px;
}
.topline > div:first-child { min-width: 0; }
#workspaceName { font-size: 24px; overflow-wrap: anywhere; margin-block-start: 0; }
#licenseText { margin: 4px 0 0; font-size: 13px; }
.topline .quota {
  flex: 0 0 auto;
  min-width: 190px;
  padding: 0;
  margin: 0;
  background: transparent;
  border-radius: 0;
  text-align: end;
  font-variant-numeric: tabular-nums;
}
.topline .quota strong { font-size: 18px; font-weight: 650; }
.topline .quota span { color: var(--muted); }
#dashboard > .workspace-nav {
  grid-column: 1;
  grid-row: 1 / span 3;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  position: sticky;
  top: 24px;
  background: var(--subtle);
  padding: 12px;
  margin: 0;
  border: 0;
  border-radius: var(--radius);
  overflow-y: auto;
  overflow-x: hidden;
  max-height: calc(100dvh - 48px);
}
.workspace-nav button {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 auto;
  padding: 11px 12px;
  background: transparent;
  border: 1px solid transparent;
  font-size: 14px;
  font-weight: 600;
  text-align: start;
  white-space: normal;
}
.workspace-nav button:hover { background: #dfeae3; }
.workspace-nav button.active { background: var(--green); color: #fff; }
.workspace-nav button:focus-visible { outline-offset: -3px; }
.workspace-nav button.active:focus-visible { outline-color: white; }
.workspace-nav svg { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.workspace-context { grid-column: 2; grid-row: 2; padding-block: 28px 20px; min-width: 0; scroll-margin-block-start: 24px; }
.workspace-context h2 { font-size: 26px; margin: 0 0 4px; }
.workspace-context p { margin: 0; font-size: 14px; }
#dashboard > .view { grid-column: 2; grid-row: 3; min-width: 0; scroll-margin-block-start: 24px; }
.workspace-snapshot { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 0 0 24px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.workspace-snapshot > div { padding: 18px 24px; display: flex; flex-direction: column; gap: 4px; }
.workspace-snapshot > div + div { border-inline-start: 1px solid var(--border); }
.workspace-snapshot dt { font-size: 13px; color: var(--muted); }
.workspace-snapshot dd { margin: 0; font-weight: 700; font-size: 24px; font-variant-numeric: tabular-nums; }
.onboarding > p:last-child { padding-block-start: 16px; margin-block-end: 0; border-block-start: 1px solid var(--border); font-size: 13px; max-width: 75ch; }
.setup-steps { counter-reset: setup; }
.setup-steps li { position: relative; padding-inline-start: 42px; counter-increment: setup; }
.setup-steps li::before { content: counter(setup); position: absolute; inset-inline-start: 0; inset-block-start: 18px; display: grid; place-items: center; width: 28px; height: 28px; background: var(--subtle); color: var(--text); border-radius: 50%; font-size: 13px; font-weight: 700; }
.setup-steps li:first-child::before { inset-block-start: 2px; }
.setup-steps li.complete::before { background: #d9ebe0; color: #144c35; }
.onboarding-path { padding-block: 18px; border-block-end: 1px solid var(--border); }
.onboarding-path summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; cursor: pointer; font-weight: 700; flex-wrap: wrap; }
.onboarding-path[open] summary { margin-block-end: 16px; }
.onboarding-path summary::before { content: "+"; font-weight: 400; }
.onboarding-path[open] summary::before { content: "−"; }
.onboarding-path summary .badge { margin-inline-start: auto; }
.onboarding-plan { padding-block-start: 18px; }
.onboarding-plan h3 { margin: 0 0 8px; font-size: 16px; }
.onboarding-plan p { margin: 6px 0; overflow-wrap: anywhere; }
.workspace-alert { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; margin-block-start: 16px; background: #fff4da; border: 1px solid #d8bc76; border-radius: 10px; color: #634b17; }
.workspace-alert[data-kind="blocked"] { background: #fff0ee; border-color: #d9aaa3; color: #77382e; }
.workspace-alert p { margin: 4px 0 0; color: inherit; font-size: 14px; overflow-wrap: anywhere; }
.workspace-alert > div { min-width: 0; }
.workspace-alert button { flex: 0 0 auto; }
.account-subscription { padding-block-end: 20px; margin-block-end: 20px; border-block-end: 1px solid var(--border); }
.account-subscription h3 { margin: 0 0 8px; font-size: 17px; }
.account-subscription p { overflow-wrap: anywhere; }
@media(max-width:600px){.workspace-alert { flex-direction: column; align-items: stretch; gap: 12px; }.workspace-alert p { font-size: 14px; }}
.account-settings > details { padding-block: 12px; border-block-end: 1px solid var(--border); }
.account-settings > details:last-child { border-block-end: 0; }
.account-settings details[open] > summary { margin-block-end: 12px; }
.account-settings form { max-width: 600px; }
#pageFilters { grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); }
#pageFilterCount { grid-column: 1 / -1; padding-block-start: 4px; }
#pages { grid-template-columns: minmax(0,1fr); }
.page-heading { align-items: center; }
.page-heading h3 { font-size: 21px; }
.page-heading .page-id { margin-block-end: 0; font-size: 12px; }
.page-automation h3 { font-size: 16px; }
.page-automation .actions { margin-block-start: 12px; }
.page-settings summary { color: var(--text); }
.chat-panel .messages { background: var(--canvas); margin-inline: -10px; padding: 16px; border-radius: 8px; }
.inbox-sidebar { background: #fafcfb; }
.conversation-preview { color: var(--muted); }
.row > .badge, .page-heading .badge { line-height: 1.8; }
input::placeholder, textarea::placeholder { color: #63756c; opacity: 1; }
#notice { box-shadow: 0 8px 28px #183d3020; border: 0; }
#notice.error { background: #fff0ee; }
@media (max-width: 1099px) {
  #dashboard { display: block; }
  #dashboard > .workspace-nav { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); flex-direction: initial; gap: 6px; margin: 20px 0 0; padding: 8px; top: 0; max-height: none; overflow: visible; border-radius: 10px; }
  .workspace-nav button { justify-content: center; text-align: center; padding: 9px 6px; }
  .workspace-nav svg { width: 18px; height: 18px; flex-basis: 18px; }
  .workspace-context { padding-block: 24px 18px; scroll-margin-block-start: 145px; }
  #dashboard > .view { scroll-margin-block-start: 145px; }
  .topline .quota { min-width: 165px; }
}
@media (max-width: 760px) {
  header { padding: 14px 16px; }
  header .brand { flex: 1; }
  header #logout { font-size: 13px; padding: 8px 12px; }
  main { padding: 22px 16px 32px; }
  .auth { margin-block: 18px; padding: 24px; }
  #dashboard > .topline { display: flex; align-items: flex-start; padding-block-end: 18px; flex-wrap: wrap; gap: 12px; }
  #workspaceName { font-size: 22px; }
  .topline .quota { display: block; min-width: 0; text-align: start; }
  .topline .quota strong { font-size: 16px; }
  #dashboard > .workspace-nav { margin-inline: 0; gap: 4px; padding: 6px; }
  .workspace-nav button { font-size: 12px; line-height: 1.5; gap: 5px; flex-direction: column; min-height: 63px; }
  .workspace-context h2 { font-size: 23px; }
  .workspace-context p { font-size: 13px; }
  .workspace-context { scroll-margin-block-start: 155px; }
  #dashboard > .view { scroll-margin-block-start: 155px; }
  .workspace-snapshot > div { padding: 14px 10px; }
  .workspace-snapshot dt { font-size: 12px; }
  .workspace-snapshot dd { font-size: 22px; }
  #pageFilters { grid-template-columns: minmax(0,1fr); }
  .page-heading { align-items: flex-start; }
  .page-heading h3 { font-size: 19px; }
  .actions button { min-height: 44px; }
  .account-settings form { max-width: none; }
  #notice { inset-inline-start: 12px; width: calc(100vw - 24px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* The editor keeps writing and its local text preview in one reading path. */
.composer-workspace { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); align-items: start; gap: 28px; }
.composer-workspace > * { min-width: 0; }
#pageComposerMessage { min-height: 230px; margin-block-end: 5px; line-height: 1.9; }
.composer-count { display: block; color: var(--muted); font-size: 12px; text-align: end; font-variant-numeric: tabular-nums; margin: -12px 0 0; }
.composer-writing-preview { border-inline-start: 1px solid var(--border); padding-inline-start: 24px; }
.composer-writing-preview h3 { margin-block: 0 16px; font-size: 16px; }
.composer-preview-page { font-weight: 700; margin-block: 0 16px; overflow-wrap: anywhere; }
#composerPreviewMessage { min-height: 100px; max-height: 480px; overflow-y: auto; margin-block: 0 16px; }
.composer-preview-link { overflow-wrap: anywhere; color: var(--green); font-size: 13px; padding-block: 12px; border-block: 1px solid var(--border); }
.composer-writing-preview > .muted, .composer-help { font-size: 13px; }
.composer-help { margin: 0; }
.composer-help summary { color: var(--green); }
#contentDraftSave .row { padding-block: 14px; }
#contentDraftSave .row > label { flex: 1 1 220px; min-width: 0; }
#pageComposerPreview { padding-block-start: 24px; border-block-start: 1px solid var(--border); }
@media (max-width: 900px) {
 .composer-workspace { grid-template-columns: minmax(0,1fr); gap: 24px; }
 .composer-writing-preview { border-inline-start: 0; padding-inline-start: 0; border-block-start: 1px solid var(--border); padding-block-start: 20px; }
 #pageComposerMessage { min-height: 190px; font-size: 16px; }
 #contentDraftSave .row > label { flex: 1 1 100%; }
 #contentDraftSaveButton { width: 100%; }
}

/* Login controls keep the label separate from the visibility action. */
.password-control { display: flex; align-items: stretch; border: 1px solid var(--control-border); border-radius: 8px; margin-block: 5px 14px; background: var(--surface); }
.password-control input { flex: 1; min-width: 0; width: 0; border: 0; margin: 0; background: transparent; direction: ltr; text-align: start; }
.password-control button { flex: 0 0 auto; border: 0; border-inline-start: 1px solid var(--border); border-radius: 0; background: transparent; color: var(--green); padding-inline: 14px; }
.password-control:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }
.password-control input:focus { outline: none; box-shadow: none; }
::selection { background: #c6e4d5; color: #173e30; }
input, textarea { caret-color: var(--green); }
#chatTitle:focus { outline: none; }
#inboxBack { margin: 0 0 18px; color: var(--green); }
@media (max-width: 760px) {
  #dashboard > .workspace-nav { position: static; }
  .workspace-context, #dashboard > .view, .chat-panel { scroll-margin-block-start: 16px; }
  #inboxView:not(.conversation-open) .chat-panel { display: none; }
  #inboxView.conversation-open .inbox-sidebar { display: none; }
  #inboxView.conversation-open .chat-panel { display: block; }
  .chat-heading { flex-wrap: wrap; gap: 14px; }
  .chat-person { flex-basis: 100%; }
  .chat-person h2 { font-size: 18px; line-height: 1.6; }
  .messages { min-height: 220px; max-height: min(56dvh, 460px); }
  .message { max-width: 94%; }
  #sendForm textarea { min-height: 88px; font-size: 16px; }
  #sendForm .actions { align-items: stretch; }
  #sendSubmit { flex: 1 1 100%; }
}

/* Page connections and content library share a compact task-oriented toolbar. */
.connection-intro .section-title { align-items: flex-start; gap: 20px; margin-block-end: 0; }
.connection-intro h2 { margin: 0 0 6px; }
.connection-intro .section-title p { margin: 0; font-size: 14px; }
.connection-help { margin: 12px 0 0; font-size: 13px; }
.connection-help summary { color: var(--green); }
.connection-help p { max-width: 75ch; margin-block-end: 0; }
#candidatePanel { padding-block-start: 20px; margin-block-start: 16px; border-block-start: 1px solid var(--border); }
#candidatePanel h3 { font-size: 16px; }
#candidates .row { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
#pageFilters { padding: 18px 22px; gap: 8px 18px; margin-block-end: 18px; }
.page-identity { display: flex; gap: 14px; align-items: center; min-width: 0; }
.page-identity > div { min-width: 0; }
.page-identity p { margin: 0; font-size: 12px; }
.page-avatar { display: grid; place-items: center; flex: 0 0 48px; height: 48px; background: #e0eee6; color: #164d3c; font-weight: 700; font-size: 18px; border-radius: 12px; }
.page-card > .actions { margin-block: 20px 8px; }
.page-card > .muted { margin-block-end: 18px; }
.page-automations { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-block: 1px solid var(--border); margin-block-start: 20px; }
.page-automations .page-automation { border: 0; padding: 20px 0; margin: 0; min-width: 0; }
.page-automations .page-automation:first-child { padding-inline-end: 22px; }
.page-automations .page-automation + .page-automation { border-inline-start: 1px solid var(--border); padding-inline-start: 22px; }
.page-automation > strong { display: block; font-size: 15px; }
.page-automations .actions { align-items: flex-start; }
.page-settings { border: 0; margin-block-start: 10px; padding-block-start: 0; }
.page-settings > summary { font-size: 13px; }
.page-heading > .badge:not(.unknown) { background: #e0eee6; color: #164d3c; }
.content-toolbar { padding-block-end: 0; }
#contentView > .content-toolbar > .section-title { margin-block-end: 20px; align-items: end; gap: 20px; }
.content-page-picker { flex: 0 1 400px; min-width: 0; }
.content-page-picker select { margin-block: 5px 0; }
.content-sources { display: flex; gap: 6px; border-block-end: 1px solid var(--border); padding-block-end: 12px; }
.content-sources button { flex: 1; min-width: 0; border-color: transparent; background: transparent; color: var(--muted); }
.content-sources button[aria-pressed="true"] { background: var(--subtle); color: var(--green); border-color: #aec9b9; }
.content-sources button:hover:not(:disabled) { background: var(--subtle); }
.content-utilities { display: flex; gap: 16px; align-items: center; justify-content: space-between; padding-block: 16px; flex-wrap: wrap; }
.content-utilities p { margin: 0; flex: 1 1 250px; max-width: 65ch; }
.content-utilities .actions { margin: 0; }
.content-utilities button { min-height: 40px; font-size: 12px; padding: 7px 12px; }
.content-empty-hint { padding-block: 12px 20px; margin: 0; }
#pagePostsBrowser > .row:first-child { padding-block-end: 16px; border-block-end: 1px solid var(--border); }
#contentPanels > #pagePostsBrowser { border: 0; background: transparent; padding: 0; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
#contentPanels > #pagePostsBrowser { grid-template-columns: minmax(0,1fr) minmax(280px,1fr); gap: 14px 20px; }
#pagePostsBrowser > .row:first-child { grid-column: 1; grid-row: 1; border: 0; padding: 0; }
#pagePostsClose, #pagePostsHint { display: none; }
#pagePostsSearchForm { grid-column: 2; grid-row: 1; }
#pagePostsCount, #pagePostsRows, #pagePostsBrowser > .actions { grid-column: 1 / -1; }
#pagePostsBrowser > .row:first-child h2 { font-size: 18px; }
#pagePostsSearchForm { align-items: end; gap: 10px; }
#pagePostsSearchForm > label { flex: 1 1 240px; }
#pagePostsSearchForm input { margin: 0; }
#pagePostsCount { font-size: 13px; color: var(--muted); margin: 0; }
#pagePostsRows { grid-template-columns: repeat(auto-fit,minmax(min(100%,300px),1fr)); gap: 18px; }
#contentView .saved-post { padding: 18px; gap: 14px; border-radius: 10px; }
.saved-post > p, .saved-post > details { margin: 0; }
.post-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.post-meta .muted { font-size: 12px; }
.saved-post .post-picture { height: 190px; width: 100%; object-fit: contain; background: var(--canvas); border-radius: 8px; }
.saved-post .page-post-content { font-size: 14px; line-height: 1.9; }
.saved-post > details:not(.post-options) summary { font-size: 14px; }
.post-tools { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-block-start: auto; }
.post-tools button { font-size: 13px; }
.post-tools a { font-size: 12px; min-height: 44px; display: inline-flex; align-items: center; }
.post-options { border-block-start: 1px solid var(--border); padding-block-start: 6px; font-size: 13px; }
.post-options > summary { color: var(--muted); font-size: 13px; }
.post-options .actions { margin-block: 10px 14px; }
.post-options .page-id { text-align: start; }
@media (max-width: 760px) {
  .connection-intro .section-title { display: block; }
  .connection-intro .primary { margin-block-start: 16px; width: 100%; }
  #pageFilters { padding: 18px; }
  .page-automations { grid-template-columns: minmax(0,1fr); }
  .page-automations .page-automation:first-child { padding-inline-end: 0; }
  .page-automations .page-automation + .page-automation { border-inline-start: 0; border-block-start: 1px solid var(--border); padding-inline-start: 0; }
  #candidates .row { flex-wrap: wrap; }
  #contentView > .content-toolbar > .section-title { display: grid; grid-template-columns: minmax(0,1fr); gap: 12px; }
  .content-sources { gap: 3px; }
  .content-sources button { font-size: 12px; padding: 8px 4px; min-height: 44px; }
  .content-utilities { gap: 10px; }
  .content-utilities .actions { width: 100%; }
  .content-utilities button { flex: 1 1 auto; min-height: 44px; }
  #pagePostsBrowser { padding: 18px; }
  #contentPanels > #pagePostsBrowser { grid-template-columns: minmax(0,1fr); }
  #pagePostsSearchForm { grid-column: 1; grid-row: 2; }
  #pagePostsRows { grid-template-columns: minmax(0,1fr); }
}

/* Campaign tasks have separate work areas; editor drafts remain mounted. */
.campaign-workspaces {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-block-end:16px;margin-block-end:24px;border-block-end:1px solid var(--border);}
.campaign-workspaces button {background:transparent;border-color:transparent;min-height:48px;color:var(--muted);font-weight:600;}
.campaign-workspaces button:hover {background:var(--subtle);}
.campaign-workspaces button[aria-pressed="true"] {background:var(--subtle);border-color:#a8c5b5;color:var(--green);}
.tool-heading {display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-block-end:24px;}
.tool-heading h2 {font-size:21px;line-height:1.5;margin:0 0 6px;}
.tool-heading p {margin:0;max-width:65ch;font-size:14px;}
.tool-heading > button {flex-shrink:0;}
.starter-workflow {display:flex;justify-content:space-between;align-items:center;gap:24px;padding:20px;background:var(--subtle);border-radius:10px;margin-block-end:16px;}
.starter-workflow h3 {font-size:16px;margin:0 0 5px;}
.starter-workflow p {font-size:13px;margin:0;max-width:45ch;}
.starter-controls {display:grid;grid-template-columns:minmax(170px,1fr) auto;align-items:center;gap:4px 10px;flex:0 1 420px;}
.starter-controls label {grid-column:1/-1;font-size:13px;margin:0;}
.starter-controls select,.starter-controls button {margin:0;min-height:44px;}
.library-layout {display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:28px;margin-block-start:24px;}
.library-browser,.library-editor,.library-row-content {min-width:0;}
.library-editor {border-inline-start:1px solid var(--border);padding-inline-start:28px;}
.library-editor .tool-editor {border:0;padding-block:0 20px;}
.library-editor h3 {font-size:17px;line-height:1.6;margin:0 0 12px;}
.library-editor .muted {font-size:13px;}
.library-filters {display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.6fr);gap:14px;align-items:end;}
.library-filters label {font-size:13px;}
.library-filters input,.library-filters select {margin-block-end:0;}
#libraryCount,#libraryStatus,#moderationStatus {font-size:12px;}
.library-row {display:block;padding-block:20px;}
.library-row:first-child {padding-block-start:8px;}
.library-row-heading {display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.library-row-heading strong {font-size:16px;}
.library-kind {font-size:11px;white-space:nowrap;color:var(--green);}
.library-row .library-preview {font-size:14px;line-height:1.8;margin-block:8px;color:var(--muted);}
.library-row .actions {margin-block-start:12px;gap:8px;}
.library-row .actions button {font-size:12px;min-height:38px;padding:6px 12px;}
.library-help {border-block-start:1px solid var(--border);padding-block-start:16px;}
.library-items:has(> .muted:only-child) {padding:28px 0;max-width:50ch;}
.moderation-layout {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;margin-block-start:24px;}
.moderation-layout h3 {font-size:17px;margin-block-start:0;}
.moderation-layout > div > .muted {font-size:13px;}
.review-row {white-space:pre-wrap;}
.editor-section-title {font-size:16px;line-height:1.6;padding-block-start:20px;margin-block:24px 18px;border-block-start:1px solid var(--border);}
.campaign-targeting {grid-template-columns:repeat(2,minmax(0,1fr));}
.campaign-editor .tool-heading {align-items:center;}
.campaign-editor #campaignDraftStatus {font-size:12px;}
.campaign-editor .post-picker {margin-block:18px;padding:14px 16px;background:var(--subtle);border:0;border-radius:8px;font-size:13px;}
.campaign-editor .post-picker[open] summary {margin-block-end:16px;}
.campaign-editor .post-picker p {font-size:12px;}
.campaign-card {display:flex;flex-direction:column;}
.campaign-card h3 {font-size:18px;line-height:1.6;margin-block:0 8px;}
.campaign-card .campaign-state {align-self:flex-start;background:var(--subtle);color:var(--muted);padding:3px 10px;border-radius:6px;font-size:12px;margin-block:6px;}
.campaign-card .campaign-state.active {color:var(--green);background:#e0eee6;}
.campaign-card > .actions {margin-block-start:auto;padding-block-start:20px;}
.chat-toolstrip {display:flex;flex-wrap:wrap;align-items:start;gap:8px 20px;padding-block:8px;margin-block-end:12px;border-block-end:1px solid var(--border);}
.chat-toolstrip .chat-details {flex:1 1 220px;border:0;margin:0;padding:0;font-size:12px;}
.chat-toolstrip .chat-details > summary {font-size:13px;color:var(--green);padding-block:10px;min-height:44px;}
.chat-toolstrip .chat-details[open] {flex-basis:100%;padding-block-end:12px;}
.chat-toolstrip .conversation-tags {border:0;padding:8px 0 0;}
.conversation-tags label {font-size:13px;}
.conversation-tags > button {font-size:12px;}
.saved-reply-picker {padding:12px 14px;background:var(--subtle);border-radius:8px;font-size:13px;}
.saved-reply-controls {display:flex;align-items:end;flex-wrap:wrap;gap:8px;margin-block-start:12px;}
.saved-reply-controls > div {flex:1 1 220px;min-width:0;}
.saved-reply-controls label {font-size:12px;}
.saved-reply-controls select {margin-block-end:0;}
.saved-reply-controls button {font-size:12px;min-height:44px;}
.saved-reply-picker p {font-size:12px;margin-block-end:0;}
#sendForm textarea {min-height:128px;resize:vertical;}
@media(max-width:760px){
 #dashboard > .workspace-nav {display:flex;flex-wrap:nowrap;overflow-x:auto;max-width:100%;gap:4px;padding:6px;margin-block-start:14px;scrollbar-width:thin;scrollbar-color:#6b8577 transparent;}
 .workspace-nav button {flex:0 0 auto;flex-direction:row;white-space:nowrap;min-height:48px;padding:10px 12px;gap:8px;}
 .workspace-nav svg {flex:0 0 18px;}
}
@media(max-width:1050px){
 .library-layout,.moderation-layout {grid-template-columns:minmax(0,1fr);gap:24px;}
 .library-editor {border-inline-start:0;border-block-start:1px solid var(--border);padding-inline-start:0;padding-block-start:24px;}
 .starter-workflow {align-items:start;flex-direction:column;gap:16px;}
 .starter-controls {flex:auto;width:100%;}
}
@media(max-width:640px){
 .campaign-workspaces {gap:3px;margin-block-end:18px;padding-block-end:12px;}
 .campaign-workspaces button {font-size:12px;padding:8px 4px;line-height:1.6;}
 .tool-heading {gap:12px;flex-wrap:wrap;margin-block-end:20px;}
 .tool-heading h2 {font-size:19px;}
 .tool-heading > button {width:100%;min-height:44px;}
 .starter-workflow {padding:16px;}
 .starter-controls {grid-template-columns:minmax(0,1fr);}
 .starter-controls label {grid-column:1;}
 .library-filters,.campaign-targeting {grid-template-columns:minmax(0,1fr);}
 .library-row-heading {align-items:start;flex-direction:column;gap:2px;}
 .library-row .actions button {min-height:44px;}
 .library-editor .actions button {flex:1 1 auto;min-height:44px;}
 .chat-toolstrip .chat-details {flex-basis:100%;}
 .saved-reply-controls > button {flex:1 1 auto;}
}

/* Keep frequent inbox search visible; disclose optional filters. */
.inbox-filter {gap:12px;}
.inbox-filter-options {border-block:1px solid var(--border);}
.inbox-filter-options > summary {cursor:pointer;color:var(--green);font-weight:600;padding-block:10px;min-height:44px;}
.inbox-filter-options > .stack {padding-block:4px 16px;gap:12px;}
.inbox-filter .actions {gap:8px;}
.inbox-filter .actions button {min-height:44px;}
.inbox-applied-filters {font-size:13px;line-height:1.8;overflow-wrap:anywhere;margin-block:16px 8px;color:var(--green);}
#conversationCount {font-size:13px;min-height:24px;margin-block:12px;}
#conversations[aria-busy="true"] {opacity:.65;}

.campaign-report {margin-block-start:20px;padding-block-start:20px;border-block-start:1px solid var(--border);}
.campaign-report h4 {margin:0 0 8px;font-size:17px;}
.campaign-report > p {font-size:13px;max-width:75ch;}
.campaign-report-form {display:flex;flex-wrap:wrap;gap:12px 16px;align-items:end;}
.campaign-report-form > label {flex:1 1 180px;min-width:0;}
.campaign-report-form input {direction:ltr;}
.campaign-report-form .actions {flex:1 1 100%;}
.campaign-report-metrics {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-block:16px 0;}
.campaign-report-metrics > div {padding:12px 8px;border-block-start:1px solid var(--border);}
.campaign-report-metrics dt {font-size:12px;color:var(--muted);}
.campaign-report-metrics dd {margin:4px 0 0;font-size:20px;font-weight:650;font-variant-numeric:tabular-nums;}
@media(max-width:600px){.campaign-report-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}.campaign-report-form > label{flex-basis:100%;}.campaign-report-form button{min-height:44px;}}

.review-filters {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px;padding-block:16px;border-block:1px solid var(--border);margin-block:16px;}
.review-filters > label:last-of-type,.review-filters > .actions {grid-column:1 / -1;}
.review-capacity-warning {padding:14px 16px;background:#fff4da;color:#634b17;border:1px solid #d8bc76;border-radius:10px;overflow-wrap:anywhere;}
.review-pagination {margin-block-start:20px;}
.review-row p {overflow-wrap:anywhere;white-space:pre-wrap;}
@media(max-width:640px){.review-filters{grid-template-columns:minmax(0,1fr);}.review-filters button,.review-pagination button{min-height:44px;}}
.image-upload-preview{display:block;max-width:min(100%,360px);max-height:300px;object-fit:contain;margin-block:var(--space-4,16px)}
#imageUploadForm{display:grid;gap:12px;margin-block:16px}#imageUploadFile{max-width:100%;width:100%}#imageUploadReview{border-top:1px solid var(--border);padding-block-start:16px}
.catalog-selection,.catalog-tools form{display:grid;gap:12px}.catalog-selection{grid-template-columns:minmax(0,1fr) minmax(0,2fr);align-items:end;margin-block:20px}.catalog-selection>label{grid-column:1}.catalog-selection>select{grid-column:1}.catalog-selection>form{grid-column:2;grid-row:1/3}.catalog-tools{border-block:1px solid var(--border);padding-block:14px;margin-block:16px}.catalog-tools summary{cursor:pointer;font-weight:600}.catalog-tools form{margin-block:16px}.catalog-search{display:grid;grid-template-columns:minmax(0,2fr) repeat(2,minmax(0,1fr));gap:12px;align-items:end;margin-block:20px}.catalog-search>div{min-width:0}.catalog-search label{display:block;margin-block-end:6px}.catalog-search input,.catalog-search select{width:100%;min-width:0}.catalog-search>p,.catalog-search>.actions{grid-column:1/-1}.catalog-search>p{margin:0}@media(max-width:700px){.catalog-search{grid-template-columns:minmax(0,1fr)}}.catalog-product-row{padding-block:20px;border-bottom:1px solid var(--border);overflow-wrap:anywhere}.catalog-product-row p{margin-block:5px}.catalog-diff{display:grid;grid-template-columns:minmax(90px,1fr) minmax(0,3fr);gap:6px 16px;white-space:pre-wrap;overflow-wrap:anywhere}.catalog-diff dd{margin:0}#catalogProductForm{margin-block:24px;padding-block:20px;border-block:1px solid var(--border)}#catalogImportFile{max-width:100%}@media(max-width:700px){.catalog-selection{display:block}.catalog-selection>form{margin-block-start:20px}.catalog-product-row .actions>*{min-height:44px}.catalog-diff{grid-template-columns:1fr}.catalog-diff dd{margin-block-end:12px}}

.catalog-column-map{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;border:0;padding:0;margin-block:16px}.catalog-column-map legend{font-weight:600;margin-block-end:12px}.catalog-column-map label{display:block;margin-block-end:6px}.catalog-column-map select{width:100%;min-width:0}.catalog-column-map p{overflow-wrap:anywhere;font-size:.875rem;margin-block:6px 0}@media(max-width:700px){.catalog-column-map{grid-template-columns:minmax(0,1fr)}}

#catalogImportMapping bdi{white-space:nowrap}