/* SUN LIFE V1.7.9 — Mobile-first User Experience. This stylesheet is loaded by the user website only. */
html{width:100%;max-width:100%;overflow-x:clip;-webkit-text-size-adjust:100%;}
body.user-site{width:100%;max-width:100%;min-width:320px;overflow-x:clip;overscroll-behavior-x:none;}
.user-site img,.user-site video,.user-site canvas,.user-site svg{max-width:100%;}
.user-site .topbar{width:min(100%,520px);max-width:520px;height:auto;min-height:60px;margin:0 auto;padding:9px 14px;gap:8px;}
.user-site .brand{flex:0 1 auto;min-width:0;display:flex;align-items:center;}
.user-site .brand img{width:clamp(78px,23vw,104px);height:36px;max-width:100%;object-fit:contain;}
.user-site .top-actions{flex:1 1 auto;min-width:0;max-width:100%;gap:5px;justify-content:flex-end;}
.user-site .country-global-select{flex:0 1 88px;width:88px;min-width:72px;max-width:88px;padding:8px 19px 8px 7px;border-radius:11px;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.user-site .language-select{flex:0 1 72px;width:72px;min-width:62px;max-width:72px;padding:8px 17px 8px 6px;border-radius:11px;font-size:10px;}
.user-site .theme-toggle{flex:0 0 34px;width:34px;height:34px;font-size:16px;}
.user-site .top-actions .icon-btn,.user-site .top-actions .avatar{flex:0 0 35px;width:35px;height:35px;font-size:18px;}
.user-site .app-main{width:min(100%,520px);max-width:520px;margin:0 auto;padding:15px 15px calc(154px + env(safe-area-inset-bottom));min-height:calc(100svh - 60px);}
.user-site .flash-wrap{width:min(100%,520px);max-width:520px;padding:0 15px;}
.user-site .page-head{margin:8px 0 18px;}
.user-site .page-head h1{font-size:clamp(25px,7vw,31px);line-height:1.18;letter-spacing:-.45px;overflow-wrap:anywhere;}
.user-site .section{padding:21px 0;}
.user-site .section.compact{padding:17px 0;}
.user-site .section-head{align-items:center;gap:8px;margin-bottom:12px;}
.user-site .section-head h2,.user-site .section h2{font-size:clamp(17px,4.8vw,20px);line-height:1.3;}
.user-site .welcome-row{align-items:center;gap:10px;margin:8px 0 16px;}
.user-site .welcome-row h1{font-size:clamp(19px,5.5vw,23px);line-height:1.25;overflow-wrap:anywhere;}
.user-site .balance-card{padding:19px 17px 16px;border-radius:23px;}
.user-site .balance-top{gap:8px;font-size:12px;}
.user-site .balance-chip{font-size:8px;letter-spacing:.7px;padding:6px 8px;white-space:nowrap;}
.user-site .balance-value{font-size:clamp(34px,10vw,42px);letter-spacing:-1.4px;line-height:1.16;overflow-wrap:anywhere;}
.user-site .balance-caption{font-size:11px;line-height:1.45;}
.user-site .wallet-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:14px;}
.user-site .wallet-mini-grid>div{min-width:0;padding:9px 8px;border-radius:13px;}
.user-site .wallet-mini-grid small{font-size:9px;line-height:1.35;overflow-wrap:anywhere;}
.user-site .wallet-mini-grid b{font-size:clamp(11px,3.5vw,14px);line-height:1.25;overflow-wrap:anywhere;}
.user-site .balance-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:16px;}
.user-site .balance-actions .btn{width:100%;min-width:0;min-height:42px;padding:8px 5px;font-size:11px;line-height:1.2;white-space:normal;}
.user-site .today-earned-card{margin-top:10px;border-radius:16px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
.user-site .today-earned-card strong{font-size:18px;}
.user-site .home-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px 8px;padding:19px 0 16px;}
.user-site .home-quick-grid a{min-width:0;min-height:76px;display:flex;align-items:center;justify-content:flex-start;gap:6px;font-size:11px;line-height:1.25;text-align:center;}
.user-site .home-quick-grid span{width:47px;height:47px;flex:0 0 47px;font-size:21px;border-radius:16px;background:linear-gradient(145deg,#fff,#f4f5ef);box-shadow:0 5px 14px rgba(20,42,43,.07);}
.user-site .home-quick-grid b{max-width:100%;font-size:10px;font-weight:750;overflow-wrap:anywhere;}
.user-site .home-notice{border-radius:13px;padding:10px 12px;font-size:11px;line-height:1.5;}
.user-site .task-card{border-radius:18px;padding:12px;gap:10px;}
.user-site .task-card .btn{flex:0 0 auto;min-height:38px;padding:8px 12px;font-size:11px;}
.user-site .task-icon{width:42px;height:42px;flex:0 0 42px;font-size:20px;}
.user-site .activity-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0;}
.user-site .activity-summary>a{min-width:0;padding:11px 9px;border-radius:15px;overflow-wrap:anywhere;}
.user-site .activity-summary small{font-size:8px;letter-spacing:.45px;}
.user-site .activity-summary b{display:block;font-size:12px;line-height:1.3;margin:4px 0;}
.user-site .activity-summary span{display:block;font-size:9px;line-height:1.35;}
.user-site .banner-carousel{width:100%;max-width:100%;padding:0;margin:15px auto;}
.user-site .managed-banner{min-height:154px;max-height:190px;padding:17px;border-radius:19px;background-position:center;background-size:cover;}
.user-site .managed-banner h2{font-size:clamp(17px,5vw,21px);line-height:1.28;max-width:82%;}
.user-site .managed-banner p{font-size:11px;line-height:1.45;max-width:82%;}
.user-site .promo-banner{min-height:155px;padding:18px;border-radius:20px;background-position:center;background-size:cover;}
.user-site .promo-banner>div:first-child{max-width:84%;}
.user-site .promo-banner h2{font-size:19px;line-height:1.3;}
.user-site .promo-banner p{font-size:11px;line-height:1.45;}
.user-site .filter-info{border-radius:15px;padding:11px 13px;font-size:12px;line-height:1.4;margin:12px 0;}
.user-site .filter-scroll{width:100%;max-width:100%;min-width:0;display:flex;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 1px 9px;margin:11px 0 14px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;}
.user-site .filter-chip{flex:0 0 auto;min-height:39px;padding:9px 14px;font-size:11px;scroll-snap-align:start;}
.user-site .plan-count{float:none;display:inline-flex;align-items:center;gap:6px;margin:0 0 8px;padding:6px 9px;font-size:11px;}
.user-site .plan-count b{margin:0;}
.user-site .plan-grid{grid-template-columns:minmax(0,1fr);gap:14px;}
.user-site .plan-card{min-width:0;border-radius:21px;box-shadow:0 7px 20px rgba(19,47,50,.07);}
.user-site .plan-image{height:auto;aspect-ratio:16/8.3;max-height:184px;min-height:138px;}
.user-site .plan-image img{width:100%;height:100%;object-fit:cover;object-position:center;}
.user-site .plan-tag,.user-site .daily-tag{top:10px;padding:6px 10px;font-size:10px;max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.user-site .plan-body{padding:14px 15px 0;}
.user-site .plan-body h2{font-size:20px;line-height:1.25;}
.user-site .plan-body p{font-size:12px;line-height:1.5;max-width:100%;margin-bottom:12px;}
.user-site .plan-price-row strong{font-size:27px;}
.user-site .round-arrow{width:42px;height:42px;flex:0 0 42px;font-size:21px;}
.user-site .plan-foot{margin:12px -15px 0;padding:11px 15px;gap:8px;flex-wrap:wrap;font-size:10px;}
.user-site .benefit-pill{font-size:10px;padding:5px 8px;}
.user-site .detail-banner{height:auto;aspect-ratio:16/9;max-height:205px;border-radius:20px;}
.user-site .detail-section{padding:17px 2px;}
.user-site .detail-section h1{font-size:26px;line-height:1.25;}
.user-site .detail-price{grid-template-columns:repeat(3,minmax(0,1fr));padding:10px 4px;}
.user-site .detail-price>div{padding:4px 7px;min-width:0;overflow-wrap:anywhere;}
.user-site .wallet-bucket-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.user-site .wallet-bucket{min-width:0;border-radius:16px;padding:12px;}
.user-site .wallet-bucket strong{font-size:clamp(15px,4.4vw,19px);overflow-wrap:anywhere;}
.user-site .wallet-action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.user-site .wallet-action-row>*{min-width:0;width:100%;}
.user-site .form-card{padding:16px;border-radius:19px;}
.user-site .stack{gap:12px;}
.user-site .stack label{font-size:13px;min-width:0;}
.user-site .stack input,.user-site .stack select,.user-site .stack textarea{width:100%;min-width:0;min-height:48px;padding:12px 13px;font-size:16px;border-radius:12px;}
.user-site .stack textarea{min-height:96px;}
.user-site .btn{min-height:46px;}
.user-site .btn.full{width:100%;}
.user-site .auth-shell{width:100%;max-width:440px;padding:20px 17px calc(36px + env(safe-area-inset-bottom));}
.user-site .auth-logo{width:142px;height:65px;margin:17px 0;}
.user-site .auth-shell h1{font-size:27px;line-height:1.25;}
.user-site .auth-shell>p{font-size:13px;line-height:1.55;}
.user-site .auth-controls{gap:8px;}
.user-site .phone-country-row{display:grid;grid-template-columns:minmax(105px,34%) minmax(0,1fr);gap:8px;}
.user-site .phone-country-row>*{min-width:0;width:100%;}
.user-site .captcha-wrap{width:100%;overflow-x:auto;overscroll-behavior-x:contain;}
.user-site .ledger-row{gap:8px;padding:12px 0;}
.user-site .ledger-row>div:first-child{min-width:0;overflow-wrap:anywhere;}
.user-site .ledger-amount{font-size:13px;}
.user-site .sub-row,.user-site .news-row{min-width:0;padding:10px;border-radius:15px;gap:9px;}
.user-site .sub-row img{width:54px;height:48px;flex:0 0 54px;}
.user-site .sub-row b,.user-site .news-row b{font-size:12px;line-height:1.35;}
.user-site .sub-row small,.user-site .news-row small{font-size:10px;line-height:1.4;}
.user-site .article img{width:100%;height:auto;max-height:260px;object-fit:cover;border-radius:17px;}
.user-site .table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.user-site .bottom-nav{width:calc(100% - 18px);max-width:490px;bottom:calc(8px + env(safe-area-inset-bottom));padding:5px;border-radius:20px;grid-template-columns:repeat(5,minmax(0,1fr));}
.user-site .bottom-nav a{min-width:0;min-height:52px;padding:5px 1px;border-radius:15px;}
.user-site .bottom-nav a span{font-size:20px;line-height:1.2;}
.user-site .bottom-nav a small{font-size:9px;line-height:1.25;white-space:nowrap;}
.user-site .support-float-menu{right:12px;bottom:calc(90px + env(safe-area-inset-bottom));}
.user-site .support-float-menu .support-float{width:48px;height:48px;}
.user-site .support-float-panel{width:min(190px,calc(100vw - 34px));}
.user-site .sunlife-install-cta{position:fixed;z-index:26;left:50%;bottom:calc(94px + env(safe-area-inset-bottom));transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;gap:8px;max-width:calc(100% - 36px);min-height:38px;padding:8px 15px;border:1px solid rgba(255,255,255,.5);border-radius:999px;background:linear-gradient(135deg,#f5d76e,#d5a82e);color:#183a32;box-shadow:0 8px 22px rgba(13,35,31,.24);font-size:11px;font-weight:850;white-space:nowrap;}
.user-site .sunlife-install-cta span:first-child{font-size:15px;line-height:1;}
.user-site.has-install-cta .support-float-menu{bottom:calc(150px + env(safe-area-inset-bottom));}
.user-site .footer{padding-bottom:22px;}
.user-site .help-shortcuts{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.user-site .help-shortcuts a{min-width:0;padding:12px;border-radius:14px;}
.user-site .chat-box{max-height:55svh;min-height:260px;}
.user-site .chat-compose{position:sticky;bottom:calc(77px + env(safe-area-inset-bottom));z-index:12;background:var(--bg);padding:8px 0;}
.user-site .support-float-menu{z-index:24;}
.user-site .bottom-nav{z-index:30;}
.user-site .page-progress{z-index:2000;}
.user-site *{max-width:100%;}
.user-site .filter-scroll>*{max-width:none;}
.user-site .filter-scroll,.user-site .top-actions{scrollbar-width:none;}
.user-site .filter-scroll::-webkit-scrollbar{display:none;}
@media(max-width:400px){
 .user-site .topbar{padding-inline:11px;gap:6px;}
 .user-site .brand img{width:82px;height:32px;}
 .user-site .country-global-select{display:none;}
 .user-site .top-actions{gap:4px;}
 .user-site .language-select{flex-basis:66px;width:66px;min-width:58px;max-width:66px;padding-inline:5px 15px;font-size:9px;}
 .user-site .theme-toggle{flex-basis:31px;width:31px;height:31px;}
 .user-site .top-actions .icon-btn,.user-site .top-actions .avatar{flex-basis:33px;width:33px;height:33px;}
 .user-site .app-main{padding-inline:12px;}
 .user-site .balance-card{padding:16px 13px 14px;}
 .user-site .wallet-mini-grid{gap:5px;}
 .user-site .wallet-mini-grid>div{padding:8px 5px;}
 .user-site .wallet-mini-grid small{font-size:8px;}
 .user-site .balance-actions .btn{font-size:10px;}
 .user-site .home-quick-grid{gap:10px 5px;}
 .user-site .home-quick-grid span{width:43px;height:43px;flex-basis:43px;}
 .user-site .activity-summary{gap:6px;}
 .user-site .activity-summary>a{padding:9px 7px;}
 .user-site .activity-summary b{font-size:11px;}
 .user-site .plan-image{min-height:128px;}
 .user-site .plan-body{padding-inline:13px;}
 .user-site .plan-foot{margin-inline:-13px;padding-inline:13px;}
}
@media(max-width:350px){
 .user-site .topbar{padding-inline:8px;}
 .user-site .brand img{width:74px;}
 .user-site .language-select{min-width:54px;max-width:58px;}
 .user-site .home-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
 .user-site .home-quick-grid b{font-size:9px;}
 .user-site .detail-price{grid-template-columns:1fr;gap:8px;}
 .user-site .detail-price>div{border-right:0;border-bottom:1px solid var(--line);padding:8px;}
 .user-site .detail-price>div:last-child{border-bottom:0;}
 .user-site .activity-summary{grid-template-columns:1fr 1fr;}
 .user-site .activity-summary>a:last-child{grid-column:1/-1;}
}
@media(prefers-reduced-motion:reduce){.user-site *, .user-site *::before,.user-site *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important;}}

/* Mobile-only public landing and onboarding polish */
.user-site .landing-hero{padding:24px 17px 28px;border-radius:0 0 25px 25px;min-height:0;}
.user-site .landing-hero:after{width:250px;height:250px;right:-130px;top:-105px;}
.user-site .landing-logo{width:136px;height:56px;border-radius:14px;margin-bottom:19px;}
.user-site .landing-controls{display:flex;gap:6px;max-width:100%;}
.user-site .landing-controls select{max-width:50%;min-width:0;font-size:10px;padding:7px 8px;border-radius:10px;}
.user-site .landing-hero .eyebrow{font-size:9px;letter-spacing:1.2px;}
.user-site .landing-hero h1{font-size:clamp(27px,8vw,36px);line-height:1.18;letter-spacing:-.5px;margin:9px 0 10px;max-width:100%;}
.user-site .landing-hero p{font-size:13px;line-height:1.6;max-width:100%;margin:8px 0;}
.user-site .welcome-bonus-note{display:inline-flex;max-width:100%;padding:8px 11px;border-radius:12px;font-size:11px;line-height:1.4;overflow-wrap:anywhere;}
.user-site .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:17px 0 3px;}
.user-site .hero-actions .btn{width:100%;min-width:0;min-height:45px;padding:10px 8px;font-size:12px;}
.user-site .hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:19px;padding-top:15px;border-top:1px solid #ffffff28;}
.user-site .hero-stats>div{min-width:0;}
.user-site .hero-stats b{font-size:14px;line-height:1.3;}
.user-site .hero-stats span{font-size:10px;line-height:1.35;}
.user-site .public-main .section,.user-site .landing-hero+.section,.user-site .section{width:100%;max-width:520px;padding:21px 15px;margin:0 auto;}
.user-site .section.compact{padding-top:15px;padding-bottom:15px;}
.user-site .section-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;}
.user-site .feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
.user-site .feature-card{min-width:0;padding:14px 12px;border-radius:16px;}
.user-site .feature-card>span{font-size:25px;}
.user-site .feature-card h3{font-size:13px;line-height:1.35;overflow-wrap:anywhere;}
.user-site .feature-card p{font-size:10px;line-height:1.5;}
.user-site .steps{grid-template-columns:minmax(0,1fr);gap:9px;margin-top:13px;}
.user-site .steps>div{padding:14px;border-radius:15px;}
.user-site .steps strong{font-size:14px;line-height:1.4;}
.user-site .steps p{font-size:11px;line-height:1.55;margin-bottom:0;}
.user-site .mini-plans{grid-template-columns:minmax(0,1fr);gap:10px;}
.user-site .mini-plan{display:grid;grid-template-columns:112px minmax(0,1fr);min-width:0;border-radius:15px;}
.user-site .mini-plan img{width:112px;height:100%;min-height:102px;max-height:135px;object-fit:cover;}
.user-site .mini-plan>div{min-width:0;padding:11px;align-self:center;}
.user-site .mini-plan b{font-size:12px;line-height:1.35;overflow-wrap:anywhere;}
.user-site .mini-plan small{font-size:10px;line-height:1.45;}
.user-site .landing-cta{width:calc(100% - 24px);max-width:492px;margin:14px auto;padding:22px 15px!important;border-radius:19px;}
.user-site .landing-cta h2{font-size:19px;line-height:1.3;}
.user-site .landing-cta p{font-size:11px;line-height:1.55;}
.user-site .footer{width:100%;max-width:520px;padding:19px 15px calc(35px + env(safe-area-inset-bottom))!important;font-size:11px;}
.user-site .public-banner-carousel{width:100%;max-width:520px;padding:0 12px;margin:14px auto;}
.user-site .public-banner-carousel .managed-banner{min-height:150px;max-height:180px;padding:15px;border-radius:17px;}
.user-site .public-banner-carousel .managed-banner h2{font-size:17px;line-height:1.3;}
.user-site .public-banner-carousel .managed-banner p{font-size:10px;line-height:1.45;}
.user-site .auth-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;}
.user-site .auth-controls select{max-width:45%;min-width:0;font-size:11px;}
.user-site .setup-needed{width:calc(100% - 28px);max-width:440px;margin:10vh auto;padding:23px 17px;border-radius:20px;}
.user-site .setup-needed p{font-size:13px;line-height:1.55;}
@media(max-width:360px){
 .user-site .landing-hero{padding:20px 13px 24px;}
 .user-site .hero-actions{grid-template-columns:1fr;}
 .user-site .hero-stats{gap:5px;}
 .user-site .hero-stats b{font-size:12px;}
 .user-site .mini-plan{grid-template-columns:96px minmax(0,1fr);}
 .user-site .mini-plan img{width:96px;}
 .user-site .feature-card{padding:12px 10px;}
}
