.duo-root{isolation:isolate;position:relative}.duo-background{z-index:-1;pointer-events:none;position:absolute;inset:0}.duo-device{width:100%;height:520px;position:relative}.duo-device canvas{width:100%;height:100%;display:block}.duo-screen-video{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;top:0;left:0}.duo-device-target{cursor:grab;touch-action:pan-y;background:0 0;border:0;border-radius:24px;position:absolute;inset:8% 12%}.duo-device-target:active{cursor:grabbing}.duo-device-target:focus-visible{outline-offset:4px;outline:2px solid}.duo-device-target:disabled{cursor:wait}.duo-status{text-align:center;color:var(--duo-ink,#34332f);background:var(--duo-paper,#f4f3ef);pointer-events:none;border-radius:8px;padding:12px 16px;font-size:13px;line-height:20px;position:absolute;inset:45% 16% auto}.duo-credit{min-height:44px;color:inherit;text-underline-offset:4px;white-space:nowrap;align-items:center;text-decoration:none;display:inline-flex}.duo-credit:focus-visible{outline-offset:4px;outline:2px solid}.duo-scrubber{width:136px;height:44px;accent-color:var(--duo-ink,#34332f);cursor:ew-resize}@media (hover:hover) and (pointer:fine){.duo-credit:hover{text-decoration:underline}}@media (width<=600px){.duo-device{height:400px}.duo-device-target{inset:12% 4%}.duo-scrubber{width:96px}}*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif}button,a{-webkit-tap-highlight-color:transparent}.page{--duo-paper:#f4f3ef;--duo-ink:#34332f;background:var(--duo-paper);min-height:100dvh;color:var(--duo-ink);-webkit-font-smoothing:antialiased;place-items:center;padding:64px 24px 100px;display:grid}.page.dark{--duo-paper:#171816;--duo-ink:#d9dbd4}.phone-study{width:min(100%,840px)}.phone-study .duo-background{border-radius:0}.phone-controls{justify-content:center;align-items:center;gap:12px;display:flex}.phone-controls button{border:1px solid color-mix(in srgb, currentColor 24%, transparent);min-width:76px;min-height:44px;color:inherit;font:inherit;cursor:pointer;background:0 0;border-radius:22px;padding:0 16px;font-size:13px}.phone-controls input{color:inherit}.phone-controls output{font-variant-numeric:tabular-nums;width:34px;font-size:12px}.phone-controls button:focus-visible,.phone-controls input:focus-visible{outline-offset:3px;outline:2px solid}.phone-controls button:active{transform:scale(.96)}.phone-caption{color:inherit;justify-content:center;align-items:center;gap:24px;padding:12px 24px;font-size:12px;line-height:16px;display:flex}.page-actions{align-items:center;gap:20px;font-size:13px;display:flex;position:fixed;bottom:24px;left:24px}.page-actions button{min-height:44px;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;align-items:center;padding:0;display:inline-flex}.page-actions button:focus-visible{outline-offset:4px;outline:2px solid}@media (width<=600px){.page{padding:56px 12px 100px}.phone-controls{gap:8px}.phone-caption{flex-direction:column;gap:0;padding-top:20px}.phone-caption>span{font-size:11px}.page-actions{bottom:16px;left:16px}}@media (height<=780px) and (width>=601px){.duo-device{height:max(320px,100dvh - 260px)}}@media (prefers-reduced-motion:reduce){.phone-controls button:active{transform:none}}