/* Shopimax storefront skin — generated from shopimax.src.css; loaded after extras.css */
:root{--sx-bg: #f2f3f6; --sx-surface: #ffffff; --sx-surface-2: #f0f2f5; --sx-surface-3: #e6e9ee; --sx-line: #e2e5ea; --sx-line-2: #edeff3; --sx-ink: #171b2c; --sx-ink-2: #474e63; --sx-ink-3: #7b8296; --sx-brand: #e8501f; --sx-brand-deep: #c93f14; --sx-brand-soft: #fdece5; --sx-brand-ink: #b73a10; --sx-navy: #1c2243; --sx-navy-2: #141936; --sx-ok: #12905a; --sx-warn: #c9830a; --sx-err: #d3304a; --sx-footer: #151a36; --sx-f1: #d6daea; --sx-f2: #b9bfd6; --sx-f3: #9aa1bd; --sx-f4: #7f87a6; --sx-r-lg: 20px; --sx-r: 14px; --sx-r-sm: 10px; --sx-sh-1: 0 1px 2px rgba(23, 27, 44, .05); --sx-sh-2: 0 10px 28px -10px rgba(23, 27, 44, .22); --sx-focus: 0 0 0 4px rgba(232, 80, 31, .16); --ink: var(--sx-ink); --body: var(--sx-ink-2); --gray: var(--sx-ink-3); --off-red: var(--sx-brand); --red: var(--sx-brand); --red-deep: var(--sx-brand-deep); --az-blue: var(--sx-brand); --az-blue-deep: var(--sx-brand-deep); --cream: var(--sx-surface-2); --beige: var(--sx-surface-3);}
html.dk-dark{--sx-bg: #0f1013; --sx-surface: #17181c; --sx-surface-2: #1f2126; --sx-surface-3: #292c33; --sx-line: #2c2f36; --sx-line-2: #23262b; --sx-ink: #eceef2; --sx-ink-2: #b6bbc7; --sx-ink-3: #868d9c; --sx-brand: #ff6a38; --sx-brand-deep: #ee5a28; --sx-brand-soft: rgba(255, 106, 56, .13); --sx-brand-ink: #ff8a5f; --sx-navy: #1b1d23; --sx-navy-2: #14151a; --sx-ok: #35c98a; --sx-warn: #e6a53a; --sx-err: #ff6c80; --sx-footer: #0b0c0e; --sx-f1: #d9dbe0; --sx-f2: #b4b8c1; --sx-f3: #8f95a1; --sx-f4: #6f7581; --sx-sh-1: 0 1px 2px rgba(0, 0, 0, .4); --sx-sh-2: 0 14px 30px -12px rgba(0, 0, 0, .7); --sx-focus: 0 0 0 4px rgba(255, 106, 56, .22); --dkd-bg: #0f1013; --dkd-surface: #17181c; --dkd-surface-2: #1f2126; --dkd-surface-3: #292c33; --dkd-line: #2c2f36; --dkd-ink: #eceef2; --dkd-ink-2: #b6bbc7; --dkd-ink-3: #868d9c; --dkd-shadow: 0 14px 30px -12px rgba(0, 0, 0, .7); --ink: #eceef2; --body: #b6bbc7; --gray: #868d9c; --line: #2c2f36; --line2: #23262b; --chip: #292c33; --panel: #1f2126; --cream: #1f2126; --beige: #292c33; --budi-pink: #3a2a2a; --off-red: #ff6a38;}
html{background: var(--sx-bg);}
html body.dk{background: var(--sx-bg); color: var(--sx-ink); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;}
html body.dk ::selection{background: var(--sx-brand); color: #fff;}
html body.dk :focus-visible{outline: 2px solid var(--sx-brand); outline-offset: 2px; border-radius: 6px;}
html body.dk a{transition: color .15s ease;}
html body.dk img{image-rendering: auto;}
html body.dk .hdr{background: var(--sx-surface); border-bottom: 1px solid var(--sx-line); box-shadow: var(--sx-sh-1);}
html body.dk .hdr-in{height: 78px; padding: 0 30px; gap: 0;}
html body.dk .logo img{height: 46px;}
html body.dk .search{height: 48px; background: var(--sx-surface-2); border: 1px solid transparent; border-radius: 14px; margin: 0 30px; padding: 0 16px; transition: background .15s, border-color .15s, box-shadow .15s;}
html body.dk .search:hover{border-color: var(--sx-line);}
html body.dk .search:focus-within{background: var(--sx-surface); border-color: var(--sx-brand); box-shadow: var(--sx-focus);}
html body.dk .s-in{font-size: 13.5px; color: var(--sx-ink);}
html body.dk .s-in::placeholder{color: var(--sx-ink-3);}
html body.dk .search svg{stroke: var(--sx-ink-3);}
html body.dk .search:focus-within svg{stroke: var(--sx-brand);}
html body.dk .icon-btn,html body.dk .hbtn{width: 44px; height: 44px; justify-content: center; border-radius: 12px; transition: background .15s; position: relative;}
html body.dk .icon-btn:hover,html body.dk .hbtn:hover{background: var(--sx-surface-2);}
html body.dk .icon-btn svg,html body.dk .hbtn svg{stroke: var(--sx-ink-2);}
html body.dk .hdr .cart{background: var(--sx-brand-soft); margin-right: 8px;}
html body.dk .hdr .cart svg{stroke: var(--sx-brand);}
html body.dk .hdr .cart svg circle{fill: var(--sx-brand);}
html body.dk .hdr .cart:hover{background: var(--sx-brand-soft); filter: brightness(.97);}
html body.dk .ic-badge{position: absolute; top: -4px; left: -4px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; background: var(--sx-brand); color: #fff; font-size: 10.5px; font-weight: 700; line-height: 19px; text-align: center; box-shadow: 0 0 0 2px var(--sx-surface);}
html body.dk .v-div{background: var(--sx-line); height: 24px; margin: 0 14px;}
html body.dk .login{height: 44px; border: 1px solid var(--sx-line); border-radius: 12px; padding: 0 16px; margin-left: 0; font-size: 12.5px; font-weight: 600; color: var(--sx-ink); background: var(--sx-surface); transition: border-color .15s, background .15s;}
html body.dk .login:hover{border-color: var(--sx-ink-3); background: var(--sx-surface-2);}
html body.dk .login svg{stroke: var(--sx-ink-2);}
html body.dk .login span{color: var(--sx-ink);}
html body.dk .nav{background: var(--sx-surface); border-bottom: 0;}
html body.dk .nav-in{height: 46px; padding: 0 30px; gap: 4px;}
html body.dk .nav-cat{height: 34px; padding: 0 14px 0 16px; margin-left: 10px; border-radius: 10px; gap: 9px; background: var(--sx-navy); color: #fff; font-size: 12.5px; font-weight: 700; transition: background .15s;}
html body.dk .nav-cat svg{stroke: #fff;}
html body.dk .nav-cat:hover{background: var(--sx-navy-2);}
html body.dk .nav-it{height: 34px; padding: 0 12px; border-radius: 9px; font-size: 12.5px; font-weight: 500; color: var(--sx-ink-2); transition: background .15s, color .15s;}
html body.dk .nav-it svg{stroke: var(--sx-ink-3); transition: stroke .15s;}
html body.dk .nav-it:hover{background: var(--sx-surface-2); color: var(--sx-ink);}
html body.dk .nav-it:hover svg{stroke: var(--sx-brand);}
html body.dk .nav-sep{background: var(--sx-line);}
html.dk-dark body.dk .nav-cat{background: var(--sx-surface-3);}
html.dk-dark body.dk .nav-cat:hover{background: #32363e;}
html body.dk .dk-menu{background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: var(--sx-r); box-shadow: var(--sx-sh-2); padding: 10px;}
html body.dk .dk-menu a{border-radius: 9px; font-size: 12.5px; color: var(--sx-ink-2);}
html body.dk .dk-menu a:hover{background: var(--sx-surface-2); color: var(--sx-ink);}
html body.dk .dk-menu a.dk-out{color: var(--sx-err); border-top-color: var(--sx-line);}
html body.dk .dk-pill{background: var(--sx-brand);}
html.dk-dark body.dk .dk-menu{background: var(--sx-surface-2); border-color: var(--sx-line);}
html.dk-dark body.dk .dk-menu a:hover{background: var(--sx-surface-3);}
html body.dk .badge-off{background: var(--sx-brand); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: 0; border-radius: 7px; padding: 2px 7px 3px; line-height: 1.35;}
html.dk-dark body.dk .badge-off{background: var(--sx-brand-deep); color: #fff;}
html body.dk .pr-img{background: #fff; border-radius: 12px; object-fit: contain;}
html.dk-dark body.dk .pr-img{filter: brightness(.95);}
html body.dk .pr-title{font-size: 12.2px; font-weight: 500; line-height: 1.85; color: var(--sx-ink); height: 45px;}
html body.dk .pr-top{margin-top: 6px; height: 22px; gap: 6px;}
html body.dk .pr-price{margin-top: 3px; gap: 5px; align-items: baseline;}
html body.dk .pr-price .num{font-size: 15.5px; font-weight: 800; color: var(--sx-ink); letter-spacing: -.2px;}
html body.dk .pr-price .tom{font-size: 10px; color: var(--sx-ink-3);}
html body.dk .old{color: var(--sx-ink-3); font-size: 10.8px;}
html.dk-dark body.dk .pr-title{color: var(--sx-ink);}
html.dk-dark body.dk .pr-price .num{color: var(--sx-ink);}
html body.dk .cats-tt,html body.dk .sh-tt .t1,html body.dk .br-tt,html body.dk .rk-head{position: relative; font-size: 17px; font-weight: 800; color: var(--sx-ink); letter-spacing: -.1px; padding-right: 15px;}
html body.dk .cats-tt::before,html body.dk .sh-tt .t1::before,html body.dk .br-tt::before,html body.dk .rk-head::before{content: ''; position: absolute; right: 0; top: 50%; width: 4px; height: 20px; margin-top: -10px; border-radius: 3px; background: var(--sx-brand);}
html body.dk .rk-head{gap: 8px;}
html body.dk .rk-head .fa-fire{color: var(--sx-brand) !important;}
html body.dk .sh-tt .t2{color: var(--sx-ink-3); font-size: 12px; padding-right: 15px; margin-top: 6px;}
html.dk-dark body.dk .cats-tt,html.dk-dark body.dk .sh-tt .t1,html.dk-dark body.dk .br-tt,html.dk-dark body.dk .rk-head span{color: var(--sx-ink);}
html body.dk .stories-wrap{background: var(--sx-surface); border-bottom: 1px solid var(--sx-line);}
html body.dk .stories{padding: 14px 30px 12px; gap: 18px;}
html body.dk .st-ring{background: conic-gradient(from 210deg, #ffb347, #f0572d 40%, #e23d6a 70%, #ffb347); padding: 3px;}
html body.dk .st-ring img{border: 3px solid var(--sx-surface); background: var(--sx-surface);}
html body.dk .st-lb{font-size: 11.5px; font-weight: 500; color: var(--sx-ink-2); margin-top: 8px;}
html body.dk .story:hover .st-lb{color: var(--sx-ink);}
@media (min-width: 900px){html body.dk .hero{margin: 18px 30px 0; border-radius: 20px; box-shadow: var(--sx-sh-2); background: var(--sx-surface-2);}
html body.dk .hero-slide img,html body.dk .hero img{width: 100%; height: auto;}}
html body.dk .hero-dots{bottom: 16px; padding: 6px 10px; border-radius: 20px; gap: 7px; background: rgba(14, 16, 24, .45); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);}
html body.dk .hero-dot{background: rgba(255, 255, 255, .5); height: 7px; width: 7px;}
html body.dk .hero-dot.on{background: #fff; width: 22px;}
html body.dk .ht-btn{background: var(--sx-brand); box-shadow: none; border-radius: 10px;}
html body.dk .amazing{margin: 20px 30px 0; border-radius: 22px; height: auto; min-height: 330px; box-shadow: var(--sx-sh-2);}
html body.dk .az-red{--az-ink: #c43c12; background: linear-gradient(118deg, #f66a35 0%, #e44a1c 62%, #c93a12 100%);}
html body.dk .az-green{--az-ink: #1c2243; background: linear-gradient(118deg, #26305f 0%, #1c2243 60%, #141936 100%);}
html.dk-dark body.dk .az-red{--az-ink: #c43c12; background: linear-gradient(118deg, #3b1f15 0%, #2d1810 60%, #231410 100%); box-shadow: inset 0 0 0 1px rgba(255, 106, 56, .22), var(--sx-sh-2);}
html.dk-dark body.dk .az-green{--az-ink: #1b1d23; background: linear-gradient(118deg, #20232b 0%, #1a1c22 100%); box-shadow: inset 0 0 0 1px var(--sx-line), var(--sx-sh-2);}
html body.dk .az-panel{flex: 0 0 176px; padding-top: 46px;}
html body.dk .az-title{font-size: 21px; font-weight: 800; margin-top: 0; letter-spacing: -.3px;}
html body.dk .az-count{margin-top: 16px;}
html body.dk .az-box{background: #fff; color: var(--az-ink); border-radius: 8px; width: 35px; height: 30px; font-size: 14px; font-weight: 800;}
html.dk-dark body.dk .az-red .az-box{background: var(--sx-brand); color: #fff;}
html.dk-dark body.dk .az-green .az-box{background: var(--sx-surface-3); color: var(--sx-ink);}
html body.dk .az-lb{color: rgba(255, 255, 255, .85); font-size: 9.5px;}
html body.dk .az-sep{line-height: 30px; opacity: .8;}
html body.dk .az-more{margin-top: 18px; width: 118px; height: 40px; border-radius: 11px; background: #fff; color: var(--sx-ink); font-size: 12.5px; font-weight: 700; box-shadow: 0 2px 8px rgba(0, 0, 0, .12); transition: transform .15s ease, box-shadow .15s ease;}
html body.dk .az-more:hover{box-shadow: 0 6px 16px rgba(0, 0, 0, .2);}
html body.dk .az-panel .az-more[style]{background: transparent; box-shadow: none; color: rgba(255, 255, 255, .9); font-weight: 500; width: auto; height: auto; margin-top: 14px !important;}
html.dk-dark body.dk .az-more{background: var(--sx-surface-3); color: var(--sx-ink);}
html.dk-dark body.dk .az-panel .az-more[style]{background: transparent; color: var(--sx-ink-2);}
html body.dk .az-cards{padding: 10px 6px 10px 0; gap: 8px;}
html body.dk .az-cards .track{gap: 8px;}
html body.dk .az-card{flex: 0 0 168px; border-radius: 16px; background: var(--sx-surface); padding: 10px 10px 12px; box-shadow: 0 1px 0 rgba(0, 0, 0, .04); transition: box-shadow .18s ease;}
html body.dk .az-card:hover{box-shadow: 0 10px 24px -8px rgba(0, 0, 0, .35);}
html body.dk .az-card .pr-img{height: 150px;}
html.dk-dark body.dk .az-card{background: var(--sx-surface);}
html body.dk .banners4,html body.dk .banners2{margin: 20px 30px 0; gap: 16px;}
html body.dk .banners4 a,html body.dk .banners2 a{flex: 1 1 0; min-width: 0; border-radius: 18px; overflow: hidden; box-shadow: var(--sx-sh-1); transition: box-shadow .2s ease;}
html body.dk .banners4 a:hover,html body.dk .banners2 a:hover{box-shadow: var(--sx-sh-2);}
html body.dk .banners4 img{width: 100%; height: auto; aspect-ratio: 315 / 196; border-radius: 0;}
html body.dk .banners2 img{width: 100%; height: auto; aspect-ratio: 645 / 248; border-radius: 0;}
html body.dk .cats{margin: 20px 30px 0; background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 22px; padding: 24px 26px 18px;}
html body.dk .cats-tt{margin-bottom: 22px;}
html body.dk .cats-row{gap: 6px; margin-bottom: 0;}
html body.dk .cat{width: 128px; padding: 4px 0 10px; border-radius: 16px; transition: background .15s;}
html body.dk .cat:hover{background: var(--sx-surface-2);}
html body.dk .cat img{width: 104px; height: 104px; border-radius: 22px; background: #fff; object-fit: cover; box-shadow: 0 0 0 1px var(--sx-line-2);}
html body.dk .cat-ph{width: 104px; height: 104px; border-radius: 22px; display: flex; align-items: center; justify-content: center; font-size: 30px;}
html body.dk .cat-lb{font-size: 12.5px; font-weight: 600; color: var(--sx-ink); margin-top: 10px;}
html body.dk .cat:hover .cat-lb{color: var(--sx-brand);}
html.dk-dark body.dk .cat img{box-shadow: none; filter: brightness(.94);}
html body.dk .shelf{margin: 20px 30px 0; background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 22px; padding: 22px 24px 24px;}
html body.dk .shelf-head{align-items: center;}
html body.dk .see-all{background: transparent; border: 1px solid var(--sx-line); color: var(--sx-ink-2); font-size: 12px; font-weight: 600; border-radius: 10px; padding: 8px 14px; transition: border-color .15s, color .15s, background .15s;}
html body.dk .see-all:hover{border-color: var(--sx-brand); color: var(--sx-brand); background: var(--sx-brand-soft);}
html body.dk .shelf-cards{margin-top: 20px; gap: 10px; min-height: 270px;}
html body.dk .sh-card{flex: 0 0 172px; border: 1px solid var(--sx-line-2); border-radius: 16px; padding: 10px 11px 13px; background: var(--sx-surface); transition: border-color .18s ease, box-shadow .18s ease;}
html body.dk .sh-card:hover{border-color: var(--sx-line); box-shadow: var(--sx-sh-2);}
html body.dk .sh-card .pr-img{height: 136px;}
html.dk-dark body.dk .sh-card{border-color: var(--sx-line); background: var(--sx-surface-2);}
html.dk-dark body.dk .see-all{background: transparent; color: var(--sx-ink-2);}
html.dk-dark body.dk .see-all:hover{background: var(--sx-brand-soft); color: var(--sx-brand);}
html body.dk .shelf .sh-sliver,html body.dk .th3 .sh-sliver{display: none;}
html body.dk .edge-arrow{width: 42px; height: 42px; background: var(--sx-surface); color: var(--sx-ink); border: 1px solid var(--sx-line); box-shadow: 0 6px 16px -4px rgba(23, 27, 44, .25); transition: background .15s, color .15s, border-color .15s;}
html body.dk .edge-arrow:hover{background: var(--sx-brand); border-color: var(--sx-brand); color: #fff;}
html body.dk .edge-arrow svg{stroke: currentColor;}
html.dk-dark body.dk .edge-arrow{background: var(--sx-surface-3); border-color: var(--sx-line); color: var(--sx-ink);}
html.dk-dark body.dk .edge-arrow:hover{background: var(--sx-brand); border-color: var(--sx-brand); color: #fff;}
html body.dk .brands{margin: 20px 30px 0; background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 22px; padding: 22px 24px 24px;}
html body.dk .br-tt{margin-bottom: 18px;}
html body.dk .br-list{display: flex; flex-wrap: wrap; gap: 10px;}
html body.dk .brands .br-item{flex: 1 1 150px; max-width: 200px; height: 74px; display: flex; align-items: center; justify-content: center; background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 14px; padding: 12px 18px; font-weight: 700; color: var(--sx-ink-2); transition: border-color .15s, box-shadow .15s;}
html body.dk .brands .br-item:hover{border-color: var(--sx-ink-3); box-shadow: var(--sx-sh-1);}
html body.dk .brands .br-item img{max-height: 44px; width: auto; max-width: 100%; object-fit: contain;}
html.dk-dark body.dk .brands .br-item{background: var(--sx-surface-2);}
html.dk-dark body.dk .brands .br-item img{background: #fff; border-radius: 8px; padding: 4px 8px;}
html body.dk .ranklist{margin: 20px 30px 0; background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 22px; padding: 22px 26px 26px;}
html body.dk .rk-body{margin-top: 22px;}
html body.dk .rk-col{width: 300px; gap: 18px; margin-left: 16px;}
html body.dk .rk-item{gap: 12px; padding: 4px; margin: -4px; border-radius: 14px; transition: background .15s;}
html body.dk .rk-item:hover{background: var(--sx-surface-2);}
html body.dk .rk-img{width: 82px; height: 82px; flex: 0 0 82px; border-radius: 12px; border: 1px solid var(--sx-line-2); background: #fff; padding: 4px;}
html body.dk .rk-badge{flex: 0 0 24px; width: 24px; height: 24px; border-radius: 8px; background: var(--sx-surface-3); color: var(--sx-ink-2); font-size: 11.5px; font-weight: 800;}
html body.dk .rk-col:first-child .rk-item:nth-child(-n+3) .rk-badge{background: var(--sx-brand); color: #fff;}
html body.dk .rk-title{font-size: 12.2px; font-weight: 500; color: var(--sx-ink); line-height: 1.95;}
html.dk-dark body.dk .rk-badge{background: var(--sx-surface-3); color: var(--sx-ink-2);}
html.dk-dark body.dk .rk-col:first-child .rk-item:nth-child(-n+3) .rk-badge{background: var(--sx-brand-deep); color: #fff;}
html body.dk .budi{margin: 20px 30px 0; border-radius: 22px; height: 156px;}
html body.dk .budi-txt .b1{color: var(--sx-navy); font-size: 19px;}
html body.dk .budi-txt .b2{color: var(--sx-ink-2);}
html body.dk .budi-btn{background: var(--sx-navy); border-radius: 11px; padding: 9px 40px;}
html body.dk .dk-blogrow{margin: 20px 30px 0;}
html body.dk .dk-blogrow .cats-tt{font-size: 17px; font-weight: 800; color: var(--sx-ink); margin-bottom: 0;}
html body.dk .dk-blogrow .cats-tt a{color: var(--sx-brand) !important; font-weight: 600; display: inline-flex; align-items: center; gap: 4px;}
html body.dk .dk-blogrow .cats-tt a svg{stroke: var(--sx-brand) !important;}
html body.dk .dk-blog-cards{gap: 18px; margin-top: 18px;}
html body.dk .dk-blog-card{background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 18px; gap: 8px; padding-bottom: 16px; transition: border-color .18s, box-shadow .18s;}
html body.dk .dk-blog-card:hover{border-color: var(--sx-line); box-shadow: var(--sx-sh-2);}
html body.dk .dk-blog-card img,html body.dk .dk-blog-ph{height: 168px; background: var(--sx-surface-2); color: var(--sx-ink-3);}
html body.dk .dk-blog-card b{color: var(--sx-ink); font-size: 14px; font-weight: 700; padding: 6px 18px 0; line-height: 1.95;}
html body.dk .dk-blog-card small{color: var(--sx-ink-3); padding: 0 18px; font-size: 12.2px; line-height: 1.95;}
html body.dk footer{position: relative; margin-top: 44px; border-top: 0; padding-top: 34px; color: var(--sx-f2); background: var(--sx-footer); box-shadow: 0 0 0 100vmax var(--sx-footer); clip-path: inset(0 -100vmax);}
html body.dk footer .ft-top{padding: 0 30px;}
html body.dk footer .ft-logo{height: 42px;}
html body.dk footer .lg-day:has(+ .lg-night){display: none !important;}
html body.dk footer .lg-day:has(+ .lg-night) + .lg-night{display: block !important;}
html body.dk footer .lg-day:not(:has(+ .lg-night)){filter: brightness(0) invert(1);}
html body.dk .back-top{background: transparent; border: 1px solid rgba(255, 255, 255, .18); color: var(--sx-f1); border-radius: 11px; font-size: 12px; padding: 10px 16px; transition: background .15s, border-color .15s;}
html body.dk .back-top:hover{background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .32);}
html body.dk .back-top svg{stroke: currentColor;}
html body.dk .ft-contact{color: var(--sx-f3); font-size: 12.5px; margin-top: 18px;}
html body.dk .ft-feats{margin: 30px 0 0; gap: 14px;}
html body.dk .ft-feat{flex: 1 1 0; padding: 18px 12px 16px; border: 1px solid rgba(255, 255, 255, .09); border-radius: 18px; background: rgba(255, 255, 255, .03);}
html body.dk .ft-feat img{width: 54px; height: 60px;}
html body.dk .ft-feat div{color: var(--sx-f1); font-size: 12px; font-weight: 500; margin-top: 8px;}
html body.dk .ft-cols{margin: 38px 0 0;}
html body.dk .ft-h{color: #fff; font-size: 14px; font-weight: 700; margin-bottom: 18px;}
html body.dk .ft-col a{color: var(--sx-f3); font-size: 12.8px; margin-bottom: 13px; transition: color .15s;}
html body.dk .ft-col a:hover{color: #fff;}
html body.dk .dk-social a{background: rgba(255, 255, 255, .08); color: var(--sx-f1);}
html body.dk .dk-social a:hover{background: var(--sx-brand); color: #fff;}
html body.dk .nl-row input{background: rgba(255, 255, 255, .07); color: #fff; height: 44px; border: 1px solid rgba(255, 255, 255, .1); border-radius: 11px;}
html body.dk .nl-row input:focus{border-color: var(--sx-brand); background: rgba(255, 255, 255, .1);}
html body.dk .nl-row input::placeholder{color: var(--sx-f4);}
html body.dk .nl-row button{background: var(--sx-brand); color: #fff; height: 44px; border-radius: 11px; font-weight: 700; transition: background .15s;}
html body.dk .nl-row button:hover{background: var(--sx-brand-deep);}
html body.dk .about{border-top: 1px solid rgba(255, 255, 255, .1); margin: 40px 0 0;}
html body.dk .ab-h{color: #fff;}
html body.dk .ab-p{color: var(--sx-f3);}
html body.dk .ab-more{color: var(--sx-f1);}
html body.dk .ab-more svg{stroke: currentColor;}
html body.dk .ab-badges a img{background: #fff; border: 0; border-radius: 12px; padding: 6px;}
html body.dk .ab-link{margin: 20px 0 0; color: var(--sx-f4);}
html body.dk .copyright{color: var(--sx-f4); margin: 14px 0 0; padding: 18px 0 26px; border-top: 1px solid rgba(255, 255, 255, .07);}
html.dk-dark body.dk footer{border-top: 1px solid var(--sx-line);}
html body.dk #shop-chat .chat-fab{background: var(--sx-navy); animation: none; box-shadow: 0 10px 24px -6px rgba(20, 25, 54, .55); width: 58px; height: 58px;}
html body.dk #shop-chat .chat-fab::after{border: 0; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .14); inset: 0;}
html body.dk #shop-chat .chat-fab:hover{transform: scale(1.05);}
html body.dk #shop-chat .chat-fab.op-off{background: #5b6074;}
html body.dk #shop-chat .chat-fab .chat-badge{background: var(--sx-brand); box-shadow: 0 0 0 2px var(--sx-surface);}
html.dk-dark body.dk #shop-chat .chat-fab{background: var(--sx-brand-deep); box-shadow: 0 10px 24px -6px rgba(0, 0, 0, .6);}
html body.dk #shop-chat .chat-head{background: var(--sx-navy);}
html.dk-dark body.dk #shop-chat .chat-head{background: var(--sx-surface-3);}
html body.dk #shop-chat .chat-head .chat-ava{border-color: rgba(255, 255, 255, .3); background: #fff;}
html body.dk #shop-chat .chat-head .chat-online{border-color: var(--sx-navy);}
html body.dk #shop-chat .chat-panel{border-radius: 20px; border-color: var(--sx-line); box-shadow: 0 26px 60px -10px rgba(14, 16, 28, .4);}
html body.dk .dk-toast,html body.dk .toast{background: var(--sx-navy); color: #fff; border-radius: 12px; padding: 12px 22px; font-weight: 500; box-shadow: 0 14px 30px -8px rgba(14, 16, 28, .5); border-right: 3px solid var(--sx-brand);}
html body.dk .dk-toast.error,html body.dk .toast.error{background: var(--sx-err); border-right-color: rgba(255, 255, 255, .5);}
html body.dk .dk-toast.success,html body.dk .toast.success{background: var(--sx-ok); border-right-color: rgba(255, 255, 255, .5);}
html.dk-dark body.dk .dk-toast,html.dk-dark body.dk .toast{background: var(--sx-surface-3);}
@media (max-width: 899px){html body.dk{padding-bottom: 70px;}
html body.dk .m-hdr{background: var(--sx-surface); padding: 12px 14px 12px; border-bottom: 1px solid var(--sx-line);}
html body.dk .m-search{background: var(--sx-surface-2); border: 1px solid transparent; box-shadow: none; border-radius: 13px; height: 46px;}
html body.dk .m-search:focus-within{background: var(--sx-surface); border-color: var(--sx-brand); box-shadow: var(--sx-focus);}
html body.dk .m-ph{color: var(--sx-ink-3);}
html body.dk .m-ph b{color: var(--sx-brand);}
html body.dk .m-bell{background: var(--sx-surface-2); border: 0; box-shadow: none;}
html body.dk .m-bell svg,html body.dk .m-search svg{stroke: var(--sx-ink-2);}
html body.dk .m-nav{background: var(--sx-surface); border-top: 1px solid var(--sx-line); border-radius: 0; box-shadow: 0 -6px 20px -10px rgba(23, 27, 44, .2); height: 60px;}
html body.dk .m-nav a{color: var(--sx-ink-3); font-size: 10px; font-weight: 500;}
html body.dk .m-nav a.on{color: var(--sx-brand); font-weight: 700;}
html body.dk .m-nav a svg{stroke: currentColor;}
html body.dk .m-nav a.on svg{fill: none;}
html body.dk .stories{padding: 12px 14px 10px;}
html body.dk .hero{margin: 0; border-radius: 0; box-shadow: none; background: transparent;}
html body.dk .hero-track{padding: 10px 4% 14px;}
html body.dk .hero-slide img{border-radius: 16px;}
html body.dk .hero-dots{bottom: 24px;}
html body.dk .amazing{margin: 12px 0 0; border-radius: 0; box-shadow: none;}
html body.dk .az-panel{padding: 14px 14px 10px;}
html body.dk .az-title{font-size: 16px;}
html body.dk .az-box{width: 30px; height: 26px; font-size: 12px; border-radius: 7px;}
html body.dk .az-sep{line-height: 26px;}
html body.dk .az-cards{padding: 4px 12px 16px;}
html body.dk .az-card{flex: 0 0 140px; border-radius: 14px;}
html body.dk .az-card .pr-img{height: 112px;}
html body.dk .banners4,html body.dk .banners2{margin: 14px 12px 0; gap: 10px;}
html body.dk .banners4{display: grid; grid-template-columns: 1fr 1fr;}
html body.dk .banners4 a,html body.dk .banners2 a{border-radius: 14px;}
html body.dk .cats,html body.dk .shelf,html body.dk .brands,html body.dk .ranklist{margin: 14px 12px 0; border-radius: 18px; padding: 16px 14px;}
html body.dk .cats-tt,html body.dk .sh-tt .t1,html body.dk .br-tt,html body.dk .rk-head{font-size: 15.5px;}
html body.dk .cat{width: 92px;}
html body.dk .cat img,html body.dk .cat-ph{width: 76px; height: 76px; border-radius: 18px;}
html body.dk .sh-card{flex: 0 0 148px; padding: 8px 9px 11px; border-radius: 14px;}
html body.dk .sh-card .pr-img{height: 112px;}
html body.dk .shelf-cards{min-height: 0; margin-top: 14px;}
html body.dk .budi{margin: 14px 12px 0; border-radius: 18px;}
html body.dk .dk-blogrow{margin: 14px 12px 0;}
html body.dk footer{margin-top: 30px; padding-top: 22px;}
html body.dk footer .ft-top{padding: 0 16px;}
html body.dk .ft-feat{padding: 12px 6px;}}
:root{--blue: var(--sx-brand); --grad: linear-gradient(var(--sx-brand), var(--sx-brand)); --login-btn: linear-gradient(var(--sx-brand), var(--sx-brand)); --sx-brand-2: #f26b3b;}
html.dk-dark{--sx-brand-2: #ff8350;}
@media (min-width: 900px){html body.dk footer .ft-top{display: block; padding: 0 30px 0; position: relative;}
html body.dk footer .ft-brand{display: flex; margin: 0; padding: 0;}
html body.dk footer .ft-logo{margin: 0; height: 42px;}
html body.dk .back-top{position: absolute; left: 30px; top: 4px;}
html body.dk .ft-contact{text-align: right; margin-top: 18px;}
html body.dk .ft-feats{display: flex; justify-content: stretch; gap: 14px; margin: 30px 0 0; padding: 0; flex-wrap: nowrap;}
html body.dk .ft-feat{display: block; text-align: center; flex: 1 1 0; gap: 0;}
html body.dk .ft-feat img{width: 54px; height: 60px; margin: 0 auto; object-fit: contain;}
html body.dk .ft-cols{display: flex; flex-wrap: wrap; gap: 24px 0; margin: 38px 0 0; padding: 0;}
html body.dk .ft-col{display: flex; flex-direction: column; flex: 1 1 200px; width: auto; min-width: 200px;}
html body.dk .ft-col:nth-child(2),html body.dk .ft-col:nth-child(3){width: auto;}
html body.dk .ft-col.follow{margin-right: 0; flex: 1.3 1 300px;}
html body.dk .ft-col a{display: block; padding: 0; margin-bottom: 13px;}
html body.dk .about{display: flex; justify-content: space-between; gap: 60px; margin: 40px 0 0; padding-top: 34px;}
html body.dk .ab-badges{margin: 0; gap: 12px; flex-wrap: nowrap;}
html body.dk .ab-badges img{width: 88px; height: 98px; object-fit: contain;}
html body.dk .ab-link{text-align: right; margin: 20px 0 0;}
html body.dk .copyright{text-align: center; margin: 14px 0 0;}}
html body.dk .crumbs{padding: 18px 4px 4px;}
html body.dk .crumbs .path{font-size: 12px;}
html body.dk .crumbs .path a:hover{color: var(--sx-brand);}
html body.dk .crumbs .sep{color: var(--sx-ink-3); opacity: .6;}
html body.dk .lmain{gap: 28px; padding-top: 14px;}
html body.dk .toolbar{height: 56px; padding: 0 18px; margin-bottom: 14px; background: var(--sx-surface); border: 1px solid var(--sx-line); border-radius: 16px;}
html body.dk .sort-lb{font-size: 12.5px; font-weight: 700;}
html body.dk .sort-lb svg{stroke: var(--sx-ink-2);}
html body.dk .t-sort{gap: 6px;}
html body.dk .sort-opt{padding: 7px 13px; border-radius: 9px; font-size: 12.5px; font-weight: 500; transition: background .15s, color .15s;}
html body.dk .sort-opt:hover{background: var(--sx-surface-2); color: var(--sx-ink);}
html body.dk .sort-opt.on{background: var(--sx-brand-soft); color: var(--sx-brand-ink); font-weight: 700;}
html body.dk .pcount{font-weight: 500;}
html body.dk .pgrid{border: 0; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr));}
html body.dk .pcell,html body.dk .pcell:nth-child(3n),html body.dk .pcell:nth-last-child(-n+3){min-height: 0; padding: 14px 16px 16px; border: 1px solid var(--sx-line); border-radius: 18px; background: var(--sx-surface); transition: border-color .18s ease, box-shadow .18s ease;}
html body.dk .pcell:hover{border-color: var(--sx-line); box-shadow: var(--sx-sh-2);}
html body.dk .p-head{height: auto; padding-top: 0; min-height: 24px;}
html body.dk .p-bad{font-size: 11.5px; padding: 3px 9px; border-radius: 7px; background: var(--sx-brand-soft); color: var(--sx-brand-ink);}
html body.dk .p-img{width: 100%; height: 232px; margin: 8px auto 0; border-radius: 14px; background: #fff; padding: 8px;}
html.dk-dark body.dk .p-img{filter: brightness(.95);}
html body.dk .p-ti{font-size: 12.8px; font-weight: 600; line-height: 2; height: 52px; margin-top: 14px; color: var(--sx-ink);}
html body.dk .p-meta{margin-top: 10px;}
html body.dk .p-price{margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--sx-line); align-items: flex-end;}
html body.dk .pr-num{font-size: 17.5px; font-weight: 800; letter-spacing: -.2px;}
html body.dk .pill-off{background: var(--sx-brand); color: #fff; border-radius: 7px; padding: 2px 8px 3px; font-size: 11px;}
html body.dk .more-btn{border-radius: 12px; border: 1px solid var(--sx-brand); color: var(--sx-brand); padding: 12px 54px; font-weight: 700; transition: background .15s, color .15s;}
html body.dk .more-btn:hover{background: var(--sx-brand); color: #fff;}
html body.dk .filters{flex: 0 0 268px;}
html body.dk .filters-in{border-radius: 18px; max-height: calc(100vh - 150px); top: 140px; background: var(--sx-surface);}
html body.dk .filters-in::-webkit-scrollbar{width: 8px;}
html body.dk .filters-in::-webkit-scrollbar-track{background: transparent; border: 0;}
html body.dk .filters-in::-webkit-scrollbar-thumb{background: var(--sx-line); border: 0; border-radius: 8px;}
html body.dk .filters-in::-webkit-scrollbar-button:single-button{display: none;}
html body.dk .f-title{font-size: 15px; font-weight: 800;}
html body.dk .f-row{padding: 16px 20px;}
html body.dk .f-lb{font-weight: 700;}
html body.dk .f-price input{background: var(--sx-surface-2); border: 1px solid transparent; border-radius: 10px;}
html body.dk .f-price input:focus{border-color: var(--sx-brand); background: var(--sx-surface);}
html body.dk .f-price .go{background: var(--sx-brand); border-radius: 10px;}
html body.dk .tgl.on{background: var(--sx-brand);}
html body.dk .f-check.on .bx{background: var(--sx-brand); border-color: var(--sx-brand);}
html body.dk .f-size.on{border-color: var(--sx-brand); color: var(--sx-brand);}
html body.dk .pager,html body.dk .dk-pager{display: flex; justify-content: center; gap: 6px; margin: 26px 0 0;}
html body.dk .dk-pager a,html body.dk .dk-pager span{min-width: 40px; height: 40px; padding: 0 12px; border-radius: 11px; border: 1px solid var(--sx-line); background: var(--sx-surface); color: var(--sx-ink-2); display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 600; transition: border-color .15s, color .15s;}
html body.dk .dk-pager a:hover{border-color: var(--sx-brand); color: var(--sx-brand);}
html body.dk .dk-pager .on{background: var(--sx-brand); border-color: var(--sx-brand); color: #fff;}
html body.dk .crumbs .cur{color: var(--sx-ink); font-weight: 600;}
html body.dk .pmain{gap: 30px; padding: 26px; border-radius: 24px; border: 1px solid var(--sx-line); background: var(--sx-surface); box-shadow: var(--sx-sh-1);}
html body.dk .buy-col{align-self: start; position: sticky; top: 140px;}
html body.dk .buy{border: 1px solid var(--sx-line); border-radius: 20px; background: var(--sx-surface); box-shadow: 0 14px 34px -22px rgba(23, 27, 44, .35);}
html body.dk .dk-sellcard{background: var(--sx-surface-2); border-radius: 0; padding: 16px 18px 8px;}
html body.dk .dk-srow .ic{background: var(--sx-surface); color: var(--sx-brand); border-radius: 11px;}
html body.dk .dk-perf + .dk-srow{border-top-color: var(--sx-line);}
html body.dk .dk-stock{border-top-color: var(--sx-line);}
html body.dk .dk-perf .sm{background: rgba(18, 144, 90, .12);}
html body.dk .dk-buyact{padding: 18px 20px 20px;}
html body.dk .price-row .num{font-size: 25px; font-weight: 800; letter-spacing: -.4px;}
html body.dk .price-row .tom{font-size: 11.5px;}
html body.dk .pill-off{font-size: 11.5px;}
html body.dk .dk-old{font-size: 13.5px;}
html body.dk .dk-qty{border-radius: 12px; border-color: var(--sx-line);}
html body.dk .cta{height: 52px; margin-top: 16px; border-radius: 14px; background: var(--sx-brand); color: #fff; font-size: 15px; font-weight: 800; box-shadow: 0 12px 22px -12px var(--sx-brand); transition: background .15s, box-shadow .15s, transform .1s;}
html body.dk .cta:hover{background: var(--sx-brand-deep);}
html body.dk .cta:active{transform: translateY(1px); box-shadow: 0 6px 12px -8px var(--sx-brand);}
html body.dk .cta[disabled]{background: var(--sx-surface-3); color: var(--sx-ink-3); box-shadow: none; cursor: not-allowed;}
html body.dk .dk-retbox{background: rgba(18, 144, 90, .07); border: 1px solid rgba(18, 144, 90, .2); border-radius: 12px;}
html body.dk .dk-retbox .ic{background: rgba(18, 144, 90, .14);}
html body.dk .dk-retbox .tx span{color: var(--sx-ink-3);}
html.dk-dark body.dk .dk-retbox{background: rgba(53, 201, 138, .08); border-color: rgba(53, 201, 138, .22);}
html body.dk .pinfo h1{font-size: 19px; font-weight: 800; line-height: 1.85; letter-spacing: -.2px; margin-bottom: 10px;}
html body.dk .subtitle{font-size: 12.5px;}
html body.dk .rating-row{padding-bottom: 18px;}
html body.dk .rating-row .chip{background: var(--sx-surface-2); border-radius: 18px;}
html body.dk .rating-row .chip:hover{background: var(--sx-surface-3);}
html body.dk .color-row{font-size: 13px;}
html body.dk .sw{border-color: var(--sx-line);}
html body.dk .sw.sel{box-shadow: 0 0 0 2px var(--sx-surface), 0 0 0 4px var(--sx-brand);}
html body.dk .sec-h{font-size: 15px; font-weight: 800; margin: 24px 0 12px;}
html body.dk .spec-chip{background: var(--sx-surface-2); border-radius: 14px; padding: 11px 14px 12px;}
html body.dk .spec-chip .v{font-weight: 700;}
html body.dk .all-feats{border-radius: 12px; border-color: var(--sx-line);}
html body.dk .all-feats:hover{border-color: var(--sx-brand); color: var(--sx-brand);}
html body.dk .tabs{gap: 34px; border-bottom-color: var(--sx-line);}
html body.dk .tab{font-size: 14px; font-weight: 600; color: var(--sx-ink-3);}
html body.dk .tab.on{color: var(--sx-ink); font-weight: 800;}
html body.dk .tab.on::after{background: var(--sx-brand); height: 3px; border-radius: 3px;}
html body.dk .spec-row .val{border-bottom-color: var(--sx-line);}
html body.dk .spec-row .lbl{text-align: right; color: var(--sx-ink-3);}
html body.dk .pcell{display: flex; flex-direction: column;}
html body.dk .pcell .p-price{margin-top: auto;}
html body.dk .pcell .p-ti + *{flex-shrink: 0;}
@media (min-width: 900px){html body.dk .search{max-width: none;}
html body.dk .pwrap{width: auto; max-width: 1306px; margin: 22px 30px 50px; grid-template-columns: 310px minmax(0, 1fr); gap: 22px;}
html body.dk .shop-wrap{width: auto; max-width: 1366px; padding: 0 30px; margin: 22px auto 44px;}}
html body.dk .pside,html body.dk .pcontent,html body.dk .shop-card{border: 1px solid var(--sx-line); border-radius: 20px; background: var(--sx-surface);}
html body.dk .shop-card.soft{background: var(--sx-surface-2); border-color: transparent;}
html body.dk .pcontent{padding: 26px 28px 32px;}
html body.dk .shop-card{padding: 22px;}
html body.dk .shop-card h3{font-size: 14.5px; font-weight: 800;}
html body.dk .pside{overflow: hidden;}
html body.dk .ps-head{padding: 24px 24px 6px;}
html body.dk .ps-name{font-size: 15.5px; font-weight: 800;}
html body.dk .ps-menu{margin-top: 10px; padding: 8px; border-top: 1px solid var(--sx-line);}
html body.dk .m-it{height: 48px; padding: 0 14px; border: 0; border-radius: 12px; margin-bottom: 2px; color: var(--sx-ink-2); transition: background .15s, color .15s;}
html body.dk .m-it:hover{background: var(--sx-surface-2); color: var(--sx-ink);}
html body.dk .m-it.on{background: var(--sx-brand-soft); color: var(--sx-brand-ink); font-weight: 700;}
html body.dk .m-it.on::after{display: none;}
html body.dk .m-it:last-child{margin-bottom: 0;}
html body.dk .m-it img{filter: grayscale(1) opacity(.7);}
html body.dk .m-it.on img,html body.dk .m-it:hover img{filter: none;}
html.dk-dark body.dk .m-it img{filter: grayscale(1) invert(1) opacity(.65);}
html.dk-dark body.dk .m-it.on img,html.dk-dark body.dk .m-it:hover img{filter: none;}
html body.dk .m-badge{background: var(--sx-brand); border-radius: 8px;}
html body.dk .pc-t{font-size: 16.5px; font-weight: 800;}
html body.dk .pc-bar{background: var(--sx-brand); width: 44px; height: 4px; border-radius: 3px;}
html body.dk .pc-all,html body.dk .w-lnk,html body.dk .c-foot a,html body.dk .qans .q-tag{color: var(--sx-brand);}
html body.dk .st + .st{border-right-color: var(--sx-line);}
html body.dk .shop-h{font-size: 20px; font-weight: 800;}
html body.dk .shop-h .pc-bar{background: var(--sx-brand);}
html body.dk .shop-sub{color: var(--sx-ink-3);}
html body.dk .fld label{font-size: 12.5px; font-weight: 600; color: var(--sx-ink-2); margin-bottom: 8px;}
html body.dk .fld input,html body.dk .fld select,html body.dk .fld textarea,html body.dk .coupon-row input,html body.dk .qty input{height: 46px; border: 1px solid var(--sx-line); border-radius: 12px; background: var(--sx-surface); color: var(--sx-ink); padding: 0 14px; font-size: 13.5px; transition: border-color .15s, box-shadow .15s, background .15s;}
html body.dk .fld textarea{height: auto; min-height: 96px; padding: 12px 14px; width: 100%; font-family: inherit; line-height: 1.9; resize: vertical;}
html body.dk .fld input:hover,html body.dk .fld select:hover,html body.dk .fld textarea:hover{border-color: var(--sx-ink-3);}
html body.dk .fld input:focus,html body.dk .fld select:focus,html body.dk .fld textarea:focus,html body.dk .coupon-row input:focus{border-color: var(--sx-brand); box-shadow: var(--sx-focus); outline: none; background: var(--sx-surface);}
html body.dk .fld input[disabled]{background: var(--sx-surface-2); color: var(--sx-ink-3);}
html body.dk .fld .hint{color: var(--sx-ink-3);}
html body.dk .fld label b{color: var(--sx-err);}
html body.dk .addr-form{background: var(--sx-surface-2); border-color: var(--sx-line); border-radius: 16px;}
html body.dk .sec-t{border-bottom-color: var(--sx-line); font-size: 14px; font-weight: 800;}
html body.dk .radios input[type=radio],html body.dk .pay-opt input,html body.dk input[type=checkbox]{accent-color: var(--sx-brand);}
html body.dk .btn-main,html body.dk .btn-o.fill{background: var(--sx-brand); color: #fff; border: 0; border-radius: 13px; font-weight: 800; box-shadow: 0 10px 20px -12px var(--sx-brand); transition: background .15s, box-shadow .15s;}
html body.dk .btn-main:hover,html body.dk .btn-o.fill:hover{background: var(--sx-brand-deep); filter: none;}
html body.dk .btn-main[disabled]{background: var(--sx-surface-3); color: var(--sx-ink-3); box-shadow: none; opacity: 1;}
html body.dk .btn-o{border-radius: 12px; border: 1px solid var(--sx-line); color: var(--sx-ink); background: var(--sx-surface); font-weight: 600; transition: border-color .15s, color .15s, background .15s;}
html body.dk .btn-o:hover{border-color: var(--sx-brand); color: var(--sx-brand); background: var(--sx-brand-soft);}
html body.dk .btn-o.gray{background: var(--sx-surface-2); border-color: transparent; color: var(--sx-ink-2);}
html body.dk .coupon-row button{border-radius: 12px; border: 1px solid var(--sx-line); background: var(--sx-surface); color: var(--sx-ink); font-weight: 700;}
html body.dk .coupon-row button:hover{border-color: var(--sx-brand); color: var(--sx-brand);}
html body.dk .qty{border-radius: 12px; border: 1px solid var(--sx-line); overflow: hidden; background: var(--sx-surface);}
html body.dk .qty button{color: var(--sx-brand); font-weight: 700;}
html body.dk .remove-btn{color: var(--sx-ink-3); border-radius: 10px;}
html body.dk .remove-btn:hover{color: var(--sx-err); background: rgba(211, 48, 74, .08);}
html body.dk .cart-row{border-bottom-color: var(--sx-line-2); padding: 18px 0;}
html body.dk .cart-row img.c-im{border-radius: 14px; background: #fff; border: 1px solid var(--sx-line-2);}
html body.dk .cart-name{font-size: 13.5px; font-weight: 700; line-height: 2;}
html body.dk .cart-name:hover{color: var(--sx-brand);}
html body.dk .cart-price{font-weight: 800;}
html body.dk .sumrow{padding: 10px 0; font-size: 13px;}
html body.dk .sumrow.total{border-top: 1px dashed var(--sx-line);}
html body.dk .sumrow.total b{font-size: 18px; color: var(--sx-ink);}
html body.dk .cart-side{gap: 12px;}
html body.dk .pay-opt{border: 1px solid var(--sx-line); border-radius: 14px; background: var(--sx-surface); transition: border-color .15s, background .15s;}
html body.dk .pay-opt:hover{border-color: var(--sx-ink-3);}
html body.dk .pay-opt.sel{border-color: var(--sx-brand); background: var(--sx-brand-soft);}
html body.dk .ocard,html body.dk .acard,html body.dk .stat,html body.dk .dk-stat,html body.dk .dk-promo,html body.dk .lchip,html body.dk .citem{border-color: var(--sx-line); border-radius: 16px; background: var(--sx-surface);}
html body.dk .ocard:hover,html body.dk .acard:hover{border-color: var(--sx-line); box-shadow: var(--sx-sh-2);}
html body.dk .oc-name:hover{color: var(--sx-brand);}
html body.dk .dk-promo{background: var(--sx-surface-2);}
html body.dk .dk-promo:hover{background: var(--sx-brand-soft);}
html body.dk .lchip.on{background: var(--sx-brand-soft); border-color: var(--sx-brand); color: var(--sx-brand-ink);}
html body.dk .chip{border-radius: 8px; font-weight: 600;}
html body.dk .chip.ok{background: rgba(18, 144, 90, .12); color: var(--sx-ok);}
html body.dk .chip.wait{background: rgba(201, 131, 10, .13); color: var(--sx-warn);}
html body.dk .chip.blue{background: var(--sx-brand-soft); color: var(--sx-brand-ink);}
html body.dk .ptabs{border-bottom-color: var(--sx-line);}
html body.dk .ptab{font-weight: 600; color: var(--sx-ink-3);}
html body.dk .ptab.on{color: var(--sx-ink); border-bottom-color: var(--sx-brand); font-weight: 800;}
html body.dk .ptab.on .cnt{background: var(--sx-brand);}
html body.dk .shop-tbl th{background: var(--sx-surface-2); color: var(--sx-ink-2); font-weight: 700;}
html body.dk .shop-tbl td{border-bottom-color: var(--sx-line-2);}
html body.dk .dk-alert{border-radius: 14px; font-weight: 500;}
html body.dk .dk-alert.ok{background: rgba(18, 144, 90, .1); color: var(--sx-ok);}
html body.dk .dk-alert.err{background: rgba(211, 48, 74, .09); color: var(--sx-err);}
html body.dk .dk-alert.info{background: var(--sx-brand-soft); color: var(--sx-brand-ink);}
html body.dk .empty .e-ring,html body.dk .dk-empty-state i{color: var(--sx-ink-3);}
html body.dk .dk-modal-box{border-radius: 22px; background: var(--sx-surface);}
html body.dk .gcard{border-radius: 18px;}
html body.dk .gcard.sel{box-shadow: 0 0 0 3px var(--sx-surface), 0 0 0 5px var(--sx-brand);}
html.dk-dark body.dk .fld input[disabled]{background: var(--sx-surface-2);}
html body.dk footer .dk-social a,html body.dk footer .ft-col .dk-social a,html body.dk footer .m-soc-row .dk-social a{background: rgba(255, 255, 255, .09); color: var(--sx-f1);}
html body.dk footer .dk-social a i{color: inherit;}
html body.dk footer .dk-social a:hover{background: var(--sx-brand); color: #fff;}
@media (max-width: 899px){html body.dk .m-sup-tx,html body.dk .m-dl-tx,html body.dk .m-soc-tx{color: var(--sx-f1);}
html body.dk .m-sup-ic{background: rgba(255, 255, 255, .1);}
html body.dk .m-sup-ic svg,html body.dk .m-sup-ic svg *{stroke: var(--sx-f1);}
html body.dk .m-sup-ic svg rect{fill: var(--sx-f1);}
html body.dk .m-accs{border-top-color: rgba(255, 255, 255, .1);}
html body.dk .m-acc{border-bottom-color: rgba(255, 255, 255, .1);}
html body.dk .m-acc-h{color: var(--sx-f1); font-weight: 700;}
html body.dk .m-acc-h svg,html body.dk .m-acc-h svg *{stroke: var(--sx-f2);}
html body.dk .m-acc-b a{color: var(--sx-f3);}
html body.dk .about{margin: 22px 16px 0; padding-top: 22px;}
html body.dk .m-dl svg circle{fill: var(--sx-brand);}
html body.dk .back-top{margin: 0 auto;}
html body.dk .toolbar{height: auto; min-height: 52px; padding: 0 10px; margin: 0 12px 12px; border-radius: 14px;}
html body.dk .lmain{padding-top: 6px;}
html body.dk .pgrid{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 12px;}
html body.dk .pcell,html body.dk .pcell:nth-child(3n),html body.dk .pcell:nth-last-child(-n+3){padding: 10px 10px 12px; border-radius: 16px; min-width: 0;}
html body.dk .p-img{height: 150px; padding: 4px;}
html body.dk .p-ti{font-size: 12px; height: 48px; line-height: 2; margin-top: 10px;}
html body.dk .p-price{flex-wrap: wrap; gap: 4px;}
html body.dk .pr-l{margin-right: auto; max-width: 100%;}
html body.dk .pr-num{font-size: 14.5px;}
html body.dk .p-dots{display: none;}
html body.dk .p-head{min-height: 0;}
html body.dk .pmain{padding: 16px 14px 18px; border-radius: 20px; gap: 18px; margin: 8px 12px 0;}
html body.dk .buy-col{position: static;}
html body.dk .pinfo h1{font-size: 16px; line-height: 1.9;}
html body.dk .price-row .num{font-size: 22px;}
html body.dk .cta{height: 50px;}
html body.dk .tabs{gap: 22px; overflow-x: auto;}
html body.dk .shop-wrap{padding: 0 12px;}
html body.dk .shop-h{font-size: 18px;}
html body.dk .pcontent,html body.dk .shop-card{border-radius: 18px; padding: 16px;}
html body.dk .pwrap{margin: 12px 12px 30px;}}
html.dk-dark body.dk .m-hdr .m-slogo,html.dk-dark body.dk .m-slogo{background: var(--sx-brand);}