:root{--device-screen-width:393px;--device-screen-height:852px;--device-screen-radius:55px;--device-bezel:11px;--device-band:4px;--device-scale:1;--device-content:#000}.device-slot{width:calc((var(--device-screen-width) + 2 * (var(--device-bezel) + var(--device-band))) * var(--device-scale));height:calc((var(--device-screen-height) + 2 * (var(--device-bezel) + var(--device-band))) * var(--device-scale));flex:none}.device{box-sizing:content-box;width:var(--device-screen-width);height:var(--device-screen-height);padding:var(--device-bezel);border:var(--device-band) solid transparent;border-radius:calc(var(--device-screen-radius) + var(--device-bezel) + var(--device-band));transform:scale(var(--device-scale));transform-origin:0 0;background:linear-gradient(#050505,#050505) padding-box padding-box,linear-gradient(135deg,#8a8d92 0%,#3d3f43 18%,#6e7176 45%,#2f3135 72%,#8a8d92 100%) border-box;position:relative;box-shadow:inset 0 0 0 1px #ffffff0f,0 0 0 1px #1a1b1d,0 40px 90px #0000008c,0 12px 30px #00000059}.device iframe{border-radius:var(--device-screen-radius);background:#fff;border:none;width:100%;height:100%;display:block}.device-button{pointer-events:none;background:linear-gradient(90deg,#2f3135,#6e7176 50%,#2f3135);border-radius:2px;width:4px;position:absolute}.device-button.left{left:calc(-1 * var(--device-band) - 3px)}.device-button.right{right:calc(-1 * var(--device-band) - 3px)}.device-button.action{height:32px;top:116px}.device-button.volume-up{height:62px;top:178px}.device-button.volume-down{height:62px;top:254px}.device-button.power{height:100px;top:208px}.device-overlay{inset:var(--device-bezel);border-radius:var(--device-screen-radius);pointer-events:none;color:var(--device-content);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,sans-serif;position:absolute;overflow:hidden}.device[data-status-bar=light]{--device-content:#fff}.device-island{background:#000;border-radius:19px;width:125px;height:37px;position:absolute;top:11px;left:50%;transform:translate(-50%)}.device-island:after{content:"";background:radial-gradient(circle at 35% 35%,#2a3550,#0b0d14 60%);border-radius:50%;width:11px;height:11px;position:absolute;top:50%;right:13px;transform:translateY(-50%)}.device-status-bar{justify-content:space-between;align-items:center;height:54px;padding:4px 0 0;display:flex;position:absolute;top:0;left:0;right:0}.device[data-status-bar-hidden] .device-status-bar{visibility:hidden}.device-clock,.device-indicators{justify-content:center;align-items:center;width:134px;display:flex}.device-clock{letter-spacing:-.02em;font-variant-numeric:tabular-nums;padding-left:6px;font-size:17px;font-weight:600}.device-indicators{gap:6px;padding-right:6px}.device-indicators svg{fill:currentColor;display:block}.device-home-indicator{background:currentColor;border-radius:3px;width:139px;height:5px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.device-slot.bare{width:100%;height:100%}.device-slot.bare .device{width:100%;height:100%;box-shadow:none;background:0 0;border:none;border-radius:0;padding:0;transform:none}.device-slot.bare iframe{border-radius:0}.device-slot.bare .device-button,.device-slot.bare .device-overlay{display:none}