/* One first-paint geometry and font across customer routes, before store.js runs. */
html body #fincan-store#fincan-store[data-route]{
  --font:"Stilo Product Inter",Arial,sans-serif!important;
  --moka-font:"Stilo Product Inter",Arial,sans-serif!important;
  font-family:var(--font)!important;
}
html body #fincan-store#fincan-store[data-route] :where(button,input,select,textarea,p,h1,h2,h3,h4,a,span,div,label,li,dt,dd){
  font-family:"Stilo Product Inter",Arial,sans-serif!important;
}
html body #fincan-store#fincan-store[data-route] #sf-footer{--sf-font:"Stilo Product Inter",Arial,sans-serif!important}
html body #fincan-store#fincan-store[data-route] .store-header:not(.legacy-only){
  position:sticky!important;top:0!important;z-index:60!important;
  display:flex!important;align-items:center!important;gap:4px!important;padding:8px 16px!important;
  height:64px!important;min-height:64px!important;max-height:64px!important;
  transition:none!important;animation:none!important;
}
/* These focused routes own their back/logo/lock masthead; do not add a second one. */
html body #fincan-store#fincan-store[data-route]:is([data-route=payment],[data-route=notify]) .store-header{display:none!important}
html body #fincan-store#fincan-store[data-route] .store-header .brand-lockup{
  position:absolute!important;left:50%!important;top:50%!important;
  transform:translate(-50%,-50%)!important;margin:0!important;
  width:min(156px,calc(100vw - 192px))!important;max-width:156px!important;min-width:0!important;
  transition:none!important;animation:none!important;
}
html body #fincan-store#fincan-store[data-route] .store-header .brand{
  width:100%!important;min-height:34px!important;
}
html body #fincan-store#fincan-store[data-route] .store-header .brand-sheen{
  position:relative!important;width:100%!important;height:34px!important;
  transition:none!important;animation:none!important;
}
html body #fincan-store#fincan-store[data-route] .store-header .brand-logo{
  position:absolute!important;left:50%!important;top:50%!important;
  transform:translate(-50%,-50%)!important;width:min(156px,100%)!important;
  height:auto!important;max-width:100%!important;max-height:34px!important;
  aspect-ratio:760/166;object-fit:contain!important;
  transition:none!important;animation:none!important;
}
html body #fincan-store#fincan-store[data-route] .store-header .hd-btn{flex:0 0 36px!important;width:36px!important;height:36px!important;margin:0!important;padding:0!important}
html body #fincan-store#fincan-store[data-route] .store-header .hd-btn[data-action="focus-search"]{margin-right:auto!important}
html body #fincan-store#fincan-store[data-route] .store-header .hd-btn[data-route="orders"]{margin-left:auto!important}
/* A real opaque surface: readable over every product photograph. */
html body #fincan-store#fincan-store[data-route] .moka-card__people{
  background:#fff!important;color:#111!important;border:1px solid #dedede!important;
  opacity:1!important;text-shadow:none!important;backdrop-filter:none!important;
  box-shadow:0 1px 3px #0000000d!important;
  font-size:10.5px!important;font-weight:700!important;line-height:1.2!important;
  min-height:22px!important;padding:4px 8px!important;border-radius:7px!important;
}
html body #fincan-store#fincan-store[data-route] .moka-card__people svg{color:#111!important;stroke:currentColor!important}
/* Remove entry scaling, not the owner's intentional checkout-action attention cue. */
html body #fincan-store#fincan-store[data-route] :is(.store-content,.product-grid,.moka-card){
  animation:none!important;transform:none!important;
}
@media(min-width:768px){
  html body #fincan-store#fincan-store[data-route] .store-header .brand-lockup{width:180px!important;max-width:180px!important}
  html body #fincan-store#fincan-store[data-route] .store-header .brand-logo{width:180px!important;max-height:37px!important}
}
