/* "Teste agora" Story simulator (owner 02/11): quiz-style Instagram Story, tap to paste, drag, pinch to resize/rotate, drag to trash. */
.xp{padding:56px 0 40px;text-align:center}
.xp .lead{max-width:440px;margin:0 auto}
.xp-scenes{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:18px 16px 4px;margin:0 -16px;justify-content:flex-start}
.xp-scenes::-webkit-scrollbar{display:none}
@media(min-width:560px){.xp-scenes{justify-content:center}}
.xp-scenes button{flex:none;display:flex;align-items:center;gap:7px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);font:600 13.5px/1 var(--sans);padding:6px 13px 6px 6px;border-radius:99px;cursor:pointer;transition:border-color .2s,background .2s,transform .15s}
.xp-scenes button:active{transform:scale(.96)}
.xp-scenes button img{width:30px;height:30px;border-radius:50%;object-fit:cover}
.xp-scenes button[aria-pressed="true"]{border-color:var(--pink);background:var(--pink-soft)}
.xp-scenes .mine{padding-left:13px}
.xp-step{font:700 14px/1.3 var(--sans);color:var(--pink-d);margin:14px 0 0;min-height:1.3em}

.xp-phone{position:relative;width:min(300px,80vw);aspect-ratio:9/16;margin:10px auto 0;border-radius:28px;overflow:hidden;background:#222 center/cover no-repeat;box-shadow:0 30px 60px -24px rgba(58,22,64,.55);user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:pointer;transition:background-image .3s}
.xp-phone.on{touch-action:none;cursor:default}
.xp-phone::before{content:"";position:absolute;inset:0 0 auto;height:90px;background:linear-gradient(rgba(0,0,0,.45),transparent);pointer-events:none;z-index:2}
.xp-top{position:absolute;top:10px;left:10px;right:10px;display:flex;align-items:center;gap:8px;color:#fff;font:600 12px/1 var(--sans);pointer-events:none;z-index:3}
.xp-top .ln{position:absolute;top:-4px;left:0;right:0;height:2.5px;border-radius:2px;background:rgba(255,255,255,.45);overflow:hidden}
.xp-top .ln i{display:block;height:100%;width:0;background:#fff}
.xp-phone.on .xp-top .ln i{animation:xpbar 6s linear infinite}
@keyframes xpbar{to{width:100%}}
.xp-top .av{width:28px;height:28px;border-radius:50%;background:linear-gradient(45deg,#FEDA75,#FA7E1E,#D62976,#962FBF);padding:2px}
.xp-top .av i{display:block;width:100%;height:100%;border-radius:50%;background:#f3d9df url(/img/ai-carro-sem.webp) 50% 20%/220%}
.xp-tools{position:absolute;top:46px;right:12px;display:grid;gap:14px;z-index:3;pointer-events:none;color:#fff;font:700 15px/1 var(--display);text-shadow:0 1px 3px rgba(0,0,0,.5)}
.xp-hint{position:absolute;left:50%;top:46%;translate:-50% -50%;background:rgba(0,0,0,.55);color:#fff;font:600 14px/1.3 var(--sans);padding:10px 14px;border-radius:14px;pointer-events:none;width:max-content;max-width:80%;z-index:3;animation:xpblink 1.6s ease-in-out infinite}
@keyframes xpblink{50%{opacity:.6}}
.xp-paste{position:absolute;z-index:6;translate:-50% -120%;background:#fff;color:#111;font:600 15px/1 var(--sans);padding:11px 18px;border:0;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.35);animation:xppop .2s;cursor:pointer}
.xp-paste::after{content:"";position:absolute;left:50%;bottom:-6px;translate:-50% 0;border:7px solid transparent;border-bottom:0;border-top-color:#fff}
.xp-st{position:absolute;left:50%;top:40%;width:44%;transform:translate(-50%,-50%) rotate(0deg);z-index:4;touch-action:none;cursor:grab;filter:drop-shadow(0 4px 8px rgba(0,0,0,.25))}
.xp-st img{display:block;width:100%;pointer-events:none;animation:xpstick .45s cubic-bezier(.2,1.6,.4,1)}
.xp-st.drag{cursor:grabbing}
.xp-st.doom img{opacity:.45;scale:.6;transition:opacity .15s,scale .15s}
@keyframes xpstick{from{scale:.2;opacity:0}}
@keyframes xppop{from{scale:.6;opacity:0}}
.xp-trash{position:absolute;left:50%;bottom:56px;translate:-50% 0;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.45);border:2px solid rgba(255,255,255,.8);color:#fff;z-index:5;opacity:0;scale:.6;pointer-events:none;transition:opacity .2s,scale .2s,background .2s}
.xp-trash svg{width:20px;height:20px}
.xp-phone.dragging .xp-trash{opacity:1;scale:1}
.xp-trash.hot{background:#E5484D;scale:1.2!important}
.xp-bot{position:absolute;left:10px;right:10px;bottom:10px;display:flex;gap:6px;z-index:3;pointer-events:none}
.xp-bot span{flex:1;background:rgba(0,0,0,.45);color:#fff;font:600 11.5px/1 var(--sans);padding:9px 6px;border-radius:99px}
.xp-bot span.go{flex:none;width:32px;background:#fff;color:#111}
.xp-phone.dragging .xp-bot{opacity:0}
.xp-gest{font:500 13px/1.4 var(--sans);color:var(--muted);margin:10px auto 0;max-width:320px}

.xp-tray-l{font:700 13px/1 var(--sans);color:var(--ink);margin:16px 0 8px}
.xp-tray{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;max-width:360px;margin:0 auto}
.xp-tray button{width:62px;height:62px;border-radius:14px;border:1.5px solid var(--line);background:#efe6ea center/cover;padding:6px;box-shadow:inset 0 0 0 40px rgba(255,255,255,.12);cursor:pointer;transition:transform .15s,border-color .2s}
.xp-tray button:active{transform:scale(.92)}
.xp-tray button img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.xp-acts{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.xp-acts button{border:1.5px solid var(--line);background:var(--paper);color:var(--ink);font:600 14px/1 var(--sans);padding:12px 16px;border-radius:99px;cursor:pointer}
.xp-acts .hot{background:var(--ink);color:#fff;border-color:var(--ink)}
.xp-acts button:disabled{opacity:.5}
.xp-priv{font:500 12px/1.4 var(--sans);color:var(--muted);margin:10px 0 0}
.xp-next{display:inline-block;margin-top:14px;font:700 14px/1 var(--sans);color:var(--pink-d);text-decoration:none}
@media (prefers-reduced-motion:reduce){.xp-hint,.xp-st img,.xp-paste,.xp-phone.on .xp-top .ln i{animation:none}}
