:root{--phone-body:#1a1a1c;--phone-radius-w:11.7%;--phone-radius-h:5.27%;--phone-screen-radius-w:9.87%;--phone-screen-radius-h:4.32%;--phone-default-ar:.461826;--phone-body-scale:1.0458}.phone-stencil{--body-w:200px;flex-shrink:0;width:fit-content;max-width:100%;margin-inline:auto}.phone-stencil__body{--phone-bezel:calc(var(--body-w) * .0229);--phone-btn-w:max(calc(var(--body-w) * .00764), 1.5px);padding:var(--phone-bezel);border-radius:var(--phone-radius-w) / var(--phone-radius-h);background:var(--phone-body);box-shadow:inset 0 0 0 calc(var(--body-w) * .0025) #ffffff1a, 0 0 0 calc(var(--body-w) * .0013) #ffffff1a, 0 0 0 calc(var(--body-w) * .0025) #0000008c, 0 calc(var(--body-w) * .102) calc(var(--body-w) * .254) #0000005c, 0 calc(var(--body-w) * .025) calc(var(--body-w) * .076) #0000002e;position:relative}.phone-stencil--card{width:auto;max-width:100%;max-height:100%}@media (max-width:440px){.phone-stencil--card{width:100%}.phone-stencil--card .phone-stencil__body{max-width:100%}.phone-stencil--card .phone-stencil__screen{width:min(calc(100cqw / var(--phone-body-scale)), calc((100cqh / var(--phone-body-scale)) * var(--content-ar,var(--phone-default-ar))))}}.phone-stencil--card .phone-stencil__body{box-shadow:inset 0 0 0 calc(var(--body-w) * .0025) #ffffff1a, 0 0 0 calc(var(--body-w) * .0013) #ffffff1a, 0 0 0 calc(var(--body-w) * .0025) #0000008c, 0 calc(var(--body-w) * .061) calc(var(--body-w) * .153) #0000004d, 0 calc(var(--body-w) * .015) calc(var(--body-w) * .046) #00000029;flex-direction:column;justify-content:center;align-items:center;min-height:0;max-height:100%;display:flex}.phone-stencil--card .phone-stencil__btn{display:none}.phone-stencil__body:before{content:"";border-radius:var(--phone-radius-w) / var(--phone-radius-h);pointer-events:none;z-index:6;background:linear-gradient(148deg,#ffffff0d 0%,#ffffff04 28%,#0000 55%);position:absolute;inset:0}.phone-stencil__body:after{content:"";inset:var(--phone-bezel);border-radius:var(--phone-screen-radius-w) / var(--phone-screen-radius-h);box-shadow:inset 0 0 0 calc(var(--body-w) * .0013) #ffffff0f;pointer-events:none;z-index:4;position:absolute}.phone-stencil__screen{aspect-ratio:var(--content-ar,var(--phone-default-ar));width:min(calc(100cqw / var(--phone-body-scale)), calc((100cqh / var(--phone-body-scale)) * var(--content-ar,var(--phone-default-ar))));border-radius:var(--phone-screen-radius-w) / var(--phone-screen-radius-h);background:#000;justify-content:center;align-items:center;max-width:100%;margin-inline:auto;display:flex;position:relative;overflow:hidden}.phone-stencil__screen-fill{background:#0a0a0a;width:100%;height:100%}.phone-stencil__island{width:32%;height:4.3%;box-shadow:inset 0 calc(var(--body-w) * .0025) calc(var(--body-w) * .005) #ffffff14;z-index:5;pointer-events:none;background:#000;border-radius:999px;position:absolute;top:1.4%;left:50%;transform:translate(-50%)}.phone-stencil__btn{border-radius:calc(var(--body-w) * .005);z-index:7;position:absolute}.phone-stencil__btn--action{left:calc(-1 * var(--phone-btn-w));width:var(--phone-btn-w);height:5%;box-shadow:calc(var(--body-w) * -.0025) 0 calc(var(--body-w) * .005) #0009;background:linear-gradient(90deg,#2a2a2c,#1e1e20,#2a2a2c);top:11%}.phone-stencil__btn--vol-up{left:calc(-1 * var(--phone-btn-w));width:var(--phone-btn-w);height:8%;box-shadow:calc(var(--body-w) * -.0025) 0 calc(var(--body-w) * .005) #0009;background:linear-gradient(90deg,#2a2a2c,#1e1e20,#2a2a2c);top:21%}.phone-stencil__btn--vol-down{left:calc(-1 * var(--phone-btn-w));width:var(--phone-btn-w);height:8%;box-shadow:calc(var(--body-w) * -.0025) 0 calc(var(--body-w) * .005) #0009;background:linear-gradient(90deg,#2a2a2c,#1e1e20,#2a2a2c);top:32%}.phone-stencil__btn--power{right:calc(-1 * var(--phone-btn-w));width:var(--phone-btn-w);height:13%;box-shadow:calc(var(--body-w) * .0025) 0 calc(var(--body-w) * .005) #0009;background:linear-gradient(270deg,#2a2a2c,#1e1e20,#2a2a2c);top:25%}.phone-stencil__media{object-fit:contain;object-position:center;background:#000;width:100%;height:100%;display:block}