:root{--blue:#0057ae;--blue2:#00468c;--navy:#071f33;--bg:#f5f9fd;--accent:#f02014;--yellow:#f02014;--font-body:"Poppins",sans-serif;--font-title:"Plus Jakarta Sans",sans-serif}
body,button,input,select,textarea{font-family:var(--font-body)}h1,h2,h3,.summary b,.draw-info>span,.eyebrow{font-family:var(--font-title)}
body{background:#e8f1f8;color:var(--navy)}.app-shell{max-width:500px;min-height:100vh;margin:auto;background:var(--bg);padding-bottom:108px;box-shadow:0 0 45px rgba(7,31,51,.12)}
.topbar{height:auto;min-height:100px;padding:15px 24px 12px;background:transparent;color:var(--navy)}.brand-logo{display:block;width:132px;height:auto;max-height:69px;object-fit:contain;object-position:left center}.icon-button{position:relative;flex:0 0 46px;width:46px;height:46px;padding:0;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--blue);font-size:19px;display:grid;place-items:center;cursor:pointer}.icon-button>i{display:grid;width:100%;height:100%;place-items:center;line-height:1}.icon-button b{position:absolute;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:var(--accent);right:9px;top:8px}.icon-button b[hidden]{display:none}
main{padding:0 22px}.hero{min-height:226px;background:linear-gradient(135deg,#00468c,#0873cf);border-radius:26px;padding:25px;box-shadow:0 14px 32px rgba(0,87,174,.22)}.hero-copy{position:relative;z-index:2;width:64%}.hero .eyebrow{font-size:10px;letter-spacing:1.5px;color:#cfe8ff;font-weight:800}.hero h2{font-size:27px;letter-spacing:-.6px}.hero-button{display:flex;align-items:center;gap:8px;border-radius:13px;background:#fff!important;color:var(--blue)!important;padding:12px 15px;margin-top:16px}.hero-product{position:absolute;z-index:1;right:14px;bottom:0;width:142px;height:218px;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}.hero-product img{display:block!important;width:142px!important;max-width:142px!important;height:auto!important;max-height:218px!important;object-fit:contain;object-position:center bottom}
.summary{grid-template-columns:1fr 1fr;gap:12px;background:transparent;border:0;padding:0}.summary article{display:flex;gap:13px;align-items:center;text-align:left;border:1px solid var(--line)!important;border-radius:18px;padding:17px 14px;background:#fff}.summary article>i{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:#eaf4ff;color:var(--blue);font-size:18px}.summary b,.summary small{display:block}.summary small{font-size:10px}
.section-title{align-items:end}.section-title h3{font-size:19px}.section-title p{margin:4px 0 0;font-size:12px;color:var(--muted)}.draw-card{align-items:center;border-radius:20px;padding:14px;box-shadow:0 12px 30px rgba(7,31,51,.08)}.draw-icon{flex:0 0 72px;height:88px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(145deg,#e7f3ff,#cfe8ff);color:var(--blue);font-size:33px}.draw-info{padding:2px 12px}.draw-info>span{color:var(--accent)}.draw-info p{margin:0}.draw-card>button{border:0;background:transparent;color:var(--blue)}
.quick button{border:0;background:transparent;padding:0}.quick b{width:52px;height:52px;border:1px solid #d7e7f5;border-radius:17px;background:#fff;margin:0 auto 9px}.info{display:flex;gap:14px;background:#eaf4ff;border-color:#cfe5fa;border-radius:18px;padding:18px}.info>i{color:var(--blue);font-size:22px}.info a{font-size:11px;color:var(--blue);font-weight:800;text-decoration:none}
.bottom-nav{position:fixed;left:50%;transform:translateX(-50%);bottom:max(14px,env(safe-area-inset-bottom));width:min(466px,calc(100% - 28px));height:72px;padding:7px;background:var(--blue);border:0;border-radius:23px;display:grid;grid-template-columns:repeat(5,1fr);z-index:10;box-shadow:0 14px 30px rgba(0,61,125,.28)}.bottom-nav button{display:grid;place-items:center;border:0;border-radius:17px;background:transparent;color:#c7e2fa;font-size:25px;padding:0}.bottom-nav span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.bottom-nav button.active{background:#fff;color:var(--blue)}
@media(max-width:380px){main{padding:0 16px}.topbar{padding-left:18px;padding-right:18px}.brand-logo{width:120px}.hero{padding-left:21px;padding-right:21px}.hero-copy{width:66%}.hero h2{font-size:23px}.hero-product{right:10px;width:118px;height:188px}.hero-product img{width:118px!important;max-width:118px!important;max-height:188px!important}.draw-icon{flex-basis:60px}}