:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;color:#14263c;background:#eaf2f9;scroll-behavior:smooth}
*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffb743;outline-offset:2px}svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}
.app-shell{position:relative;max-width:540px;min-height:100vh;margin:0 auto;background:#fff;box-shadow:0 4px 40px #1b558522;overflow:clip}
.app-header{height:67px;position:sticky;top:0;z-index:12;background:linear-gradient(110deg,#319fe9,#218bdb);border-bottom:4px solid #1685ce;display:flex;align-items:center;justify-content:space-between;padding:0 20px;color:#fff;box-shadow:0 3px 9px #1576c62a}.header-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:900;letter-spacing:.5px;line-height:1.02}.header-brand b{color:#fff1c1}.header-brand small{display:block;font-size:8px;letter-spacing:2px;font-weight:700;opacity:.87;margin-top:5px}.header-logo{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#ffffff30;border:1px solid #ffffff50}.header-logo svg{width:23px;height:23px}.header-icon{border:0;background:#ffffff18;color:white;width:39px;height:39px;border-radius:11px;display:grid;place-items:center;position:relative}.header-icon svg{width:21px}.header-icon i{position:absolute;right:8px;top:6px;background:#ff9b38;border:2px solid #2796e1;width:9px;height:9px;border-radius:50%}
.preview-warning{padding:9px 14px;background:#fff5db;color:#946000;border-bottom:1px solid #ffe4aa;text-align:center;font-size:11px;font-weight:700;line-height:1.5}.preview-warning[hidden]{display:none}
.content{padding:19px 15px 116px}section[id]{scroll-margin-top:86px}.promo{height:197px;border-radius:17px;position:relative;overflow:hidden;background:linear-gradient(118deg,#063a6a 0%,#0b5a98 55%,#075a9a 100%);border:1px solid #176ba7;box-shadow:0 8px 20px #126caa27;color:white;padding:21px 18px}.promo:before{content:'';position:absolute;inset:-55px auto auto -60px;width:190px;height:190px;border:8px solid #ff982d;border-radius:50%;opacity:.85}.promo:after{content:'';position:absolute;right:-44px;bottom:-85px;width:180px;height:180px;border:6px solid #fca12f;border-radius:50%;opacity:.82}.promo-decor{position:absolute;border-radius:50%;background:#3ab4f127}.promo-decor-a{width:160px;height:160px;right:25px;top:-70px}.promo-decor-b{width:100px;height:100px;left:35%;bottom:-55px}.promo-content{position:relative;z-index:2;max-width:71%}.promo-badge{font-size:8px;letter-spacing:1px;font-weight:900;color:#fff0b5;background:#ffffff20;border:1px solid #ffffff35;border-radius:20px;padding:6px 9px;display:inline-block}.promo h1{font-size:36px;letter-spacing:1px;line-height:1;margin:14px 0 5px;font-weight:1000}.promo h1 span{color:#ffb243}.promo p{font-size:11px;line-height:1.6;margin:0;color:#e4f5ff}.promo-stats{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.promo-stats span{font-size:10px;background:#ffffff1d;border:1px solid #ffffff27;border-radius:6px;padding:5px 7px}.promo-cta{display:flex;align-items:center;gap:7px;border:0;border-radius:7px;padding:8px 11px;font-size:10px;font-weight:900;color:#073e68;background:#ffb43d}.promo-cta svg{width:14px;height:14px}.promo-art{position:absolute;right:12px;top:35px;width:138px;height:138px;display:grid;place-items:center}.art-ring{width:115px;height:115px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 40% 30%,#7acfff,#278cdd 60%,#085292);box-shadow:0 0 0 8px #ffffff16,0 0 0 15px #ffffff09,0 14px 26px #00294e8c;border:2px solid #b3e7ff}.art-ring svg{width:70px;height:70px;stroke:#ffe0a1;stroke-width:1.7;filter:drop-shadow(0 3px 3px #00497d)}.art-star{position:absolute;color:#ffc56b;font-size:24px}.star-one{right:2px;top:0}.star-two{left:0;bottom:6px}
.shortcuts{padding:18px 0 11px}.shortcut-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px 8px}.shortcut{background:none;border:0;padding:0;min-width:0;display:flex;align-items:center;flex-direction:column;gap:5px;color:#3e5468;font-size:10px;font-weight:750;line-height:1.1}.shortcut[hidden]{display:none}.shortcut-icon{display:grid;place-items:center;width:100%;aspect-ratio:1/1;max-height:76px;border:1px solid #a3cde3;border-radius:13px;background:#fff;box-shadow:0 3px 7px #0e6ba509;transition:transform .15s,background .15s}.shortcut-icon svg{width:29px;height:29px;stroke-width:2.1}.shortcut:active .shortcut-icon{transform:scale(.93)}.shortcut:first-child .shortcut-icon{background:#2a9be7;color:white;border-color:#2a9be7;box-shadow:0 6px 13px #259be63a}.is-rose{color:#e84274}.is-violet{color:#8853d7}.is-green{color:#1aaf80}.is-orange{color:#f58c2d}.is-purple{color:#9362e6}.is-cyan{color:#08a4c6}.is-indigo{color:#416bca}.is-teal{color:#08a09b}.is-yellow{color:#e7a62c}
.quick-order{padding-top:15px}.section-title{display:flex;align-items:center;gap:8px;margin:0 0 16px}.section-title h2{font-size:15px;font-weight:900;letter-spacing:.6px;margin:0}.title-emoji{font-size:17px}.search-caption{display:flex;justify-content:space-between;font-size:9px;font-weight:800;color:#8b9bab;letter-spacing:.3px;margin:0 0 8px}.search-caption span:first-child{color:#9b9f9f}.search-box{height:46px;display:flex;align-items:center;gap:11px;border:1px solid #a5cfe4;background:#f6f9fc;border-radius:12px;padding:0 14px;margin-bottom:18px}.search-box svg{width:18px;color:#7c90a0}.search-box input{border:0;background:transparent;outline:none;width:100%;color:#18364b;font-size:12px}.search-empty{font-size:12px;color:#bf6429}
.plan-card{border:1px solid #d4e5f2;border-radius:17px;padding:18px;background:linear-gradient(180deg,#fff,#f8fcff);box-shadow:0 8px 20px #1d7db70d}.plan-top{display:flex;justify-content:space-between;align-items:flex-start}.plan-eyebrow{font-size:9px;font-weight:900;color:#2397df;letter-spacing:1px}.plan-top h3{font-size:21px;margin:7px 0 3px;letter-spacing:-.5px}.plan-top p{font-size:11px;color:#7e91a0;margin:0}.plan-crown{width:50px;height:50px;border-radius:13px;background:#eaf7ff;display:grid;place-items:center;font-size:25px}.plan-price{font-size:34px;font-weight:950;color:#168bdb;margin:15px 0 10px}.plan-price span{font-size:12px;color:#7e91a0;font-weight:650}.plan-divider{height:1px;background:#e3edf5;margin:12px 0}.plan-features{display:grid;grid-template-columns:1fr 1fr;gap:11px 5px;margin:16px 0}.plan-features span{display:flex;gap:6px;align-items:center;font-size:11px;font-weight:750;color:#3d596e}.plan-features svg{width:16px;height:16px;color:#1eb98a;stroke-width:3}.primary-button{width:100%;min-height:47px;border:0;border-radius:11px;color:#fff;background:linear-gradient(110deg,#32a7ed,#1587d6);box-shadow:0 6px 14px #168bd33b;display:flex;justify-content:center;align-items:center;gap:10px;font-weight:900;font-size:12px;letter-spacing:.5px;padding:12px}.primary-button svg{width:18px;height:18px}.primary-button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.plan-note{font-size:10px;line-height:1.5;color:#8998a7;margin:12px 0 0;text-align:center}
.panel{border:1px solid #e1ebf2;background:#fff;border-radius:16px;padding:18px 15px;margin-top:18px;box-shadow:0 5px 20px #217ab50a}.panel .section-title{margin-bottom:12px}.panel-intro{font-size:12px;color:#70889b;line-height:1.6;margin:0 0 14px}.step-list{display:flex;flex-direction:column;gap:13px}.step{display:flex;align-items:flex-start;gap:12px}.step-number{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;flex:0 0 38px;background:#e5f4ff;color:#168bd7;font-weight:900;font-size:13px}.step b{font-size:13px}.step p{margin:3px 0 0;color:#788b9b;font-size:11px;line-height:1.6}
.payment-tabs{display:grid;grid-template-columns:1fr 1fr;gap:11px}.payment-tab{border:1px solid #d4e5ef;background:#f9fcff;border-radius:12px;min-height:57px;display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px;color:#263f55}.payment-tab.selected{border:2px solid #2399e5;background:#ecf8ff;box-shadow:0 4px 12px #188ddb13}.method-dot{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;color:white;font-size:20px;font-weight:950}.method-dot.bkash{background:#df1764}.method-dot.nagad{background:#f26b25}.payment-number{margin-top:13px;border:1px dashed #93c6e7;border-radius:12px;background:#f1faff;padding:13px}.payment-number>span{font-size:10px;color:#7893a6;font-weight:750}.number-line{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:6px}.number-line strong{font-size:21px;letter-spacing:.4px;color:#164566}.copy-button{display:flex;align-items:center;gap:5px;border:0;border-radius:8px;background:#2699e3;color:white;padding:10px 11px;font-size:10px;font-weight:850}.copy-button svg{width:15px;height:15px}.warning-box{margin-top:14px;padding:12px;border-radius:11px;background:#fff8e9;border:1px solid #ffe7b9;color:#94651b;font-size:11px}.warning-box p{margin:5px 0 0;line-height:1.65}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-row:first-child{grid-template-columns:1.6fr 1fr}.form-field{margin-bottom:12px;min-width:0}.form-field label{display:block;color:#526a7d;font-size:11px;font-weight:800;margin-bottom:7px}.form-field input,.form-field select{height:43px;border-radius:10px;background:#f8fbfd;border:1px solid #c8dce8;color:#1a3850;padding:0 11px;width:100%;min-width:0;outline:none;font-size:12px}.form-field input:focus,.form-field select:focus{border-color:#2699e3;box-shadow:0 0 0 3px #2c9ee61b}.honeypot{position:absolute;left:-9999px}.message-state,.membership-state{background:#eef6fc;border-radius:10px;padding:12px;color:#466a85;font-size:11px;line-height:1.7;margin-top:13px;overflow-wrap:anywhere}.message-state.good,.membership-state.good{background:#e8f9f2;color:#13835e}.message-state.bad,.membership-state.bad{background:#fff0f1;color:#a42d4b}.message-state.warn{background:#fff6e3;color:#976b1b}.status-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}.outline-button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;background:#f1faff;color:#258ac8;border:1px solid #b8def5;border-radius:10px;font-size:11px;font-weight:850}.outline-button svg{width:16px;height:16px}.subtle-note{font-size:10px;line-height:1.6;color:#8ca0ae;margin:12px 0 0}.benefit-row{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #ecf1f5}.benefit-row:last-child{border:0}.benefit-row>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;flex:0 0 42px;background:#eaf7ff;color:#2399df}.benefit-row b{font-size:12px}.benefit-row p{margin:3px 0 0;color:#8296a6;font-size:11px;line-height:1.5}.footer{text-align:center;color:#91a2b0;font-size:10px;line-height:1.9;margin-top:23px}.footer a{color:#258cd3;text-decoration:none}
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);z-index:15;width:min(100%,540px);height:72px;padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,1fr);align-items:center;background:linear-gradient(180deg,#35a4ed,#258edb);border-top:2px solid #1384d0;box-shadow:0 -4px 17px #1578c63a}.bottom-nav button{height:58px;border:0;background:none;color:#d6f0ff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:8px;font-weight:850;letter-spacing:.3px}.bottom-nav button svg{width:23px;height:23px;opacity:.85}.bottom-nav button.active{color:#fff}.bottom-nav .nav-home{position:relative;justify-content:flex-end;padding-bottom:8px}.home-bubble{position:absolute;top:-25px;width:60px;height:60px;background:#fff;border-radius:50%;box-shadow:0 2px 10px #09558c40;display:grid;place-items:center;border:5px solid #fff;color:#0c1927}.home-bubble svg{width:29px!important;height:29px!important;stroke-width:2.7;opacity:1!important;fill:#0c1927;stroke:#0c1927}.bottom-nav .nav-home>span:last-child{margin-top:34px}.floating-help{position:fixed;z-index:14;bottom:94px;right:max(18px,calc((100vw - 540px)/2 + 18px));border:3px solid white;border-radius:50%;background:linear-gradient(130deg,#24b6bd,#048d9b);color:#fff;width:57px;height:57px;display:grid;place-items:center;box-shadow:0 6px 18px #007e9e45}.floating-help svg{width:27px;height:27px}
.modal-backdrop[hidden]{display:none}.modal-backdrop{position:fixed;z-index:30;inset:0;background:#081d34a8;display:flex;align-items:flex-end;justify-content:center}.info-modal{width:min(100%,540px);max-height:85vh;overflow:auto;background:white;border-radius:22px 22px 0 0;padding:23px 20px max(25px,env(safe-area-inset-bottom));box-shadow:0 -10px 40px #0003}.modal-header{display:flex;align-items:center;justify-content:space-between}.modal-header h2{margin:0;font-size:19px}.modal-header button{border:0;background:#eef5fa;border-radius:10px;width:36px;height:36px;display:grid;place-items:center;color:#38607d}.modal-header svg{width:19px;height:19px}.modal-body{font-size:13px;line-height:1.8;color:#547084;padding:10px 0}.modal-body p{margin:9px 0}.toast{position:fixed;z-index:40;bottom:90px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:.2s ease;background:#163f60;color:white;border-radius:10px;padding:11px 17px;max-width:90%;width:max-content;font-size:12px;text-align:center;box-shadow:0 5px 16px #0002}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:541px){.app-shell{border-left:1px solid #dceaf3;border-right:1px solid #dceaf3}}@media(max-width:370px){.content{padding-left:11px;padding-right:11px}.shortcut-grid{gap:9px 6px}.shortcut{font-size:9px}.promo{padding:17px 13px}.promo h1{font-size:32px}.promo-art{right:3px;transform:scale(.82)}.promo-content{max-width:72%}.number-line strong{font-size:18px}.bottom-nav button{font-size:7px}}
