/* Tour animado do Atende Max: uma demonstracao longa, escura, com todas as funcoes (nao e video) */
.tr{--bg:#0a0f0c;--s1:#111815;--s2:#18201c;--s3:#202a25;--ln:#26302a;--tx:#eef3ef;--mu:#8e9b93;--ac:#5ec27f;--hi:#9bebb8;--am:#e9a13b;--bl:#6aa6f0;--rd:#ef6a5e;--pu:#a78bfa;
  position:relative;max-width:1180px;margin:0 auto;font-family:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--tx)}
.tr *{box-sizing:border-box}
.tr-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.tr-tabs{display:flex;gap:6px;flex-wrap:wrap}
.tr-tab{position:relative;overflow:hidden;border:1px solid rgba(17,22,19,.14);background:rgba(255,255,255,.7);color:#27302b;padding:8px 14px;border-radius:999px;font:600 13px/18px inherit;cursor:pointer;transition:background-color .25s,color .25s,border-color .25s,transform .25s}
.tr-tab:hover{border-color:#1f9d55;transform:translateY(-1px)}
.tr-tab i{position:absolute;left:0;bottom:0;height:3px;width:0;background:#1f9d55}
.tr-tab.on{background:#111613;color:#fff;border-color:#111613}
.tr-tab.on i{background:var(--hi);animation:trbar var(--d,10s) linear forwards}
.tr.paused .tr-tab.on i{animation-play-state:paused}
@keyframes trbar{to{width:100%}}
.tr-ctl{display:flex;gap:8px}
.tr-ctl button{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid rgba(17,22,19,.14);background:#fff;color:#111613;cursor:pointer;transition:transform .2s,background-color .2s}
.tr-ctl button:hover{transform:scale(1.07);background:#eef7f1}
.tr-ctl svg{width:16px;height:16px;fill:currentColor}

.tr-win{border-radius:18px;overflow:hidden;background:#0c120f;border:1px solid #1c2620;box-shadow:0 2px 4px rgba(0,0,0,.2),0 40px 80px -30px rgba(10,20,14,.7),0 0 0 6px rgba(255,255,255,.35)}
.tr-bar{display:flex;align-items:center;gap:8px;height:38px;padding:0 14px;background:#101713;border-bottom:1px solid #1c2620}
.tr-bar i{width:10px;height:10px;border-radius:50%;background:#2a352f}
.tr-url{margin-left:10px;flex:1;max-width:340px;padding:4px 12px;border-radius:8px;background:#0a0f0c;color:#7d8a82;font:500 11.5px/16px "Geist Mono",ui-monospace,monospace;transition:color .3s}
.tr-ext{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--hi);font-size:12px;font-weight:600}
.tr-ext img{width:22px;height:22px;border-radius:6px}

.tr-fit{position:relative;width:100%;overflow:hidden}
.tr-stage{position:absolute;left:0;top:0;width:1000px;height:580px;transform-origin:0 0;background:var(--bg);overflow:hidden;font-size:13px;line-height:18px;user-select:none;-webkit-user-select:none}
.tr-sc{position:absolute;inset:0;display:flex;opacity:0;visibility:hidden;transition:opacity .5s}
.tr-sc.on{opacity:1;visibility:visible}
.tr small{color:var(--mu);font-size:11px;line-height:16px}
.tr b{font-weight:600}

/* cursor */
.tr-cur{position:absolute;left:0;top:0;width:26px;height:26px;z-index:60;pointer-events:none;transform:translate(500px,300px);transition:transform .8s cubic-bezier(.45,.05,.2,1);filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.tr-cur svg{width:26px;height:26px}
.tr-cur::after{content:"";position:absolute;left:-9px;top:-9px;width:22px;height:22px;border-radius:50%;border:2px solid var(--hi);opacity:0;transform:scale(.3)}
.tr-cur.click::after{animation:trclick .5s ease-out}
@keyframes trclick{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(1.7)}}
.tr-press{transform:scale(.96)!important;filter:brightness(1.25)}

/* pecas comuns */
.tr-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 14px;border-radius:10px;background:var(--s3);color:var(--tx);font-weight:600;font-size:12.5px;white-space:nowrap;transition:transform .15s,filter .15s,background-color .25s}
.tr-btn.pri{background:var(--hi);color:#0b2a18}
.tr-chip{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:999px;background:var(--s3);color:#d4dad6;font-size:12px;font-weight:500;white-space:nowrap;transition:background-color .25s,color .25s,transform .25s}
.tr-chip.on{background:var(--hi);color:#0b2a18}
.tr-av{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font-size:12px;font-weight:700;color:#fff;background:hsl(var(--h) 40% 36%)}
.tr-toast{position:absolute;right:20px;top:18px;z-index:55;display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;background:#f3fbf6;color:#0b2a18;font-weight:600;font-size:12.5px;box-shadow:0 14px 30px -10px rgba(0,0,0,.6);opacity:0;transform:translateY(-10px) scale(.96);transition:opacity .35s,transform .35s cubic-bezier(.22,1,.36,1)}
.tr-toast.on{opacity:1;transform:none}
.tr-toast::before{content:"";width:8px;height:8px;border-radius:50%;background:#1fb858}
.tr-modal-bg{position:absolute;inset:0;z-index:40;display:grid;place-items:center;background:rgba(3,7,5,.62);opacity:0;visibility:hidden;transition:opacity .3s}
.tr-modal-bg.on{opacity:1;visibility:visible}
.tr-modal{width:430px;padding:20px;border-radius:16px;background:var(--s1);border:1px solid var(--ln);box-shadow:0 30px 60px -20px #000;transform:translateY(12px) scale(.97);transition:transform .35s cubic-bezier(.22,1,.36,1)}
.tr-modal-bg.on .tr-modal{transform:none}
.tr-modal h4{margin:0 0 14px;font-size:16px}
.tr-f{margin-bottom:12px}
.tr-f label{display:block;margin-bottom:5px;color:var(--mu);font-size:11px;font-weight:500}
.tr-in{display:flex;align-items:center;min-height:36px;padding:0 12px;border-radius:10px;background:#0b100d;border:1px solid var(--ln);font-size:13px;transition:border-color .2s,box-shadow .2s}
.tr-in.act{border-color:var(--hi);box-shadow:0 0 0 3px rgba(155,235,184,.16)}
.tr-in.act.caret::after{content:"";width:1px;height:15px;background:var(--hi);margin-left:1px;animation:trcar .8s steps(1) infinite}
@keyframes trcar{50%{opacity:0}}
.tr-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.tr-steps{display:flex;flex-direction:column;gap:6px;margin:4px 0 8px}
.tr-step{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:10px;background:var(--s2);font-size:12.5px;opacity:0;transform:translateY(6px);transition:opacity .35s,transform .35s}
.tr-step.on{opacity:1;transform:none}
.tr-step em{font-style:normal;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:6px;background:var(--s3);color:var(--hi)}

/* ---- cena 1: whatsapp ---- */
.s1 .wl{width:236px;background:#0f1519;border-right:1px solid #1d272d;padding:14px 10px;display:flex;flex-direction:column;gap:4px}
.s1 .wl h5{margin:0 6px 8px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mu);font-weight:700}
.s1 .ch{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px}
.s1 .ch.on{background:#1b262d}
.s1 .ch b{display:block;font-size:13px}.s1 .ch small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.s1 .ch time{margin-left:auto;font-size:10.5px;color:var(--mu)}
.s1 .wm{flex:1;display:flex;flex-direction:column;background:#0b141a;min-width:0}
.s1 .wt{display:flex;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid #1d272d}
.s1 .wt b{display:block;font-size:14px}
.s1 .msgs{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;padding:14px 20px;overflow:hidden}
.s1 .m{display:none;max-width:62%;padding:8px 12px;border-radius:12px;font-size:13px;line-height:18px}
.s1 .m.on{display:block;animation:trpop .45s cubic-bezier(.22,1,.36,1)}
.s1 .m.in{align-self:flex-start;background:#202c33;border-top-left-radius:4px}
.s1 .m.out{align-self:flex-end;background:#005c4b;border-top-right-radius:4px}
.s1 .m small{display:block;text-align:right;color:#9fb8b0;margin-top:2px}
.s1 .m.out .tk{color:#8be0ff;margin-left:4px}
.s1 .au{display:flex;align-items:center;gap:10px;min-width:230px}
.s1 .au .pl{width:28px;height:28px;border-radius:50%;background:#e6e6e6;color:#0b141a;display:grid;place-items:center;font-size:10px;flex:none}
.s1 .au .wv{display:flex;align-items:center;justify-content:space-between;gap:2px;flex:1;height:24px}
.s1 .au .wv i{width:3px;border-radius:2px;background:#8fd3c0}
.s1 .au.play .wv i{animation:trwv .9s ease-in-out infinite alternate}
@keyframes trwv{to{transform:scaleY(.4)}}
.s1 .pic{width:220px;border-radius:9px;overflow:hidden;margin-bottom:6px;background:linear-gradient(135deg,#1b3a2d,#0f2a45)}
.s1 .pic div{height:96px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px}
.s1 .pic span{border-radius:7px;background:rgba(255,255,255,.14)}
.s1 .typing{align-self:flex-start;display:none;gap:4px;padding:11px 14px;border-radius:12px;background:#202c33}
.s1 .typing.on{display:flex}
.s1 .typing i{width:6px;height:6px;border-radius:50%;background:#8696a0;animation:trdot 1s infinite}
.s1 .typing i:nth-child(2){animation-delay:.15s}.s1 .typing i:nth-child(3){animation-delay:.3s}
@keyframes trdot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.s1 .comp{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid #1d272d}
.s1 .comp span{flex:1;padding:9px 14px;border-radius:999px;background:#202c33;color:#7d8e98}
.s1 .am{width:290px;background:#0d1310;border-left:1px solid var(--ln);padding:14px;display:flex;flex-direction:column;gap:10px}
.s1 .am-h{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px}
.s1 .am-h img{width:24px;height:24px;border-radius:7px}
.s1 .am-h u{margin-left:auto;width:8px;height:8px;border-radius:50%;background:var(--ac);box-shadow:0 0 10px var(--ac);text-decoration:none}
.s1 .am-t{display:flex;gap:4px;padding:3px;border-radius:10px;background:var(--s1)}
.s1 .am-t span{flex:1;text-align:center;padding:6px 0;border-radius:8px;font-size:12px;font-weight:600;color:var(--mu)}
.s1 .am-t .on{background:var(--s3);color:var(--tx)}
.s1 .qr{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:10px;background:var(--s1);border:1px solid var(--ln);font-weight:600;font-size:13px;transition:border-color .25s,background-color .25s,transform .2s}
.s1 .qr i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.s1 .qr small{margin-left:auto}
.s1 .qr.new{display:none;border-color:var(--hi);background:#12261b}
.s1 .qr.new.on{display:flex;animation:trpop .5s cubic-bezier(.22,1,.36,1)}
.s1 .qr.hit{border-color:var(--hi);background:#162a20}
.s1 .qr.add{justify-content:center;border-style:dashed;color:var(--hi);background:transparent}
@keyframes trpop{from{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:none}}
.s1 .cl{margin-top:auto;padding:12px;border-radius:12px;background:var(--s1);border:1px solid var(--ln)}
.s1 .cl .r{display:flex;justify-content:space-between;margin-top:6px;font-size:12px}
.s1 .cl .r span{color:var(--mu)}
.s1 .tag{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:rgba(233,161,59,.18);color:var(--am);transition:background-color .4s,color .4s}
.s1 .tag.won{background:rgba(94,194,127,.2);color:var(--hi)}

/* ---- cena 2: funil ---- */
.s2{flex-direction:column;padding:18px 20px;gap:12px}
.hd{display:flex;align-items:center;gap:12px}
.hd h3{margin:0;font-size:20px}.hd small{display:block;margin-top:2px}
.hd .sp{margin-left:auto;display:flex;gap:8px;align-items:center}
.kb{flex:1;display:flex;gap:12px;min-height:0}
.kc{flex:1;display:flex;flex-direction:column;min-width:0;border-radius:14px;background:linear-gradient(180deg,color-mix(in srgb,var(--c) 8%,var(--s1)),var(--s1) 120px);border:1px solid var(--ln);overflow:hidden;position:relative;transition:border-color .25s,box-shadow .25s}
.kc::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--c);box-shadow:0 0 14px var(--c)}
.kc.hov{border-color:var(--c);box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 35%,transparent)}
.kc h5{margin:0;padding:14px 12px 2px;font-size:13px;display:flex;align-items:center;gap:7px}
.kc h5 em{font-style:normal;font-size:10.5px;padding:1px 7px;border-radius:99px;background:color-mix(in srgb,var(--c) 22%,transparent);color:var(--c)}
.kc .v{padding:0 12px 8px;font-size:11px;color:var(--mu)}
.kc .bd{display:flex;flex-direction:column;gap:8px;padding:2px 9px 9px;overflow:hidden;flex:1}
.kd{padding:9px 10px;border-radius:11px;background:var(--s2);border:1px solid var(--ln);display:flex;flex-direction:column;gap:7px;transition:transform .2s,box-shadow .2s,border-color .2s}
.kd .t{display:flex;align-items:center;gap:8px}
.kd .t .tr-av{width:26px;height:26px;font-size:10px}
.kd .t b{font-size:12px;display:block}.kd .t small{display:block;font-size:10px}
.kd .vl{font-size:11.5px;font-weight:700;color:var(--c)}
.kd.lift{transform:scale(1.04) rotate(-2deg);box-shadow:0 20px 34px -12px #000;border-color:var(--hi);z-index:30;position:relative}
.kd.pop{animation:trpop .6s cubic-bezier(.22,1,.36,1)}

/* ---- cena 3: painel ---- */
.s3{flex-direction:column;padding:18px 22px;gap:12px}
.kp{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.kp div{padding:13px 15px;border-radius:13px;background:var(--s1);border:1px solid var(--ln)}
.kp span{display:block;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--mu)}
.kp strong{display:block;margin:6px 0 3px;font-size:23px;letter-spacing:-.02em}
.kp div:first-child strong{color:var(--hi)}
.kp .up{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:99px;background:rgba(94,194,127,.16);color:var(--hi)}
.pn{flex:1;display:grid;grid-template-columns:1.6fr 1fr;gap:12px;min-height:0}
.cd{padding:14px;border-radius:14px;background:var(--s1);border:1px solid var(--ln);display:flex;flex-direction:column;min-width:0}
.cd h5{margin:0;font-size:14px}
.cd small{margin-bottom:8px}
.ch2{flex:1;position:relative;min-height:0}
.ch2 svg{width:100%;height:100%;overflow:visible}
.ln{fill:none;stroke:var(--hi);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:none}
.ln.draw{stroke-dashoffset:0;transition:stroke-dashoffset 1.4s ease}
.ar{fill:url(#trg);opacity:0;transition:opacity .8s .5s}.ar.draw{opacity:1}
.dn{display:flex;align-items:center;gap:18px;flex:1}
.dn svg{width:150px;height:150px;flex:none;transform:rotate(-90deg)}
.dn circle{fill:none;stroke-width:15;transition:stroke-dasharray 1.1s ease}
.lg{display:flex;flex-direction:column;gap:9px;flex:1;font-size:12px}
.lg div{display:flex;align-items:center;gap:8px}
.lg i{width:9px;height:9px;border-radius:50%;background:var(--c)}
.lg b{margin-left:auto}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:6px}
.cal i{font-style:normal;height:20px;border-radius:5px;background:var(--s2);font-size:9.5px;display:grid;place-items:center;color:#7f8c85;transition:background-color .6s}

/* ---- cena 4: vendas e produtos ---- */
.s4{flex-direction:column;padding:18px 22px;gap:12px}
.tb{display:flex;gap:6px}
.tb span{padding:7px 14px;border-radius:999px;font-weight:600;font-size:12.5px;color:var(--mu);background:var(--s1);border:1px solid var(--ln);transition:all .3s}
.tb span.on{color:#0b2a18;background:var(--hi);border-color:var(--hi)}
.tbl{border-radius:14px;overflow:hidden;background:var(--s1);border:1px solid var(--ln);flex:1}
.tr-r{display:grid;grid-template-columns:1.4fr 1.2fr .8fr .7fr;gap:10px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--ln);font-size:12.5px}
.tr-r.th{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--mu);font-weight:700;background:var(--s2)}
.tr-r b{font-weight:600}.tr-r .mn{color:var(--hi);font-weight:700}
.tr-r.new{background:rgba(155,235,184,.1);animation:trpop .6s cubic-bezier(.22,1,.36,1)}
.pg{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:1;align-content:start}
.pc{padding:14px;border-radius:14px;background:var(--s1);border:1px solid var(--ln)}
.pc b{display:block;font-size:14px}.pc .pv{margin-top:8px;font-size:18px;font-weight:700;color:var(--hi)}
.pc.new{animation:trpop .6s cubic-bezier(.22,1,.36,1);border-color:var(--hi)}
.s4 .pane{display:none;flex:1;flex-direction:column;gap:12px;min-height:0}
.s4 .pane.on{display:flex}
.opt{display:flex;flex-direction:column;gap:2px;margin-top:6px;border-radius:10px;background:var(--s2);padding:4px;border:1px solid var(--ln)}
.opt div{padding:7px 10px;border-radius:7px;font-size:12.5px}
.opt div.hl{background:var(--s3)}

/* ---- cena 5: agenda ---- */
.s5{padding:18px 22px;gap:18px}
.s5 .cb{flex:1.35;padding:16px;border-radius:14px;background:var(--s1);border:1px solid var(--ln);display:flex;flex-direction:column}
.s5 .cb .top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.s5 .wk,.s5 .dg{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center}
.s5 .wk span{font-size:10.5px;color:var(--mu);font-weight:600}
.s5 .dg{flex:1;margin-top:6px}
.s5 .dg i{font-style:normal;position:relative;display:grid;place-items:center;border-radius:10px;background:var(--s2);font-size:12.5px;transition:background-color .3s,box-shadow .3s}
.s5 .dg i.ev::after{content:"";position:absolute;bottom:6px;width:5px;height:5px;border-radius:50%;background:var(--am)}
.s5 .dg i.sel{background:#1c3a29;box-shadow:inset 0 0 0 1.5px var(--hi)}
.s5 .ds{flex:1;display:flex;flex-direction:column;gap:10px}
.s5 .ds h5{margin:0;font-size:15px}
.ev2{display:flex;gap:12px;padding:12px 14px;border-radius:12px;background:var(--s1);border:1px solid var(--ln);border-left:3px solid var(--c);align-items:center}
.ev2 time{font-weight:700;color:var(--c);font-size:12.5px;min-width:44px}
.ev2 b{display:block;font-size:13px}
.ev2.new{animation:trpop .6s cubic-bezier(.22,1,.36,1);background:#12261b}
.s5 .ds .tr-btn{align-self:flex-start}

/* ---- cena 6: disparo ---- */
.s6{padding:18px 22px;gap:18px}
.s6 .fm{flex:1.2;display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:14px;background:var(--s1);border:1px solid var(--ln)}
.s6 .fm h4{margin:0;font-size:16px}
.s6 .ct{flex:1;overflow:hidden;display:flex;flex-direction:column;gap:5px}
.s6 .cr{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:9px;background:var(--s2);font-size:12.5px}
.s6 .cr .bx{width:16px;height:16px;border-radius:5px;border:1.5px solid #5d6862;display:grid;place-items:center;transition:all .25s}
.s6 .cr.on .bx{background:var(--hi);border-color:var(--hi)}
.s6 .cr.on .bx::after{content:"";width:4px;height:8px;border:solid #0b2a18;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.s6 .cr em{margin-left:auto;font-style:normal;font-size:11px;color:var(--mu);transition:color .3s}
.s6 .cr.sent em{color:var(--hi)}
.s6 .rt{flex:.8;display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:14px;background:var(--s1);border:1px solid var(--ln)}
.s6 .num{font-size:44px;font-weight:700;letter-spacing:-.03em;color:var(--hi)}
.s6 .pr{height:10px;border-radius:99px;background:var(--s3);overflow:hidden}
.s6 .pr i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#3ddc84,#9bebb8)}
.s6 .bub{padding:12px 14px;border-radius:12px;background:#005c4b;font-size:12.5px;line-height:18px}

/* ---- cena 7: fluxos e ia ---- */
.s7{padding:0}
.s7 .cv{flex:1.55;position:relative;background-image:radial-gradient(#202a25 1px,transparent 1px);background-size:22px 22px}
.nd{position:absolute;min-width:150px;padding:11px 13px;border-radius:12px;background:var(--s2);border:1px solid var(--ln);box-shadow:0 12px 24px -12px #000;opacity:0;transform:scale(.9);transition:opacity .45s,transform .45s cubic-bezier(.22,1,.36,1),border-color .3s,box-shadow .3s}
.nd.on{opacity:1;transform:none}
.nd.glow{border-color:var(--hi);box-shadow:0 0 0 2px rgba(155,235,184,.25),0 12px 24px -12px #000}
.nd small{display:block;text-transform:uppercase;letter-spacing:.05em;font-size:9.5px;font-weight:700;color:var(--c,var(--hi))}
.nd b{display:block;margin-top:2px;font-size:13px}
.nd .chs{display:flex;gap:5px;margin-top:8px;flex-wrap:wrap}
.nd .chs span{font-size:10.5px;padding:2px 8px;border-radius:99px;background:var(--s3);transition:background-color .3s,color .3s}
.nd .chs span.on{background:var(--hi);color:#0b2a18}
.s7 .pv{width:300px;background:#0b141a;border-left:1px solid var(--ln);display:flex;flex-direction:column}
.s7 .pv h5{margin:0;padding:14px 16px;border-bottom:1px solid #1d272d;font-size:13px}
.s7 .pm{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:14px;overflow:hidden}
.s7 .pm .m{display:none;max-width:84%;padding:8px 12px;border-radius:12px;font-size:12.5px;line-height:17px}
.s7 .pm .m.on{display:block;animation:trpop .45s cubic-bezier(.22,1,.36,1)}
.s7 .pm .in{align-self:flex-start;background:#202c33}
.s7 .pm .out{align-self:flex-end;background:#005c4b}
.s7 .pm .bot{align-self:flex-start;background:#1a2a3a;border:1px solid #2b4560}
.s7 .pm .bot small{color:#8ab4e8;display:block;margin-bottom:2px;font-weight:700}

@media (prefers-reduced-motion:reduce){.tr-cur{transition:none}}

/* ===== v2: visual igual ao da extensao (escuro + dourado) nas partes que sao do painel do WhatsApp ===== */
.tr,.gq{--gd:#f1efe8;--gs:#1e1e1e;--gs2:#2a2a2a;--gl:#333;--gt:#f5f5f5;--gm:#9e9e9e}
.s1 .am.gq{width:300px;background:#121212;border-left:1px solid #2a2a2a;padding:0;gap:0}
.gq-h{display:flex;align-items:center;gap:8px;padding:13px 12px 10px;font-size:14px}
.gq-h img{width:22px;height:22px;border-radius:6px}
.gq-hb{margin-left:auto;padding:4px 10px;border-radius:999px;background:var(--gs2);border:1px solid var(--gl);font-size:11px;font-weight:600;color:var(--gt)}
.gq-hb+.gq-hb{margin-left:0}
.gq-s{margin:0 12px 8px;padding:8px 10px;border-radius:8px;background:var(--gs2);border:1px solid var(--gl);color:#8a8a8a;font-size:12.5px}
.gq-chips{display:flex;gap:7px;padding:0 12px 10px;overflow:hidden}
.gq-chips span{flex:none;padding:5px 11px;border-radius:999px;background:var(--gs2);border:1px solid var(--gl);color:var(--gm);font-size:11.5px;font-weight:600}
.gq-chips .on{color:var(--gt);border-color:var(--gd);box-shadow:0 0 0 1px var(--gd)}
.gq-list{flex:1;display:flex;flex-direction:column;gap:8px;padding:0 12px;overflow:hidden}
.gq-i{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;background:var(--gs);border:1px solid var(--gl);transition:border-color .3s,background-color .3s}
.gq-i b{display:block;font-size:12.5px;font-weight:700;color:var(--gt)}
.gq-i small{display:block;margin-top:2px;color:var(--gm);font-size:11px;line-height:15px;max-width:182px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gq-i em{margin-left:auto;font-style:normal;color:var(--gm);font-size:19px;line-height:1}
.gq-d{flex:none;padding:0 5px;border-radius:6px;background:var(--gs2);border:1px solid var(--gl);color:var(--gd);font-size:17px;line-height:22px}
.gq-i.new{display:none;border-color:var(--gd);background:#262312}
.gq-i.new.on{display:flex;animation:trpop .5s cubic-bezier(.22,1,.36,1)}
.gq-i.hit{border-color:var(--gd);box-shadow:0 0 0 1px var(--gd)}
.gq-add{margin:10px 12px 12px;padding:9px;text-align:center;border-radius:9px;background:var(--gd);color:#15120a;font-weight:800;font-size:12.5px;transition:transform .15s,filter .15s}
.gq-modal{width:480px;max-height:540px;padding:18px;border-radius:14px;background:#171717;border:1px solid var(--gl);box-shadow:0 30px 60px -20px #000;color:var(--gt);transform:translateY(12px) scale(.97);transition:transform .35s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column}
.tr-modal-bg.on .gq-modal{transform:none}
.gq-mt{font-size:17px;font-weight:800;margin-bottom:12px}
.gq-f{margin-bottom:10px}
.gq-f label,.gq-lb{display:block;margin-bottom:5px;color:var(--gm);font-size:11px;font-weight:700}
.gq-in{display:flex;align-items:center;min-height:34px;padding:0 11px;border-radius:8px;background:#111;border:1px solid var(--gl);font-size:13px;color:var(--gt);transition:border-color .2s,box-shadow .2s}
.gq-in.tall{min-height:58px;align-items:flex-start;padding-top:8px}
.gq-in.act{border-color:var(--gd);box-shadow:0 0 0 1px var(--gd)}
.gq-in.act.caret::after{content:"";width:1px;height:15px;background:var(--gd);margin-left:1px;animation:trcar .8s steps(1) infinite}
.gq-blocks{flex:1;min-height:0;max-height:230px;overflow:hidden;display:flex;flex-direction:column;gap:7px;margin-bottom:9px;scroll-behavior:smooth}
.gb{display:none;padding:9px 10px;border-radius:10px;background:var(--gs);border:1px solid var(--gl)}
.gb.on{display:block;animation:trpop .45s cubic-bezier(.22,1,.36,1)}
.gb-h{display:flex;justify-content:space-between;margin-bottom:7px;font-size:11.5px}
.gb-h b{color:var(--gd)}.gb-h span{color:var(--gm);font-size:11px}
.gb-in{min-height:30px;padding:6px 10px;border-radius:7px;background:#111;border:1px solid var(--gl);font-size:12.5px;line-height:17px}
.gb-in.act{border-color:var(--gd);box-shadow:0 0 0 1px var(--gd)}
.gb-in.act.caret::after{content:"";display:inline-block;width:1px;height:14px;background:var(--gd);margin-left:1px;vertical-align:-2px;animation:trcar .8s steps(1) infinite}
.gb-in.sm{display:inline-block;min-height:28px;padding:5px 10px}
.gb-row{display:flex;gap:8px;align-items:center}.gb-row label{color:var(--gm);font-size:11.5px}
.gb-file{display:flex;align-items:center;gap:10px;font-size:12.5px}.gb-file small{display:block;color:var(--gm);font-size:11px}
.gb-ic{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--gs2);color:var(--gd);font-weight:800;font-size:11px}
.gb-ic.im{background:linear-gradient(135deg,#1b3a2d,#0f2a45)}.gb-ic.pd{background:#3a1f1f;color:#ff8a80}.gb-ic.vd{background:#1f2f46;color:#8ab4e8}
.gq-acts{display:flex;flex-wrap:wrap;gap:6px}
.gq-acts span{padding:6px 10px;border-radius:8px;background:var(--gs2);border:1px solid var(--gl);font-size:11.5px;font-weight:700;color:var(--gt);transition:background-color .25s,border-color .25s,color .25s}
.gq-acts span.used{border-color:var(--gd);color:var(--gd)}
.gq-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:13px}
.gq-b{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:8px;background:var(--gs2);border:1px solid var(--gl);color:var(--gt);font-weight:700;font-size:12.5px;white-space:nowrap}
.gq-b.pri{background:var(--gd);border-color:var(--gd);color:#15120a}
.gq-b.gold{border-color:var(--gd);color:var(--gd)}
/* novas bolhas do chat: PDF, video, Pix, digitando meu */
.s1 .doc{display:flex;align-items:center;gap:10px;min-width:220px;padding:8px;border-radius:9px;background:rgba(0,0,0,.22);margin-bottom:3px}
.s1 .dc{display:grid;place-items:center;width:36px;height:42px;border-radius:6px;background:#ef5350;color:#fff;font-size:10px;font-weight:800}
.s1 .doc b{display:block;font-size:12.5px}.s1 .doc small{display:block;text-align:left;margin:0}
.s1 .vdo{position:relative;width:220px;height:124px;border-radius:9px;background:linear-gradient(135deg,#23495f,#162c3a);display:grid;place-items:center;margin-bottom:3px}
.s1 .vdo span{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:16px}
.s1 .vdo em{position:absolute;left:8px;bottom:6px;font-style:normal;font-size:11px;color:#dff}
.s1 .pxm{min-width:230px;padding:10px;border-radius:9px;background:rgba(0,0,0,.22);margin-bottom:3px}
.s1 .pxm small{text-align:left;color:#8be0c8;font-weight:700;letter-spacing:.05em;margin:0}
.s1 .pxm b{display:block;margin:2px 0}.s1 .pxm div{color:#d7efe7;font-size:12.5px}
.s1 .pxm span{display:block;margin-top:8px;padding:6px;text-align:center;border-radius:7px;background:rgba(255,255,255,.12);font-weight:700;font-size:12px}
.s1 .typing.me{align-self:flex-end;background:#005c4b}
/* funil: espaco reservado e cartao viajando por cima */
.kph{flex:none;height:0;border-radius:11px;border:1.5px dashed color-mix(in srgb,var(--c,#9bebb8) 70%,transparent);background:color-mix(in srgb,var(--c,#9bebb8) 8%,transparent);transition:height .5s cubic-bezier(.22,1,.36,1);box-sizing:border-box;margin:-4px 0}
.kc .bd{transition:none}
.kd.fl{box-shadow:0 26px 40px -14px #000,0 0 0 1.5px var(--hi);border-color:var(--hi)}
.kc .ct.bump{animation:trbump .6s cubic-bezier(.34,1.56,.64,1)}
@keyframes trbump{0%{transform:scale(1)}40%{transform:scale(1.5);filter:brightness(1.4)}100%{transform:scale(1)}}
/* agenda no estilo da extensao */
.s5.gq{background:#0b0b0b}
.s5 .a-bg{position:absolute;inset:0;background:radial-gradient(60% 70% at 50% 30%,#1a1a1a,#0a0a0a)}
.s5 .a-dlg{position:relative;margin:auto;width:880px;height:520px;padding:18px 20px;border-radius:16px;background:#141414;border:1px solid var(--gl);box-shadow:0 40px 80px -30px #000;color:var(--gt);display:flex;flex-direction:column;gap:12px;overflow:hidden}
.s5 .a-top{display:flex;justify-content:space-between;align-items:flex-start}
.s5 .a-top small{color:var(--gm);display:block;margin-top:2px}
.s5 .a-bts{display:flex;gap:8px}
.s5 .a-body{flex:1;display:grid;grid-template-columns:1.25fr 1fr;gap:16px;min-height:0}
.s5 .a-cal{padding:14px;border-radius:12px;background:var(--gs);border:1px solid var(--gl);display:flex;flex-direction:column}
.s5 .a-mo{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.s5 .a-mo i{font-style:normal;margin-left:10px;color:var(--gm)}
.s5 .a-cal .wk,.s5 .a-cal .dg{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center}
.s5 .a-cal .wk span{font-size:10.5px;color:var(--gm);font-weight:700}
.s5 .a-cal .dg{flex:1;margin-top:5px;grid-auto-rows:1fr}
.s5 .a-cal .dg i{font-style:normal;position:relative;display:grid;place-items:center;border-radius:9px;background:var(--gs2);font-size:12.5px;transition:background-color .3s,box-shadow .3s}
.s5 .a-cal .dg i.ev::after{content:"";position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:var(--gd)}
.s5 .a-cal .dg i.sel{background:#2a2a28;box-shadow:inset 0 0 0 1.5px var(--gd)}
.s5 .a-day{padding:14px;border-radius:12px;background:var(--gs);border:1px solid var(--gl);display:flex;flex-direction:column;gap:10px;overflow:hidden}
.s5 .a-day>b{font-size:14.5px}
.a-ev{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;background:var(--gs2);border-left:3px solid var(--c);margin-bottom:8px;flex-wrap:wrap}
.a-ev time{font-weight:800;color:var(--c);font-size:12.5px;min-width:42px}
.a-ev b{display:block;font-size:13px}.a-ev small{color:var(--gm)}
.a-ev.new{animation:trpop .6s cubic-bezier(.22,1,.36,1);background:#262312}
.a-evb{display:flex;gap:6px;margin-left:auto;width:100%;padding-left:54px}
.a-evb span{padding:3px 9px;border-radius:7px;background:#111;border:1px solid var(--gl);font-size:10.5px;font-weight:700}
.a-layer{position:absolute;inset:0;z-index:30;display:grid;place-items:center;background:rgba(0,0,0,.6);opacity:0;visibility:hidden;transition:opacity .3s}
.a-layer.on{opacity:1;visibility:visible}
.a-form{width:560px;max-height:none}
.a-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.a-grid .full{grid-column:1/-1}
.gq-hint{padding:9px 11px;border-radius:9px;background:#1a1810;border:1px solid #3a3217;font-size:11.5px;color:#d9c98a;display:flex;flex-direction:column;gap:2px}
.gcal{position:absolute;right:46px;top:96px;z-index:45;width:300px;padding:16px;border-radius:14px;background:#fff;color:#202124;box-shadow:0 30px 60px -16px #000;opacity:0;transform:translateX(30px) scale(.96);visibility:hidden;transition:opacity .4s,transform .4s cubic-bezier(.22,1,.36,1)}
.gcal.on{opacity:1;transform:none;visibility:visible}
.gc-h{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:13px}.gc-h i{width:18px;height:18px;border-radius:4px;background:linear-gradient(135deg,#4285f4,#34a853)}
.gc-t{font-size:17px;font-weight:600;margin-bottom:10px}.gc-r{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid #eee;font-size:12.5px;color:#5f6368}
.gc-b{margin-top:10px;text-align:right}.gc-b span{display:inline-block;padding:8px 20px;border-radius:999px;background:#1a73e8;color:#fff;font-weight:600;font-size:13px}
.osn{position:absolute;right:20px;top:20px;z-index:70;width:330px;padding:12px 14px;border-radius:12px;background:#2b2b2b;color:#fff;box-shadow:0 20px 40px -10px #000;border:1px solid #444;opacity:0;visibility:hidden;transform:translateX(40px);transition:opacity .45s,transform .45s cubic-bezier(.22,1,.36,1)}
.osn.on{opacity:1;visibility:visible;transform:none}
.osn-h{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:12px}.osn-h img{width:18px;height:18px;border-radius:5px}.osn-h small{margin-left:auto;color:#aaa}
.osn-t{font-size:13px;line-height:18px;color:#e9e9e9}
/* fluxos: conexoes pontilhadas com energia */
.s7 .cv{flex:none;width:764px;position:relative;background-image:radial-gradient(#222b26 1px,transparent 1px);background-size:22px 22px;overflow:hidden}
.s7 .pv{flex:1;width:auto}
.s7 .fh{position:absolute;left:0;right:0;top:0;height:42px;display:flex;align-items:center;gap:10px;padding:0 16px;background:#111815;border-bottom:1px solid var(--ln);z-index:5}
.s7 .fh b{font-size:15px}
.s7 .wires{position:absolute;left:0;top:0;width:764px;height:580px;pointer-events:none;z-index:1;overflow:visible}
.wg{opacity:0;transition:opacity .6s}.wg.on{opacity:1}
.wglow{fill:none;stroke:var(--wc);stroke-width:7;opacity:.16;stroke-linecap:round}
.wdot{fill:none;stroke:var(--wc);stroke-width:3;stroke-linecap:round;stroke-dasharray:.1 9;animation:trdash 1.1s linear infinite}
@keyframes trdash{to{stroke-dashoffset:-9.1}}
.wsp{fill:#fff;filter:drop-shadow(0 0 5px var(--wc)) drop-shadow(0 0 10px var(--wc))}
.wpt{fill:#0a0f0c;stroke:var(--wc);stroke-width:2}
.s7 .nd{z-index:3;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:11px 12px;min-width:0}
.s7 .nd .ni{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:var(--c);font-weight:800;font-size:13px;flex:none}
.s7 .nd .tn{flex:1;min-width:0}
.s7 .nd .tn b{margin:0;font-size:13px}.s7 .nd .tn small{margin-top:1px;text-transform:none;letter-spacing:0;font-size:10.5px;color:var(--mu);font-weight:500}
.s7 .nd .ag-t{width:100%;padding:7px 9px;border-radius:8px;background:#0b100d;border:1px solid var(--ln);font-size:10.5px;color:#cfd6d1}
.s7 .nd .ag-p{display:flex;gap:6px;width:100%}
.s7 .nd .ag-p span{flex:1;text-align:center;padding:4px 0;border-radius:8px;background:#1b211e;border:1px solid #2c3630;font-size:10.5px}
.s7 .nd .ag-p span:last-child{background:#3a3216;border-color:#e9c44a;color:#e9c44a}
.s7 .nd .chs{width:100%;margin-top:0}
.s7 .lbl{position:absolute;z-index:4;padding:2px 9px;border-radius:99px;background:#0b100d;border:1px solid var(--ln);font-size:10.5px;font-weight:700;color:var(--hi);opacity:0;transition:opacity .4s}
.s7 .lbl.on{opacity:1}
.s7 .nd.glow{border-color:var(--c);box-shadow:0 0 0 2px color-mix(in srgb,var(--c) 30%,transparent),0 0 30px -4px var(--c),0 12px 24px -12px #000}

.s7 .nd .tn b,.s7 .nd .tn small{white-space:nowrap}
.s7 .nd .tn small{overflow:hidden;text-overflow:ellipsis}

.s7 .nd .ag-p{order:-1;margin-bottom:2px}
.s7 .nd .ag-p span:first-child{border-color:#6aa6f0;color:#6aa6f0}
.s7 .nd .ag-p span:nth-child(2){border-color:#5ec27f;color:#5ec27f}

/* fluxo: cards menores */
.s7 .nd{padding:8px 10px;gap:7px}
.s7 .nd .ni{width:24px;height:24px;border-radius:7px;font-size:11px}
.s7 .nd .tn b{font-size:12px}
.s7 .nd .tn small{font-size:10px}
.s7 .nd .ag-t{padding:5px 8px;font-size:10px}
.s7 .nd .ag-p span{padding:3px 0;font-size:10px}
.s7 .nd .chs span{font-size:10px;padding:2px 7px}
.s7 .pv{width:236px;flex:none}
.s7 .pm .m{font-size:12px;line-height:16px}

/* camera e efeitos especiais */
.tr-stage{perspective:1700px;perspective-origin:50% 50%}
.tr-world{position:absolute;inset:0;transform-origin:50% 50%;transition:transform 1.5s cubic-bezier(.45,.05,.2,1);will-change:transform;backface-visibility:hidden}
.tr-vig{position:absolute;inset:0;z-index:90;pointer-events:none;background:radial-gradient(130% 100% at 50% 45%,transparent 58%,rgba(0,0,0,.5))}
.tr-sweep{position:absolute;top:-20%;bottom:-20%;left:-40%;width:30%;z-index:91;pointer-events:none;opacity:0;transform:skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent)}
.tr-sweep.go{animation:trsweep 1.3s ease-out}
@keyframes trsweep{0%{left:-40%;opacity:0}15%{opacity:1}100%{left:120%;opacity:0}}
.fx-ring{position:absolute;z-index:58;width:46px;height:46px;border-radius:50%;pointer-events:none;border:2px solid var(--hi);box-shadow:0 0 18px var(--hi),inset 0 0 14px rgba(155,235,184,.35);transform:translate(-50%,-50%) scale(.2);animation:trring .85s ease-out forwards}
@keyframes trring{from{opacity:.95;transform:translate(-50%,-50%) scale(.2)}to{opacity:0;transform:translate(-50%,-50%) scale(2.8)}}
.fx-sp{position:absolute;z-index:59;width:5px;height:5px;margin:-2px 0 0 -2px;border-radius:50%;pointer-events:none;background:#fff;box-shadow:0 0 8px var(--hi),0 0 16px var(--hi);animation:trsp .95s cubic-bezier(.2,.7,.3,1) forwards}
@keyframes trsp{to{transform:translate(var(--dx),var(--dy)) scale(.15);opacity:0}}
.tr-toast{z-index:95}

/* a tela vira uma "placa" 3D com cantos arredondados, sobre um fundo mais escuro */
.tr-stage{background:radial-gradient(90% 90% at 50% 40%,#0c1410,#040605)}
.tr-world{border-radius:14px;overflow:hidden;box-shadow:0 40px 90px -20px #000,0 0 0 1px rgba(155,235,184,.08);background:var(--bg)}

/* portas do agente embaixo do card */
.s7 .nd .ag-p{order:0;margin-top:3px;margin-bottom:0}
.s7 .nd .ag-t{margin-top:0}
.s7 .nd .tn b,.s7 .nd .tn small{max-width:100%}

/* ===== tour dentro da pagina principal: abas, texto da funcao e celular ===== */
.tour .tr{margin-top:8px}
.tour .tr-head{margin-bottom:14px}
.tr-desc{margin-top:18px;min-height:96px}
.tr-d{display:none}
.tr-d.on{display:block;animation:trpop .5s cubic-bezier(.22,1,.36,1)}
.tr-d h3{margin:0 0 10px;text-align:center}
.tr-d ul{list-style:none;margin:0;padding:0;display:flex;justify-content:center;gap:10px 26px;flex-wrap:wrap}
.tr-d li{display:flex;align-items:center;gap:8px;font-size:15px;line-height:22px;color:#3a423d}
.tr-d li .ic{width:18px;height:18px;color:#1f9d55;flex:none}
.tr-note{margin:10px 0 0;text-align:center;color:#7a847d}
.tr.tm .tr-toast{right:auto;left:50%;top:14px;transform:translate(-50%,-10px) scale(.96)}
.tr.tm .tr-toast.on{transform:translate(-50%,0)}
@media (max-width:760px){
  .tour .tr-head{flex-wrap:nowrap;gap:8px}
  .tr-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;margin:0 -16px;padding:2px 16px 6px}
  .tr-tabs::-webkit-scrollbar{display:none}
  .tr-tab{flex:none;scroll-snap-align:center;padding:8px 13px}
  .tr-ctl{display:none}
  .tr-win{border-radius:14px}
  .tr-d h3{font-size:19px;line-height:26px}
  .tr-d ul{flex-direction:column;align-items:flex-start;gap:8px;max-width:340px;margin:0 auto}
  .tr-desc{min-height:150px}
}

/* o site tem uma classe antiga ".m" (bolha do topo) com opacity:0; aqui as bolhas do tour precisam ficar visiveis depois de aparecer */
.tr .m{opacity:1;transform:none;margin:0}
.tr .s1 .m,.tr .s7 .pm .m{margin:0}

/* ===== fluxos no desenho do editor da extensao ===== */
.s7 .cv{background-color:#101010;background-image:radial-gradient(#262626 1px,transparent 1px);background-size:22px 22px}
.s7 .ftop{position:absolute;left:0;right:0;top:0;height:46px;z-index:6;display:flex;align-items:center;gap:10px;padding:0 14px;background:#141414;border-bottom:1px solid #2a2a2a}
.s7 .ftop img{border-radius:6px}
.s7 .ftop b{display:block;font-size:13px;line-height:15px}
.s7 .ftop small{display:block;font-size:9.5px;color:#8a8a8a;line-height:12px}
.s7 .ftop .fb{padding:6px 10px;border-radius:8px;background:#202020;border:1px solid #333;font-size:10.5px;font-weight:700;color:#eee;white-space:nowrap}
.s7 .ftop .fb:first-of-type{margin-left:auto}
.s7 .ftop .fb.gold{background:#f1efe8;border-color:#f1efe8;color:#15120a}
.s7 .ftool{position:absolute;left:12px;top:150px;z-index:6;display:flex;flex-direction:column;gap:7px;padding:8px 6px;border-radius:14px;background:#151515;border:1px solid #2c2c2c}
.s7 .ftool i{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;color:#9a9a9a}
.s7 .ftool svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ff{position:absolute;z-index:3;opacity:0;transform:scale(.92);transition:opacity .5s,transform .5s cubic-bezier(.22,1,.36,1),filter .3s}
.ff.on{opacity:1;transform:none}
.ff-m{background:linear-gradient(180deg,#262626,#1f1f1f);border:1px solid #363636;border-radius:12px;box-shadow:0 14px 26px -14px #000;transition:border-color .3s,box-shadow .3s}
.ff.glow .ff-m{border-color:#f1efe8;box-shadow:0 0 0 2px rgba(241,239,232,.28),0 0 28px -4px rgba(241,239,232,.6),0 14px 26px -14px #000}
.ff-h{display:flex;align-items:center;gap:9px;padding:9px 10px}
.ff-i{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:8px;background:#2f2b1c;color:#f1efe8}
.ff-i svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ff-h b{display:block;font-size:12px;line-height:15px;color:#f5f5f5}
.ff-h small{display:block;margin-top:1px;font-size:8.5px;line-height:11px;color:#9a9a9a;max-width:112px}
.ff-b{margin:0 8px 8px;padding:7px 9px;border-radius:8px;background:#161616;border:1px solid #2f2f2f;font-size:10px;line-height:14px;color:#dcdcdc}
.ff-o{position:relative;display:flex;align-items:center;gap:8px;margin-top:5px;padding:6px 9px;border-radius:9px;background:#242424;border:1px solid #333}
.ff-o.ok{background:#16281e;border-color:#245c3a}
.ff-p{display:grid;place-items:center;width:15px;height:15px;border-radius:50%;background:#2563eb;color:#fff;font-size:9px;font-weight:800}
.ff-o.ok .ff-p{background:#1f9d55}
.ff-o b{font-size:10px;color:#f1f1f1}
.fp{position:absolute;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid #f1efe8;box-sizing:border-box;box-shadow:0 0 0 2px #101010;z-index:4}
.fp.in{left:-7px;top:19px}
.fp.out{right:-7px;top:50%;margin-top:-6px}
.ff-ch{position:relative;display:flex;gap:6px;justify-content:center;margin-top:10px}
.ff-ch span{position:relative;display:flex;gap:3px;align-items:center;padding:3px 8px;border-radius:7px;background:#1b1810;border:1px solid #f1efe8;font-size:9px;color:#f1efe8;white-space:nowrap}
.ff-ch span b{font-weight:700}
.ff-ch .fp.out{right:auto;left:50%;top:auto;bottom:-14px;margin:0 0 0 -6px}
.ff-sel{display:flex;gap:5px}
.ff-sel span{flex:1;text-align:center;padding:4px 0;border-radius:7px;background:#232323;border:1px solid #3a3a3a;font-size:9.5px;font-weight:700;transition:background-color .3s,color .3s,border-color .3s}
.ff-sel span.on{background:#f1efe8;border-color:#f1efe8;color:#15120a}
.wbase{fill:none;stroke:#f1efe8;stroke-width:2;opacity:.55;stroke-linecap:round}
.wglow{stroke:#f1efe8}
.wdot{stroke:#fff3c4;stroke-width:2.4}
.wsp{filter:drop-shadow(0 0 5px #f1efe8) drop-shadow(0 0 10px #f1efe8)}
.s7 .pv{background:#0b141a}

.ff-o b{white-space:nowrap}
.ff-h b{white-space:nowrap}
.s7 .pm{padding:12px 10px}
.s7 .pm .m{font-size:11.5px;line-height:15px;max-width:92%}

.fp.in.top{left:50%;top:-7px;margin-left:-6px}

.s7 .pv{display:flex;flex-direction:column;background:#0b141a;border-left:1px solid #1d272d}
.s7 .pv-h{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid #1d272d;background:#111b21}
.s7 .pv-h .tr-av{width:30px;height:30px;font-size:11px}
.s7 .pv-h b{display:block;font-size:12.5px;line-height:16px}
.s7 .pv-h small{display:block;color:#7bd7a0;font-size:10px;line-height:13px}
.s7 .pm{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;padding:12px 10px;overflow:hidden;background-image:radial-gradient(#13222b 1px,transparent 1px);background-size:18px 18px}
.s7 .pm .m{display:none;max-width:90%;padding:7px 10px;border-radius:11px;font-size:11.5px;line-height:15px}
.s7 .pm .m.on{display:block;animation:trpop .45s cubic-bezier(.22,1,.36,1)}
.s7 .pm .m.in{align-self:flex-start;background:#202c33;border-top-left-radius:3px}
.s7 .pm .m.out{align-self:flex-end;background:#005c4b;border-top-right-radius:3px}
.s7 .pm .m.tool{align-self:center;max-width:100%;padding:4px 10px;border-radius:99px;background:#2a2a28;border:1px solid #f1efe8;color:#d8d6cc;font-size:10px;font-weight:700;text-align:center}
.s7 .tpi{align-self:flex-end;display:none;align-items:center;gap:8px;padding:8px 11px;border-radius:11px;background:#005c4b}
.s7 .tpi.on{display:flex}
.s7 .tpi .tpi-d{display:flex;gap:4px}.s7 .tpi em{font-style:normal;font-size:10px;color:#bfe9dc;font-weight:600}
.s7 .tpi i{width:6px;height:6px;border-radius:50%;background:#bfe9dc;animation:trdot 1s infinite}
.s7 .tpi i:nth-child(2){animation-delay:.15s}.s7 .tpi i:nth-child(3){animation-delay:.3s}
.s7 .ff-h b{font-size:11.5px}

.ff-th{display:inline-block;vertical-align:middle;width:30px;height:20px;margin-right:7px;border-radius:5px;background:linear-gradient(135deg,#1b3a2d,#0f2a45);border:1px solid #3a3a3a}
.ff-nt{margin-top:6px;font-size:8.5px;line-height:11px;color:#9a9a9a}
.s7 .pm .m.cat{padding:5px 5px 7px}
.s7 .pm .m.cat b{display:block;margin:5px 4px 0;font-size:10.5px}
.pcat{width:150px;height:84px;display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:7px;border-radius:8px;background:linear-gradient(135deg,#1b3a2d,#0f2a45)}
.pcat span{border-radius:5px;background:rgba(255,255,255,.16)}

@media (max-width:760px){
  .tr-tabs{flex-wrap:wrap;justify-content:center;overflow:visible;margin:0;padding:0 0 4px;gap:6px}
  .tr-tab{padding:7px 12px;font-size:12.5px;line-height:17px}
  .tour .tr-head{justify-content:center}
  .tr-desc{margin-top:16px;min-height:0}
  .tr-d h3,.tr-d li{color:#111613}
  .tr-d li{color:#3a423d}
}
.tr-desc,.tr-note{color:#111613}
.tr-d h3{color:#111613}

.tr-url{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
@media (max-width:760px){.tr-bar{height:32px;padding:0 10px}.tr-bar i{width:8px;height:8px}.tr-url{max-width:none;font-size:10.5px;padding:3px 10px}.tr-ext{font-size:11px}.tr-ext img{width:18px;height:18px}}

/* celular: barra do mockup limpa (so os pontinhos e a marca), sem o endereco em duas linhas */
@media (max-width:760px){
  .tr-bar{height:30px;padding:0 12px;justify-content:space-between}
  .tr-bar .tr-url{display:none}
  .tr-ext{margin-left:auto;font-size:11px}
}
