/* Homepage illustration: a physical handset around a borrower dashboard. */
.ref-mobile-showcase{min-width:0;padding:12px 16px;text-align:center}
.ref-phone.ref-phone-device{position:relative;width:min(350px,100%);padding:5px;border:7px solid #1b2420;border-radius:48px;background:linear-gradient(135deg,#6b7770,#111a15 28%,#748178 70%,#202c24);box-shadow:0 0 0 1px #a2b3a566,inset 0 0 0 1px #ffffff42,0 30px 70px #00211780;transform:rotate(2deg);color:#173c2b;text-align:left}
.phone-side-button{position:absolute;width:3px;border-radius:2px;background:#738278;box-shadow:inset -1px 0 #0a130e}
.phone-side-button-volume{left:-10px;top:125px;height:68px}.phone-side-button-power{right:-10px;top:163px;height:52px}
.phone-screen{background:#f7f8f4;border:1px solid #0b1710;border-radius:36px;overflow:hidden;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
.phone-status{position:relative;display:flex;align-items:center;justify-content:space-between;padding:15px 20px 11px;min-height:48px;color:#182a20;font-size:13px;font-weight:750;line-height:1}
.phone-island{position:absolute;top:11px;left:50%;transform:translateX(-50%);width:92px;height:26px;background:#101512;border-radius:20px;box-shadow:inset 0 1px 2px #000}
.phone-island i{position:absolute;right:10px;top:8px;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#16424e,#07121b 65%);box-shadow:0 0 0 2px #1a221e}
.phone-status-icons{display:flex;align-items:center;gap:5px}.phone-status-icons svg{width:15px;height:14px}.phone-battery{position:relative;width:23px;height:11px;border:1px solid #182a2066;border-radius:3px;margin-right:2px}.phone-battery:before{content:"";position:absolute;inset:1px;background:#182a20;border-radius:1px}.phone-battery:after{content:"";position:absolute;right:-3px;top:3px;width:2px;height:4px;background:#182a2080;border-radius:0 1px 1px 0}
.phone-app-content{padding:3px 18px 7px}.phone-app-header{display:flex;align-items:center;gap:10px;margin:2px 0 13px}.phone-avatar{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:#e0e9d9;color:#35553b;font-size:12px;font-weight:750;flex-shrink:0}.phone-app-header>div{display:grid;gap:2px;min-width:0}.phone-app-header small{font-size:11px;line-height:1.35;color:#718073}.phone-app-header strong{font-size:14px;line-height:1.35;color:#1c3225}.phone-app-bell{position:relative;margin-left:auto;background:white;border:1px solid #e3e9df;border-radius:50%;width:33px;height:33px;display:grid;place-items:center;flex-shrink:0}.phone-app-bell svg{width:17px;height:17px}.phone-app-bell i{position:absolute;top:6px;right:7px;width:5px;height:5px;border-radius:50%;background:#c09c3a;border:1px solid white}
.phone-savings-card{background:linear-gradient(120deg,#153f2b,#266046);border-radius:18px;padding:14px 16px;color:white;box-shadow:0 5px 12px #11352014}.phone-card-label{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#d1e2d4;line-height:1.35}.phone-card-label svg{width:16px;height:16px;color:#a8c8ae}.phone-savings-card>strong{display:block;font-size:30px;font-weight:700;line-height:1.15;letter-spacing:-1px;margin:7px 0 3px;font-variant-numeric:tabular-nums}.phone-savings-card>strong>span{font-size:20px;letter-spacing:-.4px;color:#bcd2bf}.phone-savings-card>small{font-size:10px;color:#c4d8c8;line-height:1.35}.phone-card-breakdown{display:grid;grid-template-columns:1fr 1fr;gap:10px;border-top:1px solid #ffffff24;margin-top:10px;padding-top:8px}.phone-card-breakdown>span{font-size:9px;color:#c8dcce;line-height:1.4}.phone-card-breakdown b{display:block;font-size:12px;font-weight:650;margin-top:2px;color:white}
.phone-quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 14px}.phone-quick-actions>span{display:grid;justify-items:center;gap:5px;font-size:10px;font-weight:600;line-height:1.35;color:#38553e}.phone-quick-actions i{display:grid;place-items:center;width:35px;height:35px;border-radius:12px;background:#e7eee1;font-style:normal}.phone-quick-actions svg{width:18px;height:18px}
.phone-section-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:12px 0 7px}.ref-phone-device .phone-section-heading h3{font-family:system-ui,sans-serif;font-size:13px;font-weight:750;line-height:1.35;margin:0;letter-spacing:0}.phone-section-heading>span{color:#51765a;font-size:10px;font-weight:650;line-height:1.35}
.phone-program-card{display:flex;gap:9px;align-items:center;background:white;border:1px solid #e3e9dc;border-radius:13px;padding:9px 10px}.phone-program-icon{display:grid;place-items:center;width:30px;height:32px;background:#eef3e5;border-radius:9px;flex-shrink:0;color:#466c39}.phone-program-icon svg{width:17px;height:17px}.phone-program-card>div,.phone-orientation>div{display:grid;gap:2px;min-width:0}.phone-program-card strong,.phone-orientation strong{font-size:11px;line-height:1.35;font-weight:650}.phone-program-card small,.phone-orientation small{font-size:9px;line-height:1.4;color:#7c887c}.phone-program-status{margin-left:auto;border-radius:5px;background:#eaf3e4;padding:3px 5px;font-size:8px;font-weight:700;color:#44713c;flex-shrink:0}.phone-orientation{display:flex;gap:10px;align-items:center;background:#f0ecdf;border-radius:12px;padding:8px 10px;margin-top:7px}.phone-orientation>span:first-child{display:grid;place-items:center;color:#8c7440}.phone-orientation svg{width:18px;height:18px}.phone-chevron{margin-left:auto;color:#8c7440;font-size:19px}
.phone-activity{display:flex;gap:9px;align-items:center;padding:7px 0;border-bottom:1px solid #e5e9df}.phone-activity:last-child{border-bottom:0}.phone-activity-icon{display:grid;place-items:center;flex-shrink:0;width:29px;height:29px;border-radius:9px;background:#e8efe3;color:#4f7553;font-size:15px}.phone-activity-out{background:#edeae2;color:#8a8069}.phone-activity>div{display:grid;gap:2px;min-width:0}.phone-activity strong{font-size:10px;line-height:1.35;font-weight:650}.phone-activity small{font-size:9px;line-height:1.35;color:#7c887c}.phone-activity>b{font-size:11px;line-height:1.35;margin-left:auto;white-space:nowrap;color:#417346}.phone-activity .phone-amount-out{color:#536456}
.phone-bottom-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:8px 12px 5px;background:white;border-top:1px solid #e5e9df}.phone-bottom-nav>span{display:grid;justify-items:center;gap:2px;color:#8b958b;font-size:9px;line-height:1.3}.phone-bottom-nav svg{width:18px;height:18px}.phone-bottom-nav .is-selected{color:#245536;font-weight:750}.phone-home-indicator{background:white;padding:3px 0 7px}.phone-home-indicator:after{content:"";display:block;width:98px;height:4px;border-radius:6px;background:#24342a;margin:auto}
@media(max-width:700px){.ref-mobile-showcase{padding:8px 2px}.ref-phone.ref-phone-device{transform:none}.phone-app-content{padding-left:14px;padding-right:14px}.phone-status{padding-left:18px;padding-right:18px}}
@media(hover:hover) and (prefers-reduced-motion:no-preference) and (min-width:701px){.ref-phone.ref-phone-device:hover{transform:rotate(0) translateY(-5px);box-shadow:0 0 0 1px #a2b3a566,inset 0 0 0 1px #ffffff42,0 35px 75px #00211790}}
@media(prefers-reduced-motion:reduce){.ref-phone.ref-phone-device,.ref-phone.ref-phone-device:hover{transform:none;transition:none}}