main[data-tool="youtube-title-generator"] {
  --ai-bg: #ffffff;
  --ai-surface: #f8fafc;
  --ai-surface-strong: #f1f5f9;
  --ai-text: #0f172a;
  --ai-muted: #64748b;
  --ai-border: #e2e8f0;
  --ai-divider: #e5e7eb;
  --ai-accent: #6d5dfb;
  --ai-accent-hover: #5848e8;
  --ai-blue: #2563eb;
  --ai-success: #16a34a;
  --ai-warning: #d97706;
  --ai-error: #dc2626;
}

main[data-tool="youtube-title-generator"] #tool-workspace.tool-panel {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

main[data-tool="youtube-title-generator"] .tool-page-hero h1 {
  max-width: 980px;
}

main[data-tool="youtube-title-generator"] .tool-page-hero p {
  max-width: 820px;
}

.ai-workspace,
.ai-workspace * {
  box-sizing: border-box;
}

.ai-workspace {
  width: 100%;
  color: var(--ai-text);
  background: var(--ai-bg);
  border: 1px solid rgba(148, 163, 184, .34);
  border-radius: 20px;
  box-shadow: 0 22px 54px rgba(15, 23, 42, .10), inset 0 1px 0 rgba(255, 255, 255, .9);
  overflow: hidden;
}

.ai-workspace-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.05rem 1.2rem;
  border-bottom: 1px solid var(--ai-divider);
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .92));
}

.ai-workspace-kicker {
  margin: 0 0 .18rem;
  color: var(--ai-muted);
  font-size: .82rem;
  font-weight: 700;
}

.ai-workspace-title {
  margin: 0;
  color: var(--ai-text);
  font-size: 1.2rem;
  line-height: 1.2;
  font-weight: 750;
  letter-spacing: 0;
}

.ai-header-actions,
.ai-result-toolbar,
.ai-card-actions,
.ai-card-quick-actions {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-wrap: wrap;
}

.ai-mini-button,
.ai-icon-button,
.ai-secondary-button,
.ai-ghost-button {
  min-height: 42px;
  border: 1px solid rgba(191, 219, 254, .95);
  border-radius: 13px;
  background: #fff;
  color: #334155;
  font: 650 .92rem/1 Inter, system-ui, sans-serif;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .65rem .82rem;
  box-shadow: 0 8px 20px rgba(37, 99, 235, .06);
  transition: border-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.ai-mini-button:hover,
.ai-icon-button:hover,
.ai-secondary-button:hover,
.ai-ghost-button:hover {
  border-color: rgba(109, 93, 251, .5);
  color: var(--ai-blue);
  box-shadow: 0 10px 24px rgba(37, 99, 235, .10);
}

.ai-mini-button:active,
.ai-icon-button:active,
.ai-secondary-button:active,
.ai-ghost-button:active {
  transform: translateY(1px);
}

.ai-icon-button {
  width: 42px;
  padding: 0;
}

.ai-mini-button i,
.ai-icon-button i,
.ai-secondary-button i,
.ai-ghost-button i,
.ai-generate-button i,
.ai-badge-row i {
  width: 18px;
  height: 18px;
  stroke-width: 2.15;
}

.ai-workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, .4fr) minmax(0, .6fr);
  min-height: 620px;
}

.ai-input-panel,
.ai-result-panel {
  min-width: 0;
}

.ai-input-panel {
  padding: 1.2rem;
  background: #fff;
  border-right: 1px solid var(--ai-divider);
}

.ai-form {
  display: grid;
  gap: 1rem;
}

.ai-field {
  display: grid;
  gap: .45rem;
}

.ai-field span,
.ai-field legend,
.ai-check span {
  color: var(--ai-text);
  font-size: .92rem;
  line-height: 1.25;
  font-weight: 700;
}

.ai-field small,
.ai-help {
  color: var(--ai-muted);
  font-size: .82rem;
  line-height: 1.45;
}

.ai-field input,
.ai-field textarea,
.ai-field select {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--ai-border);
  border-radius: 13px;
  background: var(--ai-surface);
  color: var(--ai-text);
  font: 500 1rem/1.4 Inter, system-ui, sans-serif;
  padding: .8rem .9rem;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.ai-field textarea {
  min-height: 128px;
  resize: vertical;
}

.ai-field input:focus,
.ai-field textarea:focus,
.ai-field select:focus,
.ai-mini-button:focus-visible,
.ai-icon-button:focus-visible,
.ai-secondary-button:focus-visible,
.ai-ghost-button:focus-visible,
.ai-generate-button:focus-visible,
.ai-check input:focus-visible {
  border-color: var(--ai-accent);
  box-shadow: 0 0 0 4px rgba(109, 93, 251, .16);
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace input,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace textarea,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace select {
  background: #f8fafc !important;
  border-color: #dbeafe !important;
  color: #0f172a !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8) !important;
  -webkit-text-fill-color: #0f172a !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace input:focus,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace textarea:focus,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace select:focus {
  border-color: #6d5dfb !important;
  box-shadow: 0 0 0 4px rgba(109, 93, 251, .16), inset 0 1px 0 rgba(255, 255, 255, .8) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check {
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
  border-color: rgba(191, 219, 254, .95) !important;
  box-shadow: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced summary {
  color: #2563eb !important;
  -webkit-text-fill-color: #2563eb !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-title {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main[data-tool="youtube-title-generator"] #tool-workspace.tool-panel .ai-result-title {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  opacity: 1 !important;
}

.ai-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

.ai-option-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
}

.ai-check {
  display: flex;
  align-items: flex-start;
  gap: .62rem;
  padding: .82rem .9rem;
  border: 1px solid var(--ai-border);
  border-radius: 13px;
  background: var(--ai-surface);
}

.ai-check input {
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  margin-top: .05rem;
  accent-color: var(--ai-accent);
}

.ai-advanced {
  border: 1px solid rgba(191, 219, 254, .95);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  overflow: hidden;
}

.ai-advanced summary {
  list-style: none;
  cursor: pointer;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding: .82rem .95rem;
  color: var(--ai-blue);
  font-weight: 750;
}

.ai-advanced summary::-webkit-details-marker {
  display: none;
}

.ai-advanced summary i {
  width: 18px;
  height: 18px;
  transition: transform .18s ease;
}

.ai-advanced[open] summary i {
  transform: rotate(180deg);
}

.ai-advanced-body {
  display: grid;
  gap: .82rem;
  padding: 0 .95rem .95rem;
}

.ai-generate-button {
  width: 100%;
  min-height: 52px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--ai-accent), #2563eb);
  color: #fff;
  font: 750 1rem/1 Inter, system-ui, sans-serif;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  cursor: pointer;
  box-shadow: 0 16px 34px rgba(79, 70, 229, .24);
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.ai-generate-button:hover {
  background: linear-gradient(135deg, var(--ai-accent-hover), #1d4ed8);
  box-shadow: 0 18px 40px rgba(79, 70, 229, .30);
}

.ai-generate-button[disabled] {
  opacity: .68;
  cursor: not-allowed;
}

.ai-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, .48);
  border-top-color: #fff;
  border-radius: 999px;
  animation: ai-spin .8s linear infinite;
}

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

.ai-badge-row {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  margin-top: .1rem;
}

.ai-badge-row span {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem .7rem;
  border: 1px solid rgba(191, 219, 254, .95);
  border-radius: 999px;
  background: #fff;
  color: #475569;
  font-size: .82rem;
  font-weight: 650;
}

.ai-form-status,
.ai-live-region {
  min-height: 22px;
  color: var(--ai-muted);
  font-size: .86rem;
  line-height: 1.4;
}

.ai-form-status.is-error {
  color: var(--ai-error);
  font-weight: 700;
}

.ai-result-panel {
  display: grid;
  grid-template-rows: auto 1fr;
  background: linear-gradient(180deg, #f8fafc, #ffffff);
}

.ai-result-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.2rem 1.2rem .9rem;
  border-bottom: 1px solid var(--ai-divider);
}

.ai-result-head h3 {
  margin: 0 0 .25rem;
  color: var(--ai-text);
  font-size: 1.12rem;
  line-height: 1.25;
  font-weight: 780;
}

.ai-result-head p {
  margin: 0;
  color: var(--ai-muted);
  font-size: .9rem;
  line-height: 1.45;
}

.ai-results-scroll {
  min-height: 0;
  overflow: auto;
  padding: 1rem 1.2rem 1.2rem;
  scroll-behavior: smooth;
}

.ai-empty-state,
.ai-error-card,
.ai-collection-panel {
  border: 1px solid var(--ai-border);
  border-radius: 18px;
  background: #fff;
  padding: 1.1rem;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .06);
}

.ai-empty-state {
  display: grid;
  place-items: center;
  min-height: 360px;
  text-align: center;
}

.ai-empty-state div {
  max-width: 340px;
}

.ai-empty-state i {
  width: 34px;
  height: 34px;
  color: var(--ai-accent);
  margin-bottom: .8rem;
}

.ai-empty-state strong,
.ai-error-card strong {
  display: block;
  color: var(--ai-text);
  font-size: 1.05rem;
  line-height: 1.35;
  margin-bottom: .35rem;
}

.ai-empty-state p,
.ai-error-card p {
  margin: 0;
  color: var(--ai-muted);
  line-height: 1.55;
}

.ai-error-card {
  border-color: rgba(220, 38, 38, .24);
  background: linear-gradient(180deg, #fff, #fff7f7);
}

.ai-error-card strong {
  color: var(--ai-error);
}

.ai-skeleton-list {
  display: grid;
  gap: .8rem;
}

.ai-skeleton-card {
  height: 124px;
  border-radius: 17px;
  border: 1px solid var(--ai-border);
  background:
    linear-gradient(90deg, rgba(226, 232, 240, .55), rgba(248, 250, 252, .9), rgba(226, 232, 240, .55)),
    #fff;
  background-size: 240% 100%;
  animation: ai-skeleton 1.35s ease-in-out infinite;
}

@keyframes ai-skeleton {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.ai-result-list {
  display: grid;
  gap: .85rem;
}

.ai-result-card {
  border: 1px solid rgba(191, 219, 254, .9);
  border-radius: 18px;
  background: #fff;
  padding: 1rem;
  box-shadow: 0 16px 38px rgba(37, 99, 235, .08);
}

.ai-result-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  margin-bottom: .65rem;
}

.ai-result-number {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--ai-muted);
  font-size: .82rem;
  font-weight: 760;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.ai-result-number b {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 10px;
  color: var(--ai-blue);
  background: #eff6ff;
  letter-spacing: 0;
}

.ai-character-pill,
.ai-count-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: .35rem .62rem;
  border: 1px solid var(--ai-border);
  border-radius: 999px;
  background: var(--ai-surface);
  color: var(--ai-muted);
  font-size: .8rem;
  font-weight: 700;
}

.ai-result-title {
  margin: 0;
  color: var(--ai-text);
  font-size: 1.03rem;
  line-height: 1.6;
  font-weight: 720;
  overflow-wrap: anywhere;
}

.ai-result-image-preview {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin: .78rem 0 .68rem;
  overflow: hidden;
  border: 1px solid rgba(191, 219, 254, .95);
  border-radius: 16px;
  background: linear-gradient(135deg, #eff6ff, #ffffff);
  box-shadow: 0 14px 30px rgba(15, 23, 42, .08);
}

.ai-result-image-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ai-result-image-preview:hover {
  border-color: rgba(37, 99, 235, .46);
  box-shadow: 0 18px 38px rgba(37, 99, 235, .13);
}

html:not([data-theme="dark"]) body.flux-tool-body main:is([data-tool="youtube-tags-extractor"], [data-tool="instagram-font-generator"], [data-tool="thumbnail-downloader"]) .ai-workspace-kicker,
html:not([data-theme="dark"]) body.flux-tool-body main:is([data-tool="youtube-tags-extractor"], [data-tool="instagram-font-generator"], [data-tool="thumbnail-downloader"]) .ai-result-head h3 {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main:is([data-tool="youtube-tags-extractor"], [data-tool="instagram-font-generator"], [data-tool="thumbnail-downloader"]) .ai-workspace-title,
html:not([data-theme="dark"]) body.flux-tool-body main:is([data-tool="youtube-tags-extractor"], [data-tool="instagram-font-generator"], [data-tool="thumbnail-downloader"]) .ai-result-head p,
html:not([data-theme="dark"]) body.flux-tool-body main:is([data-tool="youtube-tags-extractor"], [data-tool="instagram-font-generator"], [data-tool="thumbnail-downloader"]) .ai-empty-state p {
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
}

.ai-result-meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin: .72rem 0 0;
  color: var(--ai-muted);
  font-size: .82rem;
}

.ai-card-actions {
  margin-top: .86rem;
}

.ai-secondary-button {
  min-height: 38px;
  border-radius: 12px;
  padding: .58rem .72rem;
  font-size: .86rem;
}

.ai-ghost-button {
  min-height: 36px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  padding: .5rem .42rem;
  color: var(--ai-muted);
}

.ai-ghost-button.is-favorite {
  color: #d97706;
  background: #fffbeb;
  border-color: rgba(245, 158, 11, .26);
}

.ai-collection-panel {
  margin-bottom: .9rem;
}

.ai-collection-panel[hidden] {
  display: none;
}

.ai-collection-panel h4 {
  margin: 0 0 .8rem;
  color: var(--ai-text);
  font-size: 1rem;
}

.ai-collection-list {
  display: grid;
  gap: .55rem;
}

.ai-collection-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .72rem;
  border: 1px solid var(--ai-border);
  border-radius: 14px;
  background: var(--ai-surface);
}

.ai-collection-item p {
  margin: 0;
  color: var(--ai-text);
  font-weight: 650;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

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

html[data-theme="dark"] main[data-tool="youtube-title-generator"] {
  --ai-bg: #0f172a;
  --ai-surface: #111c30;
  --ai-surface-strong: #172033;
  --ai-text: #f8fafc;
  --ai-muted: #cbd5e1;
  --ai-border: rgba(148, 163, 184, .28);
  --ai-divider: rgba(148, 163, 184, .20);
}

html[data-theme="dark"] .ai-workspace {
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(15, 23, 42, .92));
  border-color: rgba(96, 165, 250, .28);
  box-shadow: 0 24px 64px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06);
}

html[data-theme="dark"] .ai-workspace-header,
html[data-theme="dark"] .ai-input-panel,
html[data-theme="dark"] .ai-result-panel,
html[data-theme="dark"] .ai-empty-state,
html[data-theme="dark"] .ai-result-card,
html[data-theme="dark"] .ai-error-card,
html[data-theme="dark"] .ai-collection-panel {
  background: rgba(15, 23, 42, .92);
}

html[data-theme="dark"] .ai-result-panel {
  background: linear-gradient(180deg, rgba(17, 28, 48, .78), rgba(15, 23, 42, .92));
}

html[data-theme="dark"] .ai-result-image-preview {
  border-color: rgba(96, 165, 250, .34);
  background: linear-gradient(135deg, rgba(15, 23, 42, .96), rgba(30, 41, 59, .9));
  box-shadow: 0 18px 38px rgba(0, 0, 0, .24);
}

html[data-theme="dark"] .ai-field input,
html[data-theme="dark"] .ai-field textarea,
html[data-theme="dark"] .ai-field select,
html[data-theme="dark"] .ai-check,
html[data-theme="dark"] .ai-advanced,
html[data-theme="dark"] .ai-badge-row span,
html[data-theme="dark"] .ai-mini-button,
html[data-theme="dark"] .ai-icon-button,
html[data-theme="dark"] .ai-secondary-button,
html[data-theme="dark"] .ai-collection-item,
html[data-theme="dark"] .ai-character-pill,
html[data-theme="dark"] .ai-count-pill {
  background: rgba(15, 23, 42, .72);
  border-color: rgba(147, 197, 253, .24);
  color: var(--ai-text);
}

