/* Release 321: "Ask Scoutics" chat (static/js/assistant.js). Scoped to .sca so no page style leaks in or out. */
.sca{--sca-ink:#18181b;--sca-muted:#63636b;--sca-line:#e4e4e7;--sca-pale:#f4f4f5;--sca-accent:#3030ff;--sca-card:#fff;position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:max(16px,env(safe-area-inset-bottom,0px));z-index:2147483000;font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--sca-ink)}
.sca *{box-sizing:border-box}
.sca-fab{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 18px 0 14px;border:0;border-radius:999px;background:var(--sca-ink);color:#fff;font:600 14px/1 inherit;cursor:pointer;box-shadow:0 10px 30px -10px rgba(24,24,27,.55)}
.sca-fab svg{width:20px;height:20px;fill:#fff}
.sca-fab:hover{background:#000}
.sca.is-open .sca-fab{display:none}
.sca-panel{position:absolute;right:0;bottom:0;width:min(400px,calc(100vw - 32px));height:min(620px,calc(100vh - 32px));display:flex;flex-direction:column;background:var(--sca-card);border:1px solid var(--sca-line);border-radius:16px;box-shadow:0 24px 60px -20px rgba(24,24,27,.45);overflow:hidden}
.sca-panel[hidden]{display:none}
.sca-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid var(--sca-line)}
.sca-head h2{margin:0;font-size:15px;font-weight:700;letter-spacing:-.01em}
.sca-head p{margin:2px 0 0;font-size:12px;color:var(--sca-muted)}
.sca-close{border:0;background:transparent;font-size:22px;line-height:1;color:var(--sca-muted);cursor:pointer;padding:2px 6px;border-radius:6px}
.sca-close:hover{background:var(--sca-pale)}
.sca-log{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.sca-msg{max-width:88%;padding:9px 12px;border-radius:12px;background:var(--sca-pale);word-wrap:break-word}
.sca-msg p{margin:0}.sca-msg p+p{margin-top:6px}.sca-msg ul{margin:4px 0 0;padding-left:18px}
.sca-msg.is-user{align-self:flex-end;background:var(--sca-ink);color:#fff}
.sca-msg.is-upsell{background:#eef2ff;border:1px solid #e0e7ff}
.sca-msg.is-wait{color:var(--sca-muted);display:flex;align-items:center;gap:8px}
.sca-src{font-size:11px;color:var(--sca-muted);margin-top:6px!important}
.sca-cta{display:flex;gap:12px;align-items:center;margin-top:8px!important}
.sca-btn{display:inline-block;background:var(--sca-accent);color:#fff!important;text-decoration:none;font-weight:600;padding:7px 14px;border-radius:8px}
.sca-link{color:var(--sca-accent)!important;font-weight:600;text-decoration:none}
.sca-chips{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.sca-chips button{border:1px solid var(--sca-line);background:#fff;color:var(--sca-ink);border-radius:999px;padding:6px 12px;font:13px/1.35 inherit;text-align:left;cursor:pointer}
.sca-chips button:hover{border-color:var(--sca-accent);color:var(--sca-accent)}
.sca-form{display:flex;align-items:flex-end;gap:8px;margin:0 12px;padding:8px;border:1px solid var(--sca-line);border-radius:12px}
.sca-form:focus-within{border-color:var(--sca-ink)}
.sca .sca-form textarea{flex:1;min-width:0;margin:0;padding:6px 4px;border:0!important;outline:0!important;box-shadow:none!important;resize:none;font:14px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important;letter-spacing:normal;color:var(--sca-ink);background:transparent!important;max-height:120px;border-radius:0}
.sca-form button{flex:none;width:34px;height:34px;border:0;border-radius:9px;background:var(--sca-ink);cursor:pointer;display:grid;place-items:center}
.sca-form button svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sca .sca-foot{margin:6px 0 0;padding:0 14px 12px;font-size:11px;line-height:1.4;color:var(--sca-muted)}
/* release 408: the credit line under the chat, plain text */
.sca .sca-foot:has(+ .sca-credit){padding-bottom:2px}
.sca .sca-credit{margin:0;padding:0 14px 12px;font-size:11px;line-height:1.4;color:var(--sca-muted)}
.sca-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sca-dots{display:inline-flex;gap:3px}.sca-dots i{width:5px;height:5px;border-radius:50%;background:var(--sca-muted);animation:sca-b 1s infinite}
.sca-dots i:nth-child(2){animation-delay:.15s}.sca-dots i:nth-child(3){animation-delay:.3s}
@keyframes sca-b{0%,80%,100%{opacity:.3}40%{opacity:1}}
.sca button:focus-visible,.sca a:focus-visible{outline:2px solid var(--sca-accent);outline-offset:2px}
@media (max-width:767px){
  .sca{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .sca-fab{height:42px;padding:0 14px 0 12px}
  /* release 359 (20-bettor review: "the Ask Scoutics button covers the Fractional button and part of a game card"): on phones the
     button is a round icon; its name stays for screen readers */
  .sca-fab{width:46px;height:46px;padding:0;justify-content:center}
  .sca-fab span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .sca-fab{transition:transform .2s ease,opacity .2s ease}
  .sca.is-tucked .sca-fab{transform:translateY(90px);opacity:0;pointer-events:none}
  .sca.is-open{right:0;left:0;bottom:0;top:0}
  .sca-panel{position:fixed;inset:0;width:100%;height:100%;border-radius:0;border:0}
  /* release 346 (owner: "check the width of the chat bot on the phone, I feel it overflows"): iPhone Safari zooms the whole page in
     when a text box under 16px gets focus, which pushes the chat past the screen edges. 16px text stops the zoom; the panel follows
     the visible height when the keyboard opens and keeps clear of the home bar. */
  .sca .sca-form textarea{font-size:16px!important}
  .sca .sca-form textarea:focus,.sca .sca-form textarea:focus-visible{outline:0!important;box-shadow:none!important}
  .sca-panel{height:100dvh;max-width:100vw}
  .sca-form{margin-bottom:max(10px,env(safe-area-inset-bottom,0px))}
  .sca-log,.sca-msg{overflow-wrap:anywhere}
  .sca-msg table{display:block;max-width:100%;overflow-x:auto}
}
@media (prefers-reduced-motion:reduce){.sca-dots i{animation:none}}
.sca-web a{color:var(--sca-accent)!important;text-decoration:underline;text-underline-offset:2px;word-break:break-all}
.sca-go{display:inline-block;margin-top:2px;color:var(--sca-accent)!important;font-weight:600;text-decoration:none}.sca-go:hover{text-decoration:underline}
/* release 370 (design panel: "the Ask button is round on Home and square on /epl and /nba, and it covers the Away formation select").
   One shape on every page (the simulator pages' own button rules made it 8px square), a 44px close button, and on phones the
   button steps aside while a text box or a select has focus, so it never sits on the control being used. The page itself keeps
   room at the bottom for it (static/css/sx_system.css: main padding and scroll-padding). */
html body .sca .sca-fab { border-radius: 999px !important; border: 0 !important; font: 600 14px/1 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; min-height: 0 !important; }
html body .sca .sca-close { display: inline-grid; place-items: center; width: 44px; height: 44px; margin: -10px -10px -10px 0; padding: 0; }
@media (max-width: 767px) {
  html body .sca .sca-fab { width: 48px !important; height: 48px !important; padding: 0 !important; }
  html body:has(:is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea, iframe):not(.sca *):focus) .sca:not(.is-open) .sca-fab {
    transform: translateY(90px); opacity: 0; pointer-events: none; }
  html body .sca .sca-chips button { min-height: 44px; }
  html body .sca .sca-form button { width: 44px; height: 44px; }
}
