.dt{--dt-ease:cubic-bezier(.22, 1, .36, 1);color:var(--dt-ink,#fff);grid-template-columns:minmax(0,360px) minmax(0,1fr);align-items:center;gap:clamp(28px,5vw,72px);display:grid}.dt-laptop{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}.dt-device{position:relative}.dt-tv{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}.dt-tv .dt-screen{box-shadow:0 0 0 1px #ffffff24, 0 30px 80px -20px var(--dt-accent,#3ad1c3);border:10px solid #050507;border-radius:14px}.dt-tv .dt-screen img{object-position:center}.dt-stand{clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);background:linear-gradient(#1a1b22,#0b0b10);width:22%;height:16px;margin:0 auto}.dt-phone .dt-device{box-shadow:0 0 0 3px var(--dt-ink,#fff), 12px 12px 0 var(--dt-accent,#ff3da5);border:10px solid #0b0716;border-radius:46px;overflow:hidden}.dt-laptop .dt-device{border:2px solid var(--dt-ink,#fff);box-shadow:10px 10px 0 var(--dt-accent,#f7731c);background:#fff;border-radius:16px;overflow:hidden}.dt-chrome{background:#ece6dc;border-bottom:1px solid #d9d0c2;align-items:center;gap:6px;padding:10px 14px;display:flex}.dt-chrome i{background:#e1251b;border-radius:50%;width:10px;height:10px}.dt-chrome i:nth-child(2){background:#f7a21c}.dt-chrome i:nth-child(3){background:#3ab86a}.dt-chrome span{color:#6b5d52;margin-left:10px;font:600 12px ui-monospace,Menlo,monospace}.dt-screen{touch-action:pan-y;background:#111;position:relative;overflow:hidden}.dt-screen img{object-fit:cover;object-position:top left;opacity:0;width:100%;height:100%;transition:opacity .45s var(--dt-ease), transform .55s var(--dt-ease);position:absolute;inset:0;transform:translate(6%)scale(1.02)}.dt-screen img.past{transform:translate(-6%)scale(1.02)}.dt-screen img.on{opacity:1;transform:none}.dt-bars{z-index:3;gap:4px;display:flex;position:absolute;top:10px;left:12px;right:12px}.dt-bars i{background:#ffffff59;border-radius:3px;flex:1;height:3px;overflow:hidden;box-shadow:0 0 0 .5px #00000026}.dt-bars b{background:var(--dt-accent,#fff);height:100%;display:block}.dt-tap{z-index:2;cursor:pointer;background:0 0;border:0;width:40%;position:absolute;top:0;bottom:0}.dt-tap.prev{cursor:w-resize;left:0}.dt-tap.next{cursor:e-resize;right:0}.dt-copy{align-content:center;gap:14px;display:grid}.dt-count{letter-spacing:.14em;color:var(--dt-accent,#fff);font:700 12px ui-monospace,Menlo,monospace}.dt-swap{display:grid}.dt-swap>div{visibility:hidden;grid-area:1/1;align-content:start;gap:14px;display:grid}.dt-swap>div.on{visibility:visible}.dt-swap>div:not(.on) h3,.dt-swap>div:not(.on) p{animation:none}.dt-pp{display:inline-grid}.dt-pp>span{visibility:hidden;grid-area:1/1}.dt-pp>span.on{visibility:visible}.dt-copy h3{font:800 clamp(30px, 3.8vw, 50px)/1 var(--head);letter-spacing:-.03em;color:var(--dt-ink,#fff);animation:dtIn .4s var(--dt-ease);text-shadow:none}.dt-copy p{color:var(--dt-muted,#b9aedd);max-width:28em;animation:dtIn .5s var(--dt-ease);text-shadow:none;font-size:19px;line-height:1.55}@keyframes dtIn{0%{opacity:0;transform:translateY(8px)}}.dt-ctrl{gap:8px;display:flex}.dt-ctrl button{border:2px solid var(--dt-ink,#fff);background:var(--dt-btn,transparent);min-width:48px;height:44px;color:var(--dt-ink,#fff);font:800 14px var(--body);cursor:pointer;border-radius:12px;padding:0 14px;transition:transform .15s}.dt-ctrl button:hover{transform:translateY(-2px)}.dt-list{flex-wrap:wrap;gap:6px;margin:8px 0 0;padding:0;list-style:none;display:flex}.dt-list button{border:1px solid color-mix(in srgb, var(--dt-ink,#fff) 25%, transparent);font:700 13px var(--body);color:var(--dt-muted,#b9aedd);cursor:pointer;background:0 0;border-radius:999px;padding:6px 12px}.dt-list button.on{background:var(--dt-ink,#fff);color:var(--dt-on-ink,#111);border-color:var(--dt-ink,#fff)}@media (width<=960px){.dt,.dt-laptop,.dt-tv{grid-template-columns:minmax(0,1fr)}.dt-phone .dt-device{justify-self:center;width:100%;max-width:320px}.dt-list{display:none}}@media (prefers-reduced-motion:reduce){.dt *,.dt :before{transition:none!important;animation:none!important}}