/* VYNNY typography and responsive correction, 2026-09-10.
   Loaded after the existing theme layers. No colour, permission or data changes. */
html[data-vynny-dark="c8"] {
  --vynny-ui-title: clamp(1.375rem, 1rem + .8vw, 1.75rem);
  --vynny-ui-body: .875rem;
  --vynny-ui-table: .8125rem;
  --vynny-ui-detail: .75rem;
  --vynny-ui-leading: 1.5;
}

/* Shared scale for application chrome; artwork and embedded documents keep their own scale. */
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount, #vynnyInternalHumanStudioOverlay) {
  font-size: var(--vynny-ui-body);
  line-height: var(--vynny-ui-leading);
}
html:root[data-vynny-dark="c8"] body #workspace :is(.page-head h1, .r4-ui-head h1, .magic-r30-title),
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay .internal-human-studio-title h1 {
  font-size: var(--vynny-ui-title) !important;
  line-height: 1.25 !important;
  margin: 0 0 .4rem;
  overflow-wrap: break-word;
}
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount, #vynnyInternalHumanStudioOverlay) :is(p, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea, .info-box, .bubble, .integration-purpose, .finance-ops-note, .finance-ops-report) {
  font-size: var(--vynny-ui-body) !important;
  line-height: var(--vynny-ui-leading) !important;
}
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount, #vynnyInternalHumanStudioOverlay) :is(button, .btn, label, small, dt, .eyebrow, .tag, .status, .empty, .kpi-label, .kpi-change, .check-row, .audit-head, .audit-row, .directory-count, .directory-type, .connection-toggle, .secret-set, .secret-clear, .r4-ui-badge, .finance-ops-badge, .finance-ops-tab) {
  font-size: var(--vynny-ui-detail) !important;
  line-height: 1.4 !important;
}
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount) :is(.list-row strong, .channel-identity strong, .creative-tool-workspace span, .creative-tool-workspace strong, .creative-rule-list b, .creative-rule-list span, .creative-paths strong, .creative-asset-meta strong, .creative-source-card strong, .creative-preset-group legend, .brand-dl dd, .brand-context-bar span:not(.status):not(.tag), .approval-step span, .approval-step strong, .approval-summary-grid span:first-child, .learning-control span, .voice-readiness span, .campaign-wizard-steps button b, .campaign-wizard-steps button span, .approval-checklist b, .integration-channel-list span, .integration-channel-list.muted, .integration-card-meta, .integration-links a, .mapping-row strong, .admin-switch strong, .field-sales-policy strong, .field-sales-policy span, .field-sales-score-grid span, .simple-flow-selected span, .uc-r46-steps span, .dcc-r2-effective-list b, .r4-ui-kpi span, .r4-ui-field span, .finance-ops-kpi span, .finance-ops-field span, .finance-ops-flow span) {
  font-size: var(--vynny-ui-detail) !important;
  line-height: 1.4 !important;
}
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount) :is(.creative-job-main h3, .creative-detail h3, .brand-section-card h3) {
  font-size: var(--vynny-ui-body) !important;
  line-height: var(--vynny-ui-leading) !important;
}
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount) :is(table, td, .creative-detail dd, .creative-detail pre) {
  font-size: var(--vynny-ui-table) !important;
  line-height: 1.45 !important;
}
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount) th {
  font-size: var(--vynny-ui-detail) !important;
  line-height: 1.4 !important;
}
html:root[data-vynny-dark="c8"] body #workspace :is(#adminUserBody, #adminDeviceBody, #channelDirectoryBody) :is(button, .btn) {
  font-size: var(--vynny-ui-detail) !important;
  line-height: 1.4 !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}
html:root[data-vynny-dark="c8"] body :is(#toastStack .toast, #profileMenu .profile-item, .topbar .profile-trigger span, .topbar .search-box input) {
  font-size: var(--vynny-ui-table) !important;
  line-height: 1.4 !important;
}

