.phoneShell{width:390px;max-width:100%;margin:0 auto;background:#111827;border-radius:40px;padding:12px;box-shadow:0 30px 70px rgba(0,0,0,.25)}
.phoneViewport{height:770px;border-radius:30px;overflow:hidden;background:#fff;position:relative;display:flex;flex-direction:column}
.msScreen{height:100%;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#f8fafc;color:#111827;font-family:Arial,"Microsoft JhengHei","PingFang TC",sans-serif;padding-bottom:105px;position:relative}.msTop{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);padding:12px 16px;border-bottom:1px solid #e5e7eb}.msBrand{display:flex;align-items:center;gap:10px;min-height:42px}.msBrandText{font-weight:900;font-size:18px;line-height:1.05}.msTagline{font-size:11.5px;color:#64748b;margin-top:2px;line-height:1.45}.msLogoSq{width:42px;height:42px;object-fit:contain;border-radius:0;background:transparent;display:block}.msLogoLong{height:42px;max-width:210px;object-fit:contain;background:transparent;display:block}.msLogoLong.large{height:52px;max-width:255px}.msHero{margin:14px 14px 10px;border-radius:24px;overflow:hidden;background:#111827;color:#fff;min-height:175px;position:relative;box-shadow:0 18px 32px rgba(15,23,42,.18)}.msHeroBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.62}.msHeroGrad{position:absolute;inset:0;background:linear-gradient(135deg,rgba(17,24,39,.92),rgba(17,24,39,.35),rgba(250,204,21,.55))}.msHeroText{position:relative;padding:24px}.msHero h1{margin:0;font-size:30px;letter-spacing:-1px}.msHero p{margin:8px 0 0;color:#f9fafb;font-size:13px;line-height:1.45}.msCoupon{margin:12px 14px;padding:13px 14px;border-radius:18px;background:#111827;color:#fff;display:flex;justify-content:space-between;align-items:center;gap:10px}.msCoupon b{color:#facc15}.msCoupon div div{font-size:12px;color:#e5e7eb}.msCoupon button{background:#fff;color:#111827;border:0;border-radius:12px;padding:8px 10px;font-weight:800}.msSection{padding:10px 14px}.msSection h2{font-size:18px;margin:8px 0 12px}.msCatRow{display:flex;gap:8px;overflow:auto;padding:0 14px 8px}.msCat{white-space:nowrap;border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:8px 12px;font-size:13px}.msCat.active{background:#111827;color:#fff}.msGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.msCard{background:#fff;border-radius:18px;overflow:hidden;border:1px solid #e5e7eb;box-shadow:0 10px 22px rgba(15,23,42,.05);cursor:pointer}.msPimg{width:100%;aspect-ratio:1/1;object-fit:cover;background:#f3f4f6;display:block}.msPinfo{padding:10px}.msPname{font-weight:800;font-size:13px;line-height:1.35;margin:6px 0;min-height:36px}.msPrice{font-weight:900;font-size:15px;color:#111827}.msOld{font-size:11px;color:#9ca3af;text-decoration:line-through;font-weight:600;margin-left:4px}.msBadge{font-size:10px;background:#fef3c7;color:#92400e;border-radius:999px;padding:3px 6px;margin-right:4px}.msBottom{position:sticky;bottom:0;z-index:7;background:#fff;border-top:1px solid #e5e7eb;display:grid;grid-template-columns:repeat(5,1fr);padding:7px 4px;padding-bottom:calc(7px + env(safe-area-inset-bottom))}.msNavBtn{border:0;background:transparent;color:#6b7280;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px}.msNavBtn b{font-size:17px}.msNavBtn.active{color:#111827;font-weight:900}.msDetailHero{background:#fff}.msDetailMainImg{width:100%;aspect-ratio:1/1;object-fit:cover;background:#f3f4f6;display:block}.msThumbs{display:flex;gap:8px;overflow:auto;padding:10px 14px}.msThumbs img{width:58px;height:58px;object-fit:cover;border-radius:12px;border:2px solid transparent;background:#f3f4f6}.msThumbs img.active{border-color:#111827}.msDetailBox{background:#fff;margin-top:10px;padding:18px;border-radius:22px 22px 0 0}.msDetailBox h1{font-size:22px;margin:0 0 6px;line-height:1.25}.msDetailBrand{font-size:13px;color:#6b7280}.msDetailPrice{font-size:24px;font-weight:900;margin:14px 0}.msBtnFull{width:100%;border:0;border-radius:16px;background:#111827;color:#fff;padding:13px;font-weight:900;font-size:15px}.msBtnLight{width:100%;border:1px solid #e5e7eb;border-radius:16px;background:#fff;color:#111827;padding:13px;font-weight:900;font-size:15px}.msDesc{font-size:14px;color:#374151;line-height:1.65;margin-top:16px;white-space:pre-wrap}.msSpec{background:#f3f4f6;border-radius:16px;padding:12px;margin:12px 0;font-size:13px;color:#374151;line-height:1.6;white-space:pre-wrap}.msCartItem{display:flex;gap:12px;background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:10px;margin-bottom:10px}.msCartItem img{width:70px;height:70px;object-fit:cover;border-radius:14px;background:#f3f4f6}.msAccountCard{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:16px;margin:12px 14px}.msAccountCard h2{margin:0 0 8px}.msBetween{display:flex;justify-content:space-between;align-items:center}.msAdOverlay{position:absolute;inset:0;z-index:50;background:rgba(0,0,0,.78);display:grid;place-items:center;padding:18px}.msAdCard{width:min(360px,94%);border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 30px 80px rgba(0,0,0,.45)}.msAdImg{width:100%;aspect-ratio:9/14;object-fit:cover;background:#111827;display:block}.msPlaceholder{display:grid;place-items:center;color:#fff;font-weight:900;font-size:24px;background:linear-gradient(135deg,#111827,#facc15)}.msAdContent{padding:16px}.msAdContent h2{margin:0 0 6px}.msAdContent p{margin:0;color:#4b5563;font-size:13px;line-height:1.5}.msCount{margin-top:12px;background:#111827;color:#facc15;border-radius:999px;padding:9px 12px;text-align:center;font-weight:900}


.msWarrantyHead{margin:14px;border-radius:24px;background:linear-gradient(135deg,#111827,#374151);color:#fff;padding:22px}.msWarrantyHead h1{margin:0 0 8px;font-size:25px}.msWarrantyHead p{margin:0;font-size:13px;line-height:1.5;color:#e5e7eb}.msFormCard{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:16px;margin:12px 14px}.msFormCard label{display:block;font-size:12px;font-weight:900;color:#374151;margin:12px 0 6px}.msFormCard input,.msFormCard select,.msFormCard textarea{width:100%;border:1px solid #e5e7eb;border-radius:14px;padding:12px;font-family:inherit;font-size:14px;background:#fff}.msFormCard textarea{min-height:80px;resize:vertical}.msUploadBox{border:1.5px dashed #94a3b8;background:#f8fafc;border-radius:18px;min-height:150px;display:grid;place-items:center;text-align:center;padding:18px;color:#475569}.msUploadBox b{color:#111827}.msUploadBox p{font-size:12px;line-height:1.45;margin:6px 0 0}.msUploadIcon{font-size:34px;margin-bottom:6px}
.logoChecker{background-color:#f8fafc;background-image:linear-gradient(45deg,#e5e7eb 25%,transparent 25%),linear-gradient(-45deg,#e5e7eb 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5e7eb 75%),linear-gradient(-45deg,transparent 75%,#e5e7eb 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.logoPreviewImg{object-fit:contain!important;background:transparent!important}
@media(max-width:480px){.phoneShell{width:100%;padding:0;border-radius:0;box-shadow:none}.phoneViewport{height:calc(100dvh - 58px);border-radius:0}.msScreen{height:100%;max-height:100%;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(105px + env(safe-area-inset-bottom))}.msTop{padding-top:calc(12px + env(safe-area-inset-top))}.msBottom{position:sticky;bottom:0}.msNavBtn{font-size:10px;padding:3px 1px}.msNavBtn b{font-size:16px}}

/* V4: richer header, better transparent-logo display, more title styles */
.msScreen{overscroll-behavior:contain;scroll-behavior:auto;background:linear-gradient(180deg,#f8fafc 0%,#eef2ff 42%,#f8fafc 100%)}
.msTop{background:linear-gradient(135deg,var(--theme,#111827) 0%,#1f2937 55%,var(--accent,#facc15) 145%)!important;color:#fff;border-bottom:0!important;box-shadow:0 14px 26px rgba(15,23,42,.2);overflow:hidden;position:sticky;top:0;z-index:8}
.msTop:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 82% 20%,rgba(255,255,255,.22),transparent 28%),linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.12) 58% 60%,transparent 60% 100%);pointer-events:none}
.msBrand{position:relative;z-index:1;justify-content:space-between;min-height:52px}.msBrandLogoArea{min-width:0;display:flex;align-items:center;gap:10px;background:transparent!important}.msBrandDecor{margin-left:auto;display:flex;align-items:center;gap:8px;white-space:nowrap}.msBrandDecor span{font-size:11px;font-weight:900;color:#111827;background:var(--accent,#facc15);border-radius:999px;padding:7px 10px;box-shadow:0 6px 14px rgba(0,0,0,.16)}.msBrandDecor b{color:var(--accent,#facc15);font-size:18px;text-shadow:0 0 18px rgba(250,204,21,.85)}
.msLogoLong,.msLogoSq{background:transparent!important;border:0!important;box-shadow:none!important;filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}.msLogoLong{max-width:230px}.msLogoLong.large{height:58px;max-width:270px}.msLogoSq{filter:drop-shadow(0 6px 10px rgba(0,0,0,.25))}.msBrandText{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.28)}.msTagline{color:rgba(255,255,255,.78)}
.msHero{background:linear-gradient(135deg,var(--theme,#111827),#334155)!important}.msHero:after{content:"";position:absolute;right:-40px;top:-40px;width:150px;height:150px;border-radius:50%;border:1px solid rgba(255,255,255,.28);box-shadow:0 0 0 18px rgba(255,255,255,.04);pointer-events:none}.msHeroGrad{background:linear-gradient(135deg,rgba(17,24,39,.95),rgba(17,24,39,.55),color-mix(in srgb,var(--accent,#facc15) 72%,transparent))!important}.msHeroKicker{font-size:10px;font-weight:900;letter-spacing:2px;color:var(--accent,#facc15);margin-bottom:7px}.msHeroChips{display:flex;gap:7px;flex-wrap:wrap;margin-top:13px}.msHeroChips span{font-size:11px;font-weight:900;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.20);border-radius:999px;padding:6px 9px}.heroFont-tech h1{font-family:"Trebuchet MS","Arial Narrow",Arial,sans-serif;text-transform:uppercase;letter-spacing:-1px}.heroFont-luxury h1{font-family:Georgia,"Times New Roman","Microsoft JhengHei",serif;font-weight:900;letter-spacing:.5px}.heroFont-rounded h1{font-family:"Microsoft JhengHei",Arial,sans-serif;font-weight:900;letter-spacing:.2px}.heroFont-impact h1{font-family:Impact,"Arial Black","Microsoft JhengHei",sans-serif;letter-spacing:.6px}.heroFont-minimal h1{font-family:Arial,"Microsoft JhengHei",sans-serif;font-weight:700;letter-spacing:-1.2px}.heroStyle-neon{box-shadow:0 18px 35px color-mix(in srgb,var(--accent,#facc15) 32%,transparent)}.heroStyle-neon .msHeroGrad{background:linear-gradient(135deg,rgba(2,6,23,.96),rgba(30,41,59,.72),rgba(14,165,233,.48))!important}.heroStyle-premium .msHeroText h1{text-shadow:0 12px 24px rgba(0,0,0,.35)}.heroStyle-clean{box-shadow:0 12px 25px rgba(15,23,42,.10)}.heroStyle-clean .msHeroGrad{background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,255,255,.28),rgba(250,204,21,.35))!important}.heroStyle-clean .msHeroText,.heroStyle-clean .msHeroText p{color:#111827}.heroStyle-clean .msHeroKicker{color:#111827}.heroStyle-clean .msHeroChips span{background:rgba(17,24,39,.08);border-color:rgba(17,24,39,.08)}
.logoChecker .imgPreview,.logoPreviewImg{background-color:transparent!important}.logoTransparencyNote{font-size:12px;color:#475569;margin-top:8px;background:rgba(255,255,255,.78);border:1px solid #e5e7eb;border-radius:10px;padding:8px;line-height:1.45}
@media(max-width:480px){html,body{height:100%;overflow:hidden}.phoneViewport{height:calc(100dvh - 58px)!important;overflow:hidden!important}.msScreen{height:100%;overflow-y:auto!important;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.msLogoLong.large{height:48px;max-width:220px}.msBrandDecor span{font-size:10px;padding:6px 8px}.msBrandDecor b{display:none}}


/* V5: warranty model input, coupon expiry, and animated hero orbital rings */
.msCouponExpiry{font-size:10px!important;color:rgba(255,255,255,.72)!important;margin-top:3px}.msInputHint{font-size:12px;color:#475569;line-height:1.55;margin-top:7px}.msHero{isolation:isolate}.msHeroBg{z-index:0}.msHeroGrad{z-index:1}.msHeroText{z-index:3}.msHero:before,.msHero:after{content:"";position:absolute;border-radius:50%;pointer-events:none;z-index:2}.msHero:before{right:-54px;top:-54px;width:166px;height:166px;border:1px solid rgba(255,255,255,.34);box-shadow:0 0 0 16px rgba(255,255,255,.04),0 0 40px rgba(255,255,255,.10)}.msHero:after{right:2px;top:22px;width:86px;height:86px;border:2px dashed rgba(255,255,255,.46);box-shadow:0 0 18px color-mix(in srgb,var(--accent,#facc15) 42%,transparent)}.heroMotion-dual:before{animation:msSpinCW 16s linear infinite}.heroMotion-dual:after{animation:msSpinCCW 9s linear infinite}.heroMotion-clockwise:before,.heroMotion-clockwise:after{animation:msSpinCW 13s linear infinite}.heroMotion-static:before,.heroMotion-static:after{animation:none}.heroMotion-dual .msHeroGrad:after,.heroMotion-clockwise .msHeroGrad:after{content:"";position:absolute;right:54px;top:42px;width:12px;height:12px;border-radius:50%;background:var(--accent,#facc15);box-shadow:0 0 22px var(--accent,#facc15);animation:msPulse 1.8s ease-in-out infinite}@keyframes msSpinCW{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes msSpinCCW{from{transform:rotate(360deg)}to{transform:rotate(0deg)}}@keyframes msPulse{0%,100%{opacity:.45;transform:scale(.82)}50%{opacity:1;transform:scale(1.18)}}.heroFont-digital h1{font-family:"Courier New",monospace;text-transform:uppercase;letter-spacing:-.5px;text-shadow:0 0 18px color-mix(in srgb,var(--accent,#facc15) 50%,transparent)}.heroFont-gaming h1{font-family:"Arial Black",Impact,"Microsoft JhengHei",sans-serif;font-style:italic;letter-spacing:.3px;text-transform:uppercase;text-shadow:3px 3px 0 rgba(0,0,0,.25)}

/* V6: clickable hero chips, handwritten slogan near logo, coupon page cleanup */
.msBrandLogoArea{flex:1;min-width:0;gap:9px}.msLogoSlogan{font-family:"Segoe Script","Brush Script MT","Comic Sans MS",cursive;font-size:14px;font-weight:700;line-height:1.05;color:#fff;white-space:nowrap;letter-spacing:.2px;text-shadow:0 0 10px rgba(255,255,255,.35),0 4px 14px rgba(0,0,0,.32);transform:rotate(-2deg);max-width:130px;overflow:hidden;text-overflow:ellipsis;opacity:.95;position:relative}.msLogoSlogan:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:linear-gradient(90deg,transparent,var(--accent,#facc15),transparent);box-shadow:0 0 8px var(--accent,#facc15)}.msHeroChips button{font-size:11px;font-weight:900;background:rgba(255,255,255,.16);color:#fff;border:1px solid rgba(255,255,255,.20);border-radius:999px;padding:7px 10px;box-shadow:0 8px 18px rgba(0,0,0,.12);cursor:pointer}.msHeroChips button:active{transform:scale(.97)}.heroStyle-clean .msHeroChips button{background:rgba(17,24,39,.08);color:#111827;border-color:rgba(17,24,39,.10)}.msCat{cursor:pointer;border:1px solid #e5e7eb;background:#fff;color:#111827}.msCatRowTop{padding-top:12px}.msBrandDecor span{letter-spacing:.5px}.msTop{min-height:76px}@media(max-width:480px){.msLogoSlogan{font-size:12px;max-width:95px}.msLogoLong{max-width:160px}.msLogoLong.large{max-width:175px}.msBrandDecor span{font-size:9px;padding:6px 7px}.msTop{min-height:72px}}

/* V7: tighter slogan, member login badge, home product sections, product category filter title */
.msLogoSlogan{font-size:10.5px!important;max-width:92px!important;white-space:normal!important;line-height:1.12!important;letter-spacing:.1px!important;flex:0 1 92px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;transform:rotate(-1.5deg)!important}
.msLogoSlogan:after{display:none!important}.msBrandLogoArea{gap:7px!important;overflow:hidden}.msBrandDecor span{background:rgba(255,255,255,.92)!important;color:var(--theme,#111827)!important;border:1px solid rgba(255,255,255,.5);box-shadow:0 7px 16px rgba(0,0,0,.18), inset 0 0 0 1px rgba(250,204,21,.35)}
.msProductSection{padding-top:6px}.msSectionTitle{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.msSectionTitle h2{margin:4px 0!important}.msSectionTitle:after{content:"";height:2px;flex:1;margin-left:12px;background:linear-gradient(90deg,var(--accent,#facc15),transparent);border-radius:999px}.msEmptySection{grid-column:1/-1;margin:0!important}.msFilterTitle{padding:14px 14px 4px;font-size:12px;font-weight:900;color:#64748b;letter-spacing:.6px}.msCatRowTop{padding-top:4px!important;padding-bottom:10px!important}
@media(max-width:480px){.msLogoSlogan{font-size:9.5px!important;max-width:68px!important;flex-basis:68px}.msLogoLong{max-width:132px!important}.msLogoLong.large{max-width:145px!important;height:44px!important}.msBrandLogoArea{gap:5px!important}.msBrandDecor span{font-size:9px!important;padding:5px 6px!important}.msTop{min-height:68px!important}}

/* V8: sale price red, product colors, larger logo, better handwritten slogan, receipt preview */
.msImgWrap{position:relative}.msSaleRibbon{position:absolute;left:8px;top:8px;z-index:2;background:#dc2626;color:#fff;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:900;box-shadow:0 8px 18px rgba(220,38,38,.35);letter-spacing:.5px}.msPrice.sale,.msDetailPrice.sale{color:#dc2626!important;text-shadow:0 8px 16px rgba(220,38,38,.14)}.msPrice.sale:before{content:"SALE ";font-size:10px;background:#dc2626;color:#fff;border-radius:999px;padding:2px 5px;margin-right:4px;vertical-align:2px}.msDetailPrice.sale:before{content:"優惠價";font-size:11px;background:#fee2e2;color:#b91c1c;border:1px solid #fecaca;border-radius:999px;padding:4px 8px;margin-right:8px;vertical-align:4px}.msColorRow{display:flex;gap:4px;flex-wrap:wrap;margin:5px 0 2px}.msColorRow span{font-size:10px;color:#475569;border:1px solid #e5e7eb;background:#f8fafc;border-radius:999px;padding:2px 6px}.msColorSpec{background:#fff7ed!important;border:1px solid #fed7aa;color:#7c2d12!important}.msReceiptBox{margin-top:10px;border:1px solid #e5e7eb;background:#f8fafc;border-radius:16px;padding:10px;text-align:center;color:#475569;font-size:12px}.msReceiptBox img{width:100%;max-height:240px;object-fit:contain;border-radius:12px;background:#fff;display:block;margin-bottom:6px}.msLogoLong{height:50px!important;max-width:255px!important}.msLogoLong.large{height:64px!important;max-width:310px!important}.msLogoSq{width:50px!important;height:50px!important}.msLogoSlogan{font-family:"Snell Roundhand","Zapfino","Bradley Hand","Marker Felt","Segoe Script","Brush Script MT","Comic Sans MS",cursive!important;font-size:12.5px!important;max-width:112px!important;flex-basis:112px!important;font-style:italic!important;font-weight:500!important;letter-spacing:.2px!important;text-shadow:0 0 12px rgba(255,255,255,.38),0 5px 13px rgba(0,0,0,.34)!important;color:#fff!important;line-height:1.15!important}.msLogoSlogan:before{content:"";display:block;width:42px;height:1px;background:linear-gradient(90deg,var(--accent,#facc15),transparent);margin-bottom:2px;opacity:.9}.msBrandDecor span{font-size:10px!important;padding:6px 9px!important}@media(max-width:480px){.msLogoLong{height:48px!important;max-width:185px!important}.msLogoLong.large{height:56px!important;max-width:205px!important}.msLogoSq{width:48px!important;height:48px!important}.msLogoSlogan{font-size:10.5px!important;max-width:82px!important;flex-basis:82px!important}.msBrandDecor span{font-size:8.5px!important;padding:5px 6px!important}.msTop{min-height:76px!important}}

/* V9: login jump, color selection before cart, cart delete, warranty receipt required, WhatsApp button */
.msLoginBtn{background:rgba(255,255,255,.92)!important;color:var(--theme,#111827)!important;border:1px solid rgba(255,255,255,.55)!important;border-radius:999px!important;padding:6px 9px!important;font-size:10px!important;font-weight:900!important;box-shadow:0 7px 16px rgba(0,0,0,.18), inset 0 0 0 1px rgba(250,204,21,.35)!important;white-space:nowrap;cursor:pointer}.msLoginBtn:active{transform:scale(.97)}.msBrandDecor span{display:none!important}.msNotice{margin:10px 14px 0;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;border-radius:14px;padding:11px 13px;font-size:13px;font-weight:900;line-height:1.5;box-shadow:0 8px 20px rgba(154,52,18,.08)}.msColorButtons{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}.msColorBtn{border:1px solid #fed7aa;background:#fff;color:#7c2d12;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;box-shadow:0 5px 14px rgba(124,45,18,.06);cursor:pointer}.msColorBtn.selected{background:#dc2626;color:#fff;border-color:#dc2626;box-shadow:0 10px 20px rgba(220,38,38,.20)}.msCartItem{position:relative;align-items:center}.msCartBody{flex:1;min-width:0}.msCartDelete{background:#fee2e2!important;color:#991b1b!important;border:1px solid #fecaca!important;border-radius:999px!important;padding:7px 9px!important;font-size:10px!important;font-weight:900!important;align-self:center}.msRequired{display:inline-block;margin-left:6px;background:#dc2626;color:#fff;border-radius:999px;padding:2px 6px;font-size:10px}.msRequiredText{margin-top:9px;background:#fff1f2;color:#be123c;border:1px solid #fecdd3;border-radius:14px;padding:10px 11px;font-size:13px;font-weight:900;line-height:1.5}.msUploadBoxBtn{display:block;cursor:pointer}.msUploadBoxBtn input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.msStatusPill{font-size:11px;background:#dcfce7;color:#166534;border:1px solid #bbf7d0;border-radius:999px;padding:4px 8px;font-weight:900}.msWhatsAppBtn{width:100%;margin-top:10px;background:#16a34a!important;color:#fff!important;border:0!important;border-radius:14px!important;padding:11px 12px!important;font-weight:900!important;box-shadow:0 12px 22px rgba(22,163,74,.22)}.msWhatsAppBtn:before{content:"☎ ";font-weight:900}@media(max-width:480px){.msLoginBtn{font-size:8.5px!important;padding:5px 6px!important}.msCartDelete{font-size:9px!important;padding:6px 7px!important}.msColorBtn{font-size:11px;padding:7px 10px}}


/* V10: bigger top-left logo, smaller slogan */
.msLogoLong{height:66px!important;max-width:310px!important;object-fit:contain!important;background:transparent!important;flex-shrink:0!important}
.msLogoLong.large{height:78px!important;max-width:365px!important}
.msLogoSq{width:62px!important;height:62px!important;object-fit:contain!important;background:transparent!important;flex-shrink:0!important}
.msLogoSlogan{font-size:8.5px!important;max-width:62px!important;flex-basis:62px!important;line-height:1.05!important;letter-spacing:0!important;text-shadow:0 0 8px rgba(255,255,255,.25),0 4px 10px rgba(0,0,0,.22)!important}
.msLogoSlogan:before{width:26px!important;margin-bottom:1px!important}
.msBrandLogoArea{gap:5px!important;align-items:center!important}
.msTop{min-height:84px!important}
@media(max-width:480px){.msLogoLong{height:58px!important;max-width:210px!important}.msLogoLong.large{height:68px!important;max-width:238px!important}.msLogoSq{width:56px!important;height:56px!important}.msLogoSlogan{font-size:7.2px!important;max-width:46px!important;flex-basis:46px!important}.msTop{min-height:80px!important}.msBrandLogoArea{gap:4px!important}.msLoginBtn{font-size:8px!important;padding:5px 6px!important}}

/* V11: member registration, checkout, receipts, notifications, 20% larger slogan */
.msLogoSlogan{font-size:10.2px!important;max-width:74px!important;flex-basis:74px!important;line-height:1.08!important}
@media(max-width:480px){.msLogoSlogan{font-size:8.7px!important;max-width:56px!important;flex-basis:56px!important}}
.msInputHint{font-size:11px;color:#64748b;line-height:1.45;margin-top:6px}.msTotalLine{border-top:1px solid #e5e7eb;margin-top:10px;padding-top:10px;font-size:16px}.msGapTop{margin-top:10px}.msTwoBtns{margin:8px 0}.msCheckLine{display:flex!important;align-items:center;gap:8px}.msCheckLine input{width:auto!important}.msOrderMini{display:flex;justify-content:space-between;gap:8px;border-top:1px solid #eef2f7;padding:8px 0;font-size:12px}.msOrderMini b{color:#dc2626}.msBtnFull:disabled{opacity:.45;cursor:not-allowed}.msFormCard input[type="checkbox"]{width:auto}.msReceiptBox b{display:block;margin-bottom:5px;color:#111827}.msReceiptBox div{line-height:1.55;text-align:left}.msFormCard textarea[data-checkout-field="address"]{min-height:100px}

/* Admin V11: collapsible order rows and notification settings */
.orderDetailsCard{background:#fff;border:1px solid var(--line);border-radius:18px;margin-bottom:12px;box-shadow:0 8px 22px rgba(15,23,42,.04);overflow:hidden}.orderDetailsCard summary{list-style:none;cursor:pointer;padding:14px 16px;display:grid;grid-template-columns:1.05fr .8fr .8fr .7fr 120px;gap:12px;align-items:center}.orderDetailsCard summary::-webkit-details-marker{display:none}.orderDetailsCard summary:hover{background:#f8fafc}.orderDetailsCard[open] summary{border-bottom:1px solid var(--line);background:#f8fafc}.orderSummaryId{font-weight:900;font-size:15px}.orderSummaryText{font-size:12px;color:#64748b;line-height:1.35}.orderStatusBadge{display:inline-block;background:#eef2ff;color:#3730a3;border:1px solid #c7d2fe;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:900}.orderPaidBadge{display:inline-block;background:#dcfce7;color:#166534;border:1px solid #bbf7d0;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:900}.orderDetailsBody{padding:16px}.notifyGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.notifyCard{border:1px solid var(--line);background:#fff;border-radius:18px;padding:14px}.notifyCard h4{margin:0 0 8px}.notifySwitch{display:flex;gap:8px;align-items:center;font-weight:900;font-size:13px;margin-bottom:8px}.notifySwitch input{width:auto}.memberRuleBox{display:grid;grid-template-columns:1fr 1fr;gap:12px}.memberRuleBox .card{margin-bottom:0}@media(max-width:900px){.orderDetailsCard summary{grid-template-columns:1fr;gap:6px}.notifyGrid,.memberRuleBox{grid-template-columns:1fr}}
/* V12 coupon/order sync styles */
.msCouponChoice{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;padding:12px;border-radius:16px;border:1px solid #e5e7eb;background:#fff;color:#111827;text-align:left;font-weight:800}.msCouponChoice span{display:flex;flex-direction:column;gap:3px}.msCouponChoice small{font-size:11px;color:#64748b;font-weight:700;line-height:1.35}.msCouponChoice strong{white-space:nowrap;background:#111827;color:#facc15;border-radius:999px;padding:6px 9px;font-size:12px}.msCouponChoice.selected{border-color:#dc2626;box-shadow:0 0 0 2px rgba(220,38,38,.08)}.msCouponChoice:disabled{opacity:.55}.msSmallLink{border:0;background:transparent;color:#2563eb;font-weight:900;padding:4px 0}.msCouponCard{background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:16px;margin:12px 14px;box-shadow:0 10px 22px rgba(15,23,42,.04)}.msCouponCard h3{margin:10px 0 6px}.msCouponCard p{font-size:13px;color:#374151;margin:4px 0}.msCouponCodeBig{display:inline-block;background:#111827;color:#facc15;border-radius:999px;padding:8px 12px;font-family:monospace;font-weight:900;letter-spacing:.4px}.msBetween.sale{color:#dc2626;font-weight:900}.msCartBody{flex:1;min-width:0}.msCartDelete{align-self:center;border:0;border-radius:12px;background:#ef4444;color:#fff;padding:9px 10px;font-size:11px;font-weight:900}

/* V13: cart quantity controls, gift in order, formal e-receipt, one-time coupon visual states */
.msQtyRow{display:inline-flex;align-items:center;gap:6px;margin:7px 0 5px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:999px;padding:4px}
.msQtyRow button{width:26px;height:26px;border:0;border-radius:999px;background:#111827;color:#fff;font-weight:900;line-height:1;display:grid;place-items:center}
.msQtyRow input{width:46px;border:0;background:transparent;text-align:center;font-weight:900;color:#111827;font-size:13px;outline:none}
.msGiftCard{margin:12px 0;background:linear-gradient(135deg,#fff7ed,#fef3c7);border:1px solid #fed7aa;border-radius:18px;padding:13px;display:flex;gap:12px;align-items:center;color:#7c2d12;box-shadow:0 10px 24px rgba(251,146,60,.12)}
.msGiftIcon{width:42px;height:42px;border-radius:14px;background:#dc2626;color:#fff;display:grid;place-items:center;font-size:22px;box-shadow:0 10px 20px rgba(220,38,38,.18)}
.msGiftCard b{display:block;color:#9a3412;margin-bottom:2px}.msGiftCard small{display:block;color:#92400e;margin-top:3px;line-height:1.35}
.msGiftMini{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-top:8px;padding:8px 10px;border-radius:14px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:12px}.msGiftMini b{font-size:12px;text-align:right}
.msCouponChoice.used,.msCouponCard.used{opacity:.62;filter:grayscale(.15)}.msCouponChoice.used strong{background:#e5e7eb;color:#6b7280}.msCouponCard button:disabled{opacity:.45;cursor:not-allowed}
.msReceiptFormal{background:#fff;border:1px solid #e5e7eb;border-radius:22px;margin:12px 14px;overflow:hidden;box-shadow:0 14px 34px rgba(15,23,42,.07)}
.msReceiptHeader{background:linear-gradient(135deg,#111827,#374151);color:#fff;padding:15px;display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.msReceiptHeader b{display:block;font-size:15px}.msReceiptHeader small{display:block;font-size:10px;color:#cbd5e1;margin-top:3px;letter-spacing:.8px}.msReceiptHeader span{background:#dcfce7;color:#166534;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:900;white-space:nowrap}
.msReceiptMeta{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:12px 14px;border-bottom:1px dashed #cbd5e1}.msReceiptMeta small{display:block;color:#64748b;font-size:10px;margin-bottom:2px}.msReceiptMeta b{font-size:11px;color:#111827;word-break:break-word}
.msReceiptCustomer{padding:12px 14px;border-bottom:1px solid #eef2f7}.msReceiptCustomer b{font-size:12px}.msReceiptCustomer p{margin:5px 0 0;color:#475569;font-size:12px;line-height:1.45}
.msReceiptTable{padding:4px 14px}.msReceiptRow{display:grid;grid-template-columns:1fr 42px 58px;gap:8px;align-items:center;border-bottom:1px solid #eef2f7;padding:10px 0}.msReceiptRow b{font-size:12px}.msReceiptRow small{display:block;font-size:10.5px;color:#64748b;margin-top:3px;line-height:1.35}.msReceiptRow span{text-align:center;font-size:12px;color:#475569}.msReceiptRow strong{text-align:right;font-size:12px}.msReceiptRow.gift{background:#fffbeb;margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:12px;color:#92400e}
.msReceiptTotals{padding:10px 14px 14px}.msReceiptTotals div{display:flex;justify-content:space-between;margin:6px 0;font-size:12px;color:#374151}.msReceiptTotals .sale{color:#dc2626;font-weight:900}.msReceiptTotals .grand{border-top:1px solid #e5e7eb;padding-top:10px;margin-top:10px;font-size:15px;color:#111827}.msReceiptNote{margin:0;padding:0 14px 14px;color:#64748b;font-size:11px;line-height:1.45}
.orderItem.giftRow{background:#fffbeb;border-color:#fde68a;color:#92400e}.orderItem.giftRow b{color:#92400e}
@media(max-width:480px){.msQtyRow button{width:24px;height:24px}.msQtyRow input{width:40px}.msReceiptMeta{grid-template-columns:1fr}.msReceiptRow{grid-template-columns:1fr 34px 52px}.msGiftMini{align-items:flex-start;flex-direction:column}.msGiftMini b{text-align:left}}

/* V14: member login/register colour buttons, home layout, warranty required fixes */
.msMemberEntryCard{background:linear-gradient(135deg,#ffffff,#f8fafc)!important;box-shadow:0 14px 32px rgba(15,23,42,.07)}
.msMemberActionGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.msActionBtn{border:0;border-radius:16px;padding:13px 10px;color:#fff;font-weight:900;font-size:14px;box-shadow:0 12px 24px rgba(15,23,42,.14)}.msActionBtn.login{background:linear-gradient(135deg,#2563eb,#06b6d4)}.msActionBtn.register{background:linear-gradient(135deg,#dc2626,#f97316)}.msActionBtn:active{transform:scale(.98)}
.msBtnLight{background:linear-gradient(135deg,#fff7ed,#fef3c7)!important;border-color:#fed7aa!important;color:#7c2d12!important;box-shadow:0 8px 18px rgba(251,146,60,.10)}.msBtnLight:hover{filter:saturate(1.04)}.msBtnFull:disabled{opacity:.45;filter:grayscale(.2);cursor:not-allowed}
.msFeatureGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.msFeatureSlot{min-width:0}.msFeatureSlotTitle{font-size:12px;font-weight:900;color:#111827;margin:0 0 8px;padding:7px 10px;border-radius:999px;background:linear-gradient(90deg,var(--accent,#facc15),rgba(250,204,21,.12));box-shadow:0 7px 16px rgba(15,23,42,.05)}.msFeatureSlot .msAccountCard{margin:0!important;min-height:170px;display:grid;place-items:center;text-align:center}.msFeatureSlot .msCard{height:100%}
.msCouponExpiry{font-weight:800;color:#fde68a!important}.msCouponCard .msTagline{font-weight:700;color:#475569}.msFormCard .msBtnFull[disabled]+.msInputHint{color:#dc2626}
@media(max-width:360px){.msMemberActionGrid{grid-template-columns:1fr}.msFeatureGrid{gap:8px}.msFeatureSlotTitle{font-size:11px;padding:6px 8px}.msActionBtn{font-size:13px}}

/* V15 final overrides */
.msLoginBtn{font-size:12px!important;padding:7px 11px!important;letter-spacing:.2px!important}
.msReceiptTextBox{background:#ecfdf5!important;border-color:#bbf7d0!important;color:#166534!important;text-align:left!important}
.msReceiptTextBox b{display:block;color:#065f46;margin-bottom:2px}.msReceiptTextBox small{display:block;color:#047857;margin-top:3px;line-height:1.35}
@media(max-width:480px){.msLoginBtn{font-size:9.6px!important;padding:6px 8px!important}.msBrandDecor{margin-left:auto}}

/* v16 updates: coupon stack, pickup, color warning, warranty certificate, payment prompt */
.msCouponStack{margin:10px 0 4px}.msCouponStack .msCoupon{margin:10px 14px;background:linear-gradient(135deg,#111827,#1f2937);box-shadow:0 12px 26px rgba(15,23,42,.16)}.msCouponStack .msCoupon:nth-child(2){background:linear-gradient(135deg,#7f1d1d,#dc2626)}.msCouponStack .msCoupon:nth-child(3){background:linear-gradient(135deg,#0f172a,#0369a1)}.msCouponStack .msCoupon button{box-shadow:0 6px 14px rgba(0,0,0,.12)}
.msColorSpec.needColor{background:#fff7ed!important;border:1px solid #fb923c!important;box-shadow:0 0 0 3px rgba(251,146,60,.12)}.msColorWarning{font-size:12px;font-weight:900;color:#c2410c;line-height:1.45;margin-top:8px;background:#ffedd5;border:1px solid #fed7aa;border-radius:12px;padding:8px 10px}.msColorWarning:before{content:"⚠ ";font-weight:900}.msColorSpec.needColor .msColorButtons{animation:msNudge .35s ease-in-out 1}@keyframes msNudge{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.msDeliveryOptions{display:grid;grid-template-columns:1fr;gap:10px;margin:8px 0 12px}.msDeliveryOptions button{border:1px solid #e5e7eb;background:#fff;border-radius:16px;padding:12px;text-align:left;color:#111827;box-shadow:0 8px 18px rgba(15,23,42,.04)}.msDeliveryOptions button b{display:block;font-size:13px}.msDeliveryOptions button small{display:block;color:#64748b;font-size:11px;line-height:1.4;margin-top:4px}.msDeliveryOptions button.active{border-color:#111827;background:linear-gradient(135deg,#111827,#334155);color:#fff}.msDeliveryOptions button.active small{color:#e5e7eb}.msPickupBox{background:#f8fafc;border:1px solid #cbd5e1;border-radius:16px;padding:12px;margin:8px 0 6px}.msPickupBox b{display:block;color:#111827;font-size:13px}.msPickupBox p{margin:6px 0 0;color:#334155;font-size:12px;line-height:1.5}
.msWarrantyCert{margin:12px 14px;background:linear-gradient(135deg,#0f172a,#1e3a8a 58%,#facc15);border-radius:22px;color:#fff;padding:16px;box-shadow:0 18px 36px rgba(30,58,138,.20);position:relative;overflow:hidden}.msWarrantyCert:after{content:"";position:absolute;right:-35px;top:-35px;width:120px;height:120px;border-radius:50%;border:1px solid rgba(255,255,255,.35);box-shadow:0 0 0 14px rgba(255,255,255,.05)}.msCertTop{display:flex;justify-content:space-between;gap:8px;align-items:center;position:relative;z-index:1}.msCertTop span{font-size:10px;letter-spacing:1.4px;font-weight:900;color:#fde68a}.msCertTop b{background:#dcfce7;color:#166534;border-radius:999px;padding:4px 8px;font-size:11px}.msWarrantyCert h2{margin:10px 0 4px;font-size:22px;position:relative;z-index:1}.msCertNo{font-family:monospace;font-weight:900;letter-spacing:.6px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);display:inline-block;border-radius:999px;padding:6px 10px;margin-bottom:10px;position:relative;z-index:1}.msCertGrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;position:relative;z-index:1}.msCertGrid div{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:9px;min-width:0}.msCertGrid small{display:block;color:#cbd5e1;font-size:10px;margin-bottom:3px}.msCertGrid b{display:block;color:#fff;font-size:12px;line-height:1.35;word-break:break-word}.msWarrantyCert p{margin:10px 0 0;color:#e5e7eb;font-size:11px;line-height:1.45;position:relative;z-index:1}
.msModalOverlay{position:absolute;inset:0;z-index:80;background:rgba(15,23,42,.62);backdrop-filter:blur(6px);display:grid;place-items:center;padding:18px}.msModalCard{background:#fff;border-radius:24px;padding:20px;box-shadow:0 30px 80px rgba(15,23,42,.35);max-width:330px;width:100%;text-align:center}.msModalIcon{width:62px;height:62px;margin:0 auto 10px;border-radius:20px;background:linear-gradient(135deg,#111827,#facc15);display:grid;place-items:center;font-size:30px;color:#fff}.msModalCard h2{margin:6px 0 8px}.msModalCard p{font-size:13px;line-height:1.55;color:#475569;margin:0 0 14px}
@media(max-width:480px){.msCertGrid{grid-template-columns:1fr}.msCouponStack .msCoupon{align-items:flex-start}.msCouponStack .msCoupon button{padding:7px 9px;font-size:12px}.msModalOverlay{position:fixed}}

/* V17 fixes */
.msBtnDangerSoft{width:100%;border:1px solid #fecaca;border-radius:16px;background:#fff1f2;color:#be123c;padding:13px;font-weight:900;font-size:15px}
.msCoupon button:disabled{opacity:.55;background:#e5e7eb!important;color:#6b7280!important;cursor:not-allowed}
.msProductSection{margin-top:8px}.msFeatureGrid+.msSection,.msProductSection+.msProductSection{margin-top:14px}.msSectionTitle{display:flex;align-items:center;gap:10px;margin:8px 0 12px}.msSectionTitle h2{line-height:1.25;margin:0!important}.msFeatureSlotTitle{line-height:1.2;margin-bottom:10px!important}
.msWarrantyListIntro{background:linear-gradient(135deg,#fff,#eef2ff);border-color:#c7d2fe}.msWarrantyCompact{margin:10px 14px;background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 10px 22px rgba(15,23,42,.05);overflow:hidden}.msWarrantyCompactRow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:11px 12px}.msWarrantyCompactRow b{display:block;font-family:monospace;font-size:13px;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.msWarrantyCompactRow small{display:block;margin-top:3px;font-size:11px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.msWarrantyCompactRow button{border:0;border-radius:999px;background:#111827;color:#facc15;font-weight:900;font-size:12px;padding:7px 10px}.msWarrantyFull{border-top:1px solid #e5e7eb;padding:12px;background:#f8fafc}.msWarrantyFull p{margin:6px 0;font-size:12px;color:#334155;line-height:1.5}.msCertMiniTitle{display:inline-block;background:#111827;color:#facc15;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:900;letter-spacing:.7px;margin-bottom:8px}.msWarrantyFull .msWhatsAppBtn{margin-top:10px}.msFormCard h3{margin:0 0 6px;font-size:18px}
@media(max-width:480px){.msWarrantyCompactRow{grid-template-columns:minmax(0,1fr) auto;gap:7px}.msWarrantyCompactRow .msStatusPill{display:none}.msWarrantyCompactRow button{padding:7px 9px}.msProductSection{margin-top:10px}}


/* V18: checkout wording and refined warranty certificate cards */
.msWarrantyCompact{
  margin:12px 14px!important;
  background:linear-gradient(135deg,#ffffff 0%,#fff7f7 45%,#f8fafc 100%)!important;
  border:1px solid rgba(220,38,38,.20)!important;
  border-left:5px solid #dc2626!important;
  border-radius:20px!important;
  box-shadow:0 12px 28px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.8)!important;
  overflow:hidden!important;
}
.msWarrantyCompactRow{
  grid-template-columns:minmax(0,1fr) auto auto!important;
  padding:12px 12px 9px!important;
  background:linear-gradient(90deg,rgba(255,255,255,.92),rgba(254,242,242,.55))!important;
}
.msWarrantyLabel{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  margin-bottom:5px!important;
  padding:3px 8px!important;
  border-radius:999px!important;
  background:#111827!important;
  color:#facc15!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:.7px!important;
  box-shadow:0 6px 12px rgba(17,24,39,.12)!important;
}
.msWarrantyCompactRow b{font-size:12.5px!important;letter-spacing:.2px!important;color:#111827!important}
.msWarrantyCompactRow small{font-size:11px!important;color:#475569!important}
.msWarrantyOpenBtn,.msWarrantyCompactRow button{
  background:#dc2626!important;
  color:#fff!important;
  border:0!important;
  border-radius:999px!important;
  font-weight:900!important;
  font-size:12px!important;
  padding:8px 12px!important;
  box-shadow:0 8px 16px rgba(220,38,38,.24)!important;
}
.msWarrantyQuickWa{
  padding:0 12px 12px!important;
  background:linear-gradient(90deg,rgba(255,255,255,.92),rgba(254,242,242,.45))!important;
}
.msWarrantyQuickWa span{display:block;color:#64748b;font-size:11px;font-weight:800;padding:8px 2px 0}
.msWhatsAppLineBtn{
  width:100%!important;
  border:1px solid rgba(22,163,74,.25)!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#16a34a,#22c55e)!important;
  color:#fff!important;
  padding:9px 12px!important;
  font-weight:900!important;
  box-shadow:0 10px 18px rgba(22,163,74,.20)!important;
}
.msWhatsAppLineBtn:before{content:"☎ ";font-weight:900}
.msWarrantyFull{
  border-top:1px solid rgba(220,38,38,.16)!important;
  padding:12px!important;
  background:rgba(248,250,252,.96)!important;
}
.msCertMiniTitle{background:#dc2626!important;color:#fff!important}
.msFormCard textarea[data-checkout-field="address"]::placeholder{color:transparent!important}

/* V19: grouped order warranty certificate + lower recommended section */
.msRecommendSection{margin-top:26px!important;padding-top:18px!important}
.msRecommendSection .msSectionTitle{margin-top:14px!important;margin-bottom:14px!important}
.msWarrantyItems{display:grid;gap:8px;margin:10px 0 12px}
.msWarrantyItems div{background:#fff;border:1px solid #e5e7eb;border-radius:13px;padding:9px 10px}
.msWarrantyItems b{display:block;font-size:12px;color:#111827;margin-bottom:3px;line-height:1.35}
.msWarrantyItems small{display:block;font-size:11px;color:#64748b;line-height:1.4}

/* V21: Official warranty certificate UI */
.msWarrantyOfficialCard{
  position:relative!important;
  margin:14px 14px!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(241,245,249,.96)),
    radial-gradient(circle at 18% 0%,rgba(22,58,112,.10),transparent 42%)!important;
  border:1px solid rgba(22,58,112,.22)!important;
  box-shadow:0 16px 34px rgba(15,23,42,.10), inset 0 1px 0 rgba(255,255,255,.88)!important;
}
.msWarrantyOfficialCard:before{
  content:""!important;
  position:absolute!important;
  left:0!important;top:0!important;bottom:0!important;width:6px!important;
  background:linear-gradient(180deg,#163A70,#64748b,#d9232e)!important;
}
.msWarrantyOfficialCard:after{
  content:""!important;
  position:absolute!important;
  right:-42px!important;top:-42px!important;width:120px!important;height:120px!important;
  border-radius:999px!important;
  border:1px solid rgba(22,58,112,.10)!important;
  background:radial-gradient(circle,rgba(201,211,224,.30),rgba(255,255,255,0) 64%)!important;
  pointer-events:none!important;
}
.msWarrantyOfficialTop{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)!important;
  gap:8px!important;
  padding:14px 12px 10px 18px!important;
  align-items:center!important;
}
.msWarrantyRibbon{
  grid-column:1 / 2!important;
  display:inline-flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:2px!important;
}
.msWarrantyRibbon span{
  display:inline-flex!important;
  padding:4px 9px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#163A70,#0f172a)!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:1.1px!important;
  box-shadow:0 8px 16px rgba(22,58,112,.20)!important;
}
.msWarrantyRibbon b{
  color:#163A70!important;
  font-size:15px!important;
  font-weight:950!important;
  letter-spacing:.6px!important;
}
.msWarrantySummaryMain{
  grid-column:1 / 2!important;
  min-width:0!important;
}
.msWarrantySummaryMain b{
  display:block!important;
  color:#0f172a!important;
  font-size:13px!important;
  font-weight:950!important;
  letter-spacing:.4px!important;
}
.msWarrantySummaryMain small{
  display:block!important;
  margin-top:3px!important;
  color:#475569!important;
  font-size:11px!important;
  line-height:1.35!important;
}
.msWarrantyValidUntil{
  grid-column:2 / 3!important;
  grid-row:1 / 3!important;
  justify-self:end!important;
  min-width:92px!important;
  text-align:center!important;
  padding:8px 8px!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,#ffffff,#eef2ff)!important;
  border:1px solid rgba(22,58,112,.18)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 9px 18px rgba(15,23,42,.07)!important;
}
.msWarrantyValidUntil span{
  display:block!important;
  color:#64748b!important;
  font-size:8px!important;
  font-weight:950!important;
  letter-spacing:.9px!important;
}
.msWarrantyValidUntil b{
  display:block!important;
  color:#163A70!important;
  font-size:11px!important;
  font-weight:950!important;
  margin-top:2px!important;
}
.msWarrantyValidUntil small{
  display:block!important;
  margin-top:3px!important;
  color:#b45309!important;
  font-size:8.5px!important;
  font-weight:900!important;
  line-height:1.15!important;
}
.msCertStatusStamp{
  position:absolute!important;
  right:12px!important;
  bottom:-9px!important;
  z-index:2!important;
  transform:rotate(-3deg)!important;
  padding:4px 9px!important;
  border-radius:999px!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.5px!important;
  border:1px solid rgba(255,255,255,.75)!important;
  box-shadow:0 8px 14px rgba(15,23,42,.15)!important;
}
.msCertStatusStamp.active{background:#19A55A!important;color:#fff!important}
.msCertStatusStamp.warning{background:#f59e0b!important;color:#fff!important}
.msCertStatusStamp.expired{background:#64748b!important;color:#fff!important}
.msWarrantyOfficialActions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:9px!important;
  padding:8px 12px 13px 18px!important;
  background:linear-gradient(90deg,rgba(248,250,252,.92),rgba(255,255,255,.96))!important;
  border-top:1px solid rgba(22,58,112,.08)!important;
}
.msWarrantyNoWa{
  color:#64748b!important;
  font-size:11px!important;
  font-weight:850!important;
  align-self:center!important;
}
.msWarrantyOpenBtn{
  background:linear-gradient(135deg,#d9232e,#b91c1c)!important;
  color:#fff!important;
  border:0!important;
  border-radius:999px!important;
  font-weight:950!important;
  font-size:12px!important;
  padding:9px 15px!important;
  box-shadow:0 10px 20px rgba(217,35,46,.25)!important;
}
.msWarrantyFullOfficial{
  position:relative!important;
  margin:0 10px 12px 16px!important;
  padding:12px!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#fff,#f8fafc)!important;
  border:1px solid rgba(22,58,112,.14)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.80)!important;
}
.msCertHeader{
  display:flex!important;
  gap:11px!important;
  align-items:center!important;
  justify-content:center!important;
  padding:14px 8px!important;
  margin-bottom:12px!important;
  border-radius:18px!important;
  background:
    linear-gradient(135deg,rgba(22,58,112,.10),rgba(201,211,224,.28)),
    linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent)!important;
  border:1px solid rgba(22,58,112,.12)!important;
  text-align:center!important;
}
.msCertSeal{
  flex:0 0 auto!important;
  width:44px!important;height:44px!important;border-radius:999px!important;
  display:grid!important;place-items:center!important;
  background:linear-gradient(135deg,#163A70,#0f172a)!important;
  color:#facc15!important;
  font-weight:950!important;
  font-size:21px!important;
  box-shadow:0 10px 22px rgba(22,58,112,.25), inset 0 0 0 2px rgba(255,255,255,.18)!important;
}
.msCertHeader h2{
  margin:0!important;
  font-family:Georgia,'Times New Roman',serif!important;
  color:#163A70!important;
  font-size:18px!important;
  letter-spacing:1.4px!important;
  font-weight:950!important;
  line-height:1.15!important;
}
.msCertHeader h3{
  margin:3px 0 0!important;
  color:#0f172a!important;
  font-size:14px!important;
  font-weight:950!important;
  letter-spacing:2px!important;
}
.msCertHeader p{
  margin:7px 0 0!important;
  color:#64748b!important;
  font-size:10.5px!important;
  line-height:1.45!important;
}
.msCertSection{
  margin-top:11px!important;
  border-radius:16px!important;
  border:1px solid rgba(148,163,184,.22)!important;
  overflow:hidden!important;
  background:#fff!important;
}
.msCertSectionTitle{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  padding:8px 10px!important;
  background:linear-gradient(90deg,#163A70,#334155)!important;
  color:#fff!important;
}
.msCertSectionTitle span{
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:1px!important;
  opacity:.92!important;
}
.msCertSectionTitle b{
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.6px!important;
}
.msCertSectionBody{padding:10px!important}
.msCertFieldGrid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
}
.msCertField{
  padding:8px 9px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#f8fafc,#fff)!important;
  border:1px solid rgba(226,232,240,.95)!important;
}
.msCertField small{
  display:block!important;
  color:#64748b!important;
  font-size:9.5px!important;
  font-weight:900!important;
  margin-bottom:3px!important;
}
.msCertField b{
  display:block!important;
  color:#0f172a!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1.35!important;
  word-break:break-word!important;
}
.msCertProductList{display:grid!important;gap:8px!important}
.msCertProductRow{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:start!important;
  padding:9px!important;
  border-radius:13px!important;
  background:#f8fafc!important;
  border:1px solid rgba(226,232,240,.95)!important;
}
.msCertProductRow > .msCertIndex{
  width:24px!important;height:24px!important;border-radius:999px!important;
  display:grid!important;place-items:center!important;
  background:#163A70!important;color:#fff!important;
  font-size:11px!important;font-weight:950!important;
}
.msCertProductRow b{display:block!important;color:#111827!important;font-size:12px!important;line-height:1.35!important}
.msCertProductRow small{display:block!important;color:#64748b!important;font-size:10.5px!important;margin-top:3px!important;line-height:1.4!important}
.msCertReceipt{
  margin-top:10px!important;
  border-radius:14px!important;
  overflow:hidden!important;
  border:1px solid rgba(226,232,240,.95)!important;
  background:#f8fafc!important;
  text-align:center!important;
}
.msCertReceipt img{display:block!important;width:100%!important;max-height:220px!important;object-fit:contain!important;background:#fff!important}
.msCertReceipt span{display:block!important;padding:8px!important;color:#64748b!important;font-size:11px!important;font-weight:850!important}
.msCertReceiptText{padding:11px!important;text-align:left!important}
.msCertReceiptText b{display:block!important;color:#163A70!important;font-size:13px!important;font-weight:950!important;margin-bottom:4px!important}
.msCertSourceNote,.msCertHelpText{
  margin:9px 0 0!important;
  color:#64748b!important;
  font-size:11px!important;
  line-height:1.5!important;
}
.msCertSupportBtn{margin-top:9px!important;width:100%!important}
@media(max-width:420px){
  .msWarrantyOfficialTop{grid-template-columns:minmax(0,1fr) auto!important;gap:7px!important;padding-right:10px!important}
  .msWarrantyValidUntil{min-width:86px!important;padding:7px 7px!important}
  .msCertFieldGrid{grid-template-columns:1fr!important}
  .msCertHeader{align-items:center!important}
  .msCertHeader h2{font-size:16px!important;letter-spacing:1px!important}
  .msCertSeal{width:38px!important;height:38px!important}
}

/* V22: polished homepage coupon activity cards */
.msHomeCouponStack{
  margin:12px 0 8px!important;
  display:grid!important;
  gap:12px!important;
}
.msHomeCouponStack .msHomeCoupon{
  position:relative!important;
  margin:0 14px!important;
  padding:15px 14px!important;
  border-radius:22px!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:12px!important;
  background:linear-gradient(135deg,#111827 0%,#1e3a8a 52%,#0f172a 100%)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:0 16px 32px rgba(15,23,42,.18), inset 0 1px 0 rgba(255,255,255,.14)!important;
  color:#fff!important;
}
.msHomeCouponStack .msHomeCoupon:nth-child(2){
  background:linear-gradient(135deg,#7f1d1d 0%,#dc2626 55%,#991b1b 100%)!important;
  box-shadow:0 16px 32px rgba(220,38,38,.18), inset 0 1px 0 rgba(255,255,255,.14)!important;
}
.msHomeCoupon:before{
  content:""!important;
  position:absolute!important;
  left:-18px!important;
  top:50%!important;
  width:32px!important;
  height:32px!important;
  transform:translateY(-50%)!important;
  border-radius:999px!important;
  background:#f8fafc!important;
  box-shadow:calc(100vw - 10px) 0 0 #f8fafc!important;
  opacity:.98!important;
}
.msHomeCoupon:after{
  content:""!important;
  position:absolute!important;
  inset:7px!important;
  border-radius:17px!important;
  border:1px dashed rgba(255,255,255,.30)!important;
  pointer-events:none!important;
}
.msCouponShine{
  position:absolute!important;
  right:-38px!important;
  top:-48px!important;
  width:135px!important;
  height:135px!important;
  border-radius:999px!important;
  background:radial-gradient(circle,rgba(250,204,21,.36),rgba(255,255,255,.08) 38%,transparent 68%)!important;
  pointer-events:none!important;
}
.msHomeCoupon:nth-child(2) .msCouponShine{
  background:radial-gradient(circle,rgba(255,255,255,.34),rgba(250,204,21,.13) 42%,transparent 70%)!important;
}
.msCouponInfo{position:relative!important;z-index:1!important;min-width:0!important}
.msCouponActivity{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:4px 8px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.14)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  color:#fde68a!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.5px!important;
  line-height:1.1!important;
  box-shadow:0 8px 16px rgba(0,0,0,.08)!important;
}
.msCouponActivity:before{content:"✦"!important;color:#fff!important;font-size:10px!important;opacity:.9!important}
.msCouponActivity span{
  color:#fff!important;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace!important;
  letter-spacing:.9px!important;
}
.msCouponName{
  margin-top:8px!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:950!important;
  line-height:1.28!important;
  text-shadow:0 2px 10px rgba(0,0,0,.16)!important;
}
.msCouponMeta{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:5px!important;
  margin-top:7px!important;
}
.msCouponMeta span{
  display:inline-flex!important;
  border-radius:999px!important;
  padding:4px 7px!important;
  background:rgba(255,255,255,.14)!important;
  color:#f8fafc!important;
  border:1px solid rgba(255,255,255,.10)!important;
  font-size:10.5px!important;
  font-weight:850!important;
  line-height:1.15!important;
}
.msHomeCoupon .msCouponExpiry{
  margin-top:7px!important;
  color:rgba(255,255,255,.78)!important;
  font-size:10.5px!important;
  font-weight:850!important;
}
.msCouponClaimBtn{
  position:relative!important;
  z-index:1!important;
  background:linear-gradient(135deg,#fff,#fef3c7)!important;
  color:#111827!important;
  border:0!important;
  border-radius:999px!important;
  padding:10px 13px!important;
  font-weight:950!important;
  font-size:12px!important;
  white-space:nowrap!important;
  box-shadow:0 12px 22px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.75)!important;
}
.msCouponClaimBtn:disabled{
  opacity:.62!important;
  background:#e5e7eb!important;
  color:#64748b!important;
  box-shadow:none!important;
}
@media(max-width:420px){
  .msHomeCouponStack .msHomeCoupon{padding:14px 12px!important;gap:9px!important}
  .msCouponActivity{font-size:9.5px!important;padding:4px 7px!important}
  .msCouponName{font-size:13px!important}
  .msCouponClaimBtn{padding:9px 11px!important;font-size:11.5px!important}
}


/* V23: homepage coupon reward amount beside claim button */
.msCouponReward{
  position:relative!important;
  z-index:1!important;
  min-width:62px!important;
  display:flex!important;
  align-items:baseline!important;
  justify-content:center!important;
  gap:3px!important;
  padding:7px 8px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.16)!important;
  border:1px solid rgba(255,255,255,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 18px rgba(0,0,0,.12)!important;
  color:#fff!important;
  transform:rotate(-2deg)!important;
}
.msCouponReward small{
  font-size:12px!important;
  font-weight:950!important;
  color:#fde68a!important;
  line-height:1!important;
}
.msCouponReward strong{
  font-size:22px!important;
  font-weight:1000!important;
  letter-spacing:-.8px!important;
  color:#fff!important;
  line-height:1!important;
  text-shadow:0 2px 0 rgba(0,0,0,.16),0 0 16px rgba(250,204,21,.35)!important;
}
.msHomeCoupon:nth-child(2) .msCouponReward strong{ text-shadow:0 2px 0 rgba(0,0,0,.18),0 0 16px rgba(255,255,255,.35)!important; }
@media(max-width:420px){
  .msHomeCouponStack .msHomeCoupon{grid-template-columns:minmax(0,1fr) auto auto!important;}
  .msCouponReward{min-width:55px!important;padding:6px 7px!important;border-radius:15px!important;}
  .msCouponReward small{font-size:11px!important;}
  .msCouponReward strong{font-size:20px!important;}
}
@media(max-width:360px){
  .msHomeCouponStack .msHomeCoupon{gap:6px!important;padding-left:11px!important;padding-right:10px!important;}
  .msCouponReward{min-width:48px!important;padding:6px 5px!important;}
  .msCouponReward strong{font-size:18px!important;}
  .msCouponClaimBtn{padding:8px 9px!important;font-size:11px!important;}
}


/* A1 bottom bar minimal test */
.msScreen{
  padding-bottom: calc(110px + env(safe-area-inset-bottom)) !important;
}

.msBottom{
  position: sticky !important;
  bottom: 0 !important;
  z-index: 20 !important;
}

/* A2 bottom bar fixed test */
.msBottom{
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 999 !important;
  width: 100% !important;
}

.msScreen{
  padding-bottom: calc(125px + env(safe-area-inset-bottom)) !important;
}

/* C3 luxury homepage coupon section - scoped only to homepage coupons */
.msLuxuryCouponStack{
  display:grid;
  gap:14px;
  margin:12px 14px 6px;
}

.msLuxuryCoupon{
  position:relative;
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  min-height:146px;
  overflow:hidden;
  border-radius:24px;
  background:#fffaf0;
  border:1px solid rgba(180,83,9,.28);
  box-shadow:0 16px 32px rgba(15,23,42,.12);
}

.msLuxuryCoupon::before{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:18px;
  border:1px dashed rgba(146,64,14,.28);
  pointer-events:none;
}

.msLuxuryCouponLeft{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 8px;
  color:#fff;
  background:
    radial-gradient(circle at 20% 15%,rgba(255,255,255,.22),transparent 30%),
    linear-gradient(160deg,#7f1d1d,#b91c1c 56%,#dc2626);
}

.msLuxuryCoupon.navy .msLuxuryCouponLeft{
  background:
    radial-gradient(circle at 20% 15%,rgba(255,255,255,.18),transparent 30%),
    linear-gradient(160deg,#0f172a,#1e3a8a 58%,#111827);
}

.msLuxurySeal{
  font-size:9px;
  font-weight:900;
  letter-spacing:.12em;
  color:#7c2d12;
  background:linear-gradient(135deg,#fff7d6,#facc15);
  border-radius:999px;
  padding:5px 8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 8px 16px rgba(0,0,0,.16);
}

.msLuxuryReward{
  text-align:center;
  line-height:.95;
  color:#fde68a;
  text-shadow:0 2px 10px rgba(0,0,0,.22);
}

.msLuxuryReward span{
  display:block;
  font-size:17px;
  font-weight:900;
  letter-spacing:.08em;
}

.msLuxuryReward b{
  display:block;
  font-size:32px;
  font-weight:1000;
}

.msLuxuryCouponRight{
  position:relative;
  z-index:1;
  padding:16px 14px 14px;
  min-width:0;
}

.msLuxuryCouponTop{
  display:inline-flex;
  align-items:center;
  gap:6px;
  max-width:100%;
  padding:5px 9px;
  border-radius:999px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#7c2d12;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
}

.msLuxuryCouponTop b{
  color:#b91c1c;
  font-size:11px;
}

.msLuxuryCoupon.navy .msLuxuryCouponTop{
  background:#eff6ff;
  border-color:#bfdbfe;
  color:#1e3a8a;
}

.msLuxuryCoupon.navy .msLuxuryCouponTop b{
  color:#1e40af;
}

.msLuxuryCouponTitle{
  margin-top:10px;
  font-size:17px;
  font-weight:950;
  color:#111827;
  line-height:1.25;
}

.msLuxuryCouponSub{
  margin-top:6px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
}

.msLuxuryCouponMeta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}

.msLuxuryCouponMeta span{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  background:#f8fafc;
  border:1px solid #e5e7eb;
  color:#334155;
  font-size:10.5px;
  font-weight:850;
  padding:4px 8px;
}

.msLuxuryClaimBtn{
  width:100%;
  margin-top:10px;
  border:0;
  border-radius:999px;
  padding:10px 12px;
  background:linear-gradient(135deg,#7f1d1d,#dc2626);
  color:#fff;
  font-size:13px;
  font-weight:950;
  box-shadow:0 10px 18px rgba(220,38,38,.18);
}

.msLuxuryCoupon.navy .msLuxuryClaimBtn{
  background:linear-gradient(135deg,#0f172a,#1e40af);
  box-shadow:0 10px 18px rgba(30,64,175,.18);
}

.msLuxuryClaimBtn:disabled{
  opacity:.55;
  filter:grayscale(.2);
}

@media(max-width:380px){
  .msLuxuryCoupon{
    grid-template-columns:86px minmax(0,1fr);
  }
  .msLuxuryReward b{
    font-size:27px;
  }
  .msLuxuryCouponRight{
    padding:14px 12px 12px;
  }
  .msLuxuryCouponTitle{
    font-size:15px;
  }
}

/* C3.1 luxury coupon visual upgrade - richer colour, more premium details */
.msLuxuryCouponStack{
  gap:16px !important;
  margin:14px 14px 8px !important;
}

.msLuxuryCoupon{
  grid-template-columns:108px minmax(0,1fr) !important;
  min-height:158px !important;
  border-radius:28px !important;
  border:1px solid rgba(212,175,55,.55) !important;
  background:
    radial-gradient(circle at 86% 10%, rgba(250,204,21,.28), transparent 30%),
    linear-gradient(135deg,#fffdf5 0%,#fff4d6 44%,#fffaf0 100%) !important;
  box-shadow:
    0 22px 42px rgba(15,23,42,.16),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
}

.msLuxuryCoupon::before{
  inset:9px !important;
  border-radius:21px !important;
  border:1px dashed rgba(180,83,9,.42) !important;
}

.msLuxuryCoupon::after{
  content:"";
  position:absolute;
  right:-38px;
  top:-42px;
  width:150px;
  height:150px;
  border-radius:999px;
  background:
    radial-gradient(circle, rgba(250,204,21,.38), rgba(250,204,21,.12) 44%, transparent 70%);
  pointer-events:none;
}

.msLuxuryCouponLeft{
  background:
    linear-gradient(135deg, rgba(255,255,255,.18), transparent 34%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.08) 0 8px, transparent 8px 16px),
    linear-gradient(160deg,#5f0f1a 0%,#991b1b 46%,#dc2626 100%) !important;
  border-right:1px solid rgba(250,204,21,.42) !important;
}

.msLuxuryCoupon.navy{
  border-color:rgba(165,180,252,.60) !important;
  background:
    radial-gradient(circle at 86% 10%, rgba(99,102,241,.26), transparent 30%),
    linear-gradient(135deg,#f8fbff 0%,#eef2ff 48%,#fffaf0 100%) !important;
}

.msLuxuryCoupon.navy .msLuxuryCouponLeft{
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), transparent 34%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.07) 0 8px, transparent 8px 16px),
    linear-gradient(160deg,#020617 0%,#1e1b4b 44%,#3730a3 100%) !important;
  border-right:1px solid rgba(250,204,21,.38) !important;
}

.msLuxurySeal{
  transform:rotate(-8deg) !important;
  font-family:Georgia,"Times New Roman","Microsoft JhengHei",serif !important;
  font-size:9.5px !important;
  color:#7c2d12 !important;
  border:1px solid rgba(255,255,255,.75) !important;
  background:
    radial-gradient(circle at 28% 20%, #ffffff, #fff7d6 30%, #facc15 70%, #b45309) !important;
  box-shadow:
    0 10px 18px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.msLuxuryReward{
  width:82px !important;
  min-height:78px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:22px !important;
  background:
    radial-gradient(circle at 35% 20%, rgba(255,255,255,.30), transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.14),rgba(250,204,21,.10)) !important;
  border:1px solid rgba(250,204,21,.34) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25) !important;
}

.msLuxuryReward span{
  font-size:15px !important;
  color:#fff7d6 !important;
  letter-spacing:.16em !important;
  margin-bottom:-6px !important;
}

.msLuxuryReward b{
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:33px !important;
  letter-spacing:-1.2px !important;
  color:#fde68a !important;
  text-shadow:
    0 2px 0 rgba(124,45,18,.45),
    0 0 16px rgba(250,204,21,.45) !important;
}

.msLuxuryCouponRight{
  padding:17px 15px 14px !important;
}

.msLuxuryCouponTop{
  background:
    linear-gradient(135deg,#fff7ed,#ffedd5) !important;
  border:1px solid rgba(217,119,6,.32) !important;
  color:#7c2d12 !important;
  box-shadow:0 8px 16px rgba(180,83,9,.08) !important;
}

.msLuxuryCouponTop span{
  font-size:9.5px !important;
  opacity:.9 !important;
}

.msLuxuryCouponTop b{
  font-family:Georgia,"Times New Roman",serif !important;
  font-size:12px !important;
  letter-spacing:.03em !important;
  color:#991b1b !important;
}

.msLuxuryCoupon.navy .msLuxuryCouponTop{
  background:linear-gradient(135deg,#eef2ff,#dbeafe) !important;
  border-color:rgba(59,130,246,.28) !important;
}

.msLuxuryCoupon.navy .msLuxuryCouponTop b{
  color:#312e81 !important;
}

.msLuxuryCouponTitle{
  font-size:18px !important;
  font-weight:1000 !important;
  letter-spacing:-.02em !important;
  color:#0f172a !important;
  text-shadow:0 1px 0 rgba(255,255,255,.8) !important;
}

.msLuxuryCouponTitle::after{
  content:"";
  display:block;
  width:62px;
  height:2px;
  margin-top:7px;
  border-radius:999px;
  background:linear-gradient(90deg,#b45309,#facc15,transparent);
}

.msLuxuryCoupon.navy .msLuxuryCouponTitle::after{
  background:linear-gradient(90deg,#1e3a8a,#818cf8,transparent);
}

.msLuxuryCouponSub{
  color:#475569 !important;
  font-size:12.5px !important;
  font-weight:900 !important;
}

.msLuxuryCouponMeta span{
  background:rgba(255,255,255,.72) !important;
  border-color:rgba(180,83,9,.20) !important;
  color:#334155 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82) !important;
}

.msLuxuryClaimBtn{
  background:
    linear-gradient(135deg,#7f1d1d 0%,#b91c1c 46%,#ef4444 100%) !important;
  border:1px solid rgba(250,204,21,.35) !important;
  box-shadow:
    0 12px 22px rgba(220,38,38,.24),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
  letter-spacing:.04em !important;
}

.msLuxuryCoupon.navy .msLuxuryClaimBtn{
  background:
    linear-gradient(135deg,#020617 0%,#1e3a8a 50%,#4338ca 100%) !important;
  border-color:rgba(250,204,21,.28) !important;
  box-shadow:
    0 12px 22px rgba(30,64,175,.24),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
}

@media(max-width:380px){
  .msLuxuryCoupon{
    grid-template-columns:98px minmax(0,1fr) !important;
  }
  .msLuxuryReward{
    width:74px !important;
  }
  .msLuxuryReward b{
    font-size:29px !important;
  }
}

/* C3.2 modern coupon left panel + background refresh */
.msLuxuryCoupon{
  border-radius:26px !important;
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,248,235,.96) 54%,rgba(255,255,255,.98)),
    radial-gradient(circle at 92% 6%,rgba(251,146,60,.22),transparent 34%),
    radial-gradient(circle at 18% 92%,rgba(239,68,68,.10),transparent 38%) !important;
  box-shadow:
    0 18px 34px rgba(15,23,42,.12),
    0 2px 0 rgba(255,255,255,.95) inset !important;
}

.msLuxuryCoupon.navy{
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(241,245,255,.96) 54%,rgba(255,255,255,.98)),
    radial-gradient(circle at 92% 6%,rgba(99,102,241,.20),transparent 34%),
    radial-gradient(circle at 18% 92%,rgba(14,165,233,.10),transparent 38%) !important;
}

.msLuxuryCoupon::before{
  border:1px solid rgba(15,23,42,.08) !important;
  border-style:solid !important;
}

.msLuxuryCoupon::after{
  right:-60px !important;
  top:-60px !important;
  width:180px !important;
  height:180px !important;
  background:
    radial-gradient(circle,rgba(251,146,60,.22),rgba(250,204,21,.10) 42%,transparent 70%) !important;
  filter:blur(2px) !important;
}

.msLuxuryCoupon.navy::after{
  background:
    radial-gradient(circle,rgba(99,102,241,.24),rgba(14,165,233,.10) 42%,transparent 70%) !important;
}

.msLuxuryCouponLeft{
  overflow:hidden !important;
  border-right:0 !important;
  background:
    radial-gradient(circle at 28% 18%,rgba(255,255,255,.24),transparent 32%),
    radial-gradient(circle at 76% 80%,rgba(251,191,36,.22),transparent 34%),
    linear-gradient(155deg,#111827 0%,#991b1b 48%,#ef4444 100%) !important;
}

.msLuxuryCouponLeft::before{
  content:"" !important;
  position:absolute !important;
  inset:-45px -55px auto auto !important;
  width:120px !important;
  height:120px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.14) !important;
  pointer-events:none !important;
}

.msLuxuryCouponLeft::after{
  content:"" !important;
  position:absolute !important;
  left:-32px !important;
  bottom:-36px !important;
  width:118px !important;
  height:118px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.20) !important;
  pointer-events:none !important;
}

.msLuxuryCoupon.navy .msLuxuryCouponLeft{
  background:
    radial-gradient(circle at 28% 18%,rgba(255,255,255,.22),transparent 32%),
    radial-gradient(circle at 76% 80%,rgba(56,189,248,.22),transparent 34%),
    linear-gradient(155deg,#020617 0%,#1d4ed8 48%,#06b6d4 100%) !important;
}

.msLuxurySeal{
  transform:none !important;
  font-family:Arial,"Microsoft JhengHei","PingFang TC",sans-serif !important;
  font-size:8.5px !important;
  letter-spacing:.16em !important;
  color:rgba(255,255,255,.92) !important;
  background:rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.24) !important;
  box-shadow:none !important;
  backdrop-filter:blur(8px) !important;
  padding:5px 8px !important;
}

.msLuxuryReward{
  width:auto !important;
  min-height:auto !important;
  display:block !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  text-align:left !important;
}

.msLuxuryReward span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-family:Arial,"Microsoft JhengHei","PingFang TC",sans-serif !important;
  font-size:12px !important;
  font-weight:950 !important;
  letter-spacing:.08em !important;
  color:#111827 !important;
  background:#fef3c7 !important;
  border-radius:999px !important;
  padding:4px 8px !important;
  margin:0 0 6px 0 !important;
  text-shadow:none !important;
  box-shadow:0 8px 16px rgba(0,0,0,.12) !important;
}

.msLuxuryReward b{
  display:block !important;
  font-family:Arial Black,Impact,Arial,"Microsoft JhengHei",sans-serif !important;
  font-size:34px !important;
  line-height:.92 !important;
  letter-spacing:-2px !important;
  color:#ffffff !important;
  text-shadow:
    0 2px 14px rgba(0,0,0,.22),
    0 0 18px rgba(255,255,255,.18) !important;
}

.msLuxuryCouponTitle{
  font-family:Arial,"Microsoft JhengHei","PingFang TC",sans-serif !important;
  letter-spacing:-.03em !important;
}

.msLuxuryCouponTitle::after{
  width:46px !important;
  height:3px !important;
  background:linear-gradient(90deg,#ef4444,#f97316,transparent) !important;
}

.msLuxuryCoupon.navy .msLuxuryCouponTitle::after{
  background:linear-gradient(90deg,#2563eb,#06b6d4,transparent) !important;
}

.msLuxuryClaimBtn{
  background:linear-gradient(135deg,#111827,#ef4444) !important;
}

.msLuxuryCoupon.navy .msLuxuryClaimBtn{
  background:linear-gradient(135deg,#020617,#2563eb,#06b6d4) !important;
}

/* C3.3 slim coupon + bigger modern $50 effect */
.msLuxuryCoupon{
  min-height:134px !important;
  grid-template-columns:100px minmax(0,1fr) !important;
  border-radius:24px !important;
}

.msLuxuryCoupon::before{
  inset:7px !important;
  border-radius:18px !important;
}

.msLuxuryCouponLeft{
  padding:9px 7px !important;
  gap:5px !important;
}

.msLuxurySeal{
  font-size:7.5px !important;
  padding:4px 7px !important;
}

.msLuxuryReward span{
  font-size:10.5px !important;
  padding:3px 7px !important;
  margin-bottom:4px !important;
}

.msLuxuryReward b{
  font-size:42px !important;
  line-height:.86 !important;
  letter-spacing:-2.6px !important;
  color:transparent !important;
  background:linear-gradient(180deg,#ffffff 0%,#fff7cc 36%,#facc15 70%,#fb923c 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-stroke:1px rgba(255,255,255,.18) !important;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.24)) drop-shadow(0 0 12px rgba(250,204,21,.30)) !important;
  text-shadow:none !important;
}

.msLuxuryCouponRight{
  padding:13px 13px 11px !important;
}

.msLuxuryCouponTop{
  padding:4px 8px !important;
  font-size:9px !important;
}

.msLuxuryCouponTop b{
  font-size:10.5px !important;
}

.msLuxuryCouponTitle{
  margin-top:8px !important;
  font-size:15.5px !important;
  line-height:1.18 !important;
}

.msLuxuryCouponTitle::after{
  width:42px !important;
  height:2px !important;
  margin-top:5px !important;
}

.msLuxuryCouponSub{
  margin-top:5px !important;
  font-size:11px !important;
  line-height:1.25 !important;
}

.msLuxuryCouponMeta{
  gap:5px !important;
  margin-top:6px !important;
}

.msLuxuryCouponMeta span{
  font-size:9.5px !important;
  padding:3px 7px !important;
}

.msLuxuryClaimBtn{
  margin-top:7px !important;
  padding:8px 10px !important;
  font-size:12px !important;
}

@media(max-width:380px){
  .msLuxuryCoupon{
    min-height:128px !important;
    grid-template-columns:92px minmax(0,1fr) !important;
  }
  .msLuxuryReward b{
    font-size:37px !important;
  }
  .msLuxuryCouponTitle{
    font-size:14.5px !important;
  }
  .msLuxuryCouponRight{
    padding:12px 11px 10px !important;
  }
}

/* C3.4 fix $50 zero + add member-exclusive stamp */
.msLuxuryReward b{
  font-family:"Arial Rounded MT Bold","Trebuchet MS",Arial,"Microsoft JhengHei","PingFang TC",sans-serif !important;
  font-variant-numeric:tabular-nums !important;
  font-feature-settings:"tnum" 1 !important;
  letter-spacing:-1.4px !important;
  -webkit-text-stroke:0 !important;
  transform:skew(-3deg) !important;
  background:linear-gradient(180deg,#ffffff 0%,#fff4b8 40%,#facc15 72%,#f97316 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  filter:drop-shadow(0 3px 7px rgba(0,0,0,.24)) drop-shadow(0 0 10px rgba(250,204,21,.26)) !important;
}

.msLuxuryCouponRight{
  padding-right:62px !important;
}

.msLuxuryCouponRight::after{
  content:"會員\A專享";
  white-space:pre;
  position:absolute;
  top:12px;
  right:12px;
  width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:50%;
  color:#991b1b;
  font-size:10px;
  line-height:1.15;
  font-weight:950;
  letter-spacing:.08em;
  transform:rotate(9deg);
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.92),rgba(255,247,237,.68) 42%,rgba(254,226,226,.58) 100%);
  border:2px solid rgba(185,28,28,.55);
  box-shadow:
    0 8px 16px rgba(185,28,28,.12),
    inset 0 0 0 3px rgba(255,255,255,.55);
  pointer-events:none;
}

.msLuxuryCoupon.navy .msLuxuryCouponRight::after{
  color:#1e3a8a;
  border-color:rgba(30,64,175,.55);
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.92),rgba(239,246,255,.68) 42%,rgba(219,234,254,.58) 100%);
  box-shadow:
    0 8px 16px rgba(30,64,175,.12),
    inset 0 0 0 3px rgba(255,255,255,.55);
}

@media(max-width:380px){
  .msLuxuryCouponRight{
    padding-right:54px !important;
  }
  .msLuxuryCouponRight::after{
    width:40px;
    height:40px;
    top:10px;
    right:9px;
    font-size:8.8px;
  }
}

/* C3.5 based on v24: clearer modern $50 digits, slimmer card, premium member stamp */
.msLuxuryCoupon{
  min-height:124px !important;
  grid-template-columns:96px minmax(0,1fr) !important;
  border-radius:23px !important;
}

.msLuxuryCoupon::before{
  inset:6px !important;
  border-radius:17px !important;
}

.msLuxuryCouponLeft{
  padding:8px 6px !important;
  gap:4px !important;
}

.msLuxurySeal{
  font-size:7px !important;
  letter-spacing:.16em !important;
  padding:3px 7px !important;
  opacity:.96 !important;
}

.msLuxuryReward span{
  font-size:10px !important;
  padding:2px 7px !important;
  margin-bottom:2px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.22) !important;
}

.msLuxuryReward b{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:center !important;
  gap:1px !important;
  min-height:44px !important;
  font-family:Arial,"Helvetica Neue","Microsoft JhengHei","PingFang TC",sans-serif !important;
  font-weight:900 !important;
  font-size:0 !important;
  line-height:.82 !important;
  letter-spacing:0 !important;
  transform:none !important;
  color:#fff7cc !important;
  background:none !important;
  -webkit-text-fill-color:initial !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.28)) drop-shadow(0 0 13px rgba(250,204,21,.30)) !important;
}

.msLuxuryReward b i,
.msLuxuryReward b em{
  display:inline-block !important;
  font-style:normal !important;
  color:transparent !important;
  background:linear-gradient(180deg,#ffffff 0%,#fff4b8 34%,#facc15 70%,#fb923c 100%) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  text-shadow:none !important;
}

.msLuxuryReward b em{
  font-size:47px !important;
  font-weight:950 !important;
  line-height:.78 !important;
  letter-spacing:-1.2px !important;
  font-variant-numeric:tabular-nums !important;
  font-feature-settings:"tnum" 1 !important;
}

.msLuxuryReward b i{
  font-size:22px !important;
  font-weight:950 !important;
  line-height:.88 !important;
  margin-bottom:4px !important;
  opacity:.98 !important;
}

.msLuxuryReward.percent b em{
  font-size:43px !important;
}

.msLuxuryCouponRight{
  padding:11px 68px 10px 12px !important;
}

.msLuxuryCouponTop{
  padding:3px 7px !important;
  font-size:8.5px !important;
  gap:5px !important;
}

.msLuxuryCouponTop b{
  font-size:10px !important;
}

.msLuxuryCouponTitle{
  margin-top:6px !important;
  font-size:14.8px !important;
  line-height:1.15 !important;
  letter-spacing:-.035em !important;
}

.msLuxuryCouponTitle::after{
  width:38px !important;
  height:2px !important;
  margin-top:4px !important;
}

.msLuxuryCouponSub{
  margin-top:4px !important;
  font-size:10.5px !important;
  line-height:1.22 !important;
}

.msLuxuryCouponMeta{
  margin-top:5px !important;
}

.msLuxuryCouponMeta span{
  font-size:9px !important;
  padding:3px 6px !important;
}

.msLuxuryClaimBtn{
  margin-top:6px !important;
  padding:7px 10px !important;
  font-size:11.5px !important;
  border-radius:13px !important;
}

.msLuxuryCouponRight::after{
  width:49px !important;
  height:49px !important;
  top:11px !important;
  right:11px !important;
  font-size:9.7px !important;
  line-height:1.12 !important;
  letter-spacing:.12em !important;
  border-width:2px !important;
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.96),rgba(255,246,235,.70) 42%,rgba(254,226,226,.64) 100%) !important;
  box-shadow:
    0 8px 16px rgba(185,28,28,.13),
    inset 0 0 0 3px rgba(255,255,255,.58),
    inset 0 0 0 6px rgba(185,28,28,.05) !important;
}

.msLuxuryCoupon.navy .msLuxuryCouponRight::after{
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.96),rgba(239,246,255,.72) 42%,rgba(219,234,254,.66) 100%) !important;
  box-shadow:
    0 8px 16px rgba(30,64,175,.13),
    inset 0 0 0 3px rgba(255,255,255,.58),
    inset 0 0 0 6px rgba(30,64,175,.05) !important;
}

@media(max-width:380px){
  .msLuxuryCoupon{
    min-height:120px !important;
    grid-template-columns:88px minmax(0,1fr) !important;
  }
  .msLuxuryReward b em{
    font-size:41px !important;
  }
  .msLuxuryReward b i{
    font-size:19px !important;
  }
  .msLuxuryCouponRight{
    padding-right:57px !important;
  }
  .msLuxuryCouponRight::after{
    width:42px !important;
    height:42px !important;
    top:10px !important;
    right:9px !important;
    font-size:8.3px !important;
  }
  .msLuxuryCouponTitle{
    font-size:14px !important;
  }
}


/* V27 ERP logic / variant selector */
.msModelMini{font-size:11px;font-weight:900;color:#64748b;margin-top:4px;letter-spacing:.02em}
.msErpModelPill{display:none}.msSkuPill{display:inline-flex;margin:6px 0 10px;padding:6px 10px;border-radius:999px;background:#111827;color:#fff;border:1px solid #111827;font-size:12px;font-weight:900;letter-spacing:.02em}
.msVariantSpec label{display:block;margin-top:10px;font-size:12px;font-weight:900;color:#475569}
.msVariantSpec select{width:100%;border:1px solid #e5e7eb;border-radius:14px;padding:11px 12px;background:#fff;color:#111827;font-weight:800;outline:none;margin-top:5px}
.msVariantSpec.needColor{border-color:#f97316;background:#fff7ed}

/* V27 image fit: product photos fit inside boxes, no cropping/overflow */
.msPimg,.msDetailMainImg,.msThumbs img,.msCartItem img,.msReceiptBox img,.msCertReceipt img{object-fit:contain!important;background:#fff!important;}
.msImgWrap{background:#fff!important;}
.msPimg{padding:6px!important;}
.msDetailMainImg{padding:8px!important;}
.msThumbs img{padding:3px!important;}

/* V27 hero banner direct system install: semi-solid-state battery gold premium background */
.msHero{
  min-height:252px!important;
  margin:14px 14px 12px!important;
  border-radius:28px!important;
  background:#080b10!important;
  box-shadow:0 20px 38px rgba(15,23,42,.22)!important;
  overflow:hidden!important;
}
.msHeroBg{
  opacity:1!important;
  object-fit:cover!important;
  object-position:center right!important;
  filter:saturate(1.04) contrast(1.02) brightness(.98)!important;
}
.msHeroGrad{
  background:linear-gradient(90deg,
    rgba(3,7,18,.86) 0%,
    rgba(3,7,18,.72) 34%,
    rgba(3,7,18,.34) 55%,
    rgba(3,7,18,.06) 78%,
    rgba(3,7,18,0) 100%)!important;
}
.msHero:before,
.msHero:after,
.heroMotion-dual .msHeroGrad:after,
.heroMotion-clockwise .msHeroGrad:after{
  display:none!important;
}
.msHeroText{
  max-width:58%!important;
  padding:30px 24px 28px!important;
  min-height:252px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  box-sizing:border-box!important;
}
.msHeroKicker{
  color:#d5a14a!important;
  letter-spacing:1.6px!important;
  text-shadow:0 5px 18px rgba(0,0,0,.42)!important;
}
.msHero h1{
  font-size:32px!important;
  line-height:1.08!important;
  color:#fff!important;
  letter-spacing:.3px!important;
  text-shadow:0 10px 28px rgba(0,0,0,.58)!important;
}
.msHero p{
  color:rgba(255,255,255,.88)!important;
  font-size:14px!important;
  line-height:1.5!important;
  text-shadow:0 8px 22px rgba(0,0,0,.48)!important;
}
.msHeroChips{
  margin-top:16px!important;
}
.msHeroChips button{
  background:rgba(255,255,255,.90)!important;
  color:#111827!important;
  border:1px solid rgba(255,255,255,.72)!important;
  box-shadow:0 12px 26px rgba(0,0,0,.24)!important;
}
@media(max-width:420px){
  .msHero{min-height:230px!important;border-radius:24px!important;}
  .msHeroText{min-height:230px!important;max-width:64%!important;padding:24px 18px!important;}
  .msHero h1{font-size:27px!important;}
  .msHero p{font-size:12.5px!important;}
  .msHeroChips button{font-size:10px!important;padding:6px 8px!important;}
}

/* V27.1 homepage black-gold premium UI direction: dark high-tech hero + clear light product area */
.msScreen.msView-home{
  background:
    radial-gradient(circle at 72% 4%,rgba(216,180,106,.18),transparent 27%),
    linear-gradient(180deg,#05070a 0%,#080b10 42%,#f7f5f0 42%,#ffffff 100%)!important;
  color:#111827!important;
}
.msScreen.msView-home .msTop{
  background:linear-gradient(180deg,rgba(5,7,10,.96),rgba(5,7,10,.82))!important;
  box-shadow:none!important;
  border-bottom:0!important;
  color:#fff!important;
  padding-bottom:10px!important;
}
.msScreen.msView-home .msTop:before{
  background:
    radial-gradient(circle at 16% 50%,rgba(219,180,91,.22),transparent 28%),
    linear-gradient(90deg,rgba(219,180,91,.12),transparent 42%)!important;
}
.msScreen.msView-home .msBrandText{
  color:#f3d58b!important;
  letter-spacing:-.03em!important;
}
.msScreen.msView-home .msTagline{color:rgba(255,255,255,.64)!important;}
.msScreen.msView-home .msLoginBtn{
  background:rgba(255,255,255,.08)!important;
  color:#f3d58b!important;
  border:1px solid rgba(219,180,91,.35)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.msScreen.msView-home .msBrandDecor b{color:#d8b46a!important;text-shadow:0 0 18px rgba(216,180,106,.45)!important;}
.msScreen.msView-home .msHero{
  min-height:282px!important;
  margin:0 10px 12px!important;
  border-radius:0 0 30px 30px!important;
  background:#05070a!important;
  border:1px solid rgba(216,180,106,.22)!important;
  border-top:0!important;
  box-shadow:0 22px 46px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.msScreen.msView-home .msHeroBg{
  opacity:1!important;
  object-fit:cover!important;
  object-position:center right!important;
  filter:saturate(1.06) contrast(1.04) brightness(.96)!important;
}
.msScreen.msView-home .msHeroGrad{
  background:
    radial-gradient(circle at 82% 68%,rgba(216,180,106,.20),transparent 32%),
    linear-gradient(90deg,rgba(3,7,18,.92) 0%,rgba(3,7,18,.80) 30%,rgba(3,7,18,.44) 56%,rgba(3,7,18,.12) 78%,rgba(3,7,18,0) 100%)!important;
}
.msScreen.msView-home .msHeroText{
  max-width:60%!important;
  padding:30px 22px 28px!important;
  min-height:282px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
.msScreen.msView-home .msHeroKicker{
  display:inline-flex!important;
  align-self:flex-start!important;
  padding:6px 12px!important;
  border-radius:999px!important;
  color:#f3d58b!important;
  background:rgba(216,180,106,.10)!important;
  border:1px solid rgba(216,180,106,.34)!important;
  letter-spacing:.12em!important;
  font-size:10px!important;
  box-shadow:0 0 22px rgba(216,180,106,.14)!important;
}
.msScreen.msView-home .msHero h1{
  font-size:34px!important;
  line-height:1.03!important;
  letter-spacing:.02em!important;
  margin-top:16px!important;
  color:#fff7dc!important;
  text-shadow:0 8px 26px rgba(0,0,0,.72),0 0 18px rgba(216,180,106,.24)!important;
}
.msScreen.msView-home .msHero p{
  color:rgba(255,255,255,.90)!important;
  font-size:14px!important;
  text-shadow:0 6px 20px rgba(0,0,0,.65)!important;
}
.msScreen.msView-home .msHeroChips{gap:8px!important;margin-top:18px!important;}
.msScreen.msView-home .msHeroChips button{
  background:rgba(0,0,0,.24)!important;
  color:#f8e7bd!important;
  border:1px solid rgba(216,180,106,.42)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 18px rgba(0,0,0,.25)!important;
}
.msScreen.msView-home .msCatRow{
  margin:12px 14px 12px!important;
  padding:13px 10px 12px!important;
  gap:10px!important;
  border-radius:24px!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(216,180,106,.16)!important;
  box-shadow:0 16px 34px rgba(15,23,42,.10)!important;
}
.msScreen.msView-home .msCat{
  flex:0 0 auto!important;
  min-width:78px!important;
  text-align:center!important;
  border-radius:17px!important;
  padding:10px 12px!important;
  background:linear-gradient(180deg,#fff,#f7f2e8)!important;
  border:1px solid rgba(216,180,106,.20)!important;
  color:#1f2937!important;
  font-weight:850!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;
}
.msScreen.msView-home .msCat.active,
.msScreen.msView-home .msCat:active{
  background:linear-gradient(135deg,#0d0f14,#1b1e24)!important;
  color:#f3d58b!important;
  border-color:rgba(216,180,106,.45)!important;
}
.msScreen.msView-home .msLuxuryCouponStack{
  margin:12px 14px 12px!important;
  gap:10px!important;
}
.msScreen.msView-home .msLuxuryCoupon{
  min-height:92px!important;
  grid-template-columns:minmax(0,1fr) 132px!important;
  border-radius:20px!important;
  background:linear-gradient(90deg,#0b0d11 0%,#171717 46%,#fff9ea 47%,#fffdf7 100%)!important;
  border:1px solid rgba(191,143,62,.38)!important;
  box-shadow:0 16px 34px rgba(15,23,42,.13)!important;
}
.msScreen.msView-home .msLuxuryCoupon::before{
  inset:6px!important;
  border-color:rgba(216,180,106,.20)!important;
}
.msScreen.msView-home .msLuxuryCouponLeft{
  background:transparent!important;
  align-items:flex-start!important;
  padding:14px 12px 14px 16px!important;
}
.msScreen.msView-home .msLuxurySeal{
  background:transparent!important;
  color:#f3d58b!important;
  padding:0!important;
  box-shadow:none!important;
  font-size:10px!important;
}
.msScreen.msView-home .msLuxuryReward{
  align-items:flex-start!important;
}
.msScreen.msView-home .msLuxuryReward span{
  color:rgba(255,255,255,.64)!important;
}
.msScreen.msView-home .msLuxuryReward b,
.msScreen.msView-home .msLuxuryReward em,
.msScreen.msView-home .msLuxuryReward i{
  color:#f3d58b!important;
  text-shadow:0 0 18px rgba(216,180,106,.25)!important;
}
.msScreen.msView-home .msLuxuryCouponRight{
  padding:15px 12px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  background:linear-gradient(135deg,#fff7dc,#ffffff)!important;
  border-left:1px dashed rgba(191,143,62,.38)!important;
}
.msScreen.msView-home .msLuxuryCouponRight::after{display:none!important;}
.msScreen.msView-home .msLuxuryCouponTop,
.msScreen.msView-home .msLuxuryCouponMeta{display:none!important;}
.msScreen.msView-home .msLuxuryCouponTitle{
  margin:0!important;
  font-size:13px!important;
  color:#111827!important;
  letter-spacing:-.02em!important;
}
.msScreen.msView-home .msLuxuryCouponSub{
  margin-top:3px!important;
  color:#6b7280!important;
  font-size:10px!important;
}
.msScreen.msView-home .msLuxuryClaimBtn{
  margin-top:8px!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#e9c56f,#b78530)!important;
  color:#111827!important;
  box-shadow:0 9px 18px rgba(183,133,48,.24)!important;
}
.msScreen.msView-home .msSection.msProductSection{
  background:#fff!important;
  margin:12px 0 0!important;
  padding:14px 14px 16px!important;
  border-radius:28px 28px 0 0!important;
  box-shadow:0 -10px 28px rgba(15,23,42,.06)!important;
}
.msScreen.msView-home .msProductSection + .msProductSection{
  margin-top:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.msScreen.msView-home .msSectionTitle h2,
.msScreen.msView-home .msSection h2{
  color:#111827!important;
  font-size:18px!important;
  letter-spacing:-.03em!important;
}
.msScreen.msView-home .msGrid{
  gap:12px!important;
}
.msScreen.msView-home .msCard{
  background:#fff!important;
  border:1px solid #ece4d5!important;
  border-radius:18px!important;
  box-shadow:0 12px 24px rgba(15,23,42,.08)!important;
}
.msScreen.msView-home .msImgWrap{
  background:linear-gradient(180deg,#fff,#faf7f0)!important;
}
.msScreen.msView-home .msPimg{
  background:linear-gradient(180deg,#fff,#faf7f0)!important;
}
.msScreen.msView-home .msBadge{
  background:#fff3cf!important;
  color:#8a5a12!important;
  border:1px solid rgba(216,180,106,.25)!important;
}
.msScreen.msView-home .msPrice{
  color:#b78530!important;
}
.msScreen.msView-home .msBtnFull{
  background:linear-gradient(135deg,#e8c56f,#b88733)!important;
  color:#111827!important;
  box-shadow:0 10px 20px rgba(184,135,51,.20)!important;
}
.msScreen.msView-home .msFeatureGrid{
  gap:12px!important;
}
.msScreen.msView-home .msServiceRow,
.msScreen.msView-home .msAccountCard{
  background:#fff!important;
  border-color:#ece4d5!important;
}
.msScreen.msView-home .msBottom{
  background:rgba(255,255,255,.96)!important;
  border-top:1px solid rgba(216,180,106,.20)!important;
  box-shadow:0 -10px 28px rgba(15,23,42,.10)!important;
}
.msScreen.msView-home .msNavBtn.active{
  color:#b88733!important;
}
.msScreen.msView-home .msNavBtn.active b{
  filter:drop-shadow(0 4px 9px rgba(184,135,51,.30))!important;
}
@media(max-width:420px){
  .msScreen.msView-home .msHero{min-height:264px!important;margin-left:8px!important;margin-right:8px!important;}
  .msScreen.msView-home .msHeroText{min-height:264px!important;max-width:62%!important;padding:25px 16px!important;}
  .msScreen.msView-home .msHero h1{font-size:30px!important;}
  .msScreen.msView-home .msLuxuryCoupon{grid-template-columns:minmax(0,1fr) 116px!important;}
  .msScreen.msView-home .msCat{min-width:72px!important;padding:9px 10px!important;}
}

/* V27.2 Hero gold breathing light overlay: homepage only, CSS-only; no data/product/order changes */
.msScreen.msView-home .msHero{
  position:relative!important;
  overflow:hidden!important;
}
.msScreen.msView-home .msHero::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:2!important;
  pointer-events:none!important;
  right:10.8%!important;
  top:24%!important;
  width:7.2%!important;
  height:48%!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,
    rgba(255,244,188,0),
    rgba(255,215,116,.26) 22%,
    rgba(255,201,77,.72) 52%,
    rgba(255,226,149,.30) 78%,
    rgba(255,244,188,0));
  filter:blur(13px)!important;
  mix-blend-mode:screen!important;
  opacity:.52!important;
  transform:translateZ(0) scaleY(.96)!important;
  animation:heroGoldBreath 3.4s ease-in-out infinite!important;
}
.msScreen.msView-home .msHero::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:2!important;
  pointer-events:none!important;
  left:42%!important;
  bottom:9%!important;
  width:48%!important;
  height:18%!important;
  border-radius:50%!important;
  background:radial-gradient(ellipse at center,
    rgba(255,220,129,.55) 0%,
    rgba(255,189,69,.24) 34%,
    rgba(255,189,69,.08) 58%,
    rgba(255,189,69,0) 78%);
  filter:blur(12px)!important;
  mix-blend-mode:screen!important;
  opacity:.42!important;
  animation:heroBaseGlow 4.8s ease-in-out infinite!important;
}
.msScreen.msView-home .msHeroGrad::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:2!important;
  pointer-events:none!important;
  inset:0!important;
  background:
    radial-gradient(circle at 78% 39%, rgba(255,223,139,.50) 0 1.5px, transparent 3px),
    radial-gradient(circle at 86% 27%, rgba(255,207,91,.38) 0 1.2px, transparent 3px),
    radial-gradient(circle at 72% 64%, rgba(255,232,171,.42) 0 1.4px, transparent 3px),
    radial-gradient(circle at 64% 75%, rgba(255,201,77,.32) 0 1.2px, transparent 3px),
    radial-gradient(circle at 91% 58%, rgba(255,215,116,.36) 0 1.2px, transparent 3px);
  opacity:.44!important;
  mix-blend-mode:screen!important;
  animation:heroGoldSparkle 5.6s ease-in-out infinite!important;
}
.msScreen.msView-home .msHeroGrad::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:2!important;
  pointer-events:none!important;
  left:-34%!important;
  bottom:18%!important;
  width:64%!important;
  height:2px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(255,238,177,.12),rgba(255,201,77,.80),rgba(255,238,177,.16),transparent)!important;
  box-shadow:0 0 20px rgba(255,201,77,.28)!important;
  transform:rotate(-7deg)!important;
  opacity:0!important;
  animation:heroGoldSweep 7.2s ease-in-out infinite!important;
}
@keyframes heroGoldBreath{
  0%,100%{opacity:.34;filter:blur(15px);transform:translateZ(0) scaleY(.93) scaleX(.92)}
  48%{opacity:.82;filter:blur(10px);transform:translateZ(0) scaleY(1.04) scaleX(1.08)}
}
@keyframes heroBaseGlow{
  0%,100%{opacity:.28;transform:translateY(2px) scale(.96)}
  50%{opacity:.58;transform:translateY(0) scale(1.04)}
}
@keyframes heroGoldSparkle{
  0%,100%{opacity:.20;filter:blur(.2px)}
  35%{opacity:.58;filter:blur(0)}
  65%{opacity:.34;filter:blur(.4px)}
}
@keyframes heroGoldSweep{
  0%,60%,100%{opacity:0;left:-34%}
  68%{opacity:.68}
  82%{opacity:.38;left:86%}
  88%{opacity:0;left:98%}
}
@media (prefers-reduced-motion: reduce){
  .msScreen.msView-home .msHero::before,
  .msScreen.msView-home .msHero::after,
  .msScreen.msView-home .msHeroGrad::before,
  .msScreen.msView-home .msHeroGrad::after{animation:none!important;}
}

/* V27.3 Hero live gold breathing lights: real DOM overlay, stronger and visible */
.msScreen.msView-home .msHero{position:relative!important;overflow:hidden!important;isolation:isolate!important;}
.msScreen.msView-home .msHeroLiveLights{position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;overflow:hidden!important;}
.msScreen.msView-home .msHeroText{position:relative!important;z-index:4!important;}
.msScreen.msView-home .msHeroBg{z-index:0!important;}
.msScreen.msView-home .msHeroGrad{z-index:1!important;}
.msScreen.msView-home .msHeroLiveLights i{position:absolute!important;display:block!important;pointer-events:none!important;}
.msScreen.msView-home .msHeroLiveLights .goldTube{
  right:8.5%!important;top:18%!important;width:9%!important;height:56%!important;border-radius:999px!important;
  background:linear-gradient(180deg,rgba(255,240,174,0),rgba(255,209,91,.55) 20%,rgba(255,191,45,.95) 50%,rgba(255,226,141,.50) 80%,rgba(255,240,174,0))!important;
  box-shadow:0 0 20px rgba(255,198,60,.72),0 0 46px rgba(255,170,34,.42),0 0 76px rgba(255,214,111,.28)!important;
  filter:blur(8px)!important;mix-blend-mode:screen!important;opacity:.45!important;animation:msHeroTubeBreath 2.35s ease-in-out infinite!important;
}
.msScreen.msView-home .msHeroLiveLights .goldBase{
  right:15%!important;bottom:7%!important;width:42%!important;height:22%!important;border-radius:50%!important;
  background:radial-gradient(ellipse at center,rgba(255,219,126,.78) 0%,rgba(255,190,53,.42) 34%,rgba(255,190,53,.14) 61%,rgba(255,190,53,0) 78%)!important;
  box-shadow:0 0 36px rgba(255,194,68,.35)!important;filter:blur(12px)!important;mix-blend-mode:screen!important;opacity:.46!important;animation:msHeroBaseBreath 3.1s ease-in-out infinite!important;
}
.msScreen.msView-home .msHeroLiveLights .goldSweep{
  left:-45%!important;bottom:27%!important;width:72%!important;height:3px!important;border-radius:999px!important;
  background:linear-gradient(90deg,transparent,rgba(255,235,170,.25),rgba(255,203,73,.95),rgba(255,235,170,.25),transparent)!important;
  box-shadow:0 0 22px rgba(255,201,77,.68),0 0 44px rgba(255,201,77,.26)!important;transform:rotate(-8deg)!important;opacity:0!important;animation:msHeroSweep 4.8s ease-in-out infinite!important;
}
.msScreen.msView-home .msHeroLiveLights .goldSpark{width:5px!important;height:5px!important;border-radius:50%!important;background:#ffd976!important;box-shadow:0 0 10px #ffd976,0 0 22px rgba(255,201,77,.82)!important;mix-blend-mode:screen!important;opacity:.2!important;animation:msHeroSpark 2.7s ease-in-out infinite!important;}
.msScreen.msView-home .msHeroLiveLights .s1{right:22%!important;top:26%!important;animation-delay:.1s!important;}
.msScreen.msView-home .msHeroLiveLights .s2{right:12%!important;top:44%!important;animation-delay:.55s!important;}
.msScreen.msView-home .msHeroLiveLights .s3{right:30%!important;bottom:18%!important;animation-delay:1.05s!important;}
.msScreen.msView-home .msHeroLiveLights .s4{right:7%!important;bottom:34%!important;animation-delay:1.55s!important;}
.msScreen.msView-home .msHeroLiveLights .s5{right:38%!important;bottom:10%!important;animation-delay:2.05s!important;}
@keyframes msHeroTubeBreath{0%,100%{opacity:.24;filter:blur(12px);transform:scale(.92)}50%{opacity:.88;filter:blur(6px);transform:scale(1.08)}}
@keyframes msHeroBaseBreath{0%,100%{opacity:.25;transform:scale(.94)}50%{opacity:.74;transform:scale(1.08)}}
@keyframes msHeroSweep{0%,45%,100%{opacity:0;left:-45%}55%{opacity:.85}74%{opacity:.45;left:92%}82%{opacity:0;left:110%}}
@keyframes msHeroSpark{0%,100%{opacity:.15;transform:scale(.65)}45%{opacity:1;transform:scale(1.35)}70%{opacity:.32;transform:scale(.9)}}
@media (prefers-reduced-motion: reduce){.msScreen.msView-home .msHeroLiveLights i{animation:none!important;}}






/* V27.3E Rework: no rings, only subtle dark-gold breathing glow + flowing line overlay */
.msScreen.msView-home .msHero{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}

/* Disable old pseudo effects that could create unwanted circles/rings */
.msScreen.msView-home .msHero::before,
.msScreen.msView-home .msHero::after,
.msScreen.msView-home .msHeroGrad::before,
.msScreen.msView-home .msHeroGrad::after{
  content:none!important;
  display:none!important;
  animation:none!important;
}

/* Actual overlay only */
.msScreen.msView-home .msHeroLiveLights{
  position:absolute!important;
  inset:0!important;
  z-index:3!important;
  pointer-events:none!important;
  overflow:hidden!important;
  mix-blend-mode:screen!important;
}
.msScreen.msView-home .msHeroText{
  position:relative!important;
  z-index:5!important;
}
.msScreen.msView-home .msHeroBg{z-index:0!important;}
.msScreen.msView-home .msHeroGrad{z-index:1!important;}
.msScreen.msView-home .msHeroLiveLights i{
  position:absolute!important;
  display:block!important;
  pointer-events:none!important;
}

/* Dark-gold breathing light at the battery glow area */
.msScreen.msView-home .msHeroLiveLights .goldTube{
  right:10.2%!important;
  top:17.5%!important;
  width:10.5%!important;
  height:59%!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,
    rgba(230,205,150,0) 0%,
    rgba(190,145,60,.10) 12%,
    rgba(156,108,32,.32) 28%,
    rgba(164,113,31,.56) 42%,
    rgba(224,198,132,.62) 52%,
    rgba(155,105,29,.54) 64%,
    rgba(119,78,20,.28) 78%,
    rgba(230,205,150,0) 100%)!important;
  box-shadow:
    0 0 8px rgba(226,201,143,.18),
    0 0 22px rgba(172,126,45,.18),
    0 0 46px rgba(119,80,22,.12)!important;
  filter:blur(4.5px)!important;
  opacity:.16!important;
  transform:scale(.94)!important;
  animation:msHeroSoftBreath 4.2s cubic-bezier(.45,0,.25,1) infinite!important;
}

/* Soft base glow only; no circles */
.msScreen.msView-home .msHeroLiveLights .goldBase{
  right:13%!important;
  bottom:4.5%!important;
  width:47%!important;
  height:22%!important;
  border-radius:50%!important;
  background:radial-gradient(ellipse at center,
    rgba(226,203,151,.24) 0%,
    rgba(164,118,38,.22) 28%,
    rgba(107,72,19,.12) 56%,
    rgba(107,72,19,0) 82%)!important;
  box-shadow:0 0 22px rgba(154,109,33,.10)!important;
  filter:blur(11px)!important;
  opacity:.12!important;
  transform:scale(.94)!important;
  animation:msHeroSoftBaseBreath 4.2s cubic-bezier(.45,0,.25,1) infinite!important;
}

/* Thin line movement across existing background; no rotating ring */
.msScreen.msView-home .msHeroLiveLights .goldSweep{
  left:-65%!important;
  bottom:32%!important;
  width:72%!important;
  height:2px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(130,88,24,.00) 12%,
    rgba(166,120,42,.16) 38%,
    rgba(224,198,132,.34) 50%,
    rgba(166,120,42,.14) 62%,
    transparent 100%)!important;
  box-shadow:0 0 12px rgba(166,120,42,.14)!important;
  filter:blur(.6px)!important;
  transform:rotate(-7deg)!important;
  opacity:0!important;
  animation:msHeroLineFlow 7.6s ease-in-out infinite!important;
}

/* Tiny points, understated */
.msScreen.msView-home .msHeroLiveLights .goldSpark{
  width:4px!important;
  height:4px!important;
  border-radius:50%!important;
  background:#d1b171!important;
  box-shadow:0 0 7px rgba(223,198,139,.28),0 0 13px rgba(160,114,35,.16)!important;
  opacity:.06!important;
  animation:msHeroTinySpark 4.8s ease-in-out infinite!important;
}
.msScreen.msView-home .msHeroLiveLights .s1{right:24%!important;top:25%!important;animation-delay:.4s!important;}
.msScreen.msView-home .msHeroLiveLights .s2{right:10%!important;top:43%!important;animation-delay:1.3s!important;}
.msScreen.msView-home .msHeroLiveLights .s3{right:30%!important;bottom:17%!important;animation-delay:2.2s!important;}
.msScreen.msView-home .msHeroLiveLights .s4{right:8%!important;bottom:31%!important;animation-delay:3.1s!important;}
.msScreen.msView-home .msHeroLiveLights .s5{right:42%!important;bottom:10%!important;animation-delay:3.8s!important;}

/* Clear gradual breathing: slow rise, visible hold, slow fade */
@keyframes msHeroSoftBreath{
  0%   {opacity:.10;filter:blur(6px);transform:scale(.93)}
  18%  {opacity:.18;filter:blur(5.4px);transform:scale(.96)}
  38%  {opacity:.38;filter:blur(4.4px);transform:scale(1.00)}
  52%  {opacity:.72;filter:blur(3.2px);transform:scale(1.07)}
  64%  {opacity:.68;filter:blur(3.4px);transform:scale(1.06)}
  82%  {opacity:.28;filter:blur(5.2px);transform:scale(.98)}
  100% {opacity:.10;filter:blur(6px);transform:scale(.93)}
}
@keyframes msHeroSoftBaseBreath{
  0%   {opacity:.07;transform:scale(.93)}
  22%  {opacity:.13;transform:scale(.97)}
  52%  {opacity:.42;transform:scale(1.09)}
  66%  {opacity:.38;transform:scale(1.06)}
  100% {opacity:.07;transform:scale(.93)}
}
@keyframes msHeroLineFlow{
  0%,44%,100% {opacity:0;left:-65%}
  54% {opacity:.42}
  72% {opacity:.20;left:88%}
  82% {opacity:0;left:108%}
}
@keyframes msHeroTinySpark{
  0%,100% {opacity:.04;transform:scale(.75)}
  45% {opacity:.20;transform:scale(1.18)}
  62% {opacity:.10;transform:scale(.92)}
}

@media (prefers-reduced-motion: reduce){
  .msScreen.msView-home .msHeroLiveLights i{animation:none!important;}
}

/* V27.9 Animated WebP hero background install
   The hero animation is baked into assets/home_hero_semisolid_animated.webp.
   Keep the system as one image only; disable all previous CSS/SVG hero light overlays. */
.msScreen.msView-home .msHero{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
}
.msScreen.msView-home .msHeroLiveLights{
  display:none!important;
  content:none!important;
  animation:none!important;
}
.msScreen.msView-home .msHero::before,
.msScreen.msView-home .msHero::after,
.msScreen.msView-home .msHeroGrad::before,
.msScreen.msView-home .msHeroGrad::after,
.msScreen.msView-home .heroMotion-dual .msHeroGrad::after,
.msScreen.msView-home .heroMotion-clockwise .msHeroGrad::after{
  content:none!important;
  display:none!important;
  animation:none!important;
}
.msScreen.msView-home .msHeroBg{
  opacity:1!important;
  object-fit:cover!important;
  object-position:center right!important;
  filter:saturate(1.03) contrast(1.02) brightness(.98)!important;
}

/* V27.10 Animated WebP visibility fix
   Root cause: the old hero gradient overlay was still covering the animated WebP,
   so the image looked like a black panel with only a breathing fog.
   Keep one-image animated WebP; remove the heavy black/gold overlay. */
.msScreen.msView-home .msHeroBg{
  opacity:1!important;
  display:block!important;
  visibility:visible!important;
  object-fit:cover!important;
  object-position:center right!important;
  filter:none!important;
  z-index:0!important;
}
.msScreen.msView-home .msHeroGrad{
  display:block!important;
  z-index:1!important;
  background:linear-gradient(90deg,
    rgba(2,6,23,.52) 0%,
    rgba(2,6,23,.32) 28%,
    rgba(2,6,23,.10) 48%,
    rgba(2,6,23,0) 72%)!important;
  pointer-events:none!important;
}
.msScreen.msView-home .msHeroLiveLights,
.msScreen.msView-home .msHeroLiveLights *,
.msScreen.msView-home .msHero::before,
.msScreen.msView-home .msHero::after,
.msScreen.msView-home .msHeroGrad::before,
.msScreen.msView-home .msHeroGrad::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  animation:none!important;
}
.msScreen.msView-home .msHeroText{
  position:relative!important;
  z-index:3!important;
}

/* V27.12 Uploaded Hero Static Fast Fix
   Scope: homepage hero only.
   Use the user's newly uploaded image as the single hero background.
   Stop previous CSS/SVG/animated-WebP light layers to avoid black screen, delayed wrong asset, or fog-only result. */
.msScreen.msView-home .msHero{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background:#03070c!important;
}
.msScreen.msView-home .msHeroBg{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  object-fit:cover!important;
  object-position:center right!important;
  filter:none!important;
  z-index:0!important;
}
.msScreen.msView-home .msHeroGrad{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  pointer-events:none!important;
  background:linear-gradient(90deg,
    rgba(2,6,23,.46) 0%,
    rgba(2,6,23,.24) 28%,
    rgba(2,6,23,.08) 48%,
    rgba(2,6,23,0) 68%)!important;
}
.msScreen.msView-home .msHeroLiveLights,
.msScreen.msView-home .msHeroLiveLights *,
.msScreen.msView-home .msHero::before,
.msScreen.msView-home .msHero::after,
.msScreen.msView-home .msHeroGrad::before,
.msScreen.msView-home .msHeroGrad::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  animation:none!important;
}
.msScreen.msView-home .msHeroText{
  position:relative!important;
  z-index:3!important;
}


/* V27.19 adjustable homepage hero effect polish
   JS controls brightness/speed/contrast; CSS only protects layer order.
   Scope: homepage hero only. */
.msScreen.msView-home .msHero [data-v2719-hero-glow],
.msScreen.msView-home .msHero [data-v2719-hero-sweep]{
  display:block!important;
  visibility:visible!important;
}
.msScreen.msView-home .msHeroText{position:relative!important;z-index:5!important;}


/* V27.25 homepage coupon texture + semi-solid section button
   Scope: homepage luxury coupon and mobile product section only. */
.msLuxuryCouponLeft{
  overflow:hidden!important;
}

.msLuxuryCouponLeft::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background:
    radial-gradient(circle at 20% 18%, rgba(255,255,255,.16), transparent 28%),
    radial-gradient(circle at 78% 82%, rgba(250,204,21,.12), transparent 26%),
    repeating-linear-gradient(45deg, rgba(255,255,255,.055) 0 1px, transparent 1px 7px),
    repeating-linear-gradient(135deg, rgba(250,204,21,.035) 0 1px, transparent 1px 11px)!important;
  opacity:.78!important;
  mix-blend-mode:screen!important;
}

.msLuxuryCoupon.navy .msLuxuryCouponLeft::before{
  background:
    radial-gradient(circle at 22% 16%, rgba(255,255,255,.18), transparent 30%),
    radial-gradient(circle at 70% 72%, rgba(250,204,21,.14), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.055) 0 1px, transparent 1px 100%),
    linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 100%),
    repeating-linear-gradient(45deg, rgba(255,255,255,.065) 0 1px, transparent 1px 8px)!important;
  background-size:auto,auto,14px 14px,14px 14px,auto!important;
  opacity:.86!important;
}

.msLuxuryCouponLeft > *{
  position:relative!important;
  z-index:1!important;
}

.msSectionMore{
  border:1px solid rgba(15,23,42,.12)!important;
  background:#fff!important;
  color:#111827!important;
  border-radius:999px!important;
  padding:7px 10px!important;
  font-size:11px!important;
  font-weight:900!important;
  box-shadow:0 8px 16px rgba(15,23,42,.08)!important;
}

.msSemiSolidHomeSection .msSectionTitle h2::after{
  content:" SEMI-SOLID"!important;
  display:inline-flex!important;
  margin-left:7px!important;
  vertical-align:2px!important;
  font-size:8px!important;
  letter-spacing:.08em!important;
  color:#92400e!important;
  background:#fef3c7!important;
  border:1px solid #fde68a!important;
  border-radius:999px!important;
  padding:3px 6px!important;
}


/* V27.26 homepage coupon layout adjustment
   Move the coupon wording into the middle area and remove the empty-feeling gap.
   Right side is now kept mainly for the claim button. */
.msLuxuryCoupon{
  grid-template-columns:96px minmax(0,1fr) 78px!important;
  min-height:138px!important;
  align-items:stretch!important;
}

.msLuxuryCouponMid{
  position:relative!important;
  z-index:1!important;
  min-width:0!important;
  padding:14px 6px 12px 13px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}

.msLuxuryCouponAction{
  position:relative!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:12px 11px 12px 0!important;
}

.msLuxuryCouponMid .msLuxuryCouponTop{
  max-width:100%!important;
  align-self:flex-start!important;
  margin:0!important;
}

.msLuxuryCouponMid .msLuxuryCouponTitle{
  margin-top:8px!important;
  font-size:16px!important;
  line-height:1.18!important;
}

.msLuxuryCouponMid .msLuxuryCouponSub{
  margin-top:5px!important;
  font-size:11.5px!important;
  line-height:1.3!important;
}

.msLuxuryCouponMid .msLuxuryCouponMeta{
  margin-top:7px!important;
  gap:5px!important;
}

.msLuxuryCouponMid .msLuxuryCouponMeta span{
  font-size:10px!important;
  padding:3px 7px!important;
}

.msLuxuryCouponAction .msLuxuryClaimBtn{
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:10px 6px!important;
  border-radius:17px!important;
  font-size:11px!important;
  line-height:1.15!important;
  white-space:normal!important;
  writing-mode:horizontal-tb!important;
}

.msLuxuryCouponRight{display:none!important;}

@media(max-width:380px){
  .msLuxuryCoupon{
    grid-template-columns:84px minmax(0,1fr) 66px!important;
    min-height:132px!important;
  }
  .msLuxuryCouponMid{
    padding:12px 5px 11px 10px!important;
  }
  .msLuxuryCouponMid .msLuxuryCouponTitle{
    font-size:14.5px!important;
  }
  .msLuxuryCouponAction{
    padding:10px 8px 10px 0!important;
  }
  .msLuxuryCouponAction .msLuxuryClaimBtn{
    font-size:10px!important;
    padding:9px 4px!important;
  }
}


/* V27.27 coupon layout repair
   Restore stable two-area coupon: left reward + right content/action.
   Fixes v27.26: wrong claim button position and middle text not filling the empty area. */
.msLuxuryCoupon{
  display:grid!important;
  grid-template-columns:104px minmax(0,1fr)!important;
  min-height:146px!important;
  align-items:stretch!important;
}

.msLuxuryCouponMid,
.msLuxuryCouponAction{
  display:none!important;
}

.msLuxuryCouponRight{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  min-width:0!important;
  width:auto!important;
  padding:15px 14px 13px!important;
  position:relative!important;
  z-index:2!important;
}

.msLuxuryCouponRight .msLuxuryCouponTop{
  margin:0!important;
  max-width:100%!important;
  align-self:flex-start!important;
}

.msLuxuryCouponRight .msLuxuryCouponTitle{
  margin-top:8px!important;
  font-size:17px!important;
  line-height:1.22!important;
  width:100%!important;
  max-width:100%!important;
}

.msLuxuryCouponRight .msLuxuryCouponSub{
  margin-top:5px!important;
  font-size:12px!important;
  line-height:1.35!important;
  width:100%!important;
  max-width:100%!important;
}

.msLuxuryCouponRight .msLuxuryCouponMeta{
  margin-top:7px!important;
  gap:5px!important;
  width:100%!important;
  max-width:100%!important;
}

.msLuxuryCouponRight .msLuxuryCouponMeta span{
  font-size:10px!important;
  padding:3px 7px!important;
}

.msLuxuryCouponRight .msLuxuryClaimBtn{
  width:auto!important;
  min-width:92px!important;
  max-width:150px!important;
  align-self:flex-start!important;
  margin-top:9px!important;
  padding:8px 13px!important;
  border-radius:999px!important;
  font-size:12px!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  writing-mode:horizontal-tb!important;
}

@media(max-width:380px){
  .msLuxuryCoupon{
    grid-template-columns:90px minmax(0,1fr)!important;
    min-height:140px!important;
  }
  .msLuxuryCouponRight{
    padding:13px 11px 12px!important;
  }
  .msLuxuryCouponRight .msLuxuryCouponTitle{
    font-size:15px!important;
  }
  .msLuxuryCouponRight .msLuxuryCouponSub{
    font-size:11px!important;
  }
  .msLuxuryCouponRight .msLuxuryClaimBtn{
    min-width:82px!important;
    font-size:11px!important;
    padding:8px 10px!important;
  }
}


/* V27.29 coupon middle text typo fix
   Adds 「優惠卷」 in the middle empty area of the homepage coupon.
   This is a program/CSS change only; no image generation. */
.msLuxuryCoupon{
  position:relative!important;
}

.msLuxuryCouponMiddleMark{
  position:absolute!important;
  z-index:1!important;
  left:104px!important;
  top:50%!important;
  transform:translate(-18%,-50%) rotate(-8deg)!important;
  pointer-events:none!important;
  user-select:none!important;
  font-family:Georgia,"Times New Roman","Microsoft JhengHei",serif!important;
  font-size:20px!important;
  font-weight:1000!important;
  letter-spacing:.12em!important;
  color:rgba(120,53,15,.18)!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.65),
    0 0 12px rgba(250,204,21,.16)!important;
  white-space:nowrap!important;
}

.msLuxuryCoupon.navy .msLuxuryCouponMiddleMark{
  color:rgba(30,58,138,.16)!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.70),
    0 0 12px rgba(147,197,253,.16)!important;
}

.msLuxuryCouponRight{
  z-index:2!important;
}

@media(max-width:380px){
  .msLuxuryCouponMiddleMark{
    left:90px!important;
    font-size:17px!important;
    letter-spacing:.08em!important;
    transform:translate(-16%,-50%) rotate(-8deg)!important;
  }
}


/* V28.0 Free Smart Customer Service
   App-side FAQ chatbot. No paid API. */
.msSmartFloat{
  position:fixed!important;
  right:16px!important;
  bottom:calc(82px + env(safe-area-inset-bottom))!important;
  z-index:998!important;
  border:0!important;
  border-radius:999px!important;
  padding:11px 13px!important;
  background:linear-gradient(135deg,#111827,#b45309)!important;
  color:#fff!important;
  font-weight:950!important;
  font-size:12px!important;
  box-shadow:0 14px 28px rgba(15,23,42,.24),0 0 20px rgba(250,204,21,.22)!important;
}
.msSmartHero{
  margin:14px!important;
  padding:16px!important;
  border-radius:24px!important;
  background:linear-gradient(135deg,#0f172a,#111827 58%,#78350f)!important;
  color:#fff!important;
  display:flex!important;
  gap:12px!important;
  align-items:center!important;
  box-shadow:0 18px 32px rgba(15,23,42,.18)!important;
}
.msSmartBotIcon{
  width:48px!important;
  height:48px!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#fde68a,#f59e0b)!important;
  color:#111827!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-weight:1000!important;
  box-shadow:0 10px 22px rgba(250,204,21,.22)!important;
}
.msSmartHero h2{margin:0!important;font-size:20px!important}
.msSmartHero p{margin:5px 0 0!important;font-size:12px!important;line-height:1.45!important;color:#f8fafc!important}
.msSmartCard{
  margin:12px 14px 16px!important;
  background:#fff!important;
  border:1px solid #e5e7eb!important;
  border-radius:22px!important;
  padding:13px!important;
  box-shadow:0 12px 24px rgba(15,23,42,.08)!important;
}
.msSmartChat{
  display:flex!important;
  flex-direction:column!important;
  gap:9px!important;
  max-height:280px!important;
  overflow:auto!important;
  padding:2px 2px 10px!important;
}
.msSmartMsg{
  max-width:88%!important;
  border-radius:17px!important;
  padding:10px 12px!important;
  line-height:1.45!important;
  font-size:12px!important;
}
.msSmartMsg b{
  display:block!important;
  font-size:10px!important;
  opacity:.72!important;
  margin-bottom:4px!important;
}
.msSmartMsg.bot{
  align-self:flex-start!important;
  background:#f8fafc!important;
  color:#111827!important;
  border:1px solid #e5e7eb!important;
}
.msSmartMsg.user{
  align-self:flex-end!important;
  background:linear-gradient(135deg,#111827,#1f2937)!important;
  color:#fff!important;
}
.msSmartQuick{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin:8px 0 11px!important;
}
.msSmartQuick button{
  border:1px solid #fde68a!important;
  background:#fffbeb!important;
  color:#78350f!important;
  border-radius:999px!important;
  padding:7px 9px!important;
  font-size:11px!important;
  font-weight:850!important;
}
.msSmartInputRow{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 62px!important;
  gap:8px!important;
}
.msSmartInputRow input{
  border:1px solid #e5e7eb!important;
  border-radius:15px!important;
  padding:11px 12px!important;
  font-size:13px!important;
}
.msSmartInputRow button{
  border:0!important;
  border-radius:15px!important;
  background:#111827!important;
  color:#fff!important;
  font-weight:900!important;
}
.msSmartTools{
  display:flex!important;
  gap:8px!important;
  margin-top:9px!important;
  flex-wrap:wrap!important;
}
.smartAdminFaq textarea{
  min-height:96px!important;
}


/* V28.1 smart service after-sales split */
.msSmartTools .afterSales{
  border-color:#fed7aa!important;
  background:#fff7ed!important;
  color:#9a3412!important;
}
.msSmartQuick button{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}


/* V28.2 smart service routing
   Do not show WhatsApp buttons before the customer asks.
   Show route choices after the first question; after-sales keywords route to after-sales only. */
.msSmartRouteBox{
  margin-top:11px!important;
  border:1px solid #e5e7eb!important;
  background:#f8fafc!important;
  border-radius:18px!important;
  padding:11px!important;
  color:#111827!important;
}
.msSmartRouteBox b{
  display:block!important;
  font-size:12px!important;
  margin-bottom:8px!important;
}
.msSmartRouteBox p{
  margin:0 0 9px!important;
  color:#64748b!important;
  font-size:12px!important;
  line-height:1.45!important;
}
.msSmartRouteBtns{
  display:flex!important;
  gap:7px!important;
  flex-wrap:wrap!important;
}
.msSmartRouteBtns button,
.msSmartRouteBox > button{
  border:1px solid #dbeafe!important;
  background:#eff6ff!important;
  color:#1e3a8a!important;
  border-radius:999px!important;
  padding:8px 10px!important;
  font-size:11px!important;
  font-weight:900!important;
}
.msSmartRouteBtns button.afterSales,
.msSmartRouteBox.afterSales,
.msSmartRouteBox.afterSales > button{
  border-color:#fed7aa!important;
  background:#fff7ed!important;
  color:#9a3412!important;
}
.msSmartRouteBox.afterSales{
  background:#fff7ed!important;
}


/* V28.3 smart service FAQ defaults + warranty registration routing */
.msSmartRouteBox.afterSales button[data-view="warranty"]{
  background:#9a3412!important;
  color:#fff!important;
  border-color:#9a3412!important;
  box-shadow:0 10px 18px rgba(154,52,18,.18)!important;
}


/* V28.4 smart service greeting + after-sales cleanup
   - Greeting-only messages do not show manual service routing.
   - After-sales manual route button is hidden from general route choices.
   - After-sales guidance no longer includes extra "please prepare..." wording. */


/* V28.9 smart service chat logs - admin table badges */
.smartLogTable td{
  vertical-align:top!important;
  font-size:12px!important;
}
.smartLogBadge{
  display:inline-flex!important;
  border-radius:999px!important;
  padding:4px 8px!important;
  font-size:10px!important;
  font-weight:900!important;
  background:#f1f5f9!important;
  color:#334155!important;
  white-space:nowrap!important;
}
.smartLogBadge.ok{
  background:#dcfce7!important;
  color:#166534!important;
}
.smartLogBadge.warning{
  background:#ffedd5!important;
  color:#9a3412!important;
}
.smartLogBadge.danger{
  background:#fee2e2!important;
  color:#991b1b!important;
}


/* V28.10 smart service auto sync note */
.smartLogBadge.pending{
  background:#fef3c7!important;
  color:#92400e!important;
}


/* V28.11 smart service conversation threads */
.smartThreadUnread td{
  background:#fff7ed!important;
}
.smartUnreadDot{
  display:inline-block!important;
  width:8px!important;
  height:8px!important;
  border-radius:999px!important;
  background:#ef4444!important;
  box-shadow:0 0 0 3px rgba(239,68,68,.13)!important;
  margin-right:7px!important;
  vertical-align:1px!important;
}
.smartThreadDetail td{
  background:#f8fafc!important;
}
.smartThreadMsg{
  border:1px solid #e5e7eb!important;
  background:#fff!important;
  border-radius:14px!important;
  padding:10px 12px!important;
  margin:8px 0!important;
  line-height:1.45!important;
}
.smartThreadMsg.unread{
  border-color:#fdba74!important;
  background:#fff7ed!important;
}
.smartThreadMsgHead{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-bottom:7px!important;
  color:#64748b!important;
  font-size:11px!important;
}


/* V28.12 smart log sync fix */
.smartLogBadge.synced{
  background:#dcfce7!important;
  color:#166534!important;
}
.smartLogBadge.pending{
  background:#fef3c7!important;
  color:#92400e!important;
}


/* V28.13 smart log queue + batch sync */
.smartLogBadge.queue{
  background:#e0f2fe!important;
  color:#075985!important;
}


/* V28.14 smart log triple sync */
.msSmartSyncStatus{
  margin-top:8px!important;
  font-size:10px!important;
  color:#64748b!important;
  background:#f8fafc!important;
  border:1px solid #e2e8f0!important;
  border-radius:999px!important;
  padding:6px 9px!important;
}


/* V28.15 smart sync status/force button */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#bfdbfe!important;
  background:#eff6ff!important;
  color:#1e3a8a!important;
  font-weight:800!important;
}


/* V28.16 smart service independent log store */
.msSmartSyncStatus[data-smart-sync-status]::after{
  content:"";
}


/* V28.17 rebuilt smart message sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#bbf7d0!important;
  background:#f0fdf4!important;
  color:#166534!important;
}


/* V28.18 smart sync timeout retry */
.msSmartSyncStatus[data-smart-sync-status]{
  box-shadow:inset 0 0 0 1px rgba(22,101,52,.08)!important;
}


/* V28.19 smart sync diagnostics */
.msSmartDiagBox{
  display:flex!important;
  flex-direction:column!important;
  gap:4px!important;
  margin-top:8px!important;
  font-size:10px!important;
  color:#334155!important;
  background:#fff7ed!important;
  border:1px solid #fed7aa!important;
  border-radius:14px!important;
  padding:8px 10px!important;
}
.msSmartDiagBox b{
  font-size:11px!important;
  color:#9a3412!important;
}
.msSmartDiagBox span{
  word-break:break-all!important;
}


/* V28.20 smart quick sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#a7f3d0!important;
  background:#ecfdf5!important;
}


/* V28.21 smart logs fast independent write */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#86efac!important;
  background:#f0fdf4!important;
}


/* V28.22 smart script callback sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#93c5fd!important;
  background:#eff6ff!important;
  color:#1e3a8a!important;
}


/* V28.23 smart NDJSON append sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#c4b5fd!important;
  background:#f5f3ff!important;
  color:#5b21b6!important;
}


/* V28.24 smart memory-first sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#67e8f9!important;
  background:#ecfeff!important;
  color:#155e75!important;
}


/* V28.25 smart minimal payload sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#f9a8d4!important;
  background:#fdf2f8!important;
  color:#9d174d!important;
}


/* V28.26 smart no-answer log */
.smartThreadMsg .hint{
  margin-top:4px!important;
}


/* V28.27 smart WebSocket sync */
.msSmartSyncStatus[data-smart-sync-status]{
  border-color:#60a5fa!important;
  background:#eff6ff!important;
  color:#1d4ed8!important;
}


/* V28.28 smart backend auto refresh */
.smartLogTable::after{
  content:"";
}


/* V28.29 hero image persistence/cache fix */
.msHero{
  background-color:#03070c!important;
  background-size:cover!important;
  background-position:center right!important;
  background-repeat:no-repeat!important;
}
.msHeroBg{
  z-index:0!important;
  display:block!important;
  opacity:.72!important;
  transform:translateZ(0)!important;
  will-change:filter,opacity!important;
}
.msHeroGrad,
.msHeroLiveLights,
.msHeroText{
  transform:translateZ(0)!important;
}


/* V28.30 hero background persistence fix */
.msHero{
  background-color:#03070c!important;
  background-image:linear-gradient(90deg,rgba(2,6,23,.36),rgba(2,6,23,.10),rgba(2,6,23,0)),url("/assets/home_hero_user_uploaded_20260513.jpg");
  background-size:cover!important;
  background-position:center right!important;
  background-repeat:no-repeat!important;
}
.msHeroBg{
  z-index:0!important;
  display:block!important;
  visibility:visible!important;
  opacity:.72!important;
}
.msHeroGrad{z-index:1!important}
.msHeroLiveLights{z-index:2!important}
.msHeroText{z-index:3!important}


/* V28.31 customer service center + latest message scroll */
.msSmartBotIcon{
  font-size:12px!important;
  letter-spacing:0!important;
}
.msSmartChat{
  scroll-behavior:smooth!important;
}


/* V28.32 dealer directory */
.dealerBulkTextarea{
  min-height:420px!important;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace!important;
  font-size:12px!important;
  line-height:1.55!important;
  white-space:pre!important;
}
.msDealerList{
  padding:0 14px 100px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
}
.msDealerCard{
  background:#fff!important;
  border:1px solid #e5e7eb!important;
  border-radius:16px!important;
  padding:12px!important;
  box-shadow:0 8px 18px rgba(15,23,42,.05)!important;
}
.msDealerCard b{
  display:block!important;
  font-size:13px!important;
  color:#111827!important;
  margin-bottom:4px!important;
  line-height:1.35!important;
}
.msDealerCard p{
  margin:4px 0 0!important;
  color:#475569!important;
  font-size:12px!important;
  line-height:1.45!important;
  white-space:pre-wrap!important;
}


/* V28.33 dealer cards: one blank-line block = one store */
.msDealerCard b{
  font-size:14px!important;
  margin-bottom:7px!important;
}
.msDealerCard p{
  padding-left:0!important;
}


/* V28.34 dealer grouping + search fix */
.msDealerTitle{
  display:block!important;
}
.msDealerBody{
  display:block!important;
}

.msCertProductText{min-width:0!important;}
.msNoWarrantyText{display:inline-block;margin-top:5px;font-size:10.5px;font-style:normal;font-weight:800;color:#b45309;background:#fff7ed;border:1px solid #fdba74;border-radius:999px;padding:3px 7px;white-space:normal;line-height:1.25;}

.msDetailBadges{display:flex;gap:5px;flex-wrap:wrap;margin:6px 0 8px}.msDetailBadges .msBadge{display:inline-flex;margin-right:0}

/* V28.79 cart stay-on-page feedback + bottom cart badge */
.msNavBtn{position:relative!important;overflow:visible!important;}
.msNavIcon{position:relative;display:inline-flex;align-items:center;justify-content:center;line-height:1;}
.msCartBadge{
  position:absolute;
  top:-7px;
  right:-14px;
  min-width:17px;
  height:17px;
  padding:0 5px;
  border-radius:999px;
  background:#ef4444;
  color:#fff;
  border:2px solid #fff;
  font-size:10px;
  line-height:15px;
  font-weight:1000;
  box-shadow:0 6px 14px rgba(239,68,68,.28);
  pointer-events:none;
}
.msCartToast{
  position:fixed;
  left:50%;
  bottom:calc(76px + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  z-index:1200;
  background:rgba(17,24,39,.96);
  color:#fff;
  border:1px solid rgba(250,204,21,.35);
  border-radius:999px;
  padding:11px 16px;
  font-size:13px;
  font-weight:900;
  box-shadow:0 16px 38px rgba(15,23,42,.30);
  white-space:nowrap;
  animation:msCartToastPop 2.2s ease forwards;
}
.msCartToast:before{content:"✓ ";color:#facc15;font-weight:1000;}
@keyframes msCartToastPop{
  0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(.96);}
  12%{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
  78%{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
  100%{opacity:0;transform:translateX(-50%) translateY(8px) scale(.98);}
}

/* V28.98: stronger, visibly different top brand/logo bar styles */
.msTop[class*="msTopStyle-"]{
  position:sticky!important;
  top:0!important;
  z-index:8!important;
  overflow:hidden!important;
  isolation:isolate!important;
  border-bottom:0!important;
  transition:background .25s ease,box-shadow .25s ease,border .25s ease,min-height .25s ease!important;
}
.msTop[class*="msTopStyle-"] .msBrand{position:relative!important;z-index:2!important;min-height:58px!important;gap:10px!important;}
.msTop[class*="msTopStyle-"]:before,
.msTop[class*="msTopStyle-"]:after{content:""!important;position:absolute!important;pointer-events:none!important;z-index:0!important;}
.msTop[class*="msTopStyle-"] .msBrandLogoArea{position:relative!important;z-index:2!important;min-width:0!important;border-radius:22px!important;padding:7px 10px!important;transition:background .25s ease,box-shadow .25s ease,border .25s ease!important;}
.msTop[class*="msTopStyle-"] .msBrandDecor{position:relative!important;z-index:3!important;}
.msTop[class*="msTopStyle-"] .msLoginBtn{position:relative!important;z-index:3!important;transition:transform .15s ease,background .25s ease,box-shadow .25s ease!important;}
.msTop[class*="msTopStyle-"] .msBrandDecor b{position:relative!important;z-index:3!important;}

/* 深色科技：深藍黑底、電子線條、底部光線 */
.msTop.msTopStyle-premium{
  min-height:88px!important;
  padding:14px 15px 13px!important;
  background:
    radial-gradient(circle at 88% 12%,rgba(250,204,21,.46),transparent 25%),
    radial-gradient(circle at 4% 0%,rgba(59,130,246,.25),transparent 36%),
    linear-gradient(135deg,#020617 0%,#111827 48%,#1e293b 100%)!important;
  color:#fff!important;
  box-shadow:0 18px 36px rgba(2,6,23,.34), inset 0 -1px 0 rgba(250,204,21,.22)!important;
}
.msTop.msTopStyle-premium:before{inset:0!important;background:repeating-linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,transparent 1px 24px),repeating-linear-gradient(0deg,rgba(250,204,21,.055) 0 1px,transparent 1px 28px)!important;opacity:.72!important;}
.msTop.msTopStyle-premium:after{left:0!important;right:0!important;bottom:0!important;height:4px!important;background:linear-gradient(90deg,transparent,#facc15,#38bdf8,#facc15,transparent)!important;box-shadow:0 0 22px rgba(250,204,21,.64)!important;}
.msTop.msTopStyle-premium .msBrandLogoArea{background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.035))!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 10px 22px rgba(0,0,0,.18)!important;}
.msTop.msTopStyle-premium .msBrandText{color:#fff!important;text-shadow:0 0 16px rgba(56,189,248,.28),0 2px 12px rgba(0,0,0,.32)!important;}
.msTop.msTopStyle-premium .msTagline,.msTop.msTopStyle-premium .msLogoSlogan{color:#e2e8f0!important;}
.msTop.msTopStyle-premium .msLoginBtn{background:linear-gradient(135deg,#ffffff,#e2e8f0)!important;color:#0f172a!important;border:1px solid rgba(255,255,255,.72)!important;box-shadow:0 9px 22px rgba(0,0,0,.22),inset 0 0 0 1px rgba(250,204,21,.32)!important;}
.msTop.msTopStyle-premium .msBrandDecor b{color:#facc15!important;text-shadow:0 0 18px rgba(250,204,21,.9)!important;}

/* 白色簡約：明顯白卡、幼金線、乾淨商務 */
.msTop.msTopStyle-clean{
  min-height:76px!important;
  padding:12px 15px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%)!important;
  color:#111827!important;
  border-bottom:1px solid #e5e7eb!important;
  box-shadow:0 12px 28px rgba(15,23,42,.09)!important;
}
.msTop.msTopStyle-clean:before{display:none!important;}
.msTop.msTopStyle-clean:after{left:16px!important;right:16px!important;bottom:0!important;height:3px!important;border-radius:999px!important;background:linear-gradient(90deg,#111827,#facc15,#111827)!important;opacity:.7!important;}
.msTop.msTopStyle-clean .msBrandLogoArea{background:#fff!important;border:1px solid #e5e7eb!important;box-shadow:0 8px 18px rgba(15,23,42,.06)!important;}
.msTop.msTopStyle-clean .msBrandText{color:#111827!important;text-shadow:none!important;}
.msTop.msTopStyle-clean .msTagline{color:#64748b!important;text-shadow:none!important;}
.msTop.msTopStyle-clean .msLogoSlogan{color:#334155!important;text-shadow:none!important;}
.msTop.msTopStyle-clean .msLoginBtn{background:#111827!important;color:#fff!important;border:1px solid #111827!important;box-shadow:0 8px 18px rgba(15,23,42,.13)!important;}
.msTop.msTopStyle-clean .msBrandDecor b{color:#f59e0b!important;text-shadow:none!important;}

/* 玻璃磨砂：半透明玻璃、亮斜線、強背光 */
.msTop.msTopStyle-glass{
  min-height:84px!important;
  padding:13px 15px!important;
  background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(226,232,240,.54))!important;
  color:#0f172a!important;
  border-bottom:1px solid rgba(255,255,255,.78)!important;
  box-shadow:0 18px 38px rgba(15,23,42,.14),inset 0 1px 0 rgba(255,255,255,.92)!important;
  backdrop-filter:blur(20px) saturate(1.35)!important;
}
.msTop.msTopStyle-glass:before{inset:-30% -10%!important;background:radial-gradient(circle at 85% 20%,rgba(250,204,21,.42),transparent 27%),radial-gradient(circle at 12% 8%,rgba(56,189,248,.26),transparent 30%)!important;}
.msTop.msTopStyle-glass:after{top:-45px!important;bottom:-45px!important;left:48%!important;width:58px!important;transform:rotate(24deg)!important;background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent)!important;filter:blur(.5px)!important;}
.msTop.msTopStyle-glass .msBrandLogoArea{background:rgba(255,255,255,.58)!important;border:1px solid rgba(255,255,255,.82)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 10px 24px rgba(15,23,42,.10)!important;backdrop-filter:blur(12px)!important;}
.msTop.msTopStyle-glass .msBrandText{color:#0f172a!important;text-shadow:0 1px 0 rgba(255,255,255,.8)!important;}
.msTop.msTopStyle-glass .msTagline,.msTop.msTopStyle-glass .msLogoSlogan{color:#334155!important;text-shadow:0 1px 0 rgba(255,255,255,.55)!important;}
.msTop.msTopStyle-glass .msLoginBtn{background:rgba(255,255,255,.74)!important;color:#0f172a!important;border:1px solid rgba(255,255,255,.9)!important;box-shadow:0 8px 20px rgba(15,23,42,.10),inset 0 1px 0 rgba(255,255,255,.9)!important;}
.msTop.msTopStyle-glass .msBrandDecor b{color:#0f172a!important;text-shadow:0 0 12px rgba(250,204,21,.44)!important;}

/* 暗金奢華：黑金大光暈、金屬邊、明顯金線 */
.msTop.msTopStyle-gold{
  min-height:90px!important;
  padding:14px 15px 13px!important;
  background:
    radial-gradient(circle at 82% 8%,rgba(245,158,11,.58),transparent 28%),
    linear-gradient(135deg,#030712 0%,#141006 42%,#4c3510 100%)!important;
  color:#fff!important;
  border-bottom:1px solid rgba(250,204,21,.48)!important;
  box-shadow:0 20px 42px rgba(3,7,18,.38),inset 0 -1px 0 rgba(250,204,21,.38)!important;
}
.msTop.msTopStyle-gold:before{inset:0!important;background:linear-gradient(110deg,transparent 0 45%,rgba(255,255,255,.08) 45% 47%,transparent 47% 100%),repeating-linear-gradient(135deg,rgba(250,204,21,.09) 0 1px,transparent 1px 18px)!important;opacity:.95!important;}
.msTop.msTopStyle-gold:after{left:0!important;right:0!important;bottom:0!important;height:5px!important;background:linear-gradient(90deg,#7c2d12,#facc15,#fff7d6,#facc15,#7c2d12)!important;box-shadow:0 0 26px rgba(250,204,21,.78)!important;}
.msTop.msTopStyle-gold .msBrandLogoArea{background:linear-gradient(135deg,rgba(250,204,21,.16),rgba(255,255,255,.045))!important;border:1px solid rgba(250,204,21,.34)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 12px 26px rgba(0,0,0,.26)!important;}
.msTop.msTopStyle-gold .msBrandText{color:#fff7d6!important;text-shadow:0 0 20px rgba(250,204,21,.38),0 2px 12px rgba(0,0,0,.38)!important;}
.msTop.msTopStyle-gold .msTagline,.msTop.msTopStyle-gold .msLogoSlogan{color:#fde68a!important;text-shadow:0 0 12px rgba(250,204,21,.22)!important;}
.msTop.msTopStyle-gold .msLoginBtn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#111827!important;border:1px solid rgba(255,255,255,.34)!important;box-shadow:0 10px 24px rgba(250,204,21,.28)!important;}
.msTop.msTopStyle-gold .msBrandDecor b{color:#facc15!important;text-shadow:0 0 22px rgba(250,204,21,1)!important;}

/* 韓系柔和：粉米漸層、大柔光、圓潤白卡 */
.msTop.msTopStyle-soft{
  min-height:84px!important;
  padding:13px 15px!important;
  background:
    radial-gradient(circle at 84% 18%,rgba(244,114,182,.34),transparent 28%),
    radial-gradient(circle at 16% 0%,rgba(251,191,36,.25),transparent 30%),
    linear-gradient(135deg,#fff1f2 0%,#fff7ed 45%,#eef2ff 100%)!important;
  color:#111827!important;
  border-bottom:1px solid rgba(251,207,232,.92)!important;
  box-shadow:0 16px 34px rgba(244,114,182,.14),inset 0 -1px 0 rgba(255,255,255,.78)!important;
}
.msTop.msTopStyle-soft:before{inset:0!important;background:radial-gradient(circle at 72% 70%,rgba(255,255,255,.56),transparent 18%),radial-gradient(circle at 28% 22%,rgba(255,255,255,.46),transparent 16%)!important;}
.msTop.msTopStyle-soft:after{right:18px!important;top:10px!important;width:58px!important;height:58px!important;border-radius:50%!important;background:rgba(255,255,255,.38)!important;box-shadow:-42px 22px 0 rgba(255,255,255,.22),-95px 2px 0 rgba(244,114,182,.12)!important;}
.msTop.msTopStyle-soft .msBrandLogoArea{background:rgba(255,255,255,.72)!important;border:1px solid rgba(251,207,232,.95)!important;box-shadow:0 10px 24px rgba(244,114,182,.12),inset 0 1px 0 rgba(255,255,255,.88)!important;}
.msTop.msTopStyle-soft .msBrandText{color:#831843!important;text-shadow:0 1px 0 rgba(255,255,255,.9)!important;}
.msTop.msTopStyle-soft .msTagline,.msTop.msTopStyle-soft .msLogoSlogan{color:#9f1239!important;text-shadow:none!important;}
.msTop.msTopStyle-soft .msLoginBtn{background:rgba(255,255,255,.86)!important;color:#9f1239!important;border:1px solid rgba(251,207,232,.95)!important;box-shadow:0 9px 20px rgba(244,114,182,.16)!important;}
.msTop.msTopStyle-soft .msBrandDecor b{color:#db2777!important;text-shadow:0 0 12px rgba(244,114,182,.38)!important;}

/* 極簡細條：低高度、清楚線條、像正式工具列 */
.msTop.msTopStyle-compact{
  min-height:58px!important;
  padding:7px 14px!important;
  background:#ffffff!important;
  color:#111827!important;
  border-bottom:1px solid #d1d5db!important;
  box-shadow:0 3px 12px rgba(15,23,42,.06)!important;
}
.msTop.msTopStyle-compact:before{display:none!important;}
.msTop.msTopStyle-compact:after{left:0!important;right:0!important;bottom:0!important;height:2px!important;background:linear-gradient(90deg,#111827 0 38%,#facc15 38% 60%,#111827 60% 100%)!important;}
.msTop.msTopStyle-compact .msBrand{min-height:42px!important;}
.msTop.msTopStyle-compact .msBrandLogoArea{padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;}
.msTop.msTopStyle-compact .msLogoLong{height:40px!important;max-width:200px!important;}
.msTop.msTopStyle-compact .msLogoLong.large{height:44px!important;max-width:218px!important;}
.msTop.msTopStyle-compact .msLogoSq{width:40px!important;height:40px!important;}
.msTop.msTopStyle-compact .msLogoSlogan{display:none!important;}
.msTop.msTopStyle-compact .msBrandText{color:#111827!important;text-shadow:none!important;font-size:16px!important;}
.msTop.msTopStyle-compact .msTagline{color:#64748b!important;text-shadow:none!important;font-size:10px!important;}
.msTop.msTopStyle-compact .msLoginBtn{background:#fff!important;color:#111827!important;border:1px solid #d1d5db!important;box-shadow:none!important;font-size:8.5px!important;padding:5px 6px!important;}
.msTop.msTopStyle-compact .msBrandDecor b{display:none!important;}

@media(max-width:480px){
  .msTop[class*="msTopStyle-"]{padding-left:12px!important;padding-right:12px!important;}
  .msTop[class*="msTopStyle-"] .msBrandLogoArea{padding:6px 8px!important;border-radius:18px!important;}
  .msTop.msTopStyle-premium,.msTop.msTopStyle-gold{min-height:84px!important;}
  .msTop.msTopStyle-glass,.msTop.msTopStyle-soft{min-height:78px!important;}
  .msTop.msTopStyle-clean{min-height:72px!important;}
  .msTop.msTopStyle-compact{min-height:54px!important;padding-top:6px!important;padding-bottom:6px!important;}
  .msTop.msTopStyle-compact .msLogoLong{height:36px!important;max-width:165px!important;}
  .msTop.msTopStyle-compact .msLogoLong.large{height:40px!important;max-width:185px!important;}
  .msTop.msTopStyle-compact .msLogoSq{width:36px!important;height:36px!important;}
}
.msTop.msTopStyle-glass,.msTop.msTopStyle-soft{min-height:68px!important}.msTop.msTopStyle-compact{min-height:54px!important}.msTop.msTopStyle-compact .msLogoLong{height:38px!important;max-width:170px!important}.msTop.msTopStyle-compact .msLogoLong.large{height:42px!important;max-width:188px!important}.msTop.msTopStyle-compact .msLogoSq{width:38px!important;height:38px!important}}


/* ===== V28.99 full-width header bar redesign ===== */
.msTop[class*="msTopStyle-"]{overflow:hidden!important;isolation:isolate!important;position:sticky!important;top:0!important}
.msTop[class*="msTopStyle-"] .msBrand{position:relative!important;z-index:3!important;min-height:58px!important}
.msTop[class*="msTopStyle-"] .msBrandLogoArea{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important}
.msTop[class*="msTopStyle-"] .msBrandText,.msTop[class*="msTopStyle-"] .msTagline,.msTop[class*="msTopStyle-"] .msLogoSlogan,.msTop[class*="msTopStyle-"] .msLogoLong,.msTop[class*="msTopStyle-"] .msLogoSq{position:relative!important;z-index:3!important}
.msTop[class*="msTopStyle-"] .msLoginBtn{position:relative!important;z-index:3!important;font-weight:900!important;border-radius:999px!important;padding:7px 10px!important}
.msTop[class*="msTopStyle-"] .msBrandDecor{position:relative!important;z-index:3!important;gap:7px!important}
.msTop[class*="msTopStyle-"] .msBrandDecor b{font-size:16px!important}

/* keep original premium as-is but remove inner framed box feeling */
.msTop.msTopStyle-premium .msBrandLogoArea{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}

/* 白色極簡：整條白色，不再中間一塊卡片 */
.msTop.msTopStyle-clean{min-height:78px!important;padding:12px 16px!important;background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%)!important;color:#0f172a!important;border-bottom:1px solid #e5e7eb!important;box-shadow:0 12px 28px rgba(15,23,42,.07)!important}
.msTop.msTopStyle-clean:before{display:none!important}
.msTop.msTopStyle-clean:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:4px!important;background:linear-gradient(90deg,#111827 0%,#facc15 35%,#38bdf8 65%,#111827 100%)!important;opacity:.95!important}
.msTop.msTopStyle-clean .msBrandText{color:#111827!important;text-shadow:none!important}
.msTop.msTopStyle-clean .msTagline,.msTop.msTopStyle-clean .msLogoSlogan{color:#475569!important;text-shadow:none!important}
.msTop.msTopStyle-clean .msLoginBtn{background:#ffffff!important;color:#111827!important;border:1px solid #cbd5e1!important;box-shadow:0 6px 16px rgba(15,23,42,.08)!important}
.msTop.msTopStyle-clean .msBrandDecor b{color:#f59e0b!important;text-shadow:none!important}

/* 高科技未來感 */
.msTop.msTopStyle-future,.msTop.msTopStyle-glass{min-height:84px!important;padding:13px 16px!important;background:linear-gradient(120deg,#020617 0%,#071b2f 34%,#12243d 63%,#09090b 100%)!important;color:#ecfeff!important;border-bottom:1px solid rgba(56,189,248,.35)!important;box-shadow:0 18px 36px rgba(2,6,23,.42)!important}
.msTop.msTopStyle-future:before,.msTop.msTopStyle-glass:before{content:""!important;position:absolute!important;inset:0!important;background:repeating-linear-gradient(90deg,rgba(56,189,248,.14) 0 1px,transparent 1px 22px),repeating-linear-gradient(0deg,rgba(34,211,238,.09) 0 1px,transparent 1px 18px),radial-gradient(circle at 86% 18%,rgba(34,211,238,.28),transparent 18%),radial-gradient(circle at 18% 12%,rgba(168,85,247,.18),transparent 20%)!important;opacity:.95!important}
.msTop.msTopStyle-future:after,.msTop.msTopStyle-glass:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:5px!important;background:linear-gradient(90deg,transparent,#22d3ee,#a855f7,#38bdf8,transparent)!important;box-shadow:0 0 22px rgba(34,211,238,.85)!important}
.msTop.msTopStyle-future .msBrandText,.msTop.msTopStyle-glass .msBrandText{color:#f8fafc!important;text-shadow:0 0 16px rgba(34,211,238,.35)!important}
.msTop.msTopStyle-future .msTagline,.msTop.msTopStyle-future .msLogoSlogan,.msTop.msTopStyle-glass .msTagline,.msTop.msTopStyle-glass .msLogoSlogan{color:#bae6fd!important;text-shadow:0 0 10px rgba(34,211,238,.24)!important}
.msTop.msTopStyle-future .msLoginBtn,.msTop.msTopStyle-glass .msLoginBtn{background:linear-gradient(135deg,rgba(8,47,73,.94),rgba(12,74,110,.94))!important;color:#e0f2fe!important;border:1px solid rgba(34,211,238,.48)!important;box-shadow:0 0 0 1px rgba(34,211,238,.12) inset,0 8px 20px rgba(2,6,23,.32)!important}
.msTop.msTopStyle-future .msBrandDecor b,.msTop.msTopStyle-glass .msBrandDecor b{color:#22d3ee!important;text-shadow:0 0 16px rgba(34,211,238,.95)!important}

/* 聖誕節 */
.msTop.msTopStyle-christmas{min-height:84px!important;padding:13px 16px!important;background:linear-gradient(135deg,#7f1d1d 0%,#b91c1c 38%,#166534 100%)!important;color:#fff!important;border-bottom:1px solid rgba(255,255,255,.18)!important;box-shadow:0 18px 34px rgba(127,29,29,.34)!important}
.msTop.msTopStyle-christmas:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 14% 22%,rgba(255,255,255,.28) 0 2px,transparent 3px),radial-gradient(circle at 28% 58%,rgba(255,255,255,.22) 0 2px,transparent 3px),radial-gradient(circle at 64% 18%,rgba(255,255,255,.28) 0 2px,transparent 3px),radial-gradient(circle at 82% 48%,rgba(255,255,255,.22) 0 2px,transparent 3px),linear-gradient(120deg,rgba(255,255,255,.09),transparent 28%,rgba(255,255,255,.04) 55%,transparent 75%)!important}
.msTop.msTopStyle-christmas:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:6px!important;background:repeating-linear-gradient(90deg,#ffffff 0 18px,#dc2626 18px 36px,#ffffff 36px 54px,#16a34a 54px 72px)!important}
.msTop.msTopStyle-christmas .msBrandText{color:#fffaf0!important;text-shadow:0 0 12px rgba(255,255,255,.22)!important}
.msTop.msTopStyle-christmas .msTagline,.msTop.msTopStyle-christmas .msLogoSlogan{color:#fef3c7!important;text-shadow:none!important}
.msTop.msTopStyle-christmas .msLoginBtn{background:rgba(255,255,255,.16)!important;color:#fff!important;border:1px solid rgba(255,255,255,.34)!important;box-shadow:0 8px 18px rgba(0,0,0,.18)!important}
.msTop.msTopStyle-christmas .msBrandDecor b{color:#fde68a!important;text-shadow:0 0 14px rgba(255,255,255,.28)!important}

/* 農曆新年 */
.msTop.msTopStyle-lunar{min-height:84px!important;padding:13px 16px!important;background:linear-gradient(135deg,#7f1d1d 0%,#991b1b 22%,#b91c1c 58%,#7c2d12 100%)!important;color:#fff7d6!important;border-bottom:1px solid rgba(250,204,21,.42)!important;box-shadow:0 20px 38px rgba(127,29,29,.34)!important}
.msTop.msTopStyle-lunar:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 13% 26%,rgba(250,204,21,.22) 0 12px,transparent 13px),radial-gradient(circle at 87% 26%,rgba(250,204,21,.22) 0 12px,transparent 13px),linear-gradient(90deg,transparent 0 8%,rgba(250,204,21,.08) 8% 9%,transparent 9% 91%,rgba(250,204,21,.08) 91% 92%,transparent 92% 100%),repeating-linear-gradient(90deg,transparent 0 22px,rgba(250,204,21,.055) 22px 23px)!important;opacity:.96!important}
.msTop.msTopStyle-lunar:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:6px!important;background:linear-gradient(90deg,#7c2d12,#facc15,#fff7d6,#facc15,#7c2d12)!important;box-shadow:0 0 26px rgba(250,204,21,.8)!important}
.msTop.msTopStyle-lunar .msBrandText{color:#fff7d6!important;text-shadow:0 0 18px rgba(250,204,21,.22)!important}
.msTop.msTopStyle-lunar .msTagline,.msTop.msTopStyle-lunar .msLogoSlogan{color:#fde68a!important;text-shadow:none!important}
.msTop.msTopStyle-lunar .msLoginBtn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#7f1d1d!important;border:1px solid rgba(255,255,255,.32)!important;box-shadow:0 9px 22px rgba(250,204,21,.26)!important}
.msTop.msTopStyle-lunar .msBrandDecor b{color:#facc15!important;text-shadow:0 0 18px rgba(250,204,21,1)!important}

/* 黑金尊尚 */
.msTop.msTopStyle-gold{min-height:82px!important;padding:12px 16px!important;background:linear-gradient(135deg,#09090b 0%,#1c1917 38%,#111827 100%)!important;color:#fff7d6!important;border-bottom:1px solid rgba(250,204,21,.28)!important;box-shadow:0 18px 34px rgba(0,0,0,.34)!important}
.msTop.msTopStyle-gold:before{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(110deg,transparent 0 42%,rgba(255,255,255,.06) 42% 44%,transparent 44% 100%),radial-gradient(circle at 82% 18%,rgba(250,204,21,.16),transparent 18%),repeating-linear-gradient(90deg,transparent 0 26px,rgba(250,204,21,.04) 26px 27px)!important}
.msTop.msTopStyle-gold:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:5px!important;background:linear-gradient(90deg,#5b3c00,#facc15,#fff7d6,#facc15,#5b3c00)!important}
.msTop.msTopStyle-gold .msBrandText{color:#fff7d6!important;text-shadow:0 0 16px rgba(250,204,21,.22)!important}
.msTop.msTopStyle-gold .msTagline,.msTop.msTopStyle-gold .msLogoSlogan{color:#fde68a!important}
.msTop.msTopStyle-gold .msLoginBtn{background:linear-gradient(135deg,#1f2937,#111827)!important;color:#fde68a!important;border:1px solid rgba(250,204,21,.38)!important;box-shadow:0 8px 20px rgba(0,0,0,.22)!important}
.msTop.msTopStyle-gold .msBrandDecor b{color:#facc15!important;text-shadow:0 0 16px rgba(250,204,21,.92)!important}

/* 韓系柔和 */
.msTop.msTopStyle-korean,.msTop.msTopStyle-soft{min-height:80px!important;padding:12px 16px!important;background:linear-gradient(135deg,#fff7f8 0%,#fff4ef 42%,#eef4ff 100%)!important;color:#6b2148!important;border-bottom:1px solid rgba(244,114,182,.18)!important;box-shadow:0 14px 30px rgba(244,114,182,.12)!important}
.msTop.msTopStyle-korean:before,.msTop.msTopStyle-soft:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.62),transparent 16%),radial-gradient(circle at 82% 30%,rgba(255,255,255,.58),transparent 18%),radial-gradient(circle at 72% 82%,rgba(244,114,182,.10),transparent 16%)!important}
.msTop.msTopStyle-korean:after,.msTop.msTopStyle-soft:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:4px!important;background:linear-gradient(90deg,#f9a8d4,#fbcfe8,#c4b5fd,#93c5fd)!important;opacity:.9!important}
.msTop.msTopStyle-korean .msBrandText,.msTop.msTopStyle-soft .msBrandText{color:#7c2d5c!important;text-shadow:none!important}
.msTop.msTopStyle-korean .msTagline,.msTop.msTopStyle-korean .msLogoSlogan,.msTop.msTopStyle-soft .msTagline,.msTop.msTopStyle-soft .msLogoSlogan{color:#9d174d!important;text-shadow:none!important}
.msTop.msTopStyle-korean .msLoginBtn,.msTop.msTopStyle-soft .msLoginBtn{background:rgba(255,255,255,.92)!important;color:#9d174d!important;border:1px solid rgba(244,114,182,.18)!important;box-shadow:0 8px 16px rgba(244,114,182,.10)!important}
.msTop.msTopStyle-korean .msBrandDecor b,.msTop.msTopStyle-soft .msBrandDecor b{color:#ec4899!important;text-shadow:none!important}

/* 細條商務 */
.msTop.msTopStyle-compact{min-height:56px!important;padding:8px 14px!important;background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%)!important;color:#111827!important;border-bottom:1px solid #cbd5e1!important;box-shadow:0 6px 16px rgba(15,23,42,.05)!important}
.msTop.msTopStyle-compact:before{display:none!important}
.msTop.msTopStyle-compact:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:3px!important;background:linear-gradient(90deg,#111827 0 36%,#facc15 36% 62%,#38bdf8 62% 100%)!important}
.msTop.msTopStyle-compact .msBrand{min-height:40px!important}
.msTop.msTopStyle-compact .msLogoLong{height:38px!important;max-width:190px!important}
.msTop.msTopStyle-compact .msLogoLong.large{height:42px!important;max-width:208px!important}
.msTop.msTopStyle-compact .msLogoSq{width:38px!important;height:38px!important}
.msTop.msTopStyle-compact .msLogoSlogan{display:none!important}
.msTop.msTopStyle-compact .msBrandText{color:#111827!important;text-shadow:none!important;font-size:16px!important}
.msTop.msTopStyle-compact .msTagline{color:#64748b!important;font-size:10px!important;text-shadow:none!important}
.msTop.msTopStyle-compact .msLoginBtn{background:#fff!important;color:#111827!important;border:1px solid #cbd5e1!important;box-shadow:none!important;font-size:8.5px!important;padding:5px 7px!important}
.msTop.msTopStyle-compact .msBrandDecor b{display:none!important}

@media(max-width:480px){
  .msTop.msTopStyle-clean,.msTop.msTopStyle-korean,.msTop.msTopStyle-soft{min-height:72px!important}
  .msTop.msTopStyle-future,.msTop.msTopStyle-glass,.msTop.msTopStyle-christmas,.msTop.msTopStyle-lunar,.msTop.msTopStyle-gold,.msTop.msTopStyle-premium{min-height:78px!important}
  .msTop.msTopStyle-compact{min-height:52px!important;padding-top:7px!important;padding-bottom:7px!important}
  .msTop[class*="msTopStyle-"] .msLoginBtn{padding:6px 8px!important;font-size:9px!important}
}


/* ===== V29.00 restore the true original pre-header-style homepage bar ===== */
.msScreen.msView-home .msTop.msTopStyle-original{
  min-height:84px!important;
  padding:12px 16px 10px!important;
  background:linear-gradient(180deg,rgba(5,7,10,.96),rgba(5,7,10,.82))!important;
  box-shadow:none!important;
  border-bottom:0!important;
  color:#fff!important;
  overflow:hidden!important;
  position:sticky!important;
  top:0!important;
  z-index:8!important;
  backdrop-filter:blur(14px)!important;
}
.msScreen.msView-home .msTop.msTopStyle-original:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    radial-gradient(circle at 16% 50%,rgba(219,180,91,.22),transparent 28%),
    linear-gradient(90deg,rgba(219,180,91,.12),transparent 42%)!important;
  pointer-events:none!important;
}
.msScreen.msView-home .msTop.msTopStyle-original:after{display:none!important;content:none!important;}
.msScreen.msView-home .msTop.msTopStyle-original .msBrand{min-height:58px!important;position:relative!important;z-index:2!important;justify-content:space-between!important;}
.msScreen.msView-home .msTop.msTopStyle-original .msBrandLogoArea{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important;
  gap:4px!important;
}
.msScreen.msView-home .msTop.msTopStyle-original .msBrandText{
  color:#f3d58b!important;
  letter-spacing:-.03em!important;
  text-shadow:none!important;
}
.msScreen.msView-home .msTop.msTopStyle-original .msTagline{color:rgba(255,255,255,.64)!important;text-shadow:none!important;}
.msScreen.msView-home .msTop.msTopStyle-original .msLogoSlogan{
  color:#fff!important;
  text-shadow:0 0 12px rgba(255,255,255,.38),0 5px 13px rgba(0,0,0,.34)!important;
}
.msScreen.msView-home .msTop.msTopStyle-original .msLoginBtn{
  background:rgba(255,255,255,.08)!important;
  color:#f3d58b!important;
  border:1px solid rgba(219,180,91,.35)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10)!important;
  border-radius:999px!important;
  padding:7px 11px!important;
  font-weight:900!important;
}
.msScreen.msView-home .msTop.msTopStyle-original .msBrandDecor b{color:#d8b46a!important;text-shadow:0 0 18px rgba(216,180,106,.45)!important;}
@media(max-width:480px){
  .msScreen.msView-home .msTop.msTopStyle-original{min-height:80px!important;padding-left:12px!important;padding-right:12px!important;}
  .msScreen.msView-home .msTop.msTopStyle-original .msBrandLogoArea{padding:0!important;border-radius:0!important;}
  .msScreen.msView-home .msTop.msTopStyle-original .msLoginBtn{font-size:9.6px!important;padding:6px 8px!important;}
}


/* ===== V29.01 premium full banner theme overhaul ===== */
.msScreen.msView-home .msTop[class*="msTopStyle-"]{overflow:hidden!important;isolation:isolate!important;border-radius:0 0 24px 24px!important}
.msScreen.msView-home .msTop[class*="msTopStyle-"] .msBrand{min-height:64px!important;align-items:center!important}
.msScreen.msView-home .msTop[class*="msTopStyle-"] .msBrandLogoArea{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important}
.msScreen.msView-home .msTop[class*="msTopStyle-"] .msLoginBtn{border-radius:999px!important;padding:7px 11px!important;font-weight:900!important;letter-spacing:.2px!important}
.msScreen.msView-home .msTop[class*="msTopStyle-"] .msBrandDecor{gap:8px!important}

/* Original restored - untouched except clearer full banner feel */
.msScreen.msView-home .msTop.msTopStyle-original{min-height:84px!important;padding:13px 16px!important;border-radius:0 0 22px 22px!important}

/* Deep tech flagship */
.msScreen.msView-home .msTop.msTopStyle-premium{min-height:96px!important;padding:15px 16px!important;background:linear-gradient(135deg,#050816 0%,#0f172a 26%,#0b2440 62%,#111827 100%)!important;border-bottom:1px solid rgba(96,165,250,.22)!important;box-shadow:0 24px 44px rgba(2,6,23,.42)!important;color:#eff6ff!important}
.msScreen.msView-home .msTop.msTopStyle-premium:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 86% 20%,rgba(34,211,238,.26),transparent 16%),radial-gradient(circle at 18% 18%,rgba(250,204,21,.16),transparent 18%),repeating-linear-gradient(90deg,rgba(148,163,184,.08) 0 1px,transparent 1px 26px),linear-gradient(125deg,transparent 0 60%,rgba(255,255,255,.08) 60% 62%,transparent 62% 100%)!important;opacity:1!important}
.msScreen.msView-home .msTop.msTopStyle-premium:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:6px!important;background:linear-gradient(90deg,transparent,#38bdf8,#facc15,#38bdf8,transparent)!important;box-shadow:0 0 26px rgba(56,189,248,.52)!important}
.msScreen.msView-home .msTop.msTopStyle-premium .msBrandText{color:#ffffff!important;text-shadow:0 0 16px rgba(56,189,248,.28)!important}
.msScreen.msView-home .msTop.msTopStyle-premium .msTagline,.msScreen.msView-home .msTop.msTopStyle-premium .msLogoSlogan{color:#dbeafe!important}
.msScreen.msView-home .msTop.msTopStyle-premium .msLoginBtn{background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.10))!important;color:#eff6ff!important;border:1px solid rgba(125,211,252,.34)!important;box-shadow:0 10px 24px rgba(2,6,23,.22),inset 0 0 0 1px rgba(255,255,255,.06)!important}
.msScreen.msView-home .msTop.msTopStyle-premium .msBrandDecor b{color:#facc15!important;text-shadow:0 0 16px rgba(250,204,21,.92)!important}

/* Futuristic bay */
.msScreen.msView-home .msTop.msTopStyle-future,.msScreen.msView-home .msTop.msTopStyle-glass{min-height:98px!important;padding:16px 16px!important;background:linear-gradient(140deg,#020617 0%,#031525 28%,#082f49 58%,#0f172a 100%)!important;border-bottom:1px solid rgba(34,211,238,.34)!important;box-shadow:0 26px 48px rgba(2,6,23,.46)!important;color:#ecfeff!important}
.msScreen.msView-home .msTop.msTopStyle-future:before,.msScreen.msView-home .msTop.msTopStyle-glass:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 88% 18%,rgba(34,211,238,.30),transparent 16%),radial-gradient(circle at 10% 72%,rgba(168,85,247,.18),transparent 18%),linear-gradient(90deg,transparent 0 7%,rgba(34,211,238,.11) 7% 7.7%,transparent 7.7% 92.3%,rgba(34,211,238,.11) 92.3% 93%,transparent 93% 100%),repeating-linear-gradient(90deg,rgba(34,211,238,.12) 0 1px,transparent 1px 30px),repeating-linear-gradient(0deg,rgba(14,165,233,.08) 0 1px,transparent 1px 22px)!important}
.msScreen.msView-home .msTop.msTopStyle-future:after,.msScreen.msView-home .msTop.msTopStyle-glass:after{content:""!important;position:absolute!important;left:14px!important;right:14px!important;bottom:10px!important;height:1px!important;background:linear-gradient(90deg,transparent,#22d3ee,#a855f7,#22d3ee,transparent)!important;box-shadow:0 0 18px rgba(34,211,238,.9),0 -9px 0 rgba(34,211,238,.18)!important}
.msScreen.msView-home .msTop.msTopStyle-future .msBrandText,.msScreen.msView-home .msTop.msTopStyle-glass .msBrandText{color:#f0f9ff!important;text-shadow:0 0 18px rgba(34,211,238,.36)!important}
.msScreen.msView-home .msTop.msTopStyle-future .msTagline,.msScreen.msView-home .msTop.msTopStyle-future .msLogoSlogan,.msScreen.msView-home .msTop.msTopStyle-glass .msTagline,.msScreen.msView-home .msTop.msTopStyle-glass .msLogoSlogan{color:#bae6fd!important}
.msScreen.msView-home .msTop.msTopStyle-future .msLoginBtn,.msScreen.msView-home .msTop.msTopStyle-glass .msLoginBtn{background:linear-gradient(135deg,rgba(8,47,73,.96),rgba(6,78,99,.92))!important;color:#e0f2fe!important;border:1px solid rgba(34,211,238,.52)!important;box-shadow:0 10px 24px rgba(2,6,23,.28),inset 0 0 0 1px rgba(34,211,238,.08)!important}
.msScreen.msView-home .msTop.msTopStyle-future .msBrandDecor b,.msScreen.msView-home .msTop.msTopStyle-glass .msBrandDecor b{color:#67e8f9!important;text-shadow:0 0 18px rgba(34,211,238,.95)!important}

/* Christmas deluxe */
.msScreen.msView-home .msTop.msTopStyle-christmas{min-height:98px!important;padding:16px 16px!important;background:linear-gradient(135deg,#7f1d1d 0%,#991b1b 30%,#166534 100%)!important;border-bottom:1px solid rgba(255,255,255,.20)!important;box-shadow:0 26px 46px rgba(127,29,29,.34)!important;color:#fff!important}
.msScreen.msView-home .msTop.msTopStyle-christmas:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 12% 18%,rgba(255,255,255,.35) 0 3px,transparent 4px),radial-gradient(circle at 24% 52%,rgba(255,255,255,.24) 0 3px,transparent 4px),radial-gradient(circle at 62% 16%,rgba(255,255,255,.34) 0 3px,transparent 4px),radial-gradient(circle at 84% 42%,rgba(255,255,255,.22) 0 3px,transparent 4px),linear-gradient(180deg,rgba(255,255,255,.05),transparent 38%),linear-gradient(120deg,transparent 0 48%,rgba(255,255,255,.08) 48% 50%,transparent 50% 100%)!important}
.msScreen.msView-home .msTop.msTopStyle-christmas:after{content:""!important;position:absolute!important;right:14px!important;top:14px!important;width:66px!important;height:66px!important;border-radius:50%!important;background:rgba(255,255,255,.08)!important;box-shadow:-54px 20px 0 -18px rgba(255,255,255,.08),0 56px 0 -28px rgba(255,255,255,.06),0 0 0 2px rgba(255,255,255,.08),0 0 0 10px rgba(34,197,94,.12)!important}
.msScreen.msView-home .msTop.msTopStyle-christmas .msBrandText{color:#fffaf0!important;text-shadow:0 0 14px rgba(255,255,255,.22)!important}
.msScreen.msView-home .msTop.msTopStyle-christmas .msTagline,.msScreen.msView-home .msTop.msTopStyle-christmas .msLogoSlogan{color:#fef3c7!important}
.msScreen.msView-home .msTop.msTopStyle-christmas .msLoginBtn{background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.10))!important;color:#fff!important;border:1px solid rgba(255,255,255,.34)!important;box-shadow:0 10px 24px rgba(0,0,0,.18)!important}
.msScreen.msView-home .msTop.msTopStyle-christmas .msBrandDecor b{color:#fde68a!important;text-shadow:0 0 14px rgba(255,255,255,.3)!important}

/* Lunar deluxe */
.msScreen.msView-home .msTop.msTopStyle-lunar{min-height:100px!important;padding:16px 16px!important;background:linear-gradient(135deg,#7f1d1d 0%,#991b1b 22%,#b91c1c 60%,#7c2d12 100%)!important;border-bottom:1px solid rgba(250,204,21,.45)!important;box-shadow:0 28px 50px rgba(127,29,29,.36)!important;color:#fff7d6!important}
.msScreen.msView-home .msTop.msTopStyle-lunar:before{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(90deg,transparent 0 7%,rgba(250,204,21,.10) 7% 7.8%,transparent 7.8% 92.2%,rgba(250,204,21,.10) 92.2% 93%,transparent 93% 100%),radial-gradient(circle at 12% 22%,rgba(250,204,21,.28) 0 14px,transparent 15px),radial-gradient(circle at 88% 22%,rgba(250,204,21,.28) 0 14px,transparent 15px),repeating-linear-gradient(90deg,transparent 0 26px,rgba(250,204,21,.05) 26px 27px)!important}
.msScreen.msView-home .msTop.msTopStyle-lunar:after{content:""!important;position:absolute!important;right:16px!important;top:16px!important;width:58px!important;height:58px!important;border-radius:50%!important;background:radial-gradient(circle at 35% 35%,#fff7d6,#facc15 62%,#f59e0b 100%)!important;box-shadow:-64px 0 0 -14px rgba(250,204,21,.18),0 0 26px rgba(250,204,21,.48)!important;opacity:.92!important}
.msScreen.msView-home .msTop.msTopStyle-lunar .msBrandText{color:#fff7d6!important;text-shadow:0 0 20px rgba(250,204,21,.22)!important}
.msScreen.msView-home .msTop.msTopStyle-lunar .msTagline,.msScreen.msView-home .msTop.msTopStyle-lunar .msLogoSlogan{color:#fde68a!important}
.msScreen.msView-home .msTop.msTopStyle-lunar .msLoginBtn{background:linear-gradient(135deg,#facc15,#f59e0b)!important;color:#7f1d1d!important;border:1px solid rgba(255,255,255,.32)!important;box-shadow:0 10px 24px rgba(250,204,21,.28)!important}
.msScreen.msView-home .msTop.msTopStyle-lunar .msBrandDecor b{color:#facc15!important;text-shadow:0 0 18px rgba(250,204,21,.98)!important}

/* Gold deluxe */
.msScreen.msView-home .msTop.msTopStyle-gold{min-height:94px!important;padding:15px 16px!important;background:linear-gradient(135deg,#09090b 0%,#171717 32%,#111827 100%)!important;border-bottom:1px solid rgba(250,204,21,.28)!important;box-shadow:0 24px 44px rgba(0,0,0,.38)!important;color:#fff7d6!important}
.msScreen.msView-home .msTop.msTopStyle-gold:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 84% 16%,rgba(250,204,21,.16),transparent 14%),linear-gradient(115deg,transparent 0 44%,rgba(255,255,255,.07) 44% 46%,transparent 46% 100%),repeating-linear-gradient(90deg,transparent 0 28px,rgba(250,204,21,.05) 28px 29px)!important}
.msScreen.msView-home .msTop.msTopStyle-gold:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:5px!important;background:linear-gradient(90deg,#5b3c00,#facc15,#fff7d6,#facc15,#5b3c00)!important;box-shadow:0 0 24px rgba(250,204,21,.46)!important}
.msScreen.msView-home .msTop.msTopStyle-gold .msBrandText{color:#fff7d6!important;text-shadow:0 0 16px rgba(250,204,21,.18)!important}
.msScreen.msView-home .msTop.msTopStyle-gold .msTagline,.msScreen.msView-home .msTop.msTopStyle-gold .msLogoSlogan{color:#fde68a!important}
.msScreen.msView-home .msTop.msTopStyle-gold .msLoginBtn{background:linear-gradient(135deg,#1f2937,#111827)!important;color:#fde68a!important;border:1px solid rgba(250,204,21,.42)!important;box-shadow:0 10px 22px rgba(0,0,0,.24)!important}
.msScreen.msView-home .msTop.msTopStyle-gold .msBrandDecor b{color:#facc15!important;text-shadow:0 0 16px rgba(250,204,21,.9)!important}

/* Korean gentle */
.msScreen.msView-home .msTop.msTopStyle-korean,.msScreen.msView-home .msTop.msTopStyle-soft{min-height:92px!important;padding:15px 16px!important;background:linear-gradient(135deg,#fff8f8 0%,#fff6f1 38%,#f2f7ff 100%)!important;border-bottom:1px solid rgba(244,114,182,.16)!important;box-shadow:0 20px 36px rgba(244,114,182,.10)!important;color:#7c2d5c!important}
.msScreen.msView-home .msTop.msTopStyle-korean:before,.msScreen.msView-home .msTop.msTopStyle-soft:before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 18% 16%,rgba(255,255,255,.68),transparent 16%),radial-gradient(circle at 82% 22%,rgba(255,255,255,.62),transparent 18%),radial-gradient(circle at 70% 82%,rgba(244,114,182,.11),transparent 16%),linear-gradient(120deg,transparent 0 55%,rgba(255,255,255,.26) 55% 62%,transparent 62% 100%)!important}
.msScreen.msView-home .msTop.msTopStyle-korean:after,.msScreen.msView-home .msTop.msTopStyle-soft:after{content:""!important;position:absolute!important;right:18px!important;top:15px!important;width:76px!important;height:34px!important;border-radius:999px!important;background:rgba(255,255,255,.42)!important;box-shadow:-54px 18px 0 rgba(255,255,255,.18)!important}
.msScreen.msView-home .msTop.msTopStyle-korean .msBrandText,.msScreen.msView-home .msTop.msTopStyle-soft .msBrandText{color:#7c2d5c!important;text-shadow:none!important}
.msScreen.msView-home .msTop.msTopStyle-korean .msTagline,.msScreen.msView-home .msTop.msTopStyle-korean .msLogoSlogan,.msScreen.msView-home .msTop.msTopStyle-soft .msTagline,.msScreen.msView-home .msTop.msTopStyle-soft .msLogoSlogan{color:#9d174d!important}
.msScreen.msView-home .msTop.msTopStyle-korean .msLoginBtn,.msScreen.msView-home .msTop.msTopStyle-soft .msLoginBtn{background:rgba(255,255,255,.94)!important;color:#9d174d!important;border:1px solid rgba(244,114,182,.16)!important;box-shadow:0 8px 18px rgba(244,114,182,.08)!important}
.msScreen.msView-home .msTop.msTopStyle-korean .msBrandDecor b,.msScreen.msView-home .msTop.msTopStyle-soft .msBrandDecor b{color:#ec4899!important;text-shadow:none!important}

/* Clean luxury */
.msScreen.msView-home .msTop.msTopStyle-clean{min-height:88px!important;padding:14px 16px!important;background:linear-gradient(180deg,#ffffff 0%,#fbfdff 58%,#f8fafc 100%)!important;border-bottom:1px solid #e2e8f0!important;box-shadow:0 20px 36px rgba(15,23,42,.06)!important;color:#0f172a!important}
.msScreen.msView-home .msTop.msTopStyle-clean:before{content:""!important;position:absolute!important;inset:0!important;background:linear-gradient(115deg,transparent 0 52%,rgba(15,23,42,.04) 52% 60%,transparent 60% 100%),radial-gradient(circle at 88% 16%,rgba(250,204,21,.14),transparent 14%)!important}
.msScreen.msView-home .msTop.msTopStyle-clean:after{content:""!important;position:absolute!important;left:16px!important;right:16px!important;bottom:10px!important;height:3px!important;border-radius:999px!important;background:linear-gradient(90deg,#111827,#facc15,#38bdf8,#111827)!important;opacity:.9!important}
.msScreen.msView-home .msTop.msTopStyle-clean .msBrandText{color:#111827!important;text-shadow:none!important}
.msScreen.msView-home .msTop.msTopStyle-clean .msTagline,.msScreen.msView-home .msTop.msTopStyle-clean .msLogoSlogan{color:#475569!important}
.msScreen.msView-home .msTop.msTopStyle-clean .msLoginBtn{background:#fff!important;color:#111827!important;border:1px solid #cbd5e1!important;box-shadow:0 8px 18px rgba(15,23,42,.06)!important}
.msScreen.msView-home .msTop.msTopStyle-clean .msBrandDecor b{color:#f59e0b!important;text-shadow:none!important}

/* compact business refined */
.msScreen.msView-home .msTop.msTopStyle-compact{min-height:60px!important;padding:8px 14px!important;background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%)!important;border-bottom:1px solid #cbd5e1!important;box-shadow:0 8px 18px rgba(15,23,42,.05)!important;color:#111827!important}
.msScreen.msView-home .msTop.msTopStyle-compact:before{display:none!important}
.msScreen.msView-home .msTop.msTopStyle-compact:after{content:""!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:3px!important;background:linear-gradient(90deg,#111827 0 34%,#facc15 34% 60%,#38bdf8 60% 100%)!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msBrand{min-height:42px!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msLogoLong{height:38px!important;max-width:186px!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msLogoLong.large{height:42px!important;max-width:204px!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msLogoSq{width:38px!important;height:38px!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msLogoSlogan{display:none!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msTagline{font-size:10px!important;color:#64748b!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msLoginBtn{font-size:8.5px!important;padding:5px 7px!important;background:#fff!important;color:#111827!important;border:1px solid #cbd5e1!important;box-shadow:none!important}
.msScreen.msView-home .msTop.msTopStyle-compact .msBrandDecor b{display:none!important}

@media(max-width:480px){
  .msScreen.msView-home .msTop.msTopStyle-premium,.msScreen.msView-home .msTop.msTopStyle-future,.msScreen.msView-home .msTop.msTopStyle-glass,.msScreen.msView-home .msTop.msTopStyle-christmas,.msScreen.msView-home .msTop.msTopStyle-lunar,.msScreen.msView-home .msTop.msTopStyle-gold{min-height:84px!important;padding-top:13px!important;padding-bottom:13px!important}
  .msScreen.msView-home .msTop.msTopStyle-korean,.msScreen.msView-home .msTop.msTopStyle-soft,.msScreen.msView-home .msTop.msTopStyle-clean,.msScreen.msView-home .msTop.msTopStyle-original{min-height:76px!important}
  .msScreen.msView-home .msTop.msTopStyle-compact{min-height:54px!important}
}


/* ===== V29.02 header radius + holiday logo overlap fix ===== */
/* 1) remove bottom rounded corners on the full header banner */
.msScreen.msView-home .msTop[class*="msTopStyle-"]{border-radius:0!important;}

/* 2) holiday themes: keep decorations away from logo / content area */
.msScreen.msView-home .msTop.msTopStyle-christmas,
.msScreen.msView-home .msTop.msTopStyle-lunar{padding-right:16px!important;}
.msScreen.msView-home .msTop.msTopStyle-christmas .msBrand,
.msScreen.msView-home .msTop.msTopStyle-lunar .msBrand{position:relative!important;z-index:4!important;}
.msScreen.msView-home .msTop.msTopStyle-christmas .msBrandLogoArea,
.msScreen.msView-home .msTop.msTopStyle-lunar .msBrandLogoArea{padding-right:10px!important;}

/* Christmas: replace large overlapping ornament with smaller corner decoration */
.msScreen.msView-home .msTop.msTopStyle-christmas:after{
  content:""!important;
  position:absolute!important;
  right:6px!important;
  top:6px!important;
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,.95),rgba(255,255,255,.35) 55%,rgba(255,255,255,0) 70%)!important;
  box-shadow:0 0 0 2px rgba(255,255,255,.12), 0 0 18px rgba(255,255,255,.18)!important;
  opacity:.65!important;
  z-index:1!important;
}
.msScreen.msView-home .msTop.msTopStyle-christmas:before{
  background:
    radial-gradient(circle at 9% 18%,rgba(255,255,255,.28) 0 2px,transparent 3px),
    radial-gradient(circle at 20% 46%,rgba(255,255,255,.20) 0 2px,transparent 3px),
    radial-gradient(circle at 58% 14%,rgba(255,255,255,.26) 0 2px,transparent 3px),
    radial-gradient(circle at 78% 34%,rgba(255,255,255,.18) 0 2px,transparent 3px),
    linear-gradient(180deg,rgba(255,255,255,.05),transparent 38%),
    linear-gradient(120deg,transparent 0 58%,rgba(255,255,255,.06) 58% 60%,transparent 60% 100%)!important;
}

/* Lunar New Year: shrink moon / lantern effect and push it to corner */
.msScreen.msView-home .msTop.msTopStyle-lunar:after{
  content:""!important;
  position:absolute!important;
  right:6px!important;
  top:8px!important;
  width:38px!important;
  height:38px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at 35% 35%,#fff7d6,#facc15 62%,#f59e0b 100%)!important;
  box-shadow:0 0 18px rgba(250,204,21,.34)!important;
  opacity:.78!important;
  z-index:1!important;
}
.msScreen.msView-home .msTop.msTopStyle-lunar:before{
  background:
    linear-gradient(90deg,transparent 0 6%,rgba(250,204,21,.08) 6% 6.6%,transparent 6.6% 93.4%,rgba(250,204,21,.08) 93.4% 94%,transparent 94% 100%),
    radial-gradient(circle at 8% 22%,rgba(250,204,21,.18) 0 10px,transparent 11px),
    radial-gradient(circle at 94% 18%,rgba(250,204,21,.18) 0 8px,transparent 9px),
    repeating-linear-gradient(90deg,transparent 0 28px,rgba(250,204,21,.045) 28px 29px)!important;
}

@media(max-width:480px){
  .msScreen.msView-home .msTop.msTopStyle-christmas:after{right:4px!important;top:6px!important;width:28px!important;height:28px!important;}
  .msScreen.msView-home .msTop.msTopStyle-lunar:after{right:4px!important;top:7px!important;width:30px!important;height:30px!important;}
}

/* ===== V29.20 PWA add-to-home-screen prompt ===== */
.msPwaInstallOverlay{position:fixed;inset:0;z-index:180;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(180deg,rgba(15,23,42,.10),rgba(15,23,42,.42));padding:14px;box-sizing:border-box}.msPwaInstallCard{position:relative;width:100%;max-width:390px;background:rgba(255,255,255,.98);border:1px solid rgba(226,232,240,.96);border-radius:26px 26px 22px 22px;box-shadow:0 28px 80px rgba(15,23,42,.36);padding:18px;color:#111827;animation:msPwaUp .22s ease-out}.msPwaHead{display:flex;gap:13px;align-items:flex-start}.msPwaHead h2{font-size:20px;line-height:1.18;margin:0 26px 6px 0;letter-spacing:-.4px}.msPwaHead p{margin:0;color:#475569;font-size:13px;line-height:1.55}.msPwaIcon{width:54px;height:54px;flex:0 0 54px;border-radius:15px;background:linear-gradient(135deg,#111827,#facc15);display:grid;place-items:center;color:#fff;font-weight:900;font-size:22px;box-shadow:0 12px 26px rgba(15,23,42,.20);overflow:hidden}.msPwaIcon img{width:100%;height:100%;object-fit:cover;display:block}.msPwaGuide{margin:14px 0 0;background:#f8fafc;border:1px solid #e2e8f0;border-radius:18px;padding:12px 13px;color:#334155;font-size:12.5px;line-height:1.55}.msPwaGuide b{display:block;color:#111827;margin-bottom:6px}.msPwaGuide ol{margin:0;padding-left:19px}.msPwaGuide li{margin:2px 0}.msPwaHint{margin-top:12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:16px;padding:10px 12px;color:#1e3a8a;font-size:12px;line-height:1.5}.msPwaUrl{margin-top:12px;padding:9px 11px;border-radius:14px;background:#fffbeb;border:1px solid #fde68a;color:#92400e;font-size:11.5px;line-height:1.35;word-break:break-all}.msPwaActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.msPwaPrimary,.msPwaSecondary{border:0;border-radius:16px;padding:12px 10px;font-weight:900;font-size:13px}.msPwaPrimary{background:#111827;color:#fff;box-shadow:0 12px 26px rgba(15,23,42,.20)}.msPwaSecondary{background:#f1f5f9;color:#334155;border:1px solid #e2e8f0}.msPwaClose{position:absolute;right:13px;top:13px;width:30px;height:30px;border-radius:50%;border:1px solid #e2e8f0;background:#fff;color:#64748b;font-size:20px;line-height:1;display:grid;place-items:center}.msPwaPrimary:active,.msPwaSecondary:active,.msPwaClose:active{transform:scale(.98)}@keyframes msPwaUp{from{transform:translateY(22px);opacity:.35}to{transform:translateY(0);opacity:1}}@media(max-width:480px){.msPwaInstallOverlay{align-items:flex-end;padding:10px}.msPwaInstallCard{border-radius:24px 24px 18px 18px;padding:16px}.msPwaActions{grid-template-columns:1fr}.msPwaPrimary,.msPwaSecondary{padding:12px}}

/* ===== V29.20 iPhone / Android PWA install modal safe-area fix ===== */
.msPwaInstallOverlay{
  align-items:center!important;
  padding:calc(12px + env(safe-area-inset-top)) 12px calc(22px + env(safe-area-inset-bottom)) 12px!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}
.msPwaInstallCard{
  max-height:calc(100dvh - 42px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;
}
.msPwaActions{
  position:sticky!important;
  bottom:0!important;
  background:linear-gradient(180deg,rgba(255,255,255,.74),#fff 30%)!important;
  padding-top:12px!important;
  margin-bottom:0!important;
  z-index:2!important;
}
.msPwaGuide{max-height:36dvh!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important;}
@media(max-width:480px){
  .msPwaInstallOverlay{align-items:center!important;padding:calc(10px + env(safe-area-inset-top)) 10px calc(24px + env(safe-area-inset-bottom)) 10px!important;}
  .msPwaInstallCard{max-height:calc(100dvh - 34px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;padding:16px!important;padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;}
  .msPwaGuide{max-height:34dvh!important;}
}


/* ===== V29.20 iPhone Safari + iPhone Chrome + Android install guides ===== */
.msPwaGuideIos{max-height:none!important;}
.msPwaTwoGuides{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.msPwaMiniGuide{background:#fff;border:1px solid #e2e8f0;border-radius:15px;padding:10px;box-shadow:0 8px 18px rgba(15,23,42,.04)}
.msPwaMiniGuide.active{border-color:#111827;box-shadow:0 0 0 2px rgba(17,24,39,.08),0 10px 22px rgba(15,23,42,.08)}
.msPwaMiniTitle{font-weight:900;font-size:13px;color:#111827;margin-bottom:6px}
.msPwaMiniGuide ol{padding-left:17px;margin:0}.msPwaMiniGuide li{margin:3px 0;line-height:1.42}.msPwaMiniNote{margin-top:8px;font-size:11px;line-height:1.42;color:#64748b;background:#f8fafc;border-radius:10px;padding:7px}
.msPwaGuideAndroid{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1e3a8a!important;max-height:none!important}
.msPwaAndroidBox{display:flex;align-items:center;gap:12px;margin-top:8px;background:#fff;border:1px solid #bfdbfe;border-radius:16px;padding:11px}.msPwaAndroidBox p{margin:4px 0 0;font-size:12px;line-height:1.45;color:#1e3a8a}.msPwaAndroidPhone{font-size:30px;filter:drop-shadow(0 8px 10px rgba(30,58,138,.14))}
@media(max-width:480px){.msPwaTwoGuides{grid-template-columns:1fr;gap:8px}.msPwaMiniGuide{padding:9px}.msPwaMiniNote{font-size:10.8px}.msPwaAndroidBox{padding:10px}.msPwaGuide{max-height:42dvh!important}}

/* ===== V29.20 PWA install prompt wording / top-safe layout fix ===== */
.msPwaInstallOverlay{
  align-items:flex-start!important;
  justify-content:center!important;
  padding:calc(22px + env(safe-area-inset-top)) 12px calc(22px + env(safe-area-inset-bottom)) 12px!important;
  overflow-y:auto!important;
}
.msPwaInstallCard{
  margin-top:0!important;
  max-height:calc(100dvh - 54px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  overflow-y:auto!important;
  padding-top:18px!important;
  padding-bottom:calc(18px + env(safe-area-inset-bottom))!important;
}
.msPwaHead h2{font-size:19px!important;margin-right:34px!important;}
.msPwaActions.single{grid-template-columns:1fr!important;}
.msPwaActions.single .msPwaSecondary{width:100%!important;}
.msPwaGuideIos{max-height:none!important;overflow:visible!important;}
@media(max-width:480px){
  .msPwaInstallOverlay{align-items:flex-start!important;padding:calc(20px + env(safe-area-inset-top)) 10px calc(24px + env(safe-area-inset-bottom)) 10px!important;}
  .msPwaInstallCard{max-height:calc(100dvh - 52px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;}
  .msPwaHead h2{font-size:18px!important;line-height:1.2!important;}
}


/* ===== V29.20 startup ad fit fix without changing bottom navigation ===== */
.msAdOverlay{padding:calc(18px + env(safe-area-inset-top)) 18px calc(18px + env(safe-area-inset-bottom))!important;align-items:center!important;justify-items:center!important;overflow:auto!important;z-index:80!important;}
.msAdCard{width:min(360px,94%)!important;max-height:calc(100% - 18px)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;border-radius:26px!important;}
.msAdImg{width:100%!important;max-height:min(58vh,520px)!important;aspect-ratio:auto!important;object-fit:contain!important;background:#111827!important;display:block!important;flex:0 1 auto!important;}
.msAdContent{padding:14px 16px 16px!important;flex:0 0 auto!important;background:#fff!important;}
.msAdContent h2{font-size:18px!important;line-height:1.25!important;margin:0 0 6px!important;}
.msAdContent p{max-height:4.8em!important;overflow:auto!important;}
.msAdControls{display:flex!important;gap:10px!important;align-items:center!important;margin-top:12px!important;}
.msAdControls .msCount{margin-top:0!important;flex:1!important;}
.msAdSkip{border:0!important;border-radius:999px!important;background:#f3f4f6!important;color:#111827!important;font-weight:900!important;padding:9px 13px!important;white-space:nowrap!important;}
@media(max-width:480px){.msAdCard{width:min(350px,94%)!important;max-height:calc(100dvh - 56px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important}.msAdImg{max-height:52vh!important}.msAdContent{padding:12px 14px 14px!important}.msAdContent h2{font-size:16px!important}.msAdControls{gap:8px!important}.msAdSkip{padding:8px 11px!important}}

/* V29.88: clearer notice text without changing UI layout */
@media(max-width:360px){.msNotice,.msRequiredText{font-size:12.5px}.msInputHint{font-size:11.5px}.msTagline{font-size:11px}}

/* V29.92: locked member identity fields */
.msLockedInput{background:#f8fafc!important;color:#475569!important;border-color:#e2e8f0!important;font-weight:800!important;opacity:1!important;cursor:not-allowed!important}


.msPayLogoRow{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px}
.msPayLogoRow span{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:4px 8px;border-radius:8px;background:#fff;border:1px solid #dbeafe;color:#0f172a;font-size:10.5px;font-weight:900;letter-spacing:.02em;box-shadow:0 3px 8px rgba(15,23,42,.06)}
.msPayLogoRow span:nth-child(3),.msPayLogoRow span:nth-child(4){font-size:10px}
@media(max-width:360px){.msPayLogoRow span{font-size:9.5px;padding:4px 6px}}


/* V29.98: payment logo cards */
.msPayLogoGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin:6px 0 4px}
.msPayLogoCard{min-height:34px;border-radius:9px;background:#fff;border:1px solid #e2e8f0;box-shadow:0 4px 12px rgba(15,23,42,.05);display:flex;align-items:center;justify-content:center;gap:4px;padding:4px 5px;overflow:hidden}
.msPayLogoCard .msLogoWord{display:inline-flex;align-items:center;justify-content:center;font-weight:900;line-height:1;white-space:nowrap}
.msVisaLogo .msLogoWord{font-size:14px;letter-spacing:.03em;color:#1a1f71;font-style:italic}
.msMasterLogo .msLogoWord{font-size:8px;color:#111;text-transform:lowercase}
.msMasterCircles{display:inline-flex;align-items:center;position:relative;width:23px;height:14px}
.msMasterCircles i{display:block;position:absolute;width:13px;height:13px;border-radius:999px;top:1px}
.msMasterCircles i:first-child{left:2px;background:#eb001b}
.msMasterCircles i:last-child{left:9px;background:#f79e1b;mix-blend-mode:multiply}
.msAppleLogo .msLogoWord{font-size:13px;color:#000;font-weight:800}
.msAppleLogo .msLogoWord b{font-size:16px;font-weight:700;margin-right:1px}
.msGoogleLogo .msLogoWord{font-size:10.5px;color:#202124;font-weight:700;letter-spacing:-.02em}
.msGoogleLogo .gBlue{color:#4285f4}.msGoogleLogo .gRed{color:#ea4335}.msGoogleLogo .gYellow{color:#fbbc05}.msGoogleLogo .gGreen{color:#34a853}
.msAlipayLogo .msLogoWord{font-size:12.5px;color:#111}
.msAliBadge{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:3px;background:#1677ff;color:#fff;font-size:10.5px;font-weight:900}
.msWechatLogo .msLogoWord{font-size:8.5px;color:#111}
.msAmexLogo{background:#fff}
.msAmexLogo .msLogoWord{display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:.92;font-size:7px;letter-spacing:.05em;color:#1f7dc6;font-weight:900;text-transform:uppercase}
.msUnionPayLogo .msUnionPayBadge{display:inline-flex;align-items:center;gap:4px}
.msUnionPayLogo .msUnionPayBadge i{display:inline-flex;align-items:center;justify-content:center;height:16px;padding:0 4px;border-radius:4px;background:linear-gradient(90deg,#d91f26 0 33%,#0e57a5 33% 66%,#0b8a43 66% 100%);color:#fff;font-style:normal;font-size:8.5px;font-weight:900;letter-spacing:.02em}
.msUnionPayLogo .msUnionPayBadge b{font-size:8.5px;color:#1f2937;letter-spacing:.01em}
.msWechatBubbles{display:inline-flex;position:relative;width:20px;height:16px}
.msWechatBubbles i{position:absolute;display:block;border-radius:999px;background:#22c55e}
.msWechatBubbles i:first-child{width:13px;height:13px;left:0;top:2px}
.msWechatBubbles i:last-child{width:11px;height:11px;left:9px;top:0}
@media(max-width:600px){
  .msPayLogoGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .msPayLogoCard{min-height:32px}
  .msVisaLogo .msLogoWord{font-size:13px}
  .msGoogleLogo .msLogoWord{font-size:10px}
  .msAlipayLogo .msLogoWord{font-size:11px}
  .msAmexLogo .msLogoWord{font-size:6.8px}
  .msUnionPayLogo .msUnionPayBadge b{font-size:8px}
}

/* V30.04: password visibility eye button */
.msPasswordBox{display:flex;align-items:center;gap:6px}
.msPasswordBox input{flex:1;min-width:0}
.msEyeBtn{width:42px;min-height:42px;border-radius:10px;border:1px solid #dbeafe;background:#fff;color:#0f172a;font-size:18px;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(15,23,42,.06)}
.msEyeBtn:active{transform:scale(.97)}

/* V30.10: collapsed password change panel */
.msPasswordChangeCard{padding-top:12px}
.msPasswordToggleBtn{width:100%;font-weight:900}
.msPasswordChangePanel{margin-top:12px;padding-top:12px;border-top:1px solid rgba(148,163,184,.28)}
