/**
 * Bay Area Support — standard guided-tour styling (single source of truth).
 * Used by the /signup step-3 tour and the /portal/support "Show me how" tour, and
 * the canonical look for any guided tour going forward. Uses --bas-* tokens with
 * literal fallbacks so it works on the marketing pages and the portal alike.
 *
 * Markup contract:
 *   <div class="bas-tour-catch is-on"></div>            (dimming click-catcher)
 *   <div class="bas-tour-ring  is-on" style="…"></div>  (spotlight ring)
 *   <div class="bas-tour-pop   is-on" role="dialog">
 *     <div class="bas-tour-count"></div>
 *     <h4  class="bas-tour-title"></h4>
 *     <div class="bas-tour-body"></div>
 *     <div class="bas-tour-nav">
 *       <button class="bas-tour-skip">Skip</button>
 *       <span class="bas-tour-navr">
 *         <button class="bas-tour-back">Back</button>
 *         <button class="bas-tour-next">Next</button>
 *       </span>
 *     </div>
 *   </div>
 */
.bas-tour-catch{position:fixed;inset:0;z-index:9998;display:none;}
.bas-tour-catch.is-on{display:block;}
.bas-tour-ring{position:fixed;z-index:9999;display:none;pointer-events:none;border-radius:14px;box-shadow:0 0 0 9999px rgba(19,32,37,0.55);transition:top .18s ease,left .18s ease,width .18s ease,height .18s ease;}
.bas-tour-ring.is-on{display:block;}
.bas-tour-pop{position:fixed;z-index:10001;display:none;width:min(360px,92vw);background:var(--bas-white,#fff);border:1px solid var(--bas-border,#e7e4d8);border-radius:12px;box-shadow:0 18px 50px rgba(19,32,37,0.32);padding:1rem 1.15rem 1.05rem;}
.bas-tour-pop.is-on{display:block;}
.bas-tour-count{font-size:0.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--bas-muted,#8a8f98);margin-bottom:0.3rem;}
.bas-tour-title{font-family:var(--font-display,var(--bas-font-display,inherit));font-size:1.05rem;font-weight:700;color:var(--bas-ink-black,#132025);margin:0 0 0.4rem;}
.bas-tour-body{font-size:0.9rem;line-height:1.5;color:var(--bas-ink-strong,#3c434a);}
.bas-tour-body strong{color:var(--bas-ink-black,#132025);}
.bas-tour-goto{color:var(--bas-orange,#ff4532);font-weight:600;text-decoration:underline;}
.bas-tour-ul{list-style:none;margin:0.5rem 0;padding:0;display:flex;flex-direction:column;gap:0.4rem;}
.bas-tour-ul li{position:relative;padding-left:1.2rem;}
.bas-tour-ul li::before{content:"";position:absolute;left:0;top:0.5em;width:0.45rem;height:0.45rem;border-radius:50%;background:var(--bas-orange,#ff4532);}
.bas-tour-nav{display:flex;align-items:center;justify-content:space-between;gap:0.5rem;margin-top:0.95rem;}
.bas-tour-navr{display:flex;align-items:center;gap:0.5rem;}
.bas-tour-back,.bas-tour-skip{background:var(--bas-white,#fff);border:1px solid var(--bas-border-cool,#d9dce2);color:var(--bas-ink-black,#132025);border-radius:8px;padding:0.45rem 0.8rem;font-size:0.88rem;font-weight:600;cursor:pointer;font-family:inherit;}
.bas-tour-back:hover,.bas-tour-skip:hover{border-color:var(--bas-ink-black,#132025);}
.bas-tour-back[hidden]{display:none;}
.bas-tour-next{background:var(--bas-orange,#ff4532);border:0;color:#fff;border-radius:8px;padding:0.45rem 0.95rem;font-size:0.88rem;font-weight:600;cursor:pointer;font-family:inherit;}
.bas-tour-next:hover{filter:brightness(0.96);}
@media (prefers-reduced-motion: reduce){.bas-tour-ring{transition:none;}}
html[data-theme="dark"] .bas-tour-pop{background:#0e3d4f;border-color:#1e5164;}
html[data-theme="dark"] .bas-tour-title,html[data-theme="dark"] .bas-tour-body strong{color:#f2f7f8;}
html[data-theme="dark"] .bas-tour-body{color:#c7d4d9;}
html[data-theme="dark"] .bas-tour-back,html[data-theme="dark"] .bas-tour-skip{background:#0c3644;border-color:#1e5164;color:#f2f7f8;}