.device-duo{--duo-browser: 86%;--duo-phone: 22%;--duo-overhang: 7%;--duo-caption-h: 25px;position:relative;max-width:1040px;margin:0 auto;padding-bottom:max(var(--duo-caption-h),var(--duo-overhang))}.device-duo figcaption{width:calc(var(--duo-browser) - var(--duo-phone) / 2);margin-bottom:calc(-1 * var(--duo-caption-h));padding-top:var(--space-sm);line-height:1.4;font-size:12px;color:var(--color-fg-3)}.hero.dark .device-duo figcaption{color:var(--dark-fg-3)}.device-browser{display:block;width:var(--duo-browser);padding:0;border:1px solid var(--color-border-strong);border-radius:var(--radius-md);overflow:hidden;background:var(--color-surface-white);box-shadow:0 24px 60px #0f172a2e,0 2px 6px #0f172a14;text-align:left}.hero.dark .device-browser{border-color:var(--dark-border-strong);box-shadow:0 30px 80px #0000008c,0 0 0 1px #ffffff0a}button.device-browser{font:inherit;cursor:zoom-in;transition:transform .25s ease}button.device-browser:hover{transform:translateY(-2px)}button.device-browser:focus-visible{outline:3px solid var(--color-accent-primary);outline-offset:3px}.device-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.device-browser-bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:var(--color-surface-medium);border-bottom:1px solid var(--color-border-strong)}.device-browser-bar .dot{width:10px;height:10px;border-radius:50%;background:var(--color-surface-high);flex-shrink:0}.device-browser-url{display:flex;align-items:center;justify-content:center;gap:4px;flex:0 1 260px;height:18px;margin:0 auto;border-radius:var(--radius-pill);background:var(--color-surface-white);font-size:11px;font-weight:var(--weight-medium);color:var(--color-fg-3)}.device-browser img,.device-phone img{display:block;width:100%;height:auto}.shot-annotated{display:block;position:relative;container-type:inline-size}.shot-callouts{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.shot-callout{--callout-gap: 1.1em;--callout-inset: 1.4em;position:absolute;left:var(--x);top:var(--y);padding:.35em .65em;border:1px solid var(--color-accent-primary);border-radius:var(--radius-sm);background:var(--color-primary);color:var(--color-fg-on-dark);font-family:var(--font-body);font-size:clamp(8px,1.1cqi,15px);font-weight:var(--weight-semibold);line-height:1.25;white-space:nowrap;box-shadow:0 6px 18px #0f172a47;pointer-events:none}.shot-callout--loss{border-color:var(--color-error)}.shot-callout:after{content:"";position:absolute;width:.7em;height:.7em;margin-left:-.35em;background:var(--color-primary);transform:rotate(45deg)}.shot-callout[data-side=top-left]{transform:translate(calc(-100% + var(--callout-inset)),calc(-100% - var(--callout-gap)))}.shot-callout[data-side=top-right]{transform:translate(calc(-1 * var(--callout-inset)),calc(-100% - var(--callout-gap)))}.shot-callout[data-side=bottom-left]{transform:translate(calc(-100% + var(--callout-inset)),var(--callout-gap))}.shot-callout[data-side^=top]:after{bottom:-.35em}.shot-callout[data-side^=bottom]:after{top:-.35em}.shot-callout[data-side$=-left]:after{left:calc(100% - var(--callout-inset))}.shot-callout[data-side$=-right]:after{left:var(--callout-inset)}.shot-callout--phone{left:auto;right:calc(100% + .9em);top:50%;transform:translateY(-50%);font-size:clamp(9px,.9vw,12px)}.shot-callout--phone:after{top:50%;left:100%;margin-top:-.35em}@media(max-width:759px){.shot-callout{display:none}}.device-phone{position:absolute;right:0;bottom:0;width:var(--duo-phone);padding:clamp(4px,.8%,9px);border-radius:14%/6.4%;background:var(--color-secondary);box-shadow:0 0 0 1px #ffffff1a inset,0 0 0 2px var(--color-fg-3),0 30px 60px #03030a73}.screen-zoom{width:min(94vw,1600px);max-width:none;max-height:92vh;margin:auto;padding:0;border:0;border-radius:var(--radius-md);background:var(--color-surface-white);overflow:auto;box-shadow:0 30px 80px #00000080}.screen-zoom::backdrop{background:#050510d9;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.screen-zoom img{display:block;width:100%;height:auto}.screen-zoom-close{position:fixed;top:var(--space-md);right:var(--space-md);display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--dark-border-strong);border-radius:50%;background:var(--color-primary);color:var(--color-fg-on-dark);font-size:20px;cursor:pointer}.screen-zoom-close:focus-visible{outline:3px solid var(--color-accent-primary);outline-offset:2px}.hero-screens{margin:8px auto 72px}.app-tour-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-sm);margin:0 auto var(--space-lg)}.app-tour-tab{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 16px;border:1px solid var(--color-border-strong);border-radius:var(--radius-pill);background:var(--color-surface-white);color:var(--color-fg-2);font:inherit;font-size:14px;font-weight:var(--weight-semibold);cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease}.app-tour-tab i{font-size:16px}.app-tour-tab:hover{border-color:var(--color-primary);color:var(--color-fg-1)}.app-tour-tab[aria-selected=true]{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-fg-on-dark)}.app-tour-tab:focus-visible{outline:3px solid var(--color-accent-link);outline-offset:2px}.app-tour-panel-head{max-width:640px;margin:0 auto var(--space-lg);text-align:center}.app-tour-panel-head h3{margin-bottom:var(--space-sm);font-size:22px}.app-tour-panel-head p{margin:0;color:var(--color-fg-2)}.app-tour-panel:focus-visible{outline:3px solid var(--color-accent-link);outline-offset:8px;border-radius:var(--radius-md)}@media(max-width:599px){.device-duo{--duo-browser: 92%;--duo-phone: 36%;--duo-overhang: 30%}.device-duo{--duo-caption-h: 42px}.device-duo figcaption{width:calc(100% - var(--duo-phone) - var(--space-sm))}.device-browser-bar{height:20px;gap:4px;padding:0 8px}.device-browser-bar .dot{width:6px;height:6px}.device-browser-url{display:none}.hero-screens{margin-bottom:48px}.app-tour .device-duo,.device-duo.phone-first{padding-bottom:0}.app-tour .device-browser,.device-duo.phone-first .device-browser{display:none}.app-tour .device-phone,.device-duo.phone-first .device-phone{position:relative;width:min(72vw,280px);margin:0 auto}.app-tour .device-duo figcaption,.device-duo.phone-first figcaption{width:auto;margin-bottom:0;text-align:center}.app-tour-tabs{position:sticky;top:64px;z-index:60;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-inline:16px;scrollbar-width:none;margin-left:-16px;margin-right:-16px;padding:8px 16px 10px;background:#f1f5f9f2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(15,23,42,.06);-webkit-mask-image:linear-gradient(to right,black calc(100% - 36px),transparent 100%);mask-image:linear-gradient(to right,black calc(100% - 36px),transparent 100%)}.app-tour-tabs::-webkit-scrollbar{display:none}.app-tour-tab{flex-shrink:0;scroll-snap-align:start}}@media(min-width:481px)and (max-width:599px){.app-tour-tabs{margin-left:-32px;margin-right:-32px;padding:8px 32px 10px;scroll-padding-inline:32px}}@media(prefers-reduced-motion:reduce){.app-tour-tab,button.device-browser{transition:none}button.device-browser:hover{transform:none}}.fire-shot{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}.device-phone.device-phone-solo{position:relative;right:auto;bottom:auto;width:min(300px,70vw)}.fire-shot figcaption{font-size:12px;color:var(--color-fg-3)}