.conversation-preview{max-width:1040px;margin:38px auto 28px;text-align:center}
.preview-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px}
.preview-toggle{border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:4px;font:inherit;font-size:12px;padding:12px;cursor:pointer}
.conversation-preview .preview-status{font-size:14px;margin:14px 0 0;min-height:24px}
.preview-tables{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;padding-top:52px}
.preview-table{position:relative;margin:0;min-width:0}
.preview-drawing{position:relative;aspect-ratio:1.5;overflow:hidden}
.preview-half{position:absolute;top:0;width:50%;height:100%;overflow:hidden}
.preview-half.left{left:0}.preview-half.right{right:0}
.preview-half img{position:absolute;width:400%;max-width:none;height:200%;pointer-events:none}
.preview-half.left img{left:calc(var(--col) * -200%);top:calc(var(--row) * -100%)}
.preview-half.right img{left:calc(-100% - var(--col) * 200%);top:calc(var(--row) * -100%)}
.preview-table figcaption{font-size:12px;margin-top:8px}
.preview-bubble{position:absolute;left:0;right:0;top:-44px;margin:auto;max-width:210px;padding:8px 10px;background:#fff8e9;border-radius:16px 17px 17px 4px;font-size:12px;line-height:1.5;min-height:34px;box-sizing:border-box;transition:opacity .25s}
.preview-table:not(:first-child) .preview-bubble{opacity:.55;max-width:55px;font-size:18px;letter-spacing:3px}
.preview-half{animation:preview-breathe 4s ease-in-out infinite}
.preview-table:nth-child(even) .preview-half{animation-delay:-2s}
.preview-moving .preview-half.right{animation:preview-swap 1.2s ease-in-out}
.conversation-preview .preview-note{font-size:12px;line-height:1.7;opacity:.7;margin:24px 0 0}
.preview-paused .preview-half{animation-play-state:paused}
@keyframes preview-breathe{50%{transform:translateY(-2px) rotate(.5deg)}}
@keyframes preview-swap{0%{opacity:1;transform:translateX(0)}45%{opacity:0;transform:translateX(35px)}55%{opacity:0;transform:translateX(-35px)}100%{opacity:1;transform:translateX(0)}}
@media(max-width:600px){.preview-tables{grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 18px;padding-top:56px}.preview-table figcaption{font-size:11px}.preview-top{font-size:12px}.preview-toggle{font-size:11px}.preview-bubble{font-size:11px}.conversation-preview{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.preview-half,.preview-moving .preview-half.right{animation:none}.preview-bubble{transition:none}}