/* Keep words intact. Action groups can move whole buttons to the next row. */
html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount) :is(button.btn, .btn, .finance-ops-tab, .help-tab) {
  min-height: 38px !important;
  height: auto !important;
  max-height: none !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none;
}
html:root[data-vynny-dark="c8"] body #workspace .r18-hf2-finished-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 24rem), 1fr)) !important;
}
html:root[data-vynny-dark="c8"] body #workspace .r18-hf2-finished-card {
  min-width: 0;
  flex-wrap: wrap;
  gap: 12px;
}
html:root[data-vynny-dark="c8"] body #workspace :is(.r18-hf2-finished-actions, .r18-hf2-panel-actions, .creative-hero-actions) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-width: 0 !important;
  max-width: 100%;
  justify-content: flex-start !important;
}
html:root[data-vynny-dark="c8"] body #workspace .r18-hf2-finished-actions > .btn {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

/* Draw decoration inside its own box without clipping card content or focus outlines. */
html:root[data-vynny-dark="c8"] body #workspace .magic-r30-hero::before {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: inherit !important;
  background: radial-gradient(circle 85px at calc(100% - 30px) 0px, var(--vynny-magic-accent, var(--red)) 99%, transparent 100%) !important;
  pointer-events: none;
}
html:root[data-vynny-dark="c8"] body #workspace .creative-hero::after {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: inherit !important;
  box-shadow: none !important;
  background: radial-gradient(circle at calc(100% - 75px) 35px, transparent 0 163px, rgba(196,39,80,.23) 164px 165px, rgba(196,39,80,.035) 166px 206px, rgba(196,39,80,.025) 207px 249px, transparent 250px);
  pointer-events: none;
}

/* Table data owns horizontal scrolling; the surrounding page retains its width. */
html:root[data-vynny-dark="c8"] body #workspace :is(.table-wrap, .table-scroll, .directory-table-wrap, .data-table-wrap, .table-container, .dcc-r2-matrix-wrap) {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto !important;
}

/* Human Studio has an independent document and the same readable UI scale. */
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.human-v2-selected-prompt-head span, .human-v2-selected-prompt-head em, .human-v2-rights-badge, .human-v2-preview-top, .human-v2-technical, .human-v2-publish-status, .human-v2-publish-managed span, .human-v2-ready-chip-r3, .human-v2-context-summary-head-r3 span, .human-v2-result-download) {
  font-size: var(--vynny-ui-detail) !important;
  line-height: 1.4 !important;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.human-v2-goal-choice strong, .human-v2-memory-choice strong, .human-v2-asset-main strong, .human-v2-own-request label strong, .human-v2-publish-choice strong, .human-v2-publish-managed strong, .human-v2-context-item-r3 strong) {
  font-size: var(--vynny-ui-table) !important;
  line-height: 1.4 !important;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.internal-human-studio-header, .human-v2-prompt-helper-head, .human-v2-selected-prompt-head, .human-v2-result-head, .human-v2-finished, .human-v2-result-copy, .human-v2-decision-actions) {
  flex-wrap: wrap;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.human-v2-section, .human-v2-prompt-helper, .human-v2-memory, .human-v2-produced-card, .human-v2-choice, .human-v2-goal-choice, .human-v2-own-request, .human-v2-asset, .internal-human-studio-title) {
  min-width: 0;
  box-sizing: border-box;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.human-v2-task, .human-v2-goal-choice, .human-v2-section-head, .human-v2-steps) :is(strong, small) {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  text-overflow: clip;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.human-v2-channel-grid, .human-v2-assets, .human-v2-preview-grid, .human-v2-output-grid) {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay .human-v2-selected-prompt {
  padding: 13px;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay .human-v2-prompt-speak {
  position: static;
  margin-top: 10px;
  max-width: 100%;
  min-height: 38px;
}
html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay .human-v2-own-request {
  overflow: visible;
}

@media (max-width: 680px) {
  html:root[data-vynny-dark="c8"] body :is(#workspace, #modalMount, #drawerMount, #vynnyInternalHumanStudioOverlay) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) {
    font-size: 1rem !important;
  }
  html:root[data-vynny-dark="c8"] body #workspace .r18-hf2-finished-actions > .btn {
    flex: 1 1 auto !important;
    min-height: 44px !important;
  }
  html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay .internal-human-studio-header {
    position: relative;
  }
  html:root[data-vynny-dark="c8"] body #vynnyInternalHumanStudioOverlay :is(.internal-human-submit, .internal-human-approve, .internal-human-new, .internal-human-studio-close) {
    min-height: 44px;
    white-space: normal;
    overflow-wrap: normal;
  }
}
