:root{font-family:Inter,"Noto Sans Sinhala","Noto Sans Tamil",system-ui,sans-serif;color:#1f2937;background:#f3f6fc;--royal:#4169e1;--royal-dark:#2f55c7}
*{box-sizing:border-box}
body{margin:0}
/* Visibility belongs to the existing language/session flow, including newFields. */
[hidden]{display:none!important}
.shell{width:100%;max-width:480px;margin:auto;min-height:100vh;min-height:100svh;padding:16px 14px 20px;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom))}
.brand{text-align:center;margin-bottom:14px}
.brand h1{font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(21px,6.2vw,28px);font-style:normal;font-weight:800;letter-spacing:.015em;color:#000;margin:0 0 10px;line-height:1.2}
.branch-info{width:max-content;max-width:100%;margin:0 auto;text-align:left;font-size:14px;line-height:1.6;font-weight:500;color:#526078}
.branch-info>div{display:grid;grid-template-columns:92px 20px 1fr;align-items:center}
.branch-info b{font-weight:500;text-align:center}
.hotline-row{min-height:22px}
.brand-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:12px auto 0}
.brand-logo{height:48px;background:#fff;border:1px solid #e1e6ef;border-radius:9px;padding:5px;display:flex;align-items:center;justify-content:center}
.brand-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.card{background:#fff;border-radius:18px;padding:18px 16px;border:1px solid #e1e7f2;box-shadow:0 6px 24px #243f7510}
.card h2{margin:0 0 8px;font-size:21px;line-height:1.4;color:var(--royal-dark);overflow-wrap:anywhere}
.card p{font-size:14px;line-height:1.55;margin:0 0 12px;color:#526078}
.language-card{text-align:center}
.language-card h2{font-size:20px;margin-bottom:6px}
.language-card p{font-size:13px;line-height:1.55;margin:0 0 12px}
button,input{font:inherit}
button{width:100%;min-height:48px;border:0;border-radius:12px;padding:12px 14px;margin-top:14px;background:var(--royal);color:#fff;font-size:16px;font-weight:700;line-height:1.5;cursor:pointer;touch-action:manipulation}
button:active{background:var(--royal-dark);color:#fff}
button:focus-visible{outline:3px solid var(--royal-dark);outline-offset:3px}
.lang-btn{display:flex;align-items:center;justify-content:space-between;background:#f7f9ff;color:var(--royal-dark);border:1px solid #d9e2f7;text-align:left;padding:10px 16px;margin-top:8px}
.lang-btn::after{content:"\203a";font:24px/1 Arial,sans-serif;color:var(--royal)}
.lang-btn:first-of-type{margin-top:0}
label{display:block;font-size:14px;line-height:1.5;font-weight:650;margin:12px 0 6px;color:#334155}
input{width:100%;min-height:48px;padding:12px;border:1px solid #cfd8ee;border-radius:12px;font-size:16px;line-height:1.5;outline:none;background:#fff;color:#1f2937}
input:focus{border-color:var(--royal);box-shadow:0 0 0 3px #4169e119}
.secondary{background:#e8eeff;color:var(--royal-dark)}
.language-change{background:transparent;color:var(--royal);border:1px solid #bfcdf8}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.grid div{padding:14px 10px;background:#f7f9ff;border:1px solid #dce5ff;border-radius:12px;font-weight:750;color:var(--royal-dark);overflow-wrap:anywhere}
.grid small{font-weight:500;color:#64748b}
/* Home typography stays neutral; blue is reserved for actions and accents. */
#home,#home h2,#home p,#home .grid div,#home .home-footer span{color:#000}
.card .eyebrow{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--royal);margin-bottom:6px}
#msg{color:#b91c1c;font-size:14px;margin:10px 0 0}
#msg:empty{margin:0}
.home-actions{display:grid;gap:8px;margin-top:14px}
.home-actions button{margin:0}
.home-footer{margin-top:16px;padding-top:12px;border-top:1px solid #e5e7eb;text-align:center}
.home-footer span{display:block;font-size:12px;font-weight:800;letter-spacing:.06em;color:#111827}
.home-footer small{display:block;margin-top:4px;font-size:12px;color:#64748b}
@media(min-width:600px){.shell{padding-top:32px;padding-bottom:32px}.brand{margin-bottom:18px}.card{padding:22px}.brand-logo{height:54px}}
@media(max-height:600px) and (max-width:599px){.shell{padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}.brand{margin-bottom:10px}.brand h1{margin-bottom:6px}.brand-logos{margin-top:8px}.card{padding:14px}}

/* Phase 3B-2: compact customer offers list; details behavior comes later. */
.home-tile{margin:0;min-height:0;padding:14px 10px;background:#f7f9ff;border:1px solid #dce5ff;border-radius:12px;text-align:left;font-weight:750;color:#000;line-height:1.5}
.home-tile small{font-weight:500;color:#64748b}.home-tile:active{background:#eef3ff;color:#000}
.offers-head{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start}.offers-head .eyebrow{margin:0 0 2px}.offers-head h2{margin:0;color:#000}.back-btn{width:auto;min-height:40px;margin:0;padding:8px 12px;font-size:14px}
#offersStatus{margin:12px 0 0}.offers-list{display:grid;gap:12px;margin-top:12px}.offer-card{overflow:hidden;border:1px solid #e1e7f2;border-radius:14px;background:#fff}.offer-card>img{display:block;width:100%;max-height:210px;object-fit:cover;background:#f3f6fc}.offer-copy{padding:13px}.offer-copy h3{margin:0 0 6px;font-size:17px;line-height:1.35;color:#000}.offer-copy p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 8px;color:#526078}.offer-copy small{display:block;color:#64748b}.offer-view{min-height:42px;margin-top:10px;padding:9px 12px;font-size:14px}

/* Phase 3B-3: offer details. */
.offer-detail{margin-top:12px}.offer-detail>img{display:block;width:100%;max-height:360px;object-fit:contain;border-radius:14px;background:#f3f6fc}.offer-detail h3{margin:14px 0 8px;font-size:20px;line-height:1.4;color:#000;overflow-wrap:anywhere}.offer-detail p{margin:0 0 10px;white-space:pre-wrap;color:#334155}.offer-detail small{display:block;color:#64748b}

/* Phase 3B-4: customer interest state. */
.interest-btn{margin-top:14px}.interest-btn.is-interested,.interest-btn.is-interested:disabled{background:#e8eeff;color:var(--royal-dark);border:1px solid #bfcdf8;opacity:1;cursor:default}

/* Phase 4A: first-entry push permission prompt. */
.push-prompt{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;background:#0f172a99;backdrop-filter:blur(3px)}
.push-prompt-card{width:min(100%,390px);background:#fff;border-radius:20px;padding:24px 20px;text-align:center;box-shadow:0 18px 50px #0f172a33}
.push-prompt-card .push-bell{font-size:34px;line-height:1;margin-bottom:10px}.push-prompt-card h2{margin:0 0 8px;color:#000;font-size:21px}.push-prompt-card p{margin:0;color:#526078;font-size:14px;line-height:1.55}.push-prompt-card button{margin-top:18px}

/* Customer PWA polish */
.brand{margin-bottom:12px}.brand-logos{gap:5px;margin-top:9px}.brand-logo{height:43px}.card{box-shadow:0 10px 30px rgba(36,63,117,.07)}#home{padding-top:20px}.home-grid{grid-template-columns:1fr}.home-primary{position:relative;padding:17px 44px 17px 15px;background:linear-gradient(135deg,#4169e1,#3155c8);color:#fff!important;border:0;box-shadow:0 7px 18px rgba(65,105,225,.2)}.home-primary small{color:#e9eeff!important}.tile-arrow{position:absolute;right:17px;top:50%;transform:translateY(-50%);font:30px/1 Arial}.coming-tile{opacity:.72}.notification-card{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:12px;padding:13px;border:1px solid #dce5ff;border-radius:13px;background:#f8faff}.notification-card strong,.notification-card small{display:block}.notification-card strong{font-size:13px;color:#111827}.notification-card small{margin-top:3px;font-size:11px;line-height:1.35;color:#64748b}.notification-card button{width:auto;min-height:38px;margin:0;padding:7px 11px;font-size:12px}.notification-card.is-on{background:#f0fdf4;border-color:#bbf7d0}.notification-card.is-on button{background:#dcfce7;color:#166534}.state-box{font-size:13px;line-height:1.5;color:#526078;margin:12px 0 0}.state-box:empty{display:none}.state-box.error,.state-box.empty{padding:15px;text-align:center;border:1px solid #e1e7f2;border-radius:12px;background:#f8fafc}.state-box button{width:auto;min-height:38px;margin:10px 0 0;padding:7px 13px;font-size:13px}.offer-card{box-shadow:0 5px 16px rgba(36,63,117,.055)}.offer-copy small{display:inline-block;padding:4px 8px;border-radius:999px;background:#f1f5f9;color:#475569;font-weight:650}.offer-view{font-weight:750}.offer-detail small{display:inline-block;padding:5px 9px;border-radius:999px;background:#f1f5f9;color:#475569}.login-trust{margin-top:12px!important;padding-top:11px;border-top:1px solid #eef2f7;font-size:11px!important;color:#7b8798!important;text-align:center}@media(max-width:430px){.brand-logo{height:40px}.branch-info{font-size:13px}.card{border-radius:16px}.notification-card{padding:12px}}

/* Customer PWA install card */
.install-card{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:12px;padding:14px;border:1px solid #bfcdf8;border-radius:13px;background:#f7f9ff}.install-card strong,.install-card small{display:block}.install-card strong{font-size:14px;color:#111827}.install-card small{margin-top:4px;font-size:11px;line-height:1.4;color:#64748b}.install-card button{width:auto;min-height:40px;margin:0;padding:8px 12px;font-size:12px}.install-card .install-hint{margin-top:7px;color:#334155;font-weight:650}@media(max-width:380px){.install-card{grid-template-columns:1fr}.install-card button{width:100%}}

/* App-style customer redesign */
body{background:linear-gradient(180deg,#eef5ff 0,#f7f9fc 45%,#eef2f7 100%);min-height:100vh}
.shell{max-width:500px;padding:10px 10px 24px}
.brand{background:#fff;border-radius:0 0 22px 22px;padding:14px 12px 12px;margin:0 0 12px;box-shadow:0 8px 24px rgba(15,52,120,.08)}
.brand h1{color:#0b3b91;font-size:24px;margin-bottom:7px}.branch-info{font-size:12px;line-height:1.45;color:#52627a}.branch-info>div{grid-template-columns:82px 16px 1fr}.hotline-row{display:none!important}
.brand-logos{margin-top:10px}.brand-logo{height:38px;border-radius:10px;background:#fbfdff}
.card{border:0;border-radius:22px;padding:18px 16px;box-shadow:0 12px 34px rgba(25,63,125,.10)}
#login,#language{padding:22px 18px}#login h2,#language h2{font-size:24px;color:#0a337c}
input{min-height:54px;border-radius:14px;background:#f8fbff;border:1.5px solid #cddbf2;padding:14px}#continueBtn{min-height:54px;border-radius:14px;background:linear-gradient(135deg,#0969ef,#174fc8);box-shadow:0 8px 18px rgba(9,105,239,.22)}
.app-home{padding:0 0 82px;overflow:hidden;background:#f6f9fe;position:relative}
.app-topbar{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;background:linear-gradient(135deg,#075fcf,#113e9f);color:#fff}.app-topbar small,.app-topbar strong{display:block}.app-topbar small{font-size:11px;letter-spacing:.07em;opacity:.9}.app-topbar strong{font-size:15px;margin-top:2px}.top-bell{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:#ffffff18;font-size:18px}
.customer-hero{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;margin:14px 14px 0;padding:14px;background:linear-gradient(135deg,#fff,#eef5ff);border:1px solid #dbe8fb;border-radius:17px;box-shadow:0 5px 16px rgba(32,76,145,.07)}.avatar{width:52px;height:52px;display:grid;place-items:center;border-radius:15px;background:#e7f0ff;font-size:28px}.customer-hero .eyebrow{margin:0 0 2px!important}.customer-hero h2{font-size:19px!important;margin:0 0 3px!important;color:#101828!important}.customer-hero p{margin:0!important;font-size:12px!important;color:#667085!important}
.home-grid{margin:12px 14px 0}.home-primary{border-radius:17px;min-height:86px;padding:17px 48px 17px 17px;background:linear-gradient(135deg,#ff3d24,#ff7a00);box-shadow:0 8px 18px rgba(255,91,32,.20)}.home-primary span{font-size:19px}.coming-tile{border-radius:17px!important;background:linear-gradient(135deg,#eef5ff,#fff)!important;border:1px solid #d7e5fa!important;padding:16px!important}
.install-card,.notification-card{margin:12px 14px 0;border-radius:16px;padding:14px;background:#fff;box-shadow:0 5px 16px rgba(32,76,145,.06)}.install-card{border:1px solid #bcd3fb}.install-card button{background:linear-gradient(135deg,#0969ef,#174fc8);border-radius:12px}.notification-card{border:1px solid #dce8f8}.home-actions{margin:12px 14px 0}.home-actions button{border-radius:13px}.home-footer{margin:16px 14px 0}
.bottom-nav{position:absolute;left:0;right:0;bottom:0;height:68px;display:grid;grid-template-columns:repeat(4,1fr);align-items:center;background:#fff;border-top:1px solid #e2e8f0;box-shadow:0 -8px 22px rgba(20,53,104,.06);padding-bottom:max(2px,env(safe-area-inset-bottom))}.bottom-nav button{margin:0;padding:7px 2px;min-height:58px;border-radius:0;background:transparent;color:#718096;font-size:19px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom-nav button small{font-size:10px;font-weight:700}.bottom-nav .nav-active{color:#075fcf}.bottom-nav button:disabled{opacity:.45}
#offers,#offerDetail{background:#f7faff}.offers-head{margin:-18px -16px 14px;padding:15px 16px;background:linear-gradient(135deg,#075fcf,#113e9f);align-items:center}.offers-head h2,.offers-head .eyebrow{color:#fff!important}.back-btn{background:#ffffff1c;border:1px solid #ffffff2b}.offer-card{border:0;border-radius:18px;box-shadow:0 7px 20px rgba(25,63,125,.09)}.offer-card>img{max-height:230px}.offer-copy{padding:15px}.offer-view{border-radius:12px;background:linear-gradient(135deg,#0969ef,#174fc8)}.offer-detail>img{border-radius:18px}.interest-btn{border-radius:13px}
@media(max-width:430px){.shell{padding:0 0 16px}.brand{border-radius:0 0 18px 18px}.brand-logo{height:34px}.card{border-radius:18px}.app-home{border-radius:18px}.customer-hero{margin-top:12px}}


/* Customer mobile visual refresh — presentation only; existing API/flow untouched. */
:root{--royal:#0752bf;--royal-dark:#073477}
body{background:#e8f0fa}
.shell{max-width:480px;min-height:100svh;padding:0 0 22px;background:#f7faff;box-shadow:0 0 45px #15375a12}
.shell:has(#login:not([hidden])){background:linear-gradient(165deg,#002956 0%,#0758b8 47%,#fff 79%);min-height:100svh;display:flex;flex-direction:column}
.shell:has(#login:not([hidden])) .brand{background:transparent;box-shadow:none;color:white;border-radius:0;padding:35px 24px 0;margin:0}
.shell:has(#login:not([hidden])) .brand h1{color:white;text-align:left;font-size:clamp(36px,10vw,53px);line-height:.96;letter-spacing:-.035em;max-width:290px;text-shadow:0 3px 18px #002e5c4d}
.shell:has(#login:not([hidden])) .brand h1:after{content:"";display:block;width:170px;height:6px;background:linear-gradient(90deg,#f32b2b,#ff8b28);margin:12px 0}
.shell:has(#login:not([hidden])) .brand:after{content:"Three-Wheel & Motorcycle Spare Parts";display:block;text-align:left;font-size:15px;font-weight:650;line-height:1.5;color:#e8f3ff;margin-top:7px}
.shell:has(#login:not([hidden])) .brand .branch-info{display:none}
.shell:has(#login:not([hidden])) .brand-logos{margin:24px 0 0;gap:8px}
.shell:has(#login:not([hidden])) .brand-logo{height:43px;border:1px solid #ffffff55;background:#ffffffef;border-radius:9px}
.shell:has(#login:not([hidden])) #login{order:1;flex:1;display:flex;flex-direction:column;justify-content:flex-end;background:transparent;border:0;box-shadow:none;border-radius:0;padding:28px 22px 35px}
#login .login-intro{display:grid;gap:5px;color:#fff;margin:0 0 20px;font-size:13px}
#login .login-intro .login-intro-si{font-size:18px;font-weight:800}
#login .login-intro span:last-child{font-size:12px;color:#d8e9ff}
.shell:has(#login:not([hidden])) #login h2,.shell:has(#login:not([hidden])) #login #loginHint{display:none}
#login form{display:flex;flex-direction:column}
#login #phoneLabel{color:#fff;font-size:13px}
#login #phone{height:59px;background:#fff;border:1px solid #fff;border-radius:15px;padding:14px 18px;font-size:19px;box-shadow:0 7px 20px #002e5c25}
#login #continueBtn{margin-top:16px;min-height:56px;background:#084db5;color:#fff;border-radius:16px;box-shadow:0 10px 25px #003c8c40}
#login #msg{color:#ffe3d7;font-weight:700}
#login #newFields label{color:#fff}
#login .login-languages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:25px}
#login .login-languages .lang-btn{display:flex;justify-content:center;align-items:center;text-align:center;margin:0;padding:9px 3px;min-height:52px;border-radius:14px;background:#f0f4fa;color:#073477;border:1px solid #d9e2f0;font-size:13px;font-weight:800}
#login .login-languages .lang-btn::after{display:none}
#login .login-languages .lang-btn[data-lang="si"]{background:#064eb9;color:#fff;border-color:#064eb9}
#login .login-trust{color:#e5f0ff!important}
.shell:has(#home:not([hidden])) .brand,.shell:has(#offers:not([hidden])) .brand,.shell:has(#offerDetail:not([hidden])) .brand{display:none}
#home{border-radius:0;box-shadow:none;background:#f7faff;padding-bottom:95px}
#home .app-topbar{padding:22px 18px 17px;background:linear-gradient(135deg,#002958,#0754a7);min-height:93px}
#home .app-topbar small{font-size:14px;font-weight:900;opacity:1}
#home .app-topbar strong{font-size:12px;opacity:.9;font-weight:500}
#home .top-bell{font-size:21px}
#home .customer-hero{background:#fff;border:0;border-radius:21px;margin:15px 14px 0;padding:19px;box-shadow:0 5px 19px #0c3a7414;grid-template-columns:1fr 50px}
#home .customer-hero>div:nth-child(2){grid-column:1;grid-row:1}
#home .customer-hero .avatar{grid-column:2;grid-row:1;border-radius:50%;background:#0873ce;color:#fff}
#home .customer-hero h2{font-size:25px!important;color:#062b59!important}
#home .offers-banner-caption{margin:17px 17px -8px;color:#e63218;font-size:12px;font-weight:900;letter-spacing:.08em}
#home .offers-banner-caption span{color:#ffa500}
#home .home-grid{margin:15px 14px 0;gap:13px}
#home .home-primary{min-height:205px;border-radius:23px;background:radial-gradient(circle at 90% 70%,#ffb32d 0,#ff9224 27%,transparent 28%),linear-gradient(120deg,#ff3b16,#ff7b09 76%,#ffa22e);box-shadow:0 10px 22px #e96c2130;padding:24px 70px 26px 21px;position:relative;overflow:hidden}
#home .home-primary:before{content:"%";position:absolute;right:19px;top:16px;font-weight:950;font-size:72px;line-height:1;color:#fff9;transform:rotate(-12deg)}
#home .home-primary span{font-size:32px;font-weight:900;line-height:1.25;display:inline-block;max-width:220px}
#home .home-primary small{display:inline-block;margin-top:17px;background:#fff;border-radius:30px;padding:9px 14px;color:#073477!important;font-weight:900}
#home .home-primary .tile-arrow{top:auto;bottom:30px;right:26px;font-size:34px}
#home .coming-tile{position:relative;min-height:117px;background:linear-gradient(110deg,#d6edff,#e9f7ff)!important;border:0!important;border-radius:21px!important;opacity:1;padding:21px!important;color:#073477!important;overflow:hidden}
#home .coming-tile>span:first-child{display:inline-block;max-width:62%;font-size:20px;font-weight:850}
#home .coming-tile small{display:block;margin-top:8px;font-size:12px;font-weight:850;color:#0872d3}
#home .coming-illustration{position:absolute;right:20px;top:18px;font-size:66px}
#home .home-mini-heading{margin:19px 17px 0;font-size:13px;font-weight:850;color:#073477}
#home .notification-card,#home .install-card{border:0;border-radius:20px;box-shadow:0 5px 17px #0c3a7414;background:#fff}
#home .notification-card{padding:18px}
#home .notification-card strong,#home .install-card strong{font-size:15px}
#home .notification-card button{background:#0755c8;color:#fff}
#home .install-card{padding:18px}
#home .install-card button{background:#078e46}
#home .home-brands-title{font-size:16px;font-weight:900;margin:22px 16px 12px;color:#073477}
#home .home-brand-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin:0 16px}
#home .home-brand-logos img{width:100%;height:55px;object-fit:contain;padding:6px;background:#fff;border-radius:13px}
#home .bottom-nav{position:fixed;left:50%;right:auto;transform:translateX(-50%);width:min(100%,480px);z-index:10;height:74px}
#offers,#offerDetail{min-height:100svh;border-radius:0;box-shadow:none}
#offers .offers-head,#offerDetail .offers-head{background:linear-gradient(135deg,#002958,#0754a7);padding:22px 16px}
#offers .offers-list{gap:14px}
#offers .offer-card{border-radius:20px;box-shadow:0 6px 18px #0c3a7414}
#offers .offer-view{background:#0755c8}
@media(max-width:430px){#home .home-primary span{font-size:28px}#home .home-primary{min-height:185px}}

/* Safe UI state fixes: retain approved colors/layout. */
#login .login-languages .lang-btn[data-lang="si"]{background:#f0f4fa;color:#073477;border-color:#d9e2f0}
#login .login-languages .lang-btn.is-selected{background:#064eb9;color:#fff;border-color:#064eb9}
#continueBtn:disabled{opacity:.65;cursor:wait;pointer-events:none}

/* Approved customer home refresh — scoped to home, preserving registration, offers and push flows. */
#home{background:linear-gradient(180deg,#f3f8ff,#f9fbff);padding-bottom:96px}
#home .app-topbar{min-height:110px;background:linear-gradient(125deg,#003567,#0063ca);padding:19px 19px 30px}
#home .app-topbar small{font-size:clamp(16px,4.3vw,20px);letter-spacing:.025em}
#home .app-topbar strong{font-size:13px}
#home .top-bell{background:#ffffff20;border-radius:13px}
#home .customer-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 76px;gap:8px;align-items:center;margin:-12px 13px 0;padding:20px 18px;min-height:164px;border-radius:26px;background:linear-gradient(155deg,#fff 63%,#dbf0ff);box-shadow:0 10px 28px #16427716;overflow:hidden}
#home .customer-hero>div.hero-copy{grid-column:1;grid-row:1;min-width:0;z-index:1}
#home .customer-hero .hero-greeting{font-size:clamp(17px,5vw,23px)!important;color:#66758d!important;font-weight:800;margin-bottom:4px!important}
#home .customer-hero h2{font-size:clamp(26px,7vw,37px)!important;line-height:1.17!important;font-weight:900!important;color:#073774!important;letter-spacing:-.035em;overflow-wrap:anywhere;margin:0 0 12px!important}
#home .customer-hero .hero-welcome{font-size:clamp(12px,3.5vw,15px)!important;line-height:1.55!important;color:#69798f!important;font-weight:650}
#home .customer-hero .avatar{grid-column:2;grid-row:1;width:73px;height:73px;border-radius:50%;background:linear-gradient(155deg,#19b7ff,#1265eb);color:#fff;box-shadow:0 5px 15px #168cf634;position:relative;font-size:0;display:block}
#home .customer-hero .avatar:before{content:"";position:absolute;background:#fff;width:22px;height:22px;border-radius:50%;top:14px;left:26px}
#home .customer-hero .avatar:after{content:"";position:absolute;background:#fff;width:45px;height:23px;border-radius:50% 50% 34% 34%;bottom:11px;left:14px}
#home .offers-banner-caption{margin:22px 18px 8px;font-size:15px;font-weight:900;letter-spacing:.015em;color:#ef3027}
#home .offers-banner-caption span{color:inherit}
#home .home-grid{margin:0 13px;gap:14px;grid-template-columns:1fr}
#home .home-primary{display:block;text-align:left;min-height:215px;padding:25px 43% 23px 19px;border-radius:24px;background:linear-gradient(115deg,#ff273c,#ff5b1a 52%,#ffa321);box-shadow:0 9px 22px #e96c2130;isolation:isolate}
#home .home-primary:before{content:"";position:absolute;width:200px;height:200px;top:18px;right:-50px;border-radius:50%;background:#ffc05662;transform:none;z-index:-1}
#home .home-primary>span:first-child{display:block;max-width:unset;font-size:clamp(24px,6.5vw,33px);line-height:1.3;color:#fff;font-weight:950}
#home .home-primary p{font-size:clamp(12px,3.35vw,15px);color:#fff!important;font-weight:650;line-height:1.55;margin:9px 0!important}
#home .home-primary small{display:inline-block;color:#073477!important;background:#fff;border-radius:999px;padding:9px 13px;font-weight:900;margin-top:4px;font-size:13px;white-space:nowrap}
#home .home-primary .gift-illustration{display:block;position:absolute;right:12px;top:50px;font-size:clamp(70px,24vw,104px);line-height:1;filter:drop-shadow(0 8px 10px #9f390733);max-width:39%}
#home .home-primary .tile-arrow{position:absolute;right:18px;bottom:15px;top:auto;transform:none;font-size:23px;color:#fff}
#home .coming-tile{min-height:148px;border-radius:24px!important;background:linear-gradient(125deg,#d8efff,#eaf8ff)!important;padding:23px 20px!important}
#home .coming-tile>span:first-child{font-size:clamp(22px,6vw,30px);max-width:60%;line-height:1.28;font-weight:900;color:#073477}
#home .coming-tile small{font-size:14px;color:#076acf;font-weight:800}
#home .coming-illustration{right:18px;top:31px;font-size:clamp(64px,20vw,90px)}
#home .bottom-nav{height:72px}
#home .bottom-nav button small{font-size:11px}
@media(max-width:355px){#home .customer-hero{grid-template-columns:minmax(0,1fr) 58px;padding:17px 14px}#home .customer-hero .avatar{width:57px;height:57px}#home .customer-hero .avatar:before{width:17px;height:17px;left:20px;top:11px}#home .customer-hero .avatar:after{width:36px;height:19px;left:10px;bottom:8px}#home .home-primary{padding-right:38%}#home .home-primary .gift-illustration{font-size:66px}}

/* Keep avatar on the right despite the earlier legacy nth-child grid rule. */
#home .customer-hero>div.avatar{grid-column:2;grid-row:1}

/* Customer name spotlight: personal greeting is the visual focal point. */
#home .customer-hero{display:block;position:relative;padding:23px 19px 23px;min-height:192px;background:linear-gradient(145deg,#fff 40%,#e0f2ff 100%);border:1px solid #d5e9ff;box-shadow:0 12px 30px rgba(8,65,145,.14)}
#home .customer-hero>div.hero-copy{display:block;position:relative;z-index:1;width:100%;min-width:0;grid-column:auto;grid-row:auto}
#home .customer-hero .hero-greeting{padding-right:78px;font-size:clamp(18px,5.2vw,24px)!important;color:#60758e!important}
#home .customer-hero h2{display:table;max-width:100%;margin:16px 0 14px!important;padding:10px 13px 12px;border-radius:16px;background:linear-gradient(105deg,#073777,#0754b5);color:#fff!important;font-size:clamp(29px,7.7vw,42px)!important;font-weight:950!important;line-height:1.2!important;letter-spacing:-.025em;overflow-wrap:anywhere;word-break:normal;text-shadow:0 2px 5px #00255b35;box-shadow:0 6px 15px #0754b52b;border-bottom:4px solid #ffc12a}
#home .customer-hero .hero-welcome{max-width:100%;font-size:clamp(13px,3.6vw,16px)!important;font-weight:750!important;color:#536a87!important}
#home .customer-hero>div.avatar{position:absolute;top:17px;right:18px;grid-column:auto;grid-row:auto;width:65px;height:65px;box-shadow:0 5px 18px #168cf64c}
#home .customer-hero .avatar:before{left:23px;top:12px;width:20px;height:20px}
#home .customer-hero .avatar:after{left:12px;bottom:9px;width:42px;height:22px}
@media(max-width:355px){#home .customer-hero{padding:19px 14px}#home .customer-hero>div.avatar{width:53px;height:53px;right:12px;top:14px}#home .customer-hero .avatar:before{left:19px;top:10px;width:16px;height:16px}#home .customer-hero .avatar:after{left:10px;bottom:8px;width:33px;height:18px}#home .customer-hero h2{font-size:clamp(25px,7.7vw,32px)!important}}

/* Auto-login: never flash an interactive phone form while a saved session is restoring. */
.session-loading{margin:38px 14px 0;min-height:190px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:12px;background:#fff}
.session-spinner{width:36px;height:36px;border:4px solid #dceaff;border-top-color:#0754b5;border-radius:50%;animation:session-spin .85s linear infinite}
.session-loading p{margin:0;color:#073477;font-weight:800;font-size:15px}
.session-loading small{font-size:12px;color:#64748b}
@keyframes session-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.session-spinner{animation:none;border-top-color:#0754b5}}

/* Install flow: permanent action on Home, visible even after prior installs. */
#home .install-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid #b8d4fe;background:linear-gradient(110deg,#eaf5ff,#fff);margin:14px 13px 0;box-shadow:0 5px 17px #0c3a7414}
#home .install-card strong{font-size:15px;color:#073477}
#home .install-card button{display:block;min-width:126px;max-width:158px;white-space:normal;font-size:13px;background:#0754b5;color:#fff}
#home .install-hint{overflow-wrap:anywhere;font-size:12px;line-height:1.55;color:#33557d}
.install-intro{position:fixed;inset:0;z-index:60;display:grid;place-items:center;background:#061b42a8;padding:18px;backdrop-filter:blur(3px)}
.install-intro-card{width:min(100%,390px);padding:27px 20px 20px;border-radius:23px;text-align:center;background:#fff;box-shadow:0 20px 60px #001c4b55}
.install-intro-icon{font-size:37px}
.install-intro-card h2{font-size:23px;line-height:1.35;margin:9px 0;color:#073477}
.install-intro-card p{font-size:14px;color:#4c6080;line-height:1.6}
.install-intro-card button{margin:10px 0 0;min-height:49px}
.install-intro-card button.secondary{background:#eaf1fb;color:#073477}
.install-intro-hint{margin-top:14px!important;white-space:pre-wrap}
@media(max-width:380px){#home .install-card{grid-template-columns:1fr}#home .install-card button{width:100%;max-width:none;margin:0}}

/* Keep the install action visible near the customer's name, before offers. */
#home .customer-hero+.install-card{margin-top:12px;padding:12px 14px;border-radius:16px}
#home .customer-hero+.install-card button{margin:0}

/* Respect HTML hidden on overlays and loading screens; display:grid/flex must not intercept taps. */
.install-intro[hidden],.session-loading[hidden],.push-prompt[hidden]{display:none!important}

/* Compact install shortcut below brand logos (dashboard only). */
#home #installCard.install-card{grid-template-columns:minmax(0,1fr) auto;gap:8px;margin:12px 14px 8px;padding:10px 11px;border-radius:12px;box-shadow:0 3px 10px #0c3a740c}
#home #installCard strong{font-size:12px;line-height:1.3}
#home #installCard small{font-size:10px;line-height:1.35;margin-top:2px}
#home #installCard button{min-width:0;max-width:132px;min-height:36px;padding:7px 9px;font-size:11px;line-height:1.25;border-radius:9px}
#home #installCard .install-hint{font-size:10px;line-height:1.4}
@media(max-width:380px){#home #installCard.install-card{grid-template-columns:minmax(0,1fr) auto}#home #installCard button{width:auto;max-width:120px}}
