/* IDhen guided tour: full screen, floating guide bar */
:root{--blue:#007AFF;--ink:#1d1d1f;--ink2:#424245;--gray:#6e6e73;--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",Inter,"Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
 --st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px);--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:#F2F2F7}
body{font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;overscroll-behavior:none;-webkit-text-size-adjust:100%}
button{font-family:inherit}
img,svg{display:block;max-width:100%}
:focus-visible{outline:3px solid rgba(0,122,255,.55);outline-offset:2px}
.skip{position:absolute;left:-999px;top:8px;z-index:300;background:#000;color:#fff;padding:10px 14px;border-radius:10px;text-decoration:none;font-size:15px}
.skip:focus{left:8px}

.tour{position:fixed;left:0;right:0;bottom:0;top:var(--stg,0px);overflow:hidden;--stageTop:88;--stageBot:44;--uiTop:calc(var(--st) + 74px)}
.backdrop{position:absolute;inset:0;background:
 radial-gradient(900px 640px at 50% 58%,rgba(0,122,255,.11),rgba(0,122,255,0) 62%),
 radial-gradient(700px 520px at 88% 6%,rgba(110,160,255,.14),rgba(110,160,255,0) 60%),
 radial-gradient(600px 480px at 8% 96%,rgba(0,122,255,.07),rgba(0,122,255,0) 60%),
 linear-gradient(180deg,#F8F9FC 0%,#EDF0F6 100%)}

/* wordmark, wide screens only */
.t-brand{position:absolute;z-index:90;top:calc(var(--st) + 26px);left:calc(var(--sl) + 30px);display:none;align-items:center;gap:7px;padding:8px;margin:-8px;border-radius:10px;text-decoration:none}
.t-brand .logo-mark{height:26px;width:auto}
.t-brand .logo-word{height:16px;width:auto;margin-top:3px}
@media (min-width:1080px){.t-brand{display:flex}}

/* floating guide bar */
.fbar{position:absolute;z-index:100;top:calc(var(--st) + 10px);left:50%;transform:translateX(-50%);width:min(600px,calc(100% - 20px - var(--sl) - var(--sr)));border-radius:24px;
 background:rgba(255,255,255,.8);-webkit-backdrop-filter:saturate(180%) blur(22px);backdrop-filter:saturate(180%) blur(22px);
 box-shadow:0 0 0 .5px rgba(0,0,0,.09),0 12px 32px -10px rgba(20,30,60,.24),0 2px 6px rgba(20,30,60,.06);
 transition:opacity .25s,transform .35s cubic-bezier(.32,.72,0,1)}
.fb-row{display:flex;align-items:center;gap:2px;padding:6px}
.fb-ic{flex:none;width:44px;height:44px;border:0;border-radius:50%;background:none;color:#1d1d1f;display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent;padding:0}
.fb-ic:hover{background:rgba(0,0,0,.055)}
.fb-ic:active{background:rgba(0,0,0,.09)}
.fb-play{background:var(--blue);color:#fff}
.fb-play:hover{background:#0068DB}
.fb-play:active{background:#005BC2}
.fb-play .i-play svg{transform:translateX(1px)}
.fb-play .i-pause{display:none}
.tour.playing .fb-play .i-play{display:none}
.tour.playing .fb-play .i-pause{display:block}
.tour.playing .fb-play{animation:ring 1.8s ease-out infinite}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(0,122,255,.45)}100%{box-shadow:0 0 0 12px rgba(0,122,255,0)}}
.fb-main{flex:1;min-width:0;min-height:44px;border:0;background:none;text-align:left;padding:4px 8px 4px 10px;cursor:pointer;display:flex;flex-direction:column;justify-content:center;gap:7px;border-radius:16px;color:inherit;-webkit-tap-highlight-color:transparent}
.fb-main:hover{background:rgba(0,0,0,.035)}
.fb-top{display:flex;align-items:center;gap:8px;min-width:0;font-size:15px;line-height:1.15}
.fb-step{font-weight:650;white-space:nowrap;letter-spacing:-.01em;color:#000;flex:none}
.tour.playing .fb-step:after{content:"Playing";margin-left:8px;padding:3px 7px;border-radius:999px;background:#E6F0FF;color:var(--blue);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;vertical-align:1px}
.fb-hint{color:var(--gray);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;display:none}
.chev{flex:none;color:#8e8e93;margin-left:auto;transition:transform .28s cubic-bezier(.32,.72,0,1)}
.tour.exp-on .chev{transform:rotate(180deg)}
.segs{display:flex;gap:4px;width:100%}
.sg{flex:1;height:4px;border-radius:2px;background:rgba(60,60,67,.14);overflow:hidden}
.sg i{display:block;height:100%;width:100%;background:var(--blue);border-radius:2px;transform-origin:left center;transform:scaleX(var(--p,0));transition:transform .55s cubic-bezier(.32,.72,0,1)}
@media (min-width:600px){.fb-hint{display:block}.fb-hint:not(:empty):before{content:"\00B7";margin-right:8px;color:#c7c7cc}}

.fb-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.32,.72,0,1)}
.tour.exp-on .fb-panel{grid-template-rows:1fr}
.fb-pin{min-height:0;overflow:hidden;padding:0 18px}
.tour.exp-on .fb-pin{overflow-y:auto;max-height:calc(100dvh - var(--stg,0px) - var(--st) - 96px);overscroll-behavior:contain}
.fb-pin>*{transition:opacity .25s}
.tour:not(.exp-on) .fb-pin>*{opacity:0}
.fb-k{margin:8px 0 0;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.fb-h{margin:4px 0 0;font-size:24px;line-height:1.15;letter-spacing:-.025em;font-weight:700;color:#000}
.fb-p{margin:6px 0 0;font-size:16px;line-height:1.42;color:var(--ink2)}
.fb-do{margin:12px 0 0;font-size:14.5px;line-height:1.35;color:var(--gray);font-weight:500}
.fb-do[hidden]{display:none}
.jps{list-style:none;margin:14px -18px 0;padding:2px 18px 4px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.jps::-webkit-scrollbar{display:none}
.jps li{flex:none;scroll-snap-align:start}
.jp{min-height:44px;padding:0 14px 0 8px;border-radius:999px;border:0;background:rgba(118,118,128,.1);display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:14px;font-weight:600;color:#3c3c43;cursor:pointer}
.jp:hover{background:rgba(118,118,128,.16)}
.jp-n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#fff;font-size:12.5px;font-weight:700;color:#3c3c43}
.jp.done .jp-n{background:#D6E8FF;color:var(--blue)}
.jp[aria-current=step]{background:var(--blue);color:#fff}
.jp[aria-current=step] .jp-n{background:rgba(255,255,255,.24);color:#fff}
.fb-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:10px;border-top:.5px solid rgba(60,60,67,.18)}
.fb-exit{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 6px;margin-left:-6px;border-radius:12px;color:#3c3c43;font-size:15px;font-weight:600;text-decoration:none}
.fb-exit:hover{color:#000;background:rgba(0,0,0,.04)}
.fb-nav{display:flex;gap:8px}
.pbtn{min-height:44px;padding:0 14px 0 18px;border-radius:999px;border:0;background:var(--blue);color:#fff;font-size:15px;font-weight:600;display:inline-flex;align-items:center;gap:3px;cursor:pointer}
.pbtn.ghost{background:rgba(118,118,128,.12);color:#1d1d1f;padding:0 18px 0 10px}
.pbtn:disabled{opacity:.38;cursor:default}
.fb-keys{margin:10px 0 0;font-size:12.5px;color:var(--gray)}
.fb-disc{margin:6px 0 14px;font-size:12.5px;line-height:1.4;color:var(--gray)}
@media (hover:none){.fb-keys{display:none}}
@media (min-width:600px){.fb-disc{display:none}.fb-keys{margin-bottom:14px}}
@media (hover:none) and (min-width:600px){.fb-foot{margin-bottom:14px}}

.guide-pill{position:absolute;z-index:100;top:calc(var(--st) + 10px);right:calc(var(--sr) + 10px);width:44px;height:44px;padding:0;border-radius:50%;border:0;background:rgba(255,255,255,.74);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 0 0 .5px rgba(0,0,0,.09),0 6px 18px -6px rgba(20,30,60,.28);color:#1d1d1f;display:grid;place-items:center;cursor:pointer}
.guide-pill[hidden]{display:none}

@media (min-width:1000px){
 .fbar{width:min(680px,calc(100% - 40px));border-radius:26px}
 .fb-row{padding:7px}
 .fb-top{font-size:16px}
 .fb-pin{padding:0 22px}
 .jps{margin:16px -22px 0;padding:2px 22px 4px}
 .fb-h{font-size:28px}
 .fb-p{font-size:17px}
}
/* stage */
.stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:calc(var(--stageTop) * 1px) 16px calc(var(--stageBot) * 1px);transition:opacity .4s,transform .6s cubic-bezier(.32,.72,0,1)}
.dev-wrap{position:relative;flex:none;width:406px;height:860px}
.dev-wrap:before{content:"";position:absolute;left:12%;right:12%;bottom:-3%;height:9%;background:radial-gradient(closest-side,rgba(20,30,70,.22),rgba(20,30,70,0));filter:blur(8px);z-index:-1}
.dev-wrap.zoom{animation:tz .62s cubic-bezier(.32,.72,0,1)}
@keyframes tz{0%{transform:scale(1)}38%{transform:scale(1.035)}100%{transform:scale(1)}}
.tour .dev.handset{--pw:390px;position:absolute;left:0;top:0;width:406px;transform-origin:0 0;
 box-shadow:0 0 0 1.5px #3a3a3c inset,0 60px 120px -40px rgba(20,40,100,.38),0 30px 60px -30px rgba(0,0,0,.32),0 0 0 1px rgba(0,0,0,.05)}
.tour .dev.handset .vp{width:390px;height:844px}
.tour .dev.bare{position:absolute;inset:0;width:auto;padding:0;border-radius:0;background:#F2F2F7;box-shadow:none}
.tour .dev.bare .vp{width:100%;height:100%;border-radius:0}
.tour .dev.bare .sb,.tour .dev.bare .homebar{display:none}
.tour .dev.bare .scr{padding-top:var(--uiTop)}
.tour .dev.bare .sheet{max-height:calc(100% - var(--uiTop) - 2px)}
.tour .dev.bare .sh-foot{padding-bottom:max(22px,calc(var(--sb) + 10px))}
.tour .dev.bare .asheet{padding-bottom:max(22px,calc(var(--sb) + 10px))}
.tour .dev.bare .toast{top:calc(var(--uiTop) + 2px)}
@media (max-width:599px){
 .stage{padding:0;align-items:stretch}
 .dev-wrap{width:100%;height:100%}
 .dev-wrap:before{display:none}
}

@keyframes pulse{0%{inset:-2px;opacity:.9}100%{inset:-13px;opacity:0}}

/* scene changes */
.tour.swap .fb-top{animation:fadeup .38s cubic-bezier(.32,.72,0,1)}
.tour.swap.exp-on .fb-pin>*{animation:fadeup .38s cubic-bezier(.32,.72,0,1)}
@keyframes fadeup{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

/* closing scene */
.end{position:absolute;inset:0;z-index:80;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;
 padding:calc(var(--st) + 86px) calc(var(--sr) + 22px) calc(var(--sb) + 48px) calc(var(--sl) + 22px);
 opacity:0;transform:translateY(18px) scale(.985);transition:opacity .45s,transform .65s cubic-bezier(.32,.72,0,1)}
.end[hidden]{display:none}
.tour.ended .end{opacity:1;transform:none}
.tour.ended .stage{opacity:0;transform:scale(.94);pointer-events:none}
.end-in{max-width:560px;width:100%;text-align:center;margin:auto 0}
.end-k{margin:0;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.end h2{margin:8px 0 0;font-size:clamp(44px,12vw,76px);line-height:1;letter-spacing:-.045em;font-weight:700;color:#000}
.end h2:focus{outline:none}
.recap{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:10px;text-align:left}
.recap li{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;background:#fff;border-radius:20px;box-shadow:0 0 0 .5px rgba(0,0,0,.06),0 10px 28px -14px rgba(20,30,60,.22);font-size:16px;line-height:1.4;color:var(--ink2)}
.recap b{display:block;color:#000;font-weight:650;margin-bottom:1px}
.rc-i{flex:none;width:40px;height:40px;border-radius:12px;background:#EAF3FF;color:var(--blue);display:grid;place-items:center}
.end-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.ebtn{min-height:50px;padding:0 22px;border-radius:999px;border:0;background:#fff;color:#1d1d1f;font-size:16px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;text-decoration:none;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.ebtn:hover{box-shadow:0 0 0 1px rgba(0,0,0,.22)}
.ebtn.pri{background:var(--blue);color:#fff;box-shadow:none}
.ebtn.pri:hover{background:#0068DB}
.ebtn.link{background:none;box-shadow:none;color:var(--blue)}
.ebtn.link:hover{text-decoration:underline}
@media (min-width:900px){.end-in{max-width:900px}.recap{grid-template-columns:repeat(3,1fr);gap:14px}.recap li{flex-direction:column;gap:12px;padding:20px}}
@media (max-width:599px){.end-btns{flex-direction:column;align-items:stretch}.ebtn{width:100%}.end h2{margin-top:6px}.recap{margin-top:24px}.end-btns{margin-top:24px}}

.disc-t{position:absolute;left:0;right:0;bottom:calc(var(--sb) + 14px);z-index:85;margin:0;padding:0 16px;text-align:center;font-size:12.5px;color:var(--gray);pointer-events:none}
@media (max-width:599px){.disc-t{display:none}.tour.is-end .disc-t{display:block}}

@media (prefers-reduced-motion:reduce){
 .fbar,.fb-panel,.fb-pin>*,.stage,.end,.chev,.sg i,.finger,.guide-pill{transition-duration:.01ms!important}
 .tour.playing .fb-play,.dev-wrap.zoom,.tour.swap .fb-top,.tour.swap.exp-on .fb-pin>*{animation:none!important}
}

/* autoplay: a small fading dot where the simulated tap lands; nothing dims or covers the screen */
.coach{position:absolute;inset:0;z-index:47;pointer-events:none}
.finger{position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:rgba(0,122,255,.26);box-shadow:0 0 0 1px rgba(0,122,255,.3);opacity:0;transition:opacity .22s,scale .16s;scale:1}
.finger.on{opacity:1}
.finger.press{scale:.72;background:rgba(0,122,255,.38)}
.finger.out{opacity:0;scale:1.5;transition:opacity .35s,scale .35s}
.fb-next.nudge{background:var(--blue);color:#fff}
.fb-next.nudge:hover{background:#0068DB}
/* phone layout shows phone-only UI, like the framed handset */
.tour .dev.bare .pc{display:none!important}
/* no pulsing ring on Invite: the tour lets people explore */
.tour .vp[data-step="1"] #inviteBtn:after{content:none;display:none}
.tour.exp-on .fbar{background:rgba(255,255,255,.95)}

/* ===== v13.2: dark tour chrome, can't be closed, opens on a welcome ===== */
.tour{--uiTop:calc(var(--st) + 80px)}
.fbar{background:#0E0E14;color:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;
 box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 16px 40px -12px rgba(0,0,0,.55),0 4px 12px rgba(10,15,30,.22)}
.tour.exp-on .fbar{background:#0E0E14}
.fbar :focus-visible{outline-color:rgba(90,168,255,.95)}
.fb-ic{color:#fff}
.fb-ic:hover{background:rgba(255,255,255,.1)}
.fb-ic:active{background:rgba(255,255,255,.16)}
.fb-next{background:rgba(255,255,255,.12)}
.fb-play{background:var(--blue);color:#fff}
.fb-play:hover{background:#1A88FF}
.fb-main:hover{background:rgba(255,255,255,.06)}
.fb-step{color:#fff}
.tour.playing .fb-step:after{background:rgba(0,122,255,.28);color:#9CCBFF}
.fb-hint{color:#A1A1AA}
@media (min-width:600px){.fb-hint:not(:empty):before{color:#5c5c66}}
.chev{color:#A1A1AA}
.sg{background:rgba(255,255,255,.2)}
.fb-k{color:#5AA8FF}
.fb-h{color:#fff}
.fb-p{color:#D4D4DB}
.fb-do{color:#A1A1AA}
.jp{background:rgba(255,255,255,.1);color:#F2F2F7}
.jp:hover{background:rgba(255,255,255,.16)}
.jp-n{background:rgba(255,255,255,.14);color:#fff}
.jp.done .jp-n{background:rgba(0,122,255,.4);color:#fff}
.jp[aria-current=step]{background:var(--blue);color:#fff}
.fb-foot{border-top:1px solid rgba(255,255,255,.12)}
.fb-exit{color:#C7C7CF}
.fb-exit:hover{color:#fff;background:rgba(255,255,255,.08)}
.pbtn.ghost{background:rgba(255,255,255,.12);color:#fff}
.fb-keys,.fb-disc{color:#9A9AA3}
/* welcome state */
.fb-wel{display:none}
.tour[data-wel="1"] .fb-wel{display:block}
.tour[data-wel="1"] .fb-pin>:not(.fb-wel){display:none}
.fb-wel .fb-h{margin-top:4px}
.wel-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.wel-go{min-height:48px;padding:0 16px 0 22px;font-size:16px}
.wel-play{min-height:48px;padding:0 18px 0 14px;gap:8px;font-size:16px}
.wel-exit{display:inline-flex;margin:8px 0 12px -6px;font-size:14px;color:#A1A1AA}
@media (max-width:599px){.wel-btns{flex-direction:column;align-items:stretch}.wel-go,.wel-play{justify-content:center;width:100%}.wel-exit{align-self:center}.fb-wel{display:none;flex-direction:column}.tour[data-wel="1"] .fb-wel{display:flex}}
.wel-scrim{position:absolute;inset:0;z-index:99;background:rgba(8,10,20,.22);opacity:0;pointer-events:none;transition:opacity .3s}
.tour[data-wel="1"].exp-on .wel-scrim{opacity:1;pointer-events:auto}
.tour.wel-done .wel-scrim{display:none}

/* phones: let Safari tuck its toolbar away. The page itself is a little taller than the screen,
   so a swipe scrolls the document (the tour stays pinned), and the app's tab bar only reserves
   home-indicator space when there is one. */
@media (max-width:599px) and (hover:none) and (pointer:coarse){
 html,body{height:auto;overflow-x:hidden;overflow-y:auto}
 body{min-height:calc(100vh + 96px);min-height:calc(100lvh + 96px)}
 html{overscroll-behavior-y:none}
 .tour .dev.bare .scroll{overscroll-behavior-y:auto}
}
.tour .dev.bare .tabbar{height:calc(50px + var(--sb));padding-top:6px;background:#F9F9F9;z-index:6}
@media (prefers-reduced-motion:reduce){.wel-scrim{transition:none}}

/* v13.3: Invite screen (phone layout) is one stable, compact layout that fits a phone with Safari's
   toolbars showing (about 660px tall) with the agent card fully open, so nothing appears or grows later */
.tour #s-base .x-short{display:none}
.tour .dev.bare #s-base .lt{font-size:26px}
.tour .dev.bare #s-base .st{margin-top:2px!important}
.tour .dev.bare #s-base .prog{margin-top:7px}
.tour .dev.bare #s-base .medlist{margin-top:10px}
.tour .dev.bare #s-base .med{padding:7px 16px}
.tour .dev.bare #s-base .b-main .ib{margin-top:12px;min-height:44px}
.tour .dev.bare #s-base .ordiv{margin:16px 4px 8px}
.tour .dev.bare #s-base .card-agent{padding:11px 16px}
.tour .dev.bare #s-base .ca-l{margin-top:6px!important}
.tour .dev.bare #s-base .ca-l li{padding:1px 0}
.tour .dev.bare #s-base #inviteBtn{margin-top:12px;min-height:44px}
.tour .dev.bare #s-base .secured{margin-top:7px}
.tour .dev.bare #s-base .base-body{padding-top:2px;padding-bottom:calc(58px + var(--sb,0px))}

/* bar: tappable progress segments (each jumps to its step without opening the panel) */
.fb-exp{display:block;width:100%;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;border-radius:10px;-webkit-tap-highlight-color:transparent}
.sg{position:relative;display:block;min-width:0;margin:0;padding:0;border:0;overflow:visible;cursor:pointer;font:inherit;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;transition:transform .15s ease}
.sg::after{content:"";position:absolute;left:-2px;right:-2px;top:-9px;bottom:-9px}
@media (hover:hover){.sg:hover{transform:scaleY(1.5)}}
.sg:focus-visible{transform:scaleY(1.5)}
.sg:active{transform:scaleY(1.9)}
.sg:focus-visible{outline:2px solid var(--blue);outline-offset:5px}