html[data-theme="dark"] .ai-empty-state p,
html[data-theme="dark"] .ai-result-head p,
html[data-theme="dark"] .ai-field small,
html[data-theme="dark"] .ai-help {
  color: var(--ai-muted);
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace select {
  background: rgba(15, 23, 42, .72) !important;
  border-color: rgba(147, 197, 253, .24) !important;
  color: #f8fafc !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check {
  background: rgba(15, 23, 42, .72) !important;
  border-color: rgba(147, 197, 253, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced summary {
  color: #93c5fd !important;
  -webkit-text-fill-color: #93c5fd !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main[data-tool="youtube-title-generator"] #tool-workspace.tool-panel .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  opacity: 1 !important;
}

@media (max-width: 1120px) {
  .ai-workspace-grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .ai-input-panel {
    border-right: 0;
    border-bottom: 1px solid var(--ai-divider);
  }

  .ai-empty-state {
    min-height: 280px;
  }
}

@media (max-width: 760px) {
  main[data-tool="youtube-title-generator"] .tool-page-hero h1 {
    font-size: 32px !important;
    line-height: 1.12 !important;
  }

  .ai-workspace-header,
  .ai-result-head {
    align-items: stretch;
    flex-direction: column;
    padding: .95rem;
  }

  .ai-header-actions,
  .ai-result-toolbar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
  }

  .ai-mini-button {
    width: 100%;
  }

  .ai-input-panel,
  .ai-results-scroll {
    padding: .95rem;
  }

  .ai-field-grid,
  .ai-option-row {
    grid-template-columns: 1fr;
  }

  .ai-field textarea {
    min-height: 118px;
  }

  .ai-card-actions,
  .ai-card-quick-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-secondary-button,
  .ai-ghost-button {
    width: 100%;
  }
}

@media (max-width: 430px) {
  .ai-workspace {
    border-radius: 18px;
  }

  .ai-header-actions,
  .ai-result-toolbar,
  .ai-card-actions,
  .ai-card-quick-actions {
    grid-template-columns: 1fr;
  }

  .ai-result-card {
    padding: .9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ai-workspace *,
  .ai-spinner,
  .ai-skeleton-card {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* Word Counter-aligned AI workspace shell. Scoped to the representative AI tool only. */
body.flux-tool-body main[data-tool="youtube-title-generator"].page-shell.tool-page {
  max-width: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] > .breadcrumb {
  width: min(1800px, calc(100vw - 48px)) !important;
  max-width: min(1800px, calc(100vw - 48px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero {
  width: min(1040px, calc(100vw - 48px)) !important;
  max-width: min(1040px, calc(100vw - 48px)) !important;
  margin: .22rem auto 1.1rem !important;
  padding: 1.55rem 1rem 1.05rem !important;
  background: transparent !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero:before,
body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero .eyebrow {
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero h1 {
  max-width: 1040px !important;
  margin: 0 auto !important;
  color: #0f172a !important;
  font-size: clamp(2.35rem, 4.7vw, 4.35rem) !important;
  line-height: 1.04 !important;
  font-weight: 820 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero p {
  max-width: 820px !important;
  margin: .62rem auto 0 !important;
  color: #526277 !important;
  font-size: clamp(1rem, 1.2vw, 1.18rem) !important;
  line-height: 1.42 !important;
  text-align: center !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-layout,
body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-main {
  width: min(1800px, calc(100vw - 48px)) !important;
  max-width: min(1800px, calc(100vw - 48px)) !important;
  margin-inline: auto !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="youtube-title-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace {
  width: 100% !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-header {
  min-height: 74px !important;
  padding: .86rem 1.22rem !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-kicker {
  margin: 0 !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 1.02rem !important;
  line-height: 1.2 !important;
  font-weight: 820 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-title {
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-header-actions {
  justify-content: flex-end !important;
  margin-left: auto !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-secondary-button,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-ghost-button {
  min-height: 42px !important;
  border: 1px solid rgba(191, 219, 254, .95) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .04) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button:hover,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-secondary-button:hover,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-ghost-button:hover {
  border-color: rgba(37, 99, 235, .36) !important;
  background: #f1f7ff !important;
  color: #2563eb !important;
  -webkit-text-fill-color: #2563eb !important;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .08) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button:disabled,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-secondary-button:disabled {
  opacity: .58 !important;
  cursor: not-allowed !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-grid {
  grid-template-columns: minmax(0, 1.1fr) minmax(440px, .9fr) !important;
  min-height: 560px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-input-panel,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-panel {
  background: #fff !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-input-panel {
  padding: 1.1rem 1.16rem !important;
  border-right: 1px solid #e2e8f0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-form {
  gap: .82rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field {
  gap: .38rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field span,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field legend,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check span {
  font-size: .88rem !important;
  line-height: 1.22 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field input,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field textarea,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field select {
  min-height: 44px !important;
  border-radius: 13px !important;
  padding: .68rem .82rem !important;
  font-size: .95rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field textarea {
  min-height: 112px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] #aiTopic {
  min-height: 150px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] #aiCustomInstructions {
  min-height: 92px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field-grid,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-option-row {
  gap: .68rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check {
  padding: .72rem .82rem !important;
  border-radius: 13px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced {
  border-radius: 15px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced summary {
  min-height: 46px !important;
  padding: .72rem .86rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced-body {
  gap: .68rem !important;
  padding: 0 .86rem .86rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-generate-button {
  min-height: 48px !important;
  border-radius: 14px !important;
  background: #2563eb !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 15px 30px rgba(37, 99, 235, .22) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-generate-button:hover {
  background: #1d4ed8 !important;
  box-shadow: 0 18px 38px rgba(37, 99, 235, .28) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-badge-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: .5rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-badge-row span {
  justify-content: center !important;
  min-height: 36px !important;
  padding: .45rem .62rem !important;
  border-radius: 999px !important;
  white-space: normal !important;
  text-align: center !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-panel {
  grid-template-rows: auto minmax(0, 1fr) !important;
  border-left: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head {
  align-items: center !important;
  padding: 1rem 1.16rem !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head h3 {
  margin: 0 0 .2rem !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 1.18rem !important;
  line-height: 1.25 !important;
  font-weight: 820 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head p {
  color: #64748b !important;
  font-size: .88rem !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-results-scroll {
  min-height: 0 !important;
  max-height: 650px !important;
  padding: 1rem 1.16rem 1.16rem !important;
  background: linear-gradient(180deg, #fff, #f8fbff) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-empty-state {
  min-height: 390px !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 28px rgba(37, 99, 235, .05) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-card,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-error-card,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-collection-panel {
  border-radius: 18px !important;
  box-shadow: 0 14px 32px rgba(37, 99, 235, .07) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-title {
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions {
  gap: .5rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-workspace-note {
  width: min(1224px, calc(100vw - 48px)) !important;
  max-width: min(1224px, calc(100vw - 48px)) !important;
  margin: 1rem auto 0 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head h3 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero p {
  color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-input-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head {
  background: #0f172a !important;
  border-color: rgba(147, 197, 253, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-results-scroll {
  background: linear-gradient(180deg, #0f172a, #111c30) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-secondary-button,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-ghost-button,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-badge-row span {
  background: rgba(15, 23, 42, .72) !important;
  border-color: rgba(147, 197, 253, .24) !important;
  color: #e5eefc !important;
  -webkit-text-fill-color: #e5eefc !important;
}

@media (max-width: 1120px) {
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-grid {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-input-panel {
    border-right: 0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-results-scroll {
    max-height: none !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-tool="youtube-title-generator"] > .breadcrumb,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-layout,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-main,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-workspace-note {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    margin-bottom: .82rem !important;
    padding: 1.05rem .5rem .82rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero h1 {
    font-size: clamp(1.82rem, 8.4vw, 2.35rem) !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero p {
    font-size: .98rem !important;
    line-height: 1.36 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-header,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: .75rem !important;
    padding: .88rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-header-actions,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-toolbar {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    margin-left: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button {
    width: 100% !important;
    min-height: 42px !important;
    padding: .55rem .5rem !important;
    font-size: .84rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-input-panel,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-results-scroll {
    padding: .88rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field-grid,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-option-row,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-badge-row {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] #aiTopic {
    min-height: 132px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-empty-state {
    min-height: 250px !important;
  }
}

@media (max-width: 430px) {
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-header-actions,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-toolbar {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button {
    gap: .34rem !important;
    padding-left: .35rem !important;
    padding-right: .35rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button span {
    white-space: nowrap !important;
    font-size: .8rem !important;
  }
}

html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] > .breadcrumb,
html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] > section.tool-layout {
  width: min(1800px, calc(100% - 48px)) !important;
  max-width: min(1800px, calc(100% - 48px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] > section.tool-layout > .tool-main {
  width: 100% !important;
  max-width: 100% !important;
}

html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] #tool-workspace.tool-panel:before,
html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note {
  width: min(1224px, calc(100% - 48px)) !important;
  max-width: min(1224px, calc(100% - 48px)) !important;
}

@media (max-width: 760px) {
  html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] > .breadcrumb,
  html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] > section.tool-layout,
  html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
  }
}

body.flux-tool-body main[data-ai-workspace="short-output"] {
  --ai-surface: #ffffff;
  --ai-soft: #f8fbff;
  --ai-border: rgba(191, 219, 254, .92);
  --ai-border-strong: rgba(147, 197, 253, .95);
  --ai-text: #0f172a;
  --ai-muted: #64748b;
  --ai-blue: #2563eb;
  --ai-blue-dark: #1d4ed8;
  --ai-shadow: 0 24px 70px rgba(15, 23, 42, .10);
}

body:has(main[data-ai-workspace="short-output"]) .loading-overlay,
.loading-overlay.ai-short-loading-neutralized {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] > .breadcrumb,
html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] > section.tool-layout {
  width: min(1800px, calc(100% - 48px)) !important;
  max-width: min(1800px, calc(100% - 48px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] > section.tool-layout > .tool-main {
  width: 100% !important;
  max-width: 100% !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero {
  max-width: 1140px !important;
  margin: .35rem auto 1.65rem !important;
  padding: 1.15rem 1rem .65rem !important;
  text-align: center !important;
  background: transparent !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero .eyebrow {
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero h1 {
  color: var(--ai-text) !important;
  font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(2.4rem, 4.1vw, 4.2rem) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  font-weight: 900 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero p {
  max-width: 870px !important;
  margin: .7rem auto 0 !important;
  color: #526176 !important;
  font-size: clamp(1.02rem, 1.4vw, 1.34rem) !important;
  line-height: 1.45 !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] #tool-workspace.tool-panel:before,
html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .tool-workspace-note {
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace {
  width: 100% !important;
  max-width: 100% !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,251,255,.96)) !important;
  box-shadow: var(--ai-shadow) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-header {
  min-height: 72px !important;
  padding: .78rem 1.08rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .94) !important;
  background: linear-gradient(180deg, #fff, #fbfdff) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-kicker {
  color: var(--ai-text) !important;
  font-size: 1.06rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-title {
  margin-top: .18rem !important;
  color: var(--ai-muted) !important;
  font-size: .88rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-header-actions,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  justify-content: flex-end !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-grid {
  display: grid !important;
  grid-template-columns: minmax(320px, .72fr) minmax(0, 1.08fr) !important;
  align-items: stretch !important;
  min-height: 590px !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-input-panel,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-panel {
  min-width: 0 !important;
  background: transparent !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-input-panel {
  border-right: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-form {
  gap: .86rem !important;
  padding: 1rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .78rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field-wide {
  grid-column: 1 / -1 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field span,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-check span {
  color: #334155 !important;
  font-size: .84rem !important;
  font-weight: 760 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field input,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field textarea,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field select {
  min-height: 48px !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: var(--ai-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field textarea {
  min-height: 112px !important;
  resize: vertical !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field input:focus,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field textarea:focus,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field select:focus,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-mini-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-secondary-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-generate-button:focus-visible {
  outline: 3px solid rgba(37, 99, 235, .22) !important;
  border-color: #93c5fd !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-check,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-advanced {
  border: 1px solid var(--ai-border) !important;
  border-radius: 16px !important;
  background: rgba(248, 251, 255, .9) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-advanced summary {
  color: var(--ai-blue) !important;
  min-height: 48px !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-generate-button {
  min-height: 52px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
  box-shadow: 0 16px 32px rgba(37, 99, 235, .20) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-generate-button:hover {
  box-shadow: 0 18px 38px rgba(37, 99, 235, .26) !important;
  transform: translateY(-1px) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-badge-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: .5rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-badge-row span {
  min-height: 42px !important;
  padding: .52rem .72rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #334155 !important;
  font-size: .78rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head {
  min-height: 72px !important;
  padding: .78rem 1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .94) !important;
  background: #fff !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head h3 {
  color: var(--ai-text) !important;
  font-size: 1.18rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head p {
  color: var(--ai-muted) !important;
  font-size: .88rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-results-scroll {
  min-height: 510px !important;
  max-height: 620px !important;
  padding: 1rem !important;
  overflow: auto !important;
  background: linear-gradient(180deg, #fbfdff, #f8fbff) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-empty-state {
  min-height: 420px !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-card,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-error-card,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-collection-panel {
  border: 1px solid var(--ai-border) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, .06) !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-title {
  color: var(--ai-text) !important;
  font-size: clamp(1.05rem, 1.3vw, 1.36rem) !important;
  line-height: 1.42 !important;
  font-weight: 760 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-note,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-disclaimer,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-warning {
  margin: .62rem 0 0 !important;
  color: var(--ai-muted) !important;
  font-size: .88rem !important;
  line-height: 1.45 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-warning {
  color: #b45309 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-badges,
body.flux-tool-body main[data-ai-workspace="short-output"] .ai-card-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .45rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-badges span {
  border: 1px solid var(--ai-border) !important;
  border-radius: 999px !important;
  padding: .28rem .6rem !important;
  background: #eff6ff !important;
  color: var(--ai-blue) !important;
  font-size: .76rem !important;
  font-weight: 760 !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-tag-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .48rem !important;
  margin-top: .78rem !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-tag-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: .32rem !important;
  min-height: 38px !important;
  padding: .42rem .68rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--ai-blue) !important;
  font-weight: 760 !important;
  cursor: pointer !important;
}

body.flux-tool-body main[data-ai-workspace="short-output"] .ai-spinner {
  width: 28px !important;
  height: 28px !important;
  border: 3px solid rgba(37, 99, 235, .16) !important;
  border-top-color: var(--ai-blue) !important;
  border-radius: 999px !important;
  animation: aiSpin .8s linear infinite !important;
}

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

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] {
  --ai-surface: #101827;
  --ai-soft: #0b1220;
  --ai-border: rgba(71, 85, 105, .82);
  --ai-border-strong: rgba(96, 165, 250, .55);
  --ai-text: #e5eefb;
  --ai-muted: #a7b5c8;
  --ai-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-title {
  color: var(--ai-text) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-title,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-note,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-disclaimer {
  color: var(--ai-muted) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-results-scroll {
  background: linear-gradient(180deg, rgba(15,23,42,.98), rgba(11,18,32,.96)) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-check,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-advanced,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-card,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-error-card,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-collection-panel,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-badge-row span,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="short-output"] .ai-tag-chip {
  background: rgba(15, 23, 42, .92) !important;
  border-color: var(--ai-border) !important;
  color: var(--ai-text) !important;
}

@media (max-width: 1120px) {
  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-grid {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-input-panel {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-results-scroll {
    min-height: 380px !important;
  }
}

@media (max-width: 760px) {
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] > .breadcrumb,
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="short-output"] > section.tool-layout {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero {
    margin: .1rem auto 1rem !important;
    padding: .75rem .7rem .45rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero h1 {
    font-size: clamp(2rem, 9vw, 2.85rem) !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .tool-page-hero p {
    font-size: .98rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-workspace-header,
  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-head {
    align-items: stretch !important;
    gap: .72rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-header-actions,
  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-result-toolbar {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field-grid,
  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-badge-row {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-form,
  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-results-scroll {
    padding: .86rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-field textarea {
    min-height: 104px !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-empty-state {
    min-height: 240px !important;
  }
}

@media (max-width: 430px) {
  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-mini-button {
    min-height: 44px !important;
    padding-left: .42rem !important;
    padding-right: .42rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="short-output"] .ai-mini-button span {
    font-size: .82rem !important;
    white-space: nowrap !important;
  }
}

/* Phase AI-1B: long-output AI document workspaces */
body.flux-tool-body main[data-ai-workspace="long-output"] {
  --ai-bg: #ffffff;
  --ai-surface: #ffffff;
  --ai-soft: #f5f9ff;
  --ai-panel: #f8fbff;
  --ai-border: rgba(191, 219, 254, .96);
  --ai-border-strong: rgba(147, 197, 253, .95);
  --ai-divider: #e5e7eb;
  --ai-accent: #2563eb;
  --ai-accent-hover: #1d4ed8;
  --ai-text: #0f172a;
  --ai-muted: #5f7088;
  --ai-blue: #2563eb;
  --ai-blue-soft: rgba(37, 99, 235, .1);
  --ai-shadow: 0 20px 58px rgba(37, 99, 235, .12);
  background:
    radial-gradient(circle at 12% 18%, rgba(125, 211, 252, .25), transparent 28rem),
    radial-gradient(circle at 86% 16%, rgba(196, 181, 253, .18), transparent 30rem),
    linear-gradient(180deg, #f7fbff 0%, #eef7ff 100%) !important;
}

body:has(main[data-ai-workspace="long-output"]) .loading-overlay,
body:has(main[data-ai-workspace="long-output"]) .loading-overlay.ai-short-loading-neutralized {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="long-output"] > .breadcrumb,
html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="long-output"] > section.tool-layout {
  width: calc(100% - 48px) !important;
  max-width: 1800px !important;
  margin-inline: auto !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero {
  margin: .8rem auto 1.25rem !important;
  padding: 1.25rem 1rem .7rem !important;
  max-width: 1120px !important;
  text-align: center !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero h1 {
  font-size: clamp(3rem, 4.3vw, 4.9rem) !important;
  line-height: .98 !important;
  letter-spacing: 0 !important;
  color: var(--ai-text) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero p {
  max-width: 920px !important;
  margin-inline: auto !important;
  color: var(--ai-muted) !important;
  font-size: clamp(1.04rem, 1.25vw, 1.35rem) !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 1800px !important;
  margin: 0 auto 1.2rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-workspace {
  border: 1px solid var(--ai-border) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: var(--ai-shadow) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field span,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field legend,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-check span {
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
  opacity: 1 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field input,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field textarea,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field select {
  background: #f8fafc !important;
  border-color: #dbeafe !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82) !important;
  opacity: 1 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field input::placeholder,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-check,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-advanced,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-badge-row span {
  background: #ffffff !important;
  border-color: #dbeafe !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  opacity: 1 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: 1rem 1.15rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .92)) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-kicker {
  margin: 0 !important;
  color: var(--ai-text) !important;
  font-size: 1rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-title {
  margin: .18rem 0 0 !important;
  color: var(--ai-muted) !important;
  font-size: .9rem !important;
  line-height: 1.32 !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-header-actions,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-toolbar,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: .55rem !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-grid.ai-document-grid {
  display: grid !important;
  grid-template-columns: minmax(320px, .38fr) minmax(0, .62fr) !important;
  align-items: stretch !important;
  min-height: 680px !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-input-panel {
  border-right: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, .96), rgba(255, 255, 255, .96)) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-panel {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) minmax(0, auto) !important;
  align-items: center !important;
  gap: .9rem !important;
  padding: 1rem 1.1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .94)) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head h3 {
  margin: 0 !important;
  color: var(--ai-text) !important;
  font-size: 1.15rem !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head p {
  margin: .22rem 0 0 !important;
  color: var(--ai-muted) !important;
  font-size: .9rem !important;
  line-height: 1.32 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-toolbar {
  justify-content: flex-end !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-mini-button,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-secondary-button,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-ghost-button {
  min-height: 42px !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .94) !important;
  color: #334155 !important;
  font-weight: 750 !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, .06) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-secondary-button,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-ghost-button {
  padding: .62rem .78rem !important;
  font-size: .88rem !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-mini-button:hover,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-secondary-button:hover,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-ghost-button:hover {
  transform: translateY(-1px) !important;
  border-color: var(--ai-border-strong) !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, .12) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-mini-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-secondary-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-ghost-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-generate-button:focus-visible {
  outline: 3px solid rgba(37, 99, 235, .22) !important;
  outline-offset: 2px !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row {
  padding: .75rem 1.1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: rgba(248, 251, 255, .72) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row .ai-ghost-button {
  min-height: 38px !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--ai-blue) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-scroll {
  flex: 1 1 auto !important;
  min-height: 460px !important;
  max-height: 650px !important;
  padding: 1rem !important;
  overflow: auto !important;
  background:
    linear-gradient(90deg, rgba(37, 99, 235, .035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(37, 99, 235, .035) 1px, transparent 1px);
  background-size: 32px 32px !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-empty {
  min-height: 420px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: .65rem !important;
  border: 1px dashed var(--ai-border-strong) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .82) !important;
  text-align: center !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-empty p {
  color: #475569 !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-empty.is-ai-generating {
  border-style: solid !important;
  border-color: rgba(37, 99, 235, .25) !important;
  background:
    radial-gradient(circle at 50% 12%, rgba(37, 99, 235, .08), transparent 42%),
    linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .9)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 16px 40px rgba(37, 99, 235, .08) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-empty.is-ai-generating .ai-spinner {
  width: 34px !important;
  height: 34px !important;
  border-width: 3px !important;
  border-color: rgba(37, 99, 235, .16) !important;
  border-top-color: var(--ai-blue) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-processing-steps {
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: .45rem !important;
  margin-top: .15rem !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-processing-steps span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  padding: .35rem .62rem !important;
  border: 1px solid rgba(191, 219, 254, .95) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .86) !important;
  color: #315173 !important;
  font-size: .78rem !important;
  font-weight: 750 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-surface {
  max-width: 980px !important;
  min-height: 420px !important;
  margin-inline: auto !important;
  padding: clamp(1.15rem, 2vw, 2rem) !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 22px !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .08) !important;
  color: var(--ai-text) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-header-block {
  padding-bottom: .9rem !important;
  margin-bottom: .8rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-label {
  margin: 0 0 .4rem !important;
  color: var(--ai-blue) !important;
  font-size: .78rem !important;
  font-weight: 850 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-header-block h3 {
  margin: 0 !important;
  color: var(--ai-text) !important;
  font-size: clamp(1.45rem, 2.2vw, 2.25rem) !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-subtitle {
  margin: .42rem 0 0 !important;
  color: var(--ai-muted) !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-section {
  padding: .55rem 0 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-section h4 {
  margin: 0 0 .42rem !important;
  color: var(--ai-text) !important;
  font-size: 1.03rem !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-section p,
body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-list {
  margin: .28rem 0 .72rem !important;
  color: #334155 !important;
  font-size: 1rem !important;
  line-height: 1.62 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-list {
  padding-left: 1.18rem !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-list li {
  display: list-item !important;
  margin: .24rem 0 !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-code {
  white-space: pre-wrap !important;
  padding: .85rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 14px !important;
  background: #f8fbff !important;
  color: var(--ai-text) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-footer {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(130px, auto) !important;
  gap: .7rem !important;
  padding: .85rem 1rem !important;
  border-top: 1px solid rgba(226, 232, 240, .98) !important;
  background: rgba(255, 255, 255, .96) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-stat {
  min-width: 0 !important;
  padding: .64rem .72rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #fff, #f8fbff) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-stat strong {
  display: block !important;
  color: var(--ai-blue) !important;
  font-size: 1.05rem !important;
  line-height: 1.1 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-stat small {
  display: block !important;
  margin-top: .18rem !important;
  color: var(--ai-muted) !important;
  font-size: .74rem !important;
  font-weight: 780 !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-footer .ai-status {
  align-self: center !important;
  margin: 0 !important;
  color: var(--ai-muted) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
  text-align: right !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-collection {
  padding: 1rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 12px 32px rgba(37, 99, 235, .08) !important;
}

body.flux-tool-body main[data-ai-workspace="long-output"] .ai-collection-item {
  width: 100% !important;
  justify-content: flex-start !important;
  margin-top: .55rem !important;
  padding: .74rem .82rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: var(--ai-text) !important;
  text-align: left !important;
}

@media (max-width: 1280px) {
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-grid.ai-document-grid {
    grid-template-columns: minmax(300px, .4fr) minmax(0, .6fr) !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-toolbar {
    justify-content: flex-start !important;
  }
}

@media (max-width: 1120px) {
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-grid.ai-document-grid {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-input-panel {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-scroll {
    max-height: none !important;
    min-height: 420px !important;
  }
}

@media (max-width: 760px) {
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="long-output"] > .breadcrumb,
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="long-output"] > section.tool-layout {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero {
    margin: .1rem auto .9rem !important;
    padding: .75rem .7rem .45rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero h1 {
    font-size: clamp(2.1rem, 9.2vw, 3.05rem) !important;
    line-height: 1 !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero p {
    font-size: .98rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-header,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head {
    align-items: stretch !important;
    padding: .85rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-header-actions,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-toolbar,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-mini-button,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-secondary-button,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-ghost-button {
    width: 100% !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: .58rem .48rem !important;
    font-size: .83rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-form,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-scroll {
    padding: .85rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-empty,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-surface {
    min-height: 300px !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-surface {
    padding: 1rem !important;
    border-radius: 18px !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    padding: .85rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-footer .ai-status {
    grid-column: 1 / -1 !important;
    text-align: left !important;
  }
}

@media (max-width: 430px) {
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-toolbar,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .42rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-toolbar .ai-secondary-button,
  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row .ai-ghost-button {
    min-height: 40px !important;
    font-size: .78rem !important;
    padding: .52rem .32rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-scroll {
    padding: .7rem !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] {
  --ai-bg: #0b1220;
  --ai-surface: #0f172a;
  --ai-soft: #111c30;
  --ai-panel: #111827;
  --ai-border: rgba(71, 85, 105, .8);
  --ai-border-strong: rgba(96, 165, 250, .7);
  --ai-divider: rgba(71, 85, 105, .8);
  --ai-accent: #60a5fa;
  --ai-accent-hover: #93c5fd;
  --ai-text: #e5edf8;
  --ai-muted: #a7b5c8;
  --ai-shadow: 0 24px 70px rgba(0, 0, 0, .34);
  background:
    radial-gradient(circle at 12% 18%, rgba(37, 99, 235, .2), transparent 28rem),
    radial-gradient(circle at 86% 16%, rgba(124, 58, 237, .16), transparent 30rem),
    linear-gradient(180deg, #0b1220 0%, #101827 100%) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-header-block h3,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-section h4 {
  color: var(--ai-text) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-title,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-subtitle,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-section p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-list,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-status {
  color: var(--ai-muted) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-input-panel,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-panel,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-result-head,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-action-row,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-footer,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-scroll {
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(11, 18, 32, .96)) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-check,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-advanced,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-secondary-button,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-ghost-button,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-empty,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-surface,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-doc-stat,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-document-collection,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-collection-item,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="long-output"] .ai-badge-row span {
  background: rgba(15, 23, 42, .92) !important;
  border-color: var(--ai-border) !important;
  color: var(--ai-text) !important;
}

html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-workspace-kicker,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-result-head h3,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-header-block h3,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-doc-section h4 {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-workspace-title,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-result-head p,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-subtitle,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-doc-section p,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-doc-list,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-status {
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
}

html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-label {
  color: #2563eb !important;
  -webkit-text-fill-color: #2563eb !important;
}

html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-result-head h3,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-header-block h3,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-doc-section h4 {
  color: #e5edf8 !important;
  -webkit-text-fill-color: #e5edf8 !important;
}

html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-workspace-title,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-result-head p,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-document-subtitle,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-doc-section p,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-doc-list,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-status {
  color: #a7b5c8 !important;
  -webkit-text-fill-color: #a7b5c8 !important;
}

html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="long-output"] #tool-workspace.tool-panel .ai-badge-row span {
  color: #e5edf8 !important;
  -webkit-text-fill-color: #e5edf8 !important;
}

/* Phase AI-1D: professional prompt builder workspaces */
body.flux-tool-body main[data-ai-workspace="prompt-builder"] {
  --ai-prompt-bg: #ffffff;
  --ai-prompt-surface: #ffffff;
  --ai-prompt-panel: #f8fbff;
  --ai-prompt-soft: #eef6ff;
  --ai-prompt-border: rgba(191, 219, 254, .96);
  --ai-prompt-border-strong: rgba(147, 197, 253, .98);
  --ai-prompt-text: #0f172a;
  --ai-prompt-muted: #5b6c85;
  --ai-prompt-accent: #2563eb;
  --ai-prompt-accent-strong: #1d4ed8;
  --ai-prompt-shadow: 0 22px 64px rgba(37, 99, 235, .12);
  background:
    radial-gradient(circle at 8% 18%, rgba(125, 211, 252, .23), transparent 30rem),
    radial-gradient(circle at 90% 12%, rgba(196, 181, 253, .17), transparent 30rem),
    linear-gradient(180deg, #f7fbff 0%, #eef7ff 100%) !important;
}

body:has(main[data-ai-workspace="prompt-builder"]) .loading-overlay,
body:has(main[data-ai-workspace="prompt-builder"]) .loading-overlay.ai-short-loading-neutralized {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

html body.flux-tool-body main#main#main.page-shell.tool-page.flux-tool-page[data-ai-workspace="prompt-builder"] {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="prompt-builder"] > .breadcrumb,
html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="prompt-builder"] > section.tool-layout {
  width: calc(100% - 48px) !important;
  max-width: 1800px !important;
  margin-inline: auto !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="prompt-builder"] > section.tool-layout {
  display: block !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="prompt-builder"] > section.tool-layout > .tool-main {
  width: 100% !important;
  max-width: 1800px !important;
  margin-inline: auto !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .tool-page-hero {
  margin: .65rem auto 1.15rem !important;
  padding: 1.1rem 1rem .65rem !important;
  max-width: 1140px !important;
  text-align: center !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .tool-page-hero h1 {
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  font-size: clamp(3rem, 4.3vw, 4.85rem) !important;
  line-height: .98 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .tool-page-hero p {
  max-width: 920px !important;
  margin-inline: auto !important;
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: clamp(1.04rem, 1.25vw, 1.34rem) !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 1800px !important;
  margin: 0 auto 1.2rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.flux-tool-body main#main#main.page-shell.tool-page.flux-tool-page[data-ai-workspace="prompt-builder"] #tool-workspace.tool-panel {
  padding: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-workspace {
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: var(--ai-prompt-shadow) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-header.ai-prompt-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: .85rem 1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .99), rgba(248, 251, 255, .94)) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-layout {
  display: grid !important;
  grid-template-columns: minmax(360px, .4fr) minmax(0, .6fr) !important;
  min-height: 760px !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-panel,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-panel {
  min-width: 0 !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: .75rem !important;
  padding: 1rem !important;
  border-right: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-panel {
  display: grid !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: 1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .94)) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-kicker,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-panel-title {
  margin: 0 !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-kicker {
  font-size: 1rem !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-title,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-muted {
  margin: .16rem 0 0 !important;
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: .88rem !important;
  line-height: 1.35 !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-panel-title {
  font-size: 1.2rem !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-header-actions,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-document-toolbar,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-transform-footer-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: .5rem !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .5rem !important;
  padding: .7rem !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(239, 247, 255, .95), rgba(255, 255, 255, .95)) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template {
  min-width: 0 !important;
  min-height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: .45rem !important;
  padding: .48rem .6rem !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .96) !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  font-size: .84rem !important;
  font-weight: 780 !important;
  text-align: left !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, .06) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template i,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-secondary-button i,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-generate-button i {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-form {
  display: grid !important;
  gap: .65rem !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section {
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 12px 28px rgba(37, 99, 235, .06) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-head,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-advanced summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .75rem !important;
  padding: .7rem .8rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .82) !important;
  background: rgba(248, 251, 255, .92) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-head h3,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-advanced summary span {
  margin: 0 !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  font-size: .95rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-head p {
  margin: 0 !important;
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: .78rem !important;
  line-height: 1.3 !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-fields {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .55rem !important;
  padding: .65rem !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field {
  min-width: 0 !important;
  display: grid !important;
  gap: .34rem !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field-wide,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field:has(textarea),
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-fields:has(.ai-prompt-field:nth-child(1):last-child) .ai-prompt-field {
  grid-column: 1 / -1 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field span {
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  font-size: .8rem !important;
  font-weight: 800 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field input,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field select,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field textarea {
  width: 100% !important;
  min-height: 42px !important;
  padding: .52rem .62rem !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 13px !important;
  background: #ffffff !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  font: 700 .86rem/1.35 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
  outline: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field textarea {
  min-height: 82px !important;
  resize: vertical !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-preview-card {
  margin: 1rem !important;
  padding: .85rem !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, rgba(239, 247, 255, .96), rgba(255, 255, 255, .96)) !important;
  box-shadow: 0 12px 30px rgba(37, 99, 235, .08) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-preview-card > strong {
  display: block !important;
  margin-bottom: .6rem !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-preview-card ul {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: .5rem !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-summary-row {
  min-width: 0 !important;
  display: grid !important;
  gap: .25rem !important;
  min-height: 58px !important;
  padding: .55rem .6rem !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .96) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-summary-row span {
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: .72rem !important;
  font-weight: 780 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-summary-row strong {
  min-width: 0 !important;
  color: var(--ai-prompt-accent) !important;
  -webkit-text-fill-color: var(--ai-prompt-accent) !important;
  font-size: .86rem !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-scroll {
  min-height: 0 !important;
  padding: 1rem !important;
  overflow: auto !important;
  background:
    linear-gradient(90deg, rgba(37, 99, 235, .035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(37, 99, 235, .035) 1px, transparent 1px);
  background-size: 32px 32px !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty {
  min-height: 420px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: .65rem !important;
  border: 1px dashed var(--ai-prompt-border-strong) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .84) !important;
  text-align: center !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty i {
  width: 38px !important;
  height: 38px !important;
  color: var(--ai-prompt-accent) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty strong,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary strong {
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty p,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-muted {
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-document,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection {
  max-width: 980px !important;
  min-height: 420px !important;
  margin-inline: auto !important;
  padding: clamp(1rem, 1.8vw, 1.65rem) !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 22px !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .08) !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-document-label {
  margin: 0 0 .42rem !important;
  color: var(--ai-prompt-accent) !important;
  -webkit-text-fill-color: var(--ai-prompt-accent) !important;
  font-size: .76rem !important;
  font-weight: 850 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-pre {
  width: 100% !important;
  margin: 0 0 1rem !important;
  padding: 1rem !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 16px !important;
  background: #f8fbff !important;
  color: #172033 !important;
  -webkit-text-fill-color: #172033 !important;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere !important;
  font: 650 .95rem/1.6 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-negative {
  background: #fff7ed !important;
  border-color: rgba(253, 186, 116, .75) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary {
  display: grid !important;
  gap: .6rem !important;
  margin-top: 1rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dl {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .5rem !important;
  margin: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dt,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dd {
  min-width: 0 !important;
  margin: 0 !important;
  padding: .52rem .62rem !important;
  border: 1px solid rgba(191, 219, 254, .86) !important;
  background: #f8fbff !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dt {
  border-radius: 12px 0 0 12px !important;
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: .78rem !important;
  font-weight: 800 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dd {
  border-radius: 0 12px 12px 0 !important;
  color: var(--ai-prompt-accent) !important;
  -webkit-text-fill-color: var(--ai-prompt-accent) !important;
  font-size: .84rem !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection {
  display: grid !important;
  gap: .6rem !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection-item {
  width: 100% !important;
  min-height: 70px !important;
  display: grid !important;
  gap: .25rem !important;
  justify-items: start !important;
  padding: .75rem .85rem !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 15px !important;
  background: #ffffff !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
  text-align: left !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection-item span {
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: .8rem !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-footer {
  display: grid !important;
  grid-template-columns: minmax(160px, 1fr) auto !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: .85rem 1rem !important;
  border-top: 1px solid rgba(226, 232, 240, .98) !important;
  background: rgba(255, 255, 255, .96) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-status {
  margin: 0 !important;
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-secondary-button,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-generate-button {
  min-height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .45rem !important;
  border: 1px solid var(--ai-prompt-border) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .94) !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  padding: .58rem .75rem !important;
  font-size: .88rem !important;
  font-weight: 780 !important;
  box-shadow: 0 12px 28px rgba(37, 99, 235, .08) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-generate-button {
  min-width: 190px !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #0ea5e9, #2563eb 58%, #7c3aed) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 16px 36px rgba(37, 99, 235, .28) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-secondary-button:hover,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-generate-button:hover,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template:hover,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection-item:hover {
  transform: translateY(-1px) !important;
  border-color: var(--ai-prompt-border-strong) !important;
  box-shadow: 0 16px 34px rgba(37, 99, 235, .13) !important;
}

body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-secondary-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-generate-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template:focus-visible,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field input:focus,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field textarea:focus,
body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field select:focus {
  outline: 3px solid rgba(37, 99, 235, .22) !important;
  outline-offset: 2px !important;
  border-color: var(--ai-prompt-border-strong) !important;
}

@media (max-width: 1180px) {
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-panel {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-preview-card ul {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="prompt-builder"] > .breadcrumb,
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="prompt-builder"] > section.tool-layout {
    width: calc(100% - 20px) !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .tool-page-hero {
    margin: .35rem auto .7rem !important;
    padding: .72rem .65rem .4rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .tool-page-hero h1 {
    font-size: clamp(2rem, 10vw, 2.75rem) !important;
    line-height: 1.05 !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .tool-page-hero p {
    font-size: .95rem !important;
    line-height: 1.45 !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-header.ai-prompt-topbar,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-head,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-footer {
    grid-template-columns: 1fr !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-header-actions,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-document-toolbar,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-transform-footer-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template-grid,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-fields,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-preview-card ul,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dl {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-panel,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-scroll,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-head,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-footer {
    padding: .75rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-document,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection {
    min-height: 280px !important;
  }

  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-secondary-button,
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-generate-button {
    width: 100% !important;
    min-width: 0 !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] {
  --ai-prompt-bg: #020817;
  --ai-prompt-surface: #0b1220;
  --ai-prompt-panel: #101827;
  --ai-prompt-soft: #0f1b2e;
  --ai-prompt-border: rgba(96, 165, 250, .34);
  --ai-prompt-border-strong: rgba(125, 211, 252, .58);
  --ai-prompt-text: #f8fafc;
  --ai-prompt-muted: #c5d2e5;
  --ai-prompt-accent: #7dd3fc;
  --ai-prompt-accent-strong: #38bdf8;
  --ai-prompt-shadow: 0 24px 70px rgba(0, 0, 0, .38);
  background:
    radial-gradient(circle at 8% 18%, rgba(14, 165, 233, .14), transparent 30rem),
    radial-gradient(circle at 90% 12%, rgba(124, 58, 237, .14), transparent 30rem),
    linear-gradient(180deg, #07111f 0%, #020817 100%) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-builder-panel,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-panel,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-header.ai-prompt-topbar,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-output-head,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-footer {
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(8, 13, 24, .98)) !important;
  border-color: var(--ai-prompt-border) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-preview-card,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template-grid,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-document,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty {
  background: rgba(15, 23, 42, .9) !important;
  border-color: var(--ai-prompt-border) !important;
  box-shadow: 0 18px 46px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-head,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-advanced summary,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-summary-row,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dt,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary dd,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-pre {
  background: rgba(8, 13, 24, .96) !important;
  border-color: var(--ai-prompt-border) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field input,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field select,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-secondary-button,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-template,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-collection-item {
  background: rgba(8, 13, 24, .94) !important;
  border-color: var(--ai-prompt-border) !important;
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-pre,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-field span,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-panel-title,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-empty strong,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-settings-summary strong {
  color: var(--ai-prompt-text) !important;
  -webkit-text-fill-color: var(--ai-prompt-text) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-workspace-title,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-muted,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-status,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="prompt-builder"] .ai-prompt-section-head p {
  color: var(--ai-prompt-muted) !important;
  -webkit-text-fill-color: var(--ai-prompt-muted) !important;
}

@media (prefers-reduced-motion: reduce) {
  body.flux-tool-body main[data-ai-workspace="prompt-builder"] * {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}

/* Phase AI-1C: premium text transformation workspaces */
body.flux-tool-body main[data-ai-workspace="transform-output"] {
  --ai-bg: #ffffff;
  --ai-surface: #ffffff;
  --ai-soft: #f5f9ff;
  --ai-panel: #f8fbff;
  --ai-border: rgba(191, 219, 254, .96);
  --ai-border-strong: rgba(147, 197, 253, .95);
  --ai-divider: #e5e7eb;
  --ai-accent: #2563eb;
  --ai-accent-hover: #1d4ed8;
  --ai-text: #0f172a;
  --ai-muted: #5f7088;
  --ai-blue-soft: rgba(37, 99, 235, .1);
  --ai-shadow: 0 20px 58px rgba(37, 99, 235, .12);
  background:
    radial-gradient(circle at 12% 18%, rgba(125, 211, 252, .23), transparent 28rem),
    radial-gradient(circle at 86% 16%, rgba(196, 181, 253, .17), transparent 30rem),
    linear-gradient(180deg, #f7fbff 0%, #eef7ff 100%) !important;
}

body:has(main[data-ai-workspace="transform-output"]) .loading-overlay,
body:has(main[data-ai-workspace="transform-output"]) .loading-overlay.ai-short-loading-neutralized {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

html body.flux-tool-body main#main#main.page-shell.tool-page.flux-tool-page[data-ai-workspace="transform-output"] {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="transform-output"] > .breadcrumb,
html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="transform-output"] > section.tool-layout {
  width: calc(100% - 48px) !important;
  max-width: 1800px !important;
  margin-inline: auto !important;
}

html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="transform-output"] > section.tool-layout > .tool-main {
  width: 100% !important;
  max-width: 1800px !important;
  margin-inline: auto !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .tool-page-hero {
  margin: .65rem auto 1.15rem !important;
  padding: 1.1rem 1rem .65rem !important;
  max-width: 1140px !important;
  text-align: center !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .tool-page-hero h1 {
  color: var(--ai-text) !important;
  font-size: clamp(3rem, 4.3vw, 4.85rem) !important;
  line-height: .98 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .tool-page-hero p {
  max-width: 920px !important;
  margin-inline: auto !important;
  color: var(--ai-muted) !important;
  font-size: clamp(1.04rem, 1.25vw, 1.34rem) !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 1800px !important;
  margin: 0 auto 1.2rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.flux-tool-body main#main#main.page-shell.tool-page.flux-tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel {
  padding: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-workspace {
  border: 1px solid var(--ai-border) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .95) !important;
  box-shadow: var(--ai-shadow) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-workspace-header.ai-transform-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: .85rem 1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .92)) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-workspace-kicker {
  margin: 0 !important;
  color: var(--ai-text) !important;
  font-size: 1rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-workspace-title {
  margin: .16rem 0 0 !important;
  color: var(--ai-muted) !important;
  font-size: .88rem !important;
  line-height: 1.3 !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-header-actions,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-document-toolbar,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: .5rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-header-actions {
  justify-content: flex-end !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-editor-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: stretch !important;
  min-height: 620px !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-original {
  border-right: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .8rem !important;
  min-height: 66px !important;
  padding: .82rem 1rem !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .94)) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane-head h3 {
  margin: 0 !important;
  color: var(--ai-text) !important;
  font-size: 1.12rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane-head p {
  margin: .2rem 0 0 !important;
  color: var(--ai-muted) !important;
  font-size: .88rem !important;
  line-height: 1.3 !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-input {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 340px !important;
  resize: vertical !important;
  padding: 1rem 1rem !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
  font: 600 1.02rem/1.65 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
  outline: 0 !important;
  opacity: 1 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-input::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-input:focus {
  box-shadow: inset 0 0 0 3px rgba(37, 99, 235, .13) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-options {
  padding: .8rem 1rem 1rem !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, .9), rgba(239, 247, 255, .7)) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-options-head {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: .75rem !important;
  margin-bottom: .65rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-options-head strong {
  color: var(--ai-text) !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-options-head span {
  color: var(--ai-muted) !important;
  font-size: .82rem !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-option-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: .55rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-check {
  min-width: 0 !important;
  display: grid !important;
  gap: .34rem !important;
  align-content: center !important;
  min-height: 66px !important;
  padding: .55rem .65rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 15px !important;
  background: rgba(255, 255, 255, .92) !important;
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
  box-shadow: 0 10px 22px rgba(37, 99, 235, .06) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field-wide {
  grid-column: 1 / -1 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field span,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-check span {
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-check {
  grid-template-columns: auto 1fr !important;
  align-items: center !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-check input {
  width: 18px !important;
  height: 18px !important;
  accent-color: var(--ai-accent) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field input,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field select,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field textarea {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 38px !important;
  border: 1px solid #dbeafe !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  padding: .48rem .62rem !important;
  font: 700 .86rem/1.35 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
  outline: 0 !important;
  opacity: 1 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field textarea {
  min-height: 62px !important;
  resize: vertical !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-output {
  flex: 1 1 auto !important;
  min-height: 488px !important;
  max-height: 640px !important;
  padding: 1rem !important;
  overflow: auto !important;
  background:
    linear-gradient(90deg, rgba(37, 99, 235, .035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(37, 99, 235, .035) 1px, transparent 1px);
  background-size: 32px 32px !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-empty {
  min-height: 420px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: .65rem !important;
  border: 1px dashed var(--ai-border-strong) !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, .84) !important;
  text-align: center !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-empty i {
  width: 38px !important;
  height: 38px !important;
  color: var(--ai-accent) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-empty strong {
  color: var(--ai-text) !important;
  font-size: 1.05rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-empty p {
  margin: 0 !important;
  color: var(--ai-muted) !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-document,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-diff,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection {
  max-width: 860px !important;
  min-height: 420px !important;
  margin-inline: auto !important;
  padding: clamp(1rem, 1.8vw, 1.65rem) !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 22px !important;
  background: rgba(255, 255, 255, .98) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .08) !important;
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-document-label {
  margin: 0 0 .42rem !important;
  color: var(--ai-accent) !important;
  -webkit-text-fill-color: var(--ai-accent) !important;
  font-size: .76rem !important;
  font-weight: 850 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-document h3,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-diff h3,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection h3 {
  margin: 0 0 .75rem !important;
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
  font-size: clamp(1.28rem, 2vw, 1.85rem) !important;
  line-height: 1.16 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-document-body p,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-diff p,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection p {
  margin: .35rem 0 .9rem !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  font-size: 1rem !important;
  line-height: 1.65 !important;
  font-weight: 620 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-tweet-preview {
  display: grid !important;
  gap: .8rem !important;
  padding: 1rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 18px !important;
  background: #f8fbff !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-tweet-preview span,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-doc-meta small {
  color: var(--ai-muted) !important;
  -webkit-text-fill-color: var(--ai-muted) !important;
  font-size: .78rem !important;
  font-weight: 780 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-doc-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .5rem !important;
  margin-top: 1rem !important;
  padding-top: .9rem !important;
  border-top: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-doc-meta span {
  display: inline-flex !important;
  align-items: center !important;
  gap: .35rem !important;
  min-height: 34px !important;
  padding: .35rem .6rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 999px !important;
  background: #f8fbff !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-doc-meta i {
  width: 16px !important;
  height: 16px !important;
  color: var(--ai-accent) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-diff-row {
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important;
  gap: .7rem !important;
  align-items: start !important;
  padding: .7rem 0 !important;
  border-top: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-diff-row > span {
  display: inline-flex !important;
  justify-content: center !important;
  min-height: 30px !important;
  padding: .36rem .55rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 999px !important;
  background: #f8fbff !important;
  color: var(--ai-accent) !important;
  -webkit-text-fill-color: var(--ai-accent) !important;
  font-size: .72rem !important;
  font-weight: 850 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-diff-added {
  border-radius: 6px !important;
  background: rgba(34, 197, 94, .16) !important;
  color: #166534 !important;
  -webkit-text-fill-color: #166534 !important;
  padding: .08rem .18rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-diff-removed {
  border-radius: 6px !important;
  background: rgba(239, 68, 68, .15) !important;
  color: #991b1b !important;
  -webkit-text-fill-color: #991b1b !important;
  padding: .08rem .18rem !important;
  text-decoration: line-through !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection {
  display: grid !important;
  gap: .55rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-collection-item {
  width: 100% !important;
  min-height: 74px !important;
  display: grid !important;
  gap: .22rem !important;
  justify-items: start !important;
  padding: .75rem .85rem !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 15px !important;
  background: #ffffff !important;
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
  text-align: left !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-collection-item small,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-collection-item span {
  color: var(--ai-muted) !important;
  -webkit-text-fill-color: var(--ai-muted) !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer {
  display: grid !important;
  grid-template-columns: minmax(160px, 1fr) auto !important;
  align-items: center !important;
  gap: 1rem !important;
  padding: .85rem 1rem !important;
  border-top: 1px solid rgba(226, 232, 240, .98) !important;
  background: rgba(255, 255, 255, .96) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-status {
  margin: 0 !important;
  color: var(--ai-muted) !important;
  -webkit-text-fill-color: var(--ai-muted) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-mini-button,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-generate-button {
  min-height: 42px !important;
  border: 1px solid var(--ai-border) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, .94) !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  font-weight: 760 !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, .06) !important;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button {
  padding: .58rem .72rem !important;
  font-size: .84rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-generate-button {
  min-width: 170px !important;
  padding: .68rem 1rem !important;
  border-color: transparent !important;
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 14px 30px rgba(37, 99, 235, .22) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button:hover,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button:hover,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-generate-button:hover {
  transform: translateY(-1px) !important;
  border-color: var(--ai-border-strong) !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, .12) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-generate-button:focus-visible,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field input:focus,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field textarea:focus,
body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field select:focus {
  outline: 3px solid rgba(37, 99, 235, .22) !important;
  outline-offset: 2px !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-mobile-primary {
  display: none !important;
}

@media (max-width: 1340px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-workspace-header.ai-transform-topbar,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-topbar {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-header-actions {
    justify-content: flex-start !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer {
    display: grid !important;
  }
}

@media (max-width: 1120px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-editor-grid {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-original {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(226, 232, 240, .98) !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-output {
    max-height: none !important;
  }
}

@media (max-width: 760px) {
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="transform-output"] > .breadcrumb,
  html body.flux-tool-body main#main#main.tool-page[data-ai-workspace="transform-output"] > section.tool-layout {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .tool-page-hero {
    margin: .1rem auto .8rem !important;
    padding: .7rem .7rem .4rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .tool-page-hero h1 {
    font-size: clamp(2rem, 9vw, 3rem) !important;
    line-height: 1 !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .tool-page-hero p {
    font-size: .98rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-workspace-header.ai-transform-topbar,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane-head,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer {
    align-items: stretch !important;
    padding: .78rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-header-actions,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-document-toolbar,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-generate-button {
    width: 100% !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: .56rem .44rem !important;
    font-size: .8rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-input {
    min-height: 250px !important;
    font-size: .98rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-option-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-options-head {
    display: grid !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-mobile-primary {
    display: inline-flex !important;
    margin: .8rem !important;
    width: calc(100% - 1.6rem) !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer .ai-generate-button {
    display: none !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-output {
    min-height: 330px !important;
    padding: .75rem !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-empty,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-document,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-diff,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection {
    min-height: 280px !important;
    border-radius: 18px !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-diff-row {
    grid-template-columns: 1fr !important;
    gap: .35rem !important;
  }
}

@media (max-width: 430px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-header-actions,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-document-toolbar,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer-actions,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-option-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button span,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button span {
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field-wide {
    grid-column: 1 / -1 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button,
  body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-generate-button {
    transition: none !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] {
  --ai-bg: #0b1220;
  --ai-surface: #0f172a;
  --ai-soft: #111c30;
  --ai-panel: #111827;
  --ai-border: rgba(71, 85, 105, .8);
  --ai-border-strong: rgba(96, 165, 250, .7);
  --ai-divider: rgba(71, 85, 105, .8);
  --ai-accent: #60a5fa;
  --ai-accent-hover: #93c5fd;
  --ai-text: #e5edf8;
  --ai-muted: #a7b5c8;
  --ai-shadow: 0 24px 70px rgba(0, 0, 0, .34);
  background:
    radial-gradient(circle at 12% 18%, rgba(37, 99, 235, .2), transparent 28rem),
    radial-gradient(circle at 86% 16%, rgba(124, 58, 237, .16), transparent 30rem),
    linear-gradient(180deg, #0b1220 0%, #101827 100%) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-pane-head,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-options,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-output,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-footer {
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(11, 18, 32, .96)) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-input,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-check,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field input,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-field select,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-secondary-button,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-ghost-button,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-empty,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-document,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-diff,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-collection-item,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-doc-meta span,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-tweet-preview {
  background: rgba(15, 23, 42, .92) !important;
  border-color: var(--ai-border) !important;
  color: var(--ai-text) !important;
  -webkit-text-fill-color: var(--ai-text) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-document-body p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-diff p,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"] .ai-transform-collection p {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

/* Shared transformation tools: compact three-pane workspace based on the approved AI app layout. */
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] {
  --ai-layout-width: min(1800px, calc(100% - 48px));
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] > .breadcrumb,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] > .tool-layout {
  width: var(--ai-layout-width) !important;
  max-width: var(--ai-layout-width) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-page-hero {
  margin: .25rem auto .85rem !important;
  padding: .35rem 1rem .55rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-page-hero .eyebrow {
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-page-hero h1 {
  margin: 0 !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 27.52px !important;
  line-height: 33.58px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-page-hero p {
  max-width: 860px !important;
  margin: .35rem auto 0 !important;
  font-size: 1rem !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three {
  display: flex !important;
  flex-direction: column !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three .ai-workspace-header {
  flex: 0 0 auto !important;
  min-height: 56px !important;
  padding: .52rem .72rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three .ai-workspace-title {
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three .ai-header-actions {
  gap: .42rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three .ai-secondary-button {
  min-height: 38px !important;
  padding: .48rem .68rem !important;
  border-radius: 13px !important;
  font-size: .86rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-three-grid {
  flex: 1 1 auto !important;
  display: grid !important;
  min-height: 0 !important;
  grid-template-columns: minmax(260px, .82fr) minmax(520px, 1.7fr) minmax(262px, .74fr) !important;
  align-items: stretch !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-three-grid .ai-transform-pane {
  min-height: 0 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-original {
  gap: .58rem !important;
  padding: .78rem !important;
  border-right: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-original .ai-transform-pane-head {
  display: block !important;
  min-height: 0 !important;
  padding: 0 .15rem !important;
  border: 0 !important;
  background: transparent !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-original .ai-transform-pane-head h3 {
  font-size: .98rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-original .ai-transform-pane-head p {
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-input {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  border: 1px solid var(--ai-border-strong) !important;
  border-radius: 18px !important;
  background: #fbfdff !important;
  padding: .86rem !important;
  font-size: .96rem !important;
  line-height: 1.48 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-inline-custom .ai-transform-field {
  min-height: 0 !important;
  padding: .48rem .55rem !important;
  box-shadow: none !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-inline-custom textarea {
  min-height: 64px !important;
  height: 64px !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-improved {
  border-right: 1px solid rgba(226, 232, 240, .98) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-improved-head {
  min-height: 54px !important;
  padding: .52rem .72rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-improved-head h3 {
  font-size: 1rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-improved-head p {
  font-size: .78rem !important;
  margin-top: .05rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-result-toolbar {
  gap: .38rem !important;
  justify-content: flex-end !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-output {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: .78rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-empty {
  min-height: 100% !important;
  height: 100% !important;
  border-radius: 18px !important;
  gap: .5rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-empty strong {
  max-width: 34ch !important;
  font-size: 1rem !important;
  line-height: 1.3 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-empty p {
  max-width: 42ch !important;
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .88rem !important;
  line-height: 1.38 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-document,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-diff,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-collection {
  min-height: 0 !important;
  max-width: none !important;
  padding: .92rem !important;
  border-radius: 18px !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-document h3,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-diff h3,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-collection h3 {
  font-size: 1.1rem !important;
  line-height: 1.25 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-document-body p,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-diff p,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-collection p {
  font-size: .95rem !important;
  line-height: 1.55 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings {
  min-width: 0 !important;
  background: linear-gradient(180deg, #ffffff, #f8fbff) !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-options {
  flex: 1 1 auto !important;
  padding: .72rem .7rem .48rem !important;
  background: transparent !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-options-head {
  margin-bottom: .46rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-options-head strong {
  font-size: .96rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-options-head span {
  display: none !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-option-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .44rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-field,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-check {
  min-height: 54px !important;
  padding: .42rem .48rem !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-field span,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-transform-check span {
  font-size: .75rem !important;
  line-height: 1.15 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings select,
body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings input {
  min-height: 36px !important;
  padding: .42rem .48rem !important;
  font-size: .84rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings-actions {
  margin-top: auto !important;
  padding: .72rem .7rem .45rem !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings-actions .ai-generate-button {
  width: 100% !important;
  min-height: 50px !important;
  justify-content: center !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings .ai-status {
  margin: 0 .72rem .68rem !important;
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-workspace-note {
  margin-top: .8rem !important;
}

@media (min-width: 1180px) and (min-height: 690px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three {
    height: clamp(500px, calc(100svh - 270px), 612px) !important;
  }
}

@media (min-width: 1180px) and (max-width: 1320px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-three-grid {
    grid-template-columns: minmax(240px, .78fr) minmax(460px, 1.55fr) minmax(246px, .72fr) !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-workspace-three .ai-secondary-button {
    padding-inline: .52rem !important;
    font-size: .8rem !important;
  }
}

@media (max-width: 1120px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-three-grid {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-improved,
  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-original {
    border-right: 0 !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings {
    border-top: 1px solid rgba(226, 232, 240, .98) !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] {
    --ai-layout-width: calc(100% - 24px);
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-page-hero h1 {
    font-size: clamp(2.1rem, 8.4vw, 2.7rem) !important;
    line-height: 1.02 !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings-actions {
    display: none !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-input {
    min-height: 220px !important;
  }

  body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-inline-custom textarea {
    min-height: 72px !important;
    height: 72px !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .tool-page-hero h1 {
  color: #e5edf8 !important;
  -webkit-text-fill-color: #e5edf8 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-input,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-settings,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace="transform-output"][data-ai-transform-layout="three-pane"] .ai-transform-inline-custom .ai-transform-field {
  background: rgba(15, 23, 42, .92) !important;
}

html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-workspace-kicker,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-pane-head h3,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-document h3,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-diff h3,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-options-head strong,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-field span,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-check span {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-workspace-title,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-pane-head p,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-options-head span,
html:not([data-theme="dark"]) body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-status {
  color: #5f7088 !important;
  -webkit-text-fill-color: #5f7088 !important;
}

html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-pane-head h3,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-document h3,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-diff h3,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-options-head strong,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-field span,
html[data-theme="dark"] body.flux-tool-body:not(.generic-tool-studio-active):not(.passport-editor-active) main#main.tool-page[data-ai-workspace="transform-output"] #tool-workspace.tool-panel .ai-transform-check span {
  color: #e5edf8 !important;
  -webkit-text-fill-color: #e5edf8 !important;
}

/* Phase AI-UI-2A: shared AI page hierarchy and above-the-fold alignment. */
body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) {
  --ai-layout-width: min(1800px, calc(100% - 48px));
  --ai-trust-border: rgba(191, 219, 254, .86);
  --ai-trust-text: #334155;
  --ai-trust-muted: #2563eb;
}

html body.flux-tool-body main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) > .breadcrumb,
html body.flux-tool-body main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) > section.tool-layout {
  width: var(--ai-layout-width) !important;
  max-width: var(--ai-layout-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-page-hero {
  max-width: 1120px !important;
  margin: .15rem auto .55rem !important;
  padding: 1rem 1rem .5rem !important;
  text-align: center !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-page-hero .eyebrow {
  display: none !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-page-hero h1 {
  font-size: clamp(2.35rem, 4vw, 4.05rem) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  margin: 0 auto !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-page-hero p {
  max-width: 880px !important;
  margin: .52rem auto 0 !important;
  font-size: clamp(1rem, 1.16vw, 1.16rem) !important;
  line-height: 1.4 !important;
}

html body.flux-tool-body main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) > section.tool-layout > .tool-main {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
}

html body.flux-tool-body main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) #tool-workspace.tool-panel {
  order: 2 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html body.flux-tool-body main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) #tool-workspace.tool-panel::before,
html body.flux-tool-body main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) #tool-workspace.tool-panel::after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note {
  order: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: .45rem !important;
  width: fit-content !important;
  max-width: min(820px, calc(100% - 32px)) !important;
  margin: 0 auto .72rem !important;
  padding: .35rem !important;
  border: 1px solid var(--ai-trust-border) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(248, 251, 255, .84)) !important;
  box-shadow: 0 14px 34px rgba(37, 99, 235, .08) !important;
}

html body.flux-tool-body main#main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note {
  width: fit-content !important;
  max-width: min(820px, calc(100% - 32px)) !important;
  margin: 0 auto .72rem !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .42rem !important;
  min-height: 34px !important;
  padding: 0 .82rem !important;
  border: 1px solid rgba(191, 219, 254, .92) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .92) !important;
  color: var(--ai-trust-text) !important;
  -webkit-text-fill-color: var(--ai-trust-text) !important;
  font-size: .82rem !important;
  font-weight: 780 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .04) !important;
}

html body.flux-tool-body main#main#main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note span {
  min-height: 34px !important;
  padding: 0 .82rem !important;
  font-size: .82rem !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note :is(svg, i) {
  width: 17px !important;
  height: 17px !important;
  color: var(--ai-trust-muted) !important;
  stroke-width: 2.25 !important;
  flex: 0 0 auto !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .ai-form > .ai-badge-row {
  display: none !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .ai-workspace-header,
body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .ai-result-head,
body.flux-tool-body main.tool-page[data-ai-workspace="prompt-builder"] .ai-prompt-output-head,
body.flux-tool-body main.tool-page[data-ai-workspace="prompt-builder"] .ai-prompt-footer,
body.flux-tool-body main.tool-page[data-ai-workspace="transform-output"] .ai-transform-pane-head,
body.flux-tool-body main.tool-page[data-ai-workspace="transform-output"] .ai-transform-footer {
  min-height: 66px !important;
  padding: .62rem .9rem !important;
}

body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .ai-header-actions {
  gap: .48rem !important;
}

@media (max-width: 1120px) {
  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) {
    --ai-layout-width: min(100% - 32px, 1800px);
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-page-hero {
    margin-bottom: .5rem !important;
    padding-top: .85rem !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) {
    --ai-layout-width: calc(100% - 24px);
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-page-hero {
    margin: 0 auto .42rem !important;
    padding: .62rem .5rem .32rem !important;
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-page-hero h1 {
    font-size: clamp(1.72rem, 8.2vw, 2.35rem) !important;
    line-height: 1.05 !important;
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-page-hero p {
    display: block !important;
    font-size: .94rem !important;
    line-height: 1.35 !important;
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-workspace-note {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: .6rem !important;
    border-radius: 20px !important;
  }

  html body.flux-tool-body main#main#main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-workspace-note {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: .6rem !important;
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .tool-workspace-note span {
    flex: 1 1 100% !important;
    min-height: 36px !important;
    padding-inline: .65rem !important;
  }

  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .ai-workspace-header,
  body.flux-tool-body main.tool-page:is(
    [data-ai-workspace="short-output"],
    [data-ai-workspace="long-output"],
    [data-ai-workspace="transform-output"],
    [data-ai-workspace="prompt-builder"]
  ) .ai-result-head,
  body.flux-tool-body main.tool-page[data-ai-workspace="prompt-builder"] .ai-prompt-output-head,
  body.flux-tool-body main.tool-page[data-ai-workspace="prompt-builder"] .ai-prompt-footer,
  body.flux-tool-body main.tool-page[data-ai-workspace="transform-output"] .ai-transform-pane-head,
  body.flux-tool-body main.tool-page[data-ai-workspace="transform-output"] .ai-transform-footer {
    min-height: 0 !important;
    padding: .72rem !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) {
  --ai-trust-border: rgba(96, 165, 250, .28);
  --ai-trust-text: #e5edf8;
  --ai-trust-muted: #7dd3fc;
}

html[data-theme="dark"] body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note {
  background: linear-gradient(180deg, rgba(15, 23, 42, .86), rgba(11, 18, 32, .78)) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) .tool-workspace-note span {
  border-color: rgba(96, 165, 250, .26) !important;
  background: rgba(15, 23, 42, .9) !important;
}

/* Phase AI-UI-2B: YouTube Title Generator desktop no-scroll workspace prototype. */
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  margin: 0 !important;
  min-width: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-result-panel,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
  min-width: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: .9rem !important;
  padding: 1rem !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-option-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .72rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-length-field {
  grid-column: 1 / -1 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-scroll,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-generate-wrap {
  min-width: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-scroll {
  display: flex !important;
  flex-direction: column !important;
  gap: .82rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-custom-niche-field[hidden] {
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-custom-niche-field {
  grid-column: 1 / -1 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel .ai-field-label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel .ai-field input::placeholder,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel .ai-field textarea::placeholder {
  color: #9caec4 !important;
  opacity: 1 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-option-grid,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced {
  flex: 0 0 auto !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-generate-wrap {
  display: grid !important;
  gap: .5rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-header-result-toolbar {
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-field {
  position: relative !important;
  z-index: 12 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-combobox {
  position: relative !important;
  display: grid !important;
  width: 100% !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] #aiNicheSearch {
  width: 100% !important;
  padding-right: 2.25rem !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-toggle {
  position: absolute !important;
  top: 50% !important;
  right: .42rem !important;
  width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #2563eb !important;
  transform: translateY(-50%) !important;
  cursor: pointer !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-toggle svg {
  width: 17px !important;
  height: 17px !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-combobox.is-open .ai-niche-toggle svg {
  transform: rotate(180deg) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-list {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 40 !important;
  max-height: 184px !important;
  padding: .32rem !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border: 1px solid #bfdbfe !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 18px 38px rgba(37, 99, 235, .16) !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-option {
  width: 100% !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: .42rem .56rem !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #0f172a !important;
  font-size: .87rem !important;
  font-weight: 720 !important;
  line-height: 1.15 !important;
  text-align: left !important;
  cursor: pointer !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-option:hover,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-option.is-active {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-option.is-selected {
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}

body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-niche-option.is-empty {
  color: #64748b !important;
  cursor: default !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="youtube-title-generator"] {
    --ai-ytt-shell-width: min(1760px, calc(100vw - clamp(72px, 6vw, 160px)));
    --ai-ytt-top-offset: clamp(248px, 31svh, 280px);
    --ai-ytt-workspace-height: clamp(460px, calc(100svh - var(--ai-ytt-top-offset)), 660px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-title-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="youtube-title-generator"] > section.tool-layout {
    width: var(--ai-ytt-shell-width) !important;
    max-width: var(--ai-ytt-shell-width) !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-title-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero {
    max-width: 1050px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero h1 {
    font-size: clamp(2.35rem, 3.45vw, 3.55rem) !important;
    line-height: 1.04 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero p {
    max-width: 820px !important;
    margin: .24rem auto 0 !important;
    font-size: clamp(.98rem, 1.04vw, 1.08rem) !important;
    line-height: 1.26 !important;
  }

  html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-workspace-note {
    margin: 0 auto .45rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  html body.flux-tool-body main#main#main.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note span,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-ytt-workspace-height) !important;
    min-height: 460px !important;
    max-height: 660px !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-kicker {
    font-size: .98rem !important;
    justify-self: start !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-header-result-toolbar {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .38rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .86rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-header .ai-mini-button svg {
    width: 18px !important;
    height: 18px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-count-pill {
    min-width: 24px !important;
    height: 24px !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-secondary-button,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-ghost-button {
    min-height: 38px !important;
    padding: .46rem .68rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace-grid {
    display: block !important;
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-form {
    height: 100% !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(286px, 318px) minmax(560px, 1fr) minmax(258px, 286px) !important;
    grid-template-areas: "input result options" !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel {
    grid-area: input !important;
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: .9rem 1rem !important;
    border-right: 1px solid #e2e8f0 !important;
    border-bottom: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-result-panel {
    grid-area: result !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    border-left: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
    grid-area: options !important;
    min-height: 0 !important;
    padding: .62rem !important;
    border-left: 1px solid #e2e8f0 !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field {
    gap: .22rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field legend,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check span {
    font-size: .84rem !important;
    line-height: 1.18 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field select {
    min-height: 44px !important;
    padding: .62rem .78rem !important;
    font-size: .92rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel .ai-field input,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel .ai-field textarea {
    font-size: 1.01rem !important;
    line-height: 1.32 !important;
    padding: .76rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] #aiTopic {
    height: clamp(125px, 18svh, 178px) !important;
    min-height: 125px !important;
    max-height: 178px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field small {
    margin-top: .02rem !important;
    font-size: .78rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-scroll {
    flex: 0 1 auto !important;
    min-height: 0 !important;
    max-height: calc(100% - 74px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    padding-right: .12rem !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-option-grid {
    column-gap: .34rem !important;
    row-gap: .62rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced {
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced summary {
    min-height: 38px !important;
    padding: .36rem .58rem !important;
    font-size: .86rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced-body {
    gap: .62rem !important;
    padding: 0 .76rem .76rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] #aiCustomInstructions {
    min-height: 78px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check {
    padding: .62rem .72rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-generate-wrap {
    flex: 0 0 auto !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    margin-top: auto !important;
    padding-top: .74rem !important;
    padding-bottom: .16rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .72), #fff 38%) !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-generate-button {
    min-height: 48px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-form-status {
    min-height: 18px !important;
    font-size: .78rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .14rem !important;
    min-height: 38px !important;
    padding: .24rem .62rem .2rem !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head > div {
    width: 100% !important;
    justify-self: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head h3 {
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head p {
    font-size: .73rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-toolbar {
    justify-content: center !important;
    gap: .38rem !important;
    flex-wrap: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-head .ai-result-toolbar {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button {
    min-height: 34px !important;
    padding: .36rem .58rem !important;
    border-radius: 12px !important;
    gap: .28rem !important;
    font-size: .82rem !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button svg {
    width: 17px !important;
    height: 17px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    padding: .72rem .86rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-list {
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-empty-state {
    min-height: 100% !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-error-card,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-collection-panel {
    padding: .76rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-card {
    padding: .58rem .64rem !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .065) !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-card-top {
    gap: .42rem !important;
    margin-bottom: .36rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-number {
    gap: .34rem !important;
    font-size: .68rem !important;
    letter-spacing: .045em !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-number b {
    width: 23px !important;
    height: 23px !important;
    border-radius: 8px !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-character-pill {
    min-height: 26px !important;
    padding: .24rem .48rem !important;
    font-size: .72rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-title {
    font-size: .92rem !important;
    line-height: 1.36 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-meta {
    margin-top: .38rem !important;
    font-size: .72rem !important;
    line-height: 1.2 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions {
    display: flex !important;
    align-items: center !important;
    gap: .34rem !important;
    flex-wrap: wrap !important;
    margin-top: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions .ai-ghost-button {
    min-height: 34px !important;
    padding: .42rem .54rem !important;
    border-radius: 11px !important;
    gap: .3rem !important;
    font-size: .78rem !important;
    line-height: 1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions .ai-secondary-button svg,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions .ai-ghost-button svg {
    width: 17px !important;
    height: 17px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-card,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-error-card,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-collection-panel {
    max-width: 100% !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 780px) {
  body.flux-tool-body main[data-tool="youtube-title-generator"] {
    --ai-ytt-workspace-height: clamp(464px, calc(100svh - 244px), 524px);
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero h1 {
    font-size: clamp(2.02rem, 3.05vw, 2.9rem) !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero {
    margin-top: -.48rem !important;
    margin-bottom: .02rem !important;
    padding-top: .04rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .tool-page-hero p {
    font-size: .96rem !important;
    margin-top: .18rem !important;
    line-height: 1.22 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] #aiTopic {
    height: clamp(118px, 17svh, 145px) !important;
    min-height: 118px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
    padding: .78rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
    gap: .46rem !important;
    padding: .5rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-scroll {
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-option-grid {
    column-gap: .22rem !important;
    row-gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field {
    gap: .16rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field legend,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-check span {
    font-size: .74rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field select {
    min-height: 36px !important;
    padding: .38rem .58rem !important;
    font-size: .84rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-advanced summary {
    min-height: 34px !important;
    padding: .32rem .52rem !important;
    font-size: .84rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-generate-wrap {
    margin-top: auto !important;
    padding-top: .52rem !important;
    padding-bottom: .08rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-generate-button {
    min-height: 42px !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button {
    min-height: 32px !important;
    padding: .32rem .5rem !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-list {
    gap: .42rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-card {
    padding: .5rem .56rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-result-title {
    font-size: .88rem !important;
    line-height: 1.32 !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-card-actions .ai-ghost-button {
    min-height: 32px !important;
    padding: .36rem .46rem !important;
    font-size: .74rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-form-status {
    min-height: 14px !important;
    font-size: .72rem !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
    border-top: 1px solid #e2e8f0 !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-generate-wrap {
  background: #111c30 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-input-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-options-panel {
  border-color: rgba(147, 197, 253, .18) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-title-generate-wrap {
  background: linear-gradient(180deg, rgba(17, 28, 48, .72), #111c30 38%) !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] {
    padding-top: .55rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] > section.tool-page-hero {
    max-width: 1050px !important;
    margin: -.42rem auto .02rem !important;
    padding: .06rem .8rem .04rem !important;
    background: transparent !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] > section.tool-page-hero h1 {
    font-size: clamp(2.08rem, 3.2vw, 3.18rem) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] > section.tool-page-hero p {
    margin-top: .22rem !important;
    font-size: clamp(.95rem, 1.02vw, 1.04rem) !important;
    line-height: 1.24 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note {
    min-height: 0 !important;
    margin-bottom: .32rem !important;
    padding: .16rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note span {
    min-height: 30px !important;
    padding: 0 .7rem !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 780px) {
  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] {
    padding-top: .4rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] > section.tool-page-hero {
    margin-top: -.55rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] > section.tool-page-hero h1 {
    font-size: clamp(1.96rem, 2.9vw, 2.72rem) !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] > section.tool-page-hero p {
    margin-top: .16rem !important;
    font-size: .92rem !important;
    line-height: 1.2 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note {
    margin-bottom: .2rem !important;
    padding: .12rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note span {
    min-height: 28px !important;
    font-size: .76rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-workspace {
    min-height: 464px !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field span,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field legend,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field small {
  color: #b8c7dc !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field select {
  border-color: rgba(125, 211, 252, .28) !important;
  background: #0f1b2d !important;
  color: #e8f2ff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] :is(
  #aiTopic,
  #aiAudience,
  #aiKeyword,
  #aiTone,
  #aiNiche,
  #aiNicheSearch,
  #aiStyle,
  #aiResultCount,
  #aiCharacterMode,
  #aiCustomNiche,
  #aiLanguage,
  #aiCreativity,
  #aiCustomCharacterTarget,
  #aiBrandName,
  #aiExcludeWords,
  #aiCustomInstructions
) {
  border-color: rgba(125, 211, 252, .28) !important;
  background: #0f1b2d !important;
  background-color: #0f1b2d !important;
  background-image: none !important;
  color: #e8f2ff !important;
  -webkit-text-fill-color: #e8f2ff !important;
  color-scheme: dark !important;
  box-shadow:
    inset 0 0 0 999px #0f1b2d,
    inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-field textarea::placeholder {
  color: #718197 !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-workspace-header .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-count-pill {
  border-color: rgba(125, 211, 252, .24) !important;
  background: #142238 !important;
  color: #dbeafe !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-workspace-header .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button {
  color: #dbeafe !important;
  -webkit-text-fill-color: #dbeafe !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-workspace-header .ai-mini-button svg,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button svg {
  color: #93c5fd !important;
  stroke: #93c5fd !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-toolbar .ai-mini-button:disabled {
  opacity: .62 !important;
  color: #93a4ba !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-advanced {
  border-color: rgba(125, 211, 252, .26) !important;
  background: #101d30 !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-advanced summary {
  color: #93c5fd !important;
  background: #13233a !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-niche-list {
  border-color: rgba(125, 211, 252, .28) !important;
  background: #0f1b2d !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .38) !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-niche-option {
  color: #e8f2ff !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-niche-option:hover,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-niche-option.is-active,
html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-niche-option.is-selected {
  background: #172a46 !important;
  color: #bfdbfe !important;
}

/* YouTube Title Generator follow-up polish: keep trust badges below the workspace and give results more vertical room. */
html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-main {
  display: flex !important;
  flex-direction: column !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100% - 32px)) !important;
  margin: .58rem auto 1rem !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-content-stack {
  order: 3 !important;
}

@media (min-width: 1200px) {
  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-head {
    min-height: 28px !important;
    padding: .12rem .52rem .1rem !important;
    gap: .02rem !important;
    align-content: center !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-head h3 {
    margin: 0 !important;
    font-size: .86rem !important;
    line-height: 1 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-head p {
    margin: .02rem 0 0 !important;
    font-size: .64rem !important;
    line-height: 1 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-results-scroll {
    padding: .56rem .78rem .8rem !important;
  }
}

@media (min-width: 1200px) and (max-height: 780px) {
  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .ai-result-head {
    min-height: 26px !important;
    padding-top: .1rem !important;
    padding-bottom: .08rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-title-generator"] .tool-workspace-note {
    margin-top: .5rem !important;
  }
}

html body.flux-tool-body main#main.page-shell.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) > section.tool-page-hero h1 {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: 27.52px !important;
  line-height: 33.58px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page:is(
  [data-ai-workspace="short-output"],
  [data-ai-workspace="long-output"],
  [data-ai-workspace="transform-output"],
  [data-ai-workspace="prompt-builder"]
) > section.tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* YouTube Description Generator: title-tool aligned app workspace with center-first results. */
body.flux-tool-body main[data-tool="youtube-description-generator"].page-shell.tool-page {
  max-width: none !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] > .breadcrumb {
  width: min(1800px, calc(100vw - 48px)) !important;
  max-width: min(1800px, calc(100vw - 48px)) !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero {
  width: min(1040px, calc(100vw - 48px)) !important;
  max-width: min(1040px, calc(100vw - 48px)) !important;
  margin: .22rem auto 1rem !important;
  padding: 1.35rem 1rem .9rem !important;
  background: transparent !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero:before,
body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero:after,
body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero .eyebrow {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero h1 {
  max-width: 1040px !important;
  margin: 0 auto !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 27.52px !important;
  line-height: 33.58px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero p {
  max-width: 820px !important;
  margin: .38rem auto 0 !important;
  color: #526277 !important;
  font-size: .98rem !important;
  line-height: 1.32 !important;
  text-align: center !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-layout,
body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-main {
  width: min(1800px, calc(100vw - 48px)) !important;
  max-width: min(1800px, calc(100vw - 48px)) !important;
  margin-inline: auto !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-description-generator"] .tool-main {
  display: flex !important;
  flex-direction: column !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-description-generator"] #tool-workspace.tool-panel {
  order: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="youtube-description-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-description-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100% - 32px)) !important;
  margin: .58rem auto 1rem !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-description-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-workspace {
  width: 100% !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-form {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-panel,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-panel {
  min-width: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel {
  order: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: .65rem !important;
  padding: .9rem !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-panel {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-panel {
  order: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: .65rem !important;
  padding: .9rem !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-primary-grid,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-option-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: .62rem !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-scroll {
  display: flex !important;
  flex-direction: column !important;
  gap: .62rem !important;
  min-width: 0 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-generate-wrap {
  display: grid !important;
  gap: .45rem !important;
  margin-top: .72rem !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-generate-wrap .ai-generate-button {
  min-height: 48px !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field {
  gap: .28rem !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field span,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field legend,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-check span {
  font-size: .84rem !important;
  line-height: 1.18 !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field input,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field textarea,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field select {
  min-height: 44px !important;
  border-radius: 13px !important;
  padding: .62rem .78rem !important;
  font-size: .92rem !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel .ai-field input,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel .ai-field textarea {
  font-size: 1rem !important;
  line-height: 1.32 !important;
  padding: .76rem .86rem !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] #ai-long-youtube-description-generator-topic {
  min-height: 150px !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-mini-button,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-secondary-button,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-ghost-button {
  border: 1px solid rgba(191, 219, 254, .95) !important;
  border-radius: 14px !important;
  background: #fff !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .04) !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-mini-button:hover,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-secondary-button:hover,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-ghost-button:hover {
  border-color: rgba(37, 99, 235, .36) !important;
  background: #f1f7ff !important;
  color: #2563eb !important;
  -webkit-text-fill-color: #2563eb !important;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .08) !important;
}

body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-result-head h3 {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

@media (min-width: 1200px) {
  body.flux-tool-body main[data-tool="youtube-description-generator"] {
    --ai-desc-shell-width: min(1760px, calc(100vw - clamp(72px, 6vw, 160px)));
    --ai-desc-top-offset: clamp(242px, 31.5svh, 280px);
    --ai-desc-workspace-height: clamp(468px, calc(100svh - var(--ai-desc-top-offset)), 640px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-description-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="youtube-description-generator"] > section.tool-layout {
    width: var(--ai-desc-shell-width) !important;
    max-width: var(--ai-desc-shell-width) !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-description-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .22rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero {
    max-width: 1050px !important;
    margin: -.42rem auto .06rem !important;
    padding: .08rem .8rem .06rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero p {
    max-width: 820px !important;
    margin: .18rem auto 0 !important;
    font-size: .92rem !important;
    line-height: 1.2 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-workspace {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-desc-workspace-height) !important;
    min-height: 468px !important;
    max-height: 640px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(230px, 1fr) auto minmax(230px, 1fr) !important;
    align-items: center !important;
    gap: .58rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-kicker {
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
    font-weight: 820 !important;
    justify-self: start !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-toolbar {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: .34rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-header-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
    justify-content: flex-end !important;
    gap: .34rem !important;
    margin-left: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .84rem !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-header .ai-mini-button svg {
    width: 18px !important;
    height: 18px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-grid,
  body.flux-tool-body main[data-ai-workspace="long-output"][data-tool="youtube-description-generator"] .ai-workspace-grid.ai-document-grid.ai-description-grid {
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-form,
  body.flux-tool-body main[data-ai-workspace="long-output"][data-tool="youtube-description-generator"] .ai-form.ai-document-form.ai-description-form {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(292px, 324px) minmax(580px, 1fr) minmax(258px, 292px) !important;
    grid-template-areas: "input result options" !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel {
    grid-area: input !important;
    order: initial !important;
    gap: .54rem !important;
    min-height: 0 !important;
    padding: .86rem 1rem !important;
    border-right: 1px solid #e2e8f0 !important;
    border-bottom: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-panel,
  body.flux-tool-body main[data-ai-workspace="long-output"][data-tool="youtube-description-generator"] .ai-document-panel {
    grid-area: result !important;
    order: initial !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow: hidden !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-panel {
    grid-area: options !important;
    order: initial !important;
    min-height: 0 !important;
    padding: .62rem !important;
    border-left: 1px solid #e2e8f0 !important;
    border-bottom: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-primary-grid,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-option-grid {
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] #ai-long-youtube-description-generator-topic {
    height: clamp(128px, 18svh, 178px) !important;
    min-height: 128px !important;
    max-height: 178px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    padding-right: .1rem !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-advanced {
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-advanced summary {
    min-height: 38px !important;
    padding: .36rem .58rem !important;
    font-size: .86rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-advanced .ai-field-grid,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-advanced-body {
    grid-template-columns: 1fr !important;
    gap: .48rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-generate-wrap {
    flex: 0 0 auto !important;
    margin-top: auto !important;
    padding-top: .58rem !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .74), #fff 38%) !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-generate-button {
    min-height: 46px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-result-head {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    padding: .26rem .72rem .24rem !important;
    display: block !important;
    border-bottom: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-result-head h3 {
    margin: 0 !important;
    font-size: .96rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-result-head p {
    margin: .04rem 0 0 !important;
    font-size: .72rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-scroll,
  body.flux-tool-body main[data-ai-workspace="long-output"][data-tool="youtube-description-generator"] .ai-document-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem !important;
    overflow: auto !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-empty,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-surface,
  body.flux-tool-body main[data-ai-workspace="long-output"][data-tool="youtube-description-generator"] .ai-document-empty,
  body.flux-tool-body main[data-ai-workspace="long-output"][data-tool="youtube-description-generator"] .ai-document-surface {
    min-height: 100% !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-surface {
    max-width: 100% !important;
    padding: .86rem !important;
    border-radius: 16px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-body {
    gap: .72rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-doc-section p,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-doc-list {
    font-size: .9rem !important;
    line-height: 1.52 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-footer {
    flex: 0 0 auto !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(100px, auto) !important;
    gap: .44rem !important;
    padding: .46rem .68rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-doc-stat {
    padding: .38rem .52rem !important;
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-doc-stat strong {
    font-size: .9rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-doc-stat small {
    margin-top: .08rem !important;
    font-size: .66rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-footer .ai-status {
    font-size: .7rem !important;
    line-height: 1.15 !important;
  }
}

@media (min-width: 1200px) and (max-height: 780px) {
  body.flux-tool-body main[data-tool="youtube-description-generator"] {
    --ai-desc-workspace-height: clamp(446px, calc(100svh - 252px), 516px);
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero {
    margin-top: -.54rem !important;
    margin-bottom: .02rem !important;
    padding-top: .04rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero p {
    font-size: .88rem !important;
    margin-top: .12rem !important;
    line-height: 1.16 !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] #ai-long-youtube-description-generator-topic {
    height: clamp(116px, 16svh, 142px) !important;
    min-height: 116px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-panel {
    padding: .72rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-primary-grid,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-option-grid,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-scroll {
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field legend,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-check span {
    font-size: .74rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field select {
    min-height: 36px !important;
    padding: .38rem .58rem !important;
    font-size: .84rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-advanced summary {
    min-height: 34px !important;
    padding: .32rem .52rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-generate-wrap {
    padding-top: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-generate-button {
    min-height: 42px !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 32px !important;
    padding: .32rem .5rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-scroll {
    padding: .56rem .7rem .64rem !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-header {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-toolbar,
  body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-header-actions {
    justify-content: flex-start !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-input-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-options-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-description-generate-wrap {
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(11, 18, 32, .96)) !important;
  border-color: rgba(147, 197, 253, .18) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field select {
  background: rgba(15, 23, 42, .96) !important;
  border-color: rgba(191, 219, 254, .46) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  caret-color: #93c5fd !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field textarea::placeholder {
  color: rgba(203, 213, 225, .7) !important;
  -webkit-text-fill-color: rgba(203, 213, 225, .7) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field select option {
  color: #0f172a !important;
  background: #ffffff !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-secondary-button,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-ghost-button {
  background: rgba(15, 23, 42, .88) !important;
  border-color: rgba(191, 219, 254, .38) !important;
  color: #e2e8f0 !important;
  -webkit-text-fill-color: #e2e8f0 !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .16) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-mini-button:disabled,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-secondary-button:disabled,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-ghost-button:disabled {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  opacity: .66 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-document-result-head h3 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* Shared AI polish: placeholders should guide users without looking like filled content. */
body.flux-tool-body main[data-ai-workspace] .ai-field input::placeholder,
body.flux-tool-body main[data-ai-workspace] .ai-field textarea::placeholder,
body.flux-tool-body main[data-ai-workspace] .ai-transform-field input::placeholder,
body.flux-tool-body main[data-ai-workspace] .ai-transform-field textarea::placeholder,
body.flux-tool-body main[data-ai-workspace] .ai-transform-input::placeholder,
body.flux-tool-body main[data-ai-workspace] .ai-prompt-field input::placeholder,
body.flux-tool-body main[data-ai-workspace] .ai-prompt-field textarea::placeholder,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field textarea::placeholder,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field textarea::placeholder {
  color: #8ea0b8 !important;
  -webkit-text-fill-color: #8ea0b8 !important;
  font-size: .875rem !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
  opacity: .76 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-field textarea::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-transform-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-transform-field textarea::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-transform-input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-prompt-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-ai-workspace] .ai-prompt-field textarea::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-field textarea::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field input::placeholder,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-field textarea::placeholder {
  color: rgba(203, 213, 225, .62) !important;
  -webkit-text-fill-color: rgba(203, 213, 225, .62) !important;
  opacity: .72 !important;
}

/* Hashtag Generator uses the same compact app-style pattern as the approved AI workspace. */
body.flux-tool-body main[data-tool="hashtag-generator"] .tool-layout,
body.flux-tool-body main[data-tool="hashtag-generator"] .tool-main {
  width: min(1800px, calc(100vw - 48px)) !important;
  max-width: min(1800px, calc(100vw - 48px)) !important;
  margin-inline: auto !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero {
  margin-bottom: .7rem !important;
  padding-top: .95rem !important;
  padding-bottom: .65rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero h1 {
  margin-top: .25rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero p {
  margin-top: .45rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-badge-row {
  margin: .45rem auto .65rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .tool-workspace-note {
  order: 2 !important;
  margin: .72rem auto 0 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  margin: .72rem auto 0 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="hashtag-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane {
  width: 100% !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-header {
  min-height: 52px !important;
  padding: .5rem 1rem !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-kicker {
  margin: 0 !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 1rem !important;
  line-height: 1.2 !important;
  font-weight: 820 !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-title {
  color: #64748b !important;
  font-size: .86rem !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-form {
  display: block !important;
  margin: 0 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-grid {
  display: grid !important;
  grid-template-columns: minmax(275px, .78fr) minmax(0, 1.5fr) minmax(260px, .72fr) !important;
  height: clamp(410px, calc(100vh - 358px), 500px) !important;
  min-height: 0 !important;
  align-items: stretch !important;
  gap: 0 !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-grid > * {
  min-height: 0 !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-panel {
  background: #fff !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel {
  padding: .86rem !important;
  border-right: 1px solid #e2e8f0 !important;
  overflow: auto !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel {
  display: flex !important;
  flex-direction: column !important;
  gap: .68rem !important;
  padding: .86rem !important;
  border-left: 1px solid #e2e8f0 !important;
  overflow: auto !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field-grid,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-settings-grid,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced-body {
  grid-template-columns: 1fr !important;
  gap: .68rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field {
  gap: .34rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field span,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-check span {
  font-size: .86rem !important;
  line-height: 1.22 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field input,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field textarea,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field select {
  min-height: 43px !important;
  border-radius: 13px !important;
  padding: .64rem .78rem !important;
  font-size: .94rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-topic {
  min-height: 132px !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-customInstructions {
  min-height: 78px !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced {
  border-radius: 15px !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced summary {
  min-height: 44px !important;
  padding: .7rem .82rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-generate-button {
  min-height: 48px !important;
  border-radius: 14px !important;
  background: #2563eb !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 15px 30px rgba(37, 99, 235, .22) !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-generate-button:hover {
  background: #1d4ed8 !important;
  box-shadow: 0 18px 38px rgba(37, 99, 235, .28) !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-panel {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  border-left: 0 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head {
  align-items: center !important;
  gap: .8rem !important;
  padding: .72rem .86rem !important;
  border-bottom: 1px solid #e2e8f0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head h3 {
  margin: 0 0 .16rem !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: 1.02rem !important;
  line-height: 1.25 !important;
  font-weight: 820 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head p {
  color: #64748b !important;
  font-size: .84rem !important;
  line-height: 1.35 !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-toolbar {
  gap: .44rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head .ai-result-toolbar {
    display: none !important;
  }

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-mini-button,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-secondary-button,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-ghost-button {
  min-height: 40px !important;
  border-radius: 13px !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-results-scroll {
  min-height: 0 !important;
  max-height: none !important;
  padding: .86rem !important;
  background: linear-gradient(180deg, #fff, #f8fbff) !important;
  overflow: auto !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-empty-state {
  min-height: 290px !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 28px rgba(37, 99, 235, .05) !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-card,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-error-card,
body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-collection-panel {
  border-radius: 18px !important;
  box-shadow: 0 14px 32px rgba(37, 99, 235, .07) !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-tag-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .48rem !important;
}

body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-tag-chip {
  min-height: 34px !important;
  padding: .42rem .62rem !important;
  border-radius: 999px !important;
  font-size: .86rem !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head {
  background: #0f172a !important;
  border-color: rgba(148, 163, 184, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-results-scroll {
  background: linear-gradient(180deg, #0f172a, #111827) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head h3 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

@media (min-width: 1181px) and (max-height: 820px) {
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel {
    padding: .68rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field-grid,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-settings-grid,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced-body {
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field {
    gap: .22rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field span,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-check span {
    font-size: .8rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field input,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field textarea,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field select {
    min-height: 38px !important;
    padding: .5rem .68rem !important;
    font-size: .9rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-topic {
    min-height: 96px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-customInstructions {
    min-height: 58px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 38px !important;
    padding: .55rem .72rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 44px !important;
  }
}

@media (max-width: 1180px) {
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-layout,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-main {
    width: min(100%, calc(100vw - 28px)) !important;
    max-width: min(100%, calc(100vw - 28px)) !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-grid {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel {
    order: 2 !important;
    border-left: 0 !important;
    border-top: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-panel {
    order: 3 !important;
    border-top: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel {
    order: 1 !important;
    border-right: 0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-results-scroll {
    max-height: none !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-empty-state {
    min-height: 240px !important;
  }
}

@media (max-width: 640px) {
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-layout,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-main {
    width: min(100%, calc(100vw - 20px)) !important;
    max-width: min(100%, calc(100vw - 20px)) !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane {
    border-radius: 18px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-header,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-results-scroll {
    padding: .82rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head {
    align-items: flex-start !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-topic {
    min-height: 132px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-customInstructions {
    min-height: 78px !important;
  }
}

/* Hashtag Generator: align the shared three-pane builder with the approved YouTube AI workspace shell. */
@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body.hashtag-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header,
  html body.flux-tool-body.hashtag-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header.scrolled {
    border-bottom: 0 solid transparent !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 24px !important;
    padding-top: 6px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] {
    --ai-hashtag-shell-width: 1270px;
    --ai-hashtag-workspace-height: clamp(464px, calc(100svh - 244px), 524px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="hashtag-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="hashtag-generator"] > section.tool-layout {
    width: min(var(--ai-hashtag-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-hashtag-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="hashtag-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="hashtag-generator"] > section.tool-layout > .tool-main {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] section.tool-page-hero,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero {
    max-width: 1240px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] section.tool-page-hero::before,
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] section.tool-page-hero::after,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero::before,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero::after {
    content: none !important;
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] section.tool-page-hero .tool-hero-copy,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero .tool-hero-copy {
    width: 100% !important;
    max-width: 1240px !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero h1 {
    font-size: 27.52px !important;
    line-height: 1.04 !important;
    margin-top: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="hashtag-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-page-hero p {
    max-width: 760px !important;
    width: min(760px, 100%) !important;
    margin: .18rem auto 0 !important;
    font-size: .92rem !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-wrap: balance !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] #tool-workspace.tool-panel {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-hashtag-workspace-height) !important;
    min-height: 464px !important;
    max-height: 524px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-kicker {
    justify-self: start !important;
    font-size: .98rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-header-result-toolbar {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .38rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .86rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-workspace-header .ai-mini-button svg {
    width: 18px !important;
    height: 18px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-grid {
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(286px, 318px) minmax(536px, 1fr) minmax(282px, 314px) !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    padding: .78rem 1rem !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel .ai-field input,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-primary-panel .ai-field textarea {
    font-size: 1.01rem !important;
    line-height: 1.32 !important;
    padding: .76rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-topic {
    height: clamp(118px, 17svh, 145px) !important;
    min-height: 118px !important;
    max-height: 145px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane #ai-customInstructions {
    min-height: 78px !important;
    max-height: 96px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    min-height: 0 !important;
    padding: .64rem !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-settings-grid {
    grid-template-columns: 1fr !important;
    row-gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-settings-grid .ai-field:nth-child(3) {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field {
    gap: .16rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field span,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field legend,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-check span {
    font-size: .78rem !important;
    line-height: 1.2 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field input,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field textarea,
  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-field select {
    min-height: 38px !important;
    padding: .42rem .64rem !important;
    font-size: .87rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced {
    flex: 0 0 auto !important;
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 38px !important;
    padding: .42rem .62rem !important;
    font-size: .88rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-advanced-body {
    gap: .62rem !important;
    padding: 0 .76rem .76rem !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 42px !important;
    margin-top: auto !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-form-status {
    min-height: 14px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-panel {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .14rem !important;
    min-height: 38px !important;
    padding: .24rem .62rem .2rem !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head > div {
    width: 100% !important;
    justify-self: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head h3 {
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head p {
    font-size: .73rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-result-head .ai-result-toolbar {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem .86rem .86rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
  }

  body.flux-tool-body main[data-tool="hashtag-generator"] .ai-short-three-pane .ai-empty-state {
    min-height: 100% !important;
  }

  html body.flux-tool-body main#main#main.tool-page[data-tool="hashtag-generator"] .tool-workspace-note,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-workspace-note {
    margin: 0 auto .45rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  html body.flux-tool-body main#main#main.tool-page[data-tool="hashtag-generator"] .tool-workspace-note span,
  body.flux-tool-body main[data-tool="hashtag-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }
}

/* Instagram Bio Generator: use the same approved no-scroll AI workspace pattern. */
body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-layout,
body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-main {
  width: min(1800px, calc(100vw - 48px)) !important;
  max-width: min(1800px, calc(100vw - 48px)) !important;
  margin-inline: auto !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="instagram-bio-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100% - 32px)) !important;
  margin: .58rem auto 1rem !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  margin: .58rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane {
  width: 100% !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
  min-height: 0 !important;
  gap: 0 !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel,
body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-settings-panel,
body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-panel {
  min-width: 0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head .ai-result-toolbar {
  display: none !important;
}

body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field input::placeholder,
body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field textarea::placeholder {
  color: #9aaac1 !important;
  font-size: .91rem !important;
  font-weight: 600 !important;
  opacity: .9 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body.instagram-bio-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header,
  html body.flux-tool-body.instagram-bio-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header.scrolled {
    border-bottom: 0 solid transparent !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 24px !important;
    padding-top: 6px !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] {
    --ai-instagram-shell-width: 1270px;
    --ai-instagram-workspace-height: clamp(464px, calc(100svh - 244px), 524px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="instagram-bio-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="instagram-bio-generator"] > section.tool-layout {
    width: min(var(--ai-instagram-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-instagram-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="instagram-bio-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="instagram-bio-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] section.tool-page-hero,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-page-hero {
    max-width: 1240px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] section.tool-page-hero::before,
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] section.tool-page-hero::after,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-page-hero::before,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-page-hero::after,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-page-hero .eyebrow {
    content: none !important;
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-page-hero h1 {
    margin: 0 auto !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="instagram-bio-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-page-hero p {
    max-width: 760px !important;
    width: min(760px, 100%) !important;
    margin: .18rem auto 0 !important;
    color: #526277 !important;
    font-size: .92rem !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-align: center !important;
    text-wrap: balance !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-instagram-workspace-height) !important;
    min-height: 464px !important;
    max-height: 524px !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-workspace-kicker {
    justify-self: start !important;
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-header-result-toolbar {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .38rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .86rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-grid {
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(286px, 318px) minmax(536px, 1fr) minmax(282px, 314px) !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-grid > * {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .54rem !important;
    padding: .78rem 1rem !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-settings-panel .ai-settings-grid,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-advanced-body {
    display: grid !important;
    gap: .52rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel .ai-field-grid {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel .ai-field input,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel .ai-field textarea {
    font-size: 1.01rem !important;
    line-height: 1.32 !important;
    padding: .7rem .82rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane #ai-niche {
    height: clamp(104px, 15svh, 126px) !important;
    min-height: 104px !important;
    max-height: 126px !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane #ai-customInstructions {
    min-height: 70px !important;
    max-height: 86px !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    min-height: 0 !important;
    padding: .64rem !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .44rem !important;
    row-gap: .56rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field {
    gap: .16rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field span,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field legend,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-check span {
    font-size: .78rem !important;
    line-height: 1.22 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field input,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field textarea,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field select {
    min-height: 38px !important;
    padding: .42rem .64rem !important;
    font-size: .87rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-advanced {
    flex: 0 0 auto !important;
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 38px !important;
    padding: .42rem .62rem !important;
    font-size: .88rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-advanced-body {
    padding: 0 .76rem .76rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 42px !important;
    margin-top: auto !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-form-status {
    min-height: 14px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-panel {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .14rem !important;
    min-height: 38px !important;
    padding: .24rem .62rem .2rem !important;
    text-align: center !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head > div {
    width: 100% !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head h3 {
    margin: 0 !important;
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head p {
    margin: 0 !important;
    font-size: .73rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem .86rem .86rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-empty-state {
    min-height: 100% !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-workspace-note {
    display: flex !important;
    margin: .58rem auto 1rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 780px) {
  body.flux-tool-body main[data-tool="instagram-bio-generator"] {
    --ai-instagram-workspace-height: 500px;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane {
    border-radius: 20px !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-grid {
    grid-template-columns: 1fr !important;
    height: auto !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-settings-panel,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-result-head,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-results-scroll {
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-settings-grid,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-field-grid,
  body.flux-tool-body main[data-tool="instagram-bio-generator"] .ai-short-three-pane .ai-advanced-body {
    grid-template-columns: 1fr !important;
  }
}

body.flux-tool-body main[data-tool="seo-title-generator"] .tool-layout,
body.flux-tool-body main[data-tool="seo-title-generator"] .tool-main {
  width: min(100%, calc(100vw - 48px)) !important;
  max-width: min(100%, calc(100vw - 48px)) !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="seo-title-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100% - 32px)) !important;
  margin: .58rem auto 1rem !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  margin: .58rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane {
  width: 100% !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
  min-height: 0 !important;
  gap: 0 !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel,
body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-settings-panel,
body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-panel {
  min-width: 0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head .ai-result-toolbar {
  display: none !important;
}

body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field input::placeholder,
body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  font-size: .86rem !important;
  font-weight: 520 !important;
  opacity: .86 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body.seo-title-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header,
  html body.flux-tool-body.seo-title-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header.scrolled {
    border-bottom: 0 solid transparent !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 24px !important;
    padding-top: 6px !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] {
    --ai-seo-title-shell-width: 1270px;
    --ai-seo-title-workspace-height: clamp(464px, calc(100svh - 244px), 524px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="seo-title-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="seo-title-generator"] > section.tool-layout {
    width: min(var(--ai-seo-title-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-seo-title-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="seo-title-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="seo-title-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero,
  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero {
    max-width: 1240px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero::before,
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero::after,
  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero::before,
  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero::after,
  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero .eyebrow {
    content: none !important;
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero h1 {
    margin: 0 auto !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero p {
    max-width: 760px !important;
    width: min(760px, 100%) !important;
    margin: .18rem auto 0 !important;
    color: #526277 !important;
    font-size: .92rem !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-align: center !important;
    text-wrap: balance !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-seo-title-workspace-height) !important;
    min-height: 464px !important;
    max-height: 524px !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-workspace-kicker {
    justify-self: start !important;
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-header-result-toolbar {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .38rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .86rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-grid {
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(286px, 318px) minmax(536px, 1fr) minmax(282px, 314px) !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-grid > * {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .54rem !important;
    padding: .78rem 1rem !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-settings-panel .ai-settings-grid,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-advanced-body {
    display: grid !important;
    gap: .52rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel .ai-field-grid {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel .ai-field input,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel .ai-field textarea {
    font-size: 1.01rem !important;
    line-height: 1.32 !important;
    padding: .7rem .82rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane #ai-primaryKeyword {
    height: clamp(104px, 15svh, 126px) !important;
    min-height: 104px !important;
    max-height: 126px !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane #ai-customInstructions {
    min-height: 70px !important;
    max-height: 86px !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    min-height: 0 !important;
    padding: .64rem !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .44rem !important;
    row-gap: .62rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field {
    gap: .18rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field span,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field legend,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-check span {
    font-size: .78rem !important;
    line-height: 1.22 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field input,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field textarea,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field select {
    min-height: 38px !important;
    padding: .42rem .64rem !important;
    font-size: .87rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-advanced {
    flex: 0 0 auto !important;
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 38px !important;
    padding: .42rem .62rem !important;
    font-size: .88rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 42px !important;
    margin-top: auto !important;
    border-radius: 14px !important;
    background: #2563eb !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 15px 30px rgba(37, 99, 235, .2) !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-form-status {
    min-height: 14px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-panel {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .14rem !important;
    min-height: 38px !important;
    padding: .24rem .62rem .2rem !important;
    text-align: center !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head > div {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head h3 {
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head p {
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: .73rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem .86rem .86rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-empty-state {
    min-height: 100% !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-card {
    padding: .66rem .72rem !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .06) !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-card-top {
    margin-bottom: .48rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-title {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .92rem !important;
    line-height: 1.36 !important;
    font-weight: 780 !important;
    margin: .35rem 0 !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-card-actions {
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-card-actions .ai-ghost-button {
    min-height: 32px !important;
    padding: .34rem .5rem !important;
    border-radius: 11px !important;
    font-size: .82rem !important;
    gap: .24rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-workspace-note {
    display: flex !important;
    margin: .58rem auto 1rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 780px) {
  body.flux-tool-body main[data-tool="seo-title-generator"] {
    --ai-seo-title-workspace-height: 500px;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane {
    border-radius: 20px !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-grid {
    grid-template-columns: 1fr !important;
    height: auto !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-settings-panel,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-results-scroll {
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-settings-grid,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-field-grid,
  body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-advanced-body {
    grid-template-columns: 1fr !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-title,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .ai-short-three-pane .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="seo-title-generator"] .tool-page-hero p {
  color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body.seo-title-generator-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body.seo-title-generator-body main#main.page-shell.tool-page.flux-tool-page[data-tool="seo-title-generator"] section.tool-page-hero p {
  color: #cbd5e1 !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-layout,
body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-main {
  width: min(100%, calc(100vw - 48px)) !important;
  max-width: min(100%, calc(100vw - 48px)) !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="ai-prompt-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100% - 32px)) !important;
  margin: .58rem auto 1rem !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  margin: .58rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane {
  width: 100% !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-prompt-output-panel,
body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-prompt-builder-panel {
  min-width: 0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-prompt-output-head .ai-document-toolbar {
  display: none !important;
}

body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field input::placeholder,
body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field textarea::placeholder {
  color: #94a3b8 !important;
  font-size: .86rem !important;
  font-weight: 520 !important;
  opacity: .86 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body.ai-prompt-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header,
  html body.flux-tool-body.ai-prompt-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header.scrolled {
    border-bottom: 0 solid transparent !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 24px !important;
    padding-top: 6px !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] {
    --ai-prompt-generator-shell-width: 1270px;
    --ai-prompt-generator-workspace-height: clamp(464px, calc(100svh - 244px), 524px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-prompt-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="ai-prompt-generator"] > section.tool-layout {
    width: min(var(--ai-prompt-generator-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-prompt-generator-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-prompt-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-prompt-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] section.tool-page-hero,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero {
    max-width: 1240px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] section.tool-page-hero::before,
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] section.tool-page-hero::after,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero::before,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero::after,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero .eyebrow {
    content: none !important;
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero h1 {
    margin: 0 auto !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-prompt-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero p {
    max-width: 760px !important;
    width: min(760px, 100%) !important;
    margin: .18rem auto 0 !important;
    color: #526277 !important;
    font-size: .92rem !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-align: center !important;
    text-wrap: balance !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-prompt-generator-workspace-height) !important;
    min-height: 464px !important;
    max-height: 524px !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-workspace-kicker {
    justify-self: start !important;
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-prompt-header-output-actions {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .38rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-workspace-header .ai-secondary-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .86rem !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-layout {
    display: grid !important;
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(286px, 322px) minmax(500px, 1fr) minmax(316px, 350px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-layout > * {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .54rem !important;
    padding: .78rem 1rem !important;
    border-right: 1px solid #e2e8f0 !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    padding: .64rem !important;
    border-left: 1px solid #e2e8f0 !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-fields,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-fields,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-advanced .ai-prompt-section-fields {
    display: grid !important;
    gap: .52rem !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-fields {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .44rem !important;
    row-gap: .62rem !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-panel .ai-prompt-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field {
    gap: .18rem !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field span,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-advanced summary span {
    font-size: .78rem !important;
    line-height: 1.22 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field input,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field textarea,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-field select {
    width: 100% !important;
    min-height: 38px !important;
    padding: .42rem .64rem !important;
    font-size: .87rem !important;
    line-height: 1.26 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-panel .ai-prompt-field input,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-panel .ai-prompt-field textarea {
    font-size: 1.01rem !important;
    line-height: 1.32 !important;
    padding: .7rem .82rem !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] #ai-prompt-ai-prompt-generator-task {
    height: clamp(112px, 16svh, 136px) !important;
    min-height: 112px !important;
    max-height: 136px !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] #ai-prompt-ai-prompt-generator-context,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] #ai-prompt-ai-prompt-generator-customInstructions {
    min-height: 74px !important;
    max-height: 88px !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-advanced {
    flex: 0 0 auto !important;
    border-radius: 12px !important;
    box-shadow: none !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-advanced summary {
    min-height: 38px !important;
    padding: .42rem .62rem !important;
    font-size: .88rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-advanced[open] {
    overflow-y: auto !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane .ai-generate-button {
    min-height: 42px !important;
    min-width: 0 !important;
    width: 100% !important;
    margin-top: auto !important;
    border-radius: 14px !important;
    background: #2563eb !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 15px 30px rgba(37, 99, 235, .2) !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-status {
    min-height: 14px !important;
    max-height: 32px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-panel {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .14rem !important;
    min-height: 38px !important;
    padding: .24rem .62rem .2rem !important;
    text-align: center !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head h3 {
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head p {
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: .73rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem .86rem .86rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-empty {
    min-height: 100% !important;
    border-radius: 18px !important;
    border-style: solid !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-document,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-collection {
    max-width: none !important;
    min-height: 100% !important;
    padding: .86rem !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .06) !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-pre {
    margin-bottom: 0 !important;
    padding: .82rem !important;
    font-size: .88rem !important;
    line-height: 1.48 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-workspace-note {
    display: flex !important;
    margin: .58rem auto 1rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 780px) {
  body.flux-tool-body main[data-tool="ai-prompt-generator"] {
    --ai-prompt-generator-workspace-height: 500px;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane {
    border-radius: 20px !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-layout {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-panel,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-panel,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-scroll {
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-fields,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-primary-fields,
  body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-settings-advanced .ai-prompt-section-fields {
    grid-template-columns: 1fr !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-builder-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-scroll,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-empty,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-document {
  background: #0f172a !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-pre,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .ai-prompt-output-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-prompt-generator"] .tool-page-hero p {
  color: #cbd5e1 !important;
}

body.flux-tool-body main[data-ai-workspace] .ai-mini-button:disabled,
body.flux-tool-body main[data-ai-workspace] .ai-secondary-button:disabled,
body.flux-tool-body main[data-ai-workspace] .ai-ghost-button:disabled,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-mini-button:disabled,
body.flux-tool-body main[data-tool="youtube-title-generator"] .ai-secondary-button:disabled,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-mini-button:disabled,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-secondary-button:disabled,
body.flux-tool-body main[data-tool="youtube-description-generator"] .ai-ghost-button:disabled {
  opacity: .48 !important;
  cursor: not-allowed !important;
  color: #7c8da5 !important;
  -webkit-text-fill-color: #7c8da5 !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Thumbnail Text Generator: shared AI app layout, scoped to this tool only. */
body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-layout,
body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-main {
  width: min(100%, calc(100vw - 48px)) !important;
  max-width: min(100%, calc(100vw - 48px)) !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] #tool-workspace.tool-panel {
  width: 100% !important;
  max-width: 100% !important;
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="thumbnail-text-generator"] #tool-workspace.tool-panel:after {
  content: none !important;
  display: none !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100% - 32px)) !important;
  margin: .58rem auto 1rem !important;
}

html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-text-generator"] > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-text-generator"] > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  margin: .58rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane {
  width: 100% !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
  min-height: 0 !important;
  gap: 0 !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel,
body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-settings-panel,
body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-panel {
  min-width: 0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head .ai-result-toolbar {
  display: none !important;
}

body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field input::placeholder,
body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  font-size: .86rem !important;
  font-weight: 520 !important;
  opacity: .86 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-results-scroll {
  background: #0f172a !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-title,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero p {
  color: #cbd5e1 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body.thumbnail-text-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header,
  html body.flux-tool-body.thumbnail-text-generator-body:not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header.scrolled {
    border-bottom: 0 solid transparent !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="thumbnail-text-generator"] {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 24px !important;
    padding-top: 6px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] {
    --ai-thumbnail-shell-width: 1320px;
    --ai-thumbnail-workspace-height: clamp(464px, calc(100svh - 244px), 524px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-text-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-text-generator"] > section.tool-layout {
    width: min(var(--ai-thumbnail-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-thumbnail-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-text-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-text-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="thumbnail-text-generator"] section.tool-page-hero,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero {
    max-width: 1240px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="thumbnail-text-generator"] section.tool-page-hero::before,
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="thumbnail-text-generator"] section.tool-page-hero::after,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero::before,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero::after,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero .eyebrow {
    content: none !important;
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="thumbnail-text-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero h1 {
    margin: 0 auto !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="thumbnail-text-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-page-hero p {
    max-width: 720px !important;
    width: min(720px, 100%) !important;
    margin: .18rem auto 0 !important;
    color: #526277 !important;
    font-size: .92rem !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-align: center !important;
    text-wrap: balance !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-thumbnail-workspace-height) !important;
    min-height: 464px !important;
    max-height: 524px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(210px, 1fr) auto minmax(210px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 50px !important;
    padding: .36rem 1rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-workspace-kicker {
    justify-self: start !important;
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-header-result-toolbar {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .38rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .32rem !important;
    font-size: .86rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-grid {
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(286px, 306px) minmax(560px, 1fr) minmax(272px, 292px) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-grid > * {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .54rem !important;
    padding: .78rem 1rem !important;
    overflow: visible !important;
    border-right: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-settings-panel .ai-settings-grid,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-advanced-body {
    display: grid !important;
    gap: .52rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel .ai-field-grid {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel .ai-field input,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel .ai-field textarea {
    font-size: 1.01rem !important;
    line-height: 1.32 !important;
    padding: .7rem .82rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane #ai-topic {
    height: clamp(116px, 16svh, 148px) !important;
    min-height: 116px !important;
    max-height: 148px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane #ai-customInstructions {
    min-height: 72px !important;
    max-height: 92px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .56rem !important;
    min-height: 0 !important;
    padding: .64rem !important;
    overflow: visible !important;
    border-left: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .44rem !important;
    row-gap: .62rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field {
    gap: .18rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field span,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field legend,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-check span {
    font-size: .78rem !important;
    line-height: 1.22 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field input,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field textarea,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field select {
    min-height: 38px !important;
    padding: .42rem .64rem !important;
    font-size: .87rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-advanced {
    flex: 0 0 auto !important;
    border-radius: 12px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 38px !important;
    padding: .42rem .62rem !important;
    font-size: .88rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 42px !important;
    margin-top: auto !important;
    border-radius: 14px !important;
    background: #2563eb !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 15px 30px rgba(37, 99, 235, .2) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-form-status {
    min-height: 14px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-panel {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .14rem !important;
    min-height: 38px !important;
    padding: .24rem .62rem .2rem !important;
    text-align: center !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head > div {
    width: 100% !important;
    max-width: 100% !important;
    justify-self: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head h3 {
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head p {
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: .73rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem .86rem .86rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-empty-state {
    min-height: 100% !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-list {
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-card {
    padding: .58rem .64rem !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .065) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-card-top {
    gap: .42rem !important;
    margin-bottom: .36rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-number b {
    width: 23px !important;
    height: 23px !important;
    border-radius: 8px !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-character-pill {
    min-height: 26px !important;
    padding: .24rem .48rem !important;
    font-size: .72rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-title {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .92rem !important;
    line-height: 1.36 !important;
    font-weight: 720 !important;
    margin: .35rem 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-card-actions {
    display: flex !important;
    align-items: center !important;
    gap: .34rem !important;
    flex-wrap: wrap !important;
    margin-top: .46rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-card-actions .ai-ghost-button {
    min-height: 34px !important;
    padding: .42rem .54rem !important;
    border-radius: 11px !important;
    gap: .3rem !important;
    font-size: .78rem !important;
    line-height: 1 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-workspace-note {
    display: flex !important;
    margin: .58rem auto 1rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 780px) {
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] {
    --ai-thumbnail-workspace-height: 500px;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane {
    border-radius: 20px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-grid {
    grid-template-columns: 1fr !important;
    height: auto !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-settings-panel,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-result-head,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-results-scroll {
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-settings-grid,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-field-grid,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-three-pane .ai-advanced-body {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="thumbnail-text-generator"] .ai-short-settings-panel {
    border-left: 0 !important;
    border-right: 0 !important;
  }
}

/* Four AI tools: caption, tweet, email, and blog title use the approved compact app workspace. */
body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-layout,
body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) #tool-workspace.tool-panel:before,
body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) #tool-workspace.tool-panel:after {
  display: none !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-workspace-note span {
  min-height: 34px !important;
  padding: .45rem .76rem !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-workspace,
body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane {
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
  overflow: hidden !important;
}

body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field input::placeholder,
body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .93em !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body:is(.ai-caption-generator-body, .ai-tweet-generator-body, .ai-email-writer-body, .ai-blog-title-generator-body):not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header,
  html body.flux-tool-body:is(.ai-caption-generator-body, .ai-tweet-generator-body, .ai-email-writer-body, .ai-blog-title-generator-body):not(.generic-tool-studio-active):not(.passport-editor-active) .site-header.site-header.scrolled {
    position: relative !important;
    top: auto !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) {
    --ai-four-shell-width: 1320px;
    --ai-four-workspace-height: clamp(456px, calc(100svh - 270px), 506px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > .breadcrumb,
  html body.flux-tool-body main#main.tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout,
  html body.flux-tool-body main#main.tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero {
    width: min(var(--ai-four-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-four-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > .breadcrumb {
    margin-top: 0 !important;
    margin-bottom: .42rem !important;
  }

  html body.flux-tool-body main#main.tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-page-hero {
    margin: 0 auto .72rem !important;
    padding: .16rem 1rem .22rem !important;
    background: transparent !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-page-hero::before,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-page-hero::after,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-page-hero .eyebrow {
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero h1,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .18rem !important;
    color: #0f172a !important;
    font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero p,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-page-hero p {
    max-width: 760px !important;
    margin: 0 auto !important;
    color: #506176 !important;
    font-size: .92rem !important;
    line-height: 1.32 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-workspace,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane {
    height: var(--ai-four-workspace-height) !important;
    min-height: 456px !important;
    max-height: 506px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-header,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(250px, 1fr) auto minmax(250px, 1fr) !important;
    align-items: center !important;
    gap: .72rem !important;
    min-height: 58px !important;
    padding: .52rem .86rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-kicker,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-workspace-kicker {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-toolbar,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-header-result-toolbar {
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: .38rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-header-actions,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-header-actions {
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: .38rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-header .ai-mini-button,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-workspace-header .ai-mini-button {
    min-height: 36px !important;
    padding: .42rem .58rem !important;
    border-radius: 12px !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-grid.ai-document-grid.ai-description-grid,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-form,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(286px, 306px) minmax(520px, 1fr) minmax(318px, 326px) !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-input-panel,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-primary-panel {
    padding: 12px !important;
    overflow: auto !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-primary-grid,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-primary-panel .ai-field-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-input-panel .ai-field span,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field {
    gap: .22rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field span,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-check span {
    color: #344256 !important;
    font-size: .75rem !important;
    line-height: 1.05 !important;
    font-weight: 780 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field input,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field textarea,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field select {
    min-height: 40px !important;
    padding: .58rem .72rem !important;
    border-radius: 14px !important;
    font-size: .94rem !important;
    line-height: 1.3 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-description-options-panel .ai-field select,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-field select {
    padding: .52rem 1.76rem .52rem .62rem !important;
    font-size: .86rem !important;
    line-height: 1.18 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-input-panel textarea[id$="-topic"],
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-input-panel textarea[id$="-purpose"],
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane #ai-topic {
    height: clamp(108px, 15svh, 136px) !important;
    min-height: 108px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-input-panel textarea[id$="-customInstructions"],
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane #ai-customInstructions {
    height: clamp(70px, 10svh, 90px) !important;
    min-height: 70px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-panel,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-panel {
    min-width: 0 !important;
    min-height: 0 !important;
    border-left: 1px solid rgba(226, 232, 240, .92) !important;
    border-right: 1px solid rgba(226, 232, 240, .92) !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-scroll,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem !important;
    overflow: auto !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-empty,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-empty-state {
    min-height: 100% !important;
    border-radius: 18px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-surface {
    max-width: 100% !important;
    min-height: 100% !important;
    padding: 1rem !important;
    border-radius: 18px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-header-block h3 {
    font-size: 1.3rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-doc-section p,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-doc-list {
    font-size: .94rem !important;
    line-height: 1.5 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-footer {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: .45rem !important;
    padding: .55rem .72rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-footer .ai-status {
    display: none !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-doc-stat {
    padding: .42rem .5rem !important;
    border-radius: 12px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 12px !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-scroll,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-settings-grid {
    min-height: 0 !important;
    overflow: auto !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-option-grid,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-settings-grid,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-advanced .ai-field-grid,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-advanced-body {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .52rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-advanced,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-advanced {
    grid-column: 1 / -1 !important;
    border-radius: 14px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-advanced summary,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 42px !important;
    padding: .58rem .72rem !important;
    font-size: .92rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-generate-button,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 42px !important;
    width: 100% !important;
    margin-top: auto !important;
    padding: .6rem .8rem !important;
    border-radius: 14px !important;
    font-size: .96rem !important;
    font-weight: 850 !important;
    background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .18) !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-head {
    min-height: 48px !important;
    padding: .44rem .72rem !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    place-items: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-head .ai-result-toolbar {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-head h3 {
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-head p {
    margin: .08rem 0 0 !important;
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
    font-size: .78rem !important;
    line-height: 1.15 !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-card {
    padding: .78rem !important;
    border-radius: 17px !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-title {
    margin: .38rem 0 .44rem !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 1.05rem !important;
    line-height: 1.24 !important;
  }

  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-card-actions .ai-ghost-button {
    min-height: 34px !important;
    padding: .36rem .52rem !important;
    border-radius: 12px !important;
    font-size: .78rem !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-layout,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .tool-main,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) #tool-workspace.tool-panel {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-form,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-grid {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-scroll,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-settings-grid {
    overflow: visible !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-workspace,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-input-panel,
html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-panel,
html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-panel {
  background: linear-gradient(180deg, rgba(15, 23, 42, .98), rgba(11, 18, 32, .96)) !important;
  border-color: rgba(96, 165, 250, .42) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-head h3 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-result-head p {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

/* Final scoped ordering for the four AI card tools: keep the app workspace first, trust row below it. */
html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  margin: .58rem auto .94rem !important;
}

html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main > .tool-content-stack {
  order: 3 !important;
}

/* Final parity pass: keep these four AI tools aligned with the approved YouTube Title workspace. */
@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) {
    --ai-four-workspace-height: 524px;
    padding-top: .4rem !important;
    padding-bottom: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero {
    width: min(var(--ai-four-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-four-shell-width), calc(100vw - 96px)) !important;
    margin: -.55rem auto .02rem !important;
    padding: .06rem .75rem .04rem !important;
    min-height: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero h1 {
    max-width: 900px !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero .tool-hero-copy {
    width: min(1180px, 100%) !important;
    max-width: 1180px !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) section.tool-page-hero p {
    width: 100% !important;
    max-width: 1180px !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
    margin-bottom: .9rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-workspace,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane {
    height: 524px !important;
    min-height: 524px !important;
    max-height: 524px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-workspace-grid.ai-document-grid.ai-description-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-form,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-grid {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    grid-template-columns: 306px minmax(0, 1fr) 292px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel {
    padding: 12px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel .ai-field select,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-field select {
    padding-right: 1.28rem !important;
    font-size: .8rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-footer {
    display: none !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-document-empty {
    border-style: solid !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main > .tool-workspace-note {
    height: 42px !important;
    margin-top: 0 !important;
    margin-bottom: .45rem !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) > section.tool-layout > .tool-main > .tool-workspace-note span {
    min-height: 34px !important;
    padding: .4rem .72rem !important;
  }
}

/* Premium self-QA polish: keep the four recent AI workspaces compact without feeling cramped. */
@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel {
    padding: 11px 12px 12px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 251, 255, .96)) !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-scroll,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-settings-grid {
    overflow: auto !important;
    scrollbar-width: thin !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-option-grid,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-settings-grid {
    gap: .6rem .56rem !important;
    align-items: start !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field {
    gap: .14rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field span,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-check span {
    font-size: .74rem !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    color: #334155 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field input,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field textarea,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field select {
    min-height: 40px !important;
    border-radius: 13px !important;
    font-size: .84rem !important;
    font-weight: 650 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72) !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field input::placeholder,
  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field textarea::placeholder {
    color: #94a3b8 !important;
    font-size: .82rem !important;
    font-weight: 650 !important;
    line-height: 1.28 !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-option-grid > .ai-field:has(#ai-emojiLevel) {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel .ai-check,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-check {
    min-height: 40px !important;
    padding: .48rem .6rem !important;
    border-radius: 13px !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel .ai-check input,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel .ai-check input {
    width: 16px !important;
    height: 16px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-advanced,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-advanced {
    border-radius: 13px !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .055) !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-advanced summary,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-advanced summary {
    min-height: 39px !important;
    padding: .48rem .64rem !important;
    font-size: .86rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-generate-wrap {
    margin-top: auto !important;
    padding-top: .68rem !important;
  }

  body.flux-tool-body main[data-tool="ai-tweet-generator"] .ai-description-option-grid > .ai-check {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-generate-button,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-generate-button {
    min-height: 40px !important;
    padding: .52rem .76rem !important;
    border-radius: 13px !important;
    font-size: .9rem !important;
    letter-spacing: 0 !important;
    background: linear-gradient(135deg, #347af0, #245fe8) !important;
    box-shadow: 0 12px 24px rgba(37, 99, 235, .15) !important;
  }

  body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-generate-button i,
  body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-three-pane .ai-generate-button i {
    width: 18px !important;
    height: 18px !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) {
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"]) .ai-description-options-panel,
  html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-blog-title-generator"] .ai-short-settings-panel {
    background: linear-gradient(180deg, rgba(15, 23, 42, .94), rgba(15, 23, 42, .9)) !important;
  }

  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field span,
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-check span {
    color: #cbd5e1 !important;
  }

  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field input,
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field textarea,
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field select,
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-advanced summary,
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-check {
    color: #e5eefc !important;
    -webkit-text-fill-color: #e5eefc !important;
  }

  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field input::placeholder,
  html[data-theme="dark"] body.flux-tool-body main:is([data-tool="ai-caption-generator"], [data-tool="ai-tweet-generator"], [data-tool="ai-email-writer"], [data-tool="ai-product-description-generator"], [data-tool="ai-blog-title-generator"]) .ai-field textarea::placeholder {
    color: #7f8da3 !important;
    -webkit-text-fill-color: #7f8da3 !important;
  }
}

/* AI Caption Generator: final premium polish scoped to this tool only. */
body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-workspace-header .ai-document-toolbar .ai-mini-button[disabled],
body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-workspace-header .ai-document-toolbar .ai-secondary-button[disabled] {
  opacity: .44 !important;
  box-shadow: none !important;
}

body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-document-empty {
  gap: .62rem !important;
  padding: 1rem !important;
}

body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-document-empty i {
  width: 24px !important;
  height: 24px !important;
  stroke-width: 1.9 !important;
}

body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-document-empty h3 {
  font-size: .96rem !important;
  line-height: 1.18 !important;
}

body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-document-empty p {
  max-width: 620px !important;
  font-size: .9rem !important;
  line-height: 1.36 !important;
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-field textarea::placeholder {
  color: #9aa8ba !important;
  -webkit-text-fill-color: #9aa8ba !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-form {
    grid-template-columns: 328px minmax(0, 1fr) 292px !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-primary-grid {
    gap: .58rem !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-input-panel textarea[id$="-topic"] {
    min-height: 106px !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-input-panel textarea[id$="-customInstructions"] {
    min-height: 76px !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced[open] {
    background: rgba(248, 251, 255, .82) !important;
    border-color: rgba(147, 197, 253, .62) !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced[open] summary {
    border-bottom: 1px solid rgba(191, 219, 254, .58) !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced .ai-field-grid {
    gap: .5rem !important;
    padding-top: .5rem !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced .ai-check,
  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced .ai-field {
    min-height: 40px !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-generate-wrap {
    border-top: 1px solid rgba(148, 163, 184, .16) !important;
    padding-top: .78rem !important;
  }

  body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-generate-button {
    box-shadow: 0 10px 22px rgba(37, 99, 235, .15) !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) {
  html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced[open] {
    background: rgba(15, 23, 42, .86) !important;
    border-color: rgba(96, 165, 250, .36) !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-options-panel .ai-advanced[open] summary {
    border-bottom-color: rgba(96, 165, 250, .24) !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-description-generate-wrap {
    border-top-color: rgba(96, 165, 250, .2) !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-caption-generator"] .ai-document-empty p {
    color: #9aa8ba !important;
    -webkit-text-fill-color: #9aa8ba !important;
  }
}

/* AI Meta Description Generator: approved compact three-pane workspace. */
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-layout,
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] #tool-workspace.tool-panel:before,
body.flux-tool-body main[data-tool="ai-meta-description-generator"] #tool-workspace.tool-panel:after,
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero::before,
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero::after,
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero .eyebrow {
  display: none !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-workspace-note span {
  min-height: 34px !important;
  padding: .45rem .76rem !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-three-pane {
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .9em !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}

body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-header .ai-mini-button[disabled],
body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-header .ai-secondary-button[disabled] {
  color: #94a3b8 !important;
  opacity: .72 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] {
    --ai-meta-shell-width: min(1600px, calc(100vw - clamp(72px, 6vw, 144px)));
    --ai-meta-workspace-height: clamp(450px, calc(100svh - 238px), 520px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-meta-description-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="ai-meta-description-generator"] > section.tool-layout,
  html body.flux-tool-body main#main.tool-page[data-tool="ai-meta-description-generator"] section.tool-page-hero {
    width: var(--ai-meta-shell-width) !important;
    max-width: var(--ai-meta-shell-width) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-meta-description-generator"] > .breadcrumb {
    margin-top: .34rem !important;
    margin-bottom: .26rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-meta-description-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero {
    margin: 0 auto .4rem !important;
    padding: .04rem 1rem .08rem !important;
    background: transparent !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-meta-description-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .16rem !important;
    color: #0f172a !important;
    font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-meta-description-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero p {
    max-width: 720px !important;
    margin: 0 auto !important;
    color: #506176 !important;
    font-size: .92rem !important;
    line-height: 1.32 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-three-pane {
    height: var(--ai-meta-workspace-height) !important;
    min-height: 450px !important;
    max-height: 520px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr) !important;
    align-items: center !important;
    gap: .64rem !important;
    min-height: 50px !important;
    padding: .38rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-kicker {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-header-result-toolbar,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-header-result-toolbar {
    justify-content: center !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-header-actions {
    justify-content: flex-end !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-three-form,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-three-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(292px, 326px) minmax(560px, 1fr) minmax(282px, 304px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-settings-panel {
    padding: .84rem 1rem !important;
    min-height: 0 !important;
    overflow: auto !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-primary-panel {
    border-right: 1px solid rgba(226, 232, 240, .92) !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    border-left: 1px solid rgba(226, 232, 240, .92) !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-settings-grid,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-advanced-body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .52rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-settings-panel .ai-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .42rem !important;
    row-gap: .58rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field {
    gap: .2rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-check span {
    color: #344256 !important;
    font-size: .75rem !important;
    line-height: 1.05 !important;
    font-weight: 780 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field select {
    min-height: 40px !important;
    padding: .58rem .72rem !important;
    border-radius: 14px !important;
    font-size: .92rem !important;
    line-height: 1.3 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] #ai-topic {
    height: clamp(112px, 16svh, 148px) !important;
    min-height: 112px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] #ai-customInstructions {
    height: clamp(70px, 10svh, 90px) !important;
    min-height: 70px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-advanced {
    grid-column: 1 / -1 !important;
    border-radius: 14px !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-advanced summary {
    min-height: 40px !important;
    padding: .52rem .68rem !important;
    font-size: .9rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-generate-button {
    min-height: 42px !important;
    width: 100% !important;
    margin-top: auto !important;
    padding: .6rem .8rem !important;
    border-radius: 14px !important;
    font-size: .96rem !important;
    font-weight: 850 !important;
    background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .18) !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-form-status {
    min-height: 18px !important;
    margin: .25rem 0 0 !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-panel {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head {
    min-height: 42px !important;
    padding: .32rem .62rem .24rem !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head .ai-result-toolbar {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head h3 {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head p {
    margin: .08rem 0 0 !important;
    color: #94a3b8 !important;
    font-size: .73rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-results-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: .72rem .86rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-empty-state {
    min-height: 100% !important;
    border-radius: 18px !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-empty-state i {
    width: 26px !important;
    height: 26px !important;
    margin-bottom: .48rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-empty-state h3 {
    font-size: .98rem !important;
    line-height: 1.22 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-empty-state p {
    max-width: 400px !important;
    color: #94a3b8 !important;
    font-size: .9rem !important;
    line-height: 1.38 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-list {
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-card {
    padding: .58rem .64rem !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .065) !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-title {
    margin: .36rem 0 .4rem !important;
    color: #0f172a !important;
    font-size: .92rem !important;
    line-height: 1.36 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-card-actions .ai-ghost-button {
    min-height: 34px !important;
    padding: .42rem .54rem !important;
    border-radius: 11px !important;
    gap: .3rem !important;
    font-size: .78rem !important;
    line-height: 1 !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-layout,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-main,
  body.flux-tool-body main[data-tool="ai-meta-description-generator"] #tool-workspace.tool-panel {
    width: 100% !important;
    max-width: 100% !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head {
  background: rgba(15, 23, 42, .96) !important;
  border-color: rgba(96, 165, 250, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-empty-state p {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-meta-description-generator"] .ai-advanced summary {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #e5eefb !important;
}

/* AI Product Description Generator: product-specific textarea rhythm inside the shared long-output workspace. */
@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="ai-product-description-generator"] .ai-description-primary-grid {
    gap: .44rem !important;
  }

  body.flux-tool-body main[data-tool="ai-product-description-generator"] #ai-long-ai-product-description-generator-features,
  body.flux-tool-body main[data-tool="ai-product-description-generator"] #ai-long-ai-product-description-generator-benefits {
    height: clamp(78px, 11svh, 96px) !important;
    min-height: 78px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-product-description-generator"] #ai-long-ai-product-description-generator-customInstructions {
    height: clamp(66px, 9svh, 82px) !important;
    min-height: 66px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-product-description-generator"] .ai-description-options-panel .ai-field input {
    min-height: 38px !important;
  }
}

/* YouTube Channel Name Generator: align with the approved compact AI app workspace. */
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-layout,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] #tool-workspace.tool-panel::before,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] #tool-workspace.tool-panel::after,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero::before,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero::after,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero .eyebrow {
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-workspace-note span {
  min-height: 34px !important;
  padding: .45rem .76rem !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-pane {
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
  overflow: hidden !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-kicker,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head h3 {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-title,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head p,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-empty-state p {
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
}

body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .9em !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] {
    --ai-channel-shell-width: min(1320px, calc(100vw - 96px));
    --ai-channel-workspace-height: clamp(456px, calc(100svh - 252px), 520px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-channel-name-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="youtube-channel-name-generator"] > section.tool-layout,
  html body.flux-tool-body main#main.tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero {
    width: var(--ai-channel-shell-width) !important;
    max-width: var(--ai-channel-shell-width) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-channel-name-generator"] > .breadcrumb {
    margin-top: .34rem !important;
    margin-bottom: .3rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-channel-name-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero {
    margin: 0 auto .48rem !important;
    padding: .06rem 1rem .1rem !important;
    background: transparent !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .16rem !important;
    color: #0f172a !important;
    font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero p {
    max-width: 740px !important;
    margin: 0 auto !important;
    color: #506176 !important;
    font-size: .92rem !important;
    line-height: 1.32 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-pane {
    height: var(--ai-channel-workspace-height) !important;
    min-height: 456px !important;
    max-height: 520px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr) !important;
    align-items: center !important;
    gap: .64rem !important;
    min-height: 50px !important;
    padding: .38rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-kicker {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-header-result-toolbar {
    justify-content: center !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-header-actions {
    justify-content: flex-end !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-header-result-toolbar,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-form,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(292px, 320px) minmax(560px, 1fr) minmax(292px, 316px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-settings-panel {
    padding: .84rem 1rem !important;
    min-height: 0 !important;
    overflow: auto !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-settings-grid,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced-body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .48rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field {
    gap: .22rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-check span {
    color: #334155 !important;
    font-size: .82rem !important;
    line-height: 1.08 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field select {
    width: 100% !important;
    min-height: 38px !important;
    border-radius: 13px !important;
    padding: .58rem .72rem !important;
    font-size: .92rem !important;
    line-height: 1.28 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] #ai-topic {
    height: clamp(92px, 14svh, 118px) !important;
    min-height: 92px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] #ai-customInstructions {
    height: clamp(70px, 9svh, 88px) !important;
    min-height: 70px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced {
    border-radius: 14px !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary {
    min-height: 44px !important;
    padding: .56rem .72rem !important;
    border-radius: 14px !important;
    font-size: .94rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .55rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-generate-button {
    margin-top: auto !important;
    min-height: 52px !important;
    border-radius: 16px !important;
    font-size: 1rem !important;
    box-shadow: 0 18px 34px rgba(37, 99, 235, .22) !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-panel {
    min-height: 0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head {
    min-height: 58px !important;
    padding: .48rem .74rem !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head h3 {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 1rem !important;
    line-height: 1.12 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head p {
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
    font-size: .78rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head .ai-result-toolbar {
    gap: .32rem !important;
    flex-wrap: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-results-scroll {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem !important;
    overflow: auto !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-empty-state {
    height: 100% !important;
    min-height: 0 !important;
    border-radius: 16px !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-empty-state p {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #e5eefb !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-channel-name-generator"] .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.page-shell.tool-page[data-tool="youtube-channel-name-generator"] .tool-main > .tool-workspace-note {
  order: 2 !important;
}

/* AI workspace shared final guard: keep trust badges below the app surface and avoid duplicate export toolbars. */
html body.flux-tool-body main#main.tool-page[data-ai-workspace] > section.tool-layout > .tool-main {
  display: flex !important;
  flex-direction: column !important;
}

html body.flux-tool-body main#main.tool-page[data-ai-workspace] > section.tool-layout > .tool-main > #tool-workspace.tool-panel {
  order: 1 !important;
}

html body.flux-tool-body main#main.tool-page[data-ai-workspace] > section.tool-layout > .tool-main > .tool-workspace-note {
  order: 2 !important;
  display: flex !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
  padding: .25rem !important;
}

html body.flux-tool-body main#main.tool-page[data-ai-workspace] > section.tool-layout > .tool-main > .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-ai-workspace] :is(.ai-short-three-pane, .ai-prompt-three-pane) .ai-result-panel > .ai-result-head .ai-result-toolbar:not(.ai-header-result-toolbar) {
  display: none !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-transform-footer-actions .ai-secondary-button {
  display: none !important;
}

/* Tweet Formatter: compact the transform action bars without changing the workflow. */
@media (min-width: 961px) {
  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-workspace-header.ai-transform-topbar {
    min-height: 52px !important;
    padding: .52rem .72rem !important;
    gap: .7rem !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-header-actions.ai-transform-toolbar {
    gap: .36rem !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-header-actions.ai-transform-toolbar .ai-secondary-button,
  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-result-toolbar .ai-secondary-button {
    min-height: 34px !important;
    padding: .42rem .56rem !important;
    border-radius: 11px !important;
    gap: .34rem !important;
    font-size: .78rem !important;
    line-height: 1.1 !important;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .07) !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-header-actions.ai-transform-toolbar .ai-secondary-button :is(svg, i),
  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-result-toolbar .ai-secondary-button :is(svg, i) {
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 16px !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-improved-head {
    min-height: 56px !important;
    padding: .55rem .72rem !important;
    gap: .58rem !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-improved-head h3 {
    font-size: 1rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-improved-head p {
    max-width: 150px !important;
    font-size: .76rem !important;
    line-height: 1.18 !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-result-toolbar {
    flex: 0 1 auto !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-result-toolbar .ai-secondary-button {
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-result-toolbar .ai-secondary-button[disabled] {
    opacity: .42 !important;
    box-shadow: none !important;
  }
}

@media (max-width: 960px) {
  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-header-actions.ai-transform-toolbar .ai-secondary-button,
  body.flux-tool-body main[data-tool="tweet-formatter"] .ai-transform-result-toolbar .ai-secondary-button {
    min-height: 38px !important;
    padding: .5rem .58rem !important;
    font-size: .8rem !important;
  }
}

/* Instagram Font Generator: match the approved compact AI app workspace. */
body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-layout,
body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero .eyebrow,
body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero::before,
body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero::after {
  display: none !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-kicker,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head h3 {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head p,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state p {
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .9em !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="instagram-font-generator"] {
    --ai-instagram-font-shell-width: min(1320px, calc(100vw - 96px));
    --ai-instagram-font-workspace-height: clamp(448px, calc(100svh - 312px), 500px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="instagram-font-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="instagram-font-generator"] > section.tool-layout,
  html body.flux-tool-body main#main.tool-page[data-tool="instagram-font-generator"] section.tool-page-hero {
    width: var(--ai-instagram-font-shell-width) !important;
    max-width: var(--ai-instagram-font-shell-width) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="instagram-font-generator"] > .breadcrumb {
    margin-top: .34rem !important;
    margin-bottom: .3rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero {
    margin: 0 auto .48rem !important;
    padding: .06rem 1rem .1rem !important;
    background: transparent !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .16rem !important;
    color: #0f172a !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero p {
    max-width: 740px !important;
    margin: 0 auto !important;
    color: #506176 !important;
    font-size: .92rem !important;
    line-height: 1.32 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane {
    height: var(--ai-instagram-font-workspace-height) !important;
    min-height: 448px !important;
    max-height: 500px !important;
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid rgba(191, 219, 254, .9) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr) !important;
    align-items: center !important;
    gap: .64rem !important;
    min-height: 50px !important;
    padding: .38rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-kicker {
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar {
    justify-content: center !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-actions {
    justify-content: flex-end !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-actions {
    gap: .34rem !important;
    flex-wrap: nowrap !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .56rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-form,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(282px, 316px) minmax(0, 1fr) minmax(252px, 278px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-settings-panel {
    min-height: 0 !important;
    overflow: auto !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel {
    padding: .84rem 1rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .5rem !important;
    padding: .82rem .9rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-settings-grid,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced-body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .48rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check span {
    color: #334155 !important;
    font-size: .82rem !important;
    line-height: 1.08 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field select {
    width: 100% !important;
    min-height: 38px !important;
    border-radius: 13px !important;
    padding: .58rem .72rem !important;
    font-size: .92rem !important;
    line-height: 1.28 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] #ai-textInput {
    height: clamp(108px, 17svh, 134px) !important;
    min-height: 108px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] #ai-customInstructions {
    height: clamp(74px, 10svh, 92px) !important;
    min-height: 74px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check {
    min-height: 40px !important;
    padding: .58rem .68rem !important;
    border-radius: 13px !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-generate-button {
    margin-top: auto !important;
    min-height: 50px !important;
    border-radius: 16px !important;
    font-size: 1rem !important;
    box-shadow: 0 18px 34px rgba(37, 99, 235, .22) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-form-status {
    min-height: 18px !important;
    margin: .2rem 0 0 !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-panel {
    min-height: 0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head {
    min-height: 58px !important;
    padding: .48rem .74rem !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head h3 {
    font-size: 1rem !important;
    line-height: 1.12 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head p {
    font-size: .78rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-results-scroll {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .72rem !important;
    overflow: auto !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state {
    height: 100% !important;
    min-height: 0 !important;
    border-radius: 16px !important;
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-list {
    gap: .56rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-card {
    gap: .42rem !important;
    padding: .72rem .82rem !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .08) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-title {
    margin: .18rem 0 .18rem !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 1.06rem !important;
    line-height: 1.28 !important;
    font-weight: 800 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-badges {
    gap: .32rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-badges span {
    min-height: 28px !important;
    padding: .28rem .52rem !important;
    font-size: .72rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-card-actions {
    gap: .36rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-card-actions .ai-secondary-button {
    min-height: 34px !important;
    padding: .42rem .58rem !important;
    border-radius: 11px !important;
    gap: .32rem !important;
    font-size: .78rem !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state p {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-settings-grid label > span {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced summary {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #e5eefb !important;
}

/* Instagram Font Generator: reliable advanced disclosure behavior across desktop and mobile. */
body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced {
  padding: 0 !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 40px !important;
  padding: .46rem .62rem !important;
  gap: .55rem !important;
  text-align: left !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced summary::after {
  content: "+" !important;
  flex: 0 0 auto !important;
  display: grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  margin-left: auto !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 999px !important;
  background: rgba(239, 246, 255, .78) !important;
  color: #2563eb !important;
  -webkit-text-fill-color: #2563eb !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  transform: none !important;
  transition: background .18s ease, border-color .18s ease, color .18s ease !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] summary {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom: 1px solid rgba(191, 219, 254, .58) !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] summary::after {
  content: "-" !important;
  transform: none !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced:not([open]) .ai-advanced-body {
  display: none !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] .ai-advanced-body {
  display: grid !important;
  padding: .42rem .56rem .46rem !important;
  gap: .36rem !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] .ai-check {
  min-height: 34px !important;
  padding: .4rem .52rem !important;
  border-radius: 12px !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] .ai-field span {
  font-size: .74rem !important;
  line-height: 1.12 !important;
  margin-bottom: .16rem !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] .ai-field select {
  min-height: 36px !important;
  padding: .42rem .55rem !important;
  border-radius: 12px !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] summary {
  border-bottom-color: rgba(96, 165, 250, .28) !important;
}

/* Instagram Font Generator: Stitch reference polish, scoped to this tool only. */
body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane,
body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane :is(button, input, textarea, select, label, summary, p, span) {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane {
  background: rgba(255, 255, 255, .86) !important;
  border: 1px solid rgba(226, 232, 240, .92) !important;
  box-shadow: 0 4px 20px -2px rgba(15, 23, 42, .05), 0 2px 10px -2px rgba(15, 23, 42, .03), inset 0 0 0 1px rgba(255, 255, 255, .42) !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-header {
  min-height: 54px !important;
  padding: .48rem .9rem !important;
  border-bottom-color: rgba(226, 232, 240, .72) !important;
  background: rgba(255, 255, 255, .74) !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-workspace-kicker {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  font-size: .96rem !important;
  font-weight: 800 !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar {
  width: fit-content !important;
  justify-self: center !important;
  gap: .12rem !important;
  padding: .2rem !important;
  border: 1px solid rgba(226, 232, 240, .72) !important;
  border-radius: 12px !important;
  background: #f1f5f9 !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-actions {
  gap: .42rem !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar .ai-mini-button {
  min-height: 30px !important;
  padding: .34rem .58rem !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
  box-shadow: none !important;
  font-size: .76rem !important;
  font-weight: 650 !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar .ai-mini-button:hover,
body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar .ai-mini-button:focus-visible {
  background: #ffffff !important;
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-actions .ai-mini-button {
  min-height: 34px !important;
  padding: .42rem .72rem !important;
  border-radius: 12px !important;
  border-color: rgba(226, 232, 240, .92) !important;
  background: rgba(255, 255, 255, .84) !important;
  color: #334155 !important;
  -webkit-text-fill-color: #334155 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  font-size: .8rem !important;
  font-weight: 650 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-grid {
    grid-template-columns: minmax(270px, 300px) minmax(0, 1fr) minmax(248px, 274px) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-settings-panel {
    background: rgba(248, 250, 252, .38) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-primary-panel {
    padding: 1rem 1.05rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-settings-panel {
    gap: .72rem !important;
    padding: 1rem .96rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-settings-grid {
    gap: .78rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-settings-grid label > span,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check span {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
    font-size: .72rem !important;
    line-height: 1.1 !important;
    font-weight: 750 !important;
    text-transform: uppercase !important;
    letter-spacing: .055em !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check span {
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: .84rem !important;
    font-weight: 650 !important;
    color: #334155 !important;
    -webkit-text-fill-color: #334155 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field select {
    min-height: 42px !important;
    border-radius: 12px !important;
    border-color: rgba(203, 213, 225, .82) !important;
    background: #ffffff !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
    padding: .68rem .82rem !important;
    font-size: .86rem !important;
    font-weight: 600 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] #ai-textInput {
    height: clamp(138px, 22svh, 170px) !important;
    min-height: 138px !important;
    line-height: 1.45 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] #ai-customInstructions {
    height: clamp(92px, 14svh, 120px) !important;
    min-height: 92px !important;
    line-height: 1.45 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check {
    min-height: 42px !important;
    padding: .68rem .78rem !important;
    border-radius: 12px !important;
    border-color: rgba(203, 213, 225, .82) !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check input {
    width: 18px !important;
    height: 18px !important;
    border-radius: 5px !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced {
    border-radius: 12px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced summary {
    min-height: 42px !important;
    padding: .68rem .82rem !important;
    border-radius: 12px !important;
    border: 1px solid rgba(203, 213, 225, .82) !important;
    background: #ffffff !important;
    color: #2563eb !important;
    -webkit-text-fill-color: #2563eb !important;
    font-size: .84rem !important;
    font-weight: 750 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] summary {
    border-bottom-color: rgba(226, 232, 240, .92) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] .ai-advanced-body {
    padding: .56rem .62rem .64rem !important;
    gap: .5rem !important;
    border: 1px solid rgba(203, 213, 225, .82) !important;
    border-top: 0 !important;
    border-bottom-left-radius: 12px !important;
    border-bottom-right-radius: 12px !important;
    background: #ffffff !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced[open] .ai-field select {
    min-height: 40px !important;
    padding: .62rem .72rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-generate-button {
    min-height: 48px !important;
    border-radius: 16px !important;
    background: #2563eb !important;
    box-shadow: 0 10px 20px -5px rgba(37, 99, 235, .40) !important;
    font-size: .98rem !important;
    font-weight: 800 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-generate-button:hover {
    background: #1d4ed8 !important;
    box-shadow: 0 14px 24px -7px rgba(37, 99, 235, .42) !important;
    transform: translateY(-1px) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-panel {
    background: #ffffff !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head {
    min-height: 64px !important;
    padding: .9rem 1rem .7rem !important;
    background: #ffffff !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-result-head h3 {
    font-size: 1.05rem !important;
    font-weight: 800 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-results-scroll {
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state {
    border: 2px dashed rgba(203, 213, 225, .72) !important;
    border-radius: 28px !important;
    background: rgba(248, 250, 252, .58) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state h3 {
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-size: 1.24rem !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state p {
    max-width: 360px !important;
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
    font-size: .92rem !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane :is(button, input, textarea, select, label, summary, p, span) {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-field select,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-check,
  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-advanced summary {
    border-radius: 14px !important;
    border-color: rgba(191, 219, 254, .9) !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-generate-button {
    background: #2563eb !important;
    box-shadow: 0 10px 20px -5px rgba(37, 99, 235, .40) !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-short-three-pane {
  background: rgba(15, 23, 42, .92) !important;
  border-color: rgba(96, 165, 250, .28) !important;
  box-shadow: 0 18px 54px rgba(0, 0, 0, .34), inset 0 0 0 1px rgba(255, 255, 255, .04) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar {
  background: rgba(30, 41, 59, .76) !important;
  border-color: rgba(96, 165, 250, .22) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar .ai-mini-button,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-actions .ai-mini-button {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar .ai-mini-button:hover,
html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-header-result-toolbar .ai-mini-button:focus-visible {
  background: rgba(15, 23, 42, .94) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="instagram-font-generator"] .ai-empty-state {
  background: rgba(15, 23, 42, .62) !important;
  border-color: rgba(96, 165, 250, .28) !important;
}

/* YouTube Channel Name Generator: follow-up compact/premium fixes. */
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-pane,
body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-three-pane :is(button, input, textarea, select, label, summary, p, span) {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-settings-panel {
    gap: .62rem !important;
    padding: .9rem .9rem !important;
    background: rgba(248, 250, 252, .42) !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-settings-grid {
    gap: .62rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field span,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-settings-grid label > span,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-check span {
    color: #475569 !important;
    -webkit-text-fill-color: #475569 !important;
    font-size: .72rem !important;
    line-height: 1.12 !important;
    font-weight: 750 !important;
    text-transform: uppercase !important;
    letter-spacing: .055em !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field select {
    min-height: 40px !important;
    border-radius: 12px !important;
    border-color: rgba(203, 213, 225, .82) !important;
    background: #ffffff !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
    padding: .62rem .76rem !important;
    font-size: .86rem !important;
    font-weight: 600 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced {
    overflow: visible !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 40px !important;
    padding: .62rem .76rem !important;
    border-radius: 12px !important;
    border: 1px solid rgba(203, 213, 225, .82) !important;
    background: #ffffff !important;
    color: #2563eb !important;
    -webkit-text-fill-color: #2563eb !important;
    font-size: .84rem !important;
    font-weight: 750 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary::-webkit-details-marker {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary::after {
    content: "+" !important;
    flex: 0 0 auto !important;
    display: grid !important;
    place-items: center !important;
    width: 24px !important;
    height: 24px !important;
    margin-left: auto !important;
    border: 1px solid rgba(191, 219, 254, .9) !important;
    border-radius: 999px !important;
    background: rgba(239, 246, 255, .78) !important;
    color: #2563eb !important;
    -webkit-text-fill-color: #2563eb !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced[open] summary {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced[open] summary::after {
    content: "-" !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced[open] .ai-advanced-body {
    gap: .48rem !important;
    padding: .5rem .56rem .6rem !important;
    border: 1px solid rgba(203, 213, 225, .82) !important;
    border-top: 0 !important;
    border-bottom-left-radius: 12px !important;
    border-bottom-right-radius: 12px !important;
    background: #ffffff !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-list {
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-card {
    padding: .5rem .58rem !important;
    border-radius: 14px !important;
    border-color: rgba(191, 219, 254, .8) !important;
    background: #ffffff !important;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .055) !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-card-top {
    gap: .38rem !important;
    margin-bottom: .26rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-number b {
    width: 22px !important;
    height: 22px !important;
    border-radius: 8px !important;
    font-size: .76rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-meta {
    gap: .36rem !important;
    font-size: .72rem !important;
    line-height: 1.12 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-character-pill,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-badges span {
    min-height: 24px !important;
    padding: .22rem .45rem !important;
    border-radius: 999px !important;
    font-size: .7rem !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-title {
    margin: .22rem 0 .22rem !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.24 !important;
    font-weight: 780 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-note {
    margin: .06rem 0 .22rem !important;
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
    font-size: .78rem !important;
    line-height: 1.25 !important;
    font-weight: 550 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-badges {
    gap: .28rem !important;
    margin: .18rem 0 .26rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-card-actions {
    gap: .3rem !important;
    margin-top: .28rem !important;
    flex-wrap: wrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-card-actions .ai-secondary-button,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-card-actions .ai-ghost-button {
    min-height: 31px !important;
    padding: .36rem .5rem !important;
    border-radius: 11px !important;
    gap: .26rem !important;
    font-size: .74rem !important;
    line-height: 1 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-card-actions .ai-secondary-button svg,
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-card-actions .ai-ghost-button svg {
    width: 16px !important;
    height: 16px !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary::-webkit-details-marker {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary::after {
    content: "+" !important;
    display: grid !important;
    place-items: center !important;
    width: 24px !important;
    height: 24px !important;
    margin-left: auto !important;
    border: 1px solid rgba(191, 219, 254, .9) !important;
    border-radius: 999px !important;
    background: rgba(239, 246, 255, .78) !important;
    color: #2563eb !important;
    -webkit-text-fill-color: #2563eb !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced[open] summary::after {
    content: "-" !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-card {
  background: rgba(15, 23, 42, .88) !important;
  border-color: rgba(96, 165, 250, .28) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-settings-grid label > span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-check span {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-short-settings-panel {
  background: rgba(15, 23, 42, .72) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced summary,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-advanced[open] .ai-advanced-body {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-channel-name-generator"] .ai-result-note {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero h1,
body[data-theme="dark"].flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero p,
body[data-theme="dark"].flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="youtube-channel-name-generator"] section.tool-page-hero p {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

/* Thumbnail Downloader: focused public-thumbnail preview workspace. */
body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-layout,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero .eyebrow,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero::before,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero::after {
  display: none !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-result-toolbar,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-actions [data-ai-action="history"],
body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-actions [data-ai-action="saved"] {
  display: none !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-title,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-note,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-badges {
  display: none !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero h1,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-kicker,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head h3,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-title {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
}

html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero p,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head p,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-empty-state p,
html:not([data-theme="dark"]) body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-note {
  color: #64748b !important;
  -webkit-text-fill-color: #64748b !important;
}

body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .9em !important;
  font-weight: 620 !important;
  line-height: 1.3 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="thumbnail-downloader"] {
    --ai-thumbnail-shell-width: min(1320px, calc(100vw - 96px));
    --ai-thumbnail-workspace-height: clamp(420px, calc(100svh - 308px), 470px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-downloader"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-downloader"] > section.tool-layout,
  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-downloader"] section.tool-page-hero {
    width: var(--ai-thumbnail-shell-width) !important;
    max-width: var(--ai-thumbnail-shell-width) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="thumbnail-downloader"] > .breadcrumb {
    margin-top: .34rem !important;
    margin-bottom: .3rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero {
    margin: 0 auto .5rem !important;
    padding: .08rem 1rem .12rem !important;
    background: transparent !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .16rem !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero p {
    max-width: 720px !important;
    margin: 0 auto !important;
    font-size: .92rem !important;
    line-height: 1.34 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-three-pane {
    height: var(--ai-thumbnail-workspace-height) !important;
    min-height: 420px !important;
    max-height: 470px !important;
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid rgba(191, 219, 254, .9) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto !important;
    align-items: center !important;
    gap: .64rem !important;
    min-height: 48px !important;
    padding: .38rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-kicker {
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-actions {
    justify-content: flex-end !important;
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .6rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-three-form,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-three-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(292px, 340px) minmax(0, 1fr) minmax(218px, 252px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-settings-panel {
    min-height: 0 !important;
    overflow: auto !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-primary-panel {
    padding: .86rem 1rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .54rem !important;
    padding: .86rem .9rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-settings-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field span {
    color: #334155 !important;
    font-size: .8rem !important;
    line-height: 1.08 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field input,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field textarea,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field select {
    width: 100% !important;
    min-height: 38px !important;
    border-radius: 13px !important;
    padding: .58rem .72rem !important;
    border-color: rgba(191, 219, 254, .92) !important;
    background: #fff !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .92rem !important;
    line-height: 1.28 !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] #ai-youtubeUrl {
    height: clamp(124px, 18svh, 150px) !important;
    min-height: 124px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-generate-button {
    margin-top: auto !important;
    min-height: 48px !important;
    border-radius: 15px !important;
    font-size: .95rem !important;
    box-shadow: 0 18px 34px rgba(37, 99, 235, .22) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-form-status {
    min-height: 18px !important;
    margin: .2rem 0 0 !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-panel {
    min-height: 0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head {
    min-height: 48px !important;
    padding: .38rem .7rem !important;
    justify-content: center !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head h3 {
    font-size: 1.02rem !important;
    line-height: 1.08 !important;
    font-weight: 820 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head p {
    margin-top: .08rem !important;
    font-size: .76rem !important;
    line-height: 1.15 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-results-scroll {
    min-height: 0 !important;
    padding: .46rem .72rem !important;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-empty-state {
    max-width: 520px !important;
    min-height: 250px !important;
    margin: auto !important;
    border-style: dashed !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .98)) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-list {
    max-width: 560px !important;
    margin: 0 auto !important;
    gap: .42rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-card {
    padding: .44rem .52rem .5rem !important;
    border-radius: 16px !important;
    border-color: rgba(191, 219, 254, .88) !important;
    background: #fff !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .08) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-card-top {
    margin-bottom: .28rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-image-preview {
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
    max-width: 312px !important;
    min-height: 0 !important;
    max-height: 176px !important;
    margin: 0 auto !important;
    border-radius: 14px !important;
    border: 1px solid rgba(191, 219, 254, .86) !important;
    background: #eaf3ff !important;
    overflow: hidden !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82) !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-image-preview img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-note {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-badges {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-badges span,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-character-pill {
    min-height: 24px !important;
    padding: .22rem .48rem !important;
    border-radius: 999px !important;
    font-size: .7rem !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-card-actions {
    justify-content: center !important;
    gap: .34rem !important;
    margin-top: .28rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-card-actions .ai-secondary-button {
    min-height: 32px !important;
    padding: .36rem .56rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .76rem !important;
    line-height: 1 !important;
    font-weight: 740 !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-result-toolbar,
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-actions [data-ai-action="history"],
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-header-actions [data-ai-action="saved"] {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero h1 {
    font-size: clamp(2rem, 9vw, 2.5rem) !important;
    line-height: 1.04 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-three-grid {
    display: flex !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-primary-panel {
    order: 1 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-settings-panel {
    order: 2 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-panel {
    order: 3 !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-header {
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head {
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-image-preview {
    aspect-ratio: 16 / 9 !important;
    border-radius: 14px !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-card-actions {
    justify-content: stretch !important;
  }

  body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-card-actions .ai-secondary-button {
    flex: 1 1 auto !important;
    justify-content: center !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-empty-state p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-note,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field span {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-three-pane {
  background: rgba(15, 23, 42, .9) !important;
  border-color: rgba(96, 165, 250, .28) !important;
  box-shadow: 0 24px 70px rgba(2, 6, 23, .34) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-head {
  background: rgba(15, 23, 42, .72) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-results-scroll {
  background: linear-gradient(180deg, rgba(15, 23, 42, .78), rgba(15, 23, 42, .92)) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-card,
html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-empty-state {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="thumbnail-downloader"] .ai-result-image-preview {
  background: rgba(30, 41, 59, .9) !important;
  border-color: rgba(96, 165, 250, .28) !important;
}

/* YouTube Tags Extractor: compact, copy-focused tag workspace. */
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-layout,
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main[data-tool="youtube-tags-extractor"] #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero .eyebrow,
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero::before,
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero::after,
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-actions [data-ai-action="history"],
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-actions [data-ai-action="saved"] {
  display: none !important;
}

body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .9em !important;
  font-weight: 610 !important;
  line-height: 1.3 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] {
    --ai-tags-shell-width: min(1320px, calc(100vw - 96px));
    --ai-tags-workspace-height: clamp(420px, calc(100svh - 308px), 468px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-tags-extractor"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="youtube-tags-extractor"] > section.tool-layout,
  html body.flux-tool-body main#main.tool-page[data-tool="youtube-tags-extractor"] section.tool-page-hero {
    width: var(--ai-tags-shell-width) !important;
    max-width: var(--ai-tags-shell-width) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="youtube-tags-extractor"] > .breadcrumb {
    margin-top: .34rem !important;
    margin-bottom: .3rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero {
    margin: 0 auto .5rem !important;
    padding: .08rem 1rem .12rem !important;
    background: transparent !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .16rem !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero p {
    max-width: 760px !important;
    margin: 0 auto !important;
    font-size: .92rem !important;
    line-height: 1.34 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-three-pane {
    height: var(--ai-tags-workspace-height) !important;
    min-height: 420px !important;
    max-height: 468px !important;
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid rgba(191, 219, 254, .92) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto auto !important;
    align-items: center !important;
    gap: .58rem !important;
    min-height: 48px !important;
    padding: .38rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-workspace-kicker {
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-result-toolbar {
    justify-self: center !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-actions {
    justify-content: flex-end !important;
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .6rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-three-form,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-three-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(300px, 350px) minmax(0, 1fr) minmax(220px, 260px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-settings-panel,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-panel {
    min-height: 0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-settings-panel {
    overflow: auto !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel {
    padding: .86rem 1rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .5rem !important;
    padding: .86rem .9rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel .ai-field-grid,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-settings-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field span {
    color: #334155 !important;
    font-size: .78rem !important;
    line-height: 1.08 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field input,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field textarea,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field select {
    width: 100% !important;
    min-height: 38px !important;
    border-radius: 13px !important;
    padding: .58rem .72rem !important;
    border-color: rgba(191, 219, 254, .92) !important;
    background: #fff !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .92rem !important;
    line-height: 1.28 !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] #ai-textInput {
    height: clamp(124px, 18svh, 150px) !important;
    min-height: 124px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] #ai-customInstructions {
    height: 78px !important;
    min-height: 78px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-check {
    min-height: 38px !important;
    padding: .48rem .6rem !important;
    border-radius: 13px !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-generate-button {
    margin-top: auto !important;
    min-height: 48px !important;
    border-radius: 15px !important;
    font-size: .95rem !important;
    box-shadow: 0 18px 34px rgba(37, 99, 235, .22) !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-form-status {
    min-height: 18px !important;
    margin: .2rem 0 0 !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head {
    min-height: 48px !important;
    padding: .38rem .72rem !important;
    justify-content: center !important;
    text-align: center !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head .ai-result-toolbar {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head h3 {
    font-size: 1rem !important;
    line-height: 1.1 !important;
    font-weight: 820 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head p {
    margin-top: .08rem !important;
    font-size: .76rem !important;
    line-height: 1.15 !important;
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-results-scroll {
    min-height: 0 !important;
    padding: .46rem .72rem !important;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%) !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-empty-state,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-error-card {
    max-width: 560px !important;
    min-height: 250px !important;
    margin: auto !important;
    border-style: dashed !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .98)) !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-list {
    max-width: 760px !important;
    margin: 0 auto !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-card {
    padding: .56rem .62rem .62rem !important;
    border-radius: 16px !important;
    border-color: rgba(191, 219, 254, .88) !important;
    background: #fff !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .08) !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-card-top {
    align-items: center !important;
    margin-bottom: .3rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-title {
    font-size: .94rem !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-note {
    margin: .22rem 0 0 !important;
    font-size: .74rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-tag-grid {
    gap: .32rem !important;
    margin-top: .42rem !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-tag-chip {
    min-height: 30px !important;
    padding: .28rem .48rem !important;
    border-radius: 999px !important;
    gap: .22rem !important;
    font-size: .74rem !important;
    line-height: 1 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-tag-chip svg {
    width: 14px !important;
    height: 14px !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-result-toolbar,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-actions [data-ai-action="history"],
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-header-actions [data-ai-action="saved"] {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero h1 {
    font-size: clamp(2rem, 9vw, 2.5rem) !important;
    line-height: 1.04 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-three-grid {
    display: flex !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel {
    order: 1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-settings-panel {
    order: 2 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-panel {
    order: 3 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-settings-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-settings-grid .ai-field:last-child,
  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-settings-grid .ai-check {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head {
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-card-actions {
    justify-content: stretch !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-empty-state p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-note,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-check span {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-three-pane {
  background: rgba(15, 23, 42, .9) !important;
  border-color: rgba(96, 165, 250, .28) !important;
  box-shadow: 0 24px 70px rgba(2, 6, 23, .34) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-head {
  background: rgba(15, 23, 42, .72) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-results-scroll {
  background: linear-gradient(180deg, rgba(15, 23, 42, .78), rgba(15, 23, 42, .92)) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-check,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-result-card,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-empty-state,
html[data-theme="dark"] body.flux-tool-body main[data-tool="youtube-tags-extractor"] .ai-error-card {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* TikTok Hashtag Generator: dedicated compact three-column workspace. */
body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-layout,
body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-main {
  width: 100% !important;
  max-width: none !important;
}

body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] #tool-workspace.tool-panel {
  order: 1 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-workspace-note {
  order: 2 !important;
  width: fit-content !important;
  max-width: min(760px, calc(100vw - 32px)) !important;
  margin: .62rem auto 1rem !important;
}

body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-content-stack {
  order: 3 !important;
}

body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero .eyebrow,
body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero::before,
body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero::after {
  display: none !important;
}

body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head .ai-result-toolbar {
  display: none !important;
}

body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field input::placeholder,
body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field textarea::placeholder {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
  font-size: .9em !important;
  font-weight: 610 !important;
  line-height: 1.32 !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] {
    --ai-tiktok-shell-width: min(1320px, calc(100vw - 96px));
    --ai-tiktok-workspace-height: clamp(420px, calc(100svh - 308px), 468px);
    width: 100% !important;
    max-width: none !important;
    padding: .68rem 24px 1rem !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="tiktok-hashtag-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="tiktok-hashtag-generator"] > section.tool-layout,
  html body.flux-tool-body main#main.tool-page[data-tool="tiktok-hashtag-generator"] section.tool-page-hero {
    width: var(--ai-tiktok-shell-width) !important;
    max-width: var(--ai-tiktok-shell-width) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="tiktok-hashtag-generator"] > .breadcrumb {
    margin-top: .34rem !important;
    margin-bottom: .3rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero {
    margin: 0 auto .5rem !important;
    padding: .08rem 1rem .12rem !important;
    background: transparent !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero h1 {
    max-width: 980px !important;
    margin: 0 auto .16rem !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero p {
    max-width: 720px !important;
    margin: 0 auto !important;
    font-size: .92rem !important;
    line-height: 1.34 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-tiktok-workspace-height) !important;
    min-height: 420px !important;
    max-height: 468px !important;
    border: 1px solid rgba(191, 219, 254, .92) !important;
    border-radius: 24px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 24px 70px rgba(37, 99, 235, .13) !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-workspace-header {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) auto auto !important;
    align-items: center !important;
    gap: .58rem !important;
    min-height: 48px !important;
    padding: .38rem .86rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-workspace-title {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-workspace-kicker {
    font-size: .98rem !important;
    line-height: 1.15 !important;
    font-weight: 850 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-header-result-toolbar {
    justify-self: center !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-header-actions {
    justify-content: flex-end !important;
    gap: .34rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-workspace-header .ai-mini-button {
    min-height: 34px !important;
    padding: .38rem .6rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .82rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-workspace-header .ai-mini-button svg {
    width: 16px !important;
    height: 16px !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-three-form,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-three-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-three-grid {
    display: grid !important;
    grid-template-columns: minmax(300px, 350px) minmax(0, 1fr) minmax(240px, 280px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-settings-panel,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-panel {
    min-height: 0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-settings-panel {
    overflow: auto !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel {
    padding: .86rem 1rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .4rem !important;
    padding: .6rem .78rem .66rem !important;
    scrollbar-gutter: stable !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-settings-panel .ai-field {
    gap: .24rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel .ai-field-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .32rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-settings-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .42rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel .ai-field span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0 0 0 0) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field span {
    color: #334155 !important;
    font-size: .74rem !important;
    line-height: 1.1 !important;
    font-weight: 740 !important;
    letter-spacing: .01em !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field input,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field textarea,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field select {
    width: 100% !important;
    min-height: 34px !important;
    border-radius: 12px !important;
    padding: .43rem .62rem !important;
    border-color: rgba(191, 219, 254, .92) !important;
    background: #fff !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .86rem !important;
    line-height: 1.28 !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .035) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] #ai-topic {
    height: clamp(124px, 18svh, 150px) !important;
    min-height: 124px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] #ai-customInstructions {
    height: 86px !important;
    min-height: 86px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced {
    flex-shrink: 0 !important;
    border-radius: 13px !important;
    border-color: rgba(191, 219, 254, .95) !important;
    background: linear-gradient(180deg, #ffffff, #f4f8ff) !important;
    min-height: 38px !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced summary {
    min-height: 38px !important;
    padding: .38rem .68rem !important;
    font-size: .84rem !important;
    font-weight: 750 !important;
    color: #1d4ed8 !important;
    -webkit-text-fill-color: #1d4ed8 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    border-radius: 13px !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced summary:hover {
    background: rgba(219, 234, 254, .45) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced summary::after {
    content: "" !important;
    flex: 0 0 auto !important;
    width: 8px !important;
    height: 8px !important;
    margin-left: .5rem !important;
    border-right: 2px solid #1d4ed8 !important;
    border-bottom: 2px solid #1d4ed8 !important;
    transform: rotate(45deg) translateY(-2px) !important;
    transition: transform .18s ease !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced[open] summary::after {
    transform: rotate(225deg) translateY(-2px) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced-body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .42rem !important;
    padding: .1rem .68rem .68rem !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced {
    background: rgba(15, 23, 42, .86) !important;
    border-color: rgba(96, 165, 250, .34) !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced summary {
    color: #93c5fd !important;
    -webkit-text-fill-color: #93c5fd !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced summary:hover {
    background: rgba(30, 58, 138, .35) !important;
  }

  html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-advanced summary::after {
    border-right-color: #93c5fd !important;
    border-bottom-color: #93c5fd !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-generate-button {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    flex-shrink: 0 !important;
    margin-top: .18rem !important;
    min-height: 44px !important;
    border-radius: 14px !important;
    font-size: .92rem !important;
    box-shadow: 0 -10px 16px -12px rgba(15, 23, 42, .16), 0 18px 34px rgba(37, 99, 235, .22) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-form-status {
    min-height: 18px !important;
    margin: .2rem 0 0 !important;
    font-size: .78rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-form-status:empty {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head {
    min-height: 48px !important;
    padding: .38rem .72rem !important;
    justify-content: center !important;
    text-align: center !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head h3 {
    font-size: 1rem !important;
    line-height: 1.1 !important;
    font-weight: 820 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head p {
    margin-top: .08rem !important;
    font-size: .76rem !important;
    line-height: 1.15 !important;
    color: #64748b !important;
    -webkit-text-fill-color: #64748b !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-results-scroll {
    min-height: 0 !important;
    padding: .46rem .72rem !important;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-empty-state,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-error-card {
    max-width: 560px !important;
    min-height: 250px !important;
    margin: auto !important;
    border-style: dashed !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .98)) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-empty-state svg,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-error-card svg {
    width: 28px !important;
    height: 28px !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-empty-state h3,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-error-card h3 {
    font-size: .98rem !important;
    line-height: 1.2 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-empty-state p,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-error-card p {
    font-size: .84rem !important;
    line-height: 1.42 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-list {
    max-width: 760px !important;
    margin: 0 auto !important;
    gap: .46rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-card {
    padding: .56rem .62rem .62rem !important;
    border-radius: 16px !important;
    border-color: rgba(191, 219, 254, .88) !important;
    background: #fff !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .08) !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-card-top {
    align-items: center !important;
    margin-bottom: .3rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-title {
    font-size: .94rem !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-note {
    margin: .22rem 0 0 !important;
    font-size: .74rem !important;
    line-height: 1.25 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-tag-grid {
    gap: .32rem !important;
    margin-top: .42rem !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-tag-chip {
    min-height: 30px !important;
    padding: .28rem .48rem !important;
    border-radius: 999px !important;
    gap: .22rem !important;
    font-size: .74rem !important;
    line-height: 1 !important;
    font-weight: 720 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-tag-chip svg {
    width: 14px !important;
    height: 14px !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-header-result-toolbar,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-header-actions [data-ai-action="history"],
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-header-actions [data-ai-action="saved"] {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero h1 {
    font-size: clamp(2rem, 9vw, 2.5rem) !important;
    line-height: 1.04 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-three-grid {
    display: flex !important;
    flex-direction: column !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel {
    order: 1 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-settings-panel {
    order: 2 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-panel {
    order: 3 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-settings-grid {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-settings-grid .ai-field:last-child,
  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-settings-grid .ai-check {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head {
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-card-actions {
    justify-content: stretch !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero h1,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-workspace-kicker,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-title {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-empty-state p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-note,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-check span {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-three-pane {
  background: rgba(15, 23, 42, .9) !important;
  border-color: rgba(96, 165, 250, .28) !important;
  box-shadow: 0 24px 70px rgba(2, 6, 23, .34) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-primary-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-short-settings-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-head {
  background: rgba(15, 23, 42, .72) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-results-scroll {
  background: linear-gradient(180deg, rgba(15, 23, 42, .78), rgba(15, 23, 42, .92)) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field input,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field textarea,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-field select,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-check,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-result-card,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-empty-state,
html[data-theme="dark"] body.flux-tool-body main[data-tool="tiktok-hashtag-generator"] .ai-error-card {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .34) !important;
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

/* ============================================================
   AI Image Prompt Generator: compact no-scroll 3-column workspace
   (PHASE AI-IMAGE-PROMPT-UX) — scoped to this tool only.
   ============================================================ */

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane {
  width: 100% !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 219, 254, .9) !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-prompt-output-panel,
body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-prompt-builder-panel {
  min-width: 0 !important;
  background: #fff !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field input::placeholder,
body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field textarea::placeholder {
  color: #94a3b8 !important;
  font-size: .85rem !important;
  font-weight: 520 !important;
  opacity: .86 !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-usecase-row .ai-prompt-template-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: .3rem !important;
  padding: 0 0 .2rem !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-template {
  flex: 0 0 auto !important;
  min-height: 32px !important;
  padding: .3rem .58rem !important;
  border: 1px solid rgba(191, 219, 254, .95) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #334155 !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .3rem !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-template:hover {
  border-color: #93c5fd !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-template svg {
  width: 14px !important;
  height: 14px !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field-hidden {
  display: none !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-summary-chips {
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  max-width: 100% !important;
  max-height: 20px !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-summary-chips .ai-prompt-summary-row {
  display: inline-block !important;
  max-width: 180px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #64748b !important;
  font-size: .72rem !important;
  line-height: 1.2 !important;
  font-weight: 640 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-summary-chips .ai-prompt-summary-row + .ai-prompt-summary-row::before {
  content: "•" !important;
  margin: 0 .38rem !important;
  color: #cbd5e1 !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-doc-meta {
  margin: .5rem 0 0 !important;
  color: #94a3b8 !important;
  font-size: .72rem !important;
  line-height: 1.3 !important;
  font-weight: 620 !important;
  letter-spacing: .01em !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-pre {
  font-weight: 430 !important;
  letter-spacing: .01em !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-pre.ai-prompt-negative {
  border-left: 3px solid #fda4af !important;
  background: #fff7f7 !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty-sample {
  margin-top: .6rem !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group {
  flex: 0 0 auto !important;
  border: 1px solid rgba(191, 219, 254, .95) !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #ffffff, #f6faff) !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group summary {
  min-height: 36px !important;
  padding: .36rem .6rem !important;
  font-size: .84rem !important;
  font-weight: 750 !important;
  color: #1d4ed8 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  cursor: pointer !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group summary:hover {
  background: rgba(219, 234, 254, .4) !important;
}

body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group .ai-prompt-section-fields {
  padding: .1rem .6rem .6rem !important;
}

@media (min-width: 1200px) and (min-height: 700px) {
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-image-prompt-generator"] {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-inline: 24px !important;
    padding-top: 6px !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] {
    --ai-image-prompt-shell-width: 1320px;
    --ai-image-prompt-workspace-height: clamp(470px, calc(100svh - 242px), 660px);
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-image-prompt-generator"] > .breadcrumb,
  html body.flux-tool-body main#main.tool-page[data-tool="ai-image-prompt-generator"] > section.tool-layout {
    width: min(var(--ai-image-prompt-shell-width), calc(100vw - 96px)) !important;
    max-width: min(var(--ai-image-prompt-shell-width), calc(100vw - 96px)) !important;
    margin-inline: auto !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-image-prompt-generator"] > .breadcrumb {
    margin-top: .72rem !important;
    margin-bottom: .25rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  html body.flux-tool-body main#main.tool-page[data-tool="ai-image-prompt-generator"] > section.tool-layout > .tool-main {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-image-prompt-generator"] section.tool-page-hero,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero {
    max-width: 1240px !important;
    margin: -.35rem auto .12rem !important;
    padding: .14rem .8rem .1rem !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-image-prompt-generator"] section.tool-page-hero::before,
  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-image-prompt-generator"] section.tool-page-hero::after,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero::before,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero::after,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero .eyebrow {
    content: none !important;
    display: none !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-image-prompt-generator"] section.tool-page-hero h1,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero h1 {
    margin: 0 auto !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: 27.52px !important;
    line-height: 33.58px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
  }

  html body.flux-tool-body main#main.page-shell.tool-page.flux-tool-page[data-tool="ai-image-prompt-generator"] section.tool-page-hero p,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero p {
    max-width: 760px !important;
    width: min(760px, 100%) !important;
    margin: .18rem auto 0 !important;
    color: #526277 !important;
    font-size: .92rem !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    text-align: center !important;
    text-wrap: balance !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane {
    display: flex !important;
    flex-direction: column !important;
    height: var(--ai-image-prompt-workspace-height) !important;
    min-height: 470px !important;
    max-height: 660px !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-workspace-header {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(230px, 1fr) auto minmax(230px, 1fr) !important;
    align-items: center !important;
    gap: .66rem !important;
    min-height: 50px !important;
    max-height: 62px !important;
    padding: .36rem 1rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-workspace-kicker {
    justify-self: start !important;
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .98rem !important;
    line-height: 1.2 !important;
    font-weight: 820 !important;
    letter-spacing: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-prompt-header-output-actions {
    display: flex !important;
    justify-self: center !important;
    justify-content: center !important;
    align-items: center !important;
    gap: .34rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-header-actions {
    gap: .3rem !important;
    flex-wrap: nowrap !important;
    justify-self: end !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-workspace-header .ai-secondary-button {
    min-height: 34px !important;
    padding: .36rem .54rem !important;
    border-radius: 12px !important;
    gap: .3rem !important;
    font-size: .84rem !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-form {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-layout {
    display: grid !important;
    height: 100% !important;
    min-height: 0 !important;
    grid-template-columns: minmax(330px, 360px) minmax(0, 1fr) minmax(300px, 324px) !important;
    gap: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-layout > * {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .46rem !important;
    padding: .72rem .9rem !important;
    border-right: 1px solid #e2e8f0 !important;
    overflow: visible !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-panel {
    display: flex !important;
    flex-direction: column !important;
    gap: .46rem !important;
    padding: .6rem .64rem !important;
    border-left: 1px solid #e2e8f0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-fields,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group .ai-prompt-section-fields {
    display: grid !important;
    gap: .44rem !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group .ai-prompt-section-fields {
    padding: .1rem .6rem .6rem !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group .ai-prompt-section-fields .ai-prompt-field:has(textarea),
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group .ai-prompt-section-fields .ai-prompt-field:nth-child(3):nth-last-child(1) {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-fields {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields {
    flex: 0 0 auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: .4rem !important;
    row-gap: .44rem !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields .ai-prompt-field:first-child {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields .ai-prompt-field:last-child:nth-child(even) {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field {
    gap: .16rem !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field span,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group summary span {
    font-size: .76rem !important;
    line-height: 1.2 !important;
    font-weight: 720 !important;
    color: #334155 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group summary span {
    color: #1d4ed8 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field input,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field textarea,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field select {
    width: 100% !important;
    min-height: 36px !important;
    padding: .4rem .6rem !important;
    font-size: .86rem !important;
    line-height: 1.26 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-panel .ai-prompt-field textarea[name="subject"] {
    height: clamp(96px, 14svh, 130px) !important;
    min-height: 96px !important;
    max-height: 130px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-panel .ai-prompt-field textarea[name="scene"] {
    height: clamp(66px, 10svh, 100px) !important;
    min-height: 66px !important;
    max-height: 100px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group textarea {
    min-height: 58px !important;
    max-height: 84px !important;
    resize: vertical !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-generate-button {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 2 !important;
    flex: 0 0 auto !important;
    min-height: 52px !important;
    min-width: 0 !important;
    width: 100% !important;
    margin-top: .1rem !important;
    border-radius: 14px !important;
    background: #2563eb !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: 0 -10px 14px -12px rgba(15, 23, 42, .18), 0 15px 30px rgba(37, 99, 235, .2) !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-status {
    flex: 0 0 auto !important;
    min-height: 14px !important;
    max-height: 30px !important;
    font-size: .72rem !important;
    line-height: 1.25 !important;
    margin: auto 0 0 !important;
    overflow: hidden !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-panel {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head {
    flex: 0 0 auto !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    align-content: start !important;
    gap: .22rem !important;
    min-height: 38px !important;
    max-height: 96px !important;
    padding: .3rem .62rem .32rem !important;
    text-align: center !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head h3 {
    margin: 0 !important;
    color: #0f172a !important;
    -webkit-text-fill-color: #0f172a !important;
    font-size: .96rem !important;
    line-height: 1.08 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head p {
    margin: 0 !important;
    color: #94a3b8 !important;
    font-size: .72rem !important;
    line-height: 1.1 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: .7rem .84rem .84rem !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    background: #fff !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100% !important;
    border-radius: 18px !important;
    border-style: solid !important;
    background: #fff !important;
    text-align: center !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty {
    gap: .5rem !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty svg {
    width: 54px !important;
    height: 54px !important;
    padding: 13px !important;
    border-radius: 999px !important;
    background: #eff6ff !important;
    color: #2563eb !important;
    box-sizing: border-box !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty strong {
    font-size: .98rem !important;
    line-height: 1.2 !important;
    color: #0f172a !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty p {
    max-width: 380px !important;
    margin: 0 !important;
    font-size: .84rem !important;
    line-height: 1.42 !important;
    color: #64748b !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-document,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-collection {
    max-width: none !important;
    min-height: 100% !important;
    padding: .84rem !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .06) !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-pre {
    margin-bottom: 0 !important;
    padding: .8rem !important;
    font-size: .88rem !important;
    line-height: 1.48 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-workspace-note {
    display: flex !important;
    margin: .58rem auto 1rem !important;
    padding: .25rem !important;
    max-width: min(760px, calc(100% - 32px)) !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-workspace-note span {
    min-height: 32px !important;
    padding: 0 .76rem !important;
    font-size: .8rem !important;
  }
}

@media (min-width: 1200px) and (min-height: 700px) and (max-height: 800px) {
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] {
    --ai-image-prompt-workspace-height: clamp(470px, calc(100svh - 226px), 540px);
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero p {
    display: none !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-panel .ai-prompt-field textarea[name="subject"] {
    height: clamp(88px, 12svh, 110px) !important;
    min-height: 88px !important;
  }
}

@media (max-width: 1199px) {
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane {
    border-radius: 20px !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-layout {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-panel {
    order: 1 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-panel {
    order: 2 !important;
    border-top: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-panel {
    order: 3 !important;
    border-top: 1px solid #e2e8f0 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-panel,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-panel,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-scroll {
    padding: 1rem !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .6rem !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields .ai-prompt-field:first-child {
    grid-column: 1 / -1 !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-primary-fields,
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group .ai-prompt-section-fields {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: .6rem !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-usecase-row .ai-prompt-template-grid {
    flex-wrap: wrap !important;
    overflow: visible !important;
  }
}

@media (max-width: 767px) {
  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-fields {
    grid-template-columns: 1fr !important;
  }

  body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-workspace-header {
    flex-wrap: wrap !important;
    gap: .4rem !important;
  }
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-three-pane .ai-workspace-header,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-builder-panel,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head {
  background: #111827 !important;
  border-color: rgba(125, 211, 252, .24) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-scroll,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-document {
  background: #0f172a !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head h3,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-pre,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero h1 {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-output-head p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .tool-page-hero p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-field span {
  color: #cbd5e1 !important;
  -webkit-text-fill-color: #cbd5e1 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-template,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-summary-chips .ai-prompt-summary-row {
  background: rgba(15, 23, 42, .86) !important;
  border-color: rgba(96, 165, 250, .3) !important;
  color: #e2e8f0 !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-settings-group summary span,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-summary-chips .ai-prompt-summary-row strong {
  color: #93c5fd !important;
  -webkit-text-fill-color: #93c5fd !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-pre.ai-prompt-negative {
  border-left-color: rgba(251, 113, 133, .6) !important;
  background: rgba(76, 5, 25, .28) !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty svg {
  background: rgba(37, 99, 235, .18) !important;
  color: #93c5fd !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty strong {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-empty p,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-doc-meta,
html[data-theme="dark"] body.flux-tool-body main[data-tool="ai-image-prompt-generator"] .ai-prompt-summary-chips .ai-prompt-summary-row {
  color: #94a3b8 !important;
  -webkit-text-fill-color: #94a3b8 !important;
}

/* ============================================================
   AI Grammar Fixer: compact single-line result toolbar + polish
   ============================================================ */

@media (min-width: 961px) {
  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-improved-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    min-height: 54px !important;
    padding: .5rem .72rem !important;
    gap: .56rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-improved-head > div:first-child {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-improved-head h3 {
    font-size: .98rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-improved-head p {
    max-width: 170px !important;
    margin-top: .06rem !important;
    font-size: .74rem !important;
    line-height: 1.16 !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 1 !important;
    -webkit-box-orient: vertical !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-result-toolbar {
    flex: 0 1 auto !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: .3rem !important;
    min-width: 0 !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-result-toolbar .ai-secondary-button {
    min-height: 32px !important;
    padding: .36rem .5rem !important;
    border-radius: 10px !important;
    gap: .28rem !important;
    font-size: .74rem !important;
    line-height: 1.1 !important;
    font-weight: 680 !important;
    white-space: nowrap !important;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .07) !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-result-toolbar .ai-secondary-button :is(svg, i) {
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-result-toolbar .ai-secondary-button[disabled] {
    opacity: .42 !important;
    box-shadow: none !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-header-actions.ai-transform-toolbar {
    gap: .36rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-header-actions.ai-transform-toolbar .ai-secondary-button {
    min-height: 34px !important;
    padding: .42rem .58rem !important;
    border-radius: 11px !important;
    gap: .32rem !important;
    font-size: .8rem !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-header-actions.ai-transform-toolbar .ai-secondary-button :is(svg, i) {
    width: 15px !important;
    height: 15px !important;
    flex: 0 0 15px !important;
  }
}

@media (max-width: 960px) {
  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-result-toolbar {
    flex-wrap: wrap !important;
    gap: .34rem !important;
  }

  body.flux-tool-body main:is([data-tool="ai-grammar-fixer"], [data-tool="ai-rewrite-tool"]) .ai-transform-result-toolbar .ai-secondary-button {
    min-height: 34px !important;
    padding: .4rem .56rem !important;
    border-radius: 11px !important;
    font-size: .78rem !important;
  }
}

/* ===========================================================================
   Reusable: Content Table of Contents (.content-toc) + FAQ category grouping
   (.faq-category). Sitewide, generic — not scoped to a single tool.
   Added per ToolsLuv AI Content System v1 §6 (Section Rules).
   =========================================================================== */
.content-toc {
  margin: 1.1rem 0 1.4rem;
  padding: 1rem 1.15rem;
  border: 1px solid rgba(96,165,250,.18);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(37,99,235,.06), rgba(124,58,237,.03));
}
.content-toc .section-kicker { display: block; margin-bottom: .55rem; }
.content-toc ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: .4rem .9rem;
  counter-reset: toc;
}
@media (min-width: 700px) {
  .content-toc ul { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
.content-toc li { counter-increment: toc; min-width: 0; }
.content-toc a {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  padding: .3rem .1rem;
  color: inherit;
  text-decoration: none;
  font-size: .92rem;
  line-height: 1.4;
  border-radius: 8px;
  transition: color .15s ease, padding-left .15s ease;
}
.content-toc a::before {
  content: counter(toc, decimal-leading-zero);
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: .78rem;
  color: #2563eb;
  opacity: .75;
}
.content-toc a:hover,
.content-toc a:focus-visible {
  color: #1d4ed8;
  padding-left: .3rem;
}
html[data-theme="dark"] .content-toc {
  background: linear-gradient(145deg, rgba(30,58,138,.16), rgba(88,28,135,.1));
  border-color: rgba(96,165,250,.22);
}
html[data-theme="dark"] .content-toc a::before { color: #93c5fd; }
html[data-theme="dark"] .content-toc a:hover,
html[data-theme="dark"] .content-toc a:focus-visible { color: #93c5fd; }

.faq-category {
  margin: 1.3rem 0 .5rem;
  padding-top: 1.1rem;
  border-top: 1px dashed rgba(148,163,184,.3);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #2563eb;
}
.faq-list > .faq-category:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
html[data-theme="dark"] .faq-category {
  color: #93c5fd;
  border-top-color: rgba(96,165,250,.22);
}