:root{--navy:#0b2545;--ink:#1b2430;--muted:#6b7684;--line:#e6e9ee;--acc:#0aa3a3;--bg:#fff;--soft:#f6f8fa}
*{box-sizing:border-box}body{margin:0;font:16px/1.55 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg)}
a{color:inherit;text-decoration:none}a:hover{color:var(--acc)}.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.topbar{background:var(--navy);color:#cfe0f2;font-size:13px;text-align:center;padding:7px}
.hdr{border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:5}.hrow{display:flex;gap:16px;align-items:center;padding:14px 20px;flex-wrap:wrap}
.logo{font-weight:800;font-size:22px;color:var(--navy);letter-spacing:-.5px}.logo span{color:var(--acc)}
.search{flex:1;display:flex;min-width:240px}.search input{flex:1;padding:11px 14px;border:1px solid var(--line);border-radius:8px 0 0 8px;font-size:15px}.search button,.btn{background:var(--navy);color:#fff;border:0;padding:11px 18px;border-radius:0 8px 8px 0;font-weight:600;cursor:pointer}
.btn{border-radius:8px;display:inline-block}.cartlink{font-weight:600}.cartlink b{background:var(--acc);color:#fff;border-radius:99px;padding:1px 8px;font-size:13px}
.nav{display:flex;gap:22px;overflow-x:auto;font-size:14px;color:var(--muted);padding-bottom:10px;white-space:nowrap}
.hero{text-align:center;padding:64px 0 40px}.hero h1{font-size:clamp(30px,5vw,48px);color:var(--navy);letter-spacing:-1px;margin:0}.hero p{color:var(--muted)}
.search.big{max-width:640px;margin:24px auto}.search.big input{padding:16px;font-size:17px}.trust{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;color:var(--muted);font-size:14px}
h2{color:var(--navy);margin:48px 0 16px;font-size:22px}.muted,.small{color:var(--muted)}
.sys,.brands{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.sys a,.brands a{border:1px solid var(--line);border-radius:10px;padding:16px;display:flex;flex-direction:column}.sys a:hover,.brands a:hover{border-color:var(--acc)}
.sys small,.brands small{color:var(--muted)}.more{color:var(--acc);font-weight:600}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}.card{border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}.card:hover{box-shadow:0 6px 20px #0b25451a}
.card .img{aspect-ratio:1;background:#fff;display:flex;padding:12px}.card img{width:100%;object-fit:contain}.cb{padding:12px 14px;border-top:1px solid var(--line);flex:1;display:flex;flex-direction:column}
.brand{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--acc);font-weight:700}.t{font-size:14px;font-weight:500;margin:4px 0}.mpn{font-size:12px;color:var(--muted)}
.pr{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:8px}.ok{color:#11845b;font-size:12px;font-weight:600}.no{color:#b45309;font-size:12px;font-weight:600}
.crumbs{font-size:13px;color:var(--muted);padding:16px 0}.chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 24px}.chips a{border:1px solid var(--line);border-radius:99px;padding:6px 14px;font-size:14px}.chips small{color:var(--muted)}
.who{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;margin:56px 0;padding:32px;background:var(--soft);border-radius:12px}.who p{color:var(--muted);margin:4px 0 0;font-size:14px}
.pdp{display:grid;grid-template-columns:1fr;gap:32px}@media(min-width:860px){.pdp{grid-template-columns:1.1fr 1fr}}.pimg img{width:100%;height:auto;border:1px solid var(--line);border-radius:12px}
.pinfo h1{font-size:26px;color:var(--navy);margin:6px 0 12px;line-height:1.25}.ids{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;font-size:14px}.ids dt{color:var(--muted)}.ids dd{margin:0;font-family:ui-monospace,monospace}
.price{font-size:32px;font-weight:700;margin:16px 0 4px}.price s{font-size:16px;color:var(--muted);font-weight:400}.big{font-size:14px}
.buy{display:flex;gap:10px;margin:16px 0}.buy input{width:70px;padding:10px;border:1px solid var(--line);border-radius:8px}.buy .btn{flex:1;padding:14px;font-size:16px}
.perks{color:var(--muted);font-size:14px;padding-left:18px}.desc{max-width:780px}.desc img{max-width:24px;vertical-align:middle}.spec{border-collapse:collapse;max-width:780px;width:100%}.spec th,.spec td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);font-size:14px}.spec th{color:var(--muted);font-weight:500;width:40%}
.li{display:grid;grid-template-columns:56px 1fr 70px 90px;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:10px 0}.li img{width:56px}.li input{width:60px;padding:6px}.tot{font-size:18px;text-align:right}
.testmode{background:#fff7e6;border:1px solid #f5c26b;color:#8a5300;padding:10px 14px;border-radius:8px;margin-top:16px;font-weight:600}
.co{display:grid;gap:32px}@media(min-width:860px){.co{grid-template-columns:1.3fr 1fr}}.co label{display:block;font-size:14px;margin:10px 0;color:var(--muted);flex:1}.co input{display:block;width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;margin-top:4px}.row{display:flex;gap:10px}.stripebox{border:1px dashed var(--acc);border-radius:8px;padding:18px;margin:16px 0;color:var(--muted)}
.ftr{margin-top:72px;background:var(--navy);color:#cfe0f2;padding:40px 0 20px}.ftr .logo{color:#fff}.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px}.fgrid a{display:block;font-size:14px;margin:4px 0}.pager{text-align:center;margin:32px}
.plp{display:grid;grid-template-columns:250px 1fr;gap:28px;align-items:start}.results{min-width:0}
.filters{position:sticky;top:120px;max-height:calc(100vh - 140px);overflow:auto;font-size:14px;padding-right:6px}
.fhead{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px solid var(--line)}.clear{color:var(--acc);font-size:13px}.fclose{display:none;cursor:pointer;font-size:20px}
.filters details{border-bottom:1px solid var(--line);padding:10px 0}.filters summary{font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between}.filters summary::after{content:"–";color:var(--muted)}.filters details:not([open]) summary::after{content:"+"}
.opt{display:flex;align-items:center;gap:9px;padding:5px 0}.opt small{margin-left:auto;color:var(--muted)}.opt.dim{opacity:.45}
.box{width:16px;height:16px;border:1.5px solid #b8c0cb;border-radius:4px;flex:none}.box.r{border-radius:50%}.opt.on .box{background:var(--acc);border-color:var(--acc);box-shadow:inset 0 0 0 3px #fff}.opt.on{font-weight:600}
.blist{max-height:300px;overflow:auto}.prange{display:flex;gap:6px;align-items:center;margin-top:8px}.prange input{width:72px;padding:7px;border:1px solid var(--line);border-radius:6px}.prange button{border:0;background:var(--navy);color:#fff;border-radius:6px;padding:7px 10px;cursor:pointer}
.rbar{display:flex;align-items:center;gap:12px;margin-bottom:14px}.rbar p{margin:0;flex:1}.sortf select{padding:8px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:14px;background:#fff}.sortf label{font-size:14px;color:var(--muted)}
.fbtn{display:none;border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-weight:600;cursor:pointer;font-size:14px}.fbtn b{color:var(--acc)}
.active{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.active a{background:var(--soft);border:1px solid var(--line);border-radius:99px;padding:4px 12px;font-size:13px}
.scrim{display:none}.pager a{margin:0 12px;font-weight:600}
@media(max-width:860px){.plp{grid-template-columns:1fr}.fbtn{display:inline-block}.rbar{flex-wrap:wrap}.rbar p{flex-basis:100%}
 .filters{position:fixed;top:0;left:0;bottom:0;width:86%;max-width:340px;max-height:none;background:#fff;z-index:30;padding:18px;transform:translateX(-105%);transition:transform .2s;box-shadow:4px 0 24px #0003}
 .fclose{display:block}.fdt:checked~.filters{transform:none}.fdt:checked~.scrim{display:block;position:fixed;inset:0;background:#0006;z-index:20}}
.intro{color:var(--muted);max-width:820px;margin:4px 0 18px}.uniq{background:var(--soft);border-radius:10px;padding:14px 16px}
.post{max-width:760px}.post h1{font-size:clamp(28px,4vw,38px);color:var(--navy);line-height:1.2;letter-spacing:-.5px}.post h2{margin-top:36px}.post table{margin:12px 0}.post li{margin:4px 0}
.byline{color:var(--muted);font-size:14px}.callout{background:#e8f6f6;border-left:4px solid var(--acc);padding:12px 16px;border-radius:6px}.callout a,.post p a,.post li a{color:var(--acc);font-weight:600}
.plinks{list-style:none;padding:0;display:grid;gap:8px}.plinks li a{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:8px;padding:10px 14px;color:var(--ink);font-weight:500}.plinks li a:hover{border-color:var(--acc)}.plinks b{color:var(--navy);white-space:nowrap}
.pcard{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}.pcard a{border:1px solid var(--line);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:8px}.pcard a:hover{border-color:var(--acc)}.pcard h2{margin:0;font-size:19px}.pcard p{margin:0;color:var(--muted);font-size:14px}
.faq details{border-bottom:1px solid var(--line);padding:12px 0}.faq summary{font-weight:600;cursor:pointer}
.ph{background:#fff6d6;border:1px dashed #d4a300;padding:2px 6px;border-radius:4px;font-size:.92em}
.form label{display:block;margin:12px 0;font-size:14px;color:var(--muted)}.form input,.form textarea,.form select{display:block;width:100%;padding:10px;border:1px solid var(--line);border-radius:8px;font:inherit;margin-top:4px}
.btn.ghost{background:transparent;border:1px solid #fff6;margin-top:8px}
.badge{display:inline-block;background:#e8f6f6;color:var(--navy);font-weight:600;padding:4px 10px;border-radius:999px;font-size:14px}.shipnote{margin:10px 0}
.topbar a{color:inherit}

.li{grid-template-columns:56px 1fr 64px 96px 32px}.li b{text-align:right}.rm{border:1px solid var(--line);background:#fff;border-radius:6px;cursor:pointer;height:30px;color:var(--muted)}.rm:hover{color:#b42318;border-color:#b42318}.ship{text-align:right;margin:4px 0}.ship.ok{font-size:14px}[hidden]{display:none!important}
@media(max-width:600px){.li{grid-template-columns:48px 1fr 56px 32px}.li>b{grid-column:2/4;grid-row:2}.li img{width:48px}.hrow{flex-wrap:wrap}.search{min-width:0;flex-basis:100%;order:3}}

/* 2026-10-24 customer-test fixes */
.card .img{position:relative}.bo-badge{position:absolute;top:8px;left:8px;background:#fff4e5;color:#9a4a06;border:1px solid #f5c98b;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.3px}
.pinfo .bo{background:#fff8ef;border:1px solid #f5d7ad;border-radius:8px;padding:10px 12px;font-weight:500;color:#7a3e05;font-size:15px}
.opt.tgl{padding:8px 10px;border:1px solid var(--line);border-radius:8px;margin:4px 0}.opt.tgl.on{border-color:var(--acc);background:#e8f6f6}
.sw{width:34px;height:20px;border-radius:999px;background:#c5ccd6;position:relative;flex:none;transition:background .15s}.sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0003;transition:left .15s}
.opt.tgl.on .sw{background:var(--acc)}.opt.tgl.on .sw::after{left:16px}
.brands a b{color:var(--ink);font-size:15px}.brands small.bn{display:block;margin-top:4px;font-size:12px;color:var(--muted)}
.navwrap{position:relative}.navhint{display:none}
.navwrap.more::after{content:"";position:absolute;right:0;top:0;bottom:10px;width:56px;background:linear-gradient(90deg,#fff0,#fff 70%);pointer-events:none}
.navwrap.more .navhint{display:block;position:absolute;right:8px;top:-2px;font-size:22px;color:var(--navy);z-index:1;pointer-events:none}
.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,140%);background:var(--navy);color:#fff;border-radius:12px;padding:12px 14px;display:flex;gap:12px;align-items:center;box-shadow:0 10px 30px #0006;z-index:100;max-width:min(520px,calc(100vw - 24px));transition:transform .25s;opacity:0}
.toast.show{transform:translate(-50%,0);opacity:1}.toast span{display:flex;flex-direction:column;font-weight:700;min-width:0}.toast small{font-weight:400;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.toast .btn{background:var(--acc);border-radius:8px;padding:9px 14px;white-space:nowrap}.toast .tx{background:none;border:0;color:#fff;font-size:16px;cursor:pointer}
.mbar{display:none}
@media(max-width:699px){.pdp{display:flex;flex-direction:column}.pimg{max-height:240px;display:flex;justify-content:center}.pimg img{max-height:240px;width:auto;object-fit:contain}
.pinfo{display:flex;flex-direction:column}.pinfo .brand{order:0}.pinfo h1{order:1;font-size:21px}.pinfo .price{order:2}.pinfo .big{order:3}.pinfo .buy{order:4}.pinfo #atcmsg{order:5}.pinfo .shipnote{order:6}.pinfo .ids{order:7}.pinfo .perks{order:8}
.mbar{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;z-index:90;transform:translateY(110%);transition:transform .2s;box-shadow:0 -4px 16px #0b25451a}
.mbar.show{transform:none}.mbar div{display:flex;flex-direction:column}.mbar b{font-size:18px;color:var(--navy)}.mbar .btn{border-radius:8px}
.toast{bottom:84px}}
/* v5 motion: transform/opacity only (no layout shift); disabled under prefers-reduced-motion */
:root{--ease:cubic-bezier(.2,.7,.2,1)}
.card{transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}.card .img{overflow:hidden}.card img{transition:transform .4s var(--ease)}
@media(hover:hover){.card:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0b25451f;border-color:#d5dbe3}.card:hover img{transform:scale(1.03)}}
.btn,.search button{transition:background-color .2s,transform .15s var(--ease),box-shadow .2s}
@media(hover:hover){.btn:hover,.search button:hover{background:#13365f;color:#fff;box-shadow:0 4px 12px #0b254533;transform:translateY(-1px)}.btn.ghost:hover{background:transparent}}
.btn:active,.search button:active{transform:translateY(0) scale(.97);box-shadow:none}
.btn:focus-visible,.search button:focus-visible,.card:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.sys a,.brands a{position:relative;overflow:hidden;transition:border-color .2s,transform .2s var(--ease),box-shadow .2s}
.sys a::before,.brands a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--acc);transform:scaleY(0);transform-origin:bottom;transition:transform .25s var(--ease)}
@media(hover:hover){.sys a:hover,.brands a:hover{transform:translateY(-2px);box-shadow:0 6px 16px #0b25451a}.sys a:hover::before,.brands a:hover::before{transform:scaleY(1)}}
.sys a:focus-visible::before,.brands a:focus-visible::before{transform:scaleY(1)}
.nav a{position:relative;transition:color .2s}.nav a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:var(--acc);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.nav a:hover::after,.nav a:focus-visible::after{transform:scaleX(1)}.nav a:hover{color:var(--navy)}
@keyframes ccpop{0%{transform:scale(1)}50%{transform:scale(1.2)}100%{transform:scale(1)}}.cartlink b{display:inline-block}.cartlink b.pop{animation:ccpop .45s var(--ease)}
.js-rv .card.rv,.js-rv .sys a.rv,.js-rv .brands a.rv{transition:opacity .5s var(--ease),transform .25s var(--ease),box-shadow .25s,border-color .2s}
.js-rv .rv{opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease)}.js-rv .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
.card:hover,.card:hover img,.sys a:hover,.brands a:hover,.btn:hover,.btn:active{transform:none!important}.js-rv .rv{opacity:1;transform:none}}
/* v5 trust signals */
.tstrip{background:var(--soft);border-bottom:1px solid var(--line);font-size:13px;color:var(--ink)}.tstrip ul{list-style:none;margin:0 auto;display:flex;justify-content:center;gap:8px 28px;flex-wrap:wrap;padding:8px 20px}
.tstrip a{display:flex;align-items:center;gap:7px;transition:color .2s}.tstrip small{color:var(--muted)}
.ti{width:17px;height:17px;flex:none;fill:none;stroke:var(--acc);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
@media(max-width:700px){.tstrip ul{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none;gap:20px}.tstrip ul::-webkit-scrollbar{display:none}.tstrip li{white-space:nowrap}.tstrip small{display:none}}
.assure{border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-size:14px;margin:4px 0 12px;background:var(--soft)}.assure p{margin:4px 0}.assure a{color:var(--acc)}
.fnote a{text-decoration:underline}
/* v5 logo badge */
.logo{display:inline-flex;align-items:center;gap:10px}.lmark{width:40px;height:40px;border-radius:50%;flex:none;box-shadow:0 0 0 1px #0b25451f}.ftr .lmark{box-shadow:0 0 0 1px #ffffff26}
@media(max-width:480px){.lmark{width:36px;height:36px}}
.logo .lw{color:inherit;white-space:nowrap}.logo .lw span{color:var(--acc)}
