.device-shot{--ds-ink:var(--header);--ds-edge:color-mix(in srgb, var(--header-text) 14%, var(--header));background:var(--ds-ink);min-width:0;box-shadow:0 0 0 1px var(--ds-edge), var(--shadow), 0 32px 64px -24px color-mix(in srgb, var(--header) 45%, transparent);display:grid;position:relative}.device-shot picture,.device-shot img{width:100%;height:auto;display:block}.ds-phone{width:var(--ds-phone-w,min(100%, 300px));border-radius:48px;padding:10px}.ds-phone .ds-screen{background:var(--ground);overflow:hidden}.ds-phone .ds-status{z-index:1;background:var(--header);height:32px;color:var(--header-text);font-family:var(--font-body);border-radius:38px 38px 0 0;justify-content:space-between;align-items:center;padding:0 28px;font-size:12px;font-weight:600;display:flex;position:absolute;inset:10px 10px auto}.ds-phone .ds-island{background:var(--header);width:76px;height:20px;box-shadow:inset 0 0 0 1px var(--ds-edge);border-radius:999px}.ds-phone .ds-bars{border-radius:3px;width:22px;height:10px;position:relative;box-shadow:inset 0 0 0 1.5px}.ds-phone .ds-bars:after{content:"";background:currentColor;border-radius:1px;position:absolute;inset:2.5px 6px 2.5px 2.5px}.ds-phone .ds-screen{border-radius:0 0 38px 38px;margin-top:32px}.ds-desktop{border-radius:14px;width:100%;overflow:hidden}.ds-desktop .ds-chrome{align-items:center;gap:16px;height:36px;padding:0 14px;display:flex}.ds-desktop .ds-dots,.ds-desktop .ds-dots:before,.ds-desktop .ds-dots:after{background:var(--ds-edge);border-radius:999px;flex:none;width:10px;height:10px}.ds-desktop .ds-dots{margin-left:32px;position:relative}.ds-desktop .ds-dots:before,.ds-desktop .ds-dots:after{content:"";position:absolute;top:0}.ds-desktop .ds-dots:before{left:-32px}.ds-desktop .ds-dots:after{left:-16px}.ds-desktop .ds-address{text-align:center;background:color-mix(in srgb, var(--header-text) 8%, var(--header));max-width:360px;color:color-mix(in srgb, var(--header-text) 62%, var(--header));font-family:var(--font-body);white-space:nowrap;text-overflow:ellipsis;border-radius:999px;flex:auto;margin-inline:auto;padding:4px 12px;font-size:12px;line-height:1.3;overflow:hidden}.ds-wide-only{display:none}@media (min-width:960px){.ds-wide-only{display:grid}}.ds-group{min-width:0}.ds-pair{justify-items:center;display:grid;position:relative}@media (min-width:960px){.ds-pair:not(.ds-solo){justify-items:stretch;padding-bottom:10%}.ds-pair:not(.ds-solo)>.ds-desktop{justify-self:end;width:86%}.ds-pair.ds-phone-right:not(.ds-solo)>.ds-desktop{justify-self:start}.ds-pair:not(.ds-solo)>.ds-phone{--ds-phone-w:25%;border-radius:30px;padding:6px;position:absolute;bottom:0;left:0}.ds-pair:not(.ds-solo)>.ds-phone .ds-screen{border-radius:0 0 24px 24px;margin-top:22px}.ds-pair:not(.ds-solo)>.ds-phone .ds-status{border-radius:24px 24px 0 0;height:22px;padding:0 14px;font-size:9px;inset:6px 6px auto}.ds-pair:not(.ds-solo)>.ds-phone .ds-island{width:44px;height:12px}.ds-pair:not(.ds-solo)>.ds-phone .ds-bars{width:14px;height:7px}.ds-pair.ds-phone-right:not(.ds-solo)>.ds-phone{left:auto;right:0}}.ds-tag{text-align:center;color:var(--muted);margin:16px 0 0;font-size:14px;line-height:1.45}@media (prefers-reduced-motion:no-preference){[data-reveal] .device-shot{transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1)}[data-reveal] .ds-phone{transition-delay:.12s}[data-reveal=wait] .device-shot{opacity:0;transform:translateY(32px)}}