/* Isolated artwork family for /chat/templates-refined. No shared card/composer overrides. */
.tsetup-preview { position: relative; isolation: isolate; }
.tsetup-scene { display: block; position: relative; width: 100%; height: 100%; aspect-ratio: 4 / 3; pointer-events: none; }
.tsetup-art { display: block; width: 100%; height: 100%; overflow: visible; }
.tsetup-art * { vector-effect: non-scaling-stroke; }
.tsetup-panel { fill: var(--surface); stroke: var(--neutral-300); stroke-width: var(--stroke-1); filter: drop-shadow(0 var(--space-1) var(--space-2) var(--black-5)); }
.tsetup-back { fill: var(--neutral-50); stroke: var(--neutral-200); stroke-width: var(--stroke-1); }
.tsetup-selected { fill: var(--primary-100); stroke: var(--neutral-300); stroke-width: var(--stroke-1); }
.tsetup-soft { fill: var(--neutral-100); }
.tsetup-soft-outline { fill: var(--neutral-100); stroke: var(--neutral-300); stroke-width: var(--stroke-1); }
.tsetup-teal { fill: var(--primary-100); }
.tsetup-teal-strong { fill: var(--primary-200); }
.tsetup-teal-outline { fill: var(--primary-100); stroke: var(--neutral-300); stroke-width: var(--stroke-1); stroke-linejoin: round; }
.tsetup-muted { fill: var(--neutral-300); }
.tsetup-mid,.tsetup-mid-fill { fill: var(--neutral-400); }
.tsetup-white { fill: var(--surface); }
.tsetup-clear { fill: none; stroke: var(--neutral-300); stroke-width: var(--stroke-1); }
.tsetup-line { fill: none; stroke: var(--neutral-300); stroke-width: var(--stroke-1); stroke-linecap: round; stroke-linejoin: round; }
.tsetup-signal { fill: none; stroke: var(--neutral-500); stroke-width: var(--stroke-1); stroke-linecap: round; stroke-linejoin: round; }
.tsetup-emphasis { fill: none; stroke: var(--primary-700); stroke-width: var(--stroke-1); stroke-linecap: round; stroke-linejoin: round; }
.tsetup-emphasis-fill { fill: var(--primary-700); }
.tsetup-dashed { fill: none; stroke: var(--neutral-300); stroke-width: var(--stroke-1); stroke-dasharray: 3 4; stroke-linecap: round; stroke-linejoin: round; }
.tsetup-orbit { fill: none; stroke: var(--neutral-300); stroke-width: var(--stroke-1); }
.tsetup-grid { fill: none; stroke: var(--neutral-200); stroke-width: var(--stroke-1); }
.tsetup-landscape { fill: var(--primary-200); }
.tsetup-pointer { fill: var(--surface); stroke: var(--neutral-500); stroke-width: var(--stroke-1); stroke-linejoin: round; }
.tsetup-lens-handle { fill: none; stroke: var(--neutral-300); stroke-width: 5; stroke-linecap: round; }
.tsetup-bubble-tail { fill: var(--surface); stroke: var(--neutral-300); stroke-width: var(--stroke-1); stroke-linejoin: round; }
.tsetup-heart { fill: var(--primary-200); }
.tsetup-wave { fill: none; stroke: var(--neutral-300); stroke-width: 3; stroke-linecap: round; }
.tsetup-brand { position: absolute; display: grid; place-items: center; width: 13.333%; aspect-ratio: 1; border: var(--stroke-1) solid var(--neutral-300); border-radius: var(--radius-xs); background: var(--surface); padding: var(--space-2); }
.tsetup-brand img { display: block; width: 100%; height: 100%; object-fit: contain; }
.tsetup-brand--x { left: 17%; bottom: 21%; transform: rotate(-7deg); }
.tsetup-brand--instagram { right: 16%; top: 20%; transform: rotate(7deg); }

