.iphone-stage{aspect-ratio:5/8;--iphone-metal:linear-gradient(135deg, #f5f6f8 0%, #b8bcc4 18%, #eef0f3 38%, #8f949c 62%, #e3e6ea 82%, #a9adb5 100%);width:100%;max-width:400px;margin-inline:auto;position:relative}.iphone-stage[data-finish=deep-blue]{--iphone-metal:linear-gradient(135deg, #5d6f94 0%, #27334f 25%, #56688d 45%, #1c2640 70%, #4a5b80 100%)}.iphone-stage[data-finish=cosmic-orange]{--iphone-metal:linear-gradient(135deg, #f09a62 0%, #b8511d 25%, #eb8a4f 45%, #9c4214 70%, #e27c3f 100%)}.iphone-gl{pointer-events:none;opacity:0;transition:opacity .7s cubic-bezier(.23,1,.32,1);position:absolute;inset:0}.iphone-stage[data-live=true] .iphone-gl{opacity:1}.iphone-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.iphone-css3d{inset:0;position:absolute!important}.iphone-poster{box-sizing:border-box;background:linear-gradient(#050506, #050506) padding-box, var(--iphone-metal) border-box;width:434px;height:906px;transform:translate(-50%, -50%) scale(var(--iphone-poster-scale,.6));border:5px solid #0000;border-radius:71px;padding:11px;position:absolute;top:50%;left:50%;box-shadow:0 50px 90px -40px #0000008c,inset 0 0 0 1px #ffffff0f}.iphone-screen{color:#000;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;pointer-events:none;background:#000;border-radius:55px;width:402px;height:874px;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,Inter,system-ui,sans-serif;position:relative;overflow:hidden}.iphone-island{z-index:40;background:#000;border-radius:19px;width:126px;height:37px;margin-left:-63px;transition:transform .42s cubic-bezier(.2,.9,.25,1);position:absolute;top:11px;left:50%}.iphone-screen:has([data-island=ping]) .iphone-island{transform:scale(1.42,1.08)}.iphone-glare{z-index:41;pointer-events:none;transform:translateX(var(--iphone-glare,0px));will-change:transform;background:linear-gradient(100deg,#0000 40%,#ffffff1a 47%,#ffffff08 53%,#0000 60%);position:absolute;inset:-10% -80%}.iphone-screen-dark{background:#000;position:absolute;inset:0}.iphone-showcase{flex-direction:column;align-items:center;display:flex}.iphone-showcase-controls{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px;display:flex}.iphone-swatch{background:#eff0ed;border-radius:50%;width:12px;height:12px;display:inline-block;box-shadow:inset 0 0 0 1px #ffffff40,0 0 0 1px #00000040}.iphone-swatch[data-finish=burgundy]{background:#54393e}.iphone-swatch[data-finish=glacier]{background:#c5d5ef}.iphone-swatch[data-finish=silver]{background:#eff0ed}.iphone-swatch[data-finish=black]{background:#2e2d2d}.iphone-swatch[data-finish=deep-blue]{background:#34425f}.iphone-swatch[data-finish=cosmic-orange]{background:#d26a31}
.iphone-lock{position:absolute;inset:0}.iphone-lock-wallpaper{background:radial-gradient(60% 42% at 22% 80%, color-mix(in oklab, var(--brand-blue) 85%, transparent) 0%, transparent 70%), radial-gradient(55% 40% at 82% 28%, color-mix(in oklab, var(--brand-indigo) 80%, transparent) 0%, transparent 70%), radial-gradient(38% 28% at 66% 96%, color-mix(in oklab, var(--brand-cyan) 70%, transparent) 0%, transparent 70%), linear-gradient(180deg, #060a18 0%, #0a1330 55%, #050814 100%);position:absolute;inset:-8%}.iphone-lock-date{text-align:center;color:#ffffffdb;font-size:21px;font-weight:600;position:absolute;top:84px;left:0;right:0}.iphone-lock-time{text-align:center;letter-spacing:-2px;color:#ffffffed;text-shadow:0 2px 24px #0000002e;font-family:ui-rounded,SF Pro Rounded,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-size:100px;font-weight:700;line-height:1;position:absolute;top:110px;left:0;right:0}.iphone-lock-button{color:#fff;background:#ffffff24;border-radius:50%;place-items:center;width:50px;height:50px;display:grid;position:absolute;bottom:42px;box-shadow:inset 0 0 0 .5px #ffffff4d}.iphone-lock-button--left{left:44px}.iphone-lock-button--right{right:44px}.iphone-status{z-index:20;color:#fff;justify-content:space-between;align-items:center;height:54px;padding:6px 30px 0 52px;font-size:17px;font-weight:600;transition:color .3s;display:flex;position:absolute;top:0;left:0;right:0}.iphone-status svg{fill:currentColor;display:block}.iphone-status-icons{align-items:center;gap:6px;display:flex}.iphone-status-time{transition:opacity .3s}.iphone-battery{border-radius:4px;width:25px;height:12px;position:relative;box-shadow:inset 0 0 0 1px}.iphone-battery>span{background:currentColor;border-radius:2px;width:17px;position:absolute;top:2px;bottom:2px;left:2px}.iphone-battery:after{content:"";opacity:.6;background:currentColor;border-radius:0 1px 1px 0;width:1.5px;height:4px;position:absolute;top:4px;right:-3px}.iphone-home{z-index:20;background:#ffffffeb;border-radius:3px;width:140px;height:5px;margin-left:-70px;transition:background-color .3s;position:absolute;bottom:8px;left:50%}
.iphone-mail{isolation:isolate;--iphone-mail-ease:cubic-bezier(.32, .72, 0, 1);position:absolute;inset:0}.iphone-mail-lock{transform-origin:50%;transition:transform .7s var(--iphone-mail-ease), opacity .56s var(--iphone-mail-ease);position:absolute;inset:0}.iphone-mail[data-stage=off] .iphone-mail-lock{transform:scale(1.06)}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-lock{opacity:.4;transform:scale(.94)}.iphone-mail-banner{z-index:10;transform-origin:50% 0;opacity:0;background:#f4f4f8eb;border-radius:26px;align-items:flex-start;gap:12px;padding:14px 16px 15px 14px;transition:transform .64s cubic-bezier(.2,.9,.25,1),opacity .26s;display:flex;position:absolute;top:58px;left:10px;right:10px;transform:translateY(-47px)scale(.33,.4);box-shadow:0 14px 34px #0000004d,inset 0 0 0 .5px #ffffffb3}.iphone-mail-banner>*{opacity:0;transition:opacity .24s}.iphone-mail:is([data-stage=banner],[data-stage=press]) .iphone-mail-banner{opacity:1;transform:none}.iphone-mail:is([data-stage=banner],[data-stage=press]) .iphone-mail-banner>*{opacity:1;transition-delay:.2s}.iphone-mail[data-stage=press] .iphone-mail-banner{transition-duration:.15s;transform:scale(.975)}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-banner{opacity:0;transition:transform .5s var(--iphone-mail-ease), opacity .2s ease;transform:translateY(24px)scale(1.04)}.iphone-mail-banner-icon{flex:none;position:relative}.iphone-mail-banner-icon .iphone-mail-avatar{width:40px;height:40px}.iphone-mail-badge{color:#fff;background:linear-gradient(#f0584b,#d93025);border-radius:5px;place-items:center;width:18px;height:18px;display:grid;position:absolute;bottom:-3px;right:-3px;box-shadow:0 0 0 1.5px #f4f4f8f2}.iphone-mail-banner-text{flex:1;min-width:0}.iphone-mail-banner-row{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.iphone-mail-banner-sender{color:#000;font-size:15px;font-weight:600}.iphone-mail-banner-now{color:#3c3c4399;flex:none;font-size:13px}.iphone-mail-banner-subject{color:#000;white-space:nowrap;text-overflow:ellipsis;font-size:15px;line-height:20px;overflow:hidden}.iphone-mail-banner-preview{color:#3c3c43c7;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:15px;line-height:20px;display:-webkit-box;overflow:hidden}.iphone-mail-app{z-index:5;opacity:0;clip-path:inset(58px 10px 720px round 26px);transition:clip-path .6s var(--iphone-mail-ease), opacity .18s ease;color:#1f1f1f;background:#fff;font-family:Google Sans Text,Google Sans,Roboto,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;position:absolute;inset:0}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-app{clip-path:inset(0 round 55px);opacity:1}.iphone-mail-zoom{transform-origin:50% 12%;transition:transform .6s var(--iphone-mail-ease);position:absolute;inset:0;transform:scale(.9)}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-zoom{transform:none}.iphone-mail-auto{will-change:transform;transition:transform 6s cubic-bezier(.45,0,.25,1);position:absolute;top:96px;left:0;right:0}.iphone-mail[data-stage=read] .iphone-mail-auto{transform:translateY(calc(-1 * min(210px, var(--iphone-mail-room,210px))))}.iphone-mail-scroll{will-change:transform;transform:translateY(calc(-1 * max(0px, min(var(--iphone-mail-room,0px) - 210px, (var(--iphone-progress,0) - .5) * 920px))));padding:6px 0 28px}.iphone-mail-subject-row{align-items:flex-end;gap:12px;padding:0 16px;display:flex}.iphone-mail-subject{letter-spacing:-.1px;color:#1f1f1f;overflow-wrap:anywhere;flex:1;min-width:0;font-size:23px;font-weight:400;line-height:30px}.iphone-mail-star{color:#444746;flex:none;margin-bottom:4px}.iphone-mail-chip{color:#444746;background:#e8eaed;border-radius:4px;margin:8px 16px 0;padding:1px 6px;font-size:12px;line-height:18px;display:inline-block}.iphone-mail-head{align-items:center;gap:10px;padding:22px 12px 16px 16px;display:flex}.iphone-mail-avatar{object-fit:cover;border-radius:50%;flex:none;width:36px;height:36px;display:block}.iphone-mail-head-text{flex:1;min-width:0}.iphone-mail-head-row{align-items:baseline;gap:8px;display:flex}.iphone-mail-sender{color:#1f1f1f;white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:600;overflow:hidden}.iphone-mail-time{color:#5f6368;flex:none;font-size:13px}.iphone-mail-to{color:#5f6368;align-items:center;gap:2px;margin-top:1px;font-size:13px;display:flex}.iphone-mail-unsub{color:#0b57d0;flex:none;font-size:14px;font-weight:500}.iphone-mail-more{color:#444746;flex:none;margin-left:6px}.iphone-mail-page{background:#f4f5f7;margin:0 14px;padding:16px 12px 20px}.iphone-mail-card{color:#5a5a72;background:#fff;border:1px solid #1a1a2e14;border-radius:8px;padding:24px 22px 8px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:15.5px;line-height:1.6}.iphone-mail-card p{margin:0 0 16px}.iphone-mail-topbar{z-index:3;color:#444746;background:#fff;justify-content:space-between;align-items:center;height:96px;padding:54px 18px 0 10px;display:flex;position:absolute;top:0;left:0;right:0}.iphone-mail-topbar-icons{align-items:center;gap:26px;display:flex}.iphone-mail-dot{display:inline-flex;position:relative}.iphone-mail-dot:after{content:"";background:#444746;border-radius:50%;width:7px;height:7px;position:absolute;top:-1px;right:-2px;box-shadow:0 0 0 1.5px #fff}.iphone-mail-dot--blue:after{background:#4c8df6}.iphone-mail-actions{z-index:3;gap:6px;display:flex;position:absolute;bottom:86px;left:8px;right:8px}.iphone-mail-action{color:#1f1f1f;background:#fff;border:1px solid #c4c7c5;border-radius:20px;flex:1;justify-content:center;align-items:center;gap:10px;height:40px;font-size:15px;font-weight:500;display:flex}.iphone-mail-action--round{flex:none;gap:0;width:40px}.iphone-mail-tabs{z-index:3;color:#444746;background:#f6f8fc;justify-content:space-between;align-items:flex-start;height:77px;padding:9px 36px 0;display:flex;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -.5px #00000014}.iphone-mail-tab{border-radius:16px;place-items:center;width:64px;height:32px;display:grid}.iphone-mail-tab--on{color:#041e49;background:#d3e3fd}.iphone-mail-status .iphone-status-time{opacity:0}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-status{color:#000}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-status .iphone-status-time{opacity:1}.iphone-mail:is([data-stage=open],[data-stage=read]) .iphone-mail-home{background:#000000e6}.iphone-mail-off{z-index:30;opacity:1;background:#000;transition:opacity .8s;position:absolute;inset:0}.iphone-mail:not([data-stage=off]) .iphone-mail-off{opacity:0}