.clean-section .chat-demo{max-width:510px;background:#10140e;border:1px solid #ffffff20;border-radius:22px;overflow:hidden;box-shadow:0 16px 50px #0002}
.chat-header{display:flex;align-items:center;gap:11px;padding:16px 18px;border-bottom:1px solid #ffffff12;background:#171c14}
.chat-avatar{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;background:#d6ff6210;border:1px solid #d6ff6225;font-size:25px;color:#d6ff62}
.chat-header p{margin:0;flex:1}.chat-header strong{display:flex;align-items:center;gap:8px;font-size:14px;line-height:1.5;font-weight:600}.chat-header small{display:block;font-size:11px;color:#92a185;margin-top:2px}.chat-online{height:5px;width:5px;border-radius:50%;background:#d6ff62}
.chat-header-actions{display:flex;gap:6px}.chat-header-actions button{height:38px;width:38px;border-radius:50%;display:grid;place-items:center;color:#dce6d2;background:#ffffff07;border:1px solid #ffffff14}.chat-header-actions svg{height:15px;width:15px}
.chat-feed{height:430px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#465039 transparent;padding:20px 18px;display:flex;flex-direction:column;gap:13px;scroll-padding-block:20px;outline-offset:-3px}
.chat-message{flex:none;max-width:86%;animation:chat-arrive .3s ease both;font-size:14px;line-height:1.55}.chat-demo.is-paused .chat-message{animation-play-state:running!important}.chat-message p{margin:0;padding:12px 15px}.chat-user{align-self:flex-end}.chat-ai{align-self:flex-start}.chat-user>p{background:#e9f2e0;color:#17220f;border-radius:17px 17px 3px 17px}.chat-ai>p{background:#232b1e;color:#e2eadb;border:1px solid #ffffff08;border-radius:17px 17px 17px 3px}
.chat-file{display:flex;align-items:center;gap:11px;border:1px solid #d6ff6255;background:#d6ff6211;border-radius:14px;padding:13px 15px;color:#d6ff62;min-width:210px}.chat-file>svg{height:30px;width:30px}.chat-file strong{font:800 23px/1.2 var(--heading);letter-spacing:-1px;color:#f0f6e9}.chat-file small{display:block;color:#9eae8f;font-size:10px;line-height:1.6;margin-top:4px}.chat-sent{font-size:11px;margin-left:auto;align-self:flex-end}
.chat-upload{display:flex;align-items:center;gap:12px;padding:8px 13px 8px 8px;border:1px solid #ffffff22;background:#273020;border-radius:13px}.chat-upload img{height:62px;width:45px;object-fit:cover;border-radius:7px}.chat-upload strong{font-size:12px;font-weight:500;word-break:break-word;color:#edf4e5}.chat-upload small{display:block;font-size:10px;color:#b3c39f;margin-top:5px}
.chat-result{max-width:100%}.chat-result figure{position:relative;width:161px;aspect-ratio:9/16;border:1px solid #d6ff6244;border-radius:16px;overflow:hidden;background:#080b06}.chat-result video{width:100%;height:100%;object-fit:cover}.chat-result figcaption{font-size:10px;line-height:1.6;color:#9baa8c;margin-top:7px;max-width:225px}.chat-preview-tag{position:absolute;top:9px;left:8px;background:#0c1009bb;color:#e6f0dc;padding:3px 6px;border-radius:20px;font-size:8px;line-height:1.5}.chat-result .method-result-play{position:absolute;right:8px;bottom:8px;height:34px;width:34px;min-height:34px;margin:0;padding:0;border-radius:50%;background:#0c1009c9;border:1px solid #ffffff33;color:#fff;display:grid;place-items:center}.chat-result .method-result-play svg{height:13px;width:13px}
.chat-typing{display:flex;align-items:center;gap:5px;padding:15px 17px;align-self:flex-start;background:#232b1e;border-radius:15px;width:max-content;flex:none}.chat-typing i{height:5px;width:5px;border-radius:50%;background:#a5ba8e;animation:chat-dot 1s ease-in-out infinite}.chat-typing i:nth-child(2){animation-delay:.15s}.chat-typing i:nth-child(3){animation-delay:.3s}.chat-demo.is-paused .chat-typing i{animation-play-state:paused}
.chat-dock{position:relative;border-top:1px solid #ffffff12;padding:13px 16px;background:#141a10}.chat-composer{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #ffffff18;border-radius:22px;background:#0d120a;padding:7px 8px 7px 13px;font-size:11px;color:#8ea07d;line-height:1.5}.chat-send{height:28px;width:28px;border-radius:50%;background:#d6ff62;color:#18240d;display:grid;place-items:center;flex:none}.chat-send svg{height:15px;width:15px;transform:rotate(-90deg)}
.chat-requests>p{font-size:10px;color:#9eaf8b;margin:13px 0 8px}.chat-requests>p span{color:#d6ff62}.chat-requests>div{display:flex;gap:7px;overflow-x:auto;scrollbar-width:thin;padding-bottom:5px}.chat-requests button{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none;border:1px solid #ffffff20;border-radius:30px;padding:8px 10px 8px 12px;font-size:11px;min-height:40px;background:#21291b;color:#d9e5cd}.chat-requests button>span{width:23px;height:23px;border-radius:50%;background:#d6ff62;color:#17210c;display:grid;place-items:center;font-size:17px}.chat-requests button:hover,.chat-requests button[aria-pressed="true"]{border-color:#d6ff6277;background:#2b3b20}.chat-dock #method-status{font-size:9px;color:#7f926d;line-height:1.6;margin-top:9px}.chat-dock .method-progress{background:#d6ff6210}.chat-dock .method-progress>i{background:#d6ff62}
.clean-section .chat-demo .method-disclaimer{background:#10140e;color:#7f926d;font-size:9px;line-height:1.6;border-color:#ffffff10;padding:10px 16px}.chat-video-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px;gap:10px;text-align:center;font-size:11px;background:#0b1009eb;color:#dce8d2}.chat-video-error button{padding:7px;background:#d6ff62;color:#17210c;border-radius:7px;min-height:40px;font-size:10px}
@keyframes chat-arrive{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes chat-dot{0%,80%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@media(max-width:640px){.chat-header{padding:13px 15px}.chat-feed{height:380px;padding:16px 14px;gap:11px}.chat-message{font-size:13px;max-width:90%}.chat-message p{padding:11px 13px}.chat-result figure{width:148px}.chat-dock{padding:12px 13px}.chat-composer{font-size:10px}.chat-requests button{font-size:11px}.clean-section .chat-demo{border-radius:20px}.chat-header-actions button{height:38px;width:38px}}
@media(prefers-reduced-motion:reduce){.chat-message,.chat-typing i{animation:none}.chat-feed{scroll-behavior:auto}}
.chat-body{position:relative;min-width:0}
.chat-drag{position:absolute;inset:0;pointer-events:none;overflow:hidden;background:#10140e;z-index:2}
.chat-drop-zone{position:absolute;left:5%;right:5%;top:48%;height:116px;border:1px dashed #d6ff6255;background:#d6ff6205;border-radius:17px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;color:#a9bd91;transition:background .25s,border-color .25s}
.chat-drop-zone>svg{width:25px;height:25px;color:#d6ff62}.chat-drop-zone>span{font-size:15px;line-height:1.5}
.chat-drag-file{position:absolute;left:10%;top:18%;display:flex;align-items:center;gap:10px;padding:15px 17px;width:159px;min-height:65px;background:#243017;border:1px solid #d6ff6280;box-shadow:0 12px 30px #0005;border-radius:13px;color:#eff7e6;transform:rotate(-5deg)}
.chat-drag-file>svg{height:27px;width:27px;color:#d6ff62}.chat-drag-file strong{font:800 23px/1.2 var(--heading);letter-spacing:-.8px}
.chat-drag-cursor{position:absolute;left:calc(10% + 112px);top:calc(18% + 36px);height:34px;width:28px;z-index:3;filter:drop-shadow(0 3px 4px #0008)}
.chat-drag-cursor>svg{height:34px;width:28px;fill:#f7fbf1;stroke:#15200d;stroke-width:1.5}
.chat-drag-click{position:absolute;left:-9px;top:-8px;width:22px;height:22px;border:2px solid #d6ff62;border-radius:50%;opacity:.8;box-shadow:0 0 0 5px #d6ff621c}
.is-dragging .chat-drag-click{opacity:0}.is-dragging .chat-drop-zone{border-color:#d6ff62;background:#d6ff6210}
.is-dropping .chat-drop-zone{background:#d6ff621c}.is-dropping .chat-drag-file{opacity:.75}
@media(max-width:359px){.chat-drop-zone>span{font-size:14px}.chat-drag-file{width:151px;padding-inline:14px}}
@media(prefers-reduced-motion:reduce){.chat-drag{display:none}.chat-drop-zone{transition:none}}

/* Conversa mais simples: leitura maior, vídeo maior e apenas pedidos no rodapé. */
.chat-header strong{font-size:17px}.chat-header small{font-size:14px;margin-top:1px}
.chat-header-actions button{height:40px;width:40px}.chat-header-actions svg{height:17px;width:17px}
.chat-feed{height:470px;padding:18px;gap:12px;scroll-padding-block:18px}
.chat-message{font-size:17px;line-height:1.5;max-width:90%}
.chat-message p{padding:12px 15px}.chat-upload strong{font-size:15px}.chat-upload small{display:none}
.chat-result figure{width:210px;border-radius:18px}
.chat-result .method-result-play{width:40px;height:40px;min-height:40px}
.chat-dock{padding:12px 14px;background:#10140e}
.chat-requests>div{gap:9px;padding-bottom:0;scrollbar-width:none;scroll-snap-type:x proximity}
.chat-requests>div::-webkit-scrollbar{display:none}
.chat-requests button{font-size:15px;min-height:48px;padding:8px 9px 8px 15px;gap:12px;scroll-snap-align:start}
.chat-requests button>span{height:30px;width:30px;font-size:21px}
.chat-sr-only{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.chat-demo-note{font-size:12px;line-height:1.6;color:#9aaa8c;text-align:center;margin:14px auto 0}
@media(max-width:640px){.chat-feed{height:420px;padding:15px 14px;gap:11px}.chat-message{font-size:16px;line-height:1.5;max-width:94%}.chat-message p{padding:11px 14px}.chat-result figure{width:180px}.chat-header{padding:13px 14px}.chat-header strong{font-size:16px}.chat-header small{font-size:13px}.chat-header-actions{gap:5px}.chat-dock{padding:11px 12px}.chat-requests button{font-size:15px}.chat-demo-note{font-size:12px}}
@media(max-width:359px){.chat-result figure{width:168px}.chat-feed{height:410px}.chat-header{gap:8px}.chat-header small{font-size:12px}.chat-header-actions button{width:36px;height:36px}.chat-message{max-width:96%}}

/* As duas versões ficam visíveis também no celular. */
.comparison-section .compare-viewport{grid-template-columns:repeat(2,minmax(0,1fr));max-width:630px;gap:16px;align-items:start}
.comparison-section .compare-viewport[data-view] .compare-pane{display:block;border:0;box-shadow:none;border-radius:0;background:transparent;overflow:visible;min-width:0}
.compare-video-wrap{position:relative;aspect-ratio:9/16;border:1px solid #ffffff25;border-radius:18px;overflow:hidden;background:#11180c}
.compare-video-wrap video{width:100%;height:100%;object-fit:cover}
.compare-pane-edited .compare-video-wrap{border-color:#d6ff6280}
.compare-badge{position:absolute;top:10px;left:10px;border-radius:20px;background:#10150ccc;backdrop-filter:blur(6px);font-size:10px;font-weight:700;letter-spacing:.5px;padding:5px 9px;color:#f1f7e9}
.compare-pane-edited .compare-badge{background:#d6ff62;color:#18240c}
.comparison-section .compare-pane figcaption{display:block;padding:10px 1px 0;border:0;background:transparent;text-align:left;line-height:1.5}
.comparison-section .compare-pane figcaption strong{font-size:14px;font-weight:600;color:#e5efdb}
.comparison-section .compare-pane-edited figcaption strong{color:#d6ff62}
.comparison-section .compare-pane figcaption small{display:block;font-size:11px;line-height:1.55;color:#96a589;margin-top:2px}
.compare-sound{position:absolute;bottom:10px;right:9px;height:36px;width:36px;display:grid;place-items:center;background:#0c120bc9;border:1px solid #ffffff30;color:#fff;border-radius:50%}
.compare-sound svg{height:16px;width:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.comparison-section .compare-controls{max-width:630px}
.comparison-section .compare-viewport>.example-tag{top:auto;bottom:85px;left:12px;font-size:8px}
.comparison-section .compare-viewport.is-playing>.video-big-play{display:none}
.comparison-section .compare-viewport>.video-big-play{background:#10180bc9;color:#d6ff62;border-color:#d6ff6266}
@media(max-width:640px){.comparison-section .compare-viewport{max-width:100%;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.comparison-section .compare-controls{max-width:100%}.compare-video-wrap{border-radius:15px}.compare-badge{font-size:8px;top:8px;left:7px;padding:4px 7px}.compare-sound{height:34px;width:34px;bottom:8px;right:7px}.comparison-section .compare-pane figcaption strong{font-size:12px}.comparison-section .compare-pane figcaption small{font-size:10px}.comparison-section .compare-viewport>.example-tag{bottom:63px;left:6px;font-size:6px;padding:3px 5px}.comparison-section .compare-viewport>.video-big-play{height:45px;width:45px}.comparison-section .compare-viewport>.video-big-play svg{width:17px;height:17px}}

/* Escolha do estilo dentro da conversa. */
.chat-style-picker{position:relative;max-width:100%}
.chat-style-options{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.chat-style-options button{padding:9px 12px;min-height:42px;border:1px solid #ffffff29;border-radius:12px;background:#1c2417;color:#e4eadc;font-size:14px;cursor:pointer}
.chat-style-options button[aria-pressed="true"]{border-color:#ceff59;color:#ceff59;background:#ceff5914;box-shadow:0 0 0 1px #ceff5920}
.chat-style-cursor{display:none;position:absolute;left:62px;top:92px;font-size:26px;color:white;filter:drop-shadow(0 2px 2px #000);pointer-events:none;transform:rotate(-35deg)}
.chat-demo[data-style-selecting="true"] .chat-style-cursor{display:block;animation:chat-style-click 1.4s ease both}
@keyframes chat-style-click{0%{transform:translate(80px,35px) rotate(-35deg);opacity:0}35%{opacity:1}70%,100%{transform:translate(0,0) rotate(-35deg);opacity:1}85%{transform:translate(0,0) rotate(-35deg) scale(.8)}}
.chat-result .chat-result-label{font-size:13px;color:#ceff59;padding:8px 0 0;margin:0;background:none;border:0}
@media(prefers-reduced-motion:reduce){.chat-style-cursor{display:none!important}}