/* Direction paths need more definition than decorative connector strokes. */
.tsetup-scene--campaign .tsetup-dashed,
.tsetup-scene--nurture .tsetup-dashed,
.tsetup-scene--automation .tsetup-dashed { stroke: var(--neutral-400); stroke-width: 1.5; opacity: .65; }

/* Foreground results and action chips float above their underlying documents. */
.tsetup-raised { filter: drop-shadow(0 var(--space-2) var(--space-3) var(--black-10)); }

/* The clarified variant uses objects and brand assets, never explanatory text. */
.tsetup-scene--clear .tsetup-dashed { stroke: var(--neutral-500); stroke-width: 1.3; opacity: 1; }
.tsetup-scene--clear .tsetup-panel { stroke: var(--neutral-300); }
.tsetup-scene--clear .tsetup-signal { stroke: var(--neutral-600); }
.tsetup-scene--clear .tsetup-emphasis { stroke-width: 1.5; }

.tsetup-scene--clear .tsetup-orbit { stroke: var(--neutral-400); stroke-width: 1.3; }

/* Meaningful document rules stay legible; rear materials retain their soft tone. */
.tsetup-scene--clear .tsetup-line { stroke: var(--neutral-400); }

/* Retained catalog styles for archived artwork consumers; current scenes emit no text. */
.tsetup-label { fill: var(--neutral-800); font: var(--type-c2-weight) var(--type-c2-size) var(--font-sans); }
.tsetup-caption { fill: var(--neutral-700); font: var(--type-c1-weight) var(--type-c1-size) var(--font-sans); }

/* Strengthen only symbols that carry the task's meaning, not every contour. */
.tsetup-scene--clear.tsetup-scene--routine .tsetup-signal { stroke-width: 1.5; }
.tsetup-scene--clear.tsetup-scene--automation .tsetup-teal-outline { stroke: var(--primary-700); stroke-width: 1.5; }
.tsetup-scene--clear.tsetup-scene--automation .tsetup-line { stroke: var(--neutral-500); }
.tsetup-scene--clear.tsetup-scene--competitors .tsetup-soft-outline { fill: var(--neutral-200); stroke: var(--neutral-500); }
.tsetup-scene--clear.tsetup-scene--competitors .tsetup-grid { stroke: var(--neutral-300); }

