/* Shared phone presentation used by the landing and App pages. */
.phone-illustration { position: relative; display: flex; justify-content: center; width: 100%; isolation: isolate; }
.phone-caption { margin: 0; color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.5; text-align: center; }
.phone-mockup { position: relative; width: 228.8px; flex: 0 0 auto; padding: 4px; border: 1px solid #777e7b; border-radius: 33.6px; background: #171b1a; box-shadow: 0 0 0 1px rgba(255,255,255,.7), 0 28px 45px -16px rgba(22,43,34,.28), 0 6px 14px rgba(22,43,34,.08); }
.phone-mockup:before, .phone-mockup:after { content: ""; position: absolute; width: 2px; border-radius: 2px; background: #747d77; }
.phone-mockup:before { left: -3px; top: 83.2px; height: 28.8px; box-shadow: 0 37.6px 0 #747d77; }
.phone-mockup:after { right: -3px; top: 115.2px; height: 46.4px; }
.phone-display { position: relative; overflow: hidden; border-radius: 28.8px; background: #fcfcfd; }
.phone-screen { display: block; width: 100%; height: auto; aspect-ratio: 402 / 874; }
.phone-hardware { position: absolute; inset: 0 0 auto; height: 6.75%; display: flex; align-items: center; justify-content: space-between; padding: 0 8%; color: #171b22; font-family: -apple-system, BlinkMacSystemFont, sans-serif; font-size: 8px; font-weight: 600; line-height: 1; pointer-events: none; }
.phone-status { width: 35.2px; height: 8.8px; }
.phone-island { position: absolute; top: 1.3%; left: 50%; transform: translateX(-50%); width: 31.8%; height: 4.2%; border-radius: 30px; background: #111312; }
.phone-island:after { content: ""; position: absolute; right: 9%; top: 35%; width: 8%; aspect-ratio: 1; border-radius: 50%; background: #1b2630; box-shadow: inset 0 0 2px #050707; }
.phone-homebar { position: absolute; z-index: 1; bottom: 1%; left: 50%; transform: translateX(-50%); height: .6%; width: 34%; background: #171b22; border-radius: 5px; }
@media (max-width:1100px) { .phone-mockup { width: 211.2px; } }
@media (max-width:680px) { .phone-mockup { width: min(222.4px, 100%); } }