:root {
  --obsidian: #0a0a0f;
  --carbon: #13131a;
  --tertiary: #1a1a22;
  --smoke: #27272a;
  --mist: #a1a1aa;
  --white: #fafafa;
  --plasma: #8b5cf6;
  --plasma-glow: #a78bfa;
  --plasma-deep: #6d28d9;
  --cyan: #06b6d4;
  --mint: #10f0a1;
  --warning: #f59e0b;
  --danger: #ef4444;
  --ink: #09090d;
  --line: rgba(255, 255, 255, 0.055);
  color-scheme: dark;
  font-family: Geist, "Helvetica Neue", Arial, sans-serif;
}

/* White-label admin page: scoped so it cannot affect the main user dashboard. */
body.app-mode[data-active-view="white-label"] .app-footer.universal-footer {
  display: none;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-panel {
  display: block;
  padding: 14px !important;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-summary {
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-layout {
  grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
  align-items: stretch;
  gap: 14px;
  margin-bottom: 14px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-section {
  align-self: start;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-brand-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-tool-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-tool-grid button {
  min-height: 40px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-brand-form {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-toggle-row {
  display: flex;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #d9ff3f;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-toggle-row input {
  position: relative;
  width: 46px;
  height: 24px;
  flex: 0 0 auto;
  appearance: none;
  border: 3px solid #08090d;
  border-radius: 999px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-toggle-row input::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 12px;
  height: 12px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #66d3e6;
  transition: transform 120ms ease;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-toggle-row input:checked {
  background: #66f0a8;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-toggle-row input:checked::before {
  transform: translateX(19px);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-grid label {
  display: grid;
  gap: 6px;
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-grid input,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-grid textarea {
  width: 100%;
  min-height: 40px;
  border: 3px solid #08090d;
  border-radius: 6px;
  padding: 9px 10px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.24);
  font: inherit;
  text-transform: none;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-grid input[type="color"] {
  padding: 4px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-wide {
  grid-column: 1 / -1;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-invite {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 12px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #c9eef7;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-invite label {
  display: grid;
  gap: 6px;
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-invite input {
  min-height: 40px;
  border: 3px solid #08090d;
  border-radius: 6px;
  padding: 9px 10px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.24);
  font: inherit;
  text-transform: none;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-invite .provider-output {
  grid-column: 1 / -1;
  margin: 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-list {
  margin: 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-records {
  display: grid;
  gap: 8px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-records .compact-title {
  margin-bottom: 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list {
  display: grid;
  gap: 8px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list article {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #d7f7e4;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list article.selected {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.48), transparent 64%),
    #cfe6ff;
  outline: 3px solid #49a4ff;
  outline-offset: -7px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list .empty-client-record {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #ffe49a;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 1000;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list strong {
  font-size: 15px;
  line-height: 1.1;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-list small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10.5px;
  line-height: 1.3;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 7px;
  margin-top: 5px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-actions button {
  min-height: 34px;
  border: 3px solid #08090d;
  border-radius: 6px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
  cursor: pointer;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-actions button:hover:not(:disabled) {
  transform: translate(1px, 1px);
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  box-shadow: none;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-record-actions .danger {
  background: #ffd7d7;
  color: #7a1d1d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-section {
  background:
    linear-gradient(110deg, rgba(217, 255, 63, 0.22) 0 26%, rgba(102, 211, 230, 0.2) 26% 56%, rgba(255, 228, 154, 0.28) 56% 100%),
    #fffaf0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
  margin-bottom: 14px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form input,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form select {
  min-height: 42px;
  border: 3px solid #08090d;
  border-radius: 6px;
  padding: 9px 10px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.26);
  font: inherit;
  text-transform: none;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form input:disabled,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form select:disabled,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form button:disabled {
  cursor: not-allowed;
  background: #e9edf2;
  color: rgba(8, 9, 13, 0.58);
  box-shadow: none;
  opacity: 0.72;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form .white-label-form-actions {
  grid-column: span 2;
  justify-content: end;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-form .provider-output {
  grid-column: 1 / -1;
  margin: 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-row {
  grid-template-columns: 42px minmax(0, 1fr) minmax(260px, auto);
  align-items: center;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-row.selected {
  outline: 3px solid #49a4ff;
  outline-offset: -8px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(82px, 1fr));
  gap: 7px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-actions button {
  min-height: 34px;
  border: 3px solid #08090d;
  border-radius: 6px;
  background: #d7f7e4;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
  cursor: pointer;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-workspace-actions .danger {
  background: #ffd7d7;
  color: #7a1d1d;
}

body.app-mode.client-session .topbar-actions,
body.app-mode.client-session .operator-strip,
body.app-mode.client-session .credit-warning-banner,
body.app-mode.client-session .global-project-console,
body.app-mode.client-session .status-grid {
  display: none;
}

body.app-mode[data-active-view="client-portal"] .topbar {
  background:
    linear-gradient(105deg, rgba(217, 255, 63, 0.18) 0 30%, rgba(102, 211, 230, 0.2) 30% 68%, rgba(255, 228, 154, 0.22) 68% 100%),
    #fffaf0;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] {
  grid-column: 1 / -1;
}

body.app-mode[data-active-view="client-portal"] .client-portal-panel {
  background:
    linear-gradient(110deg, rgba(217, 255, 63, 0.18) 0 24%, rgba(102, 211, 230, 0.18) 24% 62%, rgba(210, 190, 255, 0.24) 62% 100%),
    #fffaf0;
}

body.app-mode[data-active-view="client-portal"] .client-portal-hero {
  margin-bottom: 14px;
}

body.app-mode[data-active-view="client-portal"] .client-portal-summary {
  margin-bottom: 14px;
}

body.app-mode[data-active-view="client-portal"] .client-portal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

body.app-mode[data-active-view="client-portal"] .client-portal-grid .admin-section {
  min-width: 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-meta span {
  width: auto;
  max-width: 100%;
  padding: 5px 8px;
  line-height: 1.15;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-portal-preview {
  display: block;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 4px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(120deg, color-mix(in srgb, var(--wl-primary, #d9ff3f) 38%, transparent) 0 34%, rgba(255, 250, 240, 0.94) 34% 70%, color-mix(in srgb, var(--wl-accent, #66d3e6) 35%, transparent) 70% 100%),
    #fffaf0;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell header {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding-bottom: 10px;
  border-bottom: 3px solid #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell header > span {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: var(--wl-primary, #d9ff3f);
  box-shadow: 4px 4px 0 #08090d;
  font-size: 20px;
  font-weight: 1000;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell small,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell em {
  display: block;
  color: rgba(8, 9, 13, 0.72);
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell header strong {
  display: block;
  margin: 3px 0;
  font-size: 22px;
  line-height: 1;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status div {
  min-height: 76px;
  padding: 9px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.36);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status div:nth-child(2),
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status div:nth-child(5) {
  background: color-mix(in srgb, var(--wl-accent, #66d3e6) 28%, #ffffff);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status div:nth-child(3) {
  background: #ffe49a;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status span {
  display: block;
  margin-bottom: 5px;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 1000;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status strong {
  display: block;
  margin-bottom: 3px;
  font-size: 15px;
  line-height: 1.05;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell footer {
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: color-mix(in srgb, var(--wl-primary, #d9ff3f) 26%, #ffffff);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-shell footer strong {
  display: block;
  margin-bottom: 3px;
  font-size: 15px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-overview-board {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap article {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  min-height: 102px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #e4d8ff;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #d7f7e4;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #ffe49a;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #c9eef7;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap article > span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #d9ff3f;
  box-shadow: 2px 2px 0 #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 12px;
  font-weight: 900;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap strong {
  display: block;
  margin-bottom: 4px;
  font-size: 14px;
  line-height: 1.15;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap small {
  color: rgba(8, 9, 13, 0.76);
  font-size: 10px;
  line-height: 1.3;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-section {
  margin-top: 14px;
  background:
    linear-gradient(90deg, rgba(217, 255, 63, 0.24) 0 28%, rgba(102, 211, 230, 0.18) 28% 58%, rgba(228, 216, 255, 0.24) 58% 100%),
    #fffaf0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-section {
  margin-top: 14px;
  background:
    linear-gradient(90deg, rgba(201, 238, 247, 0.32) 0 34%, rgba(255, 228, 154, 0.26) 34% 68%, rgba(217, 255, 63, 0.22) 68% 100%),
    #fffaf0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal-section {
  margin-top: 14px;
  background:
    linear-gradient(90deg, rgba(217, 255, 63, 0.22), rgba(102, 211, 230, 0.18), rgba(255, 228, 154, 0.26)),
    #fffaf0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal-section .section-title {
  align-items: center;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal {
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 4px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(112deg, color-mix(in srgb, var(--wl-primary, #d9ff3f) 42%, transparent) 0 26%, rgba(255, 250, 240, 0.96) 26% 62%, color-mix(in srgb, var(--wl-accent, #66d3e6) 38%, transparent) 62% 100%),
    #fffaf0;
  box-shadow: 7px 7px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header > span {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: var(--wl-primary, #d9ff3f);
  box-shadow: 4px 4px 0 #08090d;
  font-size: 22px;
  font-weight: 1000;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header small,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header strong {
  display: block;
  margin: 3px 0;
  font-size: 28px;
  line-height: 1;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header p {
  max-width: 680px;
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  line-height: 1.35;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header b {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 8px 10px;
  border: 3px solid #08090d;
  border-radius: 6px;
  background: var(--wl-accent, #66d3e6);
  box-shadow: 3px 3px 0 #08090d;
  font-size: 11px;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid article,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-detail article {
  min-height: 104px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid article:nth-child(2),
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid article:nth-child(5) {
  background: color-mix(in srgb, var(--wl-accent, #66d3e6) 30%, #ffffff);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid article:nth-child(3),
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid article:nth-child(6) {
  background: #ffe49a;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid strong,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-detail strong {
  display: block;
  margin: 7px 0 4px;
  font-size: 20px;
  line-height: 1.05;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid small,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-detail small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  line-height: 1.32;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-detail {
  display: grid;
  grid-template-columns: 1.1fr 1.1fr 0.8fr;
  gap: 10px;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live {
  display: grid;
  gap: 14px;
  padding: 14px;
  border: 4px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(112deg, color-mix(in srgb, var(--wl-primary, #d9ff3f) 42%, transparent) 0 26%, rgba(255, 250, 240, 0.96) 26% 62%, color-mix(in srgb, var(--wl-accent, #66d3e6) 38%, transparent) 62% 100%),
    #fffaf0;
  box-shadow: 7px 7px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header > span {
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: var(--wl-primary, #d9ff3f);
  box-shadow: 4px 4px 0 #08090d;
  font-size: 22px;
  font-weight: 1000;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header small,
body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header strong {
  display: block;
  margin: 3px 0;
  font-size: 28px;
  line-height: 1;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header p {
  max-width: 680px;
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  line-height: 1.35;
}

body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header b {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 8px 10px;
  border: 3px solid #08090d;
  border-radius: 6px;
  background: var(--wl-accent, #66d3e6);
  box-shadow: 3px 3px 0 #08090d;
  font-size: 11px;
  text-transform: uppercase;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-summary {
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 8px;
  margin: 10px 0 12px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 12px 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-actions,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 12px 0;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-actions button,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-actions button {
  min-height: 54px;
  border-width: 3px;
  background: #c9eef7;
  color: #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-actions button:first-child,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-actions button:first-child {
  background: #d9ff3f;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-actions button:disabled,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-actions button:disabled {
  cursor: not-allowed;
  background: #eceff5;
  color: rgba(8, 9, 13, 0.48);
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.42);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] #white-label-approval-list .module-work-item,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] #white-label-portal-links .module-work-item {
  border: 3px solid #08090d;
  background: #ffffff;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] #white-label-approval-list .module-work-item small,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] #white-label-portal-links .module-work-item small {
  color: rgba(8, 9, 13, 0.72);
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] #white-label-approval-list .module-work-item span {
  background: #ffe49a;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] #white-label-portal-links a {
  color: #0f5f72;
  font-weight: 900;
  text-decoration: underline;
  text-decoration-thickness: 2px;
}

@media (max-width: 900px) {
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-summary,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .admin-layout,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .module-roadmap,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-form-grid,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-client-invite,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-preview-status,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-portal header,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-grid,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-live-detail,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-summary,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-approval-actions,
  body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-portal-actions,
  body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-grid,
  body.app-mode[data-active-view="client-portal"] [data-view-section="client-portal"] .client-portal-live header {
    grid-template-columns: 1fr;
  }
}

.creative-dna-panel {
  display: grid;
  grid-template-columns: minmax(220px, 1.15fr) minmax(160px, 0.85fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(202, 240, 105, 0.18), rgba(103, 213, 232, 0.16)),
    rgba(8, 41, 50, 0.92);
  box-shadow: 5px 5px 0 #08090d;
  color: #f6fff9;
}

.creative-dna-panel strong {
  display: block;
  margin: 2px 0;
  color: #dfff3f;
}

.creative-dna-panel small {
  display: block;
  max-width: 760px;
  color: rgba(246, 255, 249, 0.78);
  line-height: 1.35;
}

.creative-dna-panel.locked {
  background:
    linear-gradient(135deg, rgba(202, 240, 105, 0.26), rgba(174, 229, 209, 0.2)),
    rgba(8, 41, 50, 0.96);
}

.creative-dna-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.creative-dna-tags span {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  border: 1px solid rgba(223, 255, 63, 0.55);
  border-radius: 999px;
  padding: 4px 8px;
  background: rgba(8, 9, 13, 0.55);
  color: #f6fff9;
  font-size: 10px;
  font-weight: 800;
}

.creative-dna-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(120px, 1fr));
  gap: 8px;
}

.creative-dna-actions button {
  white-space: normal;
}

.social-production-lab {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.14), rgba(255, 247, 237, 0.9)),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
  color: #08090d;
}

.social-production-header,
.social-production-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.social-production-header h3 {
  margin: 2px 0 0;
  color: #08090d;
  font-size: 1rem;
  line-height: 1.1;
}

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

.social-production-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 0.68rem;
  font-weight: 900;
}

.social-production-form .wide-field,
.social-production-actions {
  grid-column: 1 / -1;
}

.social-production-form input,
.social-production-form select,
.social-production-form textarea {
  width: 100%;
  min-width: 0;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.88);
  color: #08090d;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 800;
}

.social-production-form textarea {
  resize: vertical;
}

.social-production-actions small {
  min-width: 0;
  color: rgba(8, 9, 13, 0.66);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.28;
}

.social-pack-specs,
.social-pack-preview {
  display: grid;
  gap: 8px;
}

.social-pack-specs {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.social-pack-preview {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.social-pack-specs article,
.social-pack-preview article {
  min-width: 0;
  border: 2px solid #08090d;
  border-radius: 8px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 3px 3px 0 #08090d;
}

.social-pack-specs span,
.social-pack-preview span {
  display: block;
  color: rgba(8, 9, 13, 0.58);
  font-size: 0.58rem;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.social-pack-specs strong {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
  color: #08090d;
  font-size: 0.72rem;
  line-height: 1.15;
}

.social-pack-preview p {
  margin: 5px 0 0;
  overflow-wrap: anywhere;
  color: rgba(8, 9, 13, 0.72);
  font-size: 0.72rem;
  font-weight: 750;
  line-height: 1.3;
}

@media (max-width: 980px) {
  .creative-dna-panel {
    grid-template-columns: 1fr;
  }

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

  .social-production-form,
  .social-pack-preview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .social-pack-specs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .social-production-header,
  .social-production-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .social-production-form,
  .social-pack-specs,
  .social-pack-preview {
    grid-template-columns: 1fr;
  }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: var(--obsidian);
  color: var(--white);
}

[hidden] {
  display: none !important;
}

.landing-mode .app-shell {
  display: none;
}

.app-mode .landing-page {
  display: none;
}

body.app-mode:has(.landing-detail-page:target) .landing-page {
  display: block;
}

body.app-mode:has(.landing-detail-page:target) .app-shell {
  display: none;
}

.landing-page {
  min-height: 100vh;
  background: #08090d;
}

.image-landing-frame {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background: #08090d;
  isolation: isolate;
}

.image-landing-frame img {
  display: block;
  width: 100%;
  height: 100vh;
  object-fit: cover;
}

.landing-auth-cta {
  position: absolute;
  left: clamp(18px, 4vw, 68px);
  bottom: clamp(18px, 5vw, 78px);
  z-index: 24;
  min-height: 56px;
  padding: 0 28px;
  border: 3px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 7px 7px 0 #08090d;
  font-size: clamp(13px, 1.4vw, 18px);
}

.landing-auth-scrim {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: none;
  width: 100%;
  height: 100%;
  border: 0;
  background: rgba(8, 9, 13, 0.66);
  cursor: pointer;
}

body.landing-auth-open .landing-auth-scrim {
  display: block;
}

.image-login-panel {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 130;
  display: none;
  grid-template-columns: minmax(150px, 180px) minmax(0, 1fr);
  align-items: center;
  gap: 12px 16px;
  width: min(620px, calc(100vw - 36px));
  max-height: calc(100svh - 36px);
  padding: 14px;
  overflow: auto;
  border: 3px solid #08090d;
  border-radius: 0;
  background:
    linear-gradient(100deg, rgba(255, 49, 52, 0.95) 0 36%, rgba(213, 255, 0, 0.96) 36% 57%, rgba(35, 78, 255, 0.92) 57% 100%),
    #f7dfc5;
  box-shadow:
    8px 8px 0 #08090d,
    0 22px 70px rgba(0, 0, 0, 0.38);
  transform: translate(-50%, -50%) rotate(-0.65deg);
}

body.landing-auth-open .image-login-panel {
  display: grid;
}

.landing-auth-close {
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 2;
  min-height: 30px;
  padding: 0 10px;
  border: 2px solid #08090d;
  border-radius: 0;
  background: #fff8ea;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font: 900 10px Geist, "Helvetica Neue", Arial, sans-serif;
  text-transform: uppercase;
  cursor: pointer;
}

.image-login-panel::before,
.image-login-panel::after {
  position: absolute;
  pointer-events: none;
  content: "";
}

.image-login-panel::before {
  left: -18px;
  top: 50%;
  width: 72px;
  height: 3px;
  background: #08090d;
  box-shadow: 12px -12px 0 #08090d, 25px 13px 0 #08090d;
  transform: rotate(-14deg);
}

.image-login-panel::after {
  right: -12px;
  bottom: -13px;
  width: 54px;
  height: 54px;
  border: 4px solid #08090d;
  border-left-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  transform: rotate(24deg);
}

.image-login-panel img {
  width: 100%;
  height: 68px;
  border: 2px solid #08090d;
  border-radius: 0;
  object-fit: cover;
  filter: contrast(1.12) saturate(1.15);
}

.image-login-panel span {
  justify-self: start;
  width: max-content;
  max-width: 100%;
  padding: 8px 10px;
  background: #08090d;
  color: #d5ff00;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
  text-transform: uppercase;
}

.landing-login-form {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
  gap: 10px 12px;
  padding-top: 2px;
}

.landing-login-form label {
  display: grid;
  gap: 4px;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.landing-login-form input {
  min-width: 0;
  width: 100%;
  height: 44px;
  border: 2px solid #08090d;
  border-radius: 0;
  background: rgba(255, 248, 234, 0.96);
  color: #08090d;
  font: 850 13px Geist, "Helvetica Neue", Arial, sans-serif;
  outline: none;
  padding: 0 12px;
  box-shadow: 3px 3px 0 #08090d;
}

.landing-login-form input:focus {
  background: #ffffff;
  box-shadow: 4px 4px 0 #08090d, 0 0 0 3px rgba(103, 213, 232, 0.55);
}

.landing-login-form .landing-remember {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 2px 0;
}

.landing-login-form .landing-remember input {
  width: 16px;
  min-width: 16px;
  height: 16px;
  margin: 0;
  box-shadow: none;
}

.landing-login-form .landing-remember span {
  width: auto;
  padding: 6px 8px;
  background: #08090d;
  color: #d5ff00;
  font: 900 11px Geist, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.05;
  text-transform: uppercase;
}

.landing-login-form small {
  grid-column: 1 / -1;
  min-height: 14px;
  color: #08090d;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.25;
}

.landing-login {
  min-height: 42px;
  padding: 0 14px;
  border: 2px solid #08090d;
  border-radius: 0;
  background: #fff8ea;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  font-weight: 900;
  line-height: 1.05;
  text-transform: uppercase;
  cursor: pointer;
}

.landing-login.primary {
  min-height: 54px;
  background: #d5ff00;
  color: #08090d;
  font-size: 16px;
}

.hosted-auth-login {
  grid-column: 1 / -1;
  background: #67d5e8;
}

.landing-reset-link {
  justify-self: start;
  min-height: 34px;
  padding: 0 2px;
  border: 0;
  background: rgba(255, 248, 234, 0.72);
  color: #08090d;
  font: 900 11px Geist, "Helvetica Neue", Arial, sans-serif;
  text-align: left;
  text-decoration: underline;
  text-transform: uppercase;
  cursor: pointer;
}

.landing-reset-fields {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px;
  padding: 8px;
  border: 2px solid #08090d;
  background: rgba(127, 226, 242, 0.92);
  box-shadow: 3px 3px 0 #08090d;
}

.landing-reset-fields[hidden] {
  display: none;
}

.landing-login.huge {
  min-height: 56px;
  padding: 0 24px;
}

.landing-login.floating-login {
  position: absolute;
  right: clamp(18px, 5vw, 78px);
  bottom: clamp(18px, 5vw, 72px);
  z-index: 4;
  min-height: 54px;
  padding: 0 24px;
  border: 3px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 7px 7px 0 #08090d;
}

.landing-login.floating-login.alt-login {
  left: clamp(18px, 5vw, 78px);
  right: auto;
  background: #ff5f5f;
  animation-delay: -2.2s;
}

.landing-pricing-section {
  position: relative;
  z-index: 2;
  min-height: min(100vh, 940px);
  padding: clamp(44px, 7vw, 92px) clamp(18px, 5vw, 72px);
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.16), transparent 32%),
    linear-gradient(315deg, rgba(103, 213, 232, 0.16), transparent 38%),
    linear-gradient(180deg, #08090d 0%, #12131a 54%, #fff8ea 54%, #fff8ea 100%);
  color: #08090d;
}

.landing-pricing-shell {
  width: min(1240px, 100%);
  margin: 0 auto;
}

.landing-pricing-header {
  display: grid;
  gap: 12px;
  max-width: 760px;
  margin-bottom: 22px;
  color: #fff8ea;
}

.landing-pricing-header .landing-kicker {
  width: fit-content;
  padding: 7px 10px;
  border: 2px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

.landing-pricing-header h2 {
  display: grid;
  gap: 0;
  max-width: 760px;
  margin: 0;
  color: #fff8ea;
  font-size: 72px;
  line-height: 0.96;
  letter-spacing: 0;
}

.landing-pricing-header h2 span {
  display: block;
}

.landing-pricing-header p {
  max-width: 720px;
  margin: 0;
  color: rgba(255, 248, 234, 0.82);
  font-size: 16px;
  font-weight: 760;
  line-height: 1.45;
}

.landing-pricing-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}

.landing-plan-card {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto;
  gap: 10px;
  min-height: 430px;
  padding: 18px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff8ea;
  box-shadow: 7px 7px 0 #08090d;
  overflow: hidden;
}

.landing-plan-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 9px;
  background: var(--landing-plan-accent, #d5ff00);
  content: "";
}

.landing-plan-card.recommended {
  transform: translateY(-8px);
  box-shadow: 9px 10px 0 #08090d;
}

.landing-plan-card.recommended::after {
  position: absolute;
  right: 12px;
  top: 13px;
  padding: 5px 8px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #08090d;
  color: #d5ff00;
  content: "Recommended";
  font: 900 9px "Geist Mono", Menlo, monospace;
  letter-spacing: 0;
  text-transform: uppercase;
}

.landing-plan-card.tone-lime {
  --landing-plan-accent: #d5ff00;
  background: linear-gradient(180deg, rgba(213, 255, 0, 0.16), transparent 30%), #fff8ea;
}

.landing-plan-card.tone-cyan {
  --landing-plan-accent: #67d5e8;
  background: linear-gradient(180deg, rgba(103, 213, 232, 0.18), transparent 32%), #fff8ea;
}

.landing-plan-card.tone-violet {
  --landing-plan-accent: #b9a7ff;
  background: linear-gradient(180deg, rgba(185, 167, 255, 0.19), transparent 32%), #fff8ea;
}

.landing-plan-card.tone-coral {
  --landing-plan-accent: #ff8a6a;
  background: linear-gradient(180deg, rgba(255, 138, 106, 0.18), transparent 32%), #fff8ea;
}

.landing-plan-badge {
  justify-self: start;
  width: fit-content;
  margin-top: 8px;
  padding: 6px 8px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: var(--landing-plan-accent, #d5ff00);
  color: #08090d;
  font: 900 10px "Geist Mono", Menlo, monospace;
  line-height: 1;
  text-transform: uppercase;
}

.landing-plan-card h3 {
  margin: 0;
  color: #08090d;
  font-size: clamp(24px, 2.5vw, 36px);
  line-height: 0.98;
  letter-spacing: 0;
}

.landing-plan-card > strong {
  display: flex;
  align-items: baseline;
  gap: 4px;
  color: #08090d;
  font-size: clamp(34px, 3.8vw, 58px);
  line-height: 0.9;
}

.landing-plan-card > strong small {
  color: rgba(8, 9, 13, 0.68);
  font-size: 14px;
  font-weight: 900;
}

.landing-plan-card p {
  margin: 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.34;
}

.landing-plan-card ul {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.landing-plan-card li {
  position: relative;
  padding-left: 18px;
  color: #08090d;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.22;
}

.landing-plan-card li::before {
  position: absolute;
  left: 0;
  top: 3px;
  width: 9px;
  height: 9px;
  border: 2px solid #08090d;
  border-radius: 50%;
  background: var(--landing-plan-accent, #d5ff00);
  content: "";
}

.landing-plan-button {
  align-self: end;
  min-height: 48px;
  margin-top: 4px;
  background: var(--landing-plan-accent, #d5ff00);
  font-size: 12px;
}

.landing-plan-card.is-selected {
  outline: 4px solid #67d5e8;
  outline-offset: 4px;
}

.landing-pricing-notes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}

.landing-pricing-notes article {
  display: grid;
  gap: 6px;
  min-height: 108px;
  padding: 13px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 5px 5px 0 #08090d;
}

.landing-pricing-notes article:nth-child(2) {
  background: #e8fff4;
}

.landing-pricing-notes article:nth-child(3) {
  background: #effbff;
}

.landing-pricing-notes strong {
  color: #08090d;
  font-size: 14px;
  line-height: 1.1;
}

.landing-pricing-notes span {
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
}

.landing-selected-plan {
  grid-column: 1 / -1;
  margin: 0;
  padding: 8px 10px;
  border: 2px solid #08090d;
  background: #67d5e8;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
}

.hero-frame::after,
.modules-frame::after {
  position: absolute;
  left: clamp(16px, 4vw, 64px);
  bottom: clamp(18px, 5vw, 74px);
  z-index: 3;
  padding: 8px 12px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  content: "LIVE LOGIN";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(12px, 1.35vw, 18px);
  font-weight: 900;
  letter-spacing: 0;
}

.hero-frame::after {
  display: none;
  content: none;
}

.modules-frame::after {
  left: auto;
  right: clamp(16px, 4vw, 64px);
  top: clamp(18px, 5vw, 74px);
  bottom: auto;
  background: #67d5e8;
  content: "MODULE WALL";
  animation-delay: -1.2s;
}

.wake-feed-frame {
  background: #fbf1dc;
}

.wake-feed-frame::before {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08), transparent 18%, transparent 78%, rgba(8, 9, 13, 0.16)),
    radial-gradient(circle at 22% 24%, rgba(0, 66, 255, 0.14), transparent 24%),
    radial-gradient(circle at 82% 74%, rgba(213, 255, 0, 0.18), transparent 22%);
  content: "";
  pointer-events: none;
}

.wake-feed-frame::after {
  position: absolute;
  right: clamp(16px, 4vw, 64px);
  bottom: clamp(18px, 5vw, 74px);
  z-index: 4;
  padding: 8px 12px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  content: "AGENT MODE ACTIVE";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(12px, 1.35vw, 18px);
  font-weight: 900;
  letter-spacing: 0;
}

.landing-login.wake-login {
  right: clamp(18px, 5vw, 78px);
  bottom: clamp(80px, 9vw, 132px);
  background: #67d5e8;
}

.proxy-agent-frame {
  display: grid;
  grid-template-columns: minmax(360px, 0.92fr) minmax(420px, 0.78fr);
  align-items: center;
  min-height: 100vh;
  padding: clamp(18px, 4vw, 68px);
  border-top: 6px solid #08090d;
  background:
    linear-gradient(90deg, rgba(255, 247, 237, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(255, 247, 237, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(103deg, #d5ff00 0 9%, transparent 9% 100%),
    linear-gradient(116deg, transparent 0 16%, #1848ff 16% 56%, #08090d 56% 72%, #234eff 72% 100%),
    radial-gradient(circle at 78% 22%, rgba(103, 213, 234, 0.7) 0 10%, transparent 11%),
    radial-gradient(circle at 16% 82%, rgba(213, 255, 0, 0.46) 0 11%, transparent 12%),
    #08090d;
  background-size: 40px 40px, 40px 40px, auto, auto, auto, auto, auto;
}

.proxy-agent-frame::before {
  position: absolute;
  left: clamp(18px, 4vw, 64px);
  top: clamp(18px, 4vw, 58px);
  z-index: 4;
  padding: 8px 12px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  content: "PROXY AGENT / SIGNAL HIJACK";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(12px, 1.25vw, 17px);
  font-weight: 900;
  letter-spacing: 0;
}

.proxy-agent-frame::after {
  position: absolute;
  left: 0;
  right: 0;
  top: 48%;
  z-index: 1;
  height: clamp(92px, 13vw, 178px);
  background:
    linear-gradient(90deg, transparent 0 4%, rgba(8, 9, 13, 0.96) 4% 24%, rgba(35, 78, 255, 0.96) 24% 48%, rgba(213, 255, 0, 0.96) 48% 60%, rgba(103, 213, 234, 0.88) 60% 84%, transparent 84% 100%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.36) 0 2px, transparent 2px 8px);
  content: "";
  mix-blend-mode: hard-light;
  opacity: 0.92;
  pointer-events: none;
  transform: translateY(-50%);
}

.proxy-agent-frame img {
  position: relative;
  z-index: 2;
  width: min(100%, 640px);
  height: min(82vh, 780px);
  margin: 0 auto;
  border: 3px solid #08090d;
  object-fit: cover;
  object-position: center;
  box-shadow: 12px 12px 0 #08090d, -14px -14px 0 #d5ff00, 20px -20px 0 #67d5e8, -28px 22px 0 rgba(24, 72, 255, 0.86);
  filter: contrast(1.18) saturate(1.2);
}

.proxy-agent-copy {
  position: relative;
  z-index: 3;
  display: grid;
  gap: clamp(14px, 1.5vw, 20px);
  max-width: 650px;
  padding: clamp(22px, 3vw, 42px);
  border: 4px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 247, 237, 0.08), transparent 46%),
    linear-gradient(135deg, rgba(35, 78, 255, 0.26), transparent 42%),
    #08090d;
  box-shadow:
    10px 10px 0 #08090d,
    -10px -10px 0 #67d5e8,
    18px -18px 0 #d5ff00;
  clip-path: polygon(0 0, 97% 0, 100% 8%, 100% 92%, 96% 100%, 0 100%);
  overflow: hidden;
  transform: rotate(-1deg);
}

.proxy-agent-copy::before,
.proxy-agent-copy::after {
  position: absolute;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.proxy-agent-copy::before {
  left: 0;
  right: 0;
  top: 0;
  height: 14px;
  border-bottom: 4px solid #08090d;
  background:
    linear-gradient(90deg, #d5ff00 0 28%, #67d5e8 28% 58%, #234eff 58% 78%, #fff7ed 78% 100%);
  opacity: 1;
}

.proxy-agent-copy::after {
  right: -9%;
  top: 18%;
  width: 42%;
  height: 58%;
  border: 3px solid rgba(213, 255, 0, 0.38);
  border-radius: 8px;
  background:
    repeating-linear-gradient(90deg, rgba(213, 255, 0, 0.16) 0 8px, transparent 8px 18px),
    linear-gradient(145deg, rgba(103, 213, 234, 0.16), rgba(35, 78, 255, 0.18));
  opacity: 0.72;
  transform: rotate(9deg);
}

.proxy-agent-copy > * {
  position: relative;
  z-index: 2;
}

.proxy-agent-copy .landing-kicker {
  justify-self: start;
  margin-top: 4px;
  padding: 8px 10px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 5px 5px 0 #08090d;
  color: #08090d;
  text-shadow: none;
}

.proxy-agent-copy h2 {
  margin: 0;
  max-width: 11ch;
  color: #fff7ed;
  font-size: clamp(40px, 5.2vw, 74px);
  line-height: 0.96;
  text-shadow: 4px 4px 0 #08090d;
}

.proxy-agent-copy p {
  max-width: 590px;
  margin: 0;
  padding: 16px 18px;
  border: 3px solid #08090d;
  background: #fff7ed;
  color: #fff7ed;
  font-size: clamp(15px, 1.22vw, 18px);
  font-weight: 850;
  line-height: 1.42;
  transform: none;
  box-shadow: 6px 6px 0 #67d5e8;
}

.proxy-agent-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.proxy-agent-points span {
  display: grid;
  align-items: center;
  min-height: 62px;
  padding: 11px 10px;
  border: 3px solid #08090d;
  border-radius: 7px;
  background: #d5ff00;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(10px, 0.85vw, 12px);
  font-weight: 900;
  line-height: 1.24;
  text-transform: uppercase;
}

.landing-page .proxy-agent-copy h2 {
  color: #fff7ed !important;
  text-shadow: 4px 4px 0 #08090d;
}

.landing-page .proxy-agent-copy p {
  color: #08090d !important;
}

.proxy-agent-art-frame {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 100vh;
  align-items: stretch;
  padding: 0;
  border-top: 6px solid #08090d;
  background: #050608;
}

.proxy-agent-art-frame::before,
.proxy-agent-art-frame::after {
  content: none;
}

.proxy-agent-art-frame img {
  width: 100%;
  height: 100vh;
  max-width: none;
  margin: 0;
  border: 0;
  object-fit: cover;
  object-position: center;
  box-shadow: none;
  filter: contrast(1.04) saturate(1.06);
  transform: none;
}

.ploxy-ai-agency-frame {
  display: grid;
  min-height: 100vh;
  border-top: 6px solid #08090d;
  background: #050608;
}

.ploxy-ai-agency-frame img {
  width: 100%;
  height: 100vh;
  object-fit: cover;
  object-position: center;
  filter: contrast(1.04) saturate(1.06);
}

.ploxy-intelligence-frame {
  position: relative;
  display: grid;
  grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(22px, 4vw, 66px);
  min-height: 100vh;
  padding: clamp(26px, 5vw, 76px);
  border-top: 6px solid #08090d;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.1) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.1) 0 1px, transparent 1px 100%),
    linear-gradient(118deg, #f8f4ef 0 33%, #67d5e8 33% 47%, #234eff 47% 68%, #d5ff00 68% 79%, #08090d 79% 100%);
  background-size: 38px 38px, 38px 38px, auto;
  color: #08090d;
}

.ploxy-intelligence-frame::before,
.ploxy-intelligence-frame::after {
  position: absolute;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.ploxy-intelligence-frame::before {
  inset: 8% -6% auto 8%;
  height: clamp(96px, 12vw, 170px);
  border-top: 4px solid #08090d;
  border-bottom: 4px solid #08090d;
  background:
    repeating-linear-gradient(90deg, rgba(8, 9, 13, 0.22) 0 16px, transparent 16px 28px),
    linear-gradient(90deg, rgba(213, 255, 0, 0.86), rgba(103, 213, 234, 0.7), rgba(255, 247, 237, 0.84));
  mix-blend-mode: multiply;
  opacity: 0.78;
  transform: rotate(-2.2deg);
}

.ploxy-intelligence-frame::after {
  right: clamp(18px, 4vw, 62px);
  bottom: clamp(22px, 5vw, 80px);
  width: min(38vw, 460px);
  height: clamp(70px, 9vw, 128px);
  border: 4px solid #08090d;
  background:
    linear-gradient(90deg, #fff7ed 0 18%, #08090d 18% 23%, #67d5e8 23% 50%, #d5ff00 50% 76%, #234eff 76% 100%);
  box-shadow: 8px 8px 0 #08090d;
  opacity: 0.9;
  transform: rotate(3deg);
}

.ploxy-intelligence-art,
.ploxy-intelligence-copy {
  position: relative;
  z-index: 1;
}

.ploxy-intelligence-art {
  align-self: center;
  justify-self: center;
  width: min(100%, 440px);
  transform: rotate(-1.6deg);
}

.ploxy-intelligence-art::before,
.ploxy-intelligence-art::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.ploxy-intelligence-art::before {
  inset: -18px 18px 18px -18px;
  border: 4px solid #08090d;
  background: #d5ff00;
  box-shadow: -9px 9px 0 #234eff;
  transform: rotate(3.5deg);
}

.ploxy-intelligence-art::after {
  right: -28px;
  top: 18%;
  width: 88px;
  height: 58%;
  border: 3px solid #08090d;
  background:
    repeating-linear-gradient(0deg, rgba(8, 9, 13, 0.24) 0 4px, transparent 4px 11px),
    #67d5e8;
  box-shadow: 6px 6px 0 #08090d;
  transform: rotate(7deg);
}

.ploxy-intelligence-art img {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  aspect-ratio: 512 / 913;
  height: auto;
  border: 4px solid #08090d;
  object-fit: cover;
  box-shadow: 12px 12px 0 #08090d;
  filter: contrast(1.08) saturate(1.08);
}

.ploxy-intelligence-art span {
  position: absolute;
  left: -18px;
  bottom: 9%;
  z-index: 3;
  max-width: min(290px, 80%);
  padding: 10px 12px;
  border: 3px solid #08090d;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(10px, 0.9vw, 13px);
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.ploxy-intelligence-copy {
  display: grid;
  gap: clamp(14px, 1.7vw, 22px);
  max-width: 940px;
}

.ploxy-intelligence-copy .landing-kicker {
  justify-self: start;
  padding: 9px 12px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 5px 5px 0 #08090d;
  color: #08090d;
  text-shadow: none;
}

.ploxy-intelligence-copy h2 {
  max-width: 900px;
  margin: 0;
  color: #fff7ed;
  font-size: clamp(48px, 7vw, 112px);
  line-height: 0.9;
  text-shadow:
    4px 4px 0 #08090d,
    -3px 3px 0 #234eff;
}

.ploxy-intelligence-copy p {
  max-width: 760px;
  margin: 0;
  padding: clamp(14px, 2vw, 20px);
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  font-size: clamp(15px, 1.25vw, 19px);
  font-weight: 850;
  line-height: 1.4;
}

.ploxy-intelligence-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.ploxy-intelligence-grid article {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
  min-height: 148px;
  padding: 13px;
  border: 3px solid #08090d;
  border-radius: 8px;
  overflow: hidden;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

.ploxy-intelligence-grid article::before {
  position: absolute;
  inset: 0 0 auto;
  height: 10px;
  background: #08090d;
  content: "";
}

.ploxy-intelligence-grid article:nth-child(1) {
  background: #d5ff00;
}

.ploxy-intelligence-grid article:nth-child(2) {
  background: #67d5e8;
}

.ploxy-intelligence-grid article:nth-child(3) {
  background: #ffd166;
}

.ploxy-intelligence-grid article:nth-child(4) {
  background: #b59cf6;
}

.ploxy-intelligence-grid strong {
  margin-top: 10px;
  color: #08090d;
  font-size: clamp(18px, 1.5vw, 24px);
  line-height: 1;
}

.ploxy-intelligence-grid small {
  color: rgba(8, 9, 13, 0.74);
  font-size: clamp(11px, 0.9vw, 13px);
  font-weight: 800;
  line-height: 1.32;
}

.ploxy-intelligence-frame {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 100vh;
  padding: 0;
  border-top: 6px solid #08090d;
  background: #050608;
}

.ploxy-intelligence-frame::before,
.ploxy-intelligence-frame::after {
  content: none;
}

.ploxy-intelligence-frame img {
  display: block;
  width: 100%;
  height: 100vh;
  object-fit: cover;
  object-position: center;
  filter: contrast(1.04) saturate(1.06);
}

.signal-control-frame {
  display: grid;
  grid-template-columns: minmax(320px, 0.88fr) minmax(390px, 0.82fr);
  align-items: center;
  gap: clamp(24px, 5vw, 76px);
  min-height: 100vh;
  padding: clamp(28px, 5vw, 78px);
  border-top: 6px solid #08090d;
  background:
    linear-gradient(90deg, rgba(255, 247, 237, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(255, 247, 237, 0.08) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 17% 16%, rgba(103, 213, 232, 0.34) 0 11%, transparent 12%),
    radial-gradient(circle at 79% 74%, rgba(213, 255, 0, 0.28) 0 13%, transparent 14%),
    linear-gradient(108deg, #234eff 0 31%, #08090d 31% 55%, #d5ff00 55% 66%, #67d5e8 66% 74%, #234eff 74% 100%);
  background-size: 42px 42px, 42px 42px, auto, auto, auto;
}

.signal-control-frame::before {
  position: absolute;
  inset: 9% -8% 12%;
  z-index: 1;
  background:
    repeating-linear-gradient(0deg, rgba(255, 247, 237, 0.24) 0 2px, transparent 2px 9px),
    linear-gradient(104deg, transparent 0 8%, rgba(8, 9, 13, 0.94) 8% 28%, transparent 28% 58%, rgba(8, 9, 13, 0.9) 58% 72%, transparent 72% 100%);
  content: "";
  mix-blend-mode: hard-light;
  opacity: 0.86;
  pointer-events: none;
}

.signal-control-frame::after {
  position: absolute;
  left: clamp(18px, 4vw, 64px);
  top: clamp(18px, 4vw, 58px);
  z-index: 5;
  padding: 8px 12px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  content: "POLXY.AI / SIGNAL CONTROL";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(12px, 1.25vw, 17px);
  font-weight: 900;
  letter-spacing: 0;
}

.signal-control-art {
  position: relative;
  z-index: 3;
  justify-self: center;
  width: min(100%, 560px);
  transform: rotate(-2deg);
}

.signal-control-art::before {
  position: absolute;
  inset: -18px 18px 18px -18px;
  z-index: -1;
  border: 4px solid #08090d;
  background: #67d5e8;
  box-shadow: -18px 18px 0 rgba(35, 78, 255, 0.88);
  content: "";
}

.signal-control-art::after {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(35, 78, 255, 0.2), transparent 28%, rgba(213, 255, 0, 0.18) 58%, transparent 82%),
    repeating-linear-gradient(0deg, transparent 0 6px, rgba(103, 213, 232, 0.24) 6px 8px);
  content: "";
  mix-blend-mode: screen;
  pointer-events: none;
}

.signal-control-art img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: min(78vh, 820px);
  border: 5px solid #08090d;
  object-fit: cover;
  object-position: center;
  box-shadow:
    14px 14px 0 #08090d,
    -14px -14px 0 #d5ff00,
    22px -22px 0 #67d5e8;
  filter: grayscale(1) contrast(1.28) brightness(0.82);
}

.signal-control-copy {
  position: relative;
  z-index: 3;
  display: grid;
  gap: clamp(14px, 1.5vw, 20px);
  max-width: 680px;
  padding: clamp(22px, 3vw, 44px);
  border: 4px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(120deg, rgba(213, 255, 0, 0.92) 0 23%, transparent 23% 100%),
    linear-gradient(152deg, rgba(103, 213, 232, 0.9) 0 36%, rgba(35, 78, 255, 0.82) 36% 58%, rgba(255, 247, 237, 0.94) 58% 100%);
  box-shadow:
    10px 10px 0 #08090d,
    -10px -10px 0 #67d5e8,
    20px -20px 0 #d5ff00;
  clip-path: polygon(0 0, 96% 0, 100% 9%, 100% 91%, 95% 100%, 0 100%);
  overflow: hidden;
  transform: rotate(1.2deg);
}

.signal-control-copy::before,
.signal-control-copy::after {
  position: absolute;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.signal-control-copy::before {
  inset: 0;
  background:
    repeating-linear-gradient(100deg, rgba(8, 9, 13, 0.12) 0 9px, transparent 9px 22px),
    linear-gradient(90deg, rgba(8, 9, 13, 0.95) 0 17%, transparent 17% 100%);
}

.signal-control-copy::after {
  right: -8%;
  top: 12%;
  width: 50%;
  height: 58%;
  border: 3px solid rgba(8, 9, 13, 0.22);
  background:
    repeating-linear-gradient(90deg, rgba(35, 78, 255, 0.28) 0 9px, transparent 9px 20px),
    rgba(255, 247, 237, 0.34);
  transform: rotate(10deg);
}

.signal-control-copy > * {
  position: relative;
  z-index: 2;
}

.signal-control-copy .landing-kicker {
  justify-self: start;
  padding: 8px 10px;
  border: 3px solid #08090d;
  background: #08090d;
  box-shadow: 5px 5px 0 #d5ff00;
  color: #d5ff00;
  text-shadow: none;
}

.signal-control-copy h2 {
  max-width: 12ch;
  margin: 0;
  color: #fff7ed;
  font-size: clamp(40px, 5.2vw, 78px);
  line-height: 0.94;
  text-shadow: 4px 4px 0 #08090d, -2px 2px 0 #234eff;
}

.signal-control-copy p {
  max-width: 620px;
  margin: 0;
  padding: 16px 18px;
  border: 3px solid #08090d;
  background: #08090d;
  box-shadow: 6px 6px 0 #67d5e8;
  color: #fff7ed;
  font-size: clamp(15px, 1.22vw, 18px);
  font-weight: 850;
  line-height: 1.42;
}

.signal-control-points {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.signal-control-points span {
  display: grid;
  align-items: center;
  min-height: 62px;
  padding: 11px 10px;
  border: 3px solid #08090d;
  border-radius: 7px;
  background: #d5ff00;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(10px, 0.85vw, 12px);
  font-weight: 900;
  line-height: 1.24;
  text-transform: uppercase;
}

.signal-control-points span:nth-child(2) {
  background: #67d5e8;
}

.signal-control-points span:nth-child(3) {
  background: #fff7ed;
}

.landing-page .signal-control-copy h2 {
  color: #fff7ed !important;
  -webkit-text-fill-color: #fff7ed !important;
}

.landing-page .signal-control-copy p {
  color: #fff7ed !important;
  -webkit-text-fill-color: #fff7ed !important;
}

.agent-day-frame {
  background: #000;
}

.agent-day-frame::after {
  position: absolute;
  left: clamp(16px, 4vw, 64px);
  bottom: clamp(18px, 5vw, 74px);
  z-index: 3;
  padding: 8px 12px;
  border: 3px solid #08090d;
  background: #67d5e8;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  content: "POLXY AGENT DAY";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(12px, 1.35vw, 18px);
  font-weight: 900;
  letter-spacing: 0;
}

.hive-map-frame {
  background: #252525;
}

.hive-map-frame::after {
  position: absolute;
  right: clamp(16px, 4vw, 64px);
  top: clamp(18px, 5vw, 74px);
  z-index: 3;
  padding: 8px 12px;
  border: 3px solid #08090d;
  background: #f8ef30;
  box-shadow: 6px 6px 0 #08090d;
  color: #08090d;
  content: "POLXY MODULE MAP";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: clamp(12px, 1.35vw, 18px);
  font-weight: 900;
  letter-spacing: 0;
}

.hive-map-frame-alt::after {
  content: "POLXY ALT MAP";
}

.landing-contact-page {
  display: grid;
  grid-template-columns: minmax(0, 0.84fr) minmax(440px, 0.76fr);
  gap: clamp(18px, 3vw, 42px);
  align-items: start;
  width: 100%;
  max-width: 1840px;
  margin: 0 auto;
  padding: clamp(24px, 4vw, 56px);
  border-top: 6px solid #08090d;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    #f4dfc4;
  background-size: 42px 42px, 42px 42px, auto, auto;
  color: #08090d;
}

.landing-contact-copy {
  display: grid;
  gap: clamp(10px, 1.4vw, 18px);
  max-width: 860px;
}

.landing-contact-copy h2 {
  margin: 0;
  color: #08090d;
  font-size: clamp(40px, 5.4vw, 86px);
  line-height: 0.95;
}

.landing-contact-copy p {
  max-width: 720px;
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: clamp(14px, 1.2vw, 18px);
  line-height: 1.42;
}

.landing-contact-points {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 720px;
}

.landing-contact-points span {
  padding: 7px 10px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #fff7ed;
  color: #08090d;
  font-size: 11px;
  font-weight: 850;
}

.landing-contact-routing {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 6px;
}

.landing-contact-routing article,
.landing-contact-assurance article {
  display: grid;
  gap: 8px;
  min-height: 126px;
  padding: 13px;
  border: 2px solid rgba(8, 9, 13, 0.28);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.18), transparent 58%),
    rgba(255, 250, 240, 0.82);
}

.landing-contact-routing strong,
.landing-contact-assurance strong {
  color: #08090d;
  font-size: 15px;
  line-height: 1.15;
}

.landing-contact-routing span,
.landing-contact-assurance span {
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.38;
}

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

.landing-contact-flow span {
  min-height: 44px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #d5ff00;
  box-shadow: 3px 3px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

.landing-contact-panel {
  display: grid;
  gap: 14px;
}

.landing-contact-form {
  display: grid;
  gap: 12px;
  padding: clamp(14px, 2vw, 22px);
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.62), transparent 70%),
    #fff7ed;
  box-shadow: 6px 6px 0 #08090d;
}

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

.landing-contact-form label {
  display: grid;
  gap: 5px;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.landing-contact-form input,
.landing-contact-form select,
.landing-contact-form textarea {
  width: 100%;
  min-width: 0;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffaf0;
  color: #08090d;
  font: 800 13px Geist, "Helvetica Neue", Arial, sans-serif;
  outline: none;
  box-shadow: 3px 3px 0 #08090d;
}

.landing-contact-form input,
.landing-contact-form select {
  height: 40px;
  padding: 0 10px;
}

.landing-contact-form textarea {
  resize: vertical;
  min-height: 124px;
  padding: 10px;
  line-height: 1.35;
}

.landing-contact-consent {
  display: flex !important;
  align-items: center;
  gap: 5px 8px !important;
  font-family: Geist, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 11px !important;
  line-height: 1.3;
  text-transform: none !important;
}

.landing-contact-consent input {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  box-shadow: none;
}

.landing-contact-submit {
  min-height: 42px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
}

.landing-contact-submit:hover {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0 #08090d;
}

.landing-contact-status {
  min-height: 18px;
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  font-weight: 800;
}

.landing-contact-assurance {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.landing-affiliate-page {
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.16), transparent 48%),
    linear-gradient(45deg, rgba(103, 213, 232, 0.14), transparent 68%),
    #fffaf0;
}

.landing-affiliate-rich {
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
}

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

.landing-affiliate-main article {
  display: grid;
  gap: 8px;
  min-height: 132px;
  padding: 14px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.68), transparent 70%),
    #eefbff;
  box-shadow: 4px 4px 0 #08090d;
}

.landing-affiliate-main article:nth-child(2n) {
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.24), transparent 70%),
    #fff7ed;
}

.landing-affiliate-main strong {
  color: #08090d;
  font-size: 16px;
  line-height: 1.12;
}

.landing-affiliate-main span {
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  font-weight: 760;
  line-height: 1.36;
}

.landing-affiliate-apply {
  display: grid;
  align-content: start;
  gap: 12px;
}

.landing-affiliate-form {
  position: sticky;
  top: 18px;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.18), transparent 64%),
    #fffaf0;
}

.landing-affiliate-form .landing-contact-submit {
  background: #67d5e8;
}

@media (max-width: 860px) {
  .landing-affiliate-rich,
  .landing-affiliate-main {
    grid-template-columns: 1fr;
  }

  .landing-affiliate-form {
    position: static;
  }
}

.landing-contact-assurance article {
  min-height: 116px;
  background:
    linear-gradient(135deg, rgba(103, 213, 234, 0.22), transparent 62%),
    rgba(255, 250, 240, 0.8);
}

.landing-detail-page {
  display: none !important;
  gap: clamp(14px, 2vw, 22px);
  align-content: start;
  min-height: 100vh;
  padding: clamp(22px, 5vw, 64px);
  border-top: 0;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    #f4dfc4;
  background-size: 42px 42px;
  color: #08090d;
}

.landing-detail-page:target {
  display: grid !important;
  align-content: center;
}

.landing-page:has(.landing-detail-page:target) > :not(.landing-detail-page:target) {
  display: none !important;
}

.landing-page:has(.landing-detail-page:target) > .landing-detail-page:target {
  display: grid !important;
}

.landing-detail-page h2 {
  max-width: 1080px;
  margin: 0;
  color: #08090d;
  font-size: clamp(34px, 5.6vw, 82px);
  line-height: 0.96;
}

.landing-detail-page > p {
  max-width: 920px;
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: clamp(14px, 1.35vw, 18px);
  line-height: 1.45;
}

.landing-detail-back {
  display: inline-flex;
  align-self: start;
  align-items: center;
  justify-content: center;
  justify-self: start;
  width: max-content;
  max-width: 100%;
  min-height: 34px;
  padding: 0 13px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #fff7ed;
  color: #08090d;
  font: 900 11px Geist, "Helvetica Neue", Arial, sans-serif;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}

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

.landing-detail-grid article {
  display: grid;
  gap: 8px;
  min-height: 128px;
  padding: 14px;
  border: 2px solid rgba(8, 9, 13, 0.24);
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.76);
}

.landing-detail-grid strong {
  color: #08090d;
  font-size: 16px;
}

.landing-detail-grid span,
.landing-detail-grid a {
  color: rgba(8, 9, 13, 0.72);
  font-size: 13px;
  line-height: 1.38;
}

.landing-detail-rich {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
  gap: clamp(12px, 2vw, 20px);
  width: 100%;
  max-width: 1320px;
}

.landing-detail-main {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.landing-detail-main article,
.landing-detail-side {
  display: grid;
  gap: 9px;
  min-height: 144px;
  padding: 14px;
  border: 2px solid rgba(8, 9, 13, 0.28);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.66), transparent 68%),
    rgba(255, 250, 240, 0.84);
}

.landing-detail-main article:nth-child(2n),
.landing-detail-side {
  background:
    linear-gradient(135deg, rgba(103, 213, 234, 0.20), transparent 68%),
    rgba(255, 250, 240, 0.84);
}

.landing-detail-main article:nth-child(3n) {
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.20), transparent 68%),
    rgba(255, 250, 240, 0.84);
}

.landing-detail-main strong,
.landing-detail-side strong {
  color: #08090d;
  font-size: 16px;
  line-height: 1.15;
}

.landing-detail-main span,
.landing-detail-side li {
  color: rgba(8, 9, 13, 0.74);
  font-size: 13px;
  font-weight: 740;
  line-height: 1.42;
}

.landing-detail-side {
  align-content: start;
  border-color: #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

.landing-detail-side ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0 0 0 17px;
}

.landing-detail-side a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  min-height: 34px;
  margin-top: 3px;
  padding: 0 12px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #d5ff00;
  box-shadow: 3px 3px 0 #08090d;
  color: #08090d;
  font-size: 11px;
  font-weight: 900;
  text-decoration: none;
  text-transform: uppercase;
}

.landing-detail-page:target::after {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  margin-top: clamp(8px, 1.6vw, 16px);
  padding: 10px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #08090d;
  color: #fff7ed;
  content: "© 2026 Polxy · AI marketing operations platform · Company, legal, trust, and contact information";
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.25;
  text-transform: uppercase;
}

.landing-detail-page.landing-contact-page:target {
  grid-template-columns: minmax(0, 0.84fr) minmax(440px, 0.76fr);
  align-items: start;
  align-content: center;
}

.landing-page:has(.landing-detail-page:target) > .image-landing-frame,
.landing-page:has(.landing-detail-page:target) > .proxy-agent-frame,
.landing-page:has(.landing-detail-page:target) > .landing-footer {
  display: none;
}

.landing-page:has(.landing-detail-page:target) {
  min-height: 100vh;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    #f4dfc4;
  background-size: 42px 42px;
}

.landing-detail-page.landing-pricing-page:target {
  display: grid !important;
  align-content: start;
  min-height: 100vh;
  padding: clamp(24px, 5vw, 64px);
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.16), transparent 32%),
    linear-gradient(315deg, rgba(103, 213, 232, 0.16), transparent 38%),
    linear-gradient(180deg, #08090d 0%, #12131a 52%, #fff8ea 52%, #fff8ea 100%);
  background-size: auto;
  color: #08090d;
}

.landing-pricing-page:target .landing-detail-back {
  margin-bottom: clamp(12px, 2vw, 22px);
  background: #d5ff00;
  box-shadow: 4px 4px 0 #08090d;
}

.landing-pricing-page:target .landing-pricing-shell {
  width: min(1240px, 100%);
  margin: 0 auto;
}

.landing-pricing-page:target .landing-pricing-header {
  display: grid;
  gap: 12px;
  max-width: 760px;
  margin-bottom: 22px;
  color: #fff8ea;
}

.landing-pricing-page:target .landing-pricing-header h2 {
  max-width: 760px;
  color: #fff8ea;
  font-size: 72px;
  line-height: 0.96;
}

.landing-pricing-page:target .landing-pricing-header p {
  max-width: 720px;
  color: rgba(255, 248, 234, 0.82);
  font-size: 16px;
  font-weight: 760;
  line-height: 1.45;
}

.landing-footer {
  position: relative;
  z-index: 40;
  display: grid;
  gap: clamp(12px, 2vw, 18px);
  padding: clamp(18px, 4vw, 54px);
  border-top: 6px solid #08090d;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.1) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.1) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 12% 18%, rgba(213, 255, 0, 0.78) 0 10%, transparent 11%),
    radial-gradient(circle at 86% 34%, rgba(255, 107, 203, 0.5) 0 9%, transparent 10%),
    linear-gradient(120deg, rgba(213, 255, 0, 0.72) 0 16%, rgba(103, 213, 234, 0.62) 16% 42%, rgba(181, 156, 246, 0.62) 42% 68%, rgba(255, 177, 79, 0.66) 68% 100%),
    #f4dfc4;
  background-size: 42px 42px, 42px 42px, auto, auto, auto, auto;
  color: #08090d;
}

.landing-footer::before {
  position: absolute;
  inset: clamp(10px, 2vw, 22px);
  z-index: 0;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(102deg, #d5ff00 0 18%, #67d5e8 18% 44%, #b59cf6 44% 70%, #ffb454 70% 100%);
  box-shadow: 8px 8px 0 #08090d;
  content: "";
  opacity: 0.58;
  transform: rotate(-0.6deg);
}

.landing-footer > * {
  position: relative;
  z-index: 1;
}

.landing-footer-intro {
  position: relative;
  display: grid;
  gap: 10px;
  max-width: none;
  padding: clamp(16px, 3vw, 30px);
  border: 3px solid #08090d;
  border-radius: 8px;
  overflow: hidden;
  background:
    linear-gradient(108deg, rgba(213, 255, 0, 0.2) 0 13%, transparent 14%),
    linear-gradient(18deg, rgba(255, 255, 255, 0.16) 0 9%, transparent 10%),
    radial-gradient(circle at 78% 24%, rgba(255, 107, 203, 0.28) 0 11%, transparent 12%),
    #1848ff;
  box-shadow: 6px 6px 0 #08090d;
}

.landing-footer-intro::before,
.landing-footer-intro::after {
  position: absolute;
  inset: auto;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.landing-footer-intro::before {
  right: -4%;
  top: -18%;
  width: 48%;
  height: 70%;
  border: 3px solid rgba(8, 9, 13, 0.78);
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.26) 0 8px, transparent 8px 18px),
    #0b1020;
  transform: rotate(8deg);
}

.landing-footer-intro::after {
  left: 4%;
  bottom: 10%;
  width: 42%;
  height: 16%;
  background:
    repeating-linear-gradient(90deg, rgba(255, 247, 237, 0.9) 0 20px, transparent 20px 28px),
    #d5ff00;
  opacity: 0.2;
  transform: rotate(-4deg);
}

.landing-footer-intro > * {
  position: relative;
  z-index: 1;
}

.landing-footer-intro h2 {
  max-width: 980px;
  margin: 0;
  color: #fff7ed;
  font-size: clamp(28px, 4vw, 54px);
  line-height: 0.98;
}

.landing-footer-intro p {
  max-width: 880px;
  margin: 0;
  color: rgba(255, 247, 237, 0.78);
  font-size: clamp(13px, 1.2vw, 16px);
  line-height: 1.4;
}

.landing-footer-pricing-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  min-height: 46px;
  margin-top: 6px;
  padding: 0 17px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 5px 5px 0 #08090d;
  font: 900 13px "Geist Mono", Menlo, monospace;
  letter-spacing: 0;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
}

.landing-footer-pricing-cta:hover {
  background: #67d5e8;
  color: #08090d;
  text-decoration: none;
  transform: translate(-1px, -1px);
}

.landing-footer-intro .landing-kicker {
  color: #d5ff00;
}

.landing-footer-signals,
.landing-footer-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.landing-footer-signals article,
.landing-footer-links > div {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.74);
  box-shadow: 4px 4px 0 #08090d;
  overflow: hidden;
}

.landing-footer-signals article::before,
.landing-footer-links > div::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    repeating-linear-gradient(105deg, rgba(255, 255, 255, 0.28) 0 8px, transparent 8px 20px),
    radial-gradient(circle at 18% 12%, rgba(255, 255, 255, 0.62) 0 9%, transparent 10%),
    radial-gradient(circle at 88% 76%, rgba(8, 9, 13, 0.12) 0 12%, transparent 13%);
  content: "";
  mix-blend-mode: soft-light;
  pointer-events: none;
}

.landing-footer-signals article::after,
.landing-footer-links > div::after {
  position: absolute;
  right: -20px;
  bottom: -18px;
  width: 96px;
  height: 54px;
  border: 3px solid rgba(8, 9, 13, 0.24);
  background:
    repeating-linear-gradient(0deg, rgba(8, 9, 13, 0.18) 0 5px, transparent 5px 11px),
    rgba(255, 247, 237, 0.32);
  content: "";
  transform: rotate(-12deg);
  pointer-events: none;
}

.landing-footer-signals article > *,
.landing-footer-links > div > * {
  position: relative;
  z-index: 1;
}

.landing-footer-links > div {
  border-color: #08090d;
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.64), transparent 48%),
    linear-gradient(24deg, rgba(8, 9, 13, 0.08) 0 18%, transparent 19%),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

.landing-footer-links > div:nth-child(1) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 48%),
    linear-gradient(24deg, rgba(8, 9, 13, 0.1) 0 20%, transparent 21%),
    #d5ff00;
}

.landing-footer-links > div:nth-child(2) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 48%),
    linear-gradient(24deg, rgba(8, 9, 13, 0.1) 0 20%, transparent 21%),
    #67d5e8;
}

.landing-footer-links > div:nth-child(3) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 48%),
    linear-gradient(24deg, rgba(8, 9, 13, 0.1) 0 20%, transparent 21%),
    #ffd166;
}

.landing-footer-links > div:nth-child(4) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 48%),
    linear-gradient(24deg, rgba(8, 9, 13, 0.1) 0 20%, transparent 21%),
    #b59cf6;
}

.landing-footer-signals article:nth-child(1) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 52%),
    linear-gradient(28deg, rgba(35, 78, 255, 0.2) 0 16%, transparent 17%),
    #d5ff00;
}

.landing-footer-signals article:nth-child(2) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 52%),
    linear-gradient(28deg, rgba(213, 255, 0, 0.18) 0 16%, transparent 17%),
    #67d5e8;
}

.landing-footer-signals article:nth-child(3) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 52%),
    linear-gradient(28deg, rgba(255, 107, 203, 0.2) 0 16%, transparent 17%),
    #ffd166;
}

.landing-footer-signals article:nth-child(4) {
  background:
    linear-gradient(155deg, rgba(255, 255, 255, 0.58), transparent 52%),
    linear-gradient(28deg, rgba(35, 78, 255, 0.16) 0 16%, transparent 17%),
    #b59cf6;
}

.landing-footer-signals strong,
.landing-footer-links strong {
  color: #08090d;
  font-size: 15px;
  line-height: 1.08;
}

.landing-footer-signals small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  line-height: 1.3;
}

.landing-footer-links strong {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.landing-footer-links span,
.landing-footer-links a,
.landing-footer-links button {
  min-height: 24px;
  padding: 3px 0;
  border: 0;
  background: transparent;
  color: #08090d;
  box-shadow: none;
  font: 800 12px Geist, "Helvetica Neue", Arial, sans-serif;
  line-height: 1.1;
  text-align: left;
  text-decoration: none;
}

.landing-footer-links button {
  cursor: pointer;
}

.landing-footer-links a:hover,
.landing-footer-links button:hover {
  color: #234eff;
  text-decoration: underline;
  transform: none;
}

.landing-footer-links a.landing-footer-pricing-link {
  width: fit-content;
  min-height: 30px;
  padding: 6px 9px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #08090d;
  color: #d5ff00;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.3);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.landing-footer-links a.landing-footer-pricing-link:hover {
  background: #67d5e8;
  color: #08090d;
  text-decoration: none;
}

.landing-footer-profile {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.landing-footer-profile article {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 12px;
  border: 3px solid #08090d;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

.landing-footer-profile strong {
  color: #08090d;
  font-size: 15px;
}

.landing-footer-profile p {
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  line-height: 1.4;
}

.landing-footer-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 10px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    repeating-linear-gradient(112deg, rgba(255, 255, 255, 0.08) 0 6px, transparent 6px 16px),
    #0b1020;
  color: #fff7ed;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

@media (max-width: 980px) {
  .landing-pricing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .landing-plan-card.recommended {
    transform: none;
  }

  .landing-pricing-notes {
    grid-template-columns: 1fr;
  }

  .landing-contact-page {
    grid-template-columns: 1fr;
  }

  .landing-detail-page.landing-contact-page:target,
  .landing-detail-grid,
  .landing-detail-rich,
  .landing-detail-main,
  .landing-contact-routing,
  .landing-contact-flow,
  .landing-contact-assurance {
    grid-template-columns: 1fr;
  }

  .landing-detail-page.landing-contact-page:target {
    align-content: start;
  }

  .landing-detail-page:target {
    align-content: start;
  }

  .landing-footer-signals,
  .landing-footer-links,
  .landing-footer-profile {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .landing-pricing-section {
    padding: 36px 14px;
    background:
      linear-gradient(135deg, rgba(213, 255, 0, 0.16), transparent 34%),
      linear-gradient(315deg, rgba(103, 213, 232, 0.14), transparent 42%),
      #fff8ea;
  }

  .landing-pricing-header {
    color: #08090d;
  }

  .landing-pricing-header h2 {
    max-width: 100%;
    color: #08090d;
    font-size: 32px;
    line-height: 1;
  }

  .landing-pricing-page:target .landing-pricing-header h2 {
    max-width: 100%;
    color: #08090d;
    font-size: 32px;
    line-height: 1;
  }

  .landing-pricing-header p {
    color: rgba(8, 9, 13, 0.76);
    font-size: 13px;
  }

  .landing-pricing-page:target .landing-pricing-header p {
    color: rgba(8, 9, 13, 0.76);
    font-size: 13px;
  }

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

  .landing-plan-card {
    min-height: 0;
    padding: 16px;
  }

  .landing-plan-card.recommended::after {
    position: static;
    justify-self: start;
    margin-top: 6px;
  }

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

  .landing-reset-fields {
    grid-template-columns: 1fr;
  }

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

  .landing-footer-signals,
  .landing-footer-links,
  .landing-footer-profile {
    grid-template-columns: 1fr;
  }

  .landing-footer-bottom {
    display: grid;
  }

}

.landing-main {
  width: min(100%, 1500px);
  margin: 0 auto;
  padding: clamp(18px, 4vw, 58px);
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    #f4dfc4;
  background-size: 42px 42px;
}

.landing-section {
  position: relative;
  margin-bottom: clamp(18px, 3vw, 36px);
  padding: clamp(18px, 4vw, 48px);
  border: 3px solid #08090d;
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(244, 223, 196, 0.76)),
    #f7dfc5;
  box-shadow: 8px 8px 0 #08090d;
  color: #08090d;
}

.landing-kicker,
.section-number {
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

.section-number {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 3px solid #08090d;
  background: #d5ff00;
  box-shadow: 4px 4px 0 #08090d;
}

.landing-page h2 {
  max-width: 980px;
  margin: 8px 0;
  color: #050609;
  font-size: clamp(32px, 5vw, 68px);
  line-height: 0.98;
}

.landing-page p,
.landing-page small {
  color: rgba(8, 9, 13, 0.72);
  line-height: 1.45;
}

.landing-page .landing-footer .landing-footer-intro h2 {
  color: #fff7ed;
}

.landing-page .landing-footer .landing-footer-intro p {
  color: rgba(255, 247, 237, 0.78);
}

.landing-page .landing-footer .landing-footer-intro .landing-kicker {
  color: #d5ff00;
}

.landing-band,
.landing-split,
.landing-mosaic,
.landing-feedback,
.landing-reports,
.landing-pricing,
.landing-final {
  display: grid;
  gap: 18px;
}

.landing-band {
  grid-template-columns: 52px minmax(0, 0.9fr) minmax(360px, 1.1fr);
  align-items: center;
}

.landing-split,
.landing-mosaic {
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  align-items: stretch;
}

.landing-card-grid,
.feedback-grid,
.pricing-stack,
.creative-showcase,
.module-wall-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.module-wall-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-card-grid article,
.feedback-grid article,
.pricing-stack article,
.creative-showcase article,
.module-wall-grid article {
  min-height: 145px;
  padding: 16px;
  border: 3px solid #08090d;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

.landing-card-grid article:nth-child(1),
.creative-showcase article:nth-child(1),
.module-wall-grid article:nth-child(1) {
  background: #d5ff00;
}

.landing-card-grid article:nth-child(2),
.creative-showcase article:nth-child(2),
.module-wall-grid article:nth-child(2) {
  background: #22d3ee;
}

.landing-card-grid article:nth-child(3),
.creative-showcase article:nth-child(3),
.module-wall-grid article:nth-child(3) {
  background: #ff3134;
}

.module-wall-grid article:nth-child(4) {
  background: #a78bfa;
}

.landing-card-grid strong,
.feedback-grid strong,
.pricing-stack strong,
.creative-showcase strong,
.module-wall-grid strong {
  display: block;
  margin-bottom: 8px;
  color: #050609;
  font-size: 26px;
  line-height: 1.02;
}

.agent-loop,
.automation-console {
  display: grid;
  gap: 10px;
}

.agent-loop span,
.automation-console span,
.channel-cloud span,
.report-strip span {
  display: grid;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border: 3px solid #08090d;
  background: #f7dfc5;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
  font-weight: 850;
  text-transform: uppercase;
}

.channel-cloud,
.report-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.landing-creative {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.28), transparent 42%),
    #f7dfc5;
}

.landing-final {
  min-height: 360px;
  place-items: center;
  text-align: center;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.28), transparent 38%),
    linear-gradient(315deg, rgba(139, 92, 246, 0.30), transparent 44%),
    #f7dfc5;
}

@media (max-width: 720px) {
  .image-login-panel {
    left: 14px;
    right: 14px;
    width: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    transform: none;
  }

  .image-login-panel img {
    width: min(170px, 100%);
    height: 62px;
  }

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

  .landing-main {
    padding: 14px;
  }

  .landing-band,
  .landing-split,
  .landing-mosaic,
  .landing-card-grid,
  .feedback-grid,
  .pricing-stack,
  .creative-showcase,
  .module-wall-grid {
    grid-template-columns: 1fr;
  }
}


button {
  font: inherit;
}

input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--smoke);
  border-radius: 6px;
  background: var(--obsidian);
  color: var(--white);
  font: inherit;
  font-size: 13px;
}

input,
select {
  min-height: 34px;
  padding: 0 10px;
}

textarea {
  resize: vertical;
  padding: 10px;
}

label,
legend {
  color: var(--mist);
  font-size: 12px;
}

.app-shell {
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  min-height: 100vh;
  background:
    linear-gradient(90deg, rgba(167, 139, 250, 0.055), transparent 24%),
    linear-gradient(180deg, rgba(6, 182, 212, 0.035), transparent 30%),
    var(--obsidian);
}

.sidebar {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-height: 100vh;
  padding: 16px;
  border-right: 1px solid var(--smoke);
  background: rgba(9, 9, 13, 0.94);
}

.brand {
  display: flex;
  align-items: center;
  height: 48px;
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--carbon);
  cursor: pointer;
}

.brand img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.brand:focus-visible {
  outline: 3px solid #d5ff00;
  outline-offset: 3px;
}

nav {
  display: grid;
  gap: 4px;
}

.nav-item,
.module-item,
.mode {
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--mist);
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  transition: border-color 180ms ease, color 180ms ease, background 180ms ease;
}

.nav-item {
  position: relative;
  padding: 0 10px 0 24px;
}

.nav-item::before {
  position: absolute;
  left: 9px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  content: "";
  background: rgba(167, 139, 250, 0.38);
  box-shadow: 0 0 10px rgba(139, 92, 246, 0.2);
}

.nav-item[data-scope="admin"] {
  display: none;
}

.admin-mode .nav-item[data-scope="admin"] {
  display: block;
}

.admin-mode .nav-item[data-scope="user"] {
  display: none;
}

.nav-item:hover,
.nav-item.active,
.module-item:hover,
.module-item.selected,
.mode:hover,
.mode.active {
  border-color: rgba(139, 92, 246, 0.45);
  background: rgba(139, 92, 246, 0.1);
  color: var(--white);
}

.nav-item.active::before {
  background: var(--mint);
  box-shadow: 0 0 12px rgba(16, 240, 161, 0.75);
}

.workspace-card {
  display: grid;
  gap: 4px;
  margin-top: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(19, 19, 26, 0.72);
  color: var(--mist);
  font-size: 12px;
}

.workspace-card strong {
  color: var(--white);
}

.sidebar-bottom-actions {
  display: grid;
  gap: 8px;
  margin-top: auto;
}

.admin-access-button {
  min-height: 30px;
  margin-top: 8px;
  border: 1px solid rgba(6, 182, 212, 0.28);
  border-radius: 8px;
  background: rgba(6, 182, 212, 0.08);
  color: var(--white);
  font-size: 12px;
  cursor: pointer;
}

.admin-access-button.secondary-toggle {
  background: rgba(139, 92, 246, 0.12);
  border-color: rgba(139, 92, 246, 0.34);
}

.admin-access-button.logout-toggle {
  background: rgba(239, 68, 68, 0.1);
  border-color: rgba(239, 68, 68, 0.32);
}

main {
  width: min(100%, 1320px);
  padding: 20px;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 12px;
}

.topbar-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.topbar-title {
  display: flex;
  align-items: center;
  gap: 12px;
}

.signature-mark {
  position: relative;
  width: 42px;
  height: 28px;
  flex: 0 0 auto;
}

.signature-mark::before,
.signature-mark::after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  border: 5px solid var(--plasma);
  border-radius: 50%;
  box-shadow: 0 0 18px rgba(139, 92, 246, 0.28);
}

.signature-mark::before {
  left: 0;
  top: 2px;
}

.signature-mark::after {
  right: 0;
  top: 0;
  border-color: var(--cyan);
  box-shadow: 0 0 18px rgba(6, 182, 212, 0.22);
}

.topbar h1,
.panel h2 {
  margin: 0;
  letter-spacing: 0;
}

.topbar h1 {
  max-width: 820px;
  font-size: 28px;
  line-height: 1.05;
  font-weight: 700;
}

.eyebrow,
.metric-label {
  color: var(--plasma-glow);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.primary-action {
  min-width: 124px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid rgba(16, 240, 161, 0.28);
  border-radius: 7px;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.96), rgba(34, 211, 238, 0.86) 48%, rgba(167, 139, 250, 0.76));
  color: #04110e;
  font-size: 13px;
  font-weight: 750;
  box-shadow: 0 10px 28px rgba(16, 240, 161, 0.18);
  cursor: pointer;
}

.primary-action.compact {
  min-width: 112px;
  min-height: 34px;
}

.secondary-action,
.icon-button {
  min-height: 34px;
  border: 1px solid rgba(167, 139, 250, 0.22);
  border-radius: 7px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.105), rgba(34, 211, 238, 0.04)),
    rgba(255, 255, 255, 0.032);
  color: var(--white);
  font-size: 13px;
  cursor: pointer;
}

.secondary-action {
  padding: 0 12px;
}

.icon-button {
  width: 34px;
}

.operator-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(19, 19, 26, 0.58);
  color: var(--mist);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.operator-strip span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.operator-strip i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mint);
  box-shadow: 0 0 12px rgba(16, 240, 161, 0.7);
}

body.app-mode.admin-mode .topbar,
body.app-mode.admin-mode .operator-strip {
  display: none !important;
}

body.app-mode:not(.admin-mode):not([data-active-view="dashboard"]) .topbar,
body.app-mode:not(.admin-mode):not([data-active-view="dashboard"]) .operator-strip {
  display: none !important;
}

.status-grid {
  display: none;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

body[data-active-view="dashboard"] .status-grid {
  display: grid;
}

.metric-card,
.panel {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.026), transparent 44%),
    linear-gradient(135deg, rgba(19, 19, 26, 0.96), rgba(10, 10, 15, 0.98));
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.36);
}

.metric-card::before,
.panel::before {
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, rgba(167, 139, 250, 0.55), rgba(6, 182, 212, 0.35), transparent 72%);
}

.metric-card {
  display: grid;
  gap: 5px;
  min-height: 88px;
  padding: 13px 14px;
}

.metric-card strong {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 21px;
  font-weight: 700;
}

.metric-card small,
.pipeline-step small,
.queue-list,
.detail-panel p,
.workspace-card span {
  color: var(--mist);
}

.metric-card small,
.pipeline-step small,
.queue-meta small,
.event-list small,
.connection-card p,
.connection-card small,
.insight-card p,
.roadmap-card p,
.provider-output,
.export-box {
  font-size: 11px;
  line-height: 1.42;
}

.live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mint);
  box-shadow: 0 0 16px rgba(16, 240, 161, 0.75);
  animation: ploxyPulse 2500ms infinite;
}

@keyframes ploxyPulse {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.45;
    transform: scale(0.92);
  }
}

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
  gap: 10px;
}

.view-section {
  display: none;
}

.view-section.active {
  display: block;
}

.content-grid.view-section.active {
  display: grid;
}

.panel {
  min-height: 236px;
  padding: 16px;
}

.panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.panel h2 {
  margin-top: 5px;
  font-size: 17px;
  font-weight: 650;
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border: 1px solid rgba(139, 92, 246, 0.35);
  border-radius: 999px;
  background: rgba(139, 92, 246, 0.12);
  color: var(--plasma-glow);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.badge.live {
  border-color: rgba(16, 240, 161, 0.35);
  background: rgba(16, 240, 161, 0.1);
  color: var(--mint);
}

.campaign-panel {
  grid-column: span 2;
}

.product-loop-panel {
  grid-column: span 2;
  min-height: 172px;
}

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

.product-loop div {
  display: grid;
  gap: 6px;
  min-height: 86px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    radial-gradient(circle at 100% 0, rgba(6, 182, 212, 0.12), transparent 34%),
    rgba(10, 10, 15, 0.62);
}

.product-loop span {
  color: var(--mint);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
}

.product-loop strong {
  font-size: 13px;
}

.product-loop small {
  color: var(--mist);
  font-size: 10.5px;
  line-height: 1.38;
}

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

.pipeline-step {
  display: grid;
  gap: 6px;
  min-height: 96px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(26, 26, 34, 0.76);
}

.pipeline-step span {
  color: var(--plasma-glow);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
}

.pipeline-step strong {
  font-size: 14px;
}

.pipeline-step.done {
  border-color: rgba(16, 240, 161, 0.28);
}

.pipeline-step.active {
  border-color: rgba(6, 182, 212, 0.48);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.campaign-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.campaign-summary div,
.estimate-card {
  display: grid;
  gap: 5px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(10, 10, 15, 0.58);
}

.campaign-summary strong {
  font-size: 13px;
}

.mode-control {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-bottom: 10px;
}

.mode {
  text-align: center;
}

.queue-list {
  display: grid;
  gap: 6px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.queue-list li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(39, 39, 42, 0.7);
}

.queue-list strong,
.queue-list button {
  color: var(--white);
  font-size: 11px;
  white-space: nowrap;
}

.queue-meta {
  display: grid;
  gap: 2px;
  font-size: 12px;
}

.queue-meta small {
  color: var(--mist);
  font-size: 10.5px;
}

.queue-receipt {
  opacity: 0.72;
}

.queue-execution-lane {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 4px;
  min-width: 0;
}

.queue-execution-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 20px;
  padding: 3px 7px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  color: var(--mist);
  background: rgba(255, 255, 255, 0.06);
  font-size: 9px;
  font-weight: 760;
  line-height: 1.15;
  overflow-wrap: anywhere;
  white-space: normal;
}

.queue-execution-chip.next {
  color: #08090d;
  background: var(--acid);
  border-color: rgba(8, 9, 13, 0.34);
}

.queue-execution-chip.outcome {
  color: #08090d;
  background: var(--sky);
  border-color: rgba(8, 9, 13, 0.26);
}

.queue-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}

.queue-actions button {
  min-height: 26px;
  border: 1px solid var(--smoke);
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
}

.queue-actions .approve {
  border-color: rgba(16, 240, 161, 0.36);
  color: var(--mint);
}

.queue-actions .reject {
  border-color: rgba(239, 68, 68, 0.36);
  color: var(--danger);
}

.queue-actions .retry {
  border-color: rgba(249, 115, 22, 0.45);
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.18), rgba(251, 191, 36, 0.12));
  color: var(--ink);
}

.empty-state {
  padding: 12px;
  border: 1px dashed rgba(161, 161, 170, 0.35);
  border-radius: 8px;
  color: var(--mist);
  font-size: 12px;
}

.filter-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 220px));
  gap: 8px;
  margin-bottom: 10px;
}

.filter-row label {
  display: grid;
  gap: 8px;
}

.table-action {
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(34, 211, 238, 0.18);
  border-radius: 7px;
  background: rgba(34, 211, 238, 0.055);
  color: var(--white);
  cursor: pointer;
}

.connection-card button,
.plan-card button,
.admin-tool-grid button,
.admin-user-row button,
.media-schedule,
.queue-actions button,
.table-action {
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.connection-card button:hover,
.plan-card button:hover,
.admin-tool-grid button:hover,
.admin-user-row button:hover,
.media-schedule:hover,
.queue-actions button:hover,
.table-action:hover,
.primary-action:hover,
.secondary-action:hover,
.icon-button:hover {
  transform: translateY(-1px);
  border-color: rgba(16, 240, 161, 0.38);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
}

.event-list {
  display: grid;
  gap: 6px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.event-list li {
  display: grid;
  gap: 3px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(39, 39, 42, 0.7);
}

.event-list strong {
  color: var(--white);
  font-size: 11.5px;
}

.event-list small {
  color: var(--mist);
}

.operations-panel {
  grid-column: span 2;
}

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

.connection-grid,
.analytics-grid,
.billing-grid,
.subscription-summary,
.plan-usage-grid,
.automation-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.subscription-summary,
.plan-usage-grid,
.automation-summary {
  margin-bottom: 12px;
}

.plan-usage-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

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

.subscription-summary div,
.plan-usage-grid article,
.automation-summary div {
  display: grid;
  gap: 4px;
  min-height: 86px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(10, 10, 15, 0.56);
}

.subscription-summary strong,
.plan-usage-grid strong,
.automation-summary strong {
  font-size: 19px;
}

.subscription-summary small,
.plan-usage-grid small,
.automation-summary small {
  color: var(--mist);
  font-size: 11px;
  line-height: 1.42;
}

.plan-usage-meter {
  width: 100%;
  height: 8px;
  border: 1px solid #08090d;
  background: rgba(8, 9, 13, 0.12);
  overflow: hidden;
}

.plan-usage-meter span {
  display: block;
  height: 100%;
  width: var(--usage-width, 0%);
  background: #08090d;
}

body.app-mode .plan-usage-grid article:nth-child(1) {
  background: linear-gradient(135deg, #dfff3d, #78e8db) !important;
}

body.app-mode .plan-usage-grid article:nth-child(2) {
  background: linear-gradient(135deg, #74d4ea, #49c7f3) !important;
}

body.app-mode .plan-usage-grid article:nth-child(3) {
  background: linear-gradient(135deg, #f9a43d, #f7d760) !important;
}

body.app-mode .plan-usage-grid article:nth-child(4) {
  background: linear-gradient(135deg, #e36bc5, #9d83f1) !important;
}

@media (max-width: 980px) {
  .plan-usage-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.connection-card,
.insight-card,
.plan-card,
.media-card,
.automation-row {
  display: grid;
  gap: 8px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--tertiary);
}

.connection-card header,
.insight-card header,
.plan-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.connection-card h3,
.insight-card h3,
.plan-card h3,
.media-card h3 {
  margin: 0;
  font-size: 13.5px;
  letter-spacing: 0;
}

.connection-card p,
.insight-card p,
.plan-card p,
.media-card p {
  margin: 0;
  color: var(--mist);
}

.connection-card button {
  min-height: 32px;
  border: 1px solid rgba(139, 92, 246, 0.42);
  border-radius: 8px;
  background: transparent;
  color: var(--white);
  cursor: pointer;
}

.telegram-connect-form,
.connection-setup-form {
  display: grid;
  gap: 8px;
  margin: 12px 0;
}

.connection-oauth-row {
  display: grid;
  gap: 6px;
  margin: 12px 0 4px;
}

.connection-oauth-row button {
  background: linear-gradient(100deg, #4765ff, #70e6ff 52%, #daff3f);
}

.connection-oauth-row.google button {
  background: linear-gradient(100deg, #f8d74a, #6de6f7 48%, #67e99e);
}

.connection-oauth-row small {
  color: #2a2a2a;
  font-size: 11px;
}

.linkedin-target-picker {
  display: grid;
  gap: 8px;
  margin: 8px 0 12px;
  padding: 9px;
  border: 2px solid #08090d;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.38), rgba(167, 139, 250, 0.2)),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

.linkedin-target-picker > div,
.linkedin-target-picker label {
  display: grid;
  gap: 5px;
}

.linkedin-target-picker button {
  min-height: 32px;
  background: #67d5e8;
  color: #08090d;
}

.linkedin-target-picker button[data-linkedin-target-save] {
  background: #d5ff00;
}

.linkedin-target-picker span,
.linkedin-target-picker small {
  color: #08090d;
}

.linkedin-target-picker span {
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.linkedin-target-picker small {
  font-size: 10.5px;
  line-height: 1.3;
}

.linkedin-target-picker select {
  min-height: 34px;
  padding: 8px 10px;
  border: 2px solid #08090d;
  background: #fffaf0;
  color: #08090d;
  font: inherit;
  box-shadow: 3px 3px 0 #08090d;
}

.connection-setup-form label {
  display: grid;
  gap: 4px;
}

.connection-setup-form span {
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.telegram-connect-form input,
.connection-setup-form input,
.connection-setup-form select {
  min-height: 34px;
  padding: 8px 10px;
  border: 2px solid #08090d;
  background: #fffaf0;
  color: #08090d;
  font: inherit;
  box-shadow: 3px 3px 0 #08090d;
}

.telegram-connect-form div,
.connection-setup-form div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.insight-stack {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.ledger-large {
  margin-top: 18px;
}

.plan-grid,
.media-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.compact-plans {
  margin-top: 12px;
}

.plan-card {
  min-height: 176px;
}

.plan-card.selected {
  border-color: rgba(16, 240, 161, 0.42);
  background:
    linear-gradient(180deg, rgba(16, 240, 161, 0.07), transparent 56%),
    var(--tertiary);
}

.plan-card header strong {
  color: var(--white);
  font-size: 21px;
}

.plan-card header small {
  color: var(--mist);
  font-size: 10px;
}

.plan-card header span,
.plan-card p,
.media-card p,
.media-card footer small {
  font-size: 11px;
  line-height: 1.42;
}

.plan-card button {
  align-self: end;
  min-height: 32px;
  border: 1px solid rgba(16, 240, 161, 0.34);
  border-radius: 7px;
  background: transparent;
  color: var(--white);
  cursor: pointer;
}

.plan-card.selected button {
  color: var(--mint);
}

.creative-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.38fr) minmax(0, 0.62fr);
  gap: 12px;
}

.generation-stack,
.project-memory,
.provider-form,
.creative-form {
  display: grid;
  gap: 10px;
}

.project-memory,
.provider-form,
.creative-form {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(10, 10, 15, 0.48);
}

.section-title {
  display: grid;
  gap: 3px;
}

.section-title h3 {
  margin: 0;
  font-size: 14px;
}

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

.creative-form {
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  align-items: end;
}

.creative-form-title,
.creative-prompt {
  grid-column: 1 / -1;
}

.project-memory label,
.provider-form label,
.creative-form label {
  display: grid;
  gap: 8px;
}

.provider-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.provider-status span,
.project-memory small {
  color: var(--mist);
  font-size: 11px;
}

.size-preview {
  display: grid;
  place-items: center start;
  min-height: 54px;
  padding: 9px;
  border: 1px solid rgba(6, 182, 212, 0.28);
  border-radius: 7px;
  background: rgba(6, 182, 212, 0.08);
}

.size-preview span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 12px;
}

.size-preview small {
  color: var(--mist);
  font-size: 10px;
}

.media-grid {
  margin-top: 12px;
}

.media-card {
  min-height: 226px;
}

.media-preview {
  display: grid;
  place-items: end start;
  aspect-ratio: 16 / 10;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.32), transparent 45%),
    linear-gradient(315deg, rgba(6, 182, 212, 0.26), transparent 48%),
    var(--obsidian);
}

.media-preview strong {
  color: var(--mist);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 500;
}

.media-card.video .media-preview {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.22), transparent 42%),
    linear-gradient(315deg, rgba(139, 92, 246, 0.28), transparent 50%),
    var(--obsidian);
}

.media-card.text .media-preview {
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.18), transparent 40%),
    var(--obsidian);
}

.media-preview span {
  color: var(--white);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.media-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
}

.media-schedule {
  min-height: 32px;
  border: 1px solid rgba(16, 240, 161, 0.34);
  border-radius: 7px;
  background: rgba(16, 240, 161, 0.08);
  color: var(--white);
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}

.media-schedule:hover {
  border-color: rgba(16, 240, 161, 0.62);
  color: var(--mint);
}

.media-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.media-meta span {
  min-height: 22px;
  padding: 4px 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--mist);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
}

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

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

.automation-row time {
  color: var(--plasma-glow);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.automation-row div {
  display: grid;
  gap: 3px;
}

.automation-row strong {
  font-size: 12.5px;
}

.automation-row small {
  color: var(--mist);
  font-size: 10.5px;
}

.header-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.onboarding-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.42fr);
  gap: 12px;
}

.onboarding-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.onboarding-summary article {
  display: grid;
  gap: 4px;
  min-height: 82px;
  padding: 11px 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.88);
  box-shadow: 4px 4px 0 #08090d;
}

.onboarding-summary article.tone-1 {
  background: linear-gradient(135deg, rgba(223, 255, 63, 0.5), rgba(255, 250, 240, 0.84));
}

.onboarding-summary article.tone-2 {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.45), rgba(255, 250, 240, 0.86));
}

.onboarding-summary article.tone-3 {
  background: linear-gradient(135deg, rgba(181, 156, 246, 0.42), rgba(255, 250, 240, 0.86));
}

.onboarding-summary strong {
  overflow: hidden;
  color: #08090d;
  font-size: 15px;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.onboarding-summary small {
  overflow: hidden;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.onboarding-form {
  max-width: none;
}

.channel-choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.channel-choice-grid legend {
  grid-column: 1 / -1;
  padding: 0 4px;
}

.channel-choice-grid label {
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.channel-choice-grid input {
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  min-height: 0;
  padding: 0;
}

.onboarding-checklist {
  display: grid;
  align-content: start;
  gap: 10px;
}

.onboarding-output {
  margin: 0;
}

.checklist-item {
  display: grid;
  position: relative;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  min-height: 76px;
  padding: 9px 9px 9px 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 180, 84, 0.16), rgba(255, 250, 240, 0.88)),
    #fffaf0;
  box-shadow: 4px 4px 0 #08090d;
}

.checklist-item > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 25px;
  border: 2px solid #08090d;
  background: #ffb454;
  box-shadow: 2px 2px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
}

.checklist-item div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding-right: 86px;
}

.checklist-item b {
  width: max-content;
  max-width: 100%;
  padding: 2px 5px;
  border: 2px solid #08090d;
  background: #ffb454;
  box-shadow: 2px 2px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 7px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.checklist-item strong {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #08090d;
  font-size: 12px;
  line-height: 1.08;
}

.checklist-item small {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: rgba(8, 9, 13, 0.72);
  font-size: 9px;
  line-height: 1.2;
}

.checklist-item button {
  position: absolute;
  right: 8px;
  bottom: 8px;
  min-width: 78px;
  min-height: 26px;
  padding: 4px 6px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
  color: #08090d;
  cursor: pointer;
  font-size: 7.5px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.checklist-item.done {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.14), rgba(255, 250, 240, 0.9)),
    #fffaf0;
}

.checklist-item.done > span,
.checklist-item.done b {
  background: #dfff3f;
}

.checklist-item.done button {
  background: #67d5e8;
}

.automation-settings {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) repeat(4, minmax(110px, 0.8fr)) auto;
  align-items: end;
  gap: 10px;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.automation-settings label {
  display: grid;
  gap: 8px;
}

.schedule-source-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.schedule-source-toggle label,
.schedule-upload-list article {
  border: 2px solid var(--ink);
  border-radius: 8px;
  padding: 0.55rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 3px 3px 0 var(--ink);
}

.schedule-upload-panel {
  display: grid;
  gap: 0.65rem;
  padding: 0.75rem;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: rgba(126, 215, 228, 0.18);
}

.schedule-upload-panel[hidden] {
  display: none;
}

.schedule-upload-panel textarea {
  width: 100%;
  resize: vertical;
}

.schedule-presenter-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(181, 156, 246, 0.28), transparent 56%),
    linear-gradient(315deg, rgba(213, 255, 0, 0.18), transparent 62%),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

.campaign-presenter-panel {
  margin-top: 6px;
  padding: 8px;
  box-shadow: 3px 3px 0 #08090d;
}

.campaign-presenter-panel label {
  min-width: 0;
}

.campaign-presenter-panel select {
  width: 100%;
}

.schedule-presenter-panel[hidden] {
  display: none;
}

.schedule-presenter-head,
.schedule-presenter-consent {
  grid-column: 1 / -1;
}

.schedule-presenter-head {
  display: grid;
  gap: 3px;
}

.schedule-presenter-head strong {
  color: #08090d;
  font-size: 0.86rem;
  line-height: 1;
}

.schedule-presenter-head small,
.schedule-presenter-consent span {
  color: rgba(8, 9, 13, 0.72);
  font-size: 0.7rem;
  font-weight: 780;
  line-height: 1.25;
}

.schedule-presenter-consent {
  display: flex !important;
  align-items: flex-start;
  gap: 7px !important;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #e8fff4;
  box-shadow: 2px 2px 0 #08090d;
}

.schedule-presenter-consent input {
  width: 15px;
  height: 15px;
  min-height: 0;
  flex: 0 0 15px;
  margin-top: 1px;
  padding: 0;
  border-width: 2px;
  box-shadow: none;
}

.dialog-status-line {
  min-height: 18px;
  margin: -4px 0 2px;
  color: #08090d;
  font-size: 0.76rem;
  font-weight: 850;
  line-height: 1.25;
}

.schedule-upload-list {
  display: grid;
  gap: 0.45rem;
  max-height: 150px;
  overflow: auto;
}

.schedule-upload-list article {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  box-shadow: 2px 2px 0 var(--ink);
}

.schedule-upload-list article span {
  padding: 0.25rem 0.45rem;
  border: 2px solid var(--ink);
  border-radius: 999px;
  background: var(--accent-lime);
  font-size: 0.72rem;
  font-weight: 900;
}

.automation-agent-console,
.campaign-agent-console,
.queue-agent-console,
.connection-agent-console,
.analytics-agent-console {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 0.95fr);
  gap: 16px;
  margin: 18px 0;
}

.automation-agent-response,
.automation-agent-form,
.campaign-agent-response,
.campaign-agent-form,
.queue-agent-response,
.queue-agent-form,
.connection-agent-response,
.connection-agent-form,
.analytics-agent-response,
.analytics-agent-form {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.034);
}

.automation-agent-response,
.campaign-agent-response,
.queue-agent-response,
.connection-agent-response,
.analytics-agent-response {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.campaign-agent-side,
.queue-agent-side,
.connection-agent-side,
.analytics-agent-side {
  display: grid;
  gap: 10px;
}

.automation-agent-response strong,
.campaign-agent-response strong,
.queue-agent-response strong,
.connection-agent-response strong,
.analytics-agent-response strong {
  display: block;
  color: var(--white);
  font-size: 17px;
  line-height: 1.18;
}

.automation-agent-response small,
.campaign-agent-response small,
.queue-agent-response small,
.connection-agent-response small,
.analytics-agent-response small {
  display: block;
  margin-top: 5px;
  color: var(--mist);
  font-size: 11px;
  line-height: 1.42;
}

.automation-agent-recommendations,
.campaign-agent-recommendations,
.queue-agent-recommendations,
.connection-agent-recommendations,
.analytics-agent-recommendations {
  display: grid;
  gap: 8px;
}

.automation-agent-recommendations article,
.campaign-agent-recommendations article,
.queue-agent-recommendations article,
.connection-agent-recommendations article,
.analytics-agent-recommendations article {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.automation-agent-recommendations article strong,
.campaign-agent-recommendations article strong,
.queue-agent-recommendations article strong,
.connection-agent-recommendations article strong,
.analytics-agent-recommendations article strong {
  font-size: 12px;
  line-height: 1.35;
}

.campaign-agent-status-grid,
.queue-agent-status-grid,
.connection-agent-status-grid,
.analytics-agent-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.campaign-agent-status-grid article,
.queue-agent-status-grid article,
.connection-agent-status-grid article,
.analytics-agent-status-grid article {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.campaign-agent-status-grid span,
.campaign-agent-recommendations span,
.queue-agent-status-grid span,
.queue-agent-recommendations span,
.connection-agent-status-grid span,
.connection-agent-recommendations span,
.analytics-agent-status-grid span,
.analytics-agent-recommendations span {
  color: var(--cyan);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

.campaign-agent-status-grid strong,
.queue-agent-status-grid strong,
.connection-agent-status-grid strong,
.analytics-agent-status-grid strong {
  color: var(--white);
  font-size: 16px;
}

.campaign-agent-status-grid small,
.queue-agent-status-grid small,
.connection-agent-status-grid small,
.analytics-agent-status-grid small {
  color: var(--mist);
  font-size: 10px;
  line-height: 1.35;
}

.analytics-source-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.analytics-paid-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.analytics-source-card {
  display: grid;
  gap: 5px;
  min-height: 92px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.analytics-paid-card {
  display: grid;
  gap: 5px;
  min-height: 88px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.14), transparent 58%),
    rgba(255, 255, 255, 0.035);
}

.analytics-source-card span {
  width: fit-content;
  color: var(--cyan);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.analytics-paid-card span {
  width: fit-content;
  color: var(--lime);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.analytics-source-card strong,
.analytics-paid-card strong {
  color: var(--white);
  font-size: 13px;
  line-height: 1.18;
}

.analytics-source-card small,
.analytics-source-card em,
.analytics-paid-card small,
.analytics-paid-card em {
  color: var(--mist);
  font-size: 10px;
  font-style: normal;
  line-height: 1.35;
}

.ads-agent-console {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 0.95fr);
  gap: 16px;
  margin: 18px 0;
}

.ads-agent-response,
.ads-agent-form,
.ads-agent-status-grid article,
.ads-agent-recommendations article,
.ads-account-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.ads-agent-response {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.ads-agent-response strong {
  display: block;
  color: var(--white);
  font-size: 17px;
  line-height: 1.18;
}

.ads-agent-response small {
  display: block;
  margin-top: 5px;
  color: var(--mist);
  font-size: 11px;
  line-height: 1.42;
}

.ads-agent-side {
  display: grid;
  gap: 10px;
}

.ads-agent-recommendations,
.ads-agent-status-grid,
.ads-account-grid {
  display: grid;
  gap: 8px;
}

.ads-agent-recommendations article,
.ads-agent-status-grid article,
.ads-account-card {
  display: grid;
  gap: 4px;
  padding: 10px;
}

.ads-agent-status-grid,
.ads-account-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ads-account-grid {
  grid-column: 1 / -1;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.ads-agent-status-grid span,
.ads-agent-recommendations span,
.ads-account-card span {
  color: var(--cyan);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.ads-agent-status-grid strong,
.ads-agent-recommendations strong,
.ads-account-card strong {
  color: var(--white);
  font-size: 13px;
  line-height: 1.22;
}

.ads-agent-status-grid small,
.ads-account-card small,
.ads-account-card em {
  color: var(--mist);
  font-size: 10px;
  font-style: normal;
  line-height: 1.35;
}

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

.ads-agent-form textarea {
  grid-column: 1 / -1;
  min-height: 76px;
  resize: vertical;
}

.ads-agent-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.ads-agent-shortcuts button {
  min-height: 30px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--white);
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.automation-agent-form,
.campaign-agent-form,
.queue-agent-form,
.connection-agent-form,
.analytics-agent-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
}

.automation-agent-form textarea,
.campaign-agent-form textarea,
.queue-agent-form textarea,
.connection-agent-form textarea,
.analytics-agent-form textarea {
  grid-column: 1 / -1;
  min-height: 76px;
  resize: vertical;
}

.automation-agent-shortcuts,
.campaign-agent-shortcuts,
.queue-agent-shortcuts,
.connection-agent-shortcuts,
.analytics-agent-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.automation-agent-shortcuts button,
.campaign-agent-shortcuts button,
.queue-agent-shortcuts button,
.connection-agent-shortcuts button,
.analytics-agent-shortcuts button {
  min-height: 30px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--white);
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.agent-submit-button {
  align-self: stretch;
  min-width: 132px;
  min-height: 40px;
  border-radius: 8px;
  font-size: 12px;
  letter-spacing: 0;
}

.toggle-line {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  color: var(--white);
}

.toggle-line input {
  width: auto;
  min-height: auto;
}

.routing-form,
.topup-form {
  display: grid;
  align-items: end;
  gap: 10px;
}

.routing-form {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.routing-wide {
  grid-column: span 3;
}

.routing-form label,
.topup-form label {
  display: grid;
  gap: 8px;
}

.routing-summary,
.job-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.jobs-operation-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}

.jobs-operation-board article {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 78px;
  padding: 11px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #f7dfc5;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
}

.jobs-operation-board article.ready {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #d5ff00;
}

.jobs-operation-board article.blocked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ffb4a9;
}

.jobs-operation-board strong {
  overflow: hidden;
  font-size: 15px;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jobs-operation-board small {
  color: rgba(8, 9, 13, 0.76);
  font-size: 10px;
  line-height: 1.28;
}

.ai-routing-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}

.ai-routing-board article {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 82px;
  padding: 11px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #f7dfc5;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
}

.ai-routing-board article.ready {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #d5ff00;
}

.ai-routing-board article.blocked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ffb4a9;
}

.ai-routing-board strong {
  overflow: hidden;
  font-size: 15px;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ai-routing-board small {
  color: rgba(8, 9, 13, 0.76);
  font-size: 10px;
  line-height: 1.3;
}

.topup-form {
  grid-template-columns: minmax(220px, 320px) auto;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.billing-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}

.small-action {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
}

.billing-status-line {
  margin: 0 0 12px;
  color: var(--muted);
  font-size: 12px;
}

.invoice-list,
.job-list,
.audit-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.invoice-row,
.job-row,
.audit-row {
  display: grid;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.invoice-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.job-row {
  grid-template-columns: 88px minmax(0, 1fr) auto;
}

.audit-row {
  grid-template-columns: 148px minmax(0, 1fr);
}

.invoice-row div,
.job-row div,
.audit-row div {
  display: grid;
  gap: 3px;
}

.invoice-row strong,
.job-row strong,
.audit-row strong {
  font-size: 12.5px;
}

.invoice-row small,
.job-row small,
.audit-row small,
.audit-row time,
.job-row > span:first-child {
  color: var(--mist);
  font-size: 10.5px;
}

.audit-row time,
.job-row > span:first-child {
  font-family: "Geist Mono", Menlo, monospace;
  text-transform: uppercase;
}

.admin-mode .sidebar {
  background:
    linear-gradient(180deg, rgba(6, 182, 212, 0.06), transparent 34%),
    rgba(8, 9, 13, 0.91);
}

.admin-panel {
  min-height: 560px;
}

.admin-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.admin-control-plane {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.admin-control-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.admin-control-grid label {
  display: grid;
  gap: 6px;
  color: rgba(248, 250, 252, 0.64);
  font-size: 10.5px;
}

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

.admin-feature-flags label {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  font-size: 10.5px;
}

.admin-feature-flags input {
  width: 14px;
  height: 14px;
  min-height: 0;
  padding: 0;
}

.admin-control-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  padding: 0;
}

.admin-control-actions span {
  color: var(--mist);
  font-size: 10.5px;
}

.admin-command-grid,
.admin-deep-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.55fr);
  align-items: start;
  gap: 12px;
  margin-bottom: 12px;
}

.admin-deep-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(300px, 0.9fr);
  margin-top: 12px;
  margin-bottom: 0;
}

.admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
  align-items: start;
  gap: 24px;
}

.admin-section,
.admin-user-row,
.admin-command-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.admin-user-list,
.admin-tool-grid,
.admin-stat-stack,
.admin-health-grid,
.admin-module-list,
.admin-alert-list,
.admin-cost-list,
.admin-worker-list,
.admin-audit-summary,
.admin-provider-readiness-summary,
.admin-provider-readiness-list,
.admin-platform-audit-list,
.admin-ploxy-workspace-list,
.admin-ploxy-event-list,
.admin-ploxy-receipt-list {
  display: grid;
  gap: 8px;
}

.admin-provider-readiness-panel {
  margin: 12px 0;
}

.admin-provider-readiness-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.admin-provider-readiness-list {
  gap: 10px;
}

.admin-filter-bar {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 150px 150px auto;
  align-items: end;
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.09), transparent 58%),
    rgba(255, 255, 255, 0.026);
}

.admin-filter-bar.worker-filter-bar {
  grid-template-columns: minmax(180px, 1fr) 150px auto;
}

.admin-filter-bar.admin-ploxy-filter-bar {
  grid-template-columns: minmax(220px, 1fr) 150px auto;
}

.admin-bulk-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.10), rgba(103, 213, 232, 0.08)),
    rgba(255, 255, 255, 0.028);
}

.admin-bulk-bar span,
.admin-select-all {
  color: rgba(248, 250, 252, 0.62);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9.5px;
  text-transform: uppercase;
}

.admin-select-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.admin-bulk-bar button {
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.055);
  color: var(--white);
  cursor: pointer;
  font-size: 10px;
}

.admin-bulk-bar button:first-of-type {
  margin-left: auto;
}

.audit-export-bar span {
  max-width: 520px;
  line-height: 1.35;
}

.admin-filter-bar label {
  display: grid;
  gap: 4px;
  color: rgba(248, 250, 252, 0.58);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-filter-bar input,
.admin-filter-bar select {
  min-height: 32px;
  padding: 0 9px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 8px;
  background: rgba(8, 9, 13, 0.46);
  color: var(--white);
  font-size: 11.5px;
  outline: none;
}

.admin-filter-bar input:focus,
.admin-filter-bar select:focus {
  border-color: rgba(103, 213, 232, 0.52);
  box-shadow: 0 0 0 3px rgba(103, 213, 232, 0.09);
}

.admin-filter-bar span {
  justify-self: end;
  color: rgba(248, 250, 252, 0.54);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9.5px;
  text-transform: uppercase;
}

.admin-empty-row {
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 12px;
  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.024);
}

.admin-empty-row strong {
  font-size: 12px;
}

.admin-empty-row small {
  color: rgba(248, 250, 252, 0.54);
  font-size: 10.5px;
}

.admin-audit-panel {
  margin: 12px 0;
}

.admin-billing-panel {
  margin: 12px 0;
}

.admin-billing-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.admin-credit-adjust-form {
  display: grid;
  grid-template-columns: minmax(180px, 1.1fr) 150px 130px minmax(220px, 1fr) auto;
  align-items: end;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 180, 84, 0.10), rgba(167, 139, 250, 0.10)),
    rgba(255, 255, 255, 0.03);
}

.admin-credit-adjust-form label {
  display: grid;
  gap: 5px;
  color: rgba(248, 250, 252, 0.62);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-credit-adjust-form input,
.admin-credit-adjust-form select {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 8px;
  background: rgba(8, 9, 13, 0.46);
  color: var(--white);
}

.admin-billing-ledger {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-billing-ledger section {
  display: grid;
  gap: 8px;
}

.admin-billing-ledger h4 {
  margin: 0;
  color: rgba(248, 250, 252, 0.86);
  font-size: 12px;
}

.admin-audit-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.audit-summary-card,
.admin-platform-audit-row {
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.audit-summary-card {
  display: grid;
  gap: 5px;
  min-height: 78px;
  padding: 10px;
}

.audit-summary-card strong {
  color: var(--white);
  font-size: 20px;
}

.audit-summary-card small {
  color: rgba(248, 250, 252, 0.54);
  font-size: 10.5px;
  line-height: 1.35;
}

.audit-summary-card.tone-1 {
  background: linear-gradient(135deg, rgba(213, 255, 0, 0.24), rgba(255, 255, 255, 0.025));
}

.audit-summary-card.tone-2 {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.24), rgba(255, 255, 255, 0.025));
}

.audit-summary-card.tone-3 {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.26), rgba(255, 255, 255, 0.025));
}

.audit-summary-card.tone-4 {
  background: linear-gradient(135deg, rgba(255, 180, 84, 0.24), rgba(255, 255, 255, 0.025));
}

.admin-platform-audit-list {
  margin-top: 8px;
}

.admin-platform-audit-row {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) 68px 112px;
  align-items: center;
  gap: 10px;
  min-height: 50px;
  padding: 8px 10px;
}

.admin-platform-audit-row > span,
.admin-platform-audit-row b,
.admin-platform-audit-row time {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9.5px;
  text-transform: uppercase;
}

.admin-platform-audit-row > span {
  color: rgba(103, 213, 232, 0.84);
}

.admin-platform-audit-row div {
  display: grid;
  gap: 2px;
}

.admin-platform-audit-row strong {
  font-size: 12px;
}

.admin-platform-audit-row small,
.admin-platform-audit-row time {
  color: rgba(248, 250, 252, 0.54);
}

.admin-platform-audit-row b {
  color: rgba(16, 240, 161, 0.78);
}

.admin-ploxy-observability-panel {
  gap: 12px;
}

.admin-ploxy-toolbar button {
  margin-left: 0;
}

.admin-ploxy-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.admin-ploxy-observability-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 12px;
}

.admin-ploxy-observability-grid > section,
.admin-ploxy-receipt-panel {
  display: grid;
  gap: 8px;
}

.compact-title {
  gap: 2px;
}

.compact-title h4 {
  margin: 0;
  font-size: 13px;
}

.admin-ploxy-workspace-row,
.admin-ploxy-event-row,
.admin-ploxy-receipt-row {
  display: grid;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 9px 10px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.admin-ploxy-workspace-row {
  grid-template-columns: minmax(0, 1fr) 82px 92px 82px;
}

.admin-ploxy-event-row,
.admin-ploxy-receipt-row {
  grid-template-columns: 112px minmax(0, 1fr) 88px 112px;
}

.admin-ploxy-workspace-row div,
.admin-ploxy-event-row div,
.admin-ploxy-receipt-row div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.admin-ploxy-workspace-row strong,
.admin-ploxy-event-row strong,
.admin-ploxy-receipt-row strong {
  font-size: 12px;
  line-height: 1.15;
}

.admin-ploxy-workspace-row small,
.admin-ploxy-event-row small,
.admin-ploxy-receipt-row small {
  overflow: hidden;
  color: rgba(248, 250, 252, 0.54);
  font-size: 10.5px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-ploxy-workspace-row > span,
.admin-ploxy-workspace-row > b,
.admin-ploxy-event-row > span,
.admin-ploxy-event-row > b,
.admin-ploxy-event-row > time,
.admin-ploxy-receipt-row > span,
.admin-ploxy-receipt-row > b,
.admin-ploxy-receipt-row > time,
.admin-ploxy-chip-row span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9.5px;
  text-transform: uppercase;
}

.admin-ploxy-workspace-row > span,
.admin-ploxy-workspace-row > b,
.admin-ploxy-event-row > span,
.admin-ploxy-event-row > b,
.admin-ploxy-event-row > time,
.admin-ploxy-receipt-row > span,
.admin-ploxy-receipt-row > b,
.admin-ploxy-receipt-row > time {
  color: rgba(248, 250, 252, 0.62);
}

.admin-ploxy-workspace-row.guarded,
.admin-ploxy-event-row.severity-high,
.admin-ploxy-receipt-row.blocked,
.admin-ploxy-receipt-row.refused,
.admin-ploxy-receipt-row.guarded {
  border-color: rgba(245, 158, 11, 0.34);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.14), rgba(255, 255, 255, 0.025));
}

.admin-ploxy-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0;
}

.admin-ploxy-chip-row span {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 6px;
  border: 1px solid rgba(103, 213, 232, 0.22);
  border-radius: 999px;
  color: rgba(103, 213, 232, 0.86);
}

.admin-platform-audit-row.severity-high {
  border-color: rgba(239, 68, 68, 0.34);
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(255, 255, 255, 0.025));
}

.admin-platform-audit-row.severity-high b {
  color: rgba(248, 113, 113, 0.95);
}

.admin-platform-audit-row.severity-medium {
  border-color: rgba(245, 158, 11, 0.34);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.14), rgba(255, 255, 255, 0.025));
}

.admin-platform-audit-row.severity-medium b {
  color: rgba(255, 180, 84, 0.95);
}

.admin-user-row {
  grid-template-columns: 26px minmax(0, 1fr) minmax(170px, auto);
  align-items: center;
  min-height: 58px;
  padding: 9px;
  overflow: hidden;
}

.admin-row-select {
  display: grid;
  place-items: center;
  width: 22px;
  min-height: 22px;
  cursor: pointer;
}

.admin-row-select input {
  width: 14px;
  height: 14px;
  margin: 0;
}

.admin-user-row div:not(.admin-user-actions) {
  display: grid;
  gap: 3px;
}

.admin-user-row.suspended {
  border-color: rgba(239, 68, 68, 0.42);
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(255, 255, 255, 0.035));
}

.admin-user-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.admin-user-row strong {
  font-size: 13px;
}

.admin-user-row small {
  color: var(--mist);
  font-size: 11px;
}

.admin-user-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 4px 0 0;
}

.admin-user-meta span,
.admin-user-meta b {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  padding: 2px 6px;
  border: 1px solid rgba(8, 9, 13, 0.28);
  background: rgba(255, 255, 255, 0.22);
}

.admin-user-meta span,
.admin-user-meta b,
.admin-user-row > span,
.admin-user-row > b {
  color: #08090d;
  font-size: 10.5px;
}

.admin-user-meta b,
.admin-user-row > b {
  color: #055d68;
  font-family: "Geist Mono", Menlo, monospace;
  font-weight: 500;
  text-transform: uppercase;
}

.admin-user-row button,
.admin-tool-grid button,
.admin-worker-row button {
  min-height: 32px;
  border: 1px solid rgba(255, 255, 255, 0.105);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--white);
  cursor: pointer;
}

.admin-user-row button {
  min-height: 28px;
  padding: 0 8px;
  font-size: 10.5px;
}

.admin-user-row button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.admin-worker-row {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr) minmax(112px, auto);
  gap: 8px;
  align-items: center;
  min-height: 64px;
  padding: 9px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.10), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.admin-worker-row.paused {
  background:
    linear-gradient(135deg, rgba(255, 180, 84, 0.18), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.admin-worker-row.failed {
  border-color: rgba(239, 68, 68, 0.3);
  background:
    linear-gradient(135deg, rgba(239, 68, 68, 0.18), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.admin-worker-row div {
  display: grid;
  gap: 3px;
}

.admin-worker-row strong {
  font-size: 12.5px;
}

.admin-worker-row small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10px;
  line-height: 1.3;
}

.admin-worker-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 4px 0 0;
}

.admin-worker-meta span,
.admin-worker-meta b,
.admin-worker-row > span,
.admin-worker-row > b {
  display: inline-flex;
  min-height: 20px;
  align-items: center;
  padding: 2px 6px;
  border: 1px solid rgba(8, 9, 13, 0.26);
  background: rgba(255, 255, 255, 0.22);
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9.5px;
  text-transform: uppercase;
}

.admin-worker-meta b,
.admin-worker-row > b {
  color: #06704d;
}

.admin-worker-row.paused .admin-worker-meta b,
.admin-worker-row.paused > b {
  color: #8a4c00;
}

.admin-worker-row.failed .admin-worker-meta b,
.admin-worker-row.failed > b {
  color: #9d1f1f;
}

.admin-worker-actions {
  display: grid;
  gap: 6px;
}

.admin-user-row,
.admin-platform-audit-row,
.admin-worker-row {
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.admin-user-row:hover,
.admin-platform-audit-row:hover,
.admin-worker-row:hover {
  border-color: rgba(103, 213, 232, 0.34);
  transform: translateY(-1px);
}

.admin-detail-overlay[hidden] {
  display: none !important;
}

.admin-detail-overlay {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  justify-content: end;
  background: rgba(3, 5, 10, 0.56);
  backdrop-filter: blur(10px);
}

.admin-detail-drawer {
  position: relative;
  width: min(560px, 100vw);
  height: 100vh;
  overflow-y: auto;
  border-left: 1px solid rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.11), transparent 26%),
    linear-gradient(225deg, rgba(103, 213, 232, 0.18), transparent 32%),
    linear-gradient(0deg, rgba(167, 139, 250, 0.13), transparent 38%),
    #0a0c12;
  box-shadow: -30px 0 80px rgba(0, 0, 0, 0.42);
}

.admin-detail-close {
  position: sticky;
  top: 12px;
  z-index: 2;
  float: right;
  width: 38px;
  height: 38px;
  margin: 12px 12px 0 0;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--white);
  font-size: 22px;
  cursor: pointer;
}

.admin-detail-content {
  display: grid;
  gap: 14px;
  padding: 28px;
  clear: both;
}

.admin-detail-header {
  display: grid;
  gap: 8px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.03)),
    rgba(255, 255, 255, 0.04);
}

.admin-detail-header h2 {
  margin: 0;
  color: var(--white);
  font-size: 26px;
  letter-spacing: 0;
}

.admin-detail-header p {
  margin: 0;
  color: rgba(248, 250, 252, 0.68);
  font-size: 12px;
  line-height: 1.45;
}

.admin-detail-status {
  width: max-content;
  padding: 6px 9px;
  border: 1px solid rgba(16, 240, 161, 0.35);
  border-radius: 999px;
  background: rgba(16, 240, 161, 0.11);
  color: rgba(134, 239, 172, 0.96);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-detail-status.severity-high {
  border-color: rgba(239, 68, 68, 0.38);
  background: rgba(239, 68, 68, 0.13);
  color: rgba(248, 113, 113, 0.96);
}

.admin-detail-status.severity-medium {
  border-color: rgba(245, 158, 11, 0.38);
  background: rgba(245, 158, 11, 0.13);
  color: rgba(255, 180, 84, 0.96);
}

.admin-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-detail-actions button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.07);
  color: var(--white);
  font-size: 11px;
  cursor: pointer;
}

.admin-detail-actions button:first-child {
  background: linear-gradient(135deg, rgba(213, 255, 0, 0.78), rgba(103, 213, 232, 0.62));
  color: #050608;
  font-weight: 800;
}

.admin-detail-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

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

.admin-detail-card,
.admin-detail-block,
.admin-detail-timeline-row,
.admin-detail-empty {
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.052);
}

.admin-detail-card {
  display: grid;
  gap: 4px;
  min-height: 96px;
  padding: 12px;
}

.admin-detail-card span {
  color: rgba(103, 213, 232, 0.84);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-detail-card strong {
  color: var(--white);
  font-size: 18px;
}

.admin-detail-card small,
.admin-detail-block p,
.admin-detail-timeline-row small {
  color: rgba(248, 250, 252, 0.62);
  font-size: 10.5px;
  line-height: 1.45;
}

.admin-detail-block {
  display: grid;
  gap: 10px;
  padding: 14px;
}

.admin-detail-block h3 {
  margin: 0;
  color: var(--white);
  font-size: 13px;
}

.admin-detail-block p {
  margin: 0;
}

.admin-detail-timeline {
  display: grid;
  gap: 8px;
}

.admin-detail-timeline-row {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) 76px;
  gap: 8px;
  align-items: center;
  padding: 10px;
}

.admin-detail-timeline-row > span,
.admin-detail-timeline-row time {
  color: rgba(103, 213, 232, 0.82);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8.5px;
  text-transform: uppercase;
}

.admin-detail-timeline-row strong {
  color: var(--white);
  font-size: 11px;
}

.admin-detail-timeline-row.severity-high {
  border-color: rgba(239, 68, 68, 0.34);
}

.admin-detail-timeline-row.severity-medium {
  border-color: rgba(245, 158, 11, 0.34);
}

.admin-detail-empty {
  padding: 16px;
  color: rgba(248, 250, 252, 0.64);
  font-size: 12px;
}

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

.admin-stat-row,
.admin-health-grid article,
.admin-module-row,
.admin-alert-row,
.admin-cost-row,
.admin-provider-readiness-row {
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 9px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.07), transparent 60%),
    rgba(255, 255, 255, 0.028);
}

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

.admin-stat-row span,
.admin-cost-row span,
.admin-module-row span {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10.5px;
}

.admin-stat-row strong,
.admin-health-grid strong,
.admin-module-row strong,
.admin-alert-row strong,
.admin-cost-row strong {
  color: var(--white);
  font-size: 12px;
}

.admin-stat-row small,
.admin-health-grid small,
.admin-module-row small,
.admin-alert-row small {
  grid-column: 1 / -1;
  color: rgba(248, 250, 252, 0.48);
  font-size: 10px;
  line-height: 1.35;
}

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

.admin-module-row {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.admin-module-row span {
  color: rgba(16, 240, 161, 0.75);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.admin-alert-row {
  border-color: rgba(245, 158, 11, 0.15);
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.09), transparent 62%),
    rgba(255, 255, 255, 0.026);
}

.admin-provider-readiness-row {
  grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(86px, auto)) minmax(150px, 0.55fr) minmax(210px, auto);
  align-items: center;
  gap: 8px;
  border-color: rgba(17, 24, 39, 0.26);
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), rgba(162, 119, 255, 0.12) 54%, rgba(16, 240, 161, 0.1)),
    rgba(255, 255, 255, 0.56);
}

.admin-provider-readiness-row.ready {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.5), rgba(103, 213, 232, 0.3)),
    rgba(255, 255, 255, 0.68);
}

.admin-provider-readiness-row.partial {
  background:
    linear-gradient(135deg, rgba(246, 177, 68, 0.45), rgba(103, 213, 232, 0.25)),
    rgba(255, 255, 255, 0.64);
}

.admin-provider-readiness-row.blocked {
  background:
    linear-gradient(135deg, rgba(241, 74, 70, 0.36), rgba(162, 119, 255, 0.2)),
    rgba(255, 255, 255, 0.62);
}

.admin-provider-readiness-row strong,
.admin-provider-readiness-row small,
.admin-provider-readiness-row span {
  color: rgba(7, 10, 18, 0.9);
}

.admin-provider-readiness-row small {
  font-size: 10px;
  line-height: 1.35;
}

.admin-provider-readiness-row > span {
  justify-self: start;
  min-width: 74px;
  padding: 4px 7px;
  border: 2px solid rgba(7, 10, 18, 0.75);
  box-shadow: 3px 3px 0 rgba(7, 10, 18, 0.9);
  background: rgba(255, 255, 255, 0.58);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8.5px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-readiness-row > span.ready {
  background: var(--lime);
}

.admin-provider-readiness-row > span.partial {
  background: var(--cyan);
}

.admin-provider-readiness-row > span.blocked {
  background: var(--coral);
}

.admin-provider-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 7px;
}

.admin-provider-actions button {
  min-height: 30px;
  padding: 6px 8px;
  border: 2px solid rgba(7, 10, 18, 0.82);
  box-shadow: 3px 3px 0 rgba(7, 10, 18, 0.9);
  background: #fff7ed;
  color: #08090d;
  font-size: 9px;
  font-weight: 900;
}

.admin-provider-actions button:nth-child(1) {
  background: var(--lime);
}

.admin-provider-actions button:nth-child(2) {
  background: var(--cyan);
}

.admin-provider-actions button:nth-child(3) {
  background: var(--violet);
}

.admin-provider-actions button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.admin-provider-setup-guide {
  margin-top: 12px;
}

.admin-provider-config-board {
  margin: 12px 0;
}

.admin-provider-config-empty,
.admin-provider-config-shell {
  padding: 12px;
  border: 2px solid rgba(7, 10, 18, 0.85);
  border-radius: 10px;
  box-shadow: 6px 6px 0 rgba(7, 10, 18, 0.88);
  background:
    linear-gradient(135deg, rgba(225, 255, 59, 0.12), rgba(103, 213, 232, 0.1) 48%, rgba(162, 119, 255, 0.1)),
    rgba(255, 247, 237, 0.9);
  color: #08090d;
}

.admin-provider-config-empty {
  display: grid;
  gap: 4px;
}

.admin-provider-config-empty strong,
.admin-provider-config-empty small,
.admin-provider-config-shell h3 {
  color: rgba(7, 10, 18, 0.9);
}

.admin-provider-config-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 10px 0;
}

.admin-provider-config-summary-card,
.admin-provider-config-card {
  border: 2px solid rgba(7, 10, 18, 0.86);
  border-radius: 9px;
  box-shadow: 4px 4px 0 rgba(7, 10, 18, 0.9);
  color: #08090d;
}

.admin-provider-config-summary-card {
  display: grid;
  gap: 3px;
  min-height: 72px;
  padding: 9px;
}

.admin-provider-config-summary-card.tone-1,
.admin-provider-config-card.tone-1 {
  background:
    linear-gradient(135deg, rgba(225, 255, 59, 0.58), rgba(255, 247, 237, 0.48)),
    rgba(255, 247, 237, 0.84);
}

.admin-provider-config-summary-card.tone-2,
.admin-provider-config-card.tone-2 {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.58), rgba(255, 247, 237, 0.48)),
    rgba(255, 247, 237, 0.84);
}

.admin-provider-config-summary-card.tone-3,
.admin-provider-config-card.tone-3 {
  background:
    linear-gradient(135deg, rgba(162, 119, 255, 0.5), rgba(255, 247, 237, 0.5)),
    rgba(255, 247, 237, 0.84);
}

.admin-provider-config-summary-card.tone-4,
.admin-provider-config-card.tone-4 {
  background:
    linear-gradient(135deg, rgba(246, 177, 68, 0.56), rgba(255, 247, 237, 0.5)),
    rgba(255, 247, 237, 0.84);
}

.admin-provider-config-summary-card.tone-5,
.admin-provider-config-card.tone-5 {
  background:
    linear-gradient(135deg, rgba(233, 111, 190, 0.5), rgba(255, 247, 237, 0.5)),
    rgba(255, 247, 237, 0.84);
}

.admin-provider-config-summary-card.tone-6,
.admin-provider-config-card.tone-6 {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.48), rgba(255, 247, 237, 0.5)),
    rgba(255, 247, 237, 0.84);
}

.admin-provider-config-summary-card span,
.admin-provider-config-card .eyebrow,
.admin-provider-config-card label {
  color: rgba(7, 10, 18, 0.72);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.admin-provider-config-summary-card strong {
  color: rgba(7, 10, 18, 0.95);
  font-size: 20px;
}

.admin-provider-config-summary-card small,
.admin-provider-config-card small {
  color: rgba(7, 10, 18, 0.66);
  font-size: 9.5px;
  line-height: 1.3;
}

.admin-provider-config-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.admin-provider-config-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 11px;
}

.admin-provider-config-card.ready {
  background:
    linear-gradient(90deg, rgba(16, 240, 161, 0.22), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.partial {
  background:
    linear-gradient(90deg, rgba(246, 177, 68, 0.24), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.blocked {
  background:
    linear-gradient(90deg, rgba(241, 74, 70, 0.2), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.tone-1 {
  background:
    linear-gradient(90deg, rgba(225, 255, 59, 0.22), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.tone-2 {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.22), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.tone-3 {
  background:
    linear-gradient(90deg, rgba(162, 119, 255, 0.2), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.tone-4 {
  background:
    linear-gradient(90deg, rgba(246, 177, 68, 0.22), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.tone-5 {
  background:
    linear-gradient(90deg, rgba(233, 111, 190, 0.2), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card.tone-6 {
  background:
    linear-gradient(90deg, rgba(16, 240, 161, 0.2), transparent 16%),
    rgba(255, 250, 240, 0.9);
}

.admin-provider-config-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.admin-provider-config-card h4 {
  margin: 2px 0 0;
  color: rgba(7, 10, 18, 0.94);
  font-size: 14px;
}

.admin-provider-config-card header > strong {
  display: inline-flex;
  min-width: 40px;
  justify-content: center;
  padding: 5px 7px;
  border: 2px solid rgba(7, 10, 18, 0.84);
  box-shadow: 3px 3px 0 rgba(7, 10, 18, 0.9);
  background: var(--lime);
  color: rgba(7, 10, 18, 0.95);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
}

.admin-provider-config-progress,
.admin-provider-config-blockers {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.admin-provider-config-progress span,
.admin-provider-config-blockers span {
  padding: 4px 5px;
  border: 2px solid rgba(7, 10, 18, 0.75);
  box-shadow: 2px 2px 0 rgba(7, 10, 18, 0.86);
  background: var(--coral);
  color: rgba(7, 10, 18, 0.9);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 7px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-config-progress span.ready {
  background: var(--lime);
}

.admin-provider-config-blockers span {
  background: rgba(255, 247, 237, 0.78);
}

.admin-provider-config-meta {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.admin-provider-config-meta code {
  display: block;
  min-width: 0;
  padding: 6px 7px;
  overflow-wrap: anywhere;
  border: 1px solid rgba(7, 10, 18, 0.18);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.46);
  color: rgba(7, 10, 18, 0.82);
  font-size: 9px;
}

.admin-provider-next-step {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: center;
  padding: 8px;
  border: 2px solid rgba(7, 10, 18, 0.78);
  border-radius: 8px;
  box-shadow: 3px 3px 0 rgba(7, 10, 18, 0.9);
  background: rgba(255, 250, 240, 0.9);
}

.admin-provider-next-step span {
  color: rgba(7, 10, 18, 0.66);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-next-step strong {
  grid-column: 1 / -1;
  overflow: hidden;
  color: #08090d;
  font-size: 11px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-provider-next-step small {
  justify-self: end;
  padding: 3px 6px;
  border: 2px solid rgba(7, 10, 18, 0.72);
  background: var(--lime);
  box-shadow: 2px 2px 0 rgba(7, 10, 18, 0.88);
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 7px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-guide-empty,
.admin-provider-guide {
  border: 2px solid rgba(7, 10, 18, 0.85);
  border-radius: 10px;
  box-shadow: 6px 6px 0 rgba(7, 10, 18, 0.9);
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.24), rgba(255, 247, 237, 0.88) 44%, rgba(225, 255, 59, 0.2)),
    rgba(255, 247, 237, 0.92);
  color: #08090d;
}

.admin-provider-guide-empty {
  display: grid;
  gap: 4px;
  padding: 12px;
}

.admin-provider-guide-empty strong,
.admin-provider-guide-empty small {
  color: rgba(7, 10, 18, 0.86);
}

.admin-provider-guide {
  padding: 12px;
}

.admin-provider-guide.ready {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.32), rgba(103, 213, 232, 0.2) 52%, rgba(255, 247, 237, 0.9)),
    rgba(255, 247, 237, 0.94);
}

.admin-provider-guide header,
.admin-provider-guide footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.admin-provider-guide header {
  margin-bottom: 10px;
}

.admin-provider-guide h4,
.admin-provider-guide h5,
.admin-provider-guide strong,
.admin-provider-guide small,
.admin-provider-guide label,
.admin-provider-guide li,
.admin-provider-guide code {
  color: rgba(7, 10, 18, 0.9);
}

.admin-provider-guide h4 {
  margin: 3px 0 2px;
  font-size: 18px;
}

.admin-provider-guide h5 {
  margin: 0 0 7px;
  font-size: 10px;
  font-family: "Geist Mono", Menlo, monospace;
  text-transform: uppercase;
}

.admin-provider-guide-status,
.admin-provider-guide-env,
.admin-provider-progress {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.admin-provider-guide-status {
  margin-bottom: 12px;
}

.admin-provider-guide-status span,
.admin-provider-guide-env span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 7px;
  border: 2px solid rgba(7, 10, 18, 0.75);
  box-shadow: 3px 3px 0 rgba(7, 10, 18, 0.9);
  background: var(--coral);
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-guide-status span.ready,
.admin-provider-guide-env span.ready {
  background: var(--lime);
}

.admin-provider-guide-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.admin-provider-guide section {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(7, 10, 18, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.44);
}

.admin-provider-guide label {
  display: block;
  margin-top: 8px;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-guide code {
  display: block;
  width: 100%;
  margin-top: 4px;
  padding: 7px;
  overflow-wrap: anywhere;
  border: 1px solid rgba(7, 10, 18, 0.18);
  border-radius: 6px;
  background: rgba(7, 10, 18, 0.06);
  font-size: 10px;
}

.admin-provider-env-template {
  max-height: 150px;
  margin: 4px 0 0;
  overflow: auto;
  border: 1px solid rgba(7, 10, 18, 0.2);
  border-radius: 6px;
  background: rgba(7, 10, 18, 0.08);
}

.admin-provider-env-template code {
  margin: 0;
  border: 0;
  background: transparent;
  white-space: pre-wrap;
}

.admin-provider-guide-env article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 7px;
  border-radius: 6px;
  background: rgba(255, 247, 237, 0.72);
}

.admin-provider-progress {
  display: grid;
  grid-template-columns: 1fr;
}

.admin-provider-progress article {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px;
  border: 1px solid rgba(7, 10, 18, 0.14);
  border-radius: 8px;
  background: rgba(241, 74, 70, 0.16);
}

.admin-provider-progress article.ready {
  background: rgba(16, 240, 161, 0.2);
}

.admin-provider-progress article > span {
  display: inline-flex;
  justify-content: center;
  padding: 4px 6px;
  border: 2px solid rgba(7, 10, 18, 0.76);
  box-shadow: 2px 2px 0 rgba(7, 10, 18, 0.85);
  background: var(--coral);
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-provider-progress article.ready > span {
  background: var(--lime);
}

.admin-provider-progress div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-provider-guide-steps,
.admin-provider-guide ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.admin-provider-guide-steps li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 7px;
}

.admin-provider-guide-steps b {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--cyan);
  color: #08090d;
  font-size: 10px;
}

.admin-provider-guide footer {
  justify-content: flex-end;
  margin-top: 12px;
}

.admin-provider-guide button,
.admin-provider-guide a {
  min-height: 31px;
  padding: 7px 10px;
  border: 2px solid rgba(7, 10, 18, 0.82);
  box-shadow: 3px 3px 0 rgba(7, 10, 18, 0.9);
  background: var(--cyan);
  color: #08090d;
  font-size: 9px;
  font-weight: 900;
  text-decoration: none;
  text-transform: uppercase;
}

.admin-provider-guide footer button:first-child {
  background: var(--lime);
}

.admin-provider-guide footer button:last-child {
  background: var(--violet);
}

.admin-provider-guide footer button[data-provider-copy-label] {
  background: var(--coral);
}

.admin-cost-row {
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  align-items: center;
}

.export-box {
  overflow: auto;
  max-height: 240px;
  margin: 14px 0 0;
  padding: 12px;
  border: 1px solid var(--smoke);
  border-radius: 8px;
  background: var(--obsidian);
  color: var(--mist);
  font-size: 12px;
  line-height: 1.5;
}

.operation-button {
  display: grid;
  gap: 5px;
  min-height: 76px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--tertiary);
  color: var(--white);
  text-align: left;
  cursor: pointer;
}

.operation-button strong {
  font-size: 12.5px;
}

.operation-button:hover {
  border-color: rgba(16, 240, 161, 0.42);
}

.operation-button span,
.provider-output {
  color: var(--mist);
}

.provider-output {
  margin: 12px 0 0;
  line-height: 1.5;
}

.creative-engine .provider-output {
  min-height: 24px;
  margin: 6px 0 0;
  padding: 5px 8px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(248, 250, 252, 0.52);
  font-size: 10.5px;
  line-height: 1.35;
}

.module-list {
  display: grid;
  gap: 6px;
}

.module-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 10px;
}

.module-item span {
  color: var(--plasma-glow);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.detail-panel p {
  max-width: 700px;
  min-height: 52px;
  margin: 0 0 16px;
  font-size: 11.5px;
  line-height: 1.48;
}

.brand-panel {
  grid-column: span 2;
}

.full-panel {
  min-height: 480px;
}

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

table {
  width: 100%;
  border-collapse: collapse;
  min-width: 780px;
}

th,
td {
  padding: 10px 9px;
  border-bottom: 1px solid rgba(39, 39, 42, 0.8);
  text-align: left;
}

th {
  color: var(--plasma-glow);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

td {
  color: var(--mist);
  font-size: 12px;
}

td strong {
  color: var(--white);
}

.mode-control.inline {
  width: min(360px, 100%);
  margin-bottom: 0;
}

.queue-list-large li {
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 58px;
}

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

.module-overview-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}

.module-overview-board article {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 78px;
  padding: 11px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #f7dfc5;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
}

.module-overview-board article.ready {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #d5ff00;
}

.module-overview-board article.blocked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ffb4a9;
}

.module-overview-board article.attention {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #ffe48a;
}

.module-overview-board strong {
  overflow: hidden;
  font-size: 15px;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.module-overview-board small {
  color: rgba(8, 9, 13, 0.76);
  font-size: 10px;
  line-height: 1.28;
}

.roadmap-card {
  display: grid;
  gap: 8px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--tertiary);
}

.roadmap-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.roadmap-card h3 {
  margin: 0;
  font-size: 13.5px;
  letter-spacing: 0;
}

.roadmap-card p {
  margin: 0;
  color: var(--mist);
}

.module-card-meta {
  display: grid;
  gap: 4px;
  min-height: 45px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 6px;
  background: rgba(255, 250, 240, 0.72);
}

.module-card-meta span:first-child {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

.module-card-meta span:last-child {
  color: rgba(8, 9, 13, 0.76);
  font-size: 10px;
  line-height: 1.25;
}

.roadmap-card.attention {
  border-color: rgba(213, 255, 0, 0.38);
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.13), rgba(102, 230, 255, 0.08)),
    var(--tertiary);
}

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

.roadmap-card button {
  min-height: 34px;
  border: 2px solid #08090d;
  border-radius: 6px;
  background: #66e6ff;
  box-shadow: 3px 3px 0 #08090d;
  color: #08090d;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
}

.roadmap-card .progress-row,
.insight-card .badge,
.connection-card .badge {
  font-size: 9px;
}

.brand-form,
.campaign-form {
  display: grid;
  gap: 12px;
}

.brand-form label,
.campaign-form label {
  display: grid;
  gap: 8px;
}

.campaign-dialog {
  width: min(700px, calc(100vw - 32px));
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--carbon);
  color: var(--white);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.72);
}

.compact-dialog-form {
  width: 100%;
  gap: 10px;
  padding: 2px;
}

.compact-dialog-form .panel-header {
  margin-bottom: 2px;
}

.compact-dialog-form .panel-header h2 {
  font-size: 16px;
}

.compact-dialog-form input::placeholder,
.compact-dialog-form textarea::placeholder {
  color: rgba(248, 250, 252, 0.34);
  font-size: 11.5px;
}

.compact-dialog-form input,
.compact-dialog-form select {
  min-height: 32px;
}

.compact-dialog-form textarea {
  min-height: 72px;
}

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

.compact-dialog-form .choice-panel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  padding: 12px;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 58%),
    rgba(255, 255, 255, 0.032);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.compact-dialog-form .choice-panel h3 {
  margin: 0 0 3px;
  color: rgba(103, 232, 249, 0.78);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}

.compact-dialog-form .choice-panel label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 11.5px;
  line-height: 1.2;
  color: rgba(248, 250, 252, 0.66);
}

.compact-dialog-form .choice-panel input {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  min-height: 0;
  padding: 0;
}

.compact-dialog-form menu {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 2px 0 0;
  padding: 0;
}

.compact-dialog-form .estimate-card {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  min-height: 46px;
  padding: 10px 12px;
  border-color: rgba(34, 211, 238, 0.12);
  background: rgba(34, 211, 238, 0.045);
  box-shadow: none;
}

.compact-dialog-form .estimate-card div {
  display: grid;
  gap: 2px;
}

.compact-dialog-form .estimate-card span {
  color: rgba(103, 232, 249, 0.75);
  font-size: 10px;
  text-transform: uppercase;
}

.compact-dialog-form .estimate-card strong {
  display: block;
  color: var(--white);
  font-size: 14px;
  line-height: 1.1;
}

.compact-dialog-form .estimate-card small {
  max-width: none;
  color: rgba(248, 250, 252, 0.48);
  font-size: 11px;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
}

.campaign-dialog::backdrop {
  background: rgba(0, 0, 0, 0.72);
}

.agentic-campaign-dialog {
  width: min(980px, calc(100vw - 32px));
}

.agentic-campaign-dialog .campaign-form {
  max-height: min(84vh, 820px);
  overflow: auto;
  padding-right: 4px;
}

.campaign-brief-banner {
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.18), transparent 54%),
    linear-gradient(315deg, rgba(34, 211, 238, 0.16), transparent 58%),
    rgba(255, 255, 255, 0.036);
}

.campaign-brief-banner strong {
  color: var(--white);
  font-size: 12px;
  line-height: 1.2;
}

.campaign-brief-banner small {
  color: rgba(248, 250, 252, 0.56);
  font-size: 10.5px;
  line-height: 1.35;
}

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

.campaign-brief-grid .wide-field {
  grid-column: 1 / -1;
}

.agentic-campaign-dialog textarea {
  resize: vertical;
}

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

fieldset {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

fieldset label {
  display: flex;
  align-items: center;
  gap: 8px;
}

fieldset input {
  width: auto;
  min-height: auto;
}

menu {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 0;
  margin: 4px 0 0;
}

.progress-row {
  display: grid;
  grid-template-columns: auto minmax(120px, 1fr) 48px;
  align-items: center;
  gap: 8px;
  font-size: 12px;
}

.progress-track {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--smoke);
}

.progress-fill {
  width: 22%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--plasma-glow), var(--cyan));
  transition: width 220ms ease;
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--smoke);
  }

  nav {
    grid-template-columns: repeat(15, minmax(120px, 1fr));
    overflow-x: auto;
  }

  .workspace-card {
    display: grid;
    position: static;
    box-shadow: none;
  }

  .topbar,
  .panel-header {
    flex-direction: column;
  }

  .status-grid,
  .content-grid,
  .product-loop,
  .pipeline,
  .campaign-summary,
  .module-roadmap,
  .connection-grid,
  .analytics-grid,
  .billing-grid,
  .subscription-summary,
  .automation-summary,
  .plan-grid,
  .media-grid,
  .onboarding-layout,
  .automation-settings,
  .routing-form,
  .routing-summary,
  .job-summary,
  .topup-form,
  .invoice-row,
  .job-row,
  .audit-row,
  .admin-summary,
  .admin-audit-summary,
  .admin-provider-readiness-summary,
  .admin-provider-config-summary,
  .admin-provider-readiness-row,
  .admin-provider-config-grid,
  .admin-billing-grid,
  .admin-credit-adjust-form,
  .admin-billing-ledger,
  .admin-filter-bar,
  .admin-platform-audit-row,
  .admin-command-grid,
  .admin-deep-grid,
  .admin-layout,
  .admin-user-row,
  .admin-tool-grid,
  .admin-ops-grid,
  .admin-health-grid,
  .module-surface-grid,
  .report-grid,
  .creative-layout,
  .provider-grid,
  .creative-form {
    grid-template-columns: 1fr;
  }

  .provider-status {
    align-items: stretch;
    flex-direction: column;
  }

  .campaign-panel,
  .product-loop-panel,
  .brand-panel,
  .operations-panel {
    grid-column: auto;
  }

  .operation-grid {
    grid-template-columns: 1fr;
  }

  .filter-row {
    grid-template-columns: 1fr;
  }

  .automation-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  main,
  .sidebar {
    padding: 20px;
  }

  .topbar h1 {
    font-size: 25px;
  }

  .status-grid {
    gap: 12px;
  }

  .metric-card,
  .panel {
    padding: 18px;
  }

  .progress-row {
    grid-template-columns: 1fr;
  }

  .form-grid,
  fieldset,
  menu {
    grid-template-columns: 1fr;
  }

  menu {
    flex-direction: column-reverse;
  }
}

/* Maximalist product skin after login. */
body.app-mode {
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    #f4dfc4;
  background-size: 42px 42px;
}

.app-mode .app-shell {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.075) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.055) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 82% 7%, rgba(35, 78, 255, 0.22), transparent 24%),
    radial-gradient(circle at 22% 4%, rgba(213, 255, 0, 0.22), transparent 22%),
    #f4dfc4;
  background-size: 42px 42px, 42px 42px, auto, auto, auto;
}

.app-mode .app-shell::before {
  display: none;
}

.app-mode .sidebar {
  border-right: 4px solid #08090d;
  background:
    repeating-linear-gradient(135deg, rgba(35, 78, 255, 0.12) 0 10px, transparent 10px 24px),
    #f4dfc4;
  box-shadow: 10px 0 0 rgba(8, 9, 13, 0.10);
}

.app-mode .brand,
.app-mode .workspace-card,
.app-mode .sidebar-bottom-actions {
  border: 3px solid #08090d;
  background: #f7dfc5;
  box-shadow: 5px 5px 0 #08090d;
}

.app-mode .brand {
  height: 54px;
}

.app-mode .workspace-card {
  padding: 12px;
  color: #08090d;
}

.app-mode .sidebar-bottom-actions {
  padding: 10px;
}

.app-mode .workspace-card span,
.app-mode .workspace-card strong,
.app-mode .workspace-card .eyebrow {
  color: #08090d;
}

.app-mode .workspace-card .eyebrow,
.app-mode .metric-label,
.app-mode .eyebrow {
  font-family: "Geist Mono", Menlo, monospace;
  letter-spacing: 0;
}

.app-mode .nav-item {
  min-height: 35px;
  border: 2px solid transparent;
  color: #08090d;
  font-weight: 800;
  text-transform: uppercase;
}

.app-mode .nav-item:hover,
.app-mode .nav-item.active {
  border-color: #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  transform: translate(-2px, -2px);
}

.app-mode .nav-item.active::before {
  background: #ff3134;
  box-shadow: none;
}

.app-mode main {
  position: relative;
}

.app-mode .topbar {
  align-items: center;
  min-height: 78px;
  margin-bottom: 14px;
  padding: 10px 12px;
  border: 3px solid #08090d;
  background:
    radial-gradient(circle at 17% 50%, rgba(139, 92, 246, 0.34), transparent 18%),
    linear-gradient(104deg, #fff7ed 0 26%, #67d5e8 26% 46%, #b59cf6 46% 66%, #3859ef 66% 100%);
  box-shadow: 8px 8px 0 #08090d;
}

.app-mode .topbar-title {
  gap: 12px;
  min-width: 0;
}

.app-mode .topbar-title > div {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 12px 9px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.55), transparent 34%),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

.app-mode .topbar h1 {
  color: #08090d;
  font-size: clamp(20px, 2vw, 26px);
  font-weight: 950;
  line-height: 0.98;
  text-shadow: none;
}

.app-mode .signature-mark {
  width: 68px;
  height: 54px;
  overflow: hidden;
  border: 3px solid #08090d;
  border-radius: 11px;
  background:
    linear-gradient(135deg, var(--project-logo-bg-1, #08090d) 0 34%, var(--project-logo-bg-2, #67d5e8) 34% 68%, var(--project-logo-bg-3, #dfff3f) 68% 100%);
  box-shadow: 5px 5px 0 #08090d;
  opacity: 1;
}

.app-mode .signature-mark::before,
.app-mode .signature-mark::after {
  display: none;
}

.app-mode .signature-mark img {
  display: block;
  width: 100%;
  height: 100%;
  padding: 4px;
  object-fit: contain;
  object-position: center;
  filter: saturate(1.08) contrast(1.04);
}

.app-mode .signature-mark img[hidden] {
  display: none;
}

.app-mode .project-logo-text {
  display: none;
}

.app-mode .project-brand-mark.has-project-label .project-logo-text {
  display: grid;
  place-items: center;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  padding: 4px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #08090d;
  color: #dfff3f;
  font-family: var(--mono-font);
  font-size: 0.68rem;
  line-height: 1;
  text-align: center;
  overflow-wrap: anywhere;
}

.app-mode .project-brand-mark.has-project-logo {
  background:
    linear-gradient(135deg, var(--project-logo-bg-1, #08090d) 0 32%, var(--project-logo-bg-2, #67d5e8) 32% 66%, var(--project-logo-bg-3, #dfff3f) 66% 100%);
}

.app-mode .project-brand-mark.has-project-logo img {
  padding: 4px;
  object-fit: contain;
  object-position: center;
  filter: none;
}

.app-mode .operator-strip span,
.app-mode .badge,
.app-mode .live,
.app-mode .admin-access-button,
.app-mode .secondary-action,
.app-mode .primary-action,
.app-mode .media-schedule {
  border: 2px solid #08090d;
  border-radius: 0;
  box-shadow: 4px 4px 0 #08090d;
  font-weight: 850;
  text-transform: uppercase;
}

.app-mode .operator-strip span,
.app-mode .secondary-action {
  background: #f7dfc5;
  color: #08090d;
}

.app-mode .primary-action,
.app-mode .media-schedule,
.app-mode .admin-access-button {
  background: #10f0a1;
  color: #08090d;
}

.app-mode .admin-access-button.secondary-toggle {
  background: #67d5e8;
}

.app-mode .admin-access-button.logout-toggle {
  background: #ff4b4b;
  color: #08090d;
}

.app-mode .panel,
.app-mode .metric-card,
.app-mode .admin-command-panel,
.app-mode .admin-section,
.app-mode .project-switcher,
.app-mode .ploxy-chat-panel,
.app-mode .creative-preview-stage,
.app-mode .module-surface-card,
.app-mode .module-work-grid > article,
.app-mode .campaign-dialog {
  border: 3px solid #08090d;
  border-radius: 0;
  background: linear-gradient(135deg, #fff7ed, #f7dfc5);
  box-shadow: 7px 7px 0 #08090d;
  color: #08090d;
  backdrop-filter: none;
}

.app-mode .panel::before,
.app-mode .metric-card::before,
.app-mode .creative-engine::after,
.app-mode .campaign-panel::after {
  background: #08090d;
  opacity: 1;
}

.app-mode .panel h2,
.app-mode .panel h3,
.app-mode .metric-card strong,
.app-mode .project-switcher strong,
.app-mode .module-work-item strong,
.app-mode .module-rule-item strong,
.app-mode .chat-agent-header h3 {
  color: #08090d;
}

.app-mode .panel p,
.app-mode .panel small,
.app-mode .project-switcher small,
.app-mode .module-work-item small,
.app-mode .module-rule-item small,
.app-mode .chat-message p {
  color: rgba(8, 9, 13, 0.68);
}

.app-mode .metric-card:nth-child(1),
.app-mode .module-kpi-grid article:nth-child(1),
.app-mode .automation-summary div:nth-child(1) {
  background: #d5ff00;
}

.app-mode .metric-card:nth-child(2),
.app-mode .module-kpi-grid article:nth-child(2),
.app-mode .automation-summary div:nth-child(2) {
  background: #22d3ee;
}

.app-mode .metric-card:nth-child(3),
.app-mode .module-kpi-grid article:nth-child(3),
.app-mode .automation-summary div:nth-child(3) {
  background: #ff3134;
}

.app-mode .metric-card:nth-child(4),
.app-mode .module-kpi-grid article:nth-child(4),
.app-mode .automation-summary div:nth-child(4) {
  background: #a78bfa;
}

.app-mode input,
.app-mode select,
.app-mode textarea {
  border: 2px solid #08090d;
  border-radius: 0;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.85);
}

.app-mode .ploxy-chat-panel {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.50), rgba(35, 78, 255, 0.16)),
    #161126;
}

.app-mode .ploxy-chat-panel h3,
.app-mode .ploxy-chat-panel .eyebrow,
.app-mode .ploxy-chat-panel .chat-message strong {
  color: #fff7ed;
}

.app-mode .ploxy-chat-panel .chat-message p {
  color: rgba(255, 247, 237, 0.72);
}

.app-mode .preview-mode-tabs button,
.app-mode .preview-platforms button,
.app-mode .creative-tool-strip button,
.app-mode .cost-mode-trigger,
.app-mode .send-icon-button {
  border: 2px solid #08090d;
  border-radius: 0;
  background: #f7dfc5;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.app-mode .preview-mode-tabs button.active,
.app-mode .preview-platforms button.active {
  background: #22d3ee;
}

.app-mode .preview-mode-tabs button span,
.app-mode .preview-platforms button span,
.app-mode .preview-meta-line span,
.app-mode .preview-meta-line strong {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

.app-mode .preview-device {
  border: 4px solid #08090d;
  border-radius: 0;
  box-shadow: 10px 10px 0 rgba(8, 9, 13, 0.92);
}

.app-mode .table-shell,
.app-mode .queue-row,
.app-mode .job-row,
.app-mode .audit-row,
.app-mode .connection-card,
.app-mode .media-card,
.app-mode .plan-card,
.app-mode .module-work-item,
.app-mode .module-rule-item,
.app-mode .admin-user-row,
.app-mode .admin-stat-row,
.app-mode .admin-alert-row,
.app-mode .admin-cost-row,
.app-mode .admin-module-row {
  border: 2px solid #08090d;
  border-radius: 0;
  background: rgba(255, 247, 237, 0.82);
  box-shadow: 4px 4px 0 #08090d;
}

.app-mode .media-preview,
.app-mode .preview-visual {
  filter: saturate(1.2) contrast(1.05);
}

.app-mode .topbar,
.app-mode .panel,
.app-mode .metric-card {
  transform: rotate(-0.12deg);
}

.app-mode .panel:nth-of-type(even),
.app-mode .metric-card:nth-child(even) {
  transform: rotate(0.12deg);
}

@media (max-width: 980px) {
  .app-mode .topbar,
  .app-mode .panel,
  .app-mode .metric-card {
    transform: none;
  }
}

/* Keep the maximalist skin loud, but make product copy readable. */
.app-mode .content-grid .eyebrow,
.app-mode .campaign-panel .eyebrow,
.app-mode .operations-panel .eyebrow,
.app-mode .performance-hero .eyebrow,
.app-mode .metric-label,
.app-mode .panel .metric-label,
.app-mode .module-kpi-grid .eyebrow,
.app-mode .automation-summary .eyebrow,
.app-mode .subscription-summary .eyebrow,
.app-mode .admin-summary .metric-label {
  color: #08090d;
}

.app-mode .content-grid h2,
.app-mode .content-grid h3,
.app-mode .campaign-panel h2,
.app-mode .campaign-panel h3,
.app-mode .operations-panel h2,
.app-mode .operations-panel h3,
.app-mode .performance-hero h2,
.app-mode .performance-hero h3,
.app-mode .hero-performance strong,
.app-mode .recommendation-card strong,
.app-mode .platform-score-row strong,
.app-mode .cost-row strong,
.app-mode .agent-action strong,
.app-mode .event-list strong,
.app-mode .queue-list strong {
  color: #050609;
}

.app-mode .content-grid p,
.app-mode .content-grid small,
.app-mode .campaign-panel p,
.app-mode .campaign-panel small,
.app-mode .operations-panel p,
.app-mode .operations-panel small,
.app-mode .performance-hero p,
.app-mode .performance-hero small,
.app-mode .panel-note,
.app-mode .recommendation-card small,
.app-mode .platform-score-row small,
.app-mode .cost-row small,
.app-mode .agent-action small,
.app-mode .event-list small,
.app-mode .queue-list small {
  color: rgba(8, 9, 13, 0.72);
}

.app-mode .hero-score small,
.app-mode .platform-score-row b,
.app-mode .live-dot + span,
.app-mode .metric-card small,
.app-mode .metric-card .metric-label {
  color: #171a20;
}

/* Logo colour touch: plasma + cyan structure, mint reserved for action/live states. */
:root {
  --cyan-glow: #22d3ee;
  --mint-deep: #059669;
  --brand-line: linear-gradient(90deg, rgba(167, 139, 250, 0.72), rgba(6, 182, 212, 0.62), rgba(16, 240, 161, 0.34));
  --brand-veil: linear-gradient(135deg, rgba(139, 92, 246, 0.075), rgba(6, 182, 212, 0.04) 48%, transparent 78%);
}

.brand {
  position: relative;
}

.brand::after {
  position: absolute;
  inset: auto 10px 7px;
  height: 2px;
  border-radius: 999px;
  content: "";
  background: var(--brand-line);
  opacity: 0.82;
}

.topbar-title > div::after {
  display: block;
  width: 74px;
  height: 2px;
  margin-top: 7px;
  border-radius: 999px;
  content: "";
  background: linear-gradient(90deg, var(--plasma-glow), var(--cyan));
  opacity: 0.76;
}

.signature-mark::before {
  border-color: var(--plasma);
  box-shadow: 0 0 16px rgba(139, 92, 246, 0.32);
}

.signature-mark::after {
  border-color: var(--cyan);
  box-shadow: 0 0 16px rgba(6, 182, 212, 0.30);
}

.metric-card:nth-child(1),
.panel:nth-of-type(3n + 1) {
  background:
    var(--brand-veil),
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), transparent 48%),
    var(--surface);
}

.metric-card:nth-child(2),
.panel:nth-of-type(3n + 2) {
  background:
    linear-gradient(135deg, rgba(6, 182, 212, 0.055), transparent 54%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), transparent 48%),
    var(--surface);
}

.metric-card:nth-child(3),
.panel:nth-of-type(3n) {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.06), transparent 56%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), transparent 48%),
    var(--surface);
}

.panel-header .eyebrow,
.metric-label {
  background: linear-gradient(90deg, var(--plasma-glow), var(--cyan-glow));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.badge {
  border-color: rgba(167, 139, 250, 0.18);
}

.badge.live,
.live-dot,
.operator-strip i {
  box-shadow: 0 0 14px rgba(16, 240, 161, 0.44);
}

.nav-item.active {
  background:
    linear-gradient(90deg, rgba(139, 92, 246, 0.12), rgba(6, 182, 212, 0.055)),
    rgba(255, 255, 255, 0.04);
}

.primary-action,
.media-schedule {
  background: linear-gradient(135deg, var(--cyan), var(--mint));
}

.media-schedule {
  color: var(--obsidian);
  box-shadow: 0 10px 24px rgba(6, 182, 212, 0.14);
}

.mode.active,
.module-item.selected,
.plan-card.selected,
.pipeline-step.active {
  border-color: rgba(6, 182, 212, 0.28);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 0 0 1px rgba(139, 92, 246, 0.08);
}

.progress-fill {
  background: linear-gradient(90deg, var(--plasma-glow), var(--cyan), var(--mint));
}

.table-shell,
.creative-engine,
.campaign-panel {
  position: relative;
}

.table-shell::before,
.creative-engine::after,
.campaign-panel::after {
  position: absolute;
  left: 16px;
  right: 16px;
  top: 0;
  height: 1px;
  content: "";
  background: var(--brand-line);
  opacity: 0.48;
}

.media-preview {
  background:
    linear-gradient(135deg, rgba(167, 139, 250, 0.26), transparent 43%),
    linear-gradient(315deg, rgba(34, 211, 238, 0.22), transparent 52%),
    #0b0d12;
}

.media-card.video .media-preview {
  background:
    linear-gradient(135deg, rgba(6, 182, 212, 0.25), transparent 42%),
    linear-gradient(315deg, rgba(16, 240, 161, 0.16), transparent 54%),
    #0b0d12;
}

.media-card.text .media-preview {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.22), transparent 44%),
    linear-gradient(315deg, rgba(6, 182, 212, 0.12), transparent 56%),
    #0b0d12;
}

/* Polished interface pass: softer hierarchy, fewer hard boxes, stronger product identity. */
:root {
  --obsidian: #08090d;
  --carbon: #101116;
  --tertiary: #151720;
  --smoke: #252936;
  --mist: #9ca3af;
  --white: #f8fafc;
  --line: rgba(255, 255, 255, 0.075);
  --surface: rgba(16, 17, 22, 0.72);
  --surface-strong: rgba(21, 23, 32, 0.88);
  --surface-soft: rgba(255, 255, 255, 0.035);
  --shadow-soft: 0 16px 50px rgba(0, 0, 0, 0.34);
  --shadow-tight: 0 8px 22px rgba(0, 0, 0, 0.22);
}

body {
  background:
    linear-gradient(180deg, rgba(16, 240, 161, 0.035), transparent 22%),
    linear-gradient(120deg, rgba(139, 92, 246, 0.065), transparent 38%),
    var(--obsidian);
}

button,
input,
select,
textarea {
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

button:hover {
  transform: translateY(-1px);
}

input,
select,
textarea {
  border-color: rgba(255, 255, 255, 0.095);
  background: rgba(255, 255, 255, 0.045);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

input:focus,
select:focus,
textarea:focus {
  outline: 0;
  border-color: rgba(16, 240, 161, 0.55);
  background: rgba(255, 255, 255, 0.065);
  box-shadow: 0 0 0 3px rgba(16, 240, 161, 0.11);
}

.app-shell {
  grid-template-columns: 224px minmax(0, 1fr);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 100%),
    linear-gradient(135deg, rgba(139, 92, 246, 0.06), transparent 31%),
    linear-gradient(180deg, rgba(16, 240, 161, 0.035), transparent 26%),
    var(--obsidian);
  background-size: 42px 42px, 42px 42px, auto, auto, auto;
}

.sidebar {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100vh;
  max-height: 100vh;
  padding: 14px;
  border-right-color: rgba(255, 255, 255, 0.08);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 34%),
    rgba(8, 9, 13, 0.88);
  backdrop-filter: blur(18px);
}

.brand {
  height: 46px;
  border-color: rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.04);
  box-shadow: var(--shadow-tight);
}

nav {
  display: grid;
  align-content: start;
  gap: 3px;
  min-height: 0;
  overflow-y: auto;
  padding-right: 2px;
  scrollbar-width: thin;
}

.nav-item {
  position: relative;
  min-height: 33px;
  padding: 0 10px 0 14px;
  border: 0;
  border-radius: 8px;
  color: rgba(248, 250, 252, 0.62);
  font-size: 12.5px;
}

.nav-item::before {
  position: absolute;
  left: 5px;
  top: 9px;
  bottom: 9px;
  width: 2px;
  border-radius: 999px;
  content: "";
  background: transparent;
}

.nav-item:hover,
.nav-item.active {
  border-color: transparent;
  background: rgba(255, 255, 255, 0.055);
  color: var(--white);
}

.nav-item.active::before {
  background: linear-gradient(180deg, var(--mint), var(--cyan));
  box-shadow: 0 0 14px rgba(16, 240, 161, 0.45);
}

.workspace-card {
  position: sticky;
  bottom: 0;
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 0;
  background:
    linear-gradient(180deg, rgba(8, 9, 13, 0.64), rgba(8, 9, 13, 0.96));
  padding: 14px 4px 4px;
  box-shadow: 0 -14px 28px rgba(8, 9, 13, 0.72);
}

main {
  width: min(100%, 1380px);
  padding: 22px 24px 32px;
}

.topbar {
  min-height: 54px;
  margin-bottom: 10px;
}

.topbar h1 {
  font-size: 25px;
  line-height: 1.1;
}

.signature-mark {
  width: 40px;
  height: 30px;
  opacity: 0.92;
}

.signature-mark::before,
.signature-mark::after {
  border-width: 4px;
}

.primary-action {
  min-height: 34px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--mint), #67ffd0);
  box-shadow: 0 10px 28px rgba(16, 240, 161, 0.24);
}

.secondary-action,
.icon-button,
.table-action,
.connection-card button,
.plan-card button,
.media-schedule,
.operation-button,
.queue-actions button {
  border-color: rgba(167, 139, 250, 0.20);
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.11), rgba(34, 211, 238, 0.045)),
    rgba(255, 255, 255, 0.035);
}

.secondary-action:hover,
.icon-button:hover,
.table-action:hover,
.connection-card button:hover,
.plan-card button:hover,
.media-schedule:hover,
.operation-button:hover,
.queue-actions button:hover {
  border-color: rgba(16, 240, 161, 0.45);
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.12), rgba(139, 92, 246, 0.10)),
    rgba(255, 255, 255, 0.045);
  color: var(--white);
}

.operation-button {
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.10), transparent 54%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 68%),
    rgba(255, 255, 255, 0.035);
}

.operator-strip {
  gap: 6px;
  margin-bottom: 14px;
  padding: 0;
  border: 0;
  background: transparent;
}

.operator-strip span {
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
}

.credit-warning-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 0 0 14px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.08) 0 9px, transparent 9px 18px),
    #d5ff00;
  color: #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

.credit-warning-banner[hidden] {
  display: none;
}

.credit-warning-banner[data-credit-status="critical"],
.credit-warning-banner[data-credit-status="empty"] {
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.08) 0 9px, transparent 9px 18px),
    #ff5a52;
}

.credit-warning-banner .eyebrow,
.credit-warning-banner strong {
  display: block;
  color: #08090d;
}

.credit-warning-banner strong {
  margin-top: 3px;
  font-size: 13px;
  line-height: 1.25;
}

.credit-warning-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.status-grid,
.content-grid,
.connection-grid,
.analytics-grid,
.billing-grid,
.subscription-summary,
.automation-summary,
.plan-grid,
.media-grid,
.operation-grid,
.module-roadmap {
  gap: 12px;
}

.metric-card,
.panel {
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 48%),
    var(--surface);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(18px);
}

.metric-card::before,
.panel::before {
  height: 0;
}

.metric-card {
  min-height: 82px;
  padding: 12px 13px;
}

.metric-card strong {
  font-size: 19px;
}

.panel {
  min-height: 220px;
  padding: 17px;
}

.full-panel {
  min-height: 462px;
}

.panel-header {
  align-items: center;
  margin-bottom: 13px;
}

.panel h2 {
  font-size: 16px;
}

.eyebrow,
.metric-label {
  color: rgba(16, 240, 161, 0.86);
  letter-spacing: 0.09em;
}

.badge {
  min-height: 21px;
  border-color: rgba(255, 255, 255, 0.09);
  background: rgba(255, 255, 255, 0.045);
  color: rgba(248, 250, 252, 0.72);
}

.badge.live {
  border-color: rgba(16, 240, 161, 0.34);
  background: rgba(16, 240, 161, 0.09);
}

.product-loop div,
.pipeline-step,
.campaign-summary div,
.estimate-card,
.subscription-summary div,
.automation-summary div,
.connection-card,
.insight-card,
.plan-card,
.media-card,
.automation-row,
.roadmap-card,
.project-memory,
.provider-form,
.creative-form,
fieldset {
  border-color: rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 58%),
    rgba(255, 255, 255, 0.032);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.product-loop div,
.pipeline-step,
.campaign-summary div,
.subscription-summary div,
.automation-summary div {
  min-height: 78px;
}

.automation-summary div {
  min-height: 70px;
  padding: 10px;
  overflow: hidden;
}

.automation-summary div:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.14), transparent 56%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 64%),
    rgba(255, 255, 255, 0.032);
}

.automation-summary div:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.13), transparent 56%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 64%),
    rgba(255, 255, 255, 0.032);
}

.automation-summary div:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.15), transparent 56%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 64%),
    rgba(255, 255, 255, 0.032);
}

.automation-summary div:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.13), transparent 56%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 64%),
    rgba(255, 255, 255, 0.032);
}

.automation-summary .eyebrow {
  font-size: 8.5px;
}

.automation-summary strong {
  font-size: 15px;
  line-height: 1.1;
}

.automation-summary small {
  font-size: 9.5px;
  line-height: 1.28;
}

.pipeline-step.done,
.pipeline-step.active {
  background:
    linear-gradient(180deg, rgba(16, 240, 161, 0.07), transparent 62%),
    rgba(255, 255, 255, 0.035);
}

.pipeline-step.active {
  border-color: rgba(16, 240, 161, 0.34);
}

.module-item,
.mode {
  border: 0;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.module-item:hover,
.module-item.selected,
.mode:hover,
.mode.active {
  border-color: transparent;
  background: rgba(16, 240, 161, 0.08);
  color: var(--white);
}

.mode-control {
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.14);
}

.queue-list li,
.event-list li {
  border-bottom-color: rgba(255, 255, 255, 0.065);
}

.queue-list-large li,
.automation-row {
  padding: 11px 12px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.table-shell {
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.025);
}

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

th {
  padding-top: 12px;
  color: rgba(16, 240, 161, 0.82);
}

td {
  border-bottom-color: rgba(255, 255, 255, 0.055);
}

tbody tr:hover td {
  background: rgba(255, 255, 255, 0.035);
}

.plan-card,
.media-card,
.connection-card,
.insight-card,
.roadmap-card {
  box-shadow: var(--shadow-tight);
}

.plan-card.selected {
  border-color: rgba(16, 240, 161, 0.38);
  background:
    linear-gradient(180deg, rgba(16, 240, 161, 0.08), transparent 56%),
    rgba(255, 255, 255, 0.04);
}

.creative-layout {
  gap: 13px;
}

.generation-stack {
  gap: 12px;
}

.section-title h3,
.connection-card h3,
.insight-card h3,
.plan-card h3,
.media-card h3,
.roadmap-card h3 {
  font-size: 13px;
  font-weight: 650;
}

.media-preview {
  border-color: rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.20), transparent 38%),
    linear-gradient(315deg, rgba(139, 92, 246, 0.20), transparent 48%),
    #0b0d12;
}

.media-meta span {
  border-color: rgba(255, 255, 255, 0.075);
  background: rgba(255, 255, 255, 0.035);
}

.size-preview {
  border-color: rgba(16, 240, 161, 0.22);
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.09), transparent 62%),
    rgba(255, 255, 255, 0.035);
}

.provider-output,
.export-box {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.settings-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.settings-summary-grid article {
  display: grid;
  gap: 4px;
  min-height: 70px;
  padding: 10px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.11), transparent 58%),
    rgba(255, 255, 255, 0.032);
}

.settings-summary-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.11), transparent 58%),
    rgba(255, 255, 255, 0.032);
}

.settings-summary-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.13), transparent 58%),
    rgba(255, 255, 255, 0.032);
}

.settings-summary-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.11), transparent 58%),
    rgba(255, 255, 255, 0.032);
}

.settings-summary-grid strong {
  font-size: 15px;
  line-height: 1.1;
}

.settings-summary-grid small {
  color: rgba(248, 250, 252, 0.52);
  font-size: 9.5px;
  line-height: 1.3;
}

.settings-form {
  display: grid;
  gap: 10px;
}

.settings-section {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.036), transparent 60%),
    rgba(255, 255, 255, 0.026);
}

.settings-section .section-title {
  gap: 3px;
  margin-bottom: 0;
}

.settings-section .section-title h3 {
  margin: 0;
  font-size: 13px;
}

.settings-form .form-grid {
  gap: 8px;
}

.settings-form label {
  gap: 6px;
  font-size: 11px;
}

.settings-form input,
.settings-form select {
  min-height: 31px;
  font-size: 12px;
}

.settings-toggle-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

.settings-toggle-grid .toggle-line {
  min-height: 34px;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.team-access-layout {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.6fr);
  gap: 12px;
}

.team-invite-card,
.team-member-row {
  border: 3px solid #111;
  box-shadow: 5px 5px 0 #111;
  background: #f7ead8;
}

.team-invite-card {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.team-invite-card small {
  color: #222;
  line-height: 1.35;
}

.team-member-list {
  display: grid;
  gap: 10px;
}

.team-member-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(110px, 0.45fr) minmax(140px, 0.65fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
}

.team-member-row.current {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.45), transparent 60%),
    #dfff3f;
}

.team-member-row strong,
.team-member-row small,
.team-member-row span {
  color: #070707;
}

.team-member-row small {
  display: block;
  margin-top: 3px;
  font-size: 11px;
}

.team-invite-link {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  border: 2px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  padding: 4px 8px;
  font-family: var(--mono);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.team-invite-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.team-invite-actions .team-invite-link {
  margin-top: 0;
}

.team-inline-action {
  width: auto;
  min-height: 28px;
  padding: 4px 9px;
  background: #7bd3e8;
  font-size: 0.7rem;
}

.team-invite-status {
  display: block;
  margin-top: 6px;
  color: #262626;
}

.team-member-row span {
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 800;
}

.team-member-row button,
.team-member-row select {
  min-height: 30px;
}

.settings-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.growth-module-panel {
  background:
    radial-gradient(circle at 16% 0%, rgba(139, 92, 246, 0.18), transparent 30%),
    radial-gradient(circle at 88% 10%, rgba(34, 211, 238, 0.13), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), transparent 54%),
    var(--surface);
}

.ads-module {
  border-color: rgba(16, 240, 161, 0.13);
}

.seo-module {
  border-color: rgba(34, 211, 238, 0.14);
}

.community-module {
  border-color: rgba(167, 139, 250, 0.18);
}

.telegram-module {
  border-color: rgba(34, 211, 238, 0.18);
  background:
    radial-gradient(circle at 16% 0%, rgba(34, 211, 238, 0.16), transparent 30%),
    radial-gradient(circle at 88% 10%, rgba(16, 240, 161, 0.11), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), transparent 54%),
    var(--surface);
}

.reports-panel {
  border-color: rgba(167, 139, 250, 0.17);
  background:
    radial-gradient(circle at 14% 0%, rgba(167, 139, 250, 0.17), transparent 30%),
    radial-gradient(circle at 90% 8%, rgba(16, 240, 161, 0.10), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), transparent 54%),
    var(--surface);
}

.module-hero-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.10), rgba(139, 92, 246, 0.10) 52%, rgba(34, 211, 238, 0.08)),
    rgba(255, 255, 255, 0.03);
}

.module-hero-strip strong {
  display: block;
  margin: 4px 0 5px;
  font-size: 18px;
  line-height: 1.12;
}

.module-hero-strip p {
  max-width: 720px;
  margin: 0;
  color: rgba(248, 250, 252, 0.58);
  font-size: 11px;
  line-height: 1.48;
}

.module-hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}

.module-hero-actions .primary-action.compact {
  min-width: 132px;
  white-space: normal;
}

.module-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

.module-kpi-grid article {
  display: grid;
  gap: 4px;
  min-height: 74px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.13), transparent 60%),
    rgba(255, 255, 255, 0.032);
}

.module-kpi-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.13), transparent 60%),
    rgba(255, 255, 255, 0.032);
}

.module-kpi-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.12), transparent 60%),
    rgba(255, 255, 255, 0.032);
}

.module-kpi-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.13), transparent 60%),
    rgba(255, 255, 255, 0.032);
}

.module-kpi-grid strong {
  font-size: 18px;
  line-height: 1.1;
}

.module-kpi-grid small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10px;
  line-height: 1.3;
}

.module-surface-grid,
.report-grid,
.admin-ops-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

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

.report-paid-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 12px;
}

.admin-ops-grid {
  margin-top: 12px;
  margin-bottom: 0;
}

.module-surface-card,
.report-grid article,
.report-paid-grid article,
.admin-ops-grid article {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 118px;
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.12), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.module-surface-card:nth-child(2),
.report-grid article:nth-child(2),
.report-paid-grid article:nth-child(2),
.admin-ops-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.11), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.module-surface-card:nth-child(3),
.report-grid article:nth-child(3),
.report-paid-grid article:nth-child(3),
.admin-ops-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.10), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.report-grid article:nth-child(4),
.report-paid-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.12), transparent 58%),
    rgba(255, 255, 255, 0.03);
}

.module-surface-card strong,
.report-grid strong,
.report-paid-grid strong,
.admin-ops-grid strong {
  color: var(--white);
  font-size: 12.5px;
  line-height: 1.28;
}

.module-surface-card p,
.report-grid small,
.report-paid-grid small,
.admin-ops-grid small {
  margin: 0;
  color: rgba(248, 250, 252, 0.5);
  font-size: 10.5px;
  line-height: 1.42;
}

.module-work-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 10px;
}

.module-work-grid > article {
  display: grid;
  align-content: start;
  gap: 9px;
  min-height: 260px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.028);
}

.module-list-stack,
.module-rule-stack {
  display: grid;
  gap: 7px;
}

.module-work-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  min-height: 58px;
  padding: 9px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.08), transparent 58%),
    rgba(255, 255, 255, 0.026);
}

.module-work-item span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.28), rgba(34, 211, 238, 0.18));
  color: rgba(248, 250, 252, 0.82);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
}

.module-work-item strong,
.module-rule-item strong {
  display: block;
  color: var(--white);
  font-size: 12px;
}

.module-work-item small,
.module-rule-item small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10px;
  line-height: 1.35;
}

.module-work-item b {
  color: rgba(103, 232, 249, 0.78);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 500;
  text-align: right;
  text-transform: uppercase;
}

.report-manage-item {
  grid-template-columns: 34px minmax(0, 1fr) auto auto auto;
}

.report-manage-item button {
  min-height: 28px;
  padding: 5px 8px;
  border: 2px solid #08090d;
  background: #fff7ed;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
  box-shadow: 3px 3px 0 #08090d;
  cursor: pointer;
}

.report-manage-item button[data-report-regenerate] {
  background: #67e8f9;
}

.report-manage-item button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.report-manage-item a {
  color: inherit;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.module-queue-button {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(8, 9, 13, 0.85);
  border-radius: 7px;
  background: linear-gradient(135deg, #dfff36, #67e8f9);
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  box-shadow: 3px 3px 0 #08090d;
}

.module-queue-button:disabled {
  opacity: 0.58;
  filter: grayscale(0.4);
}

.module-action-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.module-rule-item {
  display: grid;
  gap: 3px;
  min-height: 54px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.07), transparent 62%),
    rgba(255, 255, 255, 0.025);
}

.report-hero-strip {
  margin-bottom: 12px;
}

.report-work-grid {
  margin-top: 0;
}

.campaign-dialog {
  border-color: rgba(255, 255, 255, 0.09);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 38%),
    #101116;
}

@media (max-width: 980px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    border-right: 0;
  }

  main {
    padding: 18px;
  }

  .topbar,
  .panel-header {
    align-items: stretch;
  }
}

@media (max-width: 560px) {
  main,
  .sidebar {
    padding: 14px;
  }

  .topbar-actions,
  .dialog-choice-grid,
  .campaign-brief-grid,
  .memory-scope-grid,
  .project-memory-grid {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .campaign-brief-grid .wide-field,
  .project-memory-grid .wide-field {
    grid-column: auto;
  }

  .compact-dialog-form .estimate-card {
    align-items: flex-start;
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .compact-dialog-form .estimate-card small {
    max-width: none;
    text-align: left;
    white-space: normal;
  }

  .topbar h1 {
    font-size: 22px;
  }

  .panel,
  .metric-card {
    padding: 14px;
  }
}

/* Polxy customer cockpit: compact, performance-first, and less internal-build oriented. */
:root {
  --cyan-glow: #67e8f9;
  --ploxy-violet: #8b5cf6;
  --ploxy-cyan: #22d3ee;
  --ploxy-green: #34d399;
}

.topbar-title .eyebrow {
  color: rgba(103, 232, 249, 0.86);
}

.app-mode .topbar-title .eyebrow {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  font-size: 10px;
  font-weight: 950;
}

.content-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
  align-items: start;
}

.performance-hero,
.campaign-panel,
.operations-panel {
  grid-column: span 2;
}

.dashboard-secondary {
  display: none;
}

.performance-hero {
  min-height: 290px;
  background:
    linear-gradient(100deg, rgba(139, 92, 246, 0.11), transparent 32%),
    linear-gradient(145deg, rgba(34, 211, 238, 0.10), transparent 58%),
    rgba(14, 16, 23, 0.83);
}

.hero-performance {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px;
  gap: 18px;
  align-items: stretch;
  margin-bottom: 16px;
}

.hero-performance > div:first-child {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 118px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent),
    rgba(255, 255, 255, 0.025);
}

.hero-performance strong {
  margin: 5px 0 6px;
  font-size: 26px;
  line-height: 1.04;
}

.hero-performance p,
.panel-note {
  max-width: 760px;
  margin: 0;
  color: rgba(248, 250, 252, 0.62);
  font-size: 12px;
  line-height: 1.5;
}

.hero-score {
  display: grid;
  align-content: center;
  justify-items: center;
  min-height: 118px;
  border: 1px solid rgba(52, 211, 153, 0.22);
  border-radius: 8px;
  background:
    radial-gradient(circle at 50% 35%, rgba(52, 211, 153, 0.18), transparent 46%),
    rgba(255, 255, 255, 0.035);
}

.hero-score span {
  color: rgba(248, 250, 252, 0.58);
  font-size: 11px;
}

.hero-score strong {
  margin: 3px 0;
  color: var(--white);
  font-size: 46px;
  line-height: 0.95;
}

.hero-score small {
  color: var(--ploxy-green);
  font-size: 10.5px;
}

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

.performance-metrics article {
  min-height: 92px;
  padding: 13px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
}

.performance-metrics strong {
  display: block;
  margin: 8px 0 3px;
  font-size: 22px;
}

.performance-metrics small {
  color: rgba(248, 250, 252, 0.52);
  font-size: 10.5px;
  line-height: 1.35;
}

.campaign-panel .campaign-summary {
  margin-bottom: 12px;
}

.recommendation-list,
.platform-score-list,
.cost-breakdown-list,
.agent-action-list {
  display: grid;
  gap: 8px;
}

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

.recommendation-card,
.platform-score-row,
.cost-row,
.agent-action {
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.042), transparent 68%),
    rgba(255, 255, 255, 0.026);
}

.recommendation-card {
  min-height: 96px;
  padding: 12px;
}

.recommendation-card strong,
.agent-action strong,
.platform-score-row strong,
.cost-row strong {
  display: block;
  color: rgba(248, 250, 252, 0.9);
  font-size: 12.5px;
  line-height: 1.28;
}

.recommendation-card small,
.agent-action small,
.platform-score-row small,
.cost-row small {
  display: block;
  margin-top: 5px;
  color: rgba(248, 250, 252, 0.52);
  font-size: 10.5px;
  line-height: 1.42;
}

.platform-score-row,
.cost-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px 28px;
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 10px;
}

.cost-row {
  grid-template-columns: minmax(0, 1fr) 128px;
}

.platform-score-row b {
  color: var(--ploxy-green);
  font-size: 12px;
  text-align: right;
}

.score-track {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
}

.score-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--ploxy-violet), var(--ploxy-cyan), var(--ploxy-green));
}

.panel-note {
  margin-bottom: 12px;
}

.agent-action {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 10px;
  width: 100%;
  text-align: left;
}

.agent-action span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid rgba(34, 211, 238, 0.24);
  border-radius: 8px;
  background: rgba(34, 211, 238, 0.08);
  color: var(--ploxy-cyan);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
}

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

.operation-button {
  min-height: 76px;
}

.operation-button span,
.queue-meta small,
.event-list small,
.automation-summary small,
.subscription-summary small,
.media-card p,
.plan-card p {
  color: rgba(248, 250, 252, 0.54);
  font-size: 10.5px;
}

.queue-list li {
  min-height: 52px;
}

.platform-panel,
.cost-panel {
  min-height: 300px;
}

@media (max-width: 1180px) {
  .content-grid,
  .performance-hero,
  .campaign-panel,
  .operations-panel {
    grid-column: auto;
  }

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

  .performance-hero,
  .campaign-panel,
  .operations-panel {
    grid-column: span 1;
  }
}

@media (max-width: 760px) {
  .hero-performance,
  .performance-metrics,
  .recommendation-list,
  .operation-grid {
    grid-template-columns: 1fr;
  }

  .platform-score-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .platform-score-row b {
    text-align: left;
  }
}

/* Project-aware agent workspace. */
.project-switcher {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 16px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(34, 211, 238, 0.08), transparent 46%),
    rgba(255, 255, 255, 0.026);
}

.project-switcher div {
  display: grid;
  gap: 3px;
}

.project-switcher strong {
  color: var(--white);
  font-size: 13px;
}

.project-switcher small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10.5px;
  line-height: 1.35;
}

.project-switcher button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

.creative-agent-console {
  display: grid;
  grid-template-columns: minmax(300px, 0.76fr) minmax(420px, 1fr);
  gap: 10px;
  margin-bottom: 8px;
}

.creative-engine {
  min-height: calc(100vh - 185px);
}

.creative-project-switcher {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

.creative-mode-switch {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(96px, 0.42fr);
  gap: 8px;
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.026);
}

.creative-mode-switch button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 34px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: rgba(248, 250, 252, 0.62);
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}

.creative-mode-switch button span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.creative-mode-switch button.active {
  border-color: rgba(34, 211, 238, 0.2);
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.18), transparent 54%),
    rgba(34, 211, 238, 0.065);
  color: var(--white);
}

.ploxy-chat-panel,
.manual-studio-panel,
.creative-preview-stage {
  height: clamp(610px, calc(100vh - 360px), 760px);
  min-height: 0;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.105), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.048), transparent 62%),
    rgba(255, 255, 255, 0.026);
}

.ploxy-chat-panel {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 8px;
  padding: 12px;
  border-color: rgba(139, 92, 246, 0.18);
  background:
    radial-gradient(circle at 18% 0%, rgba(139, 92, 246, 0.18), transparent 34%),
    linear-gradient(135deg, rgba(88, 28, 135, 0.16), transparent 52%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.048), transparent 62%),
    rgba(26, 18, 42, 0.36);
}

.manual-studio-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  padding: 12px;
  overflow: auto;
  border-color: rgba(34, 211, 238, 0.16);
  background:
    radial-gradient(circle at 18% 0%, rgba(34, 211, 238, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(16, 240, 161, 0.09), transparent 52%),
    rgba(12, 20, 26, 0.4);
}

.creative-mode-panel[hidden] {
  display: none;
}

.manual-provider-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 9px;
}

.manual-provider-form label {
  display: grid;
  gap: 6px;
  color: rgba(248, 250, 252, 0.66);
  font-size: 10.5px;
}

.manual-provider-form .wide-field {
  grid-column: 1 / -1;
}

.manual-layout-field {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 247, 237, 0.82);
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.manual-layout-field > strong {
  font-size: 0.82rem;
  line-height: 1.25;
}

.manual-layout-field .composer-layout-rail {
  grid-column: auto;
}

.manual-provider-form input,
.manual-provider-form select {
  min-height: 31px;
}

.manual-provider-form textarea {
  min-height: 78px;
}

.manual-cost-row {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid rgba(34, 211, 238, 0.12);
  border-radius: 8px;
  background: rgba(34, 211, 238, 0.045);
}

.manual-cost-row span {
  color: var(--white);
  font-size: 12px;
  font-weight: 750;
}

.manual-cost-row small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10px;
  line-height: 1.35;
}

.manual-requirements-card,
.manual-dynamic-fields {
  display: grid;
  gap: 8px;
}

.manual-requirements-card {
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: linear-gradient(110deg, rgba(223, 255, 63, 0.55), rgba(103, 213, 232, 0.34));
  box-shadow: 3px 3px 0 #08090d;
}

.manual-requirements-card strong {
  color: #08090d;
  font-size: 14px;
}

.manual-requirements-card small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.35;
}

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

.manual-action-row {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.auto-cost-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto;
  gap: 7px;
  align-items: center;
  padding-top: 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.075);
}

.auto-cost-panel div {
  display: grid;
  gap: 2px;
  min-height: 42px;
  padding: 7px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.032);
}

.auto-cost-panel strong {
  color: var(--white);
  font-size: 12px;
  line-height: 1.15;
}

.auto-cost-panel small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 9px;
  line-height: 1.25;
}

.chat-agent-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.chat-agent-header h3 {
  margin: 4px 0 0;
  font-size: 14px;
  line-height: 1.12;
}

.chat-header-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.chat-log-trigger {
  display: inline-grid;
  place-items: center;
  width: 30px;
  min-height: 30px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.045);
  color: rgba(248, 250, 252, 0.62);
  cursor: pointer;
}

.chat-log-trigger svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.chat-log-trigger[aria-expanded="true"] {
  border-color: rgba(167, 139, 250, 0.38);
  color: rgba(196, 181, 253, 0.95);
}

.ploxy-chat-body {
  display: grid;
  grid-template-columns: 1fr;
  min-height: 0;
}

.ploxy-chat-log {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 0;
  overflow-y: auto;
  padding: 8px 0;
}

.chat-message {
  display: grid;
  gap: 4px;
  max-width: 94%;
  padding: 9px 10px;
  border: 1px solid rgba(167, 139, 250, 0.13);
  border-radius: 8px;
  background: rgba(88, 28, 135, 0.09);
}

.chat-message.user {
  justify-self: end;
  border-color: rgba(34, 211, 238, 0.15);
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.085), rgba(139, 92, 246, 0.06));
}

.chat-message span {
  color: rgba(196, 181, 253, 0.95);
  font-size: 9px;
  text-transform: uppercase;
}

.chat-message p {
  margin: 0;
  color: rgba(248, 250, 252, 0.56);
  font-size: 11px;
  line-height: 1.45;
}

.chat-message strong {
  color: var(--white);
}

.ploxy-agent-log {
  position: absolute;
  right: 14px;
  top: 56px;
  z-index: 5;
  display: grid;
  align-content: start;
  gap: 9px;
  width: min(260px, calc(100% - 28px));
  padding: 10px;
  border: 1px solid rgba(34, 211, 238, 0.1);
  border-radius: 8px;
  background: #11131a;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.45);
}

.ploxy-agent-log[hidden] {
  display: none;
}

.ploxy-agent-log > div {
  display: grid;
  gap: 3px;
}

.ploxy-agent-log strong {
  color: var(--white);
  font-size: 12px;
}

.ploxy-agent-log ul {
  display: grid;
  gap: 7px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.ploxy-agent-log li {
  display: grid;
  gap: 2px;
  padding-top: 7px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.ploxy-agent-log b {
  color: rgba(248, 250, 252, 0.72);
  font-size: 10.5px;
}

.ploxy-agent-log small {
  color: rgba(248, 250, 252, 0.46);
  font-size: 9.5px;
  line-height: 1.35;
}

.ploxy-chat-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  padding: 7px;
  border: 1px solid rgba(167, 139, 250, 0.13);
  border-radius: 8px;
  background: rgba(16, 10, 28, 0.42);
}

.ploxy-chat-form textarea {
  min-height: 40px;
  max-height: 74px;
  padding: 6px 2px;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 12px;
  line-height: 1.45;
}

.chat-composer-actions {
  position: relative;
  display: flex;
  align-items: end;
  gap: 6px;
}

.cost-menu {
  position: relative;
}

.cost-mode-trigger,
.send-icon-button {
  display: inline-grid;
  place-items: center;
  min-height: 28px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--white);
  cursor: pointer;
}

.cost-mode-trigger {
  grid-template-columns: 12px auto;
  gap: 5px;
  min-width: 78px;
  padding: 0 7px;
  color: rgba(248, 250, 252, 0.72);
  font-size: 9.5px;
}

.cost-mode-trigger svg,
.send-icon-button svg {
  width: 12px;
  height: 12px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.cost-mode-trigger[aria-expanded="true"] {
  border-color: rgba(167, 139, 250, 0.38);
  color: rgba(196, 181, 253, 0.95);
}

.cost-mode-options {
  position: absolute;
  right: 0;
  bottom: 38px;
  z-index: 4;
  display: grid;
  gap: 4px;
  width: 150px;
  padding: 6px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: #11131a;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.45);
}

.cost-mode-options[hidden] {
  display: none;
}

.cost-mode-options button {
  display: grid;
  gap: 2px;
  min-height: 40px;
  padding: 6px 8px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: rgba(248, 250, 252, 0.64);
  text-align: left;
  cursor: pointer;
}

.cost-mode-options button:hover,
.cost-mode-options button.active {
  border-color: rgba(34, 211, 238, 0.18);
  background: rgba(34, 211, 238, 0.07);
  color: var(--white);
}

.cost-mode-options strong {
  font-size: 11px;
}

.cost-mode-options span {
  color: rgba(248, 250, 252, 0.44);
  font-size: 9.5px;
}

.creative-tool-strip {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: -2px 0 0;
}

.creative-tool-strip button {
  min-height: 28px;
  padding: 0 9px;
  border: 1px solid rgba(167, 139, 250, 0.18);
  border-radius: 7px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.11), rgba(34, 211, 238, 0.05)),
    rgba(255, 255, 255, 0.032);
  color: rgba(248, 250, 252, 0.72);
  font-size: 10.5px;
  cursor: pointer;
}

.creative-tool-strip button:hover {
  border-color: rgba(16, 240, 161, 0.35);
  color: var(--white);
}

.send-icon-button {
  width: 30px;
  padding: 0;
  border-color: rgba(167, 139, 250, 0.36);
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.95), rgba(34, 211, 238, 0.78));
  color: var(--white);
}

.send-icon-button:disabled {
  border-color: rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.045);
  color: rgba(248, 250, 252, 0.28);
  cursor: not-allowed;
}

.creative-preview-stage {
  overflow: hidden;
  padding: 10px;
}

.preview-shell {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 10px;
  height: 100%;
}

.preview-controls {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  overflow-y: auto;
}

.preview-canvas {
  display: grid;
  place-items: center;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.preview-mode-tabs,
.preview-platforms {
  display: grid;
  gap: 6px;
}

.preview-mode-tabs button,
.preview-platforms button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  width: 100%;
  min-height: 25px;
  padding: 0 7px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.04);
  color: rgba(248, 250, 252, 0.58);
  font-size: 9.5px;
  cursor: pointer;
}

.preview-mode-tabs button span,
.preview-platforms button span {
  color: rgba(103, 232, 249, 0.78);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
}

.preview-mode-tabs button.active,
.preview-platforms button.active {
  border-color: rgba(34, 211, 238, 0.24);
  background: rgba(34, 211, 238, 0.075);
  color: var(--white);
}

.preview-meta-line {
  display: grid;
  gap: 3px;
  min-height: 44px;
  padding: 7px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.032);
  color: rgba(248, 250, 252, 0.44);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 8.5px;
  text-transform: uppercase;
}

.preview-meta-line strong {
  color: rgba(103, 232, 249, 0.72);
  font-size: 8.5px;
  font-weight: 500;
}

.preview-device {
  display: grid;
  width: var(--preview-frame-width, 430px);
  height: var(--preview-frame-height, 430px);
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 8px;
  background: #090b10;
  aspect-ratio: var(--preview-ratio, 1 / 1);
}

.preview-device.photo {
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.34);
}

.preview-device.video {
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.38);
}

.preview-device.text {
  aspect-ratio: 4 / 5;
  min-height: 0;
}

.preview-device.empty-preview {
  padding: 0;
  text-align: center;
}

.preview-device.empty-preview .preview-visual {
  min-height: 100%;
}

.preview-device.empty-preview strong {
  max-width: 300px;
  font-size: 19px;
  line-height: 1.15;
}

.preview-device.empty-preview small {
  max-width: 320px;
  color: rgba(248, 250, 252, 0.54);
  font-size: 11px;
  line-height: 1.45;
}

.preview-visual {
  position: relative;
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 10px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.20), transparent 38%),
    linear-gradient(315deg, rgba(139, 92, 246, 0.22), transparent 52%),
    linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.35)),
    #10131b;
}

.preview-device.video .preview-visual {
  background:
    linear-gradient(135deg, rgba(52, 211, 153, 0.16), transparent 40%),
    linear-gradient(315deg, rgba(34, 211, 238, 0.20), transparent 56%),
    #0d1118;
}

.preview-artwork {
  position: relative;
  display: grid;
  align-content: end;
  gap: 7px;
  min-height: 0;
  padding: 18px;
  overflow: hidden;
  border-radius: 6px;
  background:
    linear-gradient(150deg, color-mix(in srgb, var(--project-primary, #dfff3f) 35%, transparent), transparent 34%),
    linear-gradient(35deg, color-mix(in srgb, var(--project-accent, #67d5e8) 36%, transparent), transparent 48%),
    linear-gradient(315deg, rgba(181, 156, 246, 0.40), transparent 56%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 18px),
    var(--project-dark, #121424);
}

.preview-generated-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

object.preview-generated-image {
  display: block;
  background: #fffaf0;
}

.failed-video-overlay {
  position: relative;
  z-index: 3;
  align-self: end;
  display: grid;
  gap: 8px;
  max-width: min(92%, 520px);
  padding: 12px;
  border: 3px solid #08090d;
  background: rgba(255, 250, 240, 0.92);
  box-shadow: 5px 5px 0 #08090d;
}

.failed-video-overlay b {
  width: max-content;
  background: #ef5350;
  color: #08090d;
}

.failed-video-overlay small {
  max-width: 100%;
  color: #08090d;
  font-weight: 800;
}

.preview-generated-copy {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 7px;
  max-width: 92%;
  padding: 10px;
  border: 2px solid rgba(8, 9, 13, 0.45);
  background: rgba(8, 9, 13, 0.52);
  backdrop-filter: blur(6px);
}

.preview-device.video .preview-artwork {
  background:
    radial-gradient(circle at 70% 18%, rgba(255, 107, 203, 0.35), transparent 26%),
    linear-gradient(150deg, rgba(103, 213, 232, 0.28), transparent 36%),
    linear-gradient(315deg, rgba(105, 220, 160, 0.34), transparent 58%),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.04) 0 1px, transparent 1px 20px),
    #10131f;
}

.preview-artwork b {
  width: max-content;
  padding: 5px 8px;
  border: 2px solid #111;
  background: #dfff3f;
  color: #050505;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  letter-spacing: 0;
}

.preview-artwork strong {
  max-width: 88%;
  color: #fff;
  font-size: clamp(1rem, 1.45vw, 1.55rem);
  line-height: 1.05;
  text-shadow: 3px 3px 0 rgba(0, 0, 0, 0.7);
}

.preview-artwork small {
  max-width: 88%;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  line-height: 1.35;
}

.video-processing-state {
  align-self: center;
  justify-self: center;
  width: min(78%, 360px);
  min-height: 56%;
  place-items: center;
  align-content: center;
  text-align: center;
  border-color: rgba(174, 229, 209, 0.42);
  background:
    linear-gradient(180deg, rgba(8, 41, 50, 0.80), rgba(2, 9, 12, 0.88)),
    radial-gradient(circle at 50% 35%, rgba(202, 240, 105, 0.20), transparent 42%);
  box-shadow:
    inset 0 0 0 1px rgba(202, 240, 105, 0.22),
    0 24px 70px rgba(0, 0, 0, 0.46);
}

.video-processing-state b {
  margin-top: 4px;
  background: #caf069;
}

.video-processing-state strong {
  max-width: 100%;
  color: #f9ffe9 !important;
  text-shadow: 0 2px 16px rgba(202, 240, 105, 0.42) !important;
}

.video-processing-state small {
  max-width: 92%;
  color: rgba(238, 255, 245, 0.78);
}

.video-cooking-visual {
  position: relative;
  width: 116px;
  aspect-ratio: 1;
  margin-bottom: 6px;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(202, 240, 105, 0.34) 0 16%, transparent 17%),
    radial-gradient(circle, rgba(174, 229, 209, 0.16) 0 44%, transparent 45%);
}

.video-cooking-ring,
.video-cooking-ring.secondary,
.video-cooking-core,
.video-cooking-scan,
.video-cooking-dot {
  position: absolute;
  display: block;
  border-radius: 999px;
}

.video-cooking-ring {
  inset: 8px;
  border: 3px solid rgba(174, 229, 209, 0.22);
  border-top-color: #caf069;
  border-right-color: #aee5d1;
  animation: ploxy-video-orbit 1.5s linear infinite;
}

.video-cooking-ring.secondary {
  inset: 22px;
  border-width: 2px;
  border-color: rgba(202, 240, 105, 0.18);
  border-bottom-color: #caf069;
  animation-duration: 2.1s;
  animation-direction: reverse;
}

.video-cooking-core {
  inset: 42px;
  background: #caf069;
  box-shadow: 0 0 22px rgba(202, 240, 105, 0.72);
  animation: ploxy-video-pulse 1.3s ease-in-out infinite;
}

.video-cooking-scan {
  left: 17%;
  right: 17%;
  top: 50%;
  height: 3px;
  background: linear-gradient(90deg, transparent, #aee5d1, transparent);
  animation: ploxy-video-scan 1.8s ease-in-out infinite;
}

.video-cooking-dot {
  width: 9px;
  height: 9px;
  background: #aee5d1;
  box-shadow: 0 0 15px rgba(174, 229, 209, 0.8);
  animation: ploxy-video-pulse 1.4s ease-in-out infinite;
}

.video-cooking-dot.dot-a {
  left: 16px;
  top: 28px;
}

.video-cooking-dot.dot-b {
  right: 18px;
  top: 64px;
  animation-delay: 0.25s;
}

.video-cooking-dot.dot-c {
  left: 50%;
  bottom: 13px;
  animation-delay: 0.5s;
}

.video-cooking-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: center;
  margin-top: 5px;
}

.video-cooking-steps span {
  padding: 4px 7px;
  border: 1px solid rgba(174, 229, 209, 0.35);
  border-radius: 999px;
  color: #eaffd1;
  background: rgba(8, 41, 50, 0.72);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  line-height: 1;
}

@keyframes ploxy-video-orbit {
  to {
    transform: rotate(360deg);
  }
}

@keyframes ploxy-video-pulse {
  0%,
  100% {
    transform: scale(0.9);
    opacity: 0.68;
  }
  50% {
    transform: scale(1.12);
    opacity: 1;
  }
}

@keyframes ploxy-video-scan {
  0%,
  100% {
    transform: translateY(-28px);
    opacity: 0.25;
  }
  50% {
    transform: translateY(28px);
    opacity: 1;
  }
}

@keyframes videoProcessingGrid {
  from {
    transform: translate3d(-4%, -2%, 0) rotate(-8deg);
  }
  to {
    transform: translate3d(4%, 2%, 0) rotate(-8deg);
  }
}

.preview-project-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.preview-logo-lockup {
  position: absolute;
  top: 14px;
  right: 14px;
  left: auto;
  z-index: 4;
  display: grid;
  place-items: center;
  width: min(118px, 28%);
  height: min(64px, 18%);
  padding: 4px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  box-shadow: none;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.72));
}

.preview-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 58px;
  height: 58px;
  border: 3px solid #111;
  border-radius: 999px;
  background: #dfff3f;
  box-shadow: 5px 5px 0 #111;
  transform: translate(-50%, -50%);
}

.preview-play::after {
  position: absolute;
  top: 50%;
  left: 54%;
  width: 0;
  height: 0;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-left: 17px solid #111;
  content: "";
  transform: translate(-50%, -50%);
}

.preview-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.preview-footer span {
  padding: 4px 7px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.34);
  color: rgba(255, 255, 255, 0.78);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
}

.preview-device.text .preview-visual {
  min-height: 116px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), transparent 48%),
    #0d1118;
}

.caption-preview-artwork {
  align-content: start;
  grid-template-rows: auto 1fr;
  gap: 12px;
  height: 100%;
  padding: 18px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--project-primary, #dfff3f) 18%, transparent), transparent 42%),
    linear-gradient(315deg, color-mix(in srgb, var(--project-accent, #67d5e8) 22%, transparent), transparent 56%),
    #081018;
}

.caption-preview-head {
  display: grid;
  gap: 7px;
  padding-bottom: 12px;
  border-bottom: 2px solid rgba(255, 255, 255, 0.14);
}

.caption-preview-head strong {
  max-width: 100%;
  color: #fff;
  font-size: 1.2rem;
  line-height: 1.1;
  text-shadow: none;
}

.caption-preview-head small {
  max-width: 100%;
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.72rem;
}

.caption-preview-list {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
}

.caption-preview-item {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 2px solid rgba(255, 255, 255, 0.13);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.055);
}

.caption-preview-item b {
  width: max-content;
  padding: 4px 7px;
  border: 2px solid rgba(5, 5, 5, 0.82);
  border-radius: 0;
  background: #dfff3f;
  color: #050505;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  letter-spacing: 0;
  text-transform: uppercase;
}

.caption-preview-item p {
  margin: 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.76rem;
  line-height: 1.42;
}

.caption-preview-item p span {
  display: inline-block;
  margin-right: 6px;
  color: color-mix(in srgb, var(--project-accent, #67d5e8) 88%, white);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 0.66rem;
  font-weight: 800;
  text-transform: uppercase;
}

.preview-visual b {
  width: max-content;
  padding: 4px 7px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.28);
  color: rgba(248, 250, 252, 0.72);
  font-size: 10px;
}

.media-preview b {
  position: absolute;
  right: 10px;
  top: 10px;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  color: var(--white);
  font-size: 10px;
}

.media-preview {
  position: relative;
}

.project-dialog {
  width: min(1180px, calc(100vw - 28px));
}

.project-dialog .campaign-form {
  max-width: none;
  max-height: min(90vh, 860px);
  overflow: auto;
  padding-right: 4px;
}

.project-intake-dialog {
  padding: 0;
  border: 0;
  border-radius: 22px;
  background: transparent;
}

.project-intake-form {
  gap: 10px;
  padding: 0;
  border: 3px solid #08090d;
  border-radius: 12px;
  background:
    linear-gradient(115deg, #f04a42 0 21%, #dfff3f 21% 42%, #3859ef 42% 100%);
  box-shadow: 9px 9px 0 #08090d, 0 26px 80px rgba(8, 9, 13, 0.22);
  color: #08090d;
}

.project-intake-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px 22px 10px;
  border-bottom: 3px solid #08090d;
  background:
    repeating-linear-gradient(135deg, rgba(255, 247, 237, 0.18) 0 9px, rgba(8, 9, 13, 0.05) 9px 18px),
    transparent;
}

.project-intake-hero h2 {
  max-width: 760px;
  margin: 2px 0 3px;
  color: #ffffff;
  font-size: clamp(20px, 2.2vw, 28px);
  line-height: 1;
  text-shadow: 3px 3px 0 #08090d;
}

.project-intake-hero p {
  max-width: 920px;
  margin: 0;
  color: #fff7ed;
  font-size: 11px;
  line-height: 1.28;
  text-shadow: 1px 1px 0 rgba(8, 9, 13, 0.75);
}

.project-agent-mark {
  position: relative;
  width: 34px;
  height: 34px;
  margin-top: 0;
}

.project-agent-mark span {
  position: absolute;
  inset: 4px;
  border: 3px solid #7c3aed;
  border-radius: 999px;
  background: #f4dfc4;
  box-shadow: 4px 4px 0 #08090d;
}

.project-agent-mark span + span {
  transform: translate(8px, 0);
  border-color: #22d3ee;
  box-shadow: 4px 4px 0 #08090d;
}

.project-intake-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 10px;
  padding: 0 22px;
}

.project-intake-main {
  display: grid;
  grid-template-columns: 1fr 0.86fr;
  gap: 10px;
  align-items: stretch;
  min-width: 0;
}

.project-intake-card,
.project-agent-panel,
.project-advanced-memory {
  border: 3px solid #08090d;
  border-radius: 10px;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

.project-intake-card {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 12px;
}

.project-core-card {
  align-self: stretch;
  background:
    linear-gradient(135deg, #dfff3f 0 34%, transparent 34%),
    #fff7ed;
}

.project-core-card .section-title {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}

.project-core-card .section-title h3 {
  margin: 0;
}

.project-core-card .compact-memory-grid {
  align-items: end;
}

.project-core-card .compact-memory-grid input,
.project-core-card .compact-memory-grid textarea {
  min-height: 44px;
}

.project-core-card .compact-memory-grid textarea {
  min-height: 108px;
}

.project-import-card {
  grid-template-columns: 1fr;
  align-items: start;
  background:
    linear-gradient(150deg, #67d5e8 0 34%, transparent 34%),
    linear-gradient(25deg, rgba(229, 104, 189, 0.75), transparent 56%),
    #fff7ed;
}

.project-import-card .section-title {
  grid-column: auto;
}

.project-import-card .project-upload-box,
.project-import-card #new-project-file-output,
.project-import-card .project-agent-fill-row {
  grid-column: auto;
}

.project-import-card > label:not(.project-upload-box) {
  grid-column: auto;
  grid-row: auto;
}

.project-import-card .project-upload-box {
  min-height: 86px;
  padding: 8px;
}

.project-import-card #new-project-source-text {
  min-height: 78px;
  max-height: 84px;
  height: 84px;
}

.project-brand-kit-card,
.project-brand-kit-editor {
  background:
    linear-gradient(145deg, rgba(223, 255, 63, 0.72) 0 22%, transparent 22%),
    linear-gradient(25deg, rgba(103, 213, 232, 0.78), transparent 58%),
    #fff7ed;
}

.project-brand-kit-card {
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1fr);
  align-items: start;
}

.project-intake-main > .project-brand-kit-card {
  grid-template-columns: minmax(210px, 0.74fr) minmax(0, 0.8fr) minmax(0, 1fr);
  gap: 8px 10px;
  padding: 10px 12px;
}

.project-intake-side .project-brand-kit-card {
  grid-column: auto;
  grid-template-columns: 1fr;
  gap: 8px;
  padding: 12px;
}

.project-brand-kit-card .section-title {
  grid-column: 1 / -1;
}

.project-brand-kit-card .project-upload-box {
  grid-column: 1;
  grid-row: 2 / span 3;
  min-height: 96px;
}

.project-intake-side .project-brand-kit-card .project-upload-box {
  grid-row: auto;
  min-height: 0;
  padding: 8px;
}

.project-brand-kit-card #new-project-logo-output {
  grid-column: 1;
}

.project-intake-main > .project-brand-kit-card #new-project-logo-output {
  grid-column: 1;
  align-self: end;
}

.project-brand-kit-card .project-color-picker-grid,
.project-brand-kit-card > label:not(.project-upload-box),
.project-brand-kit-card .project-color-code-row {
  grid-column: 2;
}

.project-intake-main > .project-brand-kit-card .project-color-picker-grid {
  grid-column: 2;
  grid-row: 2 / span 2;
  align-self: end;
}

.project-intake-main > .project-brand-kit-card > label:not(.project-upload-box) {
  grid-column: 3;
  grid-row: 2 / span 2;
  align-self: end;
}

.project-intake-main > .project-brand-kit-card .project-color-code-row {
  grid-column: 2 / -1;
  grid-row: 4;
}

.project-intake-side .project-brand-kit-card .project-color-picker-grid,
.project-intake-side .project-brand-kit-card > label:not(.project-upload-box),
.project-intake-side .project-brand-kit-card .project-color-code-row {
  grid-column: 1;
}

.project-brand-kit-editor {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 10px;
  box-shadow: 5px 5px 0 #08090d;
}

.project-color-picker-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.project-color-picker-grid label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.project-color-picker-grid input[type="color"] {
  width: 100%;
  min-height: 38px;
  padding: 4px;
  cursor: pointer;
}

.project-color-code-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.project-color-code-row button {
  min-height: 38px;
  padding: 8px 10px;
  white-space: nowrap;
}

.project-color-code-row small {
  grid-column: 1 / -1;
  color: rgba(8, 9, 13, 0.58);
  font-size: 10px;
  font-weight: 800;
}

.project-intake-side .project-color-picker-grid {
  gap: 8px;
}

.project-intake-side .project-color-picker-grid input[type="color"] {
  min-height: 34px;
}

#new-project-logo-output,
#project-logo-output {
  display: block;
  min-height: 14px;
  color: rgba(8, 9, 13, 0.68);
  font-size: 11px;
  font-weight: 750;
}

.project-logo-preview {
  display: grid;
  min-height: 48px;
  place-items: center;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.05) 0 8px, transparent 8px 16px),
    rgba(255, 247, 237, 0.78);
  box-shadow: 3px 3px 0 #08090d;
  color: rgba(8, 9, 13, 0.48);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.project-logo-preview:not(.has-logo) {
  display: none;
}

.project-logo-preview img {
  max-width: 100%;
  max-height: 56px;
  object-fit: contain;
}

.project-intake-side .project-logo-preview {
  min-height: 38px;
  padding: 6px;
}

.project-intake-side .project-logo-preview img {
  max-height: 44px;
}

.project-intake-form label {
  color: #08090d;
  font-size: 11px;
  font-weight: 850;
}

.project-intake-form input,
.project-intake-form textarea,
.project-intake-form select {
  border: 2px solid #08090d;
  border-radius: 6px;
  background: rgba(255, 247, 237, 0.92);
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.project-intake-form textarea {
  min-height: 86px;
  resize: vertical;
}

.project-intake-form input::placeholder,
.project-intake-form textarea::placeholder {
  color: rgba(8, 9, 13, 0.42);
}

.project-intake-form .section-title h3,
.project-intake-form .project-upload-box span {
  color: #08090d;
}

.project-intake-form .project-upload-box {
  border: 2px dashed #08090d;
  border-radius: 8px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.05) 0 8px, transparent 8px 16px),
    rgba(255, 247, 237, 0.86);
  box-shadow: 3px 3px 0 #08090d;
}

.project-agent-fill-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 7px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(217, 255, 47, 0.82), transparent 48%),
    rgba(255, 247, 237, 0.9);
  box-shadow: 3px 3px 0 #08090d;
}

.project-agent-fill-button {
  min-height: 30px;
  padding: 6px 10px;
  border-width: 2px;
  font-size: 10px;
  white-space: nowrap;
}

#new-project-agent-output {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 750;
  line-height: 1.35;
}

.compact-memory-grid {
  gap: 9px;
}

.project-intake-side {
  display: grid;
  grid-template-rows: auto auto minmax(240px, 1fr);
  gap: 10px;
  align-content: start;
}

.project-agent-panel {
  padding: 12px;
}

.project-agent-panel h3 {
  margin: 4px 0 8px;
  color: #08090d;
  font-size: 18px;
}

.project-agent-panel ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.project-agent-panel li,
.project-agent-panel p {
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  line-height: 1.38;
}

.project-agent-panel li::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 999px;
  background: linear-gradient(135deg, #d9ff2f, #22d3ee);
}

.project-agent-panel.muted {
  display: grid;
  gap: 10px;
  align-content: start;
  min-height: 172px;
  background:
    linear-gradient(135deg, #b59cf6 0 36%, transparent 36%),
    #fff7ed;
}

.project-agent-panel.muted ul {
  gap: 7px;
  padding-top: 6px;
  border-top: 2px solid rgba(8, 9, 13, 0.16);
}

.project-memory-preview-panel {
  display: grid;
  gap: 10px;
  align-content: start;
  background:
    linear-gradient(145deg, rgba(103, 213, 232, 0.8) 0 28%, transparent 28%),
    #fff7ed;
}

.project-preview-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
}

.project-preview-heading strong {
  color: rgba(8, 9, 13, 0.68);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.project-memory-preview {
  min-height: 210px;
}

.project-memory-preview > p {
  display: grid;
  min-height: 190px;
  place-items: center;
  margin: 0;
  padding: 14px;
  border: 2px dashed #08090d;
  border-radius: 8px;
  background: rgba(255, 247, 237, 0.72);
  color: rgba(8, 9, 13, 0.58);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
}

.project-preview-card {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.04) 0 7px, transparent 7px 14px),
    rgba(255, 247, 237, 0.92);
  box-shadow: 3px 3px 0 #08090d;
}

.project-preview-card header {
  display: grid;
  gap: 3px;
}

.project-preview-card header span {
  color: #2563eb;
  font-size: 10px;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.project-preview-card h4 {
  margin: 0;
  color: #08090d;
  font-size: 18px;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.project-preview-card p {
  display: -webkit-box;
  margin: 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

.project-preview-grid {
  display: grid;
  gap: 6px;
}

.project-preview-row {
  display: grid;
  gap: 2px;
  padding: 7px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(223, 255, 63, 0.25);
}

.project-preview-row span {
  color: rgba(8, 9, 13, 0.52);
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}

.project-preview-row strong {
  display: -webkit-box;
  color: #08090d;
  font-size: 10px;
  line-height: 1.25;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.project-preview-row.is-missing {
  background: rgba(240, 74, 66, 0.12);
}

.project-preview-row.is-missing strong {
  color: rgba(8, 9, 13, 0.48);
}

.project-preview-palette {
  display: flex;
  gap: 6px;
  align-items: center;
}

.project-preview-palette i {
  width: 28px;
  height: 18px;
  border: 2px solid #08090d;
  border-radius: 5px;
  background: var(--swatch);
  box-shadow: 2px 2px 0 #08090d;
}

.project-advanced-memory {
  margin: 0 22px;
  padding: 0;
}

.project-advanced-memory summary {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 12px;
  cursor: pointer;
}

.project-advanced-memory summary span {
  color: #08090d;
  font-size: 13px;
  font-weight: 800;
}

.project-advanced-memory summary small {
  color: rgba(8, 9, 13, 0.56);
  font-size: 10px;
}

.project-advanced-memory .project-memory-grid {
  padding: 0 14px 14px;
}

.project-intake-actions {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 9px 22px 12px;
  border-top: 3px solid #08090d;
  background: #f4dfc4;
}

@media (max-width: 1040px) {
  .project-intake-shell,
  .project-intake-main {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 680px) {
  .project-intake-hero {
    grid-template-columns: 1fr auto;
  }

  .project-agent-mark {
    display: none;
  }

  .project-memory-grid {
    grid-template-columns: 1fr;
  }

  .project-intake-shell,
  .project-advanced-memory {
    margin: 0;
    padding-inline: 14px;
  }

  .project-intake-side {
    grid-template-columns: 1fr;
  }

  .project-agent-fill-row {
    grid-template-columns: 1fr;
  }

  .project-brand-kit-card {
    grid-template-columns: 1fr;
  }

  .project-brand-kit-card .project-upload-box,
  .project-brand-kit-card #new-project-logo-output,
  .project-brand-kit-card .project-color-picker-grid,
  .project-brand-kit-card > label:not(.project-upload-box) {
    grid-column: 1;
    grid-row: auto;
  }
}

.memory-scope-grid,
.project-memory-grid {
  display: grid;
  gap: 10px;
}

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

.memory-scope-grid article {
  min-height: 58px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.18), transparent 54%),
    rgba(255, 255, 255, 0.034);
}

.memory-scope-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.16), transparent 54%),
    rgba(255, 255, 255, 0.034);
}

.memory-scope-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.16), transparent 54%),
    rgba(255, 255, 255, 0.034);
}

.memory-scope-grid span {
  display: block;
  color: var(--white);
  font-size: 11px;
  font-weight: 750;
}

.memory-scope-grid small {
  display: block;
  margin-top: 4px;
  color: rgba(248, 250, 252, 0.54);
  font-size: 10px;
  line-height: 1.25;
}

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

.project-memory-grid .wide-field {
  grid-column: 1 / -1;
}

.project-upload-box {
  gap: 7px;
  padding: 10px;
  border: 1px dashed rgba(103, 232, 249, 0.26);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.08), transparent 58%),
    rgba(255, 255, 255, 0.026);
}

.project-upload-box span {
  color: rgba(248, 250, 252, 0.86);
  font-size: 11px;
  font-weight: 700;
}

.project-upload-box input {
  min-height: 32px;
}

.project-upload-box small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10px;
  line-height: 1.3;
}

.project-memory-drawer,
.billing-drawer {
  margin-bottom: 16px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.026);
}

.project-memory-drawer summary,
.billing-drawer summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  padding: 0 12px;
  cursor: pointer;
}

.project-memory-drawer summary span,
.billing-drawer summary span {
  color: var(--white);
  font-size: 13px;
  font-weight: 650;
}

.project-memory-drawer summary small,
.billing-drawer summary small {
  color: rgba(248, 250, 252, 0.5);
  font-size: 10.5px;
}

.project-memory-drawer .project-memory {
  margin: 0 12px 12px;
  background: transparent;
}

.billing-drawer {
  margin-top: 14px;
}

.billing-drawer .billing-grid,
.billing-drawer .topup-form,
.billing-drawer .plan-grid,
.billing-drawer .invoice-list,
.billing-drawer .event-list {
  margin: 12px;
}

@media (max-width: 1120px) {
  .creative-agent-console,
  .autopilot-console,
  .project-switcher {
    grid-template-columns: 1fr;
  }

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

  .module-kpi-grid,
  .settings-summary-grid,
  .settings-toggle-grid,
  .module-surface-grid,
  .report-grid,
  .report-paid-grid,
  .analytics-paid-grid,
  .admin-provider-guide-grid,
  .admin-provider-config-grid,
  .admin-ops-grid,
  .admin-command-grid,
  .admin-deep-grid,
  .admin-provider-readiness-summary,
  .admin-provider-config-summary,
  .admin-health-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .module-work-grid,
  .module-hero-strip {
    grid-template-columns: 1fr;
  }

  .ploxy-chat-body,
  .chat-composer-actions,
  .auto-cost-panel,
  .manual-provider-form {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 560px) {
  .automation-summary {
    grid-template-columns: 1fr;
  }

  .preview-shell {
    grid-template-columns: 1fr;
  }

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

  .preview-platforms {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .module-kpi-grid,
  .settings-summary-grid,
  .settings-toggle-grid,
  .module-surface-grid,
  .report-grid,
  .report-paid-grid,
  .analytics-paid-grid,
  .admin-provider-guide-grid,
  .admin-provider-config-grid,
  .admin-ops-grid,
  .admin-command-grid,
  .admin-deep-grid,
  .admin-provider-readiness-summary,
  .admin-provider-config-summary,
  .admin-provider-readiness-row,
  .admin-health-grid {
    grid-template-columns: 1fr;
  }

  .module-work-item {
    grid-template-columns: 30px minmax(0, 1fr);
  }

  .module-work-item b {
    grid-column: 2;
    text-align: left;
  }
}

/* Refresh guard: dashboard cards must be visible before any tab interaction. */
body.app-mode[data-active-view="dashboard"] .status-grid {
  display: grid;
}

body.app-mode .status-grid,
body.app-mode .content-grid.view-section.active {
  position: relative;
  z-index: 1;
  visibility: visible;
  opacity: 1;
  filter: none;
}

body.app-mode .performance-hero,
body.app-mode .campaign-panel,
body.app-mode .operations-panel,
body.app-mode .platform-panel,
body.app-mode .cost-panel {
  background: linear-gradient(135deg, #fff7ed, #f7dfc5);
  color: #08090d;
  opacity: 1;
  filter: none;
}

body.app-mode .performance-metrics article,
body.app-mode .campaign-summary > div,
body.app-mode .recommendation-card,
body.app-mode .platform-score-row,
body.app-mode .cost-row,
body.app-mode .agent-action,
body.app-mode .operation-button {
  border: 2px solid #08090d;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  opacity: 1;
}

/* Product-wide light surface pass: keep maximalism readable across every tab. */
body.app-mode {
  --line: rgba(8, 9, 13, 0.18);
  --surface: #fff7ed;
  --surface-strong: #f7dfc5;
  --surface-soft: rgba(255, 255, 255, 0.72);
  --mist: rgba(8, 9, 13, 0.68);
  --white: #08090d;
  color: #08090d;
}

body.app-mode .app-shell {
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.08) 0 1px, transparent 1px 100%),
    #f4dfc4 !important;
  background-size: 42px 42px !important;
}

body.app-mode .panel,
body.app-mode .metric-card,
body.app-mode .table-shell,
body.app-mode .creative-engine,
body.app-mode .admin-control-plane,
body.app-mode .admin-command-panel,
body.app-mode .admin-section,
body.app-mode .project-switcher,
body.app-mode .creative-preview-stage,
body.app-mode .module-surface-card,
body.app-mode .module-work-grid > article,
body.app-mode .campaign-dialog,
body.app-mode .growth-module-panel,
body.app-mode .reports-panel,
body.app-mode .telegram-module,
body.app-mode .connection-card,
body.app-mode .insight-card,
body.app-mode .plan-card,
body.app-mode .media-card,
body.app-mode .automation-row,
body.app-mode .roadmap-card,
body.app-mode .project-memory,
body.app-mode .provider-form,
body.app-mode .creative-form,
body.app-mode .settings-section,
body.app-mode .settings-summary-grid article,
body.app-mode .settings-toggle-grid .toggle-line,
body.app-mode .module-hero-strip,
body.app-mode .module-hero-strip strong,
body.app-mode .module-work-item,
body.app-mode .module-rule-item,
body.app-mode .admin-user-row,
body.app-mode .admin-stat-row,
body.app-mode .admin-alert-row,
body.app-mode .admin-cost-row,
body.app-mode .admin-module-row,
body.app-mode .queue-row,
body.app-mode .job-row,
body.app-mode .audit-row,
body.app-mode .event-list li,
body.app-mode .queue-list li,
body.app-mode fieldset {
  border-color: #08090d !important;
  background: linear-gradient(135deg, #fff7ed, #f7dfc5) !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: none !important;
}

body.app-mode .admin-control-grid,
body.app-mode .admin-feature-flags {
  gap: 14px !important;
}

body.app-mode .admin-control-grid label,
body.app-mode .admin-feature-flags label {
  border: 2px solid #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .admin-feature-flags label:nth-child(6n + 1) {
  background: #d5ff00 !important;
}

body.app-mode .admin-feature-flags label:nth-child(6n + 2) {
  background: #22d3ee !important;
}

body.app-mode .admin-feature-flags label:nth-child(6n + 3) {
  background: #ff9f1c !important;
}

body.app-mode .admin-feature-flags label:nth-child(6n + 4) {
  background: #ff6bcb !important;
}

body.app-mode .admin-feature-flags label:nth-child(6n + 5) {
  background: #2dd4bf !important;
}

body.app-mode .admin-feature-flags label:nth-child(6n) {
  background: #a78bfa !important;
}

body.app-mode .admin-feature-flags input {
  width: 15px !important;
  height: 15px !important;
  min-height: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

body.app-mode .admin-control-actions span {
  color: #08090d !important;
  font-weight: 700;
}

body.app-mode .ploxy-chat-panel {
  background:
    linear-gradient(135deg, rgba(139, 92, 246, 0.30), rgba(34, 211, 238, 0.12)),
    #f7dfc5 !important;
}

body.app-mode .manual-studio-panel,
body.app-mode .creative-mode-switch,
body.app-mode .auto-cost-panel div,
body.app-mode .manual-cost-row {
  border-color: #08090d !important;
  background: linear-gradient(135deg, #fff7ed, #f7dfc5) !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode .creative-mode-switch button {
  border-color: #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
}

body.app-mode .creative-mode-switch button span {
  color: #08090d !important;
}

body.app-mode .creative-mode-switch button.active {
  border-color: #08090d !important;
  background: linear-gradient(90deg, #d5ff00, #22d3ee) !important;
  color: #08090d !important;
}

body.app-mode .auto-cost-panel strong,
body.app-mode .auto-cost-panel small,
body.app-mode .manual-cost-row span,
body.app-mode .manual-cost-row small,
body.app-mode .manual-provider-form label {
  color: #08090d !important;
}

body.app-mode .campaign-brief-banner {
  border-color: #08090d !important;
  background:
    linear-gradient(90deg, #f85b4f 0 18%, #d5ff00 18% 36%, #22d3ee 36% 58%, #8b5cf6 58% 100%) !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode .campaign-brief-banner strong,
body.app-mode .campaign-brief-banner small {
  color: #08090d !important;
}

body.app-mode .product-loop div,
body.app-mode .pipeline-step,
body.app-mode .campaign-summary div,
body.app-mode .estimate-card,
body.app-mode .subscription-summary div,
body.app-mode .plan-usage-grid article,
body.app-mode .automation-summary div,
body.app-mode .recommendation-card,
body.app-mode .platform-score-row,
body.app-mode .cost-row,
body.app-mode .agent-action,
body.app-mode .operation-button,
body.app-mode .size-preview,
body.app-mode .provider-output,
body.app-mode .export-box,
body.app-mode .media-meta span {
  border: 2px solid #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .eyebrow,
body.app-mode .metric-label,
body.app-mode .panel-header .eyebrow,
body.app-mode .module-kpi-grid .eyebrow,
body.app-mode .automation-summary .eyebrow,
body.app-mode .subscription-summary .eyebrow,
body.app-mode .plan-usage-grid .eyebrow,
body.app-mode .admin-summary .metric-label,
body.app-mode .preview-meta-line strong {
  background: none !important;
  -webkit-text-fill-color: #08090d;
  color: #08090d !important;
}

body.app-mode h2,
body.app-mode h3,
body.app-mode h4,
body.app-mode strong,
body.app-mode p,
body.app-mode small,
body.app-mode label,
body.app-mode legend,
body.app-mode td,
body.app-mode th,
body.app-mode .event-list strong,
body.app-mode .event-list small,
body.app-mode .queue-list strong,
body.app-mode .queue-list small,
body.app-mode .connection-card p,
body.app-mode .connection-card small,
body.app-mode .insight-card p,
body.app-mode .plan-card p,
body.app-mode .media-card p,
body.app-mode .settings-summary-grid small,
body.app-mode .operation-button span,
body.app-mode .chat-message p,
body.app-mode .chat-message strong {
  color: #08090d !important;
}

body.app-mode input,
body.app-mode select,
body.app-mode textarea {
  border: 2px solid #08090d !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .secondary-action,
body.app-mode .icon-button,
body.app-mode .table-action,
body.app-mode .connection-card button,
body.app-mode .plan-card button,
body.app-mode .media-schedule,
body.app-mode .operation-button,
body.app-mode .queue-actions button,
body.app-mode .creative-tool-strip button,
body.app-mode .preview-mode-tabs button,
body.app-mode .preview-platforms button,
body.app-mode .cost-mode-trigger,
body.app-mode .send-icon-button {
  border: 2px solid #08090d !important;
  background: #f7dfc5 !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .dashboard-agent-action,
body.app-mode .operation-button[data-dashboard-agent-prompt] {
  cursor: pointer;
}

body.app-mode .dashboard-agent-action:hover,
body.app-mode .operation-button[data-dashboard-agent-prompt]:hover {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode .dashboard-agent-action:disabled,
body.app-mode .operation-button[data-dashboard-agent-prompt]:disabled {
  cursor: wait;
  filter: saturate(0.8);
  opacity: 0.82;
}

body.app-mode .permission-locked,
body.app-mode button.permission-locked,
body.app-mode input.permission-locked,
body.app-mode select.permission-locked,
body.app-mode textarea.permission-locked {
  cursor: not-allowed !important;
  opacity: 0.52 !important;
  filter: grayscale(0.35) !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode form.permission-locked,
body.app-mode fieldset.permission-locked {
  position: relative;
}

body.app-mode form.permission-locked::after,
body.app-mode fieldset.permission-locked::after {
  content: "Role locked";
  position: absolute;
  top: 10px;
  right: 10px;
  border: 2px solid #08090d;
  background: #f85b4f;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  padding: 4px 8px;
  font-family: var(--mono);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.app-mode .badge,
body.app-mode .live {
  border-color: #08090d !important;
  background: #d5ff00 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .badge.warning {
  background: #ffb4a9 !important;
  color: #08090d !important;
}

/* Restore Polxy colour to KPI boxes without changing copy colour. */
body.app-mode .status-grid .metric-card:nth-child(4n + 1),
body.app-mode .admin-summary .metric-card:nth-child(4n + 1),
body.app-mode .analytics-grid .metric-card:nth-child(4n + 1),
body.app-mode .billing-grid .metric-card:nth-child(4n + 1),
body.app-mode .module-kpi-grid article:nth-child(4n + 1),
body.app-mode .automation-summary div:nth-child(4n + 1),
body.app-mode .subscription-summary div:nth-child(4n + 1),
body.app-mode .settings-summary-grid article:nth-child(4n + 1),
body.app-mode .campaign-summary div:nth-child(4n + 1),
body.app-mode .routing-summary > *:nth-child(4n + 1),
body.app-mode .job-summary > *:nth-child(4n + 1),
body.app-mode .admin-health-grid > *:nth-child(4n + 1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #d5ff00 !important;
}

body.app-mode .status-grid .metric-card:nth-child(4n + 2),
body.app-mode .admin-summary .metric-card:nth-child(4n + 2),
body.app-mode .analytics-grid .metric-card:nth-child(4n + 2),
body.app-mode .billing-grid .metric-card:nth-child(4n + 2),
body.app-mode .module-kpi-grid article:nth-child(4n + 2),
body.app-mode .automation-summary div:nth-child(4n + 2),
body.app-mode .subscription-summary div:nth-child(4n + 2),
body.app-mode .settings-summary-grid article:nth-child(4n + 2),
body.app-mode .campaign-summary div:nth-child(4n + 2),
body.app-mode .routing-summary > *:nth-child(4n + 2),
body.app-mode .job-summary > *:nth-child(4n + 2),
body.app-mode .admin-health-grid > *:nth-child(4n + 2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #22d3ee !important;
}

body.app-mode .status-grid .metric-card:nth-child(4n + 3),
body.app-mode .admin-summary .metric-card:nth-child(4n + 3),
body.app-mode .analytics-grid .metric-card:nth-child(4n + 3),
body.app-mode .billing-grid .metric-card:nth-child(4n + 3),
body.app-mode .module-kpi-grid article:nth-child(4n + 3),
body.app-mode .automation-summary div:nth-child(4n + 3),
body.app-mode .subscription-summary div:nth-child(4n + 3),
body.app-mode .settings-summary-grid article:nth-child(4n + 3),
body.app-mode .campaign-summary div:nth-child(4n + 3),
body.app-mode .routing-summary > *:nth-child(4n + 3),
body.app-mode .job-summary > *:nth-child(4n + 3),
body.app-mode .admin-health-grid > *:nth-child(4n + 3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 66%),
    #a78bfa !important;
}

body.app-mode .status-grid .metric-card:nth-child(4n),
body.app-mode .admin-summary .metric-card:nth-child(4n),
body.app-mode .analytics-grid .metric-card:nth-child(4n),
body.app-mode .billing-grid .metric-card:nth-child(4n),
body.app-mode .module-kpi-grid article:nth-child(4n),
body.app-mode .automation-summary div:nth-child(4n),
body.app-mode .subscription-summary div:nth-child(4n),
body.app-mode .settings-summary-grid article:nth-child(4n),
body.app-mode .campaign-summary div:nth-child(4n),
body.app-mode .routing-summary > *:nth-child(4n),
body.app-mode .job-summary > *:nth-child(4n),
body.app-mode .admin-health-grid > *:nth-child(4n) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #10f0a1 !important;
}

/* Distinct growth module layouts: SEO, Community, and Telegram should not feel templated. */
body.app-mode .seo-command-hero,
body.app-mode .community-command-hero,
body.app-mode .telegram-command-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.48fr) auto;
  gap: 12px;
  align-items: stretch;
  margin-bottom: 12px;
}

body.app-mode .seo-command-hero > div,
body.app-mode .community-command-hero > div,
body.app-mode .telegram-command-hero > div {
  border: 3px solid #08090d;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
  color: #08090d;
}

body.app-mode .seo-command-hero > div:first-child,
body.app-mode .community-command-hero > div:first-child,
body.app-mode .telegram-command-hero > div:first-child {
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 15px;
}

body.app-mode .seo-command-hero strong,
body.app-mode .community-command-hero strong,
body.app-mode .telegram-command-hero strong {
  font-size: 20px;
  line-height: 1.1;
}

body.app-mode .seo-command-hero .primary-action,
body.app-mode .community-command-hero .primary-action,
body.app-mode .telegram-command-hero .primary-action {
  align-self: stretch;
  min-width: 138px;
}

body.app-mode .seo-command-hero > div:first-child {
  background:
    linear-gradient(120deg, rgba(34, 211, 238, 0.28), transparent 45%),
    #fff7ed !important;
}

body.app-mode .seo-query-bar {
  display: grid;
  gap: 3px;
  margin-top: 8px;
  padding: 10px;
  border: 2px solid #08090d;
  background: #d5ff00;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode .seo-query-bar span,
body.app-mode .seo-serp-card span,
body.app-mode .community-alert-stack span,
body.app-mode .telegram-phone-preview span,
body.app-mode .telegram-console-card div span {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

body.app-mode .seo-serp-card {
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.46), transparent 55%),
    #22d3ee !important;
}

body.app-mode .seo-serp-card strong {
  color: #234eff !important;
}

body.app-mode .seo-workbench-grid {
  display: grid;
  grid-template-columns: 1.05fr repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode .seo-rank-map {
  display: grid;
  gap: 7px;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 58%),
    #a78bfa !important;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .seo-rank-map div {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 7px;
  border: 2px solid #08090d;
  background: #fff7ed;
}

body.app-mode .seo-rank-map b {
  display: grid;
  place-items: center;
  min-height: 28px;
  background: #d5ff00;
}

body.app-mode .seo-task-card {
  min-height: 156px;
}

body.app-mode .seo-pipeline-grid {
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

body.app-mode .community-command-hero > div:first-child {
  background:
    linear-gradient(120deg, rgba(16, 240, 161, 0.30), transparent 48%),
    #fff7ed !important;
}

body.app-mode .community-alert-stack {
  display: grid;
  gap: 8px;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ff3134 !important;
}

body.app-mode .community-alert-stack span {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 2px solid #08090d;
  background: #fff7ed;
}

body.app-mode .community-alert-stack b {
  display: grid;
  place-items: center;
  min-height: 30px;
  background: #d5ff00;
}

body.app-mode .community-board {
  display: grid;
  grid-template-columns: 1.1fr 0.95fr 0.95fr;
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode .community-lane {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 192px;
  padding: 13px;
  border: 3px solid #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .risk-lane {
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.10) 0 8px, transparent 8px 16px),
    #ff3134 !important;
}

body.app-mode .journey-lane {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #10f0a1 !important;
}

body.app-mode .growth-lane {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #a78bfa !important;
}

body.app-mode .community-lane small {
  display: block;
  margin-top: auto;
  padding: 8px;
  border: 2px solid #08090d;
  background: #fff7ed;
}

body.app-mode .community-flow-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: 10px;
}

body.app-mode .telegram-command-hero > div:first-child {
  background:
    linear-gradient(120deg, rgba(34, 211, 238, 0.30), transparent 46%),
    #fff7ed !important;
}

body.app-mode .telegram-phone-preview {
  display: grid;
  align-content: center;
  gap: 8px;
  min-height: 172px;
  padding: 16px;
  border-radius: 26px !important;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.42), transparent 58%),
    #22d3ee !important;
}

body.app-mode .telegram-phone-preview::before {
  width: 54px;
  height: 5px;
  margin: 0 auto 4px;
  border: 2px solid #08090d;
  border-radius: 999px;
  content: "";
  background: #fff7ed;
}

body.app-mode .telegram-console-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode .telegram-console-card {
  display: grid;
  gap: 8px;
  min-height: 178px;
  padding: 13px;
  border: 3px solid #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .channel-card {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #22d3ee !important;
}

body.app-mode .bot-card {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #d5ff00 !important;
}

body.app-mode .commerce-card {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #a78bfa !important;
}

body.app-mode .telegram-console-card div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  margin-top: auto;
}

body.app-mode .telegram-console-card div span {
  display: grid;
  place-items: center;
  min-height: 28px;
  border: 2px solid #08090d;
  background: #fff7ed;
}

body.app-mode .telegram-work-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 10px;
}

@media (max-width: 1180px) {
  body.app-mode .seo-command-hero,
  body.app-mode .community-command-hero,
  body.app-mode .telegram-command-hero,
  body.app-mode .seo-workbench-grid,
  body.app-mode .community-board,
  body.app-mode .telegram-console-grid,
  body.app-mode .seo-pipeline-grid,
  body.app-mode .community-flow-grid,
  body.app-mode .telegram-work-grid {
    grid-template-columns: 1fr;
  }
}

/* Action-first MVP layer: make each tab feel like a Polxy workbench. */
body.app-mode .agent-action-panel,
body.app-mode .connection-action-board,
body.app-mode .seo-action-console,
body.app-mode .community-action-console,
body.app-mode .telegram-action-console {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

body.app-mode .analytics-actions,
body.app-mode .queue-actions-panel,
body.app-mode .report-actions,
body.app-mode .brand-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode .brand-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 12px;
}

body.app-mode .agent-action-panel button,
body.app-mode .connection-action-board button,
body.app-mode .seo-action-console button,
body.app-mode .community-action-console button,
body.app-mode .telegram-action-console button {
  display: grid;
  align-content: start;
  gap: 5px;
  min-height: 86px;
  padding: 11px;
  border: 3px solid #08090d !important;
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #d5ff00 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
  text-align: left;
  cursor: pointer;
}

body.app-mode .agent-action-panel button:nth-child(4n + 2),
body.app-mode .connection-action-board button:nth-child(4n + 2),
body.app-mode .seo-action-console button:nth-child(4n + 2),
body.app-mode .community-action-console button:nth-child(4n + 2),
body.app-mode .telegram-action-console button:nth-child(4n + 2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #22d3ee !important;
}

body.app-mode .agent-action-panel button:nth-child(4n + 3),
body.app-mode .connection-action-board button:nth-child(4n + 3),
body.app-mode .seo-action-console button:nth-child(4n + 3),
body.app-mode .community-action-console button:nth-child(4n + 3),
body.app-mode .telegram-action-console button:nth-child(4n + 3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #a78bfa !important;
}

body.app-mode .agent-action-panel button:nth-child(4n),
body.app-mode .connection-action-board button:nth-child(4n),
body.app-mode .seo-action-console button:nth-child(4n),
body.app-mode .community-action-console button:nth-child(4n),
body.app-mode .telegram-action-console button:nth-child(4n) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #10f0a1 !important;
}

body.app-mode .agent-action-panel span,
body.app-mode .connection-action-board span,
body.app-mode .seo-action-console span,
body.app-mode .community-action-console span,
body.app-mode .telegram-action-console span {
  width: fit-content;
  padding: 4px 6px;
  border: 2px solid #08090d;
  background: #fff7ed;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
  text-transform: uppercase;
}

body.app-mode .agent-action-panel strong,
body.app-mode .connection-action-board strong,
body.app-mode .seo-action-console strong,
body.app-mode .community-action-console strong,
body.app-mode .telegram-action-console strong {
  color: #08090d !important;
  font-size: 13px;
  line-height: 1.16;
}

body.app-mode .connection-action-board small {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px;
  line-height: 1.3;
}

body.app-mode .ad-launch-console {
  display: grid;
  grid-template-columns: 1fr 1fr 0.7fr 0.55fr 1.35fr 1.35fr auto;
  gap: 8px;
  align-items: end;
  margin-bottom: 12px;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(100deg, rgba(255, 49, 52, 0.20), rgba(34, 211, 238, 0.16) 55%, rgba(16, 240, 161, 0.18)),
    #fff7ed;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .ad-launch-console .wide-field {
  min-width: 0;
}

body.app-mode .ad-launch-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #10f0a1;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .ads-plan-list {
  margin-bottom: 10px;
}

body.app-mode .page-builder-console {
  display: grid;
  grid-template-columns: 1fr 1fr 1.25fr 1.25fr;
  gap: 8px;
  align-items: end;
  margin-bottom: 14px;
  padding: 12px;
  border: 3px solid #08090d;
  background: #f8fbf0;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .page-builder-console .wide-field {
  grid-column: span 2;
  min-width: 0;
}

body.app-mode .page-builder-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #dfff3f;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .page-builder-grid {
  grid-template-columns: minmax(280px, 0.85fr) minmax(340px, 1.15fr);
}

body.app-mode .page-draft-item.selected {
  background: #f2ffd2;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .page-draft-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.app-mode .page-draft-actions button {
  border: 2px solid #08090d;
  background: #ffffff;
  color: #08090d;
  font-weight: 800;
  padding: 7px 9px;
  cursor: pointer;
}

body.app-mode .page-preview-panel {
  display: grid;
  gap: 12px;
}

body.app-mode .page-preview-card {
  border: 3px solid #08090d;
  background: #ffffff;
  padding: 16px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .page-preview-card h3 {
  margin: 6px 0 8px;
  font-size: clamp(24px, 3vw, 40px);
  line-height: 0.98;
  letter-spacing: 0;
}

body.app-mode .page-preview-card p {
  margin: 0 0 10px;
  color: rgba(8, 9, 13, 0.78);
  font-size: 14px;
  line-height: 1.45;
}

body.app-mode .page-preview-card button {
  border: 2px solid #08090d;
  background: #08090d;
  color: #ffffff;
  padding: 9px 12px;
  font-weight: 850;
}

body.app-mode .page-preview-sections,
body.app-mode .page-tracking-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .page-preview-sections article,
body.app-mode .page-tracking-grid article {
  border: 2px solid #08090d;
  background: #ffffff;
  padding: 10px;
}

body.app-mode .page-preview-sections strong,
body.app-mode .page-tracking-grid strong {
  display: block;
  color: #08090d;
  font-size: 13px;
  line-height: 1.2;
}

body.app-mode .page-preview-sections small,
body.app-mode .page-tracking-grid span {
  display: block;
  color: rgba(8, 9, 13, 0.7);
  font-size: 11px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.app-mode .page-field-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.app-mode .page-field-chips span {
  border: 2px solid #08090d;
  background: #eef7ff;
  color: #08090d;
  padding: 6px 8px;
  font-size: 11px;
  font-weight: 800;
}

body.app-mode .influencer-discovery-console {
  display: grid;
  grid-template-columns: 1fr 0.7fr 1fr 1.2fr;
  gap: 8px;
  align-items: end;
  margin-bottom: 14px;
  padding: 12px;
  border: 3px solid #08090d;
  background: #fff7ed;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .influencer-discovery-console .wide-field {
  grid-column: span 2;
  min-width: 0;
}

body.app-mode .influencer-discovery-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #ffb84d;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .influencer-work-grid {
  grid-template-columns: minmax(300px, 0.9fr) minmax(340px, 1.1fr);
}

body.app-mode .creator-profile-item.selected {
  background: #fff0d8;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .creator-profile-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.app-mode .creator-profile-actions button {
  border: 2px solid #08090d;
  background: #ffffff;
  color: #08090d;
  font-weight: 800;
  padding: 7px 9px;
  cursor: pointer;
}

body.app-mode .creator-profile-panel {
  display: grid;
  gap: 12px;
}

body.app-mode .creator-review-card {
  border: 3px solid #08090d;
  background: #ffffff;
  padding: 16px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .creator-review-card h3 {
  margin: 6px 0 8px;
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1;
  letter-spacing: 0;
}

body.app-mode .creator-review-card p {
  margin: 0 0 10px;
  color: rgba(8, 9, 13, 0.78);
  font-size: 14px;
  line-height: 1.45;
}

body.app-mode .creator-score-grid,
body.app-mode .creator-profile-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .creator-score-grid article,
body.app-mode .creator-profile-meta article {
  border: 2px solid #08090d;
  background: #ffffff;
  padding: 10px;
}

body.app-mode .creator-score-grid strong,
body.app-mode .creator-profile-meta strong {
  display: block;
  color: #08090d;
  font-size: 14px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode .creator-score-grid span,
body.app-mode .creator-profile-meta span {
  display: block;
  color: rgba(8, 9, 13, 0.7);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
  text-transform: uppercase;
}

body.app-mode .outreach-deal-console {
  display: grid;
  grid-template-columns: 0.9fr 0.9fr 0.9fr 0.6fr;
  gap: 8px;
  align-items: end;
  margin-bottom: 14px;
  padding: 12px;
  border: 3px solid #08090d;
  background: #effcf3;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .outreach-deal-console .wide-field {
  grid-column: span 2;
  min-width: 0;
}

body.app-mode .outreach-source-map {
  display: flex;
  min-width: 0;
  min-height: 52px;
  align-items: center;
  align-self: stretch;
  gap: 6px;
  flex-wrap: wrap;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.68);
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85);
}

body.app-mode .outreach-source-map span,
body.app-mode .outreach-source-map small {
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 900;
  line-height: 1.15;
}

body.app-mode .outreach-source-map span {
  flex-basis: 100%;
  text-transform: uppercase;
}

body.app-mode .outreach-source-map strong {
  min-width: 0;
  border: 1.5px solid rgba(8, 9, 13, 0.62);
  border-radius: 999px;
  padding: 4px 6px;
  background: #ffffff;
  color: #08090d;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

body.app-mode .outreach-source-map small {
  flex-basis: 100%;
}

body.app-mode .outreach-deal-console textarea {
  min-height: 76px;
  resize: vertical;
}

body.app-mode .outreach-deal-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #69e6a3;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .outreach-work-grid {
  grid-template-columns: minmax(300px, 0.9fr) minmax(360px, 1.1fr);
}

body.app-mode .outreach-thread-item.selected {
  background: #ecfff1;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .outreach-thread-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.app-mode .outreach-thread-actions button {
  border: 2px solid #08090d;
  background: #ffffff;
  color: #08090d;
  font-weight: 800;
  padding: 7px 9px;
  cursor: pointer;
}

body.app-mode .outreach-export-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

body.app-mode .outreach-source-proof {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 10px;
  align-items: center;
  margin-top: 12px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode .outreach-source-proof span,
body.app-mode .outreach-source-proof small {
  color: rgba(8, 9, 13, 0.65);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

body.app-mode .outreach-source-proof strong {
  min-width: 0;
  color: #08090d;
  font-size: 13px;
  line-height: 1.1;
}

body.app-mode .outreach-source-proof a {
  grid-row: span 2;
  border: 2px solid #08090d;
  border-radius: 999px;
  padding: 6px 9px;
  background: #d9ff2f;
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 1px 1px 0 #08090d;
}

body.app-mode .outreach-export-actions button,
body.app-mode .outreach-export-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  border: 2px solid #08090d;
  border-radius: 7px;
  padding: 7px 10px;
  background: #ffffff;
  color: #08090d;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  box-shadow: 2px 2px 0 #08090d;
  cursor: pointer;
}

body.app-mode .outreach-thread-panel {
  display: grid;
  gap: 12px;
}

body.app-mode .outreach-review-card {
  border: 3px solid #08090d;
  background: #ffffff;
  padding: 16px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .outreach-review-card h3 {
  margin: 6px 0 8px;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1;
  letter-spacing: 0;
}

body.app-mode .outreach-review-card p {
  margin: 0 0 10px;
  color: rgba(8, 9, 13, 0.78);
  font-size: 14px;
  line-height: 1.45;
}

body.app-mode .outreach-message-block {
  display: grid;
  gap: 8px;
}

body.app-mode .outreach-message-block article {
  border: 2px solid #08090d;
  background: #ffffff;
  padding: 12px;
}

body.app-mode .outreach-message-block p {
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.82);
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

body.app-mode .outreach-terms-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .outreach-terms-grid article {
  border: 2px solid #08090d;
  background: #ffffff;
  padding: 10px;
}

body.app-mode .outreach-terms-grid span {
  display: block;
  color: rgba(8, 9, 13, 0.7);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
  text-transform: uppercase;
}

body.app-mode .outreach-terms-grid strong {
  display: block;
  color: #08090d;
  font-size: 14px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode .affiliate-program-console {
  display: grid;
  grid-template-columns: 0.9fr 0.75fr 0.7fr 1fr;
  gap: 8px;
  align-items: end;
  margin-bottom: 14px;
  padding: 12px;
  border: 3px solid #08090d;
  background: #f3efff;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .affiliate-program-console .wide-field {
  grid-column: span 2;
  min-width: 0;
}

body.app-mode .affiliate-program-console textarea {
  min-height: 76px;
  resize: vertical;
}

body.app-mode .affiliate-program-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #f0a8ff;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .affiliate-work-grid {
  grid-template-columns: minmax(300px, 0.9fr) minmax(360px, 1.1fr);
}

body.app-mode .affiliate-program-item.selected {
  background: #f7efff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .affiliate-program-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.app-mode .affiliate-program-actions button {
  border: 2px solid #08090d;
  background: #ffffff;
  color: #08090d;
  font-weight: 800;
  padding: 7px 9px;
  cursor: pointer;
}

body.app-mode .affiliate-program-panel {
  display: grid;
  gap: 12px;
}

body.app-mode .affiliate-review-card,
body.app-mode .affiliate-link-grid article,
body.app-mode .affiliate-media-kit article,
body.app-mode .affiliate-event-ledger {
  border: 3px solid #08090d;
  background: #ffffff;
  padding: 14px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .affiliate-review-card h3 {
  margin: 6px 0 8px;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1;
  letter-spacing: 0;
}

body.app-mode .affiliate-review-card p,
body.app-mode .affiliate-link-grid p,
body.app-mode .affiliate-media-kit p {
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.82);
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

body.app-mode .affiliate-link-grid,
body.app-mode .affiliate-media-kit,
body.app-mode .affiliate-event-ledger {
  display: grid;
  gap: 8px;
}

body.app-mode .affiliate-link-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-mode .affiliate-link-grid small,
body.app-mode .affiliate-event-ledger small {
  display: block;
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.app-mode .affiliate-event-ledger article {
  border: 2px solid #08090d;
  background: #fffaf0;
  padding: 10px;
}

body.app-mode .affiliate-event-ledger span {
  display: block;
  color: rgba(8, 9, 13, 0.8);
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.app-mode .community-hero-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.app-mode .community-discovery-console {
  display: grid;
  grid-template-columns: 0.8fr 1fr 1fr 1.1fr;
  gap: 8px;
  align-items: end;
  margin: 14px 0;
  padding: 12px;
  border: 3px solid #08090d;
  background: #ecfbff;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .community-discovery-console .wide-field {
  grid-column: span 3;
  min-width: 0;
}

body.app-mode .community-discovery-console textarea {
  min-height: 76px;
  resize: vertical;
}

body.app-mode .community-discovery-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #67d5e8;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .community-discovery-grid {
  grid-template-columns: minmax(300px, 0.95fr) minmax(360px, 1.05fr);
  margin: 14px 0;
}

body.app-mode .community-target-item.selected {
  background: #ecfbff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .community-target-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

body.app-mode .community-target-actions button {
  border: 2px solid #08090d;
  background: #ffffff;
  color: #08090d;
  font-weight: 800;
  padding: 7px 9px;
  cursor: pointer;
}

body.app-mode .community-target-panel {
  display: grid;
  gap: 12px;
}

body.app-mode .community-review-card,
body.app-mode .community-theme-grid article,
body.app-mode .community-prompt-grid article {
  border: 3px solid #08090d;
  background: #ffffff;
  padding: 14px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .community-review-card h3 {
  margin: 6px 0 8px;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1;
  letter-spacing: 0;
}

body.app-mode .community-review-card p,
body.app-mode .community-theme-grid p,
body.app-mode .community-prompt-grid p {
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.82);
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

body.app-mode .community-theme-grid,
body.app-mode .community-prompt-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .reach-message-console {
  display: grid;
  grid-template-columns: 0.9fr 1fr 1fr 1fr;
  gap: 8px;
  align-items: end;
  margin: 14px 0;
  padding: 12px;
  border: 3px solid #08090d;
  background: #f4ffe0;
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode .reach-message-console .wide-field {
  grid-column: span 3;
  min-width: 0;
}

body.app-mode .reach-message-console textarea {
  min-height: 76px;
  resize: vertical;
}

body.app-mode .reach-message-console button {
  min-height: 38px;
  border: 2px solid #08090d;
  background: #dfff3f;
  color: #08090d;
  font-weight: 850;
  box-shadow: 4px 4px 0 #08090d;
  cursor: pointer;
  white-space: normal;
  line-height: 1.05;
}

body.app-mode .reach-work-grid {
  grid-template-columns: minmax(300px, 0.95fr) minmax(380px, 1.05fr);
  margin: 14px 0;
}

body.app-mode .reach-message-item.selected {
  background: #f4ffe0;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .reach-message-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}

body.app-mode .reach-message-actions button {
  border: 2px solid #08090d;
  background: #ffffff;
  color: #08090d;
  font-weight: 800;
  padding: 7px 9px;
  cursor: pointer;
}

body.app-mode .reach-message-panel {
  display: grid;
  gap: 12px;
}

body.app-mode .reach-review-card,
body.app-mode .reach-source-card,
body.app-mode .reach-adaptation-grid article {
  border: 3px solid #08090d;
  background: #ffffff;
  padding: 14px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .reach-review-card h3 {
  margin: 6px 0 8px;
  font-size: clamp(22px, 2.4vw, 32px);
  line-height: 1;
  letter-spacing: 0;
}

body.app-mode .reach-review-card p,
body.app-mode .reach-source-card p,
body.app-mode .reach-adaptation-grid p {
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.82);
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

body.app-mode .reach-source-card strong {
  display: block;
  margin-top: 5px;
  color: #08090d;
  font-size: 14px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode .reach-source-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
}

body.app-mode .reach-source-actions a,
body.app-mode .reach-evidence-list a {
  color: #08090d;
  font-weight: 900;
  text-decoration: none;
}

body.app-mode .reach-source-actions a {
  border: 2px solid #08090d;
  border-radius: 999px;
  padding: 6px 9px;
  background: #d9ff2f;
  font-size: 10px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode .reach-source-actions small,
body.app-mode .reach-evidence-list small {
  color: rgba(8, 9, 13, 0.68);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.24;
}

body.app-mode .reach-evidence-list {
  display: grid;
  gap: 5px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 2px solid rgba(8, 9, 13, 0.12);
}

body.app-mode .reach-adaptation-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .reach-adaptation-grid small {
  display: block;
  margin-top: 8px;
  color: rgba(8, 9, 13, 0.68);
  font-size: 11px;
  font-weight: 750;
  overflow-wrap: anywhere;
}

body.app-mode .paid-plan-card {
  align-items: start;
}

body.app-mode .paid-plan-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}

body.app-mode .paid-plan-tags em {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #fffaf0;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

body.app-mode .source-backed-evidence {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  align-items: center;
  min-width: 0;
  max-width: 100%;
}

body.app-mode .source-backed-evidence span,
body.app-mode .source-backed-evidence a,
body.app-mode .source-backed-evidence small {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  min-width: 0;
  max-width: min(100%, 320px);
  padding: 4px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #eef7ff;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  line-height: 1.2;
  overflow-wrap: anywhere;
  white-space: normal;
  text-decoration: none;
  text-transform: none;
}

body.app-mode .source-backed-evidence span {
  background: #08090d;
  color: #ffffff;
}

body.app-mode .creative-actions {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

body.app-mode .creative-actions button {
  min-height: 74px;
}

body.app-mode .automation-actions button,
body.app-mode .campaign-actions button,
body.app-mode .queue-actions-panel button,
body.app-mode .analytics-actions button,
body.app-mode .report-actions button,
body.app-mode .brand-actions button {
  min-height: 76px;
}

body.app-mode .automation-actions button:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ff9f1c !important;
}

body.app-mode .automation-actions button:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #ff6bcb !important;
}

body.app-mode .automation-actions button:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #2dd4bf !important;
}

body.app-mode .automation-actions button:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #facc15 !important;
}

body.app-mode .automation-agent-console,
body.app-mode .campaign-agent-console,
body.app-mode .queue-agent-console,
body.app-mode .connection-agent-console,
body.app-mode .analytics-agent-console,
body.app-mode .ads-agent-console {
  gap: 20px;
}

body.app-mode .automation-agent-response,
body.app-mode .automation-agent-form,
body.app-mode .automation-agent-recommendations article,
body.app-mode .campaign-agent-response,
body.app-mode .campaign-agent-form,
body.app-mode .campaign-agent-recommendations article,
body.app-mode .campaign-agent-status-grid article,
body.app-mode .queue-agent-response,
body.app-mode .queue-agent-form,
body.app-mode .queue-agent-recommendations article,
body.app-mode .queue-agent-status-grid article,
body.app-mode .connection-agent-response,
body.app-mode .connection-agent-form,
body.app-mode .connection-agent-recommendations article,
body.app-mode .connection-agent-status-grid article,
body.app-mode .analytics-agent-response,
body.app-mode .analytics-agent-form,
body.app-mode .analytics-agent-recommendations article,
body.app-mode .analytics-agent-status-grid article,
body.app-mode .ads-agent-response,
body.app-mode .ads-agent-form,
body.app-mode .ads-agent-recommendations article,
body.app-mode .ads-agent-status-grid article,
body.app-mode .ads-account-card {
  border: 3px solid #08090d;
  border-radius: 9px;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .automation-agent-response,
body.app-mode .campaign-agent-response,
body.app-mode .queue-agent-response,
body.app-mode .connection-agent-response,
body.app-mode .analytics-agent-response {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.42), transparent 62%),
    #67d5e8;
}

body.app-mode .ads-agent-response {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.42), transparent 62%),
    #67d5e8;
}

body.app-mode .automation-agent-form,
body.app-mode .campaign-agent-form,
body.app-mode .queue-agent-form,
body.app-mode .connection-agent-form,
body.app-mode .analytics-agent-form {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #fff7ed;
}

body.app-mode .ads-agent-form {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #fff7ed;
}

body.app-mode .automation-agent-response strong,
body.app-mode .automation-agent-response small,
body.app-mode .automation-agent-recommendations article strong,
body.app-mode .automation-agent-shortcuts button,
body.app-mode .campaign-agent-response strong,
body.app-mode .campaign-agent-response small,
body.app-mode .campaign-agent-recommendations article strong,
body.app-mode .campaign-agent-shortcuts button,
body.app-mode .campaign-agent-status-grid span,
body.app-mode .campaign-agent-status-grid strong,
body.app-mode .campaign-agent-status-grid small,
body.app-mode .queue-agent-response strong,
body.app-mode .queue-agent-response small,
body.app-mode .queue-agent-recommendations article strong,
body.app-mode .queue-agent-shortcuts button,
body.app-mode .queue-agent-status-grid span,
body.app-mode .queue-agent-status-grid strong,
body.app-mode .queue-agent-status-grid small,
body.app-mode .connection-agent-response strong,
body.app-mode .connection-agent-response small,
body.app-mode .connection-agent-recommendations article strong,
body.app-mode .connection-agent-shortcuts button,
body.app-mode .connection-agent-status-grid span,
body.app-mode .connection-agent-status-grid strong,
body.app-mode .connection-agent-status-grid small,
body.app-mode .analytics-agent-response strong,
body.app-mode .analytics-agent-response small,
body.app-mode .analytics-agent-recommendations article strong,
body.app-mode .analytics-agent-shortcuts button,
body.app-mode .analytics-agent-status-grid span,
body.app-mode .analytics-agent-status-grid strong,
body.app-mode .analytics-agent-status-grid small,
body.app-mode .ads-agent-response strong,
body.app-mode .ads-agent-response small,
body.app-mode .ads-agent-recommendations article strong,
body.app-mode .ads-agent-shortcuts button,
body.app-mode .ads-agent-status-grid span,
body.app-mode .ads-agent-status-grid strong,
body.app-mode .ads-agent-status-grid small,
body.app-mode .ads-account-card span,
body.app-mode .ads-account-card strong,
body.app-mode .ads-account-card small,
body.app-mode .ads-account-card em {
  color: #08090d !important;
}

body.app-mode .automation-agent-recommendations article,
body.app-mode .campaign-agent-recommendations article,
body.app-mode .queue-agent-recommendations article,
body.app-mode .connection-agent-recommendations article,
body.app-mode .analytics-agent-recommendations article,
body.app-mode .ads-agent-recommendations article {
  background: #fff7ed;
}

body.app-mode .campaign-agent-status-grid article:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .campaign-agent-status-grid article:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .campaign-agent-status-grid article:nth-child(3) {
  background: #f0a8ff;
}

body.app-mode .campaign-agent-status-grid article:nth-child(4) {
  background: #ffb84d;
}

body.app-mode .queue-agent-status-grid article:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .queue-agent-status-grid article:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .queue-agent-status-grid article:nth-child(3) {
  background: #f0a8ff;
}

body.app-mode .queue-agent-status-grid article:nth-child(4) {
  background: #ffb84d;
}

body.app-mode .queue-agent-status-grid article:nth-child(5) {
  background: #ef5350;
}

body.app-mode .queue-agent-status-grid article:nth-child(6) {
  background: #69e6a3;
}

body.app-mode .connection-agent-status-grid article:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .connection-agent-status-grid article:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .connection-agent-status-grid article:nth-child(3) {
  background: #f0a8ff;
}

body.app-mode .connection-agent-status-grid article:nth-child(4) {
  background: #ffb84d;
}

body.app-mode .connection-agent-status-grid article:nth-child(5) {
  background: #ef5350;
}

body.app-mode .connection-agent-status-grid article:nth-child(6) {
  background: #69e6a3;
}

body.app-mode .analytics-source-card {
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #fff7ed;
  color: #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .analytics-source-card:nth-child(3n + 2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #67d5e8;
}

body.app-mode .analytics-source-card:nth-child(3n) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #f0a8ff;
}

body.app-mode .analytics-source-card.measured {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #69e6a3;
}

body.app-mode .analytics-source-card span,
body.app-mode .analytics-source-card strong,
body.app-mode .analytics-source-card small,
body.app-mode .analytics-source-card em {
  color: #08090d !important;
}

body.app-mode .analytics-paid-card {
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #ffb84d;
  color: #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .analytics-paid-card:nth-child(2n) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 62%),
    #69e6a3;
}

body.app-mode .analytics-paid-card span,
body.app-mode .analytics-paid-card strong,
body.app-mode .analytics-paid-card small,
body.app-mode .analytics-paid-card em,
body.app-mode .report-paid-grid article span,
body.app-mode .report-paid-grid article strong,
body.app-mode .report-paid-grid article small {
  color: #08090d !important;
}

body.app-mode .analytics-agent-status-grid article:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .analytics-agent-status-grid article:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .analytics-agent-status-grid article:nth-child(3) {
  background: #f0a8ff;
}

body.app-mode .analytics-agent-status-grid article:nth-child(4) {
  background: #ffb84d;
}

body.app-mode .analytics-agent-status-grid article:nth-child(5) {
  background: #ef5350;
}

body.app-mode .analytics-agent-status-grid article:nth-child(6) {
  background: #69e6a3;
}

body.app-mode .ads-agent-status-grid article:nth-child(1),
body.app-mode .ads-account-card:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .ads-agent-status-grid article:nth-child(2),
body.app-mode .ads-account-card:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .ads-agent-status-grid article:nth-child(3),
body.app-mode .ads-account-card:nth-child(3) {
  background: #f0a8ff;
}

body.app-mode .ads-agent-status-grid article:nth-child(4),
body.app-mode .ads-account-card:nth-child(4) {
  background: #ffb84d;
}

body.app-mode .ads-agent-status-grid article:nth-child(5),
body.app-mode .ads-account-card:nth-child(5) {
  background: #ef5350;
}

body.app-mode .ads-agent-status-grid article:nth-child(6),
body.app-mode .ads-account-card.connected {
  background: #69e6a3;
}

body.app-mode .automation-agent-form textarea,
body.app-mode .campaign-agent-form textarea,
body.app-mode .queue-agent-form textarea,
body.app-mode .connection-agent-form textarea,
body.app-mode .analytics-agent-form textarea,
body.app-mode .ads-agent-form textarea {
  border: 3px solid #08090d;
  box-shadow: 4px 4px 0 #08090d;
  background: #fffaf0;
  color: #08090d;
}

body.app-mode .automation-agent-shortcuts button,
body.app-mode .campaign-agent-shortcuts button,
body.app-mode .queue-agent-shortcuts button,
body.app-mode .connection-agent-shortcuts button,
body.app-mode .analytics-agent-shortcuts button,
body.app-mode .ads-agent-shortcuts button {
  border: 2px solid #08090d;
  background: #dfff3f;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode .agent-submit-button {
  border: 3px solid #08090d !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 58%),
    #67d5e8 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
  font-weight: 950;
  text-transform: uppercase;
}

body.app-mode .agent-submit-button:hover {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 58%),
    #dfff3f !important;
  transform: translate(-1px, -1px);
}

body.app-mode .agent-submit-button:active {
  box-shadow: 2px 2px 0 #08090d !important;
  transform: translate(2px, 2px);
}

body.app-mode .mode-control {
  gap: 8px;
  padding: 6px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background: #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .mode {
  min-height: 34px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode .mode:hover {
  background: #67d5e8;
  color: #08090d;
}

body.app-mode .mode.active,
body.app-mode .mode[aria-selected="true"] {
  background: linear-gradient(135deg, #dfff3f, #69e6a3 58%, #67d5e8);
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

@media (max-width: 1180px) {
  body.app-mode .agent-action-panel,
  body.app-mode .connection-action-board,
  body.app-mode .seo-action-console,
  body.app-mode .community-action-console,
  body.app-mode .telegram-action-console,
  body.app-mode .ad-launch-console,
  body.app-mode .page-builder-console,
  body.app-mode .influencer-discovery-console,
  body.app-mode .outreach-deal-console,
  body.app-mode .affiliate-program-console,
  body.app-mode .community-discovery-console,
  body.app-mode .reach-message-console {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode .page-builder-console .wide-field,
  body.app-mode .influencer-discovery-console .wide-field,
  body.app-mode .outreach-deal-console .wide-field,
  body.app-mode .affiliate-program-console .wide-field,
  body.app-mode .community-discovery-console .wide-field,
  body.app-mode .reach-message-console .wide-field {
    grid-column: span 1;
  }
}

@media (max-width: 680px) {
  body.app-mode .agent-action-panel,
  body.app-mode .connection-action-board,
  body.app-mode .seo-action-console,
  body.app-mode .community-action-console,
  body.app-mode .telegram-action-console,
  body.app-mode .ad-launch-console,
  body.app-mode .page-builder-console,
  body.app-mode .page-builder-grid,
  body.app-mode .page-preview-sections,
  body.app-mode .page-tracking-grid,
  body.app-mode .influencer-discovery-console,
  body.app-mode .influencer-work-grid,
  body.app-mode .creator-score-grid,
  body.app-mode .creator-profile-meta,
  body.app-mode .outreach-deal-console,
  body.app-mode .outreach-work-grid,
  body.app-mode .outreach-score-grid,
  body.app-mode .outreach-terms-grid,
  body.app-mode .affiliate-program-console,
  body.app-mode .affiliate-work-grid,
  body.app-mode .affiliate-terms-grid,
  body.app-mode .affiliate-link-grid,
  body.app-mode .community-discovery-console,
  body.app-mode .community-discovery-grid,
  body.app-mode .community-theme-grid,
  body.app-mode .community-prompt-grid,
  body.app-mode .reach-message-console,
  body.app-mode .reach-work-grid,
  body.app-mode .reach-score-grid,
  body.app-mode .reach-adaptation-grid {
    grid-template-columns: 1fr;
  }
}

/* Six-card KPI palette: avoid repeating the same three colours on larger KPI sets. */
body.app-mode .status-grid .metric-card:nth-child(6n + 1),
body.app-mode .admin-summary .metric-card:nth-child(6n + 1),
body.app-mode .analytics-grid .metric-card:nth-child(6n + 1),
body.app-mode .billing-grid .metric-card:nth-child(6n + 1),
body.app-mode .module-kpi-grid article:nth-child(6n + 1),
body.app-mode .automation-summary div:nth-child(6n + 1),
body.app-mode .subscription-summary div:nth-child(6n + 1),
body.app-mode .settings-summary-grid article:nth-child(6n + 1),
body.app-mode .campaign-summary div:nth-child(6n + 1),
body.app-mode .routing-summary > *:nth-child(6n + 1),
body.app-mode .job-summary > *:nth-child(6n + 1),
body.app-mode .admin-health-grid > *:nth-child(6n + 1),
body.app-mode .report-grid article:nth-child(6n + 1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #d5ff00 !important;
}

body.app-mode .status-grid .metric-card:nth-child(6n + 2),
body.app-mode .admin-summary .metric-card:nth-child(6n + 2),
body.app-mode .analytics-grid .metric-card:nth-child(6n + 2),
body.app-mode .billing-grid .metric-card:nth-child(6n + 2),
body.app-mode .module-kpi-grid article:nth-child(6n + 2),
body.app-mode .automation-summary div:nth-child(6n + 2),
body.app-mode .subscription-summary div:nth-child(6n + 2),
body.app-mode .settings-summary-grid article:nth-child(6n + 2),
body.app-mode .campaign-summary div:nth-child(6n + 2),
body.app-mode .routing-summary > *:nth-child(6n + 2),
body.app-mode .job-summary > *:nth-child(6n + 2),
body.app-mode .admin-health-grid > *:nth-child(6n + 2),
body.app-mode .report-grid article:nth-child(6n + 2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #22d3ee !important;
}

body.app-mode .status-grid .metric-card:nth-child(6n + 3),
body.app-mode .admin-summary .metric-card:nth-child(6n + 3),
body.app-mode .analytics-grid .metric-card:nth-child(6n + 3),
body.app-mode .billing-grid .metric-card:nth-child(6n + 3),
body.app-mode .module-kpi-grid article:nth-child(6n + 3),
body.app-mode .automation-summary div:nth-child(6n + 3),
body.app-mode .subscription-summary div:nth-child(6n + 3),
body.app-mode .settings-summary-grid article:nth-child(6n + 3),
body.app-mode .campaign-summary div:nth-child(6n + 3),
body.app-mode .routing-summary > *:nth-child(6n + 3),
body.app-mode .job-summary > *:nth-child(6n + 3),
body.app-mode .admin-health-grid > *:nth-child(6n + 3),
body.app-mode .report-grid article:nth-child(6n + 3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #a78bfa !important;
}

body.app-mode .status-grid .metric-card:nth-child(6n + 4),
body.app-mode .admin-summary .metric-card:nth-child(6n + 4),
body.app-mode .analytics-grid .metric-card:nth-child(6n + 4),
body.app-mode .billing-grid .metric-card:nth-child(6n + 4),
body.app-mode .module-kpi-grid article:nth-child(6n + 4),
body.app-mode .automation-summary div:nth-child(6n + 4),
body.app-mode .subscription-summary div:nth-child(6n + 4),
body.app-mode .settings-summary-grid article:nth-child(6n + 4),
body.app-mode .campaign-summary div:nth-child(6n + 4),
body.app-mode .routing-summary > *:nth-child(6n + 4),
body.app-mode .job-summary > *:nth-child(6n + 4),
body.app-mode .admin-health-grid > *:nth-child(6n + 4),
body.app-mode .report-grid article:nth-child(6n + 4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ff3134 !important;
}

body.app-mode .status-grid .metric-card:nth-child(6n + 5),
body.app-mode .admin-summary .metric-card:nth-child(6n + 5),
body.app-mode .analytics-grid .metric-card:nth-child(6n + 5),
body.app-mode .billing-grid .metric-card:nth-child(6n + 5),
body.app-mode .module-kpi-grid article:nth-child(6n + 5),
body.app-mode .automation-summary div:nth-child(6n + 5),
body.app-mode .subscription-summary div:nth-child(6n + 5),
body.app-mode .settings-summary-grid article:nth-child(6n + 5),
body.app-mode .campaign-summary div:nth-child(6n + 5),
body.app-mode .routing-summary > *:nth-child(6n + 5),
body.app-mode .job-summary > *:nth-child(6n + 5),
body.app-mode .admin-health-grid > *:nth-child(6n + 5),
body.app-mode .report-grid article:nth-child(6n + 5) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 66%),
    #4f6dff !important;
}

body.app-mode .status-grid .metric-card:nth-child(6n),
body.app-mode .admin-summary .metric-card:nth-child(6n),
body.app-mode .analytics-grid .metric-card:nth-child(6n),
body.app-mode .billing-grid .metric-card:nth-child(6n),
body.app-mode .module-kpi-grid article:nth-child(6n),
body.app-mode .automation-summary div:nth-child(6n),
body.app-mode .subscription-summary div:nth-child(6n),
body.app-mode .settings-summary-grid article:nth-child(6n),
body.app-mode .campaign-summary div:nth-child(6n),
body.app-mode .routing-summary > *:nth-child(6n),
body.app-mode .job-summary > *:nth-child(6n),
body.app-mode .admin-health-grid > *:nth-child(6n),
body.app-mode .report-grid article:nth-child(6n) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #10f0a1 !important;
}

body.app-mode .billing-drawer .billing-grid .metric-card:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ff3134 !important;
}

body.app-mode .billing-drawer .billing-grid .metric-card:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 66%),
    #4f6dff !important;
}

body.app-mode .billing-drawer .billing-grid .metric-card:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #10f0a1 !important;
}

/* Global project selector for demo clarity. */
body.app-mode .global-project-console {
  display: grid;
  grid-template-columns: minmax(220px, 0.35fr) minmax(0, 1fr) minmax(360px, 0.65fr);
  gap: 10px;
  align-items: stretch;
  margin: 0 0 14px;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(100deg, rgba(213, 255, 0, 0.20), rgba(34, 211, 238, 0.16) 45%, rgba(167, 139, 250, 0.22)),
    #fff7ed;
  box-shadow: 7px 7px 0 #08090d;
}

body.app-mode:not([data-active-view="dashboard"]) .global-project-console {
  display: none;
}

body.app-mode .active-project-pill {
  display: inline-grid;
  place-items: center;
  min-height: 36px;
  padding: 0 12px;
  border: 2px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  white-space: nowrap;
}

body.app-mode .global-project-console label,
body.app-mode .global-project-console > div {
  display: grid;
  align-content: center;
  gap: 5px;
  min-width: 0;
}

body.app-mode .global-project-console strong {
  font-size: 20px;
  line-height: 1.05;
}

body.app-mode .global-project-console small {
  overflow: hidden;
  color: rgba(8, 9, 13, 0.74) !important;
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode .app-footer {
  display: grid;
  gap: 12px;
  margin-top: 20px;
  padding: 14px;
  border: 3px solid #08090d;
  background:
    linear-gradient(102deg, rgba(213, 255, 0, 0.18), rgba(103, 213, 232, 0.17) 38%, rgba(255, 209, 102, 0.18) 70%, rgba(255, 123, 150, 0.14)),
    #fff7ed;
  box-shadow: 7px 7px 0 #08090d;
  color: #08090d;
}

body.app-mode .app-footer-brand {
  display: grid;
  gap: 5px;
}

body.app-mode .app-footer-brand h2 {
  max-width: 880px;
  margin: 0;
  font-size: 18px;
  line-height: 1.05;
}

body.app-mode .app-footer-brand p {
  max-width: 980px;
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  line-height: 1.4;
}

body.app-mode .app-footer-status {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

body.app-mode .app-footer-status article {
  display: grid;
  gap: 4px;
  min-height: 76px;
  padding: 10px;
  border: 3px solid #08090d;
  background: rgba(255, 250, 240, 0.84);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .app-footer-status article:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 64%),
    #d5ff00;
}

body.app-mode .app-footer-status article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 64%),
    #67d5e8;
}

body.app-mode .app-footer-status article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 64%),
    #ffd166;
}

body.app-mode .app-footer-status article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 64%),
    #b59cf6;
}

body.app-mode .app-footer-status strong {
  overflow: hidden;
  font-size: 15px;
  line-height: 1.08;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode .app-footer-status small {
  overflow: hidden;
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode .app-footer-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

body.app-mode .app-footer-links > div {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
  padding: 10px;
  border: 3px solid #08090d;
  background: rgba(255, 250, 240, 0.82);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .app-footer-links strong {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

body.app-mode .app-footer-links button,
body.app-mode .app-footer-links a,
body.app-mode .app-footer-links span {
  min-height: 26px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.1;
  text-align: left;
  text-decoration: none;
}

body.app-mode .app-footer-links button {
  cursor: pointer;
}

body.app-mode .app-footer-links button:hover,
body.app-mode .app-footer-links a:hover {
  background: #d5ff00;
  transform: translate(-1px, -1px);
}

body.app-mode .app-footer-links span {
  background: #f7dfc5;
  color: rgba(8, 9, 13, 0.72);
}

body.app-mode .app-footer-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  padding-top: 4px;
  color: rgba(8, 9, 13, 0.74);
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

body.app-mode.creative-focus-mode .app-footer {
  display: none;
}

body.app-mode[data-active-view="admin"] .app-footer,
body.app-mode[data-active-view="ai"] .app-footer,
body.app-mode[data-active-view="jobs"] .app-footer,
body.app-mode[data-active-view="modules"] .app-footer,
body.app-mode[data-active-view="audit"] .app-footer,
body.app-mode[data-active-view="onboarding"] .app-footer {
  display: none !important;
}

@media (max-width: 980px) {
  body.app-mode .app-footer-status {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  body.app-mode .app-footer-status,
  body.app-mode .app-footer-links {
    grid-template-columns: 1fr;
  }

  body.app-mode .app-footer-bottom {
    display: grid;
  }
}

body.app-mode .app-footer {
  display: block;
  min-height: 34px;
  margin-top: 14px;
  padding: 8px 10px;
  background: #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .app-footer-brand,
body.app-mode .app-footer-status,
body.app-mode .app-footer-links {
  display: none !important;
}

body.app-mode .app-footer-bottom {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 0;
}

body.app-mode .app-footer-bottom #footer-build-status {
  margin-left: auto;
}

body.app-mode .app-footer-bottom .footer-help-link {
  min-height: 22px;
  padding: 3px 10px;
  border: 2px solid #08090d;
  background: #dfff3f;
  color: #08090d;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
  box-shadow: 2px 2px 0 #08090d;
  cursor: pointer;
}

body.app-mode .app-footer-bottom .footer-help-link:hover,
body.app-mode .app-footer-bottom .footer-help-link:focus-visible {
  background: #67d5e8;
}

body.app-mode .app-footer-bottom .footer-announcement-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 3px 10px;
  border: 2px solid #08090d;
  border-radius: 0;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.65), rgba(223, 255, 63, 0.7)),
    #dfff3f;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
  cursor: pointer;
}

body.app-mode .app-footer-bottom .footer-announcement-chip[hidden] {
  display: none !important;
}

body.app-mode .app-footer-bottom .footer-announcement-chip:hover,
body.app-mode .app-footer-bottom .footer-announcement-chip:focus-visible {
  background: #67d5e8;
}

body.app-mode .app-footer.universal-footer {
  display: grid !important;
  gap: clamp(14px, 2vw, 22px) !important;
  min-height: 0 !important;
  margin-top: clamp(56px, 7vw, 104px) !important;
  padding: clamp(18px, 4vw, 54px) !important;
  border: 0 !important;
  border-top: 6px solid #08090d !important;
  background:
    radial-gradient(circle at 12% 18%, rgba(0, 94, 255, 0.28), transparent 28%),
    radial-gradient(circle at 88% 12%, rgba(223, 255, 63, 0.22), transparent 24%),
    linear-gradient(135deg, rgba(255, 247, 237, 0.92), rgba(210, 243, 255, 0.86) 42%, rgba(255, 247, 237, 0.94)),
    #fff7ed !important;
  box-shadow: none !important;
  color: #08090d;
}

body.app-mode .app-footer.universal-footer .footer-announcement-list,
body.app-mode .app-footer.universal-footer .landing-footer-intro,
body.app-mode .app-footer.universal-footer .landing-footer-signals,
body.app-mode .app-footer.universal-footer .landing-footer-links,
body.app-mode .app-footer.universal-footer .landing-footer-bottom {
  position: relative;
  z-index: 1;
}

body.app-mode .app-footer.universal-footer .footer-announcement-list {
  margin-bottom: 0;
}

body.app-mode .app-footer.universal-footer .landing-footer-intro h2 {
  max-width: min(820px, 72%);
  color: #fff7ed !important;
  font-size: clamp(28px, 3vw, 44px);
  line-height: 0.98;
}

body.app-mode .app-footer.universal-footer .landing-footer-intro p {
  max-width: min(780px, 72%);
  color: rgba(255, 247, 237, 0.82) !important;
}

body.app-mode .app-footer.universal-footer .landing-footer-intro .landing-kicker {
  color: #d5ff00 !important;
}

body.app-mode .app-footer.universal-footer .landing-footer-signals,
body.app-mode .app-footer.universal-footer .landing-footer-links {
  display: grid !important;
}

body.app-mode .app-footer.universal-footer .landing-footer-bottom {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: clamp(10px, 2vw, 18px);
}

body.app-mode .app-footer.universal-footer .landing-footer-bottom span {
  color: #fff7ed !important;
}

body.app-mode .app-footer.universal-footer .footer-announcement-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 5px 12px;
  border: 2px solid #08090d;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
  cursor: pointer;
}

body.app-mode .app-footer.universal-footer .footer-announcement-chip[hidden] {
  display: none !important;
}

body.app-mode .app-footer.universal-footer .footer-announcement-chip:hover,
body.app-mode .app-footer.universal-footer .footer-announcement-chip:focus-visible {
  background: #67d5e8;
  transform: translate(-1px, -1px);
}

body.app-mode.creative-focus-mode .app-footer {
  display: none;
}

body.app-mode[data-active-view="admin"] .app-footer,
body.app-mode[data-active-view="admin"] .app-footer.universal-footer,
body.app-mode[data-active-view="ai"] .app-footer,
body.app-mode[data-active-view="ai"] .app-footer.universal-footer,
body.app-mode[data-active-view="jobs"] .app-footer,
body.app-mode[data-active-view="jobs"] .app-footer.universal-footer,
body.app-mode[data-active-view="modules"] .app-footer,
body.app-mode[data-active-view="modules"] .app-footer.universal-footer,
body.app-mode[data-active-view="audit"] .app-footer,
body.app-mode[data-active-view="audit"] .app-footer.universal-footer,
body.app-mode[data-active-view="white-label"] .app-footer,
body.app-mode[data-active-view="white-label"] .app-footer.universal-footer,
body.app-mode[data-active-view="onboarding"] .app-footer,
body.app-mode[data-active-view="onboarding"] .app-footer.universal-footer {
  display: none !important;
}

body.app-mode .global-project-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

/* Final Help Centre fullscreen override: this view behaves like a public detail page, not a workspace module. */
body.app-mode[data-active-view="help"] > .app-shell {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="help"] > .app-shell > .sidebar,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-menu-toggle,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-sidebar-scrim {
  display: none !important;
}

body.app-mode[data-active-view="help"] > .app-shell > main {
  padding: clamp(18px, 3vw, 40px) !important;
}

body.app-mode[data-active-view="help"] [data-view-section="help"] {
  max-width: 1480px !important;
  margin: 0 auto !important;
}

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

.landing-help-main article:nth-child(4n + 1) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.26), transparent 62%),
    rgba(255, 250, 240, 0.86);
}

.landing-help-main article:nth-child(4n + 2) {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.26), transparent 62%),
    rgba(255, 250, 240, 0.86);
}

.landing-help-main article:nth-child(4n + 3) {
  background:
    linear-gradient(135deg, rgba(181, 156, 246, 0.22), transparent 62%),
    rgba(255, 250, 240, 0.86);
}

.landing-help-main article:nth-child(4n) {
  background:
    linear-gradient(135deg, rgba(255, 209, 102, 0.26), transparent 62%),
    rgba(255, 250, 240, 0.86);
}

@media (max-width: 820px) {
  .landing-help-main {
    grid-template-columns: 1fr;
  }
}

body.app-mode .global-project-stats span {
  display: grid;
  gap: 2px;
  min-height: 54px;
  padding: 8px;
  border: 2px solid #08090d;
  background: #d5ff00;
  box-shadow: 3px 3px 0 #08090d;
  color: #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 850;
  text-transform: uppercase;
}

body.app-mode .global-project-stats span:nth-child(2) {
  background: #22d3ee;
}

body.app-mode .global-project-stats span:nth-child(3) {
  background: #a78bfa;
}

body.app-mode .global-project-stats span:nth-child(4) {
  background: #10f0a1;
}

body.app-mode .global-project-stats b {
  font-family: Geist, "Helvetica Neue", Arial, sans-serif;
  font-size: 18px;
  line-height: 1;
}

body.app-mode .onboarding-layout {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.45fr);
  gap: 14px !important;
  align-items: start;
}

body.app-mode .onboarding-form {
  gap: 12px;
}

body.app-mode .channel-choice-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px !important;
  padding: 16px;
  border: 3px solid #08090d !important;
  background: #fff7ed !important;
  box-shadow: 6px 6px 0 #08090d !important;
}

body.app-mode .channel-choice-grid legend {
  padding: 0 8px;
  color: #08090d !important;
  font-weight: 850;
}

body.app-mode .channel-choice-grid label {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 46px;
  padding: 10px 12px;
  border: 2px solid #08090d !important;
  background: #f7dfc5 !important;
  box-shadow: 3px 3px 0 #08090d !important;
  color: #08090d !important;
}

body.app-mode .channel-choice-grid label:nth-of-type(1) {
  background: #d5ff00 !important;
}

body.app-mode .channel-choice-grid label:nth-of-type(2) {
  background: #22d3ee !important;
}

body.app-mode .channel-choice-grid label:nth-of-type(3) {
  background: #ff9f1c !important;
}

body.app-mode .channel-choice-grid label:nth-of-type(4) {
  background: #ff6bcb !important;
}

body.app-mode .channel-choice-grid label:nth-of-type(5) {
  background: #2dd4bf !important;
}

body.app-mode .channel-choice-grid label:nth-of-type(6) {
  background: #a78bfa !important;
}

body.app-mode .channel-choice-grid input {
  flex: 0 0 auto;
  width: 16px !important;
  height: 16px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 2px solid #08090d !important;
  box-shadow: none !important;
}

@media (max-width: 1180px) {
  body.app-mode .global-project-console {
    grid-template-columns: 1fr;
  }

  .admin-summary,
  .admin-control-grid,
  .admin-provider-readiness-summary,
  .admin-provider-config-summary,
  .admin-provider-config-grid,
  .admin-feature-flags {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode .onboarding-layout,
  body.app-mode .onboarding-summary,
  body.app-mode .channel-choice-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  body.app-mode .global-project-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-summary,
  .admin-control-grid,
  .admin-provider-readiness-summary,
  .admin-provider-config-summary,
  .admin-provider-config-grid,
  .admin-provider-readiness-row,
  .admin-feature-flags {
    grid-template-columns: 1fr;
  }

  body.app-mode .onboarding-summary,
  body.app-mode .channel-choice-grid {
    grid-template-columns: 1fr;
  }
}

/* Distinct action palette and breathing room across every tab. */
body.app-mode .status-grid,
body.app-mode .analytics-grid,
body.app-mode .billing-grid,
body.app-mode .module-kpi-grid,
body.app-mode .automation-summary,
body.app-mode .subscription-summary,
body.app-mode .settings-summary-grid,
body.app-mode .campaign-summary,
body.app-mode .routing-summary,
body.app-mode .job-summary,
body.app-mode .admin-health-grid,
body.app-mode .report-grid,
body.app-mode .agent-action-panel,
body.app-mode .connection-action-board,
body.app-mode .seo-action-console,
body.app-mode .community-action-console,
body.app-mode .telegram-action-console {
  gap: 22px !important;
}

body.app-mode .agent-action-panel,
body.app-mode .connection-action-board,
body.app-mode .seo-action-console,
body.app-mode .community-action-console,
body.app-mode .telegram-action-console {
  margin-bottom: 24px !important;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form,
body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary,
body.app-mode[data-active-view="ai"] [data-view-section="ai"] .ai-routing-board {
  gap: 10px !important;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 10px;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary .metric-card {
  min-height: 108px;
  padding: 12px;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 4px;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form label {
  gap: 5px;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form input,
body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form select {
  min-height: 38px;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form button {
  min-height: 38px;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .provider-output {
  margin: 10px 0 0;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .metric-card.blocked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ffb4a9 !important;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary .metric-card:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #d5ff00 !important;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary .metric-card:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #22d3ee !important;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary .metric-card:nth-child(3).blocked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ffb4a9 !important;
}

body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary .metric-card:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%),
    #10f0a1 !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary,
  body.app-mode[data-active-view="ai"] [data-view-section="ai"] .ai-routing-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-form,
body.app-mode[data-active-view="ai"] [data-view-section="ai"] .routing-summary,
body.app-mode[data-active-view="ai"] [data-view-section="ai"] .ai-routing-board {
  grid-template-columns: 1fr;
}
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .jobs-operation-board,
body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-summary {
  gap: 10px !important;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin-top: 10px;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-summary .metric-card {
  min-height: 92px;
  padding: 11px;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-list {
  gap: 7px;
  margin-top: 10px;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row {
  grid-template-columns: 108px minmax(0, 1fr) minmax(92px, auto);
  min-height: 56px;
  padding: 9px 10px;
  border: 3px solid #08090d;
  background: rgba(255, 250, 240, 0.92);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row.worker-run {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #e3f7c9;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row.failed,
body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row.partial-failure {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ffb4a9;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row strong {
  font-size: 13px;
  line-height: 1.15;
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row small,
body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row > span:first-child {
  color: rgba(8, 9, 13, 0.72);
}

body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .provider-output {
  margin: 10px 0 0;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-roadmap {
  gap: 10px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-roadmap {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-panel {
  margin: 12px 0;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 64%),
    #e9f7ff;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-header h3 {
  margin: 2px 0 0;
  color: #08090d;
  font-size: 18px;
  line-height: 1.05;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake label {
  display: grid;
  gap: 5px;
  color: rgba(8, 9, 13, 0.74);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake input,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake select,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake textarea {
  width: 100%;
  min-height: 38px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.94);
  color: #08090d;
  font: 800 12px/1.25 "Inter", system-ui, sans-serif;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake textarea {
  min-height: 68px;
  resize: vertical;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-actions {
  display: grid;
  gap: 7px;
  align-self: stretch;
  padding: 8px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.72);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-actions small {
  color: rgba(8, 9, 13, 0.7);
  font-size: 11px;
  line-height: 1.25;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis article {
  min-height: 78px;
  padding: 10px;
  border: 2px solid #08090d;
  background: #f8f0d9;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis span,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis small {
  display: block;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis strong {
  display: block;
  margin: 4px 0;
  color: #08090d;
  font-size: 22px;
  line-height: 1;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-matrix {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-empty {
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.32), transparent 62%),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card h4 {
  margin: 2px 0 0;
  color: #08090d;
  font-size: 15px;
  line-height: 1.12;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-meta,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 9px;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-meta span,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid div {
  padding: 7px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.78);
  box-shadow: 2px 2px 0 #08090d;
  color: rgba(8, 9, 13, 0.75);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid strong,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-empty strong {
  display: block;
  color: #08090d;
  font-size: 12px;
  line-height: 1.2;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid small,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-empty small {
  display: block;
  margin-top: 4px;
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  line-height: 1.3;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card p {
  margin: 10px 0 0;
  color: #08090d;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-signal-stack {
  display: grid;
  gap: 5px;
  margin-top: 9px;
  padding: 8px;
  border: 2px solid #08090d;
  background: rgba(255, 255, 255, 0.52);
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-signal-stack small,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-source-actions span {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.3;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-signal-stack strong {
  color: #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-source-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card a {
  display: inline-flex;
  color: #08090d;
  font-size: 11px;
  font-weight: 900;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card {
  align-content: start;
  min-height: 238px;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card.ready {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #e3f7c9 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card.blocked {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ffcabd !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card h3 {
  font-size: 15px;
  line-height: 1.05;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card p {
  min-height: 48px;
  color: rgba(8, 9, 13, 0.74) !important;
  font-size: 11px;
  line-height: 1.32;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .progress-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  color: rgba(8, 9, 13, 0.78);
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .progress-track {
  height: 9px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.76);
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .progress-fill {
  background: #08090d;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .admin-audit-summary,
body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-filter-bar {
  gap: 10px !important;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .admin-audit-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 10px;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .admin-audit-summary article {
  min-height: 88px;
  padding: 12px;
  border: 3px solid #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-filter-bar {
  grid-template-columns: minmax(260px, 1fr) minmax(170px, 0.28fr) minmax(170px, 0.28fr) auto;
  align-items: end;
  margin-bottom: 10px;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-export-bar {
  margin: 0 0 10px;
  padding: 10px;
  border: 3px solid #08090d;
  background: #eef7d4;
  box-shadow: 4px 4px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-export-bar span {
  color: #08090d;
  font-weight: 800;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-list {
  gap: 7px;
  margin-top: 0;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row {
  grid-template-columns: 132px minmax(0, 1fr) 104px 86px;
  min-height: 54px;
  padding: 9px 10px;
  border: 3px solid #08090d;
  background: rgba(255, 250, 240, 0.92);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row.severity-high {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ffb4a9;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row.severity-medium {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #ffd166;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row strong {
  font-size: 13px;
  line-height: 1.15;
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row small,
body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row time {
  color: rgba(8, 9, 13, 0.72);
}

body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row > span,
body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row > b {
  justify-self: end;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #d5ff00;
  box-shadow: 2px 2px 0 #08090d;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .jobs-operation-board,
  body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-roadmap,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-matrix {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .admin-audit-summary,
  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-filter-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

@media (max-width: 720px) {
  body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .jobs-operation-board,
  body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-summary,
  body.app-mode[data-active-view="jobs"] [data-view-section="jobs"] .job-row {
    grid-template-columns: 1fr;
  }

  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-roadmap,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-matrix,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-meta,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid {
    grid-template-columns: 1fr;
  }

  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-header,
  body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card header {
    align-items: flex-start;
    flex-direction: column;
  }

  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .admin-audit-summary,
  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-filter-bar,
  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row {
    grid-template-columns: 1fr;
  }

  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row > span,
  body.app-mode[data-active-view="audit"] [data-view-section="audit"] .audit-row > b {
    justify-self: start;
  }

}

body.app-mode .analytics-grid {
  margin-bottom: 24px !important;
}

body.app-mode .analytics-actions {
  margin-top: 0 !important;
}

body.app-mode .agent-action-panel button:nth-child(6n + 1),
body.app-mode .connection-action-board button:nth-child(6n + 1),
body.app-mode .seo-action-console button:nth-child(6n + 1),
body.app-mode .community-action-console button:nth-child(6n + 1),
body.app-mode .telegram-action-console button:nth-child(6n + 1) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #ff9f1c !important;
}

body.app-mode .agent-action-panel button:nth-child(6n + 2),
body.app-mode .connection-action-board button:nth-child(6n + 2),
body.app-mode .seo-action-console button:nth-child(6n + 2),
body.app-mode .community-action-console button:nth-child(6n + 2),
body.app-mode .telegram-action-console button:nth-child(6n + 2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #ff6bcb !important;
}

body.app-mode .agent-action-panel button:nth-child(6n + 3),
body.app-mode .connection-action-board button:nth-child(6n + 3),
body.app-mode .seo-action-console button:nth-child(6n + 3),
body.app-mode .community-action-console button:nth-child(6n + 3),
body.app-mode .telegram-action-console button:nth-child(6n + 3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #2dd4bf !important;
}

body.app-mode .agent-action-panel button:nth-child(6n + 4),
body.app-mode .connection-action-board button:nth-child(6n + 4),
body.app-mode .seo-action-console button:nth-child(6n + 4),
body.app-mode .community-action-console button:nth-child(6n + 4),
body.app-mode .telegram-action-console button:nth-child(6n + 4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #facc15 !important;
}

body.app-mode .agent-action-panel button:nth-child(6n + 5),
body.app-mode .connection-action-board button:nth-child(6n + 5),
body.app-mode .seo-action-console button:nth-child(6n + 5),
body.app-mode .community-action-console button:nth-child(6n + 5),
body.app-mode .telegram-action-console button:nth-child(6n + 5) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 64%),
    #38bdf8 !important;
}

body.app-mode .agent-action-panel button:nth-child(6n),
body.app-mode .connection-action-board button:nth-child(6n),
body.app-mode .seo-action-console button:nth-child(6n),
body.app-mode .community-action-console button:nth-child(6n),
body.app-mode .telegram-action-console button:nth-child(6n) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #fb7185 !important;
}

/* Compact SEO workbench: keep the page operational and scannable. */
body.app-mode .seo-intelligence-page {
  padding: 18px !important;
}

body.app-mode .seo-intelligence-page .panel-header {
  margin-bottom: 12px;
}

body.app-mode .seo-command-hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(220px, 0.58fr) 128px;
  gap: 10px;
  margin-bottom: 10px;
  align-items: stretch;
}

body.app-mode .seo-command-hero > div:first-child,
body.app-mode .seo-serp-card {
  padding: 11px !important;
}

body.app-mode .seo-command-hero strong {
  font-size: 16px;
  line-height: 1.08;
}

body.app-mode .seo-command-hero p,
body.app-mode .seo-serp-card p {
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
}

body.app-mode .seo-query-bar {
  margin-top: 4px;
  padding: 7px 8px;
  gap: 2px;
}

body.app-mode .seo-query-bar b,
body.app-mode .seo-serp-card strong {
  font-size: 12px;
  line-height: 1.2;
}

body.app-mode .seo-query-bar small,
body.app-mode .seo-serp-card small {
  font-size: 9px;
  line-height: 1.25;
}

body.app-mode .seo-command-hero .primary-action {
  min-width: 0;
  min-height: 0;
  padding: 10px 9px;
  font-size: 11px;
  line-height: 1.15;
}

body.app-mode .seo-intelligence-page .module-kpi-grid,
body.app-mode .seo-action-console,
body.app-mode .seo-workbench-grid,
body.app-mode .seo-pipeline-grid {
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode .seo-intelligence-page .module-kpi-grid article {
  min-height: 68px;
  padding: 10px !important;
}

body.app-mode .geo-engine-page {
  --geo-ink: #17566b;
  --geo-paper: #fff7ed;
  --geo-lime: #dfff3f;
  --geo-mint: #6ee7b7;
  --geo-cyan: #67d5e8;
  --geo-purple: #a78bfa;
  --geo-orange: #ffb454;
  --geo-rose: #fb7185;
  border-color: rgba(23, 86, 107, 0.92);
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), rgba(103, 213, 232, 0.14) 38%, rgba(167, 139, 250, 0.12) 68%, rgba(255, 180, 84, 0.14)),
    var(--surface);
}

body.app-mode .geo-engine-page .panel-header {
  padding: 14px;
  border: 4px solid var(--geo-ink);
  border-radius: 8px;
  background:
    linear-gradient(90deg, var(--geo-lime) 0 24%, var(--geo-cyan) 24% 50%, var(--geo-purple) 50% 76%, var(--geo-orange) 76% 100%) top / 100% 8px no-repeat,
    var(--geo-paper);
  box-shadow: 7px 7px 0 var(--geo-ink);
}

body.app-mode .geo-engine-page .panel-header h2,
body.app-mode .geo-engine-page .panel-header .eyebrow {
  color: var(--geo-ink);
}

body.app-mode .geo-engine-page .panel-header .badge {
  border: 3px solid var(--geo-ink);
  background: var(--geo-lime);
  color: var(--geo-ink);
  box-shadow: 4px 4px 0 var(--geo-ink);
}

body.app-mode .geo-command-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, 0.55fr);
  gap: 12px;
  align-items: stretch;
  margin-bottom: 12px;
  padding: 18px 14px 14px;
  overflow: hidden;
  border: 4px solid var(--geo-ink);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.32), transparent 35%),
    linear-gradient(28deg, rgba(103, 213, 232, 0.28), transparent 58%),
    linear-gradient(130deg, #faffea, #e7fbff 48%, #f3eeff);
  box-shadow: 8px 8px 0 var(--geo-ink);
}

body.app-mode .geo-command-hero::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 8px;
  background: linear-gradient(90deg, var(--geo-lime), var(--geo-cyan), var(--geo-purple), var(--geo-orange));
}

body.app-mode .geo-command-hero strong {
  display: block;
  margin: 5px 0;
  color: var(--geo-ink) !important;
  font-size: 18px;
  line-height: 1.12;
}

body.app-mode .geo-command-hero p {
  max-width: 780px;
  margin: 0 0 10px;
  color: rgba(23, 86, 107, 0.74) !important;
  font-size: 11px;
  line-height: 1.45;
}

body.app-mode .geo-command-hero .eyebrow {
  color: #19716b !important;
}

body.app-mode .geo-url-bar {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  margin-top: 8px;
  padding: 8px;
  border: 2px solid rgba(23, 86, 107, 0.20);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.68);
}

body.app-mode .geo-url-bar label,
body.app-mode .geo-audit-controls label {
  color: rgba(23, 86, 107, 0.84) !important;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.app-mode .geo-url-bar input,
body.app-mode .geo-audit-controls select {
  width: 100%;
  min-width: 0;
  border: 2px solid rgba(23, 86, 107, 0.54) !important;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.96);
  color: var(--geo-ink) !important;
  font: inherit;
  box-shadow: 3px 3px 0 var(--geo-ink) !important;
}

body.app-mode .geo-url-bar input {
  padding: 10px 11px;
  font-size: 12px;
}

body.app-mode .geo-audit-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-content: end;
}

body.app-mode .geo-audit-controls label {
  display: grid;
  gap: 5px;
  padding: 8px;
  border: 2px solid rgba(23, 86, 107, 0.22);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
}

body.app-mode .geo-command-hero .primary-action,
body.app-mode .geo-command-hero .secondary-action {
  border-color: var(--geo-ink) !important;
  box-shadow: 5px 5px 0 var(--geo-ink) !important;
}

body.app-mode .geo-audit-controls select {
  min-height: 40px;
  padding: 8px;
  font-size: 11px;
}

body.app-mode .geo-audit-controls .primary-action,
body.app-mode .geo-audit-controls .secondary-action {
  grid-column: 1 / -1;
  min-width: 0;
  min-height: 42px;
}

body.app-mode .geo-command-hero.is-running {
  opacity: 0.78;
}

body.app-mode .geo-workbench-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

body.app-mode .geo-proof-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}

body.app-mode .geo-proof-strip article {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
  min-height: 112px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.08), transparent 58%),
    rgba(0, 0, 0, 0.16);
}

body.app-mode .geo-proof-strip article[data-state="done"] {
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.12), transparent 58%),
    rgba(0, 0, 0, 0.16);
}

body.app-mode .geo-proof-strip article[data-state="ready"] {
  border-color: rgba(202, 240, 105, 0.22);
}

body.app-mode .geo-proof-strip span {
  color: rgba(248, 250, 252, 0.5);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode .geo-proof-strip strong {
  color: var(--white);
  font-size: 17px;
  line-height: 1.1;
}

body.app-mode .geo-proof-strip small {
  color: rgba(248, 250, 252, 0.58);
  font-size: 10px;
  line-height: 1.35;
}

body.app-mode .geo-proof-strip button {
  align-self: end;
  margin-top: 3px;
  min-width: 0;
  min-height: 32px;
}

body.app-mode .geo-summary-card {
  min-height: 250px;
  overflow: hidden;
}

body.app-mode .geo-fix-draft-panel {
  display: grid;
  gap: 10px;
  margin: 12px 0;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.028);
}

body.app-mode .geo-fix-draft-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode .geo-fix-draft-card,
body.app-mode .geo-fix-draft-empty {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.08), transparent 60%),
    rgba(0, 0, 0, 0.14);
}

body.app-mode .geo-fix-draft-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.app-mode .geo-fix-draft-card header span,
body.app-mode .geo-fix-draft-card header b {
  padding: 3px 6px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  color: rgba(248, 250, 252, 0.74);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}

body.app-mode .geo-fix-draft-card strong,
body.app-mode .geo-fix-draft-empty strong {
  color: var(--white);
  font-size: 12.5px;
  line-height: 1.25;
}

body.app-mode .geo-fix-draft-card small,
body.app-mode .geo-fix-draft-empty small {
  color: rgba(248, 250, 252, 0.52);
  font-size: 10.5px;
  line-height: 1.4;
}

body.app-mode .geo-fix-draft-card.implemented {
  border-color: rgba(16, 240, 161, 0.24);
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.12), transparent 60%),
    rgba(0, 0, 0, 0.14);
}

body.app-mode .geo-fix-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

body.app-mode .geo-fix-status-row span {
  flex: 0 0 auto;
  padding: 4px 7px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(248, 250, 252, 0.76);
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode .geo-fix-draft-card.implemented .geo-fix-status-row span {
  border-color: rgba(16, 240, 161, 0.22);
  background: rgba(16, 240, 161, 0.12);
  color: #d8fff0;
}

body.app-mode .geo-fix-status-row small {
  min-width: 0;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode .geo-fix-draft-card pre {
  min-height: 132px;
  max-height: 150px;
  margin: 0;
  padding: 9px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.18);
  color: rgba(248, 250, 252, 0.68);
  font: 10px/1.45 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

body.app-mode .geo-fix-draft-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

body.app-mode .geo-fix-draft-actions button {
  min-width: 0;
  min-height: 34px;
  padding-inline: 8px;
}

.geo-fix-dialog {
  width: min(1080px, calc(100vw - 28px));
  max-width: none;
  max-height: min(850px, calc(100dvh - 28px));
  padding: 0;
  overflow: hidden;
  border: 4px solid #08090d;
  border-radius: 10px;
  background: #07151f;
  color: #f8fafc;
  box-shadow: 12px 12px 0 #08090d;
}

.geo-fix-dialog::backdrop {
  background: rgba(8, 9, 13, 0.74);
  backdrop-filter: blur(7px);
}

.geo-fix-modal {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  max-height: calc(100dvh - 36px);
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.14), transparent 36%),
    linear-gradient(28deg, rgba(103, 213, 232, 0.12), transparent 62%),
    #07151f;
}

.geo-fix-modal > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 4px solid #08090d;
  background: #fff7ed;
}

.geo-fix-modal h2,
.geo-fix-modal p {
  margin: 0;
  color: #08090d;
}

.geo-fix-modal h2 {
  font-size: clamp(18px, 2vw, 28px);
  line-height: 1;
}

.geo-fix-modal p {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 900;
}

.geo-fix-dialog-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 16px 0;
}

.geo-fix-dialog-meta span {
  min-width: 0;
  max-width: 100%;
  padding: 5px 8px;
  overflow: hidden;
  border: 1px solid rgba(248, 250, 252, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
  color: rgba(248, 250, 252, 0.78);
  font-size: 10px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#geo-fix-dialog-body {
  min-height: min(520px, calc(100dvh - 300px));
  margin: 12px 16px;
  padding: 16px;
  overflow: auto;
  border: 2px solid rgba(248, 250, 252, 0.14);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.34);
  color: rgba(248, 250, 252, 0.9);
  font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  white-space: pre-wrap;
  word-break: break-word;
}

.geo-fix-dialog-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0;
  padding: 0 16px 16px;
}

.geo-fix-dialog-actions button {
  min-height: 42px;
}

body.app-mode .geo-pipeline-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
}

body.app-mode .geo-engine-page .module-work-item {
  min-height: 56px;
}

body.app-mode .geo-real-answer-item[data-state="failed"],
body.app-mode .geo-real-answer-item[data-state="missing-key"] {
  background: rgba(255, 245, 229, 0.88) !important;
}

body.app-mode .geo-answer-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

body.app-mode .geo-answer-sources a {
  border: 2px solid var(--geo-ink, #08090d);
  border-radius: 999px;
  color: var(--geo-ink, #08090d);
  font-size: 0.72rem;
  font-weight: 900;
  padding: 4px 8px;
  text-decoration: none;
  text-transform: uppercase;
}

body.app-mode .geo-answer-sources a:hover {
  background: var(--geo-ink, #08090d);
  color: #fff7ed;
}

body.app-mode .geo-engine-page .module-work-item span {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-mode .geo-engine-page .geo-kpi-grid article {
  border: 4px solid var(--geo-ink);
  background: #e8fff4 !important;
  color: var(--geo-ink);
  box-shadow: 6px 6px 0 var(--geo-ink);
}

body.app-mode .geo-engine-page .geo-kpi-grid article:nth-child(2) {
  background: #e1f8ff !important;
}

body.app-mode .geo-engine-page .geo-kpi-grid article:nth-child(3) {
  background: #efe9ff !important;
}

body.app-mode .geo-engine-page .geo-kpi-grid article:nth-child(4) {
  background: #fff1cc !important;
}

body.app-mode .geo-engine-page .geo-kpi-grid .eyebrow,
body.app-mode .geo-engine-page .geo-kpi-grid strong,
body.app-mode .geo-engine-page .geo-kpi-grid small {
  color: var(--geo-ink) !important;
}

body.app-mode .geo-engine-page #geo-output {
  border: 3px solid var(--geo-ink);
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.26), transparent 34%),
    #102019;
  color: #f8fff8;
  box-shadow: 5px 5px 0 var(--geo-ink);
}

body.app-mode .geo-proof-strip article {
  border: 3px solid var(--geo-ink);
  background: #fff7ed;
  box-shadow: 5px 5px 0 var(--geo-ink);
}

body.app-mode .geo-proof-strip article:nth-child(1) {
  background: #e8fff4;
}

body.app-mode .geo-proof-strip article:nth-child(2) {
  background: #e1f8ff;
}

body.app-mode .geo-proof-strip article:nth-child(3) {
  background: #efe9ff;
}

body.app-mode .geo-proof-strip article:nth-child(4) {
  background: #fff1cc;
}

body.app-mode .geo-proof-strip article[data-state="done"] {
  background-image: linear-gradient(135deg, rgba(16, 240, 161, 0.28), transparent 62%);
}

body.app-mode .geo-proof-strip article[data-state="ready"] {
  background-image: linear-gradient(135deg, rgba(223, 255, 63, 0.38), transparent 62%);
}

body.app-mode .geo-proof-strip span,
body.app-mode .geo-proof-strip strong,
body.app-mode .geo-proof-strip small {
  color: var(--geo-ink);
}

body.app-mode .geo-workbench-grid .geo-summary-card {
  border: 4px solid var(--geo-ink);
  background: #f7fff7;
  box-shadow: 7px 7px 0 var(--geo-ink);
}

body.app-mode .geo-workbench-grid .geo-summary-card:nth-child(2) {
  background: #fff8e6;
}

body.app-mode .geo-workbench-grid .geo-summary-card:nth-child(3) {
  background: #f2edff;
}

body.app-mode .geo-engine-page .module-list-stack .module-work-item,
body.app-mode .geo-engine-page .module-rule-stack .module-rule-item {
  border: 3px solid var(--geo-ink);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 4px 4px 0 var(--geo-ink);
}

body.app-mode .geo-engine-page .module-list-stack .module-work-item span {
  border: 2px solid var(--geo-ink);
  background: var(--geo-cyan);
  color: var(--geo-ink);
}

body.app-mode .geo-engine-page .module-list-stack .module-work-item:nth-child(2n) span {
  background: var(--geo-purple);
}

body.app-mode .geo-engine-page .module-list-stack .module-work-item:nth-child(3n) span {
  background: var(--geo-lime);
}

body.app-mode .geo-engine-page .module-work-item strong,
body.app-mode .geo-engine-page .module-rule-item strong,
body.app-mode .geo-engine-page .module-work-item small,
body.app-mode .geo-engine-page .module-rule-item small,
body.app-mode .geo-engine-page .module-work-item b {
  color: var(--geo-ink);
}

body.app-mode .geo-fix-draft-panel {
  border: 4px solid var(--geo-ink);
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.24), transparent 38%),
    linear-gradient(130deg, rgba(103, 213, 232, 0.18), rgba(167, 139, 250, 0.18)),
    var(--geo-paper);
  box-shadow: 8px 8px 0 var(--geo-ink);
}

body.app-mode .geo-fix-draft-panel .section-title .eyebrow,
body.app-mode .geo-fix-draft-panel .section-title h3 {
  color: var(--geo-ink);
}

body.app-mode .geo-fix-draft-card,
body.app-mode .geo-fix-draft-empty {
  border: 3px solid var(--geo-ink);
  background: #e8fff4;
  color: var(--geo-ink);
  box-shadow: 5px 5px 0 var(--geo-ink);
}

body.app-mode .geo-fix-draft-card:nth-child(2n) {
  background: #e1f8ff;
}

body.app-mode .geo-fix-draft-card:nth-child(3n) {
  background: #efe9ff;
}

body.app-mode .geo-fix-draft-card:nth-child(4n) {
  background: #fff1cc;
}

body.app-mode .geo-fix-draft-card:nth-child(5n) {
  background: #ffe7ee;
}

body.app-mode .geo-fix-draft-card header span,
body.app-mode .geo-fix-draft-card header b {
  border: 2px solid var(--geo-ink);
  background: var(--geo-ink);
  color: #f8fafc;
}

body.app-mode .geo-fix-draft-card header b {
  background: var(--geo-lime);
  color: var(--geo-ink);
}

body.app-mode .geo-fix-draft-card strong,
body.app-mode .geo-fix-draft-empty strong,
body.app-mode .geo-fix-draft-card small,
body.app-mode .geo-fix-draft-empty small {
  color: var(--geo-ink);
}

body.app-mode .geo-fix-status-row span {
  border: 2px solid var(--geo-ink);
  background: #fff7ed;
  color: var(--geo-ink);
}

body.app-mode .geo-fix-draft-card pre {
  border: 3px solid var(--geo-ink);
  background: #101827;
  color: #e8fff4;
}

body.app-mode .geo-fix-draft-card.implemented {
  border-color: var(--geo-ink);
  background:
    linear-gradient(135deg, rgba(16, 240, 161, 0.38), transparent 62%),
    #e8fff4;
}

body.app-mode .geo-fix-draft-card.implemented .geo-fix-status-row span {
  border-color: var(--geo-ink);
  background: var(--geo-mint);
  color: var(--geo-ink);
}

body.app-mode .geo-pipeline-grid > article {
  border: 4px solid var(--geo-ink);
  background: #fff7ed;
  box-shadow: 7px 7px 0 var(--geo-ink);
}

body.app-mode .geo-pipeline-grid > article:nth-child(2) {
  background: #e1f8ff;
}

@media (max-width: 1320px) {
  body.app-mode .geo-command-hero {
    grid-template-columns: 1fr;
  }

  body.app-mode .geo-audit-controls {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body.app-mode .geo-audit-controls .primary-action,
  body.app-mode .geo-audit-controls .secondary-action {
    grid-column: auto;
  }
}

@media (max-width: 980px) {
  body.app-mode .geo-command-hero,
  body.app-mode .geo-workbench-grid,
  body.app-mode .geo-proof-strip,
  body.app-mode .geo-fix-draft-grid,
  body.app-mode .geo-pipeline-grid {
    grid-template-columns: 1fr;
  }

  body.app-mode .geo-proof-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode .geo-fix-draft-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode .geo-audit-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  body.app-mode .geo-command-hero,
  body.app-mode .geo-url-bar {
    grid-template-columns: 1fr;
  }

  body.app-mode .geo-audit-controls {
    grid-template-columns: 1fr;
  }

  body.app-mode .geo-proof-strip,
  body.app-mode .geo-fix-draft-actions,
  .geo-fix-dialog-actions {
    grid-template-columns: 1fr;
  }

  .geo-fix-dialog {
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
  }

  .geo-fix-modal {
    max-height: calc(100dvh - 24px);
  }

  #geo-fix-dialog-body {
    min-height: min(420px, calc(100dvh - 340px));
    margin-inline: 10px;
    padding: 12px;
    font-size: 11px;
  }
}

body.app-mode .seo-action-console {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.app-mode .seo-action-console button {
  min-height: 68px;
  padding: 9px !important;
  gap: 4px;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .seo-action-console span {
  padding: 3px 5px;
  font-size: 8px;
}

body.app-mode .seo-action-console strong {
  font-size: 11px;
  line-height: 1.12;
}

body.app-mode .seo-workbench-grid {
  grid-template-columns: 1.15fr repeat(3, minmax(0, 1fr));
}

body.app-mode .seo-rank-map {
  gap: 5px;
  padding: 9px !important;
}

body.app-mode .seo-rank-map div {
  min-height: 31px;
  grid-template-columns: 45px minmax(0, 1fr);
  gap: 6px;
  padding: 5px;
}

body.app-mode .seo-rank-map b {
  min-height: 23px;
  font-size: 11px;
}

body.app-mode .seo-rank-map small {
  font-size: 10px;
  line-height: 1.28;
}

body.app-mode .seo-task-card {
  display: grid;
  align-content: start;
  gap: 8px;
  min-height: 136px;
  padding: 14px !important;
}

body.app-mode .seo-task-card strong {
  max-width: 18ch;
  font-size: 15px;
  line-height: 1.12;
}

body.app-mode .seo-task-card p {
  max-width: 28ch;
  margin: 0;
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
}

body.app-mode .seo-task-card .eyebrow {
  width: fit-content;
  padding: 3px 6px;
  border: 2px solid #08090d;
  background: #fff7ed !important;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 8px;
}

body.app-mode .seo-pipeline-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

body.app-mode .seo-pipeline-grid .module-work-grid > article,
body.app-mode .seo-pipeline-grid > article {
  padding: 12px !important;
}

@media (max-width: 760px) {
  body.app-mode .seo-command-hero,
  body.app-mode .seo-action-console,
  body.app-mode .seo-workbench-grid,
  body.app-mode .seo-pipeline-grid {
    grid-template-columns: 1fr !important;
  }

  body.app-mode .seo-command-hero .primary-action,
  body.app-mode .seo-action-console button,
  body.app-mode .seo-pipeline-grid .module-queue-button {
    width: 100%;
  }

  body.app-mode .seo-pipeline-grid .module-work-item {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  body.app-mode .seo-pipeline-grid .module-work-item .module-queue-button {
    grid-column: 1 / -1;
    min-width: 0;
  }
}

/* Compact Community workbench: keep moderation, flows, and integrations dense. */
body.app-mode .community-ops-page {
  padding: 18px !important;
}

body.app-mode .community-ops-page .panel-header {
  margin-bottom: 12px;
}

body.app-mode .community-command-hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(210px, 0.58fr) 132px;
  gap: 10px;
  margin-bottom: 10px;
}

body.app-mode .community-command-hero > div:first-child,
body.app-mode .community-alert-stack {
  padding: 11px !important;
}

body.app-mode .community-command-hero strong {
  font-size: 16px;
  line-height: 1.08;
}

body.app-mode .community-command-hero p {
  margin: 0;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}

body.app-mode .community-command-hero .primary-action {
  min-width: 0;
  min-height: 0;
  padding: 10px 9px;
  font-size: 11px;
  line-height: 1.15;
}

body.app-mode .community-alert-stack {
  gap: 6px;
}

body.app-mode .community-alert-stack span {
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 6px;
  padding: 6px;
  font-size: 8px;
  line-height: 1.15;
}

body.app-mode .community-alert-stack b {
  min-height: 24px;
  font-size: 11px;
}

body.app-mode .community-ops-page .module-kpi-grid,
body.app-mode .community-action-console,
body.app-mode .community-board,
body.app-mode .community-flow-grid {
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode .community-ops-page .module-kpi-grid article {
  min-height: 68px;
  padding: 10px !important;
}

body.app-mode .community-action-console button {
  min-height: 68px;
  padding: 9px !important;
  gap: 4px;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .community-action-console span {
  padding: 3px 5px;
  font-size: 8px;
}

body.app-mode .community-action-console strong {
  font-size: 11px;
  line-height: 1.12;
}

body.app-mode .community-lane {
  gap: 7px;
  min-height: 156px;
  padding: 12px !important;
}

body.app-mode .community-lane strong {
  max-width: 22ch;
  font-size: 15px;
  line-height: 1.12;
}

body.app-mode .community-lane p {
  margin: 0;
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}

body.app-mode .community-lane small {
  padding: 6px;
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode .community-flow-grid > article {
  padding: 12px !important;
}

@media (max-width: 760px) {
  body.app-mode .community-command-hero,
  body.app-mode .community-action-console,
  body.app-mode .community-board,
  body.app-mode .community-flow-grid {
    grid-template-columns: 1fr !important;
  }

  body.app-mode .community-command-hero .primary-action,
  body.app-mode .community-action-console button {
    width: 100%;
  }
}

/* Compact Telegram workbench: make channel, bot, and revenue controls scannable. */
body.app-mode .telegram-console-page {
  padding: 18px !important;
}

body.app-mode .telegram-console-page .panel-header {
  margin-bottom: 12px;
}

body.app-mode .telegram-command-hero {
  grid-template-columns: minmax(0, 1.16fr) minmax(214px, 0.58fr) 132px;
  gap: 10px;
  margin-bottom: 10px;
}

body.app-mode .telegram-command-hero > div:first-child,
body.app-mode .telegram-phone-preview {
  padding: 11px !important;
}

body.app-mode .telegram-command-hero strong {
  font-size: 16px;
  line-height: 1.08;
}

body.app-mode .telegram-command-hero p,
body.app-mode .telegram-phone-preview p {
  margin: 0;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}

body.app-mode .telegram-phone-preview {
  min-height: 150px;
  gap: 6px;
  border-radius: 18px !important;
}

body.app-mode .telegram-phone-preview::before {
  width: 42px;
  height: 4px;
  margin-bottom: 0;
}

body.app-mode .telegram-phone-preview strong {
  font-size: 13px;
  line-height: 1.12;
}

body.app-mode .telegram-phone-preview small {
  font-size: 9px;
  line-height: 1.25;
}

body.app-mode .telegram-command-hero .primary-action {
  min-width: 0;
  min-height: 0;
  padding: 10px 9px;
  font-size: 11px;
  line-height: 1.15;
}

body.app-mode .telegram-console-page .module-kpi-grid,
body.app-mode .telegram-action-console,
body.app-mode .telegram-console-grid,
body.app-mode .telegram-work-grid {
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode .telegram-console-page .module-kpi-grid article {
  min-height: 68px;
  padding: 10px !important;
}

body.app-mode .telegram-action-console button {
  min-height: 68px;
  padding: 9px !important;
  gap: 4px;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .telegram-action-console span {
  padding: 3px 5px;
  font-size: 8px;
}

body.app-mode .telegram-action-console strong {
  font-size: 11px;
  line-height: 1.12;
}

body.app-mode .telegram-console-card {
  gap: 7px;
  min-height: 150px;
  padding: 12px !important;
}

body.app-mode .telegram-console-card strong {
  max-width: 22ch;
  font-size: 15px;
  line-height: 1.12;
}

body.app-mode .telegram-console-card p {
  margin: 0;
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}

body.app-mode .telegram-console-card div {
  gap: 4px;
}

body.app-mode .telegram-console-card div span {
  min-height: 23px;
  font-size: 8px;
}

body.app-mode .telegram-work-grid > article {
  padding: 12px !important;
}

@media (max-width: 760px) {
  body.app-mode .telegram-command-hero,
  body.app-mode .telegram-action-console,
  body.app-mode .telegram-console-grid,
  body.app-mode .telegram-work-grid {
    grid-template-columns: 1fr !important;
  }

  body.app-mode .telegram-command-hero .primary-action,
  body.app-mode .telegram-action-console button {
    width: 100%;
  }
}

/* Compact Reports workbench: client exports, evidence, and links in one scan. */
body.app-mode .reports-panel {
  padding: 18px !important;
}

body.app-mode .reports-panel .panel-header {
  margin-bottom: 12px;
}

body.app-mode .reports-panel .panel-header h2 {
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode .reports-panel .panel-header .secondary-action {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 11px;
}

body.app-mode .report-hero-strip {
  gap: 10px;
  min-height: 76px;
  margin-bottom: 10px;
  padding: 11px !important;
}

body.app-mode .report-hero-strip strong {
  font-size: 16px;
  line-height: 1.08;
}

body.app-mode .report-hero-strip p {
  margin: 0;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}

body.app-mode .reports-panel .report-grid,
body.app-mode .reports-panel .report-paid-grid,
body.app-mode .reports-panel .report-source-proof-panel,
body.app-mode .reports-panel .agent-proof-panel,
body.app-mode .reports-panel .report-actions,
body.app-mode .reports-panel .report-work-grid {
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode .reports-panel .report-source-proof-panel {
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 60%),
    #f8f0ff;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .reports-panel .report-source-proof-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}

body.app-mode .reports-panel .report-source-proof-header h3 {
  margin: 2px 0 0;
  color: #08090d;
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode .reports-panel .report-source-proof-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .reports-panel .report-source-proof-kpis article,
body.app-mode .reports-panel .report-source-proof-item,
body.app-mode .reports-panel .report-source-proof-empty {
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.94);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode .reports-panel .report-source-proof-kpis article {
  min-height: 78px;
  padding: 10px;
}

body.app-mode .reports-panel .report-source-proof-kpis span,
body.app-mode .reports-panel .report-source-proof-kpis small,
body.app-mode .reports-panel .report-source-proof-item span,
body.app-mode .reports-panel .report-source-proof-item small,
body.app-mode .reports-panel .report-source-proof-empty small {
  display: block;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode .reports-panel .report-source-proof-kpis strong {
  display: block;
  margin: 4px 0;
  color: #08090d;
  font-size: 19px;
  line-height: 1;
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .report-source-proof-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

body.app-mode .reports-panel .report-source-proof-item {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) max-content;
  gap: 8px;
  align-items: start;
  padding: 9px;
  background: #e5f8ff;
}

body.app-mode .reports-panel .report-source-proof-item:nth-child(3n + 2) {
  background: #eefbdc;
}

body.app-mode .reports-panel .report-source-proof-item:nth-child(3n) {
  background: #fff0da;
}

body.app-mode .reports-panel .report-source-proof-item strong,
body.app-mode .reports-panel .report-source-proof-empty strong {
  display: block;
  color: #08090d;
  font-size: 12px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .report-source-proof-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 7px;
}

body.app-mode .reports-panel .report-source-proof-links a,
body.app-mode .reports-panel .report-source-proof-links b,
body.app-mode .reports-panel .report-source-proof-item > b {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  max-width: 100%;
  padding: 5px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #ffffff;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .report-source-proof-item > b {
  justify-self: end;
  background: #d5ff00;
  text-align: center;
}

body.app-mode .reports-panel .report-source-proof-item > b.attention,
body.app-mode .reports-panel .report-source-proof-links b {
  background: #ffd3d3;
}

body.app-mode .reports-panel .report-source-proof-empty {
  padding: 12px;
}

body.app-mode .reports-panel .agent-proof-panel {
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fffaf4;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .reports-panel .agent-proof-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}

body.app-mode .reports-panel .agent-proof-header h3 {
  margin: 2px 0 0;
  color: #08090d;
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode .reports-panel .agent-proof-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .reports-panel .agent-proof-kpis article,
body.app-mode .reports-panel .agent-proof-grid > article,
body.app-mode .reports-panel .agent-proof-item {
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode .reports-panel .agent-proof-kpis article {
  min-height: 78px;
  padding: 10px;
}

body.app-mode .reports-panel .agent-proof-kpis span,
body.app-mode .reports-panel .agent-proof-kpis small {
  display: block;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode .reports-panel .agent-proof-kpis strong {
  display: block;
  margin: 4px 0;
  color: #08090d;
  font-size: 19px;
  line-height: 1;
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .agent-proof-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

body.app-mode .reports-panel .agent-proof-grid > article {
  min-width: 0;
  padding: 10px;
  background: #e5f8ff;
}

body.app-mode .reports-panel .agent-proof-grid > article:nth-child(2) {
  background: #eefbdc;
}

body.app-mode .reports-panel .agent-proof-grid > article:nth-child(3) {
  background: #f1e8ff;
}

body.app-mode .reports-panel .agent-proof-list {
  display: grid;
  gap: 7px;
  margin-top: 8px;
}

body.app-mode .reports-panel .agent-proof-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 6px 8px;
  align-items: flex-start;
  min-height: 58px;
  padding: 8px;
  background: rgba(255, 250, 240, 0.94);
}

body.app-mode .reports-panel .agent-proof-item > span {
  grid-column: 1;
  grid-row: 1;
}

body.app-mode .reports-panel .agent-proof-item > div {
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
}

body.app-mode .reports-panel .agent-proof-item span,
body.app-mode .reports-panel .agent-proof-item small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 9.5px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .agent-proof-item strong {
  display: -webkit-box;
  color: #08090d;
  font-size: 11px;
  line-height: 1.14;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.app-mode .reports-panel .agent-proof-item small {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.app-mode .reports-panel .agent-proof-item b {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  max-width: 96px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 8px;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .mission-proof-panel {
  margin: 10px 0 12px;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 64%),
    #e3f7c9;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .reports-panel .mission-proof-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 10px;
}

body.app-mode .reports-panel .mission-proof-header h3 {
  margin: 2px 0 0;
  color: #08090d;
  font-size: 18px;
  line-height: 1.05;
}

body.app-mode .reports-panel .mission-proof-controls {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto minmax(220px, 0.7fr);
  gap: 10px;
  align-items: end;
}

body.app-mode .reports-panel .mission-proof-controls label {
  display: grid;
  gap: 5px;
  color: rgba(8, 9, 13, 0.74);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.app-mode .reports-panel .mission-proof-controls select {
  min-height: 38px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.94);
  color: #08090d;
  font: 800 12px/1.25 "Inter", system-ui, sans-serif;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode .reports-panel .mission-proof-controls small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  line-height: 1.3;
}

body.app-mode .reports-panel .mission-proof-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

body.app-mode .reports-panel .mission-proof-kpis article {
  min-height: 78px;
  padding: 10px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.88);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode .reports-panel .mission-proof-kpis span,
body.app-mode .reports-panel .mission-proof-kpis small {
  display: block;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode .reports-panel .mission-proof-kpis strong {
  display: block;
  margin: 4px 0;
  color: #08090d;
  font-size: 19px;
  line-height: 1;
}

body.app-mode .reports-panel .mission-proof-grid {
  display: grid;
  grid-template-columns: minmax(260px, 0.42fr) minmax(0, 1fr);
  gap: 10px;
  margin-top: 10px;
}

body.app-mode .reports-panel .mission-proof-summary,
body.app-mode .reports-panel .mission-proof-presenter,
body.app-mode .reports-panel .mission-proof-empty {
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.3), transparent 62%),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .reports-panel .mission-proof-summary strong,
body.app-mode .reports-panel .mission-proof-presenter strong,
body.app-mode .reports-panel .mission-proof-empty strong {
  display: block;
  color: #08090d;
  font-size: 16px;
  line-height: 1.15;
}

body.app-mode .reports-panel .mission-proof-summary small,
body.app-mode .reports-panel .mission-proof-presenter small,
body.app-mode .reports-panel .mission-proof-empty small,
body.app-mode .reports-panel .mission-proof-summary p {
  display: block;
  margin: 8px 0 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  line-height: 1.35;
}

body.app-mode .reports-panel .mission-proof-presenter {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.3), transparent 62%),
    #dff6ff;
}

body.app-mode .reports-panel .mission-proof-presenter.wide {
  grid-column: span 1;
}

body.app-mode .reports-panel .mission-presenter-list {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

body.app-mode .reports-panel .mission-presenter-list div {
  min-width: 0;
  padding: 8px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.9);
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode .reports-panel .mission-presenter-list span {
  display: inline-block;
  margin-bottom: 4px;
  padding: 3px 5px;
  border: 2px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

body.app-mode .reports-panel .mission-presenter-list strong,
body.app-mode .reports-panel .mission-presenter-list small {
  overflow-wrap: anywhere;
}

body.app-mode .reports-panel .mission-proof-list {
  display: grid;
  grid-column: 1 / -1;
  gap: 7px;
}

body.app-mode .reports-panel .mission-proof-list article {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr) minmax(72px, auto);
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.9);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode .reports-panel .mission-proof-list span,
body.app-mode .reports-panel .mission-proof-list small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode .reports-panel .mission-proof-list strong {
  color: #08090d;
  font-size: 12px;
  line-height: 1.2;
}

body.app-mode .reports-panel .mission-proof-list b {
  justify-self: end;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
  line-height: 1;
  text-transform: uppercase;
}

body.app-mode .reports-panel .report-grid article,
body.app-mode .reports-panel .report-paid-grid article {
  min-height: 86px;
  padding: 10px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 62%),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .reports-panel .report-grid article:nth-child(4n + 1),
body.app-mode .reports-panel .report-paid-grid article:nth-child(4n + 1) {
  background-color: #d5ff00 !important;
}

body.app-mode .reports-panel .report-grid article:nth-child(4n + 2),
body.app-mode .reports-panel .report-paid-grid article:nth-child(4n + 2) {
  background-color: #22d3ee !important;
}

body.app-mode .reports-panel .report-grid article:nth-child(4n + 3),
body.app-mode .reports-panel .report-paid-grid article:nth-child(4n + 3) {
  background-color: #a78bfa !important;
}

body.app-mode .reports-panel .report-grid article:nth-child(4n),
body.app-mode .reports-panel .report-paid-grid article:nth-child(4n) {
  background-color: #ff9f1c !important;
}

body.app-mode .reports-panel .report-grid strong,
body.app-mode .reports-panel .report-paid-grid strong {
  color: #08090d !important;
  font-size: 13px;
  line-height: 1.12;
}

body.app-mode .reports-panel .report-grid small,
body.app-mode .reports-panel .report-paid-grid small {
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.3;
}

body.app-mode .reports-panel .report-actions button {
  min-height: 62px !important;
  padding: 9px !important;
  gap: 4px;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .reports-panel .report-actions span {
  padding: 3px 5px;
  font-size: 8px;
}

body.app-mode .reports-panel .report-actions strong {
  font-size: 11px;
  line-height: 1.12;
}

body.app-mode .reports-panel .report-work-grid > article {
  padding: 12px !important;
}

body.app-mode .reports-panel #reports-output {
  margin: 0 0 12px !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
  font-size: 11px;
  line-height: 1.35;
}

body.app-mode .reports-panel #reports-output a {
  color: #08090d;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.app-mode .reports-panel .report-manage-item {
  grid-template-columns: 34px minmax(0, 1fr) auto auto auto;
  gap: 8px;
}

body.app-mode .reports-panel .report-manage-item button {
  min-height: 26px;
  padding: 5px 7px;
  border-radius: 6px;
  font-size: 8px;
}

@media (max-width: 760px) {
  body.app-mode .reports-panel .report-grid,
  body.app-mode .reports-panel .report-paid-grid,
  body.app-mode .reports-panel .report-actions,
  body.app-mode .reports-panel .report-work-grid,
  body.app-mode .reports-panel .report-manage-item,
  body.app-mode .reports-panel .mission-proof-controls,
  body.app-mode .reports-panel .mission-proof-kpis,
  body.app-mode .reports-panel .mission-proof-grid,
  body.app-mode .reports-panel .mission-proof-list article {
    grid-template-columns: 1fr !important;
  }

  body.app-mode .reports-panel .mission-proof-header {
    flex-direction: column;
  }

  body.app-mode .reports-panel .mission-proof-list b {
    justify-self: start;
  }
}

/* Compact Plan and Credits workbench: billing state, capacity, and credits at a glance. */
body.app-mode [data-view-section="subscription"] > .full-panel {
  padding: 18px !important;
}

body.app-mode [data-view-section="subscription"] .panel-header {
  margin-bottom: 12px;
}

body.app-mode [data-view-section="subscription"] .panel-header h2 {
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode [data-view-section="subscription"] .billing-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.app-mode [data-view-section="subscription"] #billing-portal-button {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 11px;
}

body.app-mode [data-view-section="subscription"] #billing-output {
  margin: 0 0 12px !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

body.app-mode [data-view-section="subscription"] .subscription-summary,
body.app-mode [data-view-section="subscription"] .plan-usage-grid,
body.app-mode [data-view-section="subscription"] .plan-grid,
body.app-mode [data-view-section="subscription"] .billing-grid {
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode [data-view-section="subscription"] .subscription-summary div,
body.app-mode [data-view-section="subscription"] .plan-usage-grid article,
body.app-mode [data-view-section="subscription"] .billing-grid .metric-card {
  min-height: 72px !important;
  padding: 10px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 62%),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode [data-view-section="subscription"] .subscription-summary div:nth-child(3n + 1),
body.app-mode [data-view-section="subscription"] .plan-usage-grid article:nth-child(4n + 1),
body.app-mode [data-view-section="subscription"] .billing-grid .metric-card:nth-child(3n + 1) {
  background-color: #d5ff00 !important;
}

body.app-mode [data-view-section="subscription"] .subscription-summary div:nth-child(3n + 2),
body.app-mode [data-view-section="subscription"] .plan-usage-grid article:nth-child(4n + 2),
body.app-mode [data-view-section="subscription"] .billing-grid .metric-card:nth-child(3n + 2) {
  background-color: #22d3ee !important;
}

body.app-mode [data-view-section="subscription"] .subscription-summary div:nth-child(3n),
body.app-mode [data-view-section="subscription"] .plan-usage-grid article:nth-child(4n + 3),
body.app-mode [data-view-section="subscription"] .billing-grid .metric-card:nth-child(3n) {
  background-color: #a78bfa !important;
}

body.app-mode [data-view-section="subscription"] .plan-usage-grid article:nth-child(4n) {
  background-color: #ff9f1c !important;
}

body.app-mode [data-view-section="subscription"] .subscription-summary strong,
body.app-mode [data-view-section="subscription"] .plan-usage-grid strong,
body.app-mode [data-view-section="subscription"] .billing-grid strong {
  color: #08090d !important;
  font-size: 15px;
  line-height: 1.08;
}

body.app-mode [data-view-section="subscription"] .subscription-summary small,
body.app-mode [data-view-section="subscription"] .plan-usage-grid small,
body.app-mode [data-view-section="subscription"] .billing-grid small {
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.3;
}

body.app-mode [data-view-section="subscription"] .plan-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode [data-view-section="subscription"] .plan-card {
  min-height: 136px !important;
  padding: 10px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode [data-view-section="subscription"] .plan-card.selected {
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.46), transparent 56%),
    #fff7ed !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode [data-view-section="subscription"] .plan-card header {
  gap: 8px;
}

body.app-mode [data-view-section="subscription"] .plan-card h3 {
  font-size: 14px;
  line-height: 1.08;
}

body.app-mode [data-view-section="subscription"] .plan-card header strong {
  display: inline-flex;
  align-items: baseline;
  min-width: max-content;
  color: #08090d !important;
  font-size: 17px;
  line-height: 1;
  white-space: nowrap;
}

body.app-mode [data-view-section="subscription"] .plan-card header small {
  font-size: 9px;
  line-height: 1;
}

body.app-mode [data-view-section="subscription"] .plan-card header span,
body.app-mode [data-view-section="subscription"] .plan-card p,
body.app-mode [data-view-section="subscription"] .plan-usage-note {
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.3;
}

body.app-mode [data-view-section="subscription"] .plan-usage-note {
  display: block;
  min-height: 30px;
}

body.app-mode [data-view-section="subscription"] .plan-card button,
body.app-mode [data-view-section="subscription"] .topup-form button {
  min-height: 30px;
  padding: 6px 9px;
  border: 2px solid #08090d !important;
  border-radius: 6px !important;
  background: #d5ff00 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 9px;
  font-weight: 900;
}

body.app-mode [data-view-section="subscription"] .billing-drawer {
  margin: 12px 0 0;
  border: 3px solid #08090d;
  border-radius: 9px;
  background: rgba(255, 247, 237, 0.78);
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .project-credit-panel {
  display: grid;
  grid-template-columns: minmax(240px, 0.7fr) minmax(360px, 1.3fr);
  gap: 12px;
  margin: 12px 0;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(120deg, rgba(213, 255, 0, 0.52), transparent 48%),
    linear-gradient(315deg, rgba(185, 163, 255, 0.42), transparent 54%),
    #d7f4ff;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .project-credit-panel h3 {
  margin: 4px 0 8px;
  color: #08090d;
  font-size: 18px;
  line-height: 1.05;
}

body.app-mode [data-view-section="subscription"] .project-credit-panel p {
  margin: 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.4;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid article {
  min-height: 86px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid article.tone-1 {
  background: #d5ff00;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid article.tone-2 {
  background: #77d7e8;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid article.tone-3 {
  background: #b9a3ff;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid article.tone-4 {
  background: #ffd08a;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid strong,
body.app-mode [data-view-section="subscription"] .project-credit-grid small {
  display: block;
  color: #08090d;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid strong {
  margin-top: 5px;
  font-size: 14px;
  line-height: 1.12;
}

body.app-mode [data-view-section="subscription"] .project-credit-grid small {
  margin-top: 6px;
  color: rgba(8, 9, 13, 0.72);
  font-size: 9px;
  font-weight: 750;
  line-height: 1.28;
}

body.app-mode [data-view-section="subscription"] .credit-system-panel {
  display: grid;
  grid-template-columns: minmax(220px, 0.75fr) minmax(220px, 0.45fr);
  gap: 12px;
  margin: 12px 0;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.26), transparent 52%),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .credit-system-panel h3 {
  margin: 4px 0 8px;
  color: #08090d;
  font-size: 18px;
  line-height: 1.05;
}

body.app-mode [data-view-section="subscription"] .credit-system-panel p {
  margin: 0;
  max-width: 680px;
  color: rgba(8, 9, 13, 0.76);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.38;
}

body.app-mode [data-view-section="subscription"] .credit-topup-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode [data-view-section="subscription"] .credit-topup-grid article,
body.app-mode [data-view-section="subscription"] .credit-service-card {
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .credit-topup-grid article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  padding: 7px 9px;
}

body.app-mode [data-view-section="subscription"] .credit-topup-grid strong,
body.app-mode [data-view-section="subscription"] .credit-topup-grid span {
  color: #08090d;
  font-size: 12px;
  font-weight: 900;
}

body.app-mode [data-view-section="subscription"] .credit-system-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode [data-view-section="subscription"] .credit-service-card {
  min-height: 92px;
  padding: 10px;
}

body.app-mode [data-view-section="subscription"] .credit-service-card.tone-1 {
  background: #d5ff00;
}

body.app-mode [data-view-section="subscription"] .credit-service-card.tone-2 {
  background: #77d7e8;
}

body.app-mode [data-view-section="subscription"] .credit-service-card.tone-3 {
  background: #b9a3ff;
}

body.app-mode [data-view-section="subscription"] .credit-service-card.tone-4 {
  background: #ffd08a;
}

body.app-mode [data-view-section="subscription"] .credit-service-card strong,
body.app-mode [data-view-section="subscription"] .credit-service-card b,
body.app-mode [data-view-section="subscription"] .credit-service-card small {
  display: block;
  color: #08090d;
}

body.app-mode [data-view-section="subscription"] .credit-service-card strong {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.16;
}

body.app-mode [data-view-section="subscription"] .credit-service-card b {
  margin-top: 8px;
  font-size: 13px;
}

body.app-mode [data-view-section="subscription"] .credit-service-card small {
  margin-top: 5px;
  color: rgba(8, 9, 13, 0.74);
  font-size: 9px;
  font-weight: 750;
  line-height: 1.28;
}

body.app-mode [data-view-section="subscription"] .billing-drawer summary {
  min-height: 38px;
  padding: 0 10px;
}

body.app-mode [data-view-section="subscription"] .billing-drawer summary span {
  color: #08090d !important;
  font-size: 12px;
}

body.app-mode [data-view-section="subscription"] .billing-drawer summary small {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px;
}

body.app-mode [data-view-section="subscription"] .billing-drawer .billing-grid,
body.app-mode [data-view-section="subscription"] .billing-drawer .topup-form,
body.app-mode [data-view-section="subscription"] .billing-drawer .invoice-list,
body.app-mode [data-view-section="subscription"] .billing-drawer .event-list {
  margin: 10px;
}

body.app-mode [data-view-section="subscription"] .topup-form {
  grid-template-columns: minmax(220px, 0.45fr) minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .topup-form label {
  color: #08090d !important;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode [data-view-section="subscription"] .topup-form select {
  min-height: 32px !important;
}

body.app-mode [data-view-section="subscription"] .invoice-row {
  min-height: 52px;
  padding: 9px 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode [data-view-section="subscription"] .ledger-large {
  max-height: 260px;
  overflow: auto;
}

@media (max-width: 760px) {
  body.app-mode [data-view-section="subscription"] .subscription-summary,
  body.app-mode [data-view-section="subscription"] .plan-usage-grid,
  body.app-mode [data-view-section="subscription"] .plan-grid,
  body.app-mode [data-view-section="subscription"] .billing-grid,
  body.app-mode [data-view-section="subscription"] .topup-form,
  body.app-mode [data-view-section="subscription"] .project-credit-panel,
  body.app-mode [data-view-section="subscription"] .project-credit-grid,
  body.app-mode [data-view-section="subscription"] .credit-system-panel,
  body.app-mode [data-view-section="subscription"] .credit-system-grid,
  body.app-mode [data-view-section="subscription"] .credit-topup-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Compact Brand Voice workbench: tone, audience, and guardrails in one scan. */
body.app-mode [data-view-section="brand"] .brand-panel {
  grid-column: 1 / -1;
  min-height: 0;
  padding: 18px !important;
}

body.app-mode [data-view-section="brand"] .panel-header {
  margin-bottom: 12px;
}

body.app-mode [data-view-section="brand"] .panel-header h2 {
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode [data-view-section="brand"] .brand-context-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode [data-view-section="brand"] .brand-context-grid article {
  min-height: 94px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode [data-view-section="brand"] .brand-context-grid article.tone-1 {
  background: #d5ff00;
}

body.app-mode [data-view-section="brand"] .brand-context-grid article.tone-2 {
  background: #77d7e8;
}

body.app-mode [data-view-section="brand"] .brand-context-grid article.tone-3 {
  background: #b9a3ff;
}

body.app-mode [data-view-section="brand"] .brand-context-grid article.tone-4 {
  background: #ffd08a;
}

body.app-mode [data-view-section="brand"] .brand-context-grid strong,
body.app-mode [data-view-section="brand"] .brand-context-grid small {
  display: block;
  color: #08090d;
}

body.app-mode [data-view-section="brand"] .brand-context-grid strong {
  margin-top: 5px;
  font-size: 14px;
  line-height: 1.1;
}

body.app-mode [data-view-section="brand"] .brand-context-grid small {
  margin-top: 6px;
  color: rgba(8, 9, 13, 0.72);
  font-size: 9px;
  font-weight: 750;
  line-height: 1.28;
}

body.app-mode [data-view-section="brand"] .brand-form {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(250px, 0.78fr) minmax(260px, 0.84fr) auto;
  align-items: end;
  gap: 10px;
  margin-bottom: 12px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(34, 211, 238, 0.20), transparent 48%),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode [data-view-section="brand"] .brand-form label {
  gap: 5px;
  color: #08090d !important;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode [data-view-section="brand"] .brand-form textarea,
body.app-mode [data-view-section="brand"] .brand-form input {
  width: 100%;
  min-width: 0;
  min-height: 36px !important;
  padding: 8px 9px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 12px !important;
  line-height: 1.3;
}

body.app-mode [data-view-section="brand"] .brand-form textarea {
  min-height: 86px !important;
  resize: vertical;
}

body.app-mode [data-view-section="brand"] .brand-form button {
  min-height: 36px;
  padding: 7px 12px;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #d5ff00 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 10px;
  font-weight: 900;
}

body.app-mode [data-view-section="brand"] #brand-output {
  margin: 0 0 12px !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

body.app-mode [data-view-section="brand"] .brand-style-guide {
  display: grid;
  grid-template-columns: minmax(230px, 0.58fr) minmax(0, 1.42fr);
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.38), transparent 46%),
    linear-gradient(315deg, rgba(119, 215, 232, 0.44), transparent 52%),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode [data-view-section="brand"] .brand-style-guide h3 {
  margin: 4px 0 8px;
  color: #08090d;
  font-size: 18px;
  line-height: 1.05;
}

body.app-mode [data-view-section="brand"] .brand-style-guide p {
  margin: 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.4;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid article {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  min-height: 104px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid article.tone-1 {
  background: #d5ff00;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid article.tone-2 {
  background: #77d7e8;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid article.tone-3 {
  background: #b9a3ff;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid article.tone-4 {
  background: #ffd08a;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid span {
  color: #08090d;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 900;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid strong,
body.app-mode [data-view-section="brand"] .brand-rule-grid small,
body.app-mode [data-view-section="brand"] .brand-rule-grid em {
  display: block;
  color: #08090d;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid strong {
  font-size: 12px;
  line-height: 1.1;
}

body.app-mode [data-view-section="brand"] .brand-rule-grid small,
body.app-mode [data-view-section="brand"] .brand-rule-grid em {
  margin-top: 5px;
  color: rgba(8, 9, 13, 0.76);
  font-size: 9px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.28;
}

body.app-mode [data-view-section="brand"] .brand-actions {
  gap: 10px !important;
  margin-bottom: 0 !important;
}

body.app-mode [data-view-section="brand"] .brand-actions button {
  min-height: 64px !important;
  padding: 9px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode [data-view-section="brand"] .brand-actions span {
  padding: 3px 5px;
  font-size: 8px;
}

body.app-mode [data-view-section="brand"] .brand-actions strong {
  font-size: 11px;
  line-height: 1.12;
}

body.app-mode[data-active-view="brand"] .app-footer:not(.universal-footer) {
  margin-top: 180px !important;
}

.brand-agent-dock {
  display: none;
}

body.app-mode[data-active-view="brand"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="brand"] [data-view-section="brand"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="brand"] .brand-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-mode,
body.app-mode[data-active-view="brand"] .brand-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="brand"] .brand-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-mode button,
body.app-mode[data-active-view="brand"] .brand-agent-options button,
body.app-mode[data-active-view="brand"] .brand-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-mode button.active,
body.app-mode[data-active-view="brand"] .brand-agent-send,
body.app-mode[data-active-view="brand"] .brand-agent-options button:hover {
  background: #dfff3f !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="brand"] .brand-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-brand-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-brand-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-brand-answer .dashboard-answer-modal h2 {
  max-width: 34ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-brand-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-brand-answer .brand-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(119, 215, 232, 0.28), transparent 54%),
    linear-gradient(35deg, rgba(213, 255, 0, 0.26), transparent 66%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-brand-answer .brand-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-brand-answer .brand-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(119, 215, 232, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-brand-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-brand-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-brand-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-brand-answer .dashboard-report-section,
.dashboard-answer-dialog.is-brand-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

/* Brand Voice page polish: compact rules, softer accents, sticky dock only for prompts. */
body.app-mode[data-active-view="brand"] [data-view-section="brand"] .brand-panel {
  display: grid !important;
  gap: 10px !important;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 42%),
    linear-gradient(315deg, rgba(223, 255, 63, 0.10), transparent 54%),
    rgba(255, 250, 240, 0.96) !important;
}

body.app-mode[data-active-view="brand"] [data-view-section="brand"] .panel-header {
  margin: 0 !important;
}

body.app-mode[data-active-view="brand"] [data-view-section="brand"] .panel-header h2 {
  max-width: 27ch !important;
  font-size: 22px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="brand"] [data-view-section="brand"] .panel-header .badge {
  min-height: 30px !important;
  border-width: 2px !important;
  padding: 6px 10px !important;
  font-size: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="brand"] .brand-context-grid {
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="brand"] .brand-context-grid article,
body.app-mode[data-active-view="brand"] .brand-rule-grid article {
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
  background:
    linear-gradient(90deg, var(--brand-card-accent, #67d5e8) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="brand"] .brand-context-grid article.tone-1,
body.app-mode[data-active-view="brand"] .brand-rule-grid article.tone-1 {
  --brand-card-accent: #dfff3f;
}

body.app-mode[data-active-view="brand"] .brand-context-grid article.tone-2,
body.app-mode[data-active-view="brand"] .brand-rule-grid article.tone-2 {
  --brand-card-accent: #67d5e8;
}

body.app-mode[data-active-view="brand"] .brand-context-grid article.tone-3,
body.app-mode[data-active-view="brand"] .brand-rule-grid article.tone-3 {
  --brand-card-accent: #b9a7ff;
}

body.app-mode[data-active-view="brand"] .brand-context-grid article.tone-4,
body.app-mode[data-active-view="brand"] .brand-rule-grid article.tone-4 {
  --brand-card-accent: #ffb15e;
}

body.app-mode[data-active-view="brand"] .brand-context-grid article {
  min-height: 112px !important;
  padding: 8px 8px 8px 12px !important;
}

body.app-mode[data-active-view="brand"] .brand-context-grid strong {
  margin-top: 4px !important;
  font-size: 12px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="brand"] .brand-context-grid small {
  margin-top: 5px !important;
  font-size: 8.5px !important;
  line-height: 1.17 !important;
}

body.app-mode[data-active-view="brand"] .brand-form {
  grid-template-columns: minmax(0, 1fr) minmax(210px, 0.72fr) minmax(220px, 0.78fr) 84px !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 10px !important;
  border-width: 2px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 48%),
    rgba(255, 255, 255, 0.62) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="brand"] .brand-form label {
  font-size: 9px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="brand"] .brand-form textarea,
body.app-mode[data-active-view="brand"] .brand-form input {
  min-height: 32px !important;
  padding: 7px 8px !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 10.5px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="brand"] .brand-form textarea {
  min-height: 68px !important;
}

body.app-mode[data-active-view="brand"] .brand-form button {
  min-height: 32px !important;
  padding: 6px 8px !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="brand"] .brand-status {
  margin: 0 !important;
  min-height: 32px !important;
  padding: 8px 10px !important;
  border-width: 2px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.42) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.68) !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="brand"] .brand-style-guide {
  grid-template-columns: minmax(240px, 0.58fr) minmax(0, 1.42fr) !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 10px !important;
  border-width: 2px !important;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), transparent 48%),
    linear-gradient(315deg, rgba(103, 213, 232, 0.14), transparent 56%),
    rgba(255, 250, 240, 0.82) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="brand"] .brand-style-guide h3 {
  margin: 3px 0 6px !important;
  font-size: 16px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="brand"] .brand-style-guide p {
  font-size: 10px !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="brand"] .brand-rule-grid {
  gap: 8px !important;
}

body.app-mode[data-active-view="brand"] .brand-rule-grid article {
  grid-template-columns: 24px minmax(0, 1fr) !important;
  gap: 6px !important;
  min-height: 92px !important;
  padding: 8px 8px 8px 10px !important;
}

body.app-mode[data-active-view="brand"] .brand-rule-grid span {
  width: 22px !important;
  min-height: 22px !important;
  display: inline-grid !important;
  place-items: center !important;
  border: 1px solid rgba(8, 9, 13, 0.34) !important;
  border-radius: 5px !important;
  background: rgba(255, 250, 240, 0.76) !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="brand"] .brand-rule-grid strong {
  font-size: 10.5px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="brand"] .brand-rule-grid small,
body.app-mode[data-active-view="brand"] .brand-rule-grid em {
  margin-top: 4px !important;
  font-size: 8px !important;
  line-height: 1.15 !important;
  overflow-wrap: anywhere !important;
}

.modules-agent-dock {
  display: none;
}

body.app-mode[data-active-view="modules"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="modules"] .modules-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-mode,
body.app-mode[data-active-view="modules"] .modules-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="modules"] .modules-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-mode button,
body.app-mode[data-active-view="modules"] .modules-agent-options button,
body.app-mode[data-active-view="modules"] .modules-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-mode button.active,
body.app-mode[data-active-view="modules"] .modules-agent-send,
body.app-mode[data-active-view="modules"] .modules-agent-options button:hover {
  background: #dfff3f !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="modules"] .modules-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-modules-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-modules-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-modules-answer .dashboard-answer-modal h2 {
  max-width: 34ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-modules-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-modules-answer .modules-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(255, 209, 102, 0.34), transparent 54%),
    linear-gradient(35deg, rgba(119, 215, 232, 0.20), transparent 66%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-modules-answer .modules-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-modules-answer .modules-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(255, 209, 102, 0.82);
  box-shadow: none;
}

.dashboard-answer-dialog.is-modules-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-modules-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-modules-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-modules-answer .dashboard-report-section,
.dashboard-answer-dialog.is-modules-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

body.app-mode > .app-shell > main:has(.app-footer.universal-footer) {
  padding-bottom: 0 !important;
}

@media (max-width: 960px) {
  body.app-mode [data-view-section="brand"] .brand-context-grid,
  body.app-mode [data-view-section="brand"] .brand-style-guide,
  body.app-mode [data-view-section="brand"] .brand-rule-grid,
  body.app-mode [data-view-section="brand"] .brand-form {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body.app-mode [data-view-section="brand"] .brand-actions {
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="brand"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="brand"] [data-view-section="brand"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="brand"] .brand-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
  }

  body.app-mode[data-active-view="brand"] .brand-agent-mode button,
  body.app-mode[data-active-view="brand"] .brand-agent-options button {
    font-size: 9px !important;
    padding: 6px 8px !important;
  }

  body.app-mode[data-active-view="brand"] .brand-agent-dock textarea {
    min-height: 58px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="brand"] .brand-agent-send {
    min-width: 72px !important;
    min-height: 72px !important;
  }

  .dashboard-answer-dialog.is-brand-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-brand-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-brand-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="modules"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="modules"] [data-view-section="modules"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="modules"] .modules-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
  }

  body.app-mode[data-active-view="modules"] .modules-agent-mode button,
  body.app-mode[data-active-view="modules"] .modules-agent-options button {
    font-size: 9px !important;
    padding: 6px 8px !important;
  }

  body.app-mode[data-active-view="modules"] .modules-agent-dock textarea {
    min-height: 58px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="modules"] .modules-agent-send {
    min-width: 72px !important;
    min-height: 72px !important;
  }

  .dashboard-answer-dialog.is-modules-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-modules-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-modules-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Compact Settings workbench: dense enough for operations, still readable for setup. */
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .full-panel {
  padding: 16px !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .panel-header {
  align-items: center;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .panel-header h2 {
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px !important;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid article {
  min-height: 62px;
  padding: 9px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid strong {
  font-size: 14px;
  line-height: 1.05;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid small {
  font-size: 9px;
  line-height: 1.2;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel {
  display: grid;
  grid-template-columns: minmax(240px, 0.62fr) minmax(0, 1.38fr);
  gap: 12px;
  align-items: stretch;
  margin-bottom: 12px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(118deg, rgba(213, 255, 0, 0.58), transparent 47%),
    linear-gradient(315deg, rgba(119, 215, 232, 0.62), transparent 58%),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child {
  min-width: 0;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 7px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.06) 0 8px, transparent 8px 16px),
    #0b1022;
  color: #fff7ed;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child .eyebrow,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child h3,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child p {
  color: #fff7ed !important;
  text-shadow: 1px 1px 0 #08090d;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel h3 {
  margin: 4px 0 7px;
  font-size: 17px;
  line-height: 1.05;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel p {
  margin: 0;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.35;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  min-width: 0;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article {
  display: flex;
  min-width: 0;
  min-height: 92px;
  flex-direction: column;
  justify-content: space-between;
  gap: 7px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 7px;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-1 {
  background: #d5ff00;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-2 {
  background: #7bd3e8;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-3 {
  background: #a78bfa;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-4 {
  background: #ffe29c;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid strong {
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.05;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid small {
  overflow-wrap: anywhere;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.25;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-section {
  display: grid;
  gap: 12px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffdf7;
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
}

.ploxy-brain-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0;
  padding: 0;
}

.ploxy-brain-controls button {
  min-height: 32px;
  padding: 7px 10px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #d5ff00;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  cursor: pointer;
}

.ploxy-brain-controls button:nth-child(2) {
  background: #7bd3e8;
}

.ploxy-brain-controls button:nth-child(3) {
  background: #ffe29c;
}

.ploxy-brain-controls button:hover,
.ploxy-brain-controls button:focus-visible {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 #08090d;
}

.ploxy-brain-controls button:disabled {
  cursor: wait;
  filter: saturate(0.62);
  opacity: 0.72;
  transform: none;
}

.dashboard-agentic-result > .ploxy-brain-controls {
  padding: 0 2px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid article {
  display: grid;
  gap: 6px;
  min-height: 80px;
  padding: 9px;
  border: 3px solid #08090d;
  border-radius: 7px;
  background: #fffdf7;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid article.tone-1 {
  background: #d5ff00;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid article.tone-2 {
  background: #7bd3e8;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid article.tone-3 {
  background: #ff7a90;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid article.tone-4 {
  background: #ffe29c;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid strong {
  overflow-wrap: anywhere;
  font-size: 13px;
  line-height: 1.1;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid small {
  overflow-wrap: anywhere;
  font-size: 9px;
  font-weight: 850;
  line-height: 1.22;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-columns {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-columns > article {
  display: grid;
  align-content: start;
  gap: 7px;
  min-width: 0;
  min-height: 148px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 7px;
  background: #fffdf7;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-columns > article > div,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list {
  display: grid;
  gap: 6px;
  min-width: 0;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list div,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list button,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] #ploxy-brain-policy {
  min-width: 0;
  padding: 7px;
  border: 2px solid rgba(8, 9, 13, 0.72);
  border-radius: 6px;
  background: rgba(123, 211, 232, 0.16);
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list button {
  width: 100%;
  color: #08090d;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list button:hover,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list button:focus-visible {
  background: rgba(213, 255, 0, 0.28);
  outline: 2px solid #08090d;
  outline-offset: 2px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list div[data-allowed="false"] {
  background: rgba(255, 122, 144, 0.18);
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list strong,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] #ploxy-brain-policy strong {
  display: block;
  overflow: hidden;
  color: #08090d;
  font-size: 10.5px;
  font-weight: 950;
  line-height: 1.18;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-list small,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] #ploxy-brain-policy small,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-empty {
  display: block;
  margin: 3px 0 0;
  overflow-wrap: anywhere;
  color: rgba(8, 9, 13, 0.68);
  font-size: 9px;
  font-weight: 850;
  line-height: 1.22;
}

.ploxy-receipt-dialog {
  width: min(920px, calc(100vw - 24px));
  max-width: none;
  max-height: min(88vh, 820px);
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: #08090d;
}

.ploxy-receipt-dialog::backdrop {
  background: rgba(8, 9, 13, 0.72);
}

.ploxy-receipt-modal {
  display: grid;
  gap: 12px;
  max-height: min(88vh, 820px);
  padding: 14px;
  overflow: auto;
  border: 3px solid #08090d;
  border-radius: 10px;
  background: #fffaf0;
  box-shadow: 6px 6px 0 #08090d;
}

.ploxy-receipt-modal > header {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
}

.ploxy-receipt-modal > header > div {
  min-width: 0;
}

.ploxy-receipt-modal h2,
.ploxy-receipt-modal p {
  margin: 0;
}

.ploxy-receipt-modal h2 {
  overflow-wrap: anywhere;
  font-size: 20px;
  line-height: 1.05;
}

.ploxy-receipt-modal p {
  margin-top: 5px;
  color: rgba(8, 9, 13, 0.68);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.32;
}

.ploxy-receipt-summary,
.ploxy-receipt-trace {
  display: grid;
  gap: 9px;
}

.ploxy-receipt-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

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

.ploxy-receipt-trace article:first-child,
.ploxy-receipt-trace article:nth-child(2) {
  grid-column: 1 / -1;
}

.ploxy-receipt-summary article,
.ploxy-receipt-trace article {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
  padding: 9px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffdf7;
  box-shadow: 2px 2px 0 #08090d;
}

.ploxy-receipt-summary article.tone-1 {
  background: #d5ff00;
}

.ploxy-receipt-summary article.tone-2 {
  background: #7bd3e8;
}

.ploxy-receipt-summary article.tone-3 {
  background: #ffe29c;
}

.ploxy-receipt-summary article.tone-4 {
  background: #ffb3c0;
}

.ploxy-receipt-summary strong,
.ploxy-receipt-trace strong {
  overflow-wrap: anywhere;
  color: #08090d;
  font-size: 12px;
  font-weight: 950;
  line-height: 1.2;
}

.ploxy-receipt-summary small,
.ploxy-receipt-trace small,
.ploxy-receipt-mini-list small {
  overflow-wrap: anywhere;
  color: rgba(8, 9, 13, 0.7);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.28;
}

.ploxy-receipt-mini-list {
  display: grid;
  gap: 4px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article {
  min-height: 94px;
  padding: 12px !important;
  border: 3px solid #08090d !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article:nth-child(1) {
  background: #d5ff00 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article:nth-child(2) {
  background: #7bd3e8 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article:nth-child(3) {
  background: #a78bfa !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board strong {
  font-size: 15px;
  line-height: 1.08;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board small {
  font-size: 11px;
  line-height: 1.28;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form {
  gap: 8px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-section {
  gap: 8px;
  padding: 10px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-section .section-title h3 {
  font-size: 13px;
  line-height: 1.12;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form .form-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form label {
  min-width: 0;
  gap: 4px;
  font-size: 10px;
  line-height: 1.1;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form input,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form select {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 6px 8px;
  font-size: 11px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid .toggle-line {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 10px !important;
  font-size: 10px;
  line-height: 1.25;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid .toggle-line input[type="checkbox"] {
  appearance: none;
  display: inline-grid;
  flex: 0 0 17px;
  place-items: center;
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  min-height: 17px !important;
  margin: 0;
  padding: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 4px;
  background: #fffaf0 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid .toggle-line input[type="checkbox"]::before {
  content: "";
  width: 7px;
  height: 10px;
  border-right: 2px solid #08090d;
  border-bottom: 2px solid #08090d;
  opacity: 0;
  transform: rotate(42deg) translate(-1px, -1px);
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid .toggle-line input[type="checkbox"]:checked {
  background: #d5ff00 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid .toggle-line input[type="checkbox"]:checked::before {
  opacity: 1;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-access-layout {
  grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1fr);
  align-items: start;
  gap: 10px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-invite-card,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-row {
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-row {
  grid-template-columns: minmax(0, 1.05fr) minmax(96px, 0.38fr) minmax(130px, 0.62fr) auto;
  gap: 8px;
  min-height: 58px;
  padding: 8px 10px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-list {
  align-content: start;
  align-items: start;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-row strong {
  font-size: 13px;
  line-height: 1.1;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-row small,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-row span {
  font-size: 9px;
  line-height: 1.15;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-actions {
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 2px;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] #settings-output {
  margin: 0 !important;
  padding: 9px 10px !important;
  border: 3px solid #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .export-box {
  margin-top: 10px;
  max-height: 220px;
  overflow: auto;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form .form-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-columns,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-access-layout {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 720px) {
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form .form-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .ploxy-brain-columns,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-toggle-grid,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board,
  body.app-mode[data-active-view="settings"] [data-view-section="settings"] .team-member-row {
    grid-template-columns: 1fr;
  }

  .ploxy-receipt-summary,
  .ploxy-receipt-trace {
    grid-template-columns: 1fr;
  }

  .ploxy-receipt-modal {
    max-height: calc(100vh - 24px);
    padding: 10px;
  }

  .ploxy-receipt-modal > header {
    align-items: flex-start;
  }
}

/* Agentic operating layer: every important page should show what Polxy thinks, does, and needs. */
body.app-mode .agent-command-board,
body.app-mode .agent-decision-board,
body.app-mode .agent-diagnosis-panel,
body.app-mode .admin-operator-grid,
body.app-mode .agent-permission-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin: 22px 0;
}

body.app-mode .admin-operator-grid,
body.app-mode .agent-permission-board {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode .agent-command-board article,
body.app-mode .agent-decision-board article,
body.app-mode .agent-diagnosis-panel article,
body.app-mode .admin-operator-grid article,
body.app-mode .agent-permission-board article {
  min-height: 122px;
  padding: 18px 20px;
  border: 4px solid #111;
  box-shadow: 7px 7px 0 #111;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.45), transparent 62%),
    #dfff3f;
}

body.app-mode .agent-command-board article:nth-child(2),
body.app-mode .agent-decision-board article:nth-child(2),
body.app-mode .agent-diagnosis-panel article:nth-child(2),
body.app-mode .admin-operator-grid article:nth-child(2),
body.app-mode .agent-permission-board article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #67d5e8;
}

body.app-mode .agent-command-board article:nth-child(3),
body.app-mode .agent-decision-board article:nth-child(3),
body.app-mode .agent-diagnosis-panel article:nth-child(3),
body.app-mode .admin-operator-grid article:nth-child(3),
body.app-mode .agent-permission-board article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.40), transparent 64%),
    #b59cf6;
}

body.app-mode .agent-command-board article:nth-child(4),
body.app-mode .agent-decision-board article:nth-child(4),
body.app-mode .agent-diagnosis-panel article:nth-child(4),
body.app-mode .admin-operator-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #ffb454;
}

body.app-mode .admin-operator-grid article:nth-child(5) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #e671bd;
}

body.app-mode .admin-operator-grid article:nth-child(6) {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #69dca0;
}

body.app-mode .agent-command-board .eyebrow,
body.app-mode .agent-decision-board .eyebrow,
body.app-mode .agent-diagnosis-panel .eyebrow,
body.app-mode .admin-operator-grid .eyebrow,
body.app-mode .agent-permission-board .eyebrow {
  color: #161616 !important;
}

body.app-mode .agent-command-board strong,
body.app-mode .agent-decision-board strong,
body.app-mode .agent-diagnosis-panel strong,
body.app-mode .admin-operator-grid strong,
body.app-mode .agent-permission-board strong {
  display: block;
  margin: 8px 0;
  color: #050505;
  font-size: clamp(1rem, 1.2vw, 1.35rem);
  line-height: 1.08;
}

body.app-mode .agent-command-board small,
body.app-mode .agent-decision-board small,
body.app-mode .agent-diagnosis-panel small,
body.app-mode .admin-operator-grid small,
body.app-mode .agent-permission-board small {
  color: #1f1f1f;
  font-size: 0.82rem;
  line-height: 1.35;
}

body.app-mode .agent-permission-toggles {
  margin-top: 18px;
}

body.app-mode .agent-permission-toggles .toggle-line {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 68%),
    #f6ead7;
}

body.app-mode .agent-permission-toggles .toggle-line:nth-child(2) {
  background-color: #b59cf6;
}

body.app-mode .agent-permission-toggles .toggle-line:nth-child(3) {
  background-color: #67d5e8;
}

body.app-mode .agent-permission-toggles .toggle-line:nth-child(4) {
  background-color: #dfff3f;
}

body.app-mode .agent-permission-toggles .toggle-line:nth-child(5) {
  background-color: #69dca0;
}

body.app-mode .agent-permission-toggles .emergency-toggle {
  background-color: #ef4444;
  color: #050505;
}

body.app-mode .project-intake-dialog {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode .project-intake-form {
  border: 3px solid #08090d !important;
  border-radius: 12px !important;
  background:
    linear-gradient(115deg, #f04a42 0 21%, #dfff3f 21% 42%, #3859ef 42% 100%) !important;
  color: #08090d !important;
  box-shadow: 9px 9px 0 #08090d, 0 26px 80px rgba(8, 9, 13, 0.22) !important;
}

body.app-mode .project-intake-card,
body.app-mode .project-agent-panel,
body.app-mode .project-advanced-memory {
  border-color: #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode .project-core-card {
  background:
    linear-gradient(135deg, #dfff3f 0 34%, transparent 34%),
    #fff7ed !important;
}

body.app-mode .project-import-card {
  background:
    linear-gradient(150deg, #67d5e8 0 34%, transparent 34%),
    linear-gradient(25deg, rgba(229, 104, 189, 0.75), transparent 56%),
    #fff7ed !important;
}

body.app-mode .project-brand-kit-card,
body.app-mode .project-brand-kit-editor {
  border-color: #08090d !important;
  background:
    linear-gradient(145deg, rgba(223, 255, 63, 0.72) 0 22%, transparent 22%),
    linear-gradient(25deg, rgba(103, 213, 232, 0.78), transparent 58%),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode .project-intake-form label,
body.app-mode .project-intake-form .eyebrow,
body.app-mode .project-agent-panel h3,
body.app-mode .project-advanced-memory summary span {
  color: #08090d !important;
  text-shadow: none !important;
}

body.app-mode .project-intake-hero h2 {
  color: #ffffff !important;
  text-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .project-intake-hero p,
body.app-mode .project-agent-panel li,
body.app-mode .project-agent-panel p,
body.app-mode .project-advanced-memory summary small,
body.app-mode .project-upload-box small,
body.app-mode #new-project-file-output,
body.app-mode #new-project-logo-output,
body.app-mode #project-logo-output,
body.app-mode #new-project-agent-output {
  color: rgba(8, 9, 13, 0.68) !important;
}

body.app-mode .project-intake-hero p {
  color: #fff7ed !important;
  text-shadow: 1px 1px 0 rgba(8, 9, 13, 0.75) !important;
}

body.app-mode .project-intake-form .section-title h3,
body.app-mode .project-intake-form .project-upload-box span {
  color: #08090d !important;
}

body.app-mode .project-intake-form input,
body.app-mode .project-intake-form textarea,
body.app-mode .project-intake-form input[type="color"] {
  border: 2px solid #08090d !important;
  border-radius: 6px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .project-intake-form .project-upload-box {
  border: 2px dashed #08090d !important;
  border-radius: 8px !important;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.05) 0 8px, transparent 8px 16px),
    rgba(255, 247, 237, 0.86) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .project-intake-actions {
  background: #f4dfc4 !important;
  box-shadow: none !important;
}

@media (max-width: 1180px) {
  body.app-mode .agent-command-board,
  body.app-mode .agent-decision-board,
  body.app-mode .agent-diagnosis-panel,
  body.app-mode .admin-operator-grid,
  body.app-mode .agent-permission-board {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode .automation-agent-console,
  body.app-mode .campaign-agent-console,
  body.app-mode .queue-agent-console,
  body.app-mode .connection-agent-console,
  body.app-mode .analytics-agent-console,
  body.app-mode .ads-agent-console {
    grid-template-columns: 1fr;
  }

  .analytics-source-grid,
  .ads-account-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  body.app-mode .agent-command-board,
  body.app-mode .agent-decision-board,
  body.app-mode .agent-diagnosis-panel,
  body.app-mode .admin-operator-grid,
  body.app-mode .agent-permission-board {
    grid-template-columns: 1fr;
  }

  .analytics-source-grid,
  .ads-account-grid,
  .ads-agent-status-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .admin-detail-drawer {
    width: 100vw;
  }

  .admin-detail-content {
    padding: 18px;
  }

  .admin-detail-grid,
  .admin-detail-timeline-row {
    grid-template-columns: 1fr;
  }
}

/* Keep the Codex/in-app preview usable at tablet widths. Earlier responsive
   rules collapse the app at 980px, which can make the preview look empty. */
@media (min-width: 761px) and (max-width: 1180px) {
  body.app-mode .app-shell {
    display: grid !important;
    grid-template-columns: 224px minmax(0, 1fr) !important;
  }

  body.app-mode .sidebar {
    position: sticky !important;
    top: 0;
    display: flex !important;
    flex-direction: column !important;
    height: 100vh !important;
    max-height: 100vh !important;
    min-height: 100vh !important;
    border-right: 3px solid #08090d !important;
    border-bottom: 0 !important;
    overflow: hidden;
  }

  body.app-mode .sidebar nav {
    display: grid !important;
    grid-template-columns: 1fr !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.app-mode .workspace-card {
    position: sticky !important;
    bottom: 0;
    margin-top: auto !important;
  }

  body.app-mode main {
    width: min(100%, calc(100vw - 224px)) !important;
    padding: 18px !important;
  }
}

/* Creative Studio rebuild: Polxy's generation engine should feel like a creation surface, not a settings page. */
.creative-agent-console.chat-studio {
  grid-template-columns: minmax(360px, 0.95fr) minmax(420px, 1.05fr);
  grid-template-areas:
    "project project"
    "galleryHead galleryHead"
    "gallery gallery"
    "modes tools"
    "channels channels"
    "dna dna"
    "social social"
    "actions actions"
    "composer preview";
  gap: 14px;
  align-items: stretch;
}

.creative-agent-console .creative-project-switcher {
  grid-area: project;
}

.creative-gallery-head {
  grid-area: galleryHead;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 86px;
  padding: 10px 14px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(115deg, #f04a42 0 22%, #dfff3f 22% 46%, #3859ef 46% 100%);
  box-shadow: 5px 5px 0 #08090d;
}

.creative-gallery-head > div {
  display: grid;
  gap: 2px;
  max-width: min(620px, 66%);
  padding: 9px 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 247, 237, 0.95);
  box-shadow: 4px 4px 0 #08090d;
}

.creative-gallery-head strong {
  display: block;
  margin: 3px 0 5px;
  color: #08090d;
  font-size: clamp(17px, 1.55vw, 21px);
  line-height: 1.08;
  text-shadow: none;
}

.creative-gallery-head small {
  display: block;
  color: rgba(8, 9, 13, 0.76);
  font-size: 10.5px;
  line-height: 1.25;
  text-shadow: none;
}

.creative-gallery {
  grid-area: gallery;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(190px, 255px);
  grid-template-columns: none;
  gap: 12px;
  min-height: 158px;
  padding: 6px 4px 12px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

.creative-gallery .media-card {
  min-height: 152px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

.creative-gallery .media-preview {
  position: relative;
  min-height: 118px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 6px;
}

.creative-gallery .media-preview img,
.creative-gallery .media-preview video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creative-gallery .media-preview span,
.creative-gallery .media-preview strong,
.creative-gallery .media-preview b {
  position: relative;
  z-index: 2;
}

.creative-empty-card {
  display: grid;
  align-content: center;
  gap: 6px;
  min-height: 152px;
  max-width: 260px;
  padding: 14px;
  border: 3px dashed #08090d;
  border-radius: 8px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.06) 0 10px, transparent 10px 20px),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

.creative-empty-card strong {
  color: #08090d;
  font-size: 15px;
}

.creative-empty-card small {
  color: rgba(8, 9, 13, 0.68);
  font-size: 11px;
  line-height: 1.35;
}

.creative-agent-console .creative-mode-switch {
  grid-area: modes;
  margin: 0;
}

.connected-channel-strip {
  grid-area: channels;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background: #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

.connected-channel-strip[hidden] {
  display: none;
}

.connected-channel-strip > span {
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.connected-channel-strip > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.connected-channel-strip button {
  width: 34px;
  height: 28px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #f04a42;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
  cursor: pointer;
}

.connected-channel-strip button:nth-child(2n) {
  background: #67d5e8;
}

.connected-channel-strip button:nth-child(3n) {
  background: #dfff3f;
}

.connected-channel-strip button.active {
  background: #b59cf6;
}

.creative-agent-console .creative-actions {
  grid-area: actions;
}

.creative-agent-console .creative-dna-panel {
  grid-area: dna;
}

.creative-agent-console .social-production-lab {
  grid-area: social;
}

.creative-agent-console .creative-tool-strip {
  grid-area: tools;
  align-self: center;
  justify-content: flex-end;
  margin: 0;
}

.creative-agent-console .ploxy-chat-panel,
.creative-agent-console .manual-studio-panel {
  grid-area: composer;
}

.creative-agent-console .creative-preview-stage {
  grid-area: preview;
}

.creative-agent-console .ploxy-chat-panel,
.creative-agent-console .manual-studio-panel,
.creative-agent-console .creative-preview-stage {
  height: clamp(500px, calc(100vh - 400px), 700px);
  border: 3px solid #08090d;
  border-radius: 10px;
  box-shadow: 6px 6px 0 #08090d;
}

.creative-agent-console .ploxy-chat-panel {
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(181, 156, 246, 0.5), transparent 48%),
    linear-gradient(25deg, rgba(103, 213, 232, 0.5), transparent 58%),
    #fff7ed;
}

.creative-agent-console .ploxy-chat-form {
  grid-template-columns: 70px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: stretch;
  min-height: 128px;
  padding: 8px;
  border: 3px solid #08090d;
  border-radius: 12px;
  background: rgba(255, 247, 237, 0.95);
  box-shadow: 5px 5px 0 #08090d;
}

.composer-layout-rail {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.composer-layout-rail button {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 4px 7px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  font-size: 9px;
  font-weight: 850;
  cursor: pointer;
}

.composer-layout-rail button.active {
  background: linear-gradient(90deg, #dfff3f, #67d5e8);
  box-shadow: 2px 2px 0 #08090d;
}

.composer-layout-rail span {
  position: relative;
  display: block;
  width: 30px;
  aspect-ratio: 1;
  border: 2px solid #08090d;
  border-radius: 5px;
  background: linear-gradient(135deg, #092832, #67d5e8);
}

.composer-layout-rail i {
  position: absolute;
  display: block;
  width: 14px;
  height: 10px;
  border: 2px solid #dfff3f;
  border-radius: 3px;
  background: rgba(8, 9, 13, 0.72);
}

.composer-layout-rail [data-creative-layout="lower-left"] i {
  left: 3px;
  bottom: 3px;
}

.composer-layout-rail [data-creative-layout="upper-left"] i {
  left: 3px;
  top: 3px;
}

.composer-layout-rail [data-creative-layout="lower-right"] i {
  right: 3px;
  bottom: 3px;
}

.composer-layout-rail [data-creative-layout="no-caption"] i {
  left: 6px;
  top: 6px;
  width: 10px;
  height: 10px;
  border-color: #fff7ed;
  border-radius: 999px;
  background: #dfff3f;
}

.composer-layout-rail [data-creative-layout="no-caption"] span::after {
  content: "";
  position: absolute;
  left: 5px;
  right: 5px;
  top: 13px;
  height: 2px;
  border-radius: 999px;
  background: #ef4444;
  transform: rotate(-38deg);
}

.composer-asset-rail {
  display: grid;
  gap: 5px;
}

.composer-asset-rail button {
  min-height: 25px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  font-size: 9.5px;
  font-weight: 850;
  cursor: pointer;
}

.composer-asset-rail button.active {
  background: linear-gradient(90deg, #dfff3f, #67d5e8);
}

.creative-agent-console .ploxy-chat-form textarea {
  min-height: 72px;
  max-height: 110px;
  padding: 8px 8px;
  border: 0;
  background: transparent;
  color: #08090d;
  font-size: 13.5px;
  line-height: 1.45;
}

.creative-agent-console .ploxy-chat-form textarea::placeholder {
  color: rgba(8, 9, 13, 0.44);
}

.creative-agent-console .cost-mode-trigger,
.creative-agent-console .send-icon-button {
  border: 2px solid #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.creative-agent-console .send-icon-button {
  width: 46px;
  min-height: 46px;
  border-radius: 10px;
  background: #67d5e8;
  color: #08090d;
}

.creative-agent-console .send-icon-button:disabled {
  background: #d9d1c4;
  color: rgba(8, 9, 13, 0.38);
}

.creative-agent-console .chat-message {
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 247, 237, 0.82);
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.creative-agent-console .chat-message.user {
  background: #dfff3f;
}

.creative-agent-console .chat-message span,
.creative-agent-console .chat-message p,
.creative-agent-console .chat-message .agent-reply,
.creative-agent-console .chat-message .agent-reply li,
.creative-agent-console .chat-message strong {
  color: #08090d;
}

.creative-agent-console .chat-message .agent-reply {
  display: grid;
  gap: 7px;
}

.creative-agent-console .chat-message .agent-reply p,
.creative-agent-console .chat-message .agent-reply ul {
  margin: 0;
}

.creative-agent-console .chat-message .agent-reply ul {
  display: grid;
  gap: 5px;
  padding-left: 18px;
}

.creative-agent-console .chat-message .agent-reply strong {
  font-weight: 950;
}

.creative-agent-console .chat-message .planner-reply {
  max-height: 240px;
  overflow: auto;
  line-height: 1.25;
}

.ploxy-research-brief {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), transparent 60%),
    #ffffff;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.ploxy-research-brief[data-status="not_connected"] {
  background:
    linear-gradient(135deg, rgba(255, 183, 3, 0.24), transparent 60%),
    #fffaf0;
}

.ploxy-research-brief header {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 5px 8px;
  align-items: center;
}

.ploxy-research-brief header span {
  width: max-content;
  max-width: 100%;
  padding: 4px 7px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 1px 1px 0 #08090d;
  font-size: 9px;
  font-weight: 950;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.ploxy-research-brief header strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #08090d;
  font-size: 14px;
  line-height: 1.1;
}

.ploxy-research-brief header small {
  grid-column: 1 / -1;
  color: rgba(8, 9, 13, 0.68);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.25;
}

.ploxy-research-summary,
.ploxy-research-note {
  margin: 0;
  color: rgba(8, 9, 13, 0.78);
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
}

.ploxy-research-group {
  display: grid;
  gap: 6px;
}

.ploxy-research-group h4 {
  margin: 0;
  color: #08090d;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.ploxy-research-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 7px;
}

.ploxy-research-grid article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
}

.ploxy-research-grid strong,
.ploxy-research-grid p,
.ploxy-research-grid a,
.ploxy-research-brief footer a,
.ploxy-research-brief footer span {
  overflow-wrap: anywhere;
}

.ploxy-research-grid strong {
  color: #08090d;
  font-size: 12px;
  line-height: 1.1;
}

.ploxy-research-grid p {
  margin: 0;
  color: rgba(8, 9, 13, 0.70);
  font-size: 11px;
  font-weight: 820;
  line-height: 1.26;
}

.ploxy-research-grid a,
.ploxy-research-brief footer a {
  color: #075985;
  font-size: 10px;
  font-weight: 900;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

.ploxy-research-brief footer {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  padding-top: 2px;
}

.ploxy-research-brief footer span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}

.dashboard-answer-body .ploxy-research-brief {
  max-width: 980px;
  margin-top: 12px;
}

.dashboard-answer-body .ploxy-research-summary,
.dashboard-answer-body .ploxy-research-note,
.dashboard-answer-body .ploxy-research-grid p {
  font-weight: 850;
}

.creative-agent-console .creative-preview-stage {
  padding: 14px;
  background:
    linear-gradient(180deg, rgba(8, 9, 13, 0.94), rgba(8, 9, 13, 0.88)),
    #08090d;
}

.creative-agent-console .preview-shell {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  min-height: 100%;
}

.creative-agent-console .preview-mode-tabs button,
.creative-agent-console .preview-platforms button,
.creative-agent-console .preview-meta-line {
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

.creative-agent-console .preview-mode-tabs button.active,
.creative-agent-console .preview-platforms button.active {
  background: #67d5e8;
  color: #08090d;
}

.creative-agent-console .preview-mode-tabs button span,
.creative-agent-console .preview-platforms button span,
.creative-agent-console .preview-meta-line span,
.creative-agent-console .preview-meta-line strong {
  color: #08090d;
}

.creative-agent-console .preview-device {
  border: 3px solid #08090d;
  border-radius: 12px;
  box-shadow: 8px 8px 0 #000, 0 22px 70px rgba(0, 0, 0, 0.45);
}

.empty-generated-state {
  place-content: center;
  text-align: center;
  background:
    radial-gradient(circle at 26% 20%, rgba(103, 213, 232, 0.34), transparent 26%),
    linear-gradient(145deg, #151626, #08090d);
}

.empty-generated-state strong,
.empty-generated-state small {
  justify-self: center;
}

@media (max-width: 1120px) {
  .creative-agent-console.chat-studio {
    grid-template-columns: 1fr;
    grid-template-areas:
      "project"
      "galleryHead"
      "gallery"
      "modes"
      "channels"
      "dna"
      "actions"
      "tools"
      "composer"
      "preview";
  }

  .creative-agent-console .creative-tool-strip {
    justify-content: flex-start;
  }
}

body.app-mode .creative-agent-console.chat-studio {
  grid-template-columns: minmax(360px, 0.95fr) minmax(420px, 1.05fr) !important;
}

body.app-mode .creative-gallery-head,
body.app-mode .creative-empty-card,
body.app-mode .creative-gallery .media-card,
body.app-mode .connected-channel-strip,
body.app-mode .creative-agent-console .ploxy-chat-panel,
body.app-mode .creative-agent-console .manual-studio-panel,
body.app-mode .creative-agent-console .creative-preview-stage,
body.app-mode .creative-agent-console .ploxy-chat-form {
  border-color: #08090d !important;
  box-shadow: 6px 6px 0 #08090d !important;
}

body.app-mode .creative-gallery-head > div {
  background: rgba(255, 247, 237, 0.96) !important;
}

body.app-mode .creative-gallery-head .eyebrow {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode .creative-gallery-head strong {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  text-shadow: none !important;
}

body.app-mode .creative-gallery-head small {
  color: rgba(8, 9, 13, 0.76) !important;
  -webkit-text-fill-color: rgba(8, 9, 13, 0.76) !important;
  text-shadow: none !important;
}

body.app-mode .creative-agent-console .ploxy-chat-panel {
  background:
    linear-gradient(135deg, rgba(181, 156, 246, 0.5), transparent 48%),
    linear-gradient(25deg, rgba(103, 213, 232, 0.5), transparent 58%),
    #fff7ed !important;
}

body.app-mode .creative-agent-console .creative-preview-stage {
  background:
    linear-gradient(180deg, rgba(8, 9, 13, 0.94), rgba(8, 9, 13, 0.88)),
    #08090d !important;
}

body.app-mode .creative-agent-console .ploxy-chat-form,
body.app-mode .creative-agent-console .chat-message,
body.app-mode .connected-channel-strip,
body.app-mode .creative-agent-console .preview-mode-tabs button,
body.app-mode .creative-agent-console .preview-platforms button,
body.app-mode .creative-agent-console .preview-meta-line {
  background: #fff7ed !important;
  color: #08090d !important;
}

body.app-mode .creative-agent-console .chat-message.user,
body.app-mode .connected-channel-strip button:nth-child(3n),
body.app-mode .composer-asset-rail button.active {
  background: #dfff3f !important;
}

body.app-mode .connected-channel-strip button {
  color: #08090d !important;
}

body.app-mode .creative-agent-console .preview-mode-tabs button.active,
body.app-mode .creative-agent-console .preview-platforms button.active,
body.app-mode .creative-agent-console .send-icon-button {
  background: #67d5e8 !important;
  color: #08090d !important;
}

body.app-mode .creative-agent-console .ploxy-chat-form textarea,
body.app-mode .creative-agent-console .chat-message span,
body.app-mode .creative-agent-console .chat-message p,
body.app-mode .creative-agent-console .chat-message strong,
body.app-mode .composer-asset-rail button,
body.app-mode .creative-agent-console .preview-mode-tabs button,
body.app-mode .creative-agent-console .preview-platforms button,
body.app-mode .creative-agent-console .preview-meta-line span,
body.app-mode .creative-agent-console .preview-meta-line strong {
  color: #08090d !important;
}

@media (max-width: 1120px) {
  body.app-mode .creative-agent-console.chat-studio {
    grid-template-columns: 1fr !important;
  }
}

/* Distraction-free Creative Studio. This keeps the user inside Polxy while
   giving the composer and preview almost the whole screen. */
body.app-mode.creative-focus-mode {
  overflow: hidden;
}

body.app-mode.creative-focus-mode .app-shell {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode.creative-focus-mode .sidebar,
body.app-mode.creative-focus-mode .topbar,
body.app-mode.creative-focus-mode .operator-strip,
body.app-mode.creative-focus-mode .global-project-console,
body.app-mode.creative-focus-mode .status-grid,
body.app-mode.creative-focus-mode .creative-project-switcher,
body.app-mode.creative-focus-mode .creative-gallery-head,
body.app-mode.creative-focus-mode .creative-gallery,
body.app-mode.creative-focus-mode .creative-actions,
body.app-mode.creative-focus-mode .social-production-lab,
body.app-mode.creative-focus-mode .creative-tool-strip,
body.app-mode.creative-focus-mode #creative-output {
  display: none !important;
}

body.app-mode.creative-focus-mode main {
  width: 100vw !important;
  max-width: none !important;
  height: 100vh !important;
  padding: 14px !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .view-section:not([data-view-section="creative"]) {
  display: none !important;
}

body.app-mode.creative-focus-mode [data-view-section="creative"] {
  display: block !important;
}

body.app-mode.creative-focus-mode .creative-engine {
  height: calc(100vh - 28px) !important;
  padding: 54px 14px 14px !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .creative-engine > .panel-header {
  position: absolute;
  top: 12px;
  right: 16px;
  z-index: 20;
  display: flex;
  margin: 0;
  padding: 0;
}

body.app-mode.creative-focus-mode .creative-engine > .panel-header > div:first-child {
  display: none;
}

body.app-mode.creative-focus-mode .creative-engine > .panel-header .header-actions {
  gap: 8px;
}

body.app-mode.creative-focus-mode .creative-engine > .panel-header .badge,
body.app-mode.creative-focus-mode .creative-engine > .panel-header button {
  min-height: 30px !important;
  padding: 5px 10px !important;
  font-size: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode.creative-focus-mode .creative-agent-console.chat-studio {
  grid-template-columns: minmax(420px, 0.9fr) minmax(520px, 1.1fr) !important;
  grid-template-areas:
    "composer preview" !important;
  gap: 14px;
  height: calc(100vh - 96px);
  overflow: hidden;
}

body.app-mode.creative-focus-mode .creative-agent-console .creative-mode-switch {
  position: absolute;
  top: 12px;
  left: 16px;
  z-index: 20;
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(118px, 1fr));
  width: min(360px, calc(100vw - 420px));
  margin: 0 !important;
  padding: 3px !important;
  border-width: 2px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .creative-mode-switch button {
  min-height: 28px !important;
  padding: 5px 8px !important;
  font-size: 10px !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .creative-mode-switch button span {
  margin-right: 4px;
  font-size: 9px !important;
}

body.app-mode.creative-focus-mode .connected-channel-strip {
  position: absolute;
  top: 12px;
  left: min(400px, calc(100vw - 520px));
  z-index: 20;
  width: auto;
  min-width: 0;
  max-width: 280px;
  min-height: 34px;
  padding: 4px 6px !important;
  border-width: 2px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode.creative-focus-mode .connected-channel-strip > span {
  display: none;
}

body.app-mode.creative-focus-mode .connected-channel-strip > div {
  gap: 5px;
}

body.app-mode.creative-focus-mode .connected-channel-strip button {
  width: 28px;
  height: 24px;
  border-width: 2px;
  border-radius: 6px;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-panel,
body.app-mode.creative-focus-mode .creative-agent-console .manual-studio-panel,
body.app-mode.creative-focus-mode .creative-agent-console .creative-preview-stage {
  height: 100% !important;
  min-height: 0 !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-form {
  grid-template-columns: 68px minmax(0, 1fr) auto !important;
  min-height: 104px;
  padding: 8px !important;
  gap: 8px;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-form textarea {
  min-height: 82px;
  max-height: 104px;
  padding: 9px 6px;
  font-size: 14px;
}

body.app-mode.creative-focus-mode .composer-asset-rail {
  gap: 5px;
}

body.app-mode.creative-focus-mode .composer-asset-rail button {
  min-height: 26px;
  padding: 3px 5px;
  border-width: 2px;
  border-radius: 6px;
  font-size: 9px;
}

body.app-mode.creative-focus-mode .creative-agent-console .cost-mode-trigger {
  min-width: 82px;
  min-height: 34px;
  padding: 0 7px;
  font-size: 9px;
}

body.app-mode.creative-focus-mode .creative-agent-console .send-icon-button {
  width: 40px;
  min-height: 40px;
  border-radius: 8px;
}

body.app-mode.creative-focus-mode .auto-cost-panel {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 7px;
  padding-top: 7px;
}

body.app-mode.creative-focus-mode .auto-cost-panel div {
  min-height: 42px;
  padding: 7px 8px;
}

body.app-mode.creative-focus-mode .auto-cost-panel strong {
  font-size: 12px;
}

body.app-mode.creative-focus-mode .auto-cost-panel small {
  font-size: 9px;
  line-height: 1.18;
}

body.app-mode.creative-focus-mode .auto-cost-panel button {
  min-height: 38px;
  padding-inline: 14px;
  font-size: 11px;
}

body.app-mode.creative-focus-mode .creative-agent-console .chat-message {
  padding: 8px 10px;
}

body.app-mode.creative-focus-mode .creative-agent-console .chat-message p {
  font-size: 10.5px;
  line-height: 1.38;
}

body.app-mode.creative-focus-mode .creative-agent-console .manual-studio-panel {
  align-content: stretch;
  overflow: hidden;
}

body.app-mode.creative-focus-mode.creative-manual-mode .creative-agent-console .manual-studio-panel {
  height: auto;
  align-self: start;
  overflow: visible;
}

body.app-mode.creative-focus-mode .manual-provider-form {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: min-content;
  align-content: start;
  gap: 10px;
  min-height: 0;
  overflow: auto;
  padding-right: 2px;
}

body.app-mode.creative-focus-mode .manual-provider-form label {
  gap: 4px;
  font-size: 9.5px;
}

body.app-mode.creative-focus-mode .manual-provider-form input,
body.app-mode.creative-focus-mode .manual-provider-form select {
  min-height: 30px;
  padding: 5px 8px;
  font-size: 12px;
}

body.app-mode.creative-focus-mode .manual-provider-form textarea {
  min-height: 92px;
  max-height: 118px;
  font-size: 12px;
}

body.app-mode.creative-focus-mode .manual-provider-form .wide-field {
  grid-column: 1 / -1;
}

body.app-mode.creative-focus-mode .manual-requirements-card.wide-field {
  grid-column: 1 / 3;
  min-height: 82px;
  padding: 9px;
}

body.app-mode.creative-focus-mode .manual-dynamic-fields.wide-field {
  grid-column: 3 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-self: start;
}

body.app-mode.creative-focus-mode .manual-action-row.wide-field {
  grid-column: 1 / -1;
  align-self: end;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

body.app-mode.creative-focus-mode .manual-action-row button {
  min-height: 34px;
  padding: 6px 10px;
  font-size: 11px;
}

body.app-mode.creative-focus-mode .manual-cost-row span {
  font-size: 11px;
}

body.app-mode.creative-focus-mode .manual-cost-row small {
  font-size: 9px;
  line-height: 1.22;
}

body.app-mode.creative-focus-mode .manual-requirements-card strong {
  font-size: 12px;
}

body.app-mode.creative-focus-mode .manual-requirements-card small {
  font-size: 9px;
  line-height: 1.25;
}

/* Creative Studio action upgrade: generated assets are now working objects. */
body.app-mode .creative-agent-console.chat-studio {
  grid-template-columns: minmax(470px, 0.96fr) minmax(560px, 1.04fr) !important;
  gap: 16px !important;
}

body.app-mode .creative-agent-console .ploxy-chat-panel,
body.app-mode .creative-agent-console .manual-studio-panel,
body.app-mode .creative-agent-console .creative-preview-stage {
  height: clamp(610px, calc(100vh - 270px), 860px) !important;
}

body.app-mode .creative-gallery {
  grid-auto-columns: minmax(250px, 320px);
  min-height: 300px;
  gap: 16px;
  padding: 8px 6px 16px;
}

body.app-mode .creative-gallery .smart-creative-card {
  display: grid;
  position: relative;
  grid-template-rows: 170px auto auto auto auto;
  gap: 9px;
  min-height: 292px;
  padding: 10px;
  background:
    linear-gradient(150deg, rgba(103, 213, 232, 0.28), transparent 42%),
    linear-gradient(25deg, rgba(223, 255, 63, 0.3), transparent 62%),
    #fff7ed;
}

body.app-mode .creative-gallery .smart-creative-card.photo {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.45), transparent 44%),
    linear-gradient(25deg, rgba(103, 213, 232, 0.38), transparent 66%),
    #fff7ed;
}

body.app-mode .creative-gallery .smart-creative-card.video {
  background:
    linear-gradient(135deg, rgba(240, 74, 66, 0.32), transparent 38%),
    linear-gradient(25deg, rgba(181, 156, 246, 0.48), transparent 68%),
    #fff7ed;
}

body.app-mode .creative-gallery .smart-creative-card.text {
  background:
    linear-gradient(135deg, rgba(246, 173, 85, 0.42), transparent 40%),
    linear-gradient(25deg, rgba(231, 108, 190, 0.38), transparent 68%),
    #fff7ed;
}

body.app-mode .creative-gallery .smart-creative-card .media-preview {
  min-height: 170px;
  background:
    radial-gradient(circle at 22% 18%, rgba(103, 213, 232, 0.36), transparent 34%),
    linear-gradient(145deg, #10111f, #241542);
}

body.app-mode .creative-gallery .smart-creative-card .media-preview span,
body.app-mode .creative-gallery .smart-creative-card .media-preview strong,
body.app-mode .creative-gallery .smart-creative-card .media-preview b {
  display: inline-flex;
  width: max-content;
  margin: 8px;
  padding: 3px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode .creative-gallery .smart-creative-card .media-preview strong {
  position: absolute;
  right: 0;
  bottom: 0;
  margin: 8px;
  background: #67d5e8;
}

body.app-mode .creative-gallery .smart-creative-card .media-preview b {
  position: absolute;
  right: 0;
  top: 0;
  background: #dfff3f;
}

body.app-mode .creative-gallery .smart-creative-card h3 {
  margin: 0;
  color: #08090d;
  font-size: 14px;
  line-height: 1.08;
}

body.app-mode .creative-gallery .smart-creative-card p {
  display: -webkit-box;
  margin: 3px 0 0;
  overflow: hidden;
  color: rgba(8, 9, 13, 0.7);
  font-size: 10.5px;
  line-height: 1.28;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

body.app-mode .creative-gallery .smart-creative-card .media-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

body.app-mode .creative-gallery .smart-creative-card .media-meta span {
  padding: 3px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
  font-weight: 850;
}

body.app-mode .creative-gallery .smart-creative-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 26px;
}

body.app-mode .creative-gallery .smart-creative-card footer small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 800;
}

body.app-mode .creative-card-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

body.app-mode .creative-card-actions button {
  min-height: 30px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 9.5px;
  font-weight: 900;
  cursor: pointer;
}

body.app-mode .creative-card-actions button:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .creative-card-actions button:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .creative-card-actions button:nth-child(3) {
  background: #b59cf6;
}

body.app-mode .creative-card-actions button:nth-child(4) {
  background: #f6ad55;
}

body.app-mode .creative-card-actions button:nth-child(5) {
  grid-column: 1 / -1;
  background: #63e6a0;
}

body.app-mode .creative-card-actions button:disabled {
  background: #d9d1c4 !important;
  color: rgba(8, 9, 13, 0.52) !important;
  cursor: not-allowed;
}

body.app-mode .creative-agent-console .ploxy-chat-form {
  min-height: 108px;
}

body.app-mode .creative-agent-console .ploxy-chat-body {
  min-height: 0;
}

body.app-mode .creative-agent-console .preview-device {
  max-width: min(96%, 620px);
  max-height: min(96%, 680px);
}

body.app-mode .creative-agent-console .preview-shell.inspecting-asset,
body.app-mode .creative-agent-console .preview-shell:has(.preview-inspector) {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 12px;
  min-height: 100%;
}

body.app-mode .creative-agent-console .preview-inspector {
  display: grid;
  grid-template-columns: minmax(170px, 1.15fr) minmax(180px, 1fr);
  gap: 10px 12px;
  align-items: stretch;
  padding: 11px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.62), transparent 42%),
    linear-gradient(25deg, rgba(223, 255, 63, 0.42), transparent 68%),
    #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .creative-agent-console .preview-inspector.empty {
  grid-template-columns: 1fr;
}

body.app-mode .creative-agent-console .preview-inspector strong {
  display: block;
  margin-top: 3px;
  color: #08090d;
  font-size: 15px;
  line-height: 1.05;
}

body.app-mode .creative-agent-console .preview-inspector small {
  display: -webkit-box;
  margin-top: 5px;
  overflow: hidden;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10.5px;
  font-weight: 750;
  line-height: 1.28;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

body.app-mode .creative-agent-console .preview-inspector-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-content: flex-start;
}

body.app-mode .creative-agent-console .preview-inspector-meta span,
body.app-mode .creative-agent-console .preview-inspector-note,
body.app-mode .creative-agent-console .preview-inspector-actions button {
  border: 2px solid #08090d;
  border-radius: 8px;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode .creative-agent-console .preview-inspector-meta span {
  padding: 4px 7px;
  background: #fff7ed;
  font-size: 9px;
  font-weight: 950;
}

body.app-mode .creative-agent-console .preview-inspector-meta span:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .creative-agent-console .preview-inspector-meta span:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .creative-agent-console .preview-inspector-meta span:nth-child(3) {
  background: #b59cf6;
}

body.app-mode .creative-agent-console .preview-inspector-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 8px;
  background: #fff7ed;
}

body.app-mode .creative-agent-console .preview-inspector-note b {
  display: inline-grid;
  place-items: center;
  min-height: 32px;
  min-width: 58px;
  padding: 4px 8px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #f6ad55;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
}

body.app-mode .creative-agent-console .preview-inspector-note span {
  color: #08090d;
  font-size: 10.5px;
  font-weight: 800;
  line-height: 1.25;
}

body.app-mode .creative-agent-console .preview-inspector-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

body.app-mode .creative-agent-console .preview-inspector-actions button {
  min-height: 31px;
  padding: 5px 6px;
  background: #fff7ed;
  font-size: 9px;
  font-weight: 950;
  cursor: pointer;
}

body.app-mode .creative-agent-console .preview-inspector-actions button:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .creative-agent-console .preview-inspector-actions button:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .creative-agent-console .preview-inspector-actions button:nth-child(3) {
  background: #b59cf6;
}

body.app-mode .creative-agent-console .preview-inspector-actions button:nth-child(4) {
  background: #63e6a0;
}

body.app-mode .creative-agent-console .preview-inspector-actions button:disabled {
  background: #d9d1c4;
  color: rgba(8, 9, 13, 0.5);
  cursor: not-allowed;
}

body.app-mode .creative-gallery .smart-creative-card {
  cursor: pointer;
}

body.app-mode .creative-gallery .smart-creative-card.selected {
  outline: 4px solid #67d5e8;
  outline-offset: 4px;
  transform: translate(-2px, -2px);
  box-shadow: 10px 10px 0 #08090d !important;
}

body.app-mode .creative-gallery .smart-creative-card.selected::after {
  content: "Previewing";
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  padding: 3px 8px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #67d5e8;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}

body.app-mode .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 170px auto auto auto auto auto;
  min-height: 560px;
}

body.app-mode .creative-approval-drawer {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.48), transparent 38%),
    linear-gradient(25deg, rgba(103, 213, 232, 0.42), transparent 68%),
    #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .creative-approval-drawer[hidden] {
  display: none;
}

body.app-mode .creative-approval-drawer .drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

body.app-mode .creative-approval-drawer .drawer-head strong {
  display: inline-grid;
  place-items: center;
  min-height: 28px;
  padding: 4px 8px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
}

body.app-mode .creative-approval-drawer p {
  margin: 0;
  color: #08090d;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.32;
}

body.app-mode .creative-approval-drawer .drawer-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

body.app-mode .creative-approval-drawer .drawer-metrics span {
  padding: 3px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #67d5e8;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
  font-weight: 900;
}

body.app-mode .creative-approval-drawer .drawer-metrics span:nth-child(2) {
  background: #b59cf6;
}

body.app-mode .creative-approval-drawer .drawer-metrics span:nth-child(3) {
  background: #f6ad55;
}

body.app-mode .creative-approval-drawer .drawer-note {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 247, 237, 0.78);
}

body.app-mode .creative-approval-drawer .drawer-note strong,
body.app-mode .creative-approval-drawer .drawer-draft {
  color: #08090d;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.app-mode .creative-approval-drawer .drawer-note small {
  color: rgba(8, 9, 13, 0.75);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.28;
}

body.app-mode .creative-approval-drawer .drawer-draft {
  display: grid;
  gap: 5px;
}

body.app-mode .creative-approval-drawer .drawer-draft textarea {
  width: 100%;
  min-height: 92px;
  resize: vertical;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font: 700 10.5px/1.35 Inter, system-ui, sans-serif;
  text-transform: none;
}

body.app-mode .creative-approval-drawer .drawer-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

body.app-mode .creative-approval-drawer .drawer-actions button {
  min-height: 31px;
  padding: 5px 6px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 9px;
  font-weight: 950;
  cursor: pointer;
}

body.app-mode .creative-approval-drawer .drawer-actions button:nth-child(1) {
  background: #dfff3f;
}

body.app-mode .creative-approval-drawer .drawer-actions button:nth-child(2) {
  background: #67d5e8;
}

body.app-mode .creative-approval-drawer .drawer-actions button:nth-child(3) {
  background: #63e6a0;
}

body.app-mode .creative-approval-drawer .drawer-actions button:disabled {
  background: #d9d1c4 !important;
  color: rgba(8, 9, 13, 0.5) !important;
  cursor: not-allowed;
}

/* Project creative board: compact cards for fast scanning. */
body.app-mode .creative-gallery {
  grid-auto-columns: minmax(218px, 260px) !important;
  min-height: 248px !important;
  gap: 10px !important;
  align-items: start;
  padding: 6px 4px 18px !important;
  overflow-x: auto;
  overflow-y: visible;
}

body.app-mode .creative-gallery .smart-creative-card {
  grid-template-rows: 84px auto auto auto auto !important;
  gap: 6px !important;
  min-height: 0 !important;
  max-height: 246px;
  padding: 8px !important;
  overflow: hidden;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .creative-gallery .smart-creative-card.text {
  grid-template-rows: 46px auto auto auto auto !important;
}

body.app-mode .creative-gallery .smart-creative-card .media-preview {
  min-height: 0 !important;
  height: 84px;
  aspect-ratio: auto;
  padding: 6px;
}

body.app-mode .creative-gallery .smart-creative-card.text .media-preview {
  height: 46px;
  align-content: center;
  background:
    linear-gradient(90deg, rgba(246, 173, 85, 0.55), transparent 46%),
    #08090d;
}

body.app-mode .creative-gallery .smart-creative-card .media-preview span,
body.app-mode .creative-gallery .smart-creative-card .media-preview strong,
body.app-mode .creative-gallery .smart-creative-card .media-preview b {
  margin: 4px;
  padding: 2px 5px;
  font-size: 8px;
  line-height: 1;
  box-shadow: 1px 1px 0 #08090d;
}

body.app-mode .creative-gallery .smart-creative-card h3 {
  display: -webkit-box;
  min-height: 0;
  overflow: hidden;
  font-size: 12px !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

body.app-mode .creative-gallery .smart-creative-card p {
  margin-top: 1px !important;
  font-size: 9.5px !important;
  line-height: 1.22 !important;
  -webkit-line-clamp: 2;
}

body.app-mode .creative-gallery .smart-creative-card .media-meta {
  gap: 4px;
  overflow: hidden;
}

body.app-mode .creative-gallery .smart-creative-card .media-meta span {
  max-width: 100%;
  padding: 2px 5px !important;
  overflow: hidden;
  font-size: 8px !important;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode .creative-gallery .smart-creative-card .media-meta span:nth-child(n + 3) {
  display: none;
}

body.app-mode .creative-gallery .smart-creative-card footer {
  min-height: 22px;
}

body.app-mode .creative-gallery .smart-creative-card footer .badge {
  min-height: 20px;
  padding: 3px 6px;
  font-size: 8px;
}

body.app-mode .creative-gallery .smart-creative-card footer small {
  font-size: 9px !important;
}

body.app-mode .creative-card-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 5px !important;
}

body.app-mode .creative-card-actions button {
  min-height: 24px !important;
  padding: 4px 4px !important;
  font-size: 8px !important;
  line-height: 1.05;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode .creative-card-actions button:nth-child(5) {
  grid-column: auto !important;
}

body.app-mode .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 84px auto auto auto auto auto !important;
  max-height: none;
}

body.app-mode.creative-focus-mode .creative-agent-console .preview-canvas {
  min-height: 100%;
}

body.app-mode.creative-focus-mode .creative-agent-console .preview-device {
  transform: scale(1.04);
}

/* Dashboard page: compact operator cockpit with real action buttons. */
body.app-mode [data-view-section="dashboard"] {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px !important;
  align-items: start;
}

body.app-mode [data-view-section="dashboard"] .panel {
  border-width: 3px !important;
  border-radius: 12px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode [data-view-section="dashboard"] .performance-hero {
  grid-column: 1 / -1;
  min-height: 0;
  padding: 18px !important;
  background:
    linear-gradient(90deg, rgba(248, 91, 79, 0.22) 0 26%, rgba(213, 255, 0, 0.24) 26% 44%, rgba(34, 211, 238, 0.18) 44% 64%, rgba(139, 92, 246, 0.18) 64% 100%),
    #fff7ed !important;
}

body.app-mode [data-view-section="dashboard"] .campaign-panel {
  grid-column: span 7;
}

body.app-mode [data-view-section="dashboard"] .operations-panel {
  grid-column: span 5;
}

body.app-mode [data-view-section="dashboard"] .dashboard-secondary {
  display: block;
  grid-column: span 6;
}

body.app-mode [data-view-section="dashboard"] .panel-header {
  margin-bottom: 10px;
}

body.app-mode [data-view-section="dashboard"] .panel-header h2 {
  font-size: 18px !important;
  line-height: 1.05;
}

body.app-mode [data-view-section="dashboard"] .hero-performance {
  grid-template-columns: minmax(0, 1fr) 132px;
  gap: 12px;
  margin-bottom: 12px;
}

body.app-mode [data-view-section="dashboard"] .hero-performance > div:first-child,
body.app-mode [data-view-section="dashboard"] .hero-score {
  min-height: 96px;
  padding: 12px !important;
  border: 2px solid #08090d !important;
  border-radius: 10px !important;
  background: rgba(255, 250, 240, 0.78) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode [data-view-section="dashboard"] .hero-performance strong {
  font-size: 23px !important;
}

body.app-mode [data-view-section="dashboard"] .hero-score strong {
  font-size: 36px !important;
}

body.app-mode [data-view-section="dashboard"] .agent-command-board {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px !important;
  margin: 10px 0 !important;
}

body.app-mode [data-view-section="dashboard"] .agent-command-board article {
  min-height: 84px !important;
  padding: 10px 12px !important;
  border-width: 2px !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode [data-view-section="dashboard"] .agent-command-board strong {
  margin: 4px 0 !important;
  font-size: 14px !important;
}

body.app-mode [data-view-section="dashboard"] .agent-command-board small,
body.app-mode [data-view-section="dashboard"] .hero-performance p {
  font-size: 10.5px !important;
  line-height: 1.35 !important;
}

body.app-mode [data-view-section="dashboard"] .agentic-roadmap-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

body.app-mode [data-view-section="dashboard"] .agentic-roadmap-card button {
  width: 100%;
  min-height: 30px;
  margin-top: auto;
  padding: 6px 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

body.app-mode [data-view-section="dashboard"] .agentic-roadmap-card button:hover {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode [data-view-section="dashboard"] .agentic-roadmap-card button:disabled {
  cursor: progress;
  opacity: 0.68;
  transform: none;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics,
body.app-mode [data-view-section="dashboard"] .campaign-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics article,
body.app-mode [data-view-section="dashboard"] .campaign-summary > div {
  min-height: 72px !important;
  padding: 10px 12px !important;
  border-width: 2px !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
  background:
    linear-gradient(180deg, #dfff3f 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics article:nth-child(2),
body.app-mode [data-view-section="dashboard"] .campaign-summary > div:nth-child(2) {
  background:
    linear-gradient(180deg, #67d5e8 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics article:nth-child(3),
body.app-mode [data-view-section="dashboard"] .campaign-summary > div:nth-child(3) {
  background:
    linear-gradient(180deg, #b59cf6 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics article:nth-child(4),
body.app-mode [data-view-section="dashboard"] .campaign-summary > div:nth-child(4) {
  background:
    linear-gradient(180deg, #ffb454 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics strong,
body.app-mode [data-view-section="dashboard"] .campaign-summary strong {
  margin: 5px 0 2px !important;
  font-size: 20px !important;
  line-height: 1.05;
}

body.app-mode [data-view-section="dashboard"] .performance-metrics small {
  font-size: 9.5px !important;
}

body.app-mode [data-view-section="dashboard"] .recommendation-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px !important;
}

body.app-mode [data-view-section="dashboard"] .recommendation-card,
body.app-mode [data-view-section="dashboard"] .agent-action,
body.app-mode [data-view-section="dashboard"] .platform-score-row,
body.app-mode [data-view-section="dashboard"] .cost-row,
body.app-mode [data-view-section="dashboard"] .queue-list li,
body.app-mode [data-view-section="dashboard"] .event-list li {
  border-width: 2px !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.35) 0 7px, rgba(255, 250, 240, 0.94) 7px 100%) !important;
}

body.app-mode [data-view-section="dashboard"] .recommendation-card {
  min-height: 78px !important;
  padding: 10px 11px !important;
}

body.app-mode [data-view-section="dashboard"] .agent-action {
  min-height: 50px !important;
  padding: 8px 10px !important;
}

body.app-mode [data-view-section="dashboard"] .agent-action span {
  width: 22px;
  height: 22px;
  border-color: #08090d;
  background: #dfff3f;
  color: #08090d;
}

body.app-mode [data-view-section="dashboard"] .operation-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode [data-view-section="dashboard"] .operation-button {
  min-height: 62px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
}

body.app-mode [data-view-section="dashboard"] .operation-button:last-child {
  grid-column: 1 / -1;
}

body.app-mode [data-view-section="dashboard"] .operation-button strong {
  font-size: 13px !important;
}

body.app-mode [data-view-section="dashboard"] .provider-output {
  margin-top: 10px;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  font-size: 10.5px !important;
}

@media (max-width: 1180px) {
  body.app-mode [data-view-section="dashboard"] .campaign-panel,
  body.app-mode [data-view-section="dashboard"] .operations-panel,
  body.app-mode [data-view-section="dashboard"] .dashboard-secondary {
    grid-column: 1 / -1;
  }

  body.app-mode [data-view-section="dashboard"] .agent-command-board,
  body.app-mode [data-view-section="dashboard"] .performance-metrics,
  body.app-mode [data-view-section="dashboard"] .campaign-summary,
  body.app-mode [data-view-section="dashboard"] .recommendation-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Analytics page: compact command-center rhythm instead of stacked loud blocks. */
body.app-mode [data-view-section="analytics"] .full-panel {
  padding: 24px 24px 28px;
}

body.app-mode [data-view-section="analytics"] .panel-header {
  margin-bottom: 14px;
}

body.app-mode [data-view-section="analytics"] .analytics-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 0 0 14px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-grid .metric-card {
  min-height: 86px !important;
  padding: 12px 14px !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  box-shadow: 4px 4px 0 #08090d !important;
  background:
    linear-gradient(180deg, #dfff3f 0 8px, #fff7ed 8px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-grid .metric-card:nth-child(2) {
  background:
    linear-gradient(180deg, #67d5e8 0 8px, #fff7ed 8px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-grid .metric-card:nth-child(3) {
  background:
    linear-gradient(180deg, #b59cf6 0 8px, #fff7ed 8px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-grid .metric-card:nth-child(4) {
  background:
    linear-gradient(180deg, #ff6bcb 0 8px, #fff7ed 8px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-grid .metric-card strong {
  margin-top: 5px;
  font-size: 26px !important;
  line-height: 1;
}

body.app-mode [data-view-section="analytics"] .analytics-grid .metric-card small {
  margin-top: 4px;
  font-size: 11px !important;
  line-height: 1.25;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel {
  grid-template-columns: 1.15fr repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 14px 0 14px !important;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel article {
  min-height: 118px !important;
  padding: 13px 15px !important;
  border-width: 3px !important;
  border-radius: 12px !important;
  box-shadow: 4px 4px 0 #08090d !important;
  background:
    linear-gradient(90deg, #dfff3f 0 8px, rgba(255, 255, 255, 0.52) 8px 100%),
    #fff7ed !important;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel article:nth-child(2) {
  background:
    linear-gradient(90deg, #67d5e8 0 8px, rgba(255, 255, 255, 0.52) 8px 100%),
    #fff7ed !important;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel article:nth-child(3) {
  background:
    linear-gradient(90deg, #b59cf6 0 8px, rgba(255, 255, 255, 0.52) 8px 100%),
    #fff7ed !important;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel article:nth-child(4) {
  background:
    linear-gradient(90deg, #ffb454 0 8px, rgba(255, 255, 255, 0.52) 8px 100%),
    #fff7ed !important;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel strong {
  margin: 5px 0 7px !important;
  font-size: 17px !important;
  line-height: 1.08 !important;
}

body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel small {
  font-size: 12px !important;
  line-height: 1.32 !important;
}

body.app-mode [data-view-section="analytics"] .analytics-actions {
  gap: 12px !important;
  margin: 10px 0 16px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-actions button {
  min-height: 58px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode [data-view-section="analytics"] .analytics-actions strong {
  font-size: 12px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-console {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 14px 0 16px !important;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 14px;
  background:
    radial-gradient(circle at 0 0, rgba(103, 213, 232, 0.18), transparent 34%),
    rgba(255, 247, 237, 0.72);
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-response,
body.app-mode [data-view-section="analytics"] .analytics-agent-form,
body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations article,
body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid article,
body.app-mode [data-view-section="analytics"] .analytics-source-card,
body.app-mode [data-view-section="analytics"] .analytics-paid-card {
  border-width: 2px !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-response,
body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations,
body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid,
body.app-mode [data-view-section="analytics"] .analytics-agent-form {
  grid-column: 1 / -1;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-response {
  padding: 12px 14px !important;
  background:
    linear-gradient(100deg, rgba(223, 255, 63, 0.34), rgba(103, 213, 232, 0.18) 55%, rgba(181, 156, 246, 0.20)),
    #fff7ed !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-response strong {
  font-size: 16px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-response small {
  margin-top: 3px;
  font-size: 11px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations,
body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations article,
body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid article {
  padding: 9px !important;
  background: #fffaf0 !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations article {
  min-height: 68px;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid {
  gap: 8px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid article {
  min-height: 44px !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px !important;
  padding: 7px 9px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.40) 0 6px, rgba(255, 250, 240, 0.96) 6px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid article:nth-child(2) {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.50) 0 6px, rgba(255, 250, 240, 0.96) 6px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid article:nth-child(3) {
  background:
    linear-gradient(90deg, rgba(181, 156, 246, 0.52) 0 6px, rgba(255, 250, 240, 0.96) 6px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid article:nth-child(4) {
  background:
    linear-gradient(90deg, rgba(255, 107, 203, 0.42) 0 6px, rgba(255, 250, 240, 0.96) 6px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid span {
  font-size: 8px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid strong {
  justify-self: end;
  margin: 0;
  font-size: 15px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid small {
  grid-column: 1 / -1;
  font-size: 9px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-source-grid,
body.app-mode [data-view-section="analytics"] .analytics-paid-grid {
  grid-column: span 1;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-source-card,
body.app-mode [data-view-section="analytics"] .analytics-paid-card {
  min-height: 72px !important;
  padding: 9px 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.42) 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-paid-card {
  background:
    linear-gradient(90deg, rgba(255, 180, 84, 0.62) 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode [data-view-section="analytics"] .analytics-source-card strong,
body.app-mode [data-view-section="analytics"] .analytics-paid-card strong {
  font-size: 12px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-source-card small,
body.app-mode [data-view-section="analytics"] .analytics-source-card em,
body.app-mode [data-view-section="analytics"] .analytics-paid-card small,
body.app-mode [data-view-section="analytics"] .analytics-paid-card em {
  font-size: 9.5px !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-form {
  grid-template-columns: minmax(0, 1fr) auto !important;
  padding: 10px !important;
  background: #fff7ed !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-form textarea {
  min-height: 58px !important;
  border-width: 2px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode [data-view-section="analytics"] .analytics-agent-shortcuts button {
  min-height: 28px !important;
  padding: 6px 9px !important;
  font-size: 10px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode [data-view-section="analytics"] .insight-stack {
  margin-top: 12px;
}

body.app-mode [data-view-section="analytics"] .insight-card {
  border-width: 2px !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

@media (max-width: 1120px) {
  body.app-mode [data-view-section="analytics"] .analytics-grid,
  body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel,
  body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations,
  body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode [data-view-section="analytics"] .analytics-agent-console {
    grid-template-columns: 1fr !important;
  }

  body.app-mode [data-view-section="analytics"] .analytics-source-grid,
  body.app-mode [data-view-section="analytics"] .analytics-paid-grid {
    grid-column: 1 / -1;
  }

  body.app-mode.creative-focus-mode {
    overflow: auto;
  }

  body.app-mode.creative-focus-mode main {
    height: auto !important;
    overflow: visible !important;
  }

  body.app-mode.creative-focus-mode .creative-agent-console.chat-studio {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "modes"
      "channels"
      "composer"
      "preview" !important;
    height: auto;
  }

  body.app-mode.creative-focus-mode .creative-agent-console .creative-mode-switch,
  body.app-mode.creative-focus-mode .connected-channel-strip,
  body.app-mode.creative-focus-mode .creative-engine > .panel-header {
    position: static;
    width: auto;
    max-width: none;
  }

  body.app-mode.creative-focus-mode .manual-provider-form {
    grid-template-columns: 1fr;
    overflow: visible;
  }

  body.app-mode.creative-focus-mode .manual-provider-form label.wide-field,
  body.app-mode.creative-focus-mode .manual-requirements-card.wide-field,
  body.app-mode.creative-focus-mode .manual-dynamic-fields.wide-field,
  body.app-mode.creative-focus-mode .manual-action-row.wide-field {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  body.app-mode [data-view-section="analytics"] .analytics-grid,
  body.app-mode [data-view-section="analytics"] .agent-diagnosis-panel,
  body.app-mode [data-view-section="analytics"] .analytics-agent-recommendations,
  body.app-mode [data-view-section="analytics"] .analytics-agent-status-grid,
  body.app-mode [data-view-section="analytics"] .analytics-actions {
    grid-template-columns: 1fr !important;
  }
}

/* Dashboard final pass: top signals stay useful without stealing the page. */
body.app-mode[data-active-view="dashboard"] .global-project-console {
  grid-template-columns: minmax(240px, 0.95fr) minmax(280px, 1.35fr) minmax(360px, 1.3fr);
  gap: 10px !important;
  margin-bottom: 10px !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 12px !important;
  background:
    linear-gradient(90deg, rgba(248, 91, 79, 0.10), rgba(213, 255, 0, 0.12) 34%, rgba(34, 211, 238, 0.11) 66%, rgba(139, 92, 246, 0.11)),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .global-project-console label,
body.app-mode[data-active-view="dashboard"] .global-project-console > div {
  min-height: 54px;
}

body.app-mode[data-active-view="dashboard"] .global-project-console select {
  min-height: 34px !important;
}

body.app-mode[data-active-view="dashboard"] .global-project-console strong {
  display: block;
  margin-top: 2px;
  font-size: 16px !important;
}

body.app-mode[data-active-view="dashboard"] .global-project-console small,
body.app-mode[data-active-view="dashboard"] .global-project-console span {
  font-size: 10px !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats span {
  min-height: 44px;
  padding: 7px 8px;
  border: 2px solid #08090d;
  border-radius: 9px;
  background: #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats span:nth-child(2) {
  background: #c9f3ff;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats span:nth-child(3) {
  background: #eadcff;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats span:nth-child(4) {
  background: #d7ffd9;
}

body.app-mode[data-active-view="dashboard"] .status-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card {
  min-height: 58px !important;
  padding: 9px 11px !important;
  border: 2px solid #08090d !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card:nth-child(1) {
  background: linear-gradient(180deg, #d5ff00 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card:nth-child(2) {
  background: linear-gradient(180deg, #22d3ee 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card:nth-child(3) {
  background: linear-gradient(180deg, #a78bfa 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card:nth-child(4) {
  background: linear-gradient(180deg, #69e6a3 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card strong {
  margin-top: 3px;
  font-size: 17px !important;
  line-height: 1;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card small {
  font-size: 9.5px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="dashboard"] .project-switcher {
  grid-template-columns: minmax(260px, 1.15fr) minmax(260px, 1fr) auto;
  min-height: 0;
  margin-bottom: 12px !important;
  padding: 10px 12px !important;
  border-width: 2px !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .project-switcher label,
body.app-mode[data-active-view="dashboard"] .project-switcher > div {
  min-height: 48px;
}

body.app-mode[data-active-view="dashboard"] .project-switcher select {
  min-height: 34px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero {
  padding: 14px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero .project-memory-drawer {
  margin-bottom: 12px;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel,
body.app-mode[data-active-view="dashboard"] .operations-panel,
body.app-mode[data-active-view="dashboard"] .dashboard-secondary,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel:not(.performance-hero) {
  padding: 14px !important;
}

body.app-mode[data-active-view="dashboard"] .agent-action-list {
  gap: 10px;
}

body.app-mode[data-active-view="dashboard"] .agent-action {
  cursor: pointer;
}

/* Dashboard layout correction: each lower panel gets a real width. */
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  column-gap: 16px !important;
  row-gap: 14px !important;
  align-items: stretch !important;
  grid-auto-flow: row dense;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel:not(.performance-hero):not(.campaign-panel):not(.platform-panel):not(.cost-panel):not(.operations-panel):not(.dashboard-agent-panel) {
  grid-column: span 6;
}

body.app-mode[data-active-view="dashboard"] .performance-hero,
body.app-mode[data-active-view="dashboard"] .campaign-panel {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel,
body.app-mode[data-active-view="dashboard"] .cost-panel,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-secondary:not(.operations-panel):not(.cost-panel):not(.platform-panel) {
  grid-column: span 6 !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel {
  grid-column: span 6 !important;
  min-height: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel {
  grid-column: span 6 !important;
  min-height: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .campaign-summary,
body.app-mode[data-active-view="dashboard"] .recommendation-list {
  margin-bottom: 0;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .campaign-summary {
  margin-bottom: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel {
  background:
    linear-gradient(90deg, rgba(248, 91, 79, 0.18) 0 21%, rgba(213, 255, 0, 0.20) 21% 42%, rgba(34, 211, 238, 0.16) 42% 65%, rgba(139, 92, 246, 0.14) 65% 100%),
    #fff7ed !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .recommendation-list {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .recommendation-card {
  min-height: 82px !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel,
body.app-mode[data-active-view="dashboard"] .cost-panel,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-secondary:not(.operations-panel):not(.cost-panel):not(.platform-panel),
body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel,
body.app-mode[data-active-view="dashboard"] .operations-panel {
  min-height: 0 !important;
  background:
    linear-gradient(135deg, rgba(255, 250, 240, 0.94), rgba(247, 223, 197, 0.82)) !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel {
  display: flex !important;
  flex-direction: column;
  min-height: 286px !important;
  align-self: stretch !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel .platform-score-list {
  flex: 1;
  min-height: 154px;
}

/* Campaign brief modal: agentic, compact, and consistent with Polxy maximalism. */
body.app-mode .agentic-campaign-dialog {
  width: min(1120px, calc(100vw - 28px)) !important;
  padding: 0;
  border: 4px solid #08090d !important;
  border-radius: 14px !important;
  background:
    linear-gradient(90deg, rgba(248, 91, 79, 0.08) 0 22%, rgba(213, 255, 0, 0.08) 22% 45%, rgba(34, 211, 238, 0.08) 45% 68%, rgba(139, 92, 246, 0.08) 68% 100%),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 9px 9px 0 #08090d, 0 28px 80px rgba(8, 9, 13, 0.34) !important;
}

body.app-mode .agentic-campaign-dialog::backdrop {
  background:
    radial-gradient(circle at 20% 18%, rgba(34, 211, 238, 0.22), transparent 26%),
    radial-gradient(circle at 84% 26%, rgba(213, 255, 0, 0.18), transparent 28%),
    rgba(8, 9, 13, 0.62) !important;
}

body.app-mode .agentic-campaign-form {
  max-height: min(88vh, 850px) !important;
  overflow: auto;
  gap: 12px !important;
  padding: 14px !important;
}

body.app-mode .campaign-dialog-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.65fr) 42px;
  gap: 14px;
  align-items: stretch;
  padding: 15px;
  border: 3px solid #08090d;
  border-radius: 12px;
  background:
    linear-gradient(100deg, #f85b4f 0 24%, #d5ff00 24% 43%, #22d3ee 43% 66%, #8b5cf6 66% 100%);
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode .campaign-dialog-hero h2 {
  max-width: 720px;
  margin: 4px 0 5px;
  font-size: 25px !important;
  line-height: 1.02 !important;
  color: #08090d !important;
  text-shadow: 2px 2px 0 rgba(255, 250, 240, 0.7);
}

body.app-mode .campaign-dialog-hero p {
  max-width: 760px;
  margin: 0;
  font-size: 12px !important;
  line-height: 1.35 !important;
  color: #08090d !important;
  font-weight: 700;
}

body.app-mode .campaign-dialog-hero .icon-button {
  align-self: start;
  width: 38px;
  height: 38px;
  min-height: 0;
  border: 3px solid #08090d !important;
  border-radius: 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode .campaign-agent-card {
  display: grid;
  align-content: center;
  gap: 4px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 12px;
  background: rgba(255, 250, 240, 0.88);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode .campaign-agent-card span,
body.app-mode .campaign-agent-card small {
  font-size: 10px !important;
  line-height: 1.25 !important;
  color: #08090d !important;
}

body.app-mode .campaign-agent-card strong {
  font-size: 13px !important;
  line-height: 1.18 !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-banner {
  grid-template-columns: minmax(180px, 0.32fr) minmax(0, 1fr);
  align-items: center;
  min-height: 48px;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 12px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.38), rgba(213, 255, 0, 0.20)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-banner strong,
body.app-mode .agentic-campaign-dialog .campaign-brief-banner small {
  color: #08090d !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode .agentic-campaign-dialog .campaign-half-field {
  grid-column: span 2 !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label,
body.app-mode .agentic-campaign-dialog .choice-panel,
body.app-mode .agentic-campaign-dialog .estimate-card,
body.app-mode .campaign-agent-output-grid article {
  border: 3px solid #08090d !important;
  border-radius: 12px !important;
  background: rgba(255, 250, 240, 0.92) !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label {
  gap: 5px;
  min-height: 74px;
  padding: 9px 10px;
  font-size: 10px !important;
  font-weight: 800;
  text-transform: uppercase;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label:nth-child(6n + 1),
body.app-mode .agentic-campaign-dialog .choice-panel:nth-child(1),
body.app-mode .campaign-agent-output-grid article:nth-child(1) {
  background: linear-gradient(180deg, #d5ff00 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label:nth-child(6n + 2),
body.app-mode .agentic-campaign-dialog .choice-panel:nth-child(2),
body.app-mode .campaign-agent-output-grid article:nth-child(2) {
  background: linear-gradient(180deg, #67d5e8 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label:nth-child(6n + 3),
body.app-mode .campaign-agent-output-grid article:nth-child(3) {
  background: linear-gradient(180deg, #b59cf6 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label:nth-child(6n + 4) {
  background: linear-gradient(180deg, #ffb454 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label:nth-child(6n + 5) {
  background: linear-gradient(180deg, #69e6a3 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode .agentic-campaign-dialog .campaign-brief-grid label:nth-child(6n) {
  background: linear-gradient(180deg, #ff6bcb 0 7px, #fffaf0 7px 100%) !important;
}

body.app-mode .agentic-campaign-dialog .campaign-mission-field {
  grid-column: 1 / -1 !important;
  min-height: 118px !important;
}

body.app-mode .agentic-campaign-dialog .campaign-note-field {
  grid-column: span 2 !important;
  min-height: 106px !important;
}

body.app-mode .agentic-campaign-dialog .campaign-guardrail-field {
  grid-column: 1 / -1 !important;
  min-height: 92px !important;
}

body.app-mode .agentic-campaign-dialog input,
body.app-mode .agentic-campaign-dialog select,
body.app-mode .agentic-campaign-dialog textarea {
  min-height: 34px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 250, 240, 0.72) !important;
  color: #08090d !important;
  box-shadow: none !important;
}

body.app-mode .agentic-campaign-dialog textarea {
  min-height: 64px !important;
}

body.app-mode .agentic-campaign-dialog .campaign-mission-field textarea {
  min-height: 76px !important;
}

body.app-mode .agentic-campaign-dialog input::placeholder,
body.app-mode .agentic-campaign-dialog textarea::placeholder {
  color: rgba(8, 9, 13, 0.48) !important;
  font-size: 11px !important;
}

body.app-mode .agentic-campaign-dialog .dialog-choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode .agentic-campaign-dialog .choice-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px !important;
  padding: 11px !important;
}

body.app-mode .agentic-campaign-dialog .choice-panel h3 {
  grid-column: 1 / -1;
  margin: 0;
  color: #08090d !important;
  font-size: 11px !important;
}

body.app-mode .agentic-campaign-dialog .choice-panel label {
  display: flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 8px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.68);
  color: #08090d !important;
  font-weight: 800;
}

body.app-mode .agentic-campaign-dialog .choice-panel input {
  width: 14px !important;
  height: 14px !important;
  min-height: 0 !important;
}

body.app-mode .campaign-agent-output-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

body.app-mode .campaign-agent-output-grid article {
  min-height: 72px;
  padding: 10px 12px;
}

body.app-mode .campaign-agent-output-grid span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 20px;
  margin-bottom: 5px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 900;
}

body.app-mode .campaign-agent-output-grid strong,
body.app-mode .campaign-agent-output-grid small {
  display: block;
  color: #08090d !important;
}

body.app-mode .campaign-agent-output-grid small {
  margin-top: 4px;
  font-size: 10.5px !important;
  line-height: 1.3 !important;
}

body.app-mode .agentic-campaign-dialog .compact-estimate {
  grid-template-columns: minmax(180px, auto) minmax(0, 1fr) !important;
  min-height: 54px !important;
  padding: 10px 12px !important;
  background:
    linear-gradient(90deg, rgba(34, 211, 238, 0.32), rgba(139, 92, 246, 0.18)),
    #fffaf0 !important;
}

body.app-mode .agentic-campaign-dialog .compact-estimate span,
body.app-mode .agentic-campaign-dialog .compact-estimate strong,
body.app-mode .agentic-campaign-dialog .compact-estimate small {
  color: #08090d !important;
}

body.app-mode .agentic-campaign-dialog .compact-estimate strong {
  font-size: 19px !important;
}

body.app-mode .agentic-campaign-dialog menu {
  justify-content: space-between !important;
  gap: 10px !important;
}

body.app-mode .agentic-campaign-dialog menu button {
  min-width: 160px;
  min-height: 42px;
}

body.app-mode[data-active-view="dashboard"] .platform-score-list,
body.app-mode[data-active-view="dashboard"] .event-list,
body.app-mode[data-active-view="dashboard"] .queue-list,
body.app-mode[data-active-view="dashboard"] .agent-action-list {
  gap: 9px !important;
}

body.app-mode[data-active-view="dashboard"] .platform-score-row,
body.app-mode[data-active-view="dashboard"] .queue-list li,
body.app-mode[data-active-view="dashboard"] .event-list li {
  min-height: 56px !important;
  padding: 9px 11px !important;
}

body.app-mode[data-active-view="dashboard"] .event-list {
  max-height: 282px;
  overflow: auto;
  padding-right: 4px;
}

body.app-mode[data-active-view="dashboard"] .cost-breakdown-list {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="dashboard"] .cost-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(70px, 0.4fr);
  align-items: center;
  gap: 8px;
  min-height: 62px !important;
  padding: 9px 11px !important;
}

body.app-mode[data-active-view="dashboard"] .cost-row strong,
body.app-mode[data-active-view="dashboard"] .cost-row small {
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action-list {
  grid-template-columns: 1fr !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  min-height: 70px !important;
  padding: 10px 11px !important;
  text-align: left;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action span {
  display: inline-grid;
  place-items: center;
  width: 24px !important;
  height: 24px !important;
  font-size: 10px !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action strong {
  font-size: 12px !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button {
  min-height: 66px !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .provider-output {
  min-height: 38px;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="dashboard"] .global-project-console,
  body.app-mode[data-active-view="dashboard"] .project-switcher {
    grid-template-columns: 1fr;
  }

  body.app-mode[data-active-view="dashboard"] .status-grid,
  body.app-mode[data-active-view="dashboard"] .global-project-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="dashboard"] .platform-panel,
  body.app-mode[data-active-view="dashboard"] .cost-panel,
  body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel,
  body.app-mode[data-active-view="dashboard"] .operations-panel,
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-secondary:not(.operations-panel):not(.cost-panel):not(.platform-panel),
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel:not(.performance-hero):not(.campaign-panel) {
    grid-column: 1 / -1 !important;
  }

  body.app-mode[data-active-view="dashboard"] .cost-breakdown-list,
  body.app-mode[data-active-view="dashboard"] .operations-panel .operation-grid,
  body.app-mode[data-active-view="dashboard"] .campaign-panel .recommendation-list {
    grid-template-columns: 1fr !important;
  }
}

/* Dashboard polish: make the cockpit match the newer compact module pages. */
body.app-mode[data-active-view="dashboard"] .topbar {
  min-height: 84px;
  padding: 10px 14px !important;
}

body.app-mode[data-active-view="dashboard"] .topbar-title {
  gap: 12px;
}

body.app-mode[data-active-view="dashboard"] .topbar-title .signature-mark {
  width: 76px;
  height: 64px;
  display: grid;
  place-items: center;
  background:
    linear-gradient(135deg, var(--project-logo-bg-1, #08090d) 0 32%, var(--project-logo-bg-2, #67d5e8) 32% 66%, var(--project-logo-bg-3, #dfff3f) 66% 100%) !important;
}

body.app-mode[data-active-view="dashboard"] .topbar-title .signature-mark img {
  width: 100%;
  height: 100%;
  padding: 4px !important;
  object-fit: contain !important;
  object-position: center !important;
}

body.app-mode[data-active-view="dashboard"] .topbar-title .signature-mark img[hidden] {
  display: none !important;
}

body.app-mode[data-active-view="dashboard"] .topbar-title h1 {
  font-size: clamp(1.15rem, 1.65vw, 1.75rem) !important;
  line-height: 1.02 !important;
}

body.app-mode[data-active-view="dashboard"] .topbar-actions {
  gap: 8px;
}

body.app-mode[data-active-view="dashboard"] .global-project-console {
  grid-template-columns: minmax(220px, 0.9fr) minmax(280px, 1.45fr) minmax(300px, 1fr);
  padding: 9px 10px !important;
}

body.app-mode[data-active-view="dashboard"] .global-project-console label,
body.app-mode[data-active-view="dashboard"] .global-project-console > div {
  min-height: 46px;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats span {
  min-height: 38px;
  padding: 6px 7px;
}

body.app-mode[data-active-view="dashboard"] .global-project-stats b {
  display: block;
  font-size: 16px;
  line-height: 1;
}

body.app-mode[data-active-view="dashboard"] .status-grid {
  gap: 8px !important;
}

body.app-mode[data-active-view="dashboard"] .status-grid .metric-card {
  min-height: 56px !important;
  padding: 8px 10px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero {
  padding: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero .panel-header {
  min-height: 42px;
  margin-bottom: 9px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero .panel-header h2 {
  font-size: 19px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero .badge {
  min-height: 26px;
  padding: 6px 9px;
  font-size: 9px !important;
}

body.app-mode[data-active-view="dashboard"] .project-switcher {
  grid-template-columns: minmax(250px, 1fr) minmax(230px, 0.8fr) auto;
  gap: 8px !important;
  margin-bottom: 8px !important;
  padding: 8px 9px !important;
}

body.app-mode[data-active-view="dashboard"] .project-switcher label,
body.app-mode[data-active-view="dashboard"] .project-switcher > div {
  min-height: 40px;
}

body.app-mode[data-active-view="dashboard"] .project-switcher select {
  min-height: 30px !important;
}

body.app-mode[data-active-view="dashboard"] .project-switcher .secondary-action {
  min-width: 132px;
  min-height: 34px;
  padding: 7px 10px;
  font-size: 10px !important;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer {
  margin-bottom: 8px !important;
  border-width: 2px !important;
  border-radius: 9px !important;
  background: rgba(255, 250, 240, 0.68) !important;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer summary {
  min-height: 38px;
  padding: 0 10px;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer summary span {
  color: #08090d !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer summary small {
  max-width: 58%;
  color: rgba(8, 9, 13, 0.62) !important;
  font-size: 9.5px !important;
  line-height: 1.2 !important;
  text-align: right;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer .project-memory,
body.app-mode[data-active-view="dashboard"] .project-memory-drawer .project-memory * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer .form-grid,
body.app-mode[data-active-view="dashboard"] .project-memory-drawer .project-color-picker-grid,
body.app-mode[data-active-view="dashboard"] .project-memory-drawer .project-color-code-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer input,
body.app-mode[data-active-view="dashboard"] .project-memory-drawer textarea,
body.app-mode[data-active-view="dashboard"] .project-memory-drawer select {
  width: 100%;
}

body.app-mode[data-active-view="dashboard"] .project-memory-drawer small {
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="dashboard"] .hero-performance {
  grid-template-columns: minmax(0, 1fr) 106px;
  gap: 8px;
  margin-bottom: 8px;
}

body.app-mode[data-active-view="dashboard"] .hero-performance > div:first-child,
body.app-mode[data-active-view="dashboard"] .hero-score {
  min-height: 72px !important;
  padding: 9px 10px !important;
  border-radius: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance strong {
  font-size: 18px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance p {
  margin-top: 4px;
  font-size: 10px !important;
}

body.app-mode[data-active-view="dashboard"] .hero-score strong {
  font-size: 28px !important;
}

body.app-mode[data-active-view="dashboard"] .agent-command-board {
  gap: 8px !important;
  margin: 8px 0 !important;
}

body.app-mode[data-active-view="dashboard"] .agent-command-board article {
  min-height: 68px !important;
  padding: 8px 9px !important;
  border-radius: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .agent-command-board strong {
  margin: 3px 0 !important;
  font-size: 12px !important;
  line-height: 1.16 !important;
}

body.app-mode[data-active-view="dashboard"] .agent-command-board small {
  font-size: 9.5px !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-dock {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 7px !important;
  margin: 8px 0 !important;
  padding: 8px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-mode,
body.app-mode[data-active-view="dashboard"] .dashboard-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-options span {
  flex: 0 0 auto;
  color: #3859ef !important;
  font-size: 9px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-mode button,
body.app-mode[data-active-view="dashboard"] .dashboard-agent-options button,
body.app-mode[data-active-view="dashboard"] .dashboard-agent-send {
  flex: 0 0 auto;
  min-height: 29px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-mode button.active,
body.app-mode[data-active-view="dashboard"] .dashboard-agent-send {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 48px !important;
  max-height: 108px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 42%),
    #f8eedb !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 67px !important;
  min-height: 94px !important;
  padding: 7px !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-dock.is-running {
  outline: 3px solid #8b5cf6;
  outline-offset: 2px;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics,
body.app-mode[data-active-view="dashboard"] .campaign-summary {
  gap: 8px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics article,
body.app-mode[data-active-view="dashboard"] .campaign-summary > div {
  min-height: 58px !important;
  padding: 8px 9px !important;
  border-radius: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics strong,
body.app-mode[data-active-view="dashboard"] .campaign-summary strong {
  margin: 3px 0 1px !important;
  font-size: 17px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics small,
body.app-mode[data-active-view="dashboard"] .campaign-summary small {
  font-size: 9px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel,
body.app-mode[data-active-view="dashboard"] .operations-panel,
body.app-mode[data-active-view="dashboard"] .dashboard-secondary,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel:not(.performance-hero) {
  padding: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel {
  grid-column: span 7 !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel {
  grid-column: span 5 !important;
}

body.app-mode[data-active-view="dashboard"] .cost-panel,
body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel,
body.app-mode[data-active-view="dashboard"] .operations-panel,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-secondary:not(.platform-panel):not(.cost-panel):not(.operations-panel) {
  grid-column: span 6 !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .recommendation-list {
  gap: 8px !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .recommendation-card {
  min-height: 64px !important;
  padding: 8px 9px !important;
}

body.app-mode[data-active-view="dashboard"] .panel-note {
  margin-bottom: 8px;
  font-size: 10.5px !important;
  line-height: 1.3 !important;
}

body.app-mode[data-active-view="dashboard"] .mode-control {
  gap: 6px;
  margin-bottom: 8px;
}

body.app-mode[data-active-view="dashboard"] .mode-control .mode {
  min-height: 28px;
  padding: 5px 8px;
}

body.app-mode[data-active-view="dashboard"] .platform-score-row,
body.app-mode[data-active-view="dashboard"] .queue-list li,
body.app-mode[data-active-view="dashboard"] .event-list li,
body.app-mode[data-active-view="dashboard"] .cost-row {
  min-height: 48px !important;
  padding: 8px 9px !important;
  border-radius: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .event-list {
  max-height: 232px;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action {
  min-height: 58px !important;
  padding: 8px 9px !important;
  border-radius: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button {
  min-height: 56px !important;
  padding: 8px 10px !important;
  border-radius: 9px !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .provider-output {
  min-height: 34px;
  margin-top: 8px;
}

/* Automation command center: same Polxy color language, tighter real-work layout. */
body.app-mode[data-active-view="automation"] [data-view-section="automation"] > .full-panel {
  display: grid;
  gap: 14px;
  padding: 16px !important;
  border: 4px solid #08090d !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(103, 213, 232, 0.24), transparent 22%),
    radial-gradient(circle at 16% 80%, rgba(240, 168, 255, 0.22), transparent 24%),
    linear-gradient(115deg, rgba(255, 247, 237, 0.96), rgba(246, 226, 197, 0.82)) !important;
  box-shadow: 9px 9px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-bottom: 0 !important;
  min-height: 86px;
  padding: 12px 16px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(105deg, #f04a42 0 24%, #dfff3f 24% 46%, #3859ef 46% 100%);
  box-shadow: 6px 6px 0 #08090d;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header h2 {
  color: #08090d !important;
  font-size: clamp(1.05rem, 1.25vw, 1.45rem) !important;
  line-height: 1.05 !important;
  text-shadow: none !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header .eyebrow {
  color: #08090d !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header > div:first-child {
  display: inline-grid;
  gap: 5px;
  justify-self: start;
  max-width: min(560px, 100%);
  padding: 8px 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background: #fff7ed;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="automation"] .automation-summary {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  align-items: start;
  gap: 14px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div,
body.app-mode[data-active-view="automation"] .automation-settings,
body.app-mode[data-active-view="automation"] .automation-list,
body.app-mode[data-active-view="automation"] .provider-output {
  border: 3px solid #08090d !important;
  border-radius: 10px !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div {
  min-height: 82px !important;
  padding: 12px 14px !important;
  align-content: start;
  background:
    linear-gradient(115deg, rgba(255, 255, 255, 0.58) 0 28%, transparent 28% 100%),
    radial-gradient(circle at 82% 18%, rgba(255, 255, 255, 0.42), transparent 30%),
    #dfff3f !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(1) {
  grid-column: span 3;
  min-height: 104px !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(2) {
  grid-column: span 3;
  min-height: 92px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.45) 0 34%, transparent 34% 100%),
    linear-gradient(30deg, rgba(56, 89, 239, 0.18), transparent 62%),
    #67d5e8 !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(3) {
  grid-column: span 2;
  min-height: 76px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.38), transparent 58%),
    #b59cf6 !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(4) {
  grid-column: span 4;
  min-height: 96px !important;
  background:
    linear-gradient(135deg, rgba(255, 247, 237, 0.48) 0 28%, transparent 28% 100%),
    linear-gradient(22deg, rgba(255, 180, 84, 0.42), transparent 70%),
    #ef5350 !important;
}

body.app-mode[data-active-view="automation"] .automation-summary .eyebrow,
body.app-mode[data-active-view="automation"] .automation-summary strong,
body.app-mode[data-active-view="automation"] .automation-summary small {
  color: #08090d !important;
  text-shadow: none !important;
}

body.app-mode[data-active-view="automation"] .automation-summary strong {
  font-size: clamp(1.05rem, 1.25vw, 1.5rem) !important;
  line-height: 1.05;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(3) strong {
  font-size: clamp(1.35rem, 1.6vw, 1.85rem) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(4) strong {
  font-size: clamp(1rem, 1.1vw, 1.32rem) !important;
  line-height: 1.08;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="automation"] .automation-summary small {
  font-size: 0.72rem !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  align-items: start;
  gap: 14px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article {
  min-height: 78px !important;
  padding: 12px 14px !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(1) {
  grid-column: span 4;
  min-height: 94px !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(2) {
  grid-column: span 5;
  min-height: 88px !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(3) {
  grid-column: span 3;
  min-height: 108px !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(4) {
  grid-column: span 3;
  min-height: 86px !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(5) {
  grid-column: span 4;
  min-height: 112px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.45) 0 26%, transparent 26% 100%),
    #e671bd !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(6) {
  grid-column: span 5;
  min-height: 96px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 64%),
    #69dca0 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-console {
  grid-template-columns: minmax(0, 0.95fr) minmax(390px, 1.05fr) !important;
  align-items: start;
  gap: 14px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-response,
body.app-mode[data-active-view="automation"] .automation-agent-form {
  min-height: 0;
  border: 3px solid #08090d !important;
  border-radius: 10px !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-response {
  min-height: 260px;
  padding: 12px !important;
  background:
    linear-gradient(125deg, rgba(255, 255, 255, 0.44), transparent 64%),
    #67d5e8 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-form {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-content: center;
  min-height: 190px;
  padding: 12px !important;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.34), transparent 44%),
    linear-gradient(28deg, rgba(103, 213, 232, 0.22), transparent 72%),
    #fff7ed !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-form textarea {
  min-height: 76px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 247, 237, 0.9) !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-shortcuts button {
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-shortcuts button:nth-child(2) {
  background: #f0a8ff !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-shortcuts button:nth-child(3) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-recommendations article {
  border: 2px solid #08090d !important;
  background: #fff7ed !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-actions {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  align-items: start;
  gap: 14px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button {
  min-height: 60px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(1) {
  grid-column: span 3;
  min-height: 70px !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(2) {
  grid-column: span 4;
  min-height: 64px !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(3) {
  grid-column: span 2;
  min-height: 76px !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(4) {
  grid-column: span 3;
  min-height: 62px !important;
}

body.app-mode[data-active-view="automation"] .automation-settings {
  grid-template-columns: minmax(170px, 1.15fr) repeat(4, minmax(112px, 0.8fr)) minmax(160px, 0.9fr) !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 14px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.28), transparent 35%),
    linear-gradient(135deg, rgba(240, 168, 255, 0.18), transparent 58%),
    #fff7ed !important;
}

body.app-mode[data-active-view="automation"] .automation-settings label,
body.app-mode[data-active-view="automation"] .automation-settings .toggle-line {
  color: #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-settings input,
body.app-mode[data-active-view="automation"] .automation-settings select {
  border: 2px solid #08090d !important;
  background: #fffaf2 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .provider-output {
  margin: 0 !important;
  padding: 10px 12px !important;
  background: #fff7ed !important;
}

body.app-mode[data-active-view="automation"] .automation-list {
  display: grid;
  gap: 10px;
  min-height: 92px;
  padding: 12px !important;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.045) 0 9px, transparent 9px 18px),
    rgba(255, 247, 237, 0.8) !important;
}

body.app-mode[data-active-view="automation"] .automation-row,
body.app-mode[data-active-view="automation"] .automation-list .empty-state {
  border: 2px solid #08090d !important;
  border-radius: 9px !important;
  background: rgba(255, 250, 242, 0.94) !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-row strong,
body.app-mode[data-active-view="automation"] .automation-row small,
body.app-mode[data-active-view="automation"] .automation-row time {
  color: #08090d !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header,
  body.app-mode[data-active-view="automation"] .automation-agent-console,
  body.app-mode[data-active-view="automation"] .automation-settings {
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="automation"] .automation-summary,
  body.app-mode[data-active-view="automation"] #automation-agent-plan,
  body.app-mode[data-active-view="automation"] .automation-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="automation"] .automation-summary > div,
  body.app-mode[data-active-view="automation"] #automation-agent-plan article,
  body.app-mode[data-active-view="automation"] .automation-actions button {
    grid-column: span 1 !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="automation"] .automation-summary,
  body.app-mode[data-active-view="automation"] #automation-agent-plan,
  body.app-mode[data-active-view="automation"] .automation-actions {
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="automation"] .automation-summary > div,
  body.app-mode[data-active-view="automation"] #automation-agent-plan article,
  body.app-mode[data-active-view="automation"] .automation-actions button {
    grid-column: span 1 !important;
  }
}

/* Dashboard-standard compact pass for Automation. */
body.app-mode[data-active-view="automation"] [data-view-section="automation"] > .full-panel {
  gap: 12px;
  padding: 14px !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(103, 213, 232, 0.12), transparent 20%),
    radial-gradient(circle at 18% 88%, rgba(230, 113, 189, 0.1), transparent 22%),
    linear-gradient(115deg, rgba(255, 247, 237, 0.99), rgba(246, 231, 209, 0.9)) !important;
  box-shadow: 7px 7px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header {
  min-height: 72px;
  padding: 10px 12px;
  border-width: 3px;
  background:
    linear-gradient(105deg, rgba(240, 74, 66, 0.72) 0 22%, rgba(223, 255, 63, 0.6) 22% 44%, rgba(56, 89, 239, 0.76) 44% 100%) !important;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header > div:first-child {
  max-width: 440px;
  padding: 9px 12px;
  border-width: 3px;
  border-radius: 10px;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header h2 {
  font-size: clamp(1rem, 1.28vw, 1.45rem) !important;
  line-height: 1.05;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header .actions {
  gap: 8px;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header .actions button {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 0.74rem;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="automation"] .automation-summary {
  gap: 10px !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div {
  min-height: 68px !important;
  padding: 9px 11px !important;
  border-width: 3px !important;
  border-radius: 9px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(1) {
  grid-column: span 3;
  min-height: 84px !important;
  background: linear-gradient(120deg, #ecff8d 0 34%, #f8ffc6 34% 100%) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(2) {
  grid-column: span 3;
  background: linear-gradient(135deg, #d5f6fb, #79d3e4) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(3) {
  grid-column: span 2;
  min-height: 70px !important;
  background: linear-gradient(135deg, #f1e8ff, #b9a1f1) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(4) {
  grid-column: span 4;
  min-height: 82px !important;
  background: linear-gradient(130deg, #ffd7ca 0 42%, #e65c55 42% 100%) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary strong {
  font-size: clamp(0.98rem, 1.08vw, 1.28rem) !important;
  line-height: 1.02;
}

body.app-mode[data-active-view="automation"] .automation-summary small,
body.app-mode[data-active-view="automation"] .automation-summary .eyebrow {
  font-size: 0.68rem !important;
  line-height: 1.24;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan {
  gap: 10px !important;
  align-items: start;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article {
  min-height: 68px !important;
  padding: 9px 11px !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(1) {
  min-height: 82px !important;
  background: #f0ff9f !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(2) {
  min-height: 76px !important;
  background: #d4f5fb !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(3) {
  min-height: 70px !important;
  background: #efe5ff !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(4) {
  min-height: 76px !important;
  background: #ffdca7 !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(5) {
  min-height: 74px !important;
  background: #f3bddd !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(6) {
  min-height: 76px !important;
  background: #c8f1dc !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article strong {
  font-size: clamp(0.95rem, 1vw, 1.14rem) !important;
  line-height: 1.05;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article small,
body.app-mode[data-active-view="automation"] #automation-agent-plan article .eyebrow {
  font-size: 0.67rem !important;
  line-height: 1.24;
}

body.app-mode[data-active-view="automation"] .automation-agent-console {
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.96fr) !important;
  gap: 11px !important;
  align-items: stretch !important;
  grid-auto-rows: minmax(258px, auto);
}

body.app-mode[data-active-view="automation"] .automation-agent-response,
body.app-mode[data-active-view="automation"] .automation-agent-form {
  border-width: 3px !important;
  border-radius: 10px !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-response {
  min-height: 258px !important;
  padding: 11px !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(223, 255, 63, 0.16), transparent 26%),
    linear-gradient(145deg, #d4f5fb, #a9e8f2) !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-response h3,
body.app-mode[data-active-view="automation"] .automation-agent-form textarea {
  font-size: 0.98rem !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-response p {
  font-size: 0.72rem !important;
  line-height: 1.32;
  max-width: 92%;
}

body.app-mode[data-active-view="automation"] .automation-agent-recommendations {
  gap: 7px !important;
  margin-top: 9px !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-recommendations article {
  min-height: 36px;
  padding: 7px 9px;
  border-width: 2px;
  border-radius: 8px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="automation"] .automation-agent-recommendations strong {
  font-size: 0.76rem;
}

body.app-mode[data-active-view="automation"] .automation-agent-form {
  min-height: 258px !important;
  height: 100%;
  align-self: stretch !important;
  padding: 11px !important;
  align-content: stretch !important;
  align-items: end;
  grid-template-columns: minmax(0, 1fr) auto !important;
  grid-template-rows: minmax(112px, 1fr) auto;
  gap: 9px 10px !important;
  background:
    radial-gradient(circle at 12% 88%, rgba(103, 213, 232, 0.18), transparent 22%),
    linear-gradient(145deg, #fff7ed, #f7f1df) !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-form textarea {
  grid-column: 1 / -1;
  min-height: 118px !important;
  height: 100%;
  padding: 10px !important;
  border-width: 3px !important;
  line-height: 1.25;
}

body.app-mode[data-active-view="automation"] .automation-agent-shortcuts {
  grid-column: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

body.app-mode[data-active-view="automation"] .automation-agent-shortcuts button,
body.app-mode[data-active-view="automation"] .automation-agent-form > button[type="submit"] {
  min-height: 32px !important;
  padding: 7px 11px !important;
  border-width: 3px !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 0.7rem !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-form > button[type="submit"] {
  grid-column: 2;
  justify-self: end;
  min-width: 118px;
}

body.app-mode[data-active-view="automation"] .automation-actions {
  gap: 10px !important;
  margin-top: 0 !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button {
  min-height: 48px !important;
  padding: 9px 12px !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-actions strong {
  font-size: 0.86rem !important;
}

body.app-mode[data-active-view="automation"] .automation-settings {
  gap: 10px !important;
  padding: 11px !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  box-shadow: 4px 4px 0 #08090d !important;
  background: linear-gradient(120deg, rgba(214, 246, 251, 0.58), rgba(255, 247, 237, 0.92)) !important;
}

body.app-mode[data-active-view="automation"] .automation-settings label {
  gap: 5px;
  font-size: 0.7rem;
}

body.app-mode[data-active-view="automation"] .automation-settings input,
body.app-mode[data-active-view="automation"] .automation-settings select {
  min-height: 34px !important;
  padding: 7px 9px !important;
  border-width: 3px !important;
  font-size: 0.78rem;
}

body.app-mode[data-active-view="automation"] .automation-settings .button {
  min-height: 34px;
  padding: 7px 12px;
  font-size: 0.72rem;
}

body.app-mode[data-active-view="automation"] .automation-status-line,
body.app-mode[data-active-view="automation"] .automation-log {
  min-height: 34px;
  padding: 8px 10px;
  border-width: 3px;
  border-radius: 8px;
  box-shadow: 4px 4px 0 #08090d;
  font-size: 0.76rem;
}

/* Automation title scale correction: match the compact module pages. */
body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header {
  min-height: 60px;
  padding: 8px 10px;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header > div:first-child {
  max-width: 380px;
  gap: 3px;
  padding: 7px 10px;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header h2 {
  font-size: 15px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header .actions button {
  min-height: 30px;
  padding: 6px 10px;
  font-size: 10px;
  line-height: 1.1;
}

body.app-mode[data-active-view="automation"] .automation-summary strong {
  font-size: 14px !important;
  line-height: 1.08;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(3) strong {
  font-size: 18px !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(4) strong {
  font-size: 14px !important;
}

body.app-mode[data-active-view="automation"] .automation-summary small,
body.app-mode[data-active-view="automation"] .automation-summary .eyebrow,
body.app-mode[data-active-view="automation"] #automation-agent-plan article small,
body.app-mode[data-active-view="automation"] #automation-agent-plan article .eyebrow {
  font-size: 10px !important;
  line-height: 1.24;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article strong,
body.app-mode[data-active-view="automation"] #automation-agent-title {
  font-size: 15px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-copy {
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-recommendations strong,
body.app-mode[data-active-view="automation"] .automation-actions strong {
  font-size: 11px !important;
  line-height: 1.12 !important;
}

/* Automation page cleanup: compact dashboard cards, controlled color, sticky prompt only. */
body.app-mode[data-active-view="automation"] [data-view-section="automation"],
body.app-mode[data-active-view="automation"] [data-view-section="automation"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] > .full-panel {
  gap: 12px !important;
  padding: 14px !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 38%),
    linear-gradient(25deg, transparent 54%, rgba(185, 167, 255, 0.14)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header {
  grid-template-columns: minmax(0, 1fr) max-content !important;
  min-height: 0 !important;
  padding: 10px 12px !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.78), rgba(103, 213, 232, 0.48) 54%, rgba(255, 250, 240, 0.95)) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header > div:first-child {
  max-width: 560px !important;
  gap: 3px !important;
  padding: 7px 10px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header h2 {
  font-size: clamp(17px, 1.55vw, 22px) !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .header-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] .header-actions button,
body.app-mode[data-active-view="automation"] .automation-settings button {
  min-height: 32px !important;
  padding: 6px 10px !important;
  font-size: 10px !important;
  line-height: 1.05 !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-console {
  display: none !important;
}

body.app-mode[data-active-view="automation"] .automation-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div {
  grid-column: auto !important;
  display: grid !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 82px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 10px 11px !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(1) {
  background:
    linear-gradient(90deg, #dfff3f 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(223, 255, 63, 0.24), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(2) {
  background:
    linear-gradient(90deg, #67d5e8 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(103, 213, 232, 0.24), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(3) {
  background:
    linear-gradient(90deg, #b9a7ff 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(185, 167, 255, 0.22), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary > div:nth-child(4) {
  background:
    linear-gradient(90deg, #ffb15e 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 177, 94, 0.22), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="automation"] .automation-summary strong {
  font-size: clamp(16px, 1.35vw, 22px) !important;
  line-height: 1.03 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="automation"] .automation-summary small,
body.app-mode[data-active-view="automation"] .automation-summary .eyebrow,
body.app-mode[data-active-view="automation"] #automation-agent-plan article small,
body.app-mode[data-active-view="automation"] #automation-agent-plan article .eyebrow {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
  line-height: 1.24 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article {
  grid-column: auto !important;
  min-height: 86px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 10px 11px !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.30) 0 7px, transparent 7px),
    rgba(255, 250, 240, 0.98) !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(3n + 1) {
  background:
    linear-gradient(90deg, #dfff3f 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(3n + 2) {
  background:
    linear-gradient(90deg, #67d5e8 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article:nth-child(3n) {
  background:
    linear-gradient(90deg, #b9a7ff 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(185, 167, 255, 0.14), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="automation"] #automation-agent-plan article strong {
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.1 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="automation"] .automation-actions {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button {
  grid-column: auto !important;
  min-height: 58px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 9px 10px !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="automation"] .automation-actions button:nth-child(4) {
  background: #ffb15e !important;
}

body.app-mode[data-active-view="automation"] .automation-actions strong {
  font-size: 12px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="automation"] .automation-actions span {
  font-size: 9px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="automation"] .automation-settings {
  display: grid !important;
  grid-template-columns: minmax(170px, 1.1fr) repeat(4, minmax(100px, 0.85fr)) minmax(150px, 0.95fr) !important;
  gap: 9px !important;
  margin: 0 !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.24) 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 250, 240, 0.98), rgba(239, 251, 255, 0.92)) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="automation"] .automation-settings label,
body.app-mode[data-active-view="automation"] .automation-settings .toggle-line {
  gap: 4px !important;
  color: #08090d !important;
  font-size: 10px !important;
  line-height: 1.15 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="automation"] .automation-settings input,
body.app-mode[data-active-view="automation"] .automation-settings select {
  min-height: 31px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 5px 8px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view="automation"] .provider-output {
  min-height: 0 !important;
  margin: 0 !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 8px 10px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.28) 0 7px, transparent 7px),
    #fffaf0 !important;
  color: rgba(8, 9, 13, 0.78) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body.app-mode[data-active-view="automation"] .automation-list {
  display: grid !important;
  gap: 8px !important;
  min-height: 76px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(255, 177, 94, 0.14), transparent 46%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="automation"] .automation-row,
body.app-mode[data-active-view="automation"] .automation-list .empty-state {
  display: grid !important;
  grid-template-columns: minmax(86px, max-content) minmax(0, 1fr) max-content !important;
  align-items: start !important;
  gap: 10px !important;
  min-height: 56px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 9px 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.22) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="automation"] .automation-row:nth-child(2n) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.28) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
}

body.app-mode[data-active-view="automation"] .automation-row time {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="automation"] .automation-row strong {
  color: #08090d !important;
  font-size: 13px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="automation"] .automation-row small,
body.app-mode[data-active-view="automation"] .automation-list .empty-state {
  color: rgba(8, 9, 13, 0.70) !important;
  font-size: 10.5px !important;
  line-height: 1.24 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="automation"] .automation-row .badge {
  justify-self: end !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  white-space: normal !important;
}

@media (max-width: 1100px) {
  body.app-mode[data-active-view="automation"] .automation-summary,
  body.app-mode[data-active-view="automation"] #automation-agent-plan,
  body.app-mode[data-active-view="automation"] .automation-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="automation"] .automation-settings {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="automation"] .automation-settings .toggle-line,
  body.app-mode[data-active-view="automation"] .automation-settings button {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="automation"] [data-view-section="automation"] .panel-header,
  body.app-mode[data-active-view="automation"] .automation-summary,
  body.app-mode[data-active-view="automation"] #automation-agent-plan,
  body.app-mode[data-active-view="automation"] .automation-actions,
  body.app-mode[data-active-view="automation"] .automation-settings {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="automation"] [data-view-section="automation"] .header-actions {
    justify-content: stretch !important;
  }

  body.app-mode[data-active-view="automation"] [data-view-section="automation"] .header-actions button {
    flex: 1 1 130px !important;
  }

  body.app-mode[data-active-view="automation"] .automation-row,
  body.app-mode[data-active-view="automation"] .automation-list .empty-state {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="automation"] .automation-row .badge {
    justify-self: start !important;
  }
}

/* Creative Studio compact pass: match the Dashboard/Automation product rhythm. */
body.app-mode[data-active-view="creative"] [data-view-section="creative"] > .panel {
  padding: 14px !important;
  border-width: 3px !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 90% 10%, rgba(103, 213, 232, 0.12), transparent 22%),
    radial-gradient(circle at 18% 86%, rgba(181, 156, 246, 0.10), transparent 24%),
    linear-gradient(115deg, rgba(255, 247, 237, 0.99), rgba(246, 231, 209, 0.9)) !important;
  box-shadow: 7px 7px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] > .panel > .panel-header {
  margin-bottom: 10px !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] > .panel > .panel-header h2 {
  font-size: clamp(1rem, 1.25vw, 1.35rem) !important;
  line-height: 1.08;
}

body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
  gap: 10px !important;
  grid-template-columns: minmax(430px, 0.98fr) minmax(500px, 1.02fr) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
  padding: 9px 10px !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  box-shadow: 4px 4px 0 #08090d !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.20) 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher select {
  min-height: 34px !important;
  border-width: 3px !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 0.82rem !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head {
  min-height: 64px !important;
  padding: 8px 11px !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(90deg, rgba(240, 74, 66, 0.16), rgba(223, 255, 63, 0.18) 32%, rgba(103, 213, 232, 0.16) 64%, rgba(181, 156, 246, 0.18)),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head > div {
  max-width: min(560px, 70%) !important;
  padding: 7px 10px !important;
  border-width: 2px !important;
  border-radius: 9px !important;
  background: rgba(255, 250, 240, 0.92) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head strong {
  margin: 2px 0 3px !important;
  font-size: clamp(0.98rem, 1.12vw, 1.18rem) !important;
  line-height: 1.05;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head small {
  font-size: 0.66rem !important;
  line-height: 1.25;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head .secondary-action {
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-width: 3px !important;
  font-size: 0.72rem !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery {
  min-height: 128px !important;
  grid-auto-columns: minmax(185px, 245px) !important;
  gap: 10px !important;
  padding: 3px 3px 6px !important;
}

body.app-mode[data-active-view="creative"] .creative-empty-card {
  min-height: 116px !important;
  max-width: 220px !important;
  padding: 10px !important;
  border-width: 3px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-empty-card strong {
  font-size: 0.92rem !important;
  line-height: 1.05;
}

body.app-mode[data-active-view="creative"] .creative-empty-card small {
  font-size: 0.68rem !important;
  line-height: 1.28;
}

body.app-mode[data-active-view="creative"] .creative-mode-switch {
  padding: 4px !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-mode-switch button {
  min-height: 32px !important;
  padding: 6px 10px !important;
  font-size: 0.7rem !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions {
  gap: 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel {
  display: grid !important;
  grid-area: dna !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  gap: 10px !important;
  align-items: center !important;
  min-height: 54px !important;
  max-height: none !important;
  padding: 8px 10px !important;
  overflow: hidden !important;
  border: 3px solid #08090d !important;
  border-radius: 10px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.22), rgba(103, 213, 232, 0.16)),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel > div:first-child {
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel .eyebrow {
  display: block !important;
  color: rgba(8, 9, 13, 0.72) !important;
  -webkit-text-fill-color: rgba(8, 9, 13, 0.72) !important;
  font-size: 0.56rem !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel strong {
  display: block !important;
  margin: 1px 0 !important;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  font-size: 0.92rem !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel small {
  display: block !important;
  max-width: none !important;
  overflow: hidden !important;
  color: rgba(8, 9, 13, 0.74) !important;
  -webkit-text-fill-color: rgba(8, 9, 13, 0.74) !important;
  font-size: 0.68rem !important;
  line-height: 1.18 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-tags {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
  max-width: 390px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-tags span {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  max-width: 150px !important;
  min-height: 24px !important;
  padding: 3px 8px !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 0.56rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(92px, 112px)) !important;
  gap: 7px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 30px !important;
  height: 30px !important;
  min-width: 0 !important;
  padding: 4px 7px !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 0.58rem !important;
  line-height: 1 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-tags {
    display: none !important;
  }
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions button {
  min-height: 50px !important;
  padding: 8px 11px !important;
  border-width: 3px !important;
  border-radius: 9px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions strong {
  font-size: 0.9rem !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions small {
  font-size: 0.66rem !important;
  line-height: 1.24;
}

body.app-mode[data-active-view="creative"] .connected-channel-strip {
  min-height: 34px !important;
  padding: 5px 8px !important;
  border-width: 3px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-tool-strip {
  gap: 7px !important;
}

body.app-mode[data-active-view="creative"] .creative-tool-strip button {
  min-height: 32px !important;
  padding: 6px 10px !important;
  border-width: 3px !important;
  font-size: 0.68rem !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .manual-studio-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
  height: clamp(500px, calc(100vh - 360px), 650px) !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  padding: 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
  min-height: 126px !important;
  padding: 7px !important;
  border-width: 3px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .composer-layout-rail button {
  min-height: 30px !important;
  font-size: 0.56rem !important;
}

body.app-mode[data-active-view="creative"] .composer-layout-rail span {
  width: 27px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form textarea {
  min-height: 62px !important;
  max-height: 92px !important;
  font-size: 0.82rem !important;
}

body.app-mode[data-active-view="creative"] .composer-asset-rail button {
  min-height: 23px !important;
  font-size: 0.58rem !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button {
  width: 40px !important;
  min-height: 40px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button.is-running {
  background: #dfff3f !important;
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-message.pending {
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.06) 0 8px, transparent 8px 16px),
    #fff7ed !important;
}

.schedule-dialog {
  width: min(1360px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  padding: 0;
  border: 4px solid #08090d;
  border-radius: 12px;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.07) 0 9px, transparent 9px 18px),
    linear-gradient(105deg, rgba(240, 74, 66, 0.68) 0 22%, rgba(223, 255, 63, 0.72) 22% 43%, rgba(103, 213, 232, 0.7) 43% 65%, rgba(56, 89, 239, 0.68) 65% 100%),
    #fff7ed;
  box-shadow: 10px 10px 0 #08090d;
}

.schedule-dialog::backdrop {
  background: rgba(8, 9, 13, 0.64);
}

.schedule-form {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  gap: 10px;
  max-height: calc(100vh - 36px);
  padding: 14px;
  overflow: hidden;
}

.schedule-dialog-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  margin: -14px -14px 0;
  padding: 12px 14px 10px;
  border-bottom: 3px solid #08090d;
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.08) 0 8px, transparent 8px 16px),
    linear-gradient(100deg, #f04a42 0 24%, #dfff3f 24% 46%, #67d5e8 46% 70%, #3859ef 70% 100%);
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  text-shadow: 0 1px 0 rgba(255, 247, 237, 0.45);
}

.schedule-dialog-header h2 {
  margin: 1px 0 3px;
  font-size: clamp(1.35rem, 1.8vw, 1.85rem);
  line-height: 1;
}

.schedule-dialog-header p {
  max-width: 760px;
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.18;
}

.schedule-agent-plan {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) repeat(4, minmax(118px, 0.65fr));
  gap: 8px;
  align-items: stretch;
  padding: 8px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.78) 0 12px, rgba(255, 247, 237, 0.98) 12px 100%),
    #fff7ed;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

.schedule-agent-plan[hidden] {
  display: none !important;
}

.schedule-agent-plan article {
  min-width: 0;
  padding: 7px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf1;
}

.schedule-agent-plan article:first-child {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.34), transparent 56%),
    #fffaf1;
}

.schedule-agent-orbit {
  position: relative;
  width: 38px;
  aspect-ratio: 1;
  border: 3px solid #08090d;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #dfff3f, #67d5e8, #b59cf6, #ffbf69, #dfff3f);
  box-shadow: 2px 2px 0 #08090d;
  animation: scheduleAgentSpin 1.9s linear infinite;
}

.schedule-agent-orbit::after {
  content: "";
  position: absolute;
  inset: 10px;
  border: 2px solid #08090d;
  border-radius: 50%;
  background: #fff7ed;
}

.schedule-agent-plan span,
.schedule-agent-plan small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

.schedule-agent-plan span {
  color: rgba(8, 9, 13, 0.66);
  -webkit-text-fill-color: rgba(8, 9, 13, 0.66);
  font-size: 0.58rem;
  font-weight: 950;
  text-transform: uppercase;
  white-space: nowrap;
}

.schedule-agent-plan strong {
  display: block;
  margin-top: 2px;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  font-size: 0.78rem;
  line-height: 1.08;
}

.schedule-agent-plan small {
  margin-top: 3px;
  color: rgba(8, 9, 13, 0.68);
  -webkit-text-fill-color: rgba(8, 9, 13, 0.68);
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 1.18;
}

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

.schedule-grid {
  display: grid;
  grid-template-columns: 0.78fr 0.68fr 1.58fr;
  gap: 10px;
  min-height: 0;
  overflow: hidden;
}

.schedule-panel {
  display: grid;
  align-content: start;
  gap: 7px;
  min-width: 0;
  min-height: 0;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.24), transparent 42%),
    linear-gradient(315deg, rgba(255, 191, 105, 0.18), transparent 55%),
    #fffaf1;
  box-shadow: 5px 5px 0 #08090d;
}

.schedule-panel:nth-child(1) {
  background:
    linear-gradient(120deg, rgba(223, 255, 63, 0.7) 0 32%, rgba(255, 247, 237, 0.94) 32% 100%),
    #fffaf1;
}

.schedule-panel:nth-child(2) {
  background:
    linear-gradient(120deg, rgba(103, 213, 232, 0.68) 0 34%, rgba(255, 247, 237, 0.94) 34% 100%),
    #fffaf1;
}

.schedule-panel:nth-child(3) {
  background:
    linear-gradient(120deg, rgba(181, 156, 246, 0.62) 0 30%, rgba(255, 247, 237, 0.94) 30% 100%),
    #fffaf1;
}

.schedule-panel label {
  display: grid;
  gap: 3px;
  color: #08090d;
  font-size: 0.78rem;
  font-weight: 850;
}

.schedule-panel input,
.schedule-panel select {
  min-height: 32px;
  padding: 6px 9px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  color: #08090d;
  font: inherit;
  box-shadow: 3px 3px 0 #08090d;
}

.schedule-date-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px;
  align-items: stretch;
}

.schedule-date-field input {
  width: 100%;
}

.schedule-date-field button {
  min-width: 44px;
  min-height: 32px;
  padding: 5px 8px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #67d5e8;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  font-size: 0.68rem;
  font-weight: 950;
  cursor: pointer;
  box-shadow: 3px 3px 0 #08090d;
}

.schedule-date-field button:hover {
  background: #dfff3f;
}

.schedule-section-title {
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.schedule-channel-grid,
.schedule-chip-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.schedule-channel-grid label,
.schedule-chip-grid label,
.schedule-toggle,
.schedule-cadence-mode label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #fff7ed;
  font-size: 0.76rem;
  line-height: 1.1;
  box-shadow: 2px 2px 0 #08090d;
}

.schedule-channel-grid label:nth-child(4n + 1),
.schedule-chip-grid label:nth-child(4n + 1) {
  background: linear-gradient(90deg, #dfff3f 0 10px, #fff7ed 10px 100%);
}

.schedule-channel-grid label:nth-child(4n + 2),
.schedule-chip-grid label:nth-child(4n + 2) {
  background: linear-gradient(90deg, #67d5e8 0 10px, #fff7ed 10px 100%);
}

.schedule-channel-grid label:nth-child(4n + 3),
.schedule-chip-grid label:nth-child(4n + 3) {
  background: linear-gradient(90deg, #b59cf6 0 10px, #fff7ed 10px 100%);
}

.schedule-channel-grid label:nth-child(4n + 4),
.schedule-chip-grid label:nth-child(4n + 4) {
  background: linear-gradient(90deg, #ffbf69 0 10px, #fff7ed 10px 100%);
}

.schedule-channel-grid input,
.schedule-chip-grid input,
.schedule-toggle input,
.schedule-cadence-mode input {
  width: 14px;
  height: 14px;
  min-height: 0;
  flex: 0 0 14px;
  margin: 0;
  padding: 0;
  border-width: 2px;
  box-shadow: none;
  accent-color: #67d5e8;
}

.schedule-cadence-mode {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1fr) minmax(0, 1fr);
  gap: 6px;
  align-items: center;
}

.schedule-cadence-mode > span {
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.schedule-preview-panel {
  grid-template-rows: auto auto auto minmax(0, 1fr) auto auto;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.24), transparent 45%),
    linear-gradient(315deg, rgba(181, 156, 246, 0.22), transparent 55%),
    #fffaf1;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
}

.schedule-preview-panel strong {
  display: block;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  font-size: 1rem;
}

.schedule-preview-panel small {
  display: block;
  color: rgba(8, 9, 13, 0.68);
  -webkit-text-fill-color: rgba(8, 9, 13, 0.68);
  font-weight: 750;
}

.schedule-calendar-preview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 7px;
  width: 100%;
}

.schedule-day-card {
  display: grid;
  gap: 4px;
  min-width: 0;
  min-height: 76px;
  padding: 7px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.22), transparent 58%),
    #fff7ed;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
}

.schedule-day-card:nth-child(4n + 1) {
  background: linear-gradient(180deg, #dfff3f 0 8px, #fff7ed 8px 100%);
}

.schedule-day-card:nth-child(4n + 2) {
  background: linear-gradient(180deg, #67d5e8 0 8px, #fff7ed 8px 100%);
}

.schedule-day-card:nth-child(4n + 3) {
  background: linear-gradient(180deg, #b59cf6 0 8px, #fff7ed 8px 100%);
}

.schedule-day-card:nth-child(4n + 4) {
  background: linear-gradient(180deg, #ffbf69 0 8px, #fff7ed 8px 100%);
}

.schedule-day-card b {
  font-size: 0.72rem;
  line-height: 1.1;
}

.schedule-day-card span {
  font-size: 0.6rem;
  font-weight: 850;
}

.schedule-day-card small {
  display: -webkit-box;
  overflow: hidden;
  font-size: 0.58rem;
  line-height: 1.2;
  -webkit-line-clamp: 4;
}

.schedule-post-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 0;
}

.schedule-post-list-head span {
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}

.schedule-post-list-head button {
  min-height: 28px;
  padding: 5px 9px;
  font-size: 0.62rem;
}

.schedule-post-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  min-height: 0;
  max-height: none;
  overflow: auto;
  padding: 1px 3px 4px 0;
}

.schedule-post-card {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 7px;
  align-items: center;
  min-width: 0;
  min-height: 56px;
  padding: 6px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.22), transparent 54%),
    #fff7ed;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
}

.schedule-post-card:nth-child(4n + 1) {
  background: linear-gradient(90deg, #dfff3f 0 8px, #fff7ed 8px 100%);
}

.schedule-post-card:nth-child(4n + 2) {
  background: linear-gradient(90deg, #67d5e8 0 8px, #fff7ed 8px 100%);
}

.schedule-post-card:nth-child(4n + 3) {
  background: linear-gradient(90deg, #b59cf6 0 8px, #fff7ed 8px 100%);
}

.schedule-post-card:nth-child(4n + 4) {
  background: linear-gradient(90deg, #ffbf69 0 8px, #fff7ed 8px 100%);
}

.schedule-post-card span {
  display: grid;
  place-items: center;
  width: 30px;
  aspect-ratio: 1;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #67d5e8;
  font-size: 0.62rem;
  font-weight: 950;
}

.schedule-post-card div {
  min-width: 0;
}

.schedule-post-card b,
.schedule-post-card small,
.schedule-post-card em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-post-card b {
  font-size: 0.72rem;
  line-height: 1.12;
}

.schedule-post-card small {
  margin-top: 3px;
  color: rgba(8, 9, 13, 0.68);
  -webkit-text-fill-color: rgba(8, 9, 13, 0.68);
  font-size: 0.62rem;
  font-weight: 800;
}

.schedule-post-card em {
  grid-column: 1 / -1;
  width: max-content;
  max-width: 100%;
  padding: 2px 6px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 900;
}

.schedule-overflow-note {
  grid-column: 1 / -1;
  margin: 0;
  padding: 7px;
  border: 2px dashed #08090d;
  border-radius: 8px;
  font-size: 0.7rem;
  font-weight: 850;
}

.schedule-total-row,
.schedule-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.schedule-total-row {
  padding: 8px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: linear-gradient(90deg, #dfff3f 0 42%, #67d5e8 42% 72%, #b59cf6 72% 100%);
  font-weight: 900;
}

.schedule-credit-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 7px;
  align-items: stretch;
  padding: 8px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background:
    linear-gradient(90deg, #67d5e8 0 10px, #fff7ed 10px 100%),
    #fff7ed;
  color: #08090d;
  -webkit-text-fill-color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

.schedule-credit-panel.needs-top-up {
  background:
    linear-gradient(90deg, #ffbf69 0 10px, #fff7ed 10px 100%),
    #fff7ed;
}

.schedule-credit-panel div {
  min-width: 0;
}

.schedule-credit-panel span,
.schedule-credit-panel small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-credit-panel span {
  font-size: 0.62rem;
  font-weight: 950;
  text-transform: uppercase;
}

.schedule-credit-panel strong {
  display: block;
  margin-top: 2px;
  font-size: 1rem;
  line-height: 1.1;
}

.schedule-credit-panel small {
  margin-top: 3px;
  color: rgba(8, 9, 13, 0.68);
  -webkit-text-fill-color: rgba(8, 9, 13, 0.68);
  font-size: 0.62rem;
  font-weight: 800;
}

.schedule-credit-panel button {
  align-self: center;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .schedule-agent-plan {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .schedule-agent-plan article:first-child {
    grid-column: 1 / -1;
  }

  .schedule-grid {
    grid-template-columns: 1fr;
  }

  .schedule-calendar-preview {
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
  }

  .schedule-post-card-list {
    grid-template-columns: 1fr;
  }

  .schedule-credit-panel {
    grid-template-columns: 1fr;
  }

  .schedule-cadence-mode {
    grid-template-columns: 1fr;
  }
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-message.pending p::after {
  content: " ...";
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-device {
  max-width: min(98%, 640px) !important;
  max-height: min(98%, 720px) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell.inspecting-asset,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell:has(.preview-inspector) {
  grid-template-columns: 1fr !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: stretch !important;
  min-height: 100% !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-canvas {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell.inspecting-asset .preview-device,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell:has(.preview-inspector) .preview-device {
  width: min(var(--preview-frame-width, 540px), 100%, 500px) !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  aspect-ratio: var(--preview-ratio, 1 / 1) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector {
  grid-template-columns: minmax(150px, 1fr) auto auto !important;
  align-self: stretch !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 7px 8px !important;
  gap: 7px !important;
  border-width: 2px !important;
  border-radius: 8px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector .eyebrow,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector small,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector strong {
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-meta {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-meta span {
  padding: 3px 6px !important;
  font-size: 8px !important;
  white-space: nowrap !important;
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 5px !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button {
  min-height: 25px !important;
  padding: 3px 7px !important;
  font-size: 8px !important;
  box-shadow: 1px 1px 0 #08090d !important;
}

/* Creative Studio final tightening: keep the board useful without pushing the composer away. */
body.app-mode[data-active-view="creative"] [data-view-section="creative"] > .panel {
  padding: 12px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
  gap: 8px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
  padding: 7px 9px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher select {
  min-height: 31px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head {
  min-height: 54px !important;
  padding: 7px 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head > div {
  max-width: min(500px, 64%) !important;
  padding: 6px 9px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery-head strong {
  font-size: clamp(0.92rem, 1.04vw, 1.1rem) !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery {
  min-height: 248px !important;
  max-height: none !important;
  height: auto !important;
  align-items: start !important;
  padding: 4px 3px 18px !important;
  overflow-y: visible !important;
}

body.app-mode[data-active-view="creative"] .creative-empty-card {
  min-height: 96px !important;
  max-width: 205px !important;
  padding: 9px !important;
}

body.app-mode[data-active-view="creative"] .creative-empty-card strong {
  font-size: 0.84rem !important;
}

body.app-mode[data-active-view="creative"] .creative-empty-card small {
  font-size: 0.64rem !important;
}

/* Project creative board polish: clear previews for text, image, and video assets. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(226px, 268px) !important;
  min-height: 342px !important;
  padding: 6px 4px 20px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card {
  display: grid !important;
  grid-template-rows: 104px minmax(46px, auto) auto auto auto !important;
  gap: 7px !important;
  max-height: none !important;
  min-height: 318px !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.photo {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.36), transparent 46%),
    #fff7ed !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.video {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.36), transparent 48%),
    #fff7ed !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 104px minmax(46px, auto) auto auto auto !important;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.28), transparent 46%),
    #fff7ed !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview {
  position: relative;
  display: block;
  height: 104px !important;
  min-height: 104px !important;
  padding: 0 !important;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 6px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.28), transparent 58%),
    #10111f !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-video-processing,
.creative-board-card .media-video-processing {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 45%, rgba(174, 229, 209, 0.32), transparent 34%),
    radial-gradient(circle at 36% 62%, rgba(202, 240, 105, 0.24), transparent 38%),
    linear-gradient(145deg, #082932, #07151f 58%, #08090d);
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-video-processing::before,
.creative-board-card .media-video-processing::before {
  position: absolute;
  inset: -30%;
  background:
    repeating-linear-gradient(90deg, rgba(174, 229, 209, 0.10) 0 1px, transparent 1px 18px),
    repeating-linear-gradient(0deg, rgba(202, 240, 105, 0.10) 0 1px, transparent 1px 22px);
  content: "";
  transform: rotate(-8deg);
  animation: videoProcessingGrid 7s linear infinite;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-video-processing .video-cooking-visual,
.creative-board-card .media-video-processing .video-cooking-visual {
  transform: scale(0.34);
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview video,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview object {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview,
.creative-board-card .media-failed-video-preview {
  position: absolute;
  inset: 0;
  display: grid;
  align-content: end;
  gap: 3px;
  overflow: hidden;
  padding: 8px;
  background: #fffaf0;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview img,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview object,
.creative-board-card .media-failed-video-preview img,
.creative-board-card .media-failed-video-preview object {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.54;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview span,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview small,
.creative-board-card .media-failed-video-preview span,
.creative-board-card .media-failed-video-preview small {
  position: relative;
  z-index: 2;
  width: max-content;
  max-width: 100%;
  padding: 3px 5px;
  border: 2px solid #08090d;
  background: #fffaf0;
  color: #08090d;
  font-weight: 900;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview span,
.creative-board-card .media-failed-video-preview span {
  background: #ef5350;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-failed-video-preview small,
.creative-board-card .media-failed-video-preview small {
  display: -webkit-box;
  overflow: hidden;
  font-size: 9px;
  line-height: 1.15;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.video .media-preview::after {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(8, 9, 13, 0.08), rgba(8, 9, 13, 0.38));
  content: "";
  pointer-events: none;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview {
  display: grid;
  align-content: start;
  gap: 5px;
  height: 100%;
  padding: 10px;
  background:
    linear-gradient(90deg, rgba(255, 247, 237, 0.94) 0 12px, transparent 12px),
    repeating-linear-gradient(180deg, #fffaf0 0 17px, #f1dfbf 17px 19px);
  color: #08090d;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  display: -webkit-box;
  overflow: hidden;
  color: #08090d;
  -webkit-box-orient: vertical;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b {
  font-size: 11px;
  line-height: 1.1;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  max-height: 36px;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.25;
  -webkit-line-clamp: 3;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.media-missing {
  opacity: 0.78;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .missing-media-preview {
  align-content: center;
  background: #fffaf0;
  border: 3px dashed #111111;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-kind,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-size,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-play {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  width: auto;
  max-width: calc(100% - 12px);
  margin: 0 !important;
  padding: 3px 6px !important;
  border: 2px solid #08090d;
  border-radius: 5px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 8px !important;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-size {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-kind {
  top: 6px;
  left: 6px;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-size {
  right: 6px !important;
  bottom: 6px !important;
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-play {
  top: 6px !important;
  right: 6px !important;
  background: #dfff3f !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  font-size: 13px !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  font-size: 10px !important;
  line-height: 1.25 !important;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-meta {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-meta span {
  min-width: 0;
  max-width: 50%;
  padding: 3px 5px !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card footer {
  min-height: 22px;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-width: 0;
  min-height: 25px !important;
  padding: 4px 6px !important;
  overflow: hidden;
  border-width: 2px !important;
  border-radius: 5px !important;
  font-size: 8px !important;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: 1 / -1 !important;
}

/* Creative cards: final fit pass so generated image cards keep all actions visible. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(248px, 282px) !important;
  min-height: 366px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 116px 48px 24px 20px 74px !important;
  min-height: 342px !important;
  max-height: 342px !important;
  gap: 5px !important;
  padding: 9px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 116px 48px 24px 20px 74px auto !important;
  min-height: 540px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-preview {
  height: 116px !important;
  min-height: 116px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview video {
  object-fit: cover !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  min-height: 16px !important;
  max-height: 18px !important;
  font-size: 12px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  -webkit-line-clamp: 1 !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  max-height: 25px !important;
  font-size: 9px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-meta {
  min-height: 20px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card footer {
  min-height: 18px !important;
  font-size: 8px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 20px) !important;
  gap: 4px !important;
  min-height: 68px !important;
  align-self: end !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-width: 0 !important;
  min-height: 20px !important;
  height: 20px !important;
  padding: 2px 4px !important;
  overflow: hidden !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: 1 / -1 !important;
}

/* Creative Studio preview strip lock: the full board lives in the View All modal. */
body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
  display: grid !important;
  grid-template-columns: none !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(252px, 292px) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview .media-svg-object,
.creative-board-card .board-card-preview img,
.creative-board-card .board-card-preview video,
.creative-board-card .board-card-preview .media-svg-object {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  object-fit: contain !important;
  background: #05070a !important;
}

/* Creative board modal cards mirror the main Creative Studio card system. */
.creative-board-masonry {
  grid-template-columns: repeat(auto-fill, minmax(252px, 292px)) !important;
  align-items: start;
  justify-content: center;
}

.creative-board-masonry .creative-board-card.smart-creative-card {
  display: grid !important;
  grid-template-columns: none !important;
  grid-template-rows: 132px 58px 28px 24px 66px !important;
  gap: 6px !important;
  min-height: 360px !important;
  max-height: 360px !important;
  padding: 10px !important;
  overflow: hidden !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card.text {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card .media-preview,
.creative-board-masonry .creative-board-card.smart-creative-card.text .media-preview {
  height: 132px !important;
  min-height: 132px !important;
  padding: 0 !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card .media-preview img,
.creative-board-masonry .creative-board-card.smart-creative-card .media-preview video,
.creative-board-masonry .creative-board-card.smart-creative-card .media-preview .media-svg-object {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  object-fit: contain !important;
  background: #05070a !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card .media-text-preview {
  height: 100%;
}

.creative-board-masonry .creative-board-card.smart-creative-card h3,
.creative-board-masonry .creative-board-card.smart-creative-card p {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical;
}

.creative-board-masonry .creative-board-card.smart-creative-card h3 {
  min-height: 28px;
  max-height: 32px;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2;
}

.creative-board-masonry .creative-board-card.smart-creative-card p {
  max-height: 26px;
  margin: 3px 0 0 !important;
  font-size: 9.5px !important;
  line-height: 1.2 !important;
  -webkit-line-clamp: 2;
}

.creative-board-masonry .creative-board-card.smart-creative-card .media-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px !important;
  min-height: 24px;
}

.creative-board-masonry .creative-board-card.smart-creative-card .media-meta span:nth-child(n + 3) {
  display: none !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card footer {
  min-height: 22px;
}

.creative-board-masonry .creative-board-card.smart-creative-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 26px) !important;
  gap: 5px !important;
  align-self: end;
}

.creative-board-masonry .creative-board-card.smart-creative-card .creative-card-actions button {
  min-height: 26px !important;
  padding: 4px 5px !important;
  font-size: 8.5px !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card .creative-card-actions .creative-board-delete {
  border-color: rgba(8, 9, 13, 0.64) !important;
  background: rgba(255, 247, 237, 0.62) !important;
  color: rgba(8, 9, 13, 0.64) !important;
  box-shadow: 1px 1px 0 rgba(8, 9, 13, 0.42) !important;
}

.creative-board-masonry .creative-board-card.smart-creative-card .creative-card-actions .creative-board-delete:hover,
.creative-board-masonry .creative-board-card.smart-creative-card .creative-card-actions .creative-board-delete:focus-visible {
  background: #ff6b6b !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

/* Exact View All card match: mirror the main preview strip measurements. */
body.app-mode[data-active-view="creative"] .creative-board-masonry {
  grid-template-columns: repeat(auto-fill, minmax(258px, 292px)) !important;
  gap: 14px !important;
  align-items: start !important;
  justify-content: center !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card.video,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card.text {
  display: grid !important;
  grid-template-columns: none !important;
  grid-template-rows: 128px 48px 30px 18px 82px !important;
  gap: 7px !important;
  width: 100% !important;
  min-height: 382px !important;
  max-height: 382px !important;
  padding: 10px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card.text .media-preview {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 128px !important;
  min-height: 128px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 6px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 54%),
    #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-preview video,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-preview .media-svg-object {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  border: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #05070a !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-text-preview {
  width: 100% !important;
  height: 100% !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card > div:nth-of-type(2) {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card h3 {
  display: block !important;
  max-height: 17px !important;
  margin: 0 !important;
  overflow: hidden !important;
  font-size: 12.5px !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card p {
  display: -webkit-box !important;
  max-height: 28px !important;
  margin: 3px 0 0 !important;
  overflow: hidden !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 1.18 !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
  justify-self: center !important;
  width: calc(100% - 8px) !important;
  min-height: 30px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-meta span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 25px !important;
  padding: 3px 6px !important;
  overflow: hidden !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .media-meta span:nth-child(n + 3) {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card footer {
  align-items: center !important;
  min-height: 18px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card footer .badge,
body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card footer small {
  font-size: 7.5px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 23px) !important;
  gap: 5px !important;
  align-self: end !important;
  justify-self: center !important;
  width: calc(100% - 10px) !important;
  max-width: calc(100% - 10px) !important;
  min-height: 79px !important;
  margin-top: 1px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .creative-card-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 23px !important;
  height: 23px !important;
  padding: 2px 5px !important;
  overflow: hidden !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-board-masonry .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: auto !important;
}

/* Final lock: compact landing login and app-style workspace scrolling. */
.image-login-panel {
  right: clamp(14px, 2.6vw, 42px) !important;
  top: clamp(18px, 3vw, 34px) !important;
  grid-template-columns: minmax(122px, 148px) minmax(0, 1fr) !important;
  gap: 8px 11px !important;
  width: min(510px, calc(100vw - 30px)) !important;
  padding: 10px !important;
  box-shadow: 6px 6px 0 #08090d, 0 18px 54px rgba(0, 0, 0, 0.34) !important;
}

.image-login-panel img {
  height: 54px !important;
}

.image-login-panel span {
  padding: 6px 8px !important;
  font-size: 10px !important;
}

.landing-login-form {
  gap: 8px 10px !important;
}

.landing-login-form input {
  height: 36px !important;
  padding: 0 9px !important;
  font-size: 11px !important;
}

.landing-login-form .landing-remember span {
  padding: 5px 7px !important;
  font-size: 9px !important;
}

.landing-login {
  min-height: 36px !important;
  padding: 0 11px !important;
  font-size: 12px !important;
}

.landing-login.primary {
  min-height: 44px !important;
  font-size: 13px !important;
}

@media (min-width: 821px) {
  .landing-auth-cta {
    position: fixed !important;
    top: clamp(18px, 2.2vw, 34px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 95 !important;
    min-height: 46px !important;
    padding: 0 22px !important;
    background: #dfff3f !important;
    box-shadow: 6px 6px 0 #08090d !important;
    font-size: 13px !important;
  }

  .image-login-panel {
    top: clamp(84px, 9vh, 112px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    width: min(560px, calc(100vw - 56px)) !important;
    max-height: calc(100svh - 126px) !important;
    align-items: start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform: none !important;
  }
}

/* Must stay last: Help Centre is a full-screen support page with no app sidebar. */
body.app-mode[data-active-view="help"] > .app-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="help"] > .app-shell > .sidebar,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-menu-toggle,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-sidebar-scrim {
  display: none !important;
  width: 0 !important;
}

body.app-mode[data-active-view="help"] > .app-shell > main {
  grid-column: 1 / -1 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  padding: clamp(18px, 3vw, 40px) !important;
}

body.app-mode[data-active-view="help"] [data-view-section="help"] {
  max-width: 1480px !important;
  margin: 0 auto !important;
}

/* Must stay last: Help Centre is a full-screen support page with no app sidebar. */
body.app-mode[data-active-view="help"] > .app-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="help"] > .app-shell > .sidebar,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-menu-toggle,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-sidebar-scrim {
  display: none !important;
  width: 0 !important;
}

body.app-mode[data-active-view="help"] > .app-shell > main {
  grid-column: 1 / -1 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  padding: clamp(18px, 3vw, 40px) !important;
}

body.app-mode[data-active-view="help"] [data-view-section="help"] {
  max-width: 1480px !important;
  margin: 0 auto !important;
}

/* Creative Studio board: keep the page as a compact preview strip; View All owns the full library. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  display: grid !important;
  grid-template-columns: none !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(236px, 292px) !important;
  gap: 14px !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card {
  width: auto !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview video,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview .media-svg-object,
.creative-board-card .board-card-preview img,
.creative-board-card .board-card-preview video,
.creative-board-card .board-card-preview .media-svg-object {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  object-fit: contain !important;
  background: #05070a !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview video,
.creative-board-card .board-card-preview video {
  object-fit: cover !important;
}

/* Caption preview readability: keep generated copy legible on the dark preview canvas. */
body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-artwork,
body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-item,
body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-head {
  color: rgba(255, 255, 255, 0.92) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.92) !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-head strong,
body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-item p {
  color: rgba(255, 255, 255, 0.9) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.9) !important;
  text-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-head small {
  color: rgba(255, 255, 255, 0.66) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.66) !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-item p span {
  color: #67d5e8 !important;
  -webkit-text-fill-color: #67d5e8 !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .caption-preview-item b {
  color: #050505 !important;
  -webkit-text-fill-color: #050505 !important;
}

/* Structured Polxy chat replies: show caption sets and weekly plans as readable cards. */
body.app-mode[data-active-view="creative"] .creative-agent-console .chat-structured-copy {
  display: grid;
  gap: 8px;
  max-height: 280px;
  overflow: auto;
  padding-right: 3px;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-structured-copy .caption-preview-item {
  gap: 5px;
  padding: 9px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.92);
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-structured-copy .caption-preview-item b {
  border: 2px solid #08090d;
  background: #dfff3f;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-structured-copy .caption-preview-item p {
  margin: 0;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  font-size: 11px;
  line-height: 1.36;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-structured-copy .caption-preview-item p span {
  display: inline-block;
  margin-right: 6px;
  color: #06708a !important;
  -webkit-text-fill-color: #06708a !important;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}

/* Generated workspace cards: balanced vertical composition for previews, chips, and actions. */
body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
  grid-auto-columns: minmax(258px, 292px) !important;
  min-height: 408px !important;
  gap: 14px !important;
  align-items: start !important;
  padding: 10px 8px 24px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  display: grid !important;
  grid-template-rows: 128px 48px 30px 18px 82px !important;
  gap: 7px !important;
  width: 100% !important;
  min-height: 382px !important;
  max-height: 382px !important;
  padding: 10px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.review-open {
  grid-template-rows: 128px 48px 30px 18px 82px auto !important;
  min-height: 560px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text .media-preview {
  display: grid !important;
  place-items: center !important;
  height: 128px !important;
  min-height: 128px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 54%),
    #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview video {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-text-preview {
  width: 100% !important;
  height: 100% !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card > div:nth-of-type(2) {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card h3 {
  display: block !important;
  max-height: 17px !important;
  margin: 0 !important;
  overflow: hidden !important;
  font-size: 12.5px !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card p {
  display: -webkit-box !important;
  max-height: 28px !important;
  margin: 3px 0 0 !important;
  overflow: hidden !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 1.18 !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
  justify-self: center !important;
  width: calc(100% - 8px) !important;
  min-height: 30px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 25px !important;
  padding: 3px 6px !important;
  overflow: hidden !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta span:nth-child(n + 3) {
  display: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer {
  align-items: center !important;
  min-height: 18px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer .badge,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer small {
  font-size: 7.5px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 23px) !important;
  gap: 5px !important;
  align-self: end !important;
  justify-self: center !important;
  width: calc(100% - 10px) !important;
  max-width: calc(100% - 10px) !important;
  min-height: 79px !important;
  margin-top: 1px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 23px !important;
  height: 23px !important;
  padding: 2px 5px !important;
  overflow: hidden !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: 1 / -1 !important;
}

.generated-card-logo {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 48px;
  height: 32px;
  padding: 4px;
  border: 2px solid #08090d;
  border-radius: 6px;
  background: rgba(255, 247, 237, 0.9);
  box-shadow: 2px 2px 0 #08090d;
  pointer-events: none;
}

.generated-card-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Creative preview clarity: generated images should be visible, not covered by UI layers. */
body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-visual {
  padding: 0 !important;
  background: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-artwork {
  padding: 0 !important;
  align-content: stretch !important;
  background: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .video-processing-state {
  position: absolute !important;
  inset: 7% 8% !important;
  z-index: 2 !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-generation-pending {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(174, 229, 209, 0.28), transparent 31%),
    radial-gradient(circle at 36% 68%, rgba(202, 240, 105, 0.22), transparent 34%),
    linear-gradient(145deg, #082932, #07151f 58%, #08090d) !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-generation-pending::before {
  position: absolute;
  inset: -24%;
  background:
    repeating-linear-gradient(90deg, rgba(174, 229, 209, 0.10) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(0deg, rgba(202, 240, 105, 0.08) 0 1px, transparent 1px 28px);
  content: "";
  transform: rotate(-8deg);
  animation: videoProcessingGrid 7s linear infinite;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-generation-pending .video-cooking-visual,
body.app-mode[data-active-view="creative"] .creative-preview-stage .video-processing-state .video-cooking-visual {
  margin: auto;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-generated-image {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-artwork:has(.preview-generated-image) .preview-generated-copy,
body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-artwork:has(.preview-generated-image) .preview-play {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-preview-stage .preview-artwork:has(.preview-generated-image) .preview-project-logo {
  display: block !important;
}

/* Creative board modal: Pinterest-style view for all generated assets. */
.creative-gallery-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.creative-board-dialog {
  width: min(1380px, calc(100vw - 24px));
  max-width: none;
  max-height: min(860px, calc(100dvh - 32px));
  padding: 0;
  border: 4px solid #08090d;
  border-radius: 10px;
  background: #fff7ed;
  box-shadow: 12px 12px 0 #08090d;
}

.creative-board-dialog::backdrop {
  background: rgba(8, 9, 13, 0.68);
}

[data-media-open] {
  cursor: pointer;
}

[data-media-open]:focus-visible {
  outline: 4px solid #caf069;
  outline-offset: 3px;
}

.media-open-hitbox {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: transparent;
  cursor: pointer;
}

.media-open-cue {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 6;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 3px 3px 0 #08090d;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-3px) scale(0.96);
  transition: opacity 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.media-preview:hover .media-open-cue,
.media-preview:focus-within .media-open-cue,
.preview-artwork:hover .media-open-cue,
.preview-artwork:focus-within .media-open-cue,
.media-open-cue:focus-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.media-open-cue::before,
.media-open-cue::after {
  content: "";
  display: block;
}

.image-zoom-cue::before {
  width: 12px;
  height: 12px;
  border: 3px solid #08090d;
  border-radius: 50%;
}

.image-zoom-cue::after {
  position: absolute;
  width: 10px;
  height: 3px;
  border-radius: 99px;
  background: #08090d;
  transform: translate(8px, 8px) rotate(45deg);
}

.video-fullscreen-cue::before {
  width: 16px;
  height: 16px;
  border: 3px solid #08090d;
  border-top-width: 0;
  border-left-width: 0;
  box-shadow: -8px -8px 0 -5px #fff7ed, -8px -8px 0 -2px #08090d;
}

.media-open-cue:hover {
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0 #08090d;
}

.media-card.video .media-play {
  display: none;
}

.creative-gallery .media-open-cue,
.creative-board-card .media-open-cue {
  width: 30px;
  height: 30px;
  top: 8px;
  right: 8px;
}

.media-lightbox-dialog {
  width: min(1180px, calc(100vw - 28px));
  max-width: none;
  max-height: min(900px, calc(100dvh - 28px));
  padding: 0;
  border: 4px solid #08090d;
  border-radius: 10px;
  background: #061c23;
  box-shadow: 12px 12px 0 #08090d;
}

.media-lightbox-dialog.is-open {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 10000;
  display: block;
  margin: 0;
  transform: translate(-50%, -50%);
}

.media-lightbox-dialog.is-open::before {
  content: "";
  position: fixed;
  inset: -100vmax;
  z-index: -1;
  background: rgba(8, 9, 13, 0.78);
  backdrop-filter: blur(6px);
}

body.media-lightbox-open {
  overflow: hidden;
}

.media-lightbox-dialog::backdrop {
  background: rgba(8, 9, 13, 0.78);
  backdrop-filter: blur(6px);
}

.media-lightbox-modal {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: calc(100dvh - 36px);
  background:
    linear-gradient(135deg, rgba(202, 240, 105, 0.2), transparent 34%),
    linear-gradient(28deg, rgba(174, 229, 209, 0.18), transparent 64%),
    #082932;
}

.media-lightbox-modal > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border-bottom: 4px solid #08090d;
  background: #fff7ed;
}

.media-lightbox-modal h2,
.media-lightbox-modal p {
  margin: 0;
  color: #08090d;
}

.media-lightbox-modal h2 {
  font-size: clamp(18px, 2vw, 26px);
  line-height: 1;
}

.media-lightbox-modal p {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 900;
}

.media-lightbox-body {
  display: grid;
  place-items: center;
  min-height: min(720px, calc(100dvh - 142px));
  padding: 18px;
  overflow: auto;
}

.media-lightbox-body img,
.media-lightbox-body video {
  display: block;
  max-width: 100%;
  max-height: calc(100dvh - 178px);
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #08090d;
  box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.42);
  object-fit: contain;
}

.media-lightbox-dialog.video .media-lightbox-body video {
  width: min(440px, 100%);
  aspect-ratio: 9 / 16;
}

.media-lightbox-dialog.photo .media-lightbox-body img {
  width: auto;
}

.dashboard-answer-dialog {
  width: min(1240px, calc(100vw - 28px));
  max-width: none;
  max-height: min(840px, calc(100dvh - 28px));
  overflow: auto;
  padding: 0;
  border: 4px solid #08090d;
  border-radius: 10px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 12px 12px 0 #08090d;
}

.dashboard-answer-dialog::backdrop {
  background: rgba(8, 9, 13, 0.68);
  backdrop-filter: blur(7px);
}

.dashboard-answer-dialog.is-report {
  width: min(1180px, calc(100vw - 96px));
  height: calc(100dvh - 36px);
  max-height: calc(100dvh - 36px);
  border-radius: 8px;
  box-shadow: 8px 8px 0 #08090d;
}

.dashboard-answer-dialog.is-mission-report {
  width: min(1180px, calc(100vw - 36px));
}

.dashboard-answer-modal {
  display: grid;
  grid-template-rows: auto auto auto auto auto;
  max-height: none;
  overflow: visible;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.24), transparent 32%),
    linear-gradient(32deg, rgba(103, 213, 232, 0.18), transparent 68%),
    #fff7ed;
}

.dashboard-answer-dialog.is-research-answer {
  width: min(1320px, calc(100vw - 36px));
  max-height: calc(100dvh - 36px);
}

.dashboard-answer-dialog.is-brain-answer {
  width: min(1280px, calc(100vw - 36px));
  max-height: calc(100dvh - 36px);
}

.dashboard-answer-dialog.is-research-answer .dashboard-answer-modal {
  grid-template-rows: auto auto auto auto;
}

.dashboard-answer-dialog.is-brain-answer .dashboard-answer-modal {
  grid-template-rows: auto auto auto;
}

.dashboard-answer-dialog.is-research-answer .dashboard-answer-context {
  display: none;
}

.dashboard-answer-dialog.is-brain-answer .dashboard-answer-context {
  display: none;
}

.dashboard-answer-dialog.is-research-answer .dashboard-answer-recommendations {
  display: none;
}

.dashboard-answer-dialog.is-brain-answer .dashboard-answer-recommendations {
  display: none;
}

.dashboard-answer-dialog.is-research-answer .dashboard-answer-question {
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
}

.dashboard-answer-dialog.is-research-answer .dashboard-answer-question strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-answer-dialog.is-brain-answer .dashboard-answer-question {
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  padding: 10px 16px;
}

.dashboard-answer-dialog.is-brain-answer .dashboard-answer-question strong {
  display: -webkit-box;
  overflow: hidden;
  font-size: 13px;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal {
  height: 100%;
  max-height: none;
  grid-template-rows: auto auto auto minmax(0, 1fr);
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal > header {
  padding: 10px 14px;
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal h2 {
  font-size: clamp(18px, 1.8vw, 24px);
}

.dashboard-answer-dialog.is-report .dashboard-answer-question {
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
}

.dashboard-answer-dialog.is-report .dashboard-answer-question strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-answer-dialog.is-report .dashboard-answer-context {
  display: none;
}

.dashboard-answer-dialog.is-report .dashboard-answer-body {
  min-height: 0;
  padding: 14px;
  overflow: auto;
}

.dashboard-answer-dialog.is-report .dashboard-answer-recommendations {
  display: none;
}

.dashboard-answer-modal > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 4px solid #08090d;
  background: #f8eedb;
}

.dashboard-answer-modal h2,
.dashboard-answer-modal p,
.dashboard-answer-question strong,
.dashboard-answer-question span {
  margin: 0;
  color: #08090d;
}

.dashboard-answer-modal h2 {
  font-size: clamp(19px, 2vw, 28px);
  line-height: 1;
}

.dashboard-answer-modal p {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 900;
}

.dashboard-answer-question {
  display: grid;
  gap: 5px;
  padding: 12px 16px;
  border-bottom: 3px solid #08090d;
  background: #ffffff;
}

.dashboard-answer-question span {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.dashboard-answer-question strong {
  font-size: 16px;
  line-height: 1.25;
}

.dashboard-answer-context {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 3px solid #08090d;
  background: #fff7ed;
}

.dashboard-answer-context article {
  --card-accent: #67d5e8;
  --card-soft: rgba(103, 213, 232, 0.20);
  display: grid;
  grid-template-rows: auto auto auto 28px;
  gap: 5px;
  min-width: 0;
  min-height: 126px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, var(--card-soft), transparent 55%),
    #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-answer-context article[data-tone="project"] {
  --card-accent: #67d5e8;
  --card-soft: rgba(103, 213, 232, 0.24);
}

.dashboard-answer-context article[data-tone="campaign"] {
  --card-accent: #dfff3f;
  --card-soft: rgba(223, 255, 63, 0.28);
}

.dashboard-answer-context article[data-tone="performance"] {
  --card-accent: #6ee7b7;
  --card-soft: rgba(110, 231, 183, 0.24);
}

.dashboard-answer-context article[data-tone="warning"] {
  --card-accent: #ffb703;
  --card-soft: rgba(255, 183, 3, 0.24);
}

.dashboard-answer-context article[data-tone="risk"] {
  --card-accent: #ff7a90;
  --card-soft: rgba(255, 122, 144, 0.22);
}

.dashboard-answer-context article[data-tone="cost"] {
  --card-accent: #c4b5fd;
  --card-soft: rgba(196, 181, 253, 0.24);
}

.dashboard-answer-context span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}

.dashboard-answer-context strong {
  overflow: hidden;
  color: #08090d;
  font-size: 15px;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-answer-context small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.25;
}

.dashboard-answer-card-chart {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  align-items: end;
  gap: 8px;
  min-height: 28px;
}

.dashboard-answer-card-chart b {
  position: relative;
  display: block;
  height: 9px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: rgba(8, 9, 13, 0.08);
}

.dashboard-answer-card-chart b::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--metric-progress);
  background: var(--card-accent);
}

.dashboard-answer-card-chart em {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-items: end;
  gap: 2px;
  height: 28px;
  margin: 0;
}

.dashboard-answer-card-chart i {
  display: block;
  min-height: 4px;
  border: 1px solid #08090d;
  border-radius: 3px 3px 0 0;
  background: var(--card-accent);
}

.dashboard-answer-body {
  min-height: 0;
  overflow: visible;
  padding: 16px;
  background: #fffaf0;
  color: #08090d;
}

.dashboard-answer-dialog.is-research-answer .dashboard-answer-body .agent-reply,
.dashboard-answer-dialog.is-research-answer .dashboard-answer-body p,
.dashboard-answer-dialog.is-research-answer .dashboard-answer-body .ploxy-research-brief {
  max-width: none;
}

.dashboard-answer-dialog.is-brain-answer .dashboard-answer-body {
  padding: 14px 16px 16px;
}

.dashboard-brain-panel {
  display: grid;
  gap: 12px;
}

.dashboard-brain-hero {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.24), transparent 52%),
    linear-gradient(30deg, rgba(223, 255, 63, 0.18), transparent 72%),
    #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-brain-hero > span {
  width: max-content;
  max-width: 100%;
  padding: 4px 8px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 1px 1px 0 #08090d;
  font-size: 9px;
  font-weight: 950;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.dashboard-brain-hero > strong {
  color: #08090d;
  font-size: clamp(22px, 2.5vw, 30px);
  line-height: 1;
}

.dashboard-brain-hero > p {
  max-width: 82ch;
  margin: 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
}

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

.dashboard-brain-card {
  --brain-accent: #67d5e8;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--brain-accent) 18%, transparent), transparent 58%),
    #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
}

.dashboard-brain-card[data-tone="summary"] {
  --brain-accent: #dfff3f;
}

.dashboard-brain-card[data-tone="policy"] {
  --brain-accent: #ff7a90;
}

.dashboard-brain-card[data-tone="guardrail"] {
  --brain-accent: #ffb703;
}

.dashboard-brain-card[data-tone="memory"] {
  --brain-accent: #67d5e8;
}

.dashboard-brain-card[data-tone="state"] {
  --brain-accent: #6ee7b7;
}

.dashboard-brain-card[data-tone="permissions"] {
  --brain-accent: #c4b5fd;
}

.dashboard-brain-card[data-tone="knowledge"],
.dashboard-brain-card[data-tone="evidence"] {
  --brain-accent: #67d5e8;
}

.dashboard-brain-card[data-tone="next"] {
  --brain-accent: #dfff3f;
}

.dashboard-brain-card > span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.dashboard-brain-card > strong {
  color: #08090d;
  font-size: 16px;
  line-height: 1.15;
}

.dashboard-brain-card > p {
  margin: 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 12px;
  font-weight: 850;
  line-height: 1.32;
}

.dashboard-brain-card ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding-left: 18px;
}

.dashboard-brain-card li {
  color: rgba(8, 9, 13, 0.82);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.32;
  overflow-wrap: anywhere;
}

.dashboard-brain-toolbar {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 2px 2px 0 #08090d;
}

.dashboard-brain-toolbar .dashboard-answer-rec-header {
  justify-content: flex-start;
}

.dashboard-brain-toolbar .ploxy-brain-controls {
  justify-content: flex-end;
}

.dashboard-answer-body .agent-reply,
.dashboard-answer-body p {
  max-width: 78ch;
  margin: 0;
  color: #08090d;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.45;
}

.dashboard-answer-body ul {
  margin: 10px 0 0;
  padding-left: 18px;
}

.dashboard-answer-body li {
  margin: 5px 0;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
}

.dashboard-performance-report {
  display: grid;
  gap: 12px;
  color: #08090d;
}

.dashboard-report-hero {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.32), transparent 42%),
    linear-gradient(45deg, rgba(103, 213, 232, 0.24), transparent 70%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

.dashboard-report-hero span,
.dashboard-report-section header span,
.dashboard-report-metric span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
}

.dashboard-report-hero h3 {
  margin: 4px 0;
  color: #08090d;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 0.96;
}

.dashboard-report-hero p {
  margin: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 12px;
  font-weight: 900;
}

.dashboard-report-score {
  display: grid;
  place-items: center;
  min-width: 116px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 9px;
  background: #dfff3f;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-report-score strong {
  color: #08090d;
  font-size: 42px;
  line-height: 0.9;
}

.dashboard-report-score small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
}

.mission-proof-report {
  gap: 10px;
}

.mission-proof-report .mission-report-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
}

.mission-proof-report .mission-report-hero h3 {
  max-width: 62ch;
  margin: 3px 0;
  font-size: clamp(17px, 1.55vw, 22px);
  line-height: 1.12;
}

.mission-proof-report .mission-report-hero p {
  font-size: 11px;
}

.mission-proof-report .mission-report-score {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 128px;
  min-height: 36px;
  padding: 6px 9px;
  border-width: 2px;
  border-radius: 999px;
  box-shadow: 2px 2px 0 #08090d;
}

.mission-proof-report .mission-report-score strong {
  font-size: 16px;
  line-height: 1;
}

.mission-proof-report .mission-report-score small {
  font-size: 9px;
  line-height: 1;
}

.automation-command-report .automation-report-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
}

.automation-command-report .automation-report-hero h3 {
  max-width: 56ch;
  margin: 3px 0;
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1.1;
}

.automation-command-report .automation-report-hero p {
  font-size: 11px;
}

.automation-command-report .automation-report-score {
  min-width: 112px;
  padding: 8px 10px;
  border-width: 2px;
  border-radius: 8px;
  box-shadow: 2px 2px 0 #08090d;
}

.automation-command-report .automation-report-score strong {
  font-size: 24px;
  line-height: 1;
}

.automation-command-report .automation-report-score small {
  font-size: 9px;
  line-height: 1;
}

.campaign-command-report .campaign-report-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
}

.campaign-command-report .campaign-report-hero h3 {
  max-width: 56ch;
  margin: 3px 0;
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1.1;
}

.campaign-command-report .campaign-report-hero p {
  font-size: 11px;
}

.campaign-command-report .campaign-report-score {
  min-width: 112px;
  padding: 8px 10px;
  border-width: 2px;
  border-radius: 8px;
  background: #67d5e8;
  box-shadow: 2px 2px 0 #08090d;
}

.campaign-command-report .campaign-report-score strong {
  font-size: 24px;
  line-height: 1;
}

.campaign-command-report .campaign-report-score small {
  font-size: 9px;
  line-height: 1;
}

.campaign-command-report .dashboard-report-section {
  gap: 8px;
  padding: 10px;
}

.campaign-command-report .dashboard-report-rows {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.campaign-command-report .dashboard-report-metric {
  min-height: 86px;
  align-content: start;
}

.campaign-command-report .dashboard-report-metric strong {
  display: -webkit-box;
  overflow: hidden;
  font-size: 16px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.campaign-command-report .dashboard-report-metric small {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.campaign-command-report .dashboard-report-summary .dashboard-report-metric {
  min-height: 94px;
}

.campaign-command-report .dashboard-report-summary .dashboard-report-metric strong {
  -webkit-line-clamp: 2;
}

.queue-command-report .queue-report-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
}

.queue-command-report .queue-report-hero h3 {
  max-width: 56ch;
  margin: 3px 0;
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1.1;
}

.queue-command-report .queue-report-hero p {
  font-size: 11px;
}

.queue-command-report .queue-report-score {
  min-width: 112px;
  padding: 8px 10px;
  border-width: 2px;
  border-radius: 8px;
  background: #dfff3f;
  box-shadow: 2px 2px 0 #08090d;
}

.queue-command-report .queue-report-score strong {
  font-size: 24px;
  line-height: 1;
}

.queue-command-report .queue-report-score small {
  font-size: 9px;
  line-height: 1;
}

.queue-command-report .dashboard-report-section {
  gap: 8px;
  padding: 10px;
}

.queue-command-report .dashboard-report-rows {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.queue-command-report .dashboard-report-metric {
  min-height: 86px;
  align-content: start;
}

.queue-command-report .dashboard-report-metric strong {
  display: -webkit-box;
  overflow: hidden;
  font-size: 16px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.queue-command-report .dashboard-report-metric small {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.queue-command-report .dashboard-report-summary .dashboard-report-metric {
  min-height: 94px;
}

.dashboard-report-summary,
.dashboard-report-rows {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.dashboard-report-narrative {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 10px;
}

.dashboard-report-insight {
  --report-accent: #67d5e8;
  display: grid;
  gap: 8px;
  min-height: 142px;
  padding: 13px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--report-accent) 30%, transparent), transparent 60%),
    #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-report-insight[data-tone="campaign"] {
  --report-accent: #dfff3f;
}

.dashboard-report-insight[data-tone="performance"] {
  --report-accent: #6ee7b7;
}

.dashboard-report-insight[data-tone="warning"] {
  --report-accent: #ffb703;
}

.dashboard-report-insight[data-tone="risk"] {
  --report-accent: #ff7a90;
}

.dashboard-report-insight span,
.dashboard-report-action-plan header span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
}

.dashboard-report-insight p {
  margin: 0;
  color: #08090d;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.36;
}

.dashboard-report-section {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-report-section header {
  display: grid;
  gap: 4px;
}

.dashboard-report-section header p {
  margin: 0;
  color: rgba(8, 9, 13, 0.78);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
}

.dashboard-report-metric {
  --report-accent: #67d5e8;
  display: grid;
  gap: 4px;
  min-height: 96px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--report-accent) 24%, transparent), transparent 58%),
    #fffaf0;
}

.dashboard-report-metric[data-tone="campaign"] {
  --report-accent: #dfff3f;
}

.dashboard-report-metric[data-tone="performance"] {
  --report-accent: #6ee7b7;
}

.dashboard-report-metric[data-tone="warning"] {
  --report-accent: #ffb703;
}

.dashboard-report-metric[data-tone="risk"] {
  --report-accent: #ff7a90;
}

.dashboard-report-metric[data-tone="cost"] {
  --report-accent: #c4b5fd;
}

.dashboard-report-metric strong {
  overflow-wrap: anywhere;
  color: #08090d;
  font-size: 18px;
  line-height: 1.08;
}

.dashboard-report-metric small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.28;
}

.dashboard-report-action-plan {
  display: grid;
  gap: 10px;
  padding: 13px;
  border: 3px solid #08090d;
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.28), transparent 52%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

.dashboard-report-action-plan header {
  display: grid;
  gap: 4px;
}

.dashboard-report-action-plan header p {
  margin: 0;
  color: #08090d;
  font-size: 16px;
  font-weight: 950;
  line-height: 1.18;
}

.dashboard-report-action-plan ol {
  display: grid;
  gap: 8px;
  margin: 0;
  padding-left: 22px;
}

.dashboard-report-action-plan li {
  padding: 9px 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.32;
}

.dashboard-answer-loading {
  display: grid;
  gap: 8px;
  align-content: center;
  min-height: 170px;
}

.dashboard-answer-loading span {
  width: 52px;
  height: 10px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: linear-gradient(90deg, #dfff3f 0 35%, #67d5e8 35% 70%, #ff8a65 70%);
  box-shadow: 2px 2px 0 #08090d;
  animation: dashboardAnswerPulse 0.8s ease-in-out infinite alternate;
}

.dashboard-answer-loading strong {
  color: #08090d;
  font-size: 18px;
  line-height: 1.1;
}

/* Polxy report polish: lighter report shell, calmer type, less boxed-in framing. */
.dashboard-answer-dialog.is-report {
  width: min(1280px, calc(100vw - 42px));
  height: calc(100dvh - 26px);
  max-height: calc(100dvh - 26px);
  border: 1px solid rgba(8, 9, 13, 0.24);
  border-radius: 12px;
  background: #fbf4e7;
  box-shadow: 0 22px 70px rgba(8, 9, 13, 0.34);
}

.dashboard-answer-dialog.is-report::backdrop {
  background: rgba(8, 9, 13, 0.54);
  backdrop-filter: blur(9px);
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal {
  background:
    linear-gradient(180deg, rgba(255, 250, 240, 0.98), rgba(248, 238, 219, 0.98));
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal > header {
  padding: 12px 16px;
  border-bottom: 1px solid rgba(8, 9, 13, 0.18);
  background: rgba(255, 250, 240, 0.96);
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal h2 {
  font-size: clamp(17px, 1.45vw, 22px);
  font-weight: 850;
  letter-spacing: 0;
}

.dashboard-answer-dialog.is-report .dashboard-answer-modal p {
  color: rgba(8, 9, 13, 0.58);
  font-size: 10px;
  font-weight: 750;
}

.dashboard-answer-dialog.is-report .icon-button {
  border-width: 1px;
  box-shadow: none;
}

.dashboard-answer-dialog.is-report .dashboard-answer-question {
  padding: 9px 16px;
  border-bottom: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(255, 255, 255, 0.78);
}

.dashboard-answer-dialog.is-report .dashboard-answer-question span {
  color: rgba(8, 9, 13, 0.52);
  font-size: 9px;
  font-weight: 850;
}

.dashboard-answer-dialog.is-report .dashboard-answer-question strong {
  color: rgba(8, 9, 13, 0.82);
  font-size: 12px;
  font-weight: 750;
}

.dashboard-answer-dialog.is-report .dashboard-answer-body {
  padding: 18px 22px 24px;
  background: #fbf4e7;
}

.dashboard-answer-dialog.is-report .dashboard-performance-report {
  gap: 11px;
  max-width: 1160px;
  margin: 0 auto;
}

.dashboard-answer-dialog.is-report .dashboard-report-hero {
  border: 1px solid rgba(8, 9, 13, 0.20);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.20), transparent 48%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.08);
}

.dashboard-answer-dialog.is-report .dashboard-report-hero span,
.dashboard-answer-dialog.is-report .dashboard-report-section header span,
.dashboard-answer-dialog.is-report .dashboard-report-metric span,
.dashboard-answer-dialog.is-report .dashboard-report-insight span,
.dashboard-answer-dialog.is-report .dashboard-report-action-plan header span {
  color: rgba(8, 9, 13, 0.50);
  font-size: 9px;
  font-weight: 850;
}

.dashboard-answer-dialog.is-report .dashboard-report-hero h3 {
  color: #08090d;
  font-weight: 850;
  letter-spacing: 0;
}

.dashboard-answer-dialog.is-report .dashboard-report-hero p,
.dashboard-answer-dialog.is-report .dashboard-report-section header p,
.dashboard-answer-dialog.is-report .dashboard-report-metric small,
.dashboard-answer-dialog.is-report .dashboard-report-insight p {
  color: rgba(8, 9, 13, 0.66);
  font-weight: 650;
}

.dashboard-answer-dialog.is-report .dashboard-report-score {
  border: 1px solid rgba(8, 9, 13, 0.24);
  box-shadow: none;
}

.dashboard-answer-dialog.is-report .dashboard-report-summary,
.dashboard-answer-dialog.is-report .dashboard-report-rows {
  gap: 8px;
}

.dashboard-answer-dialog.is-report .dashboard-report-narrative {
  gap: 8px;
}

.dashboard-answer-dialog.is-report .dashboard-report-section,
.dashboard-answer-dialog.is-report .dashboard-report-insight,
.dashboard-answer-dialog.is-report .dashboard-report-action-plan {
  border: 1px solid rgba(8, 9, 13, 0.18);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-report .dashboard-report-section {
  padding: 11px;
}

.dashboard-answer-dialog.is-report .dashboard-report-insight {
  min-height: 118px;
  padding: 12px;
}

.dashboard-answer-dialog.is-report .dashboard-report-metric {
  min-height: 82px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--report-accent) 18%, transparent), transparent 62%),
    #fffaf0;
}

.dashboard-answer-dialog.is-report .dashboard-report-metric strong {
  color: #08090d;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.12;
}

.dashboard-answer-dialog.is-report .dashboard-report-metric small {
  font-size: 10.5px;
  line-height: 1.3;
}

.dashboard-answer-dialog.is-report .dashboard-report-action-plan {
  padding: 12px;
}

.dashboard-answer-dialog.is-report .dashboard-report-action-plan header p {
  font-size: 14px;
  font-weight: 850;
}

.dashboard-answer-dialog.is-report .dashboard-report-action-plan li {
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 7px;
  background: #fffaf0;
  font-size: 12px;
  font-weight: 650;
}

.dashboard-answer-loading small {
  color: rgba(8, 9, 13, 0.7);
  font-size: 12px;
  font-weight: 850;
}

.dashboard-agentic-result {
  display: grid;
  gap: 12px;
}

.dashboard-agentic-result:not(.is-loading) .dashboard-agentic-process {
  display: none;
}

.dashboard-agentic-process {
  display: grid;
  grid-template-columns: minmax(138px, 0.34fr) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.28), transparent 42%),
    linear-gradient(40deg, rgba(103, 213, 232, 0.24), transparent 72%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

.dashboard-agentic-core {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 158px;
  overflow: hidden;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(rgba(255, 255, 255, 0.13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.13) 1px, transparent 1px),
    linear-gradient(135deg, #111827, #052e38 52%, #111827);
  background-size: 18px 18px, 18px 18px, auto;
  box-shadow: inset 0 0 0 2px rgba(223, 255, 63, 0.20);
}

.dashboard-agentic-core::before,
.dashboard-agentic-core::after {
  content: "";
  position: absolute;
  border: 2px solid #08090d;
  border-radius: 6px;
  background: #dfff3f;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-agentic-core::before {
  width: 72px;
  height: 46px;
  animation: agenticProcessorLift 1.2s ease-in-out infinite alternate;
}

.dashboard-agentic-core::after {
  width: 14px;
  height: 14px;
  transform: translate(38px, -26px);
  background: #67d5e8;
  animation: agenticProcessorBlink 0.7s steps(2, end) infinite;
}

.dashboard-agentic-core .process-ring {
  position: absolute;
  display: block;
  border: 2px solid rgba(223, 255, 63, 0.94);
  border-radius: 8px;
  box-shadow: 0 0 0 2px rgba(8, 9, 13, 0.34);
}

.dashboard-agentic-core .ring-a {
  width: 112px;
  height: 72px;
  animation: agenticProcessorScan 2.8s linear infinite;
}

.dashboard-agentic-core .ring-b {
  width: 132px;
  height: 94px;
  border-color: rgba(103, 213, 232, 0.90);
  animation: agenticProcessorScan 3.4s linear infinite reverse;
}

.dashboard-agentic-core .process-scan {
  position: absolute;
  inset: 12px auto 12px 18px;
  width: 10px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #67d5e8;
  box-shadow: 2px 2px 0 #08090d;
  animation: agenticProcessorSweep 1.1s ease-in-out infinite alternate;
}

.dashboard-agentic-core b,
.dashboard-agentic-core i,
.dashboard-agentic-core em {
  position: absolute;
  display: block;
  width: 9px;
  height: 9px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
  animation: agenticSignalStep 1s ease-in-out infinite;
}

.dashboard-agentic-core b {
  transform: translate(-48px, -40px);
}

.dashboard-agentic-core i {
  transform: translate(-8px, 52px);
  background: #ffb703;
  animation-delay: 0.18s;
}

.dashboard-agentic-core em {
  transform: translate(54px, 32px);
  background: #6ee7b7;
  animation-delay: 0.36s;
}

.dashboard-agentic-process-copy {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
}

.dashboard-agentic-process-copy > span {
  width: max-content;
  max-width: 100%;
  padding: 5px 8px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #67d5e8;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 9px;
  font-weight: 950;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.dashboard-agentic-process-copy h3 {
  margin: 0;
  color: #08090d;
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1;
}

.dashboard-agentic-process-copy p {
  max-width: 68ch;
  margin: 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.35;
}

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

.dashboard-agentic-steps article {
  display: grid;
  grid-template-rows: 22px auto minmax(34px, 1fr);
  gap: 5px;
  min-height: 118px;
  padding: 9px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
}

.dashboard-agentic-steps article[data-state="current"] {
  background: #dfff3f;
  animation: agenticStepPulse 0.9s ease-in-out infinite alternate;
}

.dashboard-agentic-steps article[data-state="done"] {
  background: #6ee7b7;
}

.dashboard-agentic-steps article[data-state="blocked"] {
  background: #ffb703;
}

.dashboard-agentic-steps article[data-state="pending"] {
  background: rgba(255, 255, 255, 0.78);
}

.dashboard-agentic-steps article > span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #ffffff;
  color: #08090d;
  box-shadow: 1px 1px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
}

.dashboard-agentic-steps strong {
  overflow-wrap: anywhere;
  color: #08090d;
  font-size: 12px;
  line-height: 1.08;
}

.dashboard-agentic-steps small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 820;
  line-height: 1.24;
}

.dashboard-agentic-reply {
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-agentic-loading {
  min-height: 64px;
  padding: 11px 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 2px 2px 0 #08090d;
}

.dashboard-agentic-action-panel {
  display: grid;
  gap: 9px;
}

.dashboard-agentic-action-header span {
  background: #67d5e8;
}

.dashboard-agentic-action-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-recommendations .dashboard-agentic-action-card {
  --action-accent: #67d5e8;
  display: grid;
  grid-template-rows: auto minmax(48px, 1fr) minmax(0, auto) auto;
  gap: 8px;
  min-height: 186px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--action-accent) 26%, transparent), transparent 58%),
    #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-agentic-action-card[data-tone="safe"] {
  --action-accent: #6ee7b7;
}

.dashboard-agentic-action-card[data-tone="risk"] {
  --action-accent: #ff7a90;
}

.dashboard-agentic-action-card[data-tone="draft"] {
  --action-accent: #67d5e8;
}

.dashboard-agentic-action-card[data-tone="plan"] {
  --action-accent: #dfff3f;
}

.dashboard-agentic-action-card[data-tone="setup"] {
  --action-accent: #ffb703;
}

.dashboard-agentic-action-card[data-tone="proof"] {
  --action-accent: #c4b5fd;
}

.dashboard-agentic-action-card header {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.dashboard-agentic-action-card header span {
  width: max-content;
  max-width: 100%;
  padding: 4px 7px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: var(--action-accent);
  color: #08090d;
  box-shadow: 1px 1px 0 #08090d;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard-answer-recommendations .dashboard-agentic-action-card strong {
  display: -webkit-box;
  overflow: hidden;
  color: #08090d;
  font-size: 14px;
  line-height: 1.1;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.dashboard-agentic-action-card p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: rgba(8, 9, 13, 0.72);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.28;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.ploxy-action-result {
  display: grid;
  gap: 6px;
  min-height: 0;
  padding: 7px;
  overflow: hidden;
  border: 2px solid rgba(8, 9, 13, 0.86);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.76);
  color: #08090d;
}

.ploxy-action-result:empty {
  display: none;
}

.ploxy-action-result[data-state="completed"] {
  background: color-mix(in srgb, #6ee7b7 34%, #ffffff);
}

.ploxy-action-result[data-state="pending"] {
  background: color-mix(in srgb, #ffb703 28%, #ffffff);
}

.ploxy-action-result[data-state="refused"],
.ploxy-action-result[data-state="blocked"] {
  background: color-mix(in srgb, #ff7a90 26%, #ffffff);
}

.dashboard-answer-recommendations .ploxy-action-result strong {
  display: block;
  overflow: hidden;
  font-size: 10px;
  line-height: 1.22;
  text-overflow: ellipsis;
  white-space: nowrap;
  -webkit-line-clamp: initial;
}

.ploxy-action-result dl {
  display: grid;
  gap: 4px;
  margin: 0;
}

.ploxy-action-result dl div {
  display: grid;
  grid-template-columns: minmax(54px, max-content) minmax(0, 1fr);
  gap: 7px;
  align-items: baseline;
}

.ploxy-action-result dt,
.ploxy-action-result dd {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 9px;
  font-weight: 950;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ploxy-action-result dt {
  color: rgba(8, 9, 13, 0.62);
  text-transform: uppercase;
}

.ploxy-action-result dd {
  color: #08090d;
}

.ploxy-action-followups {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.dashboard-agentic-action-card .ploxy-action-followups button {
  min-height: 26px;
  padding: 5px 7px;
  background: #ffffff;
  box-shadow: 1px 1px 0 #08090d;
  font-size: 9px;
}

.dashboard-agentic-action-card footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  align-self: end;
}

.dashboard-agentic-action-card small {
  overflow: hidden;
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 950;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.dashboard-agentic-action-card button {
  min-height: 34px;
  padding: 8px 10px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: var(--action-accent);
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  cursor: pointer;
}

.dashboard-agentic-action-card button:hover,
.dashboard-agentic-action-card button:focus-visible {
  transform: translate(-1px, -1px);
  box-shadow: 3px 3px 0 #08090d;
}

.dashboard-agentic-action-card button:disabled {
  cursor: wait;
  filter: saturate(0.6);
  opacity: 0.72;
  transform: none;
}

@keyframes dashboardAnswerPulse {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(10px);
  }
}

@keyframes agenticProcessorLift {
  from {
    transform: translateY(4px);
  }

  to {
    transform: translateY(-5px);
  }
}

@keyframes agenticProcessorBlink {
  0%,
  50% {
    opacity: 1;
  }

  51%,
  100% {
    opacity: 0.38;
  }
}

@keyframes agenticProcessorScan {
  from {
    transform: rotate(0deg) scale(0.96);
  }

  to {
    transform: rotate(360deg) scale(1.04);
  }
}

@keyframes agenticProcessorSweep {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(112px);
  }
}

@keyframes agenticSignalStep {
  0%,
  100% {
    opacity: 0.45;
  }

  45%,
  65% {
    opacity: 1;
  }
}

@keyframes agenticStepPulse {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-agentic-core::before,
  .dashboard-agentic-core::after,
  .dashboard-agentic-core .process-ring,
  .dashboard-agentic-core .process-scan,
  .dashboard-agentic-core b,
  .dashboard-agentic-core i,
  .dashboard-agentic-core em,
  .dashboard-agentic-steps article[data-state="current"] {
    animation: none;
  }
}

@media (max-width: 980px) {
  .dashboard-agentic-process {
    grid-template-columns: 1fr;
  }

  .dashboard-agentic-core {
    min-height: 118px;
  }

  .dashboard-agentic-core .process-scan {
    inset-block: 10px;
  }

  .dashboard-agentic-steps,
  .dashboard-agentic-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

@media (max-width: 620px) {
  .dashboard-agentic-steps,
  .dashboard-agentic-action-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-agentic-steps article,
  .dashboard-answer-recommendations .dashboard-agentic-action-card {
    min-height: 0;
  }

  .dashboard-brain-toolbar .ploxy-brain-controls {
    justify-content: flex-start;
  }
}

.dashboard-answer-recommendations {
  display: grid;
  gap: 8px;
  max-height: none;
  overflow: visible;
  padding: 12px 16px 16px;
  border-top: 3px solid #08090d;
  background: #f8eedb;
}

.dashboard-answer-recommendations:empty {
  display: none;
}

.dashboard-answer-recommendations article {
  display: grid;
  gap: 3px;
  padding: 9px 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

.dashboard-answer-rec-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #08090d;
}

.dashboard-answer-rec-header span {
  padding: 5px 8px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  box-shadow: 2px 2px 0 #08090d;
}

.dashboard-answer-rec-header strong {
  font-size: 14px;
  line-height: 1.1;
}

.dashboard-answer-recommendations span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}

.dashboard-answer-recommendations strong {
  color: #08090d;
  font-size: 13px;
  line-height: 1.2;
}

.creative-board-modal {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  max-height: calc(100dvh - 40px);
  background:
    linear-gradient(115deg, rgba(223, 255, 63, 0.26), transparent 38%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.24), transparent 62%),
    #fff7ed;
}

.creative-board-modal > header {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border-bottom: 4px solid #08090d;
  background: rgba(255, 247, 237, 0.96);
}

.creative-board-modal h2,
.creative-board-modal p {
  margin: 0;
  color: #08090d;
}

.creative-board-modal h2 {
  font-size: 24px;
  line-height: 1;
}

.creative-board-modal p {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 800;
}

.creative-board-masonry {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(236px, 1fr));
  gap: 14px;
  min-height: 420px;
  padding: 16px;
  overflow-x: hidden;
  overflow-y: auto;
}

.creative-board-card {
  display: grid;
  grid-template-rows: 170px auto auto;
  align-items: stretch;
  gap: 8px;
  margin: 0;
  min-height: 334px;
  padding: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  box-shadow: 5px 5px 0 #08090d;
  cursor: pointer;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.creative-board-card:hover,
.creative-board-card.selected {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0 #08090d;
}

.creative-board-card.selected {
  outline: 4px solid #67d5e8;
  outline-offset: 3px;
}

.board-card-preview {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 170px;
  max-height: 170px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #08090d;
}

.creative-board-card.text .board-card-preview {
  min-height: 170px;
  aspect-ratio: 1 / 1;
}

.creative-board-card.video .board-card-preview {
  min-height: 170px;
  aspect-ratio: 1 / 1;
}

.board-card-preview img,
.board-card-preview video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
}

.board-card-preview .media-text-preview {
  width: 100%;
  height: 100%;
}

.board-card-preview > span {
  position: absolute;
  top: 7px;
  left: 7px;
  padding: 3px 7px;
  border: 2px solid #08090d;
  border-radius: 6px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 8px;
  font-weight: 950;
  text-transform: uppercase;
}

.board-card-copy {
  display: grid;
  gap: 4px;
  min-height: 0;
}

.board-card-copy strong,
.board-card-copy p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: #08090d;
  -webkit-box-orient: vertical;
}

.board-card-copy strong {
  font-size: 13px;
  line-height: 1.08;
  -webkit-line-clamp: 2;
}

.board-card-copy p {
  font-size: 10px;
  font-weight: 760;
  line-height: 1.22;
  -webkit-line-clamp: 3;
}

.creative-board-card footer {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: space-between;
  align-self: end;
  min-width: 0;
}

@media (max-width: 720px) {
  .creative-board-card {
    grid-template-rows: 152px auto auto;
  }

  .board-card-preview,
  .creative-board-card.text .board-card-preview,
  .creative-board-card.video .board-card-preview {
    min-height: 152px;
    max-height: 152px;
  }
}

.creative-board-card footer span {
  min-width: 0;
  padding: 3px 7px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 8px;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creative-board-card footer span:nth-child(2) {
  background: #67d5e8;
}

.creative-board-delete {
  margin-left: auto;
  padding: 3px 7px;
  border: 2px solid rgba(8, 9, 13, 0.72);
  border-radius: 999px;
  background: rgba(255, 247, 237, 0.62);
  color: rgba(8, 9, 13, 0.66);
  box-shadow: none;
  font-size: 8px;
  font-weight: 950;
  text-transform: uppercase;
  cursor: pointer;
}

.creative-board-delete:hover,
.creative-board-delete:focus-visible {
  background: #ff6b6b;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
}

.creative-board-delete:disabled {
  cursor: wait;
  opacity: 0.62;
}

.creative-board-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  min-height: 320px;
  padding: 24px;
  border: 3px dashed #08090d;
  border-radius: 10px;
  background: rgba(255, 247, 237, 0.72);
  text-align: center;
}

/* Creative Studio absolute final card fit: keep every action button inside every card type. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(248px, 282px) !important;
  min-height: 386px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.video,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 112px 44px 22px 18px 76px !important;
  min-height: 366px !important;
  max-height: 366px !important;
  gap: 5px !important;
  padding: 9px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 112px 44px 22px 18px 76px auto !important;
  min-height: 540px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-preview {
  height: 112px !important;
  min-height: 112px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  min-height: 15px !important;
  max-height: 17px !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  -webkit-line-clamp: 1 !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  max-height: 24px !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-meta,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card footer {
  min-height: 18px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(3, 21px) !important;
  gap: 4px !important;
  justify-self: center !important;
  width: calc(100% - 18px) !important;
  max-width: calc(100% - 18px) !important;
  box-sizing: border-box !important;
  min-height: 71px !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-height: 21px !important;
  height: 21px !important;
  padding: 2px 4px !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
}

body.app-mode {
  height: 100dvh !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell {
  display: grid !important;
  grid-template-columns: 224px minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: 100vw !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell > .sidebar {
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell > .sidebar nav {
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.app-mode > .app-shell > main {
  width: 100% !important;
  max-width: none !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* Help Centre: operational guide for the full Polxy workspace. */
body.app-mode[data-active-view="help"] .help-centre-panel {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 30%),
    linear-gradient(225deg, rgba(103, 213, 232, 0.24), transparent 34%),
    linear-gradient(180deg, rgba(168, 141, 242, 0.12), transparent 46%),
    #fff6e6;
}

body.app-mode[data-active-view="help"] > .app-shell {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="help"] > .app-shell > .sidebar,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-menu-toggle,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-sidebar-scrim {
  display: none !important;
}

body.app-mode[data-active-view="help"] > .app-shell > main {
  padding: clamp(18px, 3vw, 40px) !important;
}

body.app-mode[data-active-view="help"] [data-view-section="help"] {
  max-width: 1480px;
  margin: 0 auto;
}

body.app-mode[data-active-view="help"] .help-centre-panel {
  min-height: calc(100dvh - 80px);
}

.help-hero-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
  gap: 18px;
  align-items: stretch;
  margin: 14px 0 18px;
  padding: 18px;
  border: 4px solid #08090d;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.65), rgba(223, 255, 63, 0.58)),
    #dffbff;
  box-shadow: 7px 7px 0 #08090d;
}

.help-hero-strip strong {
  display: block;
  max-width: 980px;
  color: #08090d;
  font-size: clamp(28px, 4vw, 56px);
  line-height: 0.96;
  font-weight: 1000;
}

.help-hero-strip p {
  max-width: 940px;
  margin: 12px 0 0;
  color: #141414;
  font-size: 15px;
  line-height: 1.45;
  font-weight: 750;
}

.help-hero-checks {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.help-hero-checks span {
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 10px 12px;
  border: 3px solid #08090d;
  background: #08090d;
  color: #f8f4ea;
  font-size: 12px;
  font-weight: 1000;
  text-transform: uppercase;
  box-shadow: 4px 4px 0 rgba(8, 9, 13, 0.32);
}

.help-start-grid,
.help-step-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.help-start-grid {
  margin-bottom: 18px;
}

.help-start-grid article,
.help-step-grid article {
  border: 3px solid #08090d;
  background: #fffaf0;
  padding: 14px;
  box-shadow: 5px 5px 0 #08090d;
}

.help-start-grid article:nth-child(2n),
.help-step-grid article:nth-child(3n + 2) {
  background: #eafcff;
}

.help-start-grid article:nth-child(3n),
.help-step-grid article:nth-child(3n) {
  background: #efffd0;
}

.help-start-grid strong,
.help-step-grid strong {
  display: block;
  color: #08090d;
  font-size: 17px;
  line-height: 1.05;
  font-weight: 1000;
}

.help-start-grid small,
.help-step-grid small {
  display: block;
  margin-top: 8px;
  color: #1e1e1e;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 740;
}

.help-start-grid button {
  width: 100%;
  min-height: 38px;
  margin-top: 12px;
  border: 3px solid #08090d;
  background: #67d5e8;
  color: #08090d;
  font-size: 11px;
  font-weight: 1000;
  text-transform: uppercase;
  box-shadow: 3px 3px 0 #08090d;
  cursor: pointer;
}

.help-layout {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.help-index {
  position: sticky;
  top: 18px;
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 4px solid #08090d;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.62), rgba(223, 255, 63, 0.42)),
    #eefcff;
  box-shadow: 6px 6px 0 rgba(8, 9, 13, 0.28);
}

.help-index button {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 36px;
  padding: 8px 10px;
  border: 3px solid #08090d;
  background: #fffaf0;
  color: #08090d;
  font-size: 11px;
  font-weight: 1000;
  text-align: left;
  text-transform: uppercase;
  box-shadow: 3px 3px 0 #08090d;
  cursor: pointer;
}

.help-index button:nth-child(3n + 1) {
  background: #dffbff;
}

.help-index button:nth-child(3n + 2) {
  background: #dfff3f;
}

.help-index button:nth-child(3n) {
  background: #efe4ff;
}

.help-index button:hover,
.help-index button:focus-visible {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0 #08090d;
}

.help-topic-stack {
  display: grid;
  gap: 14px;
}

.help-topic {
  scroll-margin-top: 18px;
  border: 4px solid #08090d;
  background: rgba(255, 250, 240, 0.92);
  padding: 16px;
  box-shadow: 7px 7px 0 rgba(8, 9, 13, 0.28);
}

.help-topic:nth-child(3n + 1) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 38%),
    #fffaf0;
}

.help-topic:nth-child(3n + 2) {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.22), transparent 38%),
    #fffaf0;
}

.help-topic:nth-child(3n) {
  background:
    linear-gradient(135deg, rgba(168, 141, 242, 0.16), transparent 38%),
    #fffaf0;
}

.help-topic > div:first-child {
  max-width: 980px;
}

.help-topic h3 {
  margin: 2px 0 8px;
  color: #08090d;
  font-size: clamp(24px, 2.5vw, 38px);
  line-height: 1;
  font-weight: 1000;
}

.help-topic p {
  margin: 0 0 14px;
  color: #171717;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 720;
}

.help-topic .help-step-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1180px) {
  .help-hero-strip,
  .help-layout {
    grid-template-columns: 1fr;
  }

  .help-hero-checks {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .help-index {
    position: static;
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .help-start-grid,
  .help-topic .help-step-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .help-hero-strip {
    padding: 14px;
  }

  .help-hero-checks,
  .help-index,
  .help-start-grid,
  .help-topic .help-step-grid {
    grid-template-columns: 1fr;
  }

  .help-topic {
    padding: 13px;
  }
}

@media (max-width: 720px) {
  .image-login-panel {
    width: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode {
    height: auto !important;
    overflow: auto !important;
  }

  body.app-mode > .app-shell {
    height: auto !important;
    min-height: 100dvh !important;
    overflow: visible !important;
  }

  body.app-mode > .app-shell > main {
    height: auto !important;
    overflow: visible !important;
  }
}

/* Desktop auth placement: keep the CTA and form visible above the landing artwork. */
@media (min-width: 821px) {
  .landing-auth-cta {
    position: fixed !important;
    top: clamp(18px, 2.2vw, 34px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 95 !important;
    min-height: 46px !important;
    padding: 0 22px !important;
    background: #dfff3f !important;
    box-shadow: 6px 6px 0 #08090d !important;
    font-size: 13px !important;
  }

  .image-login-panel {
    top: clamp(84px, 9vh, 112px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    width: min(560px, calc(100vw - 56px)) !important;
    max-height: calc(100svh - 126px) !important;
    align-items: start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform: none !important;
  }
}

@media (min-width: 821px) {
  .landing-auth-cta {
    position: fixed !important;
    top: clamp(18px, 2.2vw, 34px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 95 !important;
    min-height: 46px !important;
    padding: 0 22px !important;
    background: #dfff3f !important;
    box-shadow: 6px 6px 0 #08090d !important;
    font-size: 13px !important;
  }

  .image-login-panel {
    top: clamp(84px, 9vh, 112px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    width: min(560px, calc(100vw - 56px)) !important;
    max-height: calc(100svh - 126px) !important;
    align-items: start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform: none !important;
  }
}

/* Mobile optimization layer: public pages, workspace, and admin collapse into one readable column. */
@media (max-width: 820px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }

  .landing-mode {
    overflow-x: hidden !important;
  }

  .image-landing-frame {
    min-height: 100svh !important;
    overflow: hidden !important;
  }

  .image-landing-frame img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .ploxy-ai-agency-frame {
    min-height: 100svh !important;
  }

  .proxy-agent-art-frame img,
  .ploxy-ai-agency-frame img {
    height: 100svh !important;
    object-position: center !important;
  }

  .image-login-panel {
    top: auto !important;
    right: 12px !important;
    bottom: 16px !important;
    left: 12px !important;
    width: auto !important;
    max-width: none !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
    transform: none !important;
  }

  .image-login-panel img {
    width: min(150px, 44vw) !important;
    height: 48px !important;
  }

  .landing-login-form,
  .landing-login-form .form-grid {
    grid-template-columns: 1fr !important;
  }

  .landing-login-form input,
  .landing-contact-form input,
  .landing-contact-form select,
  .landing-contact-form textarea {
    width: 100% !important;
    min-width: 0 !important;
  }

  .landing-login,
  .landing-contact-submit,
  .landing-detail-back,
  .floating-login {
    max-width: 100% !important;
    white-space: normal !important;
  }

  .landing-footer {
    min-height: auto !important;
    padding: 28px 14px 34px !important;
  }

  .landing-footer-intro,
  .landing-footer-signals,
  .landing-footer-links,
  .landing-footer-profile,
  .landing-footer-bottom,
  .landing-detail-rich,
  .landing-detail-main,
  .landing-detail-side,
  .landing-contact-page,
  .landing-contact-routing,
  .landing-contact-flow,
  .landing-contact-assurance,
  .landing-contact-form .form-grid {
    grid-template-columns: 1fr !important;
  }

  .landing-footer-intro,
  .landing-footer-signals article,
  .landing-footer-links > div,
  .landing-detail-main article,
  .landing-detail-side,
  .landing-contact-panel,
  .landing-contact-assurance article {
    border-width: 2px !important;
    border-radius: 8px !important;
    box-shadow: 3px 3px 0 #08090d !important;
  }

  .landing-footer-intro h2,
  .landing-detail-page h2,
  .landing-contact-page h2 {
    max-width: 100% !important;
    font-size: clamp(34px, 12vw, 58px) !important;
    line-height: 0.96 !important;
  }

  .landing-footer-intro p,
  .landing-detail-page > p,
  .landing-contact-copy > p {
    max-width: 100% !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
  }

  .landing-detail-page:target,
  .landing-detail-page.landing-contact-page:target {
    min-height: 100svh !important;
    padding: 18px 14px 32px !important;
    align-content: start !important;
  }

  body.app-mode {
    height: auto !important;
    min-height: 100svh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.app-mode > .app-shell,
  body.app-mode:not(.admin-mode) > .app-shell {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    min-height: 100svh !important;
    height: auto !important;
    overflow: visible !important;
  }

  body.app-mode > .app-shell > .sidebar {
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    padding: 8px !important;
    border-right: 0 !important;
    border-bottom: 4px solid #08090d !important;
    overflow: visible !important;
  }

  body.app-mode > .app-shell > .sidebar .brand {
    width: 92px !important;
    min-width: 92px !important;
    height: 48px !important;
    margin: 0 !important;
  }

  body.app-mode > .app-shell > .sidebar nav {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    padding: 2px 2px 8px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  body.app-mode > .app-shell > .sidebar nav .nav-item {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    min-height: 36px !important;
    padding: 8px 10px !important;
    font-size: 10px !important;
    white-space: nowrap !important;
  }

  body.app-mode > .app-shell > .sidebar .workspace-card {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(72px, auto)) !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 8px !important;
  }

  body.app-mode > .app-shell > .sidebar .workspace-card .eyebrow,
  body.app-mode > .app-shell > .sidebar .workspace-card > span:not(.eyebrow) {
    display: none !important;
  }

  body.app-mode > .app-shell > .sidebar .workspace-card strong {
    min-width: 0 !important;
    overflow: hidden !important;
    font-size: 12px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.app-mode > .app-shell > .sidebar .workspace-card button {
    min-height: 32px !important;
    padding: 6px 8px !important;
    font-size: 10px !important;
  }

  body.app-mode > .app-shell > main {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 12px !important;
    overflow: visible !important;
  }

  .topbar,
  .global-project-console,
  .operator-strip,
  .credit-warning-banner,
  .panel-header,
  .project-command-bar,
  .admin-filter-bar,
  .admin-bulk-bar,
  .report-actions,
  .brand-actions,
  .settings-actions {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .topbar-actions,
  .header-actions,
  .billing-header-actions,
  .credit-warning-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    gap: 8px !important;
  }

  .topbar-actions > *,
  .header-actions > *,
  .billing-header-actions > *,
  .credit-warning-actions > * {
    width: 100% !important;
    min-width: 0 !important;
  }

  .content-grid.view-section.active,
  .status-grid,
  .dashboard-kpi-row,
  .dashboard-secondary,
  .platform-grid,
  .campaign-grid,
  .connection-grid,
  .analytics-grid,
  .billing-grid,
  .subscription-summary,
  .plan-usage-grid,
  .plan-grid,
  .credit-system-panel,
  .credit-system-grid,
  .credit-topup-grid,
  .settings-summary-grid,
  .settings-form .form-grid,
  .settings-toggle-grid,
  .team-access-layout,
  .creative-agent-console,
  .creative-studio-grid,
  .creative-board,
  .creative-library-layout,
  .automation-grid,
  .queue-command-center,
  .reports-grid,
  .brand-form,
  .module-overview-board,
  .module-roadmap,
  .jobs-operation-board,
  .job-summary,
  .ai-routing-board,
  .routing-summary,
  .admin-summary,
  .admin-control-grid,
  .admin-feature-flags,
  .admin-command-grid,
  .admin-layout,
  .admin-health-grid,
  .admin-tool-grid,
  .admin-deep-grid,
  .admin-billing-ledger,
  .admin-detail-grid {
    grid-template-columns: 1fr !important;
  }

  .full-panel,
  .panel,
  .metric-card,
  .plan-card,
  .admin-command-panel,
  .admin-section,
  .admin-control-plane,
  .settings-section,
  .billing-drawer,
  .credit-system-panel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  input,
  select,
  textarea,
  button {
    max-width: 100% !important;
  }

  textarea {
    min-height: 96px !important;
  }

  .admin-tabs {
    position: static !important;
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .admin-tabs button {
    flex: 0 0 auto !important;
    min-width: 112px !important;
  }

  .admin-user-row,
  .admin-worker-row,
  .admin-platform-audit-row,
  .admin-ploxy-workspace-row,
  .admin-ploxy-event-row,
  .admin-ploxy-receipt-row,
  .admin-stat-row,
  .admin-cost-row,
  .job-row,
  .invoice-row,
  .team-member-row,
  .audit-row {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .admin-user-actions,
  .admin-detail-actions,
  .creative-card-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .admin-detail-drawer {
    width: min(100%, 100vw) !important;
    max-width: 100vw !important;
    padding: 12px !important;
  }

  .admin-detail-content {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 520px) {
  .landing-footer-intro h2,
  .landing-detail-page h2,
  .landing-contact-page h2 {
    font-size: clamp(30px, 14vw, 48px) !important;
  }

  .image-login-panel {
    bottom: 10px !important;
    padding: 8px !important;
  }

  .landing-login-form input {
    height: 34px !important;
  }

  .landing-login,
  .landing-login.primary {
    min-height: 38px !important;
  }

  body.app-mode > .app-shell > .sidebar {
    grid-template-columns: 1fr !important;
  }

  body.app-mode > .app-shell > .sidebar .brand {
    width: 104px !important;
    justify-self: start !important;
  }

  body.app-mode > .app-shell > .sidebar .workspace-card {
    grid-template-columns: 1fr 1fr !important;
  }

  body.app-mode > .app-shell > .sidebar .workspace-card strong {
    grid-column: 1 / -1 !important;
  }

  .topbar-actions,
  .header-actions,
  .billing-header-actions,
  .credit-warning-actions,
  .admin-user-actions,
  .admin-detail-actions,
  .creative-card-actions {
    grid-template-columns: 1fr !important;
  }

  .topbar h1,
  .panel-header h2 {
    font-size: clamp(20px, 8vw, 30px) !important;
    line-height: 1.05 !important;
  }

  .global-project-console,
  .operator-strip,
  .credit-warning-banner,
  .panel,
  .full-panel {
    border-width: 2px !important;
    box-shadow: 3px 3px 0 #08090d !important;
  }
}

/* Admin tabs: split the long operator surface into focused work areas. */
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tabs {
  position: sticky;
  top: 0;
  z-index: 5;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0 14px;
  padding: 8px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.28), transparent 48%),
    #f7dfc5;
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tabs button {
  min-height: 38px;
  padding: 8px 10px;
  border: 2px solid #08090d;
  border-radius: 6px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tabs button.active {
  background:
    linear-gradient(100deg, #d5ff00 0 52%, #67d5e8 52% 100%);
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panels {
  min-height: 0;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel {
  display: grid;
  gap: 14px;
  min-height: 0;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[hidden] {
  display: none !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel > .admin-command-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel > .admin-control-plane,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel > .admin-layout,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel > .admin-deep-grid {
  margin: 0 !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="overview"] {
  grid-template-columns: minmax(0, 1fr);
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="tenants"] .admin-command-grid,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="operations"] .admin-deep-grid {
  gap: 12px !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="billing"] .admin-billing-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="audit"] .admin-audit-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="ploxy-ai"] .admin-ploxy-observability-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tab-panel[data-admin-panel="operations"] .admin-provider-readiness-panel {
  min-height: auto !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tabs {
    position: static;
    grid-template-columns: 1fr;
  }
}

/* Landing login compact pass: keep the hero face visible while preserving the poster style. */
.image-login-panel {
  right: clamp(14px, 2.6vw, 42px) !important;
  top: clamp(18px, 3vw, 34px) !important;
  grid-template-columns: minmax(122px, 148px) minmax(0, 1fr) !important;
  gap: 8px 11px !important;
  width: min(510px, calc(100vw - 30px)) !important;
  padding: 10px !important;
  box-shadow: 6px 6px 0 #08090d, 0 18px 54px rgba(0, 0, 0, 0.34) !important;
}

.image-login-panel img {
  height: 54px !important;
}

.image-login-panel span {
  padding: 6px 8px !important;
  font-size: 10px !important;
}

.landing-login-form {
  gap: 8px 10px !important;
}

.landing-login-form label {
  gap: 3px !important;
  font-size: 8.5px !important;
}

.landing-login-form input {
  height: 36px !important;
  padding: 0 9px !important;
  font-size: 11px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

.landing-login-form .landing-remember {
  gap: 7px !important;
  padding: 1px 0 !important;
}

.landing-login-form .landing-remember input {
  width: 14px !important;
  min-width: 14px !important;
  height: 14px !important;
}

.landing-login-form .landing-remember span {
  padding: 5px 7px !important;
  font-size: 9px !important;
}

.landing-login {
  min-height: 36px !important;
  padding: 0 11px !important;
  font-size: 12px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

.landing-login.primary {
  min-height: 44px !important;
  font-size: 13px !important;
}

.landing-reset-link {
  min-height: 28px !important;
  font-size: 9px !important;
}

.landing-login-form small {
  font-size: 9.5px !important;
}

/* Logged-in workspace should scroll like an app: fixed rail, scrolling content. */
body.app-mode {
  height: 100dvh !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell {
  display: grid !important;
  grid-template-columns: 224px minmax(0, 1fr) !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell > .sidebar {
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell > .sidebar nav {
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.app-mode > .app-shell > main {
  width: 100% !important;
  max-width: none !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

@media (max-width: 720px) {
  .image-login-panel {
    width: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode {
    height: auto !important;
    overflow: auto !important;
  }

  body.app-mode > .app-shell {
    height: auto !important;
    min-height: 100dvh !important;
    overflow: visible !important;
  }

  body.app-mode > .app-shell > main {
    height: auto !important;
    overflow: visible !important;
  }
}

/* Final user workspace background override: no artwork behind the app, just a bright calm canvas. */
body.app-mode:not(.admin-mode) {
  background: #f7e8d1 !important;
}

body.app-mode:not(.admin-mode) > .app-shell {
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.045) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.035) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 82% 7%, rgba(111, 217, 232, 0.34) 0, rgba(111, 217, 232, 0) 27%),
    radial-gradient(circle at 24% 8%, rgba(214, 255, 57, 0.30) 0, rgba(214, 255, 57, 0) 23%),
    radial-gradient(circle at 92% 58%, rgba(255, 181, 87, 0.20) 0, rgba(255, 181, 87, 0) 25%),
    #f7e8d1 !important;
  background-size: 42px 42px, 42px 42px, auto, auto, auto, auto !important;
}

body.app-mode:not(.admin-mode) > .app-shell::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* User workspace atmospheric background. Admin stays clean for operations. */
body.app-mode:not(.admin-mode) .app-shell {
  position: relative;
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.055) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.045) 0 1px, transparent 1px 100%),
    radial-gradient(circle at 78% 8%, rgba(103, 213, 232, 0.30), transparent 24%),
    radial-gradient(circle at 28% 10%, rgba(213, 255, 0, 0.28), transparent 22%),
    radial-gradient(circle at 92% 58%, rgba(255, 180, 84, 0.18), transparent 24%),
    #f6e7ce;
  background-size: 42px 42px, 42px 42px, auto, auto, auto, auto;
}

body.app-mode:not(.admin-mode) .app-shell::after {
  display: none;
}

body.app-mode:not(.admin-mode) .sidebar,
body.app-mode:not(.admin-mode) .app-shell > main {
  position: relative;
  z-index: 1;
}

/* Admin audit polish: make platform controls dense, legible, and non-stretchy. */
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-panel {
  display: block;
  padding: 14px !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-summary {
  grid-template-columns: repeat(6, minmax(118px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .metric-card {
  min-height: 84px;
  padding: 10px 12px !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-control-plane,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-command-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-section {
  align-self: start;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-control-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-feature-flags {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-command-grid {
  grid-template-columns: 1fr;
  gap: 10px;
  margin-bottom: 10px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-operator-grid {
  gap: 12px;
  margin: 10px 0;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-operator-grid article {
  min-height: 108px;
  padding: 14px 16px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-command-grid > .admin-command-panel:not(.admin-wide-panel) {
  order: 1;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-command-grid > .admin-wide-panel {
  order: 2;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] #admin-revenue-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-layout {
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  grid-template-rows: auto auto;
  align-items: stretch;
  gap: 12px 16px;
  margin-bottom: 12px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-layout > .admin-section:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-layout > .admin-worker-section {
  grid-column: 2;
  grid-row: 1 / span 2;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-layout > .admin-section:nth-child(3) {
  grid-column: 1;
  grid-row: 2;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-layout > .admin-section {
  height: 100%;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-health-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-health-grid article {
  min-height: 82px;
  padding: 10px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tool-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tool-grid button {
  min-height: 36px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-provider-readiness-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-billing-panel,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-audit-panel {
  margin: 10px 0 12px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-deep-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 12px;
  margin-top: 10px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-deep-grid > .admin-command-panel:nth-child(1) {
  grid-column: 1;
  grid-row: 1 / span 2;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-deep-grid > .admin-command-panel:nth-child(2) {
  grid-column: 2;
  grid-row: 1;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-deep-grid > .admin-command-panel:nth-child(3) {
  grid-column: 2;
  grid-row: 2;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-filter-bar,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-credit-adjust-form {
  border: 2px solid #08090d;
  background: rgba(255, 250, 240, 0.72);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-bulk-bar {
  border: 2px solid #08090d;
  background: linear-gradient(135deg, rgba(223, 255, 63, 0.28), rgba(103, 213, 232, 0.2));
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-bulk-bar span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-select-all,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-filter-bar span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-filter-bar label,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-credit-adjust-form label,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-worker-row small,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-empty-row small {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-bulk-bar button,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-user-row button,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-worker-row button,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tool-grid button {
  min-height: 28px;
  border: 2px solid #08090d !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-bulk-bar button:hover,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-user-row button:hover,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-worker-row button:hover,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-tool-grid button:hover {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-user-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-worker-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-stat-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-cost-row {
  background: rgba(255, 250, 240, 0.86) !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-stat-row span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-stat-row small,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-cost-row span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-module-row span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-health-grid small,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-alert-row small {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-stat-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-cost-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-module-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-health-grid strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-alert-row strong {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="admin"] .admin-detail-overlay {
  background: rgba(8, 9, 13, 0.36);
  backdrop-filter: blur(5px);
}

body.app-mode[data-active-view="admin"] .admin-detail-drawer {
  width: min(640px, 100vw);
  border-left: 4px solid #08090d;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.07) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(8, 9, 13, 0.07) 0 1px, transparent 1px 100%),
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), rgba(103, 213, 232, 0.12) 46%, rgba(255, 180, 84, 0.12)),
    #fff7ed;
  background-size: 32px 32px, 32px 32px, auto, auto;
  box-shadow: -12px 0 0 #08090d, -30px 0 70px rgba(8, 9, 13, 0.28);
  color: #08090d;
}

body.app-mode[data-active-view="admin"] .admin-detail-close {
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  font-weight: 900;
}

body.app-mode[data-active-view="admin"] .admin-detail-header,
body.app-mode[data-active-view="admin"] .admin-detail-card,
body.app-mode[data-active-view="admin"] .admin-detail-block,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row,
body.app-mode[data-active-view="admin"] .admin-detail-empty {
  border: 3px solid #08090d;
  border-radius: 8px;
  background: rgba(255, 250, 240, 0.9);
  box-shadow: 5px 5px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="admin"] .admin-detail-header {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.28), rgba(103, 213, 232, 0.18)),
    #fffaf0;
}

body.app-mode[data-active-view="admin"] .admin-detail-header h2,
body.app-mode[data-active-view="admin"] .admin-detail-header p,
body.app-mode[data-active-view="admin"] .admin-detail-card strong,
body.app-mode[data-active-view="admin"] .admin-detail-card small,
body.app-mode[data-active-view="admin"] .admin-detail-block h3,
body.app-mode[data-active-view="admin"] .admin-detail-block p,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row strong,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row small,
body.app-mode[data-active-view="admin"] .admin-detail-empty {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="admin"] .admin-detail-card span,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row > span,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row time,
body.app-mode[data-active-view="admin"] .admin-detail-header .eyebrow {
  color: #055d68 !important;
  -webkit-text-fill-color: #055d68 !important;
}

body.app-mode[data-active-view="admin"] .admin-detail-status {
  border: 2px solid #06704d;
  border-radius: 8px;
  background: #dfff3f;
  color: #06704d;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="admin"] .admin-detail-status.severity-high {
  border-color: #9d1f1f;
  background: #ffd8d8;
  color: #9d1f1f;
}

body.app-mode[data-active-view="admin"] .admin-detail-status.severity-medium {
  border-color: #8a4c00;
  background: #ffe4aa;
  color: #8a4c00;
}

body.app-mode[data-active-view="admin"] .admin-detail-actions button {
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
  font-weight: 850;
}

body.app-mode[data-active-view="admin"] .admin-detail-actions button:first-child {
  background: linear-gradient(135deg, #dfff3f, #67d5e8);
  color: #08090d;
}

body.app-mode[data-active-view="admin"] .admin-detail-actions button:disabled {
  opacity: 0.45;
}

body.app-mode.admin-detail-open[data-active-view="admin"] {
  overflow: hidden;
}

body.app-mode[data-active-view="admin"] .admin-detail-drawer {
  height: 100dvh;
  overflow: hidden;
}

body.app-mode[data-active-view="admin"] .admin-detail-content {
  display: grid;
  grid-template-rows: auto auto auto auto minmax(0, 1fr);
  gap: 9px;
  height: 100dvh;
  min-height: 0;
  padding: 16px 18px 14px;
  overflow: hidden;
}

body.app-mode[data-active-view="admin"] .admin-detail-close {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  width: 34px;
  height: 34px;
  margin: 0;
}

body.app-mode[data-active-view="admin"] .admin-detail-header {
  gap: 4px;
  min-height: 0;
  padding: 12px 52px 12px 14px;
}

body.app-mode[data-active-view="admin"] .admin-detail-header h2 {
  font-size: 22px;
  line-height: 1.05;
}

body.app-mode[data-active-view="admin"] .admin-detail-header p {
  font-size: 11px;
  line-height: 1.25;
}

body.app-mode[data-active-view="admin"] .admin-detail-status {
  padding: 4px 7px;
  font-size: 8px;
}

body.app-mode[data-active-view="admin"] .admin-detail-actions {
  gap: 7px;
}

body.app-mode[data-active-view="admin"] .admin-detail-actions button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 10px;
}

body.app-mode[data-active-view="admin"] .admin-detail-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="admin"] .admin-detail-card {
  min-height: 68px;
  padding: 9px 10px;
}

body.app-mode[data-active-view="admin"] .admin-detail-card span {
  font-size: 8px;
}

body.app-mode[data-active-view="admin"] .admin-detail-card strong {
  font-size: 15px;
  line-height: 1.05;
}

body.app-mode[data-active-view="admin"] .admin-detail-card small,
body.app-mode[data-active-view="admin"] .admin-detail-block p,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row small {
  font-size: 9.5px;
  line-height: 1.25;
}

body.app-mode[data-active-view="admin"] .admin-detail-block {
  gap: 6px;
  min-height: 0;
  padding: 10px 12px;
}

body.app-mode[data-active-view="admin"] .admin-detail-block h3 {
  font-size: 12px;
}

body.app-mode[data-active-view="admin"] .admin-detail-block p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="admin"] .admin-detail-block:last-child {
  overflow: hidden;
}

body.app-mode[data-active-view="admin"] .admin-detail-timeline {
  min-height: 0;
  overflow: hidden;
  gap: 6px;
}

body.app-mode[data-active-view="admin"] .admin-detail-timeline-row {
  grid-template-columns: 72px minmax(0, 1fr) 56px;
  gap: 7px;
  min-height: 44px;
  padding: 7px 8px;
}

body.app-mode[data-active-view="admin"] .admin-detail-timeline-row:nth-child(n + 4) {
  display: none;
}

body.app-mode[data-active-view="admin"] .admin-detail-timeline-row > span,
body.app-mode[data-active-view="admin"] .admin-detail-timeline-row time {
  font-size: 7.5px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-user-actions {
  min-width: 156px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-audit-panel .admin-filter-bar {
  grid-template-columns: minmax(260px, 1fr) 176px 176px auto;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-list {
  display: grid;
  gap: 8px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .audit-summary-card,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row {
  border: 3px solid #08090d !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row {
  grid-template-columns: 112px minmax(0, 1fr) 88px 112px;
  min-height: 56px;
  padding: 10px 12px;
  gap: 12px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row > span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  min-height: 24px;
  padding: 3px 7px;
  border: 2px solid #08090d;
  background: #67d5e8;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d;
  font-weight: 850;
  line-height: 1;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row b {
  justify-self: start;
  background: #dfff3f;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row time {
  justify-self: end;
  background: #fffaf0;
  text-align: right;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row div {
  min-width: 0;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row small,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .audit-summary-card strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .audit-summary-card small {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row strong {
  font-size: 13px;
  line-height: 1.08;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row small {
  display: block;
  overflow: hidden;
  font-size: 10.5px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row.severity-high b {
  background: #ffd8d8;
  color: #9d1f1f !important;
  -webkit-text-fill-color: #9d1f1f !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row.severity-medium b {
  background: #ffe4aa;
  color: #8a4c00 !important;
  -webkit-text-fill-color: #8a4c00 !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row:hover {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-summary {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-observability-grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row {
  border: 3px solid #08090d !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row {
  grid-template-columns: minmax(0, 1fr) 92px 104px 92px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row {
  grid-template-columns: 118px minmax(0, 1fr) 94px 112px;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row small,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row small,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row strong,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row small {
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row > span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row > span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row > time,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row > span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row > time,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-chip-row span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  min-height: 24px;
  padding: 3px 7px;
  border: 2px solid #08090d;
  background: #fffaf0;
  color: #08090d !important;
  -webkit-text-fill-color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d;
  font-weight: 850;
  line-height: 1;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row > span,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row > span {
  background: #67d5e8;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row > b {
  background: #dfff3f;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row.guarded > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row.severity-high > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row.blocked > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row.refused > b,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row.guarded > b {
  background: #ffe4aa;
  color: #8a4c00 !important;
  -webkit-text-fill-color: #8a4c00 !important;
}

body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row:hover,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row:hover,
body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row:hover {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0 #08090d !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-summary,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-summary,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-control-grid,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-feature-flags {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-command-grid,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-layout,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-observability-grid,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-billing-ledger {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-audit-panel .admin-filter-bar,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-filter-bar,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-workspace-row,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row {
    grid-template-columns: 1fr;
  }

  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-platform-audit-row time,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-event-row time,
  body.app-mode[data-active-view="admin"] [data-view-section="admin"] .admin-ploxy-receipt-row time {
    justify-self: start;
  }
}

/* Creative Studio proportion pass: board gets priority, chat cost controls get quieter. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(252px, 292px) !important;
  min-height: 392px !important;
  gap: 12px !important;
  padding: 8px 5px 20px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
  min-height: 360px !important;
  max-height: 360px !important;
  padding: 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 132px 58px 28px 24px 66px auto !important;
  min-height: 540px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-preview {
  height: 132px !important;
  min-height: 132px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview {
  padding: 32px 12px 24px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b {
  font-size: 10.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  font-size: 9px !important;
  -webkit-line-clamp: 3;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  max-height: 32px;
  font-size: 13px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  max-height: 26px;
  font-size: 9.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-height: 26px !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto auto !important;
  gap: 5px !important;
  padding-top: 5px !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel div {
  min-height: 34px !important;
  padding: 5px 6px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel .eyebrow {
  font-size: 8px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel strong {
  font-size: 10.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel small {
  overflow: hidden;
  font-size: 8px !important;
  line-height: 1.12 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] #auto-top-up-button,
body.app-mode[data-active-view="creative"] #auto-start-automation {
  min-width: 78px !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] #auto-start-automation {
  min-width: 104px !important;
}

body.app-mode[data-active-view="creative"] .cost-mode-trigger {
  min-width: 70px !important;
  min-height: 26px !important;
  padding: 0 6px !important;
  border-width: 2px !important;
  font-size: 8.5px !important;
}

/* Dashboard gap cleanup: paired cards stretch together so rows do not leave dead space. */
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] {
  align-items: stretch !important;
  row-gap: 10px !important;
  column-gap: 14px !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel {
  height: 100% !important;
  align-self: stretch !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4),
body.app-mode[data-active-view="dashboard"] .cost-panel,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6),
body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr);
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .recommendation-list,
body.app-mode[data-active-view="dashboard"] .platform-panel .platform-score-list,
body.app-mode[data-active-view="dashboard"] .cost-panel .cost-breakdown-list,
body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action-list {
  align-self: stretch !important;
}

body.app-mode[data-active-view="dashboard"] .cost-panel .cost-breakdown-list {
  grid-auto-rows: minmax(54px, 1fr);
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4) .queue-list {
  align-self: stretch !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6) .event-list {
  max-height: none !important;
  min-height: 0 !important;
  overflow: auto !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel {
  margin-top: 0 !important;
}

/* Creative focus mode must fill the usable viewport, overriding normal page sizing. */
body.app-mode.creative-focus-mode {
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .app-shell {
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode main {
  width: 100vw !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  padding: 12px !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode [data-view-section="creative"] {
  display: block !important;
  height: 100% !important;
  min-height: 0 !important;
}

body.app-mode.creative-focus-mode .creative-engine {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) !important;
  height: calc(100dvh - 24px) !important;
  min-height: 0 !important;
  padding: 54px 14px 14px !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr) !important;
  grid-template-areas: "composer preview" !important;
  align-items: stretch !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-panel,
body.app-mode.creative-focus-mode .creative-agent-console .manual-studio-panel,
body.app-mode.creative-focus-mode .creative-agent-console .creative-preview-stage {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-panel {
  grid-template-rows: auto minmax(0, 1fr) auto auto !important;
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-body,
body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-log {
  min-height: 0 !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-body {
  overflow: hidden !important;
}

body.app-mode.creative-focus-mode .creative-agent-console .ploxy-chat-log {
  overflow: auto !important;
}

body.app-mode.creative-focus-mode .creative-preview-stage {
  display: grid !important;
  padding: 12px !important;
}

body.app-mode.creative-focus-mode .creative-preview-stage .preview-shell,
body.app-mode.creative-focus-mode .creative-preview-stage .preview-canvas {
  height: 100% !important;
  min-height: 0 !important;
}

body.app-mode.creative-focus-mode .creative-preview-stage .preview-shell {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode.creative-focus-mode .creative-preview-stage .preview-device {
  width: min(78vh, 78vw) !important;
  height: min(78vh, 78vw) !important;
  max-width: 100% !important;
  max-height: 100% !important;
}

body.app-mode.creative-focus-mode .creative-preview-stage .preview-inspector {
  align-self: end;
  margin-top: 10px;
}

body.app-mode.creative-focus-mode .auto-cost-panel {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto !important;
  align-items: stretch !important;
}

body.app-mode.creative-focus-mode #auto-start-automation {
  min-height: 38px !important;
}

/* Dashboard lower-board arrangement: no half-width card dangling at the end. */
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] {
  grid-auto-flow: row !important;
  align-items: start !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .performance-hero {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .campaign-panel {
  grid-column: span 7 !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .platform-panel {
  grid-column: span 5 !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4),
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .cost-panel,
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6),
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-agent-panel {
  grid-column: span 6 !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .operations-panel {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button,
body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button:last-child {
  grid-column: auto !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .provider-output {
  grid-column: 1 / -1;
}

/* Dashboard overview polish: keep long operational lists from stretching sibling cards. */
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] {
  align-items: start !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel {
  height: auto !important;
  align-self: start !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4) {
  min-height: 0 !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4) .queue-list {
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding-right: 0 !important;
  align-self: start !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4) .queue-list li {
  min-height: 64px !important;
}

body.app-mode[data-active-view="dashboard"] .queue-list .queue-preview-more {
  border: 2px dashed rgba(8, 9, 13, 0.42) !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.20), rgba(223, 255, 63, 0.18)),
    #fffaf0 !important;
}

body.app-mode[data-active-view="dashboard"] .queue-list .queue-preview-more button {
  min-height: 34px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #08090d;
  color: #fffaf0;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.24);
  cursor: pointer;
}

body.app-mode[data-active-view="dashboard"] .cost-panel {
  min-height: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .cost-panel .cost-breakdown-list {
  align-self: start !important;
  grid-auto-rows: minmax(66px, auto) !important;
}

body.app-mode[data-active-view="dashboard"] .cost-row {
  min-height: 66px !important;
}

body.app-mode[data-active-view="dashboard"] .event-list {
  max-height: 260px !important;
  overflow: auto !important;
  padding-right: 5px !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel .agent-action-list {
  align-self: start !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel .platform-score-list {
  align-self: start !important;
}

@media (min-width: 1181px) {
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4) {
    grid-column: 1 / span 6 !important;
    grid-row: 3 / span 3 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .cost-panel {
    grid-column: 7 / -1 !important;
    grid-row: 3 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6) {
    grid-column: 7 / -1 !important;
    grid-row: 4 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-agent-panel {
    grid-column: 7 / -1 !important;
    grid-row: 5 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .operations-panel {
    grid-column: 1 / -1 !important;
    grid-row: 6 !important;
  }
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4),
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .cost-panel,
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6),
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .dashboard-agent-panel,
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .operations-panel {
    grid-row: auto !important;
  }
}

/* Dashboard Polxy dock: float like Creative Studio's sticky composer, outside the page cards. */
body.app-mode:not([data-active-view="dashboard"]) .dashboard-agent-dock {
  display: none !important;
}

body.app-mode[data-active-view="dashboard"] > .app-shell > main {
  padding-bottom: 168px !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] {
  padding-bottom: 138px !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 16px !important;
  z-index: 80 !important;
  width: min(936px, calc(100vw - 264px - 28px)) !important;
  height: 112px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(139, 92, 246, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="dashboard"] .dashboard-agent-dock {
  left: calc(74px + ((100vw - 74px - min(936px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(936px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

/* Dashboard cleanup: restrained color, compact copy, and one sticky prompt surface. */
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"],
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .dashboard-agent-panel {
  display: none !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] {
  gap: 12px !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel {
  position: relative !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  background: #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .panel::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 6px;
  background: #67d5e8;
  opacity: 0.95;
  pointer-events: none;
}

body.app-mode[data-active-view="dashboard"] .performance-hero::before {
  width: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.30), rgba(103, 213, 232, 0.20) 48%, rgba(185, 167, 255, 0.18)),
    #fffaf0 !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel::before {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel::before {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4)::before {
  background: #15e0a0 !important;
}

body.app-mode[data-active-view="dashboard"] .cost-panel::before {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6)::before {
  background: #ffd166 !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel::before {
  background: #08090d !important;
}

body.app-mode[data-active-view="dashboard"] .panel-header {
  align-items: start !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="dashboard"] .panel-header h2,
body.app-mode[data-active-view="dashboard"] .section-title h3 {
  max-width: 100% !important;
  font-size: clamp(20px, 2.1vw, 28px) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="dashboard"] .eyebrow,
body.app-mode[data-active-view="dashboard"] .metric-label {
  font-size: 10px !important;
  line-height: 1.15 !important;
  letter-spacing: 0.04em !important;
}

body.app-mode[data-active-view="dashboard"] p,
body.app-mode[data-active-view="dashboard"] small,
body.app-mode[data-active-view="dashboard"] span,
body.app-mode[data-active-view="dashboard"] strong,
body.app-mode[data-active-view="dashboard"] b,
body.app-mode[data-active-view="dashboard"] button {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance {
  grid-template-columns: minmax(0, 1fr) minmax(150px, 210px) !important;
  gap: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance strong {
  font-size: clamp(24px, 2.5vw, 36px) !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance p,
body.app-mode[data-active-view="dashboard"] .panel-note,
body.app-mode[data-active-view="dashboard"] .recommendation-card small,
body.app-mode[data-active-view="dashboard"] .platform-score-row small,
body.app-mode[data-active-view="dashboard"] .cost-row small,
body.app-mode[data-active-view="dashboard"] .queue-list small,
body.app-mode[data-active-view="dashboard"] .event-list small {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 12.5px !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics,
body.app-mode[data-active-view="dashboard"] .campaign-summary {
  gap: 9px !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics article,
body.app-mode[data-active-view="dashboard"] .campaign-summary > div,
body.app-mode[data-active-view="dashboard"] .recommendation-card,
body.app-mode[data-active-view="dashboard"] .platform-score-row,
body.app-mode[data-active-view="dashboard"] .cost-row,
body.app-mode[data-active-view="dashboard"] .queue-list li,
body.app-mode[data-active-view="dashboard"] .event-list li {
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 10px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics strong,
body.app-mode[data-active-view="dashboard"] .campaign-summary strong {
  font-size: clamp(21px, 2.4vw, 32px) !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="dashboard"] .recommendation-list,
body.app-mode[data-active-view="dashboard"] .platform-score-list,
body.app-mode[data-active-view="dashboard"] .cost-breakdown-list,
body.app-mode[data-active-view="dashboard"] .queue-list,
body.app-mode[data-active-view="dashboard"] .event-list {
  gap: 8px !important;
}

body.app-mode[data-active-view="dashboard"] .recommendation-card strong,
body.app-mode[data-active-view="dashboard"] .platform-score-row strong,
body.app-mode[data-active-view="dashboard"] .cost-row strong,
body.app-mode[data-active-view="dashboard"] .queue-list span,
body.app-mode[data-active-view="dashboard"] .event-list strong {
  font-size: 15px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="dashboard"] .queue-list li {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  min-height: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .queue-meta,
body.app-mode[data-active-view="dashboard"] .queue-actions {
  min-width: 0 !important;
}

body.app-mode[data-active-view="dashboard"] .queue-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 5px !important;
}

body.app-mode[data-active-view="dashboard"] .queue-actions button,
body.app-mode[data-active-view="dashboard"] .queue-status-pill {
  min-width: 0 !important;
  min-height: 28px !important;
  padding: 5px 7px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button {
  min-height: 78px !important;
  padding: 11px !important;
  text-align: left !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button strong {
  font-size: 16px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button span {
  font-size: 12px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel .platform-score-list {
  width: 100% !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel .platform-score-row {
  width: 100% !important;
  grid-template-columns: minmax(108px, 0.78fr) minmax(118px, 1.35fr) 32px !important;
  column-gap: 12px !important;
}

body.app-mode[data-active-view="dashboard"] .platform-panel .score-track {
  width: 100% !important;
  min-width: 118px !important;
}

/* Dashboard compact typography pass: keep long project text readable inside cards. */
body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] .panel-header h2 {
  font-size: clamp(18px, 1.65vw, 24px) !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="dashboard"] .performance-hero .panel-header h2 {
  font-size: clamp(20px, 1.85vw, 27px) !important;
  line-height: 1.02 !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance strong {
  font-size: clamp(20px, 1.8vw, 26px) !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .campaign-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .campaign-summary > div {
  min-height: 76px !important;
  padding: 9px 10px !important;
}

body.app-mode[data-active-view="dashboard"] .campaign-panel .campaign-summary strong {
  margin-top: 4px !important;
  font-size: clamp(16px, 1.4vw, 20px) !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="dashboard"] .performance-metrics strong {
  font-size: clamp(19px, 1.9vw, 27px) !important;
}

body.app-mode[data-active-view="dashboard"] .recommendation-card {
  min-height: 0 !important;
  padding: 8px 9px !important;
}

body.app-mode[data-active-view="dashboard"] .recommendation-card strong,
body.app-mode[data-active-view="dashboard"] .platform-score-row strong,
body.app-mode[data-active-view="dashboard"] .cost-row strong,
body.app-mode[data-active-view="dashboard"] .queue-list span,
body.app-mode[data-active-view="dashboard"] .event-list strong {
  font-size: 13.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="dashboard"] .hero-performance p,
body.app-mode[data-active-view="dashboard"] .panel-note,
body.app-mode[data-active-view="dashboard"] .recommendation-card small,
body.app-mode[data-active-view="dashboard"] .platform-score-row small,
body.app-mode[data-active-view="dashboard"] .cost-row small,
body.app-mode[data-active-view="dashboard"] .queue-list small,
body.app-mode[data-active-view="dashboard"] .event-list small {
  font-size: 11.5px !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view="dashboard"] .queue-list li,
body.app-mode[data-active-view="dashboard"] .cost-row,
body.app-mode[data-active-view="dashboard"] .event-list li {
  padding: 8px 9px !important;
}

body.app-mode[data-active-view="dashboard"] .queue-list li {
  min-height: 54px !important;
}

body.app-mode[data-active-view="dashboard"] .cost-panel .cost-breakdown-list {
  grid-auto-rows: minmax(54px, auto) !important;
}

body.app-mode[data-active-view="dashboard"] .cost-row {
  min-height: 54px !important;
}

body.app-mode[data-active-view="dashboard"] .operations-panel .operation-button strong {
  font-size: 14px !important;
}

@media (min-width: 1181px) {
  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(4) {
    grid-column: 1 / span 6 !important;
    grid-row: 3 / span 2 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .cost-panel {
    grid-column: 7 / -1 !important;
    grid-row: 3 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > article:nth-of-type(6) {
    grid-column: 7 / -1 !important;
    grid-row: 4 !important;
  }

  body.app-mode[data-active-view="dashboard"] [data-view-section="dashboard"] > .operations-panel {
    grid-column: 1 / -1 !important;
    grid-row: 5 !important;
  }
}

@media (max-width: 980px) {
  body.app-mode[data-active-view="dashboard"] .operations-panel .operation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Missions Polxy dock: same prompt-box footprint, mission-specific options. */
.mission-agent-dock {
  display: none;
}

body.app-mode[data-active-view="missions"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="missions"] .mission-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-mode,
body.app-mode[data-active-view="missions"] .mission-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="missions"] .mission-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-mode button,
body.app-mode[data-active-view="missions"] .mission-agent-options button,
body.app-mode[data-active-view="missions"] .mission-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-mode button.active,
body.app-mode[data-active-view="missions"] .mission-agent-send {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="missions"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="missions"] [data-view-section="missions"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-mode,
  body.app-mode[data-active-view="missions"] .mission-agent-options {
    gap: 6px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-mode button,
  body.app-mode[data-active-view="missions"] .mission-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }
}

/* Automation Polxy dock: sticky operator prompt with queue, channel, and worker shortcuts. */
.automation-agent-dock {
  display: none;
}

body.app-mode[data-active-view="automation"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="automation"] [data-view-section="automation"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="automation"] .automation-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-mode,
body.app-mode[data-active-view="automation"] .automation-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="automation"] .automation-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-mode button,
body.app-mode[data-active-view="automation"] .automation-agent-options button,
body.app-mode[data-active-view="automation"] .automation-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-mode button.active,
body.app-mode[data-active-view="automation"] .automation-agent-send {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-dock.is-running {
  outline: 3px solid #dfff3f;
  outline-offset: 2px;
}

body.app-mode[data-active-view="automation"] .automation-agent-console {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="automation"] .automation-agent-response {
  min-height: 0 !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="automation"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="automation"] [data-view-section="automation"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="automation"] .automation-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="automation"] .automation-agent-mode,
  body.app-mode[data-active-view="automation"] .automation-agent-options {
    gap: 6px !important;
  }

  body.app-mode[data-active-view="automation"] .automation-agent-mode button,
  body.app-mode[data-active-view="automation"] .automation-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="automation"] .automation-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="automation"] .automation-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }
}

/* Campaigns Polxy dock: sticky campaign health, strategy, budget, and risk prompt. */
.campaign-agent-dock {
  display: none;
}

body.app-mode[data-active-view="campaigns"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="campaigns"] .campaign-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-mode,
body.app-mode[data-active-view="campaigns"] .campaign-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-mode button,
body.app-mode[data-active-view="campaigns"] .campaign-agent-options button,
body.app-mode[data-active-view="campaigns"] .campaign-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-mode button.active,
body.app-mode[data-active-view="campaigns"] .campaign-agent-send {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-dock.is-running {
  outline: 3px solid #dfff3f;
  outline-offset: 2px;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-console {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr) !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-side {
  grid-template-rows: auto !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="campaigns"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-mode,
  body.app-mode[data-active-view="campaigns"] .campaign-agent-options {
    gap: 6px !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-mode button,
  body.app-mode[data-active-view="campaigns"] .campaign-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-console {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Queue Polxy dock: sticky approval, publish, blocker, and proof prompt. */
.queue-agent-dock {
  display: none;
}

body.app-mode[data-active-view="queue"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="queue"] .queue-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-mode,
body.app-mode[data-active-view="queue"] .queue-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="queue"] .queue-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-mode button,
body.app-mode[data-active-view="queue"] .queue-agent-options button,
body.app-mode[data-active-view="queue"] .queue-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-mode button.active,
body.app-mode[data-active-view="queue"] .queue-agent-send {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

body.app-mode[data-active-view="queue"] .queue-agent-console {
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.54fr) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-side {
  grid-template-rows: auto !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="queue"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="queue"] [data-view-section="queue"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="queue"] .queue-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="queue"] .queue-agent-mode,
  body.app-mode[data-active-view="queue"] .queue-agent-options {
    gap: 6px !important;
  }

  body.app-mode[data-active-view="queue"] .queue-agent-mode button,
  body.app-mode[data-active-view="queue"] .queue-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="queue"] .queue-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="queue"] .queue-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  body.app-mode[data-active-view="queue"] .queue-agent-console {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (min-width: 1320px) {
  body.app-mode[data-active-view="dashboard"] main {
    width: min(100%, calc(100vw - 264px)) !important;
  }
}

/* Creative Studio proportion pass: board gets priority, chat cost controls get quieter. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(252px, 292px) !important;
  min-height: 392px !important;
  gap: 12px !important;
  padding: 8px 5px 20px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
  min-height: 360px !important;
  max-height: 360px !important;
  padding: 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 132px 58px 28px 24px 66px auto !important;
  min-height: 540px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-preview {
  height: 132px !important;
  min-height: 132px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview {
  padding: 32px 12px 24px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b {
  font-size: 10.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  font-size: 9px !important;
  -webkit-line-clamp: 3;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  max-height: 32px;
  font-size: 13px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  max-height: 26px;
  font-size: 9.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-height: 26px !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto auto !important;
  gap: 5px !important;
  padding-top: 5px !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel div {
  min-height: 34px !important;
  padding: 5px 6px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel .eyebrow {
  font-size: 8px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel strong {
  font-size: 10.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel small {
  overflow: hidden;
  font-size: 8px !important;
  line-height: 1.12 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] #auto-top-up-button,
body.app-mode[data-active-view="creative"] #auto-start-automation {
  min-width: 78px !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] #auto-start-automation {
  min-width: 104px !important;
}

body.app-mode[data-active-view="creative"] .cost-mode-trigger {
  min-width: 70px !important;
  min-height: 26px !important;
  padding: 0 6px !important;
  border-width: 2px !important;
  font-size: 8.5px !important;
}

/* Creative Studio proportion pass: board gets priority, chat cost controls get quieter. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(252px, 292px) !important;
  min-height: 392px !important;
  gap: 12px !important;
  padding: 8px 5px 20px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
  min-height: 360px !important;
  max-height: 360px !important;
  padding: 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 132px 58px 28px 24px 66px auto !important;
  min-height: 540px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-preview {
  height: 132px !important;
  min-height: 132px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview {
  padding: 32px 12px 24px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b {
  font-size: 10.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  font-size: 9px !important;
  -webkit-line-clamp: 3;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  max-height: 32px;
  font-size: 13px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  max-height: 26px;
  font-size: 9.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-height: 26px !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel {
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto auto !important;
  gap: 5px !important;
  padding-top: 5px !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel div {
  min-height: 34px !important;
  padding: 5px 6px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel .eyebrow {
  font-size: 8px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel strong {
  font-size: 10.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="creative"] .auto-cost-panel small {
  overflow: hidden;
  font-size: 8px !important;
  line-height: 1.12 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] #auto-top-up-button,
body.app-mode[data-active-view="creative"] #auto-start-automation {
  min-width: 78px !important;
  min-height: 30px !important;
  padding: 5px 8px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  white-space: nowrap;
}

body.app-mode[data-active-view="creative"] #auto-start-automation {
  min-width: 104px !important;
}

body.app-mode[data-active-view="creative"] .cost-mode-trigger {
  min-width: 70px !important;
  min-height: 26px !important;
  padding: 0 6px !important;
  border-width: 2px !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 104px minmax(46px, auto) auto auto auto auto !important;
  min-height: 470px !important;
}

/* Campaign and Queue: compact product-grade workbench pass */
body.app-mode[data-active-view="campaigns"] .full-panel,
body.app-mode[data-active-view="queue"] .full-panel {
  max-width: min(100%, 1360px);
}

body.app-mode[data-active-view="campaigns"] .table-shell,
body.app-mode[data-active-view="queue"] .full-panel {
  padding: 12px !important;
  border: 3px solid #08090d;
  border-radius: 11px;
  background:
    radial-gradient(circle at 18% 16%, rgba(103, 213, 232, 0.22), transparent 26%),
    radial-gradient(circle at 82% 8%, rgba(181, 156, 246, 0.18), transparent 24%),
    linear-gradient(135deg, rgba(255, 247, 237, 0.96), rgba(246, 234, 215, 0.88));
  box-shadow: 7px 7px 0 #08090d;
}

body.app-mode[data-active-view="campaigns"] .panel-header,
body.app-mode[data-active-view="queue"] .panel-header {
  margin-bottom: 10px;
}

body.app-mode[data-active-view="campaigns"] .agent-action-panel,
body.app-mode[data-active-view="queue"] .queue-actions-panel {
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions {
  grid-template-columns: 1.08fr 1fr 1fr 0.78fr;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.app-mode[data-active-view="campaigns"] .campaign-actions button,
body.app-mode[data-active-view="queue"] .queue-actions-panel button {
  min-height: 58px !important;
  padding: 9px 10px !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions strong,
body.app-mode[data-active-view="queue"] .queue-actions-panel strong {
  font-size: 12px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-console,
body.app-mode[data-active-view="queue"] .queue-agent-console {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 12px !important;
  align-items: stretch;
  margin: 0 0 12px;
}

body.app-mode[data-active-view="queue"] .queue-left-stack {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 10px;
  min-width: 0;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-response,
body.app-mode[data-active-view="queue"] .queue-agent-response,
body.app-mode[data-active-view="campaigns"] .campaign-agent-form,
body.app-mode[data-active-view="queue"] .queue-agent-form {
  padding: 12px !important;
  border-radius: 9px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-response,
body.app-mode[data-active-view="queue"] .queue-agent-response {
  background:
    linear-gradient(110deg, rgba(255, 255, 255, 0.42), transparent 58%),
    #83d7e7 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response {
  min-height: 100% !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-recommendations,
body.app-mode[data-active-view="queue"] .queue-agent-recommendations {
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-recommendations article,
body.app-mode[data-active-view="queue"] .queue-agent-recommendations article {
  min-height: 0 !important;
  padding: 8px 9px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-recommendations article strong,
body.app-mode[data-active-view="queue"] .queue-agent-recommendations article strong {
  font-size: 11px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-side,
body.app-mode[data-active-view="queue"] .queue-agent-side {
  display: grid;
  grid-template-rows: auto minmax(210px, 1fr);
  gap: 10px;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-status-grid,
body.app-mode[data-active-view="queue"] .queue-agent-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-status-grid article,
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article {
  min-height: 68px !important;
  padding: 9px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-status-grid strong,
body.app-mode[data-active-view="queue"] .queue-agent-status-grid strong {
  font-size: 16px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-status-grid small,
body.app-mode[data-active-view="queue"] .queue-agent-status-grid small,
body.app-mode[data-active-view="campaigns"] .campaign-agent-response small,
body.app-mode[data-active-view="queue"] .queue-agent-response small {
  font-size: 10px !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-form textarea,
body.app-mode[data-active-view="queue"] .queue-agent-form textarea {
  min-height: 74px !important;
  padding: 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-shortcuts,
body.app-mode[data-active-view="queue"] .queue-agent-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-shortcuts button,
body.app-mode[data-active-view="queue"] .queue-agent-shortcuts button,
body.app-mode[data-active-view="queue"] .agent-submit-button {
  min-height: 30px !important;
  padding: 7px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-form {
  display: grid;
  align-content: start;
}

body.app-mode[data-active-view="queue"] .agent-submit-button {
  justify-self: end;
  margin-top: 8px;
  background: #69e6a3 !important;
}

body.app-mode[data-active-view="queue"] .filter-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(190px, 260px));
  gap: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 9px;
  background: rgba(255, 247, 237, 0.82);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="queue"] .filter-row label {
  display: grid;
  gap: 4px;
  color: #08090d;
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

body.app-mode[data-active-view="queue"] .filter-row select {
  min-height: 34px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="campaigns"] table {
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="campaigns"] th,
body.app-mode[data-active-view="campaigns"] td {
  padding: 10px !important;
  color: #08090d !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view="campaigns"] tbody tr:nth-child(odd) {
  background: rgba(103, 213, 232, 0.16);
}

body.app-mode[data-active-view="queue"] .queue-list-large {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px !important;
  margin-top: 0;
}

body.app-mode[data-active-view="queue"] .queue-list-large li {
  min-height: 76px;
  padding: 11px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.36), transparent 62%),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li.selected {
  outline: 3px solid #08090d;
  outline-offset: 3px;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n + 1) {
  background-color: #dfff3f !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n + 2) {
  background-color: #83d7e7 !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n + 3) {
  background-color: #f0a8ff !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n) {
  background-color: #ffb84d !important;
}

body.app-mode[data-active-view="queue"] .queue-meta span,
body.app-mode[data-active-view="queue"] .queue-actions strong {
  color: #08090d !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="queue"] .queue-meta small,
body.app-mode[data-active-view="queue"] .queue-receipt {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-lane {
  gap: 5px !important;
  margin-top: 5px !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip {
  max-width: 100%;
  min-height: 21px;
  padding: 4px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  color: #08090d;
  background: rgba(255, 247, 237, 0.72);
  box-shadow: 1px 1px 0 #08090d;
  font-size: 8.5px;
  font-weight: 900;
  letter-spacing: 0;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip.next {
  background: #69e6a3;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip.outcome {
  background: #83d7e7;
}

body.app-mode[data-active-view="queue"] .queue-actions button {
  min-height: 26px !important;
  padding: 5px 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 6px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 9px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .approve {
  background: #69e6a3 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .retry {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .reject {
  background: #ef5350 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .details {
  background: #f7dec4 !important;
}

body.app-mode[data-active-view="queue"] .queue-meta [data-queue-open] {
  cursor: pointer;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 58%),
    #fff7ed;
  color: #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer.empty {
  min-height: 86px;
  align-content: center;
  background: rgba(255, 247, 237, 0.78);
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer.empty strong,
body.app-mode[data-active-view="queue"] .queue-detail-header strong {
  display: block;
  color: #08090d;
  font-size: 15px;
  line-height: 1.12;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer small,
body.app-mode[data-active-view="queue"] .queue-detail-drawer span {
  color: rgba(8, 9, 13, 0.72);
}

body.app-mode[data-active-view="queue"] .queue-detail-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

body.app-mode[data-active-view="queue"] .queue-detail-close,
body.app-mode[data-active-view="queue"] .queue-detail-actions button {
  min-height: 28px;
  padding: 6px 9px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  font-size: 9px;
  font-weight: 900;
  box-shadow: 2px 2px 0 #08090d;
  cursor: pointer;
}

body.app-mode[data-active-view="queue"] .queue-detail-receipt {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(120px, 0.75fr);
  gap: 6px;
  padding: 9px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #dfff3f;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="queue"] .queue-detail-receipt span,
body.app-mode[data-active-view="queue"] .queue-detail-receipt b,
body.app-mode[data-active-view="queue"] .queue-detail-receipt small {
  min-width: 0;
  color: #08090d;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="queue"] .queue-detail-receipt b {
  font-size: 13px;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid,
body.app-mode[data-active-view="queue"] .queue-proof-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid article,
body.app-mode[data-active-view="queue"] .queue-proof-strip article {
  display: grid;
  gap: 3px;
  min-height: 62px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(255, 247, 237, 0.84);
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid article span,
body.app-mode[data-active-view="queue"] .queue-proof-strip article span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid article strong,
body.app-mode[data-active-view="queue"] .queue-proof-strip article strong {
  color: #08090d;
  font-size: 10px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="queue"] .queue-proof-strip article small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 9px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="queue"] .queue-history {
  display: grid;
  gap: 6px;
}

body.app-mode[data-active-view="queue"] .queue-history article {
  display: grid;
  grid-template-columns: minmax(78px, 0.35fr) minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #83d7e7;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="queue"] .queue-history b,
body.app-mode[data-active-view="queue"] .queue-history article span,
body.app-mode[data-active-view="queue"] .queue-history article small {
  min-width: 0;
  color: #08090d;
  font-size: 9px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="queue"] .queue-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

body.app-mode[data-active-view="queue"] .queue-detail-actions .approve {
  background: #69e6a3;
}

body.app-mode[data-active-view="queue"] .queue-detail-actions .reject {
  background: #ef5350;
}

body.app-mode[data-active-view="queue"] .queue-detail-actions .retry {
  background: #67d5e8;
}

/* Queue page polish: stop status cards from stretching with the full list. */
body.app-mode[data-active-view="queue"] .queue-agent-console {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.48fr) !important;
  grid-template-areas:
    "queue-response queue-stats"
    "queue-detail queue-detail"
    "queue-list queue-list" !important;
  align-items: start !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
}

body.app-mode[data-active-view="queue"] .queue-left-stack {
  display: contents !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response {
  grid-area: queue-response !important;
  align-content: start !important;
  gap: 8px !important;
  min-height: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(8, 9, 13, 0.18) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.14), transparent 55%),
    rgba(255, 250, 240, 0.92) !important;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.08) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response > .eyebrow {
  color: rgba(8, 9, 13, 0.54) !important;
  font-size: 9px !important;
  font-weight: 850 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response > strong {
  color: #08090d !important;
  font-size: 18px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response > small {
  max-width: 88ch;
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-side {
  grid-area: queue-stats !important;
  display: block !important;
  align-self: start !important;
  min-height: 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  min-height: 0 !important;
  height: auto !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article {
  min-height: 74px !important;
  align-content: start !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 14px !important;
  margin-top: 8px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(8, 9, 13, 0.14) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations article {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 8px !important;
  min-height: 0 !important;
  padding: 7px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(8, 9, 13, 0.10) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations article strong {
  display: block !important;
  overflow: visible !important;
  color: rgba(8, 9, 13, 0.82) !important;
  font-size: 10.5px !important;
  font-weight: 720 !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations article span {
  display: inline-grid !important;
  place-items: center !important;
  width: 22px !important;
  height: 22px !important;
  border: 1px solid rgba(8, 9, 13, 0.22) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: rgba(8, 9, 13, 0.62) !important;
  font-size: 8px !important;
  font-weight: 850 !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large {
  grid-area: queue-list !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(8, 9, 13, 0.14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li {
  grid-template-columns: minmax(0, 1fr) minmax(172px, auto) !important;
  align-items: center !important;
  min-height: 76px !important;
  margin: 0 !important;
  padding: 12px 4px 12px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(8, 9, 13, 0.12) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n + 1),
body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n + 2),
body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n + 3),
body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(4n) {
  background: transparent !important;
  background-color: transparent !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:hover {
  background: rgba(255, 255, 255, 0.58) !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li[data-status="needs-approval"],
body.app-mode[data-active-view="queue"] .queue-list-large li[data-status="human-review"] {
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-meta {
  min-width: 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-meta > span {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #08090d !important;
  font-size: 13px !important;
  font-weight: 780 !important;
  line-height: 1.18 !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="queue"] .queue-meta small {
  display: block !important;
  overflow: hidden !important;
  max-width: 100% !important;
  color: rgba(8, 9, 13, 0.58) !important;
  font-size: 10px !important;
  font-weight: 620 !important;
  line-height: 1.24 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-lane {
  display: none !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 4px !important;
  margin-top: 6px !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip {
  display: block !important;
  overflow: hidden !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(8, 9, 13, 0.54) !important;
  font-size: 9px !important;
  font-weight: 620 !important;
  line-height: 1.24 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="queue"] .queue-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  min-width: 172px !important;
}

body.app-mode[data-active-view="queue"] .queue-actions strong {
  width: auto !important;
  text-align: center !important;
}

body.app-mode[data-active-view="queue"] .queue-status-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  padding: 4px 9px !important;
  border: 1px solid rgba(8, 9, 13, 0.16) !important;
  border-radius: 999px !important;
  background: rgba(255, 183, 3, 0.18) !important;
  color: #6b3f00 !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-status-pill[data-status="ready"],
body.app-mode[data-active-view="queue"] .queue-status-pill[data-status="approved"],
body.app-mode[data-active-view="queue"] .queue-status-pill[data-status="scheduled"] {
  background: rgba(110, 231, 183, 0.20) !important;
  color: #065f46 !important;
}

body.app-mode[data-active-view="queue"] .queue-status-pill[data-status="failed"] {
  background: rgba(255, 122, 144, 0.18) !important;
  color: #9f1239 !important;
}

body.app-mode[data-active-view="queue"] .queue-status-pill[data-status="published"],
body.app-mode[data-active-view="queue"] .queue-status-pill[data-status="completed"] {
  background: rgba(103, 213, 232, 0.20) !important;
  color: #075985 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions button {
  min-height: 24px !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(8, 9, 13, 0.22) !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, 0.76) !important;
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .approve {
  background: rgba(110, 231, 183, 0.22) !important;
  color: #065f46 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .reject {
  background: rgba(255, 122, 144, 0.18) !important;
  color: #9f1239 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .details {
  background: rgba(103, 213, 232, 0.18) !important;
  color: #075985 !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer {
  grid-area: queue-detail !important;
  margin-top: 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer.empty {
  display: none !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="queue"] .queue-agent-console {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "queue-response"
      "queue-stats"
      "queue-detail"
      "queue-list" !important;
  }

  body.app-mode[data-active-view="queue"] .queue-list-large {
    max-height: min(560px, calc(100dvh - 330px)) !important;
  }

  body.app-mode[data-active-view="queue"] .queue-list-large li {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="queue"] .queue-actions {
    justify-content: flex-start !important;
    min-width: 0 !important;
  }

  body.app-mode[data-active-view="queue"] .queue-actions strong {
    width: auto !important;
    text-align: left !important;
  }

  body.app-mode[data-active-view="queue"] .queue-execution-lane {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-actions,
  body.app-mode[data-active-view="queue"] .queue-actions-panel,
  body.app-mode[data-active-view="campaigns"] .campaign-agent-console,
  body.app-mode[data-active-view="queue"] .queue-agent-console,
  body.app-mode[data-active-view="queue"] .queue-list-large {
    grid-template-columns: 1fr;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-agent-status-grid,
  body.app-mode[data-active-view="queue"] .queue-agent-status-grid,
  body.app-mode[data-active-view="queue"] .queue-detail-grid,
  body.app-mode[data-active-view="queue"] .queue-proof-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="queue"] .queue-detail-receipt,
  body.app-mode[data-active-view="queue"] .queue-history article {
    grid-template-columns: 1fr;
  }
}

/* Campaigns page cleanup: compact ledger, controlled color, sticky prompt only. */
body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"],
body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] {
  width: 100% !important;
  max-width: none !important;
  justify-items: stretch !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] > .full-panel {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  transform: none !important;
  min-height: 0 !important;
  align-content: start !important;
  padding: 14px !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 34%),
    linear-gradient(25deg, transparent 54%, rgba(103, 213, 232, 0.16)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] .panel-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  grid-template-rows: auto !important;
  align-items: center !important;
  align-content: start !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.60), rgba(223, 255, 63, 0.58) 58%, rgba(255, 250, 240, 0.96)) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] .panel-header > div:first-child {
  display: grid !important;
  gap: 3px !important;
  max-width: 520px !important;
  min-height: 0 !important;
  padding: 7px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] .panel-header h2 {
  color: #08090d !important;
  font-size: clamp(17px, 1.55vw, 22px) !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] .panel-header .eyebrow {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="campaigns"] #campaigns-new-button {
  min-height: 32px !important;
  padding: 6px 10px !important;
  font-size: 10px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="campaigns"] .table-shell {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
  border-width: 2px !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(255, 177, 94, 0.12), transparent 42%),
    rgba(255, 250, 240, 0.90) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-agent-console {
  display: none !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions button {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-height: 60px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 8px 10px !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions button:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions button:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions button:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions button:nth-child(4) {
  background: #ffb15e !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions span {
  justify-self: start !important;
  max-width: 100% !important;
  min-height: 20px !important;
  border: 2px solid rgba(8, 9, 13, 0.82) !important;
  border-radius: 999px !important;
  padding: 3px 7px !important;
  background: rgba(255, 250, 240, 0.72) !important;
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="campaigns"] .campaign-actions strong {
  color: #08090d !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="campaigns"] table {
  width: 100% !important;
  table-layout: fixed !important;
  border-width: 2px !important;
  border-radius: 8px !important;
  background: #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="campaigns"] th:nth-child(1),
body.app-mode[data-active-view="campaigns"] td:nth-child(1) {
  width: 21% !important;
}

body.app-mode[data-active-view="campaigns"] th:nth-child(2),
body.app-mode[data-active-view="campaigns"] td:nth-child(2) {
  width: 25% !important;
}

body.app-mode[data-active-view="campaigns"] th:nth-child(3),
body.app-mode[data-active-view="campaigns"] td:nth-child(3) {
  width: 18% !important;
}

body.app-mode[data-active-view="campaigns"] th:nth-child(4),
body.app-mode[data-active-view="campaigns"] td:nth-child(4) {
  width: 12% !important;
}

body.app-mode[data-active-view="campaigns"] th:nth-child(5),
body.app-mode[data-active-view="campaigns"] td:nth-child(5),
body.app-mode[data-active-view="campaigns"] th:nth-child(6),
body.app-mode[data-active-view="campaigns"] td:nth-child(6),
body.app-mode[data-active-view="campaigns"] th:nth-child(7),
body.app-mode[data-active-view="campaigns"] td:nth-child(7) {
  width: 8% !important;
}

body.app-mode[data-active-view="campaigns"] th,
body.app-mode[data-active-view="campaigns"] td {
  max-width: 100% !important;
  padding: 9px 10px !important;
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.22 !important;
  overflow-wrap: anywhere !important;
  vertical-align: top !important;
}

body.app-mode[data-active-view="campaigns"] th {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.30), rgba(223, 255, 63, 0.30)),
    #fffaf0 !important;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 9.5px !important;
  font-weight: 950 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="campaigns"] tbody tr:nth-child(odd) {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.22) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
}

body.app-mode[data-active-view="campaigns"] tbody tr:nth-child(even) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.28) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
}

body.app-mode[data-active-view="campaigns"] td:first-child strong {
  display: block !important;
  max-width: 100% !important;
  color: #08090d !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="campaigns"] td:nth-child(3) {
  color: rgba(8, 9, 13, 0.76) !important;
}

body.app-mode[data-active-view="campaigns"] td:nth-child(5) {
  font-weight: 950 !important;
}

body.app-mode[data-active-view="campaigns"] td .badge {
  max-width: 100% !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="campaigns"] .table-action {
  min-height: 28px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 5px 8px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

@media (max-width: 1100px) {
  body.app-mode[data-active-view="campaigns"] .campaign-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] .panel-header {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="campaigns"] .campaign-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] tbody tr {
    background:
      linear-gradient(90deg, rgba(103, 213, 232, 0.22) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
  }

  body.app-mode[data-active-view="campaigns"] [data-view-section="campaigns"] td {
    overflow-wrap: anywhere !important;
  }
}

/* Queue operator final pass: open page flow, compact stats, calmer report modal. */
body.app-mode[data-active-view="queue"] .queue-agent-console {
  grid-template-columns: minmax(0, 0.98fr) minmax(340px, 0.48fr) !important;
  gap: 14px !important;
  margin: 12px 0 18px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response {
  position: relative !important;
  overflow: hidden !important;
  gap: 10px !important;
  padding: 14px 16px 12px !important;
  border: 1px solid rgba(8, 9, 13, 0.14) !important;
  border-radius: 12px !important;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 38%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 70%),
    rgba(255, 255, 255, 0.76) !important;
  box-shadow: 0 14px 34px rgba(8, 9, 13, 0.06) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: linear-gradient(180deg, #67d5e8, #dfff3f 55%, #ffb703);
}

body.app-mode[data-active-view="queue"] .queue-agent-response > .eyebrow {
  color: rgba(8, 9, 13, 0.48) !important;
  font-size: 8.5px !important;
  letter-spacing: 0.02em !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response > strong {
  max-width: 24ch !important;
  color: #08090d !important;
  font-size: clamp(17px, 1.35vw, 21px) !important;
  font-weight: 850 !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-response > small {
  max-width: 78ch !important;
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 11px !important;
  font-weight: 620 !important;
  line-height: 1.42 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article,
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(1),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(2),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(3),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(4),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(5),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(6) {
  min-height: 58px !important;
  padding: 9px 10px !important;
  border: 1px solid rgba(8, 9, 13, 0.14) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 8px 20px rgba(8, 9, 13, 0.05) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(2),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(255, 183, 3, 0.16), transparent 62%),
    rgba(255, 255, 255, 0.82) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(4),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(6) {
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.16), transparent 62%),
    rgba(255, 255, 255, 0.82) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(5) {
  background:
    linear-gradient(135deg, rgba(255, 122, 144, 0.14), transparent 62%),
    rgba(255, 255, 255, 0.82) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid span {
  color: rgba(8, 9, 13, 0.48) !important;
  font-size: 8.5px !important;
  font-weight: 850 !important;
  letter-spacing: 0.02em !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid strong {
  color: #08090d !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid small {
  color: rgba(8, 9, 13, 0.58) !important;
  font-size: 9.5px !important;
  font-weight: 650 !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 14px !important;
  margin-top: 4px !important;
  padding-top: 10px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations article {
  padding: 8px 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-recommendations article strong {
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 10.5px !important;
  font-weight: 690 !important;
  line-height: 1.3 !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large {
  max-height: none !important;
  overflow: visible !important;
}

.dashboard-answer-dialog.is-queue-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-queue-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-answer-modal > header {
  padding: 11px 16px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-answer-modal h2 {
  font-size: clamp(16px, 1.2vw, 20px);
}

.dashboard-answer-dialog.is-queue-answer .queue-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 52%),
    linear-gradient(35deg, rgba(223, 255, 63, 0.18), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-queue-answer .queue-report-hero h3 {
  max-width: 32ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-queue-answer .queue-report-score {
  min-width: 96px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(223, 255, 63, 0.74);
  box-shadow: none;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-section {
  gap: 9px;
  padding: 12px;
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-section header p {
  font-size: 12px;
  font-weight: 650;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-metric {
  min-height: 82px;
  padding: 10px;
  border-color: rgba(8, 9, 13, 0.14);
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-metric strong {
  font-size: 15px;
  font-weight: 820;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-metric small {
  font-size: 10px;
  font-weight: 620;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-insight {
  min-height: 108px;
  padding: 12px;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-insight p {
  color: rgba(8, 9, 13, 0.76);
  font-size: 12.5px;
  font-weight: 670;
  line-height: 1.34;
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 54%),
    rgba(255, 255, 255, 0.82);
}

.dashboard-answer-dialog.is-queue-answer .dashboard-report-action-plan ol {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  display: grid;
  padding-left: 0;
  list-style-position: inside;
}

@media (max-width: 980px) {
  body.app-mode[data-active-view="queue"] .queue-agent-recommendations,
  .dashboard-answer-dialog.is-queue-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-queue-answer .dashboard-report-rows,
  .dashboard-answer-dialog.is-queue-answer .dashboard-report-action-plan ol {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .dashboard-answer-dialog.is-queue-answer .dashboard-report-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Queue page cleanup: compact approvals, balanced color, sticky prompt only. */
body.app-mode[data-active-view="queue"] [data-view-section="queue"],
body.app-mode[data-active-view="queue"] [data-view-section="queue"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] {
  width: 100% !important;
  max-width: none !important;
  justify-items: stretch !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] > .full-panel {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  min-height: 0 !important;
  align-content: start !important;
  padding: 14px !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 36%),
    linear-gradient(24deg, transparent 54%, rgba(223, 255, 63, 0.18)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .panel-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(230px, max-content) !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.66), rgba(103, 213, 232, 0.48) 56%, rgba(255, 250, 240, 0.96)) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .panel-header > div:first-child {
  display: grid !important;
  gap: 3px !important;
  max-width: 560px !important;
  padding: 7px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .panel-header h2 {
  color: #08090d !important;
  font-size: clamp(17px, 1.55vw, 22px) !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .panel-header .eyebrow {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .mode-control.inline {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 4px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.82) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .mode-control .mode {
  min-height: 30px !important;
  border-width: 2px !important;
  border-radius: 5px !important;
  padding: 5px 9px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: none !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] .mode-control .mode.active {
  background: #dfff3f !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="queue"] .filter-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(185, 167, 255, 0.20), rgba(255, 250, 240, 0.92)),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="queue"] .filter-row label {
  display: grid !important;
  gap: 5px !important;
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 9.5px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="queue"] .filter-row select {
  width: 100% !important;
  min-height: 34px !important;
  padding: 6px 28px 6px 9px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel button {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-height: 60px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 8px 9px !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(4) {
  background: #ffb15e !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(5) {
  background: #c9f7d6 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel span {
  justify-self: start !important;
  max-width: 100% !important;
  min-height: 20px !important;
  border: 2px solid rgba(8, 9, 13, 0.82) !important;
  border-radius: 999px !important;
  padding: 3px 7px !important;
  background: rgba(255, 250, 240, 0.72) !important;
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="queue"] .queue-actions-panel strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-console {
  display: none !important;
}

body.app-mode[data-active-view="queue"] .queue-workspace-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(248px, 0.36fr) !important;
  gap: 12px !important;
  align-items: start !important;
  width: 100% !important;
}

body.app-mode[data-active-view="queue"] .queue-work-panel,
body.app-mode[data-active-view="queue"] .queue-status-panel {
  display: grid !important;
  gap: 10px !important;
  min-height: 0 !important;
  padding: 12px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 42%),
    rgba(255, 250, 240, 0.92) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="queue"] .queue-status-panel {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 44%),
    rgba(255, 250, 240, 0.94) !important;
}

body.app-mode[data-active-view="queue"] .queue-section-heading {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(130px, 0.7fr) !important;
  gap: 10px !important;
  align-items: start !important;
}

body.app-mode[data-active-view="queue"] .queue-section-heading > div {
  display: grid !important;
  gap: 3px !important;
}

body.app-mode[data-active-view="queue"] .queue-section-heading strong {
  color: #08090d !important;
  font-size: 15px !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-section-heading small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10.5px !important;
  line-height: 1.24 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-status-panel .queue-section-heading {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article,
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(1),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(2),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(3),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(4),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(5),
body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(6) {
  display: grid !important;
  gap: 3px !important;
  min-height: 58px !important;
  padding: 8px 9px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #fffaf0 !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(4) {
  background: #c9f7d6 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(5) {
  background: #ffd6d6 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid article:nth-child(6) {
  background: #ffdfae !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid strong {
  color: #08090d !important;
  font-size: 15px !important;
  line-height: 1.02 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-agent-status-grid small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 9px !important;
  line-height: 1.16 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large {
  display: grid !important;
  grid-area: auto !important;
  gap: 8px !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(186px, max-content) !important;
  gap: 10px !important;
  align-items: start !important;
  min-height: 0 !important;
  padding: 9px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.28) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li:nth-child(even) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.34) 0 6px, rgba(255, 250, 240, 0.98) 6px 100%) !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li.selected {
  outline: 3px solid #b9a7ff !important;
  outline-offset: 1px !important;
}

body.app-mode[data-active-view="queue"] .queue-list-large li.empty-state {
  grid-template-columns: minmax(0, 1fr) !important;
  padding: 12px !important;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="queue"] .queue-meta {
  display: grid !important;
  gap: 4px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-meta span {
  color: #08090d !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-meta small,
body.app-mode[data-active-view="queue"] .queue-receipt {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10.5px !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
  text-overflow: clip !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-lane {
  gap: 5px !important;
  margin-top: 3px !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip {
  min-height: 22px !important;
  padding: 4px 7px !important;
  border: 2px solid rgba(8, 9, 13, 0.62) !important;
  background: rgba(255, 250, 240, 0.82) !important;
  color: #08090d !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip.next {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="queue"] .queue-execution-chip.outcome {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-end !important;
  align-content: start !important;
  gap: 5px !important;
  width: max-content !important;
  max-width: 230px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions strong {
  min-height: 24px !important;
  max-width: 100% !important;
  padding: 5px 7px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 1px 1px 0 rgba(8, 9, 13, 0.8) !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="queue"] .queue-actions button {
  min-height: 26px !important;
  padding: 5px 7px !important;
  border-width: 2px !important;
  border-radius: 6px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .approve {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .reject {
  background: #ffd6d6 !important;
}

body.app-mode[data-active-view="queue"] .queue-actions .retry {
  background: #ffdfae !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer {
  display: grid !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(185, 167, 255, 0.14), transparent 42%),
    rgba(255, 250, 240, 0.94) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer.empty strong,
body.app-mode[data-active-view="queue"] .queue-detail-header strong {
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-drawer.empty small,
body.app-mode[data-active-view="queue"] .queue-detail-header small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10.5px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  gap: 8px !important;
  align-items: start !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-close,
body.app-mode[data-active-view="queue"] .queue-detail-actions button {
  min-height: 28px !important;
  padding: 5px 8px !important;
  border-width: 2px !important;
  border-radius: 6px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-receipt,
body.app-mode[data-active-view="queue"] .queue-detail-grid,
body.app-mode[data-active-view="queue"] .queue-proof-strip,
body.app-mode[data-active-view="queue"] .queue-history article {
  gap: 7px !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid article,
body.app-mode[data-active-view="queue"] .queue-proof-strip article {
  min-height: 0 !important;
  padding: 8px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.92) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid span,
body.app-mode[data-active-view="queue"] .queue-proof-strip span,
body.app-mode[data-active-view="queue"] .queue-history .eyebrow {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="queue"] .queue-detail-grid strong,
body.app-mode[data-active-view="queue"] .queue-proof-strip strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="queue"] .queue-proof-strip small,
body.app-mode[data-active-view="queue"] .queue-history span,
body.app-mode[data-active-view="queue"] .queue-history small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 9.5px !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 1100px) {
  body.app-mode[data-active-view="queue"] .queue-actions-panel {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(4),
  body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(5) {
    grid-column: auto !important;
  }

  body.app-mode[data-active-view="queue"] .queue-workspace-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="queue"] [data-view-section="queue"] .panel-header,
  body.app-mode[data-active-view="queue"] .filter-row,
  body.app-mode[data-active-view="queue"] .queue-workspace-grid,
  body.app-mode[data-active-view="queue"] .queue-section-heading,
  body.app-mode[data-active-view="queue"] .queue-list-large li,
  body.app-mode[data-active-view="queue"] .queue-detail-header {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="queue"] .queue-actions-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="queue"] .queue-actions-panel button:nth-child(5) {
    grid-column: 1 / -1 !important;
  }

  body.app-mode[data-active-view="queue"] .queue-actions {
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Connections compact operator pass. */
body.app-mode[data-active-view="connections"] .full-panel {
  padding: 16px !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 10px 0 12px !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button {
  min-height: 70px !important;
  padding: 9px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button strong {
  font-size: 11px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button small {
  font-size: 9px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-console {
  display: grid !important;
  grid-template-columns: minmax(0, 1.02fr) minmax(340px, 0.8fr) !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-side {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 9px !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-response,
body.app-mode[data-active-view="connections"] .connection-agent-form {
  padding: 12px !important;
  border-width: 2px !important;
  border-radius: 8px !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-response strong {
  font-size: 17px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-response small,
body.app-mode[data-active-view="connections"] .connection-agent-recommendations strong,
body.app-mode[data-active-view="connections"] .connection-agent-status-grid small {
  font-size: 10px !important;
  line-height: 1.3 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-recommendations {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin-top: 9px !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-recommendations article {
  min-height: 40px !important;
  padding: 7px 9px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-recommendations article:first-child {
  grid-column: span 2;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-bottom: 0 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article {
  min-height: 56px !important;
  padding: 7px 8px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid strong {
  font-size: 16px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-form textarea {
  min-height: 66px !important;
  padding: 10px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 8px;
}

body.app-mode[data-active-view="connections"] .connection-agent-shortcuts button,
body.app-mode[data-active-view="connections"] .connection-agent-form .agent-submit-button {
  min-height: 30px !important;
  padding: 7px 10px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  font-size: 10px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-form .agent-submit-button {
  float: right;
  margin-top: 8px;
  background: #69e6a3 !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  margin: 4px 0 12px;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding: 7px 9px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  cursor: pointer;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(2) {
  background: #67d5e8;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(3) {
  background: #f0a8ff;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(4) {
  background: #dfff3f;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(5) {
  background: #ffb84d;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(6) {
  background: #ef5350;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button.active {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0 #08090d;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar span {
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar strong {
  font-size: 14px;
}

body.app-mode[data-active-view="connections"] .connection-grid {
  display: block !important;
  column-count: 3;
  column-gap: 10px;
}

body.app-mode[data-active-view="connections"] .connection-card,
body.app-mode[data-active-view="connections"] .connection-empty-state {
  display: grid;
  gap: 8px;
  width: 100%;
  margin: 0 0 10px;
  break-inside: avoid;
  page-break-inside: avoid;
  min-height: 0 !important;
  padding: 12px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  box-shadow: 4px 4px 0 #08090d !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-card-publishing {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%), #67d5e8 !important;
}

body.app-mode[data-active-view="connections"] .connection-card-ads {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%), #f0a8ff !important;
}

body.app-mode[data-active-view="connections"] .connection-card-seo {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%), #dfff3f !important;
}

body.app-mode[data-active-view="connections"] .connection-card-community {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%), #ffb84d !important;
}

body.app-mode[data-active-view="connections"] .connection-card.needs-setup {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.54), transparent 64%), #fff7ed !important;
}

body.app-mode[data-active-view="connections"] .connection-card.connected {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.34), transparent 62%), #69e6a3 !important;
}

body.app-mode[data-active-view="connections"] .connection-card header {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  justify-content: space-between;
}

body.app-mode[data-active-view="connections"] .connection-card h3 {
  margin: 0;
  font-size: 16px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="connections"] .connection-card p {
  margin: 0;
  min-height: 34px;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

body.app-mode[data-active-view="connections"] .connection-card small {
  font-size: 10px !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view="connections"] .connection-card .badge {
  white-space: nowrap;
  border: 2px solid #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 9px !important;
}

body.app-mode[data-active-view="connections"] .connection-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.app-mode[data-active-view="connections"] .connection-card-actions button,
body.app-mode[data-active-view="connections"] .connection-setup-details summary,
body.app-mode[data-active-view="connections"] .linkedin-target-picker button,
body.app-mode[data-active-view="connections"] .telegram-connect-form button,
body.app-mode[data-active-view="connections"] .connection-setup-form button {
  min-height: 28px !important;
  padding: 6px 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 6px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-card-actions button:first-child {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-details {
  border: 0;
  max-width: 100%;
}

body.app-mode[data-active-view="connections"] .connection-setup-details summary {
  display: inline-grid;
  place-items: center;
  width: fit-content;
  cursor: pointer;
  list-style: none;
}

body.app-mode[data-active-view="connections"] .connection-setup-details summary::-webkit-details-marker {
  display: none;
}

body.app-mode[data-active-view="connections"] .connection-setup-form,
body.app-mode[data-active-view="connections"] .telegram-connect-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 7px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(255, 247, 237, 0.88);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="connections"] .connection-setup-form label {
  display: grid;
  gap: 4px;
}

body.app-mode[data-active-view="connections"] .connection-setup-form label span {
  font-size: 9px;
  font-weight: 900;
  text-transform: uppercase;
}

body.app-mode[data-active-view="connections"] .connection-setup-form input,
body.app-mode[data-active-view="connections"] .connection-setup-form select,
body.app-mode[data-active-view="connections"] .telegram-connect-form input {
  min-height: 30px !important;
  padding: 6px 8px !important;
  font-size: 11px !important;
  border-radius: 6px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form div,
body.app-mode[data-active-view="connections"] .telegram-connect-form div {
  display: flex;
  gap: 6px;
  align-items: end;
}

body.app-mode[data-active-view="connections"] .linkedin-target-picker {
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: rgba(255, 247, 237, 0.76);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="connections"] .linkedin-target-picker label {
  display: grid;
  gap: 4px;
}

body.app-mode[data-active-view="connections"] .connection-empty-state {
  grid-column: 1 / -1;
  min-height: 120px !important;
  align-content: center;
  background: #fff7ed !important;
}

/* Connections Polxy dock and UI polish. */
.connection-agent-dock {
  display: none;
}

body.app-mode[data-active-view="connections"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="connections"] .connection-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-mode,
body.app-mode[data-active-view="connections"] .connection-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="connections"] .connection-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-mode button,
body.app-mode[data-active-view="connections"] .connection-agent-options button,
body.app-mode[data-active-view="connections"] .connection-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-mode button.active,
body.app-mode[data-active-view="connections"] .connection-agent-send {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-dock.is-running {
  outline: 3px solid #dfff3f;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-connection-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-connection-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-answer-modal h2 {
  font-size: clamp(16px, 1.2vw, 20px);
}

.dashboard-answer-dialog.is-connection-answer .connection-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 52%),
    linear-gradient(35deg, rgba(223, 255, 63, 0.18), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-connection-answer .connection-report-hero h3 {
  max-width: 32ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-connection-answer .connection-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(103, 213, 232, 0.74);
  box-shadow: none;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-connection-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-section,
.dashboard-answer-dialog.is-connection-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-metric {
  min-height: 82px;
  padding: 10px;
  border-color: rgba(8, 9, 13, 0.14);
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-metric strong {
  font-size: 15px;
  font-weight: 820;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-metric small,
.dashboard-answer-dialog.is-connection-answer .dashboard-report-section header p {
  font-size: 10.5px;
  font-weight: 620;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-insight {
  min-height: 108px;
  padding: 12px;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-insight p {
  color: rgba(8, 9, 13, 0.76);
  font-size: 12.5px;
  font-weight: 670;
  line-height: 1.34;
}

.dashboard-answer-dialog.is-connection-answer .dashboard-report-action-plan ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-left: 0;
  list-style-position: inside;
}

@media (max-width: 1280px) {
  body.app-mode[data-active-view="connections"] .connection-action-board,
  body.app-mode[data-active-view="connections"] .connection-filter-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-console {
    grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.75fr) !important;
  }

  body.app-mode[data-active-view="connections"] .connection-grid {
    column-count: 2;
  }
}

@media (max-width: 960px) {
  body.app-mode[data-active-view="connections"] .connection-agent-console {
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="connections"] .connection-grid {
    column-count: 1;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-recommendations {
    grid-template-columns: 1fr !important;
  }

body.app-mode[data-active-view="connections"] .connection-agent-recommendations article:first-child {
  grid-column: auto;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="connections"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="connections"] [data-view-section="connections"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-mode button,
  body.app-mode[data-active-view="connections"] .connection-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-connection-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-connection-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-connection-answer .dashboard-report-rows,
  .dashboard-answer-dialog.is-connection-answer .dashboard-report-action-plan ol {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Connections page cleanup: compact adapters, balanced color, sticky prompt only. */
body.app-mode[data-active-view="connections"] [data-view-section="connections"],
body.app-mode[data-active-view="connections"] [data-view-section="connections"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] {
  width: 100% !important;
  max-width: none !important;
  justify-items: stretch !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] > .full-panel {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  transform: none !important;
  min-height: 0 !important;
  align-content: start !important;
  padding: 14px !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 35%),
    linear-gradient(28deg, transparent 58%, rgba(223, 255, 63, 0.16)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.58), rgba(223, 255, 63, 0.54) 56%, rgba(255, 250, 240, 0.96)) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header > div:first-child {
  display: grid !important;
  gap: 3px !important;
  max-width: 560px !important;
  padding: 7px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header h2 {
  color: #08090d !important;
  font-size: clamp(17px, 1.55vw, 22px) !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header .eyebrow {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header > .badge {
  justify-self: end !important;
  min-height: 28px !important;
  padding: 5px 9px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  background: #c9f7d6 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-height: 62px !important;
  padding: 8px 9px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button:nth-child(4) {
  background: #ffdfae !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button:nth-child(5) {
  background: #fffaf0 !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board button:nth-child(6) {
  background: #c9f7d6 !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board span {
  justify-self: start !important;
  max-width: 100% !important;
  min-height: 20px !important;
  border: 2px solid rgba(8, 9, 13, 0.82) !important;
  border-radius: 999px !important;
  padding: 3px 7px !important;
  background: rgba(255, 250, 240, 0.72) !important;
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 8.5px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board strong {
  color: #08090d !important;
  font-size: 10.5px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-action-board small {
  color: rgba(8, 9, 13, 0.70) !important;
  font-size: 8.8px !important;
  line-height: 1.18 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-console {
  display: none !important;
}

body.app-mode[data-active-view="connections"] .connection-readiness-panel {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(185, 167, 255, 0.12), transparent 42%),
    rgba(255, 250, 240, 0.94) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="connections"] .connection-section-heading {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.46fr) !important;
  gap: 10px !important;
  align-items: start !important;
}

body.app-mode[data-active-view="connections"] .connection-section-heading > div {
  display: grid !important;
  gap: 3px !important;
}

body.app-mode[data-active-view="connections"] .connection-section-heading strong {
  color: #08090d !important;
  font-size: 15px !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-section-heading small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10.5px !important;
  line-height: 1.24 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article,
body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(1),
body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(2),
body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(3),
body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(4),
body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(5),
body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(6) {
  display: grid !important;
  gap: 3px !important;
  min-height: 58px !important;
  padding: 8px 9px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #fffaf0 !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(3) {
  background: #ffdfae !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(4) {
  background: #c9f7d6 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(5) {
  background: #ffd6d6 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid article:nth-child(6) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid strong {
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.02 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-agent-status-grid small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 8.5px !important;
  line-height: 1.16 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 34px !important;
  padding: 6px 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(2),
body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(3),
body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(4),
body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(5),
body.app-mode[data-active-view="connections"] .connection-filter-bar button:nth-child(6) {
  background: #fffaf0 !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar button.active {
  background: #dfff3f !important;
  transform: none !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 9px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="connections"] .connection-filter-bar strong {
  color: #08090d !important;
  font-size: 12px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="connections"] .connection-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: start !important;
  width: 100% !important;
  column-count: auto !important;
  column-gap: 0 !important;
}

body.app-mode[data-active-view="connections"] .connection-card,
body.app-mode[data-active-view="connections"] .connection-empty-state {
  --connection-accent: #67d5e8;
  --connection-soft: #eefcff;
  --connection-button: #e2f8ff;
  --connection-badge: #fffaf0;
  position: relative !important;
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 11px !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, var(--connection-accent) 0 8px, transparent 8px),
    linear-gradient(135deg, var(--connection-soft) 0%, rgba(255, 250, 240, 0.98) 74%) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="connections"] .connection-card-publishing {
  --connection-accent: #67d5e8;
  --connection-soft: #e9fbff;
  --connection-button: #dcf8ff;
}

body.app-mode[data-active-view="connections"] .connection-card-ads {
  --connection-accent: #b9a7ff;
  --connection-soft: #f3efff;
  --connection-button: #e9e1ff;
}

body.app-mode[data-active-view="connections"] .connection-card-seo {
  --connection-accent: #dfff3f;
  --connection-soft: #f5ffd9;
  --connection-button: #edff9d;
}

body.app-mode[data-active-view="connections"] .connection-card-community {
  --connection-accent: #ffdfae;
  --connection-soft: #fff2dd;
  --connection-button: #ffe3b8;
}

body.app-mode[data-active-view="connections"] .connection-card.needs-setup {
  --connection-badge: #ffdede;
  background:
    linear-gradient(90deg, var(--connection-accent) 0 8px, transparent 8px),
    linear-gradient(135deg, var(--connection-soft) 0%, rgba(255, 250, 240, 0.98) 74%) !important;
}

body.app-mode[data-active-view="connections"] .connection-card.connected {
  --connection-badge: #d7f8df;
  background:
    linear-gradient(90deg, var(--connection-accent) 0 8px, transparent 8px),
    linear-gradient(135deg, var(--connection-soft) 0%, rgba(255, 250, 240, 0.98) 74%) !important;
}

body.app-mode[data-active-view="connections"] .connection-platform-instagram {
  --connection-accent: #ff6b8a;
  --connection-soft: #fff0f4;
  --connection-button: #ffdce6;
}

body.app-mode[data-active-view="connections"] .connection-platform-facebook {
  --connection-accent: #1877f2;
  --connection-soft: #edf5ff;
  --connection-button: #dcecff;
}

body.app-mode[data-active-view="connections"] .connection-platform-x {
  --connection-accent: #15171a;
  --connection-soft: #f2f4f7;
  --connection-button: #e7eaee;
}

body.app-mode[data-active-view="connections"] .connection-platform-tiktok {
  --connection-accent: #25f4ee;
  --connection-soft: #efffff;
  --connection-button: #d7fbff;
}

body.app-mode[data-active-view="connections"] .connection-platform-linkedin {
  --connection-accent: #0a66c2;
  --connection-soft: #eaf4ff;
  --connection-button: #d7ebff;
}

body.app-mode[data-active-view="connections"] .connection-platform-youtube {
  --connection-accent: #ff3b30;
  --connection-soft: #fff0ee;
  --connection-button: #ffdedb;
}

body.app-mode[data-active-view="connections"] .connection-platform-telegram {
  --connection-accent: #2aabee;
  --connection-soft: #e9f8ff;
  --connection-button: #d8f2ff;
}

body.app-mode[data-active-view="connections"] .connection-platform-discord {
  --connection-accent: #5865f2;
  --connection-soft: #f0f1ff;
  --connection-button: #e1e4ff;
}

body.app-mode[data-active-view="connections"] .connection-platform-slack {
  --connection-accent: #36c5f0;
  --connection-soft: #fff7df;
  --connection-button: #ffe9a8;
}

body.app-mode[data-active-view="connections"] .connection-platform-meta-ads {
  --connection-accent: #7b61ff;
  --connection-soft: #f1edff;
  --connection-button: #e5ddff;
}

body.app-mode[data-active-view="connections"] .connection-platform-google-ads {
  --connection-accent: #34a853;
  --connection-soft: #effcf3;
  --connection-button: #daf6e3;
}

body.app-mode[data-active-view="connections"] .connection-platform-google-search {
  --connection-accent: #4285f4;
  --connection-soft: #f1f7ff;
  --connection-button: #dfeeff;
}

body.app-mode[data-active-view="connections"] .connection-card header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  gap: 8px !important;
  align-items: start !important;
}

body.app-mode[data-active-view="connections"] .connection-card h3 {
  margin: 0 !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="connections"] .connection-card p {
  min-height: 0 !important;
  margin: 0 !important;
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 10.5px !important;
  line-height: 1.26 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="connections"] .connection-card small {
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 9.5px !important;
  line-height: 1.18 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="connections"] .connection-card .badge {
  max-width: 116px !important;
  min-height: 22px !important;
  padding: 4px 7px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  background: var(--connection-badge) !important;
  color: #08090d !important;
  box-shadow: 1px 1px 0 rgba(8, 9, 13, 0.82) !important;
  font-size: 8px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="connections"] .connection-card .badge.live {
  background: #c9f7d6 !important;
}

body.app-mode[data-active-view="connections"] .connection-card-controls {
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.62fr) minmax(0, 0.95fr) minmax(0, 1.36fr) !important;
  gap: 4px !important;
  align-items: start !important;
  width: 100% !important;
}

body.app-mode[data-active-view="connections"] .connection-card-controls-short {
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 0.95fr) minmax(0, 1.45fr) !important;
}

body.app-mode[data-active-view="connections"] .connection-card-actions {
  display: contents !important;
}

body.app-mode[data-active-view="connections"] .connection-card-actions button,
body.app-mode[data-active-view="connections"] .connection-setup-details summary,
body.app-mode[data-active-view="connections"] .linkedin-target-picker button,
body.app-mode[data-active-view="connections"] .telegram-connect-form button,
body.app-mode[data-active-view="connections"] .connection-setup-form button {
  min-height: 26px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 5px 4px !important;
  border: 2px solid #08090d !important;
  border-radius: 6px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
  font-size: 7.5px !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="connections"] .connection-card-actions button:first-child {
  background: var(--connection-button) !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-details {
  display: grid !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-details[open] {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-details summary {
  list-style: none !important;
  cursor: pointer !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-details summary::-webkit-details-marker {
  display: none !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form,
body.app-mode[data-active-view="connections"] .telegram-connect-form,
body.app-mode[data-active-view="connections"] .linkedin-target-picker {
  display: grid !important;
  gap: 7px !important;
  margin-top: 5px !important;
  padding: 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 250, 240, 0.92) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form div,
body.app-mode[data-active-view="connections"] .telegram-connect-form div {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: end !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form label {
  display: grid !important;
  gap: 4px !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form label span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="connections"] .connection-setup-form input,
body.app-mode[data-active-view="connections"] .connection-setup-form select,
body.app-mode[data-active-view="connections"] .telegram-connect-form input {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 30px !important;
  padding: 6px 8px !important;
  border-width: 2px !important;
  border-radius: 6px !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
  font-size: 10px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.app-mode[data-active-view="connections"] .connection-empty-state {
  grid-column: 1 / -1 !important;
  align-content: center !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="connections"] .connection-action-board,
  body.app-mode[data-active-view="connections"] .connection-filter-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="connections"] .connection-agent-status-grid,
  body.app-mode[data-active-view="connections"] .connection-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header,
  body.app-mode[data-active-view="connections"] .connection-section-heading,
  body.app-mode[data-active-view="connections"] .connection-card header,
  body.app-mode[data-active-view="connections"] .connection-setup-form {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="connections"] .connection-action-board,
  body.app-mode[data-active-view="connections"] .connection-filter-bar,
  body.app-mode[data-active-view="connections"] .connection-agent-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="connections"] .connection-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="connections"] [data-view-section="connections"] .panel-header > .badge {
    justify-self: start !important;
  }
}

/* Analytics Polxy dock: sticky performance, experiment, scale, and claim prompt. */
.analytics-agent-dock {
  display: none;
}

body.app-mode[data-active-view="analytics"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="analytics"] .analytics-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-mode,
body.app-mode[data-active-view="analytics"] .analytics-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-mode button,
body.app-mode[data-active-view="analytics"] .analytics-agent-options button,
body.app-mode[data-active-view="analytics"] .analytics-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-mode button.active,
body.app-mode[data-active-view="analytics"] .analytics-agent-send {
  background: #f0a8ff !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-analytics-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-analytics-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-analytics-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-analytics-answer .analytics-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.18), transparent 52%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-analytics-answer .analytics-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-analytics-answer .analytics-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(240, 168, 255, 0.72);
  box-shadow: none;
}

.dashboard-answer-dialog.is-analytics-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-analytics-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-analytics-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-analytics-answer .dashboard-report-section,
.dashboard-answer-dialog.is-analytics-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="analytics"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="analytics"] .analytics-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="analytics"] .analytics-agent-mode button,
  body.app-mode[data-active-view="analytics"] .analytics-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="analytics"] .analytics-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="analytics"] .analytics-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-analytics-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-analytics-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-analytics-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Analytics page cleanup: compact evidence layout, balanced color, sticky prompt only. */
body.app-mode[data-active-view="analytics"] [data-view-section="analytics"],
body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] {
  width: 100% !important;
  max-width: none !important;
  justify-items: stretch !important;
}

body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] > .full-panel {
  display: grid !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  transform: none !important;
  min-height: 0 !important;
  align-content: start !important;
  padding: 14px !important;
  overflow: hidden !important;
  border-width: 3px !important;
  border-radius: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.15), transparent 36%),
    linear-gradient(28deg, transparent 58%, rgba(223, 255, 63, 0.14)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] .panel-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.22), rgba(223, 255, 63, 0.15)),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] .panel-header h2 {
  margin: 0 !important;
  color: #08090d !important;
  font-size: clamp(24px, 2.45vw, 34px) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] .panel-header .secondary-action {
  min-height: 34px !important;
  padding: 7px 12px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.92) !important;
  font-size: 10px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card {
  display: grid !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 82px !important;
  padding: 10px !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.9) !important;
  background:
    linear-gradient(90deg, #dfff3f 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card:nth-child(2) {
  background:
    linear-gradient(90deg, #67d5e8 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card:nth-child(3) {
  background:
    linear-gradient(90deg, #b9a7ff 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card:nth-child(4) {
  background:
    linear-gradient(90deg, #ffdfae 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card strong {
  margin: 0 !important;
  color: #08090d !important;
  font-size: 22px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card small,
body.app-mode[data-active-view="analytics"] .analytics-grid .metric-card .metric-label {
  color: rgba(8, 9, 13, 0.70) !important;
  font-size: 9px !important;
  line-height: 1.16 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel article {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-height: 112px !important;
  padding: 10px !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, #dfff3f 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.9) !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel article:nth-child(2) {
  background:
    linear-gradient(90deg, #67d5e8 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel article:nth-child(3) {
  background:
    linear-gradient(90deg, #b9a7ff 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel article:nth-child(4) {
  background:
    linear-gradient(90deg, #ffdfae 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel strong {
  margin: 0 !important;
  color: #08090d !important;
  font-size: 13.5px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 9.4px !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions button {
  display: grid !important;
  gap: 4px !important;
  min-height: 54px !important;
  padding: 8px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions button:nth-child(1) {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions button:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions button:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-actions strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-console,
body.app-mode[data-active-view="analytics"] .analytics-agent-form,
body.app-mode[data-active-view="analytics"] .analytics-agent-response {
  display: none !important;
}

body.app-mode[data-active-view="analytics"] .analytics-readiness-panel {
  display: grid !important;
  gap: 10px !important;
  padding: 12px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 42%),
    rgba(255, 250, 240, 0.95) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-section-heading {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.52fr) !important;
  gap: 10px !important;
  align-items: start !important;
}

body.app-mode[data-active-view="analytics"] .analytics-section-heading > div {
  display: grid !important;
  gap: 3px !important;
}

body.app-mode[data-active-view="analytics"] .analytics-section-heading strong {
  color: #08090d !important;
  font-size: 15px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-section-heading small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid article {
  display: grid !important;
  gap: 3px !important;
  min-height: 58px !important;
  padding: 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #dfff3f !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.86) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid article:nth-child(2) {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid article:nth-child(3) {
  background: #b9a7ff !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid article:nth-child(4) {
  background: #ffdfae !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid strong {
  color: #08090d !important;
  font-size: 15px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 8.5px !important;
  line-height: 1.14 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] .analytics-evidence-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="analytics"] .analytics-evidence-column {
  display: grid !important;
  align-content: start !important;
  gap: 8px !important;
  min-height: 0 !important;
  padding: 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 250, 240, 0.88) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.86) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-column-heading {
  display: grid !important;
  gap: 2px !important;
}

body.app-mode[data-active-view="analytics"] .analytics-column-heading span {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="analytics"] .analytics-column-heading strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-source-grid,
body.app-mode[data-active-view="analytics"] .analytics-paid-grid,
body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-source-card,
body.app-mode[data-active-view="analytics"] .analytics-paid-card,
body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid article {
  display: grid !important;
  gap: 3px !important;
  min-height: 68px !important;
  padding: 8px 9px !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background:
    linear-gradient(90deg, #67d5e8 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.86) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-paid-card {
  background:
    linear-gradient(90deg, #ffdfae 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid article {
  background:
    linear-gradient(90deg, #b9a7ff 0 7px, rgba(255, 250, 240, 0.96) 7px 100%) !important;
}

body.app-mode[data-active-view="analytics"] .analytics-source-card span,
body.app-mode[data-active-view="analytics"] .analytics-paid-card span,
body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid span {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="analytics"] .analytics-source-card strong,
body.app-mode[data-active-view="analytics"] .analytics-paid-card strong,
body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] .analytics-source-card small,
body.app-mode[data-active-view="analytics"] .analytics-source-card em,
body.app-mode[data-active-view="analytics"] .analytics-paid-card small,
body.app-mode[data-active-view="analytics"] .analytics-paid-card em {
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 8.8px !important;
  line-height: 1.16 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="analytics"] .insight-stack {
  display: grid !important;
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="analytics"] .insight-card {
  padding: 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.86) !important;
}

body.app-mode[data-active-view="analytics"] .insight-card h3 {
  font-size: 13px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="analytics"] .insight-card p {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px !important;
  line-height: 1.24 !important;
}

@media (max-width: 1120px) {
  body.app-mode[data-active-view="analytics"] .analytics-grid,
  body.app-mode[data-active-view="analytics"] .agent-diagnosis-panel,
  body.app-mode[data-active-view="analytics"] .analytics-agent-status-grid,
  body.app-mode[data-active-view="analytics"] .analytics-recommendation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="analytics"] .analytics-evidence-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="analytics"] [data-view-section="analytics"] .panel-header,
  body.app-mode[data-active-view="analytics"] .analytics-section-heading {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="analytics"] .analytics-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Ads page cleanup: compact paid-readiness layout, balanced color, sticky prompt only. */
body.app-mode[data-active-view="ads"] [data-view-section="ads"],
body.app-mode[data-active-view="ads"] [data-view-section="ads"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="ads"] [data-view-section="ads"] {
  width: 100% !important;
  max-width: none !important;
}

body.app-mode[data-active-view="ads"] .ads-module {
  width: 100% !important;
  max-width: none !important;
  gap: 11px !important;
  border-color: #08090d !important;
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.16), transparent 32%),
    linear-gradient(30deg, rgba(103, 213, 232, 0.13), transparent 52%),
    rgba(255, 250, 240, 0.94) !important;
}

body.app-mode[data-active-view="ads"] [data-view-section="ads"] .panel-header {
  margin-bottom: 10px !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.30), rgba(103, 213, 232, 0.18)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] [data-view-section="ads"] .panel-header h2 {
  max-width: 34ch !important;
  color: #08090d !important;
  font-size: clamp(21px, 2.05vw, 28px) !important;
  line-height: 1.02 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] .ads-module .module-hero-strip {
  margin-bottom: 10px !important;
  padding: 11px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.26) 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(239, 251, 255, 0.84)) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] .ads-module .module-hero-strip strong {
  color: #08090d !important;
  font-size: clamp(16px, 1.45vw, 20px) !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="ads"] .ads-module .module-hero-strip p {
  max-width: 78ch !important;
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 11px !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view="ads"] .ads-module .module-hero-actions,
body.app-mode[data-active-view="pages"] .page-builder-module .module-hero-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 7px !important;
  min-width: 178px !important;
  align-self: center !important;
}

body.app-mode[data-active-view="ads"] #ads-create-test,
body.app-mode[data-active-view="ads"] #ads-source-backed-plan-button,
body.app-mode[data-active-view="ads"] #ads-source-backed-button {
  min-height: 36px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="ads"] #ads-source-backed-plan-button,
body.app-mode[data-active-view="pages"] #pages-source-backed-button {
  border: 2px solid #08090d !important;
  background: #08090d !important;
  color: #ffffff !important;
  box-shadow: 3px 3px 0 #67d5e8 !important;
}

body.app-mode[data-active-view="ads"] #ads-source-backed-button {
  border: 2px solid #08090d !important;
  background: #e6fbff !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #67d5e8 !important;
}

body.app-mode[data-active-view="ads"] #ads-create-test {
  border: 2px solid #08090d !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.86) !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid {
  gap: 8px !important;
  margin-bottom: 10px !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid article {
  min-height: 66px !important;
  padding: 9px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.40) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.92) !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid article:nth-child(2) {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.48) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.92) !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid article:nth-child(3) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.54) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.92) !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid article:nth-child(4) {
  background:
    linear-gradient(90deg, rgba(185, 167, 255, 0.46) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.92) !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid strong {
  color: #08090d !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="ads"] #ads-kpi-grid small {
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 9.5px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="ads"] .ad-launch-console {
  gap: 7px !important;
  margin-bottom: 10px !important;
  padding: 10px !important;
  border-radius: 8px !important;
  background:
    linear-gradient(100deg, rgba(255, 184, 77, 0.24), rgba(103, 213, 232, 0.14) 58%, rgba(223, 255, 63, 0.20)),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] .ad-launch-console label {
  gap: 5px !important;
  color: rgba(8, 9, 13, 0.74) !important;
  font-size: 9.5px !important;
  font-weight: 900 !important;
}

body.app-mode[data-active-view="ads"] .ad-launch-console select,
body.app-mode[data-active-view="ads"] .ad-launch-console input {
  min-height: 34px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 6px 8px !important;
  color: #08090d !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view="ads"] #ads-launch-button {
  min-height: 35px !important;
  padding: 7px 9px !important;
  border-radius: 7px !important;
  background: #67d5e8 !important;
  color: #08090d !important;
  font-size: 10.5px !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-console,
body.app-mode[data-active-view="ads"] .ads-agent-form,
body.app-mode[data-active-view="ads"] .ads-agent-response {
  display: none !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-plan {
  display: grid !important;
  gap: 9px !important;
  margin: 0 0 10px !important;
  padding: 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(110deg, rgba(103, 213, 232, 0.20), transparent 54%),
    linear-gradient(28deg, rgba(223, 255, 63, 0.24), transparent 72%),
    #fffaf0 !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-plan[hidden] {
  display: none !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-header {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  align-items: start !important;
  gap: 12px !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-header strong {
  display: block !important;
  margin-top: 3px !important;
  color: #08090d !important;
  font-size: clamp(15px, 1.45vw, 19px) !important;
  line-height: 1.06 !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-header small {
  display: block !important;
  max-width: 108ch !important;
  margin-top: 4px !important;
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10px !important;
  font-weight: 780 !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-header b {
  align-self: start !important;
  min-width: 94px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-align: center !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid article {
  display: grid !important;
  align-content: start !important;
  gap: 5px !important;
  min-height: 138px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 9px !important;
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.58) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.72) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.86) !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid article:nth-child(2),
body.app-mode[data-active-view="ads"] .ads-targeting-grid article:nth-child(5) {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.68) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.72) !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid article:nth-child(3),
body.app-mode[data-active-view="ads"] .ads-targeting-grid article:nth-child(6) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.72) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.72) !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid span {
  width: fit-content !important;
  color: rgba(8, 9, 13, 0.72) !important;
  font-family: "Geist Mono", Menlo, monospace !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid strong {
  color: #08090d !important;
  font-size: 11.5px !important;
  line-height: 1.14 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid small {
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 9px !important;
  font-weight: 760 !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid ul {
  display: grid !important;
  gap: 3px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.app-mode[data-active-view="ads"] .ads-targeting-grid li {
  color: rgba(8, 9, 13, 0.70) !important;
  font-size: 8.8px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] .ads-keyword-clusters li {
  display: grid !important;
  gap: 2px !important;
}

body.app-mode[data-active-view="ads"] .ads-keyword-clusters li strong {
  font-size: 9px !important;
}

body.app-mode[data-active-view="ads"] .ads-keyword-clusters li span {
  width: auto !important;
  color: rgba(8, 9, 13, 0.68) !important;
  font-family: inherit !important;
  font-size: 8.6px !important;
  font-weight: 780 !important;
  line-height: 1.18 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="ads"] .ads-readiness-panel {
  display: grid !important;
  gap: 9px !important;
  margin: 0 0 10px !important;
  padding: 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 40%),
    linear-gradient(25deg, rgba(255, 184, 77, 0.16), transparent 62%),
    rgba(255, 250, 240, 0.88) !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] .ads-section-heading {
  display: grid !important;
  grid-template-columns: minmax(0, max-content) minmax(0, 1fr) !important;
  align-items: end !important;
  gap: 12px !important;
}

body.app-mode[data-active-view="ads"] .ads-section-heading strong {
  display: block !important;
  margin-top: 3px !important;
  color: #08090d !important;
  font-size: clamp(15px, 1.45vw, 19px) !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="ads"] .ads-section-heading small {
  justify-self: end !important;
  max-width: 58ch !important;
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 10.5px !important;
  font-weight: 780 !important;
  line-height: 1.28 !important;
  text-align: right !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-status-grid,
body.app-mode[data-active-view="ads"] .ads-account-grid,
body.app-mode[data-active-view="ads"] .ads-agent-recommendations {
  display: grid !important;
  gap: 7px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="ads"] .ads-account-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-status-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-recommendations {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card,
body.app-mode[data-active-view="ads"] .ads-agent-status-grid article,
body.app-mode[data-active-view="ads"] .ads-agent-recommendations article {
  display: grid !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 66px !important;
  overflow: hidden !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 8px !important;
  background: rgba(255, 255, 255, 0.68) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85) !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card:nth-child(1) {
  background:
    linear-gradient(90deg, #7c6cff 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.74) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card:nth-child(2) {
  background:
    linear-gradient(90deg, #67d5e8 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.74) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card:nth-child(3) {
  background:
    linear-gradient(90deg, #ff4d6d 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.74) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card:nth-child(4) {
  background:
    linear-gradient(90deg, #0a66c2 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.74) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card:nth-child(5) {
  background:
    linear-gradient(90deg, #08090d 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.74) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card.connected {
  background:
    linear-gradient(90deg, #dfff3f 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.78) !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-status-grid article:nth-child(3n + 1),
body.app-mode[data-active-view="ads"] .ads-agent-recommendations article:nth-child(3n + 1) {
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.72) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-status-grid article:nth-child(3n + 2),
body.app-mode[data-active-view="ads"] .ads-agent-recommendations article:nth-child(3n + 2) {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.74) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-status-grid article:nth-child(3n),
body.app-mode[data-active-view="ads"] .ads-agent-recommendations article:nth-child(3n) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.72) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card span,
body.app-mode[data-active-view="ads"] .ads-agent-status-grid span,
body.app-mode[data-active-view="ads"] .ads-agent-recommendations span {
  width: fit-content !important;
  color: rgba(8, 9, 13, 0.74) !important;
  font-family: "Geist Mono", Menlo, monospace !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card strong,
body.app-mode[data-active-view="ads"] .ads-agent-status-grid strong,
body.app-mode[data-active-view="ads"] .ads-agent-recommendations strong {
  color: #08090d !important;
  font-size: 11.5px !important;
  line-height: 1.12 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-status-grid strong {
  font-size: 14px !important;
}

body.app-mode[data-active-view="ads"] .ads-account-card small,
body.app-mode[data-active-view="ads"] .ads-account-card em,
body.app-mode[data-active-view="ads"] .ads-agent-status-grid small {
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 9px !important;
  font-style: normal !important;
  font-weight: 760 !important;
  line-height: 1.18 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] .module-surface-grid {
  gap: 8px !important;
  margin-bottom: 10px !important;
}

body.app-mode[data-active-view="ads"] .module-surface-card {
  min-height: 78px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(185, 167, 255, 0.36) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.60) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.86) !important;
}

body.app-mode[data-active-view="ads"] .module-surface-card:nth-child(2) {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.44) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.60) !important;
}

body.app-mode[data-active-view="ads"] .module-surface-card:nth-child(3) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.50) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.60) !important;
}

body.app-mode[data-active-view="ads"] .module-surface-card strong {
  color: #08090d !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
}

body.app-mode[data-active-view="ads"] .module-surface-card p {
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 9.5px !important;
  line-height: 1.26 !important;
}

body.app-mode[data-active-view="ads"] .module-work-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr) !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="ads"] .module-work-grid > article {
  min-height: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 11px !important;
  background: rgba(255, 250, 240, 0.76) !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="ads"] .module-work-grid .section-title {
  margin-bottom: 5px !important;
}

body.app-mode[data-active-view="ads"] .module-work-grid .section-title h3 {
  color: #08090d !important;
  font-size: clamp(15px, 1.4vw, 18px) !important;
  line-height: 1.06 !important;
}

body.app-mode[data-active-view="ads"] #ads-test-list,
body.app-mode[data-active-view="ads"] #ads-rule-list,
body.app-mode[data-active-view="ads"] #ads-plan-list {
  gap: 7px !important;
}

body.app-mode[data-active-view="ads"] #ads-test-list .module-work-item,
body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item,
body.app-mode[data-active-view="ads"] #ads-rule-list .module-rule-item {
  min-height: 52px !important;
  border: 2px solid rgba(8, 9, 13, 0.86) !important;
  border-radius: 7px !important;
  padding: 8px !important;
  background: rgba(255, 255, 255, 0.66) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.78) !important;
}

body.app-mode[data-active-view="ads"] #ads-test-list .module-work-item span,
body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item span {
  width: 28px !important;
  height: 28px !important;
  border: 2px solid #08090d !important;
  background: #ffb84d !important;
  color: #08090d !important;
  font-size: 8px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="ads"] #ads-test-list strong,
body.app-mode[data-active-view="ads"] #ads-plan-list strong,
body.app-mode[data-active-view="ads"] #ads-rule-list strong {
  color: #08090d !important;
  font-size: 11.5px !important;
  line-height: 1.14 !important;
}

body.app-mode[data-active-view="ads"] #ads-test-list small,
body.app-mode[data-active-view="ads"] #ads-plan-list small,
body.app-mode[data-active-view="ads"] #ads-rule-list small {
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 9px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="ads"] #ads-test-list .module-work-item b,
body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item b {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 8px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card > b {
  align-self: start !important;
  margin-top: 2px !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card {
  grid-template-columns: 30px minmax(0, 1fr) max-content !important;
  align-items: start !important;
  gap: 10px !important;
  padding: 10px !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card > .paid-plan-icon {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border-radius: 8px !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-body {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-heading {
  display: grid !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-heading strong {
  max-width: 100% !important;
  overflow: visible !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.12 !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-heading small {
  margin-top: 2px !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card > .paid-plan-budget {
  align-self: start !important;
  margin-top: 0 !important;
  padding: 4px 7px !important;
  border: 1px solid rgba(8, 9, 13, 0.24) !important;
  border-radius: 999px !important;
  background: rgba(255, 250, 240, 0.84) !important;
  color: rgba(8, 9, 13, 0.72) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-tags {
  gap: 4px !important;
  margin-top: 0 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-tags em {
  min-height: 20px !important;
  padding: 3px 6px !important;
  font-size: 8px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-proof-stack {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item .source-backed-evidence {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin-top: 0 !important;
  max-width: 100% !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item .source-backed-evidence a,
body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item .source-backed-evidence small {
  display: inline-flex !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 20px !important;
  max-width: min(100%, 190px) !important;
  place-items: initial !important;
  justify-content: center !important;
  padding: 3px 7px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  background: #eef7ff !important;
  color: #08090d !important;
  font-size: 8px !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  text-align: left !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .module-work-item .source-backed-evidence .source-backed-mode {
  max-width: 100% !important;
  background: #08090d !important;
  color: #ffffff !important;
}

body.app-mode .ads-pages-pair-proof {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin-top: 0;
  padding: 7px 8px;
  border: 1px solid rgba(8, 9, 13, 0.58);
  border-left: 6px solid #ffb84d;
  border-radius: 7px;
  background: #fffdf4;
  box-shadow: none;
}

body.app-mode .ads-pages-pair-proof > span {
  display: block;
  width: auto;
  height: auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(8, 9, 13, 0.58);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card .ads-pages-pair-proof > span {
  display: block !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  place-items: initial !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: rgba(8, 9, 13, 0.58) !important;
  font-size: 8px !important;
  line-height: 1.1 !important;
  text-align: left !important;
}

body.app-mode .ads-pages-pair-proof > strong {
  min-width: 0;
  overflow: visible;
  color: #08090d;
  font-size: 11px;
  line-height: 1.16;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.app-mode .ads-pages-pair-proof > small {
  color: rgba(8, 9, 13, 0.68);
  font-size: 9px;
  font-weight: 850;
  line-height: 1.25;
}

body.app-mode .ads-pages-pair-proof > div {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
  gap: 4px;
  min-width: 0;
}

body.app-mode .ads-pages-pair-proof em {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 4px 6px;
  border: 1px solid rgba(8, 9, 13, 0.22);
  border-radius: 999px;
  background: #eef7ff;
  color: #08090d;
  font-size: 8px;
  font-style: normal;
  font-weight: 900;
  line-height: 1.1;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card .ads-pages-pair-proof.compact {
  gap: 4px !important;
  padding: 6px 8px !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card .ads-pages-pair-proof.compact > small {
  font-size: 8px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card .ads-pages-pair-proof.compact > div {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 3px !important;
}

body.app-mode[data-active-view="ads"] #ads-plan-list .paid-plan-card .ads-pages-pair-proof.compact em {
  padding: 3px 5px !important;
  font-size: 7.8px !important;
  line-height: 1.08 !important;
}

@media (max-width: 1120px) {
  body.app-mode[data-active-view="ads"] .ads-agent-status-grid,
  body.app-mode[data-active-view="ads"] .ads-agent-recommendations {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="ads"] .ads-account-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="ads"] .ads-targeting-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  body.app-mode[data-active-view="ads"] .ads-section-heading,
  body.app-mode[data-active-view="ads"] .ads-module .module-hero-strip,
  body.app-mode[data-active-view="ads"] .module-work-grid,
  body.app-mode[data-active-view="ads"] .ads-targeting-header,
  body.app-mode[data-active-view="ads"] .ads-targeting-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="ads"] .ads-section-heading small {
    justify-self: start !important;
    text-align: left !important;
  }

  body.app-mode[data-active-view="ads"] .ads-targeting-header b {
    justify-self: start !important;
  }
}

/* Ads Polxy dock: sticky paid readiness, spend, risk, and guarded-test prompt. */
.ads-agent-dock {
  display: none;
}

body.app-mode[data-active-view="ads"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="ads"] [data-view-section="ads"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="ads"] .ads-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-mode,
body.app-mode[data-active-view="ads"] .ads-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="ads"] .ads-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-mode button,
body.app-mode[data-active-view="ads"] .ads-agent-options button,
body.app-mode[data-active-view="ads"] .ads-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-mode button.active,
body.app-mode[data-active-view="ads"] .ads-agent-send {
  background: #ffb84d !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="ads"] .ads-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-ads-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-ads-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-ads-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-ads-answer .ads-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.22), transparent 52%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-ads-answer .ads-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-ads-answer .ads-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(255, 184, 77, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-ads-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-ads-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-ads-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-ads-answer .dashboard-report-section,
.dashboard-answer-dialog.is-ads-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

.ploxy-voice-agent {
  position: fixed;
  right: 18px;
  bottom: 154px;
  z-index: 92;
  display: grid;
  justify-items: end;
  gap: 10px;
  color: #08090d;
}

body:not(.app-mode) .ploxy-voice-agent,
body.app-mode[data-active-view="landing-page"] .ploxy-voice-agent,
body.app-mode[data-active-view="client-portal"] .ploxy-voice-agent,
body.app-mode[data-active-view="help"] .ploxy-voice-agent {
  display: none;
}

.ploxy-voice-orb {
  position: relative;
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border: 3px solid #08090d;
  border-radius: 50%;
  background:
    radial-gradient(circle at 38% 32%, #ffffff 0 14%, transparent 15%),
    linear-gradient(145deg, #67d5e8, #dfff3f 54%, #b9a7ff);
  color: #08090d;
  font-size: 9px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
  box-shadow: 4px 4px 0 #08090d, 0 18px 42px rgba(8, 9, 13, 0.18);
  cursor: pointer;
}

.ploxy-voice-orb .voice-wave,
.ploxy-voice-orb .voice-core {
  position: absolute;
  inset: 12px;
  border: 2px solid rgba(8, 9, 13, 0.86);
  border-radius: 50%;
}

.ploxy-voice-orb .voice-wave {
  animation: ploxyVoicePulse 2.4s ease-in-out infinite;
}

.ploxy-voice-orb .voice-core {
  inset: 24px;
  background: #fffaf0;
  box-shadow: 0 0 0 5px rgba(8, 9, 13, 0.10);
}

.ploxy-voice-orb b {
  position: relative;
  z-index: 1;
  margin-top: 42px;
}

.ploxy-voice-agent.is-listening .ploxy-voice-orb {
  background:
    radial-gradient(circle at 38% 32%, #ffffff 0 14%, transparent 15%),
    linear-gradient(145deg, #ff4d6d, #ffb84d 52%, #dfff3f);
}

.ploxy-voice-agent.is-listening .voice-wave {
  animation-duration: 0.8s;
}

.ploxy-voice-agent.is-speaking .ploxy-voice-orb {
  background:
    radial-gradient(circle at 38% 32%, #ffffff 0 14%, transparent 15%),
    linear-gradient(145deg, #67d5e8, #b9a7ff 52%, #dfff3f);
}

.ploxy-voice-agent.is-thinking .ploxy-voice-orb {
  background:
    radial-gradient(circle at 38% 32%, #ffffff 0 14%, transparent 15%),
    linear-gradient(145deg, #dfff3f, #67d5e8 52%, #ffb84d);
}

.ploxy-voice-transcript[hidden] {
  display: none;
}

.ploxy-voice-status-pill {
  max-width: min(280px, calc(100vw - 36px));
  border: 2px solid #08090d;
  border-radius: 999px;
  padding: 7px 10px;
  background: #fffaf0;
  color: #08090d;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.18;
  text-align: right;
  box-shadow: 3px 3px 0 #08090d;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 180ms ease, transform 180ms ease;
  pointer-events: none;
}

.ploxy-voice-agent.has-status .ploxy-voice-status-pill,
.ploxy-voice-agent.is-listening .ploxy-voice-status-pill,
.ploxy-voice-agent.is-thinking .ploxy-voice-status-pill,
.ploxy-voice-agent.is-speaking .ploxy-voice-status-pill {
  opacity: 1;
  transform: translateY(0);
}

.settings-voice-section {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), transparent 54%),
    linear-gradient(35deg, rgba(223, 255, 63, 0.30), transparent 70%),
    #fff7ed;
}

@keyframes ploxyVoicePulse {
  0%, 100% {
    transform: scale(0.82);
    opacity: 0.7;
  }
  50% {
    transform: scale(1.14);
    opacity: 0.16;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="ads"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="ads"] [data-view-section="ads"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="ads"] .ads-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="ads"] .ads-agent-mode button,
  body.app-mode[data-active-view="ads"] .ads-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="ads"] .ads-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="ads"] .ads-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .ploxy-voice-agent {
    right: 12px;
    bottom: 196px;
  }

  .ploxy-voice-orb {
    width: 58px;
    height: 58px;
  }

  .ploxy-voice-orb b {
    margin-top: 34px;
    font-size: 8px;
  }

  .ploxy-voice-status-pill {
    max-width: min(240px, calc(100vw - 24px));
    font-size: 9px;
  }

  .dashboard-answer-dialog.is-ads-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-ads-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-ads-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Influencers page polish: compact creator shortlists with balanced creator colors. */
body.app-mode[data-active-view="influencers"] .influencer-module {
  display: grid;
  gap: 12px;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  padding: 16px !important;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.16), transparent 36%),
    linear-gradient(35deg, rgba(110, 231, 183, 0.14), transparent 62%),
    #fff7ed !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] .influencer-module > .panel-header {
  align-items: center;
  margin: 0 !important;
  border: 2px solid #08090d;
  border-radius: 8px;
  padding: 11px 13px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.9);
}

body.app-mode[data-active-view="influencers"] .influencer-module > .panel-header h2 {
  max-width: 54ch;
  color: #08090d;
  font-size: 18px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="influencers"] #influencers-module-status {
  min-height: 28px;
  border: 2px solid #08090d !important;
  background: #f0a8ff !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="influencers"] .influencer-module .module-hero-strip {
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 11px 13px !important;
  background:
    linear-gradient(90deg, rgba(240, 168, 255, 0.22), transparent 44%),
    linear-gradient(135deg, rgba(110, 231, 183, 0.14), transparent 68%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] .influencer-module .module-hero-strip strong {
  max-width: 62ch;
  border: 0 !important;
  background: transparent !important;
  color: #08090d !important;
  box-shadow: none !important;
  font-size: 16px !important;
  line-height: 1.16 !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="influencers"] .influencer-module .module-hero-strip p {
  max-width: 78ch;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

body.app-mode[data-active-view="influencers"] #influencers-create-default {
  min-width: 168px;
  border: 2px solid #08090d !important;
  background: #6ee7b7 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid {
  margin: 0 !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid article {
  min-height: 66px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 9px 11px !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid article:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.58), rgba(255, 255, 255, 0.86) 72%),
    #fff1ff !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.58), rgba(255, 255, 255, 0.86) 72%),
    #ecfff6 !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.56), rgba(255, 255, 255, 0.86) 72%),
    #edfaff !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.54), rgba(255, 255, 255, 0.86) 72%),
    #fff3df !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid strong {
  color: #08090d !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="influencers"] #influencers-kpi-grid small,
body.app-mode[data-active-view="influencers"] #influencers-kpi-grid .eyebrow {
  color: #08090d !important;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console {
  grid-template-columns: repeat(24, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.12), transparent 52%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label {
  min-width: 0;
  gap: 4px;
  color: rgba(8, 9, 13, 0.66);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: 0;
  text-transform: none;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(1) {
  grid-column: span 4;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(2) {
  grid-column: span 3;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(3) {
  grid-column: span 5;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(4),
body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(5) {
  grid-column: span 6 !important;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(6),
body.app-mode[data-active-view="influencers"] .influencer-discovery-console button {
  grid-column: span 7 !important;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console label:nth-of-type(7) {
  grid-column: span 10 !important;
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console input,
body.app-mode[data-active-view="influencers"] .influencer-discovery-console select {
  min-height: 32px;
  border: 2px solid rgba(8, 9, 13, 0.55);
  border-radius: 6px;
  padding: 6px 8px;
  background: #ffffff;
  color: #08090d;
  font-size: 11px;
  font-weight: 760;
  box-shadow: inset 0 -2px 0 rgba(8, 9, 13, 0.06);
}

body.app-mode[data-active-view="influencers"] .influencer-discovery-console button {
  min-height: 32px !important;
  align-self: end;
  border: 2px solid #08090d !important;
  border-radius: 6px;
  padding: 6px 9px !important;
  background: #6ee7b7 !important;
  color: #08090d !important;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] .influencer-work-grid {
  grid-template-columns: minmax(328px, 0.8fr) minmax(0, 1.2fr) !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="influencers"] .influencer-work-grid > article {
  min-height: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), transparent 52%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] .influencer-work-grid .section-title {
  gap: 3px;
  margin: 0;
}

body.app-mode[data-active-view="influencers"] .influencer-work-grid .section-title h3 {
  color: #08090d;
  font-size: 14px;
  line-height: 1.15;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item {
  grid-template-columns: 30px minmax(0, 1fr) 68px auto !important;
  min-height: 56px;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.82) !important;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item.selected {
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.18), transparent 64%),
    #ffffff !important;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item span {
  background: #f5ceff !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item strong {
  color: #08090d !important;
  font-size: 11.5px !important;
  line-height: 1.18;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10px !important;
  line-height: 1.32;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item b {
  justify-self: end;
  min-width: 58px;
  border: 2px solid #08090d;
  border-radius: 999px;
  padding: 5px 7px;
  background: #eafff4;
  color: #08090d !important;
  font-size: 9px;
  line-height: 1;
  text-align: center;
}

body.app-mode[data-active-view="influencers"] .creator-profile-item b.attention {
  background: #fff3df;
}

body.app-mode[data-active-view="influencers"] .creator-profile-actions button {
  min-height: 28px;
  border-radius: 6px;
  padding: 5px 8px;
  font-size: 9.5px;
  box-shadow: 1px 1px 0 #08090d;
}

body.app-mode[data-active-view="influencers"] .creator-profile-panel {
  gap: 8px;
}

body.app-mode[data-active-view="influencers"] .creator-profile-panel .empty-state {
  min-height: 98px;
  border: 2px dashed rgba(8, 9, 13, 0.28);
  border-radius: 8px;
  padding: 16px;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.12), transparent 55%),
    rgba(255, 255, 255, 0.52);
  color: #08090d;
}

body.app-mode[data-active-view="influencers"] .creator-review-card {
  border: 2px solid #08090d !important;
  border-radius: 8px;
  padding: 11px !important;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.16), transparent 56%),
    #ffffff !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] .creator-review-card h3 {
  max-width: 34ch;
  font-size: clamp(17px, 1.45vw, 21px) !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="influencers"] .creator-review-card p {
  max-width: 70ch;
  font-size: 11px !important;
  line-height: 1.36 !important;
}

body.app-mode[data-active-view="influencers"] .creator-score-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="influencers"] .creator-profile-meta {
  gap: 7px !important;
}

body.app-mode[data-active-view="influencers"] .creator-profile-panel .module-rule-stack {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="influencers"] .creator-score-grid article,
body.app-mode[data-active-view="influencers"] .creator-profile-meta article,
body.app-mode[data-active-view="influencers"] .creator-profile-panel .module-rule-item {
  border: 2px solid #08090d !important;
  border-radius: 8px;
  padding: 8px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.78);
}

body.app-mode[data-active-view="influencers"] .creator-score-grid article:nth-child(2n),
body.app-mode[data-active-view="influencers"] .creator-profile-meta article:nth-child(2n),
body.app-mode[data-active-view="influencers"] .creator-profile-panel .module-rule-item:nth-child(2n) {
  background: #f8f0ff !important;
}

body.app-mode[data-active-view="influencers"] .creator-score-grid strong,
body.app-mode[data-active-view="influencers"] .creator-profile-meta strong,
body.app-mode[data-active-view="influencers"] .creator-profile-panel .module-rule-item strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.18;
}

body.app-mode[data-active-view="influencers"] .creator-score-grid span,
body.app-mode[data-active-view="influencers"] .creator-profile-meta span,
body.app-mode[data-active-view="influencers"] .creator-profile-panel .module-rule-item small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 9.8px !important;
  line-height: 1.32;
}

body.app-mode[data-active-view="influencers"] .creator-profile-panel .page-field-chips span {
  border-radius: 999px;
  background: #eafff4 !important;
  font-size: 10.5px !important;
}

/* Influencers Polxy dock: sticky creator-fit, risk, outreach, and shortlist prompt. */
.influencers-agent-dock {
  display: none;
}

body.app-mode[data-active-view="influencers"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="influencers"] [data-view-section="influencers"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fff6fb !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="influencers"] .influencers-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-mode,
body.app-mode[data-active-view="influencers"] .influencers-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-mode button,
body.app-mode[data-active-view="influencers"] .influencers-agent-options button,
body.app-mode[data-active-view="influencers"] .influencers-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fff6fb !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-mode button.active,
body.app-mode[data-active-view="influencers"] .influencers-agent-send {
  background: #f0a8ff !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="influencers"] .influencers-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-influencers-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-influencers-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-influencers-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-influencers-answer .influencers-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.26), transparent 52%),
    linear-gradient(35deg, rgba(110, 231, 183, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-influencers-answer .influencers-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-influencers-answer .influencers-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(240, 168, 255, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-influencers-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-influencers-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-influencers-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-influencers-answer .dashboard-report-section,
.dashboard-answer-dialog.is-influencers-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="influencers"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="influencers"] [data-view-section="influencers"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="influencers"] .influencers-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="influencers"] .influencers-agent-mode button,
  body.app-mode[data-active-view="influencers"] .influencers-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="influencers"] .influencers-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="influencers"] .influencers-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-influencers-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-influencers-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-influencers-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Outreach page polish: compact deal desk, readable draft messages, and balanced risk colors. */
body.app-mode[data-active-view="outreach"] .outreach-module {
  display: grid;
  gap: 12px;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  padding: 16px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 36%),
    linear-gradient(35deg, rgba(255, 184, 77, 0.14), transparent 62%),
    #fff7ed !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-module > .panel-header {
  align-items: center;
  margin: 0 !important;
  border: 2px solid #08090d;
  border-radius: 8px;
  padding: 11px 13px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.9);
}

body.app-mode[data-active-view="outreach"] .outreach-module > .panel-header h2 {
  max-width: 54ch;
  color: #08090d;
  font-size: 18px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="outreach"] #outreach-module-status {
  min-height: 28px;
  border: 2px solid #08090d !important;
  background: #67d5e8 !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-strip {
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 11px 13px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.22), transparent 44%),
    linear-gradient(135deg, rgba(255, 184, 77, 0.14), transparent 68%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-strip strong {
  max-width: 62ch;
  border: 0 !important;
  background: transparent !important;
  color: #08090d !important;
  box-shadow: none !important;
  font-size: 16px !important;
  line-height: 1.16 !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-strip p {
  max-width: 78ch;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

body.app-mode[data-active-view="outreach"] #outreach-create-default {
  min-width: 152px;
  border: 2px solid #08090d !important;
  background: #ffcf72 !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid {
  margin: 0 !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid article {
  min-height: 66px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 9px 11px !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid article:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.58), rgba(255, 255, 255, 0.86) 72%),
    #edfaff !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.56), rgba(255, 255, 255, 0.86) 72%),
    #fff3df !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.54), rgba(255, 255, 255, 0.86) 72%),
    #ecfff6 !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(240, 168, 255, 0.5), rgba(255, 255, 255, 0.86) 72%),
    #fff1ff !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid strong {
  color: #08090d !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="outreach"] #outreach-kpi-grid small,
body.app-mode[data-active-view="outreach"] #outreach-kpi-grid .eyebrow {
  color: #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console {
  grid-template-columns: repeat(24, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 52%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console label {
  min-width: 0;
  gap: 4px;
  color: rgba(8, 9, 13, 0.66);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: 0;
  text-transform: none;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(1),
body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(2),
body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(3) {
  grid-column: span 3;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(4) {
  grid-column: span 2;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(5) {
  grid-column: span 3 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(6) {
  grid-column: span 10 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(7),
body.app-mode[data-active-view="outreach"] .outreach-deal-console label:nth-of-type(8) {
  grid-column: span 10 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-source-map {
  grid-column: span 13 !important;
  min-height: 52px;
  padding: 7px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-source-map strong {
  font-size: 8.5px;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console button {
  grid-column: span 4 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console input,
body.app-mode[data-active-view="outreach"] .outreach-deal-console select,
body.app-mode[data-active-view="outreach"] .outreach-deal-console textarea {
  min-height: 32px;
  border: 2px solid rgba(8, 9, 13, 0.55);
  border-radius: 6px;
  padding: 6px 8px;
  background: #ffffff;
  color: #08090d;
  font-size: 10.8px;
  font-weight: 760;
  box-shadow: inset 0 -2px 0 rgba(8, 9, 13, 0.06);
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console textarea {
  min-height: 52px !important;
  max-height: 92px !important;
  resize: vertical;
  line-height: 1.25;
}

body.app-mode[data-active-view="outreach"] .outreach-deal-console button {
  min-height: 52px !important;
  align-self: end;
  border: 2px solid #08090d !important;
  border-radius: 6px;
  padding: 6px 9px !important;
  background: #ffcf72 !important;
  color: #08090d !important;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-work-grid {
  grid-template-columns: minmax(328px, 0.8fr) minmax(0, 1.2fr) !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-work-grid > article {
  min-height: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), transparent 52%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-work-grid .section-title {
  gap: 3px;
  margin: 0;
}

body.app-mode[data-active-view="outreach"] .outreach-work-grid .section-title h3 {
  color: #08090d;
  font-size: 14px;
  line-height: 1.15;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item {
  grid-template-columns: 30px minmax(0, 1fr) 70px auto !important;
  min-height: 56px;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.82) !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item.selected {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 64%),
    #ffffff !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item span {
  background: #c9f4ff !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item strong {
  color: #08090d !important;
  font-size: 11.5px !important;
  line-height: 1.18;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10px !important;
  line-height: 1.32;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item b {
  justify-self: end;
  min-width: 62px;
  border: 2px solid #08090d;
  border-radius: 999px;
  padding: 5px 7px;
  background: #eafff4;
  color: #08090d !important;
  font-size: 9px;
  line-height: 1;
  text-align: center;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item b.attention {
  background: #fff3df;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-actions button {
  min-height: 28px;
  border-radius: 6px;
  padding: 5px 8px;
  font-size: 9.5px;
  box-shadow: 1px 1px 0 #08090d;
}

body.app-mode[data-active-view="outreach"] .outreach-export-actions {
  gap: 7px;
  margin-top: 10px;
}

body.app-mode[data-active-view="outreach"] .outreach-source-proof {
  margin-top: 9px;
  padding: 8px;
}

body.app-mode[data-active-view="outreach"] .outreach-export-actions button,
body.app-mode[data-active-view="outreach"] .outreach-export-actions a {
  min-height: 30px;
  padding: 6px 9px;
  font-size: 10px;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-panel {
  gap: 8px;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-panel .empty-state {
  min-height: 98px;
  border: 2px dashed rgba(8, 9, 13, 0.28);
  border-radius: 8px;
  padding: 16px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 55%),
    rgba(255, 255, 255, 0.52);
  color: #08090d;
}

body.app-mode[data-active-view="outreach"] .outreach-review-card {
  border: 2px solid #08090d !important;
  border-radius: 8px;
  padding: 11px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 56%),
    #ffffff !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-review-card h3 {
  max-width: 36ch;
  font-size: clamp(17px, 1.45vw, 21px) !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-review-card p {
  max-width: 70ch;
  font-size: 11px !important;
  line-height: 1.36 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-score-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-message-block {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-terms-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-panel .module-rule-stack {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-score-grid article,
body.app-mode[data-active-view="outreach"] .outreach-message-block article,
body.app-mode[data-active-view="outreach"] .outreach-terms-grid article,
body.app-mode[data-active-view="outreach"] .outreach-thread-panel .module-rule-item {
  border: 2px solid #08090d !important;
  border-radius: 8px;
  padding: 8px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.78);
}

body.app-mode[data-active-view="outreach"] .outreach-score-grid article:nth-child(2n),
body.app-mode[data-active-view="outreach"] .outreach-message-block article:nth-child(2n),
body.app-mode[data-active-view="outreach"] .outreach-terms-grid article:nth-child(2n),
body.app-mode[data-active-view="outreach"] .outreach-thread-panel .module-rule-item:nth-child(2n) {
  background: #eefcff !important;
}

body.app-mode[data-active-view="outreach"] .outreach-score-grid strong,
body.app-mode[data-active-view="outreach"] .outreach-terms-grid strong,
body.app-mode[data-active-view="outreach"] .outreach-thread-panel .module-rule-item strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.18;
}

body.app-mode[data-active-view="outreach"] .outreach-score-grid span,
body.app-mode[data-active-view="outreach"] .outreach-terms-grid span,
body.app-mode[data-active-view="outreach"] .outreach-thread-panel .module-rule-item small,
body.app-mode[data-active-view="outreach"] .outreach-message-block .eyebrow {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 9.8px !important;
  line-height: 1.32;
}

body.app-mode[data-active-view="outreach"] .outreach-message-block p {
  color: rgba(8, 9, 13, 0.78) !important;
  font-size: 10.5px !important;
  line-height: 1.34 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-panel .page-field-chips span {
  border-radius: 999px;
  background: #fff3df !important;
  font-size: 10.5px !important;
}

/* Outreach Polxy dock: sticky sequence, deal-term, send-risk, and approval prompt. */
.outreach-agent-dock {
  display: none;
}

body.app-mode[data-active-view="outreach"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="outreach"] [data-view-section="outreach"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #f7fbff !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="outreach"] .outreach-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-mode,
body.app-mode[data-active-view="outreach"] .outreach-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-mode button,
body.app-mode[data-active-view="outreach"] .outreach-agent-options button,
body.app-mode[data-active-view="outreach"] .outreach-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #f7fbff !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-mode button.active,
body.app-mode[data-active-view="outreach"] .outreach-agent-send {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-agent-dock.is-running {
  outline: 3px solid #f0a8ff;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-outreach-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-outreach-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-outreach-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-outreach-answer .outreach-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.24), transparent 52%),
    linear-gradient(35deg, rgba(255, 184, 77, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-outreach-answer .outreach-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-outreach-answer .outreach-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(103, 213, 232, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-outreach-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-outreach-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-outreach-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-outreach-answer .dashboard-report-section,
.dashboard-answer-dialog.is-outreach-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="outreach"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="outreach"] [data-view-section="outreach"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="outreach"] .outreach-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="outreach"] .outreach-agent-mode button,
  body.app-mode[data-active-view="outreach"] .outreach-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="outreach"] .outreach-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="outreach"] .outreach-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-outreach-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-outreach-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-outreach-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Affiliate page polish: compact partner-program setup with readable links, terms, and ledger cards. */
body.app-mode[data-active-view="affiliate"] .affiliate-module {
  gap: 12px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.18), transparent 38%),
    linear-gradient(315deg, rgba(110, 231, 183, 0.18), transparent 44%),
    #fffaf0;
}

body.app-mode[data-active-view="affiliate"] .affiliate-module > .panel-header {
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-color: rgba(8, 9, 13, 0.9);
  background: linear-gradient(135deg, #ffffff 0%, #fff2dc 54%, #e8fff4 100%);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-module > .panel-header h2 {
  max-width: 26ch;
  font-size: clamp(22px, 2.05vw, 29px);
  line-height: 1.03;
  letter-spacing: 0;
}

body.app-mode[data-active-view="affiliate"] #affiliate-module-status {
  min-height: 30px;
  padding: 7px 10px;
  background: #ffb84d;
  color: #08090d;
  font-size: 10px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-module .module-hero-strip {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  border: 2px solid #08090d;
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.28), transparent 48%),
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 62%),
    #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-module .module-hero-strip strong {
  display: block;
  max-width: 68ch;
  color: #08090d;
  font-size: 19px;
  line-height: 1.1;
  letter-spacing: 0;
}

body.app-mode[data-active-view="affiliate"] .affiliate-module .module-hero-strip p {
  max-width: 82ch;
  margin-top: 4px;
  color: rgba(8, 9, 13, 0.76);
  font-size: 12px;
  line-height: 1.3;
}

body.app-mode[data-active-view="affiliate"] #affiliate-create-default {
  min-height: 34px;
  padding: 8px 12px;
  background: linear-gradient(135deg, #ffb84d, #6ee7b7);
  color: #08090d;
  font-size: 11px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid article {
  min-height: 72px;
  padding: 10px;
  border: 2px solid #08090d;
  background: #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid article:nth-child(4n + 1) {
  background: linear-gradient(135deg, rgba(255, 184, 77, 0.34), #ffffff 62%);
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid article:nth-child(4n + 2) {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.28), #ffffff 62%);
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid article:nth-child(4n + 3) {
  background: linear-gradient(135deg, rgba(110, 231, 183, 0.30), #ffffff 62%);
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid article:nth-child(4n) {
  background: linear-gradient(135deg, rgba(240, 168, 255, 0.24), #ffffff 62%);
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid strong {
  font-size: 22px;
  line-height: 1;
}

body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid small,
body.app-mode[data-active-view="affiliate"] #affiliate-kpi-grid .eyebrow {
  font-size: 10px;
  line-height: 1.2;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console {
  grid-template-columns: repeat(24, minmax(0, 1fr));
  grid-auto-rows: minmax(0, auto);
  align-items: stretch;
  gap: 8px;
  margin: 0;
  padding: 10px;
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.20), transparent 56%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label {
  min-width: 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label small {
  display: block;
  margin-top: 4px;
  color: rgba(8, 9, 13, 0.58);
  font-size: 9px;
  font-weight: 800;
  line-height: 1.15;
}

body.app-mode[data-active-view="affiliate"] .user-referral-console {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.2fr) minmax(260px, 0.9fr);
  gap: 10px;
  margin: 0;
  padding: 10px;
  border: 3px solid #08090d;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 58%),
    #fffaf0;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .user-referral-share-card,
body.app-mode[data-active-view="affiliate"] .user-referral-invite-form,
body.app-mode[data-active-view="affiliate"] .user-referral-benefit-row article {
  min-width: 0;
  border: 2px solid #08090d;
  background: #ffffff;
  padding: 10px;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88);
}

body.app-mode[data-active-view="affiliate"] .user-referral-share-card strong {
  display: block;
  margin: 6px 0 10px;
  font-size: 13px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .user-referral-invite-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

body.app-mode[data-active-view="affiliate"] .user-referral-invite-form label {
  min-width: 0;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
}

body.app-mode[data-active-view="affiliate"] .user-referral-invite-form input {
  width: 100%;
  min-height: 34px;
  margin-top: 5px;
  padding: 7px 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #fffaf0;
  color: #08090d;
  font-size: 11px;
  font-weight: 800;
}

body.app-mode[data-active-view="affiliate"] .user-referral-invite-form button {
  min-height: 34px;
  padding: 7px 12px;
  border: 2px solid #08090d;
  background: #dfff3f;
  color: #08090d;
  font-weight: 950;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .user-referral-benefit-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

body.app-mode[data-active-view="affiliate"] .user-referral-benefit-row strong {
  display: block;
  margin-top: 5px;
  font-size: 13px;
  line-height: 1.2;
}

body.app-mode[data-active-view="affiliate"] .user-referral-rules article {
  border-color: #08090d;
  background: linear-gradient(135deg, rgba(223, 255, 63, 0.24), #ffffff 62%);
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="affiliate"] .user-referral-console,
  body.app-mode[data-active-view="affiliate"] .user-referral-invite-form {
    grid-template-columns: 1fr;
  }
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(1) {
  grid-column: 1 / span 4;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(2) {
  grid-column: 5 / span 6;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(3) {
  grid-column: 11 / span 6;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(4) {
  grid-column: 17 / span 8;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(5) {
  grid-column: 1 / span 4;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(6) {
  grid-column: 5 / span 4;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(7) {
  grid-column: 9 / span 6;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(8) {
  grid-column: 15 / span 4;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(9) {
  grid-column: 19 / span 6;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(10) {
  grid-column: 1 / span 12;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console label:nth-of-type(11) {
  grid-column: 13 / span 8;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console button {
  grid-column: 21 / span 4;
  grid-row: 3;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console .wide-field {
  min-width: 0;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console input,
body.app-mode[data-active-view="affiliate"] .affiliate-program-console select,
body.app-mode[data-active-view="affiliate"] .affiliate-program-console textarea {
  min-height: 34px;
  padding: 7px 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #fffaf0;
  color: #08090d;
  font-size: 11px;
  line-height: 1.2;
  overflow-wrap: anywhere;
  box-shadow: none;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console input[readonly] {
  background:
    repeating-linear-gradient(135deg, rgba(8, 9, 13, 0.06) 0 7px, transparent 7px 14px),
    #f5f0e7;
  color: rgba(8, 9, 13, 0.72);
  cursor: not-allowed;
}

body.app-mode[data-active-view="affiliate"] .affiliate-admin-terms-note {
  grid-column: 5 / span 11;
  margin: 0;
  align-self: end;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console textarea {
  min-height: 52px;
  max-height: 88px;
  resize: vertical;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-console button {
  min-height: 100%;
  padding: 8px 10px;
  background: linear-gradient(135deg, #ffb84d, #f0a8ff);
  font-size: 11px;
  line-height: 1.05;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-work-grid {
  grid-template-columns: minmax(320px, 0.78fr) minmax(0, 1.22fr);
  gap: 12px;
  align-items: start;
}

body.app-mode[data-active-view="affiliate"] .affiliate-work-grid > article {
  min-width: 0;
  padding: 12px;
  background: rgba(255, 255, 255, 0.86);
}

body.app-mode[data-active-view="affiliate"] .affiliate-work-grid .section-title {
  margin-bottom: 8px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-work-grid .section-title h3 {
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-list {
  gap: 7px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item {
  grid-template-columns: 34px minmax(0, 1fr) minmax(76px, max-content) auto;
  gap: 8px;
  align-items: start;
  min-height: 0;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item.selected {
  background: linear-gradient(135deg, rgba(255, 184, 77, 0.28), rgba(103, 213, 232, 0.12) 64%, #ffffff);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item.admin-affiliate-item {
  grid-template-columns: 34px minmax(0, 1fr) minmax(112px, max-content) auto;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 58%),
    #ffffff;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item > span {
  width: 32px;
  height: 32px;
  background: #ffb84d;
  font-size: 11px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item strong {
  display: block;
  color: #08090d;
  font-size: 12px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item small {
  display: block;
  margin-top: 3px;
  color: rgba(8, 9, 13, 0.68);
  font-size: 10px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item b {
  justify-self: start;
  max-width: 100%;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #e8fff4;
  color: #08090d;
  font-size: 9px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-item b.attention {
  background: #ffe0ec;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-actions {
  align-items: start;
  justify-content: flex-start;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-actions button {
  min-height: 28px;
  padding: 5px 8px;
  background: #fffaf0;
  font-size: 9px;
  line-height: 1;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-panel {
  gap: 9px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-review-card,
body.app-mode[data-active-view="affiliate"] .affiliate-link-grid article,
body.app-mode[data-active-view="affiliate"] .affiliate-media-kit article,
body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger,
body.app-mode[data-active-view="affiliate"] .module-rule-stack .module-rule-item {
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  padding: 10px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="affiliate"] .affiliate-review-card {
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.22), transparent 48%),
    #ffffff;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-summary {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), transparent 48%),
    linear-gradient(35deg, rgba(223, 255, 63, 0.18), transparent 68%),
    #ffffff;
}

body.app-mode[data-active-view="affiliate"] .affiliate-review-card h3 {
  margin: 4px 0 6px;
  font-size: clamp(19px, 1.55vw, 23px);
  line-height: 1.08;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .affiliate-review-card p,
body.app-mode[data-active-view="affiliate"] .affiliate-link-grid p,
body.app-mode[data-active-view="affiliate"] .affiliate-media-kit p {
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.76);
  font-size: 11px;
  line-height: 1.28;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-code-row {
  display: grid;
  grid-template-columns: minmax(160px, max-content) minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  margin: 8px 0 10px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #08090d;
  color: #fffaf0;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.25);
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-code-row strong {
  color: #dfff3f;
  font-size: 13px;
  line-height: 1.1;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-code-row span {
  color: rgba(255, 250, 240, 0.78);
  font-size: 10px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .affiliate-terms-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-terms-grid article {
  padding: 8px;
  background: #fffaf0;
}

body.app-mode[data-active-view="affiliate"] .affiliate-terms-grid article:nth-child(2n) {
  background: #e8fff4;
}

body.app-mode[data-active-view="affiliate"] .affiliate-terms-grid span,
body.app-mode[data-active-view="affiliate"] .affiliate-link-grid small,
body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger small,
body.app-mode[data-active-view="affiliate"] .module-rule-stack small {
  font-size: 9.5px;
  line-height: 1.22;
}

body.app-mode[data-active-view="affiliate"] .affiliate-terms-grid strong,
body.app-mode[data-active-view="affiliate"] .affiliate-link-grid strong,
body.app-mode[data-active-view="affiliate"] .affiliate-media-kit strong,
body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger strong,
body.app-mode[data-active-view="affiliate"] .module-rule-stack strong {
  color: #08090d;
  font-size: 12px;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="affiliate"] .affiliate-link-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-link-grid article:first-child {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.18), #ffffff 58%);
}

body.app-mode[data-active-view="affiliate"] .affiliate-link-grid article:last-child {
  background: linear-gradient(135deg, rgba(240, 168, 255, 0.16), #ffffff 58%);
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-performance article:first-child {
  background: linear-gradient(135deg, rgba(223, 255, 63, 0.18), #ffffff 58%);
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-performance article:last-child {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.18), #ffffff 58%);
}

body.app-mode[data-active-view="affiliate"] .affiliate-link-grid p + p {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed rgba(8, 9, 13, 0.22);
}

body.app-mode[data-active-view="affiliate"] .affiliate-media-kit {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-media-kit article:nth-child(3n + 1) {
  background: #fffaf0;
}

body.app-mode[data-active-view="affiliate"] .affiliate-media-kit article:nth-child(3n + 2) {
  background: #e8fff4;
}

body.app-mode[data-active-view="affiliate"] .affiliate-media-kit article:nth-child(3n) {
  background: #effbff;
}

body.app-mode[data-active-view="affiliate"] .affiliate-program-panel .module-rule-stack {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.15), transparent 58%),
    #ffffff;
}

body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger > .eyebrow {
  grid-column: 1 / -1;
}

body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger article {
  padding: 8px;
  border: 1px solid rgba(8, 9, 13, 0.28);
  background: #fffaf0;
}

body.app-mode[data-active-view="affiliate"] .affiliate-event-ledger span {
  font-size: 10px;
  line-height: 1.22;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-history article p {
  grid-column: 1 / -1;
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.7);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-application > span {
  background: #f0a8ff;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-action-row a,
body.app-mode[data-active-view="affiliate"] .admin-affiliate-action-row button {
  min-height: 32px;
  border: 2px solid #08090d;
  border-radius: 7px;
  padding: 7px 9px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 2px 2px 0 #08090d;
  font-size: 10px;
  font-weight: 950;
  line-height: 1.05;
  text-decoration: none;
  cursor: pointer;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-action-row button:last-child {
  background: #dfff3f;
}

/* Affiliate Polxy dock: sticky partner-program, terms, ledger, and payout-risk prompt. */
.affiliate-agent-dock {
  display: none;
}

body.app-mode[data-active-view="affiliate"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="affiliate"] [data-view-section="affiliate"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.admin-mode[data-active-view="affiliate"] > .app-shell > main {
  padding-bottom: 24px !important;
}

body.app-mode.admin-mode[data-active-view="affiliate"] [data-view-section="affiliate"] {
  padding-bottom: 24px !important;
}

body.app-mode.admin-mode[data-active-view="affiliate"] .affiliate-agent-dock {
  display: none !important;
}

body.app-mode.sidebar-collapsed[data-active-view="affiliate"] .affiliate-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-mode,
body.app-mode[data-active-view="affiliate"] .affiliate-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-mode button,
body.app-mode[data-active-view="affiliate"] .affiliate-agent-options button,
body.app-mode[data-active-view="affiliate"] .affiliate-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fffaf0 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-mode button.active,
body.app-mode[data-active-view="affiliate"] .affiliate-agent-send {
  background: #ffb84d !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-affiliate-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-affiliate-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-affiliate-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-affiliate-answer .affiliate-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(255, 184, 77, 0.26), transparent 52%),
    linear-gradient(35deg, rgba(110, 231, 183, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-affiliate-answer .affiliate-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-affiliate-answer .affiliate-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(255, 184, 77, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-affiliate-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-affiliate-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-affiliate-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-affiliate-answer .dashboard-report-section,
.dashboard-answer-dialog.is-affiliate-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="affiliate"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="affiliate"] [data-view-section="affiliate"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="affiliate"] .affiliate-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="affiliate"] .affiliate-agent-mode button,
  body.app-mode[data-active-view="affiliate"] .affiliate-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="affiliate"] .affiliate-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="affiliate"] .affiliate-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-affiliate-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-affiliate-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-affiliate-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* SEO page polish: calmer search palette, tighter cards, and contained keyword text. */
body.app-mode[data-active-view="seo"] .seo-intelligence-page {
  gap: 12px;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.16), transparent 40%),
    linear-gradient(315deg, rgba(103, 213, 232, 0.14), transparent 46%),
    #f8fff8;
}

body.app-mode[data-active-view="seo"] .seo-intelligence-page .panel-header {
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  border-color: rgba(8, 9, 13, 0.9);
  background: linear-gradient(135deg, #ffffff 0%, #effbf5 56%, #eefbff 100%);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="seo"] .seo-intelligence-page .panel-header h2 {
  max-width: 22ch;
  font-size: clamp(21px, 1.85vw, 27px);
  line-height: 1.04;
  letter-spacing: 0;
}

body.app-mode[data-active-view="seo"] #seo-module-status {
  min-height: 30px;
  padding: 7px 10px;
  background: #6ee7b7;
  color: #08090d;
  font-size: 10px;
  line-height: 1.1;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="seo"] .seo-command-hero {
  grid-template-columns: minmax(0, 1.08fr) minmax(240px, 0.7fr) 118px;
  gap: 10px;
  margin: 0;
  align-items: stretch;
}

body.app-mode[data-active-view="seo"] .seo-command-hero > div,
body.app-mode[data-active-view="seo"] .seo-serp-card {
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="seo"] .seo-command-hero > div:first-child {
  gap: 6px;
  padding: 11px !important;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.22), transparent 58%),
    #ffffff !important;
}

body.app-mode[data-active-view="seo"] .seo-command-hero strong {
  font-size: 17px;
  line-height: 1.08;
  letter-spacing: 0;
}

body.app-mode[data-active-view="seo"] .seo-command-hero p,
body.app-mode[data-active-view="seo"] .seo-serp-card p {
  margin: 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 11px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] .seo-query-bar {
  gap: 3px;
  margin-top: 5px;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ecfdf5;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="seo"] .seo-query-bar b,
body.app-mode[data-active-view="seo"] .seo-serp-card strong {
  color: #08090d !important;
  font-size: 12px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] .seo-query-bar span,
body.app-mode[data-active-view="seo"] .seo-serp-card span,
body.app-mode[data-active-view="seo"] .seo-query-bar small,
body.app-mode[data-active-view="seo"] .seo-serp-card small {
  font-size: 9px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] .seo-serp-card {
  align-content: center;
  gap: 5px;
  padding: 11px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 58%),
    #ffffff !important;
}

body.app-mode[data-active-view="seo"] #seo-create-brief {
  min-width: 0;
  min-height: 0;
  padding: 9px;
  background: linear-gradient(135deg, #6ee7b7, #67d5e8);
  color: #08090d;
  font-size: 10.5px;
  line-height: 1.1;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid article {
  min-height: 68px;
  padding: 9px !important;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid article:nth-child(4n + 1) {
  background: linear-gradient(135deg, rgba(110, 231, 183, 0.28), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid article:nth-child(4n + 2) {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.22), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid article:nth-child(4n + 3) {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.20), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid article:nth-child(4n) {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.16), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid strong {
  font-size: 20px;
  line-height: 1;
}

body.app-mode[data-active-view="seo"] #seo-kpi-grid small,
body.app-mode[data-active-view="seo"] #seo-kpi-grid .eyebrow {
  font-size: 9.5px;
  line-height: 1.18;
}

body.app-mode[data-active-view="seo"] .seo-action-console {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button {
  min-height: 64px;
  padding: 8px 9px !important;
  border-width: 2px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 1) {
  background: linear-gradient(135deg, rgba(110, 231, 183, 0.28), #ffffff 66%) !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 2) {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.24), #ffffff 66%) !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 3) {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.22), #ffffff 66%) !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 4) {
  background: linear-gradient(135deg, rgba(251, 113, 133, 0.16), #ffffff 66%) !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n) {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.16), #ffffff 66%) !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console span {
  padding: 3px 5px;
  border-width: 1px;
  background: rgba(255, 255, 255, 0.8);
  font-size: 8px;
}

body.app-mode[data-active-view="seo"] .seo-action-console strong {
  font-size: 10.5px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] .seo-workbench-grid {
  grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(0, 1fr));
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="seo"] .seo-rank-map,
body.app-mode[data-active-view="seo"] .seo-task-card,
body.app-mode[data-active-view="seo"] .seo-pipeline-grid > article {
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="seo"] .seo-rank-map {
  gap: 5px;
  padding: 9px !important;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.18), transparent 62%),
    #ffffff !important;
}

body.app-mode[data-active-view="seo"] .seo-rank-map div {
  min-height: 30px;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 6px;
  padding: 5px;
  border-width: 1px;
  background: #f8fff8;
}

body.app-mode[data-active-view="seo"] .seo-rank-map b {
  min-height: 22px;
  background: #6ee7b7;
  font-size: 10px;
  line-height: 1;
}

body.app-mode[data-active-view="seo"] .seo-rank-map small {
  font-size: 9.5px;
  line-height: 1.16;
}

body.app-mode[data-active-view="seo"] .seo-task-card {
  min-height: 118px;
  padding: 10px !important;
  gap: 6px;
}

body.app-mode[data-active-view="seo"] .seo-task-card:nth-child(4n + 2) {
  background: linear-gradient(135deg, rgba(103, 213, 232, 0.16), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] .seo-task-card:nth-child(4n + 3) {
  background: linear-gradient(135deg, rgba(110, 231, 183, 0.18), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] .seo-task-card:nth-child(4n) {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.14), #ffffff 64%) !important;
}

body.app-mode[data-active-view="seo"] .seo-task-card .eyebrow {
  width: fit-content;
  padding: 3px 5px;
  border: 1px solid rgba(8, 9, 13, 0.75);
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: none;
  font-size: 7.8px;
}

body.app-mode[data-active-view="seo"] .seo-task-card strong {
  max-width: none;
  font-size: 12.5px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] .seo-task-card p {
  max-width: none;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10.5px;
  font-weight: 650;
  line-height: 1.24;
}

body.app-mode[data-active-view="seo"] .seo-pipeline-grid {
  grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
  gap: 10px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="seo"] .seo-pipeline-grid > article {
  min-width: 0;
  padding: 10px !important;
}

body.app-mode[data-active-view="seo"] .seo-pipeline-grid .section-title {
  margin-bottom: 7px;
}

body.app-mode[data-active-view="seo"] .seo-pipeline-grid .section-title h3 {
  font-size: 16px;
  line-height: 1.08;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list,
body.app-mode[data-active-view="seo"] #seo-pipeline-list {
  gap: 7px;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list article {
  grid-template-columns: 30px minmax(0, 1fr) minmax(74px, max-content);
  gap: 7px;
  min-height: 0;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list article > span {
  width: 28px;
  height: 28px;
  min-width: 28px;
  background: #67d5e8;
  font-size: 8px;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list strong,
body.app-mode[data-active-view="seo"] #seo-pipeline-list strong {
  color: #08090d;
  font-size: 12px;
  line-height: 1.14;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list small,
body.app-mode[data-active-view="seo"] #seo-pipeline-list small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list b {
  justify-self: end;
  max-width: 100%;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #ecfdf5;
  font-size: 8px;
  line-height: 1.05;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="seo"] #seo-pipeline-list article.module-rule-item,
body.app-mode[data-active-view="seo"] #seo-pipeline-list article.module-agent-output {
  min-height: 0;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="seo"] #seo-pipeline-list article.module-rule-item:nth-child(odd),
body.app-mode[data-active-view="seo"] #seo-pipeline-list article.module-agent-output:nth-child(odd) {
  background: #f8fff8;
}

/* SEO Polxy dock: sticky search-readiness, keyword, content, and technical-audit prompt. */
.seo-agent-dock {
  display: none;
}

body.app-mode[data-active-view="seo"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="seo"] [data-view-section="seo"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #f4fbf7 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="seo"] .seo-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-mode,
body.app-mode[data-active-view="seo"] .seo-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="seo"] .seo-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-mode button,
body.app-mode[data-active-view="seo"] .seo-agent-options button,
body.app-mode[data-active-view="seo"] .seo-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #f4fbf7 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-mode button.active,
body.app-mode[data-active-view="seo"] .seo-agent-send {
  background: #6ee7b7 !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="seo"] .seo-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-seo-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-seo-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-seo-answer .dashboard-answer-modal h2 {
  max-width: 36ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-seo-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-seo-answer .seo-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.24), transparent 52%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-seo-answer .seo-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-seo-answer .seo-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(110, 231, 183, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-seo-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-seo-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-seo-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-seo-answer .dashboard-report-section,
.dashboard-answer-dialog.is-seo-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="seo"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="seo"] [data-view-section="seo"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="seo"] .seo-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="seo"] .seo-agent-mode button,
  body.app-mode[data-active-view="seo"] .seo-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="seo"] .seo-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="seo"] .seo-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-seo-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-seo-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-seo-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Community page polish: compact discovery, calmer moderation colors, and contained prompt cards. */
body.app-mode[data-active-view="community"] .community-ops-page {
  gap: 12px;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.16), transparent 42%),
    linear-gradient(315deg, rgba(190, 242, 100, 0.13), transparent 46%),
    #f7fbff;
}

body.app-mode[data-active-view="community"] .community-ops-page .panel-header {
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  border-color: rgba(8, 9, 13, 0.9);
  background: linear-gradient(135deg, #ffffff 0%, #eef8ff 56%, #f4ffe8 100%);
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-ops-page .panel-header h2 {
  max-width: 24ch;
  font-size: clamp(21px, 1.9vw, 28px);
  line-height: 1.04;
  letter-spacing: 0;
}

body.app-mode[data-active-view="community"] #community-module-status {
  min-height: 30px;
  padding: 7px 10px;
  background: #7dd3fc;
  color: #08090d;
  font-size: 10px;
  line-height: 1.1;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-command-hero {
  grid-template-columns: minmax(0, 1.08fr) minmax(230px, 0.58fr) 156px;
  gap: 10px;
  margin: 0;
}

body.app-mode[data-active-view="community"] .community-command-hero > div:first-child,
body.app-mode[data-active-view="community"] .community-alert-stack {
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-command-hero > div:first-child {
  gap: 6px;
  padding: 11px !important;
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.18), transparent 60%),
    #ffffff !important;
}

body.app-mode[data-active-view="community"] .community-command-hero strong {
  font-size: 17px;
  line-height: 1.08;
  letter-spacing: 0;
}

body.app-mode[data-active-view="community"] .community-command-hero p {
  margin: 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 11px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-alert-stack {
  gap: 6px;
  padding: 9px !important;
  background:
    linear-gradient(135deg, rgba(190, 242, 100, 0.18), transparent 62%),
    #ffffff !important;
}

body.app-mode[data-active-view="community"] .community-alert-stack span {
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 6px;
  min-height: 33px;
  padding: 5px 6px;
  border-width: 1px;
  background: #f7fbff;
  font-size: 8.5px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-alert-stack b {
  min-height: 23px;
  background: #bef264;
  font-size: 10px;
  line-height: 1;
}

body.app-mode[data-active-view="community"] .community-hero-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  align-content: stretch;
}

body.app-mode[data-active-view="community"] .community-hero-actions button {
  min-height: 0;
  width: 100%;
  padding: 9px 10px;
  font-size: 10.5px;
  line-height: 1.08;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="community"] #community-discovery-default {
  background: linear-gradient(135deg, #7dd3fc, #bef264);
}

body.app-mode[data-active-view="community"] #community-create-flow {
  background: #ffffff;
}

body.app-mode[data-active-view="community"] #community-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="community"] #community-kpi-grid article {
  min-height: 68px;
  padding: 9px !important;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="community"] #community-kpi-grid article:nth-child(4n + 1) {
  background: linear-gradient(135deg, rgba(125, 211, 252, 0.25), #ffffff 64%) !important;
}

body.app-mode[data-active-view="community"] #community-kpi-grid article:nth-child(4n + 2) {
  background: linear-gradient(135deg, rgba(190, 242, 100, 0.22), #ffffff 64%) !important;
}

body.app-mode[data-active-view="community"] #community-kpi-grid article:nth-child(4n + 3) {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.18), #ffffff 64%) !important;
}

body.app-mode[data-active-view="community"] #community-kpi-grid article:nth-child(4n) {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.14), #ffffff 64%) !important;
}

body.app-mode[data-active-view="community"] #community-kpi-grid strong {
  font-size: 20px;
  line-height: 1;
}

body.app-mode[data-active-view="community"] #community-kpi-grid small,
body.app-mode[data-active-view="community"] #community-kpi-grid .eyebrow {
  font-size: 9.5px;
  line-height: 1.18;
}

body.app-mode[data-active-view="community"] .community-discovery-console {
  grid-template-columns: repeat(24, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 8px;
  align-items: stretch;
  margin: 0;
  padding: 10px;
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.16), transparent 58%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-discovery-console label {
  min-width: 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
}

body.app-mode[data-active-view="community"] .community-discovery-console label:nth-of-type(1) {
  grid-column: 1 / span 4;
}

body.app-mode[data-active-view="community"] .community-discovery-console label:nth-of-type(2) {
  grid-column: 5 / span 6;
}

body.app-mode[data-active-view="community"] .community-discovery-console label:nth-of-type(3) {
  grid-column: 11 / span 5;
}

body.app-mode[data-active-view="community"] .community-discovery-console label:nth-of-type(4) {
  grid-column: 16 / span 5;
}

body.app-mode[data-active-view="community"] .community-discovery-console label:nth-of-type(5) {
  grid-column: 1 / span 20;
}

body.app-mode[data-active-view="community"] .community-discovery-console button {
  grid-column: 21 / span 4;
  grid-row: 1 / span 2;
}

body.app-mode[data-active-view="community"] .community-discovery-console .wide-field {
  min-width: 0;
}

body.app-mode[data-active-view="community"] .community-discovery-console input,
body.app-mode[data-active-view="community"] .community-discovery-console select,
body.app-mode[data-active-view="community"] .community-discovery-console textarea {
  min-height: 34px;
  padding: 7px 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #f7fbff;
  color: #08090d;
  font-size: 11px;
  line-height: 1.2;
  overflow-wrap: anywhere;
  box-shadow: none;
}

body.app-mode[data-active-view="community"] .community-discovery-console textarea {
  min-height: 52px;
  max-height: 86px;
  resize: vertical;
}

body.app-mode[data-active-view="community"] .community-discovery-console button {
  min-height: 100%;
  padding: 8px 10px;
  background: linear-gradient(135deg, #7dd3fc, #bef264);
  font-size: 11px;
  line-height: 1.05;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-discovery-grid {
  grid-template-columns: minmax(300px, 0.78fr) minmax(0, 1.22fr);
  gap: 10px;
  align-items: start;
  margin: 0;
}

body.app-mode[data-active-view="community"] .community-discovery-grid > article {
  min-width: 0;
  padding: 10px !important;
  background: rgba(255, 255, 255, 0.88);
}

body.app-mode[data-active-view="community"] .community-discovery-grid .section-title {
  margin-bottom: 7px;
}

body.app-mode[data-active-view="community"] .community-discovery-grid .section-title h3,
body.app-mode[data-active-view="community"] .community-flow-grid .section-title h3 {
  font-size: 16px;
  line-height: 1.08;
}

body.app-mode[data-active-view="community"] .community-target-list {
  gap: 7px;
}

body.app-mode[data-active-view="community"] .community-target-item {
  grid-template-columns: 32px minmax(0, 1fr) minmax(66px, max-content) auto;
  gap: 7px;
  align-items: start;
  min-height: 0;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-target-item.selected {
  background: linear-gradient(135deg, rgba(125, 211, 252, 0.22), rgba(190, 242, 100, 0.12) 68%, #ffffff);
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-target-item > span {
  width: 30px;
  height: 30px;
  background: #7dd3fc;
  font-size: 9px;
}

body.app-mode[data-active-view="community"] .community-target-item strong {
  display: block;
  color: #08090d;
  font-size: 11.5px;
  line-height: 1.13;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-target-item small {
  display: block;
  margin-top: 3px;
  color: rgba(8, 9, 13, 0.68);
  font-size: 9.5px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-target-item b {
  justify-self: start;
  max-width: 100%;
  padding: 5px 6px;
  border: 2px solid #08090d;
  background: #f4ffe8;
  color: #08090d;
  font-size: 8px;
  line-height: 1.05;
  text-align: center;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-target-item b.attention {
  background: #fff2dc;
}

body.app-mode[data-active-view="community"] .community-target-actions {
  align-items: start;
  justify-content: flex-start;
}

body.app-mode[data-active-view="community"] .community-target-actions button {
  min-height: 27px;
  padding: 5px 8px;
  background: #ffffff;
  font-size: 8.5px;
  line-height: 1;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-target-panel {
  gap: 8px;
}

body.app-mode[data-active-view="community"] .community-review-card,
body.app-mode[data-active-view="community"] .community-theme-grid article,
body.app-mode[data-active-view="community"] .community-prompt-grid article,
body.app-mode[data-active-view="community"] .community-flow-grid > article,
body.app-mode[data-active-view="community"] .community-lane {
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  padding: 10px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="community"] .community-review-card {
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.18), transparent 58%),
    #ffffff;
}

body.app-mode[data-active-view="community"] .community-review-card h3 {
  margin: 4px 0 6px;
  font-size: clamp(18px, 1.45vw, 22px);
  line-height: 1.08;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-review-card p,
body.app-mode[data-active-view="community"] .community-theme-grid p,
body.app-mode[data-active-view="community"] .community-prompt-grid p {
  margin: 4px 0 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 10px;
  line-height: 1.2;
}

body.app-mode[data-active-view="community"] .community-score-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}

body.app-mode[data-active-view="community"] .community-score-grid article {
  padding: 8px;
  background: #f7fbff;
}

body.app-mode[data-active-view="community"] .community-score-grid article:nth-child(2n) {
  background: #f4ffe8;
}

body.app-mode[data-active-view="community"] .community-score-grid span,
body.app-mode[data-active-view="community"] .community-theme-grid .eyebrow,
body.app-mode[data-active-view="community"] .community-prompt-grid .eyebrow {
  font-size: 9px;
  line-height: 1.18;
}

body.app-mode[data-active-view="community"] .community-score-grid strong,
body.app-mode[data-active-view="community"] .community-theme-grid strong,
body.app-mode[data-active-view="community"] .community-prompt-grid strong,
body.app-mode[data-active-view="community"] .community-theme-grid a {
  color: #08090d;
  font-size: 11.5px;
  line-height: 1.14;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-theme-grid,
body.app-mode[data-active-view="community"] .community-prompt-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="community"] .community-theme-grid article:first-child,
body.app-mode[data-active-view="community"] .community-prompt-grid article:nth-child(4n + 1) {
  background: #f7fbff;
}

body.app-mode[data-active-view="community"] .community-theme-grid article:last-child,
body.app-mode[data-active-view="community"] .community-prompt-grid article:nth-child(4n + 2) {
  background: #f4ffe8;
}

body.app-mode[data-active-view="community"] .community-prompt-grid article:nth-child(4n + 3) {
  background: #fffaf0;
}

body.app-mode[data-active-view="community"] .community-prompt-grid article:nth-child(4n) {
  background: #f4f0ff;
}

body.app-mode[data-active-view="community"] .community-action-console {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="community"] .community-action-console button {
  min-height: 62px;
  padding: 8px 9px !important;
  border-width: 2px !important;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="community"] .community-action-console button:nth-child(4n + 1) {
  background: linear-gradient(135deg, rgba(125, 211, 252, 0.24), #ffffff 66%) !important;
}

body.app-mode[data-active-view="community"] .community-action-console button:nth-child(4n + 2) {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.18), #ffffff 66%) !important;
}

body.app-mode[data-active-view="community"] .community-action-console button:nth-child(4n + 3) {
  background: linear-gradient(135deg, rgba(190, 242, 100, 0.22), #ffffff 66%) !important;
}

body.app-mode[data-active-view="community"] .community-action-console button:nth-child(4n) {
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.14), #ffffff 66%) !important;
}

body.app-mode[data-active-view="community"] .community-action-console span {
  padding: 3px 5px;
  border-width: 1px;
  background: rgba(255, 255, 255, 0.84);
  font-size: 8px;
}

body.app-mode[data-active-view="community"] .community-action-console strong {
  font-size: 10.5px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-board {
  grid-template-columns: 1fr 1fr 1fr;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="community"] .community-lane {
  gap: 6px;
  min-height: 118px;
  padding: 10px !important;
}

body.app-mode[data-active-view="community"] .risk-lane {
  background:
    linear-gradient(135deg, rgba(251, 113, 133, 0.18), transparent 64%),
    #ffffff !important;
}

body.app-mode[data-active-view="community"] .journey-lane {
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.18), transparent 64%),
    #ffffff !important;
}

body.app-mode[data-active-view="community"] .growth-lane {
  background:
    linear-gradient(135deg, rgba(190, 242, 100, 0.20), transparent 64%),
    #ffffff !important;
}

body.app-mode[data-active-view="community"] .community-lane strong {
  max-width: none;
  font-size: 12.5px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] .community-lane p {
  margin: 0;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 10px;
  line-height: 1.22;
}

body.app-mode[data-active-view="community"] .community-lane small {
  padding: 5px 6px;
  border-width: 1px;
  background: rgba(255, 255, 255, 0.86);
  font-size: 8.8px;
  line-height: 1.14;
}

body.app-mode[data-active-view="community"] .community-flow-grid {
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 10px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="community"] .community-flow-grid > article {
  min-width: 0;
  padding: 10px !important;
}

body.app-mode[data-active-view="community"] #community-integration-list,
body.app-mode[data-active-view="community"] #community-flow-list {
  gap: 7px;
}

body.app-mode[data-active-view="community"] #community-integration-list article {
  grid-template-columns: 30px minmax(0, 1fr) minmax(72px, max-content);
  gap: 7px;
  min-height: 0;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="community"] #community-integration-list article > span {
  width: 28px;
  height: 28px;
  min-width: 28px;
  background: #7dd3fc;
  font-size: 8px;
}

body.app-mode[data-active-view="community"] #community-integration-list strong,
body.app-mode[data-active-view="community"] #community-flow-list strong {
  color: #08090d;
  font-size: 11.5px;
  line-height: 1.14;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] #community-integration-list small,
body.app-mode[data-active-view="community"] #community-flow-list small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 9.6px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="community"] #community-integration-list b {
  justify-self: end;
  max-width: 100%;
  padding: 5px 6px;
  border: 2px solid #08090d;
  background: #f4ffe8 !important;
  font-size: 8px;
  line-height: 1.05;
  white-space: normal;
  text-align: center;
}

body.app-mode[data-active-view="community"] #community-flow-list article.module-rule-item,
body.app-mode[data-active-view="community"] #community-flow-list article.module-agent-output {
  min-height: 0;
  padding: 8px;
  border: 2px solid rgba(8, 9, 13, 0.9);
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="community"] #community-flow-list article:nth-child(odd) {
  background: #f7fbff;
}

.community-agent-dock {
  display: none;
}

body.app-mode[data-active-view="community"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="community"] [data-view-section="community"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="community"] .community-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #f7fbff !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="community"] .community-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="community"] .community-agent-mode,
body.app-mode[data-active-view="community"] .community-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="community"] .community-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="community"] .community-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="community"] .community-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="community"] .community-agent-mode button,
body.app-mode[data-active-view="community"] .community-agent-options button,
body.app-mode[data-active-view="community"] .community-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #f7fbff !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="community"] .community-agent-mode button.active,
body.app-mode[data-active-view="community"] .community-agent-send,
body.app-mode[data-active-view="community"] .community-agent-options button:hover {
  background: #7dd3fc !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="community"] .community-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="community"] .community-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="community"] .community-agent-dock.is-running {
  outline: 3px solid #bef264;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-community-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-community-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-community-answer .dashboard-answer-modal h2 {
  max-width: 36ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-community-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-community-answer .community-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.24), transparent 54%),
    linear-gradient(35deg, rgba(190, 242, 100, 0.18), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-community-answer .community-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-community-answer .community-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(125, 211, 252, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-community-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-community-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-community-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-community-answer .dashboard-report-section,
.dashboard-answer-dialog.is-community-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="community"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="community"] [data-view-section="community"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="community"] .community-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="community"] .community-agent-mode button,
  body.app-mode[data-active-view="community"] .community-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="community"] .community-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="community"] .community-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-community-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-community-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-community-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Reach page polish: compact owned-audience workspace with one sticky prompt dock. */
body.app-mode[data-active-view="reach"] .reach-module {
  display: grid;
  gap: 12px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.16), transparent 36%),
    linear-gradient(315deg, rgba(167, 139, 250, 0.13), transparent 42%),
    #fffaf1;
  overflow: visible;
}

body.app-mode[data-active-view="reach"] .reach-module > .panel-header {
  align-items: start;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  background:
    linear-gradient(90deg, rgba(216, 255, 36, 0.18), transparent 46%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-module > .panel-header > div {
  min-width: 0;
}

body.app-mode[data-active-view="reach"] .reach-module > .panel-header h2 {
  max-width: 34ch;
  font-size: 26px;
  line-height: 1.04;
  letter-spacing: 0;
}

body.app-mode[data-active-view="reach"] #reach-module-status {
  min-height: 28px;
  padding: 6px 9px;
  font-size: 9px;
  white-space: nowrap;
}

body.app-mode[data-active-view="reach"] .reach-module .module-hero-strip {
  grid-template-columns: minmax(0, 1fr) 176px;
  gap: 12px;
  margin: 0;
  padding: 12px;
  background:
    linear-gradient(120deg, rgba(125, 211, 252, 0.22), transparent 46%),
    linear-gradient(280deg, rgba(253, 186, 116, 0.18), transparent 54%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-module .module-hero-strip strong {
  max-width: 62ch;
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode[data-active-view="reach"] .reach-module .module-hero-strip p {
  max-width: 78ch;
  margin-top: 5px;
  font-size: 12px;
  line-height: 1.3;
}

body.app-mode[data-active-view="reach"] #reach-create-default {
  align-self: stretch;
  width: 100%;
  min-height: 44px;
  font-size: 10px;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid article {
  min-height: 58px;
  padding: 9px 10px;
  border-width: 2px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid article:nth-child(1) {
  background: #edffbd;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid article:nth-child(2) {
  background: #d9f7ff;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid article:nth-child(3) {
  background: #efe6ff;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid article:nth-child(4) {
  background: #fff0da;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid strong {
  font-size: 20px;
  line-height: 1;
}

body.app-mode[data-active-view="reach"] #reach-kpi-grid small,
body.app-mode[data-active-view="reach"] #reach-kpi-grid .eyebrow {
  font-size: 9px;
  line-height: 1.18;
}

body.app-mode[data-active-view="reach"] .reach-message-console {
  grid-template-columns: repeat(24, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 8px;
  align-items: stretch;
  margin: 0;
  padding: 10px;
  background:
    linear-gradient(135deg, rgba(216, 255, 36, 0.22), transparent 45%),
    #f8fff0;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-message-console label {
  display: grid;
  gap: 4px;
  min-width: 0;
  font-size: 9px;
  line-height: 1.1;
}

body.app-mode[data-active-view="reach"] .reach-message-console label:nth-of-type(1) {
  grid-column: span 4;
}

body.app-mode[data-active-view="reach"] .reach-message-console label:nth-of-type(2),
body.app-mode[data-active-view="reach"] .reach-message-console label:nth-of-type(3) {
  grid-column: span 5;
}

body.app-mode[data-active-view="reach"] .reach-message-console label:nth-of-type(4) {
  grid-column: span 6;
}

body.app-mode[data-active-view="reach"] .reach-message-console label:nth-of-type(5) {
  grid-column: 1 / span 6;
}

body.app-mode[data-active-view="reach"] .reach-message-console .wide-field {
  grid-column: 7 / span 14;
}

body.app-mode[data-active-view="reach"] .reach-message-console input,
body.app-mode[data-active-view="reach"] .reach-message-console select,
body.app-mode[data-active-view="reach"] .reach-message-console textarea {
  min-width: 0;
  width: 100%;
  min-height: 34px;
  padding: 7px 8px;
  font-size: 11px;
  line-height: 1.2;
}

body.app-mode[data-active-view="reach"] .reach-message-console textarea {
  min-height: 58px;
}

body.app-mode[data-active-view="reach"] .reach-message-console button {
  grid-column: 21 / span 4;
  grid-row: 1 / span 2;
  align-self: stretch;
  min-height: 0;
  padding: 8px;
  font-size: 10px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-work-grid {
  grid-template-columns: minmax(300px, 0.78fr) minmax(0, 1.22fr);
  gap: 12px;
  align-items: start;
  margin: 0;
}

body.app-mode[data-active-view="reach"] .reach-work-grid > article {
  min-width: 0;
  padding: 12px;
  border: 3px solid #08090d;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), transparent 68%),
    #fffaf4;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-work-grid .section-title {
  margin-bottom: 9px;
}

body.app-mode[data-active-view="reach"] .reach-work-grid .section-title h3 {
  font-size: 18px;
  line-height: 1.08;
}

body.app-mode[data-active-view="reach"] .reach-message-item {
  grid-template-columns: 32px minmax(0, 1fr) max-content auto;
  align-items: start;
  gap: 8px;
  min-height: 0;
  padding: 8px;
}

body.app-mode[data-active-view="reach"] .reach-message-item > span {
  width: 28px;
  height: 28px;
  border: 2px solid #08090d;
  background: #d9f7ff;
  color: #08090d;
  font-size: 8px;
  font-weight: 900;
}

body.app-mode[data-active-view="reach"] .reach-message-item strong {
  color: #08090d;
  font-size: 12px;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reach"] .reach-message-item small {
  color: rgba(8, 9, 13, 0.7);
  font-size: 9.6px;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reach"] .reach-message-item b {
  max-width: 118px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #efe6ff;
  color: #08090d;
  font-size: 8px;
  line-height: 1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

body.app-mode[data-active-view="reach"] .reach-message-item.selected {
  background: #f4ffe0;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-message-actions {
  align-self: stretch;
}

body.app-mode[data-active-view="reach"] .reach-message-actions button {
  min-height: 28px;
  padding: 5px 8px;
  font-size: 9px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-message-panel {
  gap: 10px;
}

body.app-mode[data-active-view="reach"] .reach-review-card,
body.app-mode[data-active-view="reach"] .reach-source-card,
body.app-mode[data-active-view="reach"] .reach-adaptation-grid article {
  padding: 12px;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-review-card {
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.18), transparent 48%),
    #ffffff;
}

body.app-mode[data-active-view="reach"] .reach-review-card h3 {
  margin: 5px 0 7px;
  font-size: 21px;
  line-height: 1.08;
}

body.app-mode[data-active-view="reach"] .reach-review-card p,
body.app-mode[data-active-view="reach"] .reach-source-card p,
body.app-mode[data-active-view="reach"] .reach-adaptation-grid p {
  font-size: 11.5px;
  line-height: 1.32;
}

body.app-mode[data-active-view="reach"] .reach-score-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}

body.app-mode[data-active-view="reach"] .reach-score-grid article {
  padding: 8px;
  background: #f8fff0;
}

body.app-mode[data-active-view="reach"] .reach-score-grid strong {
  font-size: 11px;
}

body.app-mode[data-active-view="reach"] .reach-score-grid span {
  font-size: 8px;
  line-height: 1.16;
}

body.app-mode[data-active-view="reach"] .reach-source-card {
  background: #fff7e9;
}

body.app-mode[data-active-view="reach"] .reach-source-card strong {
  font-size: 12px;
}

body.app-mode[data-active-view="reach"] .reach-source-actions {
  gap: 6px;
  margin-top: 8px;
}

body.app-mode[data-active-view="reach"] .reach-source-actions a {
  padding: 5px 8px;
  font-size: 9.5px;
  box-shadow: 1px 1px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-evidence-list {
  gap: 4px;
  margin-top: 8px;
  padding-top: 7px;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 8px;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 1) {
  background: #f5ffe2;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 2) {
  background: #eaf9ff;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 3) {
  background: #f4edff;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n) {
  background: #fff0da;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid strong {
  display: block;
  color: #08090d;
  font-size: 12px;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reach"] .reach-adaptation-grid small {
  display: block;
  margin-top: 7px;
  color: rgba(8, 9, 13, 0.68);
  font-size: 9.5px;
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reach"] .reach-message-panel .module-rule-stack {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-mode[data-active-view="reach"] .reach-message-panel .module-rule-item {
  padding: 10px;
  border: 2px solid #08090d;
  background: #ffffff;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="reach"] .reach-message-panel .module-rule-item strong {
  color: #08090d;
  font-size: 11px;
  line-height: 1.16;
}

body.app-mode[data-active-view="reach"] .reach-message-panel .module-rule-item small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 9.5px;
  line-height: 1.25;
}

.reach-agent-dock {
  display: none;
}

body.app-mode[data-active-view="reach"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="reach"] [data-view-section="reach"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="reach"] .reach-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-mode,
body.app-mode[data-active-view="reach"] .reach-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="reach"] .reach-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-mode button,
body.app-mode[data-active-view="reach"] .reach-agent-options button,
body.app-mode[data-active-view="reach"] .reach-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-mode button.active,
body.app-mode[data-active-view="reach"] .reach-agent-send,
body.app-mode[data-active-view="reach"] .reach-agent-options button:hover {
  background: #fdba74 !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="reach"] .reach-agent-dock.is-running {
  outline: 3px solid #7dd3fc;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-reach-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-reach-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-reach-answer .dashboard-answer-modal h2 {
  max-width: 36ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-reach-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-reach-answer .reach-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(253, 186, 116, 0.26), transparent 54%),
    linear-gradient(35deg, rgba(125, 211, 252, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-reach-answer .reach-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-reach-answer .reach-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(253, 186, 116, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-reach-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-reach-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-reach-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-reach-answer .dashboard-report-section,
.dashboard-answer-dialog.is-reach-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="reach"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="reach"] [data-view-section="reach"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="reach"] .reach-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="reach"] .reach-agent-mode button,
  body.app-mode[data-active-view="reach"] .reach-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="reach"] .reach-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="reach"] .reach-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-reach-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-reach-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-reach-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Telegram page polish: compact channel operations with balanced Telegram-blue accents. */
body.app-mode[data-active-view="telegram-module"] .telegram-console-page {
  display: grid;
  gap: 12px;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 36%),
    linear-gradient(315deg, rgba(223, 255, 63, 0.14), transparent 44%),
    #f7fbff !important;
  overflow: visible;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-page .panel-header {
  align-items: start;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.20), transparent 46%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-page .panel-header > div {
  min-width: 0;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-page .panel-header h2 {
  max-width: 42ch;
  font-size: 25px;
  line-height: 1.04;
  letter-spacing: 0;
}

body.app-mode[data-active-view="telegram-module"] #telegram-module-status {
  min-height: 28px;
  padding: 6px 9px;
  font-size: 9px;
  white-space: nowrap;
}

body.app-mode[data-active-view="telegram-module"] .telegram-command-hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(224px, 0.56fr) 150px;
  gap: 10px;
  margin: 0 !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-command-hero > div:first-child,
body.app-mode[data-active-view="telegram-module"] .telegram-phone-preview {
  min-width: 0;
  padding: 12px !important;
  border: 3px solid #08090d;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] .telegram-command-hero > div:first-child {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.20), transparent 52%),
    #ffffff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-command-hero strong {
  max-width: 52ch;
  font-size: 17px;
  line-height: 1.08;
}

body.app-mode[data-active-view="telegram-module"] .telegram-command-hero p,
body.app-mode[data-active-view="telegram-module"] .telegram-phone-preview p {
  font-size: 11px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="telegram-module"] .telegram-phone-preview {
  min-height: 126px;
  border-radius: 14px !important;
  background:
    linear-gradient(160deg, rgba(223, 255, 63, 0.26), transparent 54%),
    #e9fbff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-phone-preview strong {
  font-size: 13px;
  line-height: 1.12;
}

body.app-mode[data-active-view="telegram-module"] .telegram-phone-preview small {
  font-size: 9px;
  line-height: 1.16;
}

body.app-mode[data-active-view="telegram-module"] #telegram-create-plan {
  align-self: stretch;
  width: 100%;
  min-height: 0;
  padding: 9px;
  font-size: 10px;
  line-height: 1.1;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid,
body.app-mode[data-active-view="telegram-module"] .telegram-action-console,
body.app-mode[data-active-view="telegram-module"] .telegram-console-grid,
body.app-mode[data-active-view="telegram-module"] .telegram-work-grid {
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid article {
  min-height: 60px;
  padding: 9px 10px !important;
  border-width: 2px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid article:nth-child(1) {
  background: #d9f7ff !important;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid article:nth-child(2) {
  background: #edffbd !important;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid article:nth-child(3) {
  background: #f0e9ff !important;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid article:nth-child(4) {
  background: #fff0da !important;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid strong {
  font-size: 19px;
  line-height: 1;
}

body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid small,
body.app-mode[data-active-view="telegram-module"] #telegram-kpi-grid .eyebrow {
  font-size: 9px;
  line-height: 1.18;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console button {
  min-height: 56px;
  padding: 8px !important;
  gap: 4px;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console button:nth-child(4n + 1) {
  background: #d9f7ff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console button:nth-child(4n + 2) {
  background: #edffbd !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console button:nth-child(4n + 3) {
  background: #f0e9ff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console button:nth-child(4n) {
  background: #fff0da !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console span {
  padding: 3px 5px;
  font-size: 8px;
}

body.app-mode[data-active-view="telegram-module"] .telegram-action-console strong {
  font-size: 10.5px;
  line-height: 1.12;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card {
  gap: 7px;
  min-height: 126px;
  padding: 11px !important;
  border-width: 3px;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card.channel-card {
  background: #e9fbff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card.bot-card {
  background: #f3ffe1 !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card.commerce-card {
  background: #fff0da !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card strong {
  max-width: 100%;
  font-size: 13px;
  line-height: 1.14;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card p {
  font-size: 10.5px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card div {
  gap: 4px;
}

body.app-mode[data-active-view="telegram-module"] .telegram-console-card div span {
  min-height: 22px;
  padding: 4px 6px;
  font-size: 8px;
}

body.app-mode[data-active-view="telegram-module"] .telegram-work-grid {
  grid-template-columns: minmax(0, 1.12fr) minmax(300px, 0.88fr);
  align-items: start;
}

body.app-mode[data-active-view="telegram-module"] .telegram-work-grid > article {
  min-width: 0;
  padding: 11px !important;
  border: 3px solid #08090d;
  background: #ffffff !important;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-panel {
  grid-column: 1 / -1;
  background: #eefcff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-work-grid .section-title {
  margin-bottom: 8px;
}

body.app-mode[data-active-view="telegram-module"] .telegram-work-grid .section-title h3 {
  font-size: 17px;
  line-height: 1.08;
}

body.app-mode[data-active-view="telegram-module"] #telegram-operation-list,
body.app-mode[data-active-view="telegram-module"] #telegram-revenue-list,
body.app-mode[data-active-view="telegram-module"] #telegram-discovery-list {
  gap: 7px;
}

body.app-mode[data-active-view="telegram-module"] #telegram-operation-list article.module-work-item {
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  min-height: 0;
  padding: 8px;
  background: #f7fbff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] #telegram-operation-list article > span {
  width: 26px;
  height: 26px;
  border: 2px solid #08090d;
  background: #67d5e8 !important;
  color: #08090d;
  font-size: 8px;
  font-weight: 950;
}

body.app-mode[data-active-view="telegram-module"] #telegram-operation-list strong,
body.app-mode[data-active-view="telegram-module"] #telegram-revenue-list strong {
  color: #08090d;
  font-size: 11.5px;
  line-height: 1.14;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="telegram-module"] #telegram-operation-list small,
body.app-mode[data-active-view="telegram-module"] #telegram-revenue-list small {
  color: rgba(8, 9, 13, 0.72);
  font-size: 9.5px;
  line-height: 1.24;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="telegram-module"] #telegram-operation-list b {
  max-width: 118px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  background: #edffbd !important;
  color: #08090d;
  font-size: 8px;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-mode[data-active-view="telegram-module"] #telegram-revenue-list article.module-rule-item {
  min-height: 0;
  padding: 9px;
  border: 2px solid #08090d;
  background: #fffaf4 !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card header {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  gap: 8px;
  align-items: start;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card header span,
body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card header b,
body.app-mode[data-active-view="telegram-module"] .telegram-discovery-meta span {
  min-height: 22px;
  padding: 5px 7px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #edffbd !important;
  color: #08090d;
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card header b {
  max-width: 112px;
  background: #d9f7ff !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card strong,
body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card strong a {
  min-width: 0;
  color: #08090d;
  font-size: 12px;
  line-height: 1.14;
  overflow-wrap: anywhere;
  text-decoration: none;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card strong a:hover {
  text-decoration: underline;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card p {
  margin: 0;
  color: rgba(8, 9, 13, 0.74);
  font-size: 10px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-width: 0;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-meta span {
  max-width: 170px;
  background: #fff0da !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-card .source-backed-evidence {
  margin: 0;
  padding: 7px;
  border-width: 2px;
  border-radius: 7px;
  background: #f7fbff !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-proof {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-proof article {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 7px;
  border: 1px solid rgba(8, 9, 13, 0.18);
  border-radius: 7px;
  background: #fffaf4 !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-proof span {
  color: rgba(8, 9, 13, 0.58);
  font-size: 8px;
  font-weight: 950;
}

body.app-mode[data-active-view="telegram-module"] .telegram-discovery-proof strong {
  font-size: 9.2px;
  line-height: 1.2;
}

.telegram-agent-dock {
  display: none;
}

body.app-mode[data-active-view="telegram-module"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="telegram-module"] [data-view-section="telegram-module"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #f7fbff !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="telegram-module"] .telegram-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-mode,
body.app-mode[data-active-view="telegram-module"] .telegram-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-mode button,
body.app-mode[data-active-view="telegram-module"] .telegram-agent-options button,
body.app-mode[data-active-view="telegram-module"] .telegram-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #f7fbff !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-mode button.active,
body.app-mode[data-active-view="telegram-module"] .telegram-agent-send,
body.app-mode[data-active-view="telegram-module"] .telegram-agent-options button:hover {
  background: #67d5e8 !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="telegram-module"] .telegram-agent-dock.is-running {
  outline: 3px solid #dfff3f;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-telegram-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-telegram-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-telegram-answer .dashboard-answer-modal h2 {
  max-width: 36ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-telegram-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-telegram-answer .telegram-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.26), transparent 54%),
    linear-gradient(35deg, rgba(223, 255, 63, 0.18), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-telegram-answer .telegram-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-telegram-answer .telegram-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(103, 213, 232, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-telegram-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-telegram-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-telegram-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-telegram-answer .dashboard-report-section,
.dashboard-answer-dialog.is-telegram-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="telegram-module"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="telegram-module"] [data-view-section="telegram-module"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="telegram-module"] .telegram-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="telegram-module"] .telegram-agent-mode button,
  body.app-mode[data-active-view="telegram-module"] .telegram-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="telegram-module"] .telegram-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="telegram-module"] .telegram-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-telegram-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-telegram-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-telegram-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Reports page polish: compact client proof, softer color, no in-page Ask prompt. */
body.app-mode[data-active-view="reports"] .reports-panel {
  display: grid;
  gap: 12px;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(125, 211, 252, 0.16), transparent 34%),
    linear-gradient(315deg, rgba(216, 255, 36, 0.12), transparent 45%),
    #f8fbf7 !important;
  overflow: visible;
}

body.app-mode[data-active-view="reports"] .reports-panel .panel-header {
  align-items: start;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  background:
    linear-gradient(90deg, rgba(216, 255, 36, 0.16), transparent 48%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .panel-header h2 {
  max-width: 34ch;
  font-size: 25px;
  line-height: 1.04;
  letter-spacing: 0;
}

body.app-mode[data-active-view="reports"] .reports-panel .panel-header .secondary-action {
  min-height: 32px;
  padding: 7px 12px;
  font-size: 10px;
  white-space: nowrap;
}

body.app-mode[data-active-view="reports"] .report-hero-strip {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  min-height: 0;
  margin: 0 !important;
  padding: 12px !important;
  background:
    linear-gradient(120deg, rgba(125, 211, 252, 0.18), transparent 50%),
    #ffffff;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .report-hero-strip strong {
  max-width: 64ch;
  font-size: 17px;
  line-height: 1.08;
}

body.app-mode[data-active-view="reports"] .report-hero-strip p {
  max-width: 82ch;
  font-size: 11.5px;
  line-height: 1.28;
}

body.app-mode[data-active-view="reports"] .report-hero-strip .badge {
  align-self: start;
  min-height: 28px;
  padding: 6px 9px;
  font-size: 9px;
  white-space: nowrap;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid,
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-panel,
body.app-mode[data-active-view="reports"] .reports-panel .report-actions,
body.app-mode[data-active-view="reports"] .reports-panel .report-work-grid {
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid article,
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid article {
  min-height: 74px;
  padding: 9px !important;
  border-width: 2px !important;
  border-radius: 8px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid article:nth-child(5n + 1),
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid article:nth-child(4n + 1) {
  background: #eefbdc !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid article:nth-child(5n + 2),
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid article:nth-child(4n + 2) {
  background: #e5f8ff !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid article:nth-child(5n + 3),
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid article:nth-child(4n + 3) {
  background: #f2ecff !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid article:nth-child(5n + 4),
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid article:nth-child(4n) {
  background: #fff0da !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid article:nth-child(5n) {
  background: #f7f4e8 !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid strong,
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid strong {
  font-size: 11.5px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid strong {
  font-size: 15px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-grid small,
body.app-mode[data-active-view="reports"] .reports-panel .report-paid-grid small {
  font-size: 9.2px;
  line-height: 1.18;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-panel {
  padding: 11px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.46), transparent 58%),
    #f8f0ff !important;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-header {
  margin-bottom: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-header h3 {
  font-size: 17px;
  line-height: 1.06;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-kpis {
  gap: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-kpis article {
  min-height: 58px;
  padding: 8px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-kpis strong {
  font-size: 15px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-kpis span,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-kpis small,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-item span,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-item small,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-empty small {
  font-size: 8.6px;
  line-height: 1.16;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-list {
  gap: 6px;
  margin-top: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-item {
  grid-template-columns: 74px minmax(0, 1fr) max-content;
  min-height: 50px;
  padding: 7px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-item strong,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-empty strong {
  font-size: 10px;
  line-height: 1.12;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-links {
  gap: 5px;
  margin-top: 6px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-links a,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-links b,
body.app-mode[data-active-view="reports"] .reports-panel .report-source-proof-item > b {
  min-height: 21px;
  padding: 4px 6px;
  font-size: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-panel {
  margin: 0;
  padding: 11px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.46), transparent 58%),
    #eefbdc !important;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-panel {
  margin: 0;
  padding: 11px;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-header {
  margin-bottom: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-header h3 {
  font-size: 17px;
  line-height: 1.06;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-kpis {
  gap: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-kpis article {
  min-height: 58px;
  padding: 8px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-kpis strong {
  font-size: 15px;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-kpis span,
body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-kpis small {
  font-size: 8.6px;
  line-height: 1.16;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-grid {
  gap: 8px;
  margin-top: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-grid > article {
  padding: 8px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-list {
  gap: 6px;
  margin-top: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-item {
  grid-template-columns: minmax(0, 1fr) max-content;
  gap: 5px 7px;
  min-height: 48px;
  padding: 7px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-item span,
body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-item small {
  font-size: 8.2px;
  line-height: 1.14;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-item strong {
  font-size: 9.7px;
  line-height: 1.12;
}

body.app-mode[data-active-view="reports"] .reports-panel .agent-proof-item b {
  max-width: 78px;
  padding: 4px 6px;
  font-size: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-header {
  margin-bottom: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-header h3 {
  font-size: 17px;
  line-height: 1.06;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-controls {
  grid-template-columns: minmax(240px, 1fr) 180px minmax(0, 1fr);
  gap: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-controls select,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-controls button {
  min-height: 33px;
  font-size: 10px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-controls small {
  font-size: 9.5px;
  line-height: 1.2;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-kpis {
  gap: 7px;
  margin-top: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-kpis article {
  min-height: 58px;
  padding: 8px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-kpis strong {
  font-size: 15px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-kpis span,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-kpis small {
  font-size: 8.6px;
  line-height: 1.16;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-grid {
  grid-template-columns: minmax(260px, 0.44fr) minmax(0, 0.56fr);
  gap: 8px;
  margin-top: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-summary,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-presenter,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-empty {
  padding: 10px;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-summary strong,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-presenter strong,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-empty strong {
  font-size: 13px;
  line-height: 1.12;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-summary small,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-presenter small,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-empty small,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-summary p {
  margin-top: 6px;
  font-size: 9.8px;
  line-height: 1.22;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-presenter-list {
  gap: 6px;
  margin-top: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-presenter-list div {
  padding: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-list article {
  grid-template-columns: 62px minmax(0, 1fr) auto;
  gap: 7px;
  min-height: 48px;
  padding: 7px;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-list span,
body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-list small {
  font-size: 8.5px;
  line-height: 1.16;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-list strong {
  font-size: 10px;
  line-height: 1.12;
}

body.app-mode[data-active-view="reports"] .reports-panel .mission-proof-list b {
  padding: 4px 6px;
  font-size: 7.5px;
}

body.app-mode[data-active-view="reports"] .reports-panel > .report-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.app-mode[data-active-view="reports"] .reports-panel .report-actions button {
  min-height: 52px !important;
  padding: 8px !important;
  gap: 4px;
  background: #ffffff !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-actions button:nth-child(odd) {
  background: #e5f8ff !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-actions button:nth-child(even) {
  background: #eefbdc !important;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-actions strong {
  font-size: 10px;
  line-height: 1.12;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-work-grid {
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
}

body.app-mode[data-active-view="reports"] .reports-panel .report-work-grid > article {
  min-width: 0;
  padding: 11px !important;
  background: #ffffff !important;
  box-shadow: 4px 4px 0 #08090d;
}

body.app-mode[data-active-view="reports"] .reports-panel .section-title h3 {
  font-size: 17px;
  line-height: 1.08;
}

body.app-mode[data-active-view="reports"] .reports-panel .module-work-item,
body.app-mode[data-active-view="reports"] .reports-panel .module-rule-item {
  min-height: 0;
  padding: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .module-work-item strong,
body.app-mode[data-active-view="reports"] .reports-panel .module-rule-item strong {
  font-size: 11px;
  line-height: 1.14;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reports"] .reports-panel .module-work-item small,
body.app-mode[data-active-view="reports"] .reports-panel .module-rule-item small {
  font-size: 9px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

body.app-mode[data-active-view="reports"] .reports-panel .module-work-item b {
  font-size: 8px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-status {
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: #fffaf4 !important;
  color: rgba(8, 9, 13, 0.82) !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-status a {
  color: #08090d;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 2px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-management-grid {
  grid-template-columns: minmax(0, 1fr);
}

body.app-mode[data-active-view="reports"] .reports-panel .report-management-grid > article {
  width: 100%;
}

body.app-mode[data-active-view="reports"] .reports-panel #reports-management {
  gap: 6px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-manage-item {
  grid-template-columns: 32px minmax(0, 1fr) max-content auto auto;
  gap: 7px;
}

body.app-mode[data-active-view="reports"] .reports-panel .report-manage-item button {
  min-height: 26px;
  padding: 5px 7px;
  border-radius: 6px;
  font-size: 8px;
}

.reports-agent-dock {
  display: none;
}

body.app-mode[data-active-view="reports"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="reports"] [data-view-section="reports"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="reports"] .reports-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-mode,
body.app-mode[data-active-view="reports"] .reports-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="reports"] .reports-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-mode button,
body.app-mode[data-active-view="reports"] .reports-agent-options button,
body.app-mode[data-active-view="reports"] .reports-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-mode button.active,
body.app-mode[data-active-view="reports"] .reports-agent-send,
body.app-mode[data-active-view="reports"] .reports-agent-options button:hover {
  background: #dfff3f !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="reports"] .reports-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-reports-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-reports-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-reports-answer .dashboard-answer-modal h2 {
  max-width: 36ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-reports-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-reports-answer .reports-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.26), transparent 54%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-reports-answer .reports-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-reports-answer .reports-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(223, 255, 63, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-reports-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-reports-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-reports-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-reports-answer .dashboard-report-section,
.dashboard-answer-dialog.is-reports-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

/* Plan and Credits page polish: compact billing, balanced capacity, softer color. */
body.app-mode[data-active-view="subscription"] [data-view-section="subscription"] > .full-panel {
  display: grid !important;
  gap: 10px !important;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.11), transparent 44%),
    linear-gradient(315deg, rgba(223, 255, 63, 0.10), transparent 52%),
    rgba(255, 250, 240, 0.96) !important;
}

body.app-mode[data-active-view="subscription"] [data-view-section="subscription"] .panel-header {
  margin: 0 !important;
}

body.app-mode[data-active-view="subscription"] [data-view-section="subscription"] .panel-header h2 {
  max-width: 22ch !important;
  font-size: 22px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="subscription"] .billing-header-actions {
  gap: 7px !important;
}

body.app-mode[data-active-view="subscription"] #subscription-status,
body.app-mode[data-active-view="subscription"] #billing-portal-button {
  min-height: 30px !important;
  border-width: 2px !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="subscription"] #billing-output {
  margin: 0 !important;
  min-height: 34px !important;
  padding: 8px 10px !important;
  border-width: 2px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.28) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.68) !important;
  box-shadow: 2px 2px 0 #08090d !important;
  font-size: 10px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="subscription"] .subscription-summary,
body.app-mode[data-active-view="subscription"] .plan-usage-grid,
body.app-mode[data-active-view="subscription"] .plan-grid,
body.app-mode[data-active-view="subscription"] .billing-grid,
body.app-mode[data-active-view="subscription"] .project-credit-grid,
body.app-mode[data-active-view="subscription"] .credit-system-grid,
body.app-mode[data-active-view="subscription"] .credit-topup-grid,
body.app-mode[data-active-view="subscription"] .invoice-list,
body.app-mode[data-active-view="subscription"] .ledger-large {
  gap: 8px !important;
  margin-bottom: 0 !important;
}

body.app-mode[data-active-view="subscription"] .subscription-summary div,
body.app-mode[data-active-view="subscription"] .plan-usage-grid article,
body.app-mode[data-active-view="subscription"] .billing-grid .metric-card,
body.app-mode[data-active-view="subscription"] .project-credit-grid article,
body.app-mode[data-active-view="subscription"] .credit-topup-grid article,
body.app-mode[data-active-view="subscription"] .credit-service-card,
body.app-mode[data-active-view="subscription"] .invoice-row,
body.app-mode[data-active-view="subscription"] .ledger-large li {
  border-width: 2px !important;
  border-radius: 7px !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="subscription"] .subscription-summary div,
body.app-mode[data-active-view="subscription"] .plan-usage-grid article,
body.app-mode[data-active-view="subscription"] .billing-grid .metric-card {
  min-height: 62px !important;
  padding: 8px 9px !important;
  background:
    linear-gradient(90deg, var(--subscription-card-accent, #67d5e8) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="subscription"] .subscription-summary div:nth-child(3n + 1),
body.app-mode[data-active-view="subscription"] .plan-usage-grid article:nth-child(4n + 1),
body.app-mode[data-active-view="subscription"] .billing-grid .metric-card:nth-child(3n + 1) {
  --subscription-card-accent: #dfff3f;
}

body.app-mode[data-active-view="subscription"] .subscription-summary div:nth-child(3n + 2),
body.app-mode[data-active-view="subscription"] .plan-usage-grid article:nth-child(4n + 2),
body.app-mode[data-active-view="subscription"] .billing-grid .metric-card:nth-child(3n + 2) {
  --subscription-card-accent: #67d5e8;
}

body.app-mode[data-active-view="subscription"] .subscription-summary div:nth-child(3n),
body.app-mode[data-active-view="subscription"] .plan-usage-grid article:nth-child(4n + 3),
body.app-mode[data-active-view="subscription"] .billing-grid .metric-card:nth-child(3n) {
  --subscription-card-accent: #b9a7ff;
}

body.app-mode[data-active-view="subscription"] .plan-usage-grid article:nth-child(4n) {
  --subscription-card-accent: #ffb15e;
}

body.app-mode[data-active-view="subscription"] .subscription-summary strong,
body.app-mode[data-active-view="subscription"] .plan-usage-grid strong,
body.app-mode[data-active-view="subscription"] .billing-grid strong {
  font-size: 14px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="subscription"] .subscription-summary small,
body.app-mode[data-active-view="subscription"] .plan-usage-grid small,
body.app-mode[data-active-view="subscription"] .billing-grid small,
body.app-mode[data-active-view="subscription"] .plan-card header span,
body.app-mode[data-active-view="subscription"] .plan-card p,
body.app-mode[data-active-view="subscription"] .plan-usage-note {
  font-size: 9.5px !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="subscription"] .plan-usage-meter {
  height: 5px !important;
  margin: 5px 0 !important;
}

body.app-mode[data-active-view="subscription"] .plan-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="subscription"] .plan-card {
  display: grid !important;
  grid-template-rows: auto auto auto max-content !important;
  gap: 6px !important;
  min-height: 158px !important;
  padding: 9px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.40) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="subscription"] .plan-card.selected {
  background:
    linear-gradient(90deg, #dfff3f 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(223, 255, 63, 0.22), rgba(255, 255, 255, 0.74)) !important;
}

body.app-mode[data-active-view="subscription"] .plan-card header {
  gap: 6px !important;
}

body.app-mode[data-active-view="subscription"] .plan-card h3 {
  font-size: 13px !important;
}

body.app-mode[data-active-view="subscription"] .plan-card header strong {
  font-size: 15px !important;
}

body.app-mode[data-active-view="subscription"] .plan-card header small {
  font-size: 8px !important;
}

body.app-mode[data-active-view="subscription"] .plan-usage-note {
  min-height: 0 !important;
}

body.app-mode[data-active-view="subscription"] .plan-card button,
body.app-mode[data-active-view="subscription"] .topup-form button {
  min-height: 28px !important;
  padding: 5px 8px !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-panel,
body.app-mode[data-active-view="subscription"] .credit-system-panel,
body.app-mode[data-active-view="subscription"] .billing-drawer {
  margin: 0 !important;
  border-width: 2px !important;
  border-radius: 8px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-panel {
  grid-template-columns: minmax(250px, 0.62fr) minmax(0, 1.38fr) !important;
  padding: 10px !important;
  background:
    linear-gradient(120deg, rgba(223, 255, 63, 0.22), transparent 42%),
    linear-gradient(315deg, rgba(185, 167, 255, 0.18), transparent 56%),
    rgba(239, 251, 255, 0.88) !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-panel h3,
body.app-mode[data-active-view="subscription"] .credit-system-panel h3 {
  margin: 3px 0 6px !important;
  font-size: 16px !important;
  line-height: 1.04 !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-panel p,
body.app-mode[data-active-view="subscription"] .credit-system-panel p {
  font-size: 10px !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid article {
  min-height: 74px !important;
  padding: 8px !important;
  background:
    linear-gradient(90deg, var(--subscription-card-accent, #67d5e8) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.70) !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid article.tone-1,
body.app-mode[data-active-view="subscription"] .credit-service-card.tone-1 {
  --subscription-card-accent: #dfff3f;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid article.tone-2,
body.app-mode[data-active-view="subscription"] .credit-service-card.tone-2 {
  --subscription-card-accent: #67d5e8;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid article.tone-3,
body.app-mode[data-active-view="subscription"] .credit-service-card.tone-3 {
  --subscription-card-accent: #b9a7ff;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid article.tone-4,
body.app-mode[data-active-view="subscription"] .credit-service-card.tone-4 {
  --subscription-card-accent: #ffb15e;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid strong,
body.app-mode[data-active-view="subscription"] .project-credit-grid small,
body.app-mode[data-active-view="subscription"] .credit-service-card strong,
body.app-mode[data-active-view="subscription"] .credit-service-card b,
body.app-mode[data-active-view="subscription"] .credit-service-card small {
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid strong {
  margin-top: 3px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="subscription"] .project-credit-grid small {
  margin-top: 4px !important;
  font-size: 8.4px !important;
  line-height: 1.16 !important;
}

body.app-mode[data-active-view="subscription"] .credit-system-panel {
  grid-template-columns: minmax(300px, 0.9fr) minmax(360px, 1.1fr) !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 48%),
    rgba(255, 250, 240, 0.88) !important;
}

body.app-mode[data-active-view="subscription"] .credit-topup-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-content: start !important;
}

body.app-mode[data-active-view="subscription"] .credit-topup-grid article {
  min-height: 34px !important;
  padding: 6px 8px !important;
}

body.app-mode[data-active-view="subscription"] .credit-topup-grid strong,
body.app-mode[data-active-view="subscription"] .credit-topup-grid span {
  font-size: 10px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="subscription"] .credit-service-card {
  min-height: 86px !important;
  padding: 8px !important;
  background:
    linear-gradient(90deg, var(--subscription-card-accent, #67d5e8) 0 6px, transparent 6px),
    rgba(255, 255, 255, 0.72) !important;
}

body.app-mode[data-active-view="subscription"] .credit-service-card strong {
  font-size: 10.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="subscription"] .credit-service-card b {
  margin-top: 6px !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view="subscription"] .credit-service-card small {
  margin-top: 4px !important;
  font-size: 8.2px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="subscription"] .billing-drawer {
  padding: 8px !important;
  background: rgba(255, 250, 240, 0.82) !important;
}

body.app-mode[data-active-view="subscription"] .billing-drawer summary {
  min-height: 28px !important;
  padding: 0 0 8px !important;
}

body.app-mode[data-active-view="subscription"] .billing-drawer summary span {
  font-size: 11px !important;
}

body.app-mode[data-active-view="subscription"] .billing-drawer summary small {
  font-size: 9px !important;
}

body.app-mode[data-active-view="subscription"] .billing-drawer .billing-grid,
body.app-mode[data-active-view="subscription"] .billing-drawer .topup-form,
body.app-mode[data-active-view="subscription"] .billing-drawer .invoice-list,
body.app-mode[data-active-view="subscription"] .billing-drawer .event-list {
  margin: 0 0 8px !important;
}

body.app-mode[data-active-view="subscription"] .topup-form {
  grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1fr) !important;
  min-height: 0 !important;
  padding: 8px !important;
}

body.app-mode[data-active-view="subscription"] .topup-form label {
  font-size: 9px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="subscription"] .topup-form select {
  min-height: 30px !important;
  font-size: 10px !important;
}

body.app-mode[data-active-view="subscription"] .invoice-list {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.app-mode[data-active-view="subscription"] .invoice-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 5px 7px !important;
  min-height: 0 !important;
  padding: 8px !important;
}

body.app-mode[data-active-view="subscription"] .invoice-row div {
  min-width: 0 !important;
}

body.app-mode[data-active-view="subscription"] .invoice-row strong {
  font-size: 11px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="subscription"] .invoice-row div strong {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="subscription"] .invoice-row small {
  font-size: 8px !important;
}

body.app-mode[data-active-view="subscription"] .invoice-row .badge {
  min-height: 21px !important;
  padding: 4px 6px !important;
  font-size: 8px !important;
}

body.app-mode[data-active-view="subscription"] .ledger-large {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-height: 186px !important;
  overflow: auto !important;
}

body.app-mode[data-active-view="subscription"] .ledger-large li {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 32px !important;
  padding: 6px 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.28) 0 5px, transparent 5px),
    rgba(255, 255, 255, 0.64) !important;
}

body.app-mode[data-active-view="subscription"] .ledger-large li.ledger-more {
  grid-column: 1 / -1 !important;
  background:
    linear-gradient(90deg, #dfff3f 0 5px, transparent 5px),
    rgba(255, 255, 255, 0.76) !important;
}

body.app-mode[data-active-view="subscription"] .ledger-large strong {
  font-size: 9.5px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="subscription"] .ledger-large small {
  min-width: 0 !important;
  overflow: hidden !important;
  color: rgba(8, 9, 13, 0.70) !important;
  font-size: 8.5px !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.subscription-agent-dock {
  display: none;
}

body.app-mode[data-active-view="subscription"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="subscription"] [data-view-section="subscription"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 90 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="subscription"] .subscription-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-mode,
body.app-mode[data-active-view="subscription"] .subscription-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-mode button,
body.app-mode[data-active-view="subscription"] .subscription-agent-options button,
body.app-mode[data-active-view="subscription"] .subscription-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #fffaf4 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-mode button.active,
body.app-mode[data-active-view="subscription"] .subscription-agent-send,
body.app-mode[data-active-view="subscription"] .subscription-agent-options button:hover {
  background: #dfff3f !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="subscription"] .subscription-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-subscription-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-subscription-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-subscription-answer .dashboard-answer-modal h2 {
  max-width: 34ch;
  font-size: clamp(21px, 1.7vw, 26px);
  line-height: 1.06;
}

.dashboard-answer-dialog.is-subscription-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-subscription-answer .subscription-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.32), transparent 54%),
    linear-gradient(35deg, rgba(167, 139, 250, 0.18), transparent 66%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-subscription-answer .subscription-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-subscription-answer .subscription-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(213, 255, 0, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-subscription-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-subscription-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-subscription-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-subscription-answer .dashboard-report-section,
.dashboard-answer-dialog.is-subscription-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="reports"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="reports"] [data-view-section="reports"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="reports"] .reports-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="reports"] .reports-agent-mode button,
  body.app-mode[data-active-view="reports"] .reports-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="reports"] .reports-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="reports"] .reports-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-reports-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-reports-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-reports-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="subscription"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="subscription"] [data-view-section="subscription"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="subscription"] .subscription-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
  }

  body.app-mode[data-active-view="subscription"] .subscription-agent-mode button,
  body.app-mode[data-active-view="subscription"] .subscription-agent-options button {
    font-size: 9px !important;
    padding: 6px 8px !important;
  }

  body.app-mode[data-active-view="subscription"] .subscription-agent-dock textarea {
    min-height: 58px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="subscription"] .subscription-agent-send {
    min-width: 72px !important;
    min-height: 72px !important;
  }

  .dashboard-answer-dialog.is-subscription-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-subscription-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-subscription-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Settings checkbox rows: keep toggles compact and stop global input sizing from stretching checks. */
/* Pages Polxy dock: sticky conversion-page readiness, tracking, risk, and draft prompt. */
body.app-mode[data-active-view="pages"] .page-builder-module {
  display: grid;
  gap: 12px;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  padding: 16px !important;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 34%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 62%),
    #fff7ed !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-builder-module > .panel-header {
  align-items: center;
  margin: 0 !important;
  border: 2px solid #08090d;
  border-radius: 8px;
  padding: 12px 14px;
  background: #fffaf0;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.9);
}

body.app-mode[data-active-view="pages"] .page-builder-module > .panel-header h2 {
  max-width: 54ch;
  color: #08090d;
  font-size: 18px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="pages"] #pages-module-status {
  min-height: 28px;
  border: 2px solid #08090d !important;
  background: #dfff3f !important;
  color: #08090d !important;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="pages"] .page-builder-module .module-hero-strip {
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.26), transparent 42%),
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-builder-module .module-hero-strip strong {
  max-width: 62ch;
  border: 0 !important;
  background: transparent !important;
  color: #08090d !important;
  box-shadow: none !important;
  font-size: 16px !important;
  line-height: 1.16 !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="pages"] .page-builder-module .module-hero-strip p {
  max-width: 78ch;
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 11.5px !important;
  line-height: 1.38 !important;
}

body.app-mode[data-active-view="pages"] #pages-create-default,
body.app-mode[data-active-view="pages"] #pages-source-backed-button {
  min-width: 142px;
  border: 2px solid #08090d !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] #pages-create-default {
  background: #fffaf0 !important;
}

body.app-mode[data-active-view="pages"] #pages-source-backed-button {
  background: #08090d !important;
  color: #ffffff !important;
  box-shadow: 3px 3px 0 #67d5e8 !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid {
  margin: 0 !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid article {
  min-height: 66px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 9px 11px !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid article:nth-child(1) {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.62), rgba(255, 255, 255, 0.84) 72%),
    #f7ffe2 !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid article:nth-child(2) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.58), rgba(255, 255, 255, 0.86) 72%),
    #edfaff !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid article:nth-child(3) {
  background:
    linear-gradient(135deg, rgba(189, 167, 255, 0.58), rgba(255, 255, 255, 0.86) 72%),
    #f4efff !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 178, 93, 0.58), rgba(255, 255, 255, 0.86) 72%),
    #fff2df !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid strong {
  color: #08090d !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="pages"] #pages-kpi-grid small,
body.app-mode[data-active-view="pages"] #pages-kpi-grid .eyebrow {
  color: #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-builder-console {
  grid-template-columns: repeat(24, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 52%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.88) !important;
}

body.app-mode[data-active-view="pages"] .page-builder-console label {
  min-width: 0;
  gap: 4px;
  color: rgba(8, 9, 13, 0.66);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: 0;
  text-transform: none;
}

body.app-mode[data-active-view="pages"] .page-builder-console label:nth-of-type(1),
body.app-mode[data-active-view="pages"] .page-builder-console label:nth-of-type(2),
body.app-mode[data-active-view="pages"] .page-builder-console label:nth-of-type(6),
body.app-mode[data-active-view="pages"] .page-builder-console label:nth-of-type(7),
body.app-mode[data-active-view="pages"] .page-builder-console label:nth-of-type(8) {
  grid-column: span 4;
}

body.app-mode[data-active-view="pages"] .page-builder-console .wide-field {
  grid-column: span 8 !important;
}

body.app-mode[data-active-view="pages"] .page-builder-console input,
body.app-mode[data-active-view="pages"] .page-builder-console select {
  min-height: 32px;
  border: 2px solid rgba(8, 9, 13, 0.55);
  border-radius: 6px;
  padding: 6px 8px;
  background: #ffffff;
  color: #08090d;
  font-size: 11px;
  font-weight: 760;
  box-shadow: inset 0 -2px 0 rgba(8, 9, 13, 0.06);
}

body.app-mode[data-active-view="pages"] .page-builder-console input:disabled,
body.app-mode[data-active-view="pages"] .page-builder-console select:disabled,
body.app-mode[data-active-view="pages"] .page-builder-console button:disabled {
  opacity: 1;
  background: #f8eedb !important;
  color: rgba(8, 9, 13, 0.5) !important;
}

body.app-mode[data-active-view="pages"] .page-builder-console button {
  grid-column: span 4;
  min-height: 32px !important;
  align-self: end;
  border: 2px solid #08090d !important;
  border-radius: 6px;
  padding: 6px 9px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 11px;
  font-weight: 900;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-builder-grid {
  grid-template-columns: minmax(328px, 0.78fr) minmax(0, 1.22fr) !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="pages"] .page-builder-grid > article {
  min-height: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.7), transparent 52%),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-builder-grid .section-title {
  gap: 3px;
  margin: 0;
}

body.app-mode[data-active-view="pages"] .page-builder-grid .section-title h3 {
  color: #08090d;
  font-size: 14px;
  line-height: 1.15;
}

body.app-mode[data-active-view="pages"] .page-draft-item {
  grid-template-columns: 30px minmax(0, 1fr) 78px auto !important;
  min-height: 58px;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.82) !important;
}

body.app-mode[data-active-view="pages"] .page-draft-item.empty {
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 62%),
    #ffffff !important;
}

body.app-mode[data-active-view="pages"] .page-draft-item span {
  background: #d9d2ff !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-draft-item strong {
  color: #08090d !important;
  font-size: 11.5px !important;
  line-height: 1.18;
}

body.app-mode[data-active-view="pages"] .page-draft-item small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10px !important;
  line-height: 1.32;
}

body.app-mode[data-active-view="pages"] .page-draft-item b {
  justify-self: end;
  min-width: 66px;
  border: 2px solid #08090d;
  border-radius: 999px;
  padding: 5px 7px;
  background: #dfff3f;
  color: #08090d !important;
  font-size: 9px;
  line-height: 1;
  text-align: center;
}

body.app-mode[data-active-view="pages"] .page-draft-actions button {
  min-height: 28px;
  border-radius: 6px;
  padding: 5px 8px;
  font-size: 9.5px;
  box-shadow: 1px 1px 0 #08090d;
}

body.app-mode[data-active-view="pages"] .page-preview-panel .empty-state {
  min-height: 98px;
  border: 2px dashed rgba(8, 9, 13, 0.28);
  border-radius: 8px;
  padding: 16px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.12), transparent 55%),
    rgba(255, 255, 255, 0.52);
  color: #08090d;
}

body.app-mode[data-active-view="pages"] .page-preview-panel .empty-state strong {
  color: #08090d;
  font-size: 14px;
}

body.app-mode[data-active-view="pages"] .page-preview-panel .empty-state p {
  max-width: 68ch;
  color: rgba(8, 9, 13, 0.68);
  font-size: 12px;
  line-height: 1.4;
}

body.app-mode[data-active-view="pages"] .page-preview-card {
  border: 2px solid #08090d !important;
  border-radius: 8px;
  padding: 11px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 56%),
    #ffffff !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] .page-preview-card h3 {
  max-width: 34ch;
  font-size: clamp(17px, 1.45vw, 21px) !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="pages"] .page-preview-card p {
  max-width: 70ch;
  font-size: 11px !important;
  line-height: 1.36 !important;
}

body.app-mode[data-active-view="pages"] .page-preview-panel,
body.app-mode[data-active-view="pages"] .page-preview-panel > div {
  display: grid;
  gap: 8px;
}

body.app-mode[data-active-view="pages"] .page-preview-panel > .source-backed-evidence {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
}

body.app-mode[data-active-view="pages"] .page-preview-panel > .ads-pages-pair-proof {
  margin-top: 0;
}

body.app-mode[data-active-view="pages"] .page-preview-sections {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="pages"] .page-tracking-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="pages"] .module-rule-stack {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="pages"] .page-preview-sections article,
body.app-mode[data-active-view="pages"] .page-tracking-grid article,
body.app-mode[data-active-view="pages"] .module-rule-stack .module-rule-item {
  border: 2px solid #08090d !important;
  border-radius: 8px;
  padding: 8px !important;
  background: #ffffff !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.78);
}

body.app-mode[data-active-view="pages"] .page-preview-sections article:nth-child(2n),
body.app-mode[data-active-view="pages"] .page-tracking-grid article:nth-child(2n) {
  background: #eefcff !important;
}

body.app-mode[data-active-view="pages"] .page-preview-sections strong,
body.app-mode[data-active-view="pages"] .page-tracking-grid strong,
body.app-mode[data-active-view="pages"] .module-rule-stack .module-rule-item strong {
  color: #08090d !important;
  font-size: 11px !important;
  line-height: 1.18;
}

body.app-mode[data-active-view="pages"] .page-preview-sections small,
body.app-mode[data-active-view="pages"] .page-tracking-grid span,
body.app-mode[data-active-view="pages"] .module-rule-stack .module-rule-item small {
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 9.8px !important;
  line-height: 1.32;
}

body.app-mode[data-active-view="pages"] .page-field-chips span {
  border-radius: 999px;
  background: #f8eedb !important;
  font-size: 10.5px !important;
}

.pages-agent-dock {
  display: none;
}

body.app-mode[data-active-view="pages"] > .app-shell > main {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="pages"] [data-view-section="pages"] {
  padding-bottom: 154px !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-dock {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(1040px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 18px !important;
  z-index: 80 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 8px !important;
  width: min(1040px, calc(100vw - 264px - 28px)) !important;
  height: 125px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background: #f4fbf7 !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d, 0 18px 48px rgba(8, 9, 13, 0.20) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="pages"] .pages-agent-dock {
  left: calc(74px + ((100vw - 74px - min(1040px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(1040px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-mode,
body.app-mode[data-active-view="pages"] .pages-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="pages"] .pages-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-options span {
  flex: 0 0 auto;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-mode button,
body.app-mode[data-active-view="pages"] .pages-agent-options button,
body.app-mode[data-active-view="pages"] .pages-agent-send {
  flex: 0 0 auto;
  min-height: 32px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 6px 10px !important;
  background: #f4fbf7 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-mode button.active,
body.app-mode[data-active-view="pages"] .pages-agent-send {
  background: #6ee7b7 !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 54px !important;
  max-height: 120px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 12px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 74px !important;
  min-height: 104px !important;
  padding: 8px !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="pages"] .pages-agent-dock.is-running {
  outline: 3px solid #67d5e8;
  outline-offset: 2px;
}

.dashboard-answer-dialog.is-pages-answer {
  width: min(1240px, calc(100vw - 46px));
  border-color: rgba(8, 9, 13, 0.18);
}

.dashboard-answer-dialog.is-pages-answer .dashboard-answer-body {
  padding: 18px 24px 26px;
}

.dashboard-answer-dialog.is-pages-answer .dashboard-performance-report {
  max-width: 1120px;
  gap: 12px;
}

.dashboard-answer-dialog.is-pages-answer .pages-report-hero {
  padding: 13px 14px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.24), transparent 52%),
    linear-gradient(35deg, rgba(103, 213, 232, 0.16), transparent 68%),
    #ffffff;
  box-shadow: 0 10px 24px rgba(8, 9, 13, 0.07);
}

.dashboard-answer-dialog.is-pages-answer .pages-report-hero h3 {
  max-width: 34ch;
  font-size: clamp(19px, 1.55vw, 23px);
  font-weight: 850;
  line-height: 1.05;
}

.dashboard-answer-dialog.is-pages-answer .pages-report-score {
  min-width: 104px;
  border: 1px solid rgba(8, 9, 13, 0.16);
  background: rgba(110, 231, 183, 0.78);
  box-shadow: none;
}

.dashboard-answer-dialog.is-pages-answer .dashboard-report-summary,
.dashboard-answer-dialog.is-pages-answer .dashboard-report-rows {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-pages-answer .dashboard-report-narrative {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.dashboard-answer-dialog.is-pages-answer .dashboard-report-section,
.dashboard-answer-dialog.is-pages-answer .dashboard-report-action-plan {
  border-color: rgba(8, 9, 13, 0.15);
  border-radius: 12px;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="pages"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="pages"] [data-view-section="pages"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="pages"] .pages-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    z-index: 90 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    padding: 9px !important;
  }

  body.app-mode[data-active-view="pages"] .pages-agent-mode button,
  body.app-mode[data-active-view="pages"] .pages-agent-options button {
    min-height: 30px !important;
    padding: 6px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view="pages"] .pages-agent-dock textarea {
    min-height: 68px !important;
    font-size: 13px !important;
  }

  body.app-mode[data-active-view="pages"] .pages-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
  }

  .dashboard-answer-dialog.is-pages-answer .dashboard-report-summary,
  .dashboard-answer-dialog.is-pages-answer .dashboard-report-narrative,
  .dashboard-answer-dialog.is-pages-answer .dashboard-report-rows {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Settings checkbox rows: keep toggles compact and stop global input sizing from stretching checks. */
body.app-mode[data-active-view="settings"] .settings-form .settings-toggle-grid label.toggle-line {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-height: 38px !important;
  padding: 8px 10px !important;
  text-align: left !important;
}

body.app-mode[data-active-view="settings"] .settings-form .settings-toggle-grid label.toggle-line input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-grid !important;
  flex: 0 0 17px !important;
  place-items: center !important;
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  max-width: 17px !important;
  min-height: 17px !important;
  max-height: 17px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 4px !important;
  background: #fffaf0 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] .settings-form .settings-toggle-grid label.toggle-line input[type="checkbox"]::before {
  content: "";
  width: 7px;
  height: 10px;
  border-right: 2px solid #08090d;
  border-bottom: 2px solid #08090d;
  opacity: 0;
  transform: rotate(42deg) translate(-1px, -1px);
}

body.app-mode[data-active-view="settings"] .settings-form .settings-toggle-grid label.toggle-line input[type="checkbox"]:checked {
  background: #d5ff00 !important;
}

body.app-mode[data-active-view="settings"] .settings-form .settings-toggle-grid label.toggle-line input[type="checkbox"]:checked::before {
  opacity: 1;
}

body.app-mode[data-active-view="settings"] .account-security-form {
  margin-top: 10px;
}

body.app-mode[data-active-view="settings"] .security-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode[data-active-view="settings"] .security-status-grid article {
  display: grid;
  gap: 4px;
  min-height: 58px;
  padding: 9px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #d5ff00;
  box-shadow: 3px 3px 0 #08090d;
  color: #08090d;
}

body.app-mode[data-active-view="settings"] .security-status-grid article:nth-child(2) {
  background: #7bd3e8;
}

body.app-mode[data-active-view="settings"] .security-status-grid article:nth-child(3) {
  background: #a78bfa;
}

body.app-mode[data-active-view="settings"] .security-status-grid strong {
  overflow: hidden;
  font-size: 13px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="settings"] .security-status-grid small {
  overflow: hidden;
  font-size: 9px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.app-mode[data-active-view="settings"] .security-password-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto !important;
  align-items: end;
}

body.app-mode[data-active-view="settings"] .security-password-grid button {
  min-height: 32px;
  padding: 7px 10px;
  white-space: nowrap;
}

body.app-mode[data-active-view="settings"] #security-output {
  margin: 0 !important;
  padding: 9px 10px !important;
  border: 3px solid #08090d !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="settings"] .security-password-grid,
  body.app-mode[data-active-view="settings"] .security-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
body.app-mode[data-active-view="settings"] .security-password-grid,
body.app-mode[data-active-view="settings"] .security-status-grid {
  grid-template-columns: 1fr !important;
  }
}

/* Settings team access: removal should read as a small danger action, not a heavy primary block. */
body.app-mode[data-active-view="settings"] .team-member-row .member-remove-action {
  justify-self: end;
  width: auto !important;
  min-width: 74px;
  min-height: 30px !important;
  padding: 5px 10px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #ff6b6b !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d !important;
  font-size: 10px !important;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

body.app-mode[data-active-view="settings"] .team-member-row .member-remove-action:hover:not(:disabled) {
  transform: translate(-1px, -1px);
  background: #ff4d4f !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] .team-member-row .member-remove-action:disabled {
  background: #f7dfc5 !important;
  color: rgba(8, 9, 13, 0.46) !important;
  cursor: not-allowed;
  opacity: 1 !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.52) !important;
}

@media (max-width: 720px) {
body.app-mode[data-active-view="settings"] .team-member-row .member-remove-action {
    justify-self: stretch;
    width: 100% !important;
  }
}

/* Creative Studio board final polish: keep text, image, and video cards readable. */
body.app-mode[data-active-view="creative"] .creative-gallery {
  grid-auto-columns: minmax(252px, 292px) !important;
  gap: 12px !important;
  min-height: 392px !important;
  padding: 8px 5px 20px !important;
  scroll-padding-inline: 4px;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
  gap: 6px !important;
  min-height: 360px !important;
  max-height: 360px !important;
  padding: 10px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.review-open {
  grid-template-rows: 132px 58px 28px 24px 66px auto !important;
  min-height: 540px !important;
  max-height: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text {
  grid-template-rows: 132px 58px 28px 24px 66px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-preview {
  height: 132px !important;
  min-height: 132px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-preview {
  height: 132px !important;
  min-height: 132px !important;
  align-content: stretch;
  padding: 0 !important;
  background: #fffaf0 !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview {
  position: relative;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr);
  height: 100%;
  min-height: 0;
  padding: 32px 12px 24px !important;
  overflow: hidden;
  border: 0;
  background:
    linear-gradient(180deg, #dfff3f 0 14px, transparent 14px),
    repeating-linear-gradient(180deg, #fffaf0 0 15px, #ead7b6 15px 17px) !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  position: static !important;
  display: -webkit-box !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #08090d !important;
  box-shadow: none !important;
  text-transform: none !important;
  white-space: normal !important;
  -webkit-box-orient: vertical;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview b {
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 10.5px !important;
  line-height: 1.08 !important;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-text-preview small {
  align-self: start;
  margin-top: 4px !important;
  font-size: 9px !important;
  font-weight: 750;
  line-height: 1.18 !important;
  -webkit-line-clamp: 3;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-kind {
  top: 5px !important;
  left: 5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card.text .media-size {
  right: 5px !important;
  bottom: 5px !important;
  max-width: calc(100% - 10px) !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-kind,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-size,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-play {
  overflow: hidden;
  text-overflow: ellipsis;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3,
body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  display: -webkit-box !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card h3 {
  min-height: 28px;
  max-height: 32px;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card p {
  max-height: 26px;
  margin: 3px 0 0 !important;
  font-size: 9.5px !important;
  line-height: 1.2 !important;
  -webkit-line-clamp: 2;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px !important;
  min-height: 24px;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .media-meta span {
  max-width: none !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card footer {
  min-height: 22px;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions {
  align-self: end;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button {
  min-height: 26px !important;
  padding: 4px 5px !important;
  font-size: 8.5px !important;
}

body.app-mode[data-active-view="creative"] .creative-gallery .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: 1 / -1 !important;
}

/* Final lock: compact landing login and app-style workspace scrolling. */
.image-login-panel {
  right: clamp(14px, 2.6vw, 42px) !important;
  top: clamp(18px, 3vw, 34px) !important;
  grid-template-columns: minmax(122px, 148px) minmax(0, 1fr) !important;
  gap: 8px 11px !important;
  width: min(510px, calc(100vw - 30px)) !important;
  padding: 10px !important;
  box-shadow: 6px 6px 0 #08090d, 0 18px 54px rgba(0, 0, 0, 0.34) !important;
}

.image-login-panel img {
  height: 54px !important;
}

.image-login-panel span {
  padding: 6px 8px !important;
  font-size: 10px !important;
}

.landing-login-form {
  gap: 8px 10px !important;
}

.landing-login-form input {
  height: 36px !important;
  padding: 0 9px !important;
  font-size: 11px !important;
}

.landing-login-form .landing-remember span {
  padding: 5px 7px !important;
  font-size: 9px !important;
}

.landing-login {
  min-height: 36px !important;
  padding: 0 11px !important;
  font-size: 12px !important;
}

.landing-login.primary {
  min-height: 44px !important;
  font-size: 13px !important;
}

body.app-mode {
  height: 100dvh !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell {
  display: grid !important;
  grid-template-columns: 224px minmax(0, 1fr) !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell > .sidebar {
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.app-mode > .app-shell > .sidebar nav {
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.app-mode > .app-shell > main {
  width: 100% !important;
  max-width: none !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

@media (max-width: 720px) {
  .image-login-panel {
    width: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode {
    height: auto !important;
    overflow: auto !important;
  }

  body.app-mode > .app-shell {
    height: auto !important;
    min-height: 100dvh !important;
    overflow: visible !important;
  }

  body.app-mode > .app-shell > main {
    height: auto !important;
    overflow: visible !important;
  }
}

/* Desktop auth placement: keep the CTA and form visible above the landing artwork. */
@media (min-width: 821px) {
  .landing-auth-cta {
    position: fixed !important;
    top: clamp(18px, 2.2vw, 34px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 95 !important;
    min-height: 46px !important;
    padding: 0 22px !important;
    background: #dfff3f !important;
    box-shadow: 6px 6px 0 #08090d !important;
    font-size: 13px !important;
  }

  .image-login-panel {
    top: clamp(84px, 9vh, 112px) !important;
    right: clamp(20px, 2.8vw, 52px) !important;
    bottom: auto !important;
    left: auto !important;
    width: min(560px, calc(100vw - 56px)) !important;
    max-height: calc(100svh - 126px) !important;
    align-items: start !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform: none !important;
  }
}

/* Help Centre is an information page, so it leaves the workspace sidebar shell. */
body.app-mode[data-active-view="help"] {
  height: auto !important;
  min-height: 100dvh !important;
  overflow: auto !important;
}

body.app-mode[data-active-view="help"] > .app-shell {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100vw !important;
  min-height: 100dvh !important;
  height: auto !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="help"] > .app-shell > .sidebar,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-menu-toggle,
body.app-mode[data-active-view="help"] > .app-shell > .mobile-sidebar-scrim {
  display: none !important;
}

body.app-mode[data-active-view="help"] > .app-shell > main {
  grid-column: 1 / -1 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  height: auto !important;
  padding: clamp(16px, 2.6vw, 38px) !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="help"] [data-view-section="help"] {
  width: min(100%, 1480px) !important;
  margin: 0 auto !important;
}

body.app-mode[data-active-view="help"] .help-layout {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="help"] .help-index {
  display: none !important;
}

.footer-announcement-list,
.landing-announcement-list {
  display: grid;
  gap: 12px;
  margin: 0 0 18px;
}

.landing-announcement-list:empty,
.footer-announcement-list:empty {
  display: none;
}

.footer-announcement-card {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  border: 4px solid #08090d;
  border-radius: 8px;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.28), transparent 44%),
    linear-gradient(225deg, rgba(223, 255, 63, 0.28), transparent 46%),
    #fffaf0;
  box-shadow: 6px 6px 0 #08090d;
}

.footer-announcement-media {
  display: grid;
  place-items: center;
  width: 76px;
  height: 64px;
  overflow: hidden;
  border: 3px solid #08090d;
  border-radius: 6px;
  background: #08090d;
}

.footer-announcement-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.announcement-sigil {
  color: #dfff3f;
  font-family: "Geist Mono", Menlo, monospace;
  font-size: 18px;
  font-weight: 1000;
}

.footer-announcement-card strong,
.footer-announcement-card p,
.footer-announcement-card small {
  display: block;
  color: #08090d;
}

.footer-announcement-card strong {
  font-size: 18px;
  line-height: 1.05;
  font-weight: 1000;
}

.footer-announcement-card p {
  margin: 5px 0 0;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 760;
}

.footer-announcement-card small {
  margin-top: 6px;
  font-size: 10px;
  font-weight: 850;
  opacity: 0.72;
}

.footer-announcement-card a {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  border: 3px solid #08090d;
  border-radius: 6px;
  padding: 0 13px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 11px;
  font-weight: 1000;
  text-decoration: none;
  text-transform: uppercase;
}

.admin-announcement-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.admin-announcement-form label,
.admin-announcement-form .project-upload-box {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.admin-announcement-form .wide-field,
.admin-announcement-form .admin-control-actions {
  grid-column: 1 / -1;
}

.admin-announcement-form input,
.admin-announcement-form select,
.admin-announcement-form textarea {
  width: 100%;
}

.admin-announcement-list {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.admin-announcement-row {
  display: grid;
  gap: 10px;
  border: 3px solid #08090d;
  border-radius: 8px;
  padding: 10px;
  background: rgba(255, 250, 240, 0.78);
}

.admin-announcement-row.draft,
.admin-announcement-row.archived {
  opacity: 0.72;
}

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

.admin-announcement-actions button {
  min-height: 32px;
  border: 3px solid #08090d;
  border-radius: 6px;
  padding: 0 12px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
  cursor: pointer;
}

.admin-announcement-actions button:nth-child(2) {
  background: #67d5e8;
}

.admin-announcement-actions button:nth-child(3) {
  background: #ff6b6b;
}

.announcement-centre-panel {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), transparent 38%),
    linear-gradient(225deg, rgba(223, 255, 63, 0.22), transparent 42%),
    #fff7ed;
}

.announcement-centre-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  margin: 14px 0 18px;
  border: 4px solid #08090d;
  border-radius: 8px;
  padding: 18px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.5), rgba(103, 213, 232, 0.42)),
    #effcff;
  box-shadow: 6px 6px 0 #08090d;
}

.announcement-centre-hero strong {
  display: block;
  max-width: 920px;
  color: #08090d;
  font-size: clamp(30px, 4vw, 58px);
  line-height: 0.96;
  font-weight: 1000;
}

.announcement-centre-hero p {
  max-width: 820px;
  margin: 10px 0 0;
  color: #141414;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 760;
}

.announcement-centre-list {
  display: grid;
  gap: 14px;
}

.announcement-centre-card,
.announcement-centre-empty {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  border: 4px solid #08090d;
  border-radius: 8px;
  padding: 14px;
  background: rgba(255, 250, 240, 0.92);
  box-shadow: 6px 6px 0 rgba(8, 9, 13, 0.28);
}

.announcement-centre-card img,
.announcement-centre-card > .announcement-sigil {
  display: grid;
  place-items: center;
  width: 104px;
  height: 78px;
  overflow: hidden;
  border: 3px solid #08090d;
  border-radius: 6px;
  background: #08090d;
  object-fit: cover;
}

.announcement-centre-card strong,
.announcement-centre-empty strong {
  display: block;
  color: #08090d;
  font-size: clamp(22px, 2.6vw, 36px);
  line-height: 1;
  font-weight: 1000;
}

.announcement-centre-card p,
.announcement-centre-card small,
.announcement-centre-empty small {
  display: block;
  color: #171717;
}

.announcement-centre-card p {
  margin: 8px 0;
  font-size: 14px;
  line-height: 1.42;
  font-weight: 740;
}

.announcement-centre-card small,
.announcement-centre-empty small {
  font-size: 11px;
  font-weight: 760;
  opacity: 0.74;
}

.announcement-centre-card a {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  border: 3px solid #08090d;
  border-radius: 6px;
  padding: 0 14px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  font-size: 11px;
  font-weight: 1000;
  text-decoration: none;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .footer-announcement-card,
  .admin-announcement-form,
  .announcement-centre-hero,
  .announcement-centre-card,
  .announcement-centre-empty {
    grid-template-columns: 1fr;
  }

  .footer-announcement-media {
    width: 100%;
    height: 120px;
  }

  .footer-announcement-card a {
    width: 100%;
  }

  .announcement-centre-card img,
  .announcement-centre-card > .announcement-sigil {
    width: 100%;
    height: 128px;
  }
}

@media (max-width: 980px) {
  .signal-control-frame {
    grid-template-columns: 1fr !important;
    align-content: center !important;
    gap: 26px !important;
    min-height: auto !important;
    padding: 78px 16px 42px !important;
  }

  .signal-control-frame::after {
    left: 14px !important;
    right: 14px !important;
    width: fit-content !important;
    max-width: calc(100% - 28px) !important;
  }

  .signal-control-art {
    width: min(430px, calc(100vw - 58px)) !important;
    transform: rotate(-1deg) !important;
  }

  .signal-control-art img {
    width: 100% !important;
    height: min(68svh, 680px) !important;
    object-fit: cover !important;
  }

  .signal-control-copy {
    width: 100% !important;
    max-width: none !important;
    padding: 22px 16px !important;
    transform: none !important;
  }

  .signal-control-copy h2 {
    max-width: 100% !important;
    font-size: clamp(34px, 11vw, 58px) !important;
  }

  .signal-control-copy p {
    max-width: 100% !important;
    font-size: 15px !important;
  }

  .signal-control-points {
    grid-template-columns: 1fr !important;
  }
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-row,
body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-row div:not(.admin-user-actions) {
  display: block;
  width: 100%;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-permission-summary {
  display: block;
  max-width: 360px;
  margin-top: 4px;
  color: rgba(8, 9, 13, 0.68);
  line-height: 1.25;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-meta span {
  width: auto;
  max-width: 100%;
  min-height: 24px;
  padding: 5px 8px;
  line-height: 1.2;
  white-space: normal;
}

body.app-mode[data-active-view="white-label"] [data-view-section="white-label"] .white-label-access-section .admin-user-meta span:nth-child(2) {
  display: block;
  flex: 1 1 100%;
  width: 100%;
  max-width: 100%;
}

.mission-board-panel {
  display: grid;
  gap: 16px;
}

.mission-hero-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.8fr) minmax(0, 1.2fr);
  gap: 14px;
  align-items: start;
}

.mission-intake,
.mission-overview,
.mission-card,
.mission-empty {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
}

.mission-intake {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.mission-intake label {
  display: grid;
  gap: 6px;
  color: var(--mist);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.mission-intake input,
.mission-intake select,
.mission-intake textarea {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 6px;
  padding: 10px 11px;
  background: rgba(10, 10, 15, 0.78);
  color: var(--white);
  font: inherit;
  text-transform: none;
}

.mission-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mission-overview {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.mission-kpi-grid,
.mission-template-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

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

.mission-kpi-grid article,
.mission-template-board article {
  min-height: 96px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.04);
}

.mission-kpi-grid span,
.mission-template-board span {
  display: block;
  color: var(--mint);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.mission-kpi-grid strong,
.mission-template-board strong {
  display: block;
  margin: 6px 0;
  color: var(--white);
  font-size: 20px;
}

.mission-template-board strong {
  font-size: 14px;
}

.mission-kpi-grid small,
.mission-template-board small,
.mission-card p,
.mission-card small,
.mission-empty small {
  color: var(--mist);
  line-height: 1.45;
}

.mission-board {
  display: grid;
  gap: 14px;
}

.mission-card {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.mission-card header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}

.mission-card h3 {
  margin: 4px 0 6px;
  color: var(--white);
  font-size: 22px;
}

.mission-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mission-meta-row span {
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--white);
  background: rgba(255, 255, 255, 0.045);
  font-size: 12px;
  font-weight: 800;
}

.mission-execution-row {
  display: grid;
  grid-template-columns: max-content max-content minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgba(16, 240, 161, 0.055);
}

.mission-execution-row small {
  min-width: 0;
}

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

.mission-package-grid article,
.mission-task-list article {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: rgba(10, 10, 15, 0.42);
}

.mission-package-grid span {
  display: block;
  margin-bottom: 5px;
  color: var(--cyan);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.mission-task-list {
  display: grid;
  gap: 8px;
}

.mission-task-list article {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) minmax(220px, max-content);
  gap: 10px;
  align-items: center;
}

.mission-task-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.mission-task-actions .table-action {
  min-height: 30px;
  padding: 5px 8px;
  font-size: 10px;
}

.danger-action,
.badge.danger {
  border-color: rgba(239, 68, 68, 0.5) !important;
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fecaca !important;
}

.mission-task-list strong {
  display: block;
  color: var(--white);
  font-size: 14px;
}

.mission-empty {
  padding: 18px;
}

.mission-empty strong {
  display: block;
  margin-bottom: 4px;
  color: var(--white);
}

@media (max-width: 1100px) {
  .mission-hero-grid,
  .mission-kpi-grid,
  .mission-template-board,
  .mission-package-grid {
    grid-template-columns: 1fr;
  }

  .mission-task-list article {
    grid-template-columns: 1fr;
  }

  .mission-execution-row {
    grid-template-columns: 1fr;
  }

  .mission-task-actions {
    justify-content: flex-start;
  }
}

/* Missions page polish: align the workflow board with the newer Polxy prompt/report surface. */
body.app-mode[data-active-view="missions"] [data-view-section="missions"] {
  display: grid;
  gap: 16px;
  padding-bottom: 170px;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] > .panel {
  border: 3px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), transparent 32%),
    linear-gradient(40deg, rgba(103, 213, 232, 0.12), transparent 66%),
    #fff7ed;
  color: #08090d;
  box-shadow: 5px 5px 0 rgba(8, 9, 13, 0.94);
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] .panel-header {
  align-items: center;
  border-bottom: 3px solid #08090d;
  margin: -20px -20px 16px;
  padding: 14px 16px;
  background: #f8eedb;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] .panel-header h2,
body.app-mode[data-active-view="missions"] [data-view-section="missions"] .section-title h3 {
  color: #08090d;
}

body.app-mode[data-active-view="missions"] .mission-board-panel {
  gap: 14px;
}

body.app-mode[data-active-view="missions"] .mission-hero-grid {
  grid-template-columns: minmax(360px, 0.86fr) minmax(0, 1.14fr);
  gap: 16px;
}

body.app-mode[data-active-view="missions"] .mission-intake,
body.app-mode[data-active-view="missions"] .mission-overview,
body.app-mode[data-active-view="missions"] .mission-card,
body.app-mode[data-active-view="missions"] .mission-empty {
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
}

body.app-mode[data-active-view="missions"] .mission-intake {
  gap: 10px;
  padding: 14px;
}

body.app-mode[data-active-view="missions"] .mission-intake .section-title {
  margin-bottom: 2px;
}

body.app-mode[data-active-view="missions"] .mission-intake label {
  gap: 5px;
  color: rgba(8, 9, 13, 0.72);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 0;
}

body.app-mode[data-active-view="missions"] .mission-intake input,
body.app-mode[data-active-view="missions"] .mission-intake select,
body.app-mode[data-active-view="missions"] .mission-intake textarea {
  min-height: 38px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #ffffff;
  color: #08090d;
  font-size: 13px;
  font-weight: 760;
  box-shadow: inset 0 -2px 0 rgba(8, 9, 13, 0.08);
}

body.app-mode[data-active-view="missions"] .mission-intake textarea {
  min-height: 92px;
}

body.app-mode[data-active-view="missions"] .mission-actions {
  align-items: center;
}

body.app-mode[data-active-view="missions"] .mission-overview {
  align-content: start;
  gap: 12px;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 44%),
    #ffffff;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode[data-active-view="missions"] .mission-template-board {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article,
body.app-mode[data-active-view="missions"] .mission-template-board article {
  position: relative;
  min-height: 96px;
  overflow: hidden;
  border: 2px solid #08090d;
  border-radius: 8px;
  padding: 11px;
  background: #ffffff;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article::after,
body.app-mode[data-active-view="missions"] .mission-template-board article::after {
  content: "";
  position: absolute;
  right: 9px;
  bottom: 9px;
  width: 42px;
  height: 20px;
  border: 2px solid #08090d;
  border-radius: 5px;
  background:
    linear-gradient(to top, #dfff3f 0 34%, transparent 34%),
    linear-gradient(to top, transparent 0 42%, #67d5e8 42% 72%, transparent 72%),
    rgba(8, 9, 13, 0.06);
  opacity: 0.9;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(2n) {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.28), transparent 58%),
    #ffffff;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(3n) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), transparent 62%),
    #ffffff;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(4) {
  background:
    linear-gradient(135deg, rgba(255, 183, 3, 0.20), transparent 60%),
    #ffffff;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid span,
body.app-mode[data-active-view="missions"] .mission-template-board span,
body.app-mode[data-active-view="missions"] .mission-package-grid span {
  color: rgba(8, 9, 13, 0.62);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid strong {
  margin: 5px 0;
  color: #08090d;
  font-size: 24px;
  line-height: 1;
}

body.app-mode[data-active-view="missions"] .mission-template-board strong {
  margin: 5px 0;
  color: #08090d;
  font-size: 13px;
  line-height: 1.1;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid small,
body.app-mode[data-active-view="missions"] .mission-template-board small,
body.app-mode[data-active-view="missions"] .mission-card p,
body.app-mode[data-active-view="missions"] .mission-card small,
body.app-mode[data-active-view="missions"] .mission-empty small {
  color: rgba(8, 9, 13, 0.72);
  font-weight: 780;
}

body.app-mode[data-active-view="missions"] .mission-board {
  gap: 16px;
}

body.app-mode[data-active-view="missions"] .mission-card {
  gap: 13px;
  padding: 14px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), transparent 34%),
    #ffffff;
}

body.app-mode[data-active-view="missions"] .mission-card:nth-child(even) {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 38%),
    #ffffff;
}

body.app-mode[data-active-view="missions"] .mission-card header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}

body.app-mode[data-active-view="missions"] .mission-card h3 {
  max-width: 48ch;
  margin: 3px 0 5px;
  color: #08090d;
  font-size: clamp(19px, 2vw, 26px);
  line-height: 1.04;
}

body.app-mode[data-active-view="missions"] .mission-card p {
  max-width: 92ch;
  margin: 0;
  font-size: 13px;
  line-height: 1.36;
}

body.app-mode[data-active-view="missions"] .mission-meta-row {
  gap: 7px;
}

body.app-mode[data-active-view="missions"] .mission-meta-row span {
  min-height: 28px;
  border: 2px solid #08090d;
  border-radius: 999px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 1px 1px 0 #08090d;
  font-size: 11px;
  font-weight: 900;
}

body.app-mode[data-active-view="missions"] .mission-execution-row {
  grid-template-columns: max-content max-content minmax(0, 1fr);
  border: 3px solid #08090d;
  border-radius: 8px;
  gap: 8px;
  background:
    linear-gradient(135deg, rgba(110, 231, 183, 0.26), transparent 56%),
    #fffaf0;
  box-shadow: 2px 2px 0 #08090d;
}

body.app-mode[data-active-view="missions"] .mission-execution-row .primary-action,
body.app-mode[data-active-view="missions"] .mission-execution-row .secondary-action {
  white-space: normal;
}

body.app-mode[data-active-view="missions"] .mission-package-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.app-mode[data-active-view="missions"] .mission-package-grid article,
body.app-mode[data-active-view="missions"] .mission-task-list article {
  border: 2px solid #08090d;
  border-radius: 8px;
  background: #fffaf0;
  color: #08090d;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85);
}

body.app-mode[data-active-view="missions"] .mission-package-grid article {
  min-height: 76px;
}

body.app-mode[data-active-view="missions"] .mission-package-grid small {
  display: block;
  color: rgba(8, 9, 13, 0.76);
  font-size: 12px;
  font-weight: 760;
  line-height: 1.28;
}

body.app-mode[data-active-view="missions"] .mission-task-list {
  gap: 9px;
}

body.app-mode[data-active-view="missions"] .mission-task-list article {
  grid-template-columns: 104px minmax(0, 1fr) minmax(240px, max-content);
  min-height: 58px;
  padding: 9px 10px;
  align-items: center;
}

body.app-mode[data-active-view="missions"] .mission-task-list article > .badge {
  justify-self: start;
  width: 100%;
  justify-content: center;
  text-align: center;
}

body.app-mode[data-active-view="missions"] .mission-task-list strong {
  color: #08090d;
  font-size: 13px;
  line-height: 1.16;
}

body.app-mode[data-active-view="missions"] .mission-task-actions {
  gap: 5px;
}

body.app-mode[data-active-view="missions"] .mission-task-actions .table-action {
  min-height: 28px;
  border: 2px solid #08090d;
  border-radius: 6px;
  padding: 4px 7px;
  background: #ffffff;
  color: #08090d;
  box-shadow: 1px 1px 0 #08090d;
  font-size: 9px;
  font-weight: 950;
}

body.app-mode[data-active-view="missions"] .mission-task-actions .danger-action {
  background: #ffe4e6 !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="missions"] .mission-empty strong {
  color: #08090d;
}

@media (max-width: 1100px) {
  body.app-mode[data-active-view="missions"] .mission-hero-grid,
  body.app-mode[data-active-view="missions"] .mission-kpi-grid,
  body.app-mode[data-active-view="missions"] .mission-template-board,
  body.app-mode[data-active-view="missions"] .mission-package-grid,
  body.app-mode[data-active-view="missions"] .mission-task-list article,
  body.app-mode[data-active-view="missions"] .mission-execution-row {
    grid-template-columns: minmax(0, 1fr);
  }

  body.app-mode[data-active-view="missions"] .mission-task-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="missions"] [data-view-section="missions"] {
    gap: 12px;
    padding-bottom: 190px;
  }

  body.app-mode[data-active-view="missions"] [data-view-section="missions"] .panel-header {
    align-items: flex-start;
    gap: 10px;
    margin: -20px -20px 14px;
  }

  body.app-mode[data-active-view="missions"] .mission-intake,
  body.app-mode[data-active-view="missions"] .mission-overview,
  body.app-mode[data-active-view="missions"] .mission-card,
  body.app-mode[data-active-view="missions"] .mission-empty {
    box-shadow: 2px 2px 0 #08090d;
  }

  body.app-mode[data-active-view="missions"] .mission-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.app-mode[data-active-view="missions"] .mission-template-board {
    grid-template-columns: minmax(0, 1fr);
  }

  body.app-mode[data-active-view="missions"] .mission-card {
    gap: 11px;
  }

  body.app-mode[data-active-view="missions"] .mission-card header {
    grid-template-columns: minmax(0, 1fr);
  }

  body.app-mode[data-active-view="missions"] .mission-card header > .badge {
    justify-self: start;
  }

  body.app-mode[data-active-view="missions"] .mission-card h3 {
    font-size: 20px;
    line-height: 1.08;
  }

  body.app-mode[data-active-view="missions"] .mission-execution-row .primary-action,
  body.app-mode[data-active-view="missions"] .mission-execution-row .secondary-action {
    width: 100%;
  }

  body.app-mode[data-active-view="missions"] .mission-task-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }

  body.app-mode[data-active-view="missions"] .mission-task-actions .table-action {
    min-width: 0;
    width: auto;
  }

  body.app-mode[data-active-view="missions"] .mission-task-list article > .badge {
    width: auto;
    max-width: 100%;
  }
}

/* Missions compact cleanup: balanced color, readable type, no loose whitespace. */
body.app-mode[data-active-view="missions"] [data-view-section="missions"],
body.app-mode[data-active-view="missions"] [data-view-section="missions"] * {
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] {
  gap: 12px !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] > .panel {
  overflow: hidden !important;
  border-width: 3px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), transparent 30%),
    linear-gradient(25deg, transparent 52%, rgba(185, 167, 255, 0.16)),
    #fffaf0 !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.94) !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] > .panel:nth-of-type(2) {
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.18), transparent 34%),
    linear-gradient(25deg, transparent 48%, rgba(255, 177, 94, 0.18)),
    #fffaf0 !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] .panel-header {
  margin: -20px -20px 12px !important;
  padding: 11px 14px !important;
  border-bottom: 3px solid #08090d !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.82), rgba(103, 213, 232, 0.52) 58%, rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] > .panel:nth-of-type(2) .panel-header {
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.64), rgba(185, 167, 255, 0.40) 56%, rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] .panel-header h2 {
  font-size: clamp(18px, 1.65vw, 22px) !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="missions"] [data-view-section="missions"] .section-title h3 {
  font-size: 16px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="missions"] .mission-hero-grid {
  grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1.28fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

body.app-mode[data-active-view="missions"] .mission-intake,
body.app-mode[data-active-view="missions"] .mission-overview {
  align-self: stretch !important;
}

body.app-mode[data-active-view="missions"] .mission-intake {
  gap: 7px !important;
  border-color: #08090d !important;
  padding: 11px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.24) 0 7px, transparent 7px),
    linear-gradient(135deg, #fffaf0, #f4fff4) !important;
}

body.app-mode[data-active-view="missions"] .mission-intake label {
  gap: 4px !important;
  font-size: 9.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="missions"] .mission-intake input,
body.app-mode[data-active-view="missions"] .mission-intake select,
body.app-mode[data-active-view="missions"] .mission-intake textarea {
  min-height: 32px !important;
  padding: 7px 9px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="missions"] .mission-intake textarea {
  min-height: 56px !important;
}

body.app-mode[data-active-view="missions"] #mission-source {
  min-height: 64px !important;
}

body.app-mode[data-active-view="missions"] #mission-goal {
  min-height: 52px !important;
}

body.app-mode[data-active-view="missions"] .mission-actions {
  gap: 6px !important;
}

body.app-mode[data-active-view="missions"] .mission-actions .primary-action,
body.app-mode[data-active-view="missions"] .mission-actions .secondary-action {
  min-height: 34px !important;
  padding: 7px 10px !important;
  font-size: 10.5px !important;
}

body.app-mode[data-active-view="missions"] #mission-output {
  margin: 0 !important;
  padding: 8px 9px !important;
  font-size: 11px !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="missions"] .mission-overview {
  align-content: stretch !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 9px !important;
  border-color: #08090d !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), transparent 42%),
    linear-gradient(25deg, transparent 44%, rgba(255, 177, 94, 0.16)),
    #fffaf0 !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="missions"] .mission-template-board {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-content: start !important;
  align-items: start !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article,
body.app-mode[data-active-view="missions"] .mission-template-board article {
  border-color: #08090d !important;
  min-height: 0 !important;
  padding: 9px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(1),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(1),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(5) {
  background:
    linear-gradient(90deg, #dfff3f 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(223, 255, 63, 0.22), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(2),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(6) {
  background:
    linear-gradient(90deg, #67d5e8 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(3) {
  background:
    linear-gradient(90deg, #b9a7ff 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(185, 167, 255, 0.20), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="missions"] .mission-template-board article:nth-child(4) {
  background:
    linear-gradient(90deg, #ffb15e 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(255, 177, 94, 0.20), rgba(255, 250, 240, 0.96)) !important;
}

body.app-mode[data-active-view="missions"] .mission-template-board article {
  min-height: 68px !important;
  padding: 8px 9px !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid article::after,
body.app-mode[data-active-view="missions"] .mission-template-board article::after {
  width: 30px !important;
  height: 14px !important;
  right: 7px !important;
  bottom: 7px !important;
  opacity: 0.55 !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid span,
body.app-mode[data-active-view="missions"] .mission-template-board span,
body.app-mode[data-active-view="missions"] .mission-package-grid span,
body.app-mode[data-active-view="missions"] .mission-card .eyebrow {
  color: rgba(8, 9, 13, 0.76) !important;
  font-size: 8.5px !important;
  line-height: 1.12 !important;
  letter-spacing: 0.03em !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid strong {
  font-size: clamp(17px, 1.7vw, 21px) !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="missions"] .mission-template-board strong {
  margin: 4px 0 3px !important;
  font-size: 11.5px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="missions"] .mission-template-board small {
  font-size: 10.5px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="missions"] .mission-kpi-grid small,
body.app-mode[data-active-view="missions"] .mission-template-board small,
body.app-mode[data-active-view="missions"] .mission-card p,
body.app-mode[data-active-view="missions"] .mission-card small,
body.app-mode[data-active-view="missions"] .mission-empty small {
  font-size: 11.5px !important;
  line-height: 1.28 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="missions"] .mission-board {
  gap: 10px !important;
}

body.app-mode[data-active-view="missions"] .mission-card {
  gap: 9px !important;
  border-color: #08090d !important;
  padding: 11px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.34) 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 250, 240, 0.98), rgba(239, 251, 255, 0.94)) !important;
}

body.app-mode[data-active-view="missions"] .mission-card:nth-child(even) {
  background:
    linear-gradient(90deg, rgba(185, 167, 255, 0.34) 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 250, 240, 0.98), rgba(250, 245, 255, 0.94)) !important;
}

body.app-mode[data-active-view="missions"] .mission-card h3 {
  max-width: 100% !important;
  font-size: clamp(17px, 1.65vw, 22px) !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="missions"] .mission-meta-row {
  gap: 5px !important;
}

body.app-mode[data-active-view="missions"] .mission-meta-row span {
  min-height: 24px !important;
  border-color: rgba(8, 9, 13, 0.54) !important;
  padding: 4px 7px !important;
  color: #08090d !important;
  background: rgba(255, 255, 255, 0.62) !important;
  font-size: 9.5px !important;
}

body.app-mode[data-active-view="missions"] .mission-execution-row {
  grid-template-columns: minmax(120px, max-content) minmax(120px, max-content) minmax(0, 1fr) !important;
  gap: 6px !important;
  padding: 8px !important;
}

body.app-mode[data-active-view="missions"] .mission-package-grid {
  gap: 7px !important;
}

body.app-mode[data-active-view="missions"] .mission-package-grid article {
  min-height: 58px !important;
  border-color: #08090d !important;
  padding: 8px !important;
  background: rgba(255, 255, 255, 0.64) !important;
}

body.app-mode[data-active-view="missions"] .mission-package-grid article:nth-child(3n + 1) {
  background: rgba(223, 255, 63, 0.24) !important;
}

body.app-mode[data-active-view="missions"] .mission-package-grid article:nth-child(3n + 2) {
  background: rgba(103, 213, 232, 0.22) !important;
}

body.app-mode[data-active-view="missions"] .mission-package-grid article:nth-child(3n) {
  background: rgba(255, 177, 94, 0.20) !important;
}

body.app-mode[data-active-view="missions"] .mission-package-grid small {
  font-size: 11px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list {
  gap: 9px !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list article {
  position: relative !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) minmax(176px, max-content) !important;
  grid-template-areas: "status name actions" ". module actions" !important;
  min-height: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px 11px 11px !important;
  column-gap: 10px !important;
  row-gap: 4px !important;
  align-content: start !important;
  align-items: start !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.32) 0 6px, transparent 6px 100%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(255, 248, 233, 0.98)) !important;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.92) !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list article:nth-child(4n + 1) {
  background:
    linear-gradient(90deg, #67d5e8 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(103, 213, 232, 0.14), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list article:nth-child(4n + 2) {
  background:
    linear-gradient(90deg, #dfff3f 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list article:nth-child(4n + 3) {
  background:
    linear-gradient(90deg, #b9a7ff 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(185, 167, 255, 0.14), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list article:nth-child(4n) {
  background:
    linear-gradient(90deg, #ffb15e 0 6px, transparent 6px),
    linear-gradient(135deg, rgba(255, 177, 94, 0.14), rgba(255, 250, 240, 0.98)) !important;
}

body.app-mode[data-active-view="missions"] .mission-task-list article > .badge {
  grid-area: status !important;
  align-self: start !important;
  justify-self: start !important;
  width: auto !important;
  min-height: 24px !important;
  max-width: 100% !important;
  padding: 4px 8px !important;
  color: #08090d !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  text-align: left !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="missions"] .mission-task-name {
  grid-area: name !important;
  align-self: start !important;
  margin-top: 2px !important;
  padding: 0 !important;
  color: #08090d !important;
  font-size: 13.5px !important;
  line-height: 1.1 !important;
  overflow: hidden !important;
  overflow-wrap: normal !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="missions"] .mission-task-module {
  grid-area: module !important;
  align-self: start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin-top: 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 10.5px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="missions"] .mission-task-actions {
  grid-area: actions !important;
  align-self: stretch !important;
  justify-self: end !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-content: start !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  width: max-content !important;
  max-width: 292px !important;
  min-height: 100% !important;
  border-left: 2px solid rgba(8, 9, 13, 0.18) !important;
  padding: 0 0 0 11px !important;
}

body.app-mode[data-active-view="missions"] .mission-task-actions .table-action {
  min-height: 28px !important;
  min-width: 48px !important;
  padding: 5px 7px !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-dock textarea {
  min-height: 50px !important;
  padding: 10px !important;
  font-size: 12.5px !important;
}

body.app-mode[data-active-view="missions"] .mission-agent-send {
  min-height: 100px !important;
}

@media (max-width: 1100px) {
  body.app-mode[data-active-view="missions"] .mission-hero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="missions"] .mission-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="missions"] [data-view-section="missions"] .panel-header {
    margin: -20px -20px 10px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-template-board,
  body.app-mode[data-active-view="missions"] .mission-package-grid,
  body.app-mode[data-active-view="missions"] .mission-execution-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="missions"] .mission-task-list article {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas: "status" "name" "module" "actions" !important;
    padding: 10px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-task-name,
  body.app-mode[data-active-view="missions"] .mission-task-module {
    white-space: normal !important;
  }

  body.app-mode[data-active-view="missions"] .mission-task-list article > .badge,
  body.app-mode[data-active-view="missions"] .mission-task-actions {
    justify-self: start !important;
  }

  body.app-mode[data-active-view="missions"] .mission-task-actions {
    width: 100% !important;
    max-width: none !important;
    min-height: 0 !important;
    border-left: 0 !important;
    border-top: 2px solid rgba(8, 9, 13, 0.18) !important;
    padding: 8px 0 0 !important;
    justify-content: flex-start !important;
  }

  body.app-mode[data-active-view="missions"] .mission-card h3 {
    font-size: 17px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-dock textarea {
    min-height: 56px !important;
  }

  body.app-mode[data-active-view="missions"] .mission-agent-send {
    min-height: 56px !important;
  }
}

/* Creative Studio board fix: the in-page preview must wrap, not clip like a carousel. */
body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 258px), 1fr)) !important;
  grid-auto-flow: row !important;
  grid-auto-columns: unset !important;
  gap: 14px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 10px 8px 24px !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
    display: block !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
  }

  body.app-mode[data-active-view="creative"] .creative-gallery-head > div {
    max-width: none !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-tool-strip {
    justify-content: flex-start !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio > * {
    margin-bottom: 12px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio > *:last-child {
    margin-bottom: 0 !important;
  }
}

/* Creative Studio generation workspace: gallery-first, detail-aware creator surface. */
body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine {
  border-color: rgba(255, 255, 255, 0.09) !important;
  background:
    linear-gradient(135deg, rgba(10, 12, 16, 0.98), rgba(16, 19, 26, 0.96) 42%, rgba(11, 14, 18, 0.98)),
    #0b0e12 !important;
  color: #f7f4eb !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header {
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 0 18px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header h2 {
  color: #f7f4eb !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  line-height: 1.02 !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine .eyebrow {
  color: #d8ff3e !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(330px, 390px) !important;
  grid-template-areas:
    "project preview"
    "head preview"
    "tabs preview"
    "gallery preview"
    "composer preview"
    "production preview"
    "dna preview"
    "tools preview"
    "manual preview" !important;
  gap: 14px !important;
  align-items: start !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
  grid-area: project !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head {
  grid-area: head !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-studio-tabs {
  grid-area: tabs !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  grid-area: gallery !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-mode-switch,
body.app-mode[data-active-view="creative"] .creative-agent-console .connected-channel-strip,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions {
  grid-column: 1 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel {
  grid-area: dna !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-lab {
  grid-area: production !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-tool-strip {
  grid-area: tools !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  grid-area: composer !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .manual-studio-panel {
  grid-area: manual !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
  grid-area: preview !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-lab,
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .manual-studio-panel {
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.055) !important;
  color: #f7f4eb !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
  grid-template-columns: minmax(220px, 0.4fr) minmax(0, 1fr) !important;
  padding: 14px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher label,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form label {
  color: rgba(247, 244, 235, 0.68) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher select,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form select,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form input,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form textarea {
  border-color: rgba(255, 255, 255, 0.13) !important;
  background: rgba(8, 10, 13, 0.86) !important;
  color: #f7f4eb !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 14px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-header h3,
body.app-mode[data-active-view="creative"] .creative-agent-console .chat-agent-header h3 {
  color: #f7f4eb !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head small,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher small,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel small,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-pack-preview,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-pack-specs {
  color: rgba(247, 244, 235, 0.66) !important;
}

body.app-mode[data-active-view="creative"] .creative-studio-tabs {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  padding: 2px 0 4px !important;
  scrollbar-width: thin !important;
}

body.app-mode[data-active-view="creative"] .creative-studio-tabs button,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-mode-switch button,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-tool-strip button,
body.app-mode[data-active-view="creative"] .composer-brief-options button,
body.app-mode[data-active-view="creative"] .composer-asset-rail button {
  flex: 0 0 auto !important;
  min-height: 38px !important;
  border: 1px solid rgba(255, 255, 255, 0.11) !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  background: rgba(255, 255, 255, 0.065) !important;
  color: rgba(247, 244, 235, 0.86) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-studio-tabs button.active,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-mode-switch button.active,
body.app-mode[data-active-view="creative"] .composer-asset-rail button.active {
  border-color: #d8ff3e !important;
  background: #d8ff3e !important;
  color: #11140f !important;
}

body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: min(40vh, 520px) !important;
  min-height: 300px !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  position: relative !important;
  display: grid !important;
  grid-template-rows: minmax(220px, 1fr) auto auto auto !important;
  gap: 9px !important;
  min-height: 386px !important;
  max-height: none !important;
  width: 100% !important;
  padding: 0 0 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.045) !important;
  color: #f7f4eb !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.selected {
  border-color: #d8ff3e !important;
  box-shadow: 0 0 0 2px rgba(216, 255, 62, 0.18) !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text .media-preview {
  height: 100% !important;
  min-height: 220px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(145deg, rgba(216, 255, 62, 0.16), transparent 32%),
    linear-gradient(315deg, rgba(83, 202, 221, 0.16), transparent 44%),
    #090b0f !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview img,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview .media-svg-object {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card > div:nth-of-type(2),
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions {
  width: calc(100% - 24px) !important;
  margin-right: 12px !important;
  margin-left: 12px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card h3 {
  max-height: none !important;
  color: #f7f4eb !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card p {
  max-height: 36px !important;
  color: rgba(247, 244, 235, 0.66) !important;
  font-size: 10px !important;
  line-height: 1.24 !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta {
  display: flex !important;
  min-height: 26px !important;
  gap: 6px !important;
  justify-content: flex-start !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer .badge {
  display: inline-flex !important;
  width: auto !important;
  height: 24px !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.07) !important;
  color: rgba(247, 244, 235, 0.76) !important;
  font-size: 9px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta span:nth-child(n + 3) {
  display: inline-flex !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer small {
  color: rgba(247, 244, 235, 0.58) !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  min-height: 0 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button {
  width: auto !important;
  min-width: 0 !important;
  min-height: 30px !important;
  height: 30px !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  font-size: 9px !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: auto !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  position: sticky !important;
  bottom: 14px !important;
  z-index: 8 !important;
  padding: 14px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.055)),
    rgba(15, 17, 21, 0.92) !important;
  backdrop-filter: blur(18px) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-body {
  max-height: 128px !important;
  min-height: 0 !important;
  overflow: auto !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  grid-template-areas:
    "rail options actions"
    "input input actions" !important;
  gap: 10px !important;
  align-items: stretch !important;
  min-width: 0 !important;
  padding: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 8px !important;
  background: rgba(7, 9, 12, 0.84) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .composer-asset-rail {
  grid-area: rail !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .composer-brief-options {
  grid-area: options !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
}

body.app-mode[data-active-view="creative"] .composer-brief-options span {
  flex: 0 0 auto !important;
  color: rgba(247, 244, 235, 0.54) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form textarea {
  grid-area: input !important;
  min-height: 66px !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: 14px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #f7f4eb !important;
  font-size: 15px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-composer-actions {
  grid-area: actions !important;
  align-self: stretch !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  min-width: 128px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .cost-mode-trigger {
  width: 100% !important;
  min-height: 38px !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: #f7f4eb !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button {
  width: 100% !important;
  min-height: 66px !important;
  border-radius: 8px !important;
  background: #d8ff3e !important;
  color: #11140f !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button svg {
  width: 26px !important;
  height: 26px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .auto-cost-panel {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-lab {
  max-height: 265px !important;
  overflow: auto !important;
  padding: 14px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form {
  grid-template-columns: repeat(4, minmax(130px, 1fr)) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form .wide-field {
  grid-column: span 2 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-tool-strip {
  justify-content: flex-start !important;
  overflow-x: auto !important;
  padding: 0 0 6px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
  position: sticky !important;
  top: 16px !important;
  min-height: calc(100dvh - 164px) !important;
  max-height: calc(100dvh - 164px) !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(150deg, rgba(216, 255, 62, 0.08), transparent 30%),
    linear-gradient(35deg, rgba(246, 102, 90, 0.11), transparent 34%),
    #0d1013 !important;
  color: #f7f4eb !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell.inspecting-asset,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell:has(.preview-inspector) {
  display: grid !important;
  grid-template-rows: minmax(280px, 0.95fr) minmax(300px, auto) !important;
  gap: 0 !important;
  height: 100% !important;
  min-height: inherit !important;
  padding: 0 !important;
  background: transparent !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-canvas {
  grid-row: 1 !important;
  min-height: 280px !important;
  padding: 18px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-device {
  width: min(100%, var(--preview-frame-width, 340px)) !important;
  max-width: 100% !important;
  height: min(100%, var(--preview-frame-height, 430px)) !important;
  max-height: 100% !important;
  margin: auto !important;
  border: 1px solid rgba(255, 255, 255, 0.11) !important;
  border-radius: 12px !important;
  background: #08090d !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.42) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector {
  grid-row: 2 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  padding: 16px !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 0 !important;
  background: rgba(8, 10, 13, 0.94) !important;
  color: #f7f4eb !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector.empty {
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-identity strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector strong {
  color: #f7f4eb !important;
  font-size: 20px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector small,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector p,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note span {
  color: rgba(247, 244, 235, 0.66) !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-meta,
body.app-mode[data-active-view="creative"] .preview-inspector-info {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-meta span,
body.app-mode[data-active-view="creative"] .preview-inspector-info span {
  display: grid !important;
  gap: 4px !important;
  min-height: 52px !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 8px !important;
  padding: 9px !important;
  background: rgba(255, 255, 255, 0.055) !important;
  color: #f7f4eb !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-info b {
  color: rgba(247, 244, 235, 0.50) !important;
  font-size: 9px !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-info strong {
  overflow: hidden !important;
  font-size: 12px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-prompt,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note {
  margin-top: 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 8px !important;
  padding: 12px !important;
  background: rgba(255, 255, 255, 0.055) !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-prompt > div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  align-items: center !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-prompt button {
  min-height: 28px !important;
  border-radius: 7px !important;
  padding: 5px 10px !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-prompt p {
  display: -webkit-box !important;
  max-height: 76px !important;
  margin: 10px 0 0 !important;
  overflow: hidden !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note b {
  color: #d8ff3e !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 14px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 8px !important;
  padding: 9px 10px !important;
  background: rgba(255, 255, 255, 0.07) !important;
  color: #f7f4eb !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions .primary-detail-action,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button:nth-child(1) {
  grid-column: 1 / -1 !important;
  background: #d8ff3e !important;
  color: #11140f !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button:disabled {
  opacity: 0.48 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel {
  grid-template-columns: minmax(0, 1fr) auto !important;
  padding: 14px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions {
  display: none !important;
}

body.app-mode[data-active-view="creative"] #creative-output.provider-output {
  color: rgba(247, 244, 235, 0.62) !important;
}

@media (min-width: 1440px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
    grid-template-columns: minmax(0, 1fr) minmax(370px, 430px) !important;
  }

  body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
  }
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "project"
      "head"
      "tabs"
      "gallery"
      "preview"
      "composer"
      "production"
      "dna"
      "tools"
      "manual" !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
    position: relative !important;
    top: auto !important;
    min-height: 640px !important;
    max-height: none !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
    position: relative !important;
    bottom: auto !important;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher,
  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head,
  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form,
  body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
    grid-template-areas:
      "rail"
      "options"
      "input"
      "actions" !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .chat-composer-actions {
    grid-template-columns: 1fr 1fr !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button {
    min-height: 42px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form .wide-field {
    grid-column: auto !important;
  }

  body.app-mode[data-active-view="creative"] #media-library.creative-gallery {
    max-height: none !important;
    grid-template-columns: 1fr !important;
  }
}

/* Creative Studio prompt dock: keep creation controls visible with the media wall. */
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  grid-area: gallery !important;
  align-self: end !important;
  justify-self: center !important;
  display: block !important;
  width: min(920px, calc(100% - 28px)) !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 0 16px !important;
  position: relative !important;
  bottom: auto !important;
  padding: 12px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel .chat-agent-header,
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel .ploxy-chat-body,
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel .ploxy-agent-log {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  padding-bottom: 184px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
  min-height: 142px !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
    grid-area: composer !important;
    width: 100% !important;
    margin: 0 !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
    padding-bottom: 0 !important;
  }
}

/* Creative Studio Polxy skin correction: keep the Higgsfield-inspired flow, not its dark theme. */
body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine {
  border: 4px solid #08090d !important;
  border-radius: 10px !important;
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.055) 1px, transparent 1px),
    linear-gradient(0deg, rgba(8, 9, 13, 0.045) 1px, transparent 1px),
    #fff7ed !important;
  background-size: 28px 28px !important;
  color: #08090d !important;
  box-shadow: 8px 8px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 0 18px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header h2 {
  max-width: 980px !important;
  color: #08090d !important;
  font-size: clamp(28px, 3.2vw, 44px) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine .eyebrow {
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 420px) !important;
  grid-template-areas:
    "project preview"
    "head preview"
    "tabs preview"
    "gallery preview"
    "composer preview"
    "production preview"
    "dna preview"
    "tools preview"
    "manual preview" !important;
  gap: 14px !important;
  align-items: start !important;
  border: 0 !important;
  background: transparent !important;
  color: #08090d !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-lab,
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .manual-studio-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
  border: 4px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
  grid-area: project !important;
  grid-template-columns: minmax(220px, 0.45fr) minmax(0, 1fr) !important;
  padding: 10px 12px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head {
  grid-area: head !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 10px 12px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-studio-tabs {
  grid-area: tabs !important;
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  padding: 2px 0 4px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  grid-area: gallery !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
  gap: 10px !important;
  max-height: min(32vh, 360px) !important;
  min-height: 230px !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  grid-area: composer !important;
  align-self: auto !important;
  justify-self: stretch !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  position: sticky !important;
  bottom: 12px !important;
  z-index: 8 !important;
  padding: 10px !important;
  backdrop-filter: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel .chat-agent-header,
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel .ploxy-chat-body,
body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel .ploxy-agent-log,
body.app-mode[data-active-view="creative"] .creative-agent-console .auto-cost-panel {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) max-content !important;
  grid-template-areas:
    "rail options actions"
    "input input actions" !important;
  gap: 10px !important;
  min-height: 124px !important;
  padding: 10px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form textarea {
  grid-area: input !important;
  min-height: 58px !important;
  border: 3px solid #08090d !important;
  border-radius: 7px !important;
  padding: 14px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  font-size: 15px !important;
}

body.app-mode[data-active-view="creative"] .composer-asset-rail,
body.app-mode[data-active-view="creative"] .composer-brief-options {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
}

body.app-mode[data-active-view="creative"] .composer-asset-rail {
  grid-area: rail !important;
}

body.app-mode[data-active-view="creative"] .composer-brief-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="creative"] .composer-brief-options span {
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
}

body.app-mode[data-active-view="creative"] .creative-studio-tabs button,
body.app-mode[data-active-view="creative"] .composer-asset-rail button,
body.app-mode[data-active-view="creative"] .composer-brief-options button,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-tool-strip button,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-mode-switch button,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head-actions button,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions a,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-prompt button {
  border: 3px solid #08090d !important;
  border-radius: 7px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-studio-tabs button.active,
body.app-mode[data-active-view="creative"] .composer-asset-rail button.active,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-mode-switch button.active,
body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions .primary-detail-action,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button:nth-child(1) {
  background: #dfff3f !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "gallery"
    "presenter" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-gallery-head,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .ploxy-chat-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-preview-stage,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .social-production-lab,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-dna-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-actions,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-tool-strip,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .manual-studio-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-mode-switch,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .connected-channel-strip {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console .presenter-studio-lab {
  display: grid !important;
  grid-area: presenter !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] #media-library.creative-gallery {
  display: grid !important;
  grid-area: gallery !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "presenter" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-gallery-head,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] #media-library.creative-gallery,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .ploxy-chat-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-preview-stage,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .social-production-lab,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-dna-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-actions,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-tool-strip,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .manual-studio-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-mode-switch,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .connected-channel-strip {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-agent-console .presenter-studio-lab {
  display: grid !important;
  grid-area: presenter !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "presenter" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-gallery-head,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] #media-library.creative-gallery,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .ploxy-chat-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-preview-stage,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .social-production-lab,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-dna-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-actions,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-tool-strip,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .manual-studio-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-mode-switch,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .connected-channel-strip {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-agent-console .presenter-studio-lab {
  display: grid !important;
  grid-area: presenter !important;
}

/* Absolute final AI Influencer card cleanup. */
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card.video {
  display: grid !important;
  grid-template-rows: 176px 68px 34px 104px !important;
  height: 402px !important;
  min-height: 402px !important;
  max-height: 402px !important;
  gap: 8px !important;
  padding: 8px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .media-preview {
  height: 176px !important;
  min-height: 176px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-receipt-preview {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 14px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-art {
  width: 104px !important;
  height: 104px !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-avatar {
  width: 66px !important;
  height: 66px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-orbit,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-frame {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy {
  display: grid !important;
  gap: 5px !important;
  align-content: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy strong {
  position: static !important;
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy strong {
  justify-self: start !important;
  min-height: 20px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b {
  color: #fff7ed !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy small {
  display: -webkit-box !important;
  color: rgba(255, 247, 237, 0.76) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-play {
  position: absolute !important;
  right: 8px !important;
  bottom: 8px !important;
  display: inline-grid !important;
  place-items: center !important;
  width: auto !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 4px 8px !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card > div:nth-of-type(2) {
  display: grid !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 0 !important;
  padding: 0 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card h3 {
  min-height: 0 !important;
  max-height: 36px !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card p {
  min-height: 0 !important;
  max-height: 28px !important;
  margin: 0 !important;
  font-size: 10.5px !important;
  line-height: 1.18 !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  min-height: 30px !important;
  padding: 0 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row .media-meta-chip {
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row .media-meta-chip svg {
  width: 13px !important;
  height: 13px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .badge,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  min-height: 24px !important;
  max-width: 76px !important;
  padding: 3px 6px !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 1 1 66px !important;
  max-width: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 28px !important;
  gap: 6px !important;
  min-height: 0 !important;
  padding: 0 2px 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions button {
  min-height: 28px !important;
  height: 28px !important;
  padding: 3px 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions .fit-review-action,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions button.fit-review-action {
  grid-column: 1 / -1 !important;
  height: 30px !important;
  margin-top: 0 !important;
}

/* Final AI Influencer card polish: keep preview, meta, and actions from colliding. */
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card.video {
  display: grid !important;
  grid-template-rows: 176px 68px 34px 104px !important;
  height: 402px !important;
  min-height: 402px !important;
  max-height: 402px !important;
  gap: 8px !important;
  padding: 8px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .media-preview {
  height: 176px !important;
  min-height: 176px !important;
  border-width: 3px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-receipt-preview {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 14px !important;
  background:
    radial-gradient(circle at 24% 24%, rgba(223, 255, 63, 0.32), transparent 28%),
    radial-gradient(circle at 82% 16%, rgba(103, 213, 232, 0.30), transparent 30%),
    linear-gradient(145deg, #151827 0%, #111c2b 54%, #062f35 100%) !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-art {
  min-height: 0 !important;
  width: 104px !important;
  height: 104px !important;
  aspect-ratio: auto !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-avatar {
  width: 66px !important;
  height: 66px !important;
  box-shadow: 4px 4px 0 #08090d, 0 0 0 7px rgba(103, 213, 232, 0.20) !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-orbit,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-frame {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy {
  display: grid !important;
  gap: 5px !important;
  align-content: center !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy strong {
  position: static !important;
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy strong {
  justify-self: start !important;
  min-height: 20px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy span {
  background: #67d5e8 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b {
  color: #fff7ed !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  overflow-wrap: normal !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy small {
  display: -webkit-box !important;
  color: rgba(255, 247, 237, 0.76) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy strong,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-play {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-play {
  position: absolute !important;
  right: 8px !important;
  bottom: 8px !important;
  display: inline-grid !important;
  place-items: center !important;
  width: auto !important;
  min-height: 24px !important;
  margin: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card > div:nth-of-type(2) {
  display: grid !important;
  align-content: start !important;
  gap: 4px !important;
  min-height: 0 !important;
  padding: 0 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card h3 {
  min-height: 0 !important;
  max-height: 36px !important;
  margin: 0 !important;
  color: #08090d !important;
  font-size: 14px !important;
  line-height: 1.12 !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card p {
  min-height: 0 !important;
  max-height: 28px !important;
  margin: 0 !important;
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 10.5px !important;
  line-height: 1.18 !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  min-height: 30px !important;
  padding: 0 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row .media-meta-chip {
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row .media-meta-chip svg {
  width: 13px !important;
  height: 13px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .badge,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  min-height: 24px !important;
  max-width: 76px !important;
  padding: 3px 6px !important;
  font-size: 8.5px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 1 1 66px !important;
  max-width: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 28px !important;
  gap: 6px !important;
  min-height: 0 !important;
  padding: 0 2px 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions button {
  min-height: 28px !important;
  height: 28px !important;
  padding: 3px 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions .fit-review-action,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions button.fit-review-action {
  grid-column: 1 / -1 !important;
  height: 30px !important;
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card,
  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card.video {
    grid-template-rows: 168px 68px 34px 106px !important;
    height: 400px !important;
    min-height: 400px !important;
    max-height: 400px !important;
  }

  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-receipt-preview {
    grid-template-columns: 92px minmax(0, 1fr) !important;
    padding: 12px !important;
  }

  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-art {
    width: 88px !important;
    height: 88px !important;
  }

  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b {
    font-size: 16px !important;
  }
}

/* Final authority: AI Presenter Setup lives only inside its own Creative tab. */
body.app-mode[data-active-view="creative"]:not([data-creative-board-filter="presenter-setup"]) .creative-agent-console .presenter-studio-lab {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "gallery" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] #media-library.creative-gallery {
  display: grid !important;
  grid-area: gallery !important;
}

/* Final authority: setup panel appears only in AI Presenter Setup, never in All/Videos/AI Influencer. */
body.app-mode[data-active-view="creative"]:not([data-creative-board-filter="presenter-setup"]) .creative-agent-console .presenter-studio-lab {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "gallery" !important;
}

/* AI Influencer receipt cards: polished provider-video preview when MP4 is not attached yet. */
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .ai-influencer-receipt-preview,
body.app-mode[data-active-view="creative"] .creative-preview-stage .ai-influencer-receipt-preview {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(116px, 0.9fr) minmax(0, 1.1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 188px !important;
  padding: 16px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 28% 30%, rgba(223, 255, 63, 0.34), transparent 28%),
    radial-gradient(circle at 78% 18%, rgba(103, 213, 232, 0.28), transparent 30%),
    linear-gradient(145deg, #10131a 0%, #1a1130 48%, #082f3a 100%) !important;
  color: #fff7ed !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .ai-influencer-receipt-preview::before,
body.app-mode[data-active-view="creative"] .creative-preview-stage .ai-influencer-receipt-preview::before {
  content: "" !important;
  position: absolute !important;
  inset: 10px !important;
  border: 1px solid rgba(255, 247, 237, 0.18) !important;
  border-radius: 10px !important;
  background:
    linear-gradient(90deg, rgba(255, 247, 237, 0.08) 1px, transparent 1px) 0 0 / 26px 26px,
    linear-gradient(rgba(255, 247, 237, 0.06) 1px, transparent 1px) 0 0 / 26px 26px !important;
  pointer-events: none !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-art,
body.app-mode[data-active-view="creative"] .ai-influencer-card-copy {
  position: relative !important;
  z-index: 1 !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-art {
  display: grid !important;
  place-items: center !important;
  aspect-ratio: 1 !important;
  min-height: 116px !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-avatar {
  width: 62% !important;
  height: 62% !important;
  border: 3px solid #fff7ed !important;
  border-radius: 50% 50% 44% 44% !important;
  background:
    radial-gradient(circle at 50% 32%, #fff7ed 0 18%, transparent 19%),
    radial-gradient(circle at 36% 30%, #10131a 0 4%, transparent 5%),
    radial-gradient(circle at 64% 30%, #10131a 0 4%, transparent 5%),
    linear-gradient(180deg, #67d5e8 0 42%, #dfff3f 43% 100%) !important;
  box-shadow: 5px 5px 0 #08090d, 0 0 0 8px rgba(103, 213, 232, 0.18) !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-orbit,
body.app-mode[data-active-view="creative"] .ai-influencer-frame {
  position: absolute !important;
  inset: 10% !important;
  border: 2px solid rgba(223, 255, 63, 0.72) !important;
  border-radius: 50% !important;
  transform: rotate(-16deg) !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-frame {
  inset: 18% 4% 14% 24% !important;
  border-color: rgba(103, 213, 232, 0.7) !important;
  border-radius: 12px !important;
  transform: rotate(8deg) !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-play {
  position: absolute !important;
  right: 4px !important;
  bottom: 10px !important;
  min-height: 28px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  padding: 5px 10px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-copy {
  display: grid !important;
  gap: 6px !important;
  align-content: center !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-copy span,
body.app-mode[data-active-view="creative"] .ai-influencer-card-copy strong {
  justify-self: start !important;
  border: 2px solid rgba(8, 9, 13, 0.86) !important;
  border-radius: 999px !important;
  padding: 5px 9px !important;
  background: #67d5e8 !important;
  color: #08090d !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-copy b {
  color: #fff7ed !important;
  font-size: clamp(18px, 2vw, 24px) !important;
  font-weight: 950 !important;
  line-height: 0.98 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-copy small {
  color: rgba(255, 247, 237, 0.74) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="creative"] .ai-influencer-card-copy strong {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card {
  grid-template-rows: minmax(220px, 1fr) auto auto auto !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  min-height: 30px !important;
  overflow: visible !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row .media-meta-chip {
  flex: 0 0 28px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .badge,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  display: inline-grid !important;
  place-items: center !important;
  min-height: 26px !important;
  max-width: 100% !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 9.5px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .badge.live {
  background: #dfff3f !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 1 1 118px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Presenter setup now lives only in the AI Presenter Setup tab. */
body.app-mode[data-active-view="creative"]:not([data-creative-board-filter="presenter-setup"]) .creative-agent-console .presenter-studio-lab {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "gallery" !important;
}

@media (max-width: 640px) {
  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .ai-influencer-receipt-preview,
  body.app-mode[data-active-view="creative"] .creative-preview-stage .ai-influencer-receipt-preview {
    grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr) !important;
    gap: 10px !important;
    min-height: 178px !important;
    padding: 12px !important;
  }

  body.app-mode[data-active-view="creative"] .ai-influencer-card-copy b {
    font-size: 16px !important;
  }
}

body.app-mode[data-active-view="creative"] .creative-agent-console .chat-composer-actions {
  grid-area: actions !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  min-width: 132px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .cost-mode-trigger {
  width: 100% !important;
  min-height: 40px !important;
  border: 3px solid #08090d !important;
  border-radius: 7px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button {
  width: 100% !important;
  min-height: 62px !important;
  border: 3px solid #08090d !important;
  border-radius: 7px !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  grid-template-rows: minmax(150px, 1fr) auto auto auto !important;
  min-height: 295px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.selected {
  border-color: #08090d !important;
  outline: 4px solid #dfff3f !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card h3,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card p,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer small,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-header h3,
body.app-mode[data-active-view="creative"] .creative-agent-console .chat-agent-header h3 {
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card p,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head small,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher small,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel small {
  color: rgba(8, 9, 13, 0.72) !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer .badge {
  border: 2px solid #08090d !important;
  background: #f8eedb !important;
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
  grid-area: preview !important;
  position: sticky !important;
  top: 16px !important;
  min-height: calc(100dvh - 164px) !important;
  max-height: calc(100dvh - 164px) !important;
  overflow: auto !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell.inspecting-asset,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-shell:has(.preview-inspector) {
  display: grid !important;
  grid-template-rows: minmax(230px, 0.78fr) auto !important;
  gap: 0 !important;
  min-height: 100% !important;
  padding: 0 !important;
  background: transparent !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-canvas {
  grid-row: 1 !important;
  min-height: 230px !important;
  padding: 16px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-device {
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #f8eedb !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector {
  grid-row: 2 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 16px !important;
  border: 0 !important;
  border-top: 3px solid #08090d !important;
  border-radius: 0 !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-identity strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector strong,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector small,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector p,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note span {
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-meta,
body.app-mode[data-active-view="creative"] .preview-inspector-info {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-info {
  grid-template-columns: 1fr !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-meta span,
body.app-mode[data-active-view="creative"] .preview-inspector-info span,
body.app-mode[data-active-view="creative"] .preview-inspector-prompt,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note {
  border: 3px solid #08090d !important;
  border-radius: 7px !important;
  background: #f8eedb !important;
  color: #08090d !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .preview-inspector-info b,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-note b {
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 0 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions a {
  min-width: 0 !important;
  width: 100% !important;
  min-height: 40px !important;
  padding: 8px 9px !important;
  overflow: hidden !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  text-overflow: ellipsis !important;
  white-space: normal !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions .primary-detail-action,
body.app-mode[data-active-view="creative"] .creative-agent-console .preview-inspector-actions button:nth-child(1) {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form label,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher label {
  color: #08090d !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form select,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form input,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-form textarea,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher select {
  border: 3px solid #08090d !important;
  border-radius: 6px !important;
  background: #fff7ed !important;
  color: #08090d !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
    gap: 10px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "project"
      "tabs"
      "gallery"
      "composer"
      "preview"
      "production"
      "dna"
      "tools"
      "manual" !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head {
    display: none !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage,
  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    max-height: none !important;
  }

  body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header {
    align-items: center !important;
    padding-bottom: 8px !important;
  }

  body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header h2 {
    font-size: clamp(25px, 5vw, 34px) !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
    min-height: 0 !important;
    padding: 8px 10px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher small,
  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head small {
    display: none !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head {
    min-height: 0 !important;
    padding: 8px 10px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head-actions button {
    min-height: 34px !important;
    padding: 6px 10px !important;
    font-size: 11px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
    max-height: 190px !important;
    min-height: 190px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
    padding: 8px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
    min-height: 112px !important;
    padding: 8px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form textarea {
    min-height: 48px !important;
    padding: 10px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button {
    min-height: 54px !important;
  }
}

/* Creative Studio functional board correction: content first, detail on demand. */
body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine {
  padding: 16px !important;
  overflow: visible !important;
  transform: none !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header {
  align-items: center !important;
  padding: 0 0 10px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header .eyebrow {
  display: none !important;
}

body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header h2 {
  font-size: clamp(20px, 2vw, 28px) !important;
  line-height: 1.05 !important;
  max-width: 760px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "gallery"
    "composer"
    "manual" !important;
  gap: 10px !important;
  width: 100% !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-mode-switch,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-dna-panel,
body.app-mode[data-active-view="creative"] .creative-agent-console .social-production-lab,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-actions,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-tool-strip,
body.app-mode[data-active-view="creative"] .creative-agent-console .creative-preview-stage {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
  grid-area: project !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 340px) minmax(0, 1fr) !important;
  gap: 10px !important;
  min-height: 0 !important;
  padding: 8px 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher small {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-studio-tabs {
  grid-area: tabs !important;
  padding: 0 0 2px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  grid-area: gallery !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)) !important;
  gap: 12px !important;
  max-height: none !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
  padding: 0 0 160px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  min-height: 330px !important;
  cursor: pointer !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview {
  min-height: 185px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  grid-area: composer !important;
  position: sticky !important;
  bottom: 12px !important;
  z-index: 12 !important;
  width: min(980px, 100%) !important;
  justify-self: center !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
  min-height: 110px !important;
}

.media-lightbox-dialog {
  width: min(1540px, calc(100vw - 28px)) !important;
  max-height: calc(100dvh - 28px) !important;
  background: #fff7ed !important;
}

.media-lightbox-modal {
  background:
    linear-gradient(90deg, rgba(8, 9, 13, 0.055) 1px, transparent 1px),
    linear-gradient(0deg, rgba(8, 9, 13, 0.045) 1px, transparent 1px),
    #fff7ed !important;
  background-size: 28px 28px !important;
}

.media-lightbox-body {
  display: block !important;
  min-height: 0 !important;
  padding: 14px !important;
  overflow: auto !important;
}

.media-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  gap: 14px;
  align-items: stretch;
  min-height: min(760px, calc(100dvh - 132px));
}

.media-detail-hero {
  display: grid;
  place-items: center;
  min-height: min(760px, calc(100dvh - 132px));
  padding: 16px;
  border: 4px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.28), transparent 42%),
    linear-gradient(35deg, rgba(223, 255, 63, 0.24), transparent 62%),
    #f8eedb;
  box-shadow: 6px 6px 0 #08090d;
}

.media-detail-hero img,
.media-detail-hero video,
.media-detail-hero object {
  display: block;
  max-width: 100%;
  max-height: calc(100dvh - 180px);
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #08090d;
  box-shadow: 6px 6px 0 rgba(8, 9, 13, 0.32);
  object-fit: contain;
}

.media-lightbox-dialog.video .media-detail-hero video {
  width: min(520px, 100%) !important;
  aspect-ratio: 9 / 16;
}

.media-detail-text {
  width: min(680px, 100%);
  padding: 24px;
  border: 3px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 5px 5px 0 #08090d;
}

.media-detail-text span,
.media-detail-panel .eyebrow {
  color: #08090d;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
}

.media-detail-text strong {
  display: block;
  margin-top: 8px;
  font-size: 28px;
  line-height: 1.05;
}

.media-detail-text p {
  margin: 14px 0 0;
  color: #08090d;
  font-size: 15px;
  line-height: 1.45;
}

.media-detail-panel {
  display: grid;
  align-content: start;
  gap: 12px;
  min-width: 0;
  max-height: min(760px, calc(100dvh - 132px));
  overflow: auto;
  padding: 12px;
  border: 4px solid #08090d;
  border-radius: 8px;
  background: #fff7ed;
  color: #08090d;
  box-shadow: 6px 6px 0 #08090d;
}

.media-detail-author {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.media-detail-author strong,
.media-detail-card strong {
  display: block;
  color: #08090d;
  font-size: 20px;
  line-height: 1.08;
}

.media-detail-card {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 3px solid #08090d;
  border-radius: 7px;
  background: #f8eedb;
}

.media-detail-card p,
.media-detail-card small {
  margin: 0;
  color: rgba(8, 9, 13, 0.78);
  font-size: 13px;
  line-height: 1.45;
}

.media-detail-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.media-detail-card-head button,
.media-detail-actions button,
.media-detail-actions a {
  border: 3px solid #08090d;
  border-radius: 7px;
  background: #fff7ed;
  color: #08090d;
  font-weight: 950;
  box-shadow: 3px 3px 0 #08090d;
  text-decoration: none;
}

.media-detail-info {
  display: grid;
  gap: 0;
  margin: 0;
}

.media-detail-info div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-top: 2px solid rgba(8, 9, 13, 0.16);
}

.media-detail-info dt,
.media-detail-info dd {
  margin: 0;
  color: #08090d;
  font-size: 12px;
  font-weight: 850;
}

.media-detail-info dt {
  opacity: 0.68;
}

.media-detail-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.media-detail-actions button,
.media-detail-actions a {
  display: grid;
  place-items: center;
  min-height: 46px;
  padding: 8px;
  text-align: center;
}

.media-detail-actions .primary-action,
.media-detail-actions button:first-child {
  grid-column: 1 / -1;
  background: #dfff3f;
}

@media (max-width: 980px) {
  .media-detail-layout {
    grid-template-columns: 1fr;
  }

  .media-detail-hero,
  .media-detail-panel {
    min-height: 0;
    max-height: none;
  }

  .media-detail-hero img,
  .media-detail-hero video,
  .media-detail-hero object {
    max-height: 64dvh;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine {
    padding: 10px !important;
  }

  body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header {
    align-items: flex-start !important;
    gap: 8px !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .creative-project-switcher {
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
    position: relative !important;
    bottom: auto !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
    padding-bottom: 0 !important;
  }
}

/* Creative Studio polish: equal cards, persistent composer, compact asset detail. */
body.app-mode .app-footer,
body.app-mode .app-footer.universal-footer {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  align-items: stretch !important;
  grid-auto-rows: 480px !important;
  padding-bottom: 210px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  display: grid !important;
  grid-template-rows: 190px 72px 34px 28px 120px !important;
  height: 480px !important;
  min-height: 480px !important;
  max-height: 480px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text .media-preview {
  min-height: 190px !important;
  height: 190px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card h3 {
  display: -webkit-box !important;
  min-height: 34px !important;
  max-height: 34px !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card p {
  display: -webkit-box !important;
  min-height: 34px !important;
  max-height: 34px !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta {
  display: grid !important;
  grid-template-columns: repeat(4, 28px) !important;
  align-items: center !important;
  justify-content: start !important;
  gap: 6px !important;
  min-height: 28px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta .media-meta-chip {
  display: inline-grid !important;
  place-items: center !important;
  width: 28px !important;
  height: 26px !important;
  min-width: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta .media-meta-chip svg {
  width: 15px !important;
  height: 15px !important;
  fill: none !important;
  stroke: #08090d !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta .media-meta-chip b {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 28px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer .creative-execution-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 108px !important;
  min-width: 0 !important;
  height: 22px !important;
  padding: 0 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 999px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
  min-height: 116px !important;
  padding-bottom: 8px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  width: 100% !important;
  min-height: 32px !important;
  height: 32px !important;
  padding: 4px 5px !important;
  overflow: hidden !important;
  color: #08090d !important;
  font-size: 10px !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button:nth-child(5) {
  grid-column: auto !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions .fit-review-action {
  grid-column: 1 / -1 !important;
  height: 32px !important;
  margin-top: 10px !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button.fit-review-action,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button:nth-child(5).fit-review-action {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  position: fixed !important;
  right: max(18px, calc((100vw - 1320px - 232px) / 2 + 18px)) !important;
  bottom: 16px !important;
  left: max(250px, calc((100vw - 1320px + 232px) / 2 + 18px)) !important;
  z-index: 80 !important;
  width: auto !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  padding: 5px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form {
  min-height: 70px !important;
  padding: 5px !important;
  gap: 6px !important;
}

body.app-mode[data-active-view="creative"] .composer-asset-rail,
body.app-mode[data-active-view="creative"] .composer-brief-options,
body.app-mode[data-active-view="creative"] .creative-agent-console .chat-composer-actions {
  gap: 6px !important;
}

body.app-mode[data-active-view="creative"] .composer-asset-rail button,
body.app-mode[data-active-view="creative"] .composer-brief-options button {
  min-height: 28px !important;
  padding: 4px 9px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-form textarea {
  min-height: 34px !important;
  max-height: 56px !important;
  padding: 7px 10px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .cost-mode-trigger {
  min-height: 30px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .send-icon-button {
  min-height: 44px !important;
}

.media-lightbox-dialog {
  width: min(1460px, calc(100vw - 28px)) !important;
}

.media-lightbox-modal > header {
  padding: 8px 12px !important;
}

.media-lightbox-modal > header .eyebrow,
.media-lightbox-modal > header p {
  display: none !important;
}

.media-lightbox-modal h2 {
  max-width: min(720px, 72vw) !important;
  overflow: hidden !important;
  font-size: clamp(16px, 1.4vw, 22px) !important;
  line-height: 1.05 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.media-lightbox-body {
  padding: 10px !important;
}

.media-detail-layout {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px) !important;
  gap: 10px !important;
  min-height: min(760px, calc(100dvh - 86px)) !important;
}

.media-detail-hero {
  min-height: min(760px, calc(100dvh - 86px)) !important;
  padding: 10px !important;
}

.media-detail-hero img,
.media-detail-hero video,
.media-detail-hero object {
  max-height: calc(100dvh - 132px) !important;
}

.media-lightbox-dialog.video .media-detail-hero video {
  width: min(560px, 100%) !important;
}

.media-detail-panel {
  gap: 8px !important;
  max-height: min(760px, calc(100dvh - 86px)) !important;
  padding: 9px !important;
}

.media-detail-author strong,
.media-detail-card strong {
  font-size: 16px !important;
}

.media-detail-card {
  gap: 6px !important;
  padding: 9px !important;
}

.media-detail-prompt-card {
  gap: 5px !important;
  padding: 8px 9px !important;
  border-width: 2px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.54), rgba(248, 238, 219, 0.9)),
    #fff7ed !important;
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.82) !important;
}

.media-detail-prompt-card .media-detail-card-head {
  min-height: 24px !important;
  gap: 8px !important;
}

.media-detail-copy-button,
.media-detail-prompt-card .media-detail-copy-button {
  min-height: 24px !important;
  padding: 3px 9px !important;
  border: 2px solid rgba(8, 9, 13, 0.72) !important;
  border-radius: 999px !important;
  background: rgba(255, 247, 237, 0.76) !important;
  color: rgba(8, 9, 13, 0.82) !important;
  box-shadow: none !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.media-detail-card p,
.media-detail-card small {
  display: -webkit-box !important;
  overflow: hidden !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

.media-detail-prompt-copy,
.media-detail-prompt-card .media-detail-prompt-copy {
  color: rgba(8, 9, 13, 0.64) !important;
  font-size: 11.5px !important;
  line-height: 1.34 !important;
  -webkit-line-clamp: 4 !important;
}

.media-detail-info div {
  padding: 6px 0 !important;
}

.media-detail-execution-card .media-detail-info dd {
  max-width: 160px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.media-detail-actions {
  gap: 7px !important;
}

.media-detail-actions button,
.media-detail-actions a {
  min-height: 36px !important;
  padding: 5px 6px !important;
  overflow: hidden !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

@media (max-width: 980px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
    right: 12px !important;
    left: 12px !important;
    bottom: 12px !important;
    max-width: none !important;
  }

  body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
    padding-bottom: 180px !important;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
    grid-auto-rows: 470px !important;
    padding-bottom: 220px !important;
  }

  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
  body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
    height: 470px !important;
    min-height: 470px !important;
    max-height: 470px !important;
  }

  .media-detail-layout {
    grid-template-columns: 1fr !important;
  }

  .media-detail-hero,
  .media-detail-panel {
    min-height: 0 !important;
    max-height: none !important;
  }
}

/* Main navigation collapse: reclaim workspace width while keeping a visible reopen rail. */
body.app-mode > .app-shell > .sidebar {
  grid-column: 1;
  grid-row: 1;
}

body.app-mode > .app-shell > main {
  grid-column: 2;
  grid-row: 1;
}

.sidebar-collapse-toggle,
.sidebar-reopen-toggle {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  min-width: 38px;
  padding: 0;
  border: 3px solid #08090d;
  border-radius: 999px;
  background: #dfff3f;
  color: #08090d;
  box-shadow: 3px 3px 0 #08090d;
  cursor: pointer;
}

.sidebar-collapse-toggle svg,
.sidebar-reopen-toggle svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sidebar-collapse-toggle {
  position: absolute;
  top: 78px;
  right: -19px;
  z-index: 5;
}

.sidebar-reopen-toggle {
  display: none;
}

body.app-mode.sidebar-collapsed > .app-shell,
body.app-mode.sidebar-collapsed:not(.admin-mode) > .app-shell {
  grid-template-columns: 58px minmax(0, 1fr) !important;
}

body.app-mode.sidebar-collapsed > .app-shell > .sidebar {
  display: none !important;
}

body.app-mode.sidebar-collapsed > .app-shell > .sidebar-reopen-toggle {
  position: sticky;
  top: 18px;
  z-index: 60;
  display: inline-grid !important;
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  justify-self: center;
  margin-top: 16px;
}

body.app-mode.sidebar-collapsed > .app-shell > main {
  width: min(100%, calc(100vw - 58px)) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="creative"] .creative-agent-console .ploxy-chat-panel {
  left: 74px !important;
}

@media (min-width: 761px) and (max-width: 1180px) {
  body.app-mode.sidebar-collapsed > .app-shell,
  body.app-mode.sidebar-collapsed:not(.admin-mode) > .app-shell,
  body.app-mode.sidebar-collapsed .app-shell {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
  }

  body.app-mode.sidebar-collapsed > .app-shell > main,
  body.app-mode.sidebar-collapsed main {
    width: min(100%, calc(100vw - 58px)) !important;
  }
}

body.app-mode:is(
  [data-active-view="dashboard"],
  [data-active-view="missions"],
  [data-active-view="automation"],
  [data-active-view="campaigns"],
  [data-active-view="queue"],
  [data-active-view="connections"],
  [data-active-view="analytics"],
  [data-active-view="ads"],
  [data-active-view="pages"],
  [data-active-view="influencers"],
  [data-active-view="outreach"],
  [data-active-view="affiliate"],
  [data-active-view="seo"],
  [data-active-view="community"],
  [data-active-view="reach"],
  [data-active-view="telegram-module"],
  [data-active-view="reports"],
  [data-active-view="subscription"],
  [data-active-view="brand"],
  [data-active-view="modules"]
) > .app-shell > main,
body.app-mode:is(
  [data-active-view="dashboard"],
  [data-active-view="missions"],
  [data-active-view="automation"],
  [data-active-view="campaigns"],
  [data-active-view="queue"],
  [data-active-view="connections"],
  [data-active-view="analytics"],
  [data-active-view="ads"],
  [data-active-view="pages"],
  [data-active-view="influencers"],
  [data-active-view="outreach"],
  [data-active-view="affiliate"],
  [data-active-view="seo"],
  [data-active-view="community"],
  [data-active-view="reach"],
  [data-active-view="telegram-module"],
  [data-active-view="reports"],
  [data-active-view="subscription"],
  [data-active-view="brand"],
  [data-active-view="modules"]
) > .app-shell > main:has(.app-footer.universal-footer) {
  padding: 22px 24px 184px !important;
  padding-bottom: 184px !important;
  padding-block-end: 184px !important;
  scroll-padding-bottom: 184px !important;
}

body.app-mode:is(
  [data-active-view="dashboard"],
  [data-active-view="missions"],
  [data-active-view="automation"],
  [data-active-view="campaigns"],
  [data-active-view="queue"],
  [data-active-view="connections"],
  [data-active-view="analytics"],
  [data-active-view="ads"],
  [data-active-view="pages"],
  [data-active-view="influencers"],
  [data-active-view="outreach"],
  [data-active-view="affiliate"],
  [data-active-view="seo"],
  [data-active-view="community"],
  [data-active-view="reach"],
  [data-active-view="telegram-module"],
  [data-active-view="reports"],
  [data-active-view="subscription"],
  [data-active-view="brand"],
  [data-active-view="modules"]
) [data-view-section].active {
  padding-bottom: 154px !important;
}

@media (max-width: 760px) {
  body.app-mode:is(
    [data-active-view="dashboard"],
    [data-active-view="missions"],
    [data-active-view="automation"],
    [data-active-view="campaigns"],
    [data-active-view="queue"],
    [data-active-view="connections"],
    [data-active-view="analytics"],
    [data-active-view="ads"],
    [data-active-view="pages"],
    [data-active-view="influencers"],
    [data-active-view="outreach"],
    [data-active-view="affiliate"],
    [data-active-view="seo"],
    [data-active-view="community"],
    [data-active-view="reach"],
    [data-active-view="telegram-module"],
    [data-active-view="reports"],
    [data-active-view="subscription"],
    [data-active-view="brand"],
    [data-active-view="modules"]
  ) > .app-shell > main,
  body.app-mode:is(
    [data-active-view="dashboard"],
    [data-active-view="missions"],
    [data-active-view="automation"],
    [data-active-view="campaigns"],
    [data-active-view="queue"],
    [data-active-view="connections"],
    [data-active-view="analytics"],
    [data-active-view="ads"],
    [data-active-view="pages"],
    [data-active-view="influencers"],
    [data-active-view="outreach"],
    [data-active-view="affiliate"],
    [data-active-view="seo"],
    [data-active-view="community"],
    [data-active-view="reach"],
    [data-active-view="telegram-module"],
    [data-active-view="reports"],
    [data-active-view="subscription"],
    [data-active-view="brand"],
    [data-active-view="modules"]
  ) > .app-shell > main:has(.app-footer.universal-footer) {
    padding: calc(62px + env(safe-area-inset-top)) 12px 206px !important;
    padding-bottom: 206px !important;
    padding-block-end: 206px !important;
    scroll-padding-bottom: 206px !important;
  }

  .sidebar-collapse-toggle,
  .sidebar-reopen-toggle,
  body.app-mode.sidebar-collapsed > .app-shell > .sidebar-reopen-toggle {
    display: none !important;
  }

  body.app-mode.sidebar-collapsed {
    --mobile-sidebar-collapsed-noop: 1;
  }
}

/* Creative card click contract: media preview opens detail, card body stays passive. */
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  cursor: default !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card [data-media-open],
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-open-hitbox,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card button {
  cursor: pointer !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
  grid-template-areas:
    "project preview"
    "head preview"
    "tabs preview"
    "gallery preview"
    "composer preview"
    "production preview"
    "presenter preview"
    "dna preview"
    "tools preview"
    "manual preview" !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .presenter-studio-lab {
  grid-area: presenter !important;
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  border: 4px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  box-shadow: 5px 5px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-studio-header,
body.app-mode[data-active-view="creative"] .presenter-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="creative"] .presenter-studio-header h3 {
  margin: 2px 0 0 !important;
  color: #08090d !important;
  font-size: 1rem !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-form {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-form label {
  display: grid !important;
  gap: 5px !important;
  min-width: 0 !important;
  color: #08090d !important;
  font-size: 0.68rem !important;
  font-weight: 900 !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-form .wide-field,
body.app-mode[data-active-view="creative"] .presenter-actions {
  grid-column: 1 / -1 !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-form input,
body.app-mode[data-active-view="creative"] .presenter-job-form select {
  width: 100% !important;
  min-width: 0 !important;
  border: 3px solid #08090d !important;
  border-radius: 6px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font: inherit !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-panel {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background:
    linear-gradient(135deg, rgba(106, 211, 226, 0.18), transparent 44%),
    linear-gradient(318deg, rgba(223, 255, 63, 0.18), transparent 52%),
    #fff7ed !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-panel[hidden] {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-panel-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-panel-head div {
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-panel-head strong {
  display: block !important;
  margin-top: 3px !important;
  color: #08090d !important;
  font-size: 0.78rem !important;
  line-height: 1.14 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-panel-head .badge {
  flex: 0 0 auto !important;
}

body.app-mode[data-active-view="creative"] .heygen-control-grid,
body.app-mode[data-active-view="creative"] .higgsfield-control-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 7px !important;
  min-width: 0 !important;
  padding-top: 18px !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip::before,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip::before {
  content: attr(data-status) !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  color: rgba(8, 9, 13, 0.62) !important;
  font-size: 0.58rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip article,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip article {
  min-width: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 7px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip.needs-ids article,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip.needs-refs article {
  background: rgba(255, 219, 168, 0.72) !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip span,
body.app-mode[data-active-view="creative"] .heygen-payload-strip strong,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip span,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip strong {
  display: block !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip span,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip span {
  color: rgba(8, 9, 13, 0.58) !important;
  font-size: 0.56rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .heygen-payload-strip strong,
body.app-mode[data-active-view="creative"] .higgsfield-payload-strip strong {
  margin-top: 4px !important;
  color: #08090d !important;
  font-size: 0.66rem !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="creative"] .presenter-consent-field {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  gap: 8px !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 8px !important;
  background: rgba(223, 255, 63, 0.24) !important;
}

body.app-mode[data-active-view="creative"] .presenter-consent-field input {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 auto !important;
}

body.app-mode[data-active-view="creative"] .presenter-actions small {
  flex: 1 1 260px !important;
  min-width: 0 !important;
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-preview {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 8px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness.ready {
  background: rgba(134, 226, 166, 0.34) !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness.blocked {
  background: rgba(255, 219, 168, 0.7) !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness div {
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness strong,
body.app-mode[data-active-view="creative"] .presenter-provider-readiness small {
  display: block !important;
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness strong {
  margin-top: 3px !important;
  color: #08090d !important;
  font-size: 0.78rem !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness small {
  margin-top: 3px !important;
  color: rgba(8, 9, 13, 0.68) !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="creative"] .presenter-provider-readiness button {
  flex: 0 0 auto !important;
  min-height: 30px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 0 12px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 0.68rem !important;
  font-weight: 950 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-preview article,
body.app-mode[data-active-view="creative"] .presenter-job-empty,
body.app-mode[data-active-view="creative"] .presenter-job-card {
  min-width: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 8px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-preview span,
body.app-mode[data-active-view="creative"] .presenter-job-card .eyebrow {
  display: block !important;
  color: rgba(8, 9, 13, 0.58) !important;
  font-size: 0.58rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-preview strong,
body.app-mode[data-active-view="creative"] .presenter-job-card strong,
body.app-mode[data-active-view="creative"] .presenter-job-empty strong {
  display: block !important;
  margin-top: 4px !important;
  overflow-wrap: anywhere !important;
  color: #08090d !important;
  font-size: 0.72rem !important;
  line-height: 1.15 !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-list {
  display: grid !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card.selected {
  background: rgba(223, 255, 63, 0.34) !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card small,
body.app-mode[data-active-view="creative"] .presenter-job-empty small {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(8, 9, 13, 0.66) !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card-actions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(58px, 1fr)) !important;
  gap: 6px !important;
  min-width: 202px !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card-actions span {
  grid-column: 1 / -1 !important;
  color: #08090d !important;
  font-size: 0.64rem !important;
  font-weight: 950 !important;
  text-align: center !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card-actions button {
  min-height: 30px !important;
  min-width: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 0.62rem !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  white-space: normal !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-card-actions button:disabled {
  cursor: not-allowed !important;
  opacity: 0.48 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-detail {
  display: grid !important;
  gap: 10px !important;
  min-width: 0 !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  padding: 10px !important;
  background: rgba(255, 255, 255, 0.8) !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-job-detail[hidden] {
  display: none !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-head,
body.app-mode[data-active-view="creative"] .presenter-card-title {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-head div {
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-head strong {
  display: block !important;
  margin-top: 3px !important;
  color: #08090d !important;
  font-size: 0.84rem !important;
  line-height: 1.16 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-head small {
  display: block !important;
  margin-top: 3px !important;
  color: rgba(8, 9, 13, 0.62) !important;
  font-size: 0.66rem !important;
  font-weight: 850 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-close {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #fff7ed !important;
  color: #08090d !important;
  font-size: 1.1rem !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-actions {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 7px !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-actions button,
body.app-mode[data-active-view="creative"] .presenter-media-readiness a,
body.app-mode[data-active-view="creative"] .presenter-media-readiness button,
body.app-mode[data-active-view="creative"] .presenter-card-title button {
  min-height: 30px !important;
  min-width: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: #dfff3f !important;
  color: #08090d !important;
  font-size: 0.64rem !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-actions button:disabled,
body.app-mode[data-active-view="creative"] .presenter-media-readiness button:disabled {
  cursor: not-allowed !important;
  opacity: 0.52 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] .presenter-detail-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr) !important;
  gap: 10px !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="creative"] .presenter-payload-card,
body.app-mode[data-active-view="creative"] .presenter-receipt-card,
body.app-mode[data-active-view="creative"] .presenter-media-readiness {
  min-width: 0 !important;
  border: 2px solid #08090d !important;
  border-radius: 8px !important;
  padding: 8px !important;
  background: #fff7ed !important;
}

body.app-mode[data-active-view="creative"] .presenter-payload-card {
  grid-row: span 2 !important;
}

body.app-mode[data-active-view="creative"] .presenter-card-title span {
  min-width: 0 !important;
  color: #08090d !important;
  font-size: 0.68rem !important;
  font-weight: 950 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .presenter-card-title button {
  flex: 0 0 auto !important;
  min-height: 26px !important;
  background: #86e2a6 !important;
}

body.app-mode[data-active-view="creative"] .presenter-payload-preview {
  width: 100% !important;
  max-height: 180px !important;
  margin: 8px 0 0 !important;
  overflow: auto !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
  border: 2px solid rgba(8, 9, 13, 0.3) !important;
  border-radius: 7px !important;
  padding: 8px !important;
  background: rgba(8, 9, 13, 0.92) !important;
  color: #fff7ed !important;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace !important;
  font-size: 0.64rem !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view="creative"] .presenter-receipt-list {
  display: grid !important;
  gap: 6px !important;
  margin-top: 8px !important;
}

body.app-mode[data-active-view="creative"] .presenter-receipt-list div {
  display: grid !important;
  grid-template-columns: 84px minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: start !important;
  border-top: 1px solid rgba(8, 9, 13, 0.16) !important;
  padding-top: 6px !important;
}

body.app-mode[data-active-view="creative"] .presenter-receipt-list span {
  color: rgba(8, 9, 13, 0.56) !important;
  font-size: 0.58rem !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .presenter-receipt-list strong {
  color: #08090d !important;
  font-size: 0.66rem !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] .presenter-media-readiness {
  display: grid !important;
  gap: 6px !important;
  align-content: start !important;
  background: rgba(223, 255, 63, 0.24) !important;
}

body.app-mode[data-active-view="creative"] .presenter-media-readiness.ready {
  background: rgba(134, 226, 166, 0.3) !important;
}

body.app-mode[data-active-view="creative"] .presenter-media-readiness.pending,
body.app-mode[data-active-view="creative"] .presenter-media-readiness.waiting {
  background: rgba(255, 219, 168, 0.58) !important;
}

body.app-mode[data-active-view="creative"] .presenter-media-readiness span {
  color: rgba(8, 9, 13, 0.58) !important;
  font-size: 0.58rem !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
}

body.app-mode[data-active-view="creative"] .presenter-media-readiness strong {
  color: #08090d !important;
  font-size: 0.7rem !important;
  line-height: 1.24 !important;
}

@media (max-width: 1180px) {
  body.app-mode[data-active-view="creative"] .creative-agent-console.chat-studio {
    grid-template-areas:
      "project"
      "tabs"
      "gallery"
      "composer"
      "preview"
      "production"
      "presenter"
      "dna"
      "tools"
      "manual" !important;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="creative"] .presenter-job-form,
  body.app-mode[data-active-view="creative"] .presenter-job-preview,
  body.app-mode[data-active-view="creative"] .heygen-control-grid,
  body.app-mode[data-active-view="creative"] .heygen-payload-strip,
  body.app-mode[data-active-view="creative"] .higgsfield-control-grid,
  body.app-mode[data-active-view="creative"] .higgsfield-payload-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.app-mode[data-active-view="creative"] .presenter-studio-header,
  body.app-mode[data-active-view="creative"] .presenter-actions,
  body.app-mode[data-active-view="creative"] .presenter-job-card {
    align-items: stretch !important;
    grid-template-columns: 1fr !important;
  }

  body.app-mode[data-active-view="creative"] .presenter-studio-header,
  body.app-mode[data-active-view="creative"] .presenter-actions {
    flex-direction: column !important;
  }
}

@media (max-width: 460px) {
  body.app-mode[data-active-view="creative"] .presenter-job-form,
  body.app-mode[data-active-view="creative"] .presenter-job-preview,
  body.app-mode[data-active-view="creative"] .heygen-control-grid,
  body.app-mode[data-active-view="creative"] .heygen-payload-strip,
  body.app-mode[data-active-view="creative"] .higgsfield-control-grid,
  body.app-mode[data-active-view="creative"] .higgsfield-payload-strip {
    grid-template-columns: 1fr !important;
  }
}

/* Settings page final polish: compact operational controls with restrained color accents. */
body.app-mode[data-active-view="settings"] [data-view-section="settings"] > .full-panel {
  display: grid !important;
  gap: 12px !important;
  background:
    linear-gradient(130deg, rgba(123, 211, 232, 0.16), transparent 38%),
    linear-gradient(312deg, rgba(213, 255, 0, 0.16), transparent 46%),
    #fffaf0 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .panel-header {
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 250, 240, 0.94) !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .panel-header h2 {
  font-size: 17px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid {
  margin: 0 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid article {
  --settings-accent: #7bd3e8;
  min-height: 58px !important;
  background: #fffdf7 !important;
  box-shadow:
    inset 0 5px 0 var(--settings-accent),
    4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid article:nth-child(1) {
  --settings-accent: #d5ff00;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid article:nth-child(3) {
  --settings-accent: #a78bfa;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-summary-grid article:nth-child(4) {
  --settings-accent: #ffe29c;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel {
  grid-template-columns: minmax(220px, 0.48fr) minmax(0, 1fr) !important;
  margin: 0 !important;
  padding: 11px !important;
  background:
    linear-gradient(90deg, rgba(213, 255, 0, 0.2), transparent 36%),
    linear-gradient(120deg, rgba(123, 211, 232, 0.18), rgba(255, 226, 156, 0.24)),
    #fffaf0 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child {
  padding: 10px !important;
  background: #fffdf7 !important;
  color: #08090d !important;
  box-shadow: inset 6px 0 0 #7bd3e8 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child .eyebrow,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child h3,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel > div:first-child p {
  color: #08090d !important;
  text-shadow: none !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel h3 {
  font-size: 15px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-panel p {
  font-size: 10px !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article,
body.app-mode[data-active-view="settings"] .security-status-grid article {
  --settings-accent: #7bd3e8;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.68), transparent),
    #fffdf7 !important;
  box-shadow:
    inset 0 6px 0 var(--settings-accent),
    4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-1,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article:nth-child(1),
body.app-mode[data-active-view="settings"] .security-status-grid article:nth-child(1) {
  --settings-accent: #d5ff00;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-2,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article:nth-child(2),
body.app-mode[data-active-view="settings"] .security-status-grid article:nth-child(2) {
  --settings-accent: #7bd3e8;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-3,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article:nth-child(3),
body.app-mode[data-active-view="settings"] .security-status-grid article:nth-child(3) {
  --settings-accent: #a78bfa;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article.tone-4 {
  --settings-accent: #ffe29c;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid article {
  min-height: 76px !important;
  gap: 6px !important;
  padding: 9px !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid strong,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board strong {
  font-size: 12.5px !important;
  line-height: 1.15 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-project-grid small,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board small {
  font-size: 9px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board {
  margin: 0 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .agent-permission-board article {
  min-height: 78px !important;
  padding: 10px !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-section,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .account-security-form {
  background: rgba(255, 253, 247, 0.96) !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-section .section-title h3,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .account-security-form .section-title h3 {
  font-size: 12.5px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-form button,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] .account-security-form button,
body.app-mode[data-active-view="settings"] [data-view-section="settings"] #export-state-button {
  min-height: 32px !important;
  padding: 7px 10px !important;
  font-size: 10.5px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] #team-member-output {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .settings-status {
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fffdf7 !important;
  box-shadow:
    inset 0 0 0 999px rgba(123, 211, 232, 0.1),
    4px 4px 0 #08090d !important;
  color: #08090d !important;
  font-size: 10.5px !important;
  font-weight: 850 !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view="settings"] .security-status-grid article {
  min-height: 54px !important;
  padding: 8px 9px !important;
}

body.app-mode[data-active-view="settings"] .security-status-grid strong {
  font-size: 12px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="settings"] .security-status-grid small {
  font-size: 8.8px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="settings"] [data-view-section="settings"] .export-box {
  max-height: 180px !important;
  border-radius: 8px !important;
  background: #0f1720 !important;
  color: #fffaf0 !important;
  font-size: 10px !important;
  line-height: 1.34 !important;
}

/* Modules page final polish: focused module cards, softer color, no in-page prompt actions. */
body.app-mode[data-active-view="modules"] [data-view-section="modules"] > .full-panel {
  display: grid !important;
  gap: 12px !important;
  padding: 16px !important;
  background:
    linear-gradient(126deg, rgba(123, 211, 232, 0.16), transparent 38%),
    linear-gradient(318deg, rgba(213, 255, 0, 0.14), transparent 48%),
    #fffaf0 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .panel-header {
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 253, 247, 0.94) !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .panel-header h2 {
  max-width: 46ch !important;
  font-size: 17px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .panel-header .badge,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] #competitor-status {
  min-height: 28px !important;
  padding: 6px 10px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 9px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board article {
  --module-accent: #7bd3e8;
  min-height: 64px !important;
  padding: 9px 10px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.66), transparent),
    #fffdf7 !important;
  box-shadow:
    inset 0 5px 0 var(--module-accent),
    4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board article.ready {
  --module-accent: #d5ff00;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board article.attention {
  --module-accent: #ffd166;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board article.blocked {
  --module-accent: #ff7a7a;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board strong {
  font-size: 13px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-overview-board small {
  font-size: 9px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-status {
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: #fffdf7 !important;
  box-shadow:
    inset 0 0 0 999px rgba(123, 211, 232, 0.1),
    4px 4px 0 #08090d !important;
  color: #08090d !important;
  font-size: 10.5px !important;
  font-weight: 850 !important;
  line-height: 1.26 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-panel {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 11px !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(123, 211, 232, 0.18), transparent 42%),
    #fffdf7 !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-header {
  margin: 0 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intel-header h3 {
  font-size: 15px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake .wide-field {
  grid-column: span 2 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake label {
  gap: 4px !important;
  min-width: 0 !important;
  font-size: 9px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake input,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake select,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake textarea {
  min-height: 34px !important;
  padding: 7px 8px !important;
  font-size: 10.5px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-intake textarea {
  min-height: 48px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-actions {
  gap: 6px !important;
  padding: 7px !important;
  background: rgba(255, 250, 240, 0.78) !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-actions button {
  min-height: 32px !important;
  padding: 7px 10px !important;
  font-size: 10px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-actions small,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] #competitor-output {
  font-size: 9px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis {
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis article {
  min-height: 58px !important;
  padding: 8px 9px !important;
  border-radius: 7px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), transparent),
    #fff7ed !important;
  box-shadow:
    inset 0 4px 0 rgba(167, 139, 250, 0.72),
    3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis strong {
  margin: 2px 0 !important;
  font-size: 17px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis span,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-kpis small {
  font-size: 8.5px !important;
  line-height: 1.15 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-matrix {
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-empty {
  padding: 10px !important;
  border-radius: 8px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), transparent),
    #fffaf0 !important;
  box-shadow:
    inset 0 5px 0 rgba(123, 211, 232, 0.82),
    4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card h4 {
  font-size: 13px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-meta,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid {
  gap: 6px !important;
  margin-top: 7px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-meta span,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid div {
  padding: 6px !important;
  font-size: 9px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid strong,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-empty strong {
  font-size: 11px !important;
  line-height: 1.15 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-compare-grid small,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-empty small,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-card p {
  font-size: 10px !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-signal-stack {
  display: grid !important;
  gap: 5px !important;
  margin-top: 7px !important;
  padding: 7px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  background: rgba(255, 255, 255, 0.56) !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-signal-stack small,
body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-source-actions span {
  color: rgba(8, 9, 13, 0.72) !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .competitor-source-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 7px !important;
  margin-top: 7px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-roadmap {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card {
  --module-accent: #7bd3e8;
  align-content: start !important;
  gap: 7px !important;
  min-height: 176px !important;
  padding: 10px !important;
  border-radius: 8px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), transparent),
    #fffdf7 !important;
  box-shadow:
    inset 0 6px 0 var(--module-accent),
    4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card.ready {
  --module-accent: #d5ff00;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card.attention {
  --module-accent: #ffd166;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card.blocked {
  --module-accent: #ff7a7a;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card header {
  gap: 8px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card h3 {
  font-size: 12.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card p {
  min-height: 38px !important;
  font-size: 9.5px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-card-meta {
  min-height: 40px !important;
  padding: 7px !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-card-meta span:first-child {
  font-size: 8px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .module-card-meta span:last-child {
  font-size: 8.8px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-actions {
  grid-template-columns: minmax(0, 1fr) !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .roadmap-card button {
  min-height: 30px !important;
  padding: 6px 9px !important;
  border-radius: 7px !important;
  background: #7bd3e8 !important;
  font-size: 9.5px !important;
  line-height: 1.05 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .progress-row {
  gap: 6px !important;
  font-size: 8.5px !important;
  line-height: 1.1 !important;
}

body.app-mode[data-active-view="modules"] [data-view-section="modules"] .progress-track {
  height: 7px !important;
}

/* SEO page polish: clearer action controls and readable keyword cluster text. */
body.app-mode[data-active-view="seo"] #seo-create-brief {
  min-height: 72px !important;
  padding: 10px 12px !important;
  border: 3px solid #08090d !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.48), transparent),
    #d5ff00 !important;
  color: #08090d !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  box-shadow: 4px 4px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console {
  gap: 9px !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button {
  --seo-action-accent: #6ee7b7;
  align-content: start !important;
  gap: 7px !important;
  min-height: 66px !important;
  padding: 9px 10px !important;
  border: 3px solid #08090d !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.64), transparent),
    #fffdf7 !important;
  color: #08090d !important;
  box-shadow:
    inset 0 5px 0 var(--seo-action-accent),
    3px 3px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 2) {
  --seo-action-accent: #67d5e8;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 3) {
  --seo-action-accent: #ffd166;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n + 4) {
  --seo-action-accent: #ff8fa3;
}

body.app-mode[data-active-view="seo"] .seo-action-console button:nth-child(5n) {
  --seo-action-accent: #a78bfa;
}

body.app-mode[data-active-view="seo"] .seo-action-console span {
  width: fit-content !important;
  max-width: 100% !important;
  padding: 3px 6px !important;
  border: 1px solid #08090d !important;
  border-radius: 999px !important;
  background: #08090d !important;
  color: #fffaf0 !important;
  font-size: 8.5px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="seo"] .seo-action-console strong {
  color: #08090d !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="seo"] #seo-search-console-import strong {
  color: #08090d !important;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list article {
  grid-template-columns: 32px minmax(0, 1fr) minmax(82px, max-content) !important;
  align-items: start !important;
  gap: 8px !important;
  padding: 9px !important;
  border: 3px solid #08090d !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.62), transparent),
    #fffdf7 !important;
  color: #08090d !important;
  box-shadow:
    inset 0 4px 0 rgba(110, 231, 183, 0.86),
    2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list article:nth-child(2n) {
  box-shadow:
    inset 0 4px 0 rgba(103, 213, 232, 0.82),
    2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list article > span {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  border: 2px solid #08090d !important;
  background: #08090d !important;
  color: #fffaf0 !important;
  font-size: 8px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list strong,
body.app-mode[data-active-view="seo"] #seo-pipeline-list strong {
  color: #08090d !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list small,
body.app-mode[data-active-view="seo"] #seo-pipeline-list small {
  color: #22242a !important;
  font-size: 10.3px !important;
  font-weight: 750 !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="seo"] #seo-cluster-list b {
  justify-self: end !important;
  padding: 6px 8px !important;
  border: 2px solid #08090d !important;
  background: #d5ff00 !important;
  color: #08090d !important;
  font-size: 8.5px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  box-shadow: 1px 1px 0 #08090d !important;
}

body.app-mode[data-active-view="seo"] #seo-pipeline-list article.module-rule-item,
body.app-mode[data-active-view="seo"] #seo-pipeline-list article.module-agent-output {
  border: 3px solid #08090d !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.58), transparent),
    #fffdf7 !important;
  color: #08090d !important;
  box-shadow:
    inset 0 4px 0 rgba(103, 213, 232, 0.58),
    2px 2px 0 #08090d !important;
}

/* Creative Studio media-only board: final scoped pass. */
body.app-mode[data-active-view="creative"] [data-view-section="creative"] .creative-engine > .panel-header h2 {
  max-width: 780px !important;
  font-size: clamp(28px, 2.8vw, 38px) !important;
  line-height: 1.02 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head {
  padding: 11px 12px !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head strong {
  font-size: 15px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console .creative-gallery-head small {
  font-size: 10.5px !important;
  line-height: 1.2 !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr)) !important;
  grid-auto-rows: 444px !important;
  gap: 10px !important;
  padding-bottom: 190px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video {
  grid-template-rows: 228px 64px 26px 28px 78px !important;
  height: 444px !important;
  min-height: 444px !important;
  max-height: 444px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview {
  min-height: 228px !important;
  height: 228px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card h3 {
  min-height: 30px !important;
  max-height: 30px !important;
  font-size: 12px !important;
  line-height: 1.05 !important;
  -webkit-line-clamp: 2 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card p {
  min-height: 26px !important;
  max-height: 26px !important;
  font-size: 9.2px !important;
  line-height: 1.18 !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta {
  grid-template-columns: repeat(4, 26px) !important;
  min-height: 26px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-meta .media-meta-chip {
  width: 26px !important;
  height: 24px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer {
  min-height: 28px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card footer .creative-execution-chip {
  display: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  min-height: 76px !important;
  gap: 5px !important;
  padding-bottom: 0 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button {
  min-height: 28px !important;
  height: 28px !important;
  padding: 3px 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions .fit-review-action,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button.fit-review-action {
  grid-column: 1 / -1 !important;
  height: 28px !important;
  margin-top: 0 !important;
}

@media (max-width: 820px) {
  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"] {
    overflow-x: hidden !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console.chat-studio.chat-studio {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 10px !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console.chat-studio.chat-studio .creative-project-switcher {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console.chat-studio.chat-studio #media-library.creative-gallery {
    display: grid !important;
    grid-template-columns: none !important;
    grid-template-rows: repeat(2, 360px) !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(300px, calc(100vw - 84px)) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    max-height: 740px !important;
    gap: 12px !important;
    padding: 0 4px 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card.smart-creative-card {
    grid-template-rows: 176px 42px 24px 26px 72px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 360px !important;
    min-height: 360px !important;
    max-height: 360px !important;
    scroll-snap-align: start !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card.photo {
    grid-row: 1 !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card.video {
    grid-row: 2 !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card .media-preview {
    min-height: 176px !important;
    height: 176px !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card h3 {
    min-height: 26px !important;
    max-height: 26px !important;
    font-size: 11px !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card p {
    min-height: 22px !important;
    max-height: 22px !important;
    font-size: 8.6px !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card .creative-card-actions {
    min-height: 70px !important;
    gap: 4px !important;
  }

  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) #media-library .smart-creative-card .creative-card-actions button {
    min-height: 24px !important;
    height: 24px !important;
    padding: 2px 3px !important;
    font-size: 7.8px !important;
  }
}

/* Creative Studio lightbox: align media and detail panel without clipping. */
body.app-mode .media-lightbox-dialog {
  width: min(1500px, calc(100vw - 88px)) !important;
  max-height: calc(100dvh - 56px) !important;
  overflow: hidden !important;
}

body.app-mode .media-lightbox-modal {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  max-height: calc(100dvh - 56px) !important;
  overflow: hidden !important;
}

body.app-mode .media-lightbox-body {
  min-height: 0 !important;
  padding: 18px 24px 24px !important;
  overflow: hidden !important;
}

body.app-mode .media-detail-layout {
  display: grid !important;
  grid-template-columns: minmax(560px, 1fr) minmax(360px, 430px) !important;
  gap: 30px !important;
  align-items: stretch !important;
  height: min(760px, calc(100dvh - 154px)) !important;
  min-height: 0 !important;
}

body.app-mode .media-detail-hero,
body.app-mode .media-detail-panel {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
}

body.app-mode .media-detail-hero {
  overflow: hidden !important;
  padding: 16px !important;
}

body.app-mode .media-detail-hero img,
body.app-mode .media-detail-hero video,
body.app-mode .media-detail-hero object {
  box-sizing: border-box !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: min(700px, calc(100dvh - 250px)) !important;
  object-fit: contain !important;
  object-position: center center !important;
}

body.app-mode .media-processing-source-frame {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: min(700px, 100%) !important;
  max-width: 100% !important;
  height: min(700px, calc(100dvh - 250px)) !important;
  max-height: min(700px, calc(100dvh - 250px)) !important;
}

body.app-mode .media-processing-source-frame > img,
body.app-mode .media-processing-source-frame > object {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
}

body.app-mode .media-processing-source-status {
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 2 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 2px 12px !important;
  align-items: center !important;
  padding: 12px !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  background: rgba(255, 247, 237, 0.94) !important;
  box-shadow: 5px 5px 0 rgba(8, 9, 13, 0.5) !important;
  color: #08090d !important;
}

body.app-mode .media-processing-source-status .video-cooking-visual {
  grid-row: span 3 !important;
  width: 58px !important;
  height: 58px !important;
}

body.app-mode .media-processing-source-status span,
body.app-mode .media-processing-source-status strong,
body.app-mode .media-processing-source-status small {
  min-width: 0 !important;
}

body.app-mode .media-processing-source-status span {
  font: 950 10px/1 "Geist Mono", Menlo, monospace !important;
  text-transform: uppercase !important;
}

body.app-mode .media-processing-source-status strong {
  font-size: clamp(15px, 1.6vw, 22px) !important;
  line-height: 1.05 !important;
}

body.app-mode .media-processing-source-status small {
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

body.app-mode .media-lightbox-dialog.video .media-detail-hero video {
  aspect-ratio: 9 / 16 !important;
  width: auto !important;
  max-width: calc(100% - 32px) !important;
  height: min(696px, calc(100dvh - 220px)) !important;
  max-height: min(696px, calc(100dvh - 220px)) !important;
  background: #08090d !important;
}

body.app-mode .media-detail-panel {
  align-content: start !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 14px !important;
}

body.app-mode .media-detail-actions {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 2 !important;
  padding-top: 8px !important;
  background: #fff7ed !important;
}

body.app-mode .media-detail-actions button,
body.app-mode .media-detail-actions a {
  min-height: 38px !important;
}

@media (max-width: 1040px) {
  body.app-mode .media-detail-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    height: auto !important;
  }

  body.app-mode .media-detail-hero,
  body.app-mode .media-detail-panel {
    height: auto !important;
    max-height: none !important;
  }

  body.app-mode .media-detail-hero img,
  body.app-mode .media-detail-hero video,
  body.app-mode .media-detail-hero object {
    max-height: 64dvh !important;
  }

  body.app-mode .media-lightbox-dialog.video .media-detail-hero video {
    height: auto !important;
    max-height: 64dvh !important;
  }
}

/* Sidebar account actions: keep Admin and Logout as the final left-panel controls. */
body.app-mode > .app-shell > .sidebar {
  display: flex !important;
  flex-direction: column !important;
}

body.app-mode > .app-shell > .sidebar nav {
  flex: 1 1 auto !important;
}

body.app-mode > .app-shell > .sidebar .sidebar-bottom-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
  margin-top: auto !important;
  padding: 10px !important;
}

body.app-mode > .app-shell > .sidebar .sidebar-bottom-actions .admin-access-button {
  width: 100% !important;
  min-height: 36px !important;
  margin-top: 0 !important;
}

@media (max-width: 720px) {
  body.app-mode > .app-shell > .sidebar {
    display: grid !important;
  }

  body.app-mode > .app-shell > .sidebar .sidebar-bottom-actions {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-top: 0 !important;
  }
}

/* Shared Polxy prompt skin: keep every page prompt aligned with the dashboard dock. */
body.app-mode[data-active-view] [class*="-agent-dock"] {
  gap: 7px !important;
  padding: 8px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d, 0 18px 48px rgba(139, 92, 246, 0.16) !important;
}

body.app-mode[data-active-view] [class*="-agent-mode"],
body.app-mode[data-active-view] [class*="-agent-options"] {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view] [class*="-agent-mode"] {
  grid-area: modes !important;
}

body.app-mode[data-active-view] [class*="-agent-options"] {
  grid-area: options !important;
}

body.app-mode[data-active-view] [class*="-agent-mode"]::-webkit-scrollbar,
body.app-mode[data-active-view] [class*="-agent-options"]::-webkit-scrollbar {
  display: none;
}

body.app-mode[data-active-view] [class*="-agent-options"] span {
  flex: 0 0 auto;
  color: #3859ef !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view] [class*="-agent-mode"] button,
body.app-mode[data-active-view] [class*="-agent-options"] button,
body.app-mode[data-active-view] [class*="-agent-send"] {
  flex: 0 0 auto;
  min-height: 29px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view] [class*="-agent-mode"] button.active,
body.app-mode[data-active-view] [class*="-agent-send"],
body.app-mode[data-active-view] [class*="-agent-options"] button:hover {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
}

body.app-mode[data-active-view] [class*="-agent-dock"] textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 48px !important;
  max-height: 108px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 42%),
    #f8eedb !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view] [class*="-agent-send"] {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 67px !important;
  min-height: 94px !important;
  padding: 7px !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view] [class*="-agent-dock"].is-running {
  outline: 3px solid #8b5cf6 !important;
  outline-offset: 2px !important;
}

@media (min-width: 761px) {
  body.app-mode[data-active-view] [class*="-agent-dock"] {
    left: calc(264px + ((100vw - 264px - min(936px, calc(100vw - 264px - 28px))) / 2)) !important;
    bottom: 16px !important;
    grid-template-columns: max-content minmax(0, 1fr) 86px !important;
    grid-template-areas:
      "modes options send"
      "input input send" !important;
    width: min(936px, calc(100vw - 264px - 28px)) !important;
    height: 112px !important;
    max-width: calc(100vw - 264px - 28px) !important;
    margin: 0 !important;
  }

  body.app-mode.sidebar-collapsed[data-active-view] [class*="-agent-dock"] {
    left: calc(74px + ((100vw - 74px - min(936px, calc(100vw - 74px - 28px))) / 2)) !important;
    width: min(936px, calc(100vw - 74px - 28px)) !important;
    max-width: calc(100vw - 74px - 28px) !important;
  }
}

@media (max-width: 760px) {
  body.app-mode[data-active-view] [class*="-agent-dock"] {
    height: auto !important;
    min-height: 0 !important;
    padding: 8px !important;
  }

  body.app-mode[data-active-view] [class*="-agent-mode"] button,
  body.app-mode[data-active-view] [class*="-agent-options"] button {
    min-height: 29px !important;
    padding: 5px 8px !important;
    font-size: 9px !important;
  }

  body.app-mode[data-active-view] [class*="-agent-dock"] textarea {
    min-height: 62px !important;
    font-size: 12.5px !important;
  }

  body.app-mode[data-active-view] [class*="-agent-send"] {
    min-width: 58px !important;
    min-height: 62px !important;
    font-size: 10px !important;
  }
}

/* Creative Studio uses its own composer, so mirror the shared prompt dock treatment here. */
body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .ploxy-chat-panel {
  position: fixed !important;
  left: calc(264px + ((100vw - 264px - min(936px, calc(100vw - 264px - 28px))) / 2)) !important;
  right: auto !important;
  bottom: 16px !important;
  z-index: 80 !important;
  width: min(936px, calc(100vw - 264px - 28px)) !important;
  height: 112px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.app-mode.sidebar-collapsed[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .ploxy-chat-panel {
  left: calc(74px + ((100vw - 74px - min(936px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(936px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .ploxy-chat-form {
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "rail options actions"
    "input input actions" !important;
  gap: 7px !important;
  width: 100% !important;
  height: 112px !important;
  min-height: 112px !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d, 0 18px 48px rgba(139, 92, 246, 0.16) !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-asset-rail,
body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-brief-options {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-asset-rail {
  grid-area: rail !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-brief-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-asset-rail::-webkit-scrollbar,
body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-brief-options::-webkit-scrollbar {
  display: none;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-brief-options span {
  flex: 0 0 auto;
  color: #3859ef !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-asset-rail button,
body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-brief-options button {
  flex: 0 0 auto;
  min-height: 29px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-asset-rail button.active,
body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .composer-brief-options button:hover {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .ploxy-chat-form textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 48px !important;
  max-height: 108px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 42%),
    #f8eedb !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .chat-composer-actions {
  grid-area: actions !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: stretch !important;
  gap: 7px !important;
  min-width: 86px !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .cost-mode-trigger,
body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .send-icon-button {
  width: 100% !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  color: #08090d !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .cost-mode-trigger {
  min-height: 29px !important;
  padding: 5px 7px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  font-size: 9px !important;
}

body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console .send-icon-button {
  min-height: 58px !important;
  padding: 7px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
  font-size: 11px !important;
}

/* Unified compact typography pass across app pages. */
body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section],
body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(h1, h2, h3, h4, h5, p, span, small, strong, label, button, input, textarea, select, th, td, summary, li) {
  font-family: Geist, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(code, pre, kbd) {
  font-family: "Geist Mono", Menlo, monospace !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header {
  display: flex !important;
  min-height: 0 !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  padding: 10px 12px !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header > * {
  min-width: 0 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header > :first-child {
  flex: 1 1 auto !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header > :not(:first-child) {
  flex: 0 0 auto !important;
  max-width: 42% !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header :where(h1, h2),
body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] > .panel > .panel-header :where(h1, h2),
body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] > .full-panel > .panel-header :where(h1, h2) {
  display: block !important;
  max-width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: inherit;
  font-size: 18px !important;
  font-weight: 950 !important;
  line-height: 1.08 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header :where(p, small) {
  max-width: 66ch !important;
  margin: 2px 0 0 !important;
  font-size: 10.5px !important;
  line-height: 1.25 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .panel-header :where(.eyebrow, .badge, .pill, .status-pill, .secondary-action, .primary-action) {
  max-width: 100% !important;
  overflow: hidden !important;
  font-size: 9.5px !important;
  line-height: 1.05 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .section-title {
  gap: 4px !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] .section-title :where(h2, h3),
body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(.module-surface-card, .roadmap-card, .settings-section, .module-work-grid article, .geo-fix-draft-panel) :where(h2, h3) {
  margin: 0 !important;
  font-size: 13.5px !important;
  font-weight: 950 !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(h4, h5, .module-rule-item strong, .module-list-stack strong, .provider-output strong) {
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(p, li, label, th, td, summary, .panel-note, .provider-output, .module-rule-item, .module-list-stack, .empty-state p) {
  font-size: 11.5px !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(small, .eyebrow, .metric-label, .card-label, .meta, .hint, .badge, .pill, .status-pill) {
  font-size: 9.75px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(.metric-card, .status-grid, .security-status-grid, .module-kpi-grid, .module-overview-board, .performance-metrics, .campaign-summary, .billing-grid, .project-switcher, [class*="-status-grid"], [class*="-kpi-grid"], [class*="score"], [class*="stat"], [class*="cost"]) strong {
  font-size: 17px !important;
  font-weight: 950 !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(.hero-score, .creative-score, .readiness-score, .health-score) strong {
  font-size: 19px !important;
  line-height: 1.05 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view] [data-view-section] :where(input, textarea, select) {
  font-size: 12px !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view][data-active-view] [data-view-section][data-view-section] .panel-header :where(h1, h2) {
  font-size: 18px !important;
  line-height: 1.08 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view][data-active-view] [data-view-section][data-view-section] .section-title :where(h2, h3),
body.app-mode[data-active-view][data-active-view][data-active-view][data-active-view] [data-view-section][data-view-section] :where([class*="card"], [class*="panel"], [class*="item"]) :where(h2, h3) {
  font-size: 13.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view][data-active-view] [data-view-section][data-view-section] :where(p, li, label, th, td, summary, .panel-note, .provider-output, .module-rule-item, .module-list-stack, .empty-state p, [class*="card"] p, [class*="panel"] p, [class*="item"] p, [class*="row"] p) {
  font-size: 11.5px !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view][data-active-view][data-active-view][data-active-view] [data-view-section][data-view-section] :where(small, .eyebrow, .metric-label, .card-label, .meta, .hint, .badge, .pill, .status-pill, [class*="label"]) {
  font-size: 9.75px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="creative"][data-active-view="creative"][data-active-view="creative"] [data-view-section="creative"] #media-library .smart-creative-card h3 {
  font-size: 13.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="creative"][data-active-view="creative"][data-active-view="creative"] [data-view-section="creative"] #media-library .smart-creative-card p {
  font-size: 11.5px !important;
  line-height: 1.32 !important;
}

body.app-mode[data-active-view="creative"][data-active-view="creative"][data-active-view="creative"] [data-view-section="creative"] #media-library .smart-creative-card :where(.media-meta span, footer small, footer .badge, .creative-execution-chip) {
  font-size: 9.75px !important;
  line-height: 1.18 !important;
}

/* Reach + GEO quiet UI pass: compact operational panels with calmer section color. */
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page {
  --quiet-ink: #13252f;
  --quiet-muted: rgba(19, 37, 47, 0.66);
  --quiet-line: rgba(19, 37, 47, 0.14);
  --quiet-card: #fffdf8;
  --quiet-surface: #fffaf0;
  --quiet-cyan: #67d5e8;
  --quiet-lime: #dfff3f;
  --quiet-purple: #8b5cf6;
  --quiet-sky-card: #f3fbfd;
  --quiet-lime-card: #f8ffe8;
  --quiet-purple-card: #f7f2ff;
  --quiet-warm-card: #fff7ea;
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid var(--quiet-line) !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.12), transparent 34%),
    linear-gradient(315deg, rgba(223, 255, 63, 0.10), transparent 46%),
    var(--quiet-surface) !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module > .panel-header,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page > .panel-header {
  min-height: 46px !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 11px !important;
  border: 1px solid var(--quiet-line) !important;
  border-left: 4px solid var(--quiet-cyan) !important;
  border-radius: 8px !important;
  background: var(--quiet-card) !important;
  color: var(--quiet-ink) !important;
  box-shadow: 0 8px 18px rgba(19, 37, 47, 0.08) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module > .panel-header h2,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page > .panel-header h2 {
  max-width: 100% !important;
  color: var(--quiet-ink) !important;
  font-size: 16.5px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module > .panel-header .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page > .panel-header .eyebrow {
  color: rgba(19, 37, 47, 0.58) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-module-status,
body.app-mode[data-active-view="geo"][data-active-view="geo"] #geo-module-status,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module .badge,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page .badge {
  min-height: 24px !important;
  padding: 5px 8px !important;
  border: 1px solid rgba(19, 37, 47, 0.18) !important;
  border-radius: 999px !important;
  background: rgba(223, 255, 63, 0.64) !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
  font-size: 8.75px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-command-hero {
  gap: 10px !important;
  margin: 0 !important;
  padding: 11px !important;
  overflow: hidden !important;
  border: 1px solid var(--quiet-line) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.18), transparent 42%),
    var(--quiet-card) !important;
  color: var(--quiet-ink) !important;
  box-shadow: 0 8px 18px rgba(19, 37, 47, 0.07) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-command-hero {
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-command-hero::before {
  height: 4px !important;
  background: linear-gradient(90deg, var(--quiet-cyan), var(--quiet-lime), var(--quiet-purple)) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip strong,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-command-hero strong {
  max-width: 72ch !important;
  margin: 2px 0 4px !important;
  color: var(--quiet-ink) !important;
  font-size: 14.5px !important;
  line-height: 1.16 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip p,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-command-hero p {
  max-width: 82ch !important;
  margin: 0 !important;
  color: var(--quiet-muted) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip .primary-action,
body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-create-default,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-audit-controls .primary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-audit-controls .secondary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip button,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-actions button,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console button,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-actions button {
  min-height: 32px !important;
  height: auto !important;
  padding: 6px 10px !important;
  border: 1px solid rgba(19, 37, 47, 0.20) !important;
  border-radius: 7px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.32), rgba(223, 255, 63, 0.38)),
    #f7fbfd !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
  font-size: 9.5px !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-audit-controls {
  gap: 7px !important;
  align-content: center !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-url-bar,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console {
  border: 1px solid var(--quiet-line) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-url-bar label,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console label {
  color: rgba(19, 37, 47, 0.68) !important;
  font-size: 9.25px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-url-bar input,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-audit-controls select,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console input,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console select,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console textarea {
  min-height: 32px !important;
  padding: 6px 8px !important;
  border: 1px solid rgba(19, 37, 47, 0.18) !important;
  border-radius: 7px !important;
  background: #fffdf8 !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
  font-size: 11px !important;
  line-height: 1.24 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-console textarea {
  min-height: 54px !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-workbench-grid .geo-summary-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-panel,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-empty,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-pipeline-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-work-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-review-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-source-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-panel .module-rule-item {
  border: 1px solid var(--quiet-line) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(180deg, rgba(103, 213, 232, 0.16) 0 3px, transparent 3px),
    var(--quiet-card) !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article:nth-child(2),
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 2) {
  background:
    linear-gradient(180deg, rgba(223, 255, 63, 0.22) 0 3px, transparent 3px),
    var(--quiet-lime-card) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-workbench-grid .geo-summary-card:nth-child(3),
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 3) {
  background:
    linear-gradient(180deg, rgba(139, 92, 246, 0.18) 0 3px, transparent 3px),
    var(--quiet-purple-card) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-workbench-grid .geo-summary-card:nth-child(2),
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n) {
  background:
    linear-gradient(180deg, rgba(255, 180, 84, 0.18) 0 3px, transparent 3px),
    var(--quiet-warm-card) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid strong,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid strong,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip strong {
  color: var(--quiet-ink) !important;
  font-size: 15.5px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid small,
body.app-mode[data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid small,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip span,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip small {
  color: rgba(19, 37, 47, 0.58) !important;
  font-size: 8.75px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article {
  min-height: 90px !important;
  padding: 9px !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-summary-card {
  min-height: 188px !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] #geo-output {
  border: 1px solid var(--quiet-line) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 38%),
    #f7fbfd !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page .module-list-stack .module-work-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page .module-rule-stack .module-rule-item,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-item {
  border: 1px solid rgba(19, 37, 47, 0.12) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.74) !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page .module-list-stack .module-work-item span,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-item > span {
  border: 1px solid rgba(19, 37, 47, 0.14) !important;
  background: rgba(103, 213, 232, 0.28) !important;
  color: var(--quiet-ink) !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-engine-page :where(.module-work-item strong, .module-rule-item strong, .module-work-item small, .module-rule-item small, .module-work-item b),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-panel .section-title :where(.eyebrow, h3),
body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-card :where(strong, small),
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-panel :where(h3, strong, small, p),
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-message-item :where(strong, small, b) {
  color: var(--quiet-ink) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-card pre {
  border: 1px solid rgba(19, 37, 47, 0.14) !important;
  background: #f3f7f8 !important;
  color: #13252f !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-review-card h3 {
  font-size: 14px !important;
  line-height: 1.14 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-work-grid .section-title h3 {
  font-size: 13.5px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-dock {
  height: 112px !important;
  grid-template-columns: max-content minmax(0, 1fr) 78px !important;
  gap: 7px !important;
  padding: 8px !important;
  border: 2px solid rgba(19, 37, 47, 0.22) !important;
  background:
    linear-gradient(90deg, #67d5e8 0 28%, #dfff3f 28% 56%, #8b5cf6 56% 72%, transparent 72%) top / 100% 4px no-repeat,
    var(--quiet-card) !important;
  box-shadow: 0 18px 42px rgba(19, 37, 47, 0.14) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-mode button,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-options button,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-send {
  min-height: 28px !important;
  padding: 5px 8px !important;
  border: 1px solid rgba(19, 37, 47, 0.18) !important;
  background: #fffdf8 !important;
  box-shadow: none !important;
  font-size: 9px !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-mode button.active,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-options button:hover {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.28), rgba(223, 255, 63, 0.42)),
    #f8ffe8 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-dock textarea {
  min-height: 48px !important;
  padding: 9px !important;
  border: 1px solid rgba(19, 37, 47, 0.18) !important;
  background: #fffaf0 !important;
  box-shadow: none !important;
  font-size: 12px !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"] .reach-agent-send {
  min-width: 64px !important;
  min-height: 92px !important;
  font-size: 10px !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"][data-view-section="reach"] .reach-module > .panel-header h2,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"][data-view-section="geo"] .geo-engine-page > .panel-header h2 {
  font-size: 16.5px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-create-default,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .primary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .secondary-action {
  align-self: center !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-height: 32px !important;
  height: 32px !important;
  max-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-create-default {
  justify-self: end !important;
  width: min(100%, 150px) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console button {
  grid-row: auto !important;
  align-self: end !important;
  min-height: 32px !important;
  height: 32px !important;
  max-height: 32px !important;
}

/* Reach + GEO readability pass: dim surfaces without returning to heavy dark cards. */
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-engine-page {
  --quiet-ink: #0b2028;
  --quiet-muted: #334d56;
  --quiet-line: rgba(11, 32, 40, 0.23);
  --quiet-card: #e7eeed;
  --quiet-surface: #d8e4e6;
  --quiet-field: #f0f3ee;
  --quiet-sky-card: #deebed;
  --quiet-lime-card: #e5edd6;
  --quiet-purple-card: #e6e2ee;
  --quiet-warm-card: #ebe2d6;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.18), transparent 34%),
    linear-gradient(315deg, rgba(139, 92, 246, 0.10), transparent 48%),
    var(--quiet-surface) !important;
  color: var(--quiet-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module > .panel-header,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-engine-page > .panel-header,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-command-hero {
  border-color: var(--quiet-line) !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.18), transparent 44%),
    var(--quiet-card) !important;
  color: var(--quiet-ink) !important;
  box-shadow: 0 8px 18px rgba(11, 32, 40, 0.10) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module > .panel-header .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-engine-page > .panel-header .eyebrow,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid small,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid small,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip span,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip small {
  color: var(--quiet-muted) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip p,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-command-hero p,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-url-bar label,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-console label {
  color: var(--quiet-muted) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-module-status,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] #geo-module-status,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module .badge,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-engine-page .badge {
  border-color: rgba(11, 32, 40, 0.22) !important;
  background: #d7e8bd !important;
  color: var(--quiet-ink) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-url-bar,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-console {
  border-color: var(--quiet-line) !important;
  background: rgba(231, 238, 237, 0.82) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-url-bar input,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-audit-controls select,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-console input,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-console select,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-console textarea,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock textarea {
  border-color: rgba(11, 32, 40, 0.24) !important;
  background: var(--quiet-field) !important;
  color: var(--quiet-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-workbench-grid .geo-summary-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-panel,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-empty,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-pipeline-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-work-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-review-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-source-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-panel .module-rule-item {
  border-color: var(--quiet-line) !important;
  background:
    linear-gradient(180deg, rgba(103, 213, 232, 0.22) 0 3px, transparent 3px),
    var(--quiet-card) !important;
  color: var(--quiet-ink) !important;
  box-shadow: 0 5px 14px rgba(11, 32, 40, 0.07) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article:nth-child(2),
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 2) {
  background:
    linear-gradient(180deg, rgba(223, 255, 63, 0.24) 0 3px, transparent 3px),
    var(--quiet-lime-card) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-workbench-grid .geo-summary-card:nth-child(3),
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n + 3) {
  background:
    linear-gradient(180deg, rgba(139, 92, 246, 0.20) 0 3px, transparent 3px),
    var(--quiet-purple-card) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-workbench-grid .geo-summary-card:nth-child(2),
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-adaptation-grid article:nth-child(4n) {
  background:
    linear-gradient(180deg, rgba(255, 180, 84, 0.22) 0 3px, transparent 3px),
    var(--quiet-warm-card) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] #geo-output,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-engine-page .module-list-stack .module-work-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-engine-page .module-rule-stack .module-rule-item,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-item {
  border-color: rgba(11, 32, 40, 0.18) !important;
  background: #dfe9eb !important;
  color: var(--quiet-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-module .module-hero-strip .primary-action,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] #reach-create-default,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-audit-controls .primary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-audit-controls .secondary-action,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-message-console button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-proof-strip button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-fix-draft-actions button {
  border-color: rgba(11, 32, 40, 0.26) !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.22), rgba(223, 255, 63, 0.20)),
    #d9e6e8 !important;
  color: var(--quiet-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock {
  border-color: rgba(11, 32, 40, 0.26) !important;
  background:
    linear-gradient(90deg, #67d5e8 0 28%, #dfff3f 28% 56%, #8b5cf6 56% 72%, transparent 72%) top / 100% 4px no-repeat,
    #e1e9e8 !important;
  box-shadow: 0 18px 42px rgba(11, 32, 40, 0.18) !important;
}

/* Reach + GEO module consistency pass: match the main Polxy module page language. */
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page {
  --module-ink: #08090d;
  --module-muted: rgba(8, 9, 13, 0.68);
  --module-soft-muted: rgba(8, 9, 13, 0.56);
  --module-panel: #f3ebdf;
  --module-card: #fff7ed;
  --module-field: #fffaf0;
  --module-cyan: #67d5e8;
  --module-lime: #dfff3f;
  --module-purple: #b9a7ff;
  --module-orange: #ffb84d;
  gap: 10px !important;
  padding: 12px !important;
  border: 2px solid var(--module-ink) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.16), transparent 34%),
    linear-gradient(315deg, rgba(255, 184, 77, 0.14), transparent 48%),
    var(--module-panel) !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module > .panel-header,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page > .panel-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  min-height: 44px !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 9px 11px !important;
  overflow: hidden !important;
  border: 2px solid var(--module-ink) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.34) 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(239, 251, 255, 0.78)),
    var(--module-card) !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module > .panel-header > div,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page > .panel-header > div {
  min-width: 0 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module > .panel-header h2,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page > .panel-header h2 {
  max-width: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: var(--module-ink) !important;
  font-size: 16px !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-module-status,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] #geo-module-status,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module .badge,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page .badge {
  flex: 0 0 auto !important;
  min-height: 24px !important;
  padding: 5px 8px !important;
  border: 2px solid var(--module-ink) !important;
  border-radius: 7px !important;
  background: var(--module-lime) !important;
  color: var(--module-ink) !important;
  box-shadow: 2px 2px 0 var(--module-ink) !important;
  font-size: 8.75px !important;
  line-height: 1 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module .module-hero-strip,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-command-hero {
  gap: 10px !important;
  margin: 0 !important;
  padding: 11px 12px !important;
  overflow: hidden !important;
  border: 2px solid var(--module-ink) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.36) 0 7px, transparent 7px),
    linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(255, 247, 237, 0.88)),
    var(--module-card) !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-command-hero {
  grid-template-columns: minmax(0, 1.12fr) minmax(250px, 0.88fr) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-command-hero::before {
  height: 0 !important;
  background: transparent !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module .module-hero-strip strong,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-command-hero strong {
  max-width: 72ch !important;
  margin: 2px 0 4px !important;
  color: var(--module-ink) !important;
  font-size: 14px !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module .module-hero-strip p,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-command-hero p,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-url-bar label,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console label {
  color: var(--module-muted) !important;
  font-size: 10.5px !important;
  line-height: 1.28 !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-url-bar,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console {
  border: 2px solid var(--module-ink) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.68), rgba(255, 250, 240, 0.88)),
    var(--module-field) !important;
  color: var(--module-ink) !important;
  box-shadow: 2px 2px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-url-bar input,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls select,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console input,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console select,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console textarea {
  min-height: 32px !important;
  padding: 6px 8px !important;
  border: 2px solid var(--module-ink) !important;
  border-radius: 7px !important;
  background: var(--module-field) !important;
  color: var(--module-ink) !important;
  box-shadow: 2px 2px 0 var(--module-ink) !important;
  font-size: 11px !important;
  line-height: 1.22 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-create-default,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .primary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .secondary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-actions button {
  min-height: 32px !important;
  height: 32px !important;
  max-height: 32px !important;
  padding: 6px 10px !important;
  border: 2px solid var(--module-ink) !important;
  border-radius: 7px !important;
  background: var(--module-lime) !important;
  color: var(--module-ink) !important;
  box-shadow: 2px 2px 0 var(--module-ink) !important;
  font-size: 9.5px !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .secondary-action,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console button {
  background: var(--module-cyan) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip {
  gap: 8px !important;
  margin: 0 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-workbench-grid .geo-summary-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-panel,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-empty,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-pipeline-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-work-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-review-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-source-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-adaptation-grid article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-panel .module-rule-item {
  border: 2px solid var(--module-ink) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.34) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.94) !important;
  color: var(--module-ink) !important;
  box-shadow: 2px 2px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid article:nth-child(2),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip article:nth-child(2) {
  background:
    linear-gradient(90deg, rgba(223, 255, 63, 0.48) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.94) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid article:nth-child(3),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip article:nth-child(3) {
  background:
    linear-gradient(90deg, rgba(185, 167, 255, 0.42) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.94) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid article:nth-child(4),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip article:nth-child(4) {
  background:
    linear-gradient(90deg, rgba(255, 184, 77, 0.44) 0 6px, transparent 6px),
    rgba(255, 250, 240, 0.94) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid strong,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid strong,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip strong {
  color: var(--module-ink) !important;
  font-size: 15px !important;
  line-height: 1.08 !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid small,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid small,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid .eyebrow,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip span,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip small,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .module-rule-item small,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .module-rule-item small,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .module-work-item small {
  color: var(--module-soft-muted) !important;
  font-size: 9.25px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] #geo-output,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page .module-list-stack .module-work-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page .module-rule-stack .module-rule-item,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-card pre {
  border: 2px solid var(--module-ink) !important;
  border-radius: 8px !important;
  background: var(--module-field) !important;
  color: var(--module-ink) !important;
  box-shadow: 2px 2px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock {
  border: 3px solid var(--module-ink) !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    var(--module-card) !important;
  box-shadow: 3px 3px 0 var(--module-ink), 0 18px 48px rgba(139, 92, 246, 0.16) !important;
}

/* Reach + GEO theme lock: use the same core Polxy colors as the rest of the app. */
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"],
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] {
  background: transparent !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page {
  --module-ink: #08090d;
  --module-muted: rgba(8, 9, 13, 0.68);
  --module-soft-muted: rgba(8, 9, 13, 0.56);
  --module-panel: #fff7ed;
  --module-card: #fff7ed;
  --module-field: #fffaf0;
  --module-cyan: #22d3ee;
  --module-lime: #d5ff00;
  --module-purple: #a78bfa;
  --module-orange: #ff9f1c;
  border-color: var(--module-ink) !important;
  background: linear-gradient(135deg, #fff7ed, #f7dfc5) !important;
  color: var(--module-ink) !important;
  box-shadow: 5px 5px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module > .panel-header,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page > .panel-header,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module .module-hero-strip,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-command-hero,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-url-bar,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls label,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip article,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-workbench-grid .geo-summary-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-panel,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-card,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-empty,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-pipeline-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-work-grid > article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-review-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-source-card,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-adaptation-grid article,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-panel .module-rule-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] #geo-output,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page .module-list-stack .module-work-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page .module-rule-stack .module-rule-item,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-item,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-card pre {
  border-color: var(--module-ink) !important;
  background: linear-gradient(135deg, #fff7ed, #f7dfc5) !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-module-status,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] #geo-module-status,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-module .badge,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-engine-page .badge,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-create-default,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .primary-action {
  border-color: var(--module-ink) !important;
  background: #d5ff00 !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls .secondary-action,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-fix-draft-actions button {
  border-color: var(--module-ink) !important;
  background: #f7dfc5 !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-url-bar input,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-audit-controls select,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console input,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console select,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-message-console textarea {
  border-color: var(--module-ink) !important;
  background: #fffaf0 !important;
  color: var(--module-ink) !important;
  box-shadow: 3px 3px 0 var(--module-ink) !important;
}

body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] #reach-kpi-grid article:nth-child(n),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-kpi-grid article:nth-child(n),
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-proof-strip article:nth-child(n) {
  background: linear-gradient(135deg, #fff7ed, #f7dfc5) !important;
}

/* GEO + Reach prompt docks: restore both prompts with the shared compact Polxy composer skin. */
.geo-agent-dock {
  display: none;
}

body.app-mode[data-active-view="geo"] > .app-shell > main,
body.app-mode[data-active-view="reach"] > .app-shell > main {
  padding-bottom: 176px !important;
}

body.app-mode[data-active-view="geo"] [data-view-section="geo"],
body.app-mode[data-active-view="reach"] [data-view-section="reach"] {
  padding-bottom: 146px !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-dock,
body.app-mode[data-active-view="reach"] .reach-agent-dock {
  position: fixed !important;
  right: auto !important;
  bottom: 16px !important;
  z-index: 96 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 7px !important;
  width: min(936px, calc(100vw - 264px - 28px)) !important;
  height: 112px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d, 0 18px 48px rgba(139, 92, 246, 0.16) !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-dock,
body.app-mode[data-active-view="reach"] .reach-agent-dock {
  left: calc(264px + ((100vw - 264px - min(936px, calc(100vw - 264px - 28px))) / 2)) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="geo"] .geo-agent-dock,
body.app-mode.sidebar-collapsed[data-active-view="reach"] .reach-agent-dock {
  left: calc(74px + ((100vw - 74px - min(936px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(936px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-mode,
body.app-mode[data-active-view="geo"] .geo-agent-options,
body.app-mode[data-active-view="reach"] .reach-agent-mode,
body.app-mode[data-active-view="reach"] .reach-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="geo"] .geo-agent-mode,
body.app-mode[data-active-view="reach"] .reach-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-options,
body.app-mode[data-active-view="reach"] .reach-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-options span,
body.app-mode[data-active-view="reach"] .reach-agent-options span {
  flex: 0 0 auto !important;
  color: #3859ef !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-mode button,
body.app-mode[data-active-view="geo"] .geo-agent-options button,
body.app-mode[data-active-view="geo"] .geo-agent-send,
body.app-mode[data-active-view="reach"] .reach-agent-mode button,
body.app-mode[data-active-view="reach"] .reach-agent-options button,
body.app-mode[data-active-view="reach"] .reach-agent-send {
  flex: 0 0 auto !important;
  min-height: 29px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-mode button.active,
body.app-mode[data-active-view="geo"] .geo-agent-send,
body.app-mode[data-active-view="geo"] .geo-agent-options button:hover,
body.app-mode[data-active-view="reach"] .reach-agent-mode button.active,
body.app-mode[data-active-view="reach"] .reach-agent-send,
body.app-mode[data-active-view="reach"] .reach-agent-options button:hover {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-dock textarea,
body.app-mode[data-active-view="reach"] .reach-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 48px !important;
  max-height: 108px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 42%),
    #f8eedb !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-send,
body.app-mode[data-active-view="reach"] .reach-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 67px !important;
  min-height: 94px !important;
  padding: 7px !important;
  font-size: 11px !important;
}

body.app-mode[data-active-view="geo"] .geo-agent-dock.is-running,
body.app-mode[data-active-view="reach"] .reach-agent-dock.is-running {
  outline: 3px solid #8b5cf6 !important;
  outline-offset: 2px !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="geo"] > .app-shell > main,
  body.app-mode[data-active-view="reach"] > .app-shell > main {
    padding-bottom: 206px !important;
  }

  body.app-mode[data-active-view="geo"] [data-view-section="geo"],
  body.app-mode[data-active-view="reach"] [data-view-section="reach"] {
    padding-bottom: 188px !important;
  }

  body.app-mode[data-active-view="geo"] .geo-agent-dock,
  body.app-mode[data-active-view="reach"] .reach-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    grid-template-columns: minmax(0, 1fr) 58px !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    min-height: 0 !important;
  }

  body.app-mode[data-active-view="geo"] .geo-agent-dock textarea,
  body.app-mode[data-active-view="reach"] .reach-agent-dock textarea {
    min-height: 68px !important;
    max-height: 88px !important;
    font-size: 12.5px !important;
  }

  body.app-mode[data-active-view="geo"] .geo-agent-send,
  body.app-mode[data-active-view="reach"] .reach-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
    font-size: 10px !important;
  }
}

/* Final prompt specificity lock for Reach/GEO; older page theme locks repeat attributes. */
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-dock,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock {
  position: fixed !important;
  right: auto !important;
  bottom: 16px !important;
  z-index: 96 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 7px !important;
  width: min(936px, calc(100vw - 264px - 28px)) !important;
  height: 112px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d, 0 18px 48px rgba(139, 92, 246, 0.16) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-dock,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock {
  left: calc(264px + ((100vw - 264px - min(936px, calc(100vw - 264px - 28px))) / 2)) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-dock,
body.app-mode.sidebar-collapsed[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock {
  left: calc(74px + ((100vw - 74px - min(936px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(936px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-mode,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-options,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-mode,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-mode,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-options,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-options span,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-options span {
  flex: 0 0 auto !important;
  color: #3859ef !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-mode button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-options button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-mode button,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-options button,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-send {
  flex: 0 0 auto !important;
  min-height: 29px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-mode button.active,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-send,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-options button:hover,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-mode button.active,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-options button:hover {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-dock textarea,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 48px !important;
  max-height: 108px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 42%),
    #f8eedb !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 67px !important;
  min-height: 94px !important;
  padding: 7px !important;
  font-size: 11px !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-dock,
  body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    grid-template-columns: minmax(0, 1fr) 58px !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    min-height: 0 !important;
  }

  body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-dock textarea,
  body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-dock textarea {
    min-height: 68px !important;
    max-height: 88px !important;
    font-size: 12.5px !important;
  }

  body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] [data-view-section="geo"] .geo-agent-send,
  body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] [data-view-section="reach"] .reach-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
    font-size: 10px !important;
  }
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-dock,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock {
  position: fixed !important;
  right: auto !important;
  bottom: 16px !important;
  z-index: 96 !important;
  display: grid !important;
  grid-template-columns: max-content minmax(0, 1fr) 86px !important;
  grid-template-areas:
    "modes options send"
    "input input send" !important;
  gap: 7px !important;
  width: min(936px, calc(100vw - 264px - 28px)) !important;
  height: 112px !important;
  max-width: calc(100vw - 264px - 28px) !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 3px solid #08090d !important;
  border-radius: 9px !important;
  background:
    linear-gradient(90deg, #8b5cf6 0 24%, #67d5e8 24% 50%, #dfff3f 50% 76%, #3859ef 76% 100%) top / 100% 7px no-repeat,
    linear-gradient(135deg, rgba(139, 92, 246, 0.16), rgba(103, 213, 232, 0.13) 46%, rgba(223, 255, 63, 0.13)),
    #fff7ed !important;
  color: #08090d !important;
  box-shadow: 3px 3px 0 #08090d, 0 18px 48px rgba(139, 92, 246, 0.16) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-dock,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock {
  left: calc(264px + ((100vw - 264px - min(936px, calc(100vw - 264px - 28px))) / 2)) !important;
}

body.app-mode.sidebar-collapsed[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-dock,
body.app-mode.sidebar-collapsed[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock {
  left: calc(74px + ((100vw - 74px - min(936px, calc(100vw - 74px - 28px))) / 2)) !important;
  width: min(936px, calc(100vw - 74px - 28px)) !important;
  max-width: calc(100vw - 74px - 28px) !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-mode,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-options,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-mode,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-options {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-mode,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-mode {
  grid-area: modes !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-options,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-options {
  grid-area: options !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-options span,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-options span {
  flex: 0 0 auto !important;
  color: #3859ef !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-mode button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-options button,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-mode button,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-options button,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-send {
  flex: 0 0 auto !important;
  min-height: 29px !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 5px 9px !important;
  background: rgba(255, 247, 237, 0.92) !important;
  color: #08090d !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: 0 !important;
  line-height: 1.05 !important;
  text-transform: none !important;
  box-shadow: 2px 2px 0 #08090d !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-mode button.active,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-send,
body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-options button:hover,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-mode button.active,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-options button:hover {
  background:
    linear-gradient(135deg, rgba(103, 213, 232, 0.42), rgba(223, 255, 63, 0.58)),
    #dfff3f !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-dock textarea,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock textarea {
  grid-area: input !important;
  width: 100% !important;
  min-height: 48px !important;
  max-height: 108px !important;
  resize: vertical !important;
  border: 2px solid #08090d !important;
  border-radius: 7px !important;
  padding: 10px !important;
  background:
    linear-gradient(90deg, rgba(103, 213, 232, 0.16), transparent 42%),
    #f8eedb !important;
  color: #08090d !important;
  font-size: 12.5px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none !important;
}

body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-send,
body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-send {
  grid-area: send !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 67px !important;
  min-height: 94px !important;
  padding: 7px !important;
  font-size: 11px !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-dock,
  body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock {
    left: 12px !important;
    right: 12px !important;
    bottom: 10px !important;
    grid-template-columns: minmax(0, 1fr) 58px !important;
    grid-template-areas:
      "modes modes"
      "options options"
      "input send" !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    min-height: 0 !important;
  }

  body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-dock textarea,
  body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-dock textarea {
    min-height: 68px !important;
    max-height: 88px !important;
    font-size: 12.5px !important;
  }

  body.app-mode[data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"][data-active-view="geo"] .geo-agent-send,
  body.app-mode[data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"][data-active-view="reach"] .reach-agent-send {
    min-width: 58px !important;
    min-height: 68px !important;
    font-size: 10px !important;
  }
}

/* Final Creative Studio AI Influencer tab override. Keep this after page polish rules. */
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "gallery" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-gallery-head,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .ploxy-chat-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-preview-stage,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .social-production-lab,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-dna-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-actions,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-tool-strip,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .manual-studio-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-mode-switch,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .connected-channel-strip {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] .creative-agent-console .presenter-studio-lab {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter"] #media-library.creative-gallery {
  display: grid !important;
  grid-area: gallery !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "presenter" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-gallery-head,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] #media-library.creative-gallery,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .ploxy-chat-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-preview-stage,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .social-production-lab,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-dna-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-actions,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-tool-strip,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .manual-studio-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-mode-switch,
body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .connected-channel-strip {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="presenter-setup"] .creative-agent-console .presenter-studio-lab {
  display: grid !important;
  grid-area: presenter !important;
}

/* EOF authority: AI Influencer cards stay tidy after all generic card rules. */
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card.video {
  grid-template-rows: 176px 68px 34px 104px !important;
  height: 430px !important;
  min-height: 430px !important;
  max-height: 430px !important;
  gap: 8px !important;
  padding: 8px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .media-preview {
  height: 176px !important;
  min-height: 176px !important;
  padding: 0 !important;
  border: 3px solid #08090d !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-receipt-preview {
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 14px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-art {
  width: 104px !important;
  height: 104px !important;
  min-height: 0 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-avatar {
  width: 66px !important;
  height: 66px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy {
  display: grid !important;
  gap: 5px !important;
  align-content: center !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy span,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy strong {
  position: static !important;
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  text-transform: none !important;
  box-shadow: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy b {
  font-size: 18px !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-card-copy small {
  display: -webkit-box !important;
  font-size: 10px !important;
  line-height: 1.15 !important;
  overflow: hidden !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-play {
  right: 8px !important;
  bottom: 8px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 4px 8px !important;
  font-size: 9px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card h3 {
  max-height: 36px !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.12 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card p {
  max-height: 28px !important;
  margin: 0 !important;
  font-size: 10.5px !important;
  line-height: 1.18 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  min-height: 30px !important;
  padding: 0 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row .media-meta-chip {
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 24px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .badge,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > small,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  min-height: 24px !important;
  max-width: 76px !important;
  padding: 3px 6px !important;
  font-size: 8.5px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .ai-influencer-meta-row > .creative-execution-chip {
  flex: 1 1 66px !important;
  max-width: none !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions {
  align-self: start !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 28px !important;
  gap: 6px !important;
  min-height: 0 !important;
  padding: 0 2px 2px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions button {
  min-height: 28px !important;
  height: 28px !important;
  padding: 3px 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions .fit-review-action,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions button.fit-review-action {
  grid-column: 1 / -1 !important;
  height: 30px !important;
  margin-top: 0 !important;
}

/* EOF authority: every Creative card must show every action button. */
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.photo,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.video,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.text {
  grid-template-rows: 190px 64px 30px 28px 112px !important;
  height: 456px !important;
  min-height: 456px !important;
  max-height: 456px !important;
  overflow: hidden !important;
  align-content: start !important;
}

body.app-mode[data-active-view="creative"] .creative-agent-console #media-library.creative-gallery {
  grid-template-columns: repeat(auto-fill, minmax(300px, 380px)) !important;
  justify-content: start !important;
  align-items: start !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .media-preview {
  height: 190px !important;
  min-height: 190px !important;
  max-height: 190px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions {
  align-self: start !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-rows: 30px !important;
  gap: 6px !important;
  height: 108px !important;
  min-height: 108px !important;
  max-height: 108px !important;
  padding: 0 2px 2px !important;
  overflow: hidden !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button {
  min-width: 0 !important;
  width: 100% !important;
  min-height: 30px !important;
  height: 30px !important;
  padding: 4px 6px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions .fit-review-action,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card .creative-card-actions button.fit-review-action {
  grid-column: 1 / -1 !important;
  min-height: 32px !important;
  height: 32px !important;
  margin-top: 0 !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card,
body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card.video {
  grid-template-rows: 176px 68px 34px minmax(112px, auto) !important;
  min-height: 456px !important;
}

body.app-mode[data-active-view="creative"] #media-library .smart-creative-card.ai-influencer-card .creative-card-actions {
  min-height: 108px !important;
}

/* Mobile Creative Studio rails: keep each asset family independently swipeable. */
body.app-mode[data-active-view="creative"] #media-library .creative-mobile-rail-section,
body.app-mode[data-active-view="creative"] #media-library .creative-mobile-rail {
  display: contents;
}

body.app-mode[data-active-view="creative"] #media-library .creative-mobile-rail-head {
  display: none;
}

@media (max-width: 820px) {
  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console #media-library.creative-gallery,
  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library.creative-gallery,
  body.app-mode.app-mode[data-active-view="creative"][data-active-view="creative"]:not(.creative-focus-mode) .creative-agent-console.chat-studio.chat-studio #media-library.creative-gallery {
    display: block !important;
    grid-template-columns: none !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    grid-template-rows: none !important;
    grid-auto-rows: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    max-height: none !important;
    padding: 0 4px 190px !important;
    overflow: visible !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail-section {
    display: grid !important;
    gap: 8px !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 14px !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 2px !important;
    padding: 0 2px !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail-head span {
    color: #08090d !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail-head small {
    color: rgba(8, 9, 13, 0.68) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(292px, calc(100vw - 90px)) !important;
    grid-template-columns: none !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    overscroll-behavior-x: contain !important;
    scrollbar-width: thin !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail .smart-creative-card.smart-creative-card,
  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail .smart-creative-card.photo,
  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail .smart-creative-card.video,
  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail .smart-creative-card.text {
    grid-row: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    scroll-snap-align: start !important;
  }

  body.app-mode[data-active-view="creative"]:not(.creative-focus-mode) #media-library .creative-mobile-rail-section.is-presenter .smart-creative-card.ai-influencer-card {
    grid-template-rows: 176px 68px 34px minmax(108px, auto) !important;
    height: 456px !important;
    min-height: 456px !important;
    max-height: 456px !important;
  }
}

/* Shared answer popups: reports scroll as one sheet instead of a locked inner result pane. */
.dashboard-answer-dialog.dashboard-answer-dialog {
  overflow-x: hidden;
  overflow-y: auto;
}

.dashboard-answer-dialog.dashboard-answer-dialog.is-report .dashboard-answer-modal {
  height: auto;
  min-height: 100%;
  max-height: none;
  grid-template-rows: none;
  overflow: visible;
}

.dashboard-answer-dialog.dashboard-answer-dialog.is-report :where(
  .dashboard-answer-body,
  .dashboard-performance-report,
  .dashboard-report-hero,
  .dashboard-report-summary,
  .dashboard-report-rows,
  .dashboard-report-narrative,
  .dashboard-report-section,
  .dashboard-report-insight,
  .dashboard-report-action-plan,
  .dashboard-report-action-plan ol
) {
  max-height: none;
  overflow: visible;
}

/* Outreach / Reach source discovery polish. */
body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-actions {
  justify-self: end;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: min(100%, 316px);
}

body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-actions .primary-action.compact {
  flex: 1 1 142px;
  min-width: 142px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

body.app-mode[data-active-view="outreach"] #outreach-discover-default {
  border: 2px solid #08090d !important;
  background: #08090d !important;
  color: #ffffff !important;
  box-shadow: 3px 3px 0 #67d5e8 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item .source-backed-evidence,
body.app-mode[data-active-view="outreach"] .outreach-review-card > .source-backed-evidence {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: 5px !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="outreach"] .outreach-review-card > .source-backed-evidence {
  margin-top: 9px !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="outreach"] .outreach-thread-item .source-backed-evidence a,
body.app-mode[data-active-view="outreach"] .outreach-thread-item .source-backed-evidence small,
body.app-mode[data-active-view="outreach"] .outreach-review-card > .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="outreach"] .outreach-review-card > .source-backed-evidence a,
body.app-mode[data-active-view="outreach"] .outreach-review-card > .source-backed-evidence small {
  width: auto !important;
  max-width: 178px !important;
  min-height: 20px !important;
  overflow: hidden !important;
  padding: 4px 6px !important;
  border: 1px solid rgba(8, 9, 13, 0.22) !important;
  border-radius: 999px !important;
  background: #f7f9fb !important;
  color: #08090d !important;
  box-shadow: none !important;
  font-size: 8.5px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="outreach"] .outreach-thread-item .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="outreach"] .outreach-review-card > .source-backed-evidence .source-backed-mode {
  max-width: 230px !important;
  background: #d5ff00 !important;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-strip {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-actions {
    justify-self: stretch;
    width: 100%;
    min-width: 0;
  }

  body.app-mode[data-active-view="outreach"] .outreach-module .module-hero-actions .primary-action.compact {
    min-width: min(100%, 142px);
  }

  body.app-mode[data-active-view="outreach"] .outreach-thread-item {
    grid-template-columns: 30px minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="outreach"] .outreach-thread-item b,
  body.app-mode[data-active-view="outreach"] .outreach-thread-actions {
    grid-column: 2;
    justify-self: start;
  }
}

/* Affiliate / Referral source discovery polish. */
body.app-mode[data-active-view="affiliate"] .affiliate-module .affiliate-hero-actions {
  justify-self: end;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: min(100%, 328px);
}

body.app-mode[data-active-view="affiliate"] .affiliate-module .affiliate-hero-actions .primary-action.compact {
  flex: 1 1 142px;
  min-width: 142px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

body.app-mode[data-active-view="affiliate"] #affiliate-discover-default {
  border: 2px solid #08090d !important;
  background: #08090d !important;
  color: #ffffff !important;
  box-shadow: 3px 3px 0 #67d5e8 !important;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-application .source-backed-evidence,
body.app-mode[data-active-view="affiliate"] .affiliate-review-card > .source-backed-evidence {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: 5px !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-review-card > .source-backed-evidence {
  margin: 9px 0 8px !important;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-application .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="affiliate"] .admin-affiliate-application .source-backed-evidence a,
body.app-mode[data-active-view="affiliate"] .admin-affiliate-application .source-backed-evidence small,
body.app-mode[data-active-view="affiliate"] .affiliate-review-card > .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="affiliate"] .affiliate-review-card > .source-backed-evidence a,
body.app-mode[data-active-view="affiliate"] .affiliate-review-card > .source-backed-evidence small {
  width: auto !important;
  max-width: 178px !important;
  min-height: 20px !important;
  overflow: hidden !important;
  padding: 4px 6px !important;
  border: 1px solid rgba(8, 9, 13, 0.22) !important;
  border-radius: 999px !important;
  background: #f7f9fb !important;
  color: #08090d !important;
  box-shadow: none !important;
  font-size: 8.5px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

body.app-mode[data-active-view="affiliate"] .admin-affiliate-application .source-backed-evidence .source-backed-mode,
body.app-mode[data-active-view="affiliate"] .affiliate-review-card > .source-backed-evidence .source-backed-mode {
  max-width: 230px !important;
  background: #d5ff00 !important;
}

body.app-mode[data-active-view="affiliate"] .affiliate-review-card .affiliate-terms-grid article strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 760px) {
  body.app-mode[data-active-view="affiliate"] .affiliate-module .module-hero-strip {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="affiliate"] .affiliate-module .affiliate-hero-actions {
    justify-self: stretch;
    width: 100%;
    min-width: 0;
  }

  body.app-mode[data-active-view="affiliate"] .affiliate-module .affiliate-hero-actions .primary-action.compact {
    min-width: min(100%, 142px);
  }

  body.app-mode[data-active-view="affiliate"] .admin-affiliate-application {
    grid-template-columns: 30px minmax(0, 1fr) !important;
  }

  body.app-mode[data-active-view="affiliate"] .admin-affiliate-application b,
  body.app-mode[data-active-view="affiliate"] .admin-affiliate-application .affiliate-program-actions {
    grid-column: 2;
    justify-self: start;
  }
}

/* Workspace proof ledgers: queue, automation, and missions use saved receipts only. */
body.app-mode .workspace-proof-panel {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin: 12px 0;
  padding: 12px;
  border: 2px solid #08090d;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(213, 255, 0, 0.16), transparent 42%),
    rgba(255, 250, 240, 0.96);
  box-shadow: 3px 3px 0 rgba(8, 9, 13, 0.9);
}

body.app-mode .workspace-proof-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

body.app-mode .workspace-proof-header > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

body.app-mode .workspace-proof-header strong {
  color: #08090d;
  font-size: 15px;
  line-height: 1.1;
}

body.app-mode .workspace-proof-header small {
  color: rgba(8, 9, 13, 0.68);
  font-size: 10px;
  line-height: 1.25;
}

body.app-mode .workspace-proof-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

body.app-mode .workspace-proof-kpis article {
  display: grid;
  gap: 3px;
  min-height: 62px;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background:
    linear-gradient(90deg, #d5ff00 0 7px, #fffaf0 7px 100%);
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.85);
}

body.app-mode .workspace-proof-kpis article:nth-child(2) {
  background:
    linear-gradient(90deg, #67d5e8 0 7px, #fffaf0 7px 100%);
}

body.app-mode .workspace-proof-kpis article:nth-child(3) {
  background:
    linear-gradient(90deg, #ffdfae 0 7px, #fffaf0 7px 100%);
}

body.app-mode .workspace-proof-kpis article:nth-child(4) {
  background:
    linear-gradient(90deg, #b9a7ff 0 7px, #fffaf0 7px 100%);
}

body.app-mode .workspace-proof-kpis span,
body.app-mode .workspace-proof-item > span {
  color: rgba(8, 9, 13, 0.66);
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

body.app-mode .workspace-proof-kpis strong {
  min-width: 0;
  color: #08090d;
  font-size: 15px;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

body.app-mode .workspace-proof-kpis small {
  color: rgba(8, 9, 13, 0.66);
  font-size: 8.8px;
  line-height: 1.15;
}

body.app-mode .workspace-proof-grid {
  display: grid;
  gap: 7px;
  min-width: 0;
}

body.app-mode .workspace-proof-item {
  display: grid;
  grid-template-columns: minmax(46px, 0.18fr) minmax(0, 1fr) minmax(68px, auto);
  gap: 8px;
  align-items: center;
  min-width: 0;
  padding: 8px;
  border: 2px solid #08090d;
  border-radius: 7px;
  background: #fffaf0;
  box-shadow: 2px 2px 0 rgba(8, 9, 13, 0.8);
}

body.app-mode .workspace-proof-item > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

body.app-mode .workspace-proof-item strong {
  color: #08090d;
  font-size: 11px;
  line-height: 1.12;
  overflow-wrap: anywhere;
}

body.app-mode .workspace-proof-item small {
  color: rgba(8, 9, 13, 0.66);
  font-size: 9px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

body.app-mode .workspace-proof-item b {
  justify-self: end;
  max-width: 112px;
  min-width: 0;
  padding: 5px 7px;
  border: 1px solid rgba(8, 9, 13, 0.24);
  border-radius: 999px;
  color: #08090d;
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
}

body.app-mode .workspace-proof-item b.ready {
  background: #d5ff00;
}

body.app-mode .workspace-proof-item b.pending {
  background: #ffdfae;
}

body.app-mode .workspace-proof-item b.attention {
  background: #ff8f88;
}

body.app-mode[data-active-view="queue"] .queue-agent-side .workspace-proof-panel {
  margin: 0;
}

body.app-mode[data-active-view="queue"] .queue-proof-panel .workspace-proof-kpis,
body.app-mode[data-active-view="queue"] .queue-proof-panel .workspace-proof-item {
  grid-template-columns: minmax(0, 1fr);
}

body.app-mode[data-active-view="queue"] .queue-proof-panel .workspace-proof-item b {
  justify-self: start;
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] > .panel > .queue-proof-panel .workspace-proof-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] > .panel > .queue-proof-panel .workspace-proof-item {
  grid-template-columns: minmax(46px, 0.18fr) minmax(0, 1fr) minmax(68px, auto);
}

body.app-mode[data-active-view="queue"] [data-view-section="queue"] > .panel > .queue-proof-panel .workspace-proof-item b {
  justify-self: end;
}

body.app-mode[data-active-view="missions"] .mission-workspace-proof {
  margin-top: 14px;
}

/* Cross-page source chip cleanup. */
body.app-mode .source-backed-evidence {
  min-width: 0;
  max-width: 100%;
}

body.app-mode .source-backed-evidence a,
body.app-mode .source-backed-evidence small,
body.app-mode .source-backed-evidence .source-backed-mode {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 980px) {
  body.app-mode .workspace-proof-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  body.app-mode .workspace-proof-header,
  body.app-mode .workspace-proof-kpis,
  body.app-mode .workspace-proof-item {
    grid-template-columns: minmax(0, 1fr);
  }

  body.app-mode .workspace-proof-item b {
    justify-self: start;
  }
}

/* Final Creative Studio Cinematic Video tab override. */
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-agent-console.chat-studio {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "project"
    "tabs"
    "presenter" !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-gallery-head,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] #media-library.creative-gallery,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .ploxy-chat-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-preview-stage,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .social-production-lab,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-dna-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-actions,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-tool-strip,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .manual-studio-panel,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-mode-switch,
body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .connected-channel-strip {
  display: none !important;
}

body.app-mode[data-active-view="creative"][data-creative-board-filter="cinematic"] .creative-agent-console .presenter-studio-lab {
  display: grid !important;
  grid-area: presenter !important;
}