.phone{--phone-w: 320px;position:relative;width:var(--phone-w);font-size:calc(var(--phone-w) / 43);aspect-ratio:43 / 88;border-radius:6.6em;padding:.38em;background:linear-gradient(140deg,#f4f4f6,#a3a3aa 20%,#e6e6ea 46%,#85858c 74%,#dcdce0);box-shadow:0 0 0 .05em #00000059,inset 0 0 .1em #fffc,0 3.2em 6em -1.6em #3c185a59,0 1.2em 2.4em -1em #00000047;isolation:isolate;flex:none}.phone:before,.phone:after{content:"";position:absolute;z-index:-1;width:.5em;border-radius:.3em;background:linear-gradient(90deg,#77777e,#d4d4d8 60%,#8d8d94)}.phone:before{left:-.28em;top:15em;height:15.6em;-webkit-mask:linear-gradient(#000 0 2.8em,transparent 2.8em 4.6em,#000 4.6em 9.6em,transparent 9.6em 10.6em,#000 10.6em);mask:linear-gradient(#000 0 2.8em,transparent 2.8em 4.6em,#000 4.6em 9.6em,transparent 9.6em 10.6em,#000 10.6em)}.phone:after{right:-.28em;top:22em;height:8.6em}.phone__bezel{height:100%;border-radius:6.22em;padding:1.45em;background:#050507;box-shadow:inset 0 0 0 .14em #1c1c21,inset 0 0 0 .3em #0b0b0e}.phone__screen{position:relative;height:100%;border-radius:4.78em;overflow:hidden;background:#fff;font-size:1em;isolation:isolate}.phone__screen:after{content:"";position:absolute;inset:0;z-index:10;pointer-events:none;border-radius:inherit;background:linear-gradient(125deg,#ffffff38,#fff0 32% 70%,#ffffff0f)}.phone__island{position:absolute;z-index:11;top:1.1em;left:50%;width:12.4em;height:3.6em;transform:translate(-50%);border-radius:2em;background:#000}.phone__iframe{display:block;width:100%;height:100%;border:0;padding-top:5.4em;background:#fff}.phone__status{position:relative;z-index:11;display:flex;align-items:center;justify-content:space-between;height:3.375em;padding:.375em 2.1em 0 2.4em;font:600 1.6em/1 Inter,system-ui,sans-serif;color:#0f0f0f}.phone__status-icons{display:flex;gap:.35em;align-items:center}.phone__status-icons i{display:block;background:currentColor;border-radius:.12em}.phone__status-icons .sig{width:1.05em;height:.7em;-webkit-mask:linear-gradient(90deg,#000 0 20%,transparent 20% 27%,#000 27% 47%,transparent 47% 54%,#000 54% 74%,transparent 74% 81%,#000 81%);mask:linear-gradient(90deg,#000 0 20%,transparent 20% 27%,#000 27% 47%,transparent 47% 54%,#000 54% 74%,transparent 74% 81%,#000 81%)}.phone__status-icons .bat{width:1.55em;height:.75em;border-radius:.22em}
