.dv{position:relative;display:block;width:100%;container-type:inline-size}.dv>*{--u:calc(100cqw / var(--ow))}.dv *,.dv :after,.dv :before{box-sizing:border-box}.dv-body{position:absolute;z-index:1;top:0;left:calc(var(--mx) * var(--u));width:calc(var(--bw) * var(--u));height:calc(var(--bh) * var(--u));border-radius:calc(var(--rt) * var(--u)) calc(var(--rt) * var(--u)) calc(var(--rb) * var(--u)) calc(var(--rb) * var(--u));background:var(--bb,#2b2c30);box-shadow:inset 0 0 0 calc(var(--u) * .8) hsla(0,0%,100%,.55),inset 0 0 0 calc(var(--u) * 1.8) rgba(0,0,0,.16),0 calc(var(--u) * 14) calc(var(--u) * 34) calc(var(--u) * -12) rgba(12,30,36,.38)}.dv-body:before{content:"";position:absolute;inset:calc(var(--band) * var(--u));border-radius:calc((var(--rt) - var(--band)) * var(--u)) calc((var(--rt) - var(--band)) * var(--u)) calc((var(--rb) - var(--band)) * var(--u)) calc((var(--rb) - var(--band)) * var(--u));background:#030304;box-shadow:0 0 0 calc(var(--u) * 1) #17181a,inset 0 0 0 calc(var(--u) * 1) hsla(0,0%,100%,.05)}.dv-silver{--bb:#d8dbe0}.dv-metal{--bb:#c9cdd2}.dv-ti{--bb:#aaa59d}.dv-pad{--bb:#d3d6db}.dv-screen{position:absolute;z-index:2;overflow:hidden;background:#000;left:calc((var(--mx) + var(--band) + var(--bz)) * var(--u));top:calc((var(--band) + var(--bz)) * var(--u));width:calc(var(--sw) * var(--u));height:calc(var(--sh) * var(--u));border-radius:calc(var(--sr) * var(--u))}.dv-img,.dv-screen>img{object-fit:cover;object-position:top;width:100%;height:100%}.dv-glare{position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;background:linear-gradient(113deg,hsla(0,0%,100%,0) 3%,hsla(0,0%,100%,.24) 10%,hsla(0,0%,100%,.1) 16%,hsla(0,0%,100%,0) 26%,hsla(0,0%,100%,0) 64%,hsla(0,0%,100%,.09) 70%,hsla(0,0%,100%,0) 76%),linear-gradient(rgba(30,62,84,.05),rgba(30,62,84,.05)),url(/site-media/devices/sheen.png) 50% /100% 100% no-repeat;box-shadow:inset 0 0 0 calc(var(--u) * 1) hsla(0,0%,100%,.07)}.dv-island{position:absolute;z-index:4;left:50%;top:calc(var(--u) * 11);transform:translateX(-50%);width:calc(var(--u) * 125);height:calc(var(--u) * 37);border-radius:999px;background:#000}.dv-island:before{left:19%;width:7%;background:#0b0d12}.dv-island:after,.dv-island:before{content:"";position:absolute;top:50%;aspect-ratio:1;transform:translateY(-50%);border-radius:50%}.dv-island:after{right:9%;width:25%;background:#0c1018;box-shadow:inset 0 0 0 calc(var(--u) * 1.6) #151a26,inset 0 0 0 calc(var(--u) * 4) #080a10}.dv-btn{position:absolute;z-index:0;top:calc(var(--y) * var(--u));height:calc(var(--h) * var(--u));width:calc(var(--u) * 3.4);background:var(--bb,#3a3c40);box-shadow:inset 0 0 0 calc(var(--u) * .6) rgba(0,0,0,.22),inset 0 calc(var(--u) * 1) 0 hsla(0,0%,100%,.35)}.dv-btn.l{left:calc(var(--u) * -1.2)}.dv-btn.l,.dv-btn.r{border-radius:calc(var(--u) * 2) 0 0 calc(var(--u) * 2)}.dv-btn.r{right:calc(var(--u) * -1.2);transform:scaleX(-1)}.dv-btn.t{top:calc(var(--u) * -1.2);left:calc(var(--x) * var(--u));width:calc(var(--w) * var(--u));height:calc(var(--u) * 3.4);border-radius:calc(var(--u) * 2) calc(var(--u) * 2) 0 0}.dv-btn-wrap{position:absolute;inset:0;z-index:0}.dv-cam{position:absolute;z-index:3;width:calc(var(--u) * 8);aspect-ratio:1;border-radius:50%;background:#10141d;box-shadow:0 0 0 calc(var(--u) * 1.4) #17191d,inset 0 0 0 calc(var(--u) * 1.6) #1b2030,inset 0 0 0 calc(var(--u) * 3.2) #0a0c12}.dv-notch{position:absolute;z-index:4;left:50%;top:calc(var(--u) * -2);transform:translateX(-50%);width:calc(var(--u) * 178);height:calc(var(--u) * 25);background:#000;border-radius:0 0 calc(var(--u) * 13) calc(var(--u) * 13)}.dv-notch>i{position:absolute;border-radius:50%}.dv-notch .lens{left:50%;top:calc(var(--u) * 8);width:calc(var(--u) * 9);aspect-ratio:1;transform:translateX(-50%);background:#0e121b;box-shadow:0 0 0 calc(var(--u) * 1) #1a1d26,inset 0 0 0 calc(var(--u) * 2) #1a2030,inset 0 0 0 calc(var(--u) * 4) #07080d}.dv-notch .dot{left:calc(50% + var(--u) * 20);top:calc(var(--u) * 11.5);width:calc(var(--u) * 3.5);aspect-ratio:1;background:#0b0d12}.dv-base{position:absolute;z-index:0;left:0;width:100%;bottom:0;height:calc(var(--u) * 36);border-radius:0 0 calc(var(--u) * 20) calc(var(--u) * 20);box-shadow:0 calc(var(--u) * 14) calc(var(--u) * 26) calc(var(--u) * -10) rgba(12,30,36,.45)}.dv-base svg{display:block;width:100%;height:100%}.dv-stage{position:absolute;inset:0;perspective:calc(var(--u) * var(--ow) * 2.4)}.dv-floor{position:absolute;left:6%;right:6%;bottom:0;height:calc(var(--u) * 120);background:transparent}.dv-pole{width:calc(var(--u) * 112);top:calc(var(--u) * 700);height:calc(var(--u) * 1030);background:#d9dce0;box-shadow:inset calc(var(--u) * -26) 0 0 0 #c3c7cc}.dv-neck,.dv-pole{position:absolute;z-index:1;left:50%;transform:translateX(-50%)}.dv-neck{top:calc(var(--u) * 640);width:calc(var(--u) * 250);height:calc(var(--u) * 170);border-radius:calc(var(--u) * 28);background:#cfd2d7}.dv-foot{position:absolute;z-index:2;left:50%;transform:translateX(-50%);bottom:calc(var(--u) * 14);width:calc(var(--u) * 760);height:calc(var(--u) * 140)}.dv-foot svg{display:block;width:100%;height:100%}.dv-tilt{z-index:3;height:calc(var(--bh) * var(--u));transform-origin:50% 70%;transform:rotateX(calc(var(--tilt) * 1deg))}.dv-thick,.dv-tilt{position:absolute;left:0;top:0;width:100%}.dv-thick{height:100%;border-radius:calc(var(--rt) * var(--u));background:#6a6e75;transform:translateY(calc(var(--u) * 16))}@media (prefers-reduced-motion:no-preference){.dv-tilt{transition:transform .5s cubic-bezier(.2,.7,.2,1)}}