/* Hover study: keep the frame still and move the objects within it. */
.agent-catalog .agent-catalog__card.tsetup-card .onb6-channel-preview.tsetup-preview,
.tsetup-preview { background: var(--tsetup-frame-bg, var(--neutral-50)); overflow: hidden; }
[data-template-tone="100"] { --tsetup-frame-bg: var(--neutral-100); }
.tsetup-art [data-motion-part] { transform-box: fill-box; transform-origin: center; transition: transform 420ms cubic-bezier(.2,.7,.2,1); }
.tsetup-art [data-motion-part^="reveal-"] { opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--clear [data-motion-part="main"] { transform: translateY(calc(-1 * var(--space-2))) scale(1.035); }
  .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--clear [data-motion-part="back"] { transform: translateX(calc(-1 * var(--space-1))) rotate(-2deg); }
  .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--clear [data-motion-part="badge"] { transform: translateY(var(--space-1)); }
  .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene:not(.tsetup-scene--clear) .tsetup-art { transform: scale(1.04); }
  .tsetup-art { transition: transform 420ms cubic-bezier(.2,.7,.2,1); }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--clear [data-motion-part] { animation-duration: 1800ms; animation-timing-function: cubic-bezier(.22,.68,.24,1); animation-fill-mode: both; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--clear [data-motion-part^="reveal-"] { animation-name: tsetup-arrive; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="reveal-2"] { animation-delay: 180ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="reveal-3"] { animation-delay: 360ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="flow"] { animation-name: tsetup-flow; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="clock"] { animation-name: tsetup-clock; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--social [data-motion-part="main"] { animation-name: tsetup-social-post; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--social [data-motion-part="back"] { animation-name: tsetup-social-back; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--seo [data-motion-part="main"] { animation-name: tsetup-rank; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--seo [data-motion-part="back"] { animation-name: tsetup-rank-reorder; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--seo [data-motion-part="secondary"] { animation-name: tsetup-rank-last; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--ai [data-motion-part="main"] { animation-name: tsetup-ai-answer; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--routine [data-motion-part="bars"] { animation-name: tsetup-measure; transform-origin: bottom; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--routine [data-motion-part="secondary"] { animation-name: tsetup-adjust; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--routine [data-motion-part="main"] { animation-name: tsetup-publish; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--campaign [data-motion-part="main"] { animation-name: tsetup-letter; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part^="mail-"] { animation-name: tsetup-send; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="mail-2"] { animation-delay: 180ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="mail-3"] { animation-delay: 360ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--nurture [data-motion-part="main"] { animation-name: tsetup-reply; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--landing [data-motion-part="cursor"] { animation-name: tsetup-click; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--landing [data-motion-part="main"] { animation-name: tsetup-convert; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--audit [data-motion-part="main"] { animation-name: tsetup-scan; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--engagement [data-motion-part="main"] { animation-name: tsetup-reply; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--automation [data-motion-part="bolt"] { animation-name: tsetup-confirm; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--automation [data-motion-part^="output-"] { animation-name: tsetup-publish; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--automation [data-motion-part="output-2"] { animation-delay: 180ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--listening [data-motion-part="source-1"] { animation-name: tsetup-collect-left; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--listening [data-motion-part="source-2"] { animation-name: tsetup-collect-right; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--listening [data-motion-part="main"] { animation-name: tsetup-insight; }
}
@keyframes tsetup-arrive { 0%,25% { opacity: 0; transform: translateY(var(--space-3)) scale(.92); } 65%,100% { opacity: 1; transform: none; } }
@keyframes tsetup-social-post { 0%,12% { transform: none; } 42%,100% { transform: translate(-24px,-6px) scale(.94); } }
@keyframes tsetup-social-back { 0% { transform: none; } 42%,100% { transform: translate(var(--space-1),calc(-1 * var(--space-1))) rotate(2deg); } }
@keyframes tsetup-rank { 0%,12% { transform: none; } 65%,100% { transform: translateY(calc(-1 * var(--space-12))); } }
@keyframes tsetup-rank-reorder { 0%,12% { transform: none; } 65%,100% { transform: translateY(var(--space-10)); } }
@keyframes tsetup-rank-last { 0%,12% { transform: none; } 65%,100% { transform: translateY(var(--space-9)); opacity: .5; } }
@keyframes tsetup-ai-answer { 0% { transform: none; } 42%,100% { transform: translate(-32px,0) scale(.8); } }
@keyframes tsetup-measure { 0% { transform: scaleY(1); } 18% { transform: scaleY(.6); } 45%,100% { transform: scaleY(1); } }
@keyframes tsetup-adjust { 0%,25% { transform: none; } 55%,100% { transform: translateX(var(--space-2)); } }
@keyframes tsetup-publish { 0%,45% { transform: none; } 68% { transform: translateY(calc(-1 * var(--space-3))) scale(1.04); } 100% { transform: translateY(calc(-1 * var(--space-2))); } }
@keyframes tsetup-letter { 0% { transform: none; } 25% { transform: translateY(calc(-1 * var(--space-4))); } 55%,100% { transform: translateY(var(--space-4)); } }
@keyframes tsetup-confirm { 0%,20% { transform: scale(1); } 45% { transform: scale(1.18); } 70%,100% { transform: scale(1); } }
@keyframes tsetup-send { 0%,10% { transform: none; } 40% { transform: translate(var(--space-2),calc(-1 * var(--space-3))); } 70%,100% { transform: none; } }
@keyframes tsetup-reply { 0%,35% { transform: none; } 60% { transform: translateY(calc(-1 * var(--space-3))) scale(1.04); } 100% { transform: translateY(calc(-1 * var(--space-2))); } }
@keyframes tsetup-click { 0%,20% { transform: none; } 48%,100% { transform: translate(calc(-1 * var(--space-4)),calc(-1 * var(--space-3))); } }
@keyframes tsetup-convert { 0%,42% { transform: none; } 54% { transform: scale(.97); } 70%,100% { transform: none; } }
@keyframes tsetup-scan { 0% { transform: none; } 32% { transform: translate(calc(-1 * var(--space-11)),calc(-1 * var(--space-5))); } 62% { transform: translate(calc(-1 * var(--space-9)),var(--space-2)); } 100% { transform: none; } }
@keyframes tsetup-collect-left { 0% { transform: none; } 50%,100% { transform: translate(var(--space-1),var(--space-2)); } }
@keyframes tsetup-collect-right { 0% { transform: none; } 50%,100% { transform: translate(calc(-1 * var(--space-1)),var(--space-2)); } }
@keyframes tsetup-insight { 0%,30% { transform: none; } 65%,100% { transform: translateY(calc(-1 * var(--space-2))) scale(1.05); } }
@keyframes tsetup-clock { 0% { transform: rotate(0deg); } 65%,100% { transform: rotate(90deg); } }
@keyframes tsetup-flow { 0%,10% { opacity: .3; } 45%,100% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .tsetup-art,.tsetup-art [data-motion-part] { animation: none; transition: none; transform: none; }
}

/* Active paths and the converted CTA carry the meaning at thumbnail scale. */
@media (prefers-reduced-motion: no-preference) {
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) :is(.tsetup-scene--campaign,.tsetup-scene--nurture) [data-motion-part="flow"] path { stroke: var(--primary-700); stroke-width: 1.5; }
}
@keyframes tsetup-cta-fill { 0%,35% { fill: var(--primary-100); } 65%,100% { fill: var(--primary-200); } }

.tsetup-scene--nurture [data-motion-part="clock"] { transform-box: view-box; transform-origin: 27.0833% 64.4444%; }
.tsetup-scene--automation [data-motion-part="clock"] { transform-box: view-box; transform-origin: 50% 75%; }
[data-gs-template-options] > label { display: block; margin: var(--space-5) 0 var(--space-3); color: var(--text-secondary); }
[data-gs-template-motion]:disabled { opacity: .4; cursor: default; }

/* Separate rear materials and foreground answers without changing the quiet palette. */
.tsetup-scene--clear .tsetup-back { fill: var(--neutral-100); stroke: var(--neutral-300); }
@media (prefers-reduced-motion: no-preference) {
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--social [data-motion-part="badge"] { animation-name: tsetup-social-channels; }
}
@keyframes tsetup-social-channels { 0% { opacity: 1; } 32%,100% { opacity: 0; transform: translateY(-6px); } }

/* Job-specific stories: publishing, building, comparing and listening are distinct. */
.tsetup-scene--list [data-motion-part="list-row-1"] { opacity: 1; }
.tsetup-scene--list [data-motion-part="list-row-2"] { opacity: 1; }
.tsetup-scene--social [data-motion-part^="metric-"] { transform-box: view-box; transform-origin: 0 74.4444%; transform: scaleY(.55); }
.tsetup-scene--listening [data-motion-part="needle"] { transform-box: view-box; transform-origin: 50.8333% 77.7778%; }
.tsetup-sentiment-low,.tsetup-sentiment-mid,.tsetup-sentiment-high { fill: none; stroke-width: 4; stroke-linecap: round; }
.tsetup-sentiment-low { stroke: var(--danger-100); }
.tsetup-sentiment-mid { stroke: var(--neutral-300); }
.tsetup-sentiment-high { stroke: var(--primary-200); }
@media (prefers-reduced-motion: no-preference) {
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--social [data-motion-part^="metric-"] { animation-name: tsetup-metric-grow; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="metric-2"] { animation-delay: 120ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="metric-3"] { animation-delay: 240ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="trend"] { animation-name: tsetup-trend-draw; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part^="list-row-"] { animation-name: tsetup-row-build; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="list-row-1"] { animation-delay: 280ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="list-row-2"] { animation-delay: 560ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--landing [data-motion-part="main"] > rect:nth-child(2) { animation: tsetup-cta-fill 1800ms ease both; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="analysis"] { animation-name: tsetup-analysis; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--engagement [data-motion-part="back"] { animation-name: tsetup-message-send; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--engagement [data-motion-part="main"] { animation-name: tsetup-response-arrive; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="response"] { animation-name: tsetup-response-write; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--competitors [data-motion-part="main"] { transform: none; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part^="comparison-"] { animation-name: tsetup-compare; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="comparison-1"] { animation-delay: 220ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="comparison-2"] { animation-delay: 440ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="needle"] { animation-name: tsetup-sentiment; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part^="build-"] { animation-name: tsetup-module-build; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="build-2"] { animation-delay: 200ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="build-3"] { animation-delay: 400ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--import [data-motion-part="main"] { animation-name: tsetup-import-page; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--integrations [data-motion-part^="tool-"] { animation-name: tsetup-connect-tool; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--integrations [data-motion-part="tool-2"] { animation-delay: 280ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--setupAudit [data-motion-part="main"] { animation-name: tsetup-scan; }
}
@keyframes tsetup-metric-grow { 0%,20% { transform: scaleY(.55); } 72%,100% { transform: scaleY(1); } }
@keyframes tsetup-trend-draw { 0%,22% { transform: scaleY(.55); } 80%,100% { transform: scaleY(1); } }
@keyframes tsetup-row-build { 0%,15% { opacity: 0; clip-path: inset(0 100% 0 0); } 50%,100% { opacity: 1; clip-path: inset(0); } }
@keyframes tsetup-analysis { 0% { opacity: .45; transform: translateY(var(--space-2)); } 35%,100% { opacity: 1; transform: none; } }
@keyframes tsetup-message-send { 0%,10% { transform: none; } 35%,100% { transform: translateY(calc(-1 * var(--space-2))); } }
@keyframes tsetup-response-arrive { 0%,30% { opacity: .2; transform: translateY(var(--space-2)); } 62%,100% { opacity: 1; transform: none; } }
@keyframes tsetup-response-write { 0%,42% { clip-path: inset(0 100% 0 0); } 82%,100% { clip-path: inset(0); } }
@keyframes tsetup-compare { 0%,15% { opacity: .2; } 46%,100% { opacity: 1; } }
@keyframes tsetup-sentiment { 0%,20% { transform: rotate(0); } 48% { transform: rotate(22deg); } 70%,100% { transform: rotate(16deg); } }
@keyframes tsetup-module-build { 0%,10% { opacity: .15; transform: translateY(var(--space-2)); } 50%,100% { opacity: 1; transform: none; } }
@keyframes tsetup-import-page { 0%,12% { transform: none; } 70%,100% { transform: translate(89px,27px); } }
@keyframes tsetup-connect-tool { 0%,15% { transform: none; } 50% { transform: translateX(var(--space-1)); } 80%,100% { transform: none; } }

.tsetup-scene--social [data-motion-part="trend"] { transform-box: view-box; transform-origin: 0 74.4444%; transform: scaleY(.55); }

/* Version 3: reveal detail only when it explains the action. */
.tsetup-scene--create [data-motion-part="scanline"] { opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="reveal-metrics"] { animation-delay: 180ms; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="generator"] { animation-name: tsetup-generate; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="scanline"] { animation-name: tsetup-build-scan; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--competitors [data-motion-part="main"] { animation-name: tsetup-position; }
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) [data-motion-part="map-link"] { animation-name: tsetup-map-link; }
}
@keyframes tsetup-generate { 0%,10% { transform: none; } 35% { transform: scale(1.08); } 80%,100% { transform: none; } }
@keyframes tsetup-build-scan { 0% { opacity: 0; transform: none; } 10% { opacity: .45; } 80% { opacity: .45; transform: translateY(79px); } 100% { opacity: 0; transform: translateY(79px); } }
@keyframes tsetup-map-focus { 0%,20% { transform: scale(1); } 60%,100% { transform: scale(1.08); } }
@keyframes tsetup-map-link { 0%,15% { opacity: .2; } 60%,100% { opacity: 1; } }

.tsetup-scene--competitors .tsetup-dashed { stroke: var(--neutral-300); stroke-width: var(--stroke-1); }
@media (prefers-reduced-motion: no-preference) {
  [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-scene--import [data-motion-part="flow"] { animation-name: tsetup-import-trail; }
}
@keyframes tsetup-import-trail { 0%,30% { opacity: 1; } 75%,100% { opacity: 0; } }

/* V4: local refinements; archived version styles remain immutable. */
.tsetup-scene--ai .tsetup-teal { fill: var(--primary-50); }
.tsetup-competitor-node { fill: var(--neutral-400); stroke: var(--surface); stroke-width: 3; }
@keyframes tsetup-position { 0% { transform: none; } 65%,100% { transform: translate(var(--space-3),calc(-1 * var(--space-4))); } }

/* Approved artwork frames remain still on the final onboarding surface. */
#view [data-template-edition="v4"] .tsetup-card .tsetup-preview,
#view .agent-discovery-preview .agent-discovery-preview__art { background: var(--neutral-50); overflow: hidden; transform: none; border-radius: var(--radius-xl); }

/* 2026-09-14: align the imported window with all four edges of its destination. */
.tsetup-scene--import [data-motion-part="main"] { transform-box: view-box; transform-origin: 0 0; }
.tsetup-import-content { transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) {
 [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-import-window { animation: tsetup-import-fit 1800ms cubic-bezier(.22,.68,.24,1) both; }
 [data-template-motion="action"] .tsetup-card:is(:hover,:focus-visible,[data-template-preview-active]) .tsetup-import-content { animation: tsetup-import-content-fit 1800ms cubic-bezier(.22,.68,.24,1) both; }
}
@keyframes tsetup-import-fit { 0%,12% { height: 96px; rx: 8px; } 70%,100% { height: 63px; rx: 5px; } }
@keyframes tsetup-import-content-fit { 0%,12% { transform: none; } 70%,100% { transform: translate(3px,-17px) scale(.62); } }

/* Match the AI-answer highlight on the requested scenes, including hover badges. */
:is(.tsetup-scene--seo,.tsetup-scene--engagement,.tsetup-scene--automation) :is(.tsetup-selected,.tsetup-teal,.tsetup-teal-outline) { fill: var(--primary-50); }

/* Selected palette: list, nurture and competitors use the approved softer colors. */
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) :is(.tsetup-teal,.tsetup-selected,.tsetup-teal-outline,.tsetup-teal-strong,.tsetup-heart) { fill: var(--primary-50); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) .tsetup-landscape { fill: var(--primary-100); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) :is(.tsetup-line,.tsetup-clear,.tsetup-grid) { stroke: var(--neutral-300); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) :is(.tsetup-signal,.tsetup-orbit,.tsetup-dashed) { stroke: var(--neutral-400); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) .tsetup-muted { fill: var(--neutral-300); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) :is(.tsetup-mid,.tsetup-mid-fill) { fill: var(--neutral-400); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) .tsetup-competitor-node { fill: var(--neutral-300); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) :is(.tsetup-emphasis,.tsetup-teal-outline) { stroke: var(--primary-600); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) .tsetup-emphasis-fill { fill: var(--primary-600); }
:is([data-template-palette="soft"] .tsetup-scene--clear, .tsetup-scene--clear:is(.tsetup-scene--list,.tsetup-scene--nurture,.tsetup-scene--competitors)) .tsetup-sentiment-high { stroke: var(--primary-100); }

/* Use the new comparison palette for dotted connectors across every template. */
.tsetup-scene--clear .tsetup-dashed { stroke: var(--neutral-400); }