/* BattleBot guide bubble. Tap-only 3 question guide that routes to one offer (joinunstuck) or one call (mrunstuck). */
.bb{--bb-ink:#0a0a0b;--bb-ink2:#141416;--bb-line:#2a2a2e;--bb-bone:#f4f0e9;--bb-mute:#a39e96;--bb-red:#e3122b;--bb-red2:#ff2a43;font:400 15px/1.5 "Inter",system-ui,sans-serif;color:var(--bb-bone)}
.bb *{box-sizing:border-box}
.bb-fab{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom) + var(--bb-lift,0px));z-index:60;width:64px;height:64px;border-radius:50%;border:0;background:radial-gradient(circle at 35% 30%,#2a2a2e,#0a0a0b 70%);box-shadow:0 10px 30px -8px rgba(0,0,0,.8),0 0 0 2px rgba(227,18,43,.6);cursor:pointer;display:grid;place-items:center;transition:transform .25s cubic-bezier(.2,.9,.3,1.4),bottom .25s;animation:bb-glow 2.8s ease-in-out infinite}
.bb-fab:hover{transform:translateY(-3px) scale(1.06) rotate(-4deg)}
.bb-fab img{width:34px;height:auto;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6))}
.bb-fab .bb-tag{position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);background:var(--bb-red);color:#fff;font:800 9px/1 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:4px 6px;border-radius:3px;white-space:nowrap}
@keyframes bb-glow{0%,100%{box-shadow:0 10px 30px -8px rgba(0,0,0,.8),0 0 0 2px rgba(227,18,43,.6),0 0 0 0 rgba(227,18,43,.45)}50%{box-shadow:0 10px 30px -8px rgba(0,0,0,.8),0 0 0 2px rgba(227,18,43,.9),0 0 0 12px rgba(227,18,43,0)}}
.bb-tease{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:calc(96px + env(safe-area-inset-bottom) + var(--bb-lift,0px));z-index:60;max-width:250px;background:var(--bb-bone);color:var(--bb-ink);padding:12px 34px 12px 14px;border-radius:12px 12px 2px 12px;font-weight:600;font-size:14px;box-shadow:0 14px 40px -12px rgba(0,0,0,.7);cursor:pointer;animation:bb-pop .45s cubic-bezier(.2,.9,.3,1.3) both}
.bb-tease button{position:absolute;top:6px;right:6px;width:24px;height:24px;border:0;background:none;font-size:18px;line-height:1;cursor:pointer;color:#555}
@keyframes bb-pop{from{opacity:0;transform:translateY(10px) scale(.9)}to{opacity:1;transform:none}}
.bb-panel{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:calc(96px + env(safe-area-inset-bottom));z-index:61;width:380px;max-height:min(640px,calc(100vh - 120px));display:flex;flex-direction:column;background:var(--bb-ink);border:1px solid var(--bb-line);border-radius:16px;box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 1px rgba(227,18,43,.25);transform-origin:bottom right;animation:bb-open .42s cubic-bezier(.2,.9,.3,1.25) both;overflow:hidden}
.bb-panel[hidden]{display:none}
@keyframes bb-open{from{opacity:0;transform:translateY(16px) scale(.92) rotateX(8deg)}to{opacity:1;transform:none}}
.bb-head{display:flex;align-items:center;gap:10px;padding:14px 14px 12px;border-bottom:1px solid var(--bb-line);background:linear-gradient(180deg,#151517,var(--bb-ink))}
.bb-head img{width:26px}
.bb-head b{font:400 20px/1 "Anton",Impact,sans-serif;letter-spacing:.04em;text-transform:uppercase}
.bb-head small{display:block;color:var(--bb-mute);font-size:12px}
.bb-head .bb-x{margin-left:auto;width:36px;height:36px;border:0;border-radius:50%;background:#1d1d20;color:var(--bb-bone);font-size:20px;cursor:pointer}
.bb-log{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.bb-msg{max-width:88%;background:var(--bb-ink2);border:1px solid var(--bb-line);padding:10px 12px;border-radius:14px 14px 14px 4px;animation:bb-pop .3s ease both}
.bb-me{align-self:flex-end;background:var(--bb-red);border-color:var(--bb-red);color:#fff;border-radius:14px 14px 4px 14px}
.bb-typing{display:inline-flex;gap:4px;padding:12px 14px}
.bb-typing i{width:6px;height:6px;border-radius:50%;background:var(--bb-mute);animation:bb-dot 1s infinite}
.bb-typing i:nth-child(2){animation-delay:.15s}.bb-typing i:nth-child(3){animation-delay:.3s}
@keyframes bb-dot{0%,80%,100%{opacity:.3;transform:none}40%{opacity:1;transform:translateY(-3px)}}
.bb-chips{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.bb-chip{text-align:left;border:1px solid #3a3a40;background:#121214;color:var(--bb-bone);padding:12px 14px;border-radius:10px;font:600 14.5px/1.35 "Inter",sans-serif;cursor:pointer;transition:transform .18s,border-color .18s,box-shadow .18s}
.bb-chip:hover,.bb-chip:focus-visible{transform:translateY(-2px);border-color:var(--bb-red);box-shadow:0 10px 22px -12px rgba(227,18,43,.7);outline:none}
.bb-card{background:linear-gradient(160deg,#1a1a1d,#0e0e10);border:1px solid var(--bb-red);border-radius:14px;padding:16px;box-shadow:0 20px 40px -24px rgba(227,18,43,.6);animation:bb-open .45s cubic-bezier(.2,.9,.3,1.25) both}
.bb-card .k{font:800 10.5px/1 "Inter",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--bb-red2)}
.bb-card h3{font:400 30px/1 "Anton",Impact,sans-serif;text-transform:uppercase;margin:8px 0 4px}
.bb-card .p{font:400 22px/1 "Anton",Impact,sans-serif;color:var(--bb-bone)}.bb-card .p small{font:600 12px "Inter",sans-serif;color:var(--bb-mute);margin-left:4px}
.bb-card ul{list-style:none;margin:10px 0 12px;padding:0;display:grid;gap:6px}
.bb-card li{display:flex;gap:8px;font-size:14px;color:#d8d2c8}
.bb-card li:before{content:"";flex:0 0 7px;height:7px;margin-top:7px;background:var(--bb-red);transform:rotate(45deg)}
.bb-card .why{font-size:14px;color:#d8d2c8;margin-top:6px}
.bb-cta{display:block;text-align:center;background:var(--bb-red);color:#fff;text-decoration:none;font:800 13px/1 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:15px 12px;border-radius:6px;box-shadow:0 12px 30px -12px rgba(227,18,43,.8);transition:transform .15s,background .15s}
.bb-cta:hover{background:var(--bb-red2);transform:translateY(-2px)}
.bb-alt{display:block;text-align:center;margin-top:10px;color:var(--bb-bone);font-size:13.5px;font-weight:600}
.bb-sub{margin-top:10px;font-size:13.5px;color:#d8d2c8}.bb-sub a{color:var(--bb-bone);font-weight:700}
.bb-foot{border-top:1px solid var(--bb-line);padding:10px 14px;display:flex;gap:10px;align-items:center;justify-content:space-between;font-size:12px;color:var(--bb-mute)}
.bb-foot button{border:0;background:none;color:var(--bb-bone);font:700 12px "Inter",sans-serif;text-decoration:underline;cursor:pointer;padding:4px}
.bb-help{background:#2a1013;border:1px solid #ff6b7a;color:#ffd9dd;border-radius:10px;padding:12px;font-size:14px}
.bb-help b{color:#fff}
.bb-restart{align-self:center;border:1px solid #3a3a40;background:none;color:var(--bb-bone);border-radius:30px;padding:8px 14px;font:700 12.5px "Inter",sans-serif;cursor:pointer}
@media (max-width:600px){.bb-panel{left:0;right:0;bottom:0;width:auto;max-height:86vh;border-radius:18px 18px 0 0;padding-bottom:env(safe-area-inset-bottom);transform-origin:bottom center}.bb-fab{width:58px;height:58px}}
@media (prefers-reduced-motion:reduce){.bb-fab,.bb-tease,.bb-panel,.bb-msg,.bb-card,.bb-typing i{animation:none!important}.bb-chip,.bb-fab,.bb-cta{transition:none}}

/* split: mode chips + live BattleBot coaching */
.bb-chip.bb-mode{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-color:#4a2228;background:linear-gradient(160deg,#1c1012,#121214)}
.bb-chip.bb-mode small{font:500 12.5px/1.35 "Inter",sans-serif;color:#b9b2a8}
.bb-chip.bb-mode:hover{border-color:var(--bb-red)}
.bb-panel.bb-wide{width:min(520px,calc(100vw - 36px));max-height:min(860px,calc(100vh - 110px))}
.bb-coach{display:flex;flex-direction:column;gap:10px;animation:bb-open .45s cubic-bezier(.2,.9,.3,1.25) both}
.bb-open{background:#121214;border:1px dashed #4a4a52;border-radius:12px;padding:12px 14px;display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:end}
.bb-open span{grid-column:1/-1;font:700 11px/1 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9d968c}
.bb-opener{margin:0;font:500 14px/1.45 "Inter",sans-serif;color:var(--bb-bone)}
.bb-copy{border:1px solid #4a4a52;background:transparent;color:var(--bb-bone);font:700 12px/1 "Inter",sans-serif;padding:9px 11px;border-radius:6px;cursor:pointer;white-space:nowrap}
.bb-copy:hover{border-color:var(--bb-bone)}
.bb-frame{position:relative;border:1px solid var(--bb-red);border-radius:12px;overflow:hidden;background:#0a0a0b;height:min(520px,52vh);box-shadow:0 20px 40px -24px rgba(227,18,43,.6)}
.bb-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#0a0a0b}
.bb-full{align-self:flex-end;color:#c9c2b8;font:600 12.5px/1 "Inter",sans-serif}
.bb-after{border-top:1px solid #2a2a2e;padding-top:12px;display:flex;flex-direction:column;gap:2px}
.bb-after b{font:700 14px/1.35 "Inter",sans-serif;color:var(--bb-bone);margin-bottom:8px}
@media (max-width:600px){.bb-panel.bb-wide{width:auto;max-height:92vh}.bb-frame{height:52vh}}
