/* Site receiver onboarding */
.receiver-setup{display:grid;gap:22px;margin-bottom:24px;border-color:#cfc9ff;background:radial-gradient(circle at 96% 3%,#e9e5ff 0,transparent 25%),#fff}
.receiver-setup-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.receiver-setup-head h2{margin:5px 0 7px;font-size:clamp(22px,3vw,32px)}
.receiver-setup-head p{max-width:760px;margin:0;color:var(--muted);line-height:1.55}
.receiver-setup-actions,.receiver-setup-status{display:flex;gap:8px;flex-wrap:wrap}
.receiver-setup-grid{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(360px,1.15fr);gap:18px}
.receiver-setup-grid>article,.receiver-callbacks{padding:19px;border:1px solid var(--line);border-radius:15px;background:#fafbfe}
.receiver-setup h3{margin:0 0 12px;font-size:15px}
.receiver-setup ol{display:grid;gap:8px;margin:0 0 16px;padding-left:22px;color:#58647a;font-size:12px;line-height:1.5}
.receiver-setup code{overflow-wrap:anywhere;color:#5145c6;font-size:11px}
.receiver-endpoint-list{display:grid;gap:8px}
.receiver-endpoint-list>div,.receiver-callback-row{display:grid;grid-template-columns:70px minmax(180px,1fr);gap:4px 10px;padding:10px;border:1px solid #e4e7ee;border-radius:10px;background:#fff}
.receiver-endpoint-list strong,.receiver-callback-row strong{grid-row:span 2;color:#5548c5;font-size:9px}
.receiver-endpoint-list span,.receiver-callback-row span{color:#7b8597;font-size:9px}
.receiver-callbacks{display:grid;gap:8px}.receiver-callbacks p{margin:0 0 5px;color:var(--muted);font-size:11px}
.receiver-prompt-label{font-size:12px;font-weight:800}
.receiver-prompt{width:100%;padding:16px;border:1px solid #d7dbea;border-radius:13px;background:#111827;color:#e5e7eb;font:11px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;resize:vertical}
.receiver-prompt:focus{border-color:#7669df;box-shadow:0 0 0 3px #7669df22;outline:0}
@media(max-width:900px){.receiver-setup-head{display:grid}.receiver-setup-grid{grid-template-columns:1fr}.receiver-setup-actions .button{justify-content:center}}
@media(max-width:560px){.receiver-endpoint-list>div,.receiver-callback-row{grid-template-columns:1fr}.receiver-endpoint-list strong,.receiver-callback-row strong{grid-row:auto}.receiver-setup-actions{display:grid}.receiver-setup-actions .button{width:100%}}

:root {
  color-scheme: light;
  --bg: #f8fafc;
  --bg-soft: #eef2f7;
  --panel: #ffffff;
  --panel-subtle: #f9fafb;
  --ink: #111827;
  --muted: #4b5563;
  --muted-soft: #6b7280;
  --line: #e5e7eb;
  --line-strong: #d1d5db;
  --primary: #047857;
  --primary-dark: #065f46;
  --primary-soft: #d1fae5;
  --accent: #d97706;
  --accent-soft: #fef3c7;
  --info: #0369a1;
  --info-soft: #e0f2fe;
  --danger: #e11d48;
  --danger-soft: #ffe4e6;
  --warning: #b45309;
  --warning-soft: #ffedd5;
  --sidebar: #111827;
  --sidebar-muted: #9ca3af;
  --sidebar-line: rgba(255, 255, 255, .10);
  --shadow-sm: 0 1px 2px rgba(17, 24, 39, .06);
  --shadow-md: 0 12px 30px rgba(17, 24, 39, .08);
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --sidebar-width: 280px;
  --transition: 200ms ease;
}

.affiliate-offers-hero {
  align-items: flex-end;
  background: linear-gradient(135deg, #173a4b, #0f766e 56%, #b45309);
  border-radius: 18px;
  color: #fff;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  margin-bottom: 18px;
  padding: 28px;
}
.affiliate-offers-hero h1 { color: #fff; max-width: 900px; }
.affiliate-offers-hero p { color: rgba(255,255,255,.82); margin-bottom: 0; max-width: 820px; }
.affiliate-kpi-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
}
.affiliate-kpi-grid article {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  display: grid;
  gap: 4px;
  min-height: 112px;
  padding: 16px;
}
.affiliate-kpi-grid span,
.affiliate-table small,
.affiliate-section-head span,
.affiliate-link-list span {
  color: var(--muted-soft);
  display: block;
  font-size: 12px;
  font-weight: 700;
}
.affiliate-kpi-grid strong { font-size: 24px; line-height: 1.15; }
.affiliate-kpi-grid small { color: var(--muted); }
.affiliate-dashboard-layout,
.affiliate-detail-layout,
.affiliate-forms-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, .8fr);
  margin-bottom: 18px;
}
.affiliate-side-stack { display: grid; gap: 16px; }
.affiliate-table-wrap { overflow-x: auto; width: 100%; }
.affiliate-table {
  border-collapse: collapse;
  min-width: 760px;
  width: 100%;
}
.affiliate-products-table { min-width: 1680px; }
.affiliate-table th,
.affiliate-table td {
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  padding: 10px;
  text-align: left;
  vertical-align: middle;
}
.affiliate-table th {
  background: #f8fafc;
  color: #374151;
  font-size: 11px;
  text-transform: uppercase;
}
.affiliate-product-thumb,
.affiliate-empty-thumb {
  align-items: center;
  aspect-ratio: 1;
  background: #eef2f7;
  border-radius: 8px;
  display: flex;
  height: 48px;
  justify-content: center;
  object-fit: cover;
  width: 48px;
}
.affiliate-filter-grid,
.affiliate-form-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.affiliate-filter-grid input,
.affiliate-filter-grid select,
.affiliate-form-grid input,
.affiliate-form-grid select,
.affiliate-form-grid textarea,
.affiliate-import-box input {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  min-width: 0;
  padding: 10px 11px;
  width: 100%;
}
.affiliate-form-grid label { display: grid; gap: 6px; }
.affiliate-form-grid label span { color: #374151; font-size: 12px; font-weight: 800; }
.affiliate-wide { grid-column: 1 / -1; }
.affiliate-section-head {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-bottom: 12px;
}
.affiliate-row-actions {
  display: grid;
  gap: 6px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 180px;
}
.affiliate-row-actions .button { justify-content: center; min-height: 34px; width: 100%; }
.affiliate-row-actions.is-vertical { grid-template-columns: 1fr; }
.affiliate-platform-grid,
.affiliate-tabs-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 18px;
}
.affiliate-platform-card details { margin-top: 12px; }
.affiliate-capabilities {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.affiliate-capabilities span {
  background: #f3f4f6;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #4b5563;
  font-size: 11px;
  padding: 5px 8px;
}
.affiliate-capabilities span.is-on {
  background: #d1fae5;
  border-color: #a7f3d0;
  color: #065f46;
}
.affiliate-link-list,
.affiliate-mini-bars {
  display: grid;
  gap: 10px;
}
.affiliate-link-list div,
.affiliate-mini-bars div {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
}
.affiliate-link-list a,
.affiliate-link-list strong {
  overflow-wrap: anywhere;
}
.affiliate-detail-main {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(180px, 280px) minmax(0, 1fr);
  margin-bottom: 14px;
}
.affiliate-detail-media {
  align-items: center;
  aspect-ratio: 4 / 3;
  background: #eef2f7;
  border-radius: 12px;
  display: flex;
  justify-content: center;
  overflow: hidden;
}
.affiliate-detail-media img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}
.affiliate-detail-facts {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.affiliate-detail-facts div {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px;
}
.affiliate-detail-facts span { color: var(--muted-soft); display: block; font-size: 12px; font-weight: 700; }
.affiliate-json {
  background: #111827;
  border-radius: 8px;
  color: #e5e7eb;
  font-size: 12px;
  max-height: 360px;
  overflow: auto;
  padding: 12px;
}
.affiliate-import-box { display: grid; gap: 12px; }
.affiliate-export-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.affiliate-export-links .button {
  min-height: 34px;
}
.affiliate-compare-picker {
  display: grid;
  gap: 8px;
  max-height: 520px;
  overflow: auto;
}
.affiliate-compare-picker label {
  align-items: center;
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 8px;
  padding: 9px;
}
.affiliate-best-cell {
  background: #d1fae5;
  color: #064e3b;
  font-weight: 850;
}
.affiliate-radar-list {
  display: grid;
  gap: 10px;
}
.affiliate-radar-item {
  align-items: center;
  background: #f9fafb;
  border: 1px solid var(--line);
  border-left: 4px solid var(--info);
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 11px;
}
.affiliate-radar-item strong,
.affiliate-radar-item span {
  display: block;
}
.affiliate-radar-item span {
  color: var(--muted);
  font-size: 12px;
}
.affiliate-radar-item b {
  color: var(--ink);
  font-size: 20px;
}
.affiliate-radar-item.is-success { border-left-color: var(--primary); }
.affiliate-radar-item.is-warning,
.affiliate-radar-item.is-medium { border-left-color: var(--warning); }
.affiliate-radar-item.is-danger,
.affiliate-radar-item.is-high { border-left-color: var(--danger); }
.affiliate-publishing-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.affiliate-publishing-grid form {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 12px;
}
.affiliate-publishing-grid label {
  display: grid;
  gap: 6px;
}
.affiliate-publishing-grid label span {
  color: #374151;
  font-size: 12px;
  font-weight: 800;
}
.affiliate-publishing-grid select {
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  min-width: 0;
  padding: 10px 11px;
  width: 100%;
}
@media (max-width: 1100px) {
  .affiliate-kpi-grid,
  .affiliate-platform-grid,
  .affiliate-tabs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .affiliate-dashboard-layout,
  .affiliate-detail-layout,
  .affiliate-forms-grid { grid-template-columns: 1fr; }
  .affiliate-filter-grid,
  .affiliate-form-grid,
  .affiliate-publishing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .affiliate-offers-hero { align-items: stretch; flex-direction: column; padding: 20px; }
  .affiliate-kpi-grid,
  .affiliate-platform-grid,
  .affiliate-tabs-grid,
  .affiliate-filter-grid,
  .affiliate-form-grid,
  .affiliate-publishing-grid,
  .affiliate-detail-main,
  .affiliate-detail-facts { grid-template-columns: 1fr; }
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100%;
  background:
    radial-gradient(circle at top left, rgba(4, 120, 87, .08), transparent 34rem),
    linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
  color: var(--ink);
  font: 15px/1.55 Inter, Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
  text-rendering: optimizeLegibility;
}

body.is-submitting {
  cursor: progress;
}

a {
  color: var(--primary-dark);
  text-decoration: none;
  transition: color var(--transition), background var(--transition), border-color var(--transition), box-shadow var(--transition);
}

a:hover {
  color: var(--primary);
}

button,
input,
textarea,
select {
  font: inherit;
  letter-spacing: 0;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(4, 120, 87, .22);
  outline-offset: 2px;
}

h1,
h2,
h3,
p {
  overflow-wrap: anywhere;
}

h1,
h2,
h3 {
  color: var(--ink);
  line-height: 1.2;
  margin: 0;
}

h1 {
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 800;
}

h2 {
  font-size: 18px;
  font-weight: 800;
  margin-bottom: 14px;
}

h3 {
  font-size: 17px;
  font-weight: 800;
}

p {
  color: var(--muted);
}

img {
  max-width: 100%;
}

.app-loader {
  background: rgba(4, 120, 87, .16);
  height: 3px;
  inset: 0 0 auto;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  position: fixed;
  transform: translateY(-3px);
  transition: opacity var(--transition), transform var(--transition);
  z-index: 2000;
}

.app-loader span {
  animation: loader-slide 1.1s ease-in-out infinite;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  display: block;
  height: 100%;
  width: 42%;
}

.app-loader.is-active {
  opacity: 1;
  transform: translateY(0);
}

@keyframes loader-slide {
  from { transform: translateX(-110%); }
  to { transform: translateX(260%); }
}

.toast-region {
  display: grid;
  gap: 10px;
  max-width: min(420px, calc(100vw - 32px));
  position: fixed;
  right: 18px;
  top: 18px;
  z-index: 2100;
}

.toast {
  align-items: flex-start;
  animation: toast-in var(--transition) both;
  background: var(--panel);
  border: 1px solid var(--line);
  border-left: 4px solid var(--primary);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  color: var(--ink);
  display: grid;
  gap: 4px;
  padding: 13px 14px;
}

.toast strong {
  font-size: 14px;
}

.toast span {
  color: var(--muted);
  font-size: 13px;
}

.toast.error {
  border-left-color: var(--danger);
}

@keyframes toast-in {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.sidebar {
  background: var(--sidebar);
  border-right: 1px solid var(--sidebar-line);
  color: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 22px;
  inset: 0 auto 0 0;
  padding: 22px 18px;
  position: fixed;
  width: var(--sidebar-width);
  z-index: 1000;
}

.brand-block {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.brand {
  align-items: center;
  color: #ffffff;
  display: flex;
  gap: 12px;
  min-width: 0;
}

.brand:hover {
  color: #ffffff;
}

.brand-mark {
  align-items: center;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  border-radius: var(--radius);
  box-shadow: 0 10px 24px rgba(4, 120, 87, .22);
  color: #ffffff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.brand strong,
.brand small {
  display: block;
}

.brand strong {
  font-size: 15px;
  font-weight: 900;
}

.brand small {
  color: var(--sidebar-muted);
  font-size: 12px;
  line-height: 1.25;
  margin-top: 2px;
}

.sidebar-close,
.menu-toggle {
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: var(--radius-sm);
  color: #ffffff;
  cursor: pointer;
  display: none;
  font-weight: 800;
  min-height: 38px;
  padding: 8px 11px;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
}

.sidebar-nav,
nav {
  display: grid;
  gap: 6px;
}

.sidebar-nav {
  overflow-y: auto;
  padding-right: 2px;
}

.nav-group {
  border: 1px solid transparent;
  border-radius: var(--radius);
}

.nav-group summary {
  align-items: center;
  border: 1px solid transparent;
  border-radius: var(--radius);
  color: #d1d5db;
  cursor: pointer;
  display: flex;
  gap: 10px;
  list-style: none;
  min-height: 42px;
  padding: 10px 12px;
  transition: all var(--transition);
  user-select: none;
}

.nav-group summary::-webkit-details-marker {
  display: none;
}

.nav-group summary:hover,
.nav-group summary.is-active {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .12);
  color: #ffffff;
}

.nav-chevron {
  align-items: center;
  display: inline-flex;
  height: 18px;
  justify-content: center;
  margin-left: auto;
  transform: rotate(-90deg);
  transition: transform var(--transition);
  width: 18px;
}

.nav-group[open] .nav-chevron {
  transform: rotate(0deg);
}

.nav-submenu {
  display: grid;
  gap: 3px;
  padding: 4px 0 6px 34px;
}

.nav-submenu a {
  border-radius: 10px;
  font-size: 14px;
  min-height: 36px;
  padding: 7px 10px;
}

.nav-submenu .nav-icon {
  flex-basis: 22px;
  height: 22px;
  width: 22px;
}

.site-switcher {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 9px;
  display: grid;
  gap: 8px;
  padding: 10px;
}

.site-switcher label {
  gap: 5px;
}

.site-switcher span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  text-transform: uppercase;
}

.site-switcher select {
  min-height: 34px;
  padding: 6px 9px;
}

.site-switcher button {
  min-height: 32px;
  width: 100%;
}

.sidebar-nav a,
nav a {
  align-items: center;
  border: 1px solid transparent;
  border-radius: var(--radius);
  color: #d1d5db;
  display: flex;
  gap: 10px;
  min-height: 42px;
  padding: 10px 12px;
  text-decoration: none;
  transition: all var(--transition);
}

.sidebar-nav a:hover,
nav a:hover,
.sidebar-nav a.is-active {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .12);
  color: #ffffff;
}

.nav-icon {
  align-items: center;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 10px;
  color: #f9fafb;
  display: inline-flex;
  flex: 0 0 28px;
  font-size: 10px;
  font-weight: 900;
  height: 28px;
  justify-content: center;
}

.sidebar-nav a.is-active .nav-icon {
  background: var(--primary);
  border-color: var(--primary);
}

.mobile-shell {
  align-items: center;
  background: rgba(255, 255, 255, .92);
  border-bottom: 1px solid var(--line);
  display: none;
  gap: 12px;
  inset: 0 0 auto;
  min-height: 64px;
  padding: 12px 16px;
  position: sticky;
  top: 0;
  z-index: 900;
}

.mobile-brand {
  color: var(--ink);
  font-weight: 900;
}

.sidebar-backdrop {
  background: rgba(17, 24, 39, .42);
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  transition: opacity var(--transition);
  z-index: 950;
}

.main {
  margin-left: var(--sidebar-width);
  min-height: 100vh;
  padding: 34px;
}

.page-head,
.seoaip-header,
.agency-hero {
  align-items: flex-end;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  margin-bottom: 24px;
}

.page-head p,
.seoaip-eyebrow,
.agency-eyebrow,
.title-keyword,
.agency-kpis span,
.agency-panel-head span,
.writer-audit-grid span,
.article-meta-grid span,
th {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.page-head p,
.seoaip-header p,
.agency-hero p {
  margin: 0 0 5px;
}

.page-head p,
.seoaip-eyebrow,
.agency-eyebrow,
.title-keyword {
  color: var(--accent);
}

.panel,
.metric,
.content-item,
.settings-card,
.provider-box,
.seoaip-panel,
.seoaip-card,
.agency-command,
.agency-panel,
.agency-kpis article,
.agency-insights article,
.agency-source-card,
.keyword-opportunity-card,
.title-suggestion-card,
.competitor-card,
.vi-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.panel,
.seoaip-panel,
.agency-command,
.agency-panel {
  margin-bottom: 18px;
  padding: 20px;
}

.panel h2,
.seoaip-panel h2,
.agency-panel h2 {
  margin-bottom: 14px;
}

.metrics,
.agency-kpis,
.writer-audit-grid,
.article-meta-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 18px;
}

.agency-kpis,
.writer-audit-grid,
.article-meta-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.metric,
.agency-kpis article,
.writer-audit-grid article,
.article-meta-grid div {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  display: grid;
  gap: 8px;
  padding: 18px;
}

.metric span,
.seoaip-card span,
.seoaip-form label span,
.agency-search-form label span,
.keyword-scout-form label span {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.metric strong,
.seoaip-card strong,
.agency-kpis strong,
.writer-audit-grid strong,
.article-meta-grid strong {
  color: var(--ink);
  display: block;
  font-size: 28px;
  line-height: 1.1;
}

.agency-kpis strong {
  font-size: 34px;
}

.button,
button,
.seoaip-button,
.agency-button,
.vi-button {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font-weight: 800;
  gap: 8px;
  justify-content: center;
  min-height: 40px;
  padding: 9px 14px;
  text-decoration: none;
  transition: all var(--transition);
  white-space: nowrap;
}

.button:hover,
button:hover,
.seoaip-button:hover,
.agency-button:hover,
.vi-button:hover {
  border-color: var(--primary);
  box-shadow: 0 8px 18px rgba(17, 24, 39, .08);
  color: var(--primary-dark);
  transform: translateY(-1px);
}

.button.primary,
button.primary,
.seoaip-button-primary,
.agency-button.primary,
.vi-button-primary {
  background: var(--primary);
  border-color: var(--primary);
  color: #ffffff;
}

.button.primary:hover,
button.primary:hover,
.seoaip-button-primary:hover,
.agency-button.primary:hover,
.vi-button-primary:hover {
  background: var(--primary-dark);
  border-color: var(--primary-dark);
  color: #ffffff;
}

.vi-button-light {
  background: #ffffff;
}

button[disabled],
.button.is-loading,
form.is-submitting button[type="submit"] {
  opacity: .72;
  pointer-events: none;
}

.button-spinner {
  animation: spin .8s linear infinite;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 999px;
  height: 14px;
  width: 14px;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

input,
textarea,
select {
  background: #ffffff;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  color: var(--ink);
  min-height: 42px;
  padding: 10px 12px;
  transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
  width: 100%;
}

input:hover,
textarea:hover,
select:hover {
  border-color: #9ca3af;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(4, 120, 87, .12);
  outline: none;
}

textarea {
  min-height: 92px;
  resize: vertical;
}

label,
.seoaip-form label,
.agency-search-form label,
.keyword-scout-form label {
  color: var(--muted);
  display: grid;
  font-weight: 800;
  gap: 7px;
}

.check {
  align-items: center;
  display: flex;
  gap: 9px;
}

.check input,
input[type="checkbox"],
input[type="radio"] {
  min-height: auto;
  width: auto;
}

.module-checks {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 12px;
}

.module-checks legend {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  padding: 0 6px;
  text-transform: uppercase;
}

.site-modules-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.form,
.settings-card,
.image-actions,
.content-list,
.title-suggestion-list,
.keyword-opportunity-grid,
.agency-bars,
.agency-source-list,
.audit-sidebar,
.audit-list {
  display: grid;
  gap: 14px;
}

.form-grid,
.settings-layout,
.image-workflow,
.content-audit-layout,
.agency-grid-main,
.agency-insights {
  align-items: start;
  display: grid;
  gap: 18px;
}

.form-grid {
  grid-template-columns: minmax(320px, 440px) minmax(0, 1fr);
}

.settings-layout {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.provider-grid,
.jobs-form {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.provider-box {
  background: var(--panel-subtle);
  padding: 14px;
}

.provider-title,
.settings-card-head,
.seoaip-section-head,
.agency-panel-head,
.article-preview-head {
  align-items: flex-start;
  display: flex;
  gap: 14px;
  justify-content: space-between;
}

.settings-card-head > div {
  align-items: center;
  display: flex;
  gap: 10px;
}

.settings-icon {
  align-items: center;
  background: var(--info-soft);
  border: 1px solid #bae6fd;
  border-radius: var(--radius-sm);
  color: var(--info);
  display: inline-flex;
  flex: 0 0 40px;
  font-size: 12px;
  font-weight: 900;
  height: 40px;
  justify-content: center;
}

.settings-icon-logo {
  background: transparent;
  border: 0;
  flex-basis: 64px;
  width: 64px;
}

.settings-icon-logo img {
  display: block;
  height: 28px;
  object-fit: contain;
  width: 64px;
}

.field-note,
.agency-muted,
.seoaip-empty,
.agency-empty {
  color: var(--muted);
  margin: 0;
}

.settings-actions,
.agency-hero-actions,
.title-pill-row,
.source-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.settings-actions {
  grid-column: 1 / -1;
}

.settings-logo-preview {
  background: var(--sidebar);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: block;
  max-height: 96px;
  max-width: 280px;
  object-fit: contain;
  padding: 14px;
}

.site-logo-preview {
  max-height: 52px;
  max-width: 120px;
  padding: 8px;
}

table {
  border-collapse: collapse;
  width: 100%;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 12px 10px;
  text-align: left;
  vertical-align: top;
}

tbody tr {
  transition: background var(--transition);
}

tbody tr:hover {
  background: #f9fafb;
}

.table-enhanced {
  overflow-x: auto;
}

.table-tools {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin: 0 0 12px;
}

.table-tools input {
  max-width: 320px;
}

.table-tools span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.status,
.content-item header span,
.notice,
.source-meta span,
.agency-chip-list span,
.agency-item-analysis span,
.seoaip-item-analysis span,
.title-pill-row span,
.vi-badge,
.vi-contract {
  align-items: center;
  background: var(--info-soft);
  border-radius: 999px;
  color: var(--info);
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.3;
  max-width: 100%;
  padding: 5px 9px;
}

.status.success,
.notice.success,
.source-meta .published-age {
  background: var(--primary-soft);
  color: var(--primary-dark);
}

.status.error,
.notice.error {
  background: var(--danger-soft);
  color: var(--danger);
}

.status.sending,
.status.pending,
.status.image_error,
.status.running {
  background: var(--warning-soft);
  color: var(--warning);
}

.notice {
  border-radius: var(--radius);
  padding: 9px 12px;
}

.code-block {
  background: #0f172a;
  border: 1px solid #1e293b;
  border-radius: var(--radius);
  color: #e5e7eb;
  font-family: "Consolas", "SFMono-Regular", monospace;
  font-size: 13px;
  line-height: 1.6;
  overflow-x: auto;
  padding: 14px;
  white-space: pre-wrap;
}

.content-item {
  padding: 20px;
}

.content-item header {
  align-items: flex-start;
  display: flex;
  gap: 12px;
}

.content-item p {
  margin: 10px 0 14px;
}

.content-row {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.content-row-actions,
.stack-actions {
  align-content: start;
  display: grid;
  gap: 10px;
}

dl {
  display: grid;
  gap: 8px 14px;
  grid-template-columns: 150px minmax(0, 1fr);
}

dt {
  color: var(--muted);
  font-weight: 900;
}

dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.inline-form,
.toolbar-form,
.writer-search,
.keyword-scout-form,
.writer-generate-form,
.agency-search-form {
  align-items: end;
  display: grid;
  gap: 14px;
}

.inline-form {
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto;
}

.toolbar-form {
  grid-template-columns: 1.2fr 1.4fr .6fr .7fr 1fr auto;
}

.writer-search {
  grid-template-columns: 1.2fr 1.7fr repeat(3, minmax(120px, 1fr)) auto;
}

.keyword-scout-form {
  grid-template-columns: 1.2fr 1.7fr minmax(120px, .6fr) minmax(130px, .7fr) auto;
}

.writer-generate-form {
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.2fr) minmax(260px, 1.5fr) minmax(150px, .8fr) auto;
}

.agency-search-form {
  grid-template-columns: 1.25fr 1.5fr repeat(3, minmax(120px, 1fr));
}

.agency-search-form .wide {
  grid-column: span 2;
}

.image-workflow {
  grid-template-columns: minmax(240px, 380px) minmax(0, 1fr);
}

.preview,
.article-hero-image {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: block;
  object-fit: cover;
  width: 100%;
}

.preview {
  margin: 12px 0;
  max-width: 380px;
}

.article-hero-image {
  aspect-ratio: 16 / 9;
  margin-top: 16px;
}

.image-placeholder {
  background: var(--panel-subtle);
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius);
  color: var(--muted);
  display: grid;
  min-height: 220px;
  place-items: center;
}

.seoaip-admin,
.agency-dashboard {
  color: var(--ink);
  display: grid;
  gap: 18px;
}

.seoaip-header p,
.agency-hero p {
  color: var(--muted);
  max-width: 780px;
}

.seoaip-grid,
.seoaip-source-list,
.compact-source-list {
  display: grid;
  gap: 14px;
}

.seoaip-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.seoaip-grid-3,
.agency-grid-main {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.seoaip-source,
.compact-source-list article,
.keyword-opportunity-card,
.title-suggestion-card,
.agency-source-card {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 16px;
}

.compact-source-list article {
  background: var(--panel-subtle);
}

.seoaip-source-main,
.title-suggestion-main,
.writer-keyword {
  min-width: 0;
}

.seoaip-source small,
.compact-source-list small,
.agency-kpis small {
  color: var(--muted);
  display: block;
  font-weight: 700;
  margin-top: 4px;
}

.seoaip-item-analysis,
.agency-item-analysis {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}

.seoaip-analysis-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 18px;
}

.seoaip-list-block {
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.seoaip-list-block ul,
.audit-list,
.agency-question-list {
  margin: 0;
  padding-left: 20px;
}

.agency-insights {
  grid-template-columns: 1fr 1fr 1.3fr;
}

.agency-bars div {
  display: grid;
  gap: 6px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.agency-bars div i,
.score-track {
  background: #e5e7eb;
  border-radius: 999px;
  display: block;
  grid-column: 1 / -1;
  height: 8px;
  overflow: hidden;
}

.agency-bars em,
.score-track i {
  background: linear-gradient(90deg, var(--primary), var(--info));
  border-radius: inherit;
  display: block;
  height: 100%;
}

.agency-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.content-audit-layout {
  grid-template-columns: minmax(0, 1fr) 360px;
}

.article-preview h1 {
  font-size: clamp(30px, 3.4vw, 44px);
  margin: 16px 0 8px;
}

.article-excerpt {
  color: var(--muted);
  font-size: 17px;
}

.article-render {
  border-top: 1px solid var(--line);
  margin-top: 18px;
  padding-top: 18px;
}

.article-render h2,
.article-render h3 {
  margin-top: 24px;
}

.audit-list.danger li::marker {
  color: var(--danger);
}

.audit-list.ok li::marker {
  color: var(--primary);
}

.competitor-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.competitor-card {
  padding: 16px;
}

.keyword-opportunity-card h3,
.title-suggestion-card h3 {
  font-size: 21px;
  line-height: 1.25;
  margin: 6px 0 8px;
}

.keyword-opportunity-card p,
.title-suggestion-card p,
.agency-source-card p {
  color: var(--muted);
  margin: 0 0 10px;
}

.keyword-opportunity-actions {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.keyword-opportunity-actions form,
.central-jobs-grid form {
  margin: 0;
}

.jobs-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.jobs-form .settings-card-head,
.jobs-form .jobs-wide,
.jobs-form button,
.jobs-form .field-note {
  grid-column: 1 / -1;
}

.central-jobs-grid {
  margin-top: 14px;
}

.vi-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.vi-card {
  display: grid;
  gap: 12px;
  padding: 18px;
}

.vi-card-top,
.vi-card-actions,
.vi-card-details {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.vi-card-details {
  color: var(--muted);
  display: grid;
}

.vi-company {
  margin: -4px 0 0;
}

.vi-empty {
  color: var(--muted);
  font-weight: 800;
}

.page-enter {
  animation: page-enter 260ms ease both;
}

@keyframes page-enter {
  from {
    transform: translateY(8px);
  }
  to {
    transform: translateY(0);
  }
}

@media (max-width: 1180px) {
  .writer-search,
  .keyword-scout-form,
  .writer-generate-form,
  .toolbar-form,
  .agency-search-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .writer-search button,
  .keyword-scout-form button,
  .writer-generate-form button,
  .toolbar-form button {
    grid-column: 1 / -1;
  }

  .content-audit-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .sidebar {
    box-shadow: var(--shadow-md);
    transform: translateX(-100%);
    transition: transform var(--transition);
  }
}

body.sidebar-open .sidebar {
  transform: translateX(0);
}

/* AI Editorial Planner */
.planner-shell {
  --planner-bg: #f6f7fb;
  --planner-panel: rgba(255, 255, 255, .88);
  --planner-ink: #111827;
  --planner-muted: #5b6475;
  --planner-line: rgba(100, 116, 139, .22);
  --planner-teal: #0f766e;
  --planner-blue: #2563eb;
  --planner-rose: #e11d48;
  --planner-amber: #d97706;
  --planner-violet: #7c3aed;
  --planner-shadow: 0 18px 50px rgba(15, 23, 42, .10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(246,247,251,.96)),
    linear-gradient(115deg, rgba(15,118,110,.10), rgba(37,99,235,.08) 42%, rgba(217,119,6,.10));
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 20px;
  color: var(--planner-ink);
  display: grid;
  gap: 22px;
  min-height: calc(100vh - 48px);
  padding: clamp(16px, 2vw, 28px);
}

.planner-shell.planner-dark {
  --planner-bg: #0b1020;
  --planner-panel: rgba(15, 23, 42, .82);
  --planner-ink: #f8fafc;
  --planner-muted: #b6c0d4;
  --planner-line: rgba(148, 163, 184, .22);
  --planner-shadow: 0 18px 60px rgba(0, 0, 0, .32);
  background:
    linear-gradient(180deg, rgba(15,23,42,.92), rgba(11,16,32,.96)),
    linear-gradient(115deg, rgba(20,184,166,.12), rgba(59,130,246,.12) 42%, rgba(244,63,94,.10));
}

.planner-shell h1,
.planner-shell h2,
.planner-shell h3 {
  color: var(--planner-ink);
}

.planner-shell p,
.planner-shell small {
  color: var(--planner-muted);
}

.planner-hero {
  align-items: end;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.planner-kicker {
  color: var(--planner-teal);
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.planner-hero-copy h1 {
  font-size: clamp(32px, 4vw, 58px);
  max-width: 1050px;
}

.planner-hero-copy p {
  font-size: 16px;
  margin: 12px 0 0;
  max-width: 760px;
}

.planner-hero-actions,
.planner-actions,
.planner-card-meta,
.planner-schedule-line,
.planner-channel-row,
.planner-dialog-tags,
.planner-format-grid {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.planner-icon-button {
  align-items: center;
  background: var(--planner-panel);
  border: 1px solid var(--planner-line);
  border-radius: 12px;
  color: var(--planner-ink);
  display: inline-flex;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.planner-alert {
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  padding: 9px 12px;
}

.planner-alert.success {
  background: rgba(20, 184, 166, .14);
  color: #0f766e;
}

.planner-alert.error {
  background: rgba(225, 29, 72, .12);
  color: var(--planner-rose);
}

.planner-metrics {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.planner-metrics article,
.planner-card,
.planner-column,
.planner-date-card,
.planner-trend-card,
.planner-history article {
  backdrop-filter: blur(18px);
  background: var(--planner-panel);
  border: 1px solid var(--planner-line);
  box-shadow: var(--planner-shadow);
}

.planner-metrics article {
  border-radius: 16px;
  display: grid;
  gap: 4px;
  padding: 18px;
}

.planner-metrics span {
  color: var(--planner-muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.planner-metrics strong {
  color: var(--planner-ink);
  font-size: 34px;
  line-height: 1;
}

.planner-tabs,
.planner-segmented {
  background: rgba(148, 163, 184, .12);
  border: 1px solid var(--planner-line);
  border-radius: 14px;
  display: flex;
  gap: 4px;
  overflow-x: auto;
  padding: 5px;
}

.planner-tabs button,
.planner-segmented button {
  background: transparent;
  border: 0;
  border-radius: 10px;
  color: var(--planner-muted);
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 850;
  padding: 10px 13px;
  transition: background var(--transition), color var(--transition), transform var(--transition);
}

.planner-tabs button:hover,
.planner-segmented button:hover {
  transform: translateY(-1px);
}

.planner-tabs button.is-active,
.planner-segmented button.is-active {
  background: var(--planner-panel);
  color: var(--planner-ink);
  box-shadow: var(--shadow-sm);
}

.planner-view {
  display: none;
}

.planner-view.is-active {
  animation: planner-rise 240ms ease both;
  display: block;
}

@keyframes planner-rise {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.planner-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.planner-grid.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.planner-card {
  border-radius: 18px;
  overflow: hidden;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

.planner-card:hover {
  border-color: rgba(37, 99, 235, .36);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .14);
  transform: translateY(-4px);
}

.planner-cover {
  aspect-ratio: 16 / 9;
  background: #111827;
  overflow: hidden;
  position: relative;
}

.planner-cover img {
  height: 100%;
  object-fit: cover;
  transition: transform 320ms ease;
  width: 100%;
}

.planner-card:hover .planner-cover img {
  transform: scale(1.035);
}

.planner-status,
.planner-priority {
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  padding: 7px 9px;
}

.planner-cover .planner-status {
  left: 12px;
  position: absolute;
  top: 12px;
}

.planner-cover .planner-priority {
  position: absolute;
  right: 12px;
  top: 12px;
}

.planner-status.suggested,
.planner-priority.medium {
  background: rgba(37, 99, 235, .14);
  color: var(--planner-blue);
}

.planner-status.accepted,
.planner-status.scheduled,
.planner-status.drafted,
.planner-priority.high {
  background: rgba(15, 118, 110, .16);
  color: var(--planner-teal);
}

.planner-status.rejected,
.planner-priority.urgent {
  background: rgba(225, 29, 72, .14);
  color: var(--planner-rose);
}

.planner-card-body {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.planner-card-meta span,
.planner-channel-row span,
.planner-keywords span,
.planner-keywords strong,
.planner-schedule-line span,
.planner-dialog-tags span,
.planner-format-grid span {
  background: rgba(148, 163, 184, .12);
  border: 1px solid var(--planner-line);
  border-radius: 999px;
  color: var(--planner-muted);
  font-size: 12px;
  font-weight: 800;
  padding: 6px 9px;
}

.planner-keywords {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.planner-keywords strong {
  background: rgba(217, 119, 6, .14);
  color: var(--planner-amber);
}

.planner-card h2 {
  font-size: 20px;
  margin: 0;
}

.planner-card p {
  margin: 0;
}

.planner-score-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.planner-score-grid span {
  background: rgba(255, 255, 255, .56);
  border: 1px solid var(--planner-line);
  border-radius: 12px;
  color: var(--planner-muted);
  display: grid;
  font-size: 12px;
  font-weight: 800;
  padding: 10px;
}

.planner-dark .planner-score-grid span {
  background: rgba(15, 23, 42, .44);
}

.planner-score-grid strong {
  color: var(--planner-ink);
  font-size: 21px;
}

.planner-actions {
  align-items: stretch;
  padding-top: 4px;
}

.planner-actions .button,
.planner-actions button {
  min-height: 38px;
}

.planner-schedule-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.planner-schedule-form input {
  border: 1px solid var(--planner-line);
  border-radius: 10px;
  min-height: 38px;
  padding: 7px 9px;
}

.planner-calendar-toolbar {
  align-items: center;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  margin-bottom: 14px;
}

.planner-calendar {
  display: grid;
  gap: 12px;
}

.planner-calendar-item,
.planner-mini-card {
  background: var(--planner-panel);
  border: 1px solid var(--planner-line);
  border-radius: 14px;
  cursor: grab;
  transition: transform var(--transition), border-color var(--transition);
}

.planner-calendar-item {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: 130px 82px minmax(0, 1fr) auto;
  padding: 12px;
}

.planner-calendar-item:hover,
.planner-mini-card:hover {
  border-color: rgba(124, 58, 237, .38);
  transform: translateY(-2px);
}

.planner-calendar-item img {
  aspect-ratio: 16 / 10;
  border-radius: 10px;
  object-fit: cover;
  width: 82px;
}

.planner-calendar-item time,
.planner-calendar-item span,
.planner-calendar-item small {
  color: var(--planner-muted);
  display: block;
  font-size: 12px;
  font-weight: 800;
}

.planner-board {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(5, minmax(220px, 1fr));
  overflow-x: auto;
  padding-bottom: 4px;
}

.planner-column {
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 360px;
  padding: 12px;
}

.planner-column.is-over {
  border-color: rgba(20, 184, 166, .55);
}

.planner-column header {
  color: var(--planner-ink);
  display: flex;
  font-weight: 900;
  justify-content: space-between;
}

.planner-mini-card {
  display: grid;
  gap: 6px;
  padding: 12px;
}

.planner-mini-card.is-dragging {
  opacity: .55;
}

.planner-mini-card strong {
  color: var(--planner-ink);
  font-size: 13px;
}

.planner-mini-card span {
  color: var(--planner-muted);
  font-size: 12px;
}

.planner-side-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.planner-date-card,
.planner-trend-card {
  border-radius: 16px;
  padding: 18px;
}

.planner-date-card time {
  color: var(--planner-blue);
  font-size: 13px;
  font-weight: 900;
}

.planner-date-card span {
  color: var(--planner-amber);
  font-weight: 900;
}

.planner-trend-card {
  align-items: center;
  display: flex;
  gap: 14px;
}

.planner-score-ring {
  align-items: center;
  background:
    radial-gradient(circle at center, var(--planner-panel) 56%, transparent 57%),
    conic-gradient(var(--planner-teal) calc(var(--score) * 1%), rgba(148,163,184,.18) 0);
  border-radius: 50%;
  color: var(--planner-ink);
  display: inline-flex;
  flex: 0 0 auto;
  font-weight: 950;
  height: 68px;
  justify-content: center;
  width: 68px;
}

.planner-history {
  display: grid;
  gap: 10px;
}

.planner-history article {
  border-radius: 14px;
  display: grid;
  gap: 4px;
  padding: 14px;
}

.planner-empty {
  background: var(--planner-panel);
  border: 1px dashed var(--planner-line);
  border-radius: 16px;
  color: var(--planner-muted);
  font-weight: 800;
  padding: 28px;
  text-align: center;
}

.planner-dialog {
  background: var(--planner-panel);
  border: 1px solid var(--planner-line);
  border-radius: 18px;
  box-shadow: var(--planner-shadow);
  color: var(--planner-ink);
  max-width: min(760px, calc(100vw - 28px));
  padding: 24px;
}

.planner-dialog::backdrop {
  background: rgba(15, 23, 42, .46);
  backdrop-filter: blur(8px);
}

.planner-dialog-close {
  background: rgba(148, 163, 184, .16);
  border: 1px solid var(--planner-line);
  border-radius: 10px;
  color: var(--planner-ink);
  float: right;
  height: 34px;
  width: 34px;
}

.planner-dialog pre {
  background: rgba(148, 163, 184, .10);
  border: 1px solid var(--planner-line);
  border-radius: 14px;
  color: var(--planner-ink);
  font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  max-height: 54vh;
  overflow: auto;
  padding: 14px;
  white-space: pre-wrap;
}

@media (max-width: 1280px) {
  .planner-grid,
  .planner-grid.compact,
  .planner-side-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .planner-hero,
  .planner-calendar-toolbar {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .planner-metrics,
  .planner-grid,
  .planner-grid.compact,
  .planner-side-grid {
    grid-template-columns: 1fr;
  }

  .planner-calendar-item {
    grid-template-columns: 1fr;
  }

  .planner-calendar-item img {
    width: 100%;
  }
}

@media (max-width: 900px) {
  body.sidebar-open .sidebar-backdrop {
    opacity: 1;
    pointer-events: auto;
  }

  .sidebar-close,
  .menu-toggle,
  .mobile-shell {
    display: flex;
  }

  .main {
    margin-left: 0;
    padding: 22px 16px 34px;
  }

  .page-head,
  .seoaip-header,
  .agency-hero,
  .agency-panel-head,
  .seoaip-section-head,
  .provider-title,
  .settings-card-head,
  .article-preview-head,
  .content-item header {
    align-items: flex-start;
    flex-direction: column;
  }

  .metrics,
  .form-grid,
  .settings-layout,
  .provider-grid,
  .ai-limit-grid,
  .image-workflow,
  .seoaip-grid-2,
  .seoaip-grid-3,
  .seoaip-source,
  .seoaip-analysis-grid,
  .agency-search-form,
  .agency-kpis,
  .agency-grid-main,
  .agency-insights,
  .agency-source-card,
  .writer-search,
  .keyword-scout-form,
  .keyword-opportunity-card,
  .title-suggestion-card,
  .writer-audit-grid,
  .compact-source-list article,
  .writer-generate-form,
  .jobs-layout,
  .jobs-form,
  .content-row,
  .content-audit-layout,
  .article-meta-grid,
  .competitor-grid,
  .inline-form,
  .toolbar-form {
    grid-template-columns: 1fr;
  }

  .agency-search-form .wide,
  .settings-actions {
    grid-column: auto;
  }

  .content-row-actions,
  .stack-actions,
  .keyword-opportunity-actions {
    justify-items: stretch;
  }

  .button,
  button,
  .seoaip-button,
  .agency-button,
  .vi-button {
    white-space: normal;
  }

  dl {
    grid-template-columns: 1fr;
  }

  .table-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .table-tools input {
    max-width: none;
  }
}

@media (max-width: 520px) {
  .sidebar {
    width: min(88vw, 320px);
  }

  .main {
    padding-inline: 12px;
  }

  .panel,
  .seoaip-panel,
  .agency-command,
  .agency-panel,
  .content-item {
    padding: 16px;
  }

  .toast-region {
    left: 12px;
    right: 12px;
    top: 76px;
  }
}

/* Clean desktop product layer */
:root {
  --bg: #f6f7fb;
  --panel-subtle: #f9fafb;
  --primary: #0f766e;
  --primary-dark: #115e59;
  --primary-soft: #ccfbf1;
  --accent: #b45309;
  --info: #2563eb;
  --info-soft: #eff6ff;
  --sidebar: #ffffff;
  --sidebar-muted: #6b7280;
  --sidebar-line: #e5e7eb;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-md: 0 10px 28px rgba(15, 23, 42, .08);
  --radius-sm: 7px;
  --radius: 10px;
  --radius-lg: 14px;
  --sidebar-width: 264px;
}

body {
  background: var(--bg);
  font-size: 14px;
}

h1 {
  font-size: clamp(25px, 2.2vw, 32px);
  font-weight: 620;
}

h2 {
  font-size: 17px;
  font-weight: 600;
}

h3 {
  font-size: 16px;
  font-weight: 600;
}

p,
td,
dd {
  color: var(--muted);
}

.sidebar {
  background: var(--sidebar);
  border-right: 1px solid var(--sidebar-line);
  color: var(--ink);
  gap: 14px;
  padding: 18px 14px 12px;
}

.brand,
.brand:hover,
.mobile-brand {
  color: var(--ink);
}

.brand-mark {
  background: #111827;
  border-radius: 9px;
  box-shadow: none;
  font-weight: 700;
}

.brand strong {
  font-weight: 620;
}

.brand small {
  color: var(--sidebar-muted);
}

.sidebar-nav a,
nav a {
  color: #374151;
  font-weight: 520;
  min-height: 38px;
  padding: 8px 10px;
}

.sidebar-nav a:hover,
nav a:hover,
.sidebar-nav a.is-active {
  background: #f3f4f6;
  border-color: #e5e7eb;
  color: var(--ink);
}

.nav-icon {
  background: transparent;
  border: 0;
  color: #6b7280;
  flex-basis: 22px;
  height: 22px;
  width: 22px;
}

.sidebar-nav a.is-active .nav-icon {
  background: transparent;
  color: var(--primary-dark);
}

.sidebar-nav {
  overflow-y: auto;
  padding-right: 2px;
}

.sidebar-section-label {
  color: #9ca3af;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .1em;
  margin: 2px 10px -6px;
  text-transform: uppercase;
}

.nav-tools {
  padding: 0 2px;
}

.nav-search {
  align-items: center;
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 9px;
  display: flex;
  flex-wrap: nowrap;
  gap: 7px;
  min-height: 38px;
  overflow: hidden;
  padding: 0 9px;
  transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
}

.nav-search .sr-only {
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.nav-search:focus-within {
  background: #ffffff;
  border-color: #99d5ce;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, .09);
}

.nav-search .nav-icon {
  color: #9ca3af;
  flex-basis: 18px;
  height: 18px;
  width: 18px;
}

.nav-search input {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--ink);
  flex: 1 1 auto;
  font-size: 12px;
  min-height: 36px;
  min-width: 0;
  outline: 0;
  padding: 0;
  width: 100%;
}

.nav-search kbd {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 5px;
  color: #9ca3af;
  font-family: inherit;
  font-size: 9px;
  flex: 0 0 auto;
  line-height: 1;
  padding: 4px 5px;
  white-space: nowrap;
}

.nav-empty {
  color: var(--muted);
  font-size: 12px;
  padding: 16px 10px;
  text-align: center;
}

.nav-group {
  border-radius: 9px;
}

.nav-group summary {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 9px;
  color: #374151;
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-weight: 680;
  gap: 10px;
  list-style: none;
  min-height: 38px;
  padding: 8px 10px;
  transition: all var(--transition);
  user-select: none;
}

.nav-group[open] > summary {
  color: var(--ink);
}

.nav-group summary::-webkit-details-marker {
  display: none;
}

.nav-group summary:hover,
.nav-group summary.is-active {
  background: #f3f4f6;
  border-color: #e5e7eb;
  color: var(--ink);
}

.nav-group summary.is-active .nav-icon {
  color: var(--primary-dark);
}

.nav-chevron {
  align-items: center;
  color: #6b7280;
  display: inline-flex;
  height: 18px;
  justify-content: center;
  margin-left: auto;
  transform: rotate(-90deg);
  transition: transform var(--transition);
  width: 18px;
}

.nav-chevron .ui-icon {
  height: 15px;
  width: 15px;
}

.nav-group[open] .nav-chevron {
  transform: rotate(0deg);
}

.nav-submenu {
  border-left: 1px solid var(--line);
  display: grid;
  gap: 2px;
  margin-left: 20px;
  padding: 4px 0 6px 10px;
}

.nav-submenu a {
  border-radius: 8px;
  font-size: 13px;
  min-height: 34px;
  padding: 7px 9px;
}

.nav-submenu a.is-active {
  background: var(--primary-soft);
  border-color: #99f6e4;
  color: var(--primary-dark);
  font-weight: 650;
}

/* NAVIT Browser Agents */
.browser-agents-page {
  display: grid;
  gap: 20px;
  margin: 0 auto;
  max-width: 1480px;
  padding: 6px 0 28px;
}

.browser-agents-hero {
  align-items: end;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  padding: 8px 2px 2px;
}

.browser-agents-breadcrumb {
  align-items: center;
  color: var(--muted);
  display: flex;
  font-size: 12px;
  gap: 7px;
  margin-bottom: 14px;
}

.browser-agents-breadcrumb a {
  color: var(--primary-dark);
  font-weight: 650;
  text-decoration: none;
}

.browser-agents-hero h1 {
  margin: 5px 0 7px;
}

.browser-agents-hero p {
  margin: 0;
  max-width: 760px;
}

.browser-agents-hero-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}

.browser-agents-setup-grid {
  align-items: stretch;
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
}

.browser-agent-card,
.browser-agents-table-card {
  margin: 0;
}

.browser-agent-card {
  display: grid;
  gap: 14px;
}

.browser-agents-heading h2,
.browser-agents-heading p {
  margin: 0;
}

.browser-agents-heading h2 {
  margin-top: 4px;
}

.browser-agents-heading p {
  font-size: 13px;
  margin-top: 6px;
}

.browser-agent-card label {
  display: grid;
  gap: 7px;
}

.browser-agent-card textarea {
  min-height: 122px;
  resize: vertical;
}

.browser-agent-card .button {
  justify-self: start;
}

.browser-agents-table-card {
  overflow: hidden;
  padding-bottom: 0;
}

.browser-agents-table-heading {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding-bottom: 18px;
}

.browser-agents-count {
  background: var(--panel-subtle);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 650;
  padding: 7px 10px;
}

.browser-agents-table-wrap {
  border-top: 1px solid var(--line);
  margin: 0 -18px;
}

.browser-agents-table {
  min-width: 1160px;
}

.browser-agents-table th,
.browser-agents-table td {
  padding: 13px 18px;
  vertical-align: top;
}

.browser-agents-table td small {
  color: var(--muted);
  display: inline-block;
  font-size: 11px;
  margin-top: 3px;
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.browser-agent-actions {
  min-width: 390px;
}

.browser-agent-open-url,
.browser-agent-advanced {
  align-items: end;
  display: grid;
  gap: 8px;
}

.browser-agent-open-url {
  grid-template-columns: minmax(180px, 1fr) auto;
}

.browser-agent-advanced {
  grid-template-columns: minmax(116px, .58fr) minmax(160px, 1fr) auto;
  margin-top: 8px;
}

.browser-agent-actions input,
.browser-agent-actions select {
  min-height: 34px;
  padding: 6px 8px;
}

@media (max-width: 980px) {
  .browser-agents-hero {
    align-items: start;
    flex-direction: column;
  }

  .browser-agents-setup-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .browser-agents-page {
    gap: 16px;
    padding-top: 0;
  }

  .browser-agents-hero {
    gap: 16px;
  }

  .browser-agents-hero-actions,
  .browser-agents-hero-actions .button {
    width: 100%;
  }

  .browser-agents-hero-actions .button {
    justify-content: center;
  }

  .browser-agents-table-heading {
    align-items: start;
    flex-direction: column;
  }

  .browser-agents-table-wrap {
    margin-inline: -16px;
  }
}

/* Video downloader */
.video-download-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .75fr);
}

.video-download-card {
  padding: 24px;
}

.video-download-card .settings-card-head {
  border-bottom: 1px solid var(--line);
  margin-bottom: 22px;
  padding-bottom: 18px;
}

.video-download-card .settings-card-head h2,
.video-download-card .settings-card-head p {
  margin: 0;
}

.video-download-card .settings-card-head p {
  font-size: 12px;
  margin-top: 4px;
}

.video-download-card .settings-icon .ui-icon {
  height: 20px;
  width: 20px;
}

.video-download-form {
  display: grid;
  gap: 22px;
}

.video-download-form > label {
  display: grid;
  gap: 7px;
}

.video-download-form > label > span,
.video-download-form legend {
  color: #374151;
  font-size: 12px;
  font-weight: 750;
}

.video-download-form label > small {
  color: var(--muted);
  font-size: 10px;
}

.video-url-field {
  align-items: center;
  background: #fbfcfd;
  border: 1px solid var(--line);
  border-radius: 10px;
  display: flex;
  gap: 8px;
  padding: 0 12px;
  transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
}

.video-url-field:focus-within {
  background: #fff;
  border-color: #69bdb3;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, .1);
}

.video-url-field .nav-icon {
  color: #8b96a7;
  flex-basis: 20px;
}

.video-url-field input {
  background: transparent;
  border: 0;
  box-shadow: none;
  min-height: 48px;
  outline: 0;
  padding: 0;
}

.video-download-form fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

.video-download-form legend {
  margin-bottom: 9px;
}

.video-format-options {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.video-format-options > label {
  align-items: center;
  background: #fbfcfd;
  border: 1px solid var(--line);
  border-radius: 11px;
  cursor: pointer;
  display: flex;
  gap: 11px;
  min-height: 76px;
  padding: 14px;
  transition: border-color var(--transition), background var(--transition), box-shadow var(--transition);
}

.video-format-options > label:has(input:checked) {
  background: #f0fdfa;
  border-color: #5eead4;
  box-shadow: 0 0 0 1px rgba(13, 148, 136, .08);
}

.video-format-options input {
  accent-color: var(--primary);
  flex: 0 0 auto;
  height: 17px;
  width: 17px;
}

.video-format-options span,
.video-format-options b,
.video-format-options small {
  display: block;
}

.video-format-options b {
  color: var(--ink);
  font-size: 12px;
}

.video-format-options small {
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
  margin-top: 3px;
}

.video-download-submit {
  justify-content: center;
  min-height: 46px;
  width: 100%;
}

.video-download-aside {
  display: grid;
  gap: 14px;
}

.video-download-aside .panel {
  padding: 20px;
}

.video-download-aside h2,
.video-download-aside h3,
.video-download-aside p {
  margin: 0;
}

.video-download-aside h2 {
  font-size: 15px;
  margin: 12px 0;
}

.video-download-aside ol {
  color: var(--muted);
  display: grid;
  font-size: 11px;
  gap: 10px;
  line-height: 1.5;
  margin: 0;
  padding-left: 20px;
}

.video-download-aside-icon {
  align-items: center;
  background: var(--primary-soft);
  border-radius: 10px;
  color: var(--primary-dark);
  display: inline-flex;
  height: 38px;
  justify-content: center;
  width: 38px;
}

.video-download-safety {
  align-items: flex-start;
  background: #fffbeb;
  border-color: #fde68a;
  display: flex;
  gap: 12px;
}

.video-download-safety .video-download-aside-icon {
  background: #fef3c7;
  color: #a16207;
  flex: 0 0 38px;
}

.video-download-safety h3 {
  font-size: 12px;
  margin-bottom: 5px;
}

.video-download-safety p,
.video-download-alert p {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.video-download-alert {
  align-items: center;
  display: flex;
  gap: 12px;
  margin-bottom: 18px;
  padding: 14px 16px;
}

.video-download-alert p {
  margin: 0;
}

@media (max-width: 900px) {
  .video-download-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .video-download-card {
    padding: 18px;
  }

  .video-format-options {
    grid-template-columns: 1fr;
  }

  .video-download-alert {
    align-items: flex-start;
    flex-direction: column;
  }
}

.nav-submenu .nav-icon {
  flex-basis: 20px;
  height: 20px;
  width: 20px;
}

.sidebar-close,
.menu-toggle {
  background: #ffffff;
  border-color: var(--line);
  color: var(--ink);
  font-weight: 600;
}

.main {
  padding: 28px;
}

.page-head,
.seoaip-header,
.agency-hero {
  align-items: center;
  margin-bottom: 20px;
}

.page-head p,
.seoaip-eyebrow,
.agency-eyebrow,
.title-keyword,
.agency-kpis span,
.agency-panel-head span,
.writer-audit-grid span,
.article-meta-grid span,
th {
  font-size: 11px;
  font-weight: 650;
}

.panel,
.metric,
.content-item,
.settings-card,
.provider-box,
.seoaip-panel,
.seoaip-card,
.agency-command,
.agency-panel,
.agency-kpis article,
.agency-insights article,
.agency-source-card,
.keyword-opportunity-card,
.title-suggestion-card,
.competitor-card,
.vi-card {
  border-color: var(--line);
  box-shadow: var(--shadow-sm);
}

.panel,
.seoaip-panel,
.agency-command,
.agency-panel {
  padding: 18px;
}

.metric,
.agency-kpis article,
.writer-audit-grid article,
.article-meta-grid div {
  padding: 16px;
}

.metric span,
.seoaip-card span,
.seoaip-form label span,
.agency-search-form label span,
.keyword-scout-form label span,
label {
  font-weight: 580;
}

.metric strong,
.seoaip-card strong,
.agency-kpis strong,
.writer-audit-grid strong,
.article-meta-grid strong {
  font-size: 24px;
  font-weight: 620;
}

.button,
button,
.seoaip-button,
.agency-button,
.vi-button {
  border-radius: 7px;
  font-weight: 580;
  gap: 7px;
  min-height: 36px;
  padding: 7px 11px;
}

.button:hover,
button:hover,
.seoaip-button:hover,
.agency-button:hover,
.vi-button:hover {
  box-shadow: none;
  transform: none;
}

input,
textarea,
select {
  border-color: #d9dee8;
  min-height: 38px;
  padding: 8px 10px;
}

input:focus,
textarea:focus,
select:focus {
  box-shadow: 0 0 0 3px rgba(15, 118, 110, .11);
}

.settings-icon {
  background: #f3f4f6;
  border-color: #e5e7eb;
  color: var(--muted);
  flex-basis: 34px;
  font-size: 11px;
  font-weight: 650;
  height: 34px;
}

.status,
.content-item header span,
.notice,
.source-meta span,
.agency-chip-list span,
.agency-item-analysis span,
.seoaip-item-analysis span,
.title-pill-row span,
.vi-badge,
.vi-contract {
  font-weight: 620;
}

.ui-icon {
  flex: 0 0 auto;
  height: 16px;
  width: 16px;
}

.nav-icon .ui-icon {
  height: 18px;
  width: 18px;
}

.brand-mark .ui-icon,
.settings-icon .ui-icon {
  height: 15px;
  width: 15px;
}

.toast {
  align-items: center;
  grid-template-columns: auto minmax(0, 1fr);
}

.tabs {
  align-items: center;
  background: #eef1f6;
  border: 1px solid var(--line);
  border-radius: 10px;
  display: inline-flex;
  gap: 3px;
  margin: 0 0 16px;
  max-width: 100%;
  overflow-x: auto;
  padding: 4px;
}

.tab-button {
  background: transparent;
  border: 0;
  color: var(--muted);
  min-height: 32px;
  padding: 6px 11px;
}

.tab-button:hover,
.tab-button.is-active {
  background: #ffffff;
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}

.tabs-host {
  display: block;
}

.tabs-host > [hidden] {
  display: none !important;
}

.tabs-host > .panel.is-active-tab {
  animation: page-enter 180ms ease both;
}

.settings-layout.tabs-host,
.jobs-layout.tabs-host {
  display: block;
}

.settings-layout.tabs-host .settings-actions {
  margin-top: 14px;
}

.accordion {
  display: grid;
  gap: 8px;
}

.provider-grid.accordion {
  grid-template-columns: minmax(0, 1fr);
}

.accordion-item {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 9px;
  box-shadow: none;
  overflow: hidden;
  padding: 0;
}

.accordion-trigger {
  align-items: center;
  background: #ffffff;
  border: 0;
  border-radius: 0;
  color: var(--ink);
  display: flex;
  justify-content: space-between;
  min-height: 42px;
  padding: 10px 12px;
  width: 100%;
}

.accordion-trigger span {
  font-weight: 620;
}

.accordion-trigger .ui-icon {
  color: var(--muted);
  transition: transform var(--transition);
}

.accordion-item.is-open .accordion-trigger .ui-icon {
  transform: rotate(180deg);
}

.accordion-content {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  padding: 12px;
}

.accordion-content[hidden] {
  display: none;
}

.datatable-tools {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin: 0 0 12px;
}

.datatable-search {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 8px;
  max-width: 340px;
  padding: 0 10px;
  width: 100%;
}

.datatable-search input {
  border: 0;
  box-shadow: none;
  min-height: 36px;
  padding-inline: 0;
}

.datatable-search input:focus {
  box-shadow: none;
}

.datatable-actions {
  align-items: center;
  color: var(--muted);
  display: flex;
  gap: 10px;
  font-size: 13px;
}

.datatable-actions label {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 7px;
}

.datatable-actions select {
  min-height: 34px;
  padding: 6px 24px 6px 9px;
  width: auto;
}

.datatable {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow-x: auto;
}

.datatable table {
  border-collapse: separate;
  border-spacing: 0;
}

.datatable th {
  background: #f9fafb;
  color: #6b7280;
  cursor: default;
  position: relative;
  user-select: none;
}

.datatable th.is-sortable {
  cursor: pointer;
  padding-right: 24px;
}

.datatable th.is-sortable::after {
  color: #9ca3af;
  content: "^";
  font-size: 11px;
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
}

.datatable th[data-sort="asc"]::after {
  content: "^";
}

.datatable th[data-sort="desc"]::after {
  content: "v";
}

.datatable td,
.datatable th {
  padding: 11px 12px;
}

.datatable tbody tr:hover {
  background: #f9fafb;
}

.datatable-pager {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin: 12px 0 0;
}

.datatable-pager span {
  color: var(--muted);
  font-size: 13px;
}

.datatable-pager button {
  min-height: 32px;
  padding: 6px 10px;
}

.datatable-pager button[disabled] {
  opacity: .45;
}

.adjuster-form {
  display: grid;
  gap: 16px;
  max-width: 1120px;
}

.adjuster-form textarea {
  min-height: 320px;
}

.gallery-uploader {
  display: grid;
  gap: 16px;
}

.gallery-uploader input[type="file"],
.ads-form input[type="file"] {
  background: #f9fafb;
  border-style: dashed;
  min-height: 52px;
  padding: 14px;
}

.ads-form {
  display: grid;
  gap: 16px;
}

.ads-form textarea {
  min-height: 140px;
  resize: vertical;
}

.ai-ads-form {
  display: grid;
  gap: 16px;
}

.ai-ads-form input[type="file"] {
  background: #f9fafb;
  border-style: dashed;
  min-height: 52px;
  padding: 14px;
}

.ai-ads-form input[type="color"] {
  min-height: 42px;
  padding: 6px;
}

.ai-ads-form textarea {
  min-height: 124px;
  resize: vertical;
}

.inline-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.insight-card {
  align-items: center;
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-top: 14px;
  padding: 12px 14px;
}

.insight-card span,
.muted {
  color: var(--muted);
}

.suggestion-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin-top: 16px;
}

.suggestion-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 14px;
}

.suggestion-card h3 {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
}

.suggestion-card p {
  color: var(--muted);
  margin: 0;
}

.suggestion-card small,
.suggestion-card em {
  color: #6b7280;
  font-size: 12px;
  font-style: normal;
}

.ad-thumb {
  aspect-ratio: 16 / 9;
  border: 1px solid var(--line);
  border-radius: 6px;
  display: block;
  max-width: 124px;
  object-fit: cover;
  width: 124px;
}

.metric-actions {
  display: flex;
  gap: 6px;
  margin-top: 8px;
}

.metric-actions button,
.export-links a {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  display: inline-flex;
  font-size: 12px;
  min-height: 28px;
  padding: 5px 8px;
  text-decoration: none;
}

.metric-actions button:hover,
.export-links a:hover {
  border-color: #9ca3af;
  box-shadow: var(--shadow-sm);
}

.export-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.product-filter {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(220px, 1.6fr) repeat(5, minmax(120px, 1fr)) auto;
  margin-bottom: 16px;
}

.mercado-livre-search {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(220px, 1fr) auto;
  margin-bottom: 16px;
}

.mercado-livre-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.mercado-livre-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-rows: auto 1fr auto;
  min-width: 0;
  padding: 12px;
}

.mercado-livre-card img,
.mercado-livre-empty {
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: block;
  object-fit: contain;
  width: 100%;
}

.mercado-livre-empty {
  align-items: center;
  background: var(--panel-subtle);
  color: var(--muted);
  display: flex;
  font-size: 13px;
  font-weight: 700;
  justify-content: center;
}

.mercado-livre-card strong,
.mercado-livre-card span,
.mercado-livre-card a {
  display: block;
}

.mercado-livre-card strong {
  font-size: 14px;
  line-height: 1.35;
}

.mercado-livre-card span {
  color: var(--primary-dark);
  font-weight: 800;
  margin-top: 4px;
}

.mercado-livre-card a {
  font-size: 13px;
  margin-top: 4px;
}

.mercado-livre-card form {
  display: grid;
  gap: 8px;
}

.product-cell {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 240px;
}

.product-cell img {
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 7px;
  object-fit: cover;
  width: 48px;
}

.affiliate-thumb {
  flex: 0 0 46px;
  height: 46px;
  width: 46px;
}

.affiliate-thumb-empty {
  align-items: center;
  background: var(--panel-subtle);
  color: var(--muted);
  display: inline-flex;
  font-size: 11px;
  font-weight: 700;
  justify-content: center;
  line-height: 1.1;
  text-align: center;
}

.product-cell small,
.product-actions small {
  color: var(--muted);
  display: block;
  margin-top: 3px;
}

.product-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.affiliate-bulk-actions {
  align-items: center;
  background: var(--panel-subtle);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 14px;
  padding: 10px;
}

.affiliate-bulk-actions span {
  color: var(--muted);
  font-weight: 700;
}

.affiliate-bulk-actions select {
  max-width: 220px;
}

.oauth-box {
  background: var(--panel-subtle);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding: 12px;
}

.oauth-box .settings-card-head {
  margin-bottom: 0;
}

.oauth-box .settings-actions {
  margin-top: 0;
}

.product-actions a,
.product-actions button {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  display: inline-flex;
  font-size: 12px;
  min-height: 28px;
  padding: 5px 8px;
  text-decoration: none;
}

.inline-upload {
  align-items: center;
  background: var(--panel-subtle);
  border: 1px dashed var(--line);
  border-radius: 7px;
  display: inline-flex;
  gap: 6px;
  max-width: 190px;
  min-height: 28px;
  padding: 4px 7px;
}

.inline-upload span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.inline-upload input[type="file"] {
  font-size: 11px;
  max-width: 92px;
}

.product-form,
.product-import {
  display: grid;
  gap: 16px;
}

.product-form input[type="file"],
.product-import input[type="file"] {
  background: #f9fafb;
  border-style: dashed;
  min-height: 52px;
  padding: 14px;
}

.product-import {
  border-top: 1px solid var(--line);
  margin-top: 18px;
  padding-top: 18px;
}

.import-columns,
.tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.import-columns code,
.tag-cloud span {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  padding: 6px 9px;
}

.favorite-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.favorite-product {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.favorite-product img {
  aspect-ratio: 16 / 10;
  border-radius: 7px;
  object-fit: cover;
  width: 100%;
}

.favorite-product span {
  color: var(--muted);
  font-size: 13px;
}

.favorite-product a {
  color: var(--ink);
  font-weight: 700;
  text-decoration: none;
}

.ranking-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 20px;
}

.ranking-list li {
  color: var(--muted);
}

.ranking-list strong {
  color: var(--ink);
  font-weight: 700;
}

.ranking-list span {
  display: block;
  font-size: 12px;
}

.affiliate-form {
  display: grid;
  gap: 16px;
}

.affiliate-result {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 16px;
  padding: 14px;
}

.affiliate-result div {
  display: grid;
  gap: 4px;
}

.affiliate-result span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.affiliate-result strong {
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
}

.affiliate-result label {
  grid-column: 1 / -1;
}

.affiliate-page-head {
  margin-bottom: 16px;
}

.affiliate-command-panel,
.affiliate-main-panel,
.affiliate-linked-panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
}

.affiliate-command-panel {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
  padding: 16px;
}

.affiliate-content-picker {
  align-items: end;
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.affiliate-content-picker label {
  display: grid;
  gap: 6px;
}

.affiliate-linked-summary {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  margin: -4px 0 2px;
}

.affiliate-content-picker label span,
.affiliate-overline,
.affiliate-step {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.affiliate-news-card {
  align-items: stretch;
  background: linear-gradient(135deg, #f8fafc, #ffffff);
  border: 1px solid var(--line);
  border-radius: 10px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) 230px;
  padding: 15px;
}

.affiliate-news-card h2 {
  font-size: 20px;
  line-height: 1.18;
  margin: 5px 0 12px;
}

.affiliate-news-card dl {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
}

.affiliate-news-card dt {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.affiliate-news-card dd {
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  margin: 3px 0 0;
  min-width: 0;
}

.affiliate-sync-box {
  align-content: center;
  background: #eefbf4;
  border: 1px solid #bfe8d2;
  border-radius: 9px;
  display: grid;
  gap: 7px;
  justify-items: start;
  padding: 14px;
}

.affiliate-sync-box strong {
  color: #087a2f;
  font-size: 34px;
  line-height: 1;
}

.affiliate-sync-box span {
  color: #315f43;
  font-size: 12px;
  font-weight: 800;
}

.affiliate-flow {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.affiliate-flow span {
  background: var(--panel-subtle);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  min-height: 38px;
  padding: 11px;
}

.affiliate-flow .is-active {
  background: #fff7e6;
  border-color: #f2c36b;
  color: #8a5b00;
}

.affiliate-flow .is-done {
  background: #eefbf4;
  border-color: #bfe8d2;
  color: #087a2f;
}

.affiliate-workbench {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr);
}

.affiliate-main-panel,
.affiliate-linked-panel {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.affiliate-linked-panel {
  position: static;
}

.affiliate-panel-head,
.affiliate-market-head {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.affiliate-panel-head h2,
.affiliate-market-head h3 {
  margin: 4px 0 0;
}

.affiliate-panel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.affiliate-market-head p {
  color: var(--muted);
  font-size: 13px;
  margin: 4px 0 0;
}

.affiliate-market-tabs {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr);
}

.affiliate-market-panel,
.affiliate-manual-panel {
  background: #fbfcfe;
  border: 1px solid var(--line);
  border-radius: 10px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.affiliate-search-bar {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.affiliate-result-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  padding: 2px;
}

.affiliate-market-card {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  display: grid;
  gap: 10px;
  grid-template-columns: 92px minmax(0, 1fr);
  padding: 10px;
}

.affiliate-market-card img,
.affiliate-product-empty {
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: block;
  object-fit: contain;
  width: 92px;
}

.affiliate-product-empty {
  align-items: center;
  background: var(--panel-subtle);
  color: var(--muted);
  display: flex;
  font-size: 11px;
  font-weight: 800;
  justify-content: center;
  line-height: 1.1;
  text-align: center;
}

.affiliate-market-info {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.affiliate-market-info strong {
  font-size: 13px;
  line-height: 1.28;
}

.affiliate-market-info span {
  color: #087a2f;
  font-weight: 900;
}

.affiliate-market-info a {
  font-size: 12px;
}

.affiliate-market-info small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.affiliate-add-form {
  grid-column: 1 / -1;
}

.affiliate-add-form .button {
  justify-content: center;
  width: 100%;
}

.affiliate-manual-panel summary {
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.affiliate-manual-panel .product-form {
  margin-top: 12px;
}

.affiliate-linked-list {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  padding: 2px;
}

.affiliate-linked-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  display: grid;
  gap: 10px;
  padding: 11px;
}

.affiliate-linked-card.is-ready {
  background: #f2fbf7;
  border-color: #9bd7ba;
  box-shadow: 0 0 0 1px rgba(4, 120, 87, .08);
}

.affiliate-linked-card.is-synced {
  background: #fbfcfd;
}

.affiliate-linked-main {
  display: grid;
  gap: 10px;
  grid-template-columns: 72px minmax(0, 1fr);
}

.affiliate-linked-main img {
  aspect-ratio: 1;
  border: 1px solid var(--line);
  border-radius: 8px;
  object-fit: contain;
  width: 72px;
}

.affiliate-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 5px;
}

.affiliate-card-meta span {
  background: var(--panel-subtle);
  border-radius: 999px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  padding: 4px 7px;
}

.affiliate-card-meta .is-ok {
  background: #dcfce7;
  color: #166534;
}

.affiliate-card-meta .is-bad {
  background: #fee2e2;
  color: #991b1b;
}

.affiliate-linked-card h3 {
  font-size: 14px;
  line-height: 1.26;
  margin: 0;
}

.affiliate-linked-card p {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  margin: 4px 0;
}

.affiliate-linked-card strong {
  color: #087a2f;
}

.affiliate-linked-status {
  align-items: center;
  background: var(--panel-subtle);
  border-radius: 8px;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 12px;
  font-weight: 800;
  gap: 8px;
  padding: 8px;
}

.affiliate-linked-status small {
  color: #9a3412;
  font-weight: 700;
}

.affiliate-card-actions,
.affiliate-card-actions form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.affiliate-action-state {
  background: #dcfce7;
  border: 1px solid #b7ebc7;
  border-radius: 999px;
  color: #166534;
  font-size: 12px;
  font-weight: 900;
  padding: 6px 9px;
}

.affiliate-card-actions button,
.affiliate-edit-panel button {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
  min-height: 30px;
  padding: 6px 9px;
}

.affiliate-card-actions button.is-primary {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.affiliate-edit-panel summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}

.affiliate-edit-panel form {
  display: grid;
  gap: 7px;
  margin-top: 8px;
}

.affiliate-empty-state {
  align-items: center;
  background: var(--panel-subtle);
  border: 1px dashed var(--line);
  border-radius: 10px;
  color: var(--muted);
  display: grid;
  gap: 5px;
  grid-column: 1 / -1;
  min-height: 180px;
  padding: 18px;
  text-align: center;
}

.affiliate-empty-state strong {
  color: var(--ink);
}

@media (max-width: 960px) {
  .affiliate-content-picker,
  .affiliate-news-card,
  .affiliate-workbench,
  .affiliate-market-tabs {
    grid-template-columns: 1fr;
  }

  .affiliate-news-card dl,
  .affiliate-flow {
    grid-template-columns: 1fr 1fr;
  }

  .affiliate-linked-panel {
    position: static;
  }
}

@media (max-width: 620px) {
  .affiliate-news-card dl,
  .affiliate-flow,
  .affiliate-search-bar {
    grid-template-columns: 1fr;
  }

  .affiliate-market-card,
  .affiliate-linked-main {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .affiliate-market-card img,
  .affiliate-product-empty {
    width: 64px;
  }
}

.landing-workbench,
.landing-editor-grid {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(360px, .82fr) minmax(0, 1.18fr);
  margin-bottom: 18px;
}

.landing-form,
.landing-editor {
  display: grid;
  gap: 16px;
}

.landing-form input[type="file"],
.landing-editor input[type="file"] {
  background: #f9fafb;
  border-style: dashed;
  min-height: 52px;
  padding: 14px;
}

.landing-capture-fields {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin: 0;
  padding: 12px;
}

.landing-capture-fields legend {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  padding: 0 6px;
  text-transform: uppercase;
}

.landing-preview-panel {
  position: sticky;
  top: 18px;
}

.landing-preview-frame {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  max-height: 760px;
  overflow: auto;
}

.landing-html-editor {
  font-family: Consolas, "Liberation Mono", monospace;
  font-size: 13px;
  min-height: 460px;
}

.landing-side-stack {
  display: grid;
  gap: 18px;
}

.landing-section-actions {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.landing-block-generator {
  display: grid;
  gap: 14px;
}

.landing-block-checks {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.landing-section-actions form {
  margin: 0;
}

.landing-section-actions button {
  justify-content: flex-start;
  width: 100%;
}

.landing-image-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.landing-image-grid figure {
  margin: 0;
}

.landing-image-grid img {
  aspect-ratio: 16 / 10;
  border: 1px solid var(--line);
  border-radius: 7px;
  display: block;
  object-fit: cover;
  width: 100%;
}

.landing-image-grid figcaption,
.landing-side-stack small,
.landing-workbench small {
  color: var(--muted);
  display: block;
  font-size: 12px;
  margin-top: 4px;
}

.landing-side-stack td strong {
  color: var(--ink);
  display: block;
}

.landing-template-library {
  margin-bottom: 18px;
}

.landing-template-grid {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(320px, .75fr) minmax(0, 1.25fr);
}

.landing-template-upload {
  background: var(--surface-muted);
  border: 1px dashed var(--line);
  border-radius: 8px;
  display: grid;
  gap: 14px;
  padding: 14px;
}

.landing-template-upload input[type="file"] {
  background: #ffffff;
  border-style: dashed;
  min-height: 52px;
  padding: 14px;
}

.landing-template-list {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.landing-template-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 14px;
}

.landing-template-card strong {
  color: var(--ink);
  display: block;
}

.landing-template-card p {
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.landing-template-card form {
  margin: 0;
}

.landing-template-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.landing-template-tags span {
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  color: #3730a3;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 8px;
}

/* Landing page studio */
.landing-studio-hero {
  align-items: flex-end;
  background: linear-gradient(125deg, #16243d 0%, #263c67 62%, #35688b 100%);
  border-radius: 16px;
  color: #fff;
  display: flex;
  justify-content: space-between;
  margin-bottom: 18px;
  overflow: hidden;
  padding: 30px;
  position: relative;
}

.landing-studio-hero::after {
  background: radial-gradient(circle, rgba(115, 213, 190, .38), transparent 65%);
  content: "";
  height: 260px;
  position: absolute;
  right: -72px;
  top: -110px;
  width: 260px;
}

.landing-studio-hero > * { position: relative; z-index: 1; }
.landing-studio-hero h1 { color: #fff; font-size: clamp(28px, 3vw, 38px); margin: 4px 0 8px; }
.landing-studio-hero p { color: #d9e5f4; margin: 0; max-width: 620px; }
.landing-eyebrow, .landing-card-label { color: #237e86; display: block; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.landing-studio-hero .landing-eyebrow { color: #98e4d4; }
.landing-hero-actions, .landing-current-actions, .landing-preview-actions, .landing-editor-topbar-actions, .landing-dialog-form-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.landing-studio-hero .button:not(.primary) { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); color: #fff; }
.landing-studio-hero .button.primary { background: #a8ead4; border-color: #a8ead4; color: #123044; }

.landing-studio-kpis { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 22px; }
.landing-studio-kpis article { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); display: grid; gap: 3px; min-height: 112px; padding: 16px; }
.landing-studio-kpis span { color: var(--muted); font-size: 12px; font-weight: 750; }
.landing-studio-kpis strong { color: var(--ink); font-size: 29px; letter-spacing: -.05em; line-height: 1; }
.landing-studio-kpis small { color: var(--muted); font-size: 12px; }

.landing-studio-tabs { align-items: center; border-bottom: 1px solid var(--line); display: flex; gap: 6px; margin-bottom: 20px; overflow-x: auto; }
.landing-studio-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--muted); font-weight: 750; margin-bottom: -1px; padding: 12px 14px; white-space: nowrap; }
.landing-studio-tabs button:hover, .landing-studio-tabs button.is-active { color: var(--accent); }
.landing-studio-tabs button.is-active { border-bottom-color: var(--accent); }
.landing-studio-tabs button:disabled { cursor: not-allowed; opacity: .45; }
.landing-studio-view { animation: page-enter 180ms ease both; }

.landing-current-card, .landing-empty-state { align-items: center; background: linear-gradient(110deg, #f1f9f8, #f8fbff); border: 1px solid #cfe3e2; border-radius: 14px; display: flex; gap: 20px; justify-content: space-between; margin-bottom: 28px; padding: 20px 22px; }
.landing-current-main { align-items: flex-start; display: flex; gap: 13px; }
.landing-current-main h2, .landing-empty-state h2, .landing-section-header h2, .landing-library-head h2, .landing-editor-topbar h2 { margin: 3px 0 5px; }
.landing-current-main p, .landing-empty-state p, .landing-library-head p, .landing-editor-topbar p { color: var(--muted); margin: 0; }
.landing-empty-state { justify-content: flex-start; }
.landing-empty-icon { align-items: center; background: #d7f1e9; border-radius: 12px; color: #1b766b; display: inline-flex; flex: 0 0 auto; font-size: 28px; height: 48px; justify-content: center; width: 48px; }
.landing-section-header, .landing-library-head, .landing-editor-topbar, .landing-card-heading { align-items: flex-start; display: flex; gap: 14px; justify-content: space-between; }
.landing-section-header { margin-bottom: 14px; }

.landing-project-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.landing-project-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; display: flex; flex-direction: column; gap: 10px; min-height: 210px; padding: 16px; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.landing-project-card:hover { border-color: #80beb8; box-shadow: var(--shadow); transform: translateY(-2px); }
.landing-project-card.is-current { border: 2px solid #45a398; padding: 15px; }
.landing-project-head, .landing-project-meta { align-items: center; display: flex; gap: 8px; justify-content: space-between; }
.landing-project-date, .landing-project-card p, .landing-project-meta { color: var(--muted); font-size: 12px; }
.landing-project-card h3 { color: var(--ink); font-size: 16px; line-height: 1.3; margin: 4px 0 0; }
.landing-project-card > p { margin: 0; }
.landing-project-meta { border-top: 1px solid var(--line); margin-top: auto; padding-top: 10px; }
.landing-project-meta span:last-child { max-width: 52%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.landing-project-actions { display: flex; gap: 8px; }
.landing-project-actions .button:first-child { flex: 1; }
.button-icon { align-items: center; display: inline-flex; font-size: 18px; justify-content: center; padding: 0; width: 36px; }

.landing-editor-topbar { margin: 2px 0 18px; }
.landing-editor-layout { align-items: start; display: grid; gap: 18px; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); }
.landing-editor-form { display: grid; gap: 18px; margin: 0; }
.landing-form-section-head { align-items: flex-start; display: flex; justify-content: space-between; }
.landing-form-section-head h3 { margin: 0 0 3px; }
.landing-form-section-head p { color: var(--muted); font-size: 13px; margin: 0; }
.landing-form-section-head > span { align-items: center; background: #e3f4f0; border-radius: 50%; color: #22796f; display: inline-flex; font-size: 12px; font-weight: 800; height: 28px; justify-content: center; width: 28px; }
.landing-details { background: #fafcfd; border: 1px solid var(--line); border-radius: 10px; }
.landing-details summary, .landing-sidebar-details > summary { align-items: center; cursor: pointer; display: flex; font-weight: 760; justify-content: space-between; list-style: none; padding: 13px 14px; }
.landing-details summary::-webkit-details-marker, .landing-sidebar-details > summary::-webkit-details-marker { display: none; }
.landing-details summary::after, .landing-sidebar-details > summary::after { color: var(--muted); content: "+"; font-size: 19px; font-weight: 400; margin-left: 10px; }
.landing-details[open] summary::after, .landing-sidebar-details[open] > summary::after { content: "−"; }
.landing-details summary small, .landing-sidebar-details summary small { color: var(--muted); font-size: 11px; font-weight: 650; margin-left: auto; text-transform: uppercase; }
.landing-details-content { border-top: 1px solid var(--line); display: grid; gap: 14px; padding: 14px; }
.landing-tracking-grid { margin-bottom: 0; }
.landing-html-editor { background: #111b27; border-color: #26394b; color: #dceeff; min-height: 420px; }
.landing-editor-save { align-items: center; display: flex; gap: 12px; justify-content: space-between; }
.landing-editor-save span { color: var(--muted); font-size: 12px; }
.landing-editor-sidebar { display: grid; gap: 14px; position: sticky; top: 18px; }
.landing-editor-sidebar .panel { margin: 0; }
.landing-card-heading h3 { margin: 3px 0 0; }
.landing-card-heading p { color: var(--muted); font-size: 13px; margin: 6px 0 0; }
.landing-preview-frame { aspect-ratio: 16 / 10; margin: 14px 0; max-height: none; }
.landing-preview-frame iframe { background: #fff; border: 0; display: block; height: 100%; width: 100%; }
.landing-preview-actions { border-top: 1px solid var(--line); padding-top: 12px; }
.landing-ai-card { display: grid; gap: 9px; }
.landing-ai-card .button { justify-content: center; }
.landing-sidebar-details { margin: 0; padding: 0; }
.landing-sidebar-details > summary { padding: 15px 16px; }
.landing-sidebar-details[open] > summary { border-bottom: 1px solid var(--line); }
.landing-sidebar-details .landing-image-grid, .landing-leads-list, .landing-log-list { padding: 14px; }
.landing-leads-list, .landing-log-list { display: grid; gap: 10px; }
.landing-leads-list article, .landing-log-list article { border-bottom: 1px solid var(--line); display: grid; gap: 3px; padding-bottom: 10px; }
.landing-leads-list article:last-child, .landing-log-list article:last-child { border-bottom: 0; padding-bottom: 0; }
.landing-leads-list span, .landing-leads-list p, .landing-leads-list small, .landing-log-list p { color: var(--muted); font-size: 12px; margin: 0; }
.landing-log-list article { align-items: center; grid-template-columns: auto 1fr; }
.landing-log-list p { grid-column: 1 / -1; }

.landing-library-head { background: #f5f8fc; border: 1px solid var(--line); border-radius: 12px; margin-bottom: 16px; padding: 20px; }
.landing-template-library-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); }
.landing-template-library-grid .landing-template-card { border-radius: 12px; min-height: 238px; }
.landing-template-card h3 { margin: 0; }
.landing-template-card-head { align-items: center; display: flex; justify-content: space-between; }
.landing-template-icon { align-items: center; background: #e9effe; border-radius: 8px; color: #39448c; display: inline-flex; font-family: Consolas, monospace; font-size: 12px; font-weight: 800; height: 30px; justify-content: center; width: 36px; }
.landing-template-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.landing-template-actions form { margin: 0; }
.landing-library-empty { align-items: center; background: #fbfcfd; border: 1px dashed #a7bdc9; border-radius: 12px; display: flex; flex-direction: column; grid-column: 1 / -1; padding: 44px 20px; text-align: center; }
.landing-library-empty > span { color: #4a8c9a; font-family: Consolas, monospace; font-size: 30px; }
.landing-library-empty h3 { margin: 8px 0 4px; }
.landing-library-empty p { color: var(--muted); margin: 0 0 14px; }

.landing-dialog { background: transparent; border: 0; max-height: calc(100dvh - 32px); max-width: min(860px, calc(100vw - 28px)); padding: 0; width: 100%; }
.landing-dialog::backdrop { background: rgba(9, 19, 33, .58); backdrop-filter: blur(3px); }
.landing-dialog-shell { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,.28); max-height: calc(100dvh - 32px); overflow: auto; }
.landing-dialog-shell > header { align-items: flex-start; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 20px 22px; }
.landing-dialog-shell > header h2 { margin: 3px 0 4px; }
.landing-dialog-shell > header p { color: var(--muted); margin: 0; }
.landing-dialog-close { align-items: center; background: #f1f4f6; border: 0; border-radius: 50%; color: var(--ink); display: inline-flex; font-size: 24px; height: 30px; justify-content: center; line-height: 1; padding: 0 0 3px; width: 30px; }
.landing-dialog-body { display: grid; gap: 18px; padding: 20px 22px; }
.landing-dialog-shell > footer { align-items: center; background: #f8fafb; border-top: 1px solid var(--line); display: flex; justify-content: space-between; padding: 14px 22px; }
.landing-dialog-shell > footer span, .landing-form-hint { color: var(--muted); font-size: 12px; margin: 0; }
.landing-dialog-compact { max-width: min(590px, calc(100vw - 28px)); }
.landing-block-checks { gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.landing-block-option { align-items: center; background: #f7fafb; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; display: flex; font-size: 13px; font-weight: 650; gap: 8px; padding: 11px; }
.landing-block-option:has(input:checked) { background: #eef9f5; border-color: #80cabe; color: #175f58; }
.landing-dialog-form-actions { justify-content: flex-end; }
.landing-regenerate-grid { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.landing-regenerate-grid form, .landing-publish-options { margin: 0; }
.landing-regenerate-grid .button, .landing-publish-options .button { justify-content: flex-start; width: 100%; }
.landing-publish-options { display: grid; gap: 10px; }
.landing-publish-options p { color: var(--muted); margin: 0 0 4px; }

/* Product bank studio */
.product-studio-hero { align-items: flex-end; background: linear-gradient(125deg, #251d42, #40306d 58%, #72534a); border-radius: 16px; color: #fff; display: flex; justify-content: space-between; margin-bottom: 18px; overflow: hidden; padding: 30px; position: relative; }
.product-studio-hero::after { background: radial-gradient(circle, rgba(255, 204, 126, .38), transparent 66%); content: ""; height: 270px; position: absolute; right: -65px; top: -105px; width: 270px; }
.product-studio-hero > * { position: relative; z-index: 1; }
.product-studio-hero h1 { color: #fff; font-size: clamp(28px, 3vw, 38px); margin: 4px 0 8px; }
.product-studio-hero p { color: #e6e0f2; margin: 0; max-width: 650px; }
.product-eyebrow { color: #8a5b25; display: block; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.product-studio-hero .product-eyebrow { color: #ffd28f; }
.product-hero-actions, .product-card-actions, .marketplace-result-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.product-studio-hero .button:not(.primary) { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); color: #fff; }
.product-studio-hero .button.primary { background: #ffda9c; border-color: #ffda9c; color: #352143; }

.product-studio-kpis { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 22px; }
.product-studio-kpis article { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); display: grid; gap: 3px; min-height: 112px; padding: 16px; }
.product-studio-kpis span, .product-studio-kpis small { color: var(--muted); font-size: 12px; }
.product-studio-kpis span { font-weight: 750; }
.product-studio-kpis strong { color: var(--ink); font-size: 25px; letter-spacing: -.045em; line-height: 1.1; }

.product-studio-tabs { align-items: center; border-bottom: 1px solid var(--line); display: flex; gap: 6px; margin-bottom: 20px; overflow-x: auto; }
.product-studio-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--muted); font-weight: 750; margin-bottom: -1px; padding: 12px 14px; white-space: nowrap; }
.product-studio-tabs button span { background: #e8ecf1; border-radius: 999px; font-size: 11px; margin-left: 4px; padding: 2px 6px; }
.product-studio-tabs button:hover, .product-studio-tabs button.is-active { color: #6a3f9b; }
.product-studio-tabs button.is-active { border-bottom-color: #6a3f9b; }
.product-studio-view { animation: page-enter 180ms ease both; }

.product-catalog-head, .marketplace-search-hero { align-items: flex-start; background: #faf8fd; border: 1px solid #e3ddef; border-radius: 12px; display: flex; gap: 14px; justify-content: space-between; margin-bottom: 14px; padding: 20px; }
.product-catalog-head h2, .marketplace-search-hero h2 { margin: 3px 0 5px; }
.product-catalog-head p, .marketplace-search-hero p { color: var(--muted); margin: 0; }
.product-filter-panel { background: #fff; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 12px; }
.product-filter-panel summary { align-items: center; cursor: pointer; display: flex; font-size: 13px; font-weight: 750; justify-content: space-between; list-style: none; padding: 13px 15px; }
.product-filter-panel summary::-webkit-details-marker, .product-card-more summary::-webkit-details-marker { display: none; }
.product-filter-panel summary::after, .product-card-more summary::after { color: var(--muted); content: "+"; font-size: 18px; font-weight: 400; margin-left: 9px; }
.product-filter-panel[open] summary::after, .product-card-more[open] summary::after { content: "−"; }
.product-filter-panel summary small { color: #7f4991; font-size: 11px; font-weight: 700; margin-left: auto; text-transform: uppercase; }
.product-filter-panel .product-filter { border-top: 1px solid var(--line); margin: 0; padding: 14px; }
.product-catalog-toolbar { align-items: center; color: var(--muted); display: flex; font-size: 12px; justify-content: space-between; margin: 13px 2px; }
.product-catalog-toolbar a { font-weight: 700; }
.product-catalog-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.product-catalog-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; display: grid; grid-template-columns: 1fr; min-width: 0; overflow: hidden; transition: box-shadow 160ms ease, border-color 160ms ease, transform 160ms ease; }
.product-catalog-card:hover { border-color: #ae91cc; box-shadow: var(--shadow); transform: translateY(-2px); }
.product-catalog-card.is-inactive { opacity: .7; }
.product-card-media { align-items: center; aspect-ratio: 16 / 10; background: #fafafa; border-bottom: 1px solid var(--line); display: flex; min-height: 0; overflow: hidden; position: relative; }
.product-card-media img { height: 100%; object-fit: contain; width: 100%; }
.product-card-media > span { color: var(--muted); font-size: 11px; margin: auto; text-align: center; }
.product-card-media b { background: #b24b4b; border-radius: 0 7px 7px 0; color: #fff; font-size: 10px; left: 0; padding: 4px 6px; position: absolute; top: 8px; }
.product-card-content { display: flex; flex-direction: column; gap: 7px; padding: 13px; }
.product-card-top { align-items: center; display: flex; justify-content: space-between; }
.product-card-top form { margin: 0; }
.product-favorite-button { background: transparent; border: 0; color: #c6ccd4; font-size: 20px; line-height: 1; padding: 0; }
.product-favorite-button.is-favorite, .product-favorite-button:hover { color: #e4a72c; }
.product-card-marketplace:not(.product-marketplace-badge) { display: none; }
.product-card-marketplace { color: #6a3f9b; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.product-marketplace-badge { align-items: center; align-self: flex-start; background: #f6f2fb; border: 1px solid #e1d7ef; border-radius: 999px; color: #553181; display: inline-flex; font-size: 10px; gap: 5px; line-height: 1; max-width: 100%; padding: 3px 7px 3px 4px; text-transform: none; }
.product-marketplace-badge > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.marketplace-logo { align-items: center; border-radius: 5px; display: inline-flex; flex: 0 0 16px; font-size: 7px; font-weight: 900; height: 16px; justify-content: center; width: 16px; }
.marketplace-logo img { display: block; height: 16px; object-fit: contain; width: 34px; }
.marketplace-logo-icon { height: 14px; width: 14px; }
.product-marketplace-badge.is-shopee { background: #fff3ee; border-color: #ffd0bf; color: #ee4d2d; }
.product-marketplace-badge.is-shopee .marketplace-logo { background: #ee4d2d; color: #fff; }
.product-marketplace-badge.is-ml { background: #fff9d6; border-color: #f5dc62; color: #4c4215; }
.product-marketplace-badge.is-ml .marketplace-logo { background: transparent; border-radius: 0; color: #2d3277; flex-basis: 34px; letter-spacing: 0; width: 34px; }
.product-catalog-card h3 { color: var(--ink); display: -webkit-box; font-size: 15px; line-height: 1.3; margin: 0; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.product-catalog-card p { color: var(--muted); font-size: 12px; line-height: 1.35; margin: 0; }
.product-card-price { align-items: baseline; display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; }
.product-card-price strong { color: #1c674e; font-size: 15px; }
.product-card-price span { color: var(--muted); font-size: 11px; }
.product-card-meta { border-top: 1px solid var(--line); color: var(--muted); display: flex; font-size: 11px; gap: 7px; justify-content: space-between; padding-top: 8px; }
.product-card-meta span { max-width: 55%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-card-actions { align-items: stretch; display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 4px; }
.product-card-actions > .button, .product-card-actions form, .product-card-actions form .button { min-width: 0; width: 100%; }
.product-card-actions > .button, .product-card-actions form .button { font-size: 12px; justify-content: center; line-height: 1.2; min-height: 38px; padding: 8px 9px; text-align: center; white-space: normal; }
.product-card-actions > .button:first-child { grid-column: 1 / -1; }
.product-card-actions form { margin: 0; }
.product-card-actions form[action$="/landing-page"] { grid-column: 1 / 2; }
.product-card-actions .product-prime-button { grid-column: 2 / 3; min-width: 0; width: 100%; }
.product-card-more { border-top: 1px solid var(--line); margin-top: 2px; }
.product-card-more summary { align-items: center; cursor: pointer; display: flex; font-size: 11px; font-weight: 800; justify-content: space-between; list-style: none; padding-top: 10px; }
.product-card-more > div { display: grid; gap: 7px; padding-top: 9px; }
.product-card-more form { display: grid; gap: 7px; margin: 0; }
.product-card-more form[action*="/metric"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-card-more button { align-items: center; background: #f8fafc; border: 1px solid #dce3eb; border-radius: 7px; color: #52606d; display: inline-flex; font-size: 11px; justify-content: center; line-height: 1.2; min-height: 36px; padding: 7px 8px; text-align: center; white-space: normal; width: 100%; }
.product-card-more button:hover { background: #eef4f7; border-color: #c8d5df; color: #253443; }
.product-media-capture-note { color: var(--muted); font-size: 11px; line-height: 1.4; margin: 0; }
.product-catalog-empty { align-items: center; background: #fbfcfd; border: 1px dashed #a9b4c3; border-radius: 12px; display: flex; flex-direction: column; grid-column: 1 / -1; padding: 48px 20px; text-align: center; }
.product-catalog-empty > span { color: #7951a4; font-size: 34px; }
.product-catalog-empty h3 { margin: 8px 0 4px; }
.product-catalog-empty p { color: var(--muted); margin: 0 0 14px; }
.product-catalog-empty div { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }

.marketplace-search-hero { background: linear-gradient(110deg, #fffaf0, #fff); border-color: #efdfbc; }
.marketplace-source-status { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }
.marketplace-source-note { color: var(--muted); font-size: 13px; margin: -5px 0 14px; }
.marketplace-search-form { align-items: stretch; display: flex; gap: 9px; margin-bottom: 16px; }
.marketplace-search-form input { flex: 1; }
.product-search-summary { align-items: center; background: #f2fbf7; border: 1px solid #b9dfcd; border-radius: 10px; color: #145c43; display: flex; gap: 10px; justify-content: space-between; margin: -5px 0 16px; padding: 11px 14px; }
.product-search-summary span { color: #467263; font-size: 13px; }
.product-search-empty { align-items: center; background: #fbfcfd; border: 1px dashed #b9c4d0; border-radius: 11px; display: flex; flex-direction: column; gap: 5px; margin-bottom: 16px; padding: 38px 18px; text-align: center; }
.product-search-empty span { color: var(--muted); font-size: 13px; }
.marketplace-result-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); }
.marketplace-result-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; display: grid; overflow: hidden; }
.marketplace-result-image { align-items: center; background: #fff; display: flex; height: 180px; justify-content: center; }
.marketplace-result-image img { height: 100%; object-fit: contain; width: 100%; }
.marketplace-result-image span { color: var(--muted); font-size: 12px; }
.marketplace-result-content { display: grid; gap: 9px; padding: 14px; }
.marketplace-result-content h3 { color: var(--ink); font-size: 14px; line-height: 1.35; margin: 0; }
.marketplace-result-content > strong { color: #1c674e; font-size: 17px; }
.marketplace-result-actions .button { font-size: 12px; justify-content: center; }

.product-insights-layout { align-items: start; display: grid; gap: 18px; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); }
.product-insight-wide { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 18px; }
.product-insight-wide .product-catalog-head { background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; margin: 0 0 14px; padding: 0 0 13px; }
.product-favorite-grid { display: grid; gap: 10px; }
.product-favorite-grid > article { align-items: center; border: 1px solid var(--line); border-radius: 10px; display: grid; gap: 12px; grid-template-columns: 64px 1fr; padding: 10px; }
.product-favorite-grid > article > div { align-items: center; background: #fbfbfb; border-radius: 7px; display: flex; height: 64px; justify-content: center; overflow: hidden; }
.product-favorite-grid img { height: 100%; object-fit: contain; width: 100%; }
.product-favorite-grid > article > div span { color: var(--muted); font-size: 10px; text-align: center; }
.product-favorite-grid section { display: grid; gap: 4px; }
.product-favorite-grid section > span { color: #6a3f9b; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.product-favorite-grid h3 { font-size: 14px; margin: 0; }
.product-favorite-grid strong { color: #1c674e; font-size: 13px; }
.product-favorite-grid section > div { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; }
.product-favorite-grid form { margin: 0; }
.product-favorite-grid .button { font-size: 11px; min-height: 28px; padding: 5px 8px; }
.product-insight-stack { display: grid; gap: 14px; }
.product-insight-stack .panel { margin: 0; }
.product-insight-stack h3 { margin: 5px 0 12px; }
.product-campaign-list { display: grid; gap: 7px; }
.product-campaign-list > div { align-items: center; background: #f7f8fa; border-radius: 7px; display: flex; font-size: 12px; justify-content: space-between; padding: 8px 9px; }
.product-campaign-list strong { color: #6a3f9b; }

.product-dialog { background: transparent; border: 0; max-height: calc(100dvh - 32px); max-width: min(760px, calc(100vw - 28px)); padding: 0; width: 100%; }
.product-dialog::backdrop { background: rgba(14, 12, 27, .58); backdrop-filter: blur(3px); }
.product-dialog-shell { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,.28); max-height: calc(100dvh - 32px); overflow: auto; }
.product-dialog-shell > header { align-items: flex-start; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 20px 22px; }
.product-dialog-shell > header h2 { margin: 3px 0 4px; }
.product-dialog-shell > header p { color: var(--muted); margin: 0; }
.product-dialog-close { align-items: center; background: #f1f1f4; border: 0; border-radius: 50%; color: var(--ink); display: inline-flex; font-size: 24px; height: 30px; justify-content: center; line-height: 1; padding: 0 0 3px; width: 30px; }
.product-dialog-body { display: grid; gap: 16px; padding: 20px 22px; }
.product-auto-flow { background: #f2fbf7; border: 1px solid #b9dfcd; border-radius: 10px; display: grid; gap: 4px; padding: 12px 14px; }
.product-auto-flow strong { color: #145c43; font-size: 13px; }
.product-auto-flow span { color: #467263; font-size: 12px; line-height: 1.45; }
.product-dialog-shell > footer { align-items: center; background: #f8fafb; border-top: 1px solid var(--line); display: flex; justify-content: space-between; padding: 14px 22px; }
.product-dialog-shell > footer span, .product-dialog-hint { color: var(--muted); font-size: 12px; margin: 0; }
.product-dialog-compact { max-width: min(570px, calc(100vw - 28px)); }
.product-dialog-label { color: var(--muted); display: block; font-size: 12px; font-weight: 700; margin-bottom: 7px; text-transform: uppercase; }
.product-creative-button { background: #f5f0ff; border-color: #d9caef; color: #5c3d89; }
.product-creative-tools { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-creative-tools form { align-items: end; background: #f8fafb; border: 1px solid #dbe5e8; border-radius: 10px; display: grid; gap: 9px; grid-template-columns: minmax(0, 1fr) auto; margin: 0; padding: 11px; }
.product-creative-tools label { display: grid; gap: 5px; min-width: 0; }
.product-creative-tools label span { color: #41616a; font-size: 11px; font-weight: 750; }
.product-creative-tools input { min-width: 0; }
.product-creative-tools .button { font-size: 11px; min-height: 33px; padding: 6px 9px; }
.product-creative-note { color: var(--muted); font-size: 12px; line-height: 1.45; margin: -3px 0 0; }
.product-creative-placement { color: #356a66 !important; overflow: visible !important; text-overflow: clip !important; white-space: normal !important; }
.product-media-preview video { border: 0; height: 100%; min-height: 142px; object-fit: cover; width: 100%; }
.product-media-button { align-items: center; background: #eff8fa; border-color: #c5e1e7; color: #1d6070; display: inline-flex; gap: 5px; justify-content: center; }.product-media-button .ui-icon { height: 15px; width: 15px; }.product-media-button span { background: #d5edf1; border-radius: 999px; font-size: 10px; font-weight: 800; line-height: 1; padding: 3px 5px; }.product-media-dialog { max-width: min(1040px, calc(100vw - 28px)); }.product-media-dialog-summary { color: #41616a; font-size: 12px; font-weight: 700; }.product-media-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }.product-media-item { background: #fbfcfd; border: 1px solid #dce7ea; border-radius: 12px; display: grid; grid-template-columns: 172px minmax(0, 1fr); min-height: 142px; overflow: hidden; }.product-media-preview { align-items: center; background: #eaf3f5; display: flex; justify-content: center; min-height: 100%; overflow: hidden; }.product-media-preview img { height: 100%; object-fit: cover; width: 100%; }.product-media-preview iframe { border: 0; height: 100%; min-height: 142px; width: 100%; }.product-media-preview > span { color: #54717a; font-size: 12px; font-weight: 700; }.product-media-item-content { align-content: start; display: grid; gap: 6px; padding: 13px; }.product-media-kind { color: #35717c; font-size: 10px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }.product-media-item-content h3 { font-size: 13px; line-height: 1.35; margin: 0; }.product-media-item-content p { color: var(--muted); font-size: 11px; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.product-media-item-content .button { font-size: 11px; justify-self: start; margin-top: 3px; padding: 6px 9px; }
.product-intelligence-layout { align-items: start; display: grid; gap: 18px; grid-template-columns: minmax(0, 1.1fr) minmax(280px, .6fr); }
.product-intelligence-form { display: grid; gap: 14px; margin: 0; }
.product-intelligence-guide { background: #f8f5fc; border-color: #e2d8ed; }
.product-intelligence-guide h2 { margin: 5px 0 10px; }.product-intelligence-guide ul { color: var(--muted); display: grid; gap: 7px; padding-left: 18px; }.product-intelligence-guide p { color: var(--muted); font-size: 12px; }
.product-intelligence-results { margin-top: 22px; }.product-intelligence-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(265px, 1fr)); }.product-intelligence-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; display: grid; gap: 10px; padding: 15px; }.product-intelligence-card h3 { margin: 7px 0 3px; }.product-intelligence-card p { color: var(--muted); font-size: 12px; margin: 0; }.product-intelligence-score { align-items: baseline; display: flex; gap: 3px; }.product-intelligence-score strong { color: #68409a; font-size: 32px; }.product-intelligence-score span { color: var(--muted); font-size: 12px; }.product-intelligence-bars { display: grid; gap: 6px; }.product-intelligence-bars span { align-items: center; color: var(--muted); display: grid; font-size: 11px; gap: 7px; grid-template-columns: 68px 1fr; }.product-intelligence-bars b { background: #61a99c; border-radius: 99px; display: block; height: 7px; }.product-intelligence-bars b.risk { background: #d98675; }.product-positive { color: #287162 !important; }.product-missing { color: #98643d !important; }
.product-market-dashboard { background: linear-gradient(135deg, #f4fbfc, #fbfcff); border: 1px solid #cfe4e8; border-radius: 14px; display: grid; gap: 15px; margin: 0 0 18px; padding: 18px; }.product-market-dashboard > header { align-items: flex-start; display: flex; gap: 14px; justify-content: space-between; }.product-market-dashboard h3 { color: #173f4a; margin: 4px 0 5px; }.product-market-dashboard header p { color: var(--muted); font-size: 12px; margin: 0; max-width: 650px; }.product-market-kpis { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }.product-market-kpis article { background: rgba(255, 255, 255, .9); border: 1px solid #dcebee; border-radius: 10px; display: grid; gap: 4px; min-height: 112px; padding: 13px; }.product-market-kpis span, .product-market-kpis small { color: var(--muted); font-size: 11px; }.product-market-kpis strong { color: #164c5a; font-size: 25px; line-height: 1.05; }.product-market-kpis strong.is-positive { color: #287162; }.product-market-kpis strong.is-negative { color: #b65e4d; }.product-market-insights { background: rgba(223, 243, 244, .58); border-radius: 10px; display: grid; gap: 15px; grid-template-columns: minmax(210px, .8fr) minmax(0, 1.2fr); padding: 13px 14px; }.product-market-insights p { color: #31535d; font-size: 12px; line-height: 1.55; margin: 5px 0 0; }.product-market-label { color: #4e7079; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.product-market-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }.product-market-chips span { background: #fff; border: 1px solid #c8e1e4; border-radius: 999px; color: #266170; font-size: 11px; padding: 5px 8px; }.product-market-empty { background: #fff8f0; border: 1px dashed #e5c99f; border-radius: 10px; color: #805e38; font-size: 12px; line-height: 1.45; padding: 12px 14px; }
@media (max-width: 760px) { .product-market-dashboard > header { align-items: flex-start; flex-direction: column; }.product-market-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }.product-market-insights { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .product-market-dashboard { padding: 14px; }.product-market-kpis { grid-template-columns: 1fr; }.product-market-kpis article { min-height: 88px; } }

/* Unified ads studio */
.ads-studio-hero { align-items: flex-end; background: linear-gradient(125deg, #142b36, #1c5665 58%, #5b6f44); border-radius: 16px; color: #fff; display: flex; justify-content: space-between; margin-bottom: 18px; overflow: hidden; padding: 30px; position: relative; }
.ads-studio-hero::after { background: radial-gradient(circle, rgba(192, 232, 118, .38), transparent 67%); content: ""; height: 270px; position: absolute; right: -72px; top: -110px; width: 270px; }
.ads-studio-hero > * { position: relative; z-index: 1; }
.ads-studio-hero h1 { color: #fff; font-size: clamp(28px, 3vw, 38px); margin: 4px 0 8px; }
.ads-studio-hero p { color: #dcf0ed; margin: 0; max-width: 620px; }
.ads-eyebrow, .ads-card-label { color: #277578; display: block; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.ads-studio-hero .ads-eyebrow { color: #c9ef9e; }
.ads-hero-actions, .ads-creative-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.ads-studio-hero .button:not(.primary) { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); color: #fff; }
.ads-studio-hero .button.primary { background: #d2f3a8; border-color: #d2f3a8; color: #17424d; }

.ads-studio-kpis { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 22px; }
.ads-studio-kpis article { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); display: grid; gap: 3px; min-height: 112px; padding: 16px; }
.ads-studio-kpis span, .ads-studio-kpis small { color: var(--muted); font-size: 12px; }
.ads-studio-kpis span { font-weight: 750; }
.ads-studio-kpis strong { color: var(--ink); font-size: 28px; letter-spacing: -.05em; line-height: 1; }
.ads-studio-tabs { align-items: center; border-bottom: 1px solid var(--line); display: flex; gap: 6px; margin-bottom: 20px; overflow-x: auto; }
.ads-studio-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; color: var(--muted); font-weight: 750; margin-bottom: -1px; padding: 12px 14px; white-space: nowrap; }
.ads-studio-tabs button span { background: #e1eeee; border-radius: 999px; font-size: 11px; margin-left: 4px; padding: 2px 6px; }
.ads-studio-tabs button:hover, .ads-studio-tabs button.is-active { color: #1c7073; }
.ads-studio-tabs button.is-active { border-bottom-color: #1c7073; }
.ads-studio-view { animation: page-enter 180ms ease both; }
.ads-library-head, .ads-planning-head, .ads-manual-hero { align-items: flex-start; background: #f3faf9; border: 1px solid #d2e6e4; border-radius: 12px; display: flex; gap: 14px; justify-content: space-between; margin-bottom: 16px; padding: 20px; }
.ads-library-head h2, .ads-planning-head h2, .ads-manual-hero h2 { margin: 3px 0 5px; }
.ads-library-head p, .ads-planning-head p, .ads-manual-hero p { color: var(--muted); margin: 0; }
.ads-creative-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); }
.ads-creative-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.ads-creative-card:hover { border-color: #7bb7ae; box-shadow: var(--shadow); transform: translateY(-2px); }
.ads-creative-preview { align-items: center; background: #f8fafb; display: flex; height: 172px; justify-content: center; overflow: hidden; position: relative; }
.ads-creative-preview img { height: 100%; object-fit: cover; width: 100%; }
.ads-creative-preview > span:not(.status) { color: var(--muted); font-size: 12px; }
.ads-creative-preview .status { position: absolute; right: 10px; top: 10px; }
.ads-creative-content { display: flex; flex-direction: column; gap: 7px; padding: 14px; }
.ads-creative-content h3 { color: var(--ink); font-size: 15px; line-height: 1.3; margin: 0; }
.ads-creative-content > p { color: var(--muted); font-size: 12px; margin: 0; }
.ads-creative-meta { border-top: 1px solid var(--line); color: var(--muted); display: flex; flex-wrap: wrap; font-size: 11px; gap: 5px 10px; justify-content: space-between; margin-top: 3px; padding-top: 9px; }
.ads-creative-actions { margin-top: 2px; }
.ads-creative-actions .button { flex: 1; font-size: 11px; justify-content: center; min-height: 29px; padding: 5px 7px; }
.ads-creative-more { border-top: 1px solid var(--line); margin-top: 2px; }
.ads-creative-more summary { cursor: pointer; font-size: 11px; font-weight: 700; list-style: none; padding-top: 9px; }
.ads-creative-more summary::-webkit-details-marker { display: none; }
.ads-creative-more summary::after { color: var(--muted); content: "+"; font-size: 18px; font-weight: 400; margin-left: 8px; }
.ads-creative-more[open] summary::after { content: "−"; }
.ads-creative-more form { display: flex; gap: 6px; margin: 8px 0 0; }
.ads-creative-more button { background: #f5f8f8; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 11px; padding: 5px 8px; }
.ads-empty-state { align-items: center; background: #fbfcfd; border: 1px dashed #9fbdba; border-radius: 12px; display: flex; flex-direction: column; grid-column: 1 / -1; padding: 48px 20px; text-align: center; }
.ads-empty-state > span { color: #2b807b; font-size: 30px; }
.ads-empty-state h3 { margin: 8px 0 4px; }
.ads-empty-state p { color: var(--muted); margin: 0 0 14px; }

.ads-content-picker { align-items: end; background: var(--panel); border: 1px solid var(--line); border-radius: 11px; display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr) auto; margin-bottom: 14px; padding: 15px; }
.ads-selected-content { background: #fffdf6; border: 1px solid #ecdfbb; border-radius: 10px; margin-bottom: 14px; padding: 14px; }
.ads-selected-content h3 { margin: 5px 0; }
.ads-selected-content p { color: var(--muted); font-size: 13px; margin: 0; }
.ads-suggestion-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(235px, 1fr)); }
.ads-suggestion-grid > article { background: var(--panel); border: 1px solid var(--line); border-radius: 11px; display: flex; flex-direction: column; gap: 8px; padding: 14px; }
.ads-suggestion-grid h3 { font-size: 16px; margin: 0; }
.ads-suggestion-grid p, .ads-suggestion-grid small, .ads-suggestion-grid em { color: var(--muted); font-size: 12px; font-style: normal; margin: 0; }
.ads-suggestion-grid .button { margin-top: auto; }
.ads-manual-hero { background: linear-gradient(110deg, #f8f4fe, #fff); border-color: #e2d9ef; }
.ads-position-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.ads-position-grid article { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 15px; }
.ads-position-icon { align-items: center; background: #ece6f8; border-radius: 8px; color: #604294; display: inline-flex; height: 30px; justify-content: center; width: 34px; }
.ads-position-grid h3 { font-size: 15px; margin: 10px 0; }
.ads-position-grid dl { display: grid; gap: 7px; margin: 0 0 12px; }
.ads-position-grid dl div { align-items: center; display: flex; font-size: 12px; justify-content: space-between; }
.ads-position-grid dt { color: var(--muted); }
.ads-position-grid dd { font-weight: 700; margin: 0; }
.ads-position-grid code { background: #f6f7f9; border-radius: 6px; display: block; font-size: 10px; overflow: auto; padding: 7px; white-space: nowrap; }

.ads-dialog { background: transparent; border: 0; max-height: calc(100dvh - 32px); max-width: min(850px, calc(100vw - 28px)); padding: 0; width: 100%; }
.ads-dialog::backdrop { background: rgba(8, 27, 31, .58); backdrop-filter: blur(3px); }
.ads-dialog-shell { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 80px rgba(0,0,0,.28); max-height: calc(100dvh - 32px); overflow: auto; }
.ads-dialog-shell > header { align-items: flex-start; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 20px 22px; }
.ads-dialog-shell > header h2 { margin: 3px 0 4px; }
.ads-dialog-shell > header p { color: var(--muted); margin: 0; }
.ads-dialog-close { align-items: center; background: #f1f4f4; border: 0; border-radius: 50%; color: var(--ink); display: inline-flex; font-size: 24px; height: 30px; justify-content: center; line-height: 1; padding: 0 0 3px; width: 30px; }
.ads-dialog-body { display: grid; gap: 18px; padding: 20px 22px; }
.ads-dialog-shell > footer { align-items: center; background: #f8fafb; border-top: 1px solid var(--line); display: flex; justify-content: space-between; padding: 14px 22px; }
.ads-dialog-shell > footer span { color: var(--muted); font-size: 12px; }
.ads-form-section-head { align-items: flex-start; display: flex; justify-content: space-between; }
.ads-form-section-head h3 { margin: 0 0 3px; }
.ads-form-section-head p { color: var(--muted); font-size: 13px; margin: 0; }
.ads-form-section-head > span { align-items: center; background: #e2f1ef; border-radius: 50%; color: #1f706d; display: inline-flex; font-size: 12px; font-weight: 800; height: 28px; justify-content: center; width: 28px; }
.ads-details { background: #fafcfc; border: 1px solid var(--line); border-radius: 10px; }
.ads-details summary { align-items: center; cursor: pointer; display: flex; font-weight: 760; justify-content: space-between; list-style: none; padding: 13px 14px; }
.ads-details summary::-webkit-details-marker { display: none; }
.ads-details summary::after { color: var(--muted); content: "+"; font-size: 19px; font-weight: 400; margin-left: 10px; }
.ads-details[open] summary::after { content: "−"; }
.ads-details summary small { color: var(--muted); font-size: 11px; font-weight: 650; margin-left: auto; text-transform: uppercase; }
.ads-details-content { border-top: 1px solid var(--line); display: grid; gap: 14px; padding: 14px; }
.ads-dialog .ads-form, .ads-dialog .ai-ads-form { gap: 0; margin: 0; }
.ads-dialog .ads-form input[type="file"], .ads-dialog .ai-ads-form input[type="file"] { background: #f9fafb; border-style: dashed; min-height: 52px; padding: 14px; }
.ads-media-fields { margin: 0; }

/* Settings control center */
.settings-studio-hero { align-items: flex-end; background: linear-gradient(125deg, #17243d, #2c4777 58%, #476b89); border-radius: 16px; color: #fff; display: flex; justify-content: space-between; margin-bottom: 18px; overflow: hidden; padding: 30px; position: relative; }
.settings-studio-hero::after { background: radial-gradient(circle, rgba(114, 193, 224, .4), transparent 66%); content: ""; height: 270px; position: absolute; right: -72px; top: -110px; width: 270px; }
.settings-studio-hero > * { position: relative; z-index: 1; }
.settings-studio-hero h1 { color: #fff; font-size: clamp(28px, 3vw, 38px); margin: 4px 0 8px; }
.settings-studio-hero p { color: #dceafa; margin: 0; max-width: 630px; }
.settings-eyebrow { color: #277c91; display: block; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.settings-studio-hero .settings-eyebrow { color: #9de3f3; }
.settings-hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.settings-studio-hero .button:not(.primary) { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); color: #fff; }
.settings-studio-hero .button.primary { background: #aee7f2; border-color: #aee7f2; color: #173c55; }
.settings-studio-kpis { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 22px; }
.settings-studio-kpis article { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); display: grid; gap: 3px; min-height: 112px; padding: 16px; }
.settings-studio-kpis span, .settings-studio-kpis small { color: var(--muted); font-size: 12px; }
.settings-studio-kpis span { font-weight: 750; }
.settings-studio-kpis strong { color: var(--ink); font-size: 22px; letter-spacing: -.035em; line-height: 1.15; }
.settings-studio-form { margin-bottom: 24px; }
.settings-studio-form .tabs { background: #edf3f7; border-radius: 11px; margin-bottom: 16px; padding: 4px; }
.settings-studio-form .tab-button { font-size: 13px; font-weight: 730; min-height: 36px; }
.settings-studio-form.tabs-host > .settings-card.is-active-tab { animation: page-enter 180ms ease both; }
.settings-studio-form .settings-card { border-radius: 13px; margin-bottom: 0; padding: 20px; }
.settings-studio-form .settings-card-head { border-bottom: 1px solid var(--line); margin-bottom: 4px; padding-bottom: 14px; }
.settings-studio-form .settings-icon { background: #e5f3f8; border-color: #c0e2eb; color: #267285; }
.settings-studio-form .provider-grid, .settings-studio-form .affiliate-settings-list { margin-top: 6px; }
.settings-studio-form .provider-box { border: 1px solid var(--line); border-radius: 9px; }
.ai-limit-box { background: #f7fafb; border: 1px solid var(--line); border-radius: 10px; margin-top: 16px; padding: 16px; }
.ai-limit-box .provider-title { margin-bottom: 12px; }
.ai-limit-box .provider-title p { margin: 4px 0 0; }
.ai-limit-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ai-limit-usage { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.ai-limit-usage span { background: #eaf3f6; border-radius: 999px; color: var(--muted); font-size: 12px; padding: 6px 10px; }
.ai-limit-usage strong { color: var(--ink); }
.settings-studio-form .accordion { gap: 9px; }
.settings-studio-form .accordion-item { background: var(--panel-subtle); border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.settings-studio-form .accordion-item .provider-box { background: transparent; border: 0; border-radius: 0; }
.settings-studio-form .accordion-trigger { background: #f7fafb; }
.settings-save-bar { align-items: center; background: #f4f9fb; border: 1px solid #d4e7ed; border-radius: 11px; justify-content: flex-end; margin: 16px 0 0; padding: 12px; }
.settings-save-bar .button.primary { min-width: 190px; justify-content: center; }
.settings-operations-head { align-items: flex-end; background: #f5f8fb; border: 1px solid var(--line); border-radius: 12px; display: flex; justify-content: space-between; margin: 0 0 14px; padding: 19px 20px; }
.settings-operations-head h2 { margin: 3px 0 5px; }
.settings-operations-head p { color: var(--muted); margin: 0; }
.settings-operation-card { margin-bottom: 16px; }
.settings-operation-card .settings-card-head { border-bottom: 1px solid var(--line); margin-bottom: 14px; padding-bottom: 13px; }
.settings-operation-card .provider-grid { align-items: end; }
.settings-operation-card .site-modules-form { background: #f8fafb; border: 1px solid var(--line); border-radius: 8px; padding: 10px; }

/* Editorial workflow */
.content-studio-hero { align-items: flex-end; background: linear-gradient(125deg, #263144, #3c5681 58%, #557a82); border-radius: 16px; color: #fff; display: flex; justify-content: space-between; margin-bottom: 18px; overflow: hidden; padding: 30px; position: relative; }
.content-studio-hero::after { background: radial-gradient(circle, rgba(150, 221, 194, .36), transparent 66%); content: ""; height: 260px; position: absolute; right: -70px; top: -110px; width: 260px; }
.content-studio-hero > * { position: relative; z-index: 1; }
.content-studio-hero h1 { color: #fff; font-size: clamp(27px, 3vw, 37px); margin: 4px 0 0; }
.content-eyebrow { color: #2b7c78; display: block; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.content-studio-hero .content-eyebrow { color: #a5e6d0; }
.content-hero-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.content-studio-hero .button:not(.primary) { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); color: #fff; }
.content-studio-hero .button.primary { background: #b5efd9; border-color: #b5efd9; color: #173a4b; }
.content-create-intro, .content-section-head { align-items: flex-start; display: flex; gap: 14px; justify-content: space-between; margin: 2px 0 14px; }
.content-create-intro { background: #f2f9f8; border: 1px solid #cce2df; border-radius: 12px; padding: 18px; }
.content-create-intro h2, .content-section-head h2 { margin: 3px 0 5px; }
.content-create-intro p, .content-section-head p { color: var(--muted); margin: 0; }
.content-create-intro > span { align-items: center; background: #d9f1eb; border-radius: 50%; color: #277871; display: inline-flex; font-size: 12px; font-weight: 800; height: 30px; justify-content: center; width: 30px; }
.content-create-form { border-radius: 12px; display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.content-create-form .writer-title-field { grid-column: 1 / -1; }
.content-create-form .button { justify-self: start; }
.content-library-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.content-library-grid .content-item { border-radius: 12px; margin: 0; padding: 16px; }
.content-library-grid .content-row { display: flex; flex-direction: column; gap: 13px; }
.content-library-grid .content-row-actions { align-items: stretch; display: grid; gap: 7px; margin-top: auto; }
.content-library-grid .content-row-actions .button { justify-content: center; width: 100%; }
.content-publish-panel { border-radius: 12px; }
.content-publish-panel table { margin-top: 6px; }
.content-table-head { border-bottom: 1px solid var(--line); margin-bottom: 12px; padding-bottom: 12px; }
.content-table-head h2 { margin: 3px 0 0; }
.content-adjuster-form { border-radius: 12px; }
.content-adjuster-note { background: #f4f9f8; border-color: #d2e5e1; border-radius: 12px; }
.content-adjuster-note h2 { margin: 4px 0 8px; }

/* Consistent shell for the remaining workspace pages */
.main > .page-head { background: linear-gradient(125deg, #1d3048, #355a78 60%, #4b7b78); border-radius: 16px; color: #fff; margin-bottom: 18px; overflow: hidden; padding: 25px 28px; position: relative; }
.main > .page-head::after { background: radial-gradient(circle, rgba(147, 224, 196, .28), transparent 68%); content: ""; height: 230px; position: absolute; right: -65px; top: -90px; width: 230px; }
.main > .page-head > * { position: relative; z-index: 1; }
.main > .page-head h1 { color: #fff; font-size: clamp(25px, 2.8vw, 35px); margin: 3px 0 0; }
.main > .page-head p { color: #bcebdc; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.main > .page-head .button:not(.primary) { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.28); color: #fff; }
.main > .page-head .button.primary { background: #b9efd9; border-color: #b9efd9; color: #173b4b; }
.main > .metrics { gap: 12px; margin-bottom: 22px; }
.main > .metrics .metric { border-radius: 12px; min-height: 104px; padding: 16px; }
.main > .metrics .metric strong { font-size: 25px; letter-spacing: -.04em; }
.main .tabs { background: #edf3f5; border-radius: 11px; padding: 4px; }
.main .tab-button { font-size: 13px; font-weight: 730; min-height: 36px; }
.main .form-grid > .panel, .main .content-list > .content-item { border-radius: 12px; }
.main .form-grid > .panel > h2, .main .panel > h2:first-child { border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.main .content-list > .content-item { transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.main .content-list > .content-item:hover { border-color: #83b9b3; box-shadow: var(--shadow); transform: translateY(-2px); }
.button.danger { background: var(--danger-soft); border-color: #fecdd3; color: #9f1239; }
.button.danger:hover { background: #fecdd3; border-color: #fda4af; color: #881337; }
.affiliate-accounts-head { align-items: center; margin-bottom: 14px; }
.affiliate-account-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 14px; }
.affiliate-account-metrics .metric { min-height: 84px; padding: 14px 16px; }
.affiliate-account-metrics .metric strong { font-size: 24px; }
.affiliate-account-create, .affiliate-account-directory { border-radius: 8px; margin-bottom: 14px; padding: 18px; }
.affiliate-account-create { padding: 0; }
.affiliate-account-create-summary { align-items: center; cursor: pointer; display: flex; gap: 16px; justify-content: space-between; list-style: none; min-height: 66px; padding: 14px 18px; }
.affiliate-account-create-summary::-webkit-details-marker { display: none; }
.affiliate-account-create-summary h2 { border: 0 !important; font-size: 17px; margin: 2px 0 0; padding: 0 !important; }
.affiliate-account-create-summary:hover { background: #fbfdfd; }
.affiliate-account-create-meta { align-items: center; display: flex; gap: 10px; }
.affiliate-account-create-meta > .ui-icon { color: #5f747c; height: 16px; transition: transform 150ms ease; width: 16px; }
.affiliate-account-create[open] .affiliate-account-create-meta > .ui-icon { transform: rotate(180deg); }
.affiliate-account-create[open] .affiliate-account-create-summary { border-bottom: 1px solid #e1e8eb; }
.affiliate-account-create > .affiliate-account-form { padding: 16px 18px 18px; }
.affiliate-account-section-head { align-items: center; display: flex; gap: 22px; justify-content: space-between; margin-bottom: 16px; }
.affiliate-account-section-head h2 { border: 0 !important; font-size: 17px; margin: 2px 0 0; padding: 0 !important; }
.affiliate-account-title-line { align-items: center; display: flex; gap: 9px; margin-top: 2px; }
.affiliate-account-count { background: #edf3f5; border-radius: 999px; color: #46636c; font-size: 10px; font-weight: 800; padding: 4px 8px; white-space: nowrap; }
.affiliate-account-form { align-items: end; display: grid; gap: 10px; grid-template-columns: 1.05fr 1.65fr 1.2fr 1fr .9fr; }
.affiliate-account-form label { margin: 0; min-width: 0; }
.affiliate-account-form input { min-height: 38px; }
.affiliate-account-notes { grid-column: span 3; }
.affiliate-account-check { align-self: center; min-height: 38px; }
.affiliate-account-form > .button { justify-content: center; min-height: 38px; }
.affiliate-account-search { align-items: center; display: flex; flex: 0 1 600px; gap: 8px; justify-content: flex-end; margin: 0; }
.affiliate-account-search-field { align-items: center; display: flex; flex: 1; margin: 0; min-width: 240px; position: relative; }
.affiliate-account-search-field > span { color: #60747d; display: inline-flex; left: 11px; pointer-events: none; position: absolute; z-index: 1; }
.affiliate-account-search-field .ui-icon { height: 16px; width: 16px; }
.affiliate-account-search-field input { min-height: 38px; padding-left: 36px; width: 100%; }
.affiliate-account-search-button, .affiliate-account-clear { min-height: 38px; }
.affiliate-account-table { border: 1px solid #dbe4e8; border-radius: 8px; overflow: hidden; }
.affiliate-account-table-head, .affiliate-account-row-main { display: grid; grid-template-columns: minmax(160px, 1.05fr) minmax(190px, 1.22fr) minmax(250px, 1.55fr) minmax(130px, .8fr) 188px; }
.affiliate-account-table-head { background: #f3f6f7; border-bottom: 1px solid #dbe4e8; color: #64777f; font-size: 10px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.affiliate-account-table-head span { padding: 10px 14px; }
.affiliate-account-row { background: #fff; border-bottom: 1px solid #e1e8eb; }
.affiliate-account-row:last-child { border-bottom: 0; }
.affiliate-account-row-main { min-height: 78px; transition: background-color 140ms ease; }
.affiliate-account-row:hover .affiliate-account-row-main { background: #fbfdfd; }
.affiliate-account-cell { align-content: center; display: grid; gap: 4px; min-width: 0; padding: 13px 14px; }
.affiliate-account-cell + .affiliate-account-cell { border-left: 1px solid #edf1f3; }
.affiliate-account-cell strong { color: var(--ink); display: block; font-size: 13px; font-weight: 780; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.affiliate-account-cell span, .affiliate-account-cell small { color: #6a7c84; display: block; font-size: 11px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.affiliate-account-identity { align-items: center; align-content: center; display: grid; gap: 10px; grid-template-columns: 34px minmax(0, 1fr); }
.affiliate-account-avatar { align-items: center; background: #e2f2ef; border: 1px solid #c4e0db; border-radius: 7px; color: #1f6b66 !important; display: inline-flex !important; font-size: 13px !important; font-weight: 900; height: 34px; justify-content: center; width: 34px; }
.affiliate-account-identity-copy { min-width: 0; }
.affiliate-account-identity strong { font-size: 14px; }
.affiliate-account-route strong { font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 11px; font-weight: 700; }
.affiliate-account-status .status { justify-self: start; max-width: 100%; text-transform: capitalize; }
.affiliate-account-actions { align-items: center; border-left: 1px solid #edf1f3; display: grid; gap: 6px; grid-template-columns: minmax(96px, 1fr) 36px 36px; padding: 13px 12px; }
.affiliate-account-actions form { margin: 0; min-width: 0; }
.affiliate-account-actions .button { height: 36px; justify-content: center; min-height: 36px; width: 100%; }
.affiliate-account-access { font-size: 12px; padding: 7px 10px; }
.affiliate-account-icon-button { padding: 0; width: 36px !important; }
.affiliate-account-icon-button .ui-icon { height: 15px; width: 15px; }
.affiliate-account-alert { align-items: center; background: #fff7ed; border-top: 1px solid #fed7aa; color: #9a4d0a; display: flex; font-size: 11px; gap: 5px; min-width: 0; padding: 7px 14px; }
.affiliate-account-alert strong { flex: 0 0 auto; }
.affiliate-account-alert span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.affiliate-account-edit { background: #f8fafb; border-top: 1px solid #e5ecef; padding: 0; }
.affiliate-account-edit summary { align-items: center; color: #48616a; cursor: pointer; display: flex; font-size: 11px; font-weight: 800; gap: 6px; justify-content: flex-end; list-style: none; min-height: 34px; padding: 7px 14px; }
.affiliate-account-edit summary::-webkit-details-marker { display: none; }
.affiliate-account-edit summary:hover { background: #f0f5f6; color: var(--primary-dark); }
.affiliate-account-edit summary .ui-icon { height: 14px; width: 14px; }
.affiliate-account-edit[open] summary { border-bottom: 1px solid #dfe8eb; }
.affiliate-account-edit form { display: grid; gap: 10px; padding: 14px; }
.affiliate-account-edit-grid { display: grid; gap: 10px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.affiliate-account-edit-grid label { margin: 0; min-width: 0; }
.affiliate-account-edit-notes { grid-column: span 2; }
.affiliate-account-edit-actions { align-items: center; display: flex; gap: 12px; justify-content: flex-end; }
.affiliate-account-edit-actions > span { color: var(--muted); font-size: 11px; margin-right: auto; }
.affiliate-account-delete { border-top: 1px solid #e5ecef; display: flex !important; justify-content: flex-end; padding-top: 10px !important; }
.affiliate-account-delete .button { min-width: 118px; }
@media (max-width: 1180px) {
  .affiliate-account-table-head, .affiliate-account-row-main { grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.15fr) minmax(220px, 1.35fr) minmax(120px, .75fr) 180px; }
}
@media (max-width: 1100px) {
  .affiliate-account-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .affiliate-account-notes { grid-column: span 2; }
  .affiliate-account-table { background: #f3f6f7; border: 0; overflow: visible; }
  .affiliate-account-table-head { display: none; }
  .affiliate-account-row { border: 1px solid #dbe4e8; border-radius: 8px; margin-bottom: 10px; overflow: hidden; }
  .affiliate-account-row:last-child { margin-bottom: 0; }
  .affiliate-account-row-main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .affiliate-account-route { grid-column: 1 / -1; }
  .affiliate-account-status { border-top: 1px solid #edf1f3; }
  .affiliate-account-actions { border-top: 1px solid #edf1f3; }
  .affiliate-account-edit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .affiliate-account-metrics, .affiliate-account-form, .affiliate-account-row-main, .affiliate-account-edit-grid { grid-template-columns: 1fr; }
  .affiliate-account-notes, .affiliate-account-route, .affiliate-account-edit-notes { grid-column: auto; }
  .affiliate-account-directory { padding: 14px; }
  .affiliate-account-create-summary { padding: 13px 14px; }
  .affiliate-account-create > .affiliate-account-form { padding: 14px; }
  .affiliate-account-section-head, .affiliate-account-search { align-items: stretch; flex-basis: auto; flex-direction: column; }
  .affiliate-account-search-field { min-width: 0; }
  .affiliate-account-search-button { flex: 1; justify-content: center; }
  .affiliate-account-cell, .affiliate-account-actions { border-left: 0 !important; border-top: 1px solid #edf1f3; padding-left: 14px; padding-right: 14px; }
  .affiliate-account-identity { border-top: 0; }
  .affiliate-account-cell::before, .affiliate-account-actions::before { color: #789099; content: attr(data-label); font-size: 9px; font-weight: 850; letter-spacing: .04em; margin-bottom: 2px; text-transform: uppercase; }
  .affiliate-account-identity { grid-template-columns: 34px minmax(0, 1fr); }
  .affiliate-account-identity::before { display: none; }
  .affiliate-account-actions { grid-template-columns: minmax(0, 1fr) 38px 38px; }
  .affiliate-account-actions::before { grid-column: 1 / -1; }
  .affiliate-account-edit-actions { align-items: stretch; flex-direction: column; }
  .affiliate-account-edit-actions .button { justify-content: center; width: 100%; }
}
@media (max-width: 680px) {
  .main > .page-head { align-items: stretch; flex-direction: column; padding: 21px; }
  .main > .page-head .button { flex: 1; justify-content: center; }
}

@media (max-width: 980px) {
  .landing-studio-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .landing-editor-layout { grid-template-columns: 1fr; }
  .landing-editor-sidebar { position: static; }
  .product-studio-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-insights-layout { grid-template-columns: 1fr; }
  .product-media-grid { grid-template-columns: 1fr; }
  .ads-studio-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-studio-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .landing-studio-hero, .landing-current-card, .landing-empty-state, .landing-library-head, .landing-editor-topbar { align-items: stretch; flex-direction: column; }
  .landing-studio-hero { padding: 22px; }
  .landing-hero-actions .button, .landing-current-actions .button { flex: 1; justify-content: center; }
  .landing-studio-kpis { grid-template-columns: 1fr 1fr; }
  .landing-studio-kpis article { min-height: 95px; padding: 13px; }
  .landing-studio-kpis strong { font-size: 25px; }
  .landing-project-grid, .landing-template-library-grid { grid-template-columns: 1fr; }
  .landing-editor-save, .landing-dialog-shell > footer { align-items: stretch; flex-direction: column; }
  .landing-editor-save .button, .landing-dialog-shell > footer .button { justify-content: center; }
  .landing-dialog-body, .landing-dialog-shell > header, .landing-dialog-shell > footer { padding-left: 16px; padding-right: 16px; }
  .landing-block-checks, .landing-regenerate-grid { grid-template-columns: 1fr; }
  .landing-preview-frame { aspect-ratio: 4 / 3; }
  .product-studio-hero, .product-catalog-head, .marketplace-search-hero { align-items: stretch; flex-direction: column; }
  .product-studio-hero { padding: 22px; }
  .product-hero-actions .button { flex: 1; justify-content: center; }
  .product-studio-kpis { grid-template-columns: 1fr 1fr; }
  .product-studio-kpis article { min-height: 94px; padding: 13px; }
  .product-studio-kpis strong { font-size: 20px; }
  .product-catalog-grid, .marketplace-result-grid { grid-template-columns: 1fr; }
  .product-catalog-card { grid-template-columns: 1fr; }
  .product-creative-tools { grid-template-columns: 1fr; }
  .product-card-media { min-height: 100%; }
  .product-media-item { grid-template-columns: 124px minmax(0, 1fr); }
  .product-media-preview iframe { min-height: 126px; }
  .marketplace-search-form { flex-direction: column; }
  .marketplace-search-form .button { justify-content: center; }
  .product-dialog-shell > header, .product-dialog-shell > footer { padding-left: 16px; padding-right: 16px; }
  .product-dialog-body { padding-left: 16px; padding-right: 16px; }
  .product-dialog-shell > footer { align-items: stretch; flex-direction: column; }
  .product-dialog-shell > footer .button { justify-content: center; }
  .ads-studio-hero, .ads-library-head, .ads-planning-head, .ads-manual-hero { align-items: stretch; flex-direction: column; }
  .ads-studio-hero { padding: 22px; }
  .ads-hero-actions .button { flex: 1; justify-content: center; }
  .ads-studio-kpis { grid-template-columns: 1fr 1fr; }
  .ads-studio-kpis article { min-height: 94px; padding: 13px; }
  .ads-studio-kpis strong { font-size: 24px; }
  .ads-creative-grid, .ads-suggestion-grid, .ads-position-grid { grid-template-columns: 1fr; }
  .ads-content-picker { grid-template-columns: 1fr; }
  .ads-content-picker .button { justify-content: center; }
  .ads-dialog-shell > header, .ads-dialog-shell > footer, .ads-dialog-body { padding-left: 16px; padding-right: 16px; }
  .ads-dialog-shell > footer { align-items: stretch; flex-direction: column; }
  .ads-dialog-shell > footer .button { justify-content: center; }
  .settings-studio-hero, .settings-operations-head { align-items: stretch; flex-direction: column; }
  .settings-studio-hero { padding: 22px; }
  .settings-hero-actions .button { flex: 1; justify-content: center; }
  .settings-studio-kpis { grid-template-columns: 1fr 1fr; }
  .settings-studio-kpis article { min-height: 94px; padding: 13px; }
  .settings-studio-kpis strong { font-size: 19px; }
  .settings-studio-form .tabs { width: 100%; }
  .settings-save-bar { align-items: stretch; flex-direction: column; }
  .settings-save-bar .button { justify-content: center; }
  .content-studio-hero, .content-create-intro, .content-section-head { align-items: stretch; flex-direction: column; }
  .content-studio-hero { padding: 22px; }
  .content-hero-actions .button { flex: 1; justify-content: center; }
  .content-create-form, .content-library-grid { grid-template-columns: 1fr; }
}

.status.autosaved,
.status.edited,
.status.generated,
.status.regenerated {
  background: var(--info-soft);
  color: var(--info);
}

.autopilot-form {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(190px, 1fr) minmax(240px, 1fr) minmax(260px, 1.2fr) minmax(120px, .7fr) minmax(110px, .6fr) minmax(130px, .7fr) auto;
}

.autopilot-keywords {
  grid-column: span 2;
}

.autopilot-keywords textarea {
  min-height: 96px;
  resize: vertical;
}

.autopilot-form label span {
  color: var(--muted);
  display: block;
  font-size: 12px;
  font-weight: 650;
  text-transform: uppercase;
}

.autopilot-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 340px;
}

.autopilot-result dl {
  margin-top: 18px;
}

.autopilot-steps {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 10px;
  list-style: none;
  margin: 18px 0 0;
  padding: 18px 0 0;
}

.autopilot-steps li {
  background: #f9fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  padding: 12px;
}

.autopilot-steps strong {
  color: var(--ink);
}

.autopilot-steps span,
.autopilot-run-list small {
  color: var(--muted);
}

.autopilot-run-list {
  display: grid;
  gap: 8px;
}

.autopilot-run-list a {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: 6px;
  padding: 12px;
}

.autopilot-run-list a.is-active,
.autopilot-run-list a:hover {
  border-color: var(--primary);
}

@media (min-width: 901px) {
  .mobile-shell {
    display: none !important;
  }
}

@media (max-width: 900px) {
  .sidebar {
    box-shadow: var(--shadow-md);
  }

  .datatable-tools,
  .datatable-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .datatable-search {
    max-width: none;
  }

  .datatable-pager {
    justify-content: space-between;
  }

  .tabs {
    width: 100%;
  }

  .inline-form {
    grid-template-columns: 1fr;
  }

  .product-filter,
  .mercado-livre-search {
    grid-template-columns: 1fr;
  }

  .product-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .affiliate-result {
    grid-template-columns: 1fr;
  }

  .ad-thumb {
    max-width: 96px;
    width: 96px;
  }

  .landing-workbench,
  .landing-editor-grid,
  .landing-template-grid,
  .autopilot-layout,
  .autopilot-form {
    grid-template-columns: 1fr;
  }

  .landing-preview-panel {
    position: static;
  }

  .landing-section-actions {
    grid-template-columns: 1fr;
  }

  .landing-block-checks {
    grid-template-columns: 1fr;
  }
}

.meta-hero,
.social-composer {
  margin-bottom: 18px;
}

.meta-hero {
  align-items: center;
  display: flex;
  gap: 18px;
  justify-content: space-between;
}

.meta-status-grid,
.meta-pill-list,
.media-strip {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.meta-account-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.meta-account-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  display: grid;
  gap: 12px;
  padding: 14px;
}

.meta-account-head,
.preview-head {
  align-items: center;
  display: flex;
  gap: 12px;
}

.meta-account-head img,
.preview-avatar {
  background: var(--primary-soft);
  border-radius: 999px;
  height: 44px;
  object-fit: cover;
  width: 44px;
}

.empty-state {
  background: var(--panel-subtle);
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-sm);
  color: var(--muted);
  padding: 18px;
}

.meta-checklist {
  color: var(--muted);
  margin: 0;
  padding-left: 20px;
}

.social-composer-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  min-width: 0;
}

.social-form-stack,
.social-preview-stack {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.social-composer-grid > *,
.social-form-stack > *,
.social-preview-stack > *,
.social-preview {
  min-width: 0;
}

.social-form-stack input[type="file"] {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
}

.social-form-stack input[type="file"]::file-selector-button {
  margin-right: 10px;
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.social-preview {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  display: grid;
  gap: 12px;
  padding: 14px;
}

.preview-head small {
  color: var(--muted);
  display: block;
}

.preview-media {
  align-items: center;
  aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, var(--bg-soft), var(--panel-subtle));
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  color: var(--muted);
  display: flex;
  justify-content: center;
  max-height: min(420px, 48vh);
  min-height: 180px;
  min-width: 0;
  overflow: hidden;
  width: 100%;
}

.preview-media.tall {
  aspect-ratio: 4 / 5;
  max-height: min(560px, 62vh);
}

.preview-media img,
.preview-media video {
  display: block;
  height: 100%;
  max-height: inherit;
  max-width: 100%;
  object-fit: cover;
  width: 100%;
}

.social-calendar {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.calendar-item {
  border: 1px solid var(--line);
  border-left: 4px solid var(--muted-soft);
  border-radius: var(--radius-sm);
  color: var(--ink);
  display: grid;
  gap: 4px;
  padding: 12px;
}

.calendar-item.status-published {
  border-left-color: var(--primary);
}

.calendar-item.status-failed {
  border-left-color: var(--danger);
}

.calendar-item.status-scheduled,
.calendar-item.status-processing {
  border-left-color: var(--warning);
}

.calendar-item small {
  color: var(--muted);
}

.media-strip img,
.media-strip video {
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  height: 110px;
  object-fit: cover;
  width: 110px;
}

@media (max-width: 960px) {
  .meta-hero,
  .social-composer-grid {
    grid-template-columns: 1fr;
  }

  .meta-hero {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Editorial Planner polish pass */
.planner-shell {
  isolation: isolate;
  margin: 0 auto;
  max-width: 1480px;
  overflow: hidden;
}

.planner-shell *,
.planner-shell *::before,
.planner-shell *::after {
  box-sizing: border-box;
}

.planner-shell form {
  margin: 0;
}

.planner-shell .button {
  align-items: center;
  border-radius: 10px;
  display: inline-flex;
  font-size: 13px;
  font-weight: 850;
  gap: 8px;
  justify-content: center;
  line-height: 1.1;
  min-height: 38px;
  padding: 10px 12px;
  white-space: nowrap;
}

.planner-hero {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .68), rgba(255, 255, 255, .30)),
    linear-gradient(120deg, rgba(15, 118, 110, .12), rgba(37, 99, 235, .10), rgba(217, 119, 6, .08));
  border: 1px solid var(--planner-line);
  border-radius: 18px;
  box-shadow: var(--planner-shadow);
  padding: clamp(18px, 2vw, 26px);
}

.planner-dark .planner-hero {
  background:
    linear-gradient(135deg, rgba(15, 23, 42, .72), rgba(15, 23, 42, .44)),
    linear-gradient(120deg, rgba(20, 184, 166, .12), rgba(37, 99, 235, .14), rgba(124, 58, 237, .10));
}

.planner-hero-copy h1 {
  font-size: clamp(28px, 3.1vw, 44px);
  letter-spacing: 0;
  max-width: 900px;
}

.planner-hero-copy p {
  margin-bottom: 0;
}

.planner-hero-actions {
  align-content: end;
  justify-content: flex-end;
  max-width: 360px;
}

.planner-icon-button .ui-icon {
  height: 18px;
  width: 18px;
}

.planner-metrics {
  grid-template-columns: repeat(4, minmax(170px, 1fr));
}

.planner-metrics article {
  min-height: 118px;
}

.planner-metrics strong {
  font-size: 30px;
}

.planner-tabs {
  position: sticky;
  top: 12px;
  z-index: 8;
}

.planner-tabs button,
.planner-segmented button {
  min-height: 38px;
}

.planner-grid {
  grid-template-columns: repeat(2, minmax(360px, 1fr));
}

.planner-grid.compact {
  grid-template-columns: repeat(2, minmax(320px, 1fr));
}

.planner-card {
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
}

.planner-cover {
  aspect-ratio: 21 / 9;
}

.planner-cover::after {
  background: linear-gradient(180deg, rgba(15, 23, 42, .12), rgba(15, 23, 42, .34));
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.planner-cover .planner-status,
.planner-cover .planner-priority {
  backdrop-filter: blur(14px);
  z-index: 1;
}

.planner-card-body {
  align-content: start;
  gap: 12px;
  padding: clamp(14px, 1.4vw, 20px);
}

.planner-card h2 {
  display: -webkit-box;
  font-size: clamp(18px, 1.4vw, 22px);
  line-height: 1.16;
  margin: 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.planner-card p {
  display: -webkit-box;
  min-height: 44px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.planner-card-meta {
  min-height: 31px;
}

.planner-card-meta span,
.planner-channel-row span,
.planner-keywords span,
.planner-keywords strong,
.planner-schedule-line span {
  max-width: 100%;
}

.planner-score-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.planner-score-grid span {
  align-content: center;
  min-height: 62px;
  min-width: 0;
  padding: 9px 8px;
  text-align: center;
}

.planner-score-grid strong {
  font-size: 20px;
}

.planner-keywords,
.planner-channel-row {
  max-height: 72px;
  overflow: hidden;
}

.planner-actions-primary {
  display: grid;
  grid-template-columns: minmax(110px, .75fr) minmax(150px, 1fr) minmax(180px, 1.15fr);
}

.planner-actions-primary > *,
.planner-actions-primary .button {
  width: 100%;
}

.planner-action-drawer {
  border-top: 1px solid var(--planner-line);
  margin-top: 2px;
  padding-top: 10px;
}

.planner-action-drawer summary {
  align-items: center;
  color: var(--planner-muted);
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 900;
  gap: 8px;
  justify-content: space-between;
  list-style: none;
}

.planner-action-drawer summary::-webkit-details-marker {
  display: none;
}

.planner-action-drawer summary::after {
  color: var(--planner-muted);
  content: "+";
  font-size: 18px;
  line-height: 1;
}

.planner-action-drawer[open] summary::after {
  content: "-";
}

.planner-actions-secondary {
  background: rgba(148, 163, 184, .08);
  border: 1px solid var(--planner-line);
  border-radius: 14px;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 10px;
  padding: 10px;
}

.planner-actions-secondary > *,
.planner-actions-secondary .button {
  width: 100%;
}

.planner-schedule-form {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) auto;
}

.planner-schedule-form input {
  background: var(--planner-panel);
  color: var(--planner-ink);
  min-width: 0;
  width: 100%;
}

.planner-calendar {
  background: var(--planner-panel);
  border: 1px solid var(--planner-line);
  border-radius: 18px;
  box-shadow: var(--planner-shadow);
  padding: 12px;
}

.planner-calendar-item {
  box-shadow: none;
}

.planner-board {
  grid-template-columns: repeat(5, minmax(250px, 1fr));
}

.planner-side-grid {
  grid-template-columns: repeat(3, minmax(240px, 1fr));
}

.planner-dialog {
  margin: auto;
  width: min(760px, calc(100vw - 28px));
}

.planner-dialog h3 {
  padding-right: 42px;
}

.planner-share-page {
  display: grid;
  gap: 20px;
}

.planner-share-hero,
.planner-share-layout > * {
  background: rgba(255, 255, 255, .88);
  border: 1px solid rgba(100, 116, 139, .22);
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .10);
}

.planner-share-hero {
  align-items: end;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: clamp(18px, 2vw, 28px);
}

.planner-share-hero h1 {
  font-size: clamp(28px, 3vw, 44px);
  max-width: 920px;
}

.planner-share-actions,
.planner-share-buttons {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.planner-share-layout {
  align-items: start;
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
}

.planner-generated-art {
  margin: 0;
  overflow: hidden;
}

.planner-generated-art img {
  aspect-ratio: 16 / 9;
  display: block;
  object-fit: cover;
  width: 100%;
}

.planner-generated-art figcaption {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding: 14px 16px;
}

.planner-generated-art span {
  color: var(--muted);
  font-size: 13px;
}

.planner-share-panel {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.planner-share-panel textarea {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--ink);
  min-height: 220px;
  padding: 14px;
  resize: vertical;
  width: 100%;
}

.planner-share-panel pre {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--ink);
  font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  overflow: auto;
  padding: 12px;
  white-space: pre-wrap;
}

.media-picker-dialog {
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow-md);
  max-height: min(860px, calc(100vh - 28px));
  max-width: min(1180px, calc(100vw - 28px));
  padding: 0;
  width: 100%;
}

.media-picker-dialog::backdrop {
  background: rgba(15, 23, 42, .48);
  backdrop-filter: blur(8px);
}

.media-picker-head,
.media-picker-footer {
  align-items: center;
  background: #ffffff;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 18px 20px;
}

.media-picker-head {
  border-bottom: 1px solid var(--line);
}

.media-picker-head > div {
  align-items: center;
  display: grid;
  gap: 4px 12px;
  grid-template-columns: auto minmax(0, 1fr);
}

.media-picker-head h2,
.media-picker-head p {
  margin: 0;
}

.media-picker-head p {
  color: var(--muted);
  grid-column: 2;
}

.media-picker-search {
  align-items: center;
  background: #f8fafc;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 14px 20px;
}

.media-picker-search input {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 10px;
  min-height: 44px;
  padding: 10px 12px;
}

.media-picker-status {
  color: var(--muted);
  font-weight: 800;
  min-height: 22px;
  padding: 12px 20px 0;
}

.media-picker-status.is-error {
  color: var(--danger);
}

.ci-shell {
  display: grid;
  gap: 18px;
}

.ci-metrics {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.ci-metrics article,
.ci-competitor,
.ci-topic,
.ci-news,
.ci-alert,
.ci-ranking article {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
}

.ci-metrics article {
  display: grid;
  gap: 7px;
  min-height: 112px;
  padding: 16px;
}

.ci-metrics span,
.ci-kicker,
.ci-news header span,
.ci-alert span,
.ci-competitor dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.ci-metrics strong {
  color: var(--ink);
  font-size: 26px;
  line-height: 1.1;
}

.ci-metrics small,
.ci-alert p,
.ci-topic p,
.ci-section-head p {
  color: var(--muted);
  margin: 0;
}

.ci-layout {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(340px, .9fr) minmax(0, 1.1fr);
}

.ci-layout.wide {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
}

.ci-form {
  align-content: start;
  display: grid;
  gap: 14px;
}

.ci-form-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ci-alerts {
  display: grid;
  gap: 12px;
}

.ci-alert {
  align-items: center;
  border-left: 4px solid var(--info);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 14px;
}

.ci-alert.urgent,
.ci-alert.warning {
  border-left-color: var(--accent);
}

.ci-section-head {
  align-items: end;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.ci-competitor-grid,
.ci-topic-list,
.ci-news-list {
  display: grid;
  gap: 14px;
}

.ci-competitor-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ci-competitor {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.ci-competitor header,
.ci-topic header,
.ci-news header {
  align-items: start;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.ci-competitor header a {
  color: var(--muted);
  display: block;
  font-size: 13px;
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.ci-competitor dl {
  display: grid;
  gap: 8px 12px;
  grid-template-columns: 110px minmax(0, 1fr);
  margin: 0;
}

.ci-competitor dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

.ci-error {
  background: var(--danger-soft);
  border-radius: var(--radius-sm);
  color: var(--danger);
  margin: 0;
  padding: 10px;
}

.ci-ranking {
  display: grid;
  gap: 10px;
}

.ci-ranking article {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.ci-ranking span {
  color: var(--muted);
  font-size: 13px;
}

.ci-ranking meter {
  height: 10px;
  width: 100%;
}

.ci-heatmap,
.ci-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ci-heatmap span,
.ci-tags span,
.ci-opportunity span {
  background: var(--panel-subtle);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  color: var(--ink);
  display: inline-flex;
  gap: 6px;
  padding: 7px 9px;
}

.ci-heatmap span {
  background: color-mix(in srgb, var(--primary-soft) var(--heat), #ffffff);
  min-width: 84px;
  justify-content: space-between;
}

.ci-tags span.danger {
  background: var(--warning-soft);
  border-color: rgba(180, 83, 9, .22);
  color: var(--warning);
}

.ci-topic,
.ci-news {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.ci-topic h3,
.ci-news h3 {
  font-size: 18px;
}

.ci-score {
  align-items: center;
  background: var(--primary-soft);
  border-radius: 999px;
  color: var(--primary-dark);
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 18px;
  justify-content: center;
  min-height: 48px;
  min-width: 64px;
  padding: 8px 12px;
}

.ci-opportunity,
.ci-seo-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ci-timeline {
  border-left: 2px solid var(--line-strong);
  display: grid;
  gap: 10px;
  margin-left: 6px;
  padding-left: 16px;
}

.ci-timeline div {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: 58px minmax(0, 1fr) 72px;
  position: relative;
}

.ci-timeline div::before {
  background: var(--primary);
  border: 2px solid #ffffff;
  border-radius: 999px;
  box-shadow: 0 0 0 2px var(--primary-soft);
  content: "";
  height: 10px;
  left: -22px;
  position: absolute;
  width: 10px;
}

.ci-timeline time {
  color: var(--ink);
  font-weight: 900;
}

.ci-timeline small {
  color: var(--muted);
  text-align: right;
}

.ci-ai-box {
  background: var(--info-soft);
  border: 1px solid rgba(3, 105, 161, .18);
  border-radius: var(--radius-sm);
  display: grid;
  gap: 8px;
  padding: 12px;
}

.ci-seo-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.ci-seo-grid span {
  background: var(--panel-subtle);
  border-radius: var(--radius-sm);
  color: var(--muted);
  padding: 9px;
}

.ci-seo-grid strong {
  color: var(--ink);
}

@media (max-width: 1180px) {
  .ci-metrics,
  .ci-competitor-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ci-layout,
  .ci-layout.wide {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ci-metrics,
  .ci-competitor-grid,
  .ci-form-grid,
  .ci-opportunity,
  .ci-seo-grid {
    grid-template-columns: 1fr;
  }

  .ci-alert,
  .ci-competitor header,
  .ci-topic header,
  .ci-news header,
  .ci-section-head {
    align-items: stretch;
    flex-direction: column;
    grid-template-columns: 1fr;
  }

  .ci-timeline div {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .ci-timeline small {
    grid-column: 2;
    text-align: left;
  }
}

.ai-persona-hero {
  align-items: center;
  background: linear-gradient(135deg, #0f172a, #1f2937 48%, #0d9488);
  border-radius: 14px;
  color: #ffffff;
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-bottom: 20px;
  padding: 26px;
}

.ai-persona-hero.compact {
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 22px;
}

.ai-persona-hero h1,
.ai-persona-hero p {
  color: inherit;
  margin: 0;
}

.ai-persona-hero h1 {
  font-size: 32px;
  line-height: 1.05;
  margin-top: 8px;
}

.ai-persona-hero p {
  color: rgba(255, 255, 255, .82);
  max-width: 760px;
}

.ai-persona-hero .button {
  background: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .25);
  color: #ffffff;
}

.ai-persona-hero .button.primary {
  background: #f59e0b;
  border-color: #f59e0b;
  color: #111827;
}

.persona-kpi-grid,
.persona-card-grid,
.persona-detail-grid,
.persona-generator-layout,
.persona-layout {
  display: grid;
  gap: 16px;
}

.persona-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
}

.persona-kpi-grid article {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 16px;
}

.persona-kpi-grid span,
.persona-kpi-grid small,
.persona-card small,
.persona-card-meta,
.persona-profile-panel p {
  color: var(--muted);
}

.persona-kpi-grid strong {
  color: var(--ink);
  display: block;
  font-size: 28px;
  line-height: 1.1;
  margin: 6px 0;
}

.persona-layout,
.persona-generator-layout {
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, .75fr);
}

.persona-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.persona-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.persona-avatar {
  align-items: center;
  aspect-ratio: 1;
  background: #ecfeff;
  border: 1px solid #99f6e4;
  border-radius: 10px;
  color: #115e59;
  display: flex;
  font-weight: 900;
  justify-content: center;
  overflow: hidden;
  width: 58px;
}

.persona-avatar.large {
  width: 112px;
}

.persona-avatar img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.persona-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.persona-card-meta span:not(.status) {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12px;
  padding: 5px 8px;
}

.persona-card-meta.inline {
  margin-top: 10px;
}

.persona-score-row {
  display: grid;
  gap: 8px;
}

.persona-score-row label {
  align-items: center;
  color: var(--muted);
  display: grid;
  font-size: 12px;
  gap: 6px;
  grid-template-columns: 76px minmax(90px, 1fr) 42px;
}

.persona-score-row.vertical label {
  grid-template-columns: 96px minmax(120px, 1fr) 48px;
}

.persona-score-row meter {
  height: 12px;
  width: 100%;
}

.persona-wizard-shell {
  display: grid;
  gap: 16px;
}

.persona-stepper {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.persona-stepper span {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  padding: 9px;
}

.persona-stepper span.active {
  background: #0f766e;
  border-color: #0f766e;
  color: #ffffff;
}

.persona-form-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.persona-form-grid label {
  display: grid;
  gap: 6px;
}

.persona-form-grid label > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.persona-form-grid input,
.persona-form-grid select,
.persona-form-grid textarea {
  width: 100%;
}

.persona-form-actions {
  align-items: center;
  display: flex;
  gap: 10px;
  grid-column: 1 / -1;
  justify-content: flex-end;
}

.persona-detail-grid {
  grid-template-columns: minmax(0, 1fr) minmax(320px, .45fr);
  margin-bottom: 16px;
}

.persona-profile-panel {
  align-items: center;
  display: flex;
  gap: 18px;
}

.persona-dna-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.persona-dna-grid section,
.persona-json {
  background: #0f172a;
  border-radius: 10px;
  color: #e5e7eb;
  overflow: auto;
  padding: 14px;
}

.persona-dna-grid h3 {
  color: #ffffff;
  margin-top: 0;
}

.persona-dna-grid pre,
.persona-json {
  font-size: 12px;
  line-height: 1.5;
  white-space: pre-wrap;
}

.affiliate-row-actions.vertical {
  align-items: stretch;
  display: grid;
}

@media (max-width: 1180px) {
  .persona-kpi-grid,
  .persona-card-grid,
  .persona-stepper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .persona-layout,
  .persona-detail-grid,
  .persona-generator-layout,
  .ai-persona-hero,
  .ai-persona-hero.compact {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .ai-persona-hero {
    border-radius: 0;
    margin: -18px -18px 18px;
    padding: 18px;
  }

  .ai-persona-hero h1 {
    font-size: 26px;
  }

  .persona-kpi-grid,
  .persona-card-grid,
  .persona-stepper,
  .persona-form-grid,
  .persona-dna-grid {
    grid-template-columns: 1fr;
  }

  .persona-profile-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  .persona-form-actions,
  .product-hero-actions {
    align-items: stretch;
    display: grid;
  }
}

.media-picker-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
  max-height: 560px;
  overflow: auto;
  padding: 14px 20px 20px;
}

.media-picker-grid section {
  display: grid;
  gap: 10px;
}

.media-picker-grid h3 {
  font-size: 15px;
}

.media-result-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.media-result-grid.videos {
  grid-template-columns: 1fr;
}

.media-result-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 12px;
  cursor: pointer;
  display: grid;
  gap: 8px;
  overflow: hidden;
  padding: 10px;
  position: relative;
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.media-result-card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow-sm);
  transform: translateY(-1px);
}

.media-result-card input {
  accent-color: var(--primary);
  height: 18px;
  position: absolute;
  right: 12px;
  top: 12px;
  width: 18px;
  z-index: 1;
}

.media-thumb {
  align-items: center;
  aspect-ratio: 16 / 9;
  background: var(--bg-soft);
  border-radius: 9px;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.media-thumb img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.media-thumb iframe {
  border: 0;
  height: 100%;
  width: 100%;
}

.media-play-button {
  align-items: center;
  background: rgba(15, 23, 42, .82);
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 12px;
  font-weight: 900;
  gap: 6px;
  left: 50%;
  min-height: 38px;
  padding: 0 15px;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.media-play-button::before {
  border-bottom: 7px solid transparent;
  border-left: 10px solid currentColor;
  border-top: 7px solid transparent;
  content: "";
  display: inline-block;
  height: 0;
  width: 0;
}

.media-result-card strong {
  color: var(--ink);
  display: -webkit-box;
  font-size: 13px;
  line-height: 1.25;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.media-result-card small,
.media-result-card span:not(.media-thumb) {
  color: var(--muted);
  display: -webkit-box;
  font-size: 12px;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.media-result-card.is-loading {
  animation: media-skeleton 1.1s ease-in-out infinite alternate;
  aspect-ratio: 16 / 12;
  background: linear-gradient(90deg, #f1f5f9, #e5e7eb, #f8fafc);
}

@keyframes media-skeleton {
  from { opacity: .58; }
  to { opacity: 1; }
}

.media-picker-footer {
  border-top: 1px solid var(--line);
}

.media-picker-footer p {
  color: var(--muted);
  margin: 0;
}

.seoai-inline-media {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  margin: 22px 0;
  overflow: hidden;
}

.seoai-inline-media img,
.seoai-inline-media iframe {
  aspect-ratio: 16 / 9;
  border: 0;
  display: block;
  object-fit: cover;
  width: 100%;
}

.seoai-inline-media figcaption {
  background: #f8fafc;
  color: #4b5563;
  font-size: 13px;
  padding: 10px 12px;
}

.seoai-inline-media figcaption a {
  font-weight: 800;
}

@media (max-width: 1180px) {
  .planner-grid,
  .planner-grid.compact {
    grid-template-columns: 1fr;
  }

  .planner-cover {
    aspect-ratio: 16 / 6.5;
  }

  .planner-score-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .planner-shell {
    border-radius: 0;
    margin: -18px;
    padding: 14px;
  }

  .planner-hero {
    padding: 18px;
  }

  .planner-hero-actions {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    justify-content: stretch;
    max-width: none;
  }

  .planner-hero-actions > *,
  .planner-hero-actions .button {
    width: 100%;
  }

  .planner-hero-actions .planner-icon-button {
    width: 48px;
  }

  .planner-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .planner-tabs {
    top: 0;
  }

  .planner-cover {
    aspect-ratio: 16 / 9;
  }

  .planner-actions-primary,
  .planner-actions-secondary,
  .planner-schedule-form {
    grid-template-columns: 1fr;
  }

  .planner-score-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .planner-side-grid {
    grid-template-columns: 1fr;
  }

  .planner-share-hero,
  .planner-share-layout {
    grid-template-columns: 1fr;
  }

  .media-picker-grid,
  .media-picker-search {
    grid-template-columns: 1fr;
  }

  .media-result-grid,
  .media-result-grid.videos {
    grid-template-columns: 1fr;
  }

  .media-picker-head,
  .media-picker-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .planner-share-actions > *,
  .planner-share-actions .button,
  .planner-share-buttons > *,
  .planner-share-buttons .button {
    width: 100%;
  }
}

/* Persona Studio — marketing-first workspace */
.persona-studio-hero,
.persona-detail-hero {
  --persona-violet: #6d5ce8;
  --persona-violet-dark: #4438a8;
  --persona-cyan: #35c5c1;
}

.persona-studio-hero {
  align-items: center;
  background:
    radial-gradient(circle at 82% 18%, rgba(75, 220, 207, .2), transparent 26%),
    radial-gradient(circle at 12% 100%, rgba(130, 107, 255, .3), transparent 34%),
    linear-gradient(128deg, #171333 0%, #29205a 54%, #164d57 115%);
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 22px;
  box-shadow: 0 24px 55px rgba(23, 19, 51, .18);
  color: #fff;
  display: grid;
  gap: 30px;
  grid-template-columns: minmax(0, 1fr) auto;
  margin-bottom: 22px;
  min-height: 268px;
  overflow: hidden;
  padding: 38px 42px;
  position: relative;
}

.persona-studio-hero::after {
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 50%;
  content: "";
  height: 280px;
  position: absolute;
  right: -70px;
  top: -120px;
  width: 280px;
}

.persona-studio-hero--compact {
  min-height: 220px;
  padding-block: 30px;
}

.persona-studio-hero--ai {
  background:
    radial-gradient(circle at 78% 18%, rgba(107, 92, 232, .42), transparent 30%),
    linear-gradient(128deg, #14122e, #25205b 58%, #3d2877);
}

.persona-studio-hero__copy {
  max-width: 780px;
  position: relative;
  z-index: 1;
}

.persona-studio-hero .product-eyebrow,
.persona-form-kicker {
  color: #7969df;
  display: block;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .12em;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.persona-studio-hero .product-eyebrow { color: #75e3d7; }

.persona-studio-hero h1,
.persona-studio-hero p {
  color: inherit;
  margin: 0;
}

.persona-studio-hero h1 {
  font-size: clamp(32px, 4vw, 48px);
  letter-spacing: -.04em;
  line-height: 1.02;
  max-width: 720px;
}

.persona-studio-hero--compact h1 {
  font-size: clamp(30px, 3.2vw, 41px);
}

.persona-studio-hero p {
  color: rgba(255, 255, 255, .72);
  font-size: 16px;
  line-height: 1.65;
  margin-top: 15px;
  max-width: 690px;
}

.persona-back-link {
  align-items: center;
  color: rgba(255, 255, 255, .68);
  display: inline-flex;
  font-size: 12px;
  font-weight: 750;
  gap: 5px;
  margin-bottom: 24px;
  text-decoration: none;
}

.persona-back-link:hover { color: #fff; }
.persona-back-link .ui-icon { height: 14px; width: 14px; }

.persona-hero-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 24px;
}

.persona-hero-proof span {
  align-items: center;
  color: rgba(255, 255, 255, .76);
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  gap: 7px;
}

.persona-hero-proof i,
.persona-result-status i {
  background: #55dccb;
  border-radius: 50%;
  box-shadow: 0 0 0 4px rgba(85, 220, 203, .13);
  height: 6px;
  width: 6px;
}

.persona-hero-actions {
  align-items: stretch;
  display: grid;
  gap: 10px;
  min-width: 235px;
  position: relative;
  z-index: 1;
}

.persona-studio-hero .button {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .2);
  color: #fff;
  justify-content: center;
}

.persona-studio-hero .button:hover { background: rgba(255, 255, 255, .15); }

.persona-studio-hero .button.primary,
.button.persona-primary-action {
  background: linear-gradient(135deg, #7464ed, #5847d6);
  border-color: #7464ed;
  box-shadow: 0 9px 22px rgba(88, 71, 214, .24);
  color: #fff;
}

.persona-studio-hero .button.primary:hover,
.button.persona-primary-action:hover {
  background: linear-gradient(135deg, #8172f2, #6655df);
  border-color: #8172f2;
  transform: translateY(-1px);
}

.persona-ai-button { min-width: 260px; position: relative; z-index: 1; }

.persona-metrics {
  display: grid;
  gap: 13px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 22px;
}

.persona-metrics article {
  align-items: center;
  background: var(--panel);
  border: 1px solid #e8e9f0;
  border-radius: 15px;
  box-shadow: 0 4px 18px rgba(30, 35, 58, .04);
  display: flex;
  gap: 13px;
  min-height: 112px;
  padding: 18px;
}

.persona-metric-icon,
.persona-dna-icon {
  align-items: center;
  background: #eeeafd;
  border-radius: 12px;
  color: #6252d6;
  display: inline-flex;
  flex: 0 0 42px;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.persona-metric-icon--green,
.persona-dna-icon--green { background: #e0f8f1; color: #14806e; }
.persona-metric-icon--amber,
.persona-dna-icon--amber { background: #fff2dc; color: #ad6a08; }
.persona-metric-icon--blue,
.persona-dna-icon--blue { background: #e4f3ff; color: #2472ad; }
.persona-metric-icon .ui-icon,
.persona-dna-icon .ui-icon { height: 19px; width: 19px; }

.persona-metrics article > div { display: grid; gap: 2px; }
.persona-metrics small { color: #777c8f; font-size: 11px; font-weight: 750; }
.persona-metrics strong { color: #23263a; font-size: 27px; letter-spacing: -.03em; line-height: 1.1; }
.persona-metrics article > div > span { color: #999dac; font-size: 11px; }

.persona-library {
  background: var(--panel);
  border: 1px solid #e7e8ef;
  border-radius: 18px;
  box-shadow: 0 8px 30px rgba(35, 38, 58, .04);
  padding: 24px;
}

.persona-library-head,
.persona-result-head,
.persona-dna-studio > header,
.persona-assets-panel > header {
  align-items: flex-end;
  display: flex;
  gap: 20px;
  justify-content: space-between;
}

.persona-library-head h2,
.persona-result-head h2,
.persona-dna-studio h2,
.persona-assets-panel h2 {
  color: #23263a;
  font-size: 25px;
  letter-spacing: -.025em;
  margin: 0;
}

.persona-library-head p,
.persona-result-head p,
.persona-dna-studio > header p {
  color: #74798b;
  font-size: 13px;
  margin: 5px 0 0;
}

.persona-view-toggle {
  background: #f3f3f7;
  border-radius: 9px;
  display: flex;
  gap: 2px;
  padding: 3px;
}

.persona-view-toggle button {
  background: transparent;
  border: 0;
  color: #999dad;
  height: 31px;
  padding: 0;
  width: 34px;
}

.persona-view-toggle button.is-active {
  background: #fff;
  box-shadow: 0 1px 5px rgba(28, 30, 48, .12);
  color: #5f50cf;
}

.persona-filter-bar {
  align-items: center;
  background: #fafafd;
  border: 1px solid #ecedf2;
  border-radius: 12px;
  display: grid;
  gap: 9px;
  grid-template-columns: minmax(230px, 1fr) repeat(3, minmax(135px, .42fr)) auto auto;
  margin: 20px 0;
  padding: 10px;
}

.persona-filter-bar select,
.persona-filter-bar input {
  background: #fff;
  border-color: #e3e4eb;
  min-height: 39px;
}

.persona-search { position: relative; }
.persona-search > span {
  color: #9195a5;
  left: 12px;
  pointer-events: none;
  position: absolute;
  top: 10px;
  z-index: 1;
}
.persona-search .ui-icon { height: 17px; width: 17px; }
.persona-search input { padding-left: 38px; width: 100%; }
.persona-clear-filter { color: #6a5bd6; font-size: 12px; font-weight: 750; }

.persona-library-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.persona-library-card {
  background: #fff;
  border: 1px solid #e5e6ed;
  border-radius: 15px;
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.persona-library-card:hover {
  border-color: #d1cdf3;
  box-shadow: 0 16px 34px rgba(43, 39, 82, .1);
  transform: translateY(-2px);
}

.persona-library-card__visual {
  align-items: flex-end;
  background: #282344;
  display: flex;
  height: 132px;
  padding: 14px;
  position: relative;
}

.persona-library-card__gradient {
  background:
    radial-gradient(circle at 18% 35%, rgba(111, 208, 199, .46), transparent 24%),
    radial-gradient(circle at 78% 40%, rgba(127, 102, 235, .55), transparent 30%),
    linear-gradient(135deg, #22203b, #3f3769);
  inset: 0;
  position: absolute;
}

.persona-avatar--editorial {
  background: linear-gradient(145deg, #d7d1ff, #a6eee5);
  border: 3px solid rgba(255, 255, 255, .8);
  border-radius: 50%;
  box-shadow: 0 7px 22px rgba(12, 15, 35, .28);
  color: #302766;
  font-size: 23px;
  height: 72px;
  position: relative;
  width: 72px;
  z-index: 1;
}

.persona-status {
  align-items: center;
  backdrop-filter: blur(8px);
  background: rgba(255, 255, 255, .86);
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 999px;
  color: #656a7c;
  display: inline-flex;
  font-size: 10px;
  font-weight: 850;
  gap: 6px;
  letter-spacing: .03em;
  padding: 6px 9px;
  position: absolute;
  right: 12px;
  text-transform: uppercase;
  top: 12px;
  z-index: 2;
}

.persona-status i {
  background: #d79b3b;
  border-radius: 50%;
  height: 6px;
  width: 6px;
}

.persona-status--active { color: #177263; }
.persona-status--active i { background: #24aa8f; }

.persona-preview-trigger {
  align-items: center;
  backdrop-filter: blur(8px);
  background: rgba(22, 19, 49, .58);
  border: 1px solid rgba(255, 255, 255, .25);
  bottom: 13px;
  color: #fff;
  display: inline-flex;
  font-size: 11px;
  gap: 6px;
  min-height: 30px;
  padding: 6px 9px;
  position: absolute;
  right: 12px;
  z-index: 2;
}
.persona-preview-trigger:hover { background: rgba(22, 19, 49, .78); }
.persona-preview-trigger .ui-icon { height: 13px; width: 13px; }

.persona-library-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 17px;
}

.persona-card-title {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}
.persona-card-title > div { min-width: 0; }
.persona-card-title small { color: #9b9eae; display: block; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.persona-card-title h3 { color: #292c3f; font-size: 17px; margin: 2px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.persona-card-title > div > span { color: #9195a5; display: block; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.persona-card-title > a { align-items: center; color: #777c90; display: flex; justify-content: center; }
.persona-card-title > a .ui-icon { height: 18px; width: 18px; }
.persona-library-card__body > p { color: #6e7384; display: -webkit-box; font-size: 12px; line-height: 1.55; margin: 13px 0; min-height: 38px; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

.persona-card-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.persona-card-chips span,
.persona-dna-cards article > div span {
  background: #f4f3fb;
  border: 1px solid #e9e6f7;
  border-radius: 999px;
  color: #655b94;
  font-size: 10px;
  font-weight: 700;
  padding: 5px 8px;
}

.persona-quality {
  border-top: 1px solid #eff0f4;
  margin-top: 15px;
  padding-top: 13px;
}
.persona-quality > div > span { align-items: center; color: #6f7485; display: flex; font-size: 10px; justify-content: space-between; margin-bottom: 7px; }
.persona-quality > div > span strong { color: #383b51; }
.persona-quality progress {
  appearance: none;
  background: #ececf3;
  border: 0;
  border-radius: 99px;
  display: block;
  height: 6px;
  overflow: hidden;
  width: 100%;
}
.persona-quality progress::-webkit-progress-bar { background: #ececf3; }
.persona-quality progress::-webkit-progress-value { background: linear-gradient(90deg, #7563e7, #42c6bd); border-radius: 99px; }
.persona-quality progress::-moz-progress-bar { background: linear-gradient(90deg, #7563e7, #42c6bd); border-radius: 99px; }
.persona-quality > small { color: #a77928; display: block; font-size: 9px; margin-top: 7px; }
.persona-quality > small.is-good { color: #28816f; }

.persona-library-card__actions {
  align-items: center;
  background: #fbfbfd;
  border-top: 1px solid #ececf1;
  display: grid;
  gap: 7px;
  grid-template-columns: 1fr auto auto;
  padding: 11px 13px;
}
.persona-library-card__actions form { margin: 0; }
.persona-library-card__actions .button { font-size: 10px; min-height: 32px; padding: 6px 10px; }
.persona-card-menu { position: relative; }
.persona-card-menu summary {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: #6e7281;
  cursor: pointer;
  display: flex;
  font-weight: 800;
  height: 32px;
  justify-content: center;
  list-style: none;
  width: 34px;
}
.persona-card-menu summary::-webkit-details-marker { display: none; }
.persona-card-menu form {
  background: #fff;
  border: 1px solid #e4e5eb;
  border-radius: 9px;
  bottom: 38px;
  box-shadow: 0 10px 30px rgba(20, 22, 38, .15);
  padding: 5px;
  position: absolute;
  right: 0;
  width: 150px;
  z-index: 5;
}
.persona-card-menu form button { background: #fff; border: 0; color: #a33c55; font-size: 11px; justify-content: flex-start; width: 100%; }

.persona-library-grid.is-list-view { grid-template-columns: 1fr; }
.persona-library-grid.is-list-view .persona-library-card { display: grid; grid-template-columns: 145px minmax(0, 1fr) 245px; }
.persona-library-grid.is-list-view .persona-library-card__visual { height: auto; min-height: 150px; }
.persona-library-grid.is-list-view .persona-library-card__actions { align-content: center; border-left: 1px solid #ececf1; border-top: 0; grid-template-columns: 1fr 1fr auto; }

.persona-empty-state {
  align-items: center;
  border: 1px dashed #d9d5ee;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  grid-column: 1 / -1;
  justify-content: center;
  min-height: 300px;
  padding: 35px;
  text-align: center;
}
.persona-empty-state > span { align-items: center; background: #efecff; border-radius: 50%; color: #6957dd; display: flex; height: 52px; justify-content: center; width: 52px; }
.persona-empty-state h3 { margin: 6px 0 0; }
.persona-empty-state p { color: var(--muted); margin: 0 0 8px; max-width: 440px; }

/* Builder */
.persona-creation-progress {
  background: #fff;
  border: 1px solid #e8e9ef;
  border-radius: 14px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-bottom: 18px;
  overflow: hidden;
}
.persona-creation-progress > div {
  align-items: center;
  border-right: 1px solid #ececf1;
  display: grid;
  gap: 0 10px;
  grid-template-columns: auto 1fr;
  padding: 14px 18px;
}
.persona-creation-progress > div:last-child { border-right: 0; }
.persona-creation-progress > div > span {
  align-items: center;
  background: #f1f1f5;
  border-radius: 50%;
  color: #999dad;
  display: flex;
  grid-row: 1 / 3;
  height: 28px;
  justify-content: center;
  width: 28px;
}
.persona-creation-progress strong { color: #696d7d; font-size: 12px; }
.persona-creation-progress small { color: #a0a3b0; font-size: 10px; }
.persona-creation-progress > div.is-active { background: #faf9ff; }
.persona-creation-progress > div.is-active > span { background: #6958dc; color: #fff; }
.persona-creation-progress > div.is-active strong { color: #463aa5; }

.persona-builder-layout,
.persona-ai-layout {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1.5fr) minmax(320px, .72fr);
}

.persona-builder-form,
.persona-ai-form,
.persona-ai-guide,
.persona-generated-result,
.persona-health-card,
.persona-channel-card,
.persona-dna-studio,
.persona-assets-panel,
.persona-json-details--detail {
  background: #fff;
  border: 1px solid #e5e6ed;
  border-radius: 16px;
  box-shadow: 0 6px 24px rgba(36, 39, 61, .04);
}

.persona-form-section { border-bottom: 1px solid #ececf1; padding: 25px; }
.persona-form-section > header {
  align-items: flex-start;
  display: flex;
  gap: 13px;
  margin-bottom: 22px;
}
.persona-section-index {
  align-items: center;
  background: #eeeafd;
  border-radius: 9px;
  color: #5f4fd1;
  display: flex;
  flex: 0 0 38px;
  font-size: 11px;
  font-weight: 900;
  height: 38px;
  justify-content: center;
}
.persona-form-section h2,
.persona-ai-form h2,
.persona-ai-guide h2,
.persona-health-card h2,
.persona-channel-card h2 {
  color: #282b3e;
  font-size: 18px;
  margin: 0;
}
.persona-form-section header p,
.persona-ai-form__head p {
  color: #818596;
  font-size: 11px;
  margin: 4px 0 0;
}

.persona-fields-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.persona-field { display: grid; gap: 7px; }
.persona-field--wide { grid-column: 1 / -1; }
.persona-field--wide-on-desktop { grid-column: span 1; }
.persona-field > span { color: #44485c; font-size: 11px; font-weight: 800; }
.persona-field > span b { color: #8a7ce5; float: right; font-size: 8px; letter-spacing: .05em; text-transform: uppercase; }
.persona-field input,
.persona-field select,
.persona-field textarea {
  background: #fbfbfd;
  border-color: #dedfe8;
  color: #303346;
  min-height: 42px;
  width: 100%;
}
.persona-field input:focus,
.persona-field select:focus,
.persona-field textarea:focus { background: #fff; border-color: #7464e2; box-shadow: 0 0 0 3px rgba(116, 100, 226, .1); }
.persona-field textarea { min-height: 86px; resize: vertical; }
.persona-field > small { color: #999cab; font-size: 9px; }
.persona-field > small [data-persona-char-count] { color: inherit; }

.persona-builder-actions {
  align-items: center;
  display: flex;
  gap: 9px;
  padding: 18px 25px;
}
.persona-builder-actions > div { display: grid; margin-right: auto; }
.persona-builder-actions > div strong { color: #414458; font-size: 11px; }
.persona-builder-actions > div span { color: #9598a7; font-size: 9px; }

.persona-live-preview {
  background: #17152d;
  border: 1px solid #302b57;
  border-radius: 17px;
  box-shadow: 0 20px 50px rgba(21, 19, 45, .18);
  color: #fff;
  padding: 17px;
  position: sticky;
  top: 18px;
}
.persona-preview-heading {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin-bottom: 13px;
}
.persona-preview-heading > div { align-items: center; display: flex; gap: 7px; }
.persona-preview-heading strong { font-size: 11px; }
.persona-preview-heading small { color: #9b96c0; font-size: 9px; }
.persona-live-dot { background: #4ee0c8; border-radius: 50%; box-shadow: 0 0 0 4px rgba(78, 224, 200, .12); height: 6px; width: 6px; }

.persona-preview-modes {
  background: rgba(107, 97, 157, .14);
  border: 1px solid rgba(132, 122, 180, .18);
  border-radius: 9px;
  display: grid;
  gap: 3px;
  grid-template-columns: repeat(3, 1fr);
  margin-bottom: 13px;
  padding: 3px;
}
.persona-preview-modes button {
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #8e8aa8;
  font-size: 10px;
  min-height: 30px;
  padding: 5px 8px;
}
.persona-live-preview .persona-preview-modes button { color: #9f9bbb; }
.persona-preview-modes button.is-active { background: #fff; box-shadow: 0 2px 8px rgba(30, 25, 65, .12); color: #5d4ec8; }

.persona-showcase {
  --showcase-accent: #7564e7;
  background: #fff;
  border-radius: 14px;
  color: #292b3c;
  overflow: hidden;
  transition: all 220ms ease;
}
.persona-showcase__visual {
  align-items: center;
  background:
    radial-gradient(circle at 50% 35%, rgba(135, 232, 219, .75), transparent 24%),
    radial-gradient(circle at 35% 80%, rgba(129, 104, 237, .7), transparent 38%),
    linear-gradient(150deg, #252042, #433a72);
  display: flex;
  height: 210px;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
.persona-showcase__glow { border: 1px solid rgba(255,255,255,.13); border-radius: 50%; height: 260px; position: absolute; width: 260px; }
.persona-showcase__visual > span:not(.persona-showcase__ad-label) {
  align-items: center;
  background: linear-gradient(145deg, #e1dcff, #c2f5ee);
  border: 5px solid rgba(255, 255, 255, .55);
  border-radius: 50%;
  box-shadow: 0 18px 45px rgba(19, 16, 45, .35);
  color: #39316f;
  display: flex;
  font-size: 38px;
  font-weight: 900;
  height: 112px;
  justify-content: center;
  letter-spacing: -.06em;
  position: relative;
  width: 112px;
  z-index: 1;
}
.persona-showcase__visual > img {
  height: 100%;
  object-fit: cover;
  position: relative;
  width: 100%;
  z-index: 1;
}
.persona-showcase__content { padding: 19px; }
.persona-showcase__eyebrow { color: #6859d0; display: block; font-size: 9px; font-weight: 850; letter-spacing: .1em; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.persona-showcase h3 { color: #282a3d; font-size: 21px; letter-spacing: -.03em; margin: 4px 0 6px; }
.persona-showcase__content > p { color: #74788a; font-size: 11px; line-height: 1.55; margin: 0 0 11px; }
.persona-showcase__tags { display: flex; flex-wrap: wrap; gap: 5px; }
.persona-showcase__tags span { background: #f1effb; border-radius: 99px; color: #665b9c; font-size: 8px; font-weight: 750; padding: 4px 7px; }
.persona-showcase__meta { border-top: 1px solid #ededf2; display: grid; gap: 6px; margin-top: 13px; padding-top: 11px; }
.persona-showcase__meta span { align-items: center; color: #8a8e9e; display: flex; font-size: 8px; gap: 5px; }
.persona-showcase__meta b { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.persona-showcase__meta .ui-icon { height: 11px; width: 11px; }
.persona-showcase__cta { background: linear-gradient(135deg, #7464e8, #5d4dd4); border: 0; color: #fff; display: none; font-size: 9px; margin-top: 13px; min-height: 32px; width: 100%; }
.persona-showcase__reel-ui { display: none; position: absolute; right: 10px; top: 45%; z-index: 3; }
.persona-showcase__reel-ui i { background: rgba(255,255,255,.9); border-radius: 50%; display: block; height: 6px; margin: 10px 0; width: 6px; }
.persona-showcase__ad-label { background: rgba(22, 19, 49, .7); border-radius: 4px; color: #fff; display: none; font-size: 7px; left: 9px; padding: 3px 5px; position: absolute; top: 9px; z-index: 3; }

.persona-showcase[data-mode="reels"] { background: #141225; position: relative; }
.persona-showcase[data-mode="reels"] .persona-showcase__visual { height: 385px; }
.persona-showcase[data-mode="reels"] .persona-showcase__content { background: linear-gradient(transparent, rgba(16, 14, 32, .97)); bottom: 0; color: #fff; left: 0; padding-top: 50px; position: absolute; right: 0; z-index: 2; }
.persona-showcase[data-mode="reels"] h3 { color: #fff; font-size: 17px; }
.persona-showcase[data-mode="reels"] .persona-showcase__content > p { color: rgba(255,255,255,.78); }
.persona-showcase[data-mode="reels"] .persona-showcase__eyebrow { color: #8ff2e6; }
.persona-showcase[data-mode="reels"] .persona-showcase__meta,
.persona-showcase[data-mode="reels"] .persona-showcase__cta { display: none; }
.persona-showcase[data-mode="reels"] .persona-showcase__reel-ui { display: block; }

.persona-showcase[data-mode="ad"] .persona-showcase__visual { height: 185px; }
.persona-showcase[data-mode="ad"] .persona-showcase__ad-label,
.persona-showcase[data-mode="ad"] .persona-showcase__cta { display: block; }
.persona-showcase[data-mode="ad"] .persona-showcase__meta { display: none; }

.persona-preview-tip {
  align-items: flex-start;
  background: rgba(117, 100, 231, .1);
  border: 1px solid rgba(117, 100, 231, .2);
  border-radius: 10px;
  display: flex;
  gap: 9px;
  margin-top: 13px;
  padding: 11px;
}
.persona-preview-tip > span { color: #9689ef; flex: 0 0 auto; }
.persona-preview-tip .ui-icon { height: 14px; width: 14px; }
.persona-preview-tip p { color: #aaa6c5; font-size: 9px; line-height: 1.5; margin: 0; }
.persona-preview-tip strong { color: #d5d1ed; display: block; }

/* AI generator */
.persona-generator-tabs {
  background: #ececf2;
  border: 1px solid #dedfe7;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 18px;
  max-width: 380px;
  padding: 4px;
}

.autopilot-live {
  margin-bottom: 18px;
}

.autopilot-live-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.autopilot-live-list article,
.autopilot-live-list a {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: grid;
  gap: 6px;
  padding: 12px;
}

.autopilot-live-list small {
  color: var(--muted);
}
.persona-generator-tabs button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: #717587;
  display: flex;
  font-size: 11px;
  font-weight: 800;
  gap: 7px;
  justify-content: center;
  min-height: 36px;
}
.persona-generator-tabs button.is-active {
  background: #fff;
  box-shadow: 0 2px 8px rgba(36, 39, 61, .08);
  color: #5547bd;
}
.persona-generator-tabs .ui-icon { height: 14px; width: 14px; }
.persona-ai-layout[hidden] { display: none; }
.persona-ai-form { overflow: hidden; }
.persona-ai-form__head { align-items: center; background: #faf9ff; border-bottom: 1px solid #eceaf7; display: flex; gap: 12px; padding: 21px 24px; }
.persona-ai-form__head > span { align-items: center; background: #ece8ff; border-radius: 11px; color: #6251d6; display: flex; height: 42px; justify-content: center; width: 42px; }
.persona-ai-form__section { border-bottom: 1px solid #eeeeF3; padding: 23px 24px; }
.persona-advanced-options { border-bottom: 1px solid #ececf2; }
.persona-advanced-options summary { color: #595d70; cursor: pointer; font-size: 11px; font-weight: 800; list-style: none; padding: 17px 24px; }
.persona-advanced-options summary::-webkit-details-marker { display: none; }
.persona-advanced-options summary::after { content: "+"; float: right; font-size: 17px; font-weight: 400; }
.persona-advanced-options[open] summary::after { content: "−"; }
.persona-advanced-options summary small { color: #9b9eac; font-size: 8px; margin-left: 8px; text-transform: uppercase; }
.persona-advanced-options > .persona-fields-grid { background: #fafafd; padding: 0 24px 20px; }
.persona-ai-form__actions { align-items: center; display: flex; justify-content: space-between; padding: 18px 24px; }
.persona-ai-form__actions > div { align-items: center; color: #8b8f9f; display: flex; gap: 6px; }
.persona-ai-form__actions .ui-icon { color: #34a28e; height: 14px; width: 14px; }
.persona-ai-form__actions small { font-size: 9px; }

.persona-ai-guide { overflow: hidden; padding: 24px; position: sticky; top: 18px; }
.persona-ai-guide h2 { font-size: 21px; margin-bottom: 18px; }
.persona-ai-guide__steps { display: grid; gap: 3px; }
.persona-ai-guide__steps > div { align-items: flex-start; border-bottom: 1px solid #efeff3; display: flex; gap: 11px; padding: 13px 0; }
.persona-ai-guide__steps > div > span { align-items: center; background: #f1eefc; border-radius: 8px; color: #6858d5; display: flex; flex: 0 0 31px; height: 31px; justify-content: center; width: 31px; }
.persona-ai-guide__steps .ui-icon { height: 14px; width: 14px; }
.persona-ai-guide__steps p { display: grid; gap: 2px; margin: 0; }
.persona-ai-guide__steps strong { color: #45485c; font-size: 11px; }
.persona-ai-guide__steps small { color: #8e92a2; font-size: 9px; line-height: 1.4; }
.persona-ai-guide__models { background: linear-gradient(135deg, #f2efff, #edfafa); border: 1px solid #e3dffa; border-radius: 11px; display: grid; gap: 3px; margin-top: 18px; padding: 14px; }
.persona-ai-guide__models strong { color: #4f4690; font-size: 11px; }
.persona-ai-guide__models span { color: #6c5dd4; font-size: 17px; font-weight: 850; }
.persona-ai-guide__models small { color: #8884a4; font-size: 8px; line-height: 1.4; }

.persona-reference-upload {
  align-items: center;
  aspect-ratio: 16 / 9;
  background: #f7f7fa;
  border: 1px dashed #c9cad5;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  max-height: 360px;
  min-height: 220px;
  overflow: hidden;
  position: relative;
}
.persona-reference-upload:hover { border-color: #7464e2; }
.persona-reference-upload > input {
  height: 1px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 1px;
}
.persona-reference-upload > img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}
.persona-reference-upload__empty {
  align-items: center;
  color: #76798a;
  display: flex;
  flex-direction: column;
  gap: 6px;
  justify-content: center;
}
.persona-reference-upload__empty[hidden],
.persona-reference-upload > button[hidden] { display: none; }
.persona-reference-upload__empty > span {
  align-items: center;
  background: #ece9fb;
  border-radius: 8px;
  color: #6251d6;
  display: flex;
  height: 38px;
  justify-content: center;
  width: 38px;
}
.persona-reference-upload__empty .ui-icon { height: 17px; width: 17px; }
.persona-reference-upload__empty strong { color: #4a4d60; font-size: 12px; }
.persona-reference-upload__empty small { color: #999cab; font-size: 9px; }
.persona-reference-upload > button {
  align-items: center;
  background: rgba(24, 25, 35, .82);
  border: 0;
  border-radius: 6px;
  color: #fff;
  display: flex;
  height: 34px;
  justify-content: center;
  position: absolute;
  right: 10px;
  top: 10px;
  width: 34px;
}
.persona-reference-upload > button .ui-icon { height: 15px; width: 15px; }
.persona-reference-consent {
  align-items: flex-start;
  color: #646879;
  display: flex;
  font-size: 10px;
  gap: 8px;
  line-height: 1.45;
  margin-top: 12px;
}
.persona-reference-consent input { margin-top: 1px; }
.persona-reference-guide__preview {
  align-items: center;
  aspect-ratio: 4 / 3;
  background: #f2f2f6 var(--reference-preview) center / contain no-repeat;
  border: 1px solid #e1e1e8;
  border-radius: 8px;
  color: #918ba9;
  display: flex;
  justify-content: center;
  margin-bottom: 12px;
  overflow: hidden;
}
.persona-reference-guide__preview.has-image > span { display: none; }
.persona-reference-guide__preview .ui-icon { height: 25px; width: 25px; }

.persona-generated-result { margin-top: 20px; overflow: hidden; scroll-margin-top: 20px; }
.persona-result-head { background: #faf9ff; border-bottom: 1px solid #ebe9f5; padding: 24px; }
.persona-result-status { align-items: center; color: #1f806f; display: flex; font-size: 9px; font-weight: 850; gap: 8px; letter-spacing: .07em; margin-bottom: 7px; text-transform: uppercase; }
.persona-result-grid { display: grid; gap: 24px; grid-template-columns: minmax(310px, .75fr) minmax(0, 1.2fr); padding: 24px; }
.persona-result-preview .persona-showcase { margin: auto; max-width: 370px; }
.persona-showcase--generated { border: 1px solid #e2e1e9; box-shadow: 0 12px 30px rgba(33, 29, 66, .1); }
.persona-result-dna { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.persona-result-dna article { align-items: flex-start; background: #fbfbfd; border: 1px solid #e9e9ef; border-radius: 12px; display: flex; gap: 10px; padding: 14px; }
.persona-result-dna article > span { align-items: center; background: #efecfb; border-radius: 8px; color: #6555d1; display: flex; flex: 0 0 30px; height: 30px; justify-content: center; width: 30px; }
.persona-result-dna article .ui-icon { height: 14px; width: 14px; }
.persona-result-dna article > div { min-width: 0; }
.persona-result-dna small { color: #979aaa; display: block; font-size: 8px; font-weight: 750; text-transform: uppercase; }
.persona-result-dna strong { color: #414458; display: block; font-size: 11px; margin: 2px 0 4px; text-transform: capitalize; }
.persona-result-dna p { color: #7c8091; font-size: 9px; line-height: 1.45; margin: 0; }
.persona-quote { align-content: center; background: linear-gradient(135deg, #24203f, #393066); border-radius: 12px; color: #fff; display: grid; grid-column: 1 / -1; padding: 17px; }
.persona-quote span { color: #a9a1d7; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.persona-quote blockquote { font-size: 16px; font-weight: 650; margin: 5px 0 0; }
.persona-json-details { border-top: 1px solid #ececf2; }
.persona-json-details > summary { color: #696d7f; cursor: pointer; font-size: 11px; font-weight: 750; list-style: none; padding: 16px 24px; }
.persona-json-details > summary::after { content: "+"; float: right; font-size: 17px; font-weight: 400; }
.persona-json-details[open] > summary::after { content: "−"; }
.persona-json-details > .persona-json { border-radius: 0; margin: 0; max-height: 520px; }

/* Persona detail */
.persona-detail-hero {
  align-items: center;
  background:
    radial-gradient(circle at 12% 100%, rgba(97, 217, 202, .18), transparent 25%),
    linear-gradient(135deg, #18152f, #28224e);
  border-radius: 20px;
  color: #fff;
  display: flex;
  gap: 24px;
  justify-content: space-between;
  margin-bottom: 18px;
  min-height: 230px;
  padding: 30px 34px;
}
.persona-detail-hero__identity { align-items: center; display: grid; gap: 5px 18px; grid-template-columns: auto 1fr; }
.persona-detail-hero__identity > .persona-back-link { grid-column: 1 / -1; margin-bottom: 18px; }
.persona-detail-avatar { align-items: center; background: linear-gradient(145deg, #dcd5ff, #b7eee9); border: 4px solid rgba(255,255,255,.55); border-radius: 50%; color: #3b3470; display: flex; font-size: 30px; font-weight: 900; height: 104px; justify-content: center; overflow: hidden; width: 104px; }
.persona-detail-avatar img { height: 100%; object-fit: cover; width: 100%; }
.persona-detail-kicker { align-items: center; display: flex; gap: 10px; margin-bottom: 5px; }
.persona-detail-kicker .persona-status { position: static; }
.persona-detail-kicker small { color: #aaa6c2; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.persona-detail-hero h1 { color: #fff; font-size: 36px; letter-spacing: -.04em; margin: 0; }
.persona-detail-hero__identity p { color: rgba(255,255,255,.68); font-size: 12px; margin: 5px 0 11px; max-width: 650px; }
.persona-detail-hero .persona-card-chips span { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); color: #d8d5eb; }
.persona-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; max-width: 360px; }
.persona-detail-actions form { margin: 0; }
.persona-detail-actions .button { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); color: #fff; }
.persona-detail-actions .button:hover { background: rgba(255,255,255,.14); }

.persona-detail-overview { display: grid; gap: 16px; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .65fr); margin-bottom: 16px; }
.persona-health-card,
.persona-channel-card,
.persona-dna-studio,
.persona-assets-panel { padding: 22px; }
.persona-health-card > header { align-items: flex-start; display: flex; justify-content: space-between; }
.persona-health-card > header > strong { color: #5f50cf; font-size: 34px; letter-spacing: -.04em; }
.persona-health-track { background: #ececf3; border-radius: 99px; height: 7px; margin: 16px 0 19px; overflow: hidden; }
.persona-health-track i { background: linear-gradient(90deg, #7463e7, #44c8bd); border-radius: 99px; display: block; height: 100%; }
.persona-health-stats { display: grid; gap: 14px; grid-template-columns: repeat(3, 1fr); }
.persona-health-stats > div { border-right: 1px solid #ececf1; display: grid; gap: 2px; }
.persona-health-stats > div:last-child { border-right: 0; }
.persona-health-stats small { color: #9195a5; font-size: 9px; font-weight: 750; }
.persona-health-stats strong { color: #35384c; font-size: 17px; }
.persona-health-stats span { color: #a0a3b0; font-size: 8px; }
.persona-health-alert { align-items: flex-start; background: #fff7e9; border: 1px solid #f5dfba; border-radius: 10px; color: #9c681a; display: flex; gap: 9px; margin-top: 17px; padding: 11px; }
.persona-health-alert.is-good { background: #ebf9f5; border-color: #caede4; color: #267565; }
.persona-health-alert.is-error { background: #fff0f2; border-color: #f7d5dc; color: #a34457; }
.persona-health-alert .ui-icon { height: 15px; width: 15px; }
.persona-health-alert p { font-size: 9px; line-height: 1.45; margin: 0; }
.persona-health-alert strong { display: block; font-size: 10px; }
.persona-channel-card { background: linear-gradient(145deg, #faf9ff, #f3fbfb); }
.persona-channel-card > div { display: grid; gap: 8px; margin-top: 17px; }
.persona-channel-card > div > span { align-items: center; background: #fff; border: 1px solid #e8e7f0; border-radius: 10px; display: grid; gap: 0 9px; grid-template-columns: auto 1fr; padding: 10px; }
.persona-channel-card > div > span .ui-icon { color: #6757d4; grid-row: 1 / 3; height: 17px; width: 17px; }
.persona-channel-card b { color: #4b4e62; font-size: 10px; }
.persona-channel-card small { color: #9699a8; font-size: 8px; }

.persona-dna-studio,
.persona-assets-panel { margin-bottom: 16px; }
.persona-dna-cards { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 20px; }
.persona-dna-cards article { border: 1px solid #e8e8ee; border-radius: 13px; min-width: 0; padding: 15px; }
.persona-dna-cards .persona-dna-icon { margin-bottom: 13px; }
.persona-dna-cards article > small { color: #9699a9; display: block; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.persona-dna-cards h3 { color: #3c3f53; font-size: 13px; margin: 4px 0 7px; text-transform: capitalize; }
.persona-dna-cards p { color: #7c8091; font-size: 9px; line-height: 1.5; margin: 0 0 12px; min-height: 40px; }
.persona-dna-cards article > div { display: flex; flex-wrap: wrap; gap: 5px; }

.persona-assets-panel > header > span { background: #f1eefc; border-radius: 99px; color: #6656d2; font-size: 9px; font-weight: 800; padding: 6px 9px; }
.persona-asset-summary { display: grid; gap: 11px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 18px; }
.persona-asset-summary > div { align-items: center; background: #fafafd; border: 1px solid #eaeaf0; border-radius: 11px; display: grid; gap: 0 10px; grid-template-columns: auto 1fr; padding: 13px; }
.persona-asset-summary > div > span { align-items: center; background: #efecfb; border-radius: 8px; color: #6555d1; display: flex; grid-row: 1 / 3; height: 31px; justify-content: center; width: 31px; }
.persona-asset-summary .ui-icon { height: 14px; width: 14px; }
.persona-asset-summary strong { color: #3f4256; font-size: 15px; }
.persona-asset-summary small { color: #9295a5; font-size: 8px; }
.persona-json-details--detail { margin-bottom: 18px; overflow: hidden; }
.persona-json-details--detail > .persona-dna-grid { padding: 0 20px 20px; }

/* Preview dialog */
.persona-preview-dialog {
  background: #f8f8fc;
  border: 1px solid #e2e0eb;
  border-radius: 18px;
  box-shadow: 0 30px 90px rgba(19, 17, 39, .35);
  max-height: calc(100dvh - 30px);
  max-width: 720px;
  padding: 23px;
  width: calc(100% - 30px);
}
.persona-preview-dialog::backdrop { backdrop-filter: blur(4px); background: rgba(17, 15, 35, .65); }
.persona-dialog-close { background: #fff; border-color: #e2e2e9; color: #747888; height: 32px; padding: 0; position: absolute; right: 16px; top: 16px; width: 32px; z-index: 2; }
.persona-dialog-close .ui-icon { height: 15px; width: 15px; }
.persona-dialog-head { padding-right: 45px; }
.persona-dialog-head h2 { color: #2f3245; font-size: 22px; margin: 0; }
.persona-dialog-head p { color: #808495; font-size: 11px; margin: 4px 0 15px; }
.persona-preview-dialog .persona-preview-modes { margin-left: auto; max-width: 310px; }
.persona-showcase--dialog { border: 1px solid #e2e1e8; display: grid; grid-template-columns: 1.15fr 1fr; min-height: 355px; }
.persona-showcase--dialog .persona-showcase__visual { height: 100%; min-height: 355px; }
.persona-showcase--dialog .persona-showcase__content { align-content: center; display: grid; padding: 28px; }
.persona-showcase--dialog[data-mode="reels"] { display: block; margin: auto; max-width: 335px; min-height: 0; }
.persona-showcase--dialog[data-mode="reels"] .persona-showcase__visual { min-height: 510px; }
.persona-showcase--dialog[data-mode="reels"] .persona-showcase__content { display: block; }
.persona-showcase--dialog[data-mode="ad"] { grid-template-columns: 1fr 1.1fr; min-height: 300px; }
.persona-showcase--dialog[data-mode="ad"] .persona-showcase__visual { height: 100%; min-height: 300px; }
.persona-preview-dialog > footer { display: flex; gap: 8px; justify-content: flex-end; padding-top: 15px; }

@media (max-width: 1240px) {
  .persona-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-filter-bar { grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(130px, .45fr)) auto; }
  .persona-filter-bar select[name="sort"] { display: none; }
  .persona-dna-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1020px) {
  .persona-studio-hero { grid-template-columns: 1fr; }
  .persona-hero-actions { display: flex; min-width: 0; }
  .persona-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-builder-layout,
  .persona-ai-layout,
  .persona-detail-overview { grid-template-columns: 1fr; }
  .persona-live-preview,
  .persona-ai-guide { position: static; }
  .persona-live-preview { margin: auto; max-width: 430px; width: 100%; }
  .persona-ai-guide__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-detail-hero { align-items: flex-start; flex-direction: column; }
  .persona-detail-actions { justify-content: flex-start; max-width: none; }
  .persona-result-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .persona-studio-hero,
  .persona-detail-hero {
    border-radius: 0;
    margin: -18px -18px 18px;
    padding: 24px 18px;
  }
  .persona-studio-hero h1 { font-size: 32px; }
  .persona-hero-actions,
  .persona-detail-actions { align-items: stretch; display: grid; width: 100%; }
  .persona-metrics,
  .persona-library-grid,
  .persona-fields-grid,
  .persona-result-dna,
  .persona-health-stats,
  .persona-dna-cards,
  .persona-asset-summary { grid-template-columns: 1fr; }
  .persona-library { border-radius: 13px; padding: 15px; }
  .persona-library-head { align-items: flex-start; }
  .persona-view-toggle { display: none; }
  .persona-filter-bar { grid-template-columns: 1fr; }
  .persona-library-grid.is-list-view .persona-library-card { display: flex; }
  .persona-creation-progress > div { padding: 12px; }
  .persona-creation-progress small { display: none; }
  .persona-creation-progress > div { gap: 5px; grid-template-columns: auto 1fr; }
  .persona-form-section,
  .persona-ai-form__section { padding: 20px 16px; }
  .persona-field--wide { grid-column: auto; }
  .persona-builder-actions,
  .persona-ai-form__actions { align-items: stretch; flex-direction: column; }
  .persona-builder-actions > div { margin: 0 0 7px; }
  .persona-builder-actions .button,
  .persona-ai-form__actions .button { justify-content: center; width: 100%; }
  .persona-ai-guide__steps { grid-template-columns: 1fr; }
  .persona-result-head,
  .persona-dna-studio > header,
  .persona-assets-panel > header { align-items: flex-start; flex-direction: column; }
  .persona-result-head form,
  .persona-result-head .button { width: 100%; }
  .persona-result-grid { padding: 16px; }
  .persona-detail-hero__identity { align-items: flex-start; grid-template-columns: 1fr; }
  .persona-detail-avatar { height: 88px; width: 88px; }
  .persona-detail-hero h1 { font-size: 30px; }
  .persona-health-stats > div { border-bottom: 1px solid #ececf1; border-right: 0; padding-bottom: 9px; }
  .persona-showcase--dialog { display: block; }
  .persona-showcase--dialog .persona-showcase__visual { min-height: 260px; }
  .persona-preview-dialog { padding: 17px; }
}

/* AIsa persona image studio */
.persona-assets-actions {
  align-items: center;
  display: flex;
  gap: 9px;
}

.persona-assets-actions > span {
  background: #f1eefc;
  border-radius: 99px;
  color: #6656d2;
  font-size: 9px;
  font-weight: 800;
  padding: 6px 9px;
}

.persona-assets-actions .button {
  font-size: 10px;
  min-height: 34px;
}

.persona-image-gallery {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 20px;
}

.persona-image-gallery article {
  background: #fafafd;
  border: 1px solid #e7e7ee;
  border-radius: 8px;
  min-width: 0;
  overflow: hidden;
  position: relative;
}

.persona-image-preview {
  background: #ececf2;
  border: 0;
  cursor: zoom-in;
  display: block;
  padding: 0;
  position: relative;
  width: 100%;
}

.persona-image-gallery img {
  aspect-ratio: 1;
  display: block;
  object-fit: cover;
  transition: filter 160ms ease, transform 160ms ease;
  width: 100%;
}

.persona-image-preview > span {
  align-items: center;
  background: rgba(27, 24, 48, .78);
  border-radius: 50%;
  color: #fff;
  display: flex;
  height: 30px;
  justify-content: center;
  opacity: 0;
  position: absolute;
  right: 9px;
  top: 9px;
  transform: translateY(-3px);
  transition: opacity 160ms ease, transform 160ms ease;
  width: 30px;
}

.persona-image-preview > span .ui-icon {
  height: 14px;
  width: 14px;
}

.persona-image-preview:hover img,
.persona-image-preview:focus-visible img {
  filter: brightness(.9);
  transform: scale(1.015);
}

.persona-image-preview:hover > span,
.persona-image-preview:focus-visible > span {
  opacity: 1;
  transform: translateY(0);
}

.persona-image-gallery article > div {
  display: grid;
  gap: 2px;
  padding: 10px;
}

.persona-image-gallery strong {
  color: #45485b;
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.persona-image-gallery article > div span {
  color: #9296a5;
  font-size: 8px;
  text-transform: capitalize;
}

.persona-image-gallery article > small {
  background: rgba(33, 29, 69, .78);
  border-radius: 99px;
  color: #fff;
  font-size: 8px;
  font-weight: 800;
  left: 8px;
  padding: 5px 7px;
  position: absolute;
  top: 8px;
  z-index: 2;
}

.persona-asset-viewer {
  background: #fff;
  border: 1px solid #dedee7;
  border-radius: 8px;
  box-shadow: 0 28px 90px rgba(16, 14, 30, .42);
  max-height: calc(100dvh - 28px);
  max-width: 1080px;
  overflow: hidden;
  padding: 0;
  width: calc(100% - 28px);
}

.persona-asset-viewer::backdrop {
  backdrop-filter: blur(5px);
  background: rgba(15, 14, 24, .76);
}

.persona-asset-viewer > header {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid #e8e8ee;
  display: flex;
  justify-content: space-between;
  padding: 15px 18px;
}

.persona-asset-viewer h2 {
  color: #343746;
  font-size: 16px;
  letter-spacing: 0;
  margin: 2px 0 0;
}

.persona-asset-viewer__stage {
  align-items: center;
  background: #18181e;
  display: flex;
  justify-content: center;
  min-height: 300px;
  overflow: auto;
  padding: 18px;
}

.persona-asset-viewer__stage img {
  display: block;
  max-height: calc(100dvh - 190px);
  max-width: 100%;
  object-fit: contain;
}

.persona-asset-viewer > footer {
  align-items: center;
  border-top: 1px solid #e8e8ee;
  display: flex;
  gap: 9px;
  padding: 13px 18px;
}

.persona-asset-viewer > footer > div {
  display: grid;
  gap: 2px;
  margin-right: auto;
  min-width: 0;
}

.persona-asset-viewer > footer strong {
  color: #414453;
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.persona-asset-viewer > footer span {
  color: #8f92a0;
  font-size: 8px;
}

.persona-danger-button {
  background: #fff4f4;
  border-color: #efcaca;
  color: #a53c3c;
}

.persona-danger-button:hover {
  background: #fee9e9;
  border-color: #e7b4b4;
}

.persona-images-empty {
  align-items: center;
  background: linear-gradient(135deg, #faf9ff, #f4fbfb);
  border: 1px dashed #d9d6ec;
  border-radius: 12px;
  display: grid;
  gap: 12px;
  grid-template-columns: auto 1fr auto;
  margin-top: 19px;
  padding: 17px;
}

.persona-images-empty > span {
  align-items: center;
  background: #ebe7fc;
  border-radius: 10px;
  color: #6554d3;
  display: flex;
  height: 38px;
  justify-content: center;
  width: 38px;
}

.persona-images-empty strong {
  color: #45485b;
  display: block;
  font-size: 11px;
}

.persona-images-empty p {
  color: #8a8e9f;
  font-size: 9px;
  margin: 3px 0 0;
}

.persona-image-dialog {
  background: #f8f8fc;
  border: 1px solid #e1dfea;
  border-radius: 19px;
  box-shadow: 0 30px 100px rgba(17, 15, 37, .38);
  max-height: calc(100dvh - 28px);
  max-width: 840px;
  padding: 0;
  width: calc(100% - 28px);
}

.persona-image-dialog::backdrop {
  backdrop-filter: blur(5px);
  background: rgba(17, 15, 35, .68);
}

.persona-image-dialog > form > header {
  align-items: flex-start;
  background:
    radial-gradient(circle at 80% 0%, rgba(90, 218, 205, .15), transparent 31%),
    linear-gradient(135deg, #1b1736, #30265f);
  color: #fff;
  display: flex;
  justify-content: space-between;
  padding: 24px 27px;
  position: relative;
}

.persona-image-dialog header h2 {
  color: #fff;
  font-size: 24px;
  letter-spacing: 0;
  margin: 0;
}

.persona-image-dialog header p {
  color: rgba(255, 255, 255, .68);
  font-size: 10px;
  line-height: 1.5;
  margin: 5px 0 0;
  max-width: 650px;
}

.persona-image-dialog header .persona-form-kicker {
  color: #72dfd3;
}

.persona-image-dialog header .persona-dialog-close {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .18);
  color: #fff;
  position: static;
}

.persona-image-provider {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid #e9e9ef;
  display: grid;
  gap: 12px;
  grid-template-columns: auto 1fr auto;
  padding: 15px 27px;
}

.persona-image-provider__mark {
  align-items: center;
  background: linear-gradient(145deg, #7563e8, #36beb8);
  border-radius: 10px;
  color: #fff;
  display: flex;
  font-size: 12px;
  font-weight: 900;
  height: 38px;
  justify-content: center;
  width: 38px;
}

.persona-image-provider > div {
  display: grid;
  gap: 1px;
}

.persona-image-provider small {
  color: #999cab;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.persona-image-provider strong {
  color: #424558;
  font-size: 11px;
}

.persona-image-provider > div > span {
  color: #969aaa;
  font-size: 8px;
}

.persona-provider-status {
  align-items: center;
  background: #fff5e8;
  border: 1px solid #f4dfbd;
  border-radius: 99px;
  color: #9f6c20;
  display: inline-flex;
  font-size: 8px;
  font-weight: 850;
  gap: 6px;
  padding: 6px 8px;
  text-transform: uppercase;
}

.persona-provider-status i {
  background: #d99a38;
  border-radius: 50%;
  height: 6px;
  width: 6px;
}

.persona-provider-status.is-ready {
  background: #e9f8f4;
  border-color: #c8ebe2;
  color: #287565;
}

.persona-provider-status.is-ready i { background: #2aae91; }

.persona-identity-reference {
  align-items: center;
  background: #eef8f5;
  border-bottom: 1px solid #d5ebe5;
  color: #35675d;
  display: grid;
  gap: 10px;
  grid-template-columns: 42px auto 1fr;
  padding: 10px 27px;
}

.persona-identity-reference img {
  border: 2px solid #fff;
  border-radius: 50%;
  height: 42px;
  object-fit: cover;
  width: 42px;
}

.persona-identity-reference > span {
  align-items: center;
  background: #d7efe8;
  border-radius: 50%;
  display: flex;
  height: 24px;
  justify-content: center;
  width: 24px;
}

.persona-identity-reference > span .ui-icon {
  height: 13px;
  width: 13px;
}

.persona-identity-reference > div {
  display: grid;
  gap: 2px;
}

.persona-identity-reference strong { font-size: 10px; }
.persona-identity-reference small { color: #678b83; font-size: 8px; }

.persona-image-config-alert {
  align-items: center;
  background: #fff7e9;
  border: 1px solid #f3dfba;
  border-radius: 11px;
  color: #93641d;
  display: grid;
  gap: 11px;
  grid-template-columns: auto 1fr auto;
  margin: 15px 27px 0;
  padding: 12px;
}

.persona-image-config-alert > span {
  align-items: center;
  background: #ffebc8;
  border-radius: 8px;
  display: flex;
  height: 31px;
  justify-content: center;
  width: 31px;
}

.persona-image-config-alert .ui-icon {
  height: 15px;
  width: 15px;
}

.persona-image-config-alert p {
  font-size: 9px;
  line-height: 1.45;
  margin: 0;
}

.persona-image-config-alert strong { display: block; font-size: 10px; }
.persona-image-config-alert .button { background: #fff; font-size: 9px; min-height: 32px; }

.persona-image-form-body {
  display: grid;
  gap: 0;
  padding: 0 27px;
}

.persona-image-form-body > section {
  border-bottom: 1px solid #e9e9ef;
  padding: 20px 0;
}

.persona-image-type-grid {
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.persona-image-type-grid label { cursor: pointer; }
.persona-image-type-grid input { position: absolute; opacity: 0; pointer-events: none; }

.persona-image-type-grid label > span {
  align-items: center;
  background: #fff;
  border: 1px solid #e1e2e9;
  border-radius: 11px;
  color: #6a6e80;
  display: grid;
  gap: 1px 8px;
  grid-template-columns: auto 1fr;
  min-height: 63px;
  padding: 11px;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.persona-image-type-grid label > span .ui-icon {
  color: #7162d7;
  grid-row: 1 / 3;
  height: 17px;
  width: 17px;
}

.persona-image-type-grid b { color: #494c60; font-size: 10px; }
.persona-image-type-grid small { color: #979aaa; font-size: 8px; }

.persona-image-type-grid input:checked + span {
  background: #f4f1ff;
  border-color: #8273e2;
  box-shadow: 0 0 0 2px rgba(117, 99, 231, .1);
}

.persona-set-profile {
  align-items: flex-start;
  background: #f4f2fc;
  border: 1px solid #e3dff5;
  border-radius: 10px;
  display: flex;
  gap: 9px;
  margin: 18px 0;
  padding: 12px;
}

.persona-set-profile input { margin-top: 2px; }
.persona-set-profile > span { display: grid; gap: 2px; }
.persona-set-profile strong { color: #4d496e; font-size: 10px; }
.persona-set-profile small { color: #8e8aa4; font-size: 8px; }

.persona-image-dialog > form > footer {
  align-items: center;
  background: #fff;
  border-top: 1px solid #e7e7ed;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 15px 27px;
}

.persona-image-dialog footer > span {
  color: #9699a8;
  font-size: 8px;
  margin-right: auto;
}

.persona-image-dialog footer > span b { color: #6256a1; }

.persona-video-library {
  border-bottom: 1px solid #e8e8ef;
  margin-bottom: 22px;
  padding-bottom: 22px;
  scroll-margin-top: 76px;
}

.persona-image-framing-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.persona-video-library > header {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.persona-video-library h3 {
  color: #343747;
  font-size: 15px;
  margin: 3px 0 0;
}

.persona-video-library > header > strong {
  color: #737688;
  font-size: 10px;
}

.persona-video-gallery {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 270px));
  margin-top: 14px;
}

.persona-video-gallery article {
  background: #fafafd;
  border: 1px solid #e7e7ee;
  border-radius: 8px;
  min-width: 0;
  overflow: hidden;
}

.persona-video-gallery video {
  aspect-ratio: 9 / 16;
  background: #171624;
  display: block;
  object-fit: cover;
  width: 100%;
}

.persona-video-task-state {
  align-content: center;
  aspect-ratio: 9 / 16;
  background: #eef6f5;
  color: #315d58;
  display: grid;
  gap: 9px;
  justify-items: center;
  padding: 22px;
  text-align: center;
}

.persona-video-task-icon {
  animation: persona-video-spin 1.4s linear infinite;
  border: 3px solid #a7cec8;
  border-radius: 50%;
  border-top-color: #25877c;
  color: #25877c;
  height: 28px;
  width: 28px;
}

.persona-video-task-state > strong { font-size: 11px; }

.persona-video-task-state > small {
  color: #66847f;
  font-size: 9px;
  line-height: 1.5;
  max-width: 180px;
}

.persona-video-task-state > div {
  background: #d5e5e2;
  border-radius: 3px;
  height: 5px;
  overflow: hidden;
  width: min(150px, 100%);
}

.persona-video-task-state > div > i {
  background: #25877c;
  display: block;
  height: 100%;
  transition: width .3s ease;
  width: 4%;
}

.persona-video-task-state.is-failed {
  background: #fff4f2;
  color: #8d3f34;
}

.persona-video-task-state.is-failed .persona-video-task-icon {
  animation: none;
  border: 0;
  color: #b85849;
}

.persona-video-task-state.is-failed > small { color: #925d55; }
.persona-video-task-state.is-failed > div { display: none; }

@keyframes persona-video-spin { to { transform: rotate(360deg); } }

.persona-video-gallery article > div:not(.persona-video-task-state) {
  display: grid;
  gap: 3px;
  padding: 11px;
}

.persona-video-gallery article > div:not(.persona-video-task-state) > strong {
  color: #45485b;
  font-size: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.persona-video-gallery article > div:not(.persona-video-task-state) > span {
  color: #9296a5;
  font-size: 8px;
  text-transform: capitalize;
}

.persona-video-gallery .persona-video-product-tag {
  align-items: center;
  color: #356f66;
  display: flex;
  font-size: 8px;
  font-weight: 750;
  gap: 4px;
  margin-top: 4px;
  min-width: 0;
  text-decoration: none;
}

.persona-video-product-tag::before {
  flex: 0 0 auto;
  height: 11px;
  width: 11px;
}

.persona-video-product-picker {
  display: grid;
  gap: 10px;
}

.persona-video-product-preview {
  align-items: center;
  background: #f5faf9;
  border: 1px solid #cfe4df;
  border-radius: 8px;
  display: grid;
  gap: 11px;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  padding: 9px;
}

.persona-video-product-preview[hidden] { display: none; }

.persona-video-product-image {
  align-items: center;
  background: #fff;
  border: 1px solid #dbe8e5;
  border-radius: 6px;
  display: flex;
  height: 52px;
  justify-content: center;
  overflow: hidden;
  width: 52px;
}

.persona-video-product-image img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

.persona-video-product-image span {
  color: #4f857d;
  height: 20px;
  width: 20px;
}

.persona-video-product-preview > div:nth-child(2) {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.persona-video-product-preview strong,
.persona-video-product-preview span,
.persona-video-product-preview small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.persona-video-product-preview strong { color: #344c4a; font-size: 10px; }
.persona-video-product-preview span { color: #55726f; font-size: 9px; }
.persona-video-product-preview small { color: #839692; font-size: 8px; }
.persona-video-product-preview > a { color: #356f66; font-size: 9px; font-weight: 750; }

.persona-video-dialog .persona-image-provider__mark {
  background: #172b35;
  border-color: #2d6573;
  color: #7ee0d1;
}

.persona-video-reference-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.persona-video-reference-grid label {
  cursor: pointer;
  min-width: 0;
  position: relative;
}

.persona-video-reference-grid input {
  height: 1px;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.persona-video-reference-grid label > span {
  background: #fff;
  border: 2px solid #e2e1eb;
  border-radius: 8px;
  display: grid;
  gap: 4px;
  height: 100%;
  min-height: 146px;
  overflow: hidden;
  padding: 7px;
}

.persona-video-reference-grid input:checked + span {
  border-color: #6656d2;
  box-shadow: 0 0 0 2px rgba(102, 86, 210, .12);
}

.persona-video-reference-grid input:focus-visible + span {
  outline: 2px solid #1967d2;
  outline-offset: 2px;
}

.persona-video-reference-grid img {
  aspect-ratio: 1;
  border-radius: 5px;
  object-fit: cover;
  width: 100%;
}

.persona-video-reference-grid b {
  color: #4d496e;
  font-size: 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.persona-video-reference-grid small {
  color: #8e8aa4;
  font-size: 8px;
}

.persona-video-reference-grid .persona-video-reference-auto {
  align-content: center;
  justify-items: center;
  text-align: center;
}

.persona-video-reference-grid .persona-video-reference-auto::before {
  color: #6656d2;
  height: 25px;
  width: 25px;
}

.persona-video-reference-grid label.is-disabled {
  cursor: not-allowed;
  opacity: .48;
}

.persona-video-reference-alert {
  align-items: flex-start;
  background: #fff8e8;
  border: 1px solid #f1d898;
  border-radius: 8px;
  color: #6f541b;
  display: flex;
  gap: 10px;
  padding: 13px;
}

.persona-video-reference-alert > span {
  flex: 0 0 auto;
  height: 18px;
  width: 18px;
}

.persona-video-reference-alert p {
  font-size: 9px;
  line-height: 1.55;
  margin: 0;
}

.persona-video-dialog button[aria-busy="true"] {
  cursor: wait;
  opacity: .72;
}

@media (max-width: 1020px) {
  .persona-image-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .persona-assets-actions { align-items: stretch; flex-direction: column; width: 100%; }
  .persona-assets-actions .button { justify-content: center; }
  .persona-image-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-images-empty { grid-template-columns: auto 1fr; }
  .persona-images-empty .button { grid-column: 1 / -1; justify-content: center; }
  .persona-image-dialog > form > header,
  .persona-image-provider,
  .persona-identity-reference,
  .persona-image-form-body,
  .persona-image-dialog > form > footer { padding-left: 17px; padding-right: 17px; }
  .persona-image-provider { grid-template-columns: auto 1fr; }
  .persona-provider-status { grid-column: 1 / -1; justify-self: start; }
  .persona-image-config-alert { align-items: flex-start; grid-template-columns: auto 1fr; margin-left: 17px; margin-right: 17px; }
  .persona-image-config-alert .button { grid-column: 1 / -1; justify-content: center; width: 100%; }
  .persona-image-type-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-image-dialog > form > footer { align-items: stretch; flex-direction: column; }
  .persona-image-dialog footer > span { margin: 0 0 5px; }
  .persona-image-dialog footer .button { justify-content: center; width: 100%; }
  .persona-video-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-video-reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .persona-video-product-preview { grid-template-columns: 52px minmax(0, 1fr); }
  .persona-video-product-preview > a { grid-column: 2; }
  .persona-asset-viewer > header { padding: 13px 15px; }
  .persona-asset-viewer__stage { min-height: 220px; padding: 10px; }
  .persona-asset-viewer__stage img { max-height: calc(100dvh - 250px); }
  .persona-asset-viewer > footer {
    align-items: stretch;
    flex-direction: column;
    padding: 12px 15px;
  }
  .persona-asset-viewer > footer > div { margin: 0 0 4px; }
  .persona-asset-viewer > footer .button { justify-content: center; width: 100%; }
}
.persona-social-panel{margin-top:28px;padding:28px;border:1px solid #e2e8f0;border-radius:24px;background:#fff}.persona-social-panel>header{display:flex;justify-content:space-between;gap:20px;align-items:start}.persona-social-panel h2{margin:4px 0}.persona-social-panel header p{margin:0;color:#64748b}.persona-social-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:24px 0}.persona-social-summary div{padding:16px;border-radius:16px;background:#f8fafc}.persona-social-summary strong,.persona-social-summary small{display:block}.persona-social-summary strong{font-size:24px}.persona-social-summary small{color:#64748b}.persona-social-tabs{display:flex;gap:6px;overflow:auto;border-bottom:1px solid #e2e8f0;margin-bottom:20px}.persona-social-tabs button{border:0;background:none;padding:12px;color:#64748b;white-space:nowrap}.persona-social-tabs .is-active{color:#4f46e5;border-bottom:2px solid #4f46e5}.persona-social-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}.persona-social-card{border:1px solid #e2e8f0;border-radius:18px;padding:18px}.persona-social-brand{display:flex;align-items:center;gap:12px}.persona-social-brand>span{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#6366f1;color:#fff;font-weight:800}.persona-social-brand h3,.persona-social-brand p{margin:2px 0}.persona-social-brand>b{margin-left:auto;font-size:11px;color:#4f46e5}.persona-social-status,.persona-social-badges{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}.persona-social-status span,.persona-social-badges span{padding:5px 9px;border-radius:999px;background:#eef2ff;font-size:11px}.persona-social-card dl{display:grid;grid-template-columns:1fr 1fr;gap:10px}.persona-social-card dt{font-size:11px;color:#64748b}.persona-social-card dd{margin:3px 0;font-size:12px}.persona-social-actions{display:flex;gap:7px;flex-wrap:wrap}.persona-social-actions .button{font-size:12px}.persona-social-empty{grid-column:1/-1;text-align:center;padding:40px;background:#f8fafc;border-radius:18px}.persona-social-dialog{width:min(720px,94vw);border:0;border-radius:22px;padding:0;box-shadow:0 24px 80px #0f172a44}.persona-social-dialog::backdrop{background:#0f172a99}.persona-social-dialog form,.persona-social-dialog>div{padding:24px}.persona-social-dialog header,.persona-social-dialog footer{display:flex;justify-content:space-between;gap:12px;align-items:center}.persona-social-dialog header>button{font-size:28px;border:0;background:none}.persona-social-dialog footer{margin-top:22px;justify-content:flex-end}.persona-social-safety{padding:12px;margin-top:16px;border-radius:12px;background:#ecfdf5;color:#047857;font-size:13px}
.persona-social-groups{border-top:1px solid #e2e8f0;margin-top:24px;padding-top:22px}.persona-social-groups>header{align-items:start;display:flex;gap:16px;justify-content:space-between}.persona-social-groups h3{margin:4px 0}.persona-social-groups p{margin:0;max-width:720px}.persona-social-group-list{display:grid;gap:9px;margin-top:16px}.persona-social-group-list article{align-items:center;border:1px solid #e2e8f0;border-radius:14px;display:flex;gap:16px;justify-content:space-between;padding:13px 14px}.persona-social-group-list article>div:first-child{display:grid;gap:3px;min-width:0}.persona-social-group-list strong{color:#172033}.persona-social-group-list span,.persona-social-group-list small{color:#64748b;font-size:12px}.persona-social-group-list a{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.persona-social-group-list article>div:last-child{display:flex;flex:0 0 auto;gap:7px}.persona-social-groups-empty{background:#f8fafc;border-radius:12px;color:#64748b;margin:0;padding:18px;text-align:center}
.keyword-library-page{display:grid;gap:18px;margin:0 auto;max-width:1440px;padding:6px 0 28px}.keyword-library-hero{align-items:end;display:flex;gap:20px;justify-content:space-between;padding:6px 2px}.keyword-library-hero h1{margin:4px 0 7px}.keyword-library-hero p{margin:0;max-width:760px}.keyword-library-site{background:#ecfdf5;border:1px solid #a7f3d0;border-radius:999px;color:#065f46;font-size:12px;padding:8px 11px;white-space:nowrap}.keyword-library-search{align-items:end;display:grid;gap:14px;grid-template-columns:minmax(260px,1.5fr) minmax(260px,1.7fr) 130px auto;margin:0}.keyword-library-search>div{grid-row:span 2}.keyword-library-search h2,.keyword-library-search p{margin:0}.keyword-library-search p{font-size:12px;margin-top:5px}.keyword-library-search label{display:grid;gap:6px}.keyword-library-results,.keyword-library-saved{margin:0}.keyword-library-results>header,.keyword-library-saved>header{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:16px}.keyword-library-results h2,.keyword-library-results p,.keyword-library-saved h2,.keyword-library-saved p{margin:0}.keyword-library-results header>span,.keyword-library-saved header>span{background:#f8fafc;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:11px;padding:6px 9px}.keyword-candidate-list{display:grid;gap:9px}.keyword-candidate-list form{align-items:center;background:#fafafa;border:1px solid var(--line);border-radius:10px;display:grid;gap:12px;grid-template-columns:minmax(220px,1fr) 92px minmax(220px,.9fr) auto;padding:11px 12px}.keyword-candidate-list form>div:first-child{display:grid;gap:3px}.keyword-candidate-list small{color:var(--muted);font-size:11px}.keyword-candidate-list label{display:grid;gap:4px}.keyword-candidate-list label span{color:var(--muted);font-size:10px;font-weight:650;text-transform:uppercase}.keyword-candidate-list input{min-height:34px;padding:5px 7px}.keyword-scores{display:flex;flex-wrap:wrap;gap:6px}.keyword-scores span,.keyword-confidence{border-radius:999px;font-size:11px;padding:5px 7px}.keyword-scores span{background:#eef2ff;color:#3730a3}.keyword-confidence{background:#fef3c7;color:#92400e}.keyword-confidence.high{background:#dcfce7;color:#166534}.keyword-confidence.medium{background:#dbeafe;color:#1d4ed8}.keyword-library-saved tr.is-inactive{opacity:.5}.keyword-library-saved form{margin:0}@media(max-width:1040px){.keyword-library-search{grid-template-columns:1fr 1fr auto}.keyword-library-search>div{grid-column:1/-1;grid-row:auto}.keyword-candidate-list form{grid-template-columns:minmax(180px,1fr) 88px auto}.keyword-candidate-list .keyword-scores{grid-column:1/-1}}@media(max-width:620px){.keyword-library-hero,.keyword-library-results>header,.keyword-library-saved>header{align-items:start;flex-direction:column}.keyword-library-search,.keyword-candidate-list form{grid-template-columns:1fr}.keyword-library-search .button{width:100%}.persona-social-groups>header,.persona-social-group-list article{align-items:start;flex-direction:column}.persona-social-group-list article>div:last-child{width:100%}.persona-social-group-list .button{flex:1}.keyword-library-site{white-space:normal}}
.sites-management-actions{align-items:center;display:flex;gap:8px}.sites-management td>form{margin-top:8px}.sites-management .button.danger{border-color:#fecaca;color:#b91c1c}.sites-management .button.danger:hover{background:#fff1f2;border-color:#fca5a5}
.landing-template-header-actions{display:flex;gap:10px;flex-wrap:wrap}.landing-ai-model-stack{display:flex;align-items:center;gap:10px;padding:14px;margin-bottom:18px;border:1px solid #ddd6fe;border-radius:14px;background:linear-gradient(135deg,#f5f3ff,#eef2ff)}.landing-ai-model-stack span{display:flex;flex-direction:column;font-weight:800;color:#312e81}.landing-ai-model-stack small{font-size:10px;font-weight:500;color:#64748b}.landing-ai-model-stack i{font-style:normal;color:#7c3aed}.landing-ai-model-stack b{margin-left:auto;padding:6px 10px;border-radius:999px;background:#111827;color:#fff;font-size:11px}.landing-ai-prime-info{display:flex;flex-direction:column;gap:5px;margin-top:16px;padding:14px;border-radius:12px;background:#ecfdf5;color:#065f46}.landing-ai-prime-info span{font-size:12px;line-height:1.6}
@media(max-width:720px){.persona-social-panel{padding:18px}.persona-social-panel>header{display:block}.persona-social-panel>header .button{margin-top:12px}.persona-social-summary{grid-template-columns:repeat(2,1fr)}.persona-social-grid{grid-template-columns:1fr}}

/* Audience profiles */
.audience-shell{--audience-ink:#17233b;--audience-muted:#6c7890;--audience-line:#e5eaf2;--audience-soft:#f5f7fb;--audience-violet:#6558d9;display:grid;gap:22px;max-width:1540px;margin:0 auto;padding:4px 0 36px;color:var(--audience-ink)}
.audience-hero,.audience-detail-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;padding:28px 32px;border:1px solid #dee5f1;border-radius:24px;background:radial-gradient(circle at 93% 10%,#e2dcff 0,transparent 27%),linear-gradient(135deg,#fff,#f7f8fd);box-shadow:0 14px 45px #2634590b}
.audience-hero h1,.audience-detail-hero h1{margin:5px 0 8px;font-size:clamp(28px,3vw,42px);line-height:1.08;letter-spacing:-.035em;color:#182039}
.audience-hero p,.audience-detail-hero p{max-width:700px;margin:0;color:var(--audience-muted);font-size:14px;line-height:1.65}
.audience-hero-actions,.audience-detail-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.audience-hero-actions .button,.audience-detail-actions .button{min-height:42px;border-radius:11px}
.audience-eyebrow{display:block;color:#6558d9;font-size:10px;font-weight:850;letter-spacing:.15em;text-transform:uppercase}
.audience-alert{padding:13px 17px;border-radius:12px;font-size:13px;font-weight:650}.audience-alert.success{border:1px solid #afe3c8;background:#effcf5;color:#17653b}.audience-alert.error{border:1px solid #f1b8bd;background:#fff2f3;color:#a22631}
.audience-subnav,.audience-detail-tabs{display:flex;gap:4px;padding:5px;overflow:auto;border:1px solid var(--audience-line);border-radius:14px;background:#fff}
.audience-subnav a,.audience-detail-tabs a{padding:9px 13px;border-radius:9px;color:#67738b;font-size:11px;font-weight:750;white-space:nowrap}.audience-subnav a:hover,.audience-subnav a.is-active,.audience-detail-tabs a:hover{background:#f0eeff;color:#5548c5}
.audience-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.audience-kpis article,.audience-detail-kpis article{position:relative;overflow:hidden;padding:18px 19px;border:1px solid var(--audience-line);border-radius:16px;background:#fff}.audience-kpis article:before{position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,#6255d8,#a295ff);content:""}.audience-kpis span,.audience-kpis small,.audience-detail-kpis small{display:block;color:#768198;font-size:10px}.audience-kpis strong{display:block;margin:6px 0 2px;color:#1f2943;font-size:25px;line-height:1}
.audience-filters{display:grid;grid-template-columns:2fr repeat(3,minmax(140px,1fr)) auto;gap:11px;align-items:end;padding:17px;border:1px solid var(--audience-line);border-radius:17px;background:#fff}.audience-filters label,.audience-editor label,.audience-dialog label{display:grid;gap:6px}.audience-filters label>span,.audience-editor label>span,.audience-dialog label>span{color:#59667e;font-size:10px;font-weight:750}.audience-filters input,.audience-filters select,.audience-editor input,.audience-editor select,.audience-editor textarea,.audience-dialog select{min-width:0;width:100%;border:1px solid #dce2ec;border-radius:10px;background:#fff;color:#25304a;font:inherit;font-size:12px}.audience-filters input,.audience-filters select,.audience-editor input,.audience-editor select,.audience-dialog select{height:40px;padding:0 11px}.audience-editor textarea{padding:11px;resize:vertical;line-height:1.55}.audience-filters input:focus,.audience-filters select:focus,.audience-editor input:focus,.audience-editor select:focus,.audience-editor textarea:focus{border-color:#7669df;box-shadow:0 0 0 3px #7669df18;outline:0}
.audience-table-panel{border:1px solid var(--audience-line);border-radius:18px;background:#fff;box-shadow:0 10px 35px #25345508}.audience-table-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--audience-line)}.audience-table-heading h2{margin:0;font-size:15px}.audience-table-heading p{margin:3px 0 0;color:#7c879b;font-size:10px}.audience-table-heading>a{color:#6558d9;font-size:11px;font-weight:750}.audience-table-scroll{overflow:auto}.audience-table{width:100%;border-collapse:collapse;white-space:nowrap}.audience-table th{padding:12px 14px;background:#f8f9fc;color:#7c879b;font-size:9px;font-weight:800;letter-spacing:.06em;text-align:left;text-transform:uppercase}.audience-table td{padding:14px;border-top:1px solid #edf0f5;color:#48546c;font-size:11px;vertical-align:middle}.audience-table tbody tr:hover{background:#fbfbfe}.audience-table td>strong,.audience-table td>small{display:block;max-width:300px;overflow:hidden;text-overflow:ellipsis}.audience-table td>strong{color:#26314a;font-size:11px}.audience-table td>small{margin-top:4px;color:#8a94a7;font-size:9px}.audience-code{display:inline-flex;padding:7px 9px;border:1px solid #dcd7ff;border-radius:8px;background:#f4f2ff;color:#5548c5;font-size:10px;font-weight:850;letter-spacing:.035em}.audience-niche{display:inline-grid;place-items:center;min-width:33px;margin-right:7px;padding:5px;border-radius:7px;background:#edf3ff;color:#3d64a5;font-size:8px;font-weight:850}.audience-counts{display:flex;gap:4px}.audience-counts span{padding:5px 7px;border-radius:6px;background:#f0f3f7;color:#5f6d84;font-size:8px;font-weight:750}.audience-score{display:grid;gap:4px;min-width:70px}.audience-score b{color:#293550;font-size:10px}.audience-score>span{display:block;height:4px;overflow:hidden;border-radius:10px;background:#e8ecf3}.audience-score i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#6558d9,#33b98a)}.audience-status{display:inline-flex;padding:5px 8px;border-radius:999px;background:#eef1f6;color:#657087;font-size:8px;font-weight:800;text-transform:capitalize}.audience-status.is-active,.audience-status.is-excellent,.audience-status.is-validated{background:#e7f8ef;color:#19804c}.audience-status.is-draft{background:#f0f2f6;color:#657087}.audience-status.is-paused,.audience-status.is-under_review,.audience-status.is-very_good{background:#fff5d9;color:#8b6512}.audience-status.is-archived,.audience-status.is-low,.audience-status.is-not_recommended{background:#ffecee;color:#aa3340}.audience-actions{position:relative}.audience-actions summary{display:grid;width:30px;height:30px;place-items:center;border:1px solid #e0e5ee;border-radius:8px;cursor:pointer;list-style:none;font-weight:800}.audience-actions summary::-webkit-details-marker{display:none}.audience-actions>div{position:absolute;right:0;z-index:5;display:grid;min-width:145px;padding:6px;border:1px solid #e0e5ee;border-radius:10px;background:#fff;box-shadow:0 16px 40px #26314a26}.audience-actions a,.audience-actions button{display:block;width:100%;padding:8px;border:0;border-radius:6px;background:none;color:#4f5b72;font:inherit;font-size:10px;text-align:left}.audience-actions a:hover,.audience-actions button:hover{background:#f2f0ff;color:#5548c5}.audience-empty{display:grid;justify-items:center;gap:7px;padding:45px;color:#7a859a}.audience-empty strong{color:#344059;font-size:14px}.audience-pagination{display:flex;align-items:center;justify-content:flex-end;gap:15px;padding:14px 18px;border-top:1px solid var(--audience-line);font-size:10px}.audience-pagination a{color:#5a4dd0;font-weight:750}
.audience-back{display:inline-block;margin-bottom:7px;color:#68758d;font-size:10px;font-weight:750}.audience-hero-compact{padding-top:22px;padding-bottom:22px}.audience-editor{overflow:hidden;border:1px solid var(--audience-line);border-radius:20px;background:#fff}.audience-editor-tabs{display:flex;gap:3px;padding:9px 14px;overflow:auto;border-bottom:1px solid var(--audience-line);background:#fafbfc}.audience-editor-tabs button{padding:10px 13px;border:0;border-radius:8px;background:transparent;color:#707c92;font-size:10px;font-weight:750;white-space:nowrap;cursor:pointer}.audience-editor-tabs button.is-active{background:#eae7ff;color:#5548c5}.audience-editor-body{padding:25px 28px}.audience-form-section{display:none}.audience-form-section.is-active{display:block}.audience-form-section>header{display:flex;align-items:center;gap:13px;margin-bottom:22px}.audience-form-section>header>span{display:grid;width:39px;height:39px;place-items:center;border-radius:12px;background:#ece9ff;color:#5d50ce;font-size:11px;font-weight:850}.audience-form-section h2{margin:0;color:#26314a;font-size:17px}.audience-form-section header p{margin:3px 0 0;color:#8690a3;font-size:10px}.audience-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px}.audience-form-grid .span-2{grid-column:span 2}.audience-editor label small{color:#929bad;font-size:8px}.audience-code-input{display:grid;grid-template-columns:1fr auto}.audience-code-input input{border-radius:10px 0 0 10px}.audience-code-input button{padding:0 13px;border:1px solid #6558d9;border-radius:0 10px 10px 0;background:#6558d9;color:#fff;font-size:9px;font-weight:750}.audience-editor-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 28px;border-top:1px solid var(--audience-line);background:#fafbfc}.audience-editor-footer>span{color:#7f899c;font-size:9px}.audience-editor-footer>div{display:flex;gap:8px}
.audience-detail-hero{align-items:center;--profile-color:#6558d9}.audience-detail-avatar{display:grid;flex:0 0 76px;width:76px;height:76px;place-items:center;overflow:hidden;border-radius:22px;background:linear-gradient(135deg,var(--profile-color),#26234f);box-shadow:0 10px 25px color-mix(in srgb,var(--profile-color),transparent 65%);color:#fff;font-size:30px;font-weight:850}.audience-detail-avatar img{width:100%;height:100%;object-fit:cover}.audience-detail-title{flex:1}.audience-detail-title>div{display:flex;align-items:center;gap:8px}.audience-detail-title>div>strong{padding:5px 8px;border-radius:7px;background:#efedff;color:#5549c6;font-size:9px;letter-spacing:.06em}.audience-detail-title h1{font-size:27px}.audience-detail-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.audience-detail-kpis article{padding:15px 16px}.audience-detail-kpis strong{display:block;margin-top:6px;color:#243049;font-size:18px}.audience-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:18px;align-items:start}.audience-detail-grid main{display:grid;gap:16px}.audience-detail-grid aside{position:sticky;top:20px;display:grid;gap:14px}.audience-detail-card,.audience-side-card{padding:21px;border:1px solid var(--audience-line);border-radius:17px;background:#fff}.audience-detail-card>header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}.audience-detail-card h2,.audience-side-card h3{margin:3px 0 0;color:#26314a;font-size:16px}.audience-detail-card>header>b{display:grid;width:27px;height:27px;place-items:center;border-radius:8px;background:#efedff;color:#5b4ecb;font-size:10px}.audience-demographic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.audience-demographic-grid div{padding:13px;border-radius:11px;background:#f7f8fb}.audience-demographic-grid small,.audience-demographic-grid strong{display:block}.audience-demographic-grid small{color:#8a94a6;font-size:8px}.audience-demographic-grid strong{margin-top:4px;color:#39455c;font-size:10px}.audience-long-description{margin:16px 0 0;color:#68758c;font-size:11px;line-height:1.7}.audience-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px}.audience-tags span{padding:6px 8px;border-radius:7px;background:#eeeefe;color:#5b54a1;font-size:8px;font-weight:700}.audience-interest-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.audience-interest-grid article{display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;padding:11px;border:1px solid #e8ebf1;border-radius:11px}.audience-interest-grid article>span{display:grid;width:27px;height:27px;place-items:center;border-radius:8px;background:#e9f6f1;color:#248460;font-size:9px;font-weight:800}.audience-interest-grid strong,.audience-interest-grid small{display:block}.audience-interest-grid strong{color:#39445b;font-size:10px}.audience-interest-grid small{margin-top:2px;color:#8e97a9;font-size:8px}.audience-interest-grid b{color:#6558d9;font-size:9px}.audience-motivation-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.audience-motivation-columns>div{padding:12px;border-radius:12px;background:#f8f9fb}.audience-motivation-columns h3{margin:0 0 9px;color:#4d5970;font-size:10px;text-transform:uppercase}.audience-motivation-columns article{display:grid;gap:3px;padding:9px 0;border-top:1px solid #e7eaf0}.audience-motivation-columns strong{color:#414d63;font-size:9px}.audience-motivation-columns span,.audience-motivation-columns p{color:#8d96a8;font-size:8px}.audience-channel-list,.audience-relation-list,.audience-history{display:grid;gap:8px}.audience-channel-list article{display:grid;grid-template-columns:38px 1fr 100px;gap:11px;align-items:center;padding:10px;border:1px solid #e7eaf0;border-radius:11px}.audience-channel-icon{display:grid;width:37px;height:37px;place-items:center;border-radius:10px;background:#f0edff;color:#5b4ecb;font-size:9px;font-weight:850}.audience-channel-list strong,.audience-channel-list small{display:block}.audience-channel-list strong{font-size:10px}.audience-channel-list small{margin-top:3px;color:#8b95a7;font-size:8px}.audience-relation-list article{display:grid;grid-template-columns:1fr auto 48px;gap:10px;align-items:center;padding:12px;border:1px solid #e6eaf0;border-radius:11px}.audience-relation-list article.is-primary{border-color:#cfc8ff;background:#faf9ff}.audience-relation-list strong,.audience-relation-list small{display:block}.audience-relation-list strong{font-size:10px}.audience-relation-list small{margin-top:3px;color:#8993a6;font-size:8px}.audience-relation-list article>b{color:#2c3850;font-size:11px;text-align:right}.audience-warning{padding:5px 7px;border-radius:7px;background:#fff1da;color:#946211;font-size:8px}.audience-history article{display:flex;gap:10px;align-items:center;padding:10px 0;border-top:1px solid #edf0f4}.audience-history article>span{display:grid;min-width:35px;height:28px;place-items:center;border-radius:8px;background:#eeecff;color:#5b4ecb;font-size:8px;font-weight:800}.audience-history strong,.audience-history small{display:block}.audience-history strong{font-size:9px}.audience-history small{margin-top:3px;color:#8b95a6;font-size:8px}.audience-side-card dl{display:grid;grid-template-columns:auto 1fr;gap:9px;margin:15px 0 0;font-size:9px}.audience-side-card dt{color:#8791a4}.audience-side-card dd{margin:0;color:#3f4b62;font-weight:750;text-align:right}.audience-side-card>a{display:block;margin-top:7px;padding:10px;border:1px solid #e7eaf0;border-radius:9px;color:#59657b;font-size:9px;font-weight:700}.audience-side-card>a:hover{border-color:#cfc8ff;background:#f5f3ff;color:#5548c5}
.audience-dialog{width:min(540px,94vw);padding:0;border:0;border-radius:19px;box-shadow:0 28px 90px #18203955}.audience-dialog::backdrop{background:#18203999}.audience-dialog form{display:grid;gap:18px;padding:22px}.audience-dialog header,.audience-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:10px}.audience-dialog h2{margin:4px 0 0;font-size:18px}.audience-dialog header>button{border:0;background:none;color:#69748a;font-size:25px;cursor:pointer}.audience-dialog footer{justify-content:flex-end}.audience-check{display:flex!important;align-items:center;grid-template-columns:auto 1fr}.audience-check input{width:16px;height:16px}
@media(max-width:1150px){.audience-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.audience-detail-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.audience-detail-grid{grid-template-columns:1fr}.audience-detail-grid aside{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.audience-hero,.audience-detail-hero{display:grid;padding:20px}.audience-detail-actions,.audience-hero-actions{justify-content:flex-start}.audience-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.audience-filters .audience-search{grid-column:span 2}.audience-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.audience-form-grid,.audience-interest-grid,.audience-motivation-columns{grid-template-columns:1fr}.audience-form-grid .span-2{grid-column:span 1}.audience-editor-body{padding:20px}.audience-editor-footer{align-items:stretch;flex-direction:column}.audience-demographic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.audience-detail-grid aside{grid-template-columns:1fr}}
@media(max-width:520px){.audience-filters{grid-template-columns:1fr}.audience-filters .audience-search{grid-column:auto}.audience-kpis,.audience-detail-kpis,.audience-demographic-grid{grid-template-columns:1fr}.audience-channel-list article{grid-template-columns:36px 1fr}.audience-channel-list .audience-score{grid-column:2}.audience-relation-list article{grid-template-columns:1fr auto}.audience-relation-list .audience-status,.audience-relation-list .audience-warning{grid-column:1}.audience-detail-avatar{width:60px;height:60px;flex-basis:60px}}
.product-audience-mini{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;margin:10px 0;padding:9px 10px;border:1px dashed #d7dce7;border-radius:10px;background:#fafbfc}.product-audience-mini>span{color:#8791a4;font-size:8px;font-weight:750;text-transform:uppercase}.product-audience-mini-content{display:grid;justify-items:end;min-width:0}.product-audience-mini-content>a{display:grid;justify-items:end;min-width:0}.product-audience-mini strong,.product-audience-mini small{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.product-audience-mini strong{color:#6558d9;font-size:9px}.product-audience-mini small{margin-top:2px;color:#8a94a7;font-size:7px}.product-audience-mini-action{background:#6558d9;border:0;border-radius:7px;color:#fff;cursor:pointer;font-size:8px;font-weight:750;padding:6px 8px;white-space:nowrap}.product-audience-mini-action:hover{background:#5145c6}.product-audience-mini.has-profile{border-style:solid;border-color:#d6d1ff;background:#f8f7ff}
.product-audience-dialog{max-width:min(720px,calc(100vw - 28px))}.product-audience-current,.product-audience-form{display:grid;gap:12px}.product-audience-form{border-top:1px solid var(--line);padding-top:18px}.product-audience-section-head{align-items:flex-start;display:flex;gap:16px;justify-content:space-between}.product-audience-section-head>div{display:grid;gap:3px}.product-audience-section-head small{color:var(--muted)}.product-audience-section-head>a{font-size:12px;font-weight:750;white-space:nowrap}.product-audience-link-list{display:grid;gap:8px}.product-audience-link-row{align-items:center;background:#f8f7ff;border:1px solid #ddd9ff;border-radius:10px;display:flex;gap:12px;justify-content:space-between;padding:10px 12px}.product-audience-link-row>div{display:grid;gap:3px;min-width:0}.product-audience-link-row a{font-size:12px;font-weight:750;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.product-audience-link-row small{color:var(--muted);font-size:10px}.product-audience-link-row .button{font-size:10px;padding:6px 9px}.product-audience-feedback{margin:0}.product-audience-form>.button{justify-self:end}
@media (max-width:640px){.product-audience-mini{grid-template-columns:1fr auto}.product-audience-mini>span{grid-column:1/-1}.product-audience-mini-content{justify-items:start}.product-audience-mini-content>a{justify-items:start}.product-audience-section-head{align-items:stretch;flex-direction:column}.product-audience-link-row{align-items:stretch;flex-direction:column}.product-audience-link-row .button,.product-audience-form>.button{justify-content:center;width:100%}}
.news-enrichment-fields{grid-column:1/-1;margin:5px 0;padding:17px;border:1px solid #ddd9ff;border-radius:14px;background:#faf9ff}.news-enrichment-fields legend{padding:0 7px;color:#5548c5;font-size:11px;font-weight:800}.news-enrichment-grid{display:grid;grid-template-columns:minmax(260px,1.5fr) repeat(2,minmax(180px,1fr));gap:14px}.news-enrichment-grid>label,.news-audience-picker{display:grid;align-content:start;gap:7px}.news-enrichment-grid>label>span,.news-audience-picker>span{color:#4c5870;font-size:11px;font-weight:750}.news-enrichment-grid small{color:#7d8799;font-size:9px;line-height:1.4}.news-audience-picker>div,.content-audience-options{display:grid;gap:6px;max-height:168px;overflow:auto;padding:8px;border:1px solid #e5e2f7;border-radius:10px;background:#fff}.news-audience-picker label,.content-audience-options label{display:grid!important;grid-template-columns:auto 1fr;align-items:start;gap:8px;padding:7px;border-radius:7px}.news-audience-picker label:hover,.content-audience-options label:hover{background:#f3f1ff}.news-audience-picker label>span,.content-audience-options label>span{display:grid;gap:2px}.news-audience-picker strong,.content-audience-options strong{color:#5548c5;font-size:9px}.news-audience-picker small,.content-audience-options small{font-size:8px}.site-news-audiences{display:grid;gap:6px;max-height:170px;overflow:auto;padding:10px;border:1px solid var(--line);border-radius:10px}.site-news-audiences legend{font-size:10px;font-weight:750}.content-audience-panel>p,.content-translation-panel>p{color:var(--muted);font-size:11px;line-height:1.5}.content-audience-panel form,.content-translation-panel form{display:grid;gap:10px}.content-audience-options{max-height:220px}.content-auto-products{display:flex;flex-wrap:wrap;gap:5px;margin-top:12px}.content-auto-products span{padding:5px 7px;border-radius:7px;background:#f0eeff;color:#5548c5;font-size:8px}.seoai-audience-product{display:grid;grid-template-columns:minmax(100px,160px) 1fr;gap:16px;margin:24px 0;padding:16px;border:1px solid #ddd9ff;border-radius:14px;background:#faf9ff}.seoai-audience-product img{width:100%;height:130px;object-fit:contain;border-radius:9px;background:#fff}.seoai-audience-product>div{display:grid;align-content:center;justify-items:start;gap:6px}.seoai-audience-product small{color:#6558d9;font-size:10px;font-weight:750}.seoai-audience-product h3,.seoai-audience-product p{margin:0}.seoai-audience-product a{display:inline-flex;padding:8px 12px;border-radius:8px;background:#6558d9;color:#fff;font-size:11px;font-weight:750}.seoai-audience-product a:hover{background:#5145c6;color:#fff}@media(max-width:900px){.news-enrichment-grid{grid-template-columns:1fr}}@media(max-width:560px){.seoai-audience-product{grid-template-columns:1fr}.seoai-audience-product img{height:180px}}
.news-enrichment-inline{grid-column:1/-1;width:100%;margin:4px 0}.news-enrichment-inline>summary{color:#6558d9;cursor:pointer;font-size:9px;font-weight:750}.news-enrichment-inline>div{display:grid;gap:8px;margin-top:7px;padding:10px;border:1px solid #ddd9ff;border-radius:9px;background:#faf9ff}.news-enrichment-inline>div>span,.news-enrichment-inline>div>label{font-size:9px;font-weight:700}.news-enrichment-inline-profiles{display:grid;gap:4px;max-height:120px;overflow:auto}.news-enrichment-inline-profiles label{display:flex!important;align-items:flex-start;gap:5px;font-size:8px;font-weight:500}.news-enrichment-inline input[type=number],.news-enrichment-inline select{width:100%}
.affiliate-account-edit-form {
  display: grid;
  gap: 10px;
  min-width: min(360px, 80vw);
  padding: 12px 0 4px;
}

.affiliate-account-edit-form label {
  display: grid;
  gap: 5px;
}
.affiliate-product-tabs {
  display: flex;
  gap: 4px;
  margin: 0 0 14px;
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
}

.affiliate-product-tabs a {
  color: var(--muted);
  padding: 10px 14px;
  white-space: nowrap;
}

.affiliate-product-tabs a.is-active {
  border-bottom: 2px solid var(--primary);
  color: var(--ink);
  font-weight: 700;
}

.affiliate-marketplace-limit p {
  margin: 6px 0;
}

.affiliate-pagination {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  padding-top: 14px;
}
.trending-products-panel>p{color:var(--muted);font-size:11px;line-height:1.5}.trending-products-panel>form{margin:12px 0}.trending-product-list{display:grid;gap:10px;margin-top:14px}.trending-product-card{display:grid;grid-template-columns:72px minmax(0,1fr);gap:11px;padding:11px;border:1px solid #ddd9ff;border-radius:12px;background:#faf9ff}.trending-product-card>img{width:72px;height:72px;object-fit:contain;border-radius:9px;background:#fff}.trending-product-card>div{display:grid;justify-items:start;gap:5px;min-width:0}.trending-product-card span,.trending-product-card small{color:var(--muted);font-size:9px;line-height:1.4}.trending-product-card h3,.trending-product-card p{margin:0}.trending-product-card h3{font-size:12px;line-height:1.35}.trending-product-card p{font-size:10px}.trending-product-card strong{color:#5548c5;font-size:11px}.trending-product-card .button{margin-top:3px;padding:7px 9px;font-size:9px}@media(max-width:520px){.trending-product-card{grid-template-columns:1fr}.trending-product-card>img{width:100%;height:150px}}
.marketplace-config-row {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px 0;
}

.marketplace-config-row div {
  display: grid;
  gap: 4px;
}

.marketplace-config-row span {
  color: var(--muted);
  font-size: 12px;
}
.persona-wizard__progress{height:6px;background:#e5e7eb;margin:16px 0}.persona-wizard__progress i{display:block;height:100%;background:#2563eb;transition:width .2s}.persona-wizard__layout{display:grid;grid-template-columns:minmax(180px,240px) 1fr;gap:20px}.persona-wizard__steps{display:grid;gap:4px;align-content:start;max-height:620px;overflow:auto}.persona-wizard__steps button{border:0;background:transparent;text-align:left;padding:9px 10px;border-left:3px solid transparent;cursor:pointer}.persona-wizard__steps button.is-active{background:#eff6ff;border-left-color:#2563eb;color:#1d4ed8}.persona-wizard__editor [data-wizard-fields]{display:grid;gap:12px}.persona-wizard__item{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:14px 0;border-bottom:1px solid #e5e7eb}.persona-wizard__item label:has(textarea),.persona-wizard__item label:has([data-json-field]){grid-column:1/-1}.persona-wizard__item textarea{min-height:84px}@media(max-width:800px){.persona-wizard__layout{grid-template-columns:1fr}.persona-wizard__steps{grid-template-columns:repeat(2,minmax(0,1fr));max-height:210px}.persona-wizard__item{grid-template-columns:1fr}}

/* Custom service forms */
.service-form-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-bottom:18px}.service-form-summary article{display:flex;align-items:center;gap:13px;padding:17px 19px;border:1px solid var(--line);border-radius:13px;background:#fff}.service-form-summary article>span{display:grid;width:38px;height:38px;place-items:center;border-radius:10px;background:var(--primary-soft);color:var(--primary-dark)}.service-form-summary strong,.service-form-summary small{display:block}.service-form-summary strong{color:var(--ink);font-size:20px}.service-form-summary small{margin-top:2px;color:var(--muted);font-size:10px}.service-form-list,.service-form-builder,.service-submissions,.service-form-integration{padding:22px}.service-form-list>.settings-card-head,.service-form-builder>.settings-card-head,.service-submissions>.settings-card-head,.service-form-integration>.settings-card-head{margin-bottom:18px;padding-bottom:15px;border-bottom:1px solid var(--line)}.service-form-list h2,.service-form-list p,.service-form-builder h2,.service-form-builder p,.service-submissions h2,.service-submissions p,.service-form-integration h2,.service-form-integration p{margin:0}.service-form-list .settings-card-head p,.service-form-builder .settings-card-head p,.service-submissions .settings-card-head p,.service-form-integration .settings-card-head p{margin-top:3px;font-size:10px}.service-form-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.service-form-cards>article{display:grid;gap:10px;padding:17px;border:1px solid var(--line);border-radius:12px;background:#fbfcfd}.service-form-card-top{display:flex;align-items:center;justify-content:space-between}.service-form-card-icon{display:grid;width:38px;height:38px;place-items:center;border-radius:10px;background:#e9f6f4;color:var(--primary-dark)}.service-form-cards h3,.service-form-cards p{margin:0}.service-form-cards h3{font-size:14px}.service-form-cards p{min-height:32px;font-size:10px;line-height:1.5}.service-form-card-meta{display:flex;justify-content:space-between;padding-top:9px;border-top:1px solid var(--line);color:var(--muted);font-size:9px}.service-form-card-meta b{color:var(--ink)}.service-form-empty{grid-column:1/-1;display:grid;justify-items:center;gap:7px;padding:38px;text-align:center}.service-form-empty>span{display:grid;width:48px;height:48px;place-items:center;border-radius:13px;background:#f0f3f6;color:#8390a3}.service-form-empty p{min-height:0}.service-form-builder{margin-top:18px}.service-form-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:22px}.service-form-presets button{display:grid;grid-template-columns:34px 1fr;gap:2px 10px;padding:13px;border:1px solid var(--line);border-radius:11px;background:#fbfcfd;color:var(--ink);font:inherit;text-align:left;cursor:pointer}.service-form-presets button:hover{border-color:#99d5ce;background:#f0fdfa}.service-form-presets button>span{grid-row:1/3;display:grid;width:34px;height:34px;place-items:center;border-radius:9px;background:#e9f6f4;color:var(--primary-dark)}.service-form-presets b{font-size:11px}.service-form-presets small{color:var(--muted);font-size:9px}.service-form-builder-form{display:grid;gap:20px}.service-form-config{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.service-form-config label{display:grid;gap:6px}.service-form-config label>span,.service-field-row label>span,.service-form-integration label>span{color:#455166;font-size:10px;font-weight:750}.service-form-config .span-2{grid-column:1/-1}.service-form-config input[type=color]{min-height:41px;padding:5px}.service-field-builder-head{display:flex;align-items:center;justify-content:space-between;padding-top:17px;border-top:1px solid var(--line)}.service-field-builder-head h3,.service-field-builder-head p{margin:0}.service-field-builder-head h3{font-size:14px}.service-field-builder-head p{margin-top:3px;font-size:9px}.service-fields{display:grid;gap:9px}.service-field-row{display:grid;grid-template-columns:24px minmax(150px,1.2fr) minmax(130px,.8fr) minmax(150px,1fr) auto 30px;align-items:end;gap:9px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#fbfcfd}.service-field-row.is-dragging{opacity:.5}.service-field-row label{display:grid;gap:5px}.service-field-row .check{display:flex;align-items:center;align-self:end;min-height:40px;font-size:9px;white-space:nowrap}.service-field-row .check input{width:auto}.service-field-handle{align-self:center;color:#a0a8b5;font-size:17px;cursor:grab}.service-field-remove{align-self:center;width:28px;height:28px;border:0;border-radius:8px;background:#feecee;color:#b53d4a;font-size:18px;cursor:pointer}.service-field-options{grid-column:3/5}.service-form-publish{justify-self:start}.service-form-save{justify-content:center;min-height:45px}.service-form-detail-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.55fr);gap:18px;margin-bottom:18px}.service-form-integration{display:grid;gap:16px}.service-form-integration>label{display:grid;gap:7px}.service-copy-row{display:grid;grid-template-columns:1fr auto;gap:8px}.service-copy-code{align-items:start}.service-copy-code textarea{font-family:Consolas,monospace;font-size:10px}.service-form-info{padding:22px}.service-form-info h2{margin:14px 0 5px}.service-form-info p{font-size:10px;line-height:1.5}.service-form-info dl{display:grid;gap:8px;margin:18px 0 0}.service-form-info dl>div{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid var(--line)}.service-form-info dt,.service-form-info dd{font-size:10px}.service-form-info dd{margin:0;color:var(--ink);font-weight:750}.service-submissions .table-enhanced{margin:0 -22px -22px}.service-submissions table{white-space:nowrap}.service-submissions td{max-width:260px;overflow:hidden;text-overflow:ellipsis;font-size:10px}.status.new{background:#e8f2ff;color:#2663a8}
@media(max-width:1050px){.service-form-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.service-field-row{grid-template-columns:24px repeat(2,minmax(0,1fr)) 30px}.service-field-placeholder,.service-field-options{grid-column:2/4}.service-field-row .check{grid-column:2}.service-field-remove{grid-column:4;grid-row:1}}@media(max-width:760px){.service-form-summary,.service-form-presets,.service-form-cards,.service-form-detail-grid{grid-template-columns:1fr}.service-form-config{grid-template-columns:1fr}.service-form-config .span-2{grid-column:auto}.service-field-row{grid-template-columns:20px 1fr 30px}.service-field-row label,.service-field-placeholder,.service-field-options{grid-column:2}.service-field-row .check{grid-column:2}.service-field-remove{grid-column:3;grid-row:1}.service-copy-row{grid-template-columns:1fr}.service-form-summary{gap:8px}}

/* Sites workspace */
.sites-workspace{display:grid;gap:18px}.sites-create{padding:0;overflow:hidden}.sites-create>summary{display:flex;align-items:center;gap:12px;padding:17px 20px;list-style:none;cursor:pointer}.sites-create>summary::-webkit-details-marker{display:none}.sites-create>summary>span:nth-child(2){display:grid;gap:2px}.sites-create>summary strong{font-size:13px}.sites-create>summary small{color:var(--muted);font-size:10px}.sites-summary-action{margin-left:auto;padding:7px 10px;border:1px solid var(--line);border-radius:8px;color:#556277;font-size:10px;font-weight:750}.sites-create[open] .sites-summary-action{background:#f1f5f9;font-size:0}.sites-create[open] .sites-summary-action::after{content:"Fechar cadastro";font-size:10px}.sites-create-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:22px;border-top:1px solid var(--line);background:#fbfcfd}.sites-create-form>label{display:grid;align-content:start;gap:6px;color:#4d596c;font-size:10px;font-weight:750}.sites-create-form>label:has(textarea),.sites-create-form>.site-news-audiences,.sites-create-form>.module-checks{grid-column:span 2}.sites-create-form>.field-note{align-self:center;font-size:9px}.sites-create-form>.check{align-self:center}.sites-create-footer{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:18px;padding-top:16px;border-top:1px solid var(--line)}.sites-create-footer span{margin-right:auto;color:var(--muted);font-size:10px}.sites-management{padding:0;overflow:hidden}.sites-management-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 21px}.sites-management-head h2,.sites-management-head p{margin:0}.sites-management-head p{margin-top:3px;font-size:10px}.sites-management>.table-enhanced,.sites-management>table{margin:0}.sites-management table{table-layout:fixed}.sites-management th{padding:10px 12px;background:#f8fafc;color:#7c8798;font-size:9px;text-transform:uppercase}.sites-management td{padding:14px 12px;font-size:10px;vertical-align:middle}.sites-management th:nth-child(1){width:48px}.sites-management th:nth-child(2){width:15%}.sites-management th:nth-child(3){width:19%}.sites-management th:nth-child(4){width:10%}.sites-management th:nth-child(5){width:90px}.sites-management th:nth-child(6){width:20%}.sites-management th:nth-child(7){width:75px}.sites-management th:nth-child(8){width:105px}.sites-management td>a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sites-table-note{display:block;margin-top:3px;color:var(--muted);font-size:8px}.sites-module-tags{display:flex;flex-wrap:wrap;gap:4px}.sites-module-tags span{padding:4px 6px;border-radius:6px;background:#f0f3f7;color:#56647a;font-size:8px}.site-settings-popover>summary{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#445166;font-size:9px;font-weight:750;list-style:none;cursor:pointer}.site-settings-popover>summary::-webkit-details-marker{display:none}.site-settings-popover[open]>summary{border-color:#99d5ce;background:#f0fdfa;color:var(--primary-dark)}.site-settings-popover .site-modules-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:12px;margin-top:10px;padding:15px;border:1px solid var(--line);border-radius:11px;background:#fbfcfd}.sites-management td:last-child{overflow:visible}.site-settings-popover{position:relative}.site-settings-popover[open]{position:static}.site-settings-popover[open] .site-modules-form{position:absolute;right:22px;left:22px;z-index:20;box-shadow:0 20px 50px rgba(15,23,42,.16)}.site-settings-popover .site-news-audiences{grid-column:span 2}.site-settings-popover .button{justify-content:center}.site-settings-popover .site-modules-form>label:not(.check){display:grid;gap:5px}.site-settings-popover .site-modules-form>.check{align-self:center}.site-settings-popover .site-modules-form>fieldset:nth-of-type(2){grid-column:span 2}
@media(max-width:1050px){.sites-create-form{grid-template-columns:repeat(2,minmax(0,1fr))}.sites-management{overflow:auto}.sites-management table{min-width:950px}.site-settings-popover[open] .site-modules-form{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.sites-create-form{grid-template-columns:1fr}.sites-create-form>label:has(textarea),.sites-create-form>.site-news-audiences,.sites-create-form>.module-checks{grid-column:auto}.sites-create-footer{align-items:stretch;flex-direction:column}.sites-create-footer .button{justify-content:center;width:100%}.site-settings-popover[open] .site-modules-form{grid-template-columns:1fr}.site-settings-popover .site-news-audiences,.site-settings-popover .site-modules-form>fieldset:nth-of-type(2){grid-column:auto}}
@media(min-width:1051px){.sites-management{overflow:visible;position:relative}}

/* Application authentication */
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,#dbeafe 0,transparent 28%),radial-gradient(circle at 85% 85%,#ddd6fe 0,transparent 30%),#f8fafc;color:#172033}.auth-card{width:min(440px,100%);padding:36px;border:1px solid #e2e8f0;border-radius:24px;background:#fff;box-shadow:0 28px 80px #0f172a1c}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:32px}.auth-brand>span{display:grid;width:44px;height:44px;place-items:center;border-radius:13px;background:#111827;color:#fff;font-weight:850}.auth-brand div{display:grid}.auth-brand strong{font-size:14px}.auth-brand small{color:#7b879a;font-size:10px}.auth-card header p{margin:0;color:#6558d9;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.auth-card h1{margin:7px 0;font-size:28px;letter-spacing:-.035em}.auth-card header>span{color:#718096;font-size:12px}.auth-form{display:grid;gap:15px;margin-top:25px}.auth-form label{display:grid;gap:7px}.auth-form label>span{color:#455166;font-size:10px;font-weight:750}.auth-form input{height:46px;padding:0 13px;border:1px solid #dbe1ea;border-radius:11px;font:inherit}.auth-form input:focus{border-color:#6558d9;box-shadow:0 0 0 3px #6558d91a;outline:0}.auth-primary,.auth-google{display:flex;align-items:center;justify-content:center;min-height:46px;border:0;border-radius:11px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}.auth-primary{background:#111827;color:#fff}.auth-primary:hover{background:#292f3b}.auth-error{margin-top:18px;padding:11px 13px;border:1px solid #fecdd3;border-radius:10px;background:#fff1f2;color:#be123c;font-size:11px}.auth-divider{display:flex;align-items:center;gap:12px;margin:22px 0;color:#94a3b8;font-size:10px}.auth-divider:before,.auth-divider:after{height:1px;flex:1;background:#e2e8f0;content:""}.auth-google{gap:10px;border:1px solid #dbe1ea;background:#fff;color:#334155}.auth-google:hover{background:#f8fafc;color:#111827}.auth-google b{display:grid;width:22px;height:22px;place-items:center;border-radius:50%;color:#4285f4;font-size:16px}.auth-google-note{margin:20px 0 0;color:#94a3b8;font-size:10px;text-align:center}.sidebar-user{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:9px;margin:auto 14px 14px;padding:11px;border:1px solid var(--sidebar-line);border-radius:12px}.sidebar-user>img,.sidebar-user>span{width:36px;height:36px;border-radius:10px;object-fit:cover}.sidebar-user>span{display:grid;place-items:center;background:#6558d9;color:#fff;font-weight:800}.sidebar-user>div{display:grid;min-width:0}.sidebar-user strong,.sidebar-user small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-user strong{color:#fff;font-size:10px}.sidebar-user small{color:var(--sidebar-muted);font-size:8px}.sidebar-user button{padding:5px;border:0;background:none;color:var(--sidebar-muted);font-size:9px;cursor:pointer}.sidebar-user button:hover{color:#fff}
@media(max-width:520px){.auth-card{padding:26px 22px;border-radius:18px}}

/* AI content generation queue */
.ai-writer-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.ai-writer-form .writer-title-field,.ai-writer-form .authority-publisher-option,.ai-writer-form .ai-writer-submit{grid-column:1/-1}.ai-writer-submit{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px;border-radius:18px;background:#effaf8;border:1px solid #bce5df}.ai-writer-submit div{display:grid;gap:3px}.ai-writer-submit small{color:#536471}.ai-generation-dialog{width:min(920px,calc(100vw - 28px));padding:0;border:0;border-radius:26px;box-shadow:0 32px 100px #071b2d66}.ai-generation-dialog::backdrop{background:#061827cc;backdrop-filter:blur(6px)}.ai-generation-shell{padding:26px;background:linear-gradient(145deg,#f7fbff,#eafaf7)}.ai-generation-shell>header,.ai-generation-shell>footer{display:flex;align-items:center;justify-content:space-between;gap:18px}.ai-generation-shell h2{margin:4px 0}.ai-generation-shell footer{margin-top:20px}.ai-generation-shell footer small{margin-right:auto}.ai-generation-workspace{display:grid;grid-template-columns:300px 1fr;gap:24px;margin-top:22px}.writer-bot{position:relative;min-height:330px;border-radius:22px;overflow:hidden;background:radial-gradient(circle at 50% 25%,#38bdf833,#0f766e22),#09263b}.writer-bot-head{position:absolute;width:124px;height:88px;left:88px;top:63px;border:8px solid #7dd3fc;border-radius:30px;background:#dff7ff;animation:botBob 1.8s ease-in-out infinite}.writer-bot-head span{position:absolute;top:28px;width:16px;height:19px;border-radius:50%;background:#075985;animation:botBlink 3s infinite}.writer-bot-head span:first-child{left:26px}.writer-bot-head span:nth-child(2){right:26px}.writer-bot-head b{position:absolute;width:38px;height:10px;border-bottom:4px solid #0f766e;border-radius:50%;left:35px;bottom:14px}.writer-bot-antenna{position:absolute;left:146px;top:31px;width:7px;height:35px;background:#7dd3fc}.writer-bot-antenna i{position:absolute;width:16px;height:16px;border-radius:50%;background:#fb7185;left:-5px;top:-9px;box-shadow:0 0 18px #fb7185}.writer-bot-body{position:absolute;width:145px;height:108px;left:78px;top:158px;border-radius:28px;background:#14b8a6;border:7px solid #99f6e4}.writer-bot-body>i{position:absolute;width:13px;height:13px;border-radius:50%;background:#fef08a;top:25px}.writer-bot-body>i:first-child{left:48px}.writer-bot-body>i:nth-child(2){left:72px}.writer-bot-arm{position:absolute;width:78px;height:18px;background:#7dd3fc;right:-58px;top:61px;transform:rotate(18deg);transform-origin:left;animation:typeArm .42s ease-in-out infinite alternate}.writer-paper{position:absolute;right:20px;bottom:54px;width:105px;height:128px;background:#fff;border-radius:8px;transform:rotate(4deg);padding-top:20px;box-shadow:0 8px 20px #0004}.writer-paper i{display:block;height:5px;margin:10px 14px;background:#bae6fd;border-radius:5px}.writer-keyboard{position:absolute;left:85px;bottom:25px;width:175px;height:32px;background:repeating-linear-gradient(90deg,#334155 0 11px,#64748b 12px 14px);transform:skew(-15deg);border:5px solid #94a3b8;border-radius:7px}.generation-console{min-height:330px;background:#071825;color:#d1fae5;border-radius:18px;overflow:hidden;box-shadow:inset 0 0 30px #0006}.generation-console-head{display:flex;align-items:center;gap:7px;padding:13px 16px;background:#102c3e}.generation-console-head span{width:10px;height:10px;border-radius:50%;background:#fb7185}.generation-console-head span:nth-child(2){background:#facc15}.generation-console-head span:nth-child(3){background:#4ade80}.generation-console-head strong{margin-left:8px;color:#94a3b8;font:12px monospace}.generation-console>[data-generation-logs]{height:280px;overflow:auto;padding:14px}.generation-console p{display:grid;grid-template-columns:30px 1fr 18px;gap:10px;margin:0;padding:9px 0;border-bottom:1px solid #ffffff12;font:13px/1.4 monospace}.generation-console time{color:#38bdf8}.generation-console b{color:#4ade80}.generation-console .is-error{display:block;color:#fecaca}@keyframes botBob{50%{transform:translateY(-6px)}}@keyframes botBlink{47%,53%{transform:scaleY(.1)}}@keyframes typeArm{to{transform:rotate(32deg)}}@media(max-width:720px){.ai-writer-form,.ai-generation-workspace{grid-template-columns:1fr}.ai-generation-workspace{max-height:60vh;overflow:auto}.writer-bot{min-height:280px}.ai-generation-shell>header,.ai-generation-shell>footer,.ai-writer-submit{align-items:flex-start;flex-direction:column}}
.persona-model-reference{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:14px;margin-top:14px;padding:16px;border:1px solid #ddd9ff;border-radius:14px;background:#faf9ff}.persona-model-reference[hidden]{display:none}.persona-model-reference>img{grid-row:span 2;width:120px;height:150px;border-radius:11px;object-fit:cover}.persona-model-upload,.persona-model-reference>.persona-field{display:grid;gap:7px}.persona-model-reference>.check{grid-column:1/-1}.persona-model-reference input[type=range]{width:100%}@media(max-width:600px){.persona-model-reference{grid-template-columns:1fr}.persona-model-reference>img{grid-row:auto;width:100%;height:220px}.persona-model-reference>.check{grid-column:auto}}

/* Persona command center and game-inspired image studio */
.persona-page-tabs{position:sticky;top:12px;z-index:30;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin:0 0 22px;padding:7px;border:1px solid #dce3ee;border-radius:17px;background:#f8fafceF;box-shadow:0 14px 38px #17203312;backdrop-filter:blur(14px)}.persona-page-tabs button{display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;align-items:center;gap:0 8px;min-width:0;padding:10px 11px;border:0;border-radius:11px;background:transparent;color:#718096;font:inherit;text-align:left;cursor:pointer}.persona-page-tabs button>span{grid-row:1/3;display:grid;width:28px;height:28px;place-items:center;border-radius:8px;background:#edf1f7}.persona-page-tabs b{font-size:10px}.persona-page-tabs small{overflow:hidden;font-size:8px;text-overflow:ellipsis;white-space:nowrap}.persona-page-tabs button:hover{background:#fff;color:#3d4860}.persona-page-tabs button.is-active{background:linear-gradient(135deg,#151d35,#30345f);box-shadow:0 7px 18px #1b23432b;color:#fff}.persona-page-tabs button.is-active>span{background:#67e8f91f;color:#67e8f9}.persona-image-game-stage{position:relative;margin:0 22px 6px;overflow:hidden;border-radius:20px;background:#101936;box-shadow:0 18px 38px #11193624}.persona-image-game-stage svg{display:block;width:100%;height:auto;max-height:190px}.persona-image-game-stage>div{position:absolute;right:24px;bottom:20px;left:24px;display:flex;align-items:end;justify-content:space-between;gap:20px;color:#fff}.persona-image-game-stage strong{font-size:16px}.persona-image-game-stage span{max-width:320px;color:#cbd5e1;font-size:9px;line-height:1.5;text-align:right}.persona-game-mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:10px}.persona-game-mode-grid label{position:relative}.persona-game-mode-grid input{position:absolute;opacity:0}.persona-game-mode-grid label>span{position:relative;display:grid;grid-template-columns:90px 1fr;grid-template-rows:auto auto auto;align-items:center;min-height:112px;padding:13px;border:2px solid #e2e7f0;border-radius:16px;background:linear-gradient(145deg,#fff,#f6f8fc);cursor:pointer;transition:.2s}.persona-game-mode-grid svg{grid-row:1/4;width:78px;height:72px;padding:8px;border-radius:13px;background:#141c35;fill:none;stroke:#c4b5fd;stroke-width:3}.persona-game-mode-grid svg .accent{stroke:#67e8f9}.persona-game-mode-grid b{color:#26314a;font-size:13px}.persona-game-mode-grid small{color:#7b879a;font-size:9px}.persona-game-mode-grid em{justify-self:start;margin-top:6px;padding:4px 6px;border-radius:5px;background:#e9e7ff;color:#5b50c6;font-size:7px;font-style:normal;font-weight:850;letter-spacing:.08em}.persona-game-mode-grid input:checked+span{border-color:#6d5de7;background:linear-gradient(145deg,#faf9ff,#eeecff);box-shadow:0 0 0 3px #6d5de717,0 13px 28px #5146b518}.persona-game-mode-grid input:checked+span:after{position:absolute;top:9px;right:9px;display:grid;width:20px;height:20px;place-items:center;border-radius:50%;background:#6558d9;color:#fff;content:"✓";font-size:11px}.persona-image-type-grid label>span{transition:transform .18s,box-shadow .18s}.persona-image-type-grid label:hover>span{transform:translateY(-2px);box-shadow:0 9px 20px #25345512}.persona-image-framing-grid label>span:before{display:block;height:26px;margin-bottom:5px;border:2px solid currentColor;border-radius:5px;opacity:.28;content:""}.persona-image-framing-grid label:nth-child(2)>span:before{width:22px;border-radius:50%}.persona-image-framing-grid label:nth-child(3)>span:before{width:18px;height:30px}.persona-image-framing-grid label:nth-child(4)>span:before{width:16px;height:35px}.persona-image-framing-grid label:nth-child(5)>span:before{width:13px;height:40px}@media(max-width:950px){.persona-page-tabs{grid-template-columns:repeat(3,1fr);position:relative;top:auto}.persona-image-game-stage>div{align-items:start;flex-direction:column}.persona-image-game-stage span{text-align:left}}@media(max-width:620px){.persona-page-tabs{grid-template-columns:repeat(2,1fr)}.persona-page-tabs small{display:none}.persona-game-mode-grid{grid-template-columns:1fr}.persona-image-game-stage{margin:0 12px}.persona-image-game-stage>div{position:static;padding:15px 17px}.persona-image-game-stage svg{display:none}}