
:root{--ui-font:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif;--ui-title-weight:700;--ui-label-weight:600}
html,body,button,input,select,textarea{font-family:var(--ui-font)!important}
body{font-weight:400!important;letter-spacing:0!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.category-catalog-page,.category-catalog-page button,.category-catalog-page select,.category-catalog-page input{font-weight:400}
.category-catalog-page h1,.category-catalog-page h2,.category-catalog-page h3,.category-catalog-page b,.category-catalog-page strong{font-weight:700!important}
.category-catalog-page .category-page-copy h1{font-size:1.86rem!important;line-height:1.2!important;letter-spacing:-.015em!important}
.category-catalog-page .category-page-copy>span{font-size:.84rem!important;font-weight:600!important}
.category-catalog-page .v6-helper-copy span{font-weight:600!important}
.category-catalog-page .v6-helper-copy b{font-size:1.08rem!important;line-height:1.5!important;font-weight:700!important}
.category-catalog-page .v6-helper-copy small{font-size:.87rem!important;line-height:1.55!important;font-weight:400!important}


.category-catalog-page{width:100%;min-width:0}

.category-catalog-page>.catalog-filter{margin:12px 0 0!important}
.category-catalog-page>.view-switch{margin:14px 0 16px!important}
.category-catalog-page .view-switch{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:4px!important;width:100%!important;min-width:100%!important;max-width:none!important;padding:5px!important;border-radius:16px!important;background:#eef0f3!important;box-sizing:border-box!important;overflow:visible!important}
.category-catalog-page .view-switch button{width:100%!important;min-width:0!important;max-width:none!important;min-height:46px!important;padding:10px 12px!important;margin:0!important;border:0!important;border-radius:12px!important;background:transparent!important;color:#777d87!important;font-size:.98rem!important;font-weight:600!important;line-height:1.35!important;white-space:normal!important;text-align:center!important;box-shadow:none!important}
.category-catalog-page .view-switch button.active{background:#fff!important;color:#17191d!important;box-shadow:0 3px 12px rgba(17,20,27,.08)!important}
/* Generic contract for every future category. */
.category-catalog-page.is-list .category-product-list{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;width:100%!important}
.category-catalog-page.is-grid .category-product-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;width:100%!important}

/* Current categories map to the generic contract. */
#catalogPage.is-list #catalogList,#powerBankPage.is-list #pbGrid{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;width:100%!important}




#catalogPage.is-grid .catalog-brand,#powerBankPage.is-grid .pb-brand{font-size:.78rem!important;font-weight:500!important;color:var(--muted)!important}
#catalogPage.is-grid .catalog-specs,#powerBankPage.is-grid .pb-spec-line{font-size:.82rem!important;line-height:1.5!important;font-weight:400!important}
#catalogPage.is-grid .catalog-actions,#powerBankPage.is-grid .pb-actions{display:grid!important;grid-template-columns:1fr!important;gap:6px!important;margin-top:auto!important;padding-top:8px!important}
#catalogPage.is-grid .catalog-actions a,#catalogPage.is-grid .catalog-actions button,#powerBankPage.is-grid .pb-actions a,#powerBankPage.is-grid .pb-actions button{font-size:.84rem!important;font-weight:600!important}
#powerBankPage.is-grid .pb-tags{display:none!important}





@media(max-width:420px){.category-catalog-page .category-page-copy h1{font-size:1.62rem!important}.category-catalog-page .view-switch button{font-size:.93rem!important;min-height:44px!important;padding:9px 8px!important}}

/* ===== V90 Front foundation — calmer Thai typography + scalable categories ===== */
:root{--bg:#f7f7f5;--paper:#fff;--ink:#202124;--muted:#666b73;--line:#e8e8e5;--accent:#f15f3f;--accent-soft:#fff3ee;--dark:#202124;--shadow:0 12px 34px rgba(24,25,28,.06)}
html{font-size:16px!important}
body{font-family:"Noto Sans Thai",Tahoma,system-ui,-apple-system,"Segoe UI",sans-serif!important;background:linear-gradient(180deg,#fff 0,#f8f8f6 38%,#f4f4f2 100%)!important;line-height:1.55;letter-spacing:0!important}
.app-shell{max-width:720px!important;padding-left:20px!important;padding-right:20px!important}
.topbar{height:68px!important}.logo-btn{font-size:1.22rem!important;letter-spacing:-.02em!important}
.hero-copy{padding:34px 2px 12px!important}.mini-pill{font-size:.78rem!important;padding:8px 11px!important}
.hero-copy h1{font-size:clamp(2.8rem,11vw,4.8rem)!important;line-height:1.12!important;letter-spacing:-.025em!important;margin:16px 0 18px!important;font-weight:900!important}
.hero-copy h1 em{display:inline!important;margin:0!important}.hero-copy p{font-size:1rem!important;line-height:1.8!important;max-width:570px!important;color:#62666d!important}
.search-box{margin-top:22px!important;border-radius:17px!important;box-shadow:0 7px 24px rgba(24,25,28,.045)!important}.search-box input{padding:16px 0!important}
.chips{padding-top:11px!important}.chips button{font-size:.86rem!important;font-weight:700!important}
.v7-home{margin-top:30px!important}.v90-category-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin:0 0 14px}.v90-category-head span{display:block;color:var(--accent);font-size:.75rem;font-weight:850}.v90-category-head h2{margin:3px 0 0;font-size:1.55rem;line-height:1.3;letter-spacing:-.02em}.v90-category-head small{max-width:245px;text-align:right;color:var(--muted);font-size:.73rem;line-height:1.55}
.v7-category-list{gap:13px!important}.v7-cat{border-radius:20px!important;box-shadow:0 8px 26px rgba(24,25,28,.045)!important}.v7-cat-main{grid-template-columns:76px 1fr auto!important;gap:14px!important;padding:15px!important}.v7-cat-visual{height:76px!important;border-radius:17px!important}.v7-cat-copy small{font-size:.73rem!important}.v7-cat-copy h3{font-size:1.15rem!important;line-height:1.4!important;letter-spacing:0!important;margin:2px 0!important}.v7-cat-copy p{font-size:.78rem!important;line-height:1.55!important}.v7-assist{font-size:.82rem!important;line-height:1.55!important;padding:11px 15px!important}.v7-coming{margin-top:13px!important}.v7-coming b{font-size:.84rem!important}.v7-coming small{font-size:.72rem!important;line-height:1.5!important}
.v7-why{margin-top:30px!important;border-radius:22px!important}.v7-why h3{font-size:1.08rem!important;letter-spacing:0!important}.why-grid b{font-size:.88rem!important}.why-grid small{font-size:.73rem!important;line-height:1.45!important}.v7-guide{margin-top:22px!important}.v7-guide h2{font-size:1.13rem!important;line-height:1.5!important}.v7-guide>p{font-size:.8rem!important;line-height:1.75!important}.guide-points b{font-size:.77rem!important}.guide-points span{font-size:.7rem!important;line-height:1.55!important}
.category-catalog-page .category-page-copy h1{font-size:1.75rem!important;line-height:1.35!important;letter-spacing:-.015em!important}.category-catalog-page .category-page-copy p{line-height:1.7!important}.catalog-card h3,.pb-card h3{letter-spacing:0!important;line-height:1.45!important}.catalog-specs,.pb-spec-line{line-height:1.55!important}.catalog-actions a,.catalog-actions button,.pb-actions a,.pb-actions button{font-weight:750!important}
@media(max-width:520px){.app-shell{padding-left:16px!important;padding-right:16px!important}.hero-copy{padding-top:26px!important}.hero-copy h1{font-size:3rem!important;line-height:1.12!important}.v90-category-head{align-items:flex-start;flex-direction:column;gap:5px}.v90-category-head small{max-width:none;text-align:left}.v7-cat-main{grid-template-columns:68px 1fr auto!important;gap:11px!important;padding:13px!important}.v7-cat-visual{height:68px!important}.v7-cat-copy h3{font-size:1.08rem!important}.guide-points{grid-template-columns:1fr!